Keith Solomon
8c239e15f6
Render mobile-contact-vector.svg alongside the existing contact linework. CSS hides the desktop SVG and shows the mobile <img> at <=767px so the new 342x187 composition fills the card width. Update the geometry test to assert the new linework ratio (342/187) and the snapshot.
50 lines
1.7 KiB
PHP
50 lines
1.7 KiB
PHP
<?php
|
|
/**
|
|
* Block Name: Contact Block
|
|
*
|
|
* A full-width CTA banner with a background photo, decorative linework overlay,
|
|
* body text, and a link button.
|
|
*
|
|
* @package CWC
|
|
*/
|
|
|
|
namespace CWC;
|
|
|
|
$bg_image = get_field( 'background_image' );
|
|
$text = get_field( 'text' );
|
|
$button = get_field( 'button_link' );
|
|
|
|
$classes = 'contact-block rounded-t-3xl pt-5 container';
|
|
$wrapper = blockWrapperAttributes( $classes, $is_preview );
|
|
?>
|
|
|
|
<section <?php echo wp_kses_post( $wrapper ); ?>>
|
|
<div class="contact-block__media" aria-hidden="true">
|
|
<?php if ( $bg_image ) : ?>
|
|
<img
|
|
class="contact-block__bg-image"
|
|
src="<?php echo esc_url( $bg_image['url'] ); ?>"
|
|
alt=""
|
|
loading="lazy"
|
|
role="presentation"
|
|
/>
|
|
<?php endif; ?>
|
|
|
|
<?php get_template_part( '/views/blocks/contact-block/linework' ); ?>
|
|
|
|
<img class="contact-block__linework contact-block__linework--mobile" src="<?php echo esc_url( get_theme_file_uri( '/static/img/mobile-contact-vector.svg' ) ); ?>" alt="" loading="lazy" role="presentation" />
|
|
</div>
|
|
|
|
<div class="contact-block__content container pt-12 pb-16 relative z-10">
|
|
<?php if ( $text ) : ?>
|
|
<h2 class="contact-block__text font-quincy font-normal leading-none text-white max-w-4/5 mb-8">
|
|
<?php echo wp_kses_post( $text ); ?>
|
|
</h2>
|
|
<?php endif; ?>
|
|
|
|
<?php if ( $button ) : ?>
|
|
<a class="contact-block__cta button dark" href="<?php echo esc_url( $button['url'] ?? '#' ); ?>" title="<?php echo esc_attr( $button['title'] ?? '' ); ?>" aria-label="<?php echo esc_attr( $button['title'] ?? '' ); ?>" data-button-color="secondary" data-button-variant="outline"><?php echo esc_html( $button['title'] ); ?></a>
|
|
<?php endif; ?>
|
|
</div>
|
|
</section>
|