]> _ Git - sycomore-fondation.git/commitdiff
wip #5874 @7:00
authorsoufiane <soufiane@cubedesigners.com>
Thu, 4 May 2023 16:33:32 +0000 (18:33 +0200)
committersoufiane <soufiane@cubedesigners.com>
Thu, 4 May 2023 16:33:32 +0000 (18:33 +0200)
wp-content/mu-plugins/cube/Init.php
wp-content/mu-plugins/cube/Widgets/CarouselSelection.php [new file with mode: 0644]
wp-content/mu-plugins/cube/Widgets/HighlightTitle.php
wp-content/themes/sycomore-fondation/resources/scripts/carousel.js [new file with mode: 0644]
wp-content/themes/sycomore-fondation/resources/styles/common/global.sass
wp-content/themes/sycomore-fondation/resources/styles/common/helpers.sass

index 2016db8bcd60167028bd3346b2b41e70ab061a7d..6d9b794679ebdc16630298a2e895ffa9fc05c5f2 100644 (file)
@@ -22,7 +22,6 @@ class Setup {
 
         $this->customise_sections();
         $this->customise_widget();
-        $this->customise_container();
     }
 
     public function register_widgets($widgets_manager) {
@@ -169,20 +168,12 @@ class Setup {
     public function customise_widget() {
         // Add some extra hooks that we can use on the Elementor elements...
         add_action('elementor/frontend/widget/before_render', function (Element_Base $element) {
-            // Add number child items in this container
-            //$element->add_render_attribute('_wrapper', 'class', 'm-0');
-
+            if($element->get_name() === "image") {
+                $element->add_render_attribute('_wrapper', 'class', 'image-single-container');
+            }
         }, 10, 3);
     }
 
-    public function customise_container() {
-        // Add some extra hooks that we can use on the Elementor elements...
-        add_action('elementor/frontend/container/before_render', function (Element_Base $element) {
-            // Add number child items in this container
-           var_dump($element);
-        });
-    }
-
     public static function spacing_options() {
         // List of base spacing scales along with their descriptions
         // Note: this should match what is in the theme's `tailwind.config.cjs`
@@ -193,7 +184,7 @@ class Setup {
             '2xs' => '2XS (8px — 10px)',
             'xs' => 'XS (12px — 15px)',
             's' => 'S (16px — 20px)',
-            'm' => 'M (24px — 30px)',
+            'm' => 'M (23px)',
             'l' => 'L (32px — 40px)',
             'xl' => 'XL (48px — 60px)',
             '2xl' => '2XL (64px — 80px)',
@@ -217,6 +208,7 @@ class Setup {
             'm-xl' => 'M ↔ XL (24px — 60px)',
             'l-xl' => 'L ↔ XL (34px — 86px)',
             'l-2xl' => 'L ↔ 2XL (38px — 86px)',
+            '2xl-custom' => '2XL (72px — 86px)',
             '2xl-5xl' => '2XL ↔ 5XL (72px — 126px)',
         ];
     }
diff --git a/wp-content/mu-plugins/cube/Widgets/CarouselSelection.php b/wp-content/mu-plugins/cube/Widgets/CarouselSelection.php
new file mode 100644 (file)
index 0000000..bde9573
--- /dev/null
@@ -0,0 +1,36 @@
+<?php
+
+namespace Cube\Widgets;
+
+use Elementor\Controls_Manager;
+
+class CarouselSelection extends _Base
+{
+
+    public function get_name()
+    {
+        return 'cube-carousel-selection';
+    }
+
+    public function get_title()
+    {
+        return esc_html__('Carousel selection', 'cube');
+    }
+
+    public function get_icon()
+    {
+        return 'eicon-post-title';
+    }
+
+    protected function register_controls()
+    {
+        $this->start_controls_section(
+            'content_section',
+            [
+                'label' => esc_html__('Content', 'cube'),
+                'tab' => Controls_Manager::TAB_CONTENT,
+            ]
+        );
+    }
+
+}
\ No newline at end of file
index 5093249108e656ec2bff092f999242d9a5872d1c..db41ff1bb04679c1d240bbbb11b593a1a93bc5a8 100644 (file)
@@ -118,6 +118,27 @@ class HighlightTitle extends _Base {
                 'toggle' => true,
             ]
         );
+
+        $this->add_control(
+        'text_position',
+           [
+               'label' => esc_html__( 'Text position', 'cube' ),
+               'type' => Controls_Manager::SELECT,
+               'options' => [
+                   'left' => [
+                       'title' => esc_html__( 'Left', 'cube' ),
+                   ],
+                   'center' => [
+                       'title' => esc_html__( 'Center', 'cube' ),
+                   ],
+                   'right' => [
+                       'title' => esc_html__( 'Right', 'cube' ),
+                   ]
+               ],
+               'default' => 'right',
+               'toggle' => true,
+           ]
+        );
     }
 
     /**
@@ -134,6 +155,7 @@ class HighlightTitle extends _Base {
         $title_tag = $this->get_settings('title_tag');
         $size = $this->get_settings('text_size');
         $weight = $this->get_settings('text_weight');
+        $position = $this->get_settings('text_position');
 
         $size_classes = [
             'large' => 'text-lg',
@@ -144,7 +166,7 @@ class HighlightTitle extends _Base {
         $this->add_inline_editing_attributes('title', 'none');
 
         // CSS Classes for elements
-        $this->add_render_attribute('title', 'class', ["highlight relative font-$weight $size_classes[$size]"]);
+        $this->add_render_attribute('title', 'class', ["highlight relative font-$weight $size_classes[$size] auto-$position"]);
 
         // Rendered content
 
@@ -171,12 +193,18 @@ class HighlightTitle extends _Base {
         weight_classes = {
             'bold': 'font-bold',
             'semibold': 'font-semibold',
-        }
+        };
+
+        position_classes = {
+            'left': 'auto-left',
+            'center': 'auto-center',
+            'right': 'auto-right',
+        };
 
         view.addRenderAttribute(
             'title',
             {
-                'class': [ 'highlight', weight_classes[settings.text_weight], size_classes[settings.text_size] ]
+                'class': [ 'highlight', weight_classes[settings.text_weight], size_classes[settings.text_size], position_classes[settings.text_position] ]
             }
         );
 
@@ -184,10 +212,10 @@ class HighlightTitle extends _Base {
         #>
 
         <# if ('' !== settings.title) { #>
-        <{{{ settings.title_tag }}} {{{ view.getRenderAttributeString( 'title' ) }}}>
-            <span class="relative z-1">{{{ settings.title }}}</span>
-            <span class='highlight-bar'></span>
-        </{{{ settings.title_tag }}}>
+            <{{{ settings.title_tag }}} {{{ view.getRenderAttributeString( 'title' ) }}}>
+                <span class="relative z-1">{{{ settings.title }}}</span>
+                <span class='highlight-bar'></span>
+            </{{{ settings.title_tag }}}>
         <# } #>
 
         <?php
diff --git a/wp-content/themes/sycomore-fondation/resources/scripts/carousel.js b/wp-content/themes/sycomore-fondation/resources/scripts/carousel.js
new file mode 100644 (file)
index 0000000..03db599
--- /dev/null
@@ -0,0 +1,10 @@
+console.log('ok')
+
+window.addEventListener('elementor/frontend/init', function () {
+
+  elementorFrontend.hooks.addAction('frontend/element_ready/cube-staff-carousel.default', async function() {
+    import 'swiper/css';
+    const { Swiper } = await import('swiper');
+  })
+
+})
index b720e10930a6d681586de412c62fdc3713eeb736..bbfceaf4774cb2294ffa739a9b0664609aa1ad4c 100644 (file)
@@ -55,3 +55,9 @@ h1,h2,h3,h4,h5,h6
   &:not(.highlight)
     font-family: "Circe", sans-serif
     line-height: 100%
+
+body,p,a
+  color: map-get($colors, 'grey','dark')
+
+.image-single-container img
+  border-radius: 3px
index 97b89d401a0a972ded1243730a6a0232b902c92e..4c194e7f705dde6b339aa3e6b97b988618986f6a 100644 (file)
@@ -1,7 +1,8 @@
 $fontSizes: ( '3xl': 9.313rem,'2xl': 4.768rem,'xl': 3.815rem,'lg': 1.953rem,'md': 1.25rem, 'sm': 1rem)
 $fontWeights: (light: 300,normal: 400,medium: 500,semibold: 600,bold: 700,'extra-bold': 800,black: 900)
-$colors: ('red': ('full': '#F42865','clear': '#707070','transparent': 'rgba(249,195,211,.5)'),'turquoise': '#28CABD','blue': ('full': '#092CC8','clear': '#C3CBF0'),'orange': ( 'full': '#FD6120','transparent': 'rgba(255,226,199,.5)'),'grey': ('disabled': '#B0B4C1','dark': '#141414'))
+$colors: ('red': ('full': #F42865,'clear': #707070,'transparent': rgba(249,195,211,.5)),'turquoise': #28CABD,'blue': ('full': #092CC8,'clear': #C3CBF0),'orange': ( 'full': #FD6120,'transparent': rgba(255,226,199,.5)),'grey': ('disabled': #B0B4C1,'dark': #141414))
 $breakpoint: ('phone': '500px', 'tablet': '768px', 'small-desktop': '1024px', 'desktop': '1344px', 'widescreen': '1680px')
+$textPositions: ('left','center','right')
 
 @for $i from 1 through 12
   .col-#{$i}
@@ -30,6 +31,13 @@ $breakpoint: ('phone': '500px', 'tablet': '768px', 'small-desktop': '1024px', 'd
   +screen-size('widescreen')
     gap: #{$y}vw 21px
 
+@each $textPosition in $textPositions
+  .auto-#{$textPosition}
+    @if $textPosition == "center"
+      margin: auto
+    @else
+      margin-#{$textPosition}: auto
+
 /* @link https://utopia.fyi/space/calculator?c=320,16,1.125,1344,16,1.25,6,2,&s=0.75|0.5|0.25,1.5|2|3|4|6|7|8,s-l|m-xl|l-2xl|2xl-4xl&g=s,l,xl,12 */
 
 \:root
@@ -37,7 +45,7 @@ $breakpoint: ('phone': '500px', 'tablet': '768px', 'small-desktop': '1024px', 'd
   --space-2xs: clamp(0.50rem, calc(0.50rem + 0.00vw), 0.50rem)
   --space-xs: clamp(0.75rem, calc(0.75rem + 0.00vw), 0.75rem)
   --space-s: clamp(1.00rem, calc(1.00rem + 0.00vw), 1.00rem)
-  --space-m: clamp(1.50rem, calc(1.50rem + 0.00vw), 1.50rem)
+  --space-m: clamp(1.44rem, calc(1.44rem + 0.00vw), 1.44rem)
   --space-l: clamp(2.00rem, calc(2.00rem + 0.00vw), 2.00rem)
   --space-xl: clamp(3.00rem, calc(3.00rem + 0.00vw), 3.00rem)
   --space-2xl: clamp(4.00rem, calc(4.00rem + 0.00vw), 4.00rem)
@@ -61,6 +69,7 @@ $breakpoint: ('phone': '500px', 'tablet': '768px', 'small-desktop': '1024px', 'd
   --space-s-l: clamp(1.00rem, calc(0.69rem + 1.56vw), 2.00rem)
   --space-m-xl: clamp(1.50rem, calc(1.03rem + 2.34vw), 3.00rem)
   --space-l-2xl: clamp(2.375rem, calc(1.38rem + 3.13vw), 5.375rem)
+  --space-2xl-custom: clamp(4.63rem, calc(4.39rem + 1.17vw), 5.38rem)
   --space-2xl-4xl: clamp(4.00rem, calc(3.06rem + 4.69vw), 7.00rem)
   --space-2xl-5xl: clamp(4.00rem, calc(2.75rem + 6.25vw), 7.875rem)