diff options
| author | Armand Philippot <git@armandphilippot.com> | 2022-04-19 12:07:21 +0200 |
|---|---|---|
| committer | Armand Philippot <git@armandphilippot.com> | 2022-04-19 12:07:21 +0200 |
| commit | a4a406463d69f6901919d273e831dff22a838caf (patch) | |
| tree | 112f3363bbf8382e5bb53d46f26198c0e4ce658f /src/components/organisms/images/gallery.module.scss | |
| parent | feaae9e550d2361cdd582f5a8c4298857ad8c7cf (diff) | |
chore: add a Gallery component
Diffstat (limited to 'src/components/organisms/images/gallery.module.scss')
| -rw-r--r-- | src/components/organisms/images/gallery.module.scss | 26 |
1 files changed, 26 insertions, 0 deletions
diff --git a/src/components/organisms/images/gallery.module.scss b/src/components/organisms/images/gallery.module.scss new file mode 100644 index 0000000..a057ed9 --- /dev/null +++ b/src/components/organisms/images/gallery.module.scss @@ -0,0 +1,26 @@ +@use "@styles/abstracts/mixins" as mix; +@use "@styles/abstracts/placeholders"; + +.wrapper { + @extend %reset-list; + + display: grid; + grid-template-columns: minmax(0, 1fr); + gap: var(--spacing-sm); + max-width: 100%; + margin: var(--spacing-sm) 0; + + @for $i from 0 to 6 { + &--#{$i}-columns { + @include mix.media("screen") { + @include mix.dimensions("xs") { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + + @include mix.dimensions("sm") { + grid-template-columns: repeat(#{$i}, minmax(0, 1fr)); + } + } + } + } +} |
