@appscode/design-system 1.0.43-alpha.87 → 1.0.43-alpha.90

package/base/utilities/_typography.scss

@@ -106,3 +106,6 @@ strong {
 .is-font-bold {
   font-weight: 700;
 }
+.material-icons{
+  font-size: 1em;
+}

package/components/_ac-alert-box.scss

@@ -17,8 +17,9 @@
   p {
     color: $ac-primary;
 
-    i.fa {
+    .close-icon {
       padding-right: 10px;
+      font-size: 15px;
     }
 
     a {

package/components/_ac-input.scss

@@ -177,6 +177,11 @@
         top: -9px;
         font-weight: 500;
         color: $ac-color-value;
+        &.is-required{
+          &:after{
+            width: calc(100% + 10px);
+          }
+        }
       }
     }
 
@@ -373,12 +378,13 @@
   }
 
   .ac-textarea {
-    // border: 1px solid $ac-label-text;
-    // border-radius: 4px;
-    // padding: 10px 0 5px 0;
-    // // background-color: $ac-blue-light;
-    // transition: background-color 0.3s ease-in-out;
-
+   .ac-label{
+    &.is-required{
+      &:after{
+        width: calc(100% + 10px);
+      }
+    }
+   }
     textarea {
       border: 1px solid $ac-label-text;
       background-color: transparent;
@@ -387,6 +393,7 @@
       &.bg-white {
         background-color: transparent;
       }
+      
 
       &:focus {
         outline: none;
@@ -790,7 +797,11 @@ input#captcha {
     label {
       color: $ac-label-text;
     }
+    .button.is-information:focus{
+      background-color: $dark-bg-light;
+    }
   }
+  
 }
 // dark theme end
 /****************************************

package/components/_left-sidebar-menu.scss

@@ -1,4 +1,6 @@
 .ac-system-left-sidebar {
+  min-height: calc(100vh - 50px);
+
   &.is-expanded {
     .ac-left-sidebar-wrapper {
       &.style-2 {
@@ -379,7 +381,7 @@
 
     // commented out to set full width select box when right content is not present
     // width: 234px;
-    
+
     left: 0px;
     top: -5px;
 

package/main.scss

@@ -3,6 +3,7 @@
 @import "~bulma-checkradio";
 @import "~bulma-switch";
 @import "~bulma-tooltip";
+@import url("https://fonts.googleapis.com/css2?family=Material+Icons&display=swap");
 @import "vue-multiselect/dist/vue-multiselect.min.css";
 
 // BASE

package/package.json

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

package/vue-components/v2/sidebar/ClusterSwitcher.vue

@@ -99,7 +99,7 @@ export default {
       },
     },
     selectedClusterName(n) {
-      if (n !== this.selectedCluster.name) {
+      if (this.selectedCluster && n !== this.selectedCluster.name) {
         this.clusterOptions.forEach((item) => {
           if (this.selectedClusterName === item.name) {
             this.selectedCluster = item;