claritas-web-framework 5.1.21 → 5.1.22

package/styles/modules/tile.css

@@ -1,4 +1,4 @@
-@import '../mixins/group.css';
+@import "../mixins/group.css";
 
 .tile {
   --background-color: var(--white);

package/styles/modules.css

@@ -1,12 +1,12 @@
-@import './modules/alert.css';
-@import './modules/breadcrumbs.css';
-@import './modules/button.css';
-@import './modules/card.css';
-@import './modules/close.css';
-@import './modules/details.css';
-@import './modules/dialog.css';
-@import './modules/dropdown.css';
-@import './modules/form.css';
+@import "./modules/alert.css";
+@import "./modules/breadcrumbs.css";
+@import "./modules/button.css";
+@import "./modules/card.css";
+@import "./modules/close.css";
+@import "./modules/details.css";
+@import "./modules/dialog.css";
+@import "./modules/dropdown.css";
+@import "./modules/form.css";
 @import "./modules/form/form-field-group.css";
 @import "./modules/form/checkbox.css";
 @import "./modules/form/file.css";
@@ -16,11 +16,11 @@
 @import "./modules/form/range.css";
 @import "./modules/form/select.css";
 @import "./modules/form/text.css";
-@import './modules/list.css';
-@import './modules/loader.css';
-@import './modules/nav.css';
-@import './modules/pill.css';
-@import './modules/table.css';
-@import './modules/tabs.css';
-@import './modules/tag.css';
-@import './modules/tile.css';
+@import "./modules/list.css";
+@import "./modules/loader.css";
+@import "./modules/nav.css";
+@import "./modules/pill.css";
+@import "./modules/table.css";
+@import "./modules/tabs.css";
+@import "./modules/tag.css";
+@import "./modules/tile.css";

package/styles/utilities/align.css

@@ -2,4 +2,4 @@
   .valign--$(name) {
     vertical-align: $name !important;
   }
-}
+}

package/styles/utilities/pointer-events.css

@@ -2,4 +2,4 @@
   .pointer-events--$(name) {
     pointer-events: $name !important;
   }
-}
+}

package/styles/utilities/position.css

@@ -40,19 +40,19 @@
 
 @each $name in (0, 50, 100) {
   .top--$(name) {
-    top: $(name)% !important;
+    top: $(name) % !important;
   }
 
   .right--$(name) {
-    right: $(name)% !important;
+    right: $(name) % !important;
   }
 
   .bottom--$(name) {
-    bottom: $(name)% !important;
+    bottom: $(name) % !important;
   }
 
   .left--$(name) {
-    left: $(name)% !important;
+    left: $(name) % !important;
   }
 }
 
@@ -60,20 +60,20 @@
   @each $name in (0, 50, 100) {
     @media (--viewport-$(view)) {
       .top--$(view)-$(name) {
-        top: $(name)% !important;
+        top: $(name) % !important;
       }
 
       .bottom--$(view)-$(name) {
-        bottom: $(name)% !important;
+        bottom: $(name) % !important;
       }
 
       .left--$(view)-$(name) {
-        left: $(name)% !important;
+        left: $(name) % !important;
       }
 
       .right--$(view)-$(name) {
-        right: $(name)% !important;
+        right: $(name) % !important;
       }
     }
   }
-}
+}

package/styles/utilities/shadow.css

@@ -1,5 +1,7 @@
-@each $name in (none, small, medium, large, inverse-small, inverse-medium, inverse-large) {
+@each $name
+  in (none, small, medium, large, inverse-small, inverse-medium, inverse-large)
+{
   .box-shadow--$(name) {
     box-shadow: var(--box-shadow-#{$name}) !important;
   }
-}
+}

package/styles/utilities/size.css

@@ -1,50 +1,50 @@
 @for $i from 1 through 100 {
   .width--$(i) {
-    width: $(i)% !important;
+    width: $(i) % !important;
   }
 
   .height--$(i) {
-    height: $(i)% !important;
+    height: $(i) % !important;
   }
 
   .max-width--$(i) {
-    max-width: $(i)% !important;
+    max-width: $(i) % !important;
   }
 
   .max-height--$(i) {
-    max-height: $(i)% !important;
+    max-height: $(i) % !important;
   }
 
   .min-width--$(i) {
-    min-width: $(i)% !important;
+    min-width: $(i) % !important;
   }
 
   .min-height--$(i) {
-    min-height: $(i)% !important;
+    min-height: $(i) % !important;
   }
 
   .width--$(i)-viewport {
-    width: $(i)vw !important;
+    width: $(i) vw !important;
   }
 
   .height--$(i)-viewport {
-    height: $(i)vh !important;
+    height: $(i) vh !important;
   }
 
   .max-width--$(i)-viewport {
-    max-width: $(i)vw !important;
+    max-width: $(i) vw !important;
   }
 
   .max-height--$(i)-viewport {
-    max-height: $(i)vh !important;
+    max-height: $(i) vh !important;
   }
 
   .min-width--$(i)-viewport {
-    min-width: $(i)vw !important;
+    min-width: $(i) vw !important;
   }
 
   .min-height--$(i)-viewport {
-    min-height: $(i)vh !important;
+    min-height: $(i) vh !important;
   }
 }
 
@@ -52,51 +52,51 @@
   @for $i from 1 through 100 {
     @media (--viewport-$(view)) {
       .width--$(view)-$(i) {
-        width: $(i)% !important;
+        width: $(i) % !important;
       }
 
       .height--$(view)-$(i) {
-        height: $(i)% !important;
+        height: $(i) % !important;
       }
 
       .max-width--$(view)-$(i) {
-        max-width: $(i)% !important;
+        max-width: $(i) % !important;
       }
 
       .max-height--$(view)-$(i) {
-        max-height: $(i)% !important;
+        max-height: $(i) % !important;
       }
 
       .min-width--$(view)-$(i) {
-        min-width: $(i)% !important;
+        min-width: $(i) % !important;
       }
 
       .min-height--$(view)-$(i) {
-        min-height: $(i)% !important;
+        min-height: $(i) % !important;
       }
 
       .width--$(view)-$(i)-viewport {
-        width: $(i)vw !important;
+        width: $(i) vw !important;
       }
 
       .height--$(view)-$(i)-viewport {
-        height: $(i)vh !important;
+        height: $(i) vh !important;
       }
 
       .max-width--$(view)-$(i)-viewport {
-        max-width: $(i)vw !important;
+        max-width: $(i) vw !important;
       }
 
       .max-height--$(view)-$(i)-viewport {
-        max-height: $(i)vh !important;
+        max-height: $(i) vh !important;
       }
 
       .min-width--$(view)-$(i)-viewport {
-        min-width: $(i)vw !important;
+        min-width: $(i) vw !important;
       }
 
       .min-height--$(view)-$(i)-viewport {
-        min-height: $(i)vh !important;
+        min-height: $(i) vh !important;
       }
     }
   }

package/styles/utilities/spacing.css

@@ -311,27 +311,27 @@
 }
 
 .margin--neg-2 {
-  margin: calc(var(--spacer) * -.5) !important;
+  margin: calc(var(--spacer) * -0.5) !important;
 }
 
 .margin-top--neg-2,
 .margin-y--neg-2 {
-  margin-top: calc(var(--spacer) * -.5) !important;
+  margin-top: calc(var(--spacer) * -0.5) !important;
 }
 
 .margin-right--neg-2,
 .margin-x--neg-2 {
-  margin-right: calc(var(--spacer) * -.5) !important;
+  margin-right: calc(var(--spacer) * -0.5) !important;
 }
 
 .margin-bottom--neg-2,
 .margin-y--neg-2 {
-  margin-bottom: calc(var(--spacer) * -.5) !important;
+  margin-bottom: calc(var(--spacer) * -0.5) !important;
 }
 
 .margin-left--neg-2,
 .margin-x--neg-2 {
-  margin-left: calc(var(--spacer) * -.5) !important;
+  margin-left: calc(var(--spacer) * -0.5) !important;
 }
 
 .margin--neg-3 {
@@ -744,27 +744,27 @@
     }
 
     .margin--$(view)-neg-2 {
-      margin: calc(var(--spacer) * -.5) !important;
+      margin: calc(var(--spacer) * -0.5) !important;
     }
 
     .margin-top--$(view)-neg-2,
     .margin-y--$(view)-neg-2 {
-      margin-top: calc(var(--spacer) * -.5) !important;
+      margin-top: calc(var(--spacer) * -0.5) !important;
     }
 
     .margin-right--$(view)-neg-2,
     .margin-x--$(view)-neg-2 {
-      margin-right: calc(var(--spacer) * -.5) !important;
+      margin-right: calc(var(--spacer) * -0.5) !important;
     }
 
     .margin-bottom--$(view)-neg-2,
     .margin-y--$(view)-neg-2 {
-      margin-bottom: calc(var(--spacer) * -.5) !important;
+      margin-bottom: calc(var(--spacer) * -0.5) !important;
     }
 
     .margin-left--$(view)-neg-2,
     .margin-x--$(view)-neg-2 {
-      margin-left: calc(var(--spacer) * -.5) !important;
+      margin-left: calc(var(--spacer) * -0.5) !important;
     }
 
     .margin--$(view)-neg-3 {

package/styles/utilities/tooltip.css

@@ -19,7 +19,7 @@
   }
 
   &::before {
-    content: '';
+    content: "";
     border-top: 6px solid var(--black-transparent-75);
     border-right: 6px solid var(--transparent);
     border-bottom: 0 none;
@@ -51,7 +51,7 @@
     }
   }
 
-  &[data-placement='left'] {
+  &[data-placement="left"] {
     &::before {
       border-top: 6px solid var(--transparent);
       border-right: 0 none;
@@ -73,7 +73,7 @@
     }
   }
 
-  &[data-placement='right'] {
+  &[data-placement="right"] {
     &::before {
       border-top: 6px solid var(--transparent);
       border-right: 6px solid var(--black-transparent-75);
@@ -95,7 +95,7 @@
     }
   }
 
-  &[data-placement='bottom'] {
+  &[data-placement="bottom"] {
     &::before {
       border-top: 0 none;
       border-right: 6px solid var(--transparent);

package/styles/utilities/translate.css

@@ -12,4 +12,4 @@
 
 .translate--bottom {
   transform: translateY(-100%) !important;
-}
+}

package/styles/utilities.css

@@ -1,18 +1,18 @@
-@import './utilities/align.css';
-@import './utilities/border.css';
-@import './utilities/colors.css';
-@import './utilities/display.css';
-@import './utilities/flex.css';
-@import './utilities/float.css';
-@import './utilities/order.css';
-@import './utilities/overflow.css';
-@import './utilities/pointer-events.css';
-@import './utilities/position.css';
-@import './utilities/shadow.css';
-@import './utilities/size.css';
-@import './utilities/spacing.css';
-@import './utilities/tooltip.css';
-@import './utilities/translate.css';
-@import './utilities/typography.css';
-@import './utilities/visibility.css';
-@import './utilities/zindex.css';
+@import "./utilities/align.css";
+@import "./utilities/border.css";
+@import "./utilities/colors.css";
+@import "./utilities/display.css";
+@import "./utilities/flex.css";
+@import "./utilities/float.css";
+@import "./utilities/order.css";
+@import "./utilities/overflow.css";
+@import "./utilities/pointer-events.css";
+@import "./utilities/position.css";
+@import "./utilities/shadow.css";
+@import "./utilities/size.css";
+@import "./utilities/spacing.css";
+@import "./utilities/tooltip.css";
+@import "./utilities/translate.css";
+@import "./utilities/typography.css";
+@import "./utilities/visibility.css";
+@import "./utilities/zindex.css";

package/styles/vars.css

@@ -104,13 +104,13 @@
   --breakpoint-fullhd: 88rem;
 
   /* Typography */
-  --font-family-sans-serif: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI',
-    Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif,
-    'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
-  --font-family-serif: Cambria, 'Hoefler Text', Utopia, 'Liberation Serif',
-    'Nimbus Roman No9 L Regular', Times, 'Times New Roman', serif;
+  --font-family-sans-serif: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI",
+    Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  --font-family-serif: Cambria, "Hoefler Text", Utopia, "Liberation Serif",
+    "Nimbus Roman No9 L Regular", Times, "Times New Roman", serif;
   --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas,
-    'Liberation Mono', 'Courier New', monospace;
+    "Liberation Mono", "Courier New", monospace;
   --font-family-base: var(--font-family-sans-serif);
 
   --font-size-6: var(--spacer);

package/webpack.config.js

@@ -1,41 +1,41 @@
-const path = require("path");
-const MiniCssExtractPlugin = require("mini-css-extract-plugin");
-const HtmlWebpackPlugin = require("html-webpack-plugin");
-
-module.exports = {
-  entry: "./index.js",
-  output: {
-    filename: "index.js",
-    path: path.resolve(__dirname, "dist"),
-  },
-  devServer: {
-    static: {
-      directory: path.resolve(path.join(__dirname, "dist")),
-      watch: true,
-    },
-    open: true,
-    liveReload: true,
-    watchFiles: ["src/**/*"],
-    hot: true
-  },
-  target: "web",
-  plugins: [
-    new HtmlWebpackPlugin({
-      title: "Claritas Web Framework",
-      template: path.resolve(path.join(__dirname, "index.html")),
-      filename: "index.html", // output file
-    }),
-    new MiniCssExtractPlugin({
-      filename: "./index.css",
-      chunkFilename: "[id].css"
-    }),
-  ],
-  module: {
-    rules: [
-      {
-        test: /\.(?:css|scss)$/i,
-        use: [MiniCssExtractPlugin.loader, "css-loader", "sass-loader"],
-      },
-    ],
-  },
-};
+const path = require("path");
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
+const HtmlWebpackPlugin = require("html-webpack-plugin");
+
+module.exports = {
+  entry: "./index.js",
+  output: {
+    filename: "index.js",
+    path: path.resolve(__dirname, "dist"),
+  },
+  devServer: {
+    static: {
+      directory: path.resolve(path.join(__dirname, "dist")),
+      watch: true,
+    },
+    open: true,
+    liveReload: true,
+    watchFiles: ["src/**/*"],
+    hot: true,
+  },
+  target: "web",
+  plugins: [
+    new HtmlWebpackPlugin({
+      title: "Claritas Web Framework",
+      template: path.resolve(path.join(__dirname, "index.html")),
+      filename: "index.html", // output file
+    }),
+    new MiniCssExtractPlugin({
+      filename: "./index.css",
+      chunkFilename: "[id].css",
+    }),
+  ],
+  module: {
+    rules: [
+      {
+        test: /\.(?:css|scss)$/i,
+        use: [MiniCssExtractPlugin.loader, "css-loader", "sass-loader"],
+      },
+    ],
+  },
+};