Allow better control over heading sizes. WIP #4410 @1.5

diff --git a/wp-content/mu-plugins/physioassist/src/Elementor/Widgets/TextBlock.php b/wp-content/mu-plugins/physioassist/src/Elementor/Widgets/TextBlock.php
index 40ca825b08d658749bdbd369e3135e7fe6eb5f1b..301ec52c1b456cc6c670bd48d24cc5aab99c3852 100644 (file)
--- a/wp-content/mu-plugins/physioassist/src/Elementor/Widgets/TextBlock.php
+++ b/wp-content/mu-plugins/physioassist/src/Elementor/Widgets/TextBlock.php
@@ -196,6 +196,27 @@ class TextBlock extends Widget_Base {
                        ]
         );
 
+        $this->add_control(
+            'title_size',
+            [
+                'label' => __( 'Title Font Size', 'physioassist' ),
+                'type' => Controls_Manager::SLIDER,
+                'default' => [
+                    'size' => 2.6875, // 2.6875rem = 43px
+                ],
+                'range' => [
+                    'px' => [
+                        'min' => 1,
+                        'max' => 3,
+                        'step' => 0.01,
+                    ],
+                ],
+                'selectors' => [
+                    '{{WRAPPER}} .text-block-title' => 'font-size: {{SIZE}}rem;',
+                ],
+            ]
+        );
+
 
         $this->add_control(
                        'body_color',

diff --git a/wp-content/themes/physioassist/resources/assets/styles/components/headings.styl b/wp-content/themes/physioassist/resources/assets/styles/components/headings.styl
index a38ab66cb5027970090fdc220a02b318a710d869..9a6a1a5eb64a6a5c99c347933f69eeba444c96f6 100644 (file)
--- a/wp-content/themes/physioassist/resources/assets/styles/components/headings.styl
+++ b/wp-content/themes/physioassist/resources/assets/styles/components/headings.styl
@@ -6,7 +6,21 @@ h1, h2
   margin-bottom: 0.4em
   font-weight: 700
 
+// Override default Elementor styles
+.elementor-widget-heading .elementor-heading-title
+  &.elementor-size-xxl
+    font-size: 60px
+  &.elementor-size-xl
+    font-size: 50px
+  &.elementor-size-large
+    font-size: 40px
+  &.elementor-size-medium
+    font-size: 30px
+  &.elementor-size-small
+    font-size: 20px
 
+  +below('large')
+    font-size: $font-size-medium !important
 
 .elementor-heading-title, .main-heading
   color: $colors.headings

diff --git a/wp-content/themes/physioassist/resources/assets/styles/widgets/text-block.styl b/wp-content/themes/physioassist/resources/assets/styles/widgets/text-block.styl
index f92d158f943ccfaa1125cf56a4bb206bfb006ae3..30932f87fe1c74e2ebcbfca5044a92cb043d89b4 100644 (file)
--- a/wp-content/themes/physioassist/resources/assets/styles/widgets/text-block.styl
+++ b/wp-content/themes/physioassist/resources/assets/styles/widgets/text-block.styl
@@ -23,9 +23,10 @@
     font-size: 43px
 
     +below(large)
-      font-size: 30px
+      // Title size can be overridden in individual widgets but here we probably want to keep them consistent
+      font-size: 30px !important
     +below(medium)
-      font-size: 24px
+      font-size: 24px !important
 
     // No bottom margin if it's the last element (ie. no body below)
     &:last-child