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
index 417e37ef18..d95ce0e325 100644
--- 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
@@ -5,7 +5,8 @@ body {
.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;
+ max-width: var(--wp--custom--layout--wide-size) !important;
}
}
diff --git a/public_html/wp-content/themes/wporg-events-2023/postcss/blocks/event-list.pcss b/public_html/wp-content/themes/wporg-events-2023/postcss/blocks/event-list.pcss
new file mode 100644
index 0000000000..42aba9e7c9
--- /dev/null
+++ b/public_html/wp-content/themes/wporg-events-2023/postcss/blocks/event-list.pcss
@@ -0,0 +1,106 @@
+.wporg-marker-list__container {
+ padding-left: 0;
+
+ .wporg-marker-list-item {
+ border: 1px solid var(--wp--preset--color--light-grey-1);
+ border-bottom: none;
+ padding: var(--wp--preset--spacing--20);
+ list-style: none;
+ font-size: var(--wp--preset--font-size--small);
+
+ &:first-child {
+ border-radius: 2px 2px 0 0;
+ }
+
+ &:last-child {
+ border-radius: 0 0 2px 2px;
+ border-bottom: 1px solid var(--wp--preset--color--light-grey-1);
+ }
+
+ @media (--large) {
+ display: grid;
+ align-items: start;
+ gap: var(--wp--preset--spacing--20);
+ grid-template-columns: 45% 1fr 2fr;
+ }
+
+ @media (--xlarge) {
+ font-size: var(--wp--preset--font-size--normal);
+ }
+
+ @media (--wide) {
+ grid-template-columns: 45% 1fr 1.5fr;
+ }
+
+ @media (--huge) {
+ grid-template-columns: 55% 1fr 1fr;
+ }
+
+ @media (--xhuge) {
+ grid-template-columns: 60% 1fr 1fr;
+ }
+
+ .wporg-marker-list-item__title {
+ margin: 0;
+ font-family: var(--wp--preset--font-family--inter);
+ font-size: var(--wp--preset--font-size--small);
+ line-height: var(--wp--custom--body--typography--line-height);
+ --wp--preset--spacing--30: 0;
+
+ &.a {
+ text-decoration: none;
+ }
+
+ @media (--xlarge) {
+ font-size: var(--wp--preset--font-size--normal);
+ }
+ }
+
+ .wporg-marker-list-item__location {
+
+ @media (--medium-small) {
+ margin-top: 2px;
+ margin-bottom: -2px;
+ }
+
+ @media (--small) {
+ display: inline;
+ }
+ }
+
+ .wporg-marker-list-item__date-time {
+
+ @media (--small) {
+ display: inline-flex;
+ justify-content: flex-end;
+ white-space: nowrap;
+ align-items: center;
+ }
+
+ @media (--wide) {
+ display: flex;
+ }
+ }
+
+ .wporg-marker-list-item__location::after,
+ .wporg-google-map__date::after {
+ content: "";
+ margin-top: -1px; /* vertical-middle doesn't subtract the size of the element */
+ margin-left: 10px;
+ margin-right: 10px;
+ height: 3px;
+ width: 3px;
+ border-radius: 3px;
+ background: var(--wp--preset--color--charcoal-5);
+ display: inline-block;
+ vertical-align: middle;
+ }
+
+ .wporg-marker-list-item__location::after {
+
+ @media (--small-only), (--large) {
+ display: none;
+ }
+ }
+ }
+}
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
index d653987eab..471619c4e7 100644
--- 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
@@ -1,144 +1,3 @@
-.wporg-marker-list__container {
- padding-left: 0;
-}
-
-.wporg-marker-list-item {
- border: 1px solid var(--wp--preset--color--light-grey-1);
- border-bottom: none;
- padding: var(--wp--preset--spacing--20);
- list-style: none;
- font-size: var(--wp--preset--font-size--small);
-
- @media (--large) {
- display: grid;
- align-items: start;
- gap: var(--wp--preset--spacing--20);
- grid-template-columns: 45% 1fr 2fr;
- }
-
- @media (--xlarge) {
- font-size: var(--wp--preset--font-size--normal);
- }
-
- @media (--wide) {
- grid-template-columns: 45% 1fr 1.5fr;
- }
-
- @media (--huge) {
- grid-template-columns: 55% 1fr 1fr;
- }
-
- @media (--xhuge) {
- grid-template-columns: 60% 1fr 1fr;
- }
-
- &:last-child {
- border-bottom: 1px solid var(--wp--preset--color--light-grey-1);
- }
-
- .wporg-marker-list-item__title {
- margin: 0;
- font-family: var(--wp--preset--font-family--inter);
- font-size: var(--wp--preset--font-size--small);
- line-height: var(--wp--custom--body--typography--line-height);
- --wp--preset--spacing--30: 0;
-
- @media (--xlarge) {
- font-size: var(--wp--preset--font-size--normal);
- }
-
- }
-
- .wporg-marker-list-item__title a {
- text-decoration: none;
- }
-
-
- .wporg-marker-list-item__location {
-
- @media (--medium-small) {
- margin-top: 2px;
- margin-bottom: -2px;
- }
-
- @media (--small) {
- display: inline;
- }
- }
-
- .wporg-marker-list-item__date-time {
-
- @media (--small) {
- display: inline-flex;
- justify-content: right;
- }
-
- @media (--medium) {
- .wporg-google-map__date {
- display: block;
- }
- }
-
- @media (--huge) {
- white-space: nowrap;
-
- .wporg-google-map__date {
- display: inline-block;
- }
- }
- }
-
- .wporg-google-map__date {
- position: relative;
- }
-
- .wporg-marker-list-item__location::after,
- .wporg-google-map__date::after {
- content: '';
- margin-top: -1px; /* vertical-middle doesn't subtract the size of the element */
- margin-left: 10px;
- margin-right: 10px;
- height: 3px;
- width: 3px;
- border-radius: 3px;
- background: var(--wp--preset--color--charcoal-5);
- display: inline-block;
- vertical-align: middle;
- }
-
- .wporg-marker-list-item__location::after {
-
- @media (--small-only) {
- display: none;
- }
-
- @media (--large) {
- display: none;
- }
- }
-
- @media (--wide) {
- .wporg-marker-list-item__date-time {
- display: flex;
- flex-direction: row;
- align-items: center;
- justify-content: flex-end;
- }
-
- .wporg-google-map__date:after {
- display: inline-block;
- }
- }
-
- &:first-child {
- border-radius: 2px 2px 0 0;
- }
-
- &:last-child {
- border-radius: 0 0 2px 2px;
- }
-}
-
.wporg-map-marker__title {
font-family: var(--wp--preset--font-family--inter);
font-size: var(--wp--preset--font-size--normal);
diff --git a/public_html/wp-content/themes/wporg-events-2023/postcss/blocks/wporg-query-filter.pcss b/public_html/wp-content/themes/wporg-events-2023/postcss/blocks/wporg-query-filter.pcss
index 3f246ac8a2..61a867ca3a 100644
--- a/public_html/wp-content/themes/wporg-events-2023/postcss/blocks/wporg-query-filter.pcss
+++ b/public_html/wp-content/themes/wporg-events-2023/postcss/blocks/wporg-query-filter.pcss
@@ -1,13 +1,14 @@
/* Until we move to multi-select we should show the count so users know there is a filter applied. */
-.wporg-query-filter__toggle.has-no-filter-applied span,
+.wporg-query-filter__toggle.has-no-filter-applied span,
.wporg-query-filter__toggle.is-single-select span {
- display: inline-block;
+ display: inline-block;
}
-@media(max-width: 889px) {
- .wporg-query-filters {
- max-width:100%;
- overflow-x: scroll
- }
+.wporg-query-filters {
+
+ @media (max-width: 889px) {
+ max-width: 100%;
+ overflow-x: scroll;
+ }
}
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
index eb78641d08..2effb3e45c 100644
--- 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
@@ -1,22 +1,25 @@
.wporg-events__contributors {
- .is-style-links-list li:first-child {
- border-top: none;
- }
+ .is-style-links-list {
+ li {
+ border-color: var(--wp--preset--color--light-grey-1);
- .is-style-links-list li:last-child {
- border-bottom: none;
- }
+ a {
+ color: var(--wp--preset--color--charcoal-0);
+ }
- .is-style-links-list li {
- border-color: var(--wp--preset--color--light-grey-1);
+ &:first-child {
+ border-top: none;
+ }
- a {
- color: var(--wp--preset--color--charcoal-0);
+ &:last-child {
+ border-bottom: none;
+ }
}
}
- @media screen and (min-width: 1170px) {
- .wporg-events__contributors__image {
+ .wporg-events__contributors__image {
+
+ @media screen and (min-width: 1170px) {
min-width: 565px;
align-self: flex-start;
}
diff --git a/public_html/wp-content/themes/wporg-events-2023/postcss/page/front-page/cover.pcss b/public_html/wp-content/themes/wporg-events-2023/postcss/page/front-page/cover.pcss
index 034d959e18..210a626f0b 100644
--- a/public_html/wp-content/themes/wporg-events-2023/postcss/page/front-page/cover.pcss
+++ b/public_html/wp-content/themes/wporg-events-2023/postcss/page/front-page/cover.pcss
@@ -1,68 +1,73 @@
.wporg-events__cover {
- .wp-block-columns .wp-block-column:first-child {
+ @media (--large) {
padding-left: var(--wp--preset--spacing--edge-space);
padding-right: var(--wp--preset--spacing--edge-space);
}
- @media (--medium) {
- .wp-block-columns {
- flex-wrap: wrap !important;
+ .wp-block-columns {
- .wp-block-column {
- flex-grow: 1 !important;
- }
+ @media (--medium) {
+ flex-wrap: wrap !important;
}
- }
- @media (--large) {
- padding-left: var(--wp--preset--spacing--edge-space);
- padding-right: var(--wp--preset--spacing--edge-space);
-
- .wp-block-columns {
+ @media (--large) {
flex-wrap: nowrap !important;
}
- .wp-block-columns .wp-block-column:first-child {
- padding-left: 0;
- padding-right: 0;
- }
+ .wp-block-column {
+ &:first-child {
+ padding-left: var(--wp--preset--spacing--edge-space);
+ padding-right: var(--wp--preset--spacing--edge-space);
- .wp-block-columns .wp-block-column:first-child > p {
- max-width: 460px;
- }
- }
+ @media (--large) {
+ padding-left: 0;
+ padding-right: 0;
- .wp-block-heading em {
- display: block;
- }
+ > p {
+ max-width: 460px;
+ }
+ }
- @media (--huge) {
- .wp-block-columns .wp-block-column:first-child {
- flex-basis: 33% !important;
- }
+ @media (--huge) {
+ flex-basis: 33% !important;
+ }
+ }
+
+ &:last-child {
+
+ @media (--huge) {
+ flex-basis: 66.665% !important;
+ }
+ }
- .wp-block-columns .wp-block-column:last-child {
- flex-basis: 66.665% !important;
+ @media (--medium) {
+ flex-grow: 1 !important;
+ }
+
+ .wp-block-heading em {
+ display: block;
+ }
}
}
- & .wp-block-wporg-google-map {
+
+ .wp-block-wporg-google-map {
height: 430px;
@media (--small-only) {
height: 246px;
}
- & .wporg-google-map__container {
+ .wporg-google-map__container {
height: 100%;
}
}
}
+.wporg-events__stats .wp-block-columns {
-@media (--medium-small) {
- .wporg-events__stats .wp-block-columns {
+ @media (--medium-small) {
gap: var(--wp--preset--spacing--10);
}
-}
\ No newline at end of file
+}
diff --git a/public_html/wp-content/themes/wporg-events-2023/postcss/page/misc.pcss b/public_html/wp-content/themes/wporg-events-2023/postcss/page/misc.pcss
index 08cb580de9..d4a21a0680 100644
--- a/public_html/wp-content/themes/wporg-events-2023/postcss/page/misc.pcss
+++ b/public_html/wp-content/themes/wporg-events-2023/postcss/page/misc.pcss
@@ -3,8 +3,9 @@
text-align: center;
}
-@media (--medium-small) {
- .page-organize-content-image {
+.page-organize-content-image {
+
+ @media (--medium-small) {
display: none;
}
}
@@ -14,18 +15,18 @@ body .is-layout-flex.page-upcoming-title-past-wrapper {
}
.wporg-events__filters__no-count .wporg-events__filters__search {
- flex: 1;
+ flex: 1;
- form {
- flex: 1;
- min-width: 240px;
+ form {
+ flex: 1;
+ min-width: 240px;
- @media (min-width: 663px){
- max-width: 240px;
- }
- }
+ @media (min-width: 663px) {
+ max-width: 240px;
+ }
+ }
}
.wporg-events__search .wporg-events__filters {
- margin-top: 10px !important;
-}
\ No newline at end of file
+ margin-top: 10px !important;
+}
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 8adb90afd5..b118199354 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
@@ -19,3 +19,4 @@
/* Blocks */
@import "blocks/wporg-google-map.pcss";
@import "blocks/wporg-query-filter.pcss";
+@import "blocks/event-list.pcss";