Merge branch 'feature/TCI-1176--edit-button-video-issue' into 2.x

JudicialCouncilOfCalifornia · Mar 1, 2024 · 6144060 · 6144060
2 parents ef55c14 + 51f01e6
commit 6144060
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 46 deletions.
diff --git a/source/_patterns/02-molecules/video/_video.scss b/source/_patterns/02-molecules/video/_video.scss
@@ -57,3 +57,36 @@
     }
   }
 }
+
+/* media edit button fix */
+.jcc-video__video-container{
+  @include u-position(relative);
+  @include u-height(0);
+}
+
+.jcc-video__video-container-editor {
+  @include u-display(flex);
+  flex-direction: column;
+  justify-content: space-evenly;
+  gap: 10px;
+  height: auto;
+  padding-bottom: 10px !important;
+}
+
+.jcc-video__video-container-editor  > .embed-responsive-item {
+  position: relative;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  margin: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.jcc-video__video-container > .embed-responsive-item {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
diff --git a/source/_patterns/02-molecules/video/video.twig b/source/_patterns/02-molecules/video/video.twig
@@ -49,23 +49,15 @@
 {% endif %}
 
 {# Video layout classes #}
-{% if video_classes %}
-  {% set video_classes= video.video_classes %}
-{% else %}
-  {% set video_classes= "" %}
-{% endif %}
+{% set video_classes =  video_classes ? video.video_classes : ""%}
 
-{# if in ckeditor #}
-{% if "media/body/preview" in video.path %}
- {% set added_class = "video-container-editor" %}
-{% else %}
- {% set added_class = "video-container embed-responsive" %}
-{% endif %}
+{# set classes accrdoing to page : in ckeditor or  display page #}
+{% set added_class =  "media/body/preview" in video.path ? "jcc-video__video-container-editor" : "jcc-video__video-container embed-responsive" %}
 
 {% set classes = [
   'jcc-video',
   video_classes,
-  added_class 
+  added_class
 ]|merge(video.classes|default([])) %}
 
 <div class="{{ classes|join(' ') }}" style="padding-bottom: {{ ratio * 100 }}%;">
@@ -78,4 +70,4 @@
   {% if video.cover %}
     <button class="jcc-video__cover" style="background-image: url({{ video.cover }});">{{ "Play video"|t }}</button>
   {% endif %}
-</div>
+</div>
diff --git a/source/css/_video_embed.scss b/source/css/_video_embed.scss