Updated the themes to comply with html5-boilerplate v9.

jclo · Jan 27, 2024 · ffa2751 · ffa2751
1 parent 255d1fe
commit ffa2751
Show file tree

Hide file tree

Showing 17 changed files with 429 additions and 598 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,11 @@
 ### HEAD
 
+### 2.5.0 (January 27, 2024)
+
+  * Updated the themes to comply with html5-boilerplate v9,
+  * ...,
+
+
 ### 2.4.0 (January 26, 2024)
 
   * Updated the project with @mobilabs/es6kadoo v2.1 (Github Actions),

diff --git a/_site-theme-appdoceo/.kasar/theme-config.js b/_site-theme-appdoceo/.kasar/theme-config.js
@@ -34,7 +34,7 @@ module.exports = {
   // This is the theme used to build your website:
   theme: {
     name: 'appdoceo',
-    version: '2.1.1', // built from Kasar v^2.1.1"
+    version: '2.2.0', // built from Kasar v2.4.0"
   },
 
   // Where is the root of the project:
@@ -82,10 +82,10 @@ module.exports = {
   ],
 
   // These are the files from 'HTML5 Boilerplate' to include in the project.
-  html5: {
-    modernizr: `${base}/node_modules/html5-boilerplate/dist/js/vendor/modernizr-3.11.2.min.js`,
-    normalize: `${base}/node_modules/html5-boilerplate/dist/css/normalize.css`,
-  },
+  // html5: {
+  //   modernizr: `${base}/node_modules/html5-boilerplate/dist/js/vendor/modernizr-3.11.2.min.js`,
+  //   normalize: `${base}/node_modules/html5-boilerplate/dist/css/normalize.css`,
+  // },
 
   // These are the fonts to include in your website folder under the
   // directory 'fonts'.

diff --git a/_site-theme-appdoceo/.kasar/theme/public/index.html b/_site-theme-appdoceo/.kasar/theme/public/index.html
@@ -1,12 +1,16 @@
-<!-- {{app:name}} v{{app:version}} built with Pulsar 1.1.2 and based on HTML5 boilerplate v^8.0.0 -->
+<!-- {{app:name}} v{{app:version}} built with Pulsar 1.1.2 and based on HTML5 boilerplate v^9.0.0 -->
 <!doctype html>
 <html class="no-js" lang="" data-theme="light">
   <head>
     <!-- {{tracker:google}} -->
     <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>{{app:title}}</title>
+
+    <link rel="stylesheet" href="./css/wapp.min.css">
+    <link id="highlight-color-theme" rel="stylesheet" href="{{base:path}}css/fake.css">
+
     <meta name="description" content="{{app:description}}">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
     <meta name="{{company:name}}" content="{{company:slogan}}" />
     <meta name="copyright" content="{{company:copyright}}" />
 
@@ -16,48 +20,32 @@
     <meta property="og:url" content="">
     <meta property="og:image" content="">
 
-    <!-- Set your canonical link -->
-    <link rel="canonical" href="{{app:canonical-link}}" />
+    <!-- Place favicon (icon-32x32.png) in the root directory -->
+    <link rel="icon" type="image/png" sizes="32x32" href="img/icons/icon-32x32.png" />
 
     <!-- PWA manifest, Web manifest -->
     <link rel="manifest" href="manifest.json">
     <link rel="manifest" href="site.webmanifest">
 
-    <!-- Place favicon (icon-32x32.png) in the root directory -->
-    <link rel="icon" type="image/png" sizes="32x32" href="img/icons/icon-32x32.png" />
-
     <!-- iOS support -->
     <meta name="apple-mobile-web-app-capable" content="yes">
     <meta name="apple-mobile-web-app-status-bar-style" content="black">
     <meta name="apple-mobile-web-app-title" content="{{app:title}}">
     <link rel="apple-touch-icon" href="img/icons/icon-152x152.png">
 
-    <link rel="stylesheet" href="./css/wapp.min.css">
-    <link id="highlight-color-theme" rel="stylesheet" href="{{base:path}}css/fake.css">
     <meta name="theme-color" content="#fafafa">
   </head>
 
   <body>
-    <!--[if IE]>
-      <p class="browserupgrade">You are using an <strong>outdated and unsupported</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to benefit of all the features of this web App.</p>
-    <![endif]-->
-
     <!-- Warning message if Javascript isn't enabled -->
-    <noscript>
-      <p style="text-align:center;padding-top:3em;">
-        We are sorry, but this website doesn't work properly without JavaScript enabled!
-      </p>
-    </noscript>
+    <noscript><p style="text-align:center;padding-top:3em;">We are sorry, but this website doesn't work properly without JavaScript enabled!</p></noscript>
 
     <!-- Add your site or application content here -->
     <div id="app"></div>
 
     <!-- Add your scripts here -->
     <!-- {{extra:scripts}} -->
     <script src="./js/wapp.min.js"></script>
-    <!-- <script type="module">
-      import KApp from './js/wapp.min.mjs';
-    </script> -->
     <!-- {{tracker:kiwi}} -->
     <!-- {{tracker:axeptio}} -->
   </body>

diff --git a/_site-theme-appdoceo/.kasar/theme/public/offline.html b/_site-theme-appdoceo/.kasar/theme/public/offline.html
@@ -1,11 +1,14 @@
-<!-- {{app:name}} v{{app:version}} built with Pulsar 1.1.2 and based on HTML5 boilerplate v^8.0.0 -->
+<!-- {{app:name}} v{{app:version}} built with Pulsar 1.1.2 and based on HTML5 boilerplate v^9.0.0 -->
 <!doctype html>
 <html class="no-js" lang="">
   <head>
     <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>{{app:title}}</title>
+
+    <link rel="stylesheet" href="./css/wapp.min.css">
+
     <meta name="description" content="{{app:description}}">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
     <meta name="{{company:name}}" content="{{company:slogan}}" />
     <meta name="copyright" content="{{company:copyright}}" />
 
@@ -15,37 +18,25 @@
     <meta property="og:url" content="">
     <meta property="og:image" content="">
 
-    <!-- Set your canonical link -->
-    <link rel="canonical" href="{{app:canonical-link}}" />
+    <!-- Place favicon.ico in the root directory -->
+    <link rel="icon" type="image/png" sizes="32x32" href="img/icons/icon-32x32.png" />
 
     <!-- PWA manifest, Web manifest -->
     <link rel="manifest" href="manifest.json">
     <link rel="manifest" href="site.webmanifest">
 
-    <!-- Place favicon.ico in the root directory -->
-    <link rel="icon" href="favicon.ico" type="image/x-icon" />
-
     <!-- iOS support -->
     <meta name="apple-mobile-web-app-capable" content="yes">
     <meta name="apple-mobile-web-app-status-bar-style" content="black">
     <meta name="apple-mobile-web-app-title" content="{{app:title}}">
     <link rel="apple-touch-icon" href="img/icons/icon-152x152.png">
 
-    <link rel="stylesheet" href="./css/wapp.min.css">
     <meta name="theme-color" content="#fafafa">
   </head>
 
   <body>
-    <!--[if IE]>
-      <p class="browserupgrade">You are using an <strong>outdated and unsupported</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to benefit of all the features of this web App.</p>
-    <![endif]-->
-
     <!-- Warning message if Javascript isn't enabled -->
-    <noscript>
-      <p style="text-align:center;padding-top:3em;">
-        We are sorry, but this website doesn't work properly without JavaScript enabled!
-      </p>
-    </noscript>
+    <noscript><p style="text-align:center;padding-top:3em;">We are sorry, but this website doesn't work properly without JavaScript enabled!</p></noscript>
 
     <!-- Add your site or application content here -->
     <p style="text-align: center; padding-top: 100px;">

diff --git a/_site-theme-appdoceo/.kasar/theme/scripts/libs/parse.js b/_site-theme-appdoceo/.kasar/theme/scripts/libs/parse.js
@@ -25,8 +25,6 @@
 /* eslint one-var: 0, semi-style: 0, no-underscore-dangle: 0,
   import/no-extraneous-dependencies: 0 */
 
-'use strict';
-
 
 // -- Node modules
 const fs   = require('fs')

diff --git a/_site-theme-doceo/.kasar/theme-config.js b/_site-theme-doceo/.kasar/theme-config.js
@@ -20,7 +20,7 @@ module.exports = {
   // This is the theme used to build your website:
   theme: {
     name: 'doceo',
-    version: '2.0.2', // built from Kasar v^2.1.0
+    version: '2.1.0', // built from Kasar v2.4.0"
   },
 
   // Where is the root of the project:
@@ -66,10 +66,10 @@ module.exports = {
   ],
 
   // These are the files from 'HTML5 Boilerplate' to include in the project.
-  html5: {
-    modernizr: `${base}/node_modules/html5-boilerplate/dist/js/vendor/modernizr-3.11.2.min.js`,
-    normalize: `${base}/node_modules/html5-boilerplate/dist/css/normalize.css`,
-  },
+  // html5: {
+  //   modernizr: `${base}/node_modules/html5-boilerplate/dist/js/vendor/modernizr-3.11.2.min.js`,
+  //   normalize: `${base}/node_modules/html5-boilerplate/dist/css/normalize.css`,
+  // },
 
   // These are the fonts to include in your website folder under the
   // directory 'fonts'.

diff --git a/_site-theme-doceo/.kasar/theme/pages/lib/vdom.js b/_site-theme-doceo/.kasar/theme/pages/lib/vdom.js
@@ -44,14 +44,19 @@ function _getHTMLTemplate(product, kversion, theme, lang) {
   return `
     <!doctype html>
     <!-- ${product.name} v${product.version} built with Kasar ${kversion} and the theme ${theme.name} v${theme.version} -->
-    <!-- based on HTML5 boilerplate v8.0.0 -->
+    <!-- based on HTML5 boilerplate v9.0.0 -->
     <html class="no-js" lang="${lang || ''}" data-theme="light">
       <head>
         <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
         <title></title>
+
+        <link rel="stylesheet" href="{{path:fonts}}">
+        <link rel="stylesheet" href="${basepath}css/style.css">
+        <link id="highlight-color-theme" rel="stylesheet" href="${basepath}css/fake.css">
+
         <meta name="verify-v1" content="-">
         <meta name="description" content="">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
         <meta name="${company.name}" content="${company.description}" />
         <meta name="copyright" content="${company.copyright}" />
 
@@ -61,37 +66,19 @@ function _getHTMLTemplate(product, kversion, theme, lang) {
         <meta property="og:url" content="">
         <meta property="og:image" content="">
 
-        <!-- Set your canonical link -->
-        <link rel="canonical" href="${company.url.protocol}://${company.url.domain}" />
-
-        <!-- PWA manifest, Web manifest -->
-        <link rel="manifest" href="${basepath}manifest.json">
-        <link rel="manifest" href="${basepath}site.webmanifest">
-
         <!-- Place favicon (icon-32x32.png) in the root directory -->
         <link rel="icon" type="image/png" sizes="32x32" href="${basepath}img/icons/icon-32x32.png" />
         <link rel="apple-touch-icon" sizes="192x192" href="${basepath}img/icons/icon-192x192.png">
 
-        <style type="text/css">
-        /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
-        </style>
-        <link rel="stylesheet" href="{{path:fonts}}">
-        <link rel="stylesheet" href="${basepath}css/style.css">
-        <link id="highlight-color-theme" rel="stylesheet" href="${basepath}css/fake.css">
+        <!-- PWA manifest, Web manifest -->
+        <link rel="manifest" href="${basepath}manifest.json">
+        <link rel="manifest" href="${basepath}site.webmanifest">
 
         <meta name="theme-color" content="#fafafa">
       </head>
       <body>
-        <!--[if IE]>
-          <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
-        <![endif]-->
-
         <!-- Warning message if Javascript isn't enabled -->
-        <noscript>
-          <p style="text-align:center;padding-top:3em;">
-            We are sorry, but this website doesn't work properly without JavaScript enabled!
-          </p>
-        </noscript>
+        <noscript><p style="text-align:center;padding-top:3em;">We are sorry, but this website doesn't work properly without JavaScript enabled!</p></noscript>
 
         <!-- Add your site or application content here -->
         <div id="kasarapp"></div>
@@ -178,18 +165,18 @@ function _appendTopScripts(vdom, scripts) {
  * @returns {}              -,
  * @since 0.0.0
  */
-function _insertNormalize(vdom, norm) {
-  const old = vdom.window.document.querySelector('style')
-      , style = vdom.window.document.createElement('style')
-      ;
+// function _insertNormalize(vdom, norm) {
+//   const old = vdom.window.document.querySelector('style')
+//       , style = vdom.window.document.createElement('style')
+//       ;
 
-  style.setAttribute('type', 'text/css');
-  style.innerHTML = norm;
+//   style.setAttribute('type', 'text/css');
+//   style.innerHTML = norm;
 
-  const parent = old.parentNode;
-  parent.insertBefore(style, old);
-  parent.removeChild(old);
-}
+//   const parent = old.parentNode;
+//   parent.insertBefore(style, old);
+//   parent.removeChild(old);
+// }
 
 /**
  * Sets the url of the server supplying the fonts.
@@ -319,12 +306,12 @@ const methods = {
    * @returns {Object}      returns this,
    * @since 0.0.0
    */
-  addHead(title, description, norm) {
+  addHead(title, description/* , norm */) {
     _setTitle(this.vdom, title);
     _setGoogleVerify(this.vdom, google);
     _setDescription(this.vdom, description);
     _setFontUrl(this.vdom, fonts.remote);
-    _insertNormalize(this.vdom, norm);
+    // _insertNormalize(this.vdom, norm);
     return this;
   },