@simple-reporting/base 0.1.111 → 1.0.0

package/livingdocs/010.Titles/040.title-h4/scss/general.scss

@@ -0,0 +1,21 @@
+@use 'srl';
+@use "sass:map";
+
+$number-width: srl.spacer-get(map.get(srl.$meta, title, number-width));
+
+.srl-title-h4 {
+  @include srl.typography-title-h4();
+  @include srl.spacer-margin-top(300);
+}
+
+.srl-title-h4__number-text-container {
+  display: flex;
+}
+
+.srl-title-h4__number {
+  width: $number-width;
+}
+
+.srl-title-h4__text {
+  width: calc(100% - #{$number-width});
+}

package/livingdocs/010.Titles/040.title-h4/scss/xbrl.scss

@@ -0,0 +1 @@
+@use 'general';

package/livingdocs/010.Titles/040.title-h4/title-h4.html

@@ -0,0 +1,22 @@
+<h4 class="srl-grid srl-title-h4 srl-linkable">
+  <span
+    class="srl-grid__inner srl-title-h4__number-text-container js-notes-marker"
+    data-category-marker="container"
+  >
+    <span
+      class="srl-title-h4__number js-notes-marker-number"
+      data-category-marker="number"
+      doc-optional
+      doc-editable="title-h4-number"
+    >
+      1.1.1.
+    </span>
+    <span
+      class="srl-title-h4__text js-notes-marker-text"
+      data-category-marker="text"
+      doc-editable="title-h4-text"
+    >
+      Title h4 Lorem ipsum dolor sit amet
+    </span>
+  </span>
+</h4>

package/livingdocs/010.Titles/050.title-h5/ld-conf.json

@@ -0,0 +1,5 @@
+{
+  "name": "title-h5",
+  "label": "Title (h5)",
+  "properties": ["h5-as", "width-reduced", "pdf-spacer"]
+}

package/livingdocs/010.Titles/050.title-h5/properties.json

@@ -0,0 +1,15 @@
+{
+  "h5-as": {
+    "label": "Title styling",
+    "type": "select",
+    "options": [
+      {
+        "caption": "Default"
+      },
+      {
+        "caption": "Styling from title h6",
+        "value": "srl-title-h6"
+      }
+    ]
+  }
+}

package/livingdocs/010.Titles/050.title-h5/scss/app.scss

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

package/livingdocs/010.Titles/050.title-h5/scss/editor.scss

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

package/livingdocs/010.Titles/050.title-h5/scss/general.scss

@@ -0,0 +1,6 @@
+@use 'srl';
+
+.srl-title-h5 {
+  @include srl.typography-title-h5();
+  @include srl.spacer-margin-top(200);
+}

package/livingdocs/010.Titles/050.title-h5/scss/xbrl.scss

@@ -0,0 +1 @@
+@use 'general';

package/livingdocs/010.Titles/050.title-h5/title-h5.html

@@ -0,0 +1,5 @@
+<h5 class="srl-grid srl-title-h5 srl-linkable">
+  <span class="srl-grid__inner srl-title-h5__text" doc-editable="title-h5">
+    Title h5 Lorem ipsum dolor sit amet
+  </span>
+</h5>

package/livingdocs/010.Titles/060.title-h6/ld-conf.json

@@ -0,0 +1,5 @@
+{
+  "name": "title-h6",
+  "label": "Title (h6)",
+  "properties": ["width-reduced", "pdf-spacer"]
+}

package/livingdocs/010.Titles/060.title-h6/scss/app.scss

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

package/livingdocs/010.Titles/060.title-h6/scss/editor.scss

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

package/livingdocs/010.Titles/060.title-h6/scss/general.scss

@@ -0,0 +1,6 @@
+@use 'srl';
+
+.srl-title-h6 {
+  @include srl.typography-title-h6();
+  @include srl.spacer-margin-top(200);
+}

package/livingdocs/010.Titles/060.title-h6/scss/xbrl.scss

@@ -0,0 +1 @@
+@use 'general';

package/livingdocs/010.Titles/060.title-h6/title-h6.html

@@ -0,0 +1,5 @@
+<h6 class="srl-grid srl-title-h6 srl-linkable">
+  <span class="srl-grid__inner srl-title-h6__text" doc-editable="title-h6">
+    Title h6 Lorem ipsum dolor sit amet
+  </span>
+</h6>

package/livingdocs/020.Text/010.lead/ld-conf.json

@@ -0,0 +1,10 @@
+{
+  "name": "lead",
+  "label": "Lead",
+  "properties": ["pdf-spacer"],
+  "directives": {
+    "lead": {
+      "recommendedMaxLength": 325
+    }
+  }
+}

package/livingdocs/020.Text/010.lead/lead.html

@@ -0,0 +1,7 @@
+<div class="srl-grid srl-lead">
+  <p class="srl-grid__inner srl-lead__text srl-linkable" doc-editable="lead">
+    Lorem, ipsum dolor sit amet consectetur adipisicing elit. Iste sapiente,
+    magni incidunt aut hic ut sint, repellendus nesciunt alias sequi, vero
+    voluptatem! Similique laborum natus eum ullam, rem officiis dolores.
+  </p>
+</div>

package/livingdocs/020.Text/010.lead/scss/app.scss

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

package/livingdocs/020.Text/010.lead/scss/editor.scss

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

package/livingdocs/020.Text/010.lead/scss/general.scss

@@ -0,0 +1,6 @@
+@use 'srl';
+
+.srl-lead {
+  @include srl.typography-lead();
+  @include srl.spacer-margin-top(300);
+}

package/livingdocs/020.Text/010.lead/scss/xbrl.scss

@@ -0,0 +1 @@
+@use 'general';

package/livingdocs/020.Text/020.paragraph/ld-conf.json

@@ -0,0 +1,5 @@
+{
+  "name": "paragraph",
+  "label": "Paragraph",
+  "properties": ["pdf-spacer"]
+}

package/livingdocs/{Text/paragraph → 020.Text/020.paragraph}/paragraph.html

@@ -1,24 +1,13 @@
-<script type="ld-conf">
-  {
-    "name": "paragraph",
-    "label": "Paragraph",
-    "iconUrl": "https://mms-xbrl.s3.eu-central-1.amazonaws.com/design/svg/editor/icon-paragraph.min.svg",
-    "properties": [
-      "web-width",
-      "pdf-width"
-    ]
-  }
-</script>
-<p class="srl-paragraph srl-article__grid srl-article__grid--indent">
-  <span class="srl-article__grid--inner" doc-editable="text">
-    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
-    eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam
-    voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
-    clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit
-    amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
-    nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
-    diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
-    clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit
-    amet.
-  </span>
-</p>
+<p class="srl-grid srl-paragraph srl-linkable">
+  <span class="srl-grid__inner srl-paragraph__text" doc-editable="paragraph">
+    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
+    eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam
+    voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
+    clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit
+    amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
+    nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
+    diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
+    clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit
+    amet.
+  </span>
+</p>

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

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

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

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

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

@@ -0,0 +1,6 @@
+@use 'srl';
+
+.srl-paragraph {
+  @include srl.typography-paragraph();
+  @include srl.spacer-margin-top(200);
+}

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

@@ -0,0 +1 @@
+@use 'general';

package/livingdocs/020.Text/030.paragraph-strong/ld-conf.json

@@ -0,0 +1,5 @@
+{
+  "name": "paragraph-strong",
+  "label": "Paragraph (strong)",
+  "properties": ["pdf-spacer"]
+}

package/livingdocs/020.Text/030.paragraph-strong/paragraph.html

@@ -0,0 +1,16 @@
+<p class="srl-grid srl-paragraph srl-paragraph-strong srl-linkable">
+  <span
+    class="srl-grid__inner srl-paragraph__text"
+    doc-editable="transformable-text"
+  >
+    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
+    eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam
+    voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
+    clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit
+    amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
+    nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
+    diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
+    clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit
+    amet.
+  </span>
+</p>

package/livingdocs/020.Text/030.paragraph-strong/scss/app.scss

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

package/livingdocs/020.Text/030.paragraph-strong/scss/general.scss

@@ -0,0 +1,5 @@
+@use 'srl';
+
+.srl-paragraph-strong {
+  @include srl.typography-paragraph-strong();
+}

package/livingdocs/020.Text/030.paragraph-strong/scss/pdf.scss

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

package/livingdocs/020.Text/030.paragraph-strong/scss/xbrl.scss

@@ -0,0 +1 @@
+@use 'general';

package/livingdocs/020.Text/040.link/ld-conf.json

@@ -0,0 +1,15 @@
+{
+  "name": "link",
+  "label": "Link",
+  "properties": ["pdf-spacer"],
+  "directives": {
+    "showParagraph": {
+      "type": "toggle",
+      "label": "Show paragraph",
+      "default": true
+    },
+    "link": {
+      "plainText": true
+    }
+  }
+}

package/livingdocs/020.Text/040.link/link.html

@@ -0,0 +1,12 @@
+<div class="srl-grid srl-link srl-linkable">
+  <div class="srl-grid__inner srl-link__content">
+    <p class="srl-paragraph" doc-toggle="showParagraph">
+      <span class="srl-paragraph__link-text" doc-editable="link-text">
+        Lorem ipsum dolor sit amet, consetetur sadipscing elitr:
+      </span>
+    </p>
+    <a doc-link="href" class="srl-link__link">
+      <span class="srl-link__text" doc-editable="link">Link text</span>
+    </a>
+  </div>
+</div>

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

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

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

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

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

@@ -0,0 +1,6 @@
+@use 'srl';
+
+.srl-link {
+  @include srl.typography-link();
+  @include srl.spacer-margin-top(100);
+}

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

@@ -0,0 +1 @@
+@use 'general';

package/livingdocs/020.Text/050.quote/ld-conf.json

@@ -0,0 +1,5 @@
+{
+  "name": "quote",
+  "label": "Quote",
+  "properties": ["width-reduced","pdf-spacer", "hide-quote-characters"]
+}

package/livingdocs/{Text/quote → 020.Text/050.quote}/properties.json

@@ -1,7 +1,7 @@
-{
-  "hide-quote-characters": {
-    "label": "Hide quote characters before and after",
-    "type": "option",
-    "value": "hide-quote-characters"
-  }
-}
+{
+  "hide-quote-characters": {
+    "label": "Hide quote characters before and after",
+    "type": "option",
+    "value": "hide-quote-characters"
+  }
+}

package/livingdocs/020.Text/050.quote/quote.html

@@ -0,0 +1,15 @@
+<blockquote class="srl-grid srl-quote">
+  <div class="srl-grid__inner srl-quote__text">
+    <p class="srl-quote__quote srl-linkable" doc-editable="quote-text">
+      Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse
+    </p>
+    <cite class="srl-quote__cite">
+      <p class="srl-quote__name" doc-editable="quote-name" doc-optional>
+        Max Mustermann
+      </p>
+      <p class="srl-quote__position" doc-editable="quote-position" doc-optional>
+        CEO
+      </p>
+    </cite>
+  </div>
+</blockquote>

package/livingdocs/020.Text/050.quote/scss/app.scss

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

package/livingdocs/020.Text/050.quote/scss/editor.scss

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

package/livingdocs/020.Text/050.quote/scss/general.scss

@@ -0,0 +1,17 @@
+@use 'srl';
+
+.srl-quote {
+  @include srl.spacer-margin-top(400);
+}
+
+.srl-quote__quote {
+  @include srl.typography-quote();
+}
+
+.srl-quote__name {
+  @include srl.typography-quote-name();
+}
+
+.srl-quote__position {
+  @include srl.typography-quote-position();
+}

package/livingdocs/020.Text/050.quote/scss/xbrl.scss

@@ -0,0 +1 @@
+@use 'general';

package/livingdocs/020.Text/060.quote-with-portrait/ld-conf.json

@@ -0,0 +1,11 @@
+{
+  "name": "quote-with-portrait",
+  "label": "Quote with image",
+  "properties": ["width-reduced","pdf-spacer", "hide-quote-characters"],
+  "directives": {
+    "image": {
+      "imageRatios": ["1:1"],
+      "allowOriginalRatio": false
+    }
+  }
+}

package/livingdocs/020.Text/060.quote-with-portrait/quote-with-portrait.html

@@ -0,0 +1,18 @@
+<blockquote class="srl-grid srl-quote srl-quote srl-quote--with-image">
+  <figure class="srl-quote__figure">
+    <img class="srl-quote__img" doc-image="image" />
+  </figure>
+  <div class="srl-quote__text">
+    <p class="srl-quote__quote srl-linkable" doc-editable="quote-text">
+      Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse
+    </p>
+    <cite class="srl-quote__cite">
+      <p class="srl-quote__name" doc-editable="quote-name" doc-optional>
+        Max Mustermann
+      </p>
+      <p class="srl-quote__position" doc-editable="quote-position" doc-optional>
+        CEO
+      </p>
+    </cite>
+  </div>
+</blockquote>

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

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

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

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

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

@@ -0,0 +1,17 @@
+@use 'srl';
+
+.srl-quote {
+  @include srl.spacer-margin-top(400);
+}
+
+.srl-quote__quote {
+  @include srl.typography-quote();
+}
+
+.srl-quote__name {
+  @include srl.typography-quote-name();
+}
+
+.srl-quote__position {
+    @include srl.typography-quote-position();
+}

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

@@ -0,0 +1,29 @@
+@use 'srl';
+
+.srl-quote--with-image.srl-wide-width {
+  justify-content: space-between;
+}
+
+.srl-quote__figure {
+  .srl-quote--with-image & {
+    margin-right: srl.grid-get-gutter-column-gap();
+    @include srl.grid-pdf-flex-col(2);
+  }
+
+  .srl-quote--with-image.srl-wide-width & {
+    margin-right: 0;
+    @include srl.grid-pdf-flex-col(2);
+  }
+}
+
+.srl-quote__text {
+  .srl-quote--with-image & {
+    @include srl.grid-pdf-flex-col(4);
+  }
+
+  .srl-quote--with-image.srl-wide-width & {
+    @include srl.grid-pdf-flex-col(6);
+  }
+}
+
+

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

@@ -0,0 +1,24 @@
+@use 'srl';
+@use "assets/scss/placeholders";
+
+.srl-quote__figure {
+  .srl-quote--with-image & {
+    @extend %srl-quote-with-image-image-regular-width;
+  }
+
+  .srl-quote--with-image.srl-wide-width & {
+    @extend %srl-quote-with-image-image-wide-width;
+  }
+}
+
+.srl-quote__text {
+  .srl-quote--with-image & {
+    @extend %srl-quote-with-image-text-regular-width;
+  }
+
+  .srl-quote--with-image.srl-wide-width & {
+    @extend %srl-quote-with-image-text-wide-width;
+  }
+}
+
+

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

@@ -0,0 +1 @@
+@use 'general';

package/livingdocs/020.Text/070.footnote-container/footnote-container.html

@@ -0,0 +1,6 @@
+<div class="srl-grid srl-footnote srl-linkable">
+  <div
+    class="srl-grid__inner srl-footnote__inner"
+    doc-container="container"
+  ></div>
+</div>

package/livingdocs/020.Text/070.footnote-container/ld-conf.json

@@ -0,0 +1,18 @@
+{
+  "name": "footnote-container",
+  "label": "Footnote container",
+  "properties": ["pdf-spacer"],
+  "directives": {
+    "container": {
+      "allowedChildren": ["footnote-item"],
+      "defaultComponents": {
+        "paragraph": "footnote-item"
+      },
+      "defaultContent": [
+        {
+          "component": "footnote-item"
+        }
+      ]
+    }
+  }
+}

package/livingdocs/020.Text/070.footnote-container/scss/app.scss

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

package/livingdocs/020.Text/070.footnote-container/scss/editor.scss

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

package/livingdocs/020.Text/070.footnote-container/scss/general.scss

@@ -0,0 +1,5 @@
+@use "srl";
+
+.srl-footnote-container {
+  @include srl.spacer-margin-top(200);
+}

package/livingdocs/020.Text/070.footnote-container/scss/web.scss

@@ -0,0 +1,6 @@
+@use "srl";
+@use "assets/scss/placeholders";
+
+.srl-footnote-container:not(.srl-grid) {
+  @extend %srl-regular-width;
+}

package/livingdocs/020.Text/070.footnote-container/scss/xbrl.scss

@@ -0,0 +1 @@
+@use 'general';

package/livingdocs/020.Text/080.footnote-item/footnote-item.html

@@ -0,0 +1,6 @@
+<div class="srl-footnote__item">
+  <span class="srl-footnote__number">
+    <sup doc-editable="footnote-number">1</sup>
+  </span>
+  <span class="srl-footnote__text" doc-editable="footnote-text">Footnote</span>
+</div>

package/livingdocs/020.Text/080.footnote-item/ld-conf.json

@@ -0,0 +1,5 @@
+{
+  "name": "footnote-item",
+  "label": "Footnote item",
+  "allowedParents": ["footnote-container"]
+}

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

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

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

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