wcui/src/css/marked.scss

@charset "UTF-8";
/**
 * 
 * @authors yutent (yutent@doui.cc)
 * @date    2017-09-29 00:05:45
 * @version $Id$
 */
@import "var.scss";

.do-marked-theme, 
.do-marked-theme-gfm,
.do-marked-theme-vue {position:relative;line-height:1.5;font-size:13px;color:nth($cd, 1);

  a {text-decoration:underline;color:nth($cb, 2)}
  a:hover {color:nth($cb, 1);text-decoration:none;}
  em {color:nth($cgr, 3);}
  strong {color:nth($cd, 3);}
  em,strong,del {padding:0 3px;}
  p {margin:15px 0;}
  img {max-width:100%;}

  blockquote {
    &.md-quote {margin:10px 0;padding:5px 10px;border-left:5px solid nth($cp, 3);background:nth($cp, 1);color:nth($cgr, 1);

      p {margin:0;}
    }
  }


  /* 提醒文本 */
  .md-warn,.md-mark {display:inline-block;position:relative;min-height:35px;margin:3px 0;padding:3px 8px 3px 35px;line-height:27px;border:1px solid nth($co, 2);border-radius:5px;background:#fffbed;color:nth($co, 3);word-break: break-all;

    p {margin:0!important;}
    i {position:absolute;left:8px;top:6px;line-height:1;font-size:20px;color:nth($cr, 2);}
  }
  .md-mark {border-color:nth($ct, 1);color:nth($ct, 3);background:#edfbf8;
    i {color:nth($ct, 3);}
  }
  .md-task {position:relative;display:inline-block;width:auto;height:30px;padding-right:10px;line-height:30px;text-align:center;cursor:default;

    &__box {float:left;width:18px;height:18px;margin:6px;margin-left:0;line-height:1;border:1px solid nth($cgr, 1);border-radius:3px;font-size:16px;text-align:center;}
    &.done {
      .md-task__box {color:nth($cgr, 1);border-color:nth($cp, 3);background:nth($cp, 3);}
      .md-task__text {color:nth($cgr, 1);text-decoration:line-through;}
    }
  }

  hr {height:1px;margin:30px 0;line-height:1px;border:0;color:nth($cgr, 1);background-color:nth($cgr, 1);}
  ol {margin-left:1em;list-style:decimal outside none;}
  ul {margin-left:1em;list-style:disc outside none;}
  li {margin:.5em 0;}
  li ol {margin-left:1em;}
  li ul {margin-left:1em;list-style-type: circle;}
  li ol ul,
  li ul ul {list-style-type: square;}

}

.do-marked-theme {

  h1,h2,h3,h4,h5,h6 {position:relative;margin:15px 0;padding-left:30px;font-weight:normal;font-size:16px;
    
    span {position:relative;display:inline-block;padding:0 8px;background:#fff;color:nth($cd, 3);}
    a {padding:0 3px;font-weight:bold;text-decoration:none;}
    a:hover {transform:scale(1.2)}
  }
  h1 {margin:0 0 30px;padding-left:0;font-size:24px;

    &:after {display:block;width:100%;content:"";border-bottom:1px solid nth($cp, 3);}
    span {padding-left:0;}
  }
  h2,h3,h4,h5,h6 {
    &:before {display:block;position:absolute;left:0;top:50%;width:100%;content:"";border-bottom:1px solid nth($cp, 3);}
  }
  h2 {margin:20px 0;font-size:22px;}
  h3 {margin:20px 0 15px;font-size:20px;}
  h4 {font-size:18px;}

  
  
  table {width:100%;line-height:25px;
    thead tr {height:45px;background:nth($cp, 1)}
    thead th {padding:10px 8px;border:0;}
    tbody tr {height:auto;@include ts(all, .3s);
      &:hover {background:#fbfbfb;}
    }
    tbody td {padding:9px 8px;border-bottom:1px solid nth($cp, 1)}
  }

 
}

.do-marked-theme-gfm,
.do-marked-theme-vue {

  h1,h2,h3,h4,h5,h6 {position:relative;margin:15px 0;font-weight:normal;font-size:16px;
    
    span {position:relative;display:inline-block;padding:0 5px;color:nth($cd, 3);}
    a {visibility:hidden;position:absolute;left:-25px;width:25px;padding:0 3px;font-weight:bold;text-decoration:none;text-align:center;}
    &:hover a {visibility:visible;}
    &:after {display:block;width:100%;content:"";border-bottom:1px solid nth($cp, 3);}
  }
  h1 {margin:0 0 30px;font-size:24px;}
  h2 {margin:20px 0;font-size:22px;}
  h3 {margin:20px 0 15px;font-size:20px;}
  h4 {font-size:18px;}

  table {overflow:auto;width:100%;border-spacing:0;border-collapse:collapse;

    tr {border-top:1px solid #ccc;background-color: #fff;}
    th, td {padding:6px 13px;border:1px solid #ddd;}
    th {font-weight:bold;}
    tr:nth-child(2n) {background-color:#fbfbfb;}
  }
}

.do-marked-theme-gfm {color:nth($cd, 3);

  blockquote {
    &.md-quote {background:none;

    }
  }


  .do-ui-blockcode,.do-ui-inlinecode {border:1px solid nth($cp, 3)}
  .do-ui-inlinecode {color:inherit;}

}



.do-marked-theme-vue {

  a {color:nth($ct, 2)}
  a:hover {color:nth($ct, 1);}

  blockquote {
    &.md-quote {border-color:nth($ct, 1);background:#f2faf7;

    }
  }

  h1,h2,h3,h4,h5,h6 {font-weight:bold;
    span {color:inherit;}
    &:after {display:none;}
  }


  table {display:table;
    thead tr {background:nth($cp, 1)}
  }

  .do-ui-blockcode,.do-ui-inlinecode {}
  .do-ui-inlinecode {color:nth($co, 3);}

}