@simple-reporting/base 1.0.39 → 1.0.40

package/dev/package.json

@@ -25,7 +25,7 @@
   },
   "dependencies": {
     "@fortawesome/fontawesome-free": "^7.2.0",
-    "@simple-reporting/base": "^1.0.39",
+    "@simple-reporting/base": "^1.0.40",
     "chalk": "^5.6.2",
     "exceljs": "^4.4.0",
     "file-saver": "^2.0.5",

package/dev/src/App.vue

@@ -6,6 +6,7 @@ const mainNavigation = useMenu('menuMain')
 
 <template>
   <div class="srl-page__wrap">
+    <SearchHighlightOnTarget />
     <PageBypassLinks />
     <PageHeader :mainNavigation="mainNavigation" />
     <PageMain :mainNavigation="mainNavigation" />

package/dev/src/assets/scss/editor.scss

@@ -45,6 +45,7 @@ img[src^="data:image/svg+xml"] {
   @extend %srl-grid-base;
 
   &.srl-pdf-pagebreak,
+  &.srl-pdf-columnbreak,
   &.srl-anchor {
     border-top: 1px solid #{srl.colors-primary-1000()};
     border-bottom: 1px solid #{srl.colors-primary-1000()};

package/dev/src/assets/scss/general.scss

@@ -75,6 +75,24 @@ span {
   color: srl.colors-primary-1000();
 }
 
+.srl-linkable {
+  a {
+    color: srl.colors-primary-1000();
+    text-decoration: underline;
+
+    &:hover {
+      text-decoration: none;
+    }
+
+    &[target="_blank"] {
+      &:after {
+        @extend %srl-icon-base;
+        @include fa.content(arrow-up-right-from-square);
+      }
+    }
+  }
+}
+
 .srl-flex {
   display: flex;
   flex-direction: srl.system-root-style(srl-model-flex-direction);

package/dev/src/assets/scss/margins.scss

@@ -19,12 +19,14 @@
 
     @if system.$build == "pdf" {
       @if $to == '*' {
-        #{$from}-first + *,
+        #{$from} + *,
         #{$from}-last + * {
           @include srl.spacer-margin-top($margin);
         }
       } @else {
-        #{$from}-first + #{$to}-first,
+        #{$from} + #{$to},
+        #{$from} + #{$to}-first,
+        #{$from}-last + #{$to},
         #{$from}-last + #{$to}-first {
           @include srl.spacer-margin-top($margin);
         }

package/dev/src/entries/pdf.ts

@@ -1,6 +1,7 @@
 import '#imports/pdf.scss'
 import * as Awesomizr from 'srl/pdf/Awesomizr.js'
 import PDFNotes from 'srl/pdf/PDFNotes.ts'
+import PDFNestedContainers from 'srl/pdf/PDFNestedContainers.ts'
 import PDFSetPageNumbers from 'srl/pdf/PDFSetPageNumbers.ts'
 
 document.addEventListener('DOMContentLoaded', () => {
@@ -8,6 +9,10 @@ document.addEventListener('DOMContentLoaded', () => {
     noteClass: '.srl-category-notes_group, .srl-category-notes_holding'
   })
 
+  new PDFNestedContainers({
+    selector: '.srl-nested-container'
+  })
+
   new PDFSetPageNumbers({
     tocItemClass: '.srl-pdf-toc__item:not(.srl-pdf-toc__item--blank)',
     tocItemPageNumberClass: '.srl-pdf-toc__page-number'

package/dev/srl.config.json

@@ -117,6 +117,27 @@
           }
         }
       },
+      {
+        "name": "title-h1-landing-page",
+        "font-family": "Inter",
+        "font-size": 40,
+        "line-height": 1.25,
+        "font-style": "normal",
+        "font-weight": 400,
+        "letter-spacing": 0,
+        "media": {
+          "up": {
+            "tablet-pt": {
+              "font-size": 60,
+              "line-height": 1.26
+            },
+            "desktop": {
+              "font-size": 80,
+              "line-height": 1.2
+            }
+          }
+        }
+      },
       {
         "name": "title-h1-pdf",
         "font-family": "Inter",
@@ -153,6 +174,31 @@
           }
         }
       },
+      {
+        "name": "title-h2-landing-page",
+        "font-family": "Inter",
+        "font-size": 30,
+        "line-height": 1.5,
+        "font-style": "normal",
+        "font-weight": 600,
+        "letter-spacing": 0,
+        "media": {
+          "print": {
+            "font-size": "28pt",
+            "line-height": 0.875
+          },
+          "up": {
+            "tablet-pt": {
+              "font-size": 36,
+              "line-height": 1.5
+            },
+            "desktop": {
+              "font-size": 56,
+              "line-height": 1.46
+            }
+          }
+        }
+      },
       {
         "name": "title-h2-pdf",
         "font-family": "Inter",
@@ -275,7 +321,7 @@
       {
         "name": "paragraph",
         "font-family": "Inter",
-        "font-size": 14,
+        "font-size": 16,
         "line-height": 1.5,
         "font-style": "normal",
         "font-weight": 400,
@@ -287,7 +333,7 @@
           },
           "up": {
             "tablet-pt": {
-              "font-size": 16
+              "font-size": 18
             }
           }
         }
@@ -315,7 +361,7 @@
       {
         "name": "link",
         "font-family": "Inter",
-        "font-size": 12,
+        "font-size": 14,
         "line-height": 1.5,
         "font-style": "normal",
         "font-weight": 400,
@@ -327,7 +373,7 @@
           },
           "up": {
             "tablet-pt": {
-              "font-size": 14
+              "font-size": 16
             }
           }
         }
@@ -515,7 +561,7 @@
       {
         "name": "button-text",
         "font-family": "Inter",
-        "font-size": 12,
+        "font-size": 16,
         "line-height": 1,
         "font-style": "normal",
         "font-weight": 400,
@@ -527,7 +573,7 @@
           },
           "up": {
             "tablet-pt": {
-              "font-size": 14
+              "font-size": 18
             }
           }
         }
@@ -981,6 +1027,14 @@
             "size": "48pt"
           }
         }
+      },
+      "3200": {
+        "size": 256,
+        "media": {
+          "print": {
+            "size": "96pt"
+          }
+        }
       }
     }
   },

package/livingdocs/010.Titles/010.title-h1/scss/_spacing-variations.scss

@@ -6,8 +6,6 @@ $margins: (
   ('.srl-title-h1', '.srl-table'): 400,
   ('.srl-title-h1', '.srl-button-container'): 400,
   ('.srl-title-h1', '.srl-columns'): 400,
-  ('.srl-title-h1', '.srl-pdf-pagebreak'): 800,
-  ('.srl-title-h1', '.srl-anchor'): 800,
   ('.srl-title-h1', '.srl-title-h2'): 800,
   ('.srl-title-h1', '.srl-image'): 800,
   ('.srl-title-h1', '.srl-video'): 800,

package/livingdocs/010.Titles/010.title-h1/scss/web.scss

@@ -0,0 +1,7 @@
+@use "srl";
+
+.srl-title-h1 {
+  .srl-hero-video & {
+    @include srl.typography-title-h1-landing-page();
+  }
+}

package/livingdocs/010.Titles/020.title-h2/scss/_spacing-variations.scss

@@ -5,8 +5,6 @@ $margins: (
   ('.srl-title-h2', '.srl-title-h3'): 400,
   ('.srl-title-h2', '.srl-button-container'): 400,
   ('.srl-title-h2', '.srl-columns'): 400,
-  ('.srl-title-h2', '.srl-pdf-pagebreak'): 800,
-  ('.srl-title-h2', '.srl-anchor'): 800,
   ('.srl-title-h2', '.srl-keyfigure__icon'): 800,
   ('.srl-title-h2', '.srl-background-container'): 1600,
 );

package/livingdocs/010.Titles/020.title-h2/scss/general.scss

@@ -5,6 +5,16 @@
 .srl-title-h2 {
   @include srl.typography-title-h2();
 
+  .srl-title-image-quote &,
+  .srl-teaser-quote &,
+  .srl-teaser & {
+    @include srl.typography-title-h2-landing-page();
+  }
+
+  .srl-title-image-quote & {
+    color: srl.colors-black-1000();
+  }
+
   .srl-pdf-cover & {
     @include srl.typography-title-h2-pdf();
   }

package/livingdocs/010.Titles/030.title-h3/scss/_spacing-variations.scss

@@ -7,7 +7,5 @@ $margins: (
   ('.srl-cv__header-content .srl-title-h3', '.srl-title-h4'): 100,
   ('.srl-title-h3', '.srl-button-container'): 400,
   ('.srl-title-h3', '.srl-columns'): 400,
-  ('.srl-title-h3', '.srl-pdf-pagebreak'): 800,
-  ('.srl-title-h3', '.srl-anchor'): 800,
   ('.srl-title-h3', '.srl-background-container'): 1600,
 )

package/livingdocs/010.Titles/040.title-h4/scss/_spacing-variations.scss

@@ -6,7 +6,5 @@ $margins: (
   ('.srl-title-h4', '.srl-table'): 200,
   ('.srl-title-h4', '.srl-button-container'): 400,
   ('.srl-title-h4', '.srl-columns'): 400,
-  ('.srl-title-h4', '.srl-pdf-pagebreak'): 800,
-  ('.srl-title-h4', '.srl-anchor'): 800,
   ('.srl-title-h4', '.srl-background-container'): 1600,
 )

package/livingdocs/010.Titles/050.title-h5/scss/_spacing-variations.scss

@@ -5,7 +5,5 @@ $margins: (
   ('.srl-title-h5', '.srl-title-h6'): 100,
   ('.srl-title-h5', '.srl-button-container'): 400,
   ('.srl-title-h5', '.srl-columns'): 400,
-  ('.srl-title-h5', '.srl-pdf-pagebreak'): 800,
-  ('.srl-title-h5', '.srl-anchor'): 800,
   ('.srl-title-h5', '.srl-background-container'): 1600,
 )

package/livingdocs/010.Titles/060.title-h6/scss/_spacing-variations.scss

@@ -4,7 +4,5 @@ $margins: (
   ('.srl-title-h6', '.srl-paragraph-strong'): 0,
   ('.srl-title-h6', '.srl-button-container'): 400,
   ('.srl-title-h6', '.srl-columns'): 400,
-  ('.srl-title-h6', '.srl-pdf-pagebreak'): 800,
-  ('.srl-title-h6', '.srl-anchor'): 800,
   ('.srl-title-h6', '.srl-background-container'): 1600,
 )

package/livingdocs/020.Text/020.paragraph/scss/_spacing-variations.scss

@@ -1,5 +1,6 @@
 $margins: (
   ('.srl-paragraph', '*'): 200,
+  ('.srl-paragraph', '.srl-link__link'): 100,
   ('.srl-paragraph', '.srl-paragraph'): 200,
   ('.srl-paragraph', '.srl-paragraph-strong'): 200,
   ('.srl-paragraph', '.srl-list-group'): 200,
@@ -16,7 +17,5 @@ $margins: (
   ('.srl-paragraph', '.srl-title-h4'): 400,
   ('.srl-paragraph', '.srl-title-h5'): 200,
   ('.srl-paragraph', '.srl-title-h6'): 200,
-  ('.srl-paragraph', '.srl-pdf-pagebreak'): 800,
-  ('.srl-paragraph', '.srl-anchor'): 800,
   ('.srl-paragraph', '.srl-background-container'): 1600,
 )

package/livingdocs/020.Text/020.paragraph/scss/general.scss

@@ -4,6 +4,10 @@
 
 .srl-paragraph {
   @include srl.typography-paragraph();
+
+  .srl-link & {
+    @include srl.typography-link();
+  }
 }
 
 @include margins.srl-component-margin(spacing-variations.$margins);

package/livingdocs/020.Text/040.link/scss/general.scss

@@ -1,5 +1,13 @@
 @use 'srl';
+@use "sass:map";
+
+$font-weight-bold: map.get(srl.$meta, font, weight, bold);
 
 .srl-link {
   @include srl.typography-link();
 }
+
+.srl-link__link {
+  font-weight: $font-weight-bold;
+  display: block;
+}

package/livingdocs/020.Text/060.quote-with-portrait/scss/_spacing-variations.scss

@@ -1,7 +1,6 @@
 $margins: (
   ('.srl-quote', '*'): 800,
+  ('.srl-title-image-quote .srl-quote', '.srl-button-container'): 400,
   ('.srl-quote', '.srl-columns'): 400,
-  ('.srl-quote', '.srl-pdf-pagebreak'): 800,
-  ('.srl-quote', '.srl-anchor'): 800,
   ('.srl-quote', '.srl-background-container'): 1600,
 )

package/livingdocs/020.Text/060.quote-with-portrait/scss/general.scss

@@ -20,6 +20,10 @@ $quote-close: map.get(srl.$meta, quote, quote-close);
 .srl-quote__quote {
   @include srl.typography-quote();
 
+  .srl-teaser-quote.srl-color-white-1000 & {
+    color: srl.colors-black-1000()
+  }
+
   &:before {
     content: "#{$quote-open}";
 
@@ -44,8 +48,16 @@ $quote-close: map.get(srl.$meta, quote, quote-close);
 
 .srl-quote__name {
   @include srl.typography-quote-name();
+
+  .srl-teaser-quote.srl-color-white-1000 & {
+    color: srl.colors-black-1000()
+  }
 }
 
 .srl-quote__position {
     @include srl.typography-quote-position();
+
+  .srl-teaser-quote.srl-color-white-1000 & {
+    color: srl.colors-black-1000()
+  }
 }

package/livingdocs/020.Text/060.quote-with-portrait/scss/web.scss

@@ -21,3 +21,10 @@
 }
 
 
+.srl-quote__quote {
+  .srl-title-image-quote &,
+  .srl-teaser-quote & {
+    @include srl.typography-title-h2-landing-page();
+  }
+}
+

package/livingdocs/020.Text/070.footnote-container/scss/_spacing-variations.scss

@@ -16,7 +16,5 @@ $margins: (
   ('.srl-footnote', '.srl-title-h4'): 400,
   ('.srl-footnote', '.srl-title-h5'): 200,
   ('.srl-footnote', '.srl-title-h6'): 200,
-  ('.srl-footnote', '.srl-pdf-pagebreak'): 800,
-  ('.srl-footnote', '.srl-anchor'): 800,
   ('.srl-footnote', '.srl-background-container'): 1600,
 )

package/livingdocs/020.Text/080.footnote-item/scss/word.scss

@@ -3,4 +3,12 @@
 .srl-footnote:not(.srl-grid),
 .srl-footnote__item {
   font-family: 'Arial', sans-serif;
+}
+
+.srl-footnote__key,
+.srl-footnote__number {
+  &:after {
+    content: " ";
+    display: block;
+  }
 }

package/livingdocs/030.Lists/010.unordered-list/scss/_spacing-variations.scss

@@ -16,7 +16,5 @@ $margins: (
   ('.srl-list-group', '.srl-title-h4'): 400,
   ('.srl-list-group', '.srl-title-h5'): 200,
   ('.srl-list-group', '.srl-title-h6'): 200,
-  ('.srl-list-group', '.srl-pdf-pagebreak'): 800,
-  ('.srl-list-group', '.srl-anchor'): 800,
   ('.srl-list-group', '.srl-background-container'): 1600,
 )

package/livingdocs/040.Media/010.table/scss/_spacing-variations.scss

@@ -12,8 +12,6 @@ $margins: (
   ('.srl-table > table', '*'): 200,
   ('.srl-table-container', '*:empty'): 0,
   ('.srl-table > table', '*:empty'): 0,
-  ('.srl-table', '.srl-pdf-pagebreak'): 800,
-  ('.srl-table', '.srl-anchor'): 800,
   ('.srl-table', '.srl-quote'): 800,
   ('.srl-table', '.srl-background-container'): 1600,
 )

package/livingdocs/040.Media/020.image/scss/_spacing-variations.scss

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

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

@@ -1,15 +1,29 @@
 @use "srl";
 
 .srl-image__image-container--desktop {
+  display: block;
+}
+
+.srl-image__image-container--mobile {
   display: none;
+}
 
-  @include srl.grid-media-up(tablet-pt) {
+.srl-image:has(.srl-image__image-container--mobile) {
+  .srl-image__image-container--desktop {
+    display: none;
+  }
+
+  .srl-image__image-container--mobile {
     display: block;
   }
-}
 
-.srl-image__image-container--mobile {
-  @include srl.grid-media-up(tablet-pt) {
-    display: none;
+  @include srl.grid-media-up(tablet-ls) {
+    .srl-image__image-container--desktop {
+      display: block;
+    }
+
+    .srl-image__image-container--mobile {
+      display: none;
+    }
   }
 }

package/livingdocs/040.Media/030.video/ld-conf.json

@@ -1,17 +1,12 @@
 {
   "name": "video",
   "label": "Video",
-  "properties": ["width-all", "pdf-spacer"],
+  "properties": ["showVideoLink", "width-all", "pdf-spacer"],
   "directives": {
     "video-thumbnail": {
       "imageRatios": ["16:9"],
       "allowOriginalRatio": false
     },
-    "showVideoLink": {
-      "type": "toggle",
-      "label": "Enable video link for PDF",
-      "default": false
-    },
     "link": {
       "plainText": true
     },

package/livingdocs/040.Media/030.video/properties.json

@@ -0,0 +1,7 @@
+{
+  "showVideoLink": {
+    "type": "option",
+    "label": "Enable video link for PDF",
+    "value": "srl-video-show-pdf-link"
+  }
+}

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

@@ -1,7 +1,5 @@
 $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/editor.scss

@@ -3,4 +3,14 @@
 .srl-video__thumbnail {
   max-width: 192px;
   max-height: 108px;
+}
+
+.srl-video__video-link-container {
+  display: none;
+}
+
+.srl-video.srl-video-show-pdf-link {
+  .srl-video__video-link-container {
+    display: grid;
+  }
 }

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

@@ -1,4 +1,5 @@
 @use 'srl';
+@use "srl/fa";
 @use "@/assets/scss/margins";
 @use "spacing-variations";
 
@@ -24,7 +25,6 @@
 
 .srl-video__video-link-container {
   @include srl.spacer-margin-top(100);
-  @extend %srl-regular-width;
 }
 
 .srl-video__video-link {
@@ -35,6 +35,11 @@
   @include srl.typography-video-link();
 }
 
+.srl-video__video-link-icon {
+  @extend %srl-icon-base;
+  @include fa.icon(play);
+}
+
 .srl-video__video-link-text {
   padding-left: srl.spacer-get(100);
 }

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

@@ -4,6 +4,14 @@
 $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-video {
+  display: none;
+}
+
+.srl-video.srl-video-show-pdf-link {
+  display: block;
+}
+
 .srl-grid--media {
   .srl-full-width & {
     max-width: 210mm;

package/livingdocs/040.Media/030.video/video.html

@@ -1,46 +1,43 @@
-<div class="srl-video" data-remove-from-word="complete">
+<div
+  class="srl-video"
+  data-remove-from-word="complete"
+  data-remove-from-xhtml="complete"
+>
   <div class="srl-grid srl-grid--media">
     <div class="srl-grid__inner srl-video__inner">
-      <srl-ld-video data-remove-from-xhtml="transient" data-remove-from-pdf="transient">
-        <div class="srl-video__video-container" doc-html="free-html" data-remove-from-pdf="complete"></div>
-        <img class="srl-video__thumbnail" doc-image="video-thumbnail"></img>
-        <div class="srl-video__play" data-remove-from-pdf="complete">
+      <srl-ld-video
+        data-remove-from-pdf="transient">
+        <div
+          class="srl-video__video-container"
+          doc-html="free-html"
+          data-remove-from-pdf="complete">
+        </div>
+        <img class="srl-video__thumbnail"
+          doc-image="video-thumbnail"
+        />
+        <div
+          class="srl-video__play"
+          data-remove-from-pdf="complete"
+        >
           <button class="srl-button srl-has-icon" type="button">
-              <svg class="svg svg-play" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-                  <path d="M5 3L19 12L5 21V3Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>
-              </svg>
+            <i class="srl-video__video-link-icon"></i>
             <span doc-editable="text">Video abspielen</span>
           </button>
         </div>
       </srl-ld-video>
     </div>
   </div>
-  <div class="srl-grid">
-    <div
-      class="srl-video__video-link-container"
-      data-remove-from-web="complete"
-      doc-toggle="showVideoLink"
-    >
+  <div
+    class="srl-grid srl-video__video-link-container"
+    data-remove-from-web="complete"
+  >
+    <div class="srl-grid__inner">
       <a class="srl-video__video-link" doc-link="href" target="_blank">
-        <span class="srl-video__video-link-icon">
-          <svg
-            class="svg svg-play"
-            viewBox="0 0 14 18"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M0.5 17C0.5 17.1844 0.601492 17.3538 0.764071 17.4408C0.92665 17.5278 1.12392 17.5183 1.27735 17.416L13.2774 9.41603C13.4164 9.32329 13.5 9.16718 13.5 9C13.5 8.83282 13.4164 8.67671 13.2774 8.58397L1.27735 0.583975C1.12392 0.481689 0.92665 0.472153 0.764071 0.559163C0.601492 0.646172 0.5 0.815602 0.5 1V17Z"
-              stroke="currentColor"
-              stroke-linecap="round"
-              stroke-linejoin="round"
-            />
-          </svg>
-        </span>
+        <i class="srl-video__video-link-icon"></i>
         <span class="srl-video__video-link-text" doc-editable="link">
           Link to the video in your report
         </span>
       </a>
     </div>
   </div>
-</div>
+</div>