@simplybusiness/theme-core 7.14.7 → 7.14.9

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # Changelog
 
+## 7.14.9
+
+### Patch Changes
+
+- Updated dependencies [3f0ca52]
+- Updated dependencies [67419b3]
+  - @simplybusiness/mobius@6.9.6
+
+## 7.14.8
+
+### Patch Changes
+
+- e160de4: Add lint-css executable for CSS linting with stylelint
+  - Added stylelint and stylelint-config-recommended dependencies
+  - Created lint-css executable that runs stylelint on src/\*_/_.css
+  - Configured selector-nested-pattern rule to enforce native CSS nesting (require & in nested selectors)
+  - Added lint:css scripts to theme-core as initial rollout
+  - Fixed 3 stylelint violations in theme-core icons.css
+  - Updated Turbo with lint:css task configuration
+  - @simplybusiness/mobius@6.9.5
+
 ## 7.14.7
 
 ### Patch Changes

package/dist/index.css

@@ -81,6 +81,10 @@ h6.mobius-accordion__link-text,
     transform:rotateZ(-180deg);
   }
 
+.mobius-alert__icon{
+  margin-right:var(--size-sm);
+}
+
 .mobius-alert{
   display:flex;
   flex-grow:1;
@@ -122,10 +126,6 @@ h6.mobius-accordion__link-text,
     background-color:var(--color-error-background);
   }
 
-.mobius-alert__icon{
-  margin-right:var(--size-sm);
-}
-
 .mobius-alert__icon .mobius-icon{
   height:1.32em;
 }
@@ -143,10 +143,6 @@ h6.mobius-accordion__link-text,
 .mobius-breadcrumb{
   box-sizing:border-box;
   background-color:var(--color-background-light);
-  padding-top:var(--size-md);
-  padding-bottom:var(--size-md);
-  padding-left:var(--size-sm);
-  padding-right:var(--size-sm);
   display:flex;
   flex-direction:row;
   list-style:none;
@@ -927,9 +923,6 @@ h6.mobius-accordion__link-text,
     background-color:var(--color-background-highlight);
     color:var(--color-primary);
     border-color:var(--color-primary);
-  }
-
-.mobius-dropdown-menu__item:focus-visible{
     outline:none;
   }
 
@@ -1318,16 +1311,16 @@ h6.mobius-accordion__link-text,
     content:" (optional)";
   }
 
+.mobius-number-field.--hide-spin-buttons{
+    appearance:textfield;
+    -moz-appearance:textfield;
+  }
+
 .mobius-number-field.--hide-spin-buttons::-webkit-outer-spin-button,.mobius-number-field.--hide-spin-buttons::-webkit-inner-spin-button{
       -webkit-appearance:none;
       margin:0;
     }
 
-.mobius-number-field.--hide-spin-buttons{
-      appearance:textfield;
-      -moz-appearance:textfield;
-    }
-
 .mobius-number-field__input-wrapper{
   width:100%;
 }
@@ -1565,7 +1558,7 @@ h6.mobius-accordion__link-text,
   position:relative;
   cursor:pointer;
   background-color:var(--radio-label-background);
-  word-break:break-word;
+  overflow-wrap:break-word;
 }
 
 .mobius-radio__label.--is-disabled{
@@ -1888,15 +1881,15 @@ h6.mobius-accordion__link-text,
     cursor:not-allowed;
   }
 
-.mobius-select:not(.--is-invalid):not(.--is-disabled):hover{
+.mobius-select:focus-visible{
     border-color:var(--color-primary);
     background-color:var(--color-background-input-active);
+    box-shadow:var(--box-shadow-default);
   }
 
-.mobius-select:focus-visible{
+.mobius-select:not(.--is-invalid):not(.--is-disabled):hover{
     border-color:var(--color-primary);
     background-color:var(--color-background-input-active);
-    box-shadow:var(--box-shadow-default);
   }
 
 .mobius-select.--is-invalid{
@@ -1928,61 +1921,6 @@ h6.mobius-accordion__link-text,
     color:var(--color-error);
   }
 
-.mobius-slider{
-  position:relative;
-  display:grid;
-  gap:var(--size-xxs);
-}
-
-.mobius-slider.--is-primary .mobius-slider__track{
-      background-color:var(--slider-primary-track-background);
-    }
-
-.mobius-slider.--is-primary .mobius-slider__track::-webkit-slider-thumb{
-      background-color:var(--slider-primary-thumb-background);
-      box-shadow:0 0 0 var(--size-xxs) var(--color-background), 0 0 0 5px var(--slider-primary-thumb-background);
-    }
-
-.mobius-slider.--is-primary .mobius-slider__track::-moz-range-thumb{
-      background-color:var(--slider-primary-thumb-background);
-      box-shadow:0 0 0 var(--size-xxs) var(--color-background), 0 0 0 5px var(--slider-primary-thumb-background);
-    }
-
-.mobius-slider.--is-secondary .mobius-slider__track{
-      background-color:var(--slider-secondary-track-background);
-    }
-
-.mobius-slider.--is-secondary .mobius-slider__track::-webkit-slider-thumb{
-      background-color:var(--slider-secondary-thumb-background);
-      box-shadow:0 0 0 var(--size-xxs) var(--color-background), 0 0 0 5px var(--slider-secondary-thumb-background);
-    }
-
-.mobius-slider.--is-secondary .mobius-slider__track::-moz-range-thumb{
-      background-color:var(--slider-secondary-thumb-background);
-      box-shadow:0 0 0 var(--size-xxs) var(--color-background), 0 0 0 5px var(--slider-secondary-thumb-background);
-    }
-
-.mobius-slider.--is-disabled{
-    color:var(--color-text-light);
-    cursor:not-allowed;
-  }
-
-.mobius-slider.--is-disabled .mobius-slider__track{
-      background-color:var(--color-background-light);
-    }
-
-.mobius-slider.--is-disabled .mobius-slider__track::-webkit-slider-thumb{
-      background-color:var(--color-background-light);
-      box-shadow:0 0 0 var(--size-xxs) var(--color-background), 0 0 0 5px var(--color-border-medium);
-      cursor:not-allowed;
-    }
-
-.mobius-slider.--is-disabled .mobius-slider__track::-moz-range-thumb{
-      background-color:var(--color-background-light);
-      box-shadow:0 0 0 var(--size-xxs) var(--color-background), 0 0 0 5px var(--color-border-medium);
-      cursor:not-allowed;
-    }
-
 .mobius-slider__track-wrapper{
   position:relative;
   width:100%;
@@ -2040,6 +1978,61 @@ h6.mobius-accordion__link-text,
   justify-content:space-between;
 }
 
+.mobius-slider{
+  position:relative;
+  display:grid;
+  gap:var(--size-xxs);
+}
+
+.mobius-slider.--is-primary .mobius-slider__track{
+      background-color:var(--slider-primary-track-background);
+    }
+
+.mobius-slider.--is-primary .mobius-slider__track::-webkit-slider-thumb{
+      background-color:var(--slider-primary-thumb-background);
+      box-shadow:0 0 0 var(--size-xxs) var(--color-background), 0 0 0 5px var(--slider-primary-thumb-background);
+    }
+
+.mobius-slider.--is-primary .mobius-slider__track::-moz-range-thumb{
+      background-color:var(--slider-primary-thumb-background);
+      box-shadow:0 0 0 var(--size-xxs) var(--color-background), 0 0 0 5px var(--slider-primary-thumb-background);
+    }
+
+.mobius-slider.--is-secondary .mobius-slider__track{
+      background-color:var(--slider-secondary-track-background);
+    }
+
+.mobius-slider.--is-secondary .mobius-slider__track::-webkit-slider-thumb{
+      background-color:var(--slider-secondary-thumb-background);
+      box-shadow:0 0 0 var(--size-xxs) var(--color-background), 0 0 0 5px var(--slider-secondary-thumb-background);
+    }
+
+.mobius-slider.--is-secondary .mobius-slider__track::-moz-range-thumb{
+      background-color:var(--slider-secondary-thumb-background);
+      box-shadow:0 0 0 var(--size-xxs) var(--color-background), 0 0 0 5px var(--slider-secondary-thumb-background);
+    }
+
+.mobius-slider.--is-disabled{
+    color:var(--color-text-light);
+    cursor:not-allowed;
+  }
+
+.mobius-slider.--is-disabled .mobius-slider__track{
+      background-color:var(--color-background-light);
+    }
+
+.mobius-slider.--is-disabled .mobius-slider__track::-webkit-slider-thumb{
+      background-color:var(--color-background-light);
+      box-shadow:0 0 0 var(--size-xxs) var(--color-background), 0 0 0 5px var(--color-border-medium);
+      cursor:not-allowed;
+    }
+
+.mobius-slider.--is-disabled .mobius-slider__track::-moz-range-thumb{
+      background-color:var(--color-background-light);
+      box-shadow:0 0 0 var(--size-xxs) var(--color-background), 0 0 0 5px var(--color-border-medium);
+      cursor:not-allowed;
+    }
+
 .mobius-stack{
   display:grid;
   flex:1 1 auto;
@@ -2071,24 +2064,6 @@ h6.mobius-accordion__link-text,
     gap:var(--size-xl);
   }
 
-.mobius-switch{
-  position:relative;
-  display:inline-block;
-  border-radius:30px;
-  width:55px;
-  height:30px;
-}
-
-.mobius-switch input{
-    opacity:0;
-    width:0;
-    height:0;
-  }
-
-:is(.mobius-switch input):focus-visible + .mobius-switch__slider{
-        box-shadow:var(--box-shadow-default);
-      }
-
 .mobius-switch__slider{
   position:absolute;
   cursor:pointer;
@@ -2113,6 +2088,24 @@ h6.mobius-accordion__link-text,
     transition:var(--switch-transition-duration);
   }
 
+.mobius-switch{
+  position:relative;
+  display:inline-block;
+  border-radius:30px;
+  width:55px;
+  height:30px;
+}
+
+.mobius-switch input{
+    opacity:0;
+    width:0;
+    height:0;
+  }
+
+:is(.mobius-switch input):focus-visible + .mobius-switch__slider{
+        box-shadow:var(--box-shadow-default);
+      }
+
 .mobius-switch--checked .mobius-switch__slider{
     background-color:var(--color-primary);
   }
@@ -2139,7 +2132,6 @@ h6.mobius-accordion__link-text,
 
 .mobius-table{
   display:table;
-  box-sizing:border-box;
   width:100%;
   text-align:left;
   border-collapse:collapse;
@@ -2308,15 +2300,15 @@ h6.mobius-accordion__link-text,
   background-color:var(--color-background-input);
 }
 
-.mobius-text-area__input:hover:not(.--is-disabled):not(.mobius-text-area__input.--is-invalid){
+.mobius-text-area__input:focus-visible{
     border-color:var(--color-primary);
     background-color:var(--color-background-input-active);
+    box-shadow:var(--box-shadow-default);
   }
 
-.mobius-text-area__input:focus-visible{
+.mobius-text-area__input:hover:not(.--is-disabled):not(.mobius-text-area__input.--is-invalid){
     border-color:var(--color-primary);
     background-color:var(--color-background-input-active);
-    box-shadow:var(--box-shadow-default);
   }
 
 .mobius-text-area__input.--is-disabled{
@@ -2356,65 +2348,6 @@ h6.mobius-accordion__link-text,
   align-items:stretch;
 }
 
-.mobius-text:is(.mobius-text-field__prefix-outside,.mobius-text-field__suffix-outside){
-    margin-top:0;
-    margin-bottom:0;
-    align-self:center;
-  }
-
-.mobius-text-field__prefix-outside.mobius-button{
-    border-radius:var(--input-border-radius);
-    border-top-right-radius:0;
-    border-bottom-right-radius:0;
-  }
-
-.mobius-text-field__prefix-outside.mobius-button + .mobius-text-field__input-wrapper{
-      border-top-left-radius:0;
-      border-bottom-left-radius:0;
-    }
-
-.mobius-text-field__prefix-outside.mobius-text{
-    padding-right:var(--size-sm);
-  }
-
-.mobius-text-field__suffix-outside.mobius-button{
-    border-radius:var(--input-border-radius);
-    border-top-left-radius:0;
-    border-bottom-left-radius:0;
-  }
-
-.mobius-text-field__suffix-outside.mobius-text{
-    padding-left:var(--size-sm);
-  }
-
-.mobius-text-field__prefix-inside,
-.mobius-text-field__suffix-inside{
-  display:flex;
-}
-
-:is(.mobius-text-field__prefix-inside,.mobius-text-field__suffix-inside):not(.--is-invalid):not(.--is-disabled){
-    color:var(--color-primary);
-  }
-
-.mobius-button:is(.mobius-text-field__prefix-inside,.mobius-text-field__suffix-inside){
-    min-height:100%;
-    border-radius:0;
-    align-self:stretch;
-  }
-
-.mobius-text:is(.mobius-text-field__prefix-inside,.mobius-text-field__suffix-inside){
-    margin-top:0;
-    margin-bottom:0;
-  }
-
-.mobius-text-field__prefix-inside{
-  padding-left:var(--size-sm);
-}
-
-.mobius-text-field__suffix-inside{
-  padding-right:var(--size-sm);
-}
-
 .mobius-text-field__input-wrapper{
   display:flex;
   flex:1 1 0;
@@ -2467,6 +2400,65 @@ h6.mobius-accordion__link-text,
     color:var(--color-error);
   }
 
+.mobius-text:is(.mobius-text-field__prefix-outside,.mobius-text-field__suffix-outside){
+    margin-top:0;
+    margin-bottom:0;
+    align-self:center;
+  }
+
+.mobius-text-field__prefix-outside.mobius-button{
+    border-radius:var(--input-border-radius);
+    border-top-right-radius:0;
+    border-bottom-right-radius:0;
+  }
+
+.mobius-text-field__prefix-outside.mobius-button + .mobius-text-field__input-wrapper{
+      border-top-left-radius:0;
+      border-bottom-left-radius:0;
+    }
+
+.mobius-text-field__prefix-outside.mobius-text{
+    padding-right:var(--size-sm);
+  }
+
+.mobius-text-field__suffix-outside.mobius-button{
+    border-radius:var(--input-border-radius);
+    border-top-left-radius:0;
+    border-bottom-left-radius:0;
+  }
+
+.mobius-text-field__suffix-outside.mobius-text{
+    padding-left:var(--size-sm);
+  }
+
+.mobius-text-field__prefix-inside{
+  padding-left:var(--size-sm);
+}
+
+.mobius-text-field__suffix-inside{
+  padding-right:var(--size-sm);
+}
+
+.mobius-text-field__prefix-inside,
+.mobius-text-field__suffix-inside{
+  display:flex;
+}
+
+:is(.mobius-text-field__prefix-inside,.mobius-text-field__suffix-inside):not(.--is-invalid):not(.--is-disabled){
+    color:var(--color-primary);
+  }
+
+.mobius-button:is(.mobius-text-field__prefix-inside,.mobius-text-field__suffix-inside){
+    min-height:100%;
+    border-radius:0;
+    align-self:stretch;
+  }
+
+.mobius-text:is(.mobius-text-field__prefix-inside,.mobius-text-field__suffix-inside){
+    margin-top:0;
+    margin-bottom:0;
+  }
+
 .mobius-text-field__input{
   flex:1 1 0;
   padding:var(--input-field-padding);
@@ -2601,6 +2593,7 @@ svg:not(:host).svg-inline--mobius-icon{
   position:absolute;
   right:0;
   top:0;
+  transform-origin:center center;
 }
 
 .mobius-icon-layers-counter,
@@ -2619,10 +2612,6 @@ svg:not(:host).svg-inline--mobius-icon{
   width:1em;
 }
 
-.mobius-icon-layers svg.svg-inline--mobius-icon{
-  transform-origin:center center;
-}
-
 .mobius-icon-layers-text{
   left:50%;
   top:50%;
@@ -2929,6 +2918,11 @@ svg:not(:host).svg-inline--mobius-icon{
   opacity:var(--mobius-icon-secondary-opacity, 0.4);
 }
 
+.svg-inline--mobius-icon mask .mobius-icon-primary,
+.svg-inline--mobius-icon mask .mobius-icon-secondary{
+  fill:black;
+}
+
 .svg-inline--mobius-icon.mobius-icon-swap-opacity .mobius-icon-primary{
   opacity:var(--mobius-icon-secondary-opacity, 0.4);
 }
@@ -2937,11 +2931,6 @@ svg:not(:host).svg-inline--mobius-icon{
   opacity:var(--mobius-icon-primary-opacity, 1);
 }
 
-.svg-inline--mobius-icon mask .mobius-icon-primary,
-.svg-inline--mobius-icon mask .mobius-icon-secondary{
-  fill:black;
-}
-
 .fad.mobius-icon-inverse,
 .mobius-icon-duotone.mobius-icon-inverse{
   color:var(--mobius-icon-inverse, #fff);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@simplybusiness/theme-core",
-  "version": "7.14.7",
+  "version": "7.14.9",
   "main": "dist/index.css",
   "simplyBusiness": {
     "publishToPublicNpm": true
@@ -10,7 +10,9 @@
     "clean": "rm -rf dist",
     "build": "yarn run -T turbo run turbo:build",
     "prepack": "yarn run build",
-    "turbo:build": "build-theme"
+    "turbo:build": "build-theme",
+    "lint:css": "lint-css",
+    "lint:css:fix": "lint-css --fix"
   },
   "files": [
     "dist/**/*",
@@ -26,9 +28,9 @@
     "./fonts": "./dist/fonts.css"
   },
   "dependencies": {
-    "@simplybusiness/mobius": "^6.9.5"
+    "@simplybusiness/mobius": "^6.9.6"
   },
   "devDependencies": {
-    "build-scripts": "^1.0.3"
+    "build-scripts": "^1.1.0"
   }
 }

package/src/icons.css

@@ -62,6 +62,7 @@ svg:not(:host).svg-inline--mobius-icon {
   position: absolute;
   right: 0;
   top: 0;
+  transform-origin: center center;
 }
 
 .mobius-icon-layers-counter,
@@ -80,10 +81,6 @@ svg:not(:host).svg-inline--mobius-icon {
   width: 1em;
 }
 
-.mobius-icon-layers svg.svg-inline--mobius-icon {
-  transform-origin: center center;
-}
-
 .mobius-icon-layers-text {
   left: 50%;
   top: 50%;
@@ -389,6 +386,11 @@ svg:not(:host).svg-inline--mobius-icon {
   opacity: var(--mobius-icon-secondary-opacity, 0.4);
 }
 
+.svg-inline--mobius-icon mask .mobius-icon-primary,
+.svg-inline--mobius-icon mask .mobius-icon-secondary {
+  fill: black;
+}
+
 .svg-inline--mobius-icon.mobius-icon-swap-opacity .mobius-icon-primary {
   opacity: var(--mobius-icon-secondary-opacity, 0.4);
 }
@@ -397,11 +399,6 @@ svg:not(:host).svg-inline--mobius-icon {
   opacity: var(--mobius-icon-primary-opacity, 1);
 }
 
-.svg-inline--mobius-icon mask .mobius-icon-primary,
-.svg-inline--mobius-icon mask .mobius-icon-secondary {
-  fill: black;
-}
-
 .fad.mobius-icon-inverse,
 .mobius-icon-duotone.mobius-icon-inverse {
   color: var(--mobius-icon-inverse, #fff);