com web/php: JS-13812 Develop markup for PHP 8 announcement on php.net: php8.php styles/php8.css
| From: | Sara Golemon | Date: | Wed, 25 Nov 2020 20:28:13 +0000 |
| Subject: | com web/php: JS-13812 Develop markup for PHP 8 announcement on php.net: php8.php styles/php8.css | ||
| Groups: | php.webmaster | ||
| Request: | Send a blank email to php-webmaster+get-28896@lists.php.net to get a copy of this message | ||
Commit: 2efee112c23f570e1a96c213a05304ea4c17950b
Author: Ruslan <naruzl@yandex.ru> Fri, 6 Nov 2020 13:27:18 +0300
Committer: Sara Golemon <pollita@php.net> Wed, 25 Nov 2020 20:28:13 +0000
Parents: 78a91db65b91a9bfa69d6d7f0ecdd22db3fe683b
Branches: master
Link: http://git.php.net/?p=web/php.git;a=commitdiff;h=2efee112c23f570e1a96c213a05304ea4c17950b
Log:
JS-13812 Develop markup for PHP 8 announcement on php.net
Changed paths:
M php8.php
M styles/php8.css
diff --git a/php8.php b/php8.php index 1eddede0d..0c9f58f00 100644 --- a/php8.php +++ b/php8.php @@ -6,31 +6,33 @@ site_header("php 8", array("current" => "php8")); ?> <link rel="stylesheet" href="/styles/php8.css"> <div class="php8"> - <div class="php8__section php8__section_dark php8__section_header center"> - <div class="php8__logo"> - <img src="/images/logos/logo_php8.svg" alt="" height="126" width="343"> - </div> - <div class="php8__title"> - <span class="php8__title-text">released!</span> - <img class="php8__title-img" src="/images/party-popper.png" srcset="/images/party-popper@2x.png 2x, /images/party-popper@2x.png 3x" alt="" width="58" height="58"> - </div> - <div class="php8__subtitle"> - PHP 8.0 is a major update of the PHP language. It contains many new features and optimizations. Including named - arguments, union types, attributes, constructor property promotion, match expression, nullsafe operator, JIT, and - improvements in type system, error handling, and consistency. + <div class="php8-section php8-section_dark php8-section_header center"> + <div class="php8-section__inner"> + <div class="php8-logo"> + <img src="/images/logos/logo_php8.svg" alt="" height="126" width="343"> + </div> + <div class="php8-title"> + <span class="php8-title__text">released!</span> + <img class="php8-title__img" src="/images/party-popper.png" srcset="/images/party-popper@2x.png 2x, /images/party-popper@2x.png 3x" alt="" width="58" height="58"> + </div> + <div class="php8-subtitle"> + PHP 8.0 is a major update of the PHP language. It contains many new features and optimizations. Including named + arguments, union types, attributes, constructor property promotion, match expression, nullsafe operator, JIT, and + improvements in type system, error handling, and consistency. + </div> </div> </div> - <div class="php8__section center"> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-section center"> + <div class="php8-compare"> + <h2 class="php8-h2"> Named arguments - <a class="php8__rfc" href="https://wiki.php.net/rfc/named_params">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/named_params">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> <span class="default">htmlspecialchars</span>(<span class="default">$string</span>, <span class="default">ENT_COMPAT | ENT_HTML401</span>, <span class="string">'UTF-8'</span>, @@ -38,10 +40,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> <span class="methodname"><strong>htmlspecialchars</strong></span>(<span class="parameter">$string</span>, double_encode: <span class="initializer">false</span>); @@ -51,15 +53,15 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Attributes - <a class="php8__rfc" href="https://wiki.php.net/rfc/attributes_v2">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/attributes_v2">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> <span class="comment">/**</span><br> <span class="comment">* @Route("/api/posts/{id}", methods={"GET", "HEAD"})</span><br> @@ -69,10 +71,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> #[Route(<span class="string">"/api/posts/{id}"</span>, methods: [<span class="string">"GET"</span>, <span class="string">"HEAD"</span>])]<br> @@ -84,15 +86,15 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Constructor property promotion - <a class="php8__rfc" href="https://wiki.php.net/rfc/constructor_promotion">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/constructor_promotion">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> <span class="keyword">class</span> Point {<br> <span class="keyword">public</span> <span class="keyword">float</span> $x;<br> @@ -112,10 +114,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> <span class="keyword">class</span> Point {<br> <span class="keyword">public</span> <span class="keyword">function</span> __construct(<br> @@ -130,15 +132,15 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Union types - <a class="php8__rfc" href="https://wiki.php.net/rfc/union_types_v2">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/union_types_v2">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> <span class="keyword">class</span> Number {<br> <span class="comment">/** @var int|float */</span><br> @@ -156,10 +158,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> <span class="keyword">class</span> Number {<br> <span class="keyword">public</span> function __construct(<br> @@ -174,15 +176,15 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Match expression - <a class="php8__rfc" href="https://wiki.php.net/rfc/match_expression_v2">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/match_expression_v2">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> <span class="keyword">switch</span> (8.0) {<br> <span class="keyword">case</span> <span class="string">'8.0'</span>:<br> @@ -197,10 +199,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> <span class="keyword">echo</span> match (8.0) {<br> <span class="string">'8.0'</span> => <span class="string">"Oh no!"</span>,<br> @@ -213,15 +215,15 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Nullsafe operator - <a class="php8__rfc" href="https://wiki.php.net/rfc/nullsafe_operator">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/nullsafe_operator">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> $country = <span class="keyword">null</span>;<br> <br> @@ -239,10 +241,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> $country = $session?->user?->getAddress()?->country; </code> @@ -251,24 +253,24 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Saner string to number comparisons - <a class="php8__rfc" href="https://wiki.php.net/rfc/string_to_number_comparison">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/string_to_number_comparison">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> 0 == <span class="string">'foobar'</span> <span class="comment">// true</span> </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> 0 == <span class="string">'foobar'</span> <span class="comment">// false</span> </code> @@ -277,15 +279,15 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Consistent type errors for internal functions - <a class="php8__rfc" href="https://wiki.php.net/rfc/consistent_type_errors">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/consistent_type_errors">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> strlen([]); <span class="comment">// Warning: strlen() expects parameter 1 to be string, array given</span><br> <br> @@ -293,10 +295,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> strlen([]); <span class="comment">// TypeError: strlen(): Argument #1 ($str) must be of type string, array given</span><br> <br> @@ -308,10 +310,10 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__section php8__section_light"> - <h2 class="php8__h2">Other syntax tweaks and improvements</h2> - <div class="php8__columns"> - <div class="php8__column"> + <div class="php8-section php8-section_light"> + <h2 class="php8-h2">Other syntax tweaks and improvements</h2> + <div class="php8-columns"> + <div class="php8-column"> <ul> <li> Allow trailing comma in parameter list <a href="https://wiki.php.net/rfc/trailing_comma_in_parameter_list">RFC</a> @@ -325,7 +327,7 @@ site_header("php 8", array("current" => "php8")); </li> </ul> </div> - <div class="php8__column"> + <div class="php8-column"> <ul> <li> Treat namespaced names as single token <a href="https://wiki.php.net/rfc/namespaced_names_as_token">RFC</a> @@ -339,9 +341,9 @@ site_header("php 8", array("current" => "php8")); </ul> </div> </div> - <div class="php8__columns"> - <div class="php8__column"> - <h2 class="php8__h2 php8__h2_margin-top">Type system and error handling improvements</h2> + <div class="php8-columns"> + <div class="php8-column"> + <h2 class="php8-h2 php8-h2_margin-top">Type system and error handling improvements</h2> <ul> <li> Saner string to number comparisons <a href="https://wiki.php.net/rfc/string_to_number_comparison">RFC</a> @@ -384,8 +386,8 @@ site_header("php 8", array("current" => "php8")); </li> </ul> </div> - <div class="php8__column"> - <h2 class="php8__h2 php8__h2_margin-top">New Classes, Interfaces, and Functions</h2> + <div class="php8-column"> + <h2 class="php8-h2 php8-h2_margin-top">New Classes, Interfaces, and Functions</h2> <ul> <li> <a href="https://wiki.php.net/rfc/weak_maps">Weak Map</a> class @@ -415,25 +417,27 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__section php8__section_dark php8__section_footer center"> - <h2 class="php8__h2"> - Get free performance improvement.<br class="display-none-lg display-block-md"> - Get better syntax.<br class="display-block-lg display-none-md display-block-sm"> - Get more strictness. - </h2> - <div class="php8__button-wrapper"> - <a class="php8__button php8__button_light" href="#">Go update to PHP 8!</a> - </div> - <div class="php8__footer-content"> - <p> - For source downloads of PHP 8 please visit our <a href="http://www.php.net/downloads">downloads</a> page. - Windows binaries can be found on the <a href="http://windows.php.net/download">PHP for Windows</a> site. - The list of changes is recorded in the <a href="http://www.php.net/ChangeLog-8.php">ChangeLog</a>. - </p> - <p> - The <a href="http://php.net/manual/en/migration8.php">migration guide</a> is available in the PHP Manual. Please - consult it for the detailed list of new features and backward-incompatible changes. - </p> + <div class="php8-section php8-section_dark php8-section_footer php8-footer center"> + <div class="php8-section__inner"> + <h2 class="php8-h2"> + Get free performance improvement.<br class="display-none-lg display-block-md"> + Get better syntax.<br class="display-block-lg display-none-md display-block-sm"> + Get more strictness. + </h2> + <div class="php8-button-wrapper"> + <a class="php8-button php8-button_light" href="#">Go update to PHP 8!</a> + </div> + <div class="php8-footer__content"> + <p> + For source downloads of PHP 8 please visit our <a href="http://www.php.net/downloads">downloads</a> page. + Windows binaries can be found on the <a href="http://windows.php.net/download">PHP for Windows</a> site. + The list of changes is recorded in the <a href="http://www.php.net/ChangeLog-8.php">ChangeLog</a>. + </p> + <p> + The <a href="http://php.net/manual/en/migration8.php">migration guide</a> is available in the PHP Manual. Please + consult it for the detailed list of new features and backward-incompatible changes. + </p> + </div> </div> </div> </div> diff --git a/styles/php8.css b/styles/php8.css index 557822b66..fa1a35287 100644 --- a/styles/php8.css +++ b/styles/php8.css @@ -13,53 +13,50 @@ vertical-align: middle; } -.php8__section { +.php8-section { padding: 96px 1.5rem; margin: 0 -1.5rem; } -.php8__section_dark { - padding-left: calc((100% - (810px - 3rem))/2); - padding-right: calc((100% - (810px - 3rem))/2); +.php8-section_dark { background-color: #4F5B93; color: #fff; } -.php8__section_dark * { - color: #fff; +.php8-section__inner { + width: 810px; + max-width: 100%; + margin: 0 auto; } -.php8__section_light { - background-color: #fff; +.php8-section_dark * { + color: #fff; } -@media (max-width: 920px) { - .php8__section { - padding-left: 1.5rem; - padding-right: 1.5rem; - } +.php8-section_light { + background-color: #fff; } -.php8__section_header { +.php8-section_header { padding-top: 64px; margin-top: -1.5rem; font-family: Helvetica, Arial, sans-serif; } -.php8__section_footer { +.php8-section_footer { margin-bottom: -1.5rem; font-family: Helvetica, Arial, sans-serif; } -.php8__logo { +.php8-logo { vertical-align: middle; } -.php8__logo img { +.php8-logo img { max-width: 90%; } -.php8__title { +.php8-title { margin-top: 16px; font-size: 60px; font-weight: 900; @@ -70,23 +67,23 @@ } @media (max-width: 480px) { - .php8__title { + .php8-title { font-size: 50px; } } -.php8__title-text { +.php8-title__text { vertical-align: middle; } -.php8__title-img { +.php8-title__img { width: 0.9666666666667em; height: 0.9666666666667em; margin-left: 2px; vertical-align: middle; } -.php8__subtitle { +.php8-subtitle { margin-top: 48px; font-size: 28px; font-weight: 300; @@ -98,12 +95,12 @@ } @media (max-width: 480px) { - .php8__subtitle { + .php8-subtitle { font-size: 24px; } } -.php8__h2 { +.php8-h2 { font-size: 31px; font-weight: bold; font-stretch: normal; @@ -113,23 +110,23 @@ color: #27282c; } -.php8__h2::after { +.php8-h2::after { display: none; } -.php8__h2_margin-top { +.php8-h2_margin-top { margin-top: 48px; } -.php8__section_dark .php8__h2 { +.php8-section_dark .php8-h2 { color: #fff; } -.php8__button-wrapper { +.php8-button-wrapper { margin-top: 33px; } -.php8__button { +.php8-button { display: inline-block; padding: 16px 46px; border-radius: 30px; @@ -147,17 +144,17 @@ } @media (max-width: 640px) { - .php8__button { + .php8-button { padding: 16px 36px; } } -.php8__button_light { +.php8-button_light { background-color: #fff !important; color: #27282c !important; } -.php8__footer-content { +.php8-footer__content { margin-top: 64px; text-align: left; font-size: 15px; @@ -168,14 +165,14 @@ letter-spacing: normal; } -#layout-content .php8__section_dark a:link, -#layout-content .php8__section_dark a:visited { +#layout-content .php8-section_dark a:link, +#layout-content .php8-section_dark a:visited { color: #fff; transition: opacity 0.2s; } -#layout-content .php8__section_dark a:hover, -#layout-content .php8__section_dark a:focus { +#layout-content .php8-section_dark a:hover, +#layout-content .php8-section_dark a:focus { color: #fff; border-color: #fff; opacity: 0.85; @@ -210,23 +207,20 @@ } } -.php8__rfc { +.php8-rfc { font-size: 15px; font-weight: normal; - font-stretch: normal; - font-style: normal; line-height: 1.6; - letter-spacing: normal; vertical-align: middle; color: #505c90; border-bottom-color: currentColor; } -.php8__compare ~ .php8__compare { +.php8-compare ~ .php8-compare { margin-top: 58px; } -.php8__compare-main { +.php8-compare__main { display: -webkit-box; display: -ms-flexbox; display: flex; @@ -239,22 +233,19 @@ } @media (max-width: 810px) { - .php8__compare-main { - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; + .php8-compare__main { + display: block; } } -.php8__compare-block { +.php8-compare__block { position: relative; -ms-flex-preferred-size: calc((100% - 68px)/2); flex-basis: calc((100% - 68px)/2); text-align: left; } -.php8__compare-label { +.php8-compare__label { position: absolute; top: 12px; left: 12px; @@ -271,12 +262,12 @@ background-color: rgba(39, 40, 44, 0.05); } -.php8__compare-label_new { +.php8-compare__label_new { background-color: #505c90; color: #fff; } -.php8__code { +.php8-code { display: -webkit-box; display: -ms-flexbox; display: flex; @@ -291,20 +282,20 @@ } @media (max-width: 1000px) { - .php8__code { + .php8-code { padding-left: 50px !important; padding-right: 50px !important; } } @media (max-width: 768px) { - .php8__code { + .php8-code { padding-left: 12px !important; padding-right: 12px !important; } } -.php8__compare-arrow { +.php8-compare__arrow { height: 36px; width: 20px; margin: auto; @@ -312,22 +303,22 @@ } @media (max-width: 810px) { - .php8__compare-arrow { + .php8-compare__arrow { margin-top: 10px; margin-bottom: 10px; transform: rotate(90deg); } } -.php8__section ul { +.php8-section ul { } -.php8__section li ~ li { +.php8-section li ~ li { margin-top: 24px; } -.php8__columns { +.php8-columns { display: -webkit-box; display: -ms-flexbox; display: flex; @@ -337,18 +328,18 @@ } @media (max-width: 768px) { - .php8__columns { + .php8-columns { display: block; } } -.php8__column { +.php8-column { -ms-flex-preferred-size: calc((100% - 68px)/2); flex-basis: calc((100% - 68px)/2); } @media (max-width: 768px) { - .php8__column { + .php8-column { width: 100%; } } \ No newline at end of file
diff --git a/php8.php b/php8.php index 1eddede0d..0c9f58f00 100644 --- a/php8.php +++ b/php8.php @@ -6,31 +6,33 @@ site_header("php 8", array("current" => "php8")); ?> <link rel="stylesheet" href="/styles/php8.css"> <div class="php8"> - <div class="php8__section php8__section_dark php8__section_header center"> - <div class="php8__logo"> - <img src="/images/logos/logo_php8.svg" alt="" height="126" width="343"> - </div> - <div class="php8__title"> - <span class="php8__title-text">released!</span> - <img class="php8__title-img" src="/images/party-popper.png" srcset="/images/party-popper@2x.png 2x, /images/party-popper@2x.png 3x" alt="" width="58" height="58"> - </div> - <div class="php8__subtitle"> - PHP 8.0 is a major update of the PHP language. It contains many new features and optimizations. Including named - arguments, union types, attributes, constructor property promotion, match expression, nullsafe operator, JIT, and - improvements in type system, error handling, and consistency. + <div class="php8-section php8-section_dark php8-section_header center"> + <div class="php8-section__inner"> + <div class="php8-logo"> + <img src="/images/logos/logo_php8.svg" alt="" height="126" width="343"> + </div> + <div class="php8-title"> + <span class="php8-title__text">released!</span> + <img class="php8-title__img" src="/images/party-popper.png" srcset="/images/party-popper@2x.png 2x, /images/party-popper@2x.png 3x" alt="" width="58" height="58"> + </div> + <div class="php8-subtitle"> + PHP 8.0 is a major update of the PHP language. It contains many new features and optimizations. Including named + arguments, union types, attributes, constructor property promotion, match expression, nullsafe operator, JIT, and + improvements in type system, error handling, and consistency. + </div> </div> </div> - <div class="php8__section center"> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-section center"> + <div class="php8-compare"> + <h2 class="php8-h2"> Named arguments - <a class="php8__rfc" href="https://wiki.php.net/rfc/named_params">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/named_params">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> <span class="default">htmlspecialchars</span>(<span class="default">$string</span>, <span class="default">ENT_COMPAT | ENT_HTML401</span>, <span class="string">'UTF-8'</span>, @@ -38,10 +40,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> <span class="methodname"><strong>htmlspecialchars</strong></span>(<span class="parameter">$string</span>, double_encode: <span class="initializer">false</span>); @@ -51,15 +53,15 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Attributes - <a class="php8__rfc" href="https://wiki.php.net/rfc/attributes_v2">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/attributes_v2">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> <span class="comment">/**</span><br> <span class="comment">* @Route("/api/posts/{id}", methods={"GET", "HEAD"})</span><br> @@ -69,10 +71,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> #[Route(<span class="string">"/api/posts/{id}"</span>, methods: [<span class="string">"GET"</span>, <span class="string">"HEAD"</span>])]<br> @@ -84,15 +86,15 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Constructor property promotion - <a class="php8__rfc" href="https://wiki.php.net/rfc/constructor_promotion">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/constructor_promotion">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> <span class="keyword">class</span> Point {<br> <span class="keyword">public</span> <span class="keyword">float</span> $x;<br> @@ -112,10 +114,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> <span class="keyword">class</span> Point {<br> <span class="keyword">public</span> <span class="keyword">function</span> __construct(<br> @@ -130,15 +132,15 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Union types - <a class="php8__rfc" href="https://wiki.php.net/rfc/union_types_v2">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/union_types_v2">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> <span class="keyword">class</span> Number {<br> <span class="comment">/** @var int|float */</span><br> @@ -156,10 +158,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> <span class="keyword">class</span> Number {<br> <span class="keyword">public</span> function __construct(<br> @@ -174,15 +176,15 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Match expression - <a class="php8__rfc" href="https://wiki.php.net/rfc/match_expression_v2">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/match_expression_v2">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> <span class="keyword">switch</span> (8.0) {<br> <span class="keyword">case</span> <span class="string">'8.0'</span>:<br> @@ -197,10 +199,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> <span class="keyword">echo</span> match (8.0) {<br> <span class="string">'8.0'</span> => <span class="string">"Oh no!"</span>,<br> @@ -213,15 +215,15 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Nullsafe operator - <a class="php8__rfc" href="https://wiki.php.net/rfc/nullsafe_operator">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/nullsafe_operator">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> $country = <span class="keyword">null</span>;<br> <br> @@ -239,10 +241,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> $country = $session?->user?->getAddress()?->country; </code> @@ -251,24 +253,24 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Saner string to number comparisons - <a class="php8__rfc" href="https://wiki.php.net/rfc/string_to_number_comparison">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/string_to_number_comparison">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> 0 == <span class="string">'foobar'</span> <span class="comment">// true</span> </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> 0 == <span class="string">'foobar'</span> <span class="comment">// false</span> </code> @@ -277,15 +279,15 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__compare"> - <h2 class="php8__h2"> + <div class="php8-compare"> + <h2 class="php8-h2"> Consistent type errors for internal functions - <a class="php8__rfc" href="https://wiki.php.net/rfc/consistent_type_errors">RFC</a> + <a class="php8-rfc" href="https://wiki.php.net/rfc/consistent_type_errors">RFC</a> </h2> - <div class="php8__compare-main"> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label">PHP 7</div> - <div class="php8__code phpcode"> + <div class="php8-compare__main"> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label">PHP 7</div> + <div class="php8-code phpcode"> <code> strlen([]); <span class="comment">// Warning: strlen() expects parameter 1 to be string, array given</span><br> <br> @@ -293,10 +295,10 @@ site_header("php 8", array("current" => "php8")); </code> </div> </div> - <div class="php8__compare-arrow"></div> - <div class="php8__compare-block example-contents"> - <div class="php8__compare-label php8__compare-label_new">PHP 8</div> - <div class="php8__code phpcode"> + <div class="php8-compare__arrow"></div> + <div class="php8-compare__block example-contents"> + <div class="php8-compare__label php8-compare__label_new">PHP 8</div> + <div class="php8-code phpcode"> <code> strlen([]); <span class="comment">// TypeError: strlen(): Argument #1 ($str) must be of type string, array given</span><br> <br> @@ -308,10 +310,10 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__section php8__section_light"> - <h2 class="php8__h2">Other syntax tweaks and improvements</h2> - <div class="php8__columns"> - <div class="php8__column"> + <div class="php8-section php8-section_light"> + <h2 class="php8-h2">Other syntax tweaks and improvements</h2> + <div class="php8-columns"> + <div class="php8-column"> <ul> <li> Allow trailing comma in parameter list <a href="https://wiki.php.net/rfc/trailing_comma_in_parameter_list">RFC</a> @@ -325,7 +327,7 @@ site_header("php 8", array("current" => "php8")); </li> </ul> </div> - <div class="php8__column"> + <div class="php8-column"> <ul> <li> Treat namespaced names as single token <a href="https://wiki.php.net/rfc/namespaced_names_as_token">RFC</a> @@ -339,9 +341,9 @@ site_header("php 8", array("current" => "php8")); </ul> </div> </div> - <div class="php8__columns"> - <div class="php8__column"> - <h2 class="php8__h2 php8__h2_margin-top">Type system and error handling improvements</h2> + <div class="php8-columns"> + <div class="php8-column"> + <h2 class="php8-h2 php8-h2_margin-top">Type system and error handling improvements</h2> <ul> <li> Saner string to number comparisons <a href="https://wiki.php.net/rfc/string_to_number_comparison">RFC</a> @@ -384,8 +386,8 @@ site_header("php 8", array("current" => "php8")); </li> </ul> </div> - <div class="php8__column"> - <h2 class="php8__h2 php8__h2_margin-top">New Classes, Interfaces, and Functions</h2> + <div class="php8-column"> + <h2 class="php8-h2 php8-h2_margin-top">New Classes, Interfaces, and Functions</h2> <ul> <li> <a href="https://wiki.php.net/rfc/weak_maps">Weak Map</a> class @@ -415,25 +417,27 @@ site_header("php 8", array("current" => "php8")); </div> </div> - <div class="php8__section php8__section_dark php8__section_footer center"> - <h2 class="php8__h2"> - Get free performance improvement.<br class="display-none-lg display-block-md"> - Get better syntax.<br class="display-block-lg display-none-md display-block-sm"> - Get more strictness. - </h2> - <div class="php8__button-wrapper"> - <a class="php8__button php8__button_light" href="#">Go update to PHP 8!</a> - </div> - <div class="php8__footer-content"> - <p> - For source downloads of PHP 8 please visit our <a href="http://www.php.net/downloads">downloads</a> page. - Windows binaries can be found on the <a href="http://windows.php.net/download">PHP for Windows</a> site. - The list of changes is recorded in the <a href="http://www.php.net/ChangeLog-8.php">ChangeLog</a>. - </p> - <p> - The <a href="http://php.net/manual/en/migration8.php">migration guide</a> is available in the PHP Manual. Please - consult it for the detailed list of new features and backward-incompatible changes. - </p> + <div class="php8-section php8-section_dark php8-section_footer php8-footer center"> + <div class="php8-section__inner"> + <h2 class="php8-h2"> + Get free performance improvement.<br class="display-none-lg display-block-md"> + Get better syntax.<br class="display-block-lg display-none-md display-block-sm"> + Get more strictness. + </h2> + <div class="php8-button-wrapper"> + <a class="php8-button php8-button_light" href="#">Go update to PHP 8!</a> + </div> + <div class="php8-footer__content"> + <p> + For source downloads of PHP 8 please visit our <a href="http://www.php.net/downloads">downloads</a> page. + Windows binaries can be found on the <a href="http://windows.php.net/download">PHP for Windows</a> site. + The list of changes is recorded in the <a href="http://www.php.net/ChangeLog-8.php">ChangeLog</a>. + </p> + <p> + The <a href="http://php.net/manual/en/migration8.php">migration guide</a> is available in the PHP Manual. Please + consult it for the detailed list of new features and backward-incompatible changes. + </p> + </div> </div> </div> </div> diff --git a/styles/php8.css b/styles/php8.css index 557822b66..fa1a35287 100644 --- a/styles/php8.css +++ b/styles/php8.css @@ -13,53 +13,50 @@ vertical-align: middle; } -.php8__section { +.php8-section { padding: 96px 1.5rem; margin: 0 -1.5rem; } -.php8__section_dark { - padding-left: calc((100% - (810px - 3rem))/2); - padding-right: calc((100% - (810px - 3rem))/2); +.php8-section_dark { background-color: #4F5B93; color: #fff; } -.php8__section_dark * { - color: #fff; +.php8-section__inner { + width: 810px; + max-width: 100%; + margin: 0 auto; } -.php8__section_light { - background-color: #fff; +.php8-section_dark * { + color: #fff; } -@media (max-width: 920px) { - .php8__section { - padding-left: 1.5rem; - padding-right: 1.5rem; - } +.php8-section_light { + background-color: #fff; } -.php8__section_header { +.php8-section_header { padding-top: 64px; margin-top: -1.5rem; font-family: Helvetica, Arial, sans-serif; } -.php8__section_footer { +.php8-section_footer { margin-bottom: -1.5rem; font-family: Helvetica, Arial, sans-serif; } -.php8__logo { +.php8-logo { vertical-align: middle; } -.php8__logo img { +.php8-logo img { max-width: 90%; } -.php8__title { +.php8-title { margin-top: 16px; font-size: 60px; font-weight: 900; @@ -70,23 +67,23 @@ } @media (max-width: 480px) { - .php8__title { + .php8-title { font-size: 50px; } } -.php8__title-text { +.php8-title__text { vertical-align: middle; } -.php8__title-img { +.php8-title__img { width: 0.9666666666667em; height: 0.9666666666667em; margin-left: 2px; vertical-align: middle; } -.php8__subtitle { +.php8-subtitle { margin-top: 48px; font-size: 28px; font-weight: 300; @@ -98,12 +95,12 @@ } @media (max-width: 480px) { - .php8__subtitle { + .php8-subtitle { font-size: 24px; } } -.php8__h2 { +.php8-h2 { font-size: 31px; font-weight: bold; font-stretch: normal; @@ -113,23 +110,23 @@ color: #27282c; } -.php8__h2::after { +.php8-h2::after { display: none; } -.php8__h2_margin-top { +.php8-h2_margin-top { margin-top: 48px; } -.php8__section_dark .php8__h2 { +.php8-section_dark .php8-h2 { color: #fff; } -.php8__button-wrapper { +.php8-button-wrapper { margin-top: 33px; } -.php8__button { +.php8-button { display: inline-block; padding: 16px 46px; border-radius: 30px; @@ -147,17 +144,17 @@ } @media (max-width: 640px) { - .php8__button { + .php8-button { padding: 16px 36px; } } -.php8__button_light { +.php8-button_light { background-color: #fff !important; color: #27282c !important; } -.php8__footer-content { +.php8-footer__content { margin-top: 64px; text-align: left; font-size: 15px; @@ -168,14 +165,14 @@ letter-spacing: normal; } -#layout-content .php8__section_dark a:link, -#layout-content .php8__section_dark a:visited { +#layout-content .php8-section_dark a:link, +#layout-content .php8-section_dark a:visited { color: #fff; transition: opacity 0.2s; } -#layout-content .php8__section_dark a:hover, -#layout-content .php8__section_dark a:focus { +#layout-content .php8-section_dark a:hover, +#layout-content .php8-section_dark a:focus { color: #fff; border-color: #fff; opacity: 0.85; @@ -210,23 +207,20 @@ } } -.php8__rfc { +.php8-rfc { font-size: 15px; font-weight: normal; - font-stretch: normal; - font-style: normal; line-height: 1.6; - letter-spacing: normal; vertical-align: middle; color: #505c90; border-bottom-color: currentColor; } -.php8__compare ~ .php8__compare { +.php8-compare ~ .php8-compare { margin-top: 58px; } -.php8__compare-main { +.php8-compare__main { display: -webkit-box; display: -ms-flexbox; display: flex; @@ -239,22 +233,19 @@ } @media (max-width: 810px) { - .php8__compare-main { - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; + .php8-compare__main { + display: block; } } -.php8__compare-block { +.php8-compare__block { position: relative; -ms-flex-preferred-size: calc((100% - 68px)/2); flex-basis: calc((100% - 68px)/2); text-align: left; } -.php8__compare-label { +.php8-compare__label { position: absolute; top: 12px; left: 12px; @@ -271,12 +262,12 @@ background-color: rgba(39, 40, 44, 0.05); } -.php8__compare-label_new { +.php8-compare__label_new { background-color: #505c90; color: #fff; } -.php8__code { +.php8-code { display: -webkit-box; display: -ms-flexbox; display: flex; @@ -291,20 +282,20 @@ } @media (max-width: 1000px) { - .php8__code { + .php8-code { padding-left: 50px !important; padding-right: 50px !important; } } @media (max-width: 768px) { - .php8__code { + .php8-code { padding-left: 12px !important; padding-right: 12px !important; } } -.php8__compare-arrow { +.php8-compare__arrow { height: 36px; width: 20px; margin: auto; @@ -312,22 +303,22 @@ } @media (max-width: 810px) { - .php8__compare-arrow { + .php8-compare__arrow { margin-top: 10px; margin-bottom: 10px; transform: rotate(90deg); } } -.php8__section ul { +.php8-section ul { } -.php8__section li ~ li { +.php8-section li ~ li { margin-top: 24px; } -.php8__columns { +.php8-columns { display: -webkit-box; display: -ms-flexbox; display: flex; @@ -337,18 +328,18 @@ } @media (max-width: 768px) { - .php8__columns { + .php8-columns { display: block; } } -.php8__column { +.php8-column { -ms-flex-preferred-size: calc((100% - 68px)/2); flex-basis: calc((100% - 68px)/2); } @media (max-width: 768px) { - .php8__column { + .php8-column { width: 100%; } } \ No newline at end of file