diff --git a/.gitignore b/.gitignore index 21cafde896..18b0b3bd03 100644 --- a/.gitignore +++ b/.gitignore @@ -112,3 +112,4 @@ public_html/wp-content/themes/twentytwentythree public_html/wp-content/themes/twentytwentyfour public_html/wp-content/themes/wporg-parent-2021 public_html/wp-content/themes/wporg-events-2023/style.css +public_html/wp-content/themes/wporg-events-2023/editor.css diff --git a/public_html/wp-content/themes/wporg-events-2023/functions.php b/public_html/wp-content/themes/wporg-events-2023/functions.php index 18187354bd..4606d8508b 100644 --- a/public_html/wp-content/themes/wporg-events-2023/functions.php +++ b/public_html/wp-content/themes/wporg-events-2023/functions.php @@ -5,10 +5,18 @@ require_once __DIR__ . '/inc/city-landing-pages.php'; +add_action( 'after_setup_theme', __NAMESPACE__ . '\theme_support' ); add_action( 'wp_enqueue_scripts', __NAMESPACE__ . '\enqueue_assets' ); add_filter( 'wporg_block_navigation_menus', __NAMESPACE__ . '\add_site_navigation_menus' ); +/** + * Register theme supports. + */ +function theme_support() { + add_editor_style( 'editor.css' ); +} + /** * Enqueue scripts and styles. */ diff --git a/public_html/wp-content/themes/wporg-events-2023/images/contributors-rectangle1.png b/public_html/wp-content/themes/wporg-events-2023/images/contributors-rectangle1.png new file mode 100644 index 0000000000..cfcdd027c7 Binary files /dev/null and b/public_html/wp-content/themes/wporg-events-2023/images/contributors-rectangle1.png differ diff --git a/public_html/wp-content/themes/wporg-events-2023/images/contributors-square1.png b/public_html/wp-content/themes/wporg-events-2023/images/contributors-square1.png new file mode 100644 index 0000000000..1ed768f111 Binary files /dev/null and b/public_html/wp-content/themes/wporg-events-2023/images/contributors-square1.png differ diff --git a/public_html/wp-content/themes/wporg-events-2023/images/contributors-square2.png b/public_html/wp-content/themes/wporg-events-2023/images/contributors-square2.png new file mode 100644 index 0000000000..e94cc1c013 Binary files /dev/null and b/public_html/wp-content/themes/wporg-events-2023/images/contributors-square2.png differ diff --git a/public_html/wp-content/themes/wporg-events-2023/package.json b/public_html/wp-content/themes/wporg-events-2023/package.json index bf9b94e892..a5b1ca5f63 100644 --- a/public_html/wp-content/themes/wporg-events-2023/package.json +++ b/public_html/wp-content/themes/wporg-events-2023/package.json @@ -7,12 +7,14 @@ "cssnano": "^6.0.1", "postcss": "^8.4.31", "postcss-cli": "^10.1.0", + "postcss-custom-media": "^10.0.2", "postcss-import": "^15.1.0", "postcss-preset-env": "^9.3.0" }, "scripts": { + "start": "npm run watch", "watch": "npm run build -- --watch", - "build": "postcss postcss/style.pcss --output style.css", + "build": "postcss postcss/style.pcss postcss/editor.pcss --dir . --ext css", "lint:js": "echo 'There is no JS, but this is required to make the `linter.yml` workflow pass. See https://github.com/yarnpkg/yarn/issues/6739, https://github.com/yarnpkg/yarn/issues/6894.'", "lint:css": "wp-scripts lint-style 'postcss/*.pcss'" } diff --git a/public_html/wp-content/themes/wporg-events-2023/parts/front-page/contributors.html b/public_html/wp-content/themes/wporg-events-2023/parts/front-page/contributors.html index 4c49fe0358..19c02d5c10 100644 --- a/public_html/wp-content/themes/wporg-events-2023/parts/front-page/contributors.html +++ b/public_html/wp-content/themes/wporg-events-2023/parts/front-page/contributors.html @@ -1,5 +1,5 @@ - -
+ +
@@ -38,33 +38,6 @@

Where all WordPress contributors m

- - - +
- \ No newline at end of file + diff --git a/public_html/wp-content/themes/wporg-events-2023/parts/front-page/cover.html b/public_html/wp-content/themes/wporg-events-2023/parts/front-page/cover.html index 9822f4109f..ef82073b0b 100644 --- a/public_html/wp-content/themes/wporg-events-2023/parts/front-page/cover.html +++ b/public_html/wp-content/themes/wporg-events-2023/parts/front-page/cover.html @@ -12,19 +12,19 @@

Meet the community behind WordPress

-

???? events this last year

+

44,744 events this last year

-

?? countries

+

108 countries

-

???? contributor attendees

+

540,537 members

- \ No newline at end of file + diff --git a/public_html/wp-content/themes/wporg-events-2023/parts/front-page/events.html b/public_html/wp-content/themes/wporg-events-2023/parts/front-page/events.html index c5451c30fc..5746886376 100644 --- a/public_html/wp-content/themes/wporg-events-2023/parts/front-page/events.html +++ b/public_html/wp-content/themes/wporg-events-2023/parts/front-page/events.html @@ -17,4 +17,4 @@

+ + + + diff --git a/public_html/wp-content/themes/wporg-events-2023/postcss.config.js b/public_html/wp-content/themes/wporg-events-2023/postcss.config.js index 77f48990b5..f1dc45c70a 100644 --- a/public_html/wp-content/themes/wporg-events-2023/postcss.config.js +++ b/public_html/wp-content/themes/wporg-events-2023/postcss.config.js @@ -4,6 +4,8 @@ const plugins = [ // This has to run before any other plugins, to concatenate all files into one. require( 'postcss-import' ), + require( 'postcss-custom-media' ), + // Enable transforms for stage 2+, explictly enable nesting (stage 1). require( 'postcss-preset-env' )( { stage: 2, diff --git a/public_html/wp-content/themes/wporg-events-2023/postcss/base/breakpoints.pcss b/public_html/wp-content/themes/wporg-events-2023/postcss/base/breakpoints.pcss new file mode 100644 index 0000000000..04a62b99c4 --- /dev/null +++ b/public_html/wp-content/themes/wporg-events-2023/postcss/base/breakpoints.pcss @@ -0,0 +1,31 @@ +/* + * Adapted from upstream SASS files. These assume a desktop-first approach, since that lends itself better to the Site Editor. + */ + + +/* + * Gutenberg + * @link https://github.com/WordPress/gutenberg/blob/trunk/packages/base-styles/_breakpoints.scss + */ +@custom-media --xhuge (min-width: 1920px); +@custom-media --huge (min-width: 1440px); +@custom-media --wide (min-width: 1280px); +@custom-media --xlarge (min-width: 1080px); +@custom-media --large (min-width: 960px); /* admin sidebar auto folds */ +@custom-media --medium (min-width: 782px); /* adminbar goes big */ +@custom-media --small (min-width: 600px); +@custom-media --mobile (min-width: 480px); +@custom-media --zoomed-in (min-width: 280px); + + +/* + * wporg-parent-2021 + * @link https://github.com/WordPress/wporg-parent-2021/blob/trunk/source/wp-content/themes/wporg-parent-2021/sass/base/_breakpoints.scss + */ +@custom-media --small-only (max-width: 559px); +@custom-media --giant (min-width: 2000px); + + +/* + * Custom + */ diff --git a/public_html/wp-content/themes/wporg-events-2023/postcss/base/layout.pcss b/public_html/wp-content/themes/wporg-events-2023/postcss/base/layout.pcss new file mode 100644 index 0000000000..353cf7d2a5 --- /dev/null +++ b/public_html/wp-content/themes/wporg-events-2023/postcss/base/layout.pcss @@ -0,0 +1,18 @@ +.wp-site-blocks .is-layout-constrained > :where( :not( .alignleft ):not( .alignright ):not( .alignfull ) ), +.is-root-container.is-layout-constrained > :where( :not( .alignleft ):not( .alignright ):not( .alignfull ) ), +.edit-post-visual-editor__post-title-wrapper > :where(:not(.alignleft):not(.alignright):not(.alignfull)) { + /* + * `--wp--style--global--content-size` gets set to `180px`, rather than the layout size from the parent's + * `theme.json`. I'm assuming that's a bug somewhere, but haven't tracked it down. This is a hack to make the + * content width usable until that bug is resolved. + */ + max-width: var( --wp--custom--layout--content-size ) !important; +} + +.wp-site-blocks .is-layout-constrained, +.wp-block-post-content-is-layout-constrained { + & .alignwide { + /* See note about about the `global` sizes. */ + max-width: var( --wp--custom--layout--wide-size ) !important; + } +} diff --git a/public_html/wp-content/themes/wporg-events-2023/postcss/blocks/wporg-google-map.pcss b/public_html/wp-content/themes/wporg-events-2023/postcss/blocks/wporg-google-map.pcss new file mode 100644 index 0000000000..38f6b7c7f1 --- /dev/null +++ b/public_html/wp-content/themes/wporg-events-2023/postcss/blocks/wporg-google-map.pcss @@ -0,0 +1,33 @@ +.wporg-marker-list__container { + padding-left: 0; +} + +.wporg-marker-list-item { + display: flex; + align-items: flex-start; + justify-content: space-between; + border: 1px solid var(--wp--preset--color--light-grey-1); + border-bottom: none; + padding: 20px; + + @media (--small-only) { + display: block; + } + + &:last-child { + border-bottom: 1px solid var(--wp--preset--color--light-grey-1); + } + + & .wporg-marker-list-item__title { + flex: 0 0 60%; + --wp--preset--spacing--30: 0; + } + + & .wporg-marker-list-item__location { + flex: 0 0 15%; + } + + & .wporg-marker-list-item__date-time { + flex: 0 0 15%; + } +} diff --git a/public_html/wp-content/themes/wporg-events-2023/postcss/editor.pcss b/public_html/wp-content/themes/wporg-events-2023/postcss/editor.pcss new file mode 100644 index 0000000000..bff7ed6086 --- /dev/null +++ b/public_html/wp-content/themes/wporg-events-2023/postcss/editor.pcss @@ -0,0 +1,8 @@ +@import "style.pcss"; + +.block-editor-iframe__body { + + /* Otherwise they get set to `11000px` and `40vh` for some reason. */ + padding-top: 0; + padding-bottom: 0; +} diff --git a/public_html/wp-content/themes/wporg-events-2023/postcss/page/front-page/contributors.pcss b/public_html/wp-content/themes/wporg-events-2023/postcss/page/front-page/contributors.pcss new file mode 100644 index 0000000000..733b226743 --- /dev/null +++ b/public_html/wp-content/themes/wporg-events-2023/postcss/page/front-page/contributors.pcss @@ -0,0 +1,7 @@ +.wporg-events__contributors { + @media (--small-only) { + &.is-layout-flex { + display: block; + } + } +} \ No newline at end of file diff --git a/public_html/wp-content/themes/wporg-events-2023/postcss/front-page/cover.pcss b/public_html/wp-content/themes/wporg-events-2023/postcss/page/front-page/cover.pcss similarity index 58% rename from public_html/wp-content/themes/wporg-events-2023/postcss/front-page/cover.pcss rename to public_html/wp-content/themes/wporg-events-2023/postcss/page/front-page/cover.pcss index 8638abdf11..4524453169 100644 --- a/public_html/wp-content/themes/wporg-events-2023/postcss/front-page/cover.pcss +++ b/public_html/wp-content/themes/wporg-events-2023/postcss/page/front-page/cover.pcss @@ -3,11 +3,23 @@ max-height: 80vh; gap: 0; + @media (--small-only) { + height: unset; + + &.is-layout-flex { + display: block; + } + } + & .wporg-events__cover-stats { gap: 0; } & .wp-block-wporg-google-map .wporg-google-map__container { height: 430px; + + @media (--small-only) { + height: 170px; + } } } diff --git a/public_html/wp-content/themes/wporg-events-2023/postcss/style.pcss b/public_html/wp-content/themes/wporg-events-2023/postcss/style.pcss index fbbc6ffbcf..685c7b602e 100644 --- a/public_html/wp-content/themes/wporg-events-2023/postcss/style.pcss +++ b/public_html/wp-content/themes/wporg-events-2023/postcss/style.pcss @@ -6,4 +6,13 @@ * Template: wporg-parent-2021 */ -@import "front-page/cover.pcss"; +/* Base */ +@import "base/breakpoints.pcss"; +@import "base/layout.pcss"; + +/* Pages */ +@import "page/front-page/cover.pcss"; +@import "page/front-page/contributors.pcss"; + +/* Blocks */ +@import "blocks/wporg-google-map.pcss"; diff --git a/public_html/wp-content/themes/wporg-events-2023/templates/page.html b/public_html/wp-content/themes/wporg-events-2023/templates/page.html new file mode 100644 index 0000000000..eeef6d2e27 --- /dev/null +++ b/public_html/wp-content/themes/wporg-events-2023/templates/page.html @@ -0,0 +1,11 @@ + + + +
+ + + +
+ + +