@leuffen/themejs1 3.0.2 → 3.0.4

package/LICENSE.txt

@@ -0,0 +1,5 @@
+This software is not free. It is a commercial open source project.
+
+Do not use this software for any purposes without purchasing a license.
+
+Copyright (c) 2023 Matthias Leuffen, Germany

package/README.md

@@ -1,4 +1,7 @@
 # themejs1
+
+***This open source software package is commercial! Any use without licence is prohibited!***
+
 ThemeJS Version 1
 
 

package/_variables.scss

@@ -0,0 +1,38 @@
+
+
+
+/* always add !default to variables */
+
+
+//$font-family-base: Ubuntu-R,sans-serif;
+$font-family-base: sans-serif !default;
+
+$primary:   #a3979b !default;
+$success:   #22b573 !default;
+$danger:    #bf1c0a !default;
+$warning:   #bf760a !default;
+$dark:      #006837 !default;
+
+$background-primary:        #b7eaf9 !default;
+$background-accent:         #ddd    !default;
+
+$content-offset-top:        100px !default;
+$content-height-adjustment: 200px !default;
+
+$font-size-base:            0.9rem  !default;
+$line-height-base:          1.2     !default;
+$paragraph-margin-bottom:   1.5rem !default;
+
+$minibar-text-color:        black !default;
+$minibar-color:             transparent !default;
+
+$border-radius:             0 !default;
+
+
+
+
+.tjs__navbar-blox {
+    --height: 88px !important;
+}
+
+

package/demo_styles.scss

@@ -1,6 +1,11 @@
 
 
-@import "style";
-@import "style_dev";
-@import "@leuffen/jodastyle/style_embed";
-@import "style_embed";
+@import "variables";
+@import "@leuffen/jodastyle";
+@import "./embed";
+@import "./index";
+@import "./late";
+@import "./theme1";
+@import "./src.dev/dev";
+@import "bootstrap";
+

package/dist/helper/loader.d.ts

@@ -0,0 +1 @@
+export declare function initLoader(): void;

package/dist/helper/loader.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initLoader = void 0;
+const hit_index_1 = require("../hit-index");
+console.time("loader");
+function initLoader() {
+    let interval = setInterval(() => {
+        // Detect if body is loaded
+        if (document.querySelector("body")) {
+            // Cancel interval
+            clearInterval(interval);
+            let img = document.querySelector("img").cloneNode(true);
+            let loader = document.createElement("div");
+            loader.classList.add("loader");
+            loader.appendChild(img);
+            img.setAttribute("class", "");
+            img.setAttribute("loading", "eager");
+            let loaderBar = document.createElement("div");
+            loaderBar.classList.add("loader-bar");
+            loader.appendChild(loaderBar);
+            document.querySelector("body").appendChild(loader);
+        }
+    }, hit_index_1.hitIndex === 1 ? 10 : 350); // Wait 350 on subsequent requests to prevent flickering
+}
+exports.initLoader = initLoader;

package/dist/hit-index.d.ts

@@ -0,0 +1 @@
+export declare const hitIndex: number;

package/dist/hit-index.js

@@ -0,0 +1,11 @@
+"use strict";
+var _a, _b;
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.hitIndex = void 0;
+const indexName = "themejs_hit_index";
+let state = sessionStorage.getItem(indexName);
+if (state === null) {
+    sessionStorage.setItem(indexName, "0");
+}
+sessionStorage.setItem(indexName, "" + (parseInt((_a = sessionStorage.getItem(indexName)) !== null && _a !== void 0 ? _a : "0") + 1));
+exports.hitIndex = parseInt((_b = sessionStorage.getItem(indexName)) !== null && _b !== void 0 ? _b : "0");

package/docs/_layouts/blank.html

@@ -6,8 +6,6 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, shrink-to-fit=no, user-scalable=no">
 
     <link href="/assets/dist/style.css" rel="stylesheet">
-    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet">
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css">
     <script src="/assets/dist/index.js" type="module"></script>
 
 

package/docs/assets/dist/index.css

@@ -0,0 +1,222 @@
+/*!**********************************************************************************************************************************!*\
+  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/sass-loader/dist/cjs.js!./theme1.scss ***!
+  \**********************************************************************************************************************************/
+/* always add !default to variables */
+.tjs__navbar-blox {
+  --height: 88px !important;
+}
+
+:root {
+  --layout-container: container;
+}
+
+.theme1 {
+  color: var(--t-text-color);
+  background: var(--t-background);
+  font-size: 1.1rem;
+  --t-background: #f5f5f5;
+  --t-background-footer: #fff;
+  --t-section-background: transparent;
+  --t-section-background-accent: #e7e7eb;
+  --t-section-background-primary: #b7eaf9;
+  --t-text-background: #fff;
+  --t-text-color: #707070;
+  --t-text-background-light: var(--t-background);
+  --t-text-color-accent: var(--bs-gray-900);
+  --t-text-color-primary: var(--bs-primary);
+  --t-header-margin: 0 0 20px 0;
+  --t-paragraf-margin: 0 0 20px 0;
+  --t-section-padding: 40px 0;
+  --t-section-inner-padding: 3rem;
+}
+.theme1 section h2 {
+  text-transform: uppercase;
+  margin: var(--t-paragraf-margin);
+}
+.theme1 ul > li {
+  color: var(--t-text-color);
+}
+.theme1 ul > li * {
+  color: var(--t-text-color);
+}
+.theme1 h1, .theme1 h2, .theme1 h3, .theme1 h4, .theme1 h5, .theme1 h6 {
+  font-weight: 400;
+  color: var(--t-text-color);
+  margin: var(--t-header-margin, 0 0 20px 0);
+}
+.theme1 h1, .theme1 h2 {
+  font-size: 2em;
+  line-height: 1.5em;
+}
+.theme1 h3 {
+  font-size: 1.5em;
+  line-height: 1.1em;
+}
+.theme1 table {
+  color: inherit;
+}
+.theme1 table > tr {
+  color: inherit;
+}
+.theme1 table > tr > td {
+  color: inherit;
+}
+.theme1 p:empty {
+  margin: 0;
+}
+.theme1 p {
+  margin: var(--t-paragraf-margin);
+  hyphens: auto;
+}
+.theme1 p:last-child, .theme1 table:last-child {
+  margin-bottom: 0;
+}
+.theme1 address p {
+  margin: 0;
+}
+.theme1 section:last-of-type > * {
+  padding-bottom: 0;
+}
+.theme1 h1, .theme1 h2, .theme1 h3, .theme1 h4, .theme1 h5 {
+  color: var(--t-text-color);
+}
+.theme1 h1 {
+  font-size: 2.4em;
+  line-height: 1.2em;
+}
+.theme1 h2, .theme1 h3, .theme1 h4, .theme1 h5 {
+  line-height: 1.2em;
+}
+.theme1 h3, .theme1 h4, .theme1 h5 {
+  font-size: 1.15em;
+}
+.theme1 p {
+  line-height: 1.4em;
+}
+.theme1 .tjs__section-text h2 {
+  text-transform: uppercase;
+  font-weight: bold;
+  font-size: 16px;
+  color: var(--t-text-color-primary) !important;
+  margin: var(--t-paragraf-margin);
+}
+.theme1 .tjs__section-text blockquote > p {
+  font-size: 2.1em;
+  line-height: 1.2em;
+  color: var(--t-text-color) !important;
+  margin: var(--t-header-margin, 0 0 20px 0);
+  hyphens: manual;
+}
+.theme1 .tjs__section-text .table {
+  --bs-table-color: var(--t-text-color);
+}
+.theme1 .tjs__section-text *:last-child {
+  margin-bottom: 0;
+}
+.theme1 .section blockquote p {
+  font-size: 2.3em;
+}
+.theme1 .card-body {
+  color: var(--t-text-color);
+}
+.theme1 .card-body h3 {
+  font-weight: bold;
+}
+.theme1 .tjs__sec-legal-content {
+  padding-top: 100px;
+}
+.theme1 section:last-child {
+  padding-bottom: 0;
+}
+.theme1 a.btn.btn-primary {
+  color: white !important;
+}
+.theme1 input.btn.btn-primary {
+  color: white !important;
+}
+.theme1 .btn {
+  border-radius: 0;
+}
+.theme1 map {
+  --joda-class: ":: aspect-1x1 :lg: aspcect-16x9";
+}
+.theme1 .title_image {
+  background: linear-gradient(180deg, rgb(230, 225, 221) 0%, rgb(245, 240, 236) 35%, rgb(238, 238, 238) 100%);
+}
+.theme1 .title_image > img {
+  object-position: 80% 0;
+  object-fit: contain;
+}
+.theme1 .as__accordion {
+  border: 1px solid var(--bs-gray-100);
+  --as-accordion-open-bg: #fff;
+}
+.theme1 .as__accordion h3 {
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
+.theme1 .as__accordion .section-h3 {
+  border: 1px solid var(--bs-gray-200);
+  background-color: var(--bs-gray-100);
+}
+.theme1 .as__accordion .content {
+  background-color: #fff;
+}
+.theme1 .as__accordion .content p {
+  margin: 20px 20px 20px 0;
+}
+
+.openhours {
+  --joda-class: "table table-borderless";
+}
+/*!***************************************************************************************************************************************!*\
+  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/sass-loader/dist/cjs.js!./src.dev/dev.scss ***!
+  \***************************************************************************************************************************************/
+showcase-element {
+  --aspect-ratio: calc(16 / 9);
+}
+showcase-element.big {
+  --aspect-ratio: 0.5;
+}
+showcase-element .preview {
+  --scale: 0.2;
+  --width: 350px;
+  --height: calc(var(--width) / var(--aspect-ratio));
+  position: relative;
+  width: var(--width);
+  height: var(--height);
+  overflow: hidden;
+  display: inline-block;
+  border: 3px solid #ccc;
+}
+showcase-element .preview iframe {
+  position: relative;
+  right: calc(var(--width) / var(--scale) / 2 - var(--width) / 2);
+  bottom: calc(var(--height) / var(--scale) / 2 - var(--height) / 2);
+  width: calc(var(--width) / var(--scale));
+  height: calc(var(--height) / var(--scale));
+  transform: scale(var(--scale));
+}
+showcase-element .preview .overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #fff;
+  font-size: 1.5rem;
+  font-weight: bold;
+  text-align: center;
+  opacity: 0;
+  transition: opacity 0.3s ease-in-out;
+  cursor: pointer;
+}
+showcase-element .preview .overlay:hover {
+  opacity: 1;
+}
+
+/*# sourceMappingURL=index.css.map*/

package/docs/assets/dist/index.css.map

@@ -0,0 +1 @@
+{"version":3,"file":"assets/dist/index.css","mappings":";;;AAGA;AA8BA;EACI;AC/BJ;;ACAA;EACI;ADGJ;;ACDA;EAGI;EACA;EA6DA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;EAEA;EACA;AD9DJ;AE1BI;EACI;EAGA;AF0BR;AEvBI;EACI;AFyBR;AExBQ;EACI;AF0BZ;AEtBI;EACI;EACA;EACA;AFwBR;AErBI;EACI;EACA;AFuBR;AErBI;EACI;EACA;AFuBR;AEnBI;EACI;AFqBR;AEpBQ;EACI;AFsBZ;AErBY;EACI;AFuBhB;AEfI;EACI;AFiBR;AEdI;EACI;EACA;AFgBR;AERI;EACI;AFUR;AELQ;EACI;AFOZ;AEJI;EACI;AFMR;AC9DI;EACI;ADgER;AC7DI;EACI;EACA;AD+DR;AC7DI;EACI;AD+DR;AC7DI;EACI;AD+DR;AC5DI;EACI;AD8DR;AC1DQ;EACI;EACA;EACA;EACA;EACA;AD4DZ;AC1DQ;EACI;EACA;EACA;EACA;EACA;AD4DZ;ACzDQ;EACI;AD2DZ;ACxDQ;EACI;AD0DZ;ACrDQ;EACI;ADuDZ;AClDI;EAII;ADiDR;ACpDQ;EACI;ADsDZ;AC7BI;EACI;AD+BR;AC5BI;EACI;AD8BR;ACzBI;EACI;AD2BR;ACzBI;EACI;AD2BR;ACxBI;EACI;AD0BR;ACvBI;EACI;ADyBR;ACrBI;EACI;ADuBR;ACtBQ;EACI;EACA;ADwBZ;ACpBI;EACI;EACA;ADsBR;ACrBQ;EACI;EACA;ADuBZ;ACrBQ;EACI;EACA;ADuBZ;ACrBQ;EACI;ADuBZ;ACtBY;EACI;ADwBhB;;AChBA;EACI;ADmBJ,C;;;;AGpKA;EACE;AAFF;AAGE;EACE;AADJ;AAGE;EACE;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;AAJJ;AAKI;EACE;EACA;EACA;EACA;EACA;EACA;AAHN;AAMI;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAJN;AAKM;EACE;AAHR,C","sources":["webpack://@leuffen/themejs1/./_variables.scss","webpack://@leuffen/themejs1/./theme1.scss","webpack://@leuffen/themejs1/./themes/theme1/index.scss","webpack://@leuffen/themejs1/./themes/_mixins/default-element-format.scss","webpack://@leuffen/themejs1/./src.dev/dev.scss"],"sourcesContent":["\n\n\n/* always add !default to variables */\n\n\n//$font-family-base: Ubuntu-R,sans-serif;\n$font-family-base: sans-serif !default;\n\n$primary:   #a3979b !default;\n$success:   #22b573 !default;\n$danger:    #bf1c0a !default;\n$warning:   #bf760a !default;\n$dark:      #006837 !default;\n\n$background-primary:        #b7eaf9 !default;\n$background-accent:         #ddd    !default;\n\n$content-offset-top:        100px !default;\n$content-height-adjustment: 200px !default;\n\n$font-size-base:            0.9rem  !default;\n$line-height-base:          1.2     !default;\n$paragraph-margin-bottom:   1.5rem !default;\n\n$minibar-text-color:        black !default;\n$minibar-color:             transparent !default;\n\n$border-radius:             0 !default;\n\n\n\n\n.tjs__navbar-blox {\n    --height: 88px !important;\n}\n\n\n","/* always add !default to variables */\n.tjs__navbar-blox {\n  --height: 88px !important;\n}\n\n:root {\n  --layout-container: container;\n}\n\n.theme1 {\n  color: var(--t-text-color);\n  background: var(--t-background);\n  font-size: 1.1rem;\n  --t-background: #f5f5f5;\n  --t-background-footer: #fff;\n  --t-section-background: transparent;\n  --t-section-background-accent: #e7e7eb;\n  --t-section-background-primary: #b7eaf9;\n  --t-text-background: #fff;\n  --t-text-color: #707070;\n  --t-text-background-light: var(--t-background);\n  --t-text-color-accent: var(--bs-gray-900);\n  --t-text-color-primary: var(--bs-primary);\n  --t-header-margin: 0 0 20px 0;\n  --t-paragraf-margin: 0 0 20px 0;\n  --t-section-padding: 40px 0;\n  --t-section-inner-padding: 3rem;\n}\n.theme1 section h2 {\n  text-transform: uppercase;\n  margin: var(--t-paragraf-margin);\n}\n.theme1 ul > li {\n  color: var(--t-text-color);\n}\n.theme1 ul > li * {\n  color: var(--t-text-color);\n}\n.theme1 h1, .theme1 h2, .theme1 h3, .theme1 h4, .theme1 h5, .theme1 h6 {\n  font-weight: 400;\n  color: var(--t-text-color);\n  margin: var(--t-header-margin, 0 0 20px 0);\n}\n.theme1 h1, .theme1 h2 {\n  font-size: 2em;\n  line-height: 1.5em;\n}\n.theme1 h3 {\n  font-size: 1.5em;\n  line-height: 1.1em;\n}\n.theme1 table {\n  color: inherit;\n}\n.theme1 table > tr {\n  color: inherit;\n}\n.theme1 table > tr > td {\n  color: inherit;\n}\n.theme1 p:empty {\n  margin: 0;\n}\n.theme1 p {\n  margin: var(--t-paragraf-margin);\n  hyphens: auto;\n}\n.theme1 p:last-child, .theme1 table:last-child {\n  margin-bottom: 0;\n}\n.theme1 address p {\n  margin: 0;\n}\n.theme1 section:last-of-type > * {\n  padding-bottom: 0;\n}\n.theme1 h1, .theme1 h2, .theme1 h3, .theme1 h4, .theme1 h5 {\n  color: var(--t-text-color);\n}\n.theme1 h1 {\n  font-size: 2.4em;\n  line-height: 1.2em;\n}\n.theme1 h2, .theme1 h3, .theme1 h4, .theme1 h5 {\n  line-height: 1.2em;\n}\n.theme1 h3, .theme1 h4, .theme1 h5 {\n  font-size: 1.15em;\n}\n.theme1 p {\n  line-height: 1.4em;\n}\n.theme1 .tjs__section-text h2 {\n  text-transform: uppercase;\n  font-weight: bold;\n  font-size: 16px;\n  color: var(--t-text-color-primary) !important;\n  margin: var(--t-paragraf-margin);\n}\n.theme1 .tjs__section-text blockquote > p {\n  font-size: 2.1em;\n  line-height: 1.2em;\n  color: var(--t-text-color) !important;\n  margin: var(--t-header-margin, 0 0 20px 0);\n  hyphens: manual;\n}\n.theme1 .tjs__section-text .table {\n  --bs-table-color: var(--t-text-color);\n}\n.theme1 .tjs__section-text *:last-child {\n  margin-bottom: 0;\n}\n.theme1 .section blockquote p {\n  font-size: 2.3em;\n}\n.theme1 .card-body {\n  color: var(--t-text-color);\n}\n.theme1 .card-body h3 {\n  font-weight: bold;\n}\n.theme1 .tjs__sec-legal-content {\n  padding-top: 100px;\n}\n.theme1 section:last-child {\n  padding-bottom: 0;\n}\n.theme1 a.btn.btn-primary {\n  color: white !important;\n}\n.theme1 input.btn.btn-primary {\n  color: white !important;\n}\n.theme1 .btn {\n  border-radius: 0;\n}\n.theme1 map {\n  --joda-class: \":: aspect-1x1 :lg: aspcect-16x9\";\n}\n.theme1 .title_image {\n  background: linear-gradient(180deg, rgb(230, 225, 221) 0%, rgb(245, 240, 236) 35%, rgb(238, 238, 238) 100%);\n}\n.theme1 .title_image > img {\n  object-position: 80% 0;\n  object-fit: contain;\n}\n.theme1 .as__accordion {\n  border: 1px solid var(--bs-gray-100);\n  --as-accordion-open-bg: #fff;\n}\n.theme1 .as__accordion h3 {\n  padding-top: 10px;\n  padding-bottom: 10px;\n}\n.theme1 .as__accordion .section-h3 {\n  border: 1px solid var(--bs-gray-200);\n  background-color: var(--bs-gray-100);\n}\n.theme1 .as__accordion .content {\n  background-color: #fff;\n}\n.theme1 .as__accordion .content p {\n  margin: 20px 20px 20px 0;\n}\n\n.openhours {\n  --joda-class: \"table table-borderless\";\n}","@import \"../../variables\";\n@import \"../_mixins/default-element-format\";\n\n:root {\n    --layout-container: container;\n}\n.theme1 {\n    @include default-element-format();\n\n    color: var(--t-text-color);\n    background: var(--t-background);\n\n\n    h1,h2,h3,h4,h5 {\n        color: var(--t-text-color);\n    }\n\n    h1 {\n        font-size: 2.4em;\n        line-height: 1.2em;\n    }\n    h2, h3,h4,h5 {\n        line-height: 1.2em;\n    }\n    h3,h4,h5 {\n        font-size: 1.15em;\n    }\n\n    p {\n        line-height: 1.4em;\n    }\n\n    .tjs__section-text {\n        h2 {\n            text-transform: uppercase;\n            font-weight: bold;\n            font-size: 16px;\n            color: var(--t-text-color-primary) !important;\n            margin: var(--t-paragraf-margin);\n        }\n        blockquote > p {\n            font-size: 2.1em;\n            line-height: 1.2em;\n            color: var(--t-text-color) !important;\n            margin: var(--t-header-margin, 0 0 20px 0);\n            hyphens: manual;\n        }\n\n        .table {\n            --bs-table-color: var(--t-text-color);\n        }\n\n        *:last-child {\n            margin-bottom: 0;\n        }\n    }\n\n    .section {\n        blockquote p {\n            font-size: 2.3em;\n        }\n    }\n\n\n    .card-body {\n        h3 {\n            font-weight: bold;\n        }\n        color: var(--t-text-color);\n    }\n\n    font-size: 1.1rem;\n\n    --t-background: #f5f5f5;\n    --t-background-footer: #fff;\n    --t-section-background: transparent;\n    --t-section-background-accent: #e7e7eb;\n    --t-section-background-primary: #{$background-primary};\n    --t-text-background: #fff;\n    --t-text-color: #707070;\n    --t-text-background-light: var(--t-background);\n    --t-text-color-accent: var(--bs-gray-900);\n    --t-text-color-primary: var(--bs-primary);\n\n\n    --t-header-margin: 0 0 20px 0;\n    --t-paragraf-margin: 0 0 20px 0;\n\n    --t-section-padding: 40px 0;\n    --t-section-inner-padding: 3rem;\n\n    .tjs__sec-legal-content {\n        padding-top: 100px;\n    }\n\n    section:last-child {\n        padding-bottom: 0;\n    }\n\n    //    background: var(--bs-light);\n\n    a.btn.btn-primary {\n        color: white !important;\n    }\n    input.btn.btn-primary {\n        color: white !important;\n    }\n\n    .btn {\n        border-radius: 0;\n    }\n\n    map {\n        --joda-class: \":: aspect-1x1 :lg: aspcect-16x9\";\n    }\n\n\n    .title_image {\n        background: linear-gradient(180deg, rgba(230,225,221,1) 0%, rgba(245,240,236,1) 35%, rgba(238,238,238,1) 100%);;\n        & > img {\n            object-position: 80% 0;\n            object-fit: contain;\n        }\n    }\n\n    .as__accordion {\n        border: 1px solid var(--bs-gray-100);\n        --as-accordion-open-bg: #fff;\n        h3 {\n            padding-top: 10px;\n            padding-bottom: 10px;\n        }\n        .section-h3 {\n            border: 1px solid var(--bs-gray-200);\n            background-color: var(--bs-gray-100);\n        }\n        .content {\n            background-color: #fff;\n            p {\n                margin: 20px 20px 20px 0;\n            }\n        }\n\n    }\n\n\n}\n.openhours {\n    --joda-class: \"table table-borderless\";\n}\n","@mixin default-element-format() {\n    section h2 {\n        text-transform: uppercase;\n        // font-weight: bold;\n\n        margin: var(--t-paragraf-margin);\n    }\n\n    ul > li  {\n        color: var(--t-text-color);\n        * {\n            color: var(--t-text-color);\n        }\n    }\n\n    h1,h2,h3,h4,h5,h6 {\n        font-weight: 400;\n        color: var(--t-text-color);\n        margin: var(--t-header-margin, 0 0 20px 0);\n    }\n\n    h1,h2 {\n        font-size: 2em;\n        line-height: 1.5em;\n    }\n    h3 {\n        font-size: 1.5em;\n        line-height: 1.1em;\n    }\n\n\n    table {\n        color: inherit;\n        &> tr {\n            color: inherit;\n            &>td {\n                color: inherit;\n            }\n        }\n    }\n\n\n\n    // Paragraph styling\n    p:empty {\n        margin: 0;\n    }\n\n    p {\n        margin: var(--t-paragraf-margin);\n        hyphens: auto; // Wortumbruch\n    }\n\n    p:first-child {\n        //color: var(--t-text-color-accent)\n    }\n\n    // Important: Remove margin from last paragraph in section\n    p:last-child,table:last-child {\n        margin-bottom: 0;\n    }\n\n\n    address {\n        p {\n            margin: 0;\n        }\n    }\n    section:last-of-type > * {\n        padding-bottom: 0;\n    }\n\n}\n","\n\n\nshowcase-element {\n  --aspect-ratio: calc(16 / 9);\n  &.big {\n    --aspect-ratio: 0.5;\n  }\n  .preview {\n    --scale: 0.2;\n\n    --width: 350px;\n    --height: calc(var(--width) / var(--aspect-ratio));\n    position: relative;\n    width: var(--width);\n    height: var(--height);\n    overflow: hidden;\n    display: inline-block;\n\n\n    border: 3px solid #ccc;\n    iframe {\n      position: relative;\n      right: calc((var(--width) / var(--scale) / 2) - var(--width) / 2);\n      bottom: calc((var(--height) / var(--scale) / 2) - var(--height) / 2);\n      width: calc(var(--width) / var(--scale));\n      height: calc(var(--height) / var(--scale));\n      transform: scale(var(--scale));\n    }\n\n    .overlay {\n      position: absolute;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      background: rgba(0, 0, 0, 0.5);\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: #fff;\n      font-size: 1.5rem;\n      font-weight: bold;\n      text-align: center;\n      opacity: 0;\n      transition: opacity 0.3s ease-in-out;\n      cursor: pointer;\n      &:hover {\n        opacity: 1;\n      }\n    }\n  }\n\n}\n"],"names":[],"sourceRoot":""}