@simple-reporting/base 1.0.37 → 1.0.38

package/livingdocs/040.Media/020.image/scss/editor.scss

@@ -1,6 +1,5 @@
 @use "srl";
 @use "web";
-@use "@/assets/scss/placeholders";
 
 .srl-image__alt-text{
   @include srl.typography-caption();

package/livingdocs/040.Media/020.image/scss/general.scss

@@ -1,5 +1,6 @@
 @use 'srl';
-@use "@/assets/scss/placeholders";
+@use "@/assets/scss/margins";
+@use "spacing-variations";
 
 .srl-grid--media {
   .srl-full-width & {
@@ -7,10 +8,13 @@
   }
 }
 
+@include margins.srl-component-margin(spacing-variations.$margins);
+
 .srl-image__caption {
   @include srl.spacer-margin-top(100);
 }
 
 .srl-image__caption-text {
   @include srl.typography-caption();
-}
+  @extend %srl-regular-width;
+}

package/livingdocs/040.Media/020.image/scss/pdf.scss

@@ -23,8 +23,4 @@ $page-margin-left: srl.system-size-unit(map.get(srl.$meta, pdf, margin, left));
     width: 210mm;
     min-width: 210mm;
   }
-}
-
-.srl-image__caption-text {
-  @include srl.grid-pdf-flex-col(6);
 }

package/livingdocs/040.Media/020.image/scss/web.scss

@@ -1,9 +1,4 @@
 @use "srl";
-@use "@/assets/scss/placeholders";
-
-.srl-image__caption-text {
-  @extend %srl-regular-width;
-}
 
 .srl-image__image-container--desktop {
   display: none;

package/livingdocs/040.Media/020.image/scss/xbrl.scss

@@ -1,5 +1,3 @@
 @use 'srl';
+@use 'general';
 
-.srl-image__caption-text {
-  @include srl.typography-caption();
-}

package/livingdocs/040.Media/030.video/scss/_spacing-variations.scss

@@ -0,0 +1,7 @@
+$margins: (
+  ('.srl-video', '*'): 800,
+  ('.srl-video', '.srl-columns'): 400,
+  ('.srl-video', '.srl-pdf-pagebreak'): 800,
+  ('.srl-video', '.srl-anchor'): 800,
+  ('.srl-video', '.srl-background-container'): 1600,
+)

package/livingdocs/040.Media/030.video/scss/general.scss

@@ -1,11 +1,30 @@
 @use 'srl';
+@use "@/assets/scss/margins";
+@use "spacing-variations";
+
+.srl-grid--media {
+  .srl-full-width & {
+    @extend %srl-grid-reset;
+  }
+}
 
 .srl-video {
   display: block;
 }
 
+@include margins.srl-component-margin(spacing-variations.$margins);
+
+.srl-video__thumbnail {
+  @extend %srl-regular-width;
+
+  .srl-wide-width & {
+    @extend %srl-wide-width;
+  }
+}
+
 .srl-video__video-link-container {
   @include srl.spacer-margin-top(100);
+  @extend %srl-regular-width;
 }
 
 .srl-video__video-link {

package/livingdocs/040.Media/030.video/scss/pdf.scss

@@ -13,19 +13,9 @@ $page-margin-left: srl.system-size-unit(map.get(srl.$meta, pdf, margin, left));
 }
 
 .srl-video__thumbnail {
-  @include srl.grid-pdf-flex-col(6);
-
-  .srl-wide-width & {
-    @include srl.grid-pdf-flex-col(8);
-  }
-
   .srl-full-width & {
     width: 210mm;
     min-width: 210mm;
   }
 }
 
-.srl-video__video-link-container {
-  @include srl.grid-pdf-flex-col(6);
-}
-

package/livingdocs/040.Media/030.video/scss/web.scss

@@ -1,11 +1,4 @@
 @use "srl";
-@use "@/assets/scss/placeholders";
-
-.srl-grid--media {
-  .srl-full-width & {
-    @extend %srl-grid-reset;
-  }
-}
 
 .srl-video__inner {
   position: relative;
@@ -73,10 +66,6 @@
   }
 }
 
-.srl-video__video-link-container {
-  @extend %srl-regular-width;
-}
-
 .srl-video__started {
     .srl-video__thumbnail,
     .srl-video__play {

package/livingdocs/040.Media/030.video/scss/xbrl.scss

@@ -1,5 +1,2 @@
 @use 'srl';
-
-.srl-image__caption-text {
-  @include srl.typography-caption();
-}
+@use "general";

package/livingdocs/060.Buttons/020.button/scss/general.scss

@@ -1,89 +1,28 @@
 @use "srl";
-@use "@/assets/scss/placeholders";
-
-.srl-button {
-  display: flex;
-  gap: srl.spacer-get(100);
-  align-items: center;
-  padding: srl.spacer-get(200);
-  background-color: srl.colors-white-1000();
-  border: 1px solid srl.colors-primary-1000();
-  text-decoration: none;
-  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
-  border-radius: srl.system-size-unit(24);
-  cursor: pointer;
-  @include srl.typography-button-text();
-
-  @media (prefers-reduced-motion: reduce) {
-    transition-duration: 0s;
-  }
-
-  &.srl-has-icon,
-  [class*="-after"] &,
-  .srl-header__meta-navigation &,
-  &[class*="-before"],
-  &[class*="-after"] {
-    padding:  srl.system-size-unit(11) srl.spacer-get(200);
-  }
-
- [class*="-after"] &,
-  &[class*="-after"] {
-    flex-direction: row-reverse;
-  }
-
-  &[aria-expanded="true"] {
-    border-bottom: none;
-    border-bottom-left-radius: 0;
-    border-bottom-right-radius: 0;
-  }
-
-  &:hover {
-      background-color: srl.colors-primary-1000();
-    //border-color: srl.colors-white-1000();
-    color: srl.colors-white-1000();
-
-    &[aria-expanded="true"] {
-      border-color: srl.colors-primary-1000();
-    }
-
-    .srl-bg-primary-1000 & {
-      border-color: srl.colors-secondary-1000();
-      background-color: srl.colors-secondary-1000();
-    }
-  }
-
-  &:focus {
-    background-color: srl.colors-primary-1000();
-    border-color: srl.colors-primary-1000();
-    color: srl.colors-white-1000();
-
-    .srl-bg-primary-1000 & {
-      background-color: srl.colors-primary-1000();
-      border-color: srl.colors-primary-1000();
-      color: srl.colors-white-1000();
-    }
-  }
-}
+@use "srl/fa";
 
 .srl-button__icon {
   display: none;
 
-  [class*="srl-icon-"][class*="-before"] &,
-  [class*="srl-icon-"][class*="-after"] & {
+  [class*="srl-button-icon-"][class*="-before"] &,
+  [class*="srl-button-icon-"][class*="-after"] & {
     display: block;
-    @extend %srl-icon;
-    @extend %srl-icon-mask;
+    @extend %srl-icon-base;
+  }
+
+  [class*="srl-button-icon-"][class*="-after"] & {
+    order: 2;
   }
 
-  .srl-icon-arrow-left-before & {
-    @extend %srl-icon-arrow-left;
+  .srl-button-icon-arrow-left-before & {
+    @include fa.icon(chevron-left);
   }
 
-  .srl-icon-arrow-right-after & {
-    @extend %srl-icon-arrow-right;
+  .srl-button-icon-arrow-right-after & {
+    @include fa.icon(chevron-right);
   }
 
-  .srl-icon-download-after & {
-    @extend %srl-icon-download;
+  .srl-button-icon-download-after & {
+    @include fa.icon(download);
   }
 }

package/livingdocs/070.Container/020.columns-container/columns-container.html

@@ -1,4 +1,4 @@
-<div class="srl-grid srl-columns">
+<div class="srl-grid srl-columns srl-nested-container">
   <div class="srl-grid__inner srl-flex srl-flex-gap">
     <div
       class="srl-columns__column srl-columns__column--1"

package/livingdocs/070.Container/030.background-container/background-container.html

@@ -0,0 +1,3 @@
+<div class="srl-background-container srl-nested-container" doc-container="content">
+
+</div>

package/livingdocs/070.Container/030.background-container/ld-conf.json

@@ -0,0 +1,4 @@
+{
+  "name": "background-container",
+  "label": "Background container"
+}

package/livingdocs/070.Container/030.background-container/properties.json

@@ -0,0 +1 @@
+{}

package/livingdocs/070.Container/030.background-container/scss/_spacing-variations.scss

@@ -0,0 +1,3 @@
+$margins: (
+  ('.srl-background-container', '*'): 1600
+)

package/livingdocs/070.Container/030.background-container/scss/general.scss

@@ -0,0 +1,9 @@
+@use "srl";
+@use "@/assets/scss/margins";
+@use "spacing-variations";
+
+.srl-background-container {
+  padding-block: srl.spacer-get(800);
+}
+
+@include margins.srl-component-margin(spacing-variations.$margins);

package/livingdocs/070.Container/030.background-container/scss/pdf.scss

@@ -0,0 +1,13 @@
+@use "srl";
+@use 'sass:map';
+
+$page-margin-right: srl.system-size-unit(map.get(srl.$meta, pdf, margin, right));
+$page-margin-left: srl.system-size-unit(map.get(srl.$meta, pdf, margin, left));
+
+.srl-background-container {
+  box-decoration-break: clone;
+  margin-left: -$page-margin-left;
+  margin-right: -$page-margin-right;
+  padding-left: $page-margin-left;
+  padding-right: $page-margin-right;
+}

package/livingdocs/070.Container/030.background-container/scss/web.scss

@@ -0,0 +1 @@
+@use "srl";

package/livingdocs/070.Container/030.background-container/scss/word.scss

@@ -0,0 +1 @@
+@use "pdf";

package/livingdocs/070.Container/030.background-container/scss/xbrl.scss

@@ -0,0 +1,3 @@
+@use "srl";
+      @use "general";
+      

package/livingdocs/080.CV/010.cv/cv.html

@@ -28,7 +28,7 @@
         <div class="srl-article-accordion__wrapper" doc-container="cv-content"></div>
     </div>
     <div class="srl-grid srl-cv__button-container" data-remove-from-pdf="complete" data-remove-from-word="complete" data-remove-from-xhtml="complete">
-        <div class="srl-grid__inner srl-flex srl-justify-self-center">
+        <div class="srl-grid__inner srl-cv__button-container-inner text-center">
             <button type="button" class="srl-cv__button srl-article-accordion__toggle">
                 <span class="srl-cv__button-more" doc-editable="cv-text-more">
                   Read more
@@ -37,6 +37,7 @@
                   close
                 </span>
             </button>
+            <hr class="srl-cv__divider"/>
         </div>
     </div>
 </srl-article-accordion>

package/livingdocs/080.CV/010.cv/scss/_spacing-variations.scss

@@ -0,0 +1,5 @@
+$margins: (
+  ('.srl-cv', '*'): 400,
+  ('.srl-cv', '.srl-columns'): 400,
+  ('.srl-cv', '.srl-background-container'): 1600,
+)

package/livingdocs/080.CV/010.cv/scss/app.scss

@@ -1 +1,16 @@
-@use "web";
+@use "web";
+
+.srl-cv__button {
+  .srl-cv__button-close {
+    display: none;
+  }
+  &[aria-expanded="true"] {
+    .srl-cv__button-close {
+      display: block;
+    }
+
+    .srl-cv__button-more {
+      display: none;
+    }
+  }
+}

package/livingdocs/080.CV/010.cv/scss/general.scss

@@ -1,5 +1,9 @@
 @use 'srl';
 @use "sass:map";
+@use "@/assets/scss/margins";
+@use "spacing-variations";
+
+@include margins.srl-component-margin(spacing-variations.$margins);
 
 .srl-cv__inner {
   display: flex;

package/livingdocs/080.CV/010.cv/scss/pdf.scss

@@ -5,10 +5,9 @@
 }
 
 .srl-cv__header-portrait {
-  margin-right: srl.grid-get-gutter-column-gap();
-  width: srl.grid-calculate-pdf-col-span-minus-one-gutter(2);
+  @extend %srl-cv-header-portrait;
 }
 
 .srl-cv__header-content {
-  width: srl.grid-calculate-pdf-col-span-minus-one-gutter(4);
+  @extend %srl-cv-header-content;
 }

package/livingdocs/080.CV/010.cv/scss/web.scss

@@ -1,5 +1,4 @@
 @use 'srl';
-@use "@/assets/scss/placeholders";
 
 .srl-cv__inner {
   display: grid;
@@ -12,4 +11,21 @@
 
 .srl-cv__header-content {
   @extend %srl-cv-header-content;
+}
+
+.srl-cv__button-container-inner {
+}
+
+.srl-cv__button {
+  @extend %srl-button;
+}
+
+.srl-cv__divider {
+  margin: 0;
+  padding: 0;
+  position: relative;
+  top: calc((srl.spacer-get(150) + (#{srl.typography-get-line-height(button-text)}) / 2) * -1);
+  z-index: -1;
+  border-top: 0;
+  border-bottom: 1px solid srl.colors-grey-200();
 }

package/livingdocs/080.CV/020.cv-time-span/scss/_spacing-variations.scss

@@ -0,0 +1,14 @@
+$margins: (
+  ('.srl-cv-time-span', '*'): 200,
+  ('.srl-cv-time-span', '.srl-cv-time-span'): 0,
+  ('.srl-cv-time-span', '.srl-cv-time-span-strong'): 0,
+  ('.srl-cv-time-span', '.srl-list-group'): 200,
+  ('.srl-cv-time-span', '.srl-footnote'): 200,
+  ('.srl-cv-time-span', '.srl-title-h2'): 400,
+  ('.srl-cv-time-span', '.srl-title-h3'): 400,
+  ('.srl-cv-time-span', '.srl-title-h4'): 400,
+  ('.srl-cv-time-span', '.srl-title-h5'): 400,
+  ('.srl-cv-time-span', '.srl-title-h6'): 400,
+  ('.srl-cv-time-span', '.srl-pdf-pagebreak'): 800,
+  ('.srl-cv-time-span', '.srl-anchor'): 800,
+)

package/livingdocs/080.CV/020.cv-time-span/scss/general.scss

@@ -1,10 +1,14 @@
 @use 'srl';
 @use "sass:map";
+@use "@/assets/scss/margins";
+@use "spacing-variations";
 
 .srl-cv-time-span {
   @include srl.typography-cv-time-span();
 }
 
+@include margins.srl-component-margin(spacing-variations.$margins);
+
 .srl-cv-time-span__inner {
   display: flex;
 }

package/livingdocs/080.CV/020.cv-time-span/scss/web.scss

@@ -1,5 +1,4 @@
 @use 'srl';
-@use "@/assets/scss/placeholders";
 
 .srl-cv-time-span__years {
   width: srl.system-size-unit(110);

package/livingdocs/100.Misc/010.anchor/scss/editor.scss

@@ -1,6 +1,5 @@
 @use 'srl';
 @use 'web';
-@use 'assets/scss/placeholders';
 
 .srl-anchor__text {
   @extend %srl-regular-width;

package/livingdocs/100.Misc/020.accordion/accordion.html

@@ -1,10 +1,57 @@
-<srl-article-accordion class="srl-accordion" data-replace-tag="div">
-  <div class="srl-accordion__inner">
-    <div class="srl-accordion__head">
-        <button class="srl-accordion__toggle srl-article-accordion__toggle" type="button" data-replace-tag="div" doc-container="header"></button>
+<srl-ld-accordion class="srl-category-accordion srl-category-accordion--category"
+  data-remove-from-pdf="transient"
+  data-remove-from-word="transient"
+  data-remove-from-xbrl="transient"
+>
+  <div class="srl-category-accordion__inner"
+    data-remove-from-web="transient"
+    data-remove-from-pdf="transient"
+    data-remove-from-word="transient"
+    data-remove-from-xbrl="transient"
+  >
+    <div class="srl-category-accordion__inner-head"
+      data-remove-from-web="transient"
+      data-remove-from-pdf="transient"
+      data-remove-from-word="transient"
+      data-remove-from-xbrl="transient"
+    >
+      <div class="srl-category-accordion__head"
+        data-remove-from-web="transient"
+        data-remove-from-pdf="transient"
+        data-remove-from-word="transient"
+        data-remove-from-xbrl="transient"
+      >
+        <div class="srl-category-accordion__head--btn"
+          data-remove-from-web="transient"
+          data-remove-from-pdf="transient"
+          data-remove-from-word="transient"
+          data-remove-from-xbrl="transient"
+        >
+          <template-header doc-container="header"
+            data-remove-from-pdf="transient"
+            data-remove-from-word="transient"
+            data-remove-from-xbrl="transient"
+          ></template-header>
+          <span class="srl-category-accordion__icon"
+            data-remove-from-web="complete"
+            data-remove-from-pdf="complete"
+            data-remove-from-word="complete"
+            data-remove-from-xbrl="complete"
+          ></span>
+        </div>
+      </div>
     </div>
-    <div class="srl-accordion__content srl-article-accordion__content">
-      <div class="srl-accordion__content-inner srl-article-accordion__wrapper" doc-container="content"></div>
+    <div class="srl-category-accordion__content"
+      data-remove-from-web="transient"
+      data-remove-from-pdf="transient"
+      data-remove-from-word="transient"
+      data-remove-from-xbrl="transient"
+    >
+      <template-content class="srl-category-accordion__content-inner" doc-container="content"
+        data-remove-from-pdf="transient"
+        data-remove-from-word="transient"
+        data-remove-from-xbrl="transient"
+      ></template-content>
     </div>
   </div>
-</srl-article-accordion>
+</srl-ld-accordion>

package/livingdocs/100.Misc/020.accordion/accordion.vue

@@ -0,0 +1,83 @@
+<script setup lang="ts">
+import { useSlots, ref, h, computed, Fragment, type VNodeArrayChildren } from 'vue'
+
+const props = defineProps<{
+  id?: string
+}>()
+
+const slots = useSlots()
+const headerSlot = slots.header ? slots.header() : null
+const header = ref<VNodeArrayChildren | null>(null)
+const level = ref(0)
+
+if (
+  headerSlot
+  && headerSlot[0]
+  && headerSlot[0].type
+  && headerSlot[0].children
+) {
+  const match = String(headerSlot[0].type).match(/^h([1-6])$/i)
+  if (match) {
+    level.value = parseInt(match[1]) - 2
+    header.value = headerSlot[0].children
+  }
+}
+
+const renderedHeader = computed(() => {
+  if (!header.value) return []
+  const res = []
+  if (header.value[0].props.class.includes('__number-text-container')) {
+    header.value[0].children.forEach((item) => {
+      if (item.props.class.includes('__number')) {
+        item.props = {
+          class: 'srl-category-accordion__head-number'
+        }
+        res.push(h(Fragment, null, item as VNodeArrayChildren))
+      } else if (item.props.class.includes('__text')) {
+        item.props = {
+          class: 'srl-category-accordion__head-text'
+        }
+        res.push(h(Fragment, null, item as VNodeArrayChildren))
+      }
+    })
+  } else {
+    header.value[0].props = {
+      class: 'srl-category-accordion__head-text'
+    }
+    res.push(h(Fragment, null, header.value[0] as VNodeArrayChildren))
+  }
+
+  return res
+})
+</script>
+
+<template>
+  <template v-if="renderedHeader.length">
+    <srl-category-accordion
+      v-slot="{ accordion }"
+      class="srl-category-accordion srl-category-accordion--category"
+      :class="`srl-category-accordion--level-${level}`"
+      :id="props.id"
+    >
+      <div class="srl-category-accordion__inner">
+        <div class="srl-category-accordion__inner-head">
+          <srl-category-accordion-toggle :accordion="accordion" class="srl-category-accordion__head" :level="level">
+            <template v-for="item in renderedHeader">
+              <component :is="item" />
+            </template>
+            <span class="srl-category-accordion__icon"></span>
+          </srl-category-accordion-toggle>
+        </div>
+        <srl-category-accordion-content :accordion="accordion" class="srl-category-accordion__content">
+          <div class="srl-category-accordion__content-inner">
+            <slot name="content"/>
+          </div>
+        </srl-category-accordion-content>
+      </div>
+    </srl-category-accordion>
+  </template>
+  <template v-else>
+    <slot name="header"/>
+    <slot name="content"/>
+  </template>
+</template>

package/livingdocs/100.Misc/020.accordion/scss/editor.scss

@@ -0,0 +1,12 @@
+@use "srl";
+
+.srl-category-accordion {
+  template-header {
+    display: block;
+    flex: 1;
+  }
+
+  template-content {
+    display: block;
+  }
+}

package/livingdocs/110.PDF/010.pdf-pagebreak/scss/editor.scss

@@ -1,6 +1,5 @@
 @use 'srl';
 @use 'web';
-@use 'assets/scss/placeholders';
 
 .srl-pdf-pagebreak {
   text-align: center;

package/livingdocs/110.PDF/021.pdf-columnbreak/scss/editor.scss

@@ -1,6 +1,5 @@
 @use 'srl';
 @use 'web';
-@use 'assets/scss/placeholders';
 
 .srl-pdf-columnbreak {
   text-align: center;

package/livingdocs/110.PDF/030.pdf-publication-title/scss/editor.scss

@@ -1,6 +1,5 @@
 @use 'srl';
 @use 'web';
-@use 'assets/scss/placeholders';
 
 .srl-pdf-publication-title__text {
   @extend %srl-regular-width;

package/livingdocs/110.PDF/040.pdf-chapter-title/scss/editor.scss

@@ -1,6 +1,5 @@
 @use "srl";
 @use "web";
-@use 'assets/scss/placeholders';
 
 .srl-pdf-chapter-title__text {
   @extend %srl-regular-width;

package/livingdocs/110.PDF/050.pdf-chapter-navigation-container/scss/editor.scss

@@ -1,5 +1,5 @@
+@use "srl";
 @use "web";
-@use "@/assets/scss/placeholders";
 
 .srl-chapter-navigation__list {
   @extend %srl-regular-width;