@leuffen/themejs1 8.2.60 → 8.2.62

package/_tpl/_root/package.json

@@ -10,7 +10,7 @@
     "author": "",
     "dependencies": {
         "@leuffen/themejs1": "^8.0.6",
-        "@nextrap/nte-nav": "^0.2.25",
+        "@nextrap/nte-nav": "^1.0.4",
         "@nextrap/style-base": "^1.1.5"
     },
     "devDependencies": {

package/font/metropolis.scss

@@ -0,0 +1,7 @@
+@import "../themes/_vendor/font-metropolis";
+
+$font-family-base: 'Metropolis', sans-serif !default;
+$font-size-base: 1.1rem !default;
+
+$font-family-headeer: $font-family-base !default;
+$font-size-header: 3.8rem !default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leuffen/themejs1",
-  "version": "8.2.60",
+  "version": "8.2.62",
   "description": "",
   "license": "proprietary",
   "main": "./index.js",
@@ -40,19 +40,19 @@
     "@micx/lib-js": "^1.0.24",
     "@types/node": "^20.12.12",
     "bootstrap": "^5.3.0",
-    "css-loader": "^6.7.1",
+    "css-loader": "^7.1.2",
     "dart-sass": "^1.25.0",
-    "esbuild-loader": "^2.20.0",
+    "esbuild-loader": "^4.3.0",
     "markdown-it": "^13.0.1",
     "markdown-it-attrs": "^4.1.6",
-    "mini-css-extract-plugin": "^2.6.1",
+    "mini-css-extract-plugin": "^2.9.2",
     "raw-loader": "^4.0.2",
-    "sass": "^1.56.1",
-    "sass-loader": "^13.0.2",
-    "style-loader": "^3.3.1",
-    "webpack": "^5.75.0",
-    "webpack-cli": "^5.0.1",
-    "webpack-dev-server": "^4.11.1"
+    "sass": "^1.89.2",
+    "sass-loader": "^16.0.5",
+    "style-loader": "^4.0.0",
+    "webpack": "^5.100.1",
+    "webpack-cli": "^6.0.1",
+    "webpack-dev-server": "^5.2.2"
   },
   "scripts": {
     "make.mjs": "tsc -d",

package/sections/hero-max/hero-max.scss

@@ -7,10 +7,10 @@
     --layout-desktop-overlay2-background: none;
     --layout-desktop-overlay3-background: none;
     --layout-desktop-image-mask: none;
-
+    --fullsize-modifier: 250px;
     --layout-desktop-top-space: 200px;
     --layout-desktop-min-height: 600px;
-    --layout-desktop-max-height: 1100px;
+    --layout-destkop-max-height: 1200px;
 
     --joda-class: ":: mobile :xl: desktop";
     --layout-image-ratio: 16 / 10;
@@ -97,7 +97,7 @@
         min-height: var(--layout-desktop-min-height);
         position: relative;
         &.tjs__hero-max--autoheight {
-            height: calc(100vh - var(--t-fullsize-modifier, 50px));
+            height: calc(100vh - var(--fullsize-modifier, 50px));
             min-height: var(--layout-desktop-min-height);
             max-height: var(--layout-destkop-max-height);
         }

package/sections/sec-card-2col/sec-card-2col.js

@@ -6,7 +6,7 @@ Joda.registerTemplate("sec-card-2col",
         <section class="tjs__sec-card-2col [[layout.class]] :: mobile :lg: desktop">
             <div class="tjs__sec-card-2col--container [[layout.container]]">
                 <slot class="title" data-select="img.title || .title > img"></slot>
-                <div class="row [[layout.order === 'reverse' ? 'flex-column-reverse': '']] [[layout.mobile_reverse === 'yes' ? ':: flex-column-reverse :lg:': '']]">
+                <div class="row [[layout.order === 'reverse' ? ':: flex-column-reverse :lg: flex-row-reverse': '']] [[layout.mobile_reverse === 'yes' ? ':: flex-column-reverse :lg:': '']]">
                     <div class="tjs__sec-card-2col--col-start heading-style-flex :: col-12 :lg: col-[[layout.cols]]">
                         <slot></slot>
                     </div>

package/sections/sec-card-2col/sec-card-2col.ts

@@ -11,7 +11,7 @@ Joda.registerTemplate(
         <section class="tjs__sec-card-2col [[layout.class]] :: mobile :lg: desktop">
             <div class="tjs__sec-card-2col--container [[layout.container]]">
                 <slot class="title" data-select="img.title || .title > img"></slot>
-                <div class="row [[layout.order === 'reverse' ? 'flex-column-reverse': '']] [[layout.mobile_reverse === 'yes' ? ':: flex-column-reverse :lg:': '']]">
+                <div class="row [[layout.order === 'reverse' ? ':: flex-column-reverse :lg: flex-row-reverse': '']] [[layout.mobile_reverse === 'yes' ? ':: flex-column-reverse :lg:': '']]">
                     <div class="tjs__sec-card-2col--col-start heading-style-flex :: col-12 :lg: col-[[layout.cols]]">
                         <slot></slot>
                     </div>

package/themes/_vendor/font-metropolis.scss

@@ -0,0 +1,28 @@
+@font-face {
+    font-family: "Metropolis";
+    src: url("https://cdn.leuffen.de/global/fonts/metropolis/Metropolis-Regular.woff2") format("woff2");
+    font-weight: 300;
+    font-style: normal;
+    font-display: swap;
+}
+
+/* END Light */
+/* BEGIN Light Italic */
+@font-face {
+    font-family: "Metropolis";
+    src: url("https://cdn.leuffen.de/global/fonts/metropolis/Metropolis-Light.woff2") format("woff2");
+    font-weight: 100;
+    font-style: normal;
+    font-display: swap;
+}
+
+/* END Light Italic */
+/* BEGIN Regular */
+@font-face {
+    font-family: "Metropolis";
+    src: url("https://cdn.leuffen.de/global/fonts/metropolis/Metropolis-SemiBold.woff2") format("woff2");
+    font-weight: bold;
+    font-style: normal;
+    font-display: swap;
+}
+