fixed-vuesax 3.14.1 → 3.14.2

package/dist/style/components/vsSelect.styl

@@ -1,219 +1,219 @@
-// transition
-
-.fadeselect-enter-active
-  transition: transform .2s, opacity .2s;
-
-.fadeselect-leave-active
-  transition: transform .150s, opacity .150s;
-
-.fadeselect-enter, .fadeselect-leave-to /* .fade-leave-active below version 2.1.8 */
-  opacity: 0;
-  transform: translate(0, 0px) scale(0.950)
-  box-shadow: 0 10px 0 -5px rgba(0, 0, 0, 0);
-
-.input-select-con
-  position relative
-
-.con-select
-  position: relative;
-  clear both
-
-  &.activeOptions:not(.autocompletex)
-    .input-select
-      opacity: 0;
-      transform: scale(1.1);
-
-  &.activeOptions
-    .vs-select--icon
-      propWithDir(transform, null, (0 -50%), rotate(-180deg))
-
-.vs-select--icon
-  position: absolute;
-  propWithDir(right, null, 5px)
-  font-size: 1.0625em;
-  top: 50%;
-  pointer-events none;
-  transform: translate(0, -50%);
-  transition: all .2s ease;
-
-.vs-select--input
-  color: inherit
-  width: 100%
-  position: relative;
-  padding: 7px;
-  border-radius: 5px;
-  border: $vs-border
-  transition: all .2s ease;
-  propWithDir(padding, right, 20px)
-  cursor: pointer;
-  overflow: hidden;
-  text-overflow: ellipsis;
-
-  &:hover
-    border: border 1px solid rgba(0, 0, 0, .4)
-
-  &-con
-    position: relative;
-
-  &:disabled
-    opacity $vs-disabled-opacity
-    cursor: default
-    pointer-events: none
-
-.vs-select--label
-  propWithDir(padding, left, 5px)
-  font-size: .85rem
-  color $vs-label-color
-
-.con-text-validation
-  position: relative
-  font-size: .65rem
-  overflow: hidden
-  transition: $vs-transition;
-
-  .span-text-validation
-    padding: 2px 4px;
-    padding-bottom: 4px
-    display: block
-
-.scrollx
-  ul
-    padding-right: 4px;
-
-.vs-select--options
-  padding: 4px;
-  padding-top: 6px;
-  propWithDir(padding, left, 5px)
-  padding-bottom: 6px;
-  box-shadow: $vs-box-shadow;
-  border-radius: 5px;
-  position: absolute;
-  z-index: 40000;
-  background: $vs-background;
-
-  ul
-    max-height: 260px;
-    overflow: auto;
-    propWithDir(padding, left, 0)
-    padding: 0
-
-    li
-      margin: 0;
-
-.vs-select--item
-  dirValue(text-align, left)
-  color: rgba(0, 0, 0, .8)
-  padding: 7px;
-  border 0;
-  position relative
-  border-top: 1px solid $border-color
-  border-bottom: 1px solid $border-color
-  transition: all .3s ease
-  margin: 0 !important
-  cursor pointer
-
-  &:hover
-    background: rgb(245, 245, 245)
-
-  &:focus
-    background: rgb(245, 245, 245)
-
-  &.con-icon.active
-    padding-left: 25px;
-
-    .vs-select--item-icon
-      opacity: 1;
-      transform: translate(0, -50%);
-
-.vs-select--item-icon
-  position: absolute;
-  font-size: 1.0em;
-  left: 5px;
-  propWithDir(transform, null, (-100% -50%))
-  opacity: 0;
-  transition: all .2s ease;
-  top: 50%;
-
-
-for colorx, i in $vs-colors
-  .vs-select-{colorx}
-    .vs-select--item
-      &.active
-        background: getColor(colorx, .1)
-        color: getColor(colorx);
-        font-weight: bold;
-    &.activeOptions .vs-select--label
-      color: getColor(colorx)
-
-for colorx, i in $vs-validation-colors
-  .input-select-validate-{colorx}
-    .input-select-con
-      .input-select
-        border-color: getColor(colorx)
-
-      .vs-select--icon
-        color getColor(colorx)
-
-
-// item style //
-
-.vs-select--item
-  background: transparent
-  padding: 5px;
-  width: 100%;
-  margin: 0
-  text-transform: capitalize;
-
-  &.disabled
-    opacity: $vs-disabled-opacity;
-    cursor: default
-    pointer-events: none
-
-  .searchx
-    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
-    color: inherit;
-
-
-// vs-select-group
-
-.vs-select-group
-  h4
-    propWithDir(padding, left, 10px)
-    cursor default
-    padding-bottom: 5px
-
-  ul
-    padding-bottom 5px
-  li
-    propWithDir(border, left, 1px solid rgba(0, 0, 0, .1))
-    propWithDir(margin, left, 15px, !important)
-    propWithDir(padding, left, 15px, !important)
-    list-style none
-    width: calc(100% - 15px);
-
-
-.vs-select--icon-clear
-  position absolute
-  propWithDir(right, null, 5px)
-  z-index 200
-  top 50%
-  cursor pointer
-  transform: translate(0, -50%) rotate(45deg)
-  border 0
-  width: 15px
-  height 15px
-  border-radius: 0 5px 5px 0
-  background: inherit
-  color: inherit
-  opacity 0
-  visibility: hidden
-  transition: all .2s ease
-
-  &.activeBtnClear
-    opacity 1 !important
-    visibility visible !important
-    transform: translate(0, -50%) rotate(0deg) !important
-
-  i
-    font-size: .9rem
-
+// transition
+
+.fadeselect-enter-active
+  transition: transform .2s, opacity .2s;
+
+.fadeselect-leave-active
+  transition: transform .150s, opacity .150s;
+
+.fadeselect-enter, .fadeselect-leave-to /* .fade-leave-active below version 2.1.8 */
+  opacity: 0;
+  transform: translate(0, 0px) scale(0.950)
+  box-shadow: 0 10px 0 -5px rgba(0, 0, 0, 0);
+
+.input-select-con
+  position relative
+
+.con-select
+  position: relative;
+  clear both
+
+  &.activeOptions:not(.autocompletex)
+    .input-select
+      opacity: 0;
+      transform: scale(1.1);
+
+  &.activeOptions
+    .vs-select--icon
+      propWithDir(transform, null, (0 -50%), rotate(-180deg))
+
+.vs-select--icon
+  position: absolute;
+  propWithDir(right, null, 5px)
+  font-size: 1.0625em;
+  top: 50%;
+  pointer-events none;
+  transform: translate(0, -50%);
+  transition: all .2s ease;
+
+.vs-select--input
+  color: inherit
+  width: 100%
+  position: relative;
+  padding: 7px;
+  border-radius: 5px;
+  border: $vs-border
+  transition: all .2s ease;
+  propWithDir(padding, right, 20px)
+  cursor: pointer;
+  overflow: hidden;
+  text-overflow: ellipsis;
+
+  &:hover
+    border: border 1px solid rgba(0, 0, 0, .4)
+
+  &-con
+    position: relative;
+
+  &:disabled
+    opacity $vs-disabled-opacity
+    cursor: default
+    pointer-events: none
+
+.vs-select--label
+  propWithDir(padding, left, 5px)
+  font-size: .85rem
+  color $vs-label-color
+
+.con-text-validation
+  position: relative
+  font-size: .65rem
+  overflow: hidden
+  transition: $vs-transition;
+
+  .span-text-validation
+    padding: 2px 4px;
+    padding-bottom: 4px
+    display: block
+
+.scrollx
+  ul
+    padding-right: 4px;
+
+.vs-select--options
+  padding: 4px;
+  padding-top: 6px;
+  propWithDir(padding, left, 5px)
+  padding-bottom: 6px;
+  box-shadow: $vs-box-shadow;
+  border-radius: 5px;
+  position: absolute;
+  z-index: 40000;
+  background: $vs-background;
+
+  ul
+    max-height: 260px;
+    overflow: auto;
+    propWithDir(padding, left, 0)
+    padding: 0
+
+    li
+      margin: 0;
+
+.vs-select--item
+  dirValue(text-align, left)
+  color: rgba(0, 0, 0, .8)
+  padding: 7px;
+  border 0;
+  position relative
+  border-top: 1px solid $border-color
+  border-bottom: 1px solid $border-color
+  transition: all .3s ease
+  margin: 0 !important
+  cursor pointer
+
+  &:hover
+    background: rgb(245, 245, 245)
+
+  &:focus
+    background: rgb(245, 245, 245)
+
+  &.con-icon.active
+    padding-left: 25px;
+
+    .vs-select--item-icon
+      opacity: 1;
+      transform: translate(0, -50%);
+
+.vs-select--item-icon
+  position: absolute;
+  font-size: 1.0em;
+  left: 5px;
+  propWithDir(transform, null, (-100% -50%))
+  opacity: 0;
+  transition: all .2s ease;
+  top: 50%;
+
+
+for colorx, i in $vs-colors
+  .vs-select-{colorx}
+    .vs-select--item
+      &.active
+        background: getColor(colorx, .1)
+        color: getColor(colorx);
+        font-weight: bold;
+    &.activeOptions .vs-select--label
+      color: getColor(colorx)
+
+for colorx, i in $vs-validation-colors
+  .input-select-validate-{colorx}
+    .input-select-con
+      .input-select
+        border-color: getColor(colorx)
+
+      .vs-select--icon
+        color getColor(colorx)
+
+
+// item style //
+
+.vs-select--item
+  background: transparent
+  padding: 5px;
+  width: 100%;
+  margin: 0
+  text-transform: capitalize;
+
+  &.disabled
+    opacity: $vs-disabled-opacity;
+    cursor: default
+    pointer-events: none
+
+  .searchx
+    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
+    color: inherit;
+
+
+// vs-select-group
+
+.vs-select-group
+  h4
+    propWithDir(padding, left, 10px)
+    cursor default
+    padding-bottom: 5px
+
+  ul
+    padding-bottom 5px
+  li
+    propWithDir(border, left, 1px solid rgba(0, 0, 0, .1))
+    propWithDir(margin, left, 15px, !important)
+    propWithDir(padding, left, 15px, !important)
+    list-style none
+    width: calc(100% - 15px);
+
+
+.vs-select--icon-clear
+  position absolute
+  propWithDir(right, null, 5px)
+  z-index 200
+  top 50%
+  cursor pointer
+  transform: translate(0, -50%) rotate(45deg)
+  border 0
+  width: 15px
+  height 15px
+  border-radius: 0 5px 5px 0
+  background: inherit
+  color: inherit
+  opacity 0
+  visibility: hidden
+  transition: all .2s ease
+
+  &.activeBtnClear
+    opacity 1 !important
+    visibility visible !important
+    transform: translate(0, -50%) rotate(0deg) !important
+
+  i
+    font-size: .9rem
+