npm - @appscode/design-system - Versions diffs - 2.17.60-alpha-2 → 2.17.61-alpha - Mend

@appscode/design-system 2.17.60-alpha-2 → 2.17.61-alpha

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 (120) hide show

package/main.scss CHANGED Viewed

@@ -1,37 +1,39 @@
-@use "@/components/vue-components/styles/base/utilities/_customize-bulma.scss" as *;
+@charset "utf-8";
+// customize bulma css
+@import "@/components/vue-components/styles/base/utilities/_customize-bulma.scss";
 // Third party CSS
-@use "bulma/bulma.sass" as *;
-@use "font-awesome/css/font-awesome.min.css" as *;
-@use "vue-multiselect/dist/vue-multiselect.css" as *;
+@import "bulma/bulma.sass";
+@import "font-awesome/css/font-awesome.min.css";
+@import "vue-multiselect/dist/vue-multiselect.css";
 // BASE
-@use "@/components/vue-components/styles/base/utilities/all" as *;
+@import "@/components/vue-components/styles/base/utilities/all";
 // LAYOUTS
-@use "@/components/vue-components/styles/layouts/all" as *;
+@import "@/components/vue-components/styles/layouts/all";
 // COMPONENTS
-// @use "@/components/vue-components/styles/components/all" as *;
-@use "@/components/vue-components/styles/components/button" as *;
-@use "@/components/vue-components/styles/components/table" as *;
-@use "@/components/vue-components/styles/components/tabs" as *;
-@use "@/components/vue-components/styles/components/avatar" as *;
-@use "@/components/vue-components/styles/components/terminal" as *;
-@use "@/components/vue-components/styles/components/steps" as *;
-@use "@/components/vue-components/styles/components/code-preview/all" as *;
-@use "@/components/vue-components/styles/components/form-fields/input" as *;
-@use "@/components/vue-components/styles/components/form-fields/check-radio-switch" as *;
-@use "@/components/vue-components/styles/components/form-fields/custom-selectbox" as *;
-@use "@/components/vue-components/styles/components/inbox/all" as *;
-@use "@/components/vue-components/styles/components/ui-builder/vue-open-api" as *;
-@use "@/components/vue-components/styles/components/ui-builder/ui-builder" as *;
-@use "@/components/vue-components/styles/components/dropdown" as *;
-@use "@/components/vue-components/styles/components/badge-tags" as *;
-@use "@/components/vue-components/styles/components/platform-design" as *;
-@use "@/components/vue-components/styles/components/cards/cards-group" as *;
-@use "@/components/vue-components/styles/components/file-explore" as *;
-@use "@/components/vue-components/styles/components/ac-duration" as *;
-@use "@/components/vue-components/styles/components/skeletons" as *;
+// @import "@/components/vue-components/styles/components/all";
+@import "@/components/vue-components/styles/components/button";
+@import "@/components/vue-components/styles/components/table";
+@import "@/components/vue-components/styles/components/tabs";
+@import "@/components/vue-components/styles/components/avatar";
+@import "@/components/vue-components/styles/components/terminal";
+@import "@/components/vue-components/styles/components/steps";
+@import "@/components/vue-components/styles/components/code-preview/all";
+@import "@/components/vue-components/styles/components/form-fields/input";
+@import "@/components/vue-components/styles/components/form-fields/check-radio-switch";
+@import "@/components/vue-components/styles/components/form-fields/custom-selectbox";
+@import "@/components/vue-components/styles/components/inbox/all";
+@import "@/components/vue-components/styles/components/ui-builder/vue-open-api";
+@import "@/components/vue-components/styles/components/ui-builder/ui-builder";
+@import "@/components/vue-components/styles/components/dropdown";
+@import "@/components/vue-components/styles/components/badge-tags";
+@import "@/components/vue-components/styles/components/platform-design";
+@import "@/components/vue-components/styles/components/cards/cards-group";
+@import "@/components/vue-components/styles/components/file-explore";
+@import "@/components/vue-components/styles/components/ac-duration";
+@import "@/components/vue-components/styles/components/skeletons";
-// @use "@/components/vue-components/styles/theme/appscode.scss" as *;
+// @import "@/components/vue-components/styles/theme/appscode.scss";

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@appscode/design-system",
-  "version": "2.17.60-alpha-2",
+  "version": "2.17.61-alpha",
   "description": "A design system for Appscode websites and dashboards made using Bulma",
   "main": "main.scss",
   "scripts": {

package/vue-components/styles/base/utilities/_all.scss CHANGED Viewed

@@ -1,12 +1,12 @@
-// @forward "colors";
-@forward "root-variables";
-@forward "generate-color-classes";
-@forward "typography";
-@forward "mixin";
-@forward "extended";
-@forward "global";
-@forward "animation";
-@forward "grid";
-@forward "spacing";
-@forward "layouts";
-// @forward "dark-theme";
+// @import "colors";
+@import "root-variables";
+@import "generate-color-classes";
+@import "typography";
+@import "mixin";
+@import "extended";
+@import "global";
+@import "animation";
+@import "grid";
+@import "spacing";
+@import "layouts";
+// @import "dark-theme";

package/vue-components/styles/base/utilities/_colors.scss CHANGED Viewed

@@ -8,10 +8,9 @@ $white-100: hsl(0, 0%, 100%);
 $black-100: hsl(0, 0%, 0%);
 // primary color guides
-// Default values (can be overridden via CSS custom properties at runtime)
-$primary-hue: 149;
-$primary-saturation: 100%;
-$primary-light: 30%;
+$primary-hue: var(--primary-hue);
+$primary-saturation: var(--primary-saturation);
+$primary-light: var(--primary-light);
 // $theme-mode: var(--theme-mode);
 $primary-5: hsl($primary-hue, $primary-saturation, 5%);
@@ -34,10 +33,9 @@ $primary-dark-grey: hsl($primary-hue, 10%, 10%);
 $primary-light-gray: hsl($primary-hue, 10%, 96%);
 $primary-dark-gray: hsl($primary-hue, 10%, 10%);
-// Default values for secondary colors (can be overridden via CSS custom properties at runtime)
-$secondary-hue: 217;
-$secondary-saturation: 71%;
-$secondary-light: 50%;
+$secondary-hue: var(--secondary-hue);
+$secondary-saturation: var(--secondary-saturation);
+$secondary-light: var(--secondary-light);
 $secondary-5: hsl($secondary-hue, $secondary-saturation, 5%);
 $secondary-10: hsl($secondary-hue, $secondary-saturation, 10%);
 $ac-secondary: hsl($secondary-hue, $secondary-saturation, $secondary-light);

package/vue-components/styles/base/utilities/_customize-bulma.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "colors" as *;
 // Colors
 // $black:        hsl(0, 0%, 4%) !default;
 // $black-bis:    hsl(0, 0%, 7%) !default;

package/vue-components/styles/base/utilities/_extended.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "colors" as *;
 .has-hover-style:not(.is-disabled) {
   cursor: pointer;

package/vue-components/styles/base/utilities/_generate-color-classes.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "colors" as *;
 // classes
 @mixin generate-color-classes($type, $color, $h, $s, $from, $to, $step) {
   $i: $from;

package/vue-components/styles/base/utilities/_global.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "colors" as *;
 // border left, right, top, bottom none
 $positions: (
   "b": "bottom",
@@ -89,7 +87,6 @@ $radius-values: (0, 2, 4, 8, 12, 16, 50);
 // color swatch start
 input[type="color"] {
   -webkit-appearance: none;
-  appearance: none;
   border: none;
   width: 20px;
   height: 20px;
@@ -623,7 +620,7 @@ em {
 $whitespace-values: normal, nowrap, pre, pre-line, pre-wrap, break-spaces;
 @each $value in $whitespace-values {
   .is-whitespace-#{$value} {
-    white-space: #{$value};
+    white-space: #{$value} !important;
   }
 }
 // Whats New

package/vue-components/styles/base/utilities/_mixin.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "colors" as *;
 // ac-buttons
 @mixin ac-button($colorName) {
   background-color: $colorName;

package/vue-components/styles/base/utilities/_typography.scss CHANGED Viewed

@@ -1,6 +1,3 @@
-@use "colors" as *;
-@use "customize-bulma" as *;
 @import url("https://fonts.googleapis.com/css2?family=Inconsolata:wght@200;300;400;500;600;700&family=Roboto:ital,wght@0,400;0,500;0,700;0,900;1,400;1,500;1,700&display=swap");
 $font-heading: "Roboto", sans-serif;

package/vue-components/styles/components/_ac-calendar.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 // for calendar scss
 .ac-date-picker {
   .vc-day-content {

package/vue-components/styles/components/_ac-code-highlight.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .ac-code-highlight {
   pre {
     font-size: 1rem;

package/vue-components/styles/components/_ac-drag.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .ac-drag-option-wrapper {
   display: grid;
   grid-template-columns: calc(50% - 7.5px) calc(50% - 7.5px);

package/vue-components/styles/components/_ac-duration.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .ac-duration-wrapper {
   position: relative;
   z-index: 1;

package/vue-components/styles/components/_accordion.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .single-accordion-item {
   background-color: $white-100;
   margin-bottom: 16px;

package/vue-components/styles/components/_add-card.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 // .add-card-form {
 //   .card-title {
 //     display: grid;

package/vue-components/styles/components/_avatar.scss CHANGED Viewed

@@ -1,4 +1,3 @@
-@use "../base/utilities/colors" as *;
 .avatar {
   position: relative;
   z-index: 1;

package/vue-components/styles/components/_badge-tags.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 @mixin badge($text-color, $bg-color, $text-dark, $bg-light) {
   color: $text-color;
   background-color: $bg-color;

package/vue-components/styles/components/_breadcrumb.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .ac-breadcrumb {
   padding: 8px 20px;
   border-bottom: 1px solid $color-border;

package/vue-components/styles/components/_breadcumb.scss CHANGED Viewed

	@@ -1 +0,0 @@
1	- @use "../base/utilities/index" as *;

package/vue-components/styles/components/_button.scss CHANGED Viewed

@@ -1,4 +1,3 @@
-@use "../base/utilities/colors" as *;
 .button {
   color: $color-text;
   background-color: $white-100;

package/vue-components/styles/components/_card-body-wrapper.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 // .card-body-wrapper {
 //   background-color: $white-100;
 //   border-radius: 4px;

package/vue-components/styles/components/_dashboard-header.scss CHANGED Viewed

	@@ -1 +0,0 @@
1	- @use "../base/utilities/index" as *;

package/vue-components/styles/components/_direct-deploy.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 // .direct-deploy {
 //   h5 {
 //     font-weight: 500;

package/vue-components/styles/components/_dropdown.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .dropdown-group {
   margin-bottom: 8px;
 }

package/vue-components/styles/components/_file-explore.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .file-explore {
   .content-sidebar {
     width: 220px;

package/vue-components/styles/components/_getkeeper.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .getkeeper {
   .ac-vscrollbar {
     padding: 0;

package/vue-components/styles/components/_go-to-top.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 //  go to top area start
 .go-to-top {
   position: fixed;

package/vue-components/styles/components/_graph.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .graph-tooltip-wrapper {
   background-color: $white-100;
   border: 1px solid $color-border;

package/vue-components/styles/components/_lightweight-editor.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .lightweight-editor {
   border-radius: 4px;
   overflow: hidden;

package/vue-components/styles/components/_modal.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 // modal start
 .ac-modal {
   // position: relative;

package/vue-components/styles/components/_nested-list.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .nested-list {
   ul {
     li {

package/vue-components/styles/components/_options.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .ac-options {
   border-radius: 50%;
   width: 32px;

package/vue-components/styles/components/_overview-info.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .cluster-overview {
   background-color: $white-100;
   height: calc(100vh - 80px);

package/vue-components/styles/components/_overview-page.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 // overview-content  start
 .overview-content {
   padding: 20px;

package/vue-components/styles/components/_pagination.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 // .inner-table-pagination {
 //   padding: 5px 20px;
 // }

package/vue-components/styles/components/_platform-design.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .profile-banner {
   background-color: hsl(var(--primary-hue), var(--primary-saturation), var(--primary-light));
   // background-image: url("../../images/banners/banner-background.png");

package/vue-components/styles/components/_preloader.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .spinner {
   position: relative;
 }

package/vue-components/styles/components/_preview-modal.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .preview-icon {
   width: 60px;
   height: 60px;

package/vue-components/styles/components/_pricing-table.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .pricing-table {
   border: 1px solid $color-border;
   background-color: $color-border;

package/vue-components/styles/components/_progress-bar.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 @keyframes ac-move-infinity {
   from {
     background-position: 200% 0;

package/vue-components/styles/components/_report.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .report-charts {
   display: flex;
   flex-direction: row;

package/vue-components/styles/components/_skeletons.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .skeletons {
   display: flex;
   flex-direction: column;

package/vue-components/styles/components/_steps.scss CHANGED Viewed

@@ -1,4 +1,3 @@
-@use "../base/utilities/colors" as *;
 .steps-wrapper {
   --size: 32px;
   --line: 4px;

package/vue-components/styles/components/_table-of-content.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .ac-accordion-wrapper {
   &.table-of-content {
     background-color: $color-border;

package/vue-components/styles/components/_table.scss CHANGED Viewed

@@ -1,4 +1,3 @@
-@use "../base/utilities/colors" as *;
 // INFO TABLE END
 // GENERAL TABLE START

package/vue-components/styles/components/_tabs.scss CHANGED Viewed

@@ -1,4 +1,3 @@
-@use "../base/utilities/colors" as *;
 // .tabs {
 //   &.ac-tabs {
 //     ul {

package/vue-components/styles/components/_terminal.scss CHANGED Viewed

@@ -1,4 +1,3 @@
-@use "../base/utilities/colors" as *;
 // terminal scss start
 :root {
   --terminal-bg: rgb(28, 28, 28);

package/vue-components/styles/components/_tfa.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .qr-code-wrapper {
   background: $info-light;
   width: 240px;

package/vue-components/styles/components/_time-picker.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 /* ========== Variables ========== */
 $cool-gray: #eff1f1;
 $secondary-light-gray: #f7f9fa;

package/vue-components/styles/components/_transitions.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 .sidebar-appear-enter-active,
 .sidebar-appear-leave-active {
   position: absolute;

package/vue-components/styles/components/_widget-menu.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 // widget menu start
 // .widget-menu {
 //   &.style-2 {

package/vue-components/styles/components/_wizard.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../base/utilities/index" as *;
 // .single-wizard-section {
 //   padding: 20px;
 //   background-color: $white-100;

package/vue-components/styles/components/ac-toaster/_ac-toasted.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../../base/utilities/index" as *;
 .ac-toast {
   line-height: 1.5 !important;
   min-width: 350px !important;

package/vue-components/styles/components/alert/_alert-message.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../../base/utilities/index" as *;
 .message {
   &.is-primary {
     background-color: $primary-95;

package/vue-components/styles/components/alert/_alert.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../../base/utilities/index" as *;
 .ac-notification {
   background-color: #f1f1f1;
   font-size: 1rem;

package/vue-components/styles/components/alert/_toast.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../../base/utilities/index" as *;
 .ac-toast {
   width: 350px;
   display: flex;

package/vue-components/styles/components/bbum/_activities-header.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../../base/utilities/index" as *;
 .activities-header {
   padding-bottom: 10px;

package/vue-components/styles/components/bbum/_card-team.scss CHANGED Viewed

@@ -1,5 +1,3 @@
-@use "../../base/utilities/index" as *;
 .single-team-card {
   border: 1px solid $color-border;
   background-color: hsla(var(--hsl-hue), var(--hsl-saturation), var(--hsl-lightness), 0.03);