From e5da7579955b34a8da36935fe6d5ab456bd55d1e Mon Sep 17 00:00:00 2001
From: Stephen Cameron <stephen@cubedesigners.com>
Date: Tue, 15 Sep 2020 18:09:51 +0200
Subject: [PATCH] WIP #3890 @1.5

---
 .../src/Elementor/Widgets/HeaderSlideshow.php | 38 ++++++++++++-------
 .../styles/widgets/header-slideshow.styl      | 38 +++++++++++--------
 2 files changed, 47 insertions(+), 29 deletions(-)

diff --git a/wp-content/mu-plugins/cube/src/Elementor/Widgets/HeaderSlideshow.php b/wp-content/mu-plugins/cube/src/Elementor/Widgets/HeaderSlideshow.php
index 3dc4283..8ed4c38 100644
--- a/wp-content/mu-plugins/cube/src/Elementor/Widgets/HeaderSlideshow.php
+++ b/wp-content/mu-plugins/cube/src/Elementor/Widgets/HeaderSlideshow.php
@@ -64,14 +64,21 @@ class HeaderSlideshow extends _Base {
         );
 
         $this->add_control(
-            'content_image',
+            'title',
             [
-                'label' => __( 'Content Image', 'cube' ),
-                'type' => Controls_Manager::MEDIA,
-                'label_block' => true,
-                'default' => [
-                    'url' => Utils::get_placeholder_image_src(),
-                ],
+                'label' => __( 'Title', 'elementor' ),
+                'type' => Controls_Manager::TEXTAREA,
+                'placeholder' => __( 'Enter your title', 'elementor' ),
+                'default' => '',
+            ]
+        );
+
+        $this->add_control(
+            'body',
+            [
+                'label' => __('Body', 'cube'),
+                'type' => Controls_Manager::TEXTAREA,
+                'default' => '',
             ]
         );
 
@@ -109,7 +116,8 @@ class HeaderSlideshow extends _Base {
     protected function render() {
 
         $id = 'header_slideshow_' . $this->get_id();
-        $content_image = $this->get_settings('content_image');
+        $title = $this->get_settings('title');
+        $body = $this->get_settings('body');
         $images_desktop = $this->get_settings('images_desktop');
         $images_mobile = $this->get_settings('images_mobile');
 
@@ -157,13 +165,15 @@ class HeaderSlideshow extends _Base {
                 */
                 ?>
 
-                <?php if (isset($content_image['id']) && $content_image['id'] > 0): ?>
+                <?php if (!empty($title) || !empty($body)): ?>
+
+                    <h1 class="header-slideshow-content elementor-element elementor-invisible"
+                        data-settings='{"animation":"fadeInRight","animation_delay":0}'
+                        data-element_type="section">
+                        <span class="block text-xl mb-2"><?= $title ?></span>
+                        <span class="block text-2xl"><?= $body ?></span>
+                    </h1>
 
-                    <img src="<?= wp_get_attachment_image_url($content_image['id']) ?>"
-                         class="header-slideshow-content elementor-element elementor-invisible"
-                         data-settings='{"animation":"fadeInRight","animation_delay":0}'
-                         data-element_type="section"
-                         alt="<?= __('Bienvenue au CCV Montpellier - centre de chirurgie vertébrale de Montpellier') ?>">
                 <?php endif; ?>
 
             </div>
diff --git a/wp-content/themes/CCV/resources/assets/styles/widgets/header-slideshow.styl b/wp-content/themes/CCV/resources/assets/styles/widgets/header-slideshow.styl
index 4bb4d44..da06e27 100644
--- a/wp-content/themes/CCV/resources/assets/styles/widgets/header-slideshow.styl
+++ b/wp-content/themes/CCV/resources/assets/styles/widgets/header-slideshow.styl
@@ -78,21 +78,29 @@ $title_bg = rgba(#fff, 0.88)
 
 
   &-content
-    width: 50% // Size ratio for intermediate screens
-    max-width: 620px !important
-    z-index: 10
-    position: absolute
-    constrain(bottom, 9.2vw)
-    left: 6.4vw // Not using constrain because this shouldn't be capped on lower limits
-
-    +above($content-max-width)
-      left: 126px // From mockup
+    .header-slideshow & // Need some extra specificity to override H1 CSS
+      @apply text-purple-dark px-5 py-3
+      background: rgba(#fff, 0.8)
+      width: 50% // Size ratio for intermediate screens
+      max-width: 870px
+      z-index: 10
+      position: absolute
+      constrain(bottom, 9.2vw)
+      left: 6.4vw // Not using constrain because this shouldn't be capped on lower limits
+      margin-bottom: 0
+      text-transform: none
+
+      +above($content-max-width)
+        left: 126px // From mockup
+
+      +below($breakpoint-slideshow)
+        bottom: 4em
 
-    +below($breakpoint-slideshow)
-      bottom: 4em
+      +below($breakpoint-slideshow-images)
+        width: 75%
 
-    +below($breakpoint-slideshow-images)
-      width: 75%
+      &:before
+        constrain(left, -1.7vw)
 
-    .elementor-editor-active &, .elementor-editor-preview &
-      visibility: visible // Animation doesn't trigger in the editor for some reason so just show it
+      .elementor-editor-active &, .elementor-editor-preview &
+        visibility: visible // Animation doesn't trigger in the editor for some reason so just show it
-- 
2.39.5