@asante-org/atlascopco-vt-litesitegenerator 3.0.15 → 3.0.18

package/dist/index.esm.scss

@@ -2737,153 +2737,130 @@
   position: relative;
   width: 100%;
   max-width: var(--lsg-image-max-width);
-  margin-inline: auto;
   font-family: var(--lsg-font-family-primary);
   border-radius: var(--lsg-image-container-radius, 0);
   overflow: var(--lsg-image-container-overflow, visible);
 }
-.lsg-image--full-width {
-  max-width: none;
-}
 .lsg-image__media {
   position: relative;
+  box-sizing: border-box;
   width: 100%;
   height: var(--lsg-image-height);
   overflow: var(--lsg-image-media-overflow, hidden);
   background: var(--lsg-image-bg);
-  box-sizing: border-box;
-}
-.lsg-image--parallax .lsg-image__media {
-  background-attachment: fixed;
-  background-size: cover;
-  background-position: center;
+  border-bottom: var(--lsg-image-media-border, none);
 }
-@media (max-width: 767px) {
-  .lsg-image--parallax .lsg-image__media {
-    background-attachment: scroll;
-  }
-}
-.lsg-image__picture {
-  position: absolute;
-  inset: 0;
+.lsg-image__picture, .lsg-image__picture picture {
+  display: block;
+  width: 100%;
+  height: 100%;
 }
 .lsg-image__img {
+  display: block;
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
      object-fit: cover;
-  display: block;
 }
 .lsg-image__link {
   position: absolute;
   inset: 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--lsg-color-primary);
-  cursor: pointer;
-  text-decoration: none;
   z-index: 2;
 }
 .lsg-image__link:focus-visible {
   outline: 2px solid var(--lsg-color-primary);
   outline-offset: -2px;
 }
-.lsg-image__overlay {
-  position: absolute;
-  inset: 0;
-  background: var(--lsg-image-link-overlay-bg);
-  opacity: 0;
-  transition: opacity var(--lsg-image-transition);
-  pointer-events: none;
-  z-index: 1;
-}
-@media (min-width: 768px) {
-  .lsg-image__link:hover + .lsg-image__overlay, .lsg-image__link:focus-visible + .lsg-image__overlay {
-    opacity: 1;
-  }
-}
 .lsg-image__tags {
   position: absolute;
-  left: var(--lsg-image-tags-inset);
+  z-index: 3;
+  left: var(--lsg-image-tags-position-left, var(--lsg-image-tags-inset));
   top: var(--lsg-image-tags-position-top, auto);
   bottom: var(--lsg-image-tags-position-bottom, var(--lsg-image-tags-inset));
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
+  display: flex;
+  flex-wrap: wrap;
   gap: var(--lsg-image-tag-gap);
   max-width: var(--lsg-image-tags-max-width-mobile);
-  z-index: 3;
+  pointer-events: none;
 }
 .lsg-image__tag {
-  height: var(--lsg-image-tag-height);
-  padding: 0 var(--lsg-image-tag-padding-x);
+  box-sizing: border-box;
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  border-radius: var(--lsg-theme-radius);
-  background-color: var(--lsg-image-tag-bg);
-  backdrop-filter: blur(var(--lsg-image-tag-blur, 0px));
-  -webkit-backdrop-filter: blur(var(--lsg-image-tag-blur, 0px));
-  border: var(--lsg-image-tag-border-width, 1px) var(--lsg-image-tag-border-style, solid) var(--lsg-image-tag-border);
-  font-size: var(--lsg-image-tag-font-size);
-  font-weight: var(--lsg-font-weight-semibold, 600);
+  height: var(--lsg-image-tag-height);
+  padding: 0 var(--lsg-image-tag-padding-x);
+  overflow: hidden;
+  background: var(--lsg-image-tag-bg);
+  border-width: var(--lsg-image-tag-border-width, 0);
+  border-style: var(--lsg-image-tag-border-style, solid);
+  border-color: var(--lsg-image-tag-border, transparent);
+  border-radius: var(--lsg-image-tag-radius, var(--lsg-theme-radius, 0));
+  backdrop-filter: blur(var(--lsg-image-tag-blur, 0));
+  -webkit-backdrop-filter: blur(var(--lsg-image-tag-blur, 0));
   color: var(--lsg-image-tag-color);
+  font-size: var(--lsg-image-tag-font-size);
+  font-weight: var(--lsg-image-tag-font-weight, 600);
+  line-height: var(--lsg-image-tag-line-height, 1.2);
+  text-align: center;
+  text-transform: var(--lsg-image-tag-text-transform, none);
   white-space: nowrap;
   transition: background-color var(--lsg-image-transition);
 }
 .lsg-image:hover .lsg-image__tag, .lsg-image:focus-within .lsg-image__tag {
-  background-color: var(--lsg-image-tag-bg-hover);
+  background: var(--lsg-image-tag-bg-hover);
 }
 .lsg-image__caption {
   position: var(--lsg-image-caption-position, relative);
   top: var(--lsg-image-caption-top, auto);
+  right: 0;
   bottom: var(--lsg-image-caption-bottom, auto);
   left: 0;
-  right: 0;
-  z-index: 2;
+  z-index: 3;
+  box-sizing: border-box;
   width: 100%;
   height: var(--lsg-image-caption-height);
   overflow: hidden;
-  box-sizing: border-box;
-  padding: var(--lsg-image-caption-padding-y) var(--lsg-image-caption-padding-x);
   display: flex;
   flex-direction: column;
   justify-content: center;
+  gap: var(--lsg-image-caption-gap, 8px);
+  padding: var(--lsg-image-caption-padding-y) var(--lsg-image-caption-padding-x);
   background: var(--lsg-image-caption-bg);
-  border-top: var(--lsg-image-divider-width) solid var(--lsg-image-divider-color);
+  pointer-events: none;
   transition: height var(--lsg-image-transition);
 }
 .lsg-image:hover .lsg-image__caption, .lsg-image:focus-within .lsg-image__caption {
   height: var(--lsg-image-caption-height-hover);
 }
 .lsg-image__title {
+  margin: 0;
+  color: var(--lsg-image-title-color);
   font-size: var(--lsg-image-title-font-size);
   font-weight: var(--lsg-font-weight-semibold, 600);
   line-height: 1.2;
-  color: var(--lsg-image-title-color);
-  margin: 0;
 }
 .lsg-image__text {
+  margin: 0;
+  padding-left: var(--lsg-image-text-indent, 0);
+  color: var(--lsg-image-text-color);
   font-size: var(--lsg-image-text-font-size);
   font-weight: var(--lsg-font-weight-regular, 400);
-  line-height: 1.4;
-  color: var(--lsg-image-text-color, var(--lsg-color-black, #090909));
-  margin: 4px 0 0;
+  line-height: 1.5;
   opacity: 0;
   transition: opacity var(--lsg-image-transition);
 }
-.lsg-image:hover .lsg-image__text, .lsg-image:focus-within .lsg-image__text {
+.lsg-image__text:only-child, .lsg-image:hover .lsg-image__text, .lsg-image:focus-within .lsg-image__text {
   opacity: 1;
 }
 @media (min-width: 768px) {
   .lsg-image__tags {
-    display: flex;
     flex-wrap: nowrap;
     max-width: var(--lsg-image-tags-max-width-desktop);
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .lsg-image__caption, .lsg-image__tag, .lsg-image__text, .lsg-image__overlay {
+  .lsg-image__caption, .lsg-image__tag, .lsg-image__text {
     transition: none;
   }
 }
@@ -3311,6 +3288,12 @@
   display: none;
 }
 
+@media (max-width: 767px) {
+  .lsg-group-display--flex.lsg-group-responsive-stack > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+    flex-direction: column;
+  }
+}
+
 .lsg-group-display--grid > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
   display: grid;
 }
@@ -3352,6 +3335,70 @@
   gap: var(--lsg-spacing-size-3XL);
 }
 
+.lsg-group-padding-top--4 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-top: var(--lsg-spacing-size-2XS);
+}
+
+.lsg-group-padding-top--8 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-top: var(--lsg-spacing-size-XS);
+}
+
+.lsg-group-padding-top--16 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-top: var(--lsg-spacing-size-SM);
+}
+
+.lsg-group-padding-top--24 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-top: var(--lsg-spacing-size-MD);
+}
+
+.lsg-group-padding-top--32 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-top: var(--lsg-spacing-size-LG);
+}
+
+.lsg-group-padding-top--64 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-top: var(--lsg-spacing-size-XL);
+}
+
+.lsg-group-padding-top--96 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-top: var(--lsg-spacing-size-2XL);
+}
+
+.lsg-group-padding-top--128 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-top: var(--lsg-spacing-size-3XL);
+}
+
+.lsg-group-padding-bottom--4 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-bottom: var(--lsg-spacing-size-2XS);
+}
+
+.lsg-group-padding-bottom--8 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-bottom: var(--lsg-spacing-size-XS);
+}
+
+.lsg-group-padding-bottom--16 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-bottom: var(--lsg-spacing-size-SM);
+}
+
+.lsg-group-padding-bottom--24 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-bottom: var(--lsg-spacing-size-MD);
+}
+
+.lsg-group-padding-bottom--32 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-bottom: var(--lsg-spacing-size-LG);
+}
+
+.lsg-group-padding-bottom--64 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-bottom: var(--lsg-spacing-size-XL);
+}
+
+.lsg-group-padding-bottom--96 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-bottom: var(--lsg-spacing-size-2XL);
+}
+
+.lsg-group-padding-bottom--128 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
+  padding-bottom: var(--lsg-spacing-size-3XL);
+}
+
 .lsg-group-padding-left--4 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
   padding-left: var(--lsg-spacing-size-2XS);
 }
@@ -6812,153 +6859,130 @@
   position: relative;
   width: 100%;
   max-width: var(--lsg-image-max-width);
-  margin-inline: auto;
   font-family: var(--lsg-font-family-primary);
   border-radius: var(--lsg-image-container-radius, 0);
   overflow: var(--lsg-image-container-overflow, visible);
 }
-.lsg-image--full-width {
-  max-width: none;
-}
 .lsg-image__media {
   position: relative;
+  box-sizing: border-box;
   width: 100%;
   height: var(--lsg-image-height);
   overflow: var(--lsg-image-media-overflow, hidden);
   background: var(--lsg-image-bg);
-  box-sizing: border-box;
-}
-.lsg-image--parallax .lsg-image__media {
-  background-attachment: fixed;
-  background-size: cover;
-  background-position: center;
-}
-@media (max-width: 767px) {
-  .lsg-image--parallax .lsg-image__media {
-    background-attachment: scroll;
-  }
+  border-bottom: var(--lsg-image-media-border, none);
 }
-.lsg-image__picture {
-  position: absolute;
-  inset: 0;
+.lsg-image__picture, .lsg-image__picture picture {
+  display: block;
+  width: 100%;
+  height: 100%;
 }
 .lsg-image__img {
+  display: block;
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
      object-fit: cover;
-  display: block;
 }
 .lsg-image__link {
   position: absolute;
   inset: 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--lsg-color-primary);
-  cursor: pointer;
-  text-decoration: none;
   z-index: 2;
 }
 .lsg-image__link:focus-visible {
   outline: 2px solid var(--lsg-color-primary);
   outline-offset: -2px;
 }
-.lsg-image__overlay {
-  position: absolute;
-  inset: 0;
-  background: var(--lsg-image-link-overlay-bg);
-  opacity: 0;
-  transition: opacity var(--lsg-image-transition);
-  pointer-events: none;
-  z-index: 1;
-}
-@media (min-width: 768px) {
-  .lsg-image__link:hover + .lsg-image__overlay, .lsg-image__link:focus-visible + .lsg-image__overlay {
-    opacity: 1;
-  }
-}
 .lsg-image__tags {
   position: absolute;
-  left: var(--lsg-image-tags-inset);
+  z-index: 3;
+  left: var(--lsg-image-tags-position-left, var(--lsg-image-tags-inset));
   top: var(--lsg-image-tags-position-top, auto);
   bottom: var(--lsg-image-tags-position-bottom, var(--lsg-image-tags-inset));
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
+  display: flex;
+  flex-wrap: wrap;
   gap: var(--lsg-image-tag-gap);
   max-width: var(--lsg-image-tags-max-width-mobile);
-  z-index: 3;
+  pointer-events: none;
 }
 .lsg-image__tag {
-  height: var(--lsg-image-tag-height);
-  padding: 0 var(--lsg-image-tag-padding-x);
+  box-sizing: border-box;
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  border-radius: var(--lsg-theme-radius);
-  background-color: var(--lsg-image-tag-bg);
-  backdrop-filter: blur(var(--lsg-image-tag-blur, 0px));
-  -webkit-backdrop-filter: blur(var(--lsg-image-tag-blur, 0px));
-  border: var(--lsg-image-tag-border-width, 1px) var(--lsg-image-tag-border-style, solid) var(--lsg-image-tag-border);
-  font-size: var(--lsg-image-tag-font-size);
-  font-weight: var(--lsg-font-weight-semibold, 600);
+  height: var(--lsg-image-tag-height);
+  padding: 0 var(--lsg-image-tag-padding-x);
+  overflow: hidden;
+  background: var(--lsg-image-tag-bg);
+  border-width: var(--lsg-image-tag-border-width, 0);
+  border-style: var(--lsg-image-tag-border-style, solid);
+  border-color: var(--lsg-image-tag-border, transparent);
+  border-radius: var(--lsg-image-tag-radius, var(--lsg-theme-radius, 0));
+  backdrop-filter: blur(var(--lsg-image-tag-blur, 0));
+  -webkit-backdrop-filter: blur(var(--lsg-image-tag-blur, 0));
   color: var(--lsg-image-tag-color);
+  font-size: var(--lsg-image-tag-font-size);
+  font-weight: var(--lsg-image-tag-font-weight, 600);
+  line-height: var(--lsg-image-tag-line-height, 1.2);
+  text-align: center;
+  text-transform: var(--lsg-image-tag-text-transform, none);
   white-space: nowrap;
   transition: background-color var(--lsg-image-transition);
 }
 .lsg-image:hover .lsg-image__tag, .lsg-image:focus-within .lsg-image__tag {
-  background-color: var(--lsg-image-tag-bg-hover);
+  background: var(--lsg-image-tag-bg-hover);
 }
 .lsg-image__caption {
   position: var(--lsg-image-caption-position, relative);
   top: var(--lsg-image-caption-top, auto);
+  right: 0;
   bottom: var(--lsg-image-caption-bottom, auto);
   left: 0;
-  right: 0;
-  z-index: 2;
+  z-index: 3;
+  box-sizing: border-box;
   width: 100%;
   height: var(--lsg-image-caption-height);
   overflow: hidden;
-  box-sizing: border-box;
-  padding: var(--lsg-image-caption-padding-y) var(--lsg-image-caption-padding-x);
   display: flex;
   flex-direction: column;
   justify-content: center;
+  gap: var(--lsg-image-caption-gap, 8px);
+  padding: var(--lsg-image-caption-padding-y) var(--lsg-image-caption-padding-x);
   background: var(--lsg-image-caption-bg);
-  border-top: var(--lsg-image-divider-width) solid var(--lsg-image-divider-color);
+  pointer-events: none;
   transition: height var(--lsg-image-transition);
 }
 .lsg-image:hover .lsg-image__caption, .lsg-image:focus-within .lsg-image__caption {
   height: var(--lsg-image-caption-height-hover);
 }
 .lsg-image__title {
+  margin: 0;
+  color: var(--lsg-image-title-color);
   font-size: var(--lsg-image-title-font-size);
   font-weight: var(--lsg-font-weight-semibold, 600);
   line-height: 1.2;
-  color: var(--lsg-image-title-color);
-  margin: 0;
 }
 .lsg-image__text {
+  margin: 0;
+  padding-left: var(--lsg-image-text-indent, 0);
+  color: var(--lsg-image-text-color);
   font-size: var(--lsg-image-text-font-size);
   font-weight: var(--lsg-font-weight-regular, 400);
-  line-height: 1.4;
-  color: var(--lsg-image-text-color, var(--lsg-color-black, #090909));
-  margin: 4px 0 0;
+  line-height: 1.5;
   opacity: 0;
   transition: opacity var(--lsg-image-transition);
 }
-.lsg-image:hover .lsg-image__text, .lsg-image:focus-within .lsg-image__text {
+.lsg-image__text:only-child, .lsg-image:hover .lsg-image__text, .lsg-image:focus-within .lsg-image__text {
   opacity: 1;
 }
 @media (min-width: 768px) {
   .lsg-image__tags {
-    display: flex;
     flex-wrap: nowrap;
     max-width: var(--lsg-image-tags-max-width-desktop);
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .lsg-image__caption, .lsg-image__tag, .lsg-image__text, .lsg-image__overlay {
+  .lsg-image__caption, .lsg-image__tag, .lsg-image__text {
     transition: none;
   }
 }