n20-common-lib 1.2.43 → 1.3.0

package/src/assets/css/cl-general-card.scss

@@ -1,12 +1,12 @@
-.general-card {
-  color: #fff;
-  padding: 16px;
-  background-image: linear-gradient(to right, #5f64ff, #af71fe);
-  box-shadow: 3px 3px 3px #f1f1f1, 3px -3px 3px #f1f1f1, -3px 3px 3px #f1f1f1,
-  -3px -3px 3px #f1f1f1;
-}
-.card-top {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
+.general-card {
+  color: #fff;
+  padding: 16px;
+  background-image: linear-gradient(to right, #5f64ff, #af71fe);
+  box-shadow: 3px 3px 3px #f1f1f1, 3px -3px 3px #f1f1f1, -3px 3px 3px #f1f1f1,
+  -3px -3px 3px #f1f1f1;
+}
+.card-top {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
 }

package/src/assets/css/cl-layout-aside.scss

@@ -1,93 +1,93 @@
-.layout-aside {
-  .el-menu-item,
-  .el-submenu__title {
-    height: $--aside-height;
-    line-height: $--aside-height;
-    padding-right: 16px;
-    i {
-      color: inherit;
-    }
-  }
-  .el-submenu__icon-arrow {
-    right: 16px;
-  }
-  .el-menu-item.is-active {
-    background: $--color-primary !important;
-  }
-
-  &.el-menu--collapse {
-    width: $--aside-collapse-width;
-    .el-tooltip,
-    .el-submenu__title {
-      padding-left: 16px !important;
-      padding-right: 16px !important;
-    }
-
-    .open-collapsed-btn {
-      padding-left: 10px;
-      padding-right: 10px;
-      .rotate-icon {
-        transform: rotate(180deg);
-      }
-    }
-  }
-}
-.layout-aside > .el-menu-item,
-.layout-aside > .el-submenu > .el-submenu__title {
-  padding-left: 16px !important;
-}
-
-.open-collapsed-btn {
-  box-sizing: border-box;
-  position: sticky;
-  bottom: 0;
-  left: 0;
-  z-index: 1;
-
-  width: 100%;
-  height: $--aside-height;
-  line-height: $--aside-height;
-  padding-left: 20px;
-  padding-right: 20px;
-
-  font-size: 26px;
-  color: #fefefea6;
-  background: #3d4b6a;
-  cursor: pointer;
-
-  &:hover {
-    color: #ffffff;
-  }
-}
-
-.nav-menu-pop {
-  .el-menu-item {
-    height: $--aside-height;
-    line-height: $--aside-height;
-    padding-left: 10px !important;
-    padding-right: 10px !important;
-  }
-  .el-submenu__title {
-    height: $--aside-height;
-    padding-left: 10px !important;
-    padding-right: 16px !important;
-    i {
-      color: inherit;
-    }
-  }
-  .el-submenu__icon-arrow {
-    right: 16px;
-  }
-  .el-menu-item.is-active {
-    background: $--color-primary !important;
-  }
-  .el-menu--vertical {
-    margin-top: -6px;
-  }
-}
-
-
-.el-menu--collapse > .el-menu-item [class^="el-icon-"],
-.el-menu--collapse > .el-submenu > .el-submenu__title [class^="el-icon-"] {
-  width: 18px;
+.layout-aside {
+  .el-menu-item,
+  .el-submenu__title {
+    height: $--aside-height;
+    line-height: $--aside-height;
+    padding-right: 16px;
+    i {
+      color: inherit;
+    }
+  }
+  .el-submenu__icon-arrow {
+    right: 16px;
+  }
+  .el-menu-item.is-active {
+    background: $--color-primary !important;
+  }
+
+  &.el-menu--collapse {
+    width: $--aside-collapse-width;
+    .el-tooltip,
+    .el-submenu__title {
+      padding-left: 16px !important;
+      padding-right: 16px !important;
+    }
+
+    .open-collapsed-btn {
+      padding-left: 10px;
+      padding-right: 10px;
+      .rotate-icon {
+        transform: rotate(180deg);
+      }
+    }
+  }
+}
+.layout-aside > .el-menu-item,
+.layout-aside > .el-submenu > .el-submenu__title {
+  padding-left: 16px !important;
+}
+
+.open-collapsed-btn {
+  box-sizing: border-box;
+  position: sticky;
+  bottom: 0;
+  left: 0;
+  z-index: 1;
+
+  width: 100%;
+  height: $--aside-height;
+  line-height: $--aside-height;
+  padding-left: 20px;
+  padding-right: 20px;
+
+  font-size: 26px;
+  color: #fefefea6;
+  background: #3d4b6a;
+  cursor: pointer;
+
+  &:hover {
+    color: #ffffff;
+  }
+}
+
+.nav-menu-pop {
+  .el-menu-item {
+    height: $--aside-height;
+    line-height: $--aside-height;
+    padding-left: 10px !important;
+    padding-right: 10px !important;
+  }
+  .el-submenu__title {
+    height: $--aside-height;
+    padding-left: 10px !important;
+    padding-right: 16px !important;
+    i {
+      color: inherit;
+    }
+  }
+  .el-submenu__icon-arrow {
+    right: 16px;
+  }
+  .el-menu-item.is-active {
+    background: $--color-primary !important;
+  }
+  .el-menu--vertical {
+    margin-top: -6px;
+  }
+}
+
+
+.el-menu--collapse > .el-menu-item [class^="el-icon-"],
+.el-menu--collapse > .el-submenu > .el-submenu__title [class^="el-icon-"] {
+  width: 18px;
 }

package/src/assets/css/cl-layout-content.scss

@@ -1,16 +1,16 @@
-.content-box {
-  box-sizing: border-box;
-  margin: 10px;
-  padding: 12px;
-  border-radius: 6px;
-  height: var(--client-height);
-  background: $--color-white;
-  overflow: auto;
-
-  &.element-doc {
-    margin: 10px;
-    padding: 10px;
-    height: var(--client-height);
-    overflow: auto;
-  }
-}
+.content-box {
+  box-sizing: border-box;
+  margin: 10px;
+  padding: 12px;
+  border-radius: 6px;
+  height: var(--client-height);
+  background: $--color-white;
+  overflow: auto;
+
+  &.element-doc {
+    margin: 10px;
+    padding: 10px;
+    height: var(--client-height);
+    overflow: auto;
+  }
+}

package/src/assets/css/cl-layout-header.scss

@@ -1,73 +1,73 @@
-.header-wrap {
-  .header-logo {
-    width: auto;
-    height: 26px;
-  }
-  .el-divider {
-    height: 26px;
-  }
-  .header-title {
-    margin: 0;
-    padding: 0;
-    font-size: 20px;
-    font-weight: 600;
-    color: #000000;
-  }
-  .set-user-drop {
-    margin-left: auto;
-  }
-  .set-user-btn {
-    margin-left: auto;
-    font-size: 20px;
-    cursor: pointer;
-  }
-  .news-btn {
-    font-size: 20px;
-    margin-left: 24px;
-    cursor: pointer;
-  }
-
-  .user-info-btn {
-    width: 30px;
-    height: 30px;
-    border-radius: 15px;
-    overflow: hidden;
-    margin-left: 24px;
-    margin-right: 10px;
-    cursor: pointer;
-  }
-    .el-badge {
-      .el-badge__content {
-        line-height: 14px;
-      }
-    }
-}
-
-.header-notice-tabs {
-  .el-tabs__item {
-    width: 170px !important;
-    padding: 0;
-    .el-badge {
-      .el-badge__content{
-        line-height: 14px;  
-      }
-      .el-badge__content.is-fixed {
-        top: 8px !important;
-      }
-    }
-  }
-  .notice-list {
-    height: 240px;
-    overflow-x: hidden;
-    overflow-y: auto;
-  }
-  .notice-item {
-    cursor: pointer;
-    &:hover {
-      color: var(--color-primary);
-    }
-  }
-  .unread-notice {
-    color: var(--color-danger);
-  }
-}
+.header-wrap {
+  .header-logo {
+    width: auto;
+    height: 26px;
+  }
+  .el-divider {
+    height: 26px;
+  }
+  .header-title {
+    margin: 0;
+    padding: 0;
+    font-size: 20px;
+    font-weight: 600;
+    color: #000000;
+  }
+  .set-user-drop {
+    margin-left: auto;
+  }
+  .set-user-btn {
+    margin-left: auto;
+    font-size: 20px;
+    cursor: pointer;
+  }
+  .news-btn {
+    font-size: 20px;
+    margin-left: 24px;
+    cursor: pointer;
+  }
+
+  .user-info-btn {
+    width: 30px;
+    height: 30px;
+    border-radius: 15px;
+    overflow: hidden;
+    margin-left: 24px;
+    margin-right: 10px;
+    cursor: pointer;
+  }
+    .el-badge {
+      .el-badge__content {
+        line-height: 14px;
+      }
+    }
+}
+
+.header-notice-tabs {
+  .el-tabs__item {
+    width: 170px !important;
+    padding: 0;
+    .el-badge {
+      .el-badge__content{
+        line-height: 14px;  
+      }
+      .el-badge__content.is-fixed {
+        top: 8px !important;
+      }
+    }
+  }
+  .notice-list {
+    height: 240px;
+    overflow-x: hidden;
+    overflow-y: auto;
+  }
+  .notice-item {
+    cursor: pointer;
+    &:hover {
+      color: var(--color-primary);
+    }
+  }
+  .unread-notice {
+    color: var(--color-danger);
+  }
+}

package/src/assets/css/cl-layout-tabs.scss

@@ -1,87 +1,87 @@
-$--item-margin: 6px;
-$--item-radius: 4px;
-$--item-hover-padding: 12px;
-
-.tabs-nav-wrap {
-  &.el-tabs--card > .el-tabs__header {
-    border-bottom: none;
-  }
-  &.el-tabs--card > .el-tabs__header .el-tabs__item {
-    transition: color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
-      background-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
-  }
-  .el-tabs__nav {
-    border: none !important;
-    padding-top: $--layou-margin - 1px;
-  }
-  .el-tabs__item {
-    height: $--tabsnav-height - 2 * $--layou-margin;
-    line-height: $--tabsnav-height - 2 * $--layou-margin;
-    padding-left: $--item-hover-padding !important;
-    padding-right: $--item-hover-padding !important;
-    margin-right: $--item-margin;
-    border-radius: $--item-radius;
-    background: $--color-white;
-    border: none !important;
-    font-weight: $--font-weight-primary;
-    &:first-child {
-      margin-left: $--layou-margin;
-      .el-icon-close {
-        display: none;
-      }
-    }
-    &:last-child {
-      margin-right: $--layou-margin;
-    }
-
-    // &:hover {
-    //   background: #f4f5f8;
-    // }
-
-    &.is-active {
-      color: $--color-white;
-      background: $--color-primary;
-    }
-
-    &:focus.is-active.is-focus {
-      box-shadow: none;
-      border-radius: 0;
-    }
-  }
-
-  .el-tabs__nav-wrap.is-scrollable {
-    padding-left: 12px;
-    padding-right: 12px;
-
-    .el-tabs__item {
-      &:first-child {
-        margin-left: 2px;
-      }
-      &:last-child {
-        margin-right: 2px;
-      }
-    }
-  }
-  .el-tabs__nav-next,
-  .el-tabs__nav-prev {
-    width: 12px;
-    height: $--tabsnav-height - 2 * $--layou-margin;
-    line-height: $--tabsnav-height - 2 * $--layou-margin;
-    border-radius: $--item-radius;
-    background: #ffffff;
-
-    top: $--layou-margin;
-    z-index: 9;
-    &:hover {
-      background: #f0f2f5;
-    }
-  }
-}
-.tab-nav-context-menu {
-  &[x-placement^='bottom'] {
-    margin-top: 6px;
-  }
-  .popper__arrow {
-    display: initial;
-  }
-}
+$--item-margin: 6px;
+$--item-radius: 4px;
+$--item-hover-padding: 12px;
+
+.tabs-nav-wrap {
+  &.el-tabs--card > .el-tabs__header {
+    border-bottom: none;
+  }
+  &.el-tabs--card > .el-tabs__header .el-tabs__item {
+    transition: color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
+      background-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  }
+  .el-tabs__nav {
+    border: none !important;
+    padding-top: $--layou-margin - 1px;
+  }
+  .el-tabs__item {
+    height: $--tabsnav-height - 2 * $--layou-margin;
+    line-height: $--tabsnav-height - 2 * $--layou-margin;
+    padding-left: $--item-hover-padding !important;
+    padding-right: $--item-hover-padding !important;
+    margin-right: $--item-margin;
+    border-radius: $--item-radius;
+    background: $--color-white;
+    border: none !important;
+    font-weight: $--font-weight-primary;
+    &:first-child {
+      margin-left: $--layou-margin;
+      .el-icon-close {
+        display: none;
+      }
+    }
+    &:last-child {
+      margin-right: $--layou-margin;
+    }
+
+    // &:hover {
+    //   background: #f4f5f8;
+    // }
+
+    &.is-active {
+      color: $--color-white;
+      background: $--color-primary;
+    }
+
+    &:focus.is-active.is-focus {
+      box-shadow: none;
+      border-radius: 0;
+    }
+  }
+
+  .el-tabs__nav-wrap.is-scrollable {
+    padding-left: 12px;
+    padding-right: 12px;
+
+    .el-tabs__item {
+      &:first-child {
+        margin-left: 2px;
+      }
+      &:last-child {
+        margin-right: 2px;
+      }
+    }
+  }
+  .el-tabs__nav-next,
+  .el-tabs__nav-prev {
+    width: 12px;
+    height: $--tabsnav-height - 2 * $--layou-margin;
+    line-height: $--tabsnav-height - 2 * $--layou-margin;
+    border-radius: $--item-radius;
+    background: #ffffff;
+
+    top: $--layou-margin;
+    z-index: 9;
+    &:hover {
+      background: #f0f2f5;
+    }
+  }
+}
+.tab-nav-context-menu {
+  &[x-placement^='bottom'] {
+    margin-top: 6px;
+  }
+  .popper__arrow {
+    display: initial;
+  }
+}