@flyanra/vue-core 0.4.0 → 0.4.2

package/src/styles/core/animations.scss

@@ -1,40 +1,40 @@
-@keyframes invisible-in {
-  0% {
-    opacity: 0;
-    visibility: hidden;
-  }
-
-  100% {
-    opacity: 1;
-    visibility: visible;
-  }
-}
-
-@keyframes fade-in-out {
-  0% {
-    opacity: 0;
-  }
-
-  50% {
-    opacity: 1;
-  }
-
-  100% {
-    opacity: 0;
-  }
-}
-
-.invisible-in {
-  visibility: hidden;
-  animation: invisible-in 0.1s ease-in 0.2s forwards;
-}
-
-.invisible-in-slow-sm {
-  visibility: hidden;
-  animation: invisible-in 0.2s ease-in 0.2s forwards;
-}
-
-.invisible-in-slow-md {
-  visibility: hidden;
-  animation: invisible-in 0.3s ease-in 0.5s forwards;
-}
+@keyframes invisible-in {
+  0% {
+    opacity: 0;
+    visibility: hidden;
+  }
+
+  100% {
+    opacity: 1;
+    visibility: visible;
+  }
+}
+
+@keyframes fade-in-out {
+  0% {
+    opacity: 0;
+  }
+
+  50% {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+  }
+}
+
+.invisible-in {
+  visibility: hidden;
+  animation: invisible-in 0.1s ease-in 0.2s forwards;
+}
+
+.invisible-in-slow-sm {
+  visibility: hidden;
+  animation: invisible-in 0.2s ease-in 0.2s forwards;
+}
+
+.invisible-in-slow-md {
+  visibility: hidden;
+  animation: invisible-in 0.3s ease-in 0.5s forwards;
+}

package/src/styles/core/index.scss

@@ -1,36 +1,36 @@
-@use './animations.scss' as *;
-@use './scrollbar.scss' as *;
-@use './typography-utils.scss' as *;
-
-html {
-  scroll-behavior: smooth;
-}
-
-body {
-  background: var(--background-dark-20);
-}
-
-p,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  word-break: normal;
-}
-
-.slide-up-enter-active,
-.slide-up-leave-active {
-  transition: all 0.25s ease-out;
-}
-
-.slide-up-enter-from {
-  opacity: 0;
-  transform: translateY(30px);
-}
-
-.slide-up-leave-to {
-  opacity: 0;
-  transform: translateY(-30px);
-}
+@use './animations.scss' as *;
+@use './scrollbar.scss' as *;
+@use './typography-utils.scss' as *;
+
+html {
+  scroll-behavior: smooth;
+}
+
+body {
+  background: var(--background-dark-20);
+}
+
+p,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  word-break: normal;
+}
+
+.slide-up-enter-active,
+.slide-up-leave-active {
+  transition: all 0.25s ease-out;
+}
+
+.slide-up-enter-from {
+  opacity: 0;
+  transform: translateY(30px);
+}
+
+.slide-up-leave-to {
+  opacity: 0;
+  transform: translateY(-30px);
+}

package/src/styles/core/scrollbar.scss

@@ -1,36 +1,36 @@
-html {
-  body {
-    scroll-behavior: smooth;
-
-    ::-webkit-scrollbar {
-      width: 8px;
-      height: 5px;
-    }
-
-    /* Track */
-    ::-webkit-scrollbar-track {
-      background: transparent;
-      border-radius: 10px;
-    }
-
-    /* Handle */
-    ::-webkit-scrollbar-thumb {
-      border-radius: 10px;
-    }
-  }
-}
-
-html.dark,
-html.light {
-  body {
-    /* Handle */
-    ::-webkit-scrollbar-thumb {
-      background: var(--anra-border-color);
-    }
-
-    /* Handle on hover */
-    ::-webkit-scrollbar-thumb:hover {
-      background: var(--anra-primary);
-    }
-  }
-}
+html {
+  body {
+    scroll-behavior: smooth;
+
+    ::-webkit-scrollbar {
+      width: 8px;
+      height: 5px;
+    }
+
+    /* Track */
+    ::-webkit-scrollbar-track {
+      background: transparent;
+      border-radius: 10px;
+    }
+
+    /* Handle */
+    ::-webkit-scrollbar-thumb {
+      border-radius: 10px;
+    }
+  }
+}
+
+html.dark,
+html.light {
+  body {
+    /* Handle */
+    ::-webkit-scrollbar-thumb {
+      background: var(--anra-border-color);
+    }
+
+    /* Handle on hover */
+    ::-webkit-scrollbar-thumb:hover {
+      background: var(--anra-primary);
+    }
+  }
+}

package/src/styles/core/typography-utils.scss

@@ -1,9 +1,9 @@
-.simple-metadata {
-  background: var(--anra-bg-20);
-  padding: 0px 5px;
-  border-radius: 5px;
-
-  &.bg-15 {
-    background: var(--anra-bg-15);
-  }
-}
+.simple-metadata {
+  background: var(--anra-bg-20);
+  padding: 0px 5px;
+  border-radius: 5px;
+
+  &.bg-15 {
+    background: var(--anra-bg-15);
+  }
+}

package/src/styles/element/common.scss

@@ -1,56 +1,56 @@
-@use '../scss-tokens' as *;
-
-@forward 'element-plus/theme-chalk/src/common/var.scss' with (
-  $colors: (
-    'primary': (
-      'base': $anra-primary-dark
-    )
-  ),
-  $border-color: (
-    '': $anra-light-border-color
-  ),
-  $fill-color: (
-    'light': $anra-light-fill-color-light
-  ),
-  $date-editor: (
-    'width': 100%
-  ),
-  $select-dropdown: (
-    'border': 1px solid var(--anra-border-color)
-  ),
-  $datepicker: (
-    'inner-border-color': var(--anra-border-color)
-  ),
-  $collapse: (
-    'border-color': var(--anra-border-color),
-    'header-height': auto
-  ),
-  $table: (
-    'header-bg-color': transparent,
-    'tr-bg-color': transparent,
-    'border-color': var(--dark-15-accent-1)
-  ),
-  $checkbox: (
-    'checked-icon-color': var(--anra-black),
-    'bg-color': var(--anra-bg-20)
-  ),
-  $radio-button: (
-    'checked-text-color': var(--anra-black)
-  ),
-  $disabled: (
-    'bg-color': var(--anra-disabled-bg)
-  ),
-  $loading: (
-    'fullscreen-spinner-size': 30px
-  ),
-  $dialog: (
-    'bg-color': var(--anra-bg-15)
-  ),
-  $input: (
-    'bg-color': var(--anra-bg-20),
-    'border-color': var(--anra-form-input-border)
-  ),
-  $menu: (
-    'bg-color': var(--anra-bg-20)
-  )
-);
+@use '../scss-tokens' as *;
+
+@forward 'element-plus/theme-chalk/src/common/var.scss' with (
+  $colors: (
+    'primary': (
+      'base': $anra-primary-dark
+    )
+  ),
+  $border-color: (
+    '': $anra-light-border-color
+  ),
+  $fill-color: (
+    'light': $anra-light-fill-color-light
+  ),
+  $date-editor: (
+    'width': 100%
+  ),
+  $select-dropdown: (
+    'border': 1px solid var(--anra-border-color)
+  ),
+  $datepicker: (
+    'inner-border-color': var(--anra-border-color)
+  ),
+  $collapse: (
+    'border-color': var(--anra-border-color),
+    'header-height': auto
+  ),
+  $table: (
+    'header-bg-color': transparent,
+    'tr-bg-color': transparent,
+    'border-color': var(--dark-15-accent-1)
+  ),
+  $checkbox: (
+    'checked-icon-color': var(--anra-black),
+    'bg-color': var(--anra-bg-20)
+  ),
+  $radio-button: (
+    'checked-text-color': var(--anra-black)
+  ),
+  $disabled: (
+    'bg-color': var(--anra-disabled-bg)
+  ),
+  $loading: (
+    'fullscreen-spinner-size': 30px
+  ),
+  $dialog: (
+    'bg-color': var(--anra-bg-15)
+  ),
+  $input: (
+    'bg-color': var(--anra-bg-20),
+    'border-color': var(--anra-form-input-border)
+  ),
+  $menu: (
+    'bg-color': var(--anra-bg-20)
+  )
+);

package/src/styles/element/dark.scss

@@ -1,38 +1,38 @@
-@use '../scss-tokens' as *;
-
-@forward 'element-plus/theme-chalk/src/dark/var.scss' with (
-  $colors: (
-    'primary': (
-      'base': $anra-primary
-    ),
-    'danger': (
-      'base': $anra-dark-state-danger
-    ),
-    'error': (
-      'base': $anra-dark-state-error
-    ),
-    'info': (
-      'base': $anra-dark-state-info
-    ),
-    'success': (
-      'base': $anra-dark-state-success
-    )
-  ),
-  $bg-color: (
-    '': $anra-dark-bg-20,
-    'overlay': $anra-dark-bg-20
-  ),
-  $border-color: (
-    '': $anra-dark-border-color,
-    'light': $anra-dark-border-color-light
-  ),
-  $fill-color: (
-    'light': $anra-dark-fill-color-light
-  ),
-  $text-color: (
-    'placeholder': $anra-dark-text-placeholder
-  ),
-  $mask-color: (
-    '': $anra-dark-mask-color
-  )
-);
+@use '../scss-tokens' as *;
+
+@forward 'element-plus/theme-chalk/src/dark/var.scss' with (
+  $colors: (
+    'primary': (
+      'base': $anra-primary
+    ),
+    'danger': (
+      'base': $anra-dark-state-danger
+    ),
+    'error': (
+      'base': $anra-dark-state-error
+    ),
+    'info': (
+      'base': $anra-dark-state-info
+    ),
+    'success': (
+      'base': $anra-dark-state-success
+    )
+  ),
+  $bg-color: (
+    '': $anra-dark-bg-20,
+    'overlay': $anra-dark-bg-20
+  ),
+  $border-color: (
+    '': $anra-dark-border-color,
+    'light': $anra-dark-border-color-light
+  ),
+  $fill-color: (
+    'light': $anra-dark-fill-color-light
+  ),
+  $text-color: (
+    'placeholder': $anra-dark-text-placeholder
+  ),
+  $mask-color: (
+    '': $anra-dark-mask-color
+  )
+);

package/src/styles/element/mixins/collapse.scss

@@ -1,61 +1,61 @@
-@mixin el-collapse-operation-style {
-  .el-collapse-item {
-    &__header {
-      padding: 0.5rem 0.5rem 0.5rem 0rem;
-      min-height: 48px;
-      text-align: left;
-    }
-    &__content {
-      background: var(--anra-bg-15-accent);
-    }
-  }
-}
-
-@mixin el-collapse-advisory-style {
-  .el-collapse-item {
-    border-bottom: 10px solid transparent;
-    &__header {
-      border-top: 1px solid var(--el-collapse-border-color);
-    }
-    &__content {
-      background: var(--anra-bg-20);
-      padding-bottom: 0;
-    }
-    &.is-disabled {
-      .el-collapse-item {
-        &__header {
-          color: var(--default-text-color);
-        }
-        &__arrow {
-          visibility: hidden;
-        }
-      }
-    }
-  }
-}
-
-@mixin el-airspace-layer-style {
-  .el-collapse-item {
-    border-bottom: 10px solid transparent;
-    &__header {
-      padding: 0.25rem 0.5rem 0.25rem 0rem;
-      // min-height: 30px;
-      text-align: left;
-      border-top: 1px solid var(--el-collapse-border-color);
-    }
-    &__content {
-      background: var(--anra-bg-15-accent);
-      padding-bottom: 0;
-    }
-    &.is-disabled {
-      .el-collapse-item {
-        &__header {
-          color: var(--default-text-color);
-        }
-        &__arrow {
-          visibility: hidden;
-        }
-      }
-    }
-  }
-}
+@mixin el-collapse-operation-style {
+  .el-collapse-item {
+    &__header {
+      padding: 0.5rem 0.5rem 0.5rem 0rem;
+      min-height: 48px;
+      text-align: left;
+    }
+    &__content {
+      background: var(--anra-bg-15-accent);
+    }
+  }
+}
+
+@mixin el-collapse-advisory-style {
+  .el-collapse-item {
+    border-bottom: 10px solid transparent;
+    &__header {
+      border-top: 1px solid var(--el-collapse-border-color);
+    }
+    &__content {
+      background: var(--anra-bg-20);
+      padding-bottom: 0;
+    }
+    &.is-disabled {
+      .el-collapse-item {
+        &__header {
+          color: var(--default-text-color);
+        }
+        &__arrow {
+          visibility: hidden;
+        }
+      }
+    }
+  }
+}
+
+@mixin el-airspace-layer-style {
+  .el-collapse-item {
+    border-bottom: 10px solid transparent;
+    &__header {
+      padding: 0.25rem 0.5rem 0.25rem 0rem;
+      // min-height: 30px;
+      text-align: left;
+      border-top: 1px solid var(--el-collapse-border-color);
+    }
+    &__content {
+      background: var(--anra-bg-15-accent);
+      padding-bottom: 0;
+    }
+    &.is-disabled {
+      .el-collapse-item {
+        &__header {
+          color: var(--default-text-color);
+        }
+        &__arrow {
+          visibility: hidden;
+        }
+      }
+    }
+  }
+}