Making WordPress.org

Changeset 13821


Ignore:
Timestamp:
06/14/2024 04:01:51 PM (5 weeks ago)
Author:
ryelle
Message:

Main: Update the homepage banner to link to WCEU keynote announcement.

Props joen, dansoschin, matt.
See https://github.com/WordPress/wporg-main-2022/issues/445

File:
1 edited

Legend:

Unmodified
Added
Removed
  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-main/front-page.php

    r13336 r13821  
    2929
    3030// The blocks code sets up the layout, but there is also inline CSS to refine things that aren't supported in classic themes.
    31 $banner_blocks = '<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|30","bottom":"var:preset|spacing|30","left":"var:preset|spacing|30","right":"var:preset|spacing|30"}}},"backgroundColor":"black","className":"wporg-homepage-banner","layout":{"type":"constrained"}} -->
    32 <div class="wp-block-group alignfull wporg-homepage-banner has-black-background-color has-background" style="padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--30)"><!-- wp:group {"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center"}} -->
    33 <div class="wp-block-group"><!-- wp:image {"sizeSlug":"full","className":"is-resized"} -->
    34 <figure class="wp-block-image size-full is-resized"><img src="https://wordpress.org/files/2024/03/wcasia-white-rectangle.png" alt="' . esc_attr__( 'WordCamp Asia 2024', 'wporg' ) . '"/></figure>
    35 <!-- /wp:image -->
    36 
    37 <!-- wp:group {"layout":{"type":"default"}} -->
    38 <div class="wp-block-group"><!-- wp:paragraph {"style":{"typography":{"lineHeight":1.6},"elements":{"link":{"color":{"text":"var:preset|color|white"},":hover":{"color":{"text":"var:preset|color|white"}}}},"spacing":{"margin":{"top":"0"}}},"textColor":"white","fontSize":"small"} -->
    39 <p class="has-white-color has-text-color has-link-color has-small-font-size" style="margin-top:0;line-height:1.6">' . __( 'Watch the Q&amp;A session with the WordPress project&#039;s co-founder, Matt Mullenweg, recorded live from WordCamp Asia 2024. <a href="https://wordpress.org/news/2024/03/highlights-from-wordcamp-asia-2024/">Read the event highlights</a>.', 'wporg' ) . '</p>
     31$banner_blocks = '<!-- wp:wporg/link-wrapper {"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|charcoal-1"}}},"spacing":{"padding":{"top":"var:preset|spacing|10","bottom":"var:preset|spacing|10","left":"var:preset|spacing|edge-space","right":"var:preset|spacing|edge-space"}},"border":{"style":"solid","width":"1px"}},"borderColor":"white","textColor":"charcoal-1","className":"wporg-homepage-banner","layout":{"type":"constrained"},"fontSize":"small"} -->
     32<a class="wp-block-wporg-link-wrapper alignfull wporg-homepage-banner has-border-color has-white-border-color has-charcoal-1-color has-text-color has-link-color has-small-font-size" style="border-style:solid;border-width:1px;padding-top:var(--wp--preset--spacing--10);padding-right:var(--wp--preset--spacing--edge-space);padding-bottom:var(--wp--preset--spacing--10);padding-left:var(--wp--preset--spacing--edge-space)" href="' . __( 'https://wordpress.org/news/2024/05/wordcamp-europe-2024-mid-year-update-and-qa-with-matt-mullenweg/', 'wporg' ) . '"><!-- wp:group {"style":{"spacing":{"blockGap":"8px"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center","verticalAlignment":"center"}} -->
     33<div class="wp-block-group"><!-- wp:paragraph {"className":"is-style-short-text"} -->
     34<p class="is-style-short-text">' . __( 'Matt Mullenweg at WordCamp Europe—streaming live June 15', 'wporg' ) . '</p>
    4035<!-- /wp:paragraph -->
    4136
    42 <!-- wp:paragraph {"style":{"typography":{"lineHeight":1.6},"elements":{"link":{"color":{"text":"var:preset|color|white"},":hover":{"color":{"text":"var:preset|color|white"}}}},"spacing":{"margin":{"bottom":"0"}}},"textColor":"white","fontSize":"small"} -->
    43 <p class="has-white-color has-text-color has-link-color has-small-font-size" style="margin-bottom:0;line-height:1.6">' . __( '<a href="https://www.youtube.com/watch?v=EOF70YJLC5U"><strong>Watch now ↗</strong></a>', 'wporg' ) . '</p>
    44 <!-- /wp:paragraph --></div>
     37<!-- wp:group {"style":{"typography":{"lineHeight":"1"},"spacing":{"padding":{"top":"3px","bottom":"3px","left":"4px","right":"4px"}}},"layout":{"type":"constrained"}} -->
     38<div class="wp-block-group" style="padding-top:3px;padding-right:4px;padding-bottom:3px;padding-left:4px;line-height:1"><!-- wp:image {"id":40598,"width":"24px","height":"24px","scale":"cover","sizeSlug":"full","linkDestination":"none","style":{"layout":{"selfStretch":"fixed","flexSize":"24px"}}} -->
     39<figure class="wp-block-image size-full is-resized"><img src="https://wordpress.org/files/2024/06/chevron-right-small.png" alt="" class="wp-image-40598" style="object-fit:cover;width:24px;height:24px"/></figure>
     40<!-- /wp:image --></div>
    4541<!-- /wp:group --></div>
    46 <!-- /wp:group --></div>
    47 <!-- /wp:group -->';
     42<!-- /wp:group --></a>
     43<!-- /wp:wporg/link-wrapper -->';
    4844
    4945\WordPressdotorg\skip_to( '#masthead' );
     
    5854        /* Set a few custom properties as they appear in the parent theme. */
    5955        .wporg-homepage-banner {
    60             --wp--preset--spacing--20: 20px;
    61             --wp--preset--spacing--30: 30px;
    62             --wp--preset--spacing--60: clamp(20px, calc(10vw - 40px), 80px);
     56            --wp--preset--spacing--10: 10px;
     57            --wp--preset--spacing--edge-space: 80px;
     58            --wp--preset--color--charcoal-0: #1a1919;
     59            --wp--preset--color--charcoal-1: #1e1e1e;
     60            --wp--preset--color--charcoal-2: #23282d;
     61            --wp--preset--color--white: #fff;
     62            --wp--preset--color--light-grey-1: #d9d9d9;
     63            --wp--preset--color--blueberry-1: #3858e9;
     64            --wp--preset--color--deep-blueberry: #213fd4;
    6365            --wp--preset--font-size--small: 14px;
     66        }
     67        .has-charcoal-0-background-color {
     68            background-color: var(--wp--preset--color--charcoal-0);
    6469        }
    6570        .wporg-homepage-banner a:hover {
     
    7176            max-width: 1160px;
    7277        }
    73         .wporg-homepage-banner .is-layout-flex {
    74             gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--60);
    75         }
    76         .wporg-homepage-banner .is-layout-flex > * {
    77             flex: 1;
    78         }
    79         @media (max-width: 650px) {
    80             .wporg-homepage-banner .is-layout-flex {
    81                 flex-direction: column;
     78        @media (max-width: 889px) {
     79            .wporg-homepage-banner {
     80                --wp--preset--spacing--edge-space: 20px;
    8281            }
    8382        }
Note: See TracChangeset for help on using the changeset viewer.