diff --git a/web/src/components/blocks/imageSliderBlock.module.scss b/web/src/components/blocks/imageSliderBlock.module.scss index 41c5201..5360fb9 100644 --- a/web/src/components/blocks/imageSliderBlock.module.scss +++ b/web/src/components/blocks/imageSliderBlock.module.scss @@ -30,13 +30,15 @@ figcaption { position: absolute; - bottom: 0; - max-width: var(--size-width-p); + bottom: var(--spacing-s); + width: var(--size-width-p); + max-width: calc(100% - (var(--spacing-sitepadding-inline)*2)) ; margin: 0 auto; - padding: .75rem var(--spacing-s); + padding: var(--spacing-xs) var(--spacing-s); font-size: var(--font-size-caption); - line-height: 1.4; - background: rgba(0, 0, 0, .6); + line-height: 1.2; + background: rgba(0, 0, 0, .7); + color: var(--color-white); } } @@ -47,4 +49,10 @@ &[data-hero] { margin-top: calc(var(--spacing-sitepadding-block)* -2); } +} + +@media (max-width: 600px) { + .imageSliderBlock { + padding-top: 100%; + } } \ No newline at end of file diff --git a/web/src/components/blocks/swiper.scss b/web/src/components/blocks/swiper.scss index 9659fcb..db45429 100644 --- a/web/src/components/blocks/swiper.scss +++ b/web/src/components/blocks/swiper.scss @@ -48,7 +48,7 @@ .swiper-pagination { display: inline-block; width: auto; - margin: var(--spacing-sitepadding-block) var(--spacing-sitepadding-inline); + margin: var(--spacing-s) var(--spacing-sitepadding-inline); padding: 0 var(--spacing-xs); border-radius: 2rem; background: rgba(0, 0, 0, 0.6); diff --git a/web/src/components/general/image.module.scss b/web/src/components/general/image.module.scss index 25dbdfd..08484be 100644 --- a/web/src/components/general/image.module.scss +++ b/web/src/components/general/image.module.scss @@ -62,7 +62,7 @@ bottom: 0; right: 0; display: inline-block; - padding: .1rem .2rem; + padding: 0 .2rem; font-size: .6rem; background: var(--color-black); color: var(--color-betongGray);