From 5642bf4300b1ef17100ff58094f86ea946c87565 Mon Sep 17 00:00:00 2001 From: Keith Solomon Date: Mon, 18 May 2026 13:08:32 -0500 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8feature:=20Set=20up=20pullquote=20bloc?= =?UTF-8?q?k?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- acf/group_6821a3c4d0001.json | 98 ++++++++++++++++++++++++++ styles/base/colors.css | 3 + views/blocks/pull-quote/block.json | 27 +++++++ views/blocks/pull-quote/pull-quote.css | 43 +++++++++++ views/blocks/pull-quote/pull-quote.php | 42 +++++++++++ 5 files changed, 213 insertions(+) create mode 100644 acf/group_6821a3c4d0001.json create mode 100644 views/blocks/pull-quote/block.json create mode 100644 views/blocks/pull-quote/pull-quote.css create mode 100644 views/blocks/pull-quote/pull-quote.php diff --git a/acf/group_6821a3c4d0001.json b/acf/group_6821a3c4d0001.json new file mode 100644 index 0000000..d555a59 --- /dev/null +++ b/acf/group_6821a3c4d0001.json @@ -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 +} diff --git a/styles/base/colors.css b/styles/base/colors.css index d6599ee..196f51f 100644 --- a/styles/base/colors.css +++ b/styles/base/colors.css @@ -9,6 +9,7 @@ --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-03: oklch(80.63% 0.0724 230.4); --color-cwc-orange-01: oklch(63.53% 0.1751 29.61); --color-primary: var(--color-cwc-blue-01); @@ -36,6 +37,8 @@ --color-bodylinks: oklch(0.48 0.0789 211.58); --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-info: oklch(0.55 0.0922 211.57); --color-warning: oklch(84.42% 0.1722 84.93); diff --git a/views/blocks/pull-quote/block.json b/views/blocks/pull-quote/block.json new file mode 100644 index 0000000..9700568 --- /dev/null +++ b/views/blocks/pull-quote/block.json @@ -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 + } +} \ No newline at end of file diff --git a/views/blocks/pull-quote/pull-quote.css b/views/blocks/pull-quote/pull-quote.css new file mode 100644 index 0000000..503af38 --- /dev/null +++ b/views/blocks/pull-quote/pull-quote.css @@ -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; + } +} diff --git a/views/blocks/pull-quote/pull-quote.php b/views/blocks/pull-quote/pull-quote.php new file mode 100644 index 0000000..80cebf6 --- /dev/null +++ b/views/blocks/pull-quote/pull-quote.php @@ -0,0 +1,42 @@ + + +
> + + + + +
+
+ +
+
+