claritas-web-framework 8.6.1 → 8.6.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claritas-web-framework",
-  "version": "8.6.1",
+  "version": "8.6.3",
   "description": "The CSS framework built for Claritas front end.",
   "main": "index.js",
   "scripts": {
@@ -27,6 +27,6 @@
   },
   "dependencies": {
     "modern-normalize": "^3.0.1",
-    "sass": "^1.97.0"
+    "sass": "^1.97.1"
   }
 }

package/sass/modules/_button.scss

@@ -45,10 +45,6 @@
   --button-white-space: #{$button-white-space};
   --button-font-size: #{$button-font-size};
 
-  // @include rfs($button-font-size, --button-font-size);
-
-  // @include font-size(var(--button-font-size));
-
   // Variable references
   background: var(--button-background);
   border-radius: var(--button-border-radius);
@@ -56,6 +52,7 @@
   box-shadow: var(--button-box-shadow);
   color: var(--button-color);
   font-weight: var(--button-font-weight);
+  font-size: var(--button-font-size);
   line-height: var(--button-line-height);
   padding: var(--button-padding-y) var(--button-padding-x);
   text-decoration: var(--button-text-decoration);
@@ -81,10 +78,6 @@
 
     padding: var(--button-large-padding-y) var(--button-large-padding-x);
 
-    // @include rfs($button-large-font-size, --button-font-size);
-
-    // @include font-size(var(--button-font-size));
-
     &:not(.button--rounded) {
       border-radius: var(--button-large-border-radius);
     }
@@ -95,10 +88,6 @@
 
     padding: var(--button-small-padding-y) var(--button-small-padding-x);
 
-    // @include rfs($button-small-font-size, --button-font-size);
-
-    // @include font-size(var(--button-font-size));
-
     &:not(.button--rounded) {
       border-radius: var(--button-small-border-radius);
     }

package/sass/modules/_form.scss

@@ -74,6 +74,7 @@
   padding: var(--input-padding-y) var(--input-padding-x);
   border-radius: var(--input-border-radius);
   font-weight: var(--input-font-weight);
+  font-size: var(--input-font-size);
   line-height: var(--input-line-height);
   white-space: var(--input-white-space);
   width: var(--input-width);
@@ -83,10 +84,6 @@
   transition: $form-transition;
   position: relative;
 
-  // @include rfs($input-font-size, --input-font-size);
-
-  // @include font-size(var(--input-font-size));
-
   @include media-breakpoint-up("desktop") {
     height: var(--input-desktop-height);
     width: var(--input-desktop-width);
@@ -137,10 +134,6 @@
 
     padding: var(--input-small-padding-y) var(--input-small-padding-x);
 
-    // @include rfs($input-small-font-size, --input-font-size);
-
-    // @include font-size(var(--input-font-size));
-
     &:not(.input--rounded) {
       border-radius: var(--input-small-border-radius);
     }
@@ -151,10 +144,6 @@
 
     padding: var(--input-large-padding-y) var(--input-large-padding-x);
 
-    // @include rfs($input-large-font-size, --input-font-size);
-
-    // @include font-size(var(--input-font-size));
-
     &:not(.input--rounded) {
       border-radius: var(--input-large-border-radius);
     }

package/sass/modules/_nav.scss

@@ -99,6 +99,7 @@
       background: var(--nav-item-focus-background);
     }
 
+    &[aria-current="page"],
     &[data-active="true"],
     &[aria-selected="true"],
     &:active,

package/sass/modules/_pill.scss

@@ -17,15 +17,12 @@
   --pill-font-weight: #{$pill-font-weight};
   --pill-font-size: #{$pill-font-size};
 
-  // @include rfs($pill-font-size, --pill-font-size);
-
-  // @include font-size(var(--pill-font-size));
-
   color: var(--pill-color);
   padding: var(--pill-padding-y) var(--pill-padding-x);
   border: var(--pill-border-width) var(--pill-border-style) var(--pill-border-color);
   background: var(--pill-background);
   font-weight: var(--pill-font-weight);
+  font-size: var(--pill-font-size);
   border-radius: var(--border-radius-round);
   min-width: var(--spacer);
   line-height: 1;

package/sass/modules/_tabs.scss

@@ -35,6 +35,7 @@
         margin-right: calc(var(--spacer) * 0.125);
       }
 
+      &[aria-current="page"],
       &[data-active="true"],
       &[aria-selected="true"],
       &:active,

package/sass/modules/_tag.scss

@@ -20,16 +20,13 @@
   --tag-font-weight: #{$tag-font-weight};
   --tag-font-size: #{$tag-font-size};
 
-  // @include rfs($tag-font-size, --tag-font-size);
-
-  // @include font-size(var(--tag-font-size));
-
   color: var(--tag-color);
   padding: var(--tag-padding-y) var(--tag-padding-x);
   border: var(--tag-border-width) var(--tag-border-style) var(--tag-border-color);
   border-radius: var(--tag-border-radius);
   background: var(--tag-background);
   font-weight: var(--tag-font-weight);
+  font-size: var(--tag-font-size);
   line-height: 1;
   text-decoration: none;
   white-space: nowrap;