@appscode/design-system 1.1.0-beta.2 → 1.1.0-beta.25

package/components/_ac-options.scss

@@ -1,122 +1,122 @@
-.ac-options {
-  position: relative;
-  z-index: 9;
-
-  &.is-horaizental {
-    .option-dots {
-      flex-direction: row;
-
-      span {
-        margin-bottom: 0;
-        margin-right: 2px;
-      }
-    }
-  }
-
-  &.is-centered {
-    .option-dots {
-      align-items: center;
-    }
-
-    .options-items {
-      left: 50%;
-    }
-  }
-
-  &.is-right {
-    .option-dots {
-      align-items: flex-end;
-      padding: 0 10px;
-      margin-right: -10px;
-    }
-
-    .options-items {
-      right: 0px;
-    }
-  }
-
-  .option-dots {
-    display: flex;
-    flex-direction: column;
-    cursor: pointer;
-    align-items: flex-start;
-    border: none;
-    background-color: transparent;
-    transition: 0.3 ease-in-out;
-
-    &:hover {
-      color: $primary;
-    }
-
-    span {
-      width: 4px;
-      height: 4px;
-      background-color: $primary-20;
-      border-radius: 50%;
-      margin-bottom: 1px;
-    }
-  }
-
-  .options-items {
-    border-radius: 4px;
-    position: absolute;
-    z-index: 99;
-    background-color: $white-100;
-    min-width: 160px;
-    top: 30px;
-    padding: 5px 0;
-    border: 1px solid $primary-90;
-
-    li {
-      .list-button {
-        width: 100%;
-        background-color: transparent;
-        border: none;
-        cursor: pointer;
-        font-weight: 400;
-        text-align: left;
-        color: $primary-20;
-        font-size: 13px;
-        padding: 10px 30px;
-        display: block;
-
-        &:hover {
-          background-color: $black-60;
-          color: $primary;
-        }
-
-        span {
-          background-color: transparent;
-
-          &.icon {
-            margin-right: 5px;
-          }
-        }
-      }
-
-      a {
-        font-size: 13px;
-        padding: 7px 15px;
-        display: block;
-        text-decoration: none !important;
-        color: $primary-10 !important;
-        border: none;
-
-        &:hover {
-          background-color: $black-60;
-          color: $primary !important;
-        }
-      }
-    }
-  }
-}
-
-// dark theme start
-.is-dark-theme {
-  .ac-options {
-    .options-items {
-      --ac-white: var(--dark-bg-light);
-    }
-  }
-}
-// dark theme end
+// .ac-options {
+//   position: relative;
+//   z-index: 9;
+
+//   &.is-horaizental {
+//     .option-dots {
+//       flex-direction: row;
+
+//       span {
+//         margin-bottom: 0;
+//         margin-right: 2px;
+//       }
+//     }
+//   }
+
+//   &.is-centered {
+//     .option-dots {
+//       align-items: center;
+//     }
+
+//     .options-items {
+//       left: 50%;
+//     }
+//   }
+
+//   &.is-right {
+//     .option-dots {
+//       align-items: flex-end;
+//       padding: 0 10px;
+//       margin-right: -10px;
+//     }
+
+//     .options-items {
+//       right: 0px;
+//     }
+//   }
+
+//   .option-dots {
+//     display: flex;
+//     flex-direction: column;
+//     cursor: pointer;
+//     align-items: flex-start;
+//     border: none;
+//     background-color: transparent;
+//     transition: 0.3 ease-in-out;
+
+//     &:hover {
+//       color: $primary;
+//     }
+
+//     span {
+//       width: 4px;
+//       height: 4px;
+//       background-color: $primary-20;
+//       border-radius: 50%;
+//       margin-bottom: 1px;
+//     }
+//   }
+
+//   .options-items {
+//     border-radius: 4px;
+//     position: absolute;
+//     z-index: 99;
+//     background-color: $white-100;
+//     min-width: 160px;
+//     top: 30px;
+//     padding: 5px 0;
+//     border: 1px solid $primary-90;
+
+//     li {
+//       .list-button {
+//         width: 100%;
+//         background-color: transparent;
+//         border: none;
+//         cursor: pointer;
+//         font-weight: 400;
+//         text-align: left;
+//         color: $primary-20;
+//         font-size: 13px;
+//         padding: 10px 30px;
+//         display: block;
+
+//         &:hover {
+//           background-color: $black-60;
+//           color: $primary;
+//         }
+
+//         span {
+//           background-color: transparent;
+
+//           &.icon {
+//             margin-right: 5px;
+//           }
+//         }
+//       }
+
+//       a {
+//         font-size: 13px;
+//         padding: 7px 15px;
+//         display: block;
+//         text-decoration: none !important;
+//         color: $primary-10 !important;
+//         border: none;
+
+//         &:hover {
+//           background-color: $black-60;
+//           color: $primary !important;
+//         }
+//       }
+//     }
+//   }
+// }
+
+// // dark theme start
+// .is-dark-theme {
+//   .ac-options {
+//     .options-items {
+//       --ac-white: var(--dark-bg-light);
+//     }
+//   }
+// }
+// // dark theme end

package/components/_ac-select-box.scss

@@ -1,7 +1,7 @@
 .ac-select-box {
   select {
     background-color: $info-light;
-    border: 1px solid $ac-label-text;
+    border: 1px solid $primary-10;
     font-size: 13px;
     height: 42px;
     padding-left: 20px;
@@ -34,16 +34,16 @@
   }
 
   &.select:not(.is-multiple):not(.is-loading)::after {
-    border-color: $ac-label-text;
+    border-color: $primary-10;
   }
 }
 
 .is-dark-theme {
   .select {
     select {
-      background-color: $dark-bg-light;
-      color: $ac-full-white;
+      background-color: $black-80;
+      color: $white-100;
       border: 1px solid $primary-90;
     }
   }
-}
+}