wetrade-design/lib/typography/style/index.css

一款多语言支持Vue3的UI框架

/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
/* stylelint-disable no-duplicate-selectors */
/* stylelint-disable */
/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
/** gray-sp */
/** blue-sp */
/** green-sp */
/** red-sp */
/** orange-sp */
/** 品牌橙 */
/** 日落黄 */
/** 柠檬黄 */
/** 新生绿 */
/** 绿色 */
/** 碧涛青 */
/** 海蔚蓝 */
/** 品牌蓝色 */
/** 宝石蓝 */
/** 星空紫 */
/** 罗兰紫 */
/** 青春紫 */
/** 品红 */
/** 红色 */
/** 灰色 */
/** 保留ant色板 */
/** 绿色 */
/** 品牌蓝 */
.wd-typography {
  color: #1E1E29;
  overflow-wrap: break-word;
}
.wd-typography.wd-typography-secondary {
  color: #575E73;
}
.wd-typography.wd-typography-success {
  color: #23BF70;
}
.wd-typography.wd-typography-warning {
  color: #FF7925;
}
.wd-typography.wd-typography-danger {
  color: #f5222d;
}
a.wd-typography.wd-typography-danger:active,
a.wd-typography.wd-typography-danger:focus,
a.wd-typography.wd-typography-danger:hover {
  color: #ff4d4f;
}
.wd-typography.wd-typography-disabled {
  color: #C7CBD6;
  cursor: not-allowed;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
div.wd-typography,
.wd-typography p {
  margin-bottom: 1em;
}
h1.wd-typography,
.wd-typography h1 {
  margin-bottom: 0.5em;
  color: #1E1E29;
  font-weight: 600;
  font-size: 38px;
  line-height: 1.23;
}
h2.wd-typography,
.wd-typography h2 {
  margin-bottom: 0.5em;
  color: #1E1E29;
  font-weight: 600;
  font-size: 30px;
  line-height: 1.35;
}
h3.wd-typography,
.wd-typography h3 {
  margin-bottom: 0.5em;
  color: #1E1E29;
  font-weight: 600;
  font-size: 24px;
  line-height: 1.35;
}
h4.wd-typography,
.wd-typography h4 {
  margin-bottom: 0.5em;
  color: #1E1E29;
  font-weight: 600;
  font-size: 20px;
  line-height: 1.4;
}
h5.wd-typography,
.wd-typography h5 {
  margin-bottom: 0.5em;
  color: #1E1E29;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.5;
}
.wd-typography + h1.wd-typography,
.wd-typography + h2.wd-typography,
.wd-typography + h3.wd-typography,
.wd-typography + h4.wd-typography,
.wd-typography + h5.wd-typography {
  margin-top: 1.2em;
}
.wd-typography div + h1,
.wd-typography ul + h1,
.wd-typography li + h1,
.wd-typography p + h1,
.wd-typography h1 + h1,
.wd-typography h2 + h1,
.wd-typography h3 + h1,
.wd-typography h4 + h1,
.wd-typography h5 + h1,
.wd-typography div + h2,
.wd-typography ul + h2,
.wd-typography li + h2,
.wd-typography p + h2,
.wd-typography h1 + h2,
.wd-typography h2 + h2,
.wd-typography h3 + h2,
.wd-typography h4 + h2,
.wd-typography h5 + h2,
.wd-typography div + h3,
.wd-typography ul + h3,
.wd-typography li + h3,
.wd-typography p + h3,
.wd-typography h1 + h3,
.wd-typography h2 + h3,
.wd-typography h3 + h3,
.wd-typography h4 + h3,
.wd-typography h5 + h3,
.wd-typography div + h4,
.wd-typography ul + h4,
.wd-typography li + h4,
.wd-typography p + h4,
.wd-typography h1 + h4,
.wd-typography h2 + h4,
.wd-typography h3 + h4,
.wd-typography h4 + h4,
.wd-typography h5 + h4,
.wd-typography div + h5,
.wd-typography ul + h5,
.wd-typography li + h5,
.wd-typography p + h5,
.wd-typography h1 + h5,
.wd-typography h2 + h5,
.wd-typography h3 + h5,
.wd-typography h4 + h5,
.wd-typography h5 + h5 {
  margin-top: 1.2em;
}
a.wd-typography-ellipsis,
span.wd-typography-ellipsis {
  display: inline-block;
  max-width: 100%;
}
a.wd-typography,
.wd-typography a {
  color: #0F3CB7;
  outline: none;
  cursor: pointer;
  transition: color 0.3s;
  text-decoration: none;
}
a.wd-typography:focus,
.wd-typography a:focus,
a.wd-typography:hover,
.wd-typography a:hover {
  color: #2f5cc4;
}
a.wd-typography:active,
.wd-typography a:active {
  color: #042591;
}
a.wd-typography:active,
.wd-typography a:active,
a.wd-typography:hover,
.wd-typography a:hover {
  text-decoration: none;
}
a.wd-typography[disabled],
.wd-typography a[disabled],
a.wd-typography.wd-typography-disabled,
.wd-typography a.wd-typography-disabled {
  color: #C7CBD6;
  cursor: not-allowed;
}
a.wd-typography[disabled]:active,
.wd-typography a[disabled]:active,
a.wd-typography.wd-typography-disabled:active,
.wd-typography a.wd-typography-disabled:active,
a.wd-typography[disabled]:hover,
.wd-typography a[disabled]:hover,
a.wd-typography.wd-typography-disabled:hover,
.wd-typography a.wd-typography-disabled:hover {
  color: #C7CBD6;
}
a.wd-typography[disabled]:active,
.wd-typography a[disabled]:active,
a.wd-typography.wd-typography-disabled:active,
.wd-typography a.wd-typography-disabled:active {
  pointer-events: none;
}
.wd-typography code {
  margin: 0 0.2em;
  padding: 0.2em 0.4em 0.1em;
  font-size: 85%;
  background: rgba(150, 150, 150, 0.1);
  border: 1px solid rgba(100, 100, 100, 0.2);
  border-radius: 3px;
}
.wd-typography kbd {
  margin: 0 0.2em;
  padding: 0.15em 0.4em 0.1em;
  font-size: 90%;
  background: rgba(150, 150, 150, 0.06);
  border: 1px solid rgba(100, 100, 100, 0.2);
  border-bottom-width: 2px;
  border-radius: 3px;
}
.wd-typography mark {
  padding: 0;
  background-color: #ffe58f;
}
.wd-typography u,
.wd-typography ins {
  text-decoration: underline;
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}
.wd-typography s,
.wd-typography del {
  text-decoration: line-through;
}
.wd-typography strong {
  font-weight: 600;
}
.wd-typography-expand,
.wd-typography-edit,
.wd-typography-copy {
  color: #0F3CB7;
  text-decoration: none;
  outline: none;
  cursor: pointer;
  transition: color 0.3s;
  margin-left: 4px;
}
.wd-typography-expand:focus,
.wd-typography-edit:focus,
.wd-typography-copy:focus,
.wd-typography-expand:hover,
.wd-typography-edit:hover,
.wd-typography-copy:hover {
  color: #2f5cc4;
}
.wd-typography-expand:active,
.wd-typography-edit:active,
.wd-typography-copy:active {
  color: #042591;
}
.wd-typography-copy-success,
.wd-typography-copy-success:hover,
.wd-typography-copy-success:focus {
  color: #23BF70;
}
.wd-typography-edit-content {
  position: relative;
}
div.wd-typography-edit-content {
  left: -12px;
  margin-top: -7px;
  margin-bottom: calc(1em - 6px - 1px);
}
.wd-typography-edit-content-confirm {
  position: absolute;
  right: 10px;
  bottom: 8px;
  color: #575E73;
  pointer-events: none;
}
.wd-typography-edit-content textarea {
  /* stylelint-disable-next-line property-no-vendor-prefix */
  -moz-transition: none;
}
.wd-typography ul,
.wd-typography ol {
  margin: 0 0 1em;
  padding: 0;
}
.wd-typography ul li,
.wd-typography ol li {
  margin: 0 0 0 20px;
  padding: 0 0 0 4px;
}
.wd-typography ul {
  list-style-type: circle;
}
.wd-typography ul ul {
  list-style-type: disc;
}
.wd-typography ol {
  list-style-type: decimal;
}
.wd-typography pre,
.wd-typography blockquote {
  margin: 1em 0;
}
.wd-typography pre {
  padding: 0.4em 0.6em;
  white-space: pre-wrap;
  word-wrap: break-word;
  background: rgba(150, 150, 150, 0.1);
  border: 1px solid rgba(100, 100, 100, 0.2);
  border-radius: 3px;
}
.wd-typography pre code {
  display: inline;
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-family: inherit;
  background: transparent;
  border: 0;
}
.wd-typography blockquote {
  padding: 0 0 0 0.6em;
  border-left: 4px solid rgba(100, 100, 100, 0.2);
  opacity: 0.85;
}
.wd-typography-single-line {
  white-space: nowrap;
}
.wd-typography-ellipsis-single-line {
  overflow: hidden;
  text-overflow: ellipsis;
}
a.wd-typography-ellipsis-single-line,
span.wd-typography-ellipsis-single-line {
  vertical-align: bottom;
}
.wd-typography-ellipsis-multiple-line {
  /* stylelint-disable-next-line value-no-vendor-prefix */
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 3;
  /*! autoprefixer: ignore next */
  -webkit-box-orient: vertical;
}
.wd-typography-rtl {
  direction: rtl;
}
.wd-typography-rtl .wd-typography-expand,
.wd-typography-rtl .wd-typography-edit,
.wd-typography-rtl .wd-typography-copy {
  margin-right: 4px;
  margin-left: 0;
}
.wd-typography-rtl .wd-typography-expand {
  float: left;
}
div.wd-typography-edit-content.wd-typography-rtl {
  right: -12px;
  left: auto;
}
.wd-typography-rtl .wd-typography-edit-content-confirm {
  right: auto;
  left: 10px;
}
.wd-typography-rtl.wd-typography ul li,
.wd-typography-rtl.wd-typography ol li {
  margin: 0 20px 0 0;
  padding: 0 4px 0 0;
}