]> _ Git - usines-reunies.git/commitdiff
WIP #4064 @8
authorStephen Cameron <stephen@cubedesigners.com>
Mon, 11 Jan 2021 18:36:20 +0000 (19:36 +0100)
committerStephen Cameron <stephen@cubedesigners.com>
Mon, 11 Jan 2021 18:36:20 +0000 (19:36 +0100)
web/app/themes/Usines/app/setup.php
web/app/themes/Usines/resources/assets/styles/common/global.styl
web/app/themes/Usines/resources/assets/styles/components/forms.styl [new file with mode: 0644]
web/app/themes/Usines/resources/assets/styles/components/navigation.styl
web/app/themes/Usines/resources/assets/styles/widgets/text-block.styl
web/app/themes/Usines/resources/views/single.blade.php
web/app/themes/Usines/resources/views/widgets/intro-carousel.blade.php
web/app/themes/Usines/tailwind.config.js

index 3f10af86c99350ec1f32f95b73a729c63d993da3..2d030fdfd6e9d9efe31275738f71c43b7a01f167 100755 (executable)
@@ -169,3 +169,74 @@ add_action('widgets_init', function () {
             'id'            => 'sidebar-footer-copyright'
         ] + $config);
 });
+
+/**
+ * Add Custom Styles to TinyMCE editor
+ */
+// https://codex.wordpress.org/TinyMCE_Custom_Styles
+// Callback function to insert 'styleselect' into the $buttons array
+add_filter( 'mce_buttons_2', function($buttons) {
+    array_unshift( $buttons, 'styleselect' );
+    return $buttons;
+});
+
+// Add format classes to style dropdown
+add_filter( 'tiny_mce_before_init', function($init_array) {
+
+    // Text size styles
+    $sizes = [
+        'sm' => 'Small',
+        'base' => 'Normal',
+        'lg' => 'Large',
+        'xl' => 'Extra Large',
+        '2xl' => 'XXL',
+    ];
+
+    $size_formats = [];
+
+    foreach ($sizes as $size => $size_label) {
+        $size_formats[] = [
+            'title' => $size_label,
+            'inline' => 'span',
+            'selector' => 'h1, h2, h3, h4, h5, p, div',
+            'classes' => 'text-'. $size,
+            'wrapper' => false,
+        ];
+    }
+
+    // Add submenu for font sizes
+    $style_formats[] = [
+        'title' => 'Font Size',
+        'items' => $size_formats,
+    ];
+
+    // Font weights
+    $weights = [
+        'normal',
+        'medium',
+        'semibold',
+    ];
+
+    $weight_formats = [];
+
+    foreach ($weights as $weight) {
+        $weight_formats[] = [
+            'title' => ucfirst($weight),
+            'inline' => 'span',
+            'selector' => 'h1, h2, h3, h4, h5, p, div, li',
+            'classes' => 'font-'. $weight,
+            'wrapper' => false,
+        ];
+    }
+
+    // Add submenu for font weights
+    $style_formats[] = [
+        'title' => 'Font Weight',
+        'items' => $weight_formats,
+    ];
+
+    // Insert the array, JSON ENCODED, into 'style_formats'
+    $init_array['style_formats'] = json_encode( $style_formats );
+
+    return $init_array;
+});
index b5dc881a0489f9f098d617bb6727728fcfff10eb..89da7be7db6a76d85f0a090ad1abebcaf49caf22 100644 (file)
@@ -11,5 +11,5 @@ img
   .rounded-full & // So this can be applied to parent element and also to override Elementor default CSS
     border-radius: 999px
 
-p:not(:last-child)
-  margin-bottom: 1.5em
+//p:not(:last-child)
+//  margin-bottom: 1.5em
diff --git a/web/app/themes/Usines/resources/assets/styles/components/forms.styl b/web/app/themes/Usines/resources/assets/styles/components/forms.styl
new file mode 100644 (file)
index 0000000..6291662
--- /dev/null
@@ -0,0 +1,41 @@
+input, textarea
+  &::-webkit-input-placeholder /* Chrome/Opera/Safari */
+    @apply text-dark
+  &::-moz-placeholder /* Firefox 19+ */
+    @apply text-dark
+  &:-ms-input-placeholder /* IE 10+ */
+    @apply text-dark
+  &:-moz-placeholder /* Firefox 18- */
+    @apply text-dark
+
+input, textarea, select
+  @apply bg-white w-full px-6 py-2 rounded-md
+  border: none
+  outline: none
+
+input[type="text"], input[type="email"], input[type="number"], select
+  appearance: none
+
+input[type="submit"]
+  width: auto
+
+select
+  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 15 9' xml:space='preserve'%3E%3Cg fill='none' stroke='%233b3b3b' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M13.9 1.3L7.5 7.7'/%3E%3Cpath d='M1.1 1.3l6.4 6.4'/%3E%3C/g%3E%3C/svg%3E") 98% center no-repeat
+  background-size: 0.8em auto
+
+textarea
+  min-height: 12rem
+  padding: 1em
+
+//================================
+
+.form-wrapper
+  > * + *
+    margin-top: 1.5rem
+
+.form-row
+  display: grid
+  constrain(grid-column-gap, 2vw)
+  // Automatic columns based on number of child elements
+  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr))
+  grid-row-gap: 1.5rem // When wrapping columns (to match vertical gap between other rows)
index 295b5bc17056d771431f43a2fc167f0fb52db61c..f6fda9f9e17b43aac7b5837ee21cba6d8bc39f0b 100644 (file)
@@ -1,5 +1,5 @@
 .nav-logo
-  @apply mx-20
+  @apply mx-20 w-full
   max-width: 156px
 
   +below(1600px)
index 5643b43d27ba14972d02196dcaba96c198ef8ee7..ba2d9667969b326d8203f2b889af5ebc1d99e6ab 100644 (file)
   font-weight: 300
 
   > * + * // Automatic spacing between direct child elements
-    margin-top: 1.5em
+    margin-top: 1.5rem
 
   h3 + p, h4 + p
-    margin-top: 0.5em
+    margin-top: 0.5rem
 
   h3
     @apply font-medium text-lg
index d88c1993fb972d1c45a8b467946095c15de09216..849a82f0857f53989d6ae2ee7f49073472997bc4 100644 (file)
@@ -1,7 +1,13 @@
 @extends('layouts.app')
 
 @section('content')
-  @while(have_posts()) @php(the_post())
-    @includeFirst(['partials.content-single-' . get_post_type(), 'partials.content-single'])
-  @endwhile
+
+  <div class="container-content py-2v px-1v">
+
+    @while(have_posts()) @php(the_post())
+      @includeFirst(['partials.content-single-' . get_post_type(), 'partials.content-single'])
+    @endwhile
+
+  </div>
+
 @endsection
index 008bb5d34a6865ce0151a9efa19182f6816a64d0..e45779f879daf8ba76560ce639237eb4b9c9b4a2 100644 (file)
@@ -8,7 +8,7 @@
         <span class="absolute block bg-beige" style="top: -0.1em; bottom: -0.15em; left: -0.325em; width: 36%; z-index: -1"></span>
       </h1>
       <div class="leading-loose">{{ $body }}</div>
-      <a href="{{ $cta_link }}" class="btn">{{ $cta_text }}</a>
+      <a href="{{ $cta_link['url'] }}" class="btn">{{ $cta_text }}</a>
     </div>
   </div>
 
index add8d375b35dc6afcbfa9e6927d8ba62ac6f7f5d..2a541e99b0e5ae91df8c60b072a888bf1e44801e 100644 (file)
@@ -71,7 +71,11 @@ module.exports = {
       './resources/assets/**/*.js',
     ],
     options: {
-      safelist: [].concat(
+      safelist: [
+        'mb-0!',
+        'pb-6',
+        'bg-light',
+      ].concat(
         require('purgecss-with-wordpress').whitelist,
         require('purgecss-with-wordpress').whitelistPatterns
       )