cloud-web-corejs 1.1.0-dev.6 → 1.1.0-dev.60

package/src/styles/element-variables.scss

@@ -0,0 +1,31 @@
+/**
+* I think element-ui's default theme color is too light for long-term use.
+* So I modified the default color and you can modify it to your liking.
+**/
+
+/* theme color */
+$--color-primary: #2a6494;
+$--color-success: #30B08F;
+$--color-warning: #e6a23c;
+$--color-danger: #ea5353;
+$--color-info: #94979d;
+
+$--button-font-weight: 400;
+
+// $--color-text-regular: #1f2d3d;
+
+$--border-color-light: #dfe4ed;
+$--border-color-lighter: #e6ebf5;
+
+$--table-border: 1px solid #dfe6ec;
+
+/* icon font path, required */
+$--font-path: "~element-ui/lib/theme-chalk/fonts";
+
+@import "~element-ui/packages/theme-chalk/src/index";
+
+// the :export directive is the magic sauce for webpack
+// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
+:export {
+  theme: $--color-primary;
+}

package/src/styles/global.scss

@@ -0,0 +1,115 @@
+@import './theme-variables.scss';
+
+/* 全局基础规则：仅由 styles/index.scss 引入一次。 */
+
+.primary-color {
+  color: $--color-primary;
+}
+
+.background-opacity {
+  background: rgba(64, 158, 255, 0.6);
+}
+
+.form-widget-list {
+
+  .ghost{
+    content: '';
+    font-size: 0;
+    height: 3px;
+    box-sizing: border-box;
+    background: $--color-primary;
+    border: 2px solid $--color-primary;
+    outline-width: 0;
+    padding: 0;
+    overflow: hidden;
+  }
+}
+
+.el-form-item--medium {
+  .el-radio {
+    line-height: 36px !important;
+  }
+
+  .el-rate{
+    margin-top: 8px;
+  }
+}
+
+.el-form-item--small {
+  .el-radio {
+    line-height: 32px !important;
+  }
+
+  .el-rate{
+    margin-top: 6px;
+  }
+}
+
+.el-form-item--mini {
+  .el-radio {
+    line-height: 28px !important;
+  }
+
+  .el-rate{
+    margin-top: 4px;
+  }
+}
+
+.el-card {
+  margin-top: 3px;
+  margin-bottom: 3px;
+}
+
+input[type="password"]::-ms-reveal {  /* 隐藏IE/Edge原生的密码查看按钮 */
+  display: none;
+}
+
+/* 滚动条样式 begin */
+::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+::-webkit-scrollbar-track {
+  width: 8px;
+  background: rgba(#101F1C, 0.1);
+  -webkit-border-radius: 2em;
+  -moz-border-radius: 2em;
+  border-radius: 2em;
+}
+
+::-webkit-scrollbar-thumb {
+  background-color: rgba(#101F1C, 0.35);
+  background-clip: padding-box;
+  min-height: 28px;
+  -webkit-border-radius: 2em;
+  -moz-border-radius: 2em;
+  border-radius: 2em;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background-color: rgba(#101F1C, 0.85);
+}
+
+* {//Firefox浏览器滚动条样式
+  scrollbar-color: #e5e5e5 #f7f7f9; //滚动条轨道颜色、滚动条滑块的颜色
+  scrollbar-width: thin;     //thin模式下滚动条两端的三角按钮会消失
+}
+
+
+/*
+body {//IE浏览器滚动条样式
+  scrollbar-shadow-color: #e5e5e5;
+  scrollbar-face-color: #e5e5e5;
+  scrollbar-base-color: #ffffff;
+  scrollbar-arrow-color: #444040;
+}
+*/
+
+/* 滚动条样式 end */
+
+.label-tooltip-pre-line {
+  white-space: pre-line;
+  line-height: 1.4;
+  max-width: 320px;
+}

package/src/styles/index.scss

@@ -0,0 +1,245 @@
+@import './variables.scss';
+@import './global.scss';
+@import './utilities.scss';
+@import './split-handle.scss';
+@import './nprogress.scss';
+@import './menu-icons.scss';
+@import './mixin.scss';
+@import './transition.scss';
+@import './element-ui.scss';
+@import './sidebar.scss';
+@import './btn.scss';
+@import './dialog.scss';
+@import './page-shell.scss';
+@import './layout-skins.scss';
+// 功能性图标字体随 npm 包发布。
+@import '~@base/core-resources/css/iconfont.css';
+
+// 历史业务样式聚合文件属于 App 层，不随 npm 包发布。
+// 消费应用继续从 @/resources/css/style.scss 引入。
+body {
+  height: 100%;
+  background-color: #f1f6fc;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  text-rendering: optimizeLegibility;
+  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
+
+  :focus:not(:focus-visible) {
+    outline: none;
+  }
+  input {
+    outline: 0;
+    vertical-align: middle;
+    &:-webkit-autofill {
+      -webkit-text-fill-color: #555;
+      transition: background-color 5000s ease-in-out 0s !important;
+      background-color: #fff !important;
+      box-shadow: 0 0 40px 40px #fff inset;
+    }
+  }
+  .placeholder-red {
+    textarea::placeholder {
+      color: red;
+    }
+    input::placeholder {
+      color: red;
+    }
+  }
+  pre {
+    font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
+      Microsoft YaHei, Arial, sans-serif;
+    display: block;
+    white-space: pre-wrap;
+    white-space: -moz-pre-wrap;
+    white-space: -pre-wrap;
+    white-space: -o-pre-wrap;
+    word-wrap: break-word;
+    word-break: break-all;
+    word-wrap: break-word;
+    margin: 0;
+  }
+  #app {
+    overflow: auto;
+  }
+  iframe {
+    border: none;
+  }
+}
+
+label {
+  font-weight: 700;
+}
+
+html {
+  height: 100%;
+  box-sizing: border-box;
+}
+
+#app {
+  height: 100%;
+}
+
+*,
+*:before,
+*:after {
+  box-sizing: inherit;
+}
+
+.no-padding {
+  padding: 0px !important;
+}
+
+.padding-content {
+  padding: 4px 0;
+}
+
+a:focus,
+a:active {
+  outline: none;
+}
+
+a,
+a:focus,
+a:hover {
+  cursor: pointer;
+  color: inherit;
+  text-decoration: none;
+}
+
+div:focus {
+  outline: none;
+}
+
+.fr {
+  float: right;
+}
+
+.fl {
+  float: left;
+}
+
+.pr-5 {
+  padding-right: 5px;
+}
+
+.pl-5 {
+  padding-left: 5px;
+}
+
+.block {
+  display: block;
+}
+
+.pointer {
+  cursor: pointer;
+}
+
+.inlineBlock {
+  display: block;
+}
+
+.clearfix {
+  &:after {
+    visibility: hidden;
+    display: block;
+    font-size: 0;
+    content: " ";
+    clear: both;
+    height: 0;
+  }
+}
+
+aside {
+  background: #eef1f6;
+  padding: 8px 24px;
+  margin-bottom: 20px;
+  border-radius: 2px;
+  display: block;
+  line-height: 32px;
+  font-size: 16px;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+  color: #2c3e50;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+
+  a {
+    color: #337ab7;
+    cursor: pointer;
+
+    &:hover {
+      color: rgb(32, 160, 255);
+    }
+  }
+}
+
+//main-container全局样式
+.app-container {
+  padding: 20px;
+}
+
+.components-container {
+  margin: 30px 50px;
+  position: relative;
+}
+
+.pagination-container {
+  margin-top: 30px;
+}
+
+.text-center {
+  text-align: center
+}
+
+.sub-navbar {
+  height: 50px;
+  line-height: 50px;
+  position: relative;
+  width: 100%;
+  text-align: right;
+  padding-right: 20px;
+  transition: 600ms ease position;
+  background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
+
+  .subtitle {
+    font-size: 20px;
+    color: #fff;
+  }
+
+  &.draft {
+    background: #d0d0d0;
+  }
+
+  &.deleted {
+    background: #d0d0d0;
+  }
+}
+
+.link-type,
+.link-type:focus {
+  color: #337ab7;
+  cursor: pointer;
+
+  &:hover {
+    color: rgb(32, 160, 255);
+  }
+}
+
+.filter-container {
+  padding-bottom: 10px;
+
+  .filter-item {
+    display: inline-block;
+    vertical-align: middle;
+    margin-bottom: 10px;
+  }
+}
+
+//refine vue-multiselect plugin
+.multiselect {
+  line-height: 16px;
+}
+
+.multiselect--active {
+  z-index: 1000 !important;
+}