]> _ Git - ccv-wordpress.git/commitdiff
WIP #3053 @8
authorStephen Cameron <stephen@cubedesigners.com>
Tue, 1 Oct 2019 16:55:45 +0000 (18:55 +0200)
committerStephen Cameron <stephen@cubedesigners.com>
Tue, 1 Oct 2019 16:55:45 +0000 (18:55 +0200)
wp-content/mu-plugins/cube/src/Elementor/Widgets/TextBlock.php
wp-content/themes/CCV/resources/assets/styles/common/global.styl
wp-content/themes/CCV/resources/assets/styles/common/layout.styl
wp-content/themes/CCV/resources/assets/styles/common/setup.styl
wp-content/themes/CCV/resources/assets/styles/components/headings.styl
wp-content/themes/CCV/resources/assets/styles/components/sections.styl [new file with mode: 0644]
wp-content/themes/CCV/resources/assets/styles/widgets/text-block.styl
wp-content/themes/CCV/resources/views/layouts/app.blade.php
wp-content/themes/CCV/resources/views/partials/footer.blade.php
wp-content/themes/CCV/resources/views/partials/header.blade.php

index d551029765a4b301b4c9076833796e5caed92c70..204adf470fdc7871d87a2375f9576e586677dc95 100644 (file)
@@ -259,7 +259,7 @@ class TextBlock extends Widget_Base {
         // CSS Classes for elements
         $this->add_render_attribute('title', 'class', ['text-block-title h2 decorated']);
         $this->add_render_attribute('body', 'class', ['text-block-body']);
-        $this->add_render_attribute('cta_text', 'class', ['text-block-cta arrow-link']);
+        $this->add_render_attribute('cta_text', 'class', ['text-block-cta btn']);
 
         if (!empty($title_size)) {
             $this->add_render_attribute('title', 'class', ["text-block-title-size-{$title_size}"]);
@@ -290,7 +290,7 @@ class TextBlock extends Widget_Base {
                <#
                view.addRenderAttribute( 'title', 'class', ['text-block-title h2 decorated']);
                view.addRenderAttribute( 'body', 'class', ['text-block-body']);
-               view.addRenderAttribute( 'cta_text', 'class', ['text-block-cta arrow-link']);
+               view.addRenderAttribute( 'cta_text', 'class', ['text-block-cta btn']);
 
         if ('' !== settings.title_size) {
             view.addRenderAttribute('title', 'class', ['text-block-title-size-' + settings.title_size]);
index a75592b73403184bbd6b6875c09bb4182de6b43b..5afabd1225de2675b56f31697c93795aac1bacd7 100644 (file)
@@ -3,10 +3,15 @@ html
 
 body
   min-width: 320px
+  background-color: #FBFBFB
 
 p:not(:last-child)
   margin-bottom: 1.5em
 
+.wrapper
+  @apply mx-auto
+  max-width: $content-max-width
+
 // VueJS styling to hide elements until they're ready
 [v-cloak]
   visibility: hidden
index 8579835e50e7d5d158df00333331976222724df3..33dab515226e08c1537516f865a278a8cc5c794b 100644 (file)
@@ -8,7 +8,7 @@
 
 .container,
 .elementor-section-boxed > .elementor-container
-  horizontal-spacing()
+  //horizontal-spacing()
   center($content-max-width)
 
   // Account for the extra padding Elementor adds with the "extended" column gap (15px)
@@ -21,8 +21,8 @@
     padding-left: 0
     padding-right: 0
 
-.elementor-section-wrap > .elementor-section
-  vertical-spacing()
+//.elementor-section-wrap > .elementor-section
+//  vertical-spacing()
 
 
 // Override default spacing between widgets
index 741acd7550573dad991d3128e0a155ab79d2bdf4..ba297bd35da197b0058bb58bbb0ce2f3ffac189f 100644 (file)
@@ -14,7 +14,7 @@ $vertical-gutter   = 7.5vw
 
 // Breakpoints in Rupture (https://github.com/jescalan/rupture)
 $breakpoint-columns  = 768px // NOTE: this should align with the 'sm' screen value in tailwind.config.js
-$breakpoint-menu     = 1024px // This needs to match the MMenu activation setting in menu.js
+$breakpoint-menu     = 1600px // This needs to match the MMenu activation setting in menu.js
 rupture.scale        = 0 400px  768px   1024px
 rupture.scale-names  = 'small' 'medium' 'large'
 rupture.anti-overlap = -1px // Results in +below(1000px) being max-width: 999px and +above(1000px) being min-width: 1000px
index 1e0272f47126a0a52c9c678c872452d5528cf638..8a21a2054c310e01ed95cd3d0beec4b4610b7c66 100644 (file)
@@ -16,7 +16,7 @@ h1, .h1, h2, .h2, .decorated
     content: ''
     display: block
     position: absolute
-    top: 0.6em
+    top: 0.55em
     constrain(left, -5vw)
     constrain(width, 2.5vw)
     height: 5px
diff --git a/wp-content/themes/CCV/resources/assets/styles/components/sections.styl b/wp-content/themes/CCV/resources/assets/styles/components/sections.styl
new file mode 100644 (file)
index 0000000..6aaf431
--- /dev/null
@@ -0,0 +1,30 @@
+.elementor-section
+  //--- Columns responsiveness - stack all standard columns below breakpoint
+  +below($breakpoint-columns)
+    .elementor-column
+      width: 100% !important
+      &:not(:last-of-type)
+        margin-bottom: 7.5vw
+
+  // There's a toggle in the editor so we can disable
+  // this margin between columns when stacking vertically
+  &.no-column-stacking-gap
+    .elementor-column
+      +below($breakpoint-columns)
+        margin-bottom: 0
+
+  //--- Default section layout
+  &.layout-default.elementor-section-boxed
+    > .elementor-container
+      //center($content-max-width * 0.8) // 1920px * 0.8 = 1536px
+      //horizontal-spacing(5vw)
+      //box-sizing: content-box // So padding doesn't influence max-width
+
+      +below(450px)
+        horizontal-spacing(2.5vw)
+
+//--- Reversed layout
+// Handle column swapping when layout reversed toggle is set
+.layout-reversed
+  .elementor-row
+    flex-direction: row-reverse
index e0b987a6fc103547599ac5e1e9f626835e63c545..af1034161437d957918a8225d461c8aed719ee4b 100644 (file)
@@ -1,6 +1,6 @@
 // Text block widget (Elementor defaults)
 .elementor-widget-cube-text //.elementor-widget-container
-  vertical-spacing(5vw)
+  vertical-spacing(7.5vw)
   constrain(padding-left, 10vw)
   constrain(padding-right, 7.5vw)
   max-width: 640px
@@ -27,7 +27,7 @@
       margin-bottom: 0
 
   &-body
-    font-weight: 400
+    font-weight: 300
     margin-top: r(40px)
 
     // If the body is the first child, there's no title
@@ -41,6 +41,9 @@
     a
       color: theme('colors.pink')
 
+    b, strong
+      font-weight: 400
+
   &-cta
     @apply antialiased
     margin-top: r(30px)
index e30ce923881273b3c95b11b5bc99a501c9102a80..e5e1307c1d089ea14c435d19d4825097ffec51b9 100644 (file)
@@ -3,25 +3,28 @@
   @include('partials.head')
 
   <body @php(body_class('font-body font-light text-dark flex flex-col min-h-screen'))>
-    @php(wp_body_open())
-    @php(do_action('get_header'))
-    @include('partials.header')
 
-    <main class="flex-grow min-h-full">
-      @yield('content')
-    </main>
+    <div class="wrapper">
+      @php(wp_body_open())
+      @php(do_action('get_header'))
+      @include('partials.header')
 
-    {{--
-    @hasSection('sidebar')
-      <aside>
-        @yield('sidebar')
-      </aside>
-    @endif
-    --}}
+      <main class="flex-grow min-h-full bg-white">
+        @yield('content')
+      </main>
 
-    @php(do_action('get_footer'))
-    @include('partials.footer')
+      {{--
+      @hasSection('sidebar')
+        <aside>
+          @yield('sidebar')
+        </aside>
+      @endif
+      --}}
 
-    @php(wp_footer())
+      @php(do_action('get_footer'))
+      @include('partials.footer')
+
+      @php(wp_footer())
+    </div>
   </body>
 </html>
index 90a450a527e3ae56ff25a448cf0d5d842584b2f0..9fdff8ec931c34301ea0aec0d14fd816cbf16242 100644 (file)
@@ -1,5 +1,5 @@
 <footer class="bg-purple-dark text-white antialiased pt-2v pb-1v">
-  <div class="container pl-0 pr-0">
+  <div class="container">
     <div class="flex pb-2v">
       <div class="w-1/2 px-4v">
         @php(dynamic_sidebar('sidebar-footer-1'))
index e8a71c3c9c7a39fcc34054b62fda4f0851e3e721..6be3a9737b619042db80f2ff2fc73bb8a9b9f51c 100644 (file)
@@ -1,5 +1,5 @@
 <header class="font-display font-medium uppercase text-sm">
-  <div class="container pt-8 pb-12 flex items-center justify-between">
+  <div class="container px-2v pt-8 pb-12 flex items-center justify-between">
     <a class="flex-shrink-0 mr-4" href="{{ home_url('/') }}" aria-label="<?= _("Go to the home page") ?>">
       <img class="header-logo" src="@asset('images/logo.svg')" alt="{{ get_bloginfo('name', 'display') }}">
     </a>