Skip to content
Snippets Groups Projects
Unverified Commit c2435983 authored by Alexis BENOIT's avatar Alexis BENOIT Committed by GitHub
Browse files

Merge pull request #267 from noesya/new-gallery-grid

Bloc galerie grille, plus large compatibilité navigateur 
parents c1ddf558 5b751047
No related branches found
No related tags found
No related merge requests found
......@@ -128,6 +128,13 @@ $space-unit: 4 !default
@include media-breakpoint-down(desktop)
grid-gap: $grid-gutter-sm
@mixin flexbox-grid($cols: 12, $gap-y: $grid-gutter, $gap-x: $gap-y)
display: flex
flex-wrap: wrap
gap: $gap-y $gap-x
> *
flex: 0 0 calc(#{100 / $cols}% - #{$gap-x} * #{($cols - 1) / $cols} )
// This must be used for content inside columns
@function col($quantity, $base: 12)
$quantity-on-base: $quantity / $base * 12
......
......@@ -32,18 +32,17 @@
.gallery
align-items: baseline
@include in-page-with-sidebar
@include grid(3, desktop, half($grid-gutter), half($grid-gutter))
@include flexbox-grid(3, half($grid-gutter))
@include in-page-without-sidebar
@include grid(4, desktop)
@include flexbox-grid(4)
@include media-breakpoint-down(desktop)
@include grid(2)
grid-gap: half($grid-gutter-sm) !important
@include flexbox-grid(2, half($grid-gutter-sm))
&--with-text
@include in-page-without-sidebar
@include grid(4, desktop, $spacing0)
@include flexbox-grid(4, half($grid-gutter), $grid-gutter)
figure
display: grid
grid-template-columns: subgrid
display: flex
flex-direction: column
gap: space(3)
figcaption
&::after
......
......@@ -13,13 +13,13 @@
{{ if not site.Params.image_sizes.design_system.lightbox.disabled }}
{{ $lightbox_text := false }}
{{ if and .text .credit }}
{{ $lightbox_text = delimit (slice .text .credit) " / " }}
{{ else }}
{{ $lightbox_text = delimit (slice .text .credit) " | " }}
{{ else if or .text .credit }}
{{ $lightbox_text = or .text .credit }}
{{ end }}
<a class="glightbox"
role="button"
data-glightbox="type: image;{{ if $lightbox_text }}description: {{ partial "PrepareHTML" $lightbox_text }}{{ end }}"
data-glightbox="type: image; {{ if $lightbox_text }}description: {{ partial "PrepareText" $lightbox_text }}{{ end }}"
href="{{ partial "GetLightboxUrl" (dict "id" .id) }}"
title="{{- i18n "commons.lightbox.link.title" -}}"
aria-label="{{- i18n "commons.lightbox.link.title" -}}">
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment