quasar-ui-sellmate-ui-kit 2.2.33 → 2.3.1

package/src/components/SButtonGroup.vue

@@ -1,41 +1,41 @@
-<template>
-  <q-btn-group
-    class="s-btn-group"
-    :class="{ 'no-hover': noHover }"
-    flat
-    unelevated
-  >
-    <slot></slot>
-  </q-btn-group>
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import { QBtnGroup } from 'quasar';
-
-export default defineComponent({
-  name: 'SButtonGroup',
-  components: {
-    QBtnGroup,
-  },
-  props: {
-    noHover: {
-      type: Boolean,
-      default: false,
-    },
-  },
-});
-</script>
-
-<style lang="scss">
-@import "../css/quasar.variables.scss";
-
-.s-btn-group {
-  .disabled {
-    border: none;
-    &::before {
-      border: 1px solid $Grey_Lighten-2;
-    }
-  }
-}
-</style>
+<template>
+  <q-btn-group
+    class="s-btn-group"
+    :class="{ 'no-hover': noHover }"
+    flat
+    unelevated
+  >
+    <slot></slot>
+  </q-btn-group>
+</template>
+
+<script>
+import { defineComponent } from 'vue';
+import { QBtnGroup } from 'quasar';
+
+export default defineComponent({
+  name: 'SButtonGroup',
+  components: {
+    QBtnGroup,
+  },
+  props: {
+    noHover: {
+      type: Boolean,
+      default: false,
+    },
+  },
+});
+</script>
+
+<style lang="scss">
+@import "../css/quasar.variables.scss";
+
+.s-btn-group {
+  .disabled {
+    border: none;
+    &::before {
+      border: 1px solid $Grey_Lighten-2;
+    }
+  }
+}
+</style>

package/src/components/SCaution.vue

@@ -1,102 +1,102 @@
-<template>
-  <q-banner
-    dense
-    rounded
-    class="text-Grey_Darken-4 col relative-position s-caution"
-    :class="{
-      's-caution__title': title,
-      's-caution__page bg-Caution_Bg': !useModal,
-      'bg-Red_Lighten-5': useModal,
-    }"
-  >
-    <div v-if="title" class="s-caution-title">{{ title }}</div>
-    <ul>
-      <slot />
-    </ul>
-    <q-icon
-      v-if="!useModal"
-      class="s-caution-icon"
-      size="240px"
-      :name="cautionOutlineIcon"
-    />
-  </q-banner>
-</template>
-<script>
-import { defineComponent } from 'vue';
-import { QBanner, QIcon } from 'quasar';
-import { cautionOutlineIcon } from '../assets/icons.js';
-
-export default defineComponent({
-  name: 'SCaution',
-  components: {
-    QBanner,
-    QIcon,
-  },
-  props: {
-    title: { type: String, default: '' },
-    useModal: { type: Boolean, default: false },
-  },
-  setup() {
-    return {
-      cautionOutlineIcon,
-    };
-  },
-});
-</script>
-
-<style lang="scss">
-@import "../css/quasar.variables.scss";
-
-.s-caution {
-  padding: 20px 0;
-  border-radius: 4px;
-  overflow: hidden;
-  max: {
-    height: 100%;
-    width: 100%;
-  }
-  ul {
-    margin: 0;
-    padding: 0;
-    margin-left: $caution-margin-left;
-    li {
-      list-style: none;
-      font-size: $default-font;
-      line-height: $double-line-height;
-      &:before {
-        content: "-";
-        font-size: 14px;
-        line-height: 20px;
-        margin-right: 12px;
-      }
-    }
-  }
-  .s-caution-icon {
-    position: absolute;
-    right: -41px;
-    bottom: -34px;
-    color: $Caution_Icon;
-    opacity: 0.24;
-  }
-}
-.s-caution__page {
-  border: 1px solid $Red_Lighten-3;
-}
-.s-caution__title {
-  border-left: 8px solid $Red_Lighten-1;
-  .s-caution-title {
-    width: 100%;
-    height: 30px;
-    line-height: 30px;
-    color: $Red_Default;
-    font: {
-      size: 18px;
-      weight: 700;
-    }
-    margin: {
-      left: $caution-margin-left;
-      bottom: 16px;
-    }
-  }
-}
-</style>
+<template>
+  <q-banner
+    dense
+    rounded
+    class="text-Grey_Darken-4 col relative-position s-caution"
+    :class="{
+      's-caution__title': title,
+      's-caution__page bg-Caution_Bg': !useModal,
+      'bg-Red_Lighten-5': useModal,
+    }"
+  >
+    <div v-if="title" class="s-caution-title">{{ title }}</div>
+    <ul>
+      <slot />
+    </ul>
+    <q-icon
+      v-if="!useModal"
+      class="s-caution-icon"
+      size="240px"
+      :name="cautionOutlineIcon"
+    />
+  </q-banner>
+</template>
+<script>
+import { defineComponent } from 'vue';
+import { QBanner, QIcon } from 'quasar';
+import { cautionOutlineIcon } from '../assets/icons.js';
+
+export default defineComponent({
+  name: 'SCaution',
+  components: {
+    QBanner,
+    QIcon,
+  },
+  props: {
+    title: { type: String, default: '' },
+    useModal: { type: Boolean, default: false },
+  },
+  setup() {
+    return {
+      cautionOutlineIcon,
+    };
+  },
+});
+</script>
+
+<style lang="scss">
+@import "../css/quasar.variables.scss";
+
+.s-caution {
+  padding: 20px 0;
+  border-radius: 4px;
+  overflow: hidden;
+  max: {
+    height: 100%;
+    width: 100%;
+  }
+  ul {
+    margin: 0;
+    padding: 0;
+    margin-left: $caution-margin-left;
+    li {
+      list-style: none;
+      font-size: $default-font;
+      line-height: $double-line-height;
+      &:before {
+        content: "-";
+        font-size: 14px;
+        line-height: 20px;
+        margin-right: 12px;
+      }
+    }
+  }
+  .s-caution-icon {
+    position: absolute;
+    right: -41px;
+    bottom: -34px;
+    color: $Caution_Icon;
+    opacity: 0.24;
+  }
+}
+.s-caution__page {
+  border: 1px solid $Red_Lighten-3;
+}
+.s-caution__title {
+  border-left: 8px solid $Red_Lighten-1;
+  .s-caution-title {
+    width: 100%;
+    height: 30px;
+    line-height: 30px;
+    color: $Red_Default;
+    font: {
+      size: 18px;
+      weight: 700;
+    }
+    margin: {
+      left: $caution-margin-left;
+      bottom: 16px;
+    }
+  }
+}
+</style>

package/src/components/SCheckbox.vue

@@ -1,123 +1,123 @@
-<template>
-  <q-checkbox
-    dense
-    color="positive"
-    class="s-checkbox"
-    :class="length > 2 ? 'ck-margin-sm' : 'ck-margin-lg'"
-  />
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import { QCheckbox } from 'quasar';
-
-export default defineComponent({
-  name: 'SCheckbox',
-  components: {
-    QCheckbox,
-  },
-  props: {
-    length: Number,
-  },
-  setup() {
-    return {};
-  },
-});
-</script>
-
-<style lang="scss">
-@import "../css/quasar.variables.scss";
-
-.s-checkbox {
-  margin: 0;
-  justify-content: center;
-  align-items: center;
-  font-size: $default-font;
-  height: 1.667em;
-  &:hover {
-    .q-checkbox__inner {
-      .q-checkbox__bg {
-        border: 1px solid $positive;
-        background-color: $Blue_B_Lighten-5;
-      }
-    }
-  }
-  & > .q-checkbox__inner {
-    min-width: 0;
-    width: 0.4em;
-    height: 0.4em;
-    &:before {
-      background: none !important;
-    }
-    .q-checkbox__bg {
-      border: 1px solid $Grey_Default;
-      width: 0.4em;
-      height: 0.4em;
-      background: white;
-      top: 50%;
-      left: 50%;
-      transform: translate(-50%, -50%);
-      .q-checkbox__svg {
-        width: 0.286em !important;
-        margin: 0 auto;
-      }
-    }
-    &--indet,
-    &--truthy {
-      color: $positive !important;
-      .q-checkbox__bg {
-        border: none !important;
-        background-color: $positive !important;
-      }
-      path {
-        stroke-linecap: round;
-        stroke-linejoin: round;
-        &:first-of-type {
-          transform: scale(0.98);
-        }
-      }
-    }
-  }
-  & > .q-checkbox__label {
-    padding-left: $between-margin-md;
-    color: $Grey_Darken-4;
-    line-height: $default-content-height;
-  }
-}
-
-.s-checkbox[aria-checked="true"].disabled {
-  .q-checkbox__inner {
-    .q-checkbox__bg {
-      background: $Grey_Lighten-4 !important;
-      border: 1px solid $Grey_Lighten-2 !important;
-    }
-  }
-
-}
-.disabled.s-checkbox {
-  border: none !important;
-  background: none !important;
-  & > .q-checkbox__inner {
-    .q-checkbox__bg {
-      border: 1px solid $Grey_Lighten-2;
-      background: $Grey_Lighten-4;
-      .q-checkbox__svg {
-        color: $Grey_Default;
-      }
-    }
-  }
-}
-
-.ck-margin-sm {
-  margin-right: 20px;
-  &:last-of-type {
-    margin-right: 0;
-  }
-}
-.ck-margin-lg {
-  margin-right: 40px;
-  &:last-of-type {
-    margin-right: 0;
-  }
-}
-</style>
+<template>
+  <q-checkbox
+    dense
+    color="positive"
+    class="s-checkbox"
+    :class="length > 2 ? 'ck-margin-sm' : 'ck-margin-lg'"
+  />
+</template>
+
+<script>
+import { defineComponent } from 'vue';
+import { QCheckbox } from 'quasar';
+
+export default defineComponent({
+  name: 'SCheckbox',
+  components: {
+    QCheckbox,
+  },
+  props: {
+    length: Number,
+  },
+  setup() {
+    return {};
+  },
+});
+</script>
+
+<style lang="scss">
+@import "../css/quasar.variables.scss";
+
+.s-checkbox {
+  margin: 0;
+  justify-content: center;
+  align-items: center;
+  font-size: $default-font;
+  height: 1.667em;
+  &:hover {
+    .q-checkbox__inner {
+      .q-checkbox__bg {
+        border: 1px solid $positive;
+        background-color: $Blue_B_Lighten-5;
+      }
+    }
+  }
+  & > .q-checkbox__inner {
+    min-width: 0;
+    width: 0.4em;
+    height: 0.4em;
+    &:before {
+      background: none !important;
+    }
+    .q-checkbox__bg {
+      border: 1px solid $Grey_Default;
+      width: 0.4em;
+      height: 0.4em;
+      background: white;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      .q-checkbox__svg {
+        width: 0.286em !important;
+        margin: 0 auto;
+      }
+    }
+    &--indet,
+    &--truthy {
+      color: $positive !important;
+      .q-checkbox__bg {
+        border: none !important;
+        background-color: $positive !important;
+      }
+      path {
+        stroke-linecap: round;
+        stroke-linejoin: round;
+        &:first-of-type {
+          transform: scale(0.98);
+        }
+      }
+    }
+  }
+  & > .q-checkbox__label {
+    padding-left: $between-margin-md;
+    color: $Grey_Darken-4;
+    line-height: $default-content-height;
+  }
+}
+
+.s-checkbox[aria-checked="true"].disabled {
+  .q-checkbox__inner {
+    .q-checkbox__bg {
+      background: $Grey_Lighten-4 !important;
+      border: 1px solid $Grey_Lighten-2 !important;
+    }
+  }
+
+}
+.disabled.s-checkbox {
+  border: none !important;
+  background: none !important;
+  & > .q-checkbox__inner {
+    .q-checkbox__bg {
+      border: 1px solid $Grey_Lighten-2;
+      background: $Grey_Lighten-4;
+      .q-checkbox__svg {
+        color: $Grey_Default;
+      }
+    }
+  }
+}
+
+.ck-margin-sm {
+  margin-right: 20px;
+  &:last-of-type {
+    margin-right: 0;
+  }
+}
+.ck-margin-lg {
+  margin-right: 40px;
+  &:last-of-type {
+    margin-right: 0;
+  }
+}
+</style>