@transferwise/neptune-css 0.0.0-experimental-5308dce → 0.0.0-experimental-2f6892d

package/dist/css/input-groups.css

@@ -1502,7 +1502,7 @@ select[multiple].input-lg {
   box-shadow: inset 0 0 0 1px var(--color-interactive-secondary);
 }
 .tw-checkbox-button .tw-checkbox-check,
-.tw-checkbox-button .tw-checkbox-indeterminate {
+.tw-checkbox-button .np-tw-checkbox-indeterminate {
   width: 20px;
   height: 20px;
   margin: 0;
@@ -1562,7 +1562,7 @@ input[type="checkbox"]:indeterminate + .tw-checkbox-button {
 input[type="checkbox"]:checked + .tw-checkbox-button .tw-checkbox-check {
   display: inline-block;
 }
-input[type="checkbox"]:indeterminate + .tw-checkbox-button .tw-checkbox-indeterminate {
+input[type="checkbox"]:indeterminate + .tw-checkbox-button .np-tw-checkbox-indeterminate {
   display: inline-block;
 }
 .tw-checkbox-button:checked:hover,

package/dist/css/neptune.css

@@ -10954,7 +10954,7 @@ select[multiple].input-lg {
 }
 
 .tw-checkbox-button .tw-checkbox-check,
-.tw-checkbox-button .tw-checkbox-indeterminate {
+.tw-checkbox-button .np-tw-checkbox-indeterminate {
   width: 20px;
   height: 20px;
   margin: 0;
@@ -11025,7 +11025,7 @@ input[type="checkbox"]:checked + .tw-checkbox-button .tw-checkbox-check {
   display: inline-block;
 }
 
-input[type="checkbox"]:indeterminate + .tw-checkbox-button .tw-checkbox-indeterminate {
+input[type="checkbox"]:indeterminate + .tw-checkbox-button .np-tw-checkbox-indeterminate {
   display: inline-block;
 }
 
@@ -12382,64 +12382,6 @@ html:not([dir="rtl"]) .np-theme-personal .input-group > :last-child .btn-group {
   border: 0;
 }
 
-.tw-checkbox-check {
-  position: relative;
-  display: inline-block;
-  width: 10px;
-  height: 8px;
-}
-
-.tw-checkbox-check::before,
-.tw-checkbox-check::after {
-  content: "";
-  position: absolute;
-  background: #ffffff;
-  background: var(--color-background-screen);
-  transform: translateX(0.5px) rotate(-45deg);
-  transform-origin: left bottom;
-  left: 8px;
-  left: var(--size-8);
-}
-
-.tw-checkbox-check .has-error::before,
-.tw-checkbox-check .has-error::after {
-  background-color: #e74848;
-  background-color: var(--color-interactive-negative);
-}
-
-.tw-checkbox-check::before {
-  top: 9px;
-  height: 6px;
-  width: 2px;
-}
-
-.tw-checkbox-check::after {
-  bottom: 5px;
-  height: 2px;
-  width: 11px;
-}
-
-.tw-checkbox-indeterminate {
-  position: relative;
-}
-
-.tw-checkbox-indeterminate::after {
-  content: "";
-  position: absolute;
-  width: 12px;
-  height: 2px;
-  top: 55%;
-  left: 50%;
-  background: #ffffff;
-  background: var(--color-background-screen);
-  transform: translate(-50%, -50%);
-}
-
-.tw-checkbox-indeterminate .has-error::after {
-  background-color: #e74848;
-  background-color: var(--color-interactive-negative);
-}
-
 .circle {
   display: flex;
   align-items: center;
@@ -24257,6 +24199,43 @@ a[data-toggle="tooltip"] {
   white-space: nowrap;
 }
 
+.tw-checkbox-check {
+  position: relative;
+  display: inline-block;
+  width: 10px;
+  height: 8px;
+}
+
+.tw-checkbox-check::before,
+.tw-checkbox-check::after {
+  content: "";
+  position: absolute;
+  background: #ffffff;
+  background: var(--color-background-screen);
+  transform: translateX(0.5px) rotate(-45deg);
+  transform-origin: left bottom;
+  left: 8px;
+  left: var(--size-8);
+}
+
+.tw-checkbox-check .has-error::before,
+.tw-checkbox-check .has-error::after {
+  background-color: #e74848;
+  background-color: var(--color-interactive-negative);
+}
+
+.tw-checkbox-check::before {
+  top: 9px;
+  height: 6px;
+  width: 2px;
+}
+
+.tw-checkbox-check::after {
+  bottom: 5px;
+  height: 2px;
+  width: 11px;
+}
+
 .d-inline-block {
   display: inline-block;
 }

package/dist/css/{checkbox.css → tick.css}

@@ -30,21 +30,3 @@
   height: 2px;
   width: 11px;
 }
-.tw-checkbox-indeterminate {
-  position: relative;
-}
-.tw-checkbox-indeterminate::after {
-  content: "";
-  position: absolute;
-  width: 12px;
-  height: 2px;
-  top: 55%;
-  left: 50%;
-  background: #ffffff;
-  background: var(--color-background-screen);
-  transform: translate(-50%, -50%);
-}
-.tw-checkbox-indeterminate .has-error::after {
-  background-color: #e74848;
-  background-color: var(--color-interactive-negative);
-}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@transferwise/neptune-css",
   "description": "Neptune CSS library",
-  "version": "0.0.0-experimental-5308dce",
+  "version": "0.0.0-experimental-2f6892d",
   "license": "MIT",
   "repository": {
     "type": "git",

package/src/less/forms/checkbox-radio.less

@@ -39,7 +39,7 @@
     box-shadow: inset 0 0 0 1px var(--color-interactive-secondary);
   }
 
-  .tw-checkbox-check, .tw-checkbox-indeterminate {
+  .tw-checkbox-check, .np-tw-checkbox-indeterminate {
     width: 20px;
     height: 20px;
     margin: 0;
@@ -100,7 +100,7 @@
   }
 
   input[type="checkbox"]:indeterminate + & {
-    .tw-checkbox-indeterminate {
+    .np-tw-checkbox-indeterminate {
       display: inline-block;
     }
   }

package/src/less/neptune.bundle.less

@@ -20,7 +20,6 @@
 @import "./buttons.less";
 @import "./button-groups.less";
 @import "./input-groups.less";
-@import "./checkbox.less";
 @import "./circles.less";
 @import "./column-layout.less";
 @import "./currency-flags.less";
@@ -47,5 +46,6 @@
 @import "./sequences.less";
 @import "./table.less";
 @import "./tooltip.less";
+@import "./tick.less";
 @import "./utilities.less";
 @import "./wells.less";

package/src/less/{checkbox.less → tick.less}

@@ -34,25 +34,4 @@
     height: 2px;
     width: 11px;
   }
-}
-
-.tw-checkbox-indeterminate {
-    position: relative;
-  
-    &::after {
-      content: "";
-      position: absolute;
-      width: 12px;
-      height: 2px;
-      top: 55%;
-      left: 50%;
-      background: var(--color-background-screen);
-      transform: translate(-50%, -50%);
-    }
-  
-    .has-error {
-      &::after {
-        background-color: var(--color-interactive-negative);
-      }
-    }
-  }
+}