Slider et visionneuse : améliorations multiples (#744)

assets/sass/_theme/components/lightbox.sass

@@ -50,15 +50,15 @@
         > button
             @include button-reset
             @include meta
-            background-color: var(--color-background)
-            color: var(--color-text)
+            background-color: $lightbox-button-background-color
+            color: $lightbox-button-color
             height: $spacing-4
             outline-color: $lightbox-focus-outline-color
             margin: 0
             padding: 0
             width: $spacing-4
             &:not(:last-child)
-                border-right: 1px solid var(--color-border)
+                border-right: 1px solid $lightbox-button-border-color
             &.lightbox-button-next
                 @include icon(arrow-right-s-line, before)
             &.lightbox-button-previous
@@ -76,15 +76,16 @@
             &.lightbox-button-close
                 @include icon(close-line, before)
             &[aria-expanded='true']
-                background-color: var(--color-text)
-                color: var(--color-background)
+                background-color: $lightbox-button-color
+                color: $lightbox-button-background-color
             &:disabled
-                background: var(--color-background-alt)
+                background: $lightbox-button-disabled-background
                 &::before
-                    color: var(--color-border)
+                    color: $lightbox-button-disabled-color
     &-detail
-        background-color: var(--color-background)
+        background: $lightbox-detail-background
         bottom: calc(var(--spacing-4) + var(--spacing-2) + 1px)
+        color: $lightbox-detail-color
         display: none
         padding: $spacing-2
         position: fixed
@@ -95,7 +96,7 @@
             width: columns(6)
         &__title, &__close
             @include meta
-            color: var(--color-text-alt)
+            color: $lightbox-detail-meta-color
         &__close
             @include button-reset
             cursor: pointer

assets/sass/_theme/configuration/components.sass

@@ -92,8 +92,16 @@ $breadcrumb-icon-color: var(--color-text-alt) !default
 
 // Lightbox
 $lightbox-backdrop: blur(5px) !default
-$lightbox-background-color: rgba(0, 0, 0, 0.80) !default
-$lightbox-focus-outline-color: white !default
+$lightbox-background-color: white !default
+$lightbox-button-background-color: var(--color-background) !default
+$lightbox-button-color: var(--color-text) !default
+$lightbox-button-border-color: var(--color-border) !default
+$lightbox-button-disabled-background: var(--color-background-alt) !default
+$lightbox-button-disabled-color: var(--color-border) !default
+$lightbox-detail-background: var(--color-background) !default
+$lightbox-detail-color: var(--color-text) !default
+$lightbox-detail-meta-color: var(--color-text-alt) !default
+$lightbox-focus-outline-color: black !default
 
 // Table of content
 $toc-color: var(--color-text) !default

layouts/partials/blocks/templates/gallery/carousel-image.html

-{{ partial "commons/image-figure.html" (dict
-    "image"    .params
-    "sizes"    site.Params.image_sizes.blocks.gallery.carousel
-    "is_gallery" true
-    "role"    "tabpanel"
-  )
-}}
\ No newline at end of file

layouts/partials/blocks/templates/gallery/images.html

-{{- $has_text := false -}}
-{{- range .images }}
-  {{- if .text }}
-    {{- $has_text = true -}}
-  {{ end -}}
-{{ end -}}
-
-{{ $sizes := "" }}
-{{if eq .layout "grid"}}
-  {{ $sizes = site.Params.image_sizes.blocks.gallery.grid }}
-{{ else if eq .layout "large" }}
-  {{ $sizes = site.Params.image_sizes.blocks.gallery.large }}
-{{ else }}
-  {{ $sizes = site.Params.image_sizes.blocks.image }}
-{{ end }}
-
-{{ $totalimages := .images | len }}
-<div class="gallery{{- if $has_text }} gallery--with-text {{ end -}}">
-{{ range $index, $image := .images }}
-  {{ partial "commons/image-figure.html" (dict
-    "image"    .
-    "sizes"    $sizes
-    "is_gallery" true
-    "index"    $index
-    "total"    $totalimages
-    )
-  }}
-{{ end }}
-</div>
\ No newline at end of file