Skip to content

Commit

Permalink
2024 Theme: Update Learning Pathway Card styles
Browse files Browse the repository at this point in the history 
Fixes #2625
  • Loading branch information
@adamwoodnz
adamwoodnz committed Jul 9, 2024
1 parent d11795d commit 89ba283
Show file tree
Hide file tree
Showing 2 changed files with 16 additions and 24 deletions.
32 changes: 16 additions & 16 deletions wp-content/themes/pub/wporg-learn-2024/src/learning-pathway-cards/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,15 +73,15 @@ function render_full_card( $learning_pathway ) {
<!-- wp:group {"className":"wporg-learn-learning-pathway-card-header","style":{"backgroundColor":"%1$s","border":{"bottom":{"color":"var:preset|color|light-grey-1","width":"1px"}},"spacing":{"blockGap":"0"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"space-between","verticalAlignment":"stretch"}} -->
<div class="wp-block-group wporg-learn-learning-pathway-card-header has-%1$s-background-color has-background" style="border-bottom-color:var(--wp--preset--color--light-grey-1);border-bottom-width:1px;background-color:var(--wp--custom--color--%1$s)">
<!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|30","bottom":"var:preset|spacing|30","left":"30px","right":"0"},"blockGap":"0"},"className":"wporg-learn-learning-pathway-card-header-content","layout":{"selfStretch":"fixed","flexSize":"50%%"}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"stretch"}} -->
<!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|30","bottom":"var:preset|spacing|30","left":"30px","right":"0"},"blockGap":"10px"},"className":"wporg-learn-learning-pathway-card-header-content","layout":{"selfStretch":"fixed","flexSize":"50%%"}},"className":"wporg-learn-learning-pathway-card-header-content","layout":{"type":"flex","orientation":"vertical","justifyContent":"stretch","verticalAlignment":"center"}} -->
<div class="wp-block-group wporg-learn-learning-pathway-card-header-content" style="padding-top:var(--wp--preset--spacing--30);padding-right:0;padding-bottom:var(--wp--preset--spacing--30);padding-left:30px">
<!-- wp:heading {"style":{"spacing":{"margin":{"top":"0"}},"elements":{"link":{"color":{"text":"var:preset|color|charcoal-1"}}},"typography":{"fontStyle":"normal","fontWeight":"400","lineHeight":"1.3"}},"textColor":"charcoal-1","fontSize":"huge","fontFamily":"eb-garamond"} -->
<h2 class="wp-block-heading has-charcoal-1-color has-text-color has-link-color has-eb-garamond-font-family has-huge-font-size" style="margin-top:0;font-style:normal;font-weight:400;line-height:1.3">%2$s</h2>
<!-- wp:heading {"style":{"spacing":{"margin":{"top":"0"}},"elements":{"link":{"color":{"text":"var:preset|color|charcoal-1"}}},"typography":{"lineHeight":"1.3"}},"textColor":"charcoal-1","fontSize":"large"} -->
<h2 class="wp-block-heading has-charcoal-1-color has-text-color has-link-color has-large-font-size" style="margin-top:0;line-height:1.3">%2$s</h2>
<!-- /wp:heading -->
<!-- wp:paragraph {"textColor":"charcoal-1","className":"is-style-short-text","fontSize":"small"} -->
<p class="is-style-short-text has-charcoal-1-color has-text-color has-small-font-size">%3$s</p>
<!-- wp:paragraph -->
<p>%3$s</p>
<!-- /wp:paragraph -->
</div>
Expand All @@ -100,8 +100,8 @@ function render_full_card( $learning_pathway ) {
<!-- wp:group {"style":{"spacing":{"blockGap":"0"}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"stretch","verticalAlignment":"space-between"}} -->
<div class="wp-block-group">
<!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|20","bottom":"var:preset|spacing|20","left":"30px","right":"30px"}},"border":{"bottom":{"color":"var:preset|color|light-grey-1","width":"1px"},"top":{},"right":{},"left":{}}},"layout":{"type":"default"}} -->
<div class="wp-block-group" style="border-bottom-color:var(--wp--preset--color--light-grey-1);border-bottom-width:1px;padding-top:var(--wp--preset--spacing--20);padding-right:30px;padding-bottom:var(--wp--preset--spacing--20);padding-left:30px">
<!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|30","bottom":"var:preset|spacing|30","left":"30px","right":"30px"}},"border":{"bottom":{"color":"var:preset|color|light-grey-1","width":"1px"},"top":{},"right":{},"left":{}}},"layout":{"type":"default"}} -->
<div class="wp-block-group" style="border-bottom-color:var(--wp--preset--color--light-grey-1);border-bottom-width:1px;padding-top:var(--wp--preset--spacing--30);padding-right:30px;padding-bottom:var(--wp--preset--spacing--30);padding-left:30px">
<!-- wp:post-template -->
Expand All @@ -112,8 +112,8 @@ function render_full_card( $learning_pathway ) {
</div>
<!-- /wp:group -->
<!-- wp:paragraph {"align":"right","style":{"spacing":{"padding":{"top":"var:preset|spacing|10","bottom":"var:preset|spacing|10","left":"30px","right":"30px"}},"elements":{"link":{"color":{"text":"var:preset|color|charcoal-1"}}}},"textColor":"charcoal-1","fontSize":"small"} -->
<p class="has-text-align-right has-charcoal-1-color has-text-color has-link-color has-small-font-size" style="padding-top:var(--wp--preset--spacing--10);padding-right:30px;padding-bottom:var(--wp--preset--spacing--10);padding-left:30px"><a href="%6$s">%7$s</a></p>
<!-- wp:paragraph {"align":"right","style":{"spacing":{"padding":{"top":"var:preset|spacing|20","bottom":"var:preset|spacing|20","left":"30px","right":"30px"}},"elements":{"link":{"color":{"text":"var:preset|color|charcoal-1"}}}},"textColor":"charcoal-1","fontSize":"small"} -->
<p class="has-text-align-right has-charcoal-1-color has-text-color has-link-color has-small-font-size" style="padding-top:var(--wp--preset--spacing--20);padding-right:30px;padding-bottom:var(--wp--preset--spacing--20);padding-left:30px"><a href="%6$s">%7$s</a></p>
<!-- /wp:paragraph -->
</div>
Expand Down Expand Up @@ -154,21 +154,21 @@ function render_mini_card( $learning_pathway ) {
<!-- wp:group {"style":{"spacing":{"blockGap":"0"},"dimensions":{"minHeight":"100%%"}},"layout":{"type":"flex","flexWrap":"nowrap","verticalAlignment":"stretch","justifyContent":"space-between"}} -->
<div class="wp-block-group" style="min-height:100%%">
<!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|30","bottom":"var:preset|spacing|30","left":"30px","right":"30px"},"blockGap":"10px"},"layout":{"selfStretch":"fixed","flexSize":"55%%"},"border":{"right":{"color":"var:preset|color|light-grey-1","width":"1px"},"top":{},"bottom":{},"left":{}}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group" style="border-right-color:var(--wp--preset--color--light-grey-1);border-right-width:1px;padding-top:var(--wp--preset--spacing--30);padding-right:30px;padding-bottom:var(--wp--preset--spacing--30);padding-left:30px">
<!-- wp:group {"style":{"spacing":{"padding":{"top":"40px","bottom":"40px","left":"30px","right":"40px"},"blockGap":"10px"},"layout":{"selfStretch":"fixed","flexSize":"53%%"},"border":{"right":{"color":"var:preset|color|light-grey-1","width":"1px"},"top":{},"bottom":{},"left":{}}},"layout":{"type":"flex","orientation":"vertical","verticalAlignment":"center"}} -->
<div class="wp-block-group" style="border-right-color:var(--wp--preset--color--light-grey-1);border-right-width:1px;padding-top:40px;padding-right:30px;padding-bottom:40px;padding-left:40px">
<!-- wp:heading {"level":3,"style":{"spacing":{"margin":{"top":"0"}},"elements":{"link":{"color":{"text":"var:preset|color|charcoal-1"}}}},"textColor":"charcoal-1","fontSize":"small"} -->
<h3 class="wp-block-heading has-charcoal-1-color has-text-color has-link-color has-small-font-size" style="margin-top:0">%2$s</h3>
<!-- wp:heading {"level":3,"style":{"spacing":{"margin":{"top":"0"}},"elements":{"link":{"color":{"text":"var:preset|color|charcoal-1"}}}},"textColor":"charcoal-1","fontSize":"18px,"lineHeight":"1.3""} -->
<h3 class="wp-block-heading has-charcoal-1-color has-text-color has-link-color" style="margin-top:0;font-size:18px;line-height:1.3">%2$s</h3>
<!-- /wp:heading -->
<!-- wp:paragraph {"style":{"elements":{"link":{"color":{"text":"var:preset|color|charcoal-4"}}}},"textColor":"charcoal-4","fontSize":"small"} -->
<p class="has-charcoal-4-color has-text-color has-link-color has-small-font-size">%3$s</p>
<!-- wp:paragraph {"style":{"elements":{"link":{"color":{"text":"var:preset|color|charcoal-4"}}},"typography":{"lineHeight":1.6}},"textColor":"charcoal-4"} -->
<p class="has-charcoal-4-color has-text-color has-link-color" style="line-height:1.6">%3$s</p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:group -->
<!-- wp:group {"style":{"background":{"backgroundImage":{"url":"%4$s","source":"file"},"backgroundPosition":"50%% 50%%"},"layout":{"selfStretch":"fixed","flexSize":"45%%"},"dimensions":{"minHeight":"100%%"}},"layout":{"type":"default"}} -->
<!-- wp:group {"style":{"background":{"backgroundImage":{"url":"%4$s","source":"file"},"backgroundPosition":"50%% 50%%"},"layout":{"selfStretch":"fixed","flexSize":"47%%"},"dimensions":{"minHeight":"100%%"}},"layout":{"type":"default"}} -->
<div class="wp-block-group" style="min-height:100%%" aria-hidden="true"></div>
<!-- /wp:group -->
Expand Down
8 changes: 0 additions & 8 deletions wp-content/themes/pub/wporg-learn-2024/src/learning-pathway-cards/style.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,15 +11,7 @@
.wporg-learn-learning-pathway-card-header-content {

@media screen and (max-width: 768px) {
padding-left: var(--wp--preset--spacing--20) !important;
min-height: unset;

.wp-block-heading {
font-size: var(--wp--preset--font-size--small) !important;
font-family: var(--wp--preset--font-family--inter) !important;
font-weight: 600 !important;
line-height: var(--wp--custom--body--small--typography--line-height) !important;
}
}
}

Expand Down

0 comments on commit 89ba283

Please sign in to comment.