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

package/base/utilities/_default.scss

@@ -23,6 +23,10 @@
     }
   }
 
+  &.in-ui-builder {
+    grid-template-columns: calc(100% - 270px) 270px;
+  }
+
   &.has-ui-builder {
     grid-template-columns: 70px calc(100% - 70px);
     grid-gap: 0;

package/components/_ac-card.scss

@@ -144,7 +144,7 @@
         &:after {
           position: absolute;
           content: "";
-          left: 10px;
+          left: 0;
           bottom: 0;
           width: 100%;
           height: 5px;

package/components/_ac-options.scss

@@ -26,6 +26,8 @@
   &.is-right {
     .option-dots {
       align-items: flex-end;
+      padding: 0 10px;
+      margin-right: -10px;
     }
 
     .options-items {
@@ -41,17 +43,18 @@
     border: none;
     background-color: transparent;
     transition: 0.3 ease-in-out;
+   
 
     &:hover {
       color: $ac-primary;
     }
 
     span {
-      width: 5px;
-      height: 5px;
+      width: 4px;
+      height: 4px;
       background-color: $ac-color-value;
       border-radius: 50%;
-      margin-bottom: 2px;
+      margin-bottom: 1px;
     }
   }
 
@@ -94,7 +97,7 @@
 
       a {
         font-size: $font-size-small;
-        padding: 10px 15px;
+        padding: 7px 15px;
         display: block;
         text-decoration: none !important;
         color: $ac-color-text !important;

package/components/_buttons.scss

@@ -624,6 +624,9 @@
       --ac-white: #2e323c;
     }
   }
+  .button.ac-button.is-text{
+    background-color: transparent;
+  }
 }
 // dark theme end
 /****************************************

package/components/bbum/_card-team.scss

@@ -7,7 +7,7 @@
     0.03
   );
   border-radius: 4px;
-  overflow: hidden;
+  // overflow: hidden;
   transition: 0.3s ease-in-out;
 
   &:hover {

package/components/bbum/_user-profile.scss

@@ -10,7 +10,6 @@
       background-color: $ac-white;
       border-radius: 4px;
       overflow: hidden;
-      padding: 10px;
       position: relative;
       z-index: 1;
       margin-bottom: 10px;
@@ -69,7 +68,7 @@
         font-size: 14px;
         color: $ac-color-text;
         line-height: 160%;
-        margin-bottom: 20px;
+        margin-bottom: 10px;
       }
 
       .social-links {
@@ -103,7 +102,7 @@
           }
 
           img {
-            max-width: 18px;
+            max-width: 15px;
             margin-right: 10px;
           }
         }

package/package.json

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

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

@@ -1,5 +1,5 @@
 <template>
-  <li>
+  <li ref="sidebarItem">
     <router-link
       :id="id"
       :title="title"
@@ -38,5 +38,27 @@ export default {
       default: "@/assets/images/icons/basic.svg",
     },
   },
+  watch: {
+    isActive: {
+      immediate: true,
+      handler(n) {
+        if (n) {
+          this.$nextTick(() => {
+            setTimeout(() => {
+              const top = (this.$refs.sidebarItem && this.$refs.sidebarItem.getBoundingClientRect().top) || 0;
+              // preventing scroll to options that are already visible
+              if (top > window.innerHeight - 200) {
+                // scroll to selected option item
+                this.$refs.sidebarItem.scrollIntoView({
+                  behavior: 'smooth',
+                  block: "center"
+                });
+              }
+            }, 500);  
+          });
+        }
+      }
+    }
+  }
 };
 </script>