chowa/es/typography/style/typography.css

UI component library based on React

/**
 * @license chowa v1.1.3
 *
 * Copyright (c) Chowa Techonlogies Co.,Ltd.(http://www.chowa.cn).
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */
.cw-typography {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

.cw-typography-title {
  margin: 28px 0 18px 0;
  padding: 0;
  box-sizing: border-box;
  color: #414a63;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.5px; }

h6.cw-typography-title {
  font-size: 16px; }

h5.cw-typography-title {
  font-size: 18px; }

h4.cw-typography-title {
  font-size: 20px; }

h3.cw-typography-title {
  font-size: 22px; }

h2.cw-typography-title {
  font-size: 24px; }

h1.cw-typography-title {
  font-size: 26px; }

.cw-typography-paragraph {
  margin: 0 0 18px 0;
  padding: 0;
  box-sizing: border-box;
  font-size: 14px;
  color: #616a6e;
  line-height: 1.5; }
  .cw-typography-paragraph b {
    font-weight: 500; }
  .cw-typography-paragraph i {
    font-style: italic; }
  .cw-typography-paragraph a {
    color: #2d8cf0;
    transition: color 0.2s ease-in;
    cursor: pointer;
    text-decoration: none; }
    .cw-typography-paragraph a:hover {
      color: #57a3f3; }

.cw-typography-blockquote {
  margin: 18px 0;
  padding: 8px 0 8px 18px;
  box-sizing: border-box;
  font-size: 14px;
  color: #616a6e;
  line-height: 1.5;
  border-left: 4px solid #e6ecf5; }
  .cw-typography-blockquote .cw-typography-paragraph {
    margin-bottom: 0; }

.cw-typography-inline-code {
  margin: 0;
  padding: 2px 4px;
  box-sizing: border-box;
  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
  border-radius: 3px;
  background-color: #f2f4f5;
  color: #414a63;
  white-space: nowrap;
  font-size: 12px; }

.cw-typography-code {
  margin: 18px 0;
  padding: 18px;
  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
  box-sizing: border-box;
  border-radius: 3px;
  background-color: #f8f8f8;
  overflow: auto; }
  .cw-typography-code code {
    color: black;
    background: none;
    font-size: 14px;
    text-align: left;
    white-space: pre-wrap;
    word-spacing: normal;
    word-break: normal;
    word-wrap: normal;
    line-height: 1.5;
    tab-size: 4;
    hyphens: none; }
  .cw-typography-code code::selection {
    background: #b3d4fc; }
  .cw-typography-code .token.cdata,
  .cw-typography-code .token.comment,
  .cw-typography-code .token.doctype,
  .cw-typography-code .token.prolog {
    color: slategray; }
  .cw-typography-code .token.punctuation {
    color: #999; }
  .cw-typography-code .namespace {
    opacity: 0.7; }
  .cw-typography-code .token.boolean,
  .cw-typography-code .token.constant,
  .cw-typography-code .token.deleted,
  .cw-typography-code .token.number,
  .cw-typography-code .token.property,
  .cw-typography-code .token.symbol,
  .cw-typography-code .token.tag {
    color: #905; }
  .cw-typography-code .token.attr-name,
  .cw-typography-code .token.builtin,
  .cw-typography-code .token.char,
  .cw-typography-code .token.inserted,
  .cw-typography-code .token.selector,
  .cw-typography-code .token.string {
    color: #690; }
  .cw-typography-code .language-css .token.string,
  .cw-typography-code .style .token.string,
  .cw-typography-code .token.entity,
  .cw-typography-code .token.operator,
  .cw-typography-code .token.url {
    color: #9a6e3a;
    background: rgba(255, 255, 255, 0.5); }
  .cw-typography-code .token.atrule,
  .cw-typography-code .token.attr-value,
  .cw-typography-code .token.keyword {
    color: #07a; }
  .cw-typography-code .token.class-name,
  .cw-typography-code .token.function {
    color: #dd4a68; }
  .cw-typography-code .token.important,
  .cw-typography-code .token.regex,
  .cw-typography-code .token.variable {
    color: #e90; }
  .cw-typography-code .token.bold,
  .cw-typography-code .token.important {
    font-weight: bold; }
  .cw-typography-code .token.italic {
    font-style: italic; }
  .cw-typography-code .token.entity {
    cursor: help; }

.cw-typography-list {
  margin: 18px 0;
  padding: 0;
  box-sizing: border-box;
  list-style: none; }
  .cw-typography-list > li {
    margin: 0;
    padding: 0 0 0 26px;
    position: relative;
    line-height: 1.5;
    font-size: 14px;
    color: #616a6e; }
    .cw-typography-list > li:before {
      position: absolute;
      display: block;
      content: '';
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background-color: #888da8;
      top: 7.5px;
      left: 10px; }
    .cw-typography-list > li > .cw-typography-list {
      margin: 0; }
    .cw-typography-list > li + li {
      margin-top: 6px; }
  .cw-typography-list .cw-typography-paragraph {
    margin-bottom: 0; }