This commit is contained in:
Keith Solomon
@@ -0,0 +1,98 @@
|
|||||||
|
{
|
||||||
|
"key": "group_6821a3c4d0001",
|
||||||
|
"title": "Pull Quote",
|
||||||
|
"fields": [
|
||||||
|
{
|
||||||
|
"key": "field_6a0b49f03f870",
|
||||||
|
"label": "Background Image",
|
||||||
|
"name": "quote_bg",
|
||||||
|
"aria-label": "",
|
||||||
|
"type": "image",
|
||||||
|
"instructions": "",
|
||||||
|
"required": 0,
|
||||||
|
"conditional_logic": 0,
|
||||||
|
"wrapper": {
|
||||||
|
"width": "",
|
||||||
|
"class": "",
|
||||||
|
"id": ""
|
||||||
|
},
|
||||||
|
"return_format": "array",
|
||||||
|
"library": "all",
|
||||||
|
"min_width": "",
|
||||||
|
"min_height": "",
|
||||||
|
"min_size": "",
|
||||||
|
"max_width": "",
|
||||||
|
"max_height": "",
|
||||||
|
"max_size": "",
|
||||||
|
"mime_types": "",
|
||||||
|
"allow_in_bindings": 0,
|
||||||
|
"preview_size": "medium"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"key": "field_6a0b4a0c3f871",
|
||||||
|
"label": "Background Color",
|
||||||
|
"name": "quote_bg_color",
|
||||||
|
"aria-label": "",
|
||||||
|
"type": "color_picker",
|
||||||
|
"instructions": "",
|
||||||
|
"required": 0,
|
||||||
|
"conditional_logic": 0,
|
||||||
|
"wrapper": {
|
||||||
|
"width": "",
|
||||||
|
"class": "",
|
||||||
|
"id": ""
|
||||||
|
},
|
||||||
|
"default_value": "",
|
||||||
|
"enable_opacity": 1,
|
||||||
|
"return_format": "string",
|
||||||
|
"allow_in_bindings": 0,
|
||||||
|
"show_custom_palette": 0,
|
||||||
|
"show_color_wheel": 1,
|
||||||
|
"custom_palette_source": "",
|
||||||
|
"palette_colors": ""
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"key": "field_6821a3c4d0010",
|
||||||
|
"label": "Quote Text",
|
||||||
|
"name": "quote_text",
|
||||||
|
"aria-label": "",
|
||||||
|
"type": "wysiwyg",
|
||||||
|
"instructions": "Enter the pull quote text. Use bold to highlight key phrases.",
|
||||||
|
"required": 1,
|
||||||
|
"conditional_logic": 0,
|
||||||
|
"wrapper": {
|
||||||
|
"width": "",
|
||||||
|
"class": "",
|
||||||
|
"id": ""
|
||||||
|
},
|
||||||
|
"default_value": "",
|
||||||
|
"tabs": "visual",
|
||||||
|
"toolbar": "basic",
|
||||||
|
"media_upload": 0,
|
||||||
|
"delay": 0,
|
||||||
|
"allow_in_bindings": 0
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"location": [
|
||||||
|
[
|
||||||
|
{
|
||||||
|
"param": "block",
|
||||||
|
"operator": "==",
|
||||||
|
"value": "acf\/pull-quote"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
],
|
||||||
|
"menu_order": 0,
|
||||||
|
"position": "normal",
|
||||||
|
"style": "default",
|
||||||
|
"label_placement": "top",
|
||||||
|
"instruction_placement": "label",
|
||||||
|
"hide_on_screen": "",
|
||||||
|
"active": true,
|
||||||
|
"description": "",
|
||||||
|
"show_in_rest": 0,
|
||||||
|
"display_title": "",
|
||||||
|
"allow_ai_access": false,
|
||||||
|
"ai_description": "",
|
||||||
|
"modified": 1779125577
|
||||||
|
}
|
||||||
@@ -9,6 +9,7 @@
|
|||||||
|
|
||||||
--color-cwc-blue-01: oklch(47.31% 0.1141 242.9);
|
--color-cwc-blue-01: oklch(47.31% 0.1141 242.9);
|
||||||
--color-cwc-blue-02: oklch(28.99% 0.0614 237.9);
|
--color-cwc-blue-02: oklch(28.99% 0.0614 237.9);
|
||||||
|
--color-cwc-blue-03: oklch(80.63% 0.0724 230.4);
|
||||||
--color-cwc-orange-01: oklch(63.53% 0.1751 29.61);
|
--color-cwc-orange-01: oklch(63.53% 0.1751 29.61);
|
||||||
|
|
||||||
--color-primary: var(--color-cwc-blue-01);
|
--color-primary: var(--color-cwc-blue-01);
|
||||||
@@ -36,6 +37,8 @@
|
|||||||
--color-bodylinks: oklch(0.48 0.0789 211.58);
|
--color-bodylinks: oklch(0.48 0.0789 211.58);
|
||||||
--color-footlinks: oklch(0.65 0.1104 212.2);
|
--color-footlinks: oklch(0.65 0.1104 212.2);
|
||||||
|
|
||||||
|
--color-pullquote-bg: color-mix(in oklch, var(--color-cwc-blue-03) 30%, transparent);
|
||||||
|
|
||||||
--color-success: oklch(64.01% 0.1751 146.7);
|
--color-success: oklch(64.01% 0.1751 146.7);
|
||||||
--color-info: oklch(0.55 0.0922 211.57);
|
--color-info: oklch(0.55 0.0922 211.57);
|
||||||
--color-warning: oklch(84.42% 0.1722 84.93);
|
--color-warning: oklch(84.42% 0.1722 84.93);
|
||||||
|
|||||||
@@ -0,0 +1,27 @@
|
|||||||
|
{
|
||||||
|
"name": "acf/pull-quote",
|
||||||
|
"title": "Pull Quote",
|
||||||
|
"description": "A decorative pull quote with background vectors and accent border.",
|
||||||
|
"style": [
|
||||||
|
"file:./pull-quote.css"
|
||||||
|
],
|
||||||
|
"category": "vdi-blocks",
|
||||||
|
"icon": "format-quote",
|
||||||
|
"keywords": [
|
||||||
|
"pull-quote",
|
||||||
|
"quote"
|
||||||
|
],
|
||||||
|
"acf": {
|
||||||
|
"mode": "preview",
|
||||||
|
"renderTemplate": "pull-quote.php"
|
||||||
|
},
|
||||||
|
"supports": {
|
||||||
|
"align": true,
|
||||||
|
"anchor": true,
|
||||||
|
"color": false,
|
||||||
|
"html": false,
|
||||||
|
"jsx": false,
|
||||||
|
"mode": true,
|
||||||
|
"multiple": true
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,43 @@
|
|||||||
|
.pull-quote {
|
||||||
|
background: color-mix(in oklch, var(--color-cwc-blue-03) 30%, transparent);
|
||||||
|
border-bottom: 16px solid var(--color-cwc-blue-03);
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pull-quote__vector {
|
||||||
|
inset: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pull-quote__vector img {
|
||||||
|
display: block;
|
||||||
|
height: auto;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pull-quote__content {
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pull-quote__text {
|
||||||
|
font-family: var(--font-quincy);
|
||||||
|
font-size: var(--text-35px);
|
||||||
|
font-weight: 500;
|
||||||
|
line-height: 1.3;
|
||||||
|
padding: 6rem 0;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
strong, b {
|
||||||
|
color: var(--color-cwc-blue-02);
|
||||||
|
font-weight: 800;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
color: var(--color-cwc-blue-01);
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,42 @@
|
|||||||
|
<?php
|
||||||
|
/**
|
||||||
|
* Block Name: Pull Quote
|
||||||
|
*
|
||||||
|
* A decorative pull quote with background vectors and accent border.
|
||||||
|
*
|
||||||
|
* @package CWC
|
||||||
|
*/
|
||||||
|
|
||||||
|
namespace CWC;
|
||||||
|
|
||||||
|
$quote_bg = get_field( 'quote_bg' );
|
||||||
|
$quote_bgColor = get_field( 'quote_bg_color' );
|
||||||
|
$quote_text = get_field( 'quote_text' );
|
||||||
|
|
||||||
|
if ( empty( $quote_text ) ) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( $quote_bgColor ) {
|
||||||
|
$quote_bgColor = 'bg-[' . esc_attr( $quote_bgColor ) . '] ';
|
||||||
|
} else {
|
||||||
|
$quote_bgColor = 'bg-(--color-pullquote-bg) ';
|
||||||
|
}
|
||||||
|
|
||||||
|
$classes = $quote_bgColor . 'pull-quote mx-break-out';
|
||||||
|
$wrapper = blockWrapperAttributes( $classes, $is_preview );
|
||||||
|
?>
|
||||||
|
|
||||||
|
<section <?php echo wp_kses_post( $wrapper ); ?>>
|
||||||
|
<?php if ( $quote_bg ) : ?>
|
||||||
|
<div class="pull-quote__vector" aria-hidden="true">
|
||||||
|
<img class="pull-quote__vector--bg" src="<?php echo esc_url( $quote_bg['url'] ); ?>" alt="" loading="lazy" role="presentation" />
|
||||||
|
</div>
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<div class="container pull-quote__content">
|
||||||
|
<div class="pull-quote__text container">
|
||||||
|
<?php echo wp_kses_post( $quote_text ); ?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
Reference in New Issue
Block a user