npm - @seamly/web-ui - Versions diffs - 20.2.0 → 20.4.0 - Mend

@seamly/web-ui 20.2.0 → 20.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (107) hide show

package/src/stylesheets/7-deprecated/2-tools/_functions.scss CHANGED Viewed

@@ -4,7 +4,7 @@
 // SET TEXT COLOR
 @function set-text-color($color) {
-  @if (lightness($color) > 66.66) {
+  @if lightness($color) > 66.66 {
     @return $grey-e;
   } @else {
     @return $white;
@@ -14,7 +14,7 @@
 // SET BORDER COLOR
 @function set-border-color($color) {
-  @if (lightness($color) > 66.66) {
+  @if lightness($color) > 66.66 {
     @return $grey-c;
   } @else {
     @return $white;

package/src/stylesheets/7-deprecated/2-tools/_mixins.scss CHANGED Viewed

@@ -25,6 +25,7 @@
   @include media('>phablet-l') {
     max-height: calc(#{$viewport-height} - #{$flex-spacer * 2});
     // iOS Safari needs a bit more space
     @supports (-webkit-overflow-scrolling: touch) {
       max-height: calc(#{$viewport-height * 0.9} - #{$flex-spacer * 2});
@@ -35,6 +36,7 @@
     right: $spacer;
     bottom: $spacer;
     max-height: calc(#{$viewport-height} - #{$spacer * 2});
     // iOS Safari needs a bit more space
     @supports (-webkit-overflow-scrolling: touch) {
       max-height: calc(#{$viewport-height * 0.9} - #{$spacer * 2});
@@ -55,22 +57,22 @@
 // -----------------
 @mixin stylePlaceholder() {
-  &::-webkit-input-placeholder {
+  &::input-placeholder {
     // Chrome/Opera/Safari
     @content;
   }
-  &::-moz-placeholder {
+  &::placeholder {
     // Firefox 19+
     @content;
   }
-  &:-ms-input-placeholder {
+  &:input-placeholder {
     // IE 10+
     @content;
   }
-  &:-moz-placeholder {
+  &:placeholder {
     // Firefox 18-
     @content;
   }

package/src/stylesheets/7-deprecated/3-app/_app.scss CHANGED Viewed

@@ -1,9 +1,9 @@
-// See settings/_config.scss for vars
+/** See settings/_config.scss for vars */
 $app-parts-padding: $spacer * 0.5;
 $app-header-bgcolor: $brand3;
 .#{$n}-app--deprecated {
-  @include responsiveAppSizing();
+  @include responsiveAppSizing;
   @include boxSizing;
   display: flex;

package/src/stylesheets/7-deprecated/4-base/_formelements.scss CHANGED Viewed

@@ -38,6 +38,7 @@
   color: $grey-e;
   font-size: $fontsize-small;
   resize: none;
   // iOS will zoom in on focus if font-size below 16px, and not go back.
   // User has to pinch to zoom out; very nasty UX. So:
   @supports (-webkit-overflow-scrolling: touch) {

package/src/stylesheets/7-deprecated/5-components/_chat-status.scss CHANGED Viewed

@@ -42,7 +42,7 @@
     animation-iteration-count: infinite;
     animation-direction: normal;
     animation-fill-mode: forwards;
-    border-radius: 50% 50%;
+    border-radius: 50%;
     background-color: $interaction;
   }
 }

package/src/stylesheets/7-deprecated/5-components/_collapse-button.scss CHANGED Viewed

@@ -11,7 +11,7 @@
   height: $badge-touch-size;
   padding: 0;
   border: 0 none;
-  border-radius: 50% 50%;
+  border-radius: 50%;
   background-color: $white;
   box-shadow: $boxshadow;
 }

package/src/stylesheets/7-deprecated/5-components/_disclaimer.scss CHANGED Viewed

@@ -4,7 +4,7 @@
 // VARS
 // ----
-$small-shadow-light: 0 $spacer * 0.2 $spacer * 0.3333 0 rgba(0, 0, 0, 0.1);
+$small-shadow-light: 0 $spacer * 0.2 $spacer * 0.3333 0 rgb(0 0 0 / 10%);
 // BASE
 // ----

package/src/stylesheets/7-deprecated/5-components/_input.scss CHANGED Viewed

@@ -32,6 +32,7 @@
   color: $grey-e;
   font-size: $fontsize-small;
   resize: none;
   // iOS will zoom in on focus if font-size below 16px, and not go back.
   // User has to pinch to zoom out; bad UX.
   // Do not change this:
@@ -39,7 +40,7 @@
     font-size: 16px;
   }
-  @include stylePlaceholder() {
+  @include stylePlaceholder {
     overflow: visible;
     color: $grey-c;
     line-height: $spacer;

package/src/stylesheets/7-deprecated/5-components/_loader.scss CHANGED Viewed

@@ -37,8 +37,8 @@ $loader-quarter-duration: $loader-animation-duration * 0.2;
   animation-iteration-count: infinite;
   animation-direction: normal;
   animation-fill-mode: forwards;
-  border-radius: 50% 50%;
-  background-color: currentColor;
+  border-radius: 50%;
+  background-color: currentcolor;
   &.#{$n}-one {
     animation-delay: $loader-quarter-duration;

package/src/stylesheets/7-deprecated/5-components/_message-count.scss CHANGED Viewed

@@ -22,7 +22,7 @@ $messagecount-size: $spacer;
   height: $messagecount-size;
   transform: scale(1);
   transition: transform 0.3s 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
-  border-radius: 50% 50%;
+  border-radius: 50%;
   background-color: $messagecount-bgcolor;
   color: $messagecount-textcolor;
   font-size: $fontsize-small;

package/src/stylesheets/7-deprecated/5-components/_message.scss CHANGED Viewed

@@ -4,8 +4,7 @@ $avatar-size: $badge-touch-size;
 .#{$n}-message {
   display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
+  flex-flow: row wrap;
   width: 80%;
   font-family: $fontfamily-default;
   font-size: $fontsize-small;
@@ -176,7 +175,7 @@ $avatar-size: $badge-touch-size;
     p,
     ul,
     ol {
-      margin: 0 0 1em 0;
+      margin: 0 0 1em;
     }
     ul,
@@ -245,7 +244,7 @@ $avatar-size: $badge-touch-size;
     transform: translate(48%, -$padding);
     border-radius: 50%;
     background: $white;
-    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
+    box-shadow: 0 4px 4px rgb(0 0 0 / 25%);
     > svg {
       position: absolute;

package/src/stylesheets/7-deprecated/5-components/_modal.scss CHANGED Viewed

@@ -4,7 +4,7 @@
 // VARS
 // ----
-$small-shadow-light: 0 $spacer * 0.2 $spacer * 0.3333 0 rgba(0, 0, 0, 0.1);
+$small-shadow-light: 0 $spacer * 0.2 $spacer * 0.3333 0 rgb(0 0 0 / 10%);
 $control-small-radius: $spacer;
 $button-transition: $transition;

package/src/stylesheets/7-deprecated/5-components/_options.scss CHANGED Viewed

@@ -45,7 +45,7 @@
 }
 .#{$n}-chat__options__button[aria-disabled='true'] .#{$n}-icon path {
-  fill: currentColor;
+  fill: currentcolor;
 }
 // CONTEXT MENU
@@ -253,7 +253,7 @@
     font-size: 16px; // KEEP THIS FIXED
   }
-  @include stylePlaceholder() {
+  @include stylePlaceholder {
     overflow: visible;
     color: $grey-c;
     line-height: $spacer;

package/src/stylesheets/7-deprecated/5-components/_upload.scss CHANGED Viewed

@@ -200,7 +200,7 @@
   &::-webkit-progress-bar {
     border-radius: $borderradius-small;
     background: $white;
-    box-shadow: inset 0 $spacer * 0.125 $spacer * 0.125 0 rgba(0, 0, 0, 0.22);
+    box-shadow: inset 0 $spacer * 0.125 $spacer * 0.125 0 rgb(0 0 0 / 22%);
   }
   &::-webkit-progress-value {