@transferwise/neptune-css 0.0.0-experimental-2d03128 → 0.0.0-experimental-e6f7234

package/src/less/neptune-addons.less

@@ -1,7 +1,4 @@
 @import "./addons/_background-utilities.less";
+@import "./addons/_display-utilities.less";
 @import "./addons/_spacing-utilities.less";
 @import "./addons/_border.less";
-
-/* TODO: Remove utility imports to prevent duplicates */
-@import "./utilities/display.less";
-@import "./utilities/outline-style.less";

package/src/less/neptune.bundle.less

@@ -47,7 +47,5 @@
 @import "./table.less";
 @import "./tooltip.less";
 @import "./tick.less";
+@import "./utilities.less";
 @import "./wells.less";
-
-// Utilities, should always be kept last
-@import (multiple) "./utilities.less";

package/src/less/progress-bars.less

@@ -2,7 +2,7 @@
 @import (reference) "./mixins/_logical-properties.less";
 
 .progress {
-  --progress-bar-height: 8px;
+  --progress-bar-height: 4px;
   --progress-bar-border-width: 4px;
   // Progress bar starts with left/right (depends on rtl) shift `--progress-bar-start-shift` for hiding Progress bar's left and right borders which are used for progress vertical delimiter.
   --progress-bar-start-shift: calc(var(--progress-bar-border-width) * 2);
@@ -11,7 +11,7 @@
   margin-top: calc((var(--size-24) - var(--progress-bar-height)) / 2);
   margin-bottom: calc((var(--size-24) - var(--progress-bar-height)) / 2);
   background-color: var(--color-interactive-secondary);
-  border-radius: var(--progress-bar-height);
+  border-radius: calc(var(--progress-bar-border-width) + var(--progress-bar-height));
 }
 
 .progress-bar {

package/src/less/utilities.less

@@ -1,41 +1,153 @@
 @import (reference) "../variables/legacy-variables.less";
 @import (reference) "./mixins/_clearfix.less";
+@import (reference) "./mixins/_center-block.less";
 @import (reference) "./mixins/_hide-text.less";
+@import (reference) "./mixins/_logical-properties.less";
 
-@import "./addons/_center-block.less";
-@import "./utilities/align-items.less";
-@import "./utilities/align-self.less";
-@import "./utilities/border-radius.less";
-@import "./utilities/color.less";
-@import "./utilities/cursor.less";
-@import "./utilities/display.less";
-@import "./utilities/flex-direction.less";
-@import "./utilities/flex-grow.less";
-@import "./utilities/flex-wrap.less";
-@import "./utilities/float.less";
-@import "./utilities/font-weight.less";
-@import "./utilities/gap.less";
-@import "./utilities/justify-content.less";
-@import "./utilities/margin.less";
-@import "./utilities/max-width.less";
-@import "./utilities/order.less";
-@import "./utilities/outline-style.less";
-@import "./utilities/overflow-wrap.less";
-@import "./utilities/padding.less";
-@import "./utilities/position.less";
-@import "./utilities/rotate.less";
-@import "./utilities/screen-reader.less";
-@import "./utilities/text-align.less";
-@import "./utilities/text-decoration-line.less";
-@import "./utilities/text-overflow.less";
-@import "./utilities/text-transform.less";
-@import "./utilities/visibility.less";
-@import "./utilities/white-space.less";
+.d-inline-block {
+  display: inline-block;
+}
+
+.d-inline {
+  display: inline;
+}
 
 .clearfix {
   .clearfix();
 }
 
+.center-block {
+  .center-block();
+}
+
+.pull-right,
+.pull-xs-right {
+  .float(right) !important;
+}
+
+.pull-left,
+.pull-xs-left {
+  .float(left) !important;
+}
+
+.pull-xs-none {
+  float: none !important;
+}
+
+@media (--screen-sm) {
+  .pull-sm-left {
+    .float(left) !important;
+  }
+
+  .pull-sm-right {
+    .float(right) !important;
+  }
+
+  .pull-sm-none {
+    float: none !important;
+  }
+}
+
+@media (--screen-md) {
+  .pull-md-left {
+    .float(left) !important;
+  }
+
+  .pull-md-right {
+    .float(right) !important;
+  }
+
+  .pull-md-none {
+    float: none !important;
+  }
+}
+
+@media (--screen-lg) {
+  .pull-lg-left {
+    .float(left) !important;
+  }
+
+  .pull-lg-right {
+    .float(right) !important;
+  }
+
+  .pull-lg-none {
+    float: none !important;
+  }
+}
+
+@media (--screen-xl) {
+  .pull-xl-left {
+    .float(left) !important;
+  }
+
+  .pull-xl-right {
+    .float(right) !important;
+  }
+
+  .pull-xl-none {
+    float: none !important;
+  }
+}
+
+// Floats not changing direction on RTL.
+
+.pull-left-single-direction {
+  float: left !important;
+}
+
+.pull-right-single-direction {
+  float: right !important;
+}
+
+// Toggling content
+// -------------------------
+
+// Note: Deprecated .hide in favor of .hidden or .sr-only (as appropriate) in v3.0.1
+
+.hide {
+  display: none !important;
+}
+
+.show {
+  display: block !important;
+}
+
+.invisible {
+  visibility: hidden;
+}
+
 .text-hide {
   .text-hide();
 }
+
+// Hide from screenreaders and browsers
+//
+// Credit: HTML5 Boilerplate
+
+.hidden {
+  display: none !important;
+}
+
+// For Affix plugin
+// -------------------------
+
+.affix {
+  position: fixed;
+}
+
+.rotate90 {
+  transform: rotate(90deg);
+}
+
+.rotate180 {
+  transform: rotate(180deg);
+}
+
+.rotate270 {
+  transform: rotate(270deg);
+}
+
+.rotate-90 {
+  transform: rotate(-90deg);
+}