yahee-components 0.0.18 → 0.0.20

package/lib/styles/index.css

@@ -0,0 +1,787 @@
+@charset "UTF-8";
+:root {
+  --el-color-primary: #3366cc;
+  --el-text-color-regular: #000;
+  --primary-color: #3d7eff;
+  --success-color: #28c445;
+  --error-color: #ff1e1e;
+  --warning-color: #ff8746;
+  --white-color: #fff;
+  --black-color: #000;
+  --text-color-primary: #252628;
+  --text-color-regular: #1c1c1c;
+  --text-color-secondary: #555;
+  --text-color-list: #323233;
+  --text-color-a4: #a4a4a4;
+  --text-color-tag: #737373;
+  --text-color-disabled: #eeeef5;
+  --border-color-base: #e8ecf2;
+  --border-color-light: #e4e7ed;
+  --border-color-lighter: #ebeef5;
+  --border-color-extra-light: #f2f6fc;
+  --bg-color: #f0f3f9;
+  --font-size-large: 18px;
+  --font-size-medium: 16px;
+  --font-size-base: 14px;
+  --font-size-small: 12px;
+  --font-size-extra-small: 10px;
+  --font-family: "Hiragino Sans GB", "Microsoft YaHei","WenQuanYi Micro Hei",Verdana, arial,"Open Sans", sans-serif;
+  --integer-font-family: avenir-heavy, pingfang sc, helvetica neue, arial, sans-serif;
+  --box-shadow-base: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+  --el-menu-item-height: 40px;
+  --el-card-padding: 10px;
+}
+
+/* 文字样式 */
+.fontsize-10 {
+  font-size: 10px;
+}
+
+.fontsize-12 {
+  font-size: 12px;
+}
+
+.fontsize-14 {
+  font-size: 14px;
+}
+
+.fontsize-16 {
+  font-size: 16px;
+}
+
+.fontsize-15 {
+  font-size: 15px;
+}
+
+.fontsize-18 {
+  font-size: 18px;
+}
+
+.fontsize-20 {
+  font-size: 20px;
+}
+
+.fontsize-24 {
+  font-size: 24px;
+}
+
+.fontsize-28 {
+  font-size: 28px;
+}
+
+.fontsize-32 {
+  font-size: 32px;
+}
+
+.fontBold {
+  font-weight: bold;
+}
+
+.text-center {
+  text-align: center;
+}
+
+.text-left {
+  text-align: left;
+}
+
+.text-right {
+  text-align: right;
+}
+
+.ellipsis {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.lineheight-1 {
+  line-height: 1;
+}
+
+.lineheight-16 {
+  line-height: 16px;
+}
+
+.lineheight-18 {
+  line-height: 18px;
+}
+
+.lineheight-24 {
+  line-height: 24px;
+}
+
+.lineheight-26 {
+  line-height: 26px;
+}
+
+.lineheight-28 {
+  line-height: 28px;
+}
+
+.lineheight-36 {
+  line-height: 36px;
+}
+
+.lineheight-normal {
+  line-height: 1.4;
+}
+
+.word-wrap {
+  word-wrap: break-word;
+}
+
+/* 颜色相关 */
+.red {
+  color: #e24c4c;
+}
+
+.gray {
+  color: #999;
+}
+
+.blue {
+  color: #545dff;
+}
+
+.orange {
+  color: #f1a153;
+}
+
+.green {
+  color: #4ce2a7;
+}
+
+.white {
+  color: var(--white-color);
+}
+
+.black {
+  color: var(--black-color);
+}
+
+.primary {
+  color: var(--primary-color);
+}
+
+.error {
+  color: var(--error-color);
+}
+
+.success {
+  color: var(--success-color);
+}
+
+.bg-color {
+  background: var(--bg-color);
+}
+
+.bg-none {
+  background: none !important;
+}
+
+.bg-none * {
+  background: none !important;
+}
+
+.bg-transparent {
+  background: transparent;
+}
+
+.link {
+  color: var(--primary-color);
+  cursor: pointer;
+}
+
+/* 布局相关 */
+.none {
+  display: none;
+}
+
+.inline-block {
+  display: inline-block;
+}
+
+.block {
+  display: block;
+}
+
+.table {
+  display: table;
+}
+
+.table-cell {
+  display: table-cell;
+}
+
+.vertical-align-middle {
+  vertical-align: middle;
+}
+
+.hidden {
+  overflow: hidden;
+}
+
+.clearfix::after {
+  content: ".";
+  display: block;
+  height: 0;
+  clear: both;
+  visibility: hidden;
+}
+
+.pull-left {
+  float: left;
+}
+
+.pull-right {
+  float: right;
+}
+
+.text-right {
+  text-align: right;
+}
+
+.absolute {
+  position: absolute;
+}
+
+.relative {
+  position: relative;
+}
+
+.fixed {
+  position: fixed;
+}
+
+.paddingL0 {
+  padding-left: 0;
+}
+
+.paddingR0 {
+  padding-right: 0;
+}
+
+.paddingB0 {
+  padding-bottom: 0;
+}
+
+.marginT0 {
+  margin-top: 0;
+}
+
+.marginL0 {
+  margin-left: 0;
+}
+
+.marginL10 {
+  margin-left: 10px;
+}
+
+.marginL4 {
+  margin-left: 4px;
+}
+
+.marginL6 {
+  margin-left: 6px;
+}
+
+.marginR6 {
+  margin-right: 6px;
+}
+
+.marginR4 {
+  margin-right: 4px;
+}
+
+.marginR0 {
+  margin-right: 0;
+}
+
+.marginB0 {
+  margin-bottom: 0;
+}
+
+.marginB6 {
+  margin-bottom: 6px;
+}
+
+.padding0 {
+  padding: 0;
+}
+
+.no-padding {
+  padding: 0 !important;
+}
+
+.margin0 {
+  margin: 0;
+}
+
+.paddingT5 {
+  padding-top: 5px;
+}
+
+.paddingL5 {
+  padding-left: 5px;
+}
+
+.paddingR5 {
+  padding-right: 5px;
+}
+
+.paddingB5 {
+  padding-bottom: 5px;
+}
+
+.marginT5 {
+  margin-top: 5px;
+}
+
+.marginL5 {
+  margin-left: 5px;
+}
+
+.marginR5 {
+  margin-right: 5px;
+}
+
+.marginB5 {
+  margin-bottom: 5px;
+}
+
+.padding5 {
+  padding: 5px;
+}
+
+.margin5 {
+  margin: 5px;
+}
+
+.paddingT10 {
+  padding-top: 10px;
+}
+
+.paddingL10 {
+  padding-left: 10px;
+}
+
+.paddingR10 {
+  padding-right: 10px;
+}
+
+.paddingB10 {
+  padding-bottom: 10px;
+}
+
+.marginT10 {
+  margin-top: 10px;
+}
+
+.marginL10 {
+  margin-left: 10px;
+}
+
+.marginR10 {
+  margin-right: 10px;
+}
+
+.marginB10 {
+  margin-bottom: 10px;
+}
+
+.padding10 {
+  padding: 10px;
+}
+
+.margin10 {
+  margin: 10px;
+}
+
+.paddingT15 {
+  padding-top: 15px;
+}
+
+.paddingL15 {
+  padding-left: 15px;
+}
+
+.paddingR15 {
+  padding-right: 15px;
+}
+
+.paddingB15 {
+  padding-bottom: 15px;
+}
+
+.marginT15 {
+  margin-top: 15px;
+}
+
+.marginL15 {
+  margin-left: 15px;
+}
+
+.marginR15 {
+  margin-right: 15px;
+}
+
+.marginB15 {
+  margin-bottom: 15px;
+}
+
+.padding15 {
+  padding: 15px;
+}
+
+.margin15 {
+  margin: 15px;
+}
+
+.paddingT20 {
+  padding-top: 20px;
+}
+
+.paddingL20 {
+  padding-left: 20px;
+}
+
+.paddingR20 {
+  padding-right: 20px;
+}
+
+.paddingB20 {
+  padding-bottom: 20px;
+}
+
+.paddingT30 {
+  padding-top: 30px;
+}
+
+.paddingL30 {
+  padding-left: 30px;
+}
+
+.paddingR30 {
+  padding-right: 30px;
+}
+
+.paddingB30 {
+  padding-bottom: 30px;
+}
+
+.marginT30 {
+  margin-top: 30px;
+}
+
+.marginL30 {
+  margin-left: 30px;
+}
+
+.marginR30 {
+  margin-right: 30px;
+}
+
+.marginB30 {
+  margin-bottom: 30px;
+}
+
+.marginT20 {
+  margin-top: 20px;
+}
+
+.marginL20 {
+  margin-left: 20px;
+}
+
+.marginR20 {
+  margin-right: 20px;
+}
+
+.marginB20 {
+  margin-bottom: 20px;
+}
+
+.padding20 {
+  padding: 20px;
+}
+
+.margin20 {
+  margin: 20px;
+}
+
+.z-index-10 {
+  z-index: 10;
+}
+
+.z-index-20 {
+  z-index: 20;
+}
+
+.z-index-30 {
+  z-index: 30;
+}
+
+.z-index-40 {
+  z-index: 40;
+}
+
+.z-index-50 {
+  z-index: 50;
+}
+
+.z-index-60 {
+  z-index: 60;
+}
+
+.z-index-70 {
+  z-index: 70;
+}
+
+.z-index-80 {
+  z-index: 80;
+}
+
+.z-index-100 {
+  z-index: 100;
+}
+
+.cursor-pointer {
+  cursor: pointer;
+}
+
+.flex-1 {
+  flex: 1;
+}
+
+.gap-10 {
+  -moz-column-gap: 10px;
+       column-gap: 10px;
+}
+
+.gap-20 {
+  -moz-column-gap: 10px;
+       column-gap: 10px;
+}
+
+.gap-40 {
+  -moz-column-gap: 40px;
+       column-gap: 40px;
+}
+
+.d-flex {
+  display: flex;
+}
+
+.jc-between {
+  justify-content: space-between;
+}
+
+.jc-end {
+  justify-content: flex-end;
+}
+
+.ai-center {
+  align-items: center;
+}
+
+.ai-end {
+  align-items: flex-end;
+}
+
+.flexlay {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  flex-direction: row;
+}
+
+.int-font {
+  font-family: var(--integer-font-family);
+}
+
+.text-color-primary {
+  color: var(--text-color-primary);
+}
+
+.text-color-regular {
+  color: var(--text-color-regular);
+}
+
+.text-color-list {
+  color: var(--text-color-list);
+}
+
+.text-color-secondary {
+  color: var(--text-color-secondary);
+}
+
+.text-color-disabled {
+  color: var(--text-color-disabled);
+}
+
+.text-color-a4 {
+  color: var(--text-color-a4);
+}
+
+.text-color-tag {
+  color: var(--text-color-tag);
+}
+
+.ellipsis-1 {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ellipsis-2 {
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  /* autoprefixer: ignore next */
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+}
+
+.ellipsis-3 {
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  /* autoprefixer: ignore next */
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 3;
+  overflow: hidden;
+}
+
+.bold-700 {
+  font-weight: 700;
+}
+
+.bold-500 {
+  font-weight: 500;
+}
+
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.5s ease;
+}
+
+.fade-enter-from,
+.fade-leave-to {
+  opacity: 0;
+}
+
+.width50 {
+  width: 50%;
+  margin-right: 0;
+}
+
+.width100 {
+  width: 100%;
+}
+
+.width55 {
+  width: 55%;
+}
+
+.width45 {
+  width: 45%;
+  margin-right: 0;
+}
+.width45.pull-right .pull-right {
+  margin-right: 0;
+  padding-right: 5px;
+}
+
+.marginR45 {
+  margin-right: 45px;
+}
+
+:root {
+  --el-color-primary: #3366cc;
+  --el-text-color-regular: #000;
+  --primary-color: #3d7eff;
+  --success-color: #28c445;
+  --error-color: #ff1e1e;
+  --warning-color: #ff8746;
+  --white-color: #fff;
+  --black-color: #000;
+  --text-color-primary: #252628;
+  --text-color-regular: #1c1c1c;
+  --text-color-secondary: #555;
+  --text-color-list: #323233;
+  --text-color-a4: #a4a4a4;
+  --text-color-tag: #737373;
+  --text-color-disabled: #eeeef5;
+  --border-color-base: #e8ecf2;
+  --border-color-light: #e4e7ed;
+  --border-color-lighter: #ebeef5;
+  --border-color-extra-light: #f2f6fc;
+  --bg-color: #f0f3f9;
+  --font-size-large: 18px;
+  --font-size-medium: 16px;
+  --font-size-base: 14px;
+  --font-size-small: 12px;
+  --font-size-extra-small: 10px;
+  --font-family: "Hiragino Sans GB", "Microsoft YaHei","WenQuanYi Micro Hei",Verdana, arial,"Open Sans", sans-serif;
+  --integer-font-family: avenir-heavy, pingfang sc, helvetica neue, arial, sans-serif;
+  --box-shadow-base: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+  --el-menu-item-height: 40px;
+  --el-card-padding: 10px;
+}
+
+:root {
+  --el-color-primary: var(--primary-color);
+  --el-color-primary-light-2: rgba(61, 126, 255, 0.8);
+  --el-color-primary-light-3: rgba(61, 126, 255, 0.8);
+  --el-color-success: var(--success-color);
+  --el-color-warning: var(--warning-color);
+  --el-color-error: var(--error-color);
+  --el-color-white: var(--white-color);
+  --el-color-black: var(--black-color);
+  --el-text-color-primary: var(--text-color-primary);
+  --el-text-color-regular: var(--text-color-regular);
+  --el-text-color-secondary: var(--text-color-secondary);
+  --el-text-color-placeholder: var(--text-color-placeholder);
+  --el-border-color-base: var(--border-color-base);
+  --el-border-color-light: var(--border-color-light);
+  --el-border-color-lighter: var(--border-color-lighter);
+  --el-border-color-extra-light: var(--border-color-extra-light);
+  --el-background-color-base: var(--bg-color);
+  --el-box-shadow-light: var(--box-shadow-base);
+  --el-font-size-large: var(--font-size-large);
+  --el-font-size-medium: var(--font-size-medium);
+  --el-font-size-base: var(--font-size-base);
+  --el-font-size-small: var(--font-size-small);
+  --el-font-size-extra-small: var(--font-size-extra-small);
+}
+
+/************* el-card 样式 ******************/
+.el-card {
+  --el-card-padding: 10px !important;
+}
+
+/************* el-header 样式 ******************/
+.el-header {
+  --el-header-padding: 0 4px !important;
+}
+
+/************* el-form 样式 ******************/
+.el-form-item {
+  margin-bottom: 4px !important;
+}
+
+.el-checkbox {
+  margin-right: 4px !important;
+}
+
+/************* el-table 样式 ******************/
+.el-table__header {
+  background-color: var(--el-table-row-hover-bg-color);
+}
+
+* {
+  -moz-user-select: text;
+       user-select: text;
+  -webkit-touch-callout: none;
+  -webkit-user-select: text !important;
+}