Skip to content
This repository has been archived by the owner on Jan 24, 2024. It is now read-only.

Resolve border colors in variations #722

Merged
merged 5 commits into from
Nov 6, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,6 @@ As a default WordPress theme, it is important to leverage the existing design sy
|------------|-----------------------------|-----------|------|--------|----------------------------------------------------------|
| `Base/One` | `--wp--preset--color--base` | `#f9f9f9` | Base | `base` | ![](https://placehold.co/15x15/f9f9f9/f9f9f9.png) |
| `Base/Two` | `--wp--preset--color--base-2` | `#ffffff` | Base / Two | `base-2` | ![](https://placehold.co/15x15/ffffff/ffffff.png) |
| `Base/Three` | `--wp--preset--color--base-3` | `#00000025` | Base / Three | `base-3` | ![](https://placehold.co/15x15/00000025/00000025.png) |
| `Contrast/One` | `--wp--preset--color--contrast` | `#111111` | Contrast | `contrast` | ![](https://placehold.co/15x15/111111/111111.png) |
| `Contrast/Two` | `--wp--preset--color--contrast-2` | `#636363` | Contrast / Two | `contrast-2` | ![](https://placehold.co/15x15/636363/636363.png) |
| `Contrast/Three` | `--wp--preset--color--contrast-3` | `#a4a4a4` | Contrast / Three | `contrast-3` | ![](https://placehold.co/15x15/a4a4a4/a4a4a4.png) |
Expand Down
1 change: 0 additions & 1 deletion functions.php
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,6 @@ function twentytwentyfour_block_styles() {
.is-style-arrow-icon-details {
padding-top: var(--wp--preset--spacing--10);
padding-bottom: var(--wp--preset--spacing--10);
border-bottom: 1px solid var(--wp--preset--color--contrast-2, currentColor);
}

.is-style-arrow-icon-details summary {
Expand Down
32 changes: 16 additions & 16 deletions patterns/cta-pricing.php
Original file line number Diff line number Diff line change
Expand Up @@ -29,8 +29,8 @@

<!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":{"top":"var:preset|spacing|50","left":"var:preset|spacing|20"}}}} -->
<div class="wp-block-columns alignwide">
<!-- wp:column {"style":{"spacing":{"padding":{"right":"var:preset|spacing|30","left":"var:preset|spacing|30","top":"var:preset|spacing|30","bottom":"var:preset|spacing|10"}},"border":{"top":{"color":"var:preset|color|base-3","width":"1px"}}}} -->
<div class="wp-block-column" style="border-top-color:var(--wp--preset--color--base-3);border-top-width:1px;padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--10);padding-left:var(--wp--preset--spacing--30)">
<!-- wp:column {"style":{"spacing":{"padding":{"right":"var:preset|spacing|30","left":"var:preset|spacing|30","top":"var:preset|spacing|30","bottom":"var:preset|spacing|10"}},"border":{"top":{"color":"var:preset|color|contrast-3","width":"1px"}}}} -->
<div class="wp-block-column" style="border-top-color:var(--wp--preset--color--contrast-3);border-top-width:1px;padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--10);padding-left:var(--wp--preset--spacing--30)">
<!-- wp:heading {"textAlign":"center","level":4,"style":{"spacing":{"padding":{"top":"1px"}}},"fontSize":"medium"} -->
<h4 class="wp-block-heading has-text-align-center has-medium-font-size" style="padding-top:1px">
<em><?php echo esc_html_x( 'Free', 'Sample heading for the first pricing level', 'twentytwentyfour' ); ?></em>
Expand All @@ -52,8 +52,8 @@
<p class="has-text-align-center"><?php echo wp_kses_post( _x( 'Access to 5 exclusive <em>Études Articles</em> per month.', 'Feature for pricing level', 'twentytwentyfour' ) ); ?></p>
<!-- /wp:paragraph -->

<!-- wp:separator {"backgroundColor":"base-3"} -->
<hr class="wp-block-separator has-text-color has-base-3-color has-alpha-channel-opacity has-base-3-background-color has-background is-style-wide" />
<!-- wp:separator {"backgroundColor":"contrast-3"} -->
<hr class="wp-block-separator has-text-color has-contrast-3-color has-alpha-channel-opacity has-contrast-3-background-color has-background is-style-wide" />
<!-- /wp:separator -->

<!-- wp:paragraph {"align":"center","style":{"elements":{"link":{"color":{"text":"var:preset|color|contrast-2"}}}},"textColor":"contrast-2"} -->
Expand All @@ -62,8 +62,8 @@
</p>
<!-- /wp:paragraph -->

<!-- wp:separator {"backgroundColor":"base-3"} -->
<hr class="wp-block-separator has-text-color has-base-3-color has-alpha-channel-opacity has-base-3-background-color has-background is-style-wide" />
<!-- wp:separator {"backgroundColor":"contrast-3"} -->
<hr class="wp-block-separator has-text-color has-contrast-3-color has-alpha-channel-opacity has-contrast-3-background-color has-background is-style-wide" />
<!-- /wp:separator -->

<!-- wp:paragraph {"align":"center","style":{"elements":{"link":{"color":{"text":"var:preset|color|contrast-2"}}}},"textColor":"contrast-2"} -->
Expand Down Expand Up @@ -114,16 +114,16 @@
<p class="has-text-align-center"><?php echo wp_kses_post( _x( 'Access to 20 exclusive <em>Études Articles</em> per month.', 'Feature for pricing level', 'twentytwentyfour' ) ); ?></p>
<!-- /wp:paragraph -->

<!-- wp:separator {"backgroundColor":"base-3"} -->
<hr class="wp-block-separator has-text-color has-base-3-color has-alpha-channel-opacity has-base-3-background-color has-background is-style-wide" />
<!-- wp:separator {"backgroundColor":"contrast-3"} -->
<hr class="wp-block-separator has-text-color has-contrast-3-color has-alpha-channel-opacity has-contrast-3-background-color has-background is-style-wide" />
<!-- /wp:separator -->

<!-- wp:paragraph {"align":"center"} -->
<p class="has-text-align-center"><?php echo esc_html_x( 'Weekly print edition.', 'Feature for pricing level', 'twentytwentyfour' ); ?></p>
<!-- /wp:paragraph -->

<!-- wp:separator {"backgroundColor":"base-3"} -->
<hr class="wp-block-separator has-text-color has-base-3-color has-alpha-channel-opacity has-base-3-background-color has-background is-style-wide" />
<!-- wp:separator {"backgroundColor":"contrast-3"} -->
<hr class="wp-block-separator has-text-color has-contrast-3-color has-alpha-channel-opacity has-contrast-3-background-color has-background is-style-wide" />
<!-- /wp:separator -->

<!-- wp:paragraph {"align":"center"} -->
Expand All @@ -149,8 +149,8 @@
</div>
<!-- /wp:column -->

<!-- wp:column {"style":{"spacing":{"padding":{"right":"var:preset|spacing|30","left":"var:preset|spacing|30","top":"var:preset|spacing|30","bottom":"var:preset|spacing|10"}},"border":{"top":{"color":"var:preset|color|base-3","width":"1px"}}}} -->
<div class="wp-block-column" style="border-top-color:var(--wp--preset--color--base-3);border-top-width:1px;padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--10);padding-left:var(--wp--preset--spacing--30)">
<!-- wp:column {"style":{"spacing":{"padding":{"right":"var:preset|spacing|30","left":"var:preset|spacing|30","top":"var:preset|spacing|30","bottom":"var:preset|spacing|10"}},"border":{"top":{"color":"var:preset|color|contrast-3","width":"1px"}}}} -->
<div class="wp-block-column" style="border-top-color:var(--wp--preset--color--contrast-3);border-top-width:1px;padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--10);padding-left:var(--wp--preset--spacing--30)">
<!-- wp:heading {"textAlign":"center","level":4,"style":{"spacing":{"padding":{"top":"1px"}}},"fontSize":"medium"} -->
<h4 class="wp-block-heading has-text-align-center has-medium-font-size" style="padding-top:1px">
<em><?php echo esc_html_x( 'Expert', 'Sample heading for the third pricing level', 'twentytwentyfour' ); ?></em>
Expand All @@ -172,16 +172,16 @@
<p class="has-text-align-center"><?php echo wp_kses_post( _x( 'Exclusive, unlimited access to <em>Études Articles</em>.', 'Feature for pricing level', 'twentytwentyfour' ) ); ?></p>
<!-- /wp:paragraph -->

<!-- wp:separator {"backgroundColor":"base-3"} -->
<hr class="wp-block-separator has-text-color has-base-3-color has-alpha-channel-opacity has-base-3-background-color has-background is-style-wide" />
<!-- wp:separator {"backgroundColor":"contrast-3"} -->
<hr class="wp-block-separator has-text-color has-contrast-3-color has-alpha-channel-opacity has-contrast-3-background-color has-background is-style-wide" />
<!-- /wp:separator -->

<!-- wp:paragraph {"align":"center"} -->
<p class="has-text-align-center"><?php echo esc_html_x( 'Weekly print edition.', 'Feature for pricing level', 'twentytwentyfour' ); ?></p>
<!-- /wp:paragraph -->

<!-- wp:separator {"backgroundColor":"base-3"} -->
<hr class="wp-block-separator has-text-color has-base-3-color has-alpha-channel-opacity has-base-3-background-color has-background is-style-wide" />
<!-- wp:separator {"backgroundColor":"contrast-3"} -->
<hr class="wp-block-separator has-text-color has-contrast-3-color has-alpha-channel-opacity has-contrast-3-background-color has-background is-style-wide" />
<!-- /wp:separator -->

<!-- wp:paragraph {"align":"center"} -->
Expand Down
12 changes: 6 additions & 6 deletions patterns/hidden-sidebar.php
Original file line number Diff line number Diff line change
Expand Up @@ -23,8 +23,8 @@
</div>
<!-- /wp:group -->

<!-- wp:separator {"backgroundColor":"base-3","className":"is-style-wide"} -->
<hr class="wp-block-separator has-text-color has-base-3-color has-alpha-channel-opacity has-base-3-background-color has-background is-style-wide" />
<!-- wp:separator {"backgroundColor":"contrast","className":"is-style-wide"} -->
<hr class="wp-block-separator has-text-color has-contrast-color has-alpha-channel-opacity has-contrast-background-color has-background is-style-wide"/>
<!-- /wp:separator -->

<!-- wp:group {"style":{"spacing":{"blockGap":"16px"}},"layout":{"type":"constrained"}} -->
Expand All @@ -37,8 +37,8 @@
</div>
<!-- /wp:group -->

<!-- wp:separator {"backgroundColor":"base-3","className":"is-style-wide"} -->
<hr class="wp-block-separator has-text-color has-base-3-color has-alpha-channel-opacity has-base-3-background-color has-background is-style-wide" />
<!-- wp:separator {"backgroundColor":"contrast","className":"is-style-wide"} -->
<hr class="wp-block-separator has-text-color has-contrast-color has-alpha-channel-opacity has-contrast-background-color has-background is-style-wide"/>
<!-- /wp:separator -->

<!-- wp:group {"style":{"spacing":{"blockGap":"26px"}},"layout":{"type":"constrained"}} -->
Expand All @@ -62,8 +62,8 @@
</div>
<!-- /wp:group -->

<!-- wp:separator {"backgroundColor":"base-3","className":"is-style-wide"} -->
<hr class="wp-block-separator has-text-color has-base-3-color has-alpha-channel-opacity has-base-3-background-color has-background is-style-wide" />
<!-- wp:separator {"backgroundColor":"contrast","className":"is-style-wide"} -->
<hr class="wp-block-separator has-text-color has-contrast-color has-alpha-channel-opacity has-contrast-background-color has-background is-style-wide"/>
<!-- /wp:separator -->

<!-- wp:group {"style":{"spacing":{"blockGap":"16px"}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"stretch"}} -->
Expand Down
20 changes: 10 additions & 10 deletions patterns/text-faq.php
Original file line number Diff line number Diff line change
Expand Up @@ -16,39 +16,39 @@

<!-- wp:group {"align":"wide","layout":{"type":"default"}} -->
<div class="wp-block-group alignwide">
<!-- wp:separator {"backgroundColor":"contrast-2","className":"is-style-wide"} -->
<hr class="wp-block-separator has-text-color has-contrast-2-color has-alpha-channel-opacity has-contrast-2-background-color has-background is-style-wide"/>
<!-- wp:separator {"backgroundColor":"base","className":"is-style-wide"} -->
<hr class="wp-block-separator has-text-color has-base-color has-alpha-channel-opacity has-base-background-color has-background is-style-wide"/>
<!-- /wp:separator -->

<!-- wp:details {"style":{"spacing":{"margin":{"top":"0"}}},"className":"is-style-arrow-icon-details","fontSize":"medium"} -->
<details class="wp-block-details is-style-arrow-icon-details has-medium-font-size" style="margin-top:0">
<!-- wp:details {"style":{"spacing":{"margin":{"top":"0"}},"border":{"top":{"width":"0px","style":"none"},"right":{"width":"0px","style":"none"},"bottom":{"color":"var:preset|color|base","style":"solid","width":"1px"},"left":{"width":"0px","style":"none"}}},"className":"is-style-arrow-icon-details","fontSize":"medium"} -->
<details class="wp-block-details is-style-arrow-icon-details has-medium-font-size" style="border-top-style:none;border-top-width:0px;border-right-style:none;border-right-width:0px;border-bottom-color:var(--wp--preset--color--base);border-bottom-style:solid;border-bottom-width:1px;border-left-style:none;border-left-width:0px;margin-top:0">
<summary><?php echo esc_html_x( 'What is your process working in smaller projects?', 'Question on the details block', 'twentytwentyfour' ); ?></summary>
<!-- wp:paragraph {"placeholder":"Type / to add a hidden block","style":{"elements":{"link":{"color":{"text":"var:preset|color|contrast-1"}}}},"textColor":"contrast-1"} -->
<p class="has-contrast-1-color has-text-color has-link-color"><?php echo esc_html_x( 'Études offers comprehensive consulting, management, design, and research solutions. Our vision is to be at the forefront of architectural innovation, fostering a global community of architects and enthusiasts united by a passion for creating spaces. Every architectural endeavor is an opportunity to shape the future.', 'Hidden answer on the details block', 'twentytwentyfour' ); ?></p>
<!-- /wp:paragraph -->
</details>
<!-- /wp:details -->

<!-- wp:details {"style":{"spacing":{"margin":{"top":"0"}}},"className":"is-style-arrow-icon-details","fontSize":"medium"} -->
<details class="wp-block-details is-style-arrow-icon-details has-medium-font-size" style="margin-top:0">
<!-- wp:details {"style":{"spacing":{"margin":{"top":"0"}},"border":{"top":{"width":"0px","style":"none"},"right":{"width":"0px","style":"none"},"bottom":{"color":"var:preset|color|base","style":"solid","width":"1px"},"left":{"width":"0px","style":"none"}}},"className":"is-style-arrow-icon-details","fontSize":"medium"} -->
<details class="wp-block-details is-style-arrow-icon-details has-medium-font-size" style="border-top-style:none;border-top-width:0px;border-right-style:none;border-right-width:0px;border-bottom-color:var(--wp--preset--color--base);border-bottom-style:solid;border-bottom-width:1px;border-left-style:none;border-left-width:0px;margin-top:0">
<summary><?php echo esc_html_x( 'Who is behind Études?', 'Question on the details block', 'twentytwentyfour' ); ?></summary>
<!-- wp:paragraph {"placeholder":"Type / to add a hidden block","style":{"elements":{"link":{"color":{"text":"var:preset|color|contrast-1"}}}},"textColor":"contrast-1"} -->
<p class="has-contrast-1-color has-text-color has-link-color"><?php echo esc_html_x( 'Études offers comprehensive consulting, management, design, and research solutions. Our vision is to be at the forefront of architectural innovation, fostering a global community of architects and enthusiasts united by a passion for creating spaces. Every architectural endeavor is an opportunity to shape the future.', 'Hidden answer on the details block', 'twentytwentyfour' ); ?></p>
<!-- /wp:paragraph -->
</details>
<!-- /wp:details -->

<!-- wp:details {"style":{"spacing":{"margin":{"top":"0"}}},"className":"is-style-arrow-icon-details","fontSize":"medium"} -->
<details class="wp-block-details is-style-arrow-icon-details has-medium-font-size" style="margin-top:0">
<!-- wp:details {"style":{"spacing":{"margin":{"top":"0"}},"border":{"top":{"width":"0px","style":"none"},"right":{"width":"0px","style":"none"},"bottom":{"color":"var:preset|color|base","style":"solid","width":"1px"},"left":{"width":"0px","style":"none"}}},"className":"is-style-arrow-icon-details","fontSize":"medium"} -->
<details class="wp-block-details is-style-arrow-icon-details has-medium-font-size" style="border-top-style:none;border-top-width:0px;border-right-style:none;border-right-width:0px;border-bottom-color:var(--wp--preset--color--base);border-bottom-style:solid;border-bottom-width:1px;border-left-style:none;border-left-width:0px;margin-top:0">
<summary><?php echo esc_html_x( 'I\'d like to get to meet fellow architects, how can I do that?', 'Question on the details block', 'twentytwentyfour' ); ?></summary>
<!-- wp:paragraph {"placeholder":"Type / to add a hidden block","style":{"elements":{"link":{"color":{"text":"var:preset|color|contrast-1"}}}},"textColor":"contrast-1"} -->
<p class="has-contrast-1-color has-text-color has-link-color"><?php echo esc_html_x( 'Études offers comprehensive consulting, management, design, and research solutions. Our vision is to be at the forefront of architectural innovation, fostering a global community of architects and enthusiasts united by a passion for creating spaces. Every architectural endeavor is an opportunity to shape the future.', 'Hidden answer on the details block', 'twentytwentyfour' ); ?></p>
<!-- /wp:paragraph -->
</details>
<!-- /wp:details -->

<!-- wp:details {"style":{"spacing":{"margin":{"top":"0"}}},"className":"is-style-arrow-icon-details","fontSize":"medium"} -->
<details class="wp-block-details is-style-arrow-icon-details has-medium-font-size" style="margin-top:0">
<!-- wp:details {"style":{"spacing":{"margin":{"top":"0"}},"border":{"top":{"width":"0px","style":"none"},"right":{"width":"0px","style":"none"},"bottom":{"color":"var:preset|color|base","style":"solid","width":"1px"},"left":{"width":"0px","style":"none"}}},"className":"is-style-arrow-icon-details","fontSize":"medium"} -->
<details class="wp-block-details is-style-arrow-icon-details has-medium-font-size" style="border-top-style:none;border-top-width:0px;border-right-style:none;border-right-width:0px;border-bottom-color:var(--wp--preset--color--base);border-bottom-style:solid;border-bottom-width:1px;border-left-style:none;border-left-width:0px;margin-top:0">
<summary><?php echo esc_html_x( 'Can I apply to be a part of the team or work as a contractor?', 'Question on the details block', 'twentytwentyfour' ); ?></summary>
<!-- wp:paragraph {"placeholder":"Type / to add a hidden block","style":{"elements":{"link":{"color":{"text":"var:preset|color|contrast-1"}}}},"textColor":"contrast-1"} -->
<p class="has-contrast-1-color has-text-color has-link-color"><?php echo esc_html_x( 'Études offers comprehensive consulting, management, design, and research solutions. Our vision is to be at the forefront of architectural innovation, fostering a global community of architects and enthusiasts united by a passion for creating spaces. Every architectural endeavor is an opportunity to shape the future.', 'Hidden answer on the details block', 'twentytwentyfour' ); ?></p>
Expand Down
5 changes: 0 additions & 5 deletions styles/ember.json
Original file line number Diff line number Diff line change
Expand Up @@ -96,11 +96,6 @@
"color": "#f6decd",
"name": "Base / Two",
"slug": "base-2"
},
{
"color": "#FF3C0025",
"name": "Base / Three",
"slug": "base-3"
}
]
},
Expand Down
5 changes: 0 additions & 5 deletions styles/fossil.json
Original file line number Diff line number Diff line change
Expand Up @@ -77,11 +77,6 @@
"name": "Base / Two",
"slug": "base-2"
},
{
"color": "#1A151425",
"name": "Base / Three",
"slug": "base-3"
},
{
"color": "#1A1514",
"name": "Contrast",
Expand Down
5 changes: 0 additions & 5 deletions styles/ice.json
Original file line number Diff line number Diff line change
Expand Up @@ -77,11 +77,6 @@
"name": "Base / Two",
"slug": "base-2"
},
{
"color": "#ecf1f4",
"name": "Base / Three",
"slug": "base-3"
},
{
"color": "#1C2930",
"name": "Contrast",
Expand Down
5 changes: 0 additions & 5 deletions styles/maelstrom.json
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,6 @@
"name": "Base / Two",
"slug": "base-2"
},
{
"color": "#FFFFFF25",
"name": "Base / Three",
"slug": "base-3"
},
{
"color": "#FFFFFFA1",
"name": "Contrast / 2",
Expand Down
5 changes: 0 additions & 5 deletions styles/mint.json
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,6 @@
"name": "Base / Two",
"slug": "base-2"
},
{
"color": "#00000025",
"name": "Base / Three",
"slug": "base-3"
},
{
"color": "#000000",
"name": "Contrast",
Expand Down
5 changes: 0 additions & 5 deletions styles/onyx.json
Original file line number Diff line number Diff line change
Expand Up @@ -119,11 +119,6 @@
"name": "Base / Two",
"slug": "base-2"
},
{
"color": "#ffffff26",
"name": "Base / Three",
"slug": "base-3"
},
{
"color": "#f9f9f9",
"name": "Contrast",
Expand Down
Loading
Loading