fix: harden mobile pull quote layout
This commit is contained in:
@@ -53,7 +53,7 @@
|
||||
.pull-quote {
|
||||
background: color-mix(in oklch, var(--color-cwc-blue-03) 30%, white);
|
||||
border-bottom: 0;
|
||||
height: calc(89.8vw - 1px);
|
||||
min-height: calc(89.8vw - 1px);
|
||||
}
|
||||
|
||||
.pull-quote::after {
|
||||
@@ -86,7 +86,8 @@
|
||||
.pull-quote .pull-quote__content {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
height: calc(100% - 1rem);
|
||||
margin-bottom: 1rem;
|
||||
min-height: calc(89.8vw - 1rem - 1px);
|
||||
padding: 2.5rem 2rem;
|
||||
}
|
||||
|
||||
@@ -96,3 +97,9 @@
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 360px) {
|
||||
.pull-quote .pull-quote__content {
|
||||
padding-block: 0.9375rem;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -28,12 +28,12 @@ $wrapper = blockWrapperAttributes( $classes, $is_preview );
|
||||
?>
|
||||
|
||||
<section <?php echo wp_kses_post( $wrapper ); ?>>
|
||||
<?php if ( $quote_bg ) : ?>
|
||||
<div class="pull-quote__vector" aria-hidden="true">
|
||||
<div class="pull-quote__vector" aria-hidden="true">
|
||||
<?php if ( $quote_bg ) : ?>
|
||||
<img class="pull-quote__vector--bg" src="<?php echo esc_url( $quote_bg['url'] ); ?>" alt="" loading="lazy" role="presentation" />
|
||||
<img class="pull-quote__vector--mobile" src="<?php echo esc_url( get_theme_file_uri( '/static/img/pullquote-mobile-linework.png' ) ); ?>" alt="" loading="lazy" role="presentation" />
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<?php endif; ?>
|
||||
<img class="pull-quote__vector--mobile" src="<?php echo esc_url( get_theme_file_uri( '/static/img/pullquote-mobile-linework.png' ) ); ?>" alt="" loading="lazy" role="presentation" />
|
||||
</div>
|
||||
|
||||
<div class="container wider pull-quote__content">
|
||||
<div class="pull-quote__text">
|
||||
|
||||
Reference in New Issue
Block a user