@charset "UTF-8"; /** * * @authors yutent (yutent@doui.cc) * @date 2017-04-17 16:43:22 * */ @font-face {font-family: "edicon"; src: url('iconfont.eot'); /* IE9*/ src: url('iconfont.ttf') format('truetype'); /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/ } ::-webkit-scrollbar {width:5px;height:5px;background:#ebeeec;} ::-webkit-scrollbar:hover {background:rgba(0,0,0,.05);} ::-webkit-scrollbar-button {display:none;} ::-webkit-scrollbar-thumb {background:#cad5d5;} ::-webkit-scrollbar-thumb:hover {background:#9bacac;} .do-meditor {position:relative;width:100%;height:100%;min-height:180px;padding-top:43px;border:1px solid #ddd;background:#fff;color:#666;} .meditor-font {font-family:"PingFang SC","Helvetica Neue","Hiragino Sans GB","Segoe UI","Microsoft YaHei",sans-serif;} /* 关于编辑器模块*/ .do-meditor-about {width:400px;padding:10px 20px;} .do-meditor-about pre {padding-bottom:15px;line-height:1;} .do-meditor-about a {color:#049789} .do-meditor-about p {margin:0 auto 5px;} /*表格模块*/ .do-meditor-table {width:270px;height:270px;padding:10px;} .do-meditor-table li {width:100%;height:25px;} .do-meditor-table li span {float:left;width:25px;height:25px;border:2px solid #fff;background:#f2f2f2;} .do-meditor-table li span.active {background:rgba(4,151,137,.2);} /*表情模块*/ .do-meditor-face {float:left;;width:241px;height:241px;margin:10px;border-top:1px solid #e2e2e2;border-left:1px solid #e2e2e2;} .do-meditor-face li {float:left;width:40px;height:40px;padding:8px;border:1px solid #e2e2e2;border-top:0;border-left:0} .do-meditor-face li img {width:100%;} .do-meditor-face li:hover img {-webkit-transform:scale(3);-moz-transform:scale(3);-ms-transform:scale(3);transform:scale(3);} /*段落模块*/ .do-meditor-h1 {width:150px;height:auto;padding:5px 0;} .do-meditor-h1 li {width:100%;height:auto;padding:0 10px;line-height:1.5;font-size:18px;cursor:default;} .do-meditor-h1 li:hover {background:#f2f2f2;} .do-meditor-h1 li::before {font-family:"edicon" !important;-webkit-font-smoothing: antialiased;-webkit-text-stroke-width: 0.2px;-moz-osx-font-smoothing: grayscale;} .do-meditor-h1 li.h1 {font-size:23px;} .do-meditor-h1 li.h2 {font-size:21px;} .do-meditor-h1 li.h1::before {content:"\e611 "} .do-meditor-h1 li.h2::before {content:"\e60d "} .do-meditor-h1 li.h3::before {content:"\e60e "} .do-meditor-h1 li.h4::before {content:"\e60f "} .do-meditor-h1 li.h5::before {content:"\e610 "} .do-meditor-h1 li.h6::before {content:"\e60c "} /*通用输入模块, 链接/图片插入/文件插入/代码块插入*/ .do-meditor-common {width:360px;height:auto;padding:15px 20px;} .do-meditor-common section {width:100%;height: 35px;margin:10px 0;line-height:35px;} .do-meditor-common section .label {float: left;width:30%;text-align:center;background:#ddd;} .do-meditor-common section label {float: left;width:50%;} .do-meditor-common section .input {float: left;width:70%;height:35px;padding:0 8px;border:1px solid #ddd;border-left:0;background:#fff;color:#666;} .do-meditor-common section .submit {float:right;width:30%;height:35px;background:#ddd;color:#666;text-align:center;} .do-meditor-codeblock {width:780px;height:auto;padding:15px 20px;background:#fafafa;} .do-meditor-codeblock section {display:block;width:100%;height:auto;margin:10px 0;line-height:35px;} .do-meditor-codeblock section::after {visibility: hidden;overflow:hidden; display: block;height: 0;content: "."; clear: both;} .do-meditor-codeblock section .label {float: left;width:80px;} .do-meditor-codeblock section select {float:left;width:200px;height:35px;border:1px solid #ddd;border-radius:5px;background:#fff} .do-meditor-codeblock section textarea {width:100%;height:300px;padding:5px 10px;border:1px solid #ddd;background:#fff;resize:none;} .do-meditor-codeblock section .submit {float:right;width:80px;height:35px;background:#ddd;color:#666;text-align:center;} .do-meditor .tool-bar {overflow:hidden;position:absolute;top:0;left:0;z-index:99;width:100%;height:43px;padding:5px 10px;border-bottom:1px solid #ddd;background:#f5f5f5;color:#666;} .do-meditor .tool-bar .edicon {display:inline-block;width:30px;height:32px;text-align:center;font:20px/32px "edicon" !important;-webkit-font-smoothing: antialiased;-webkit-text-stroke-width: 0.2px;-moz-osx-font-smoothing: grayscale;} .do-meditor .tool-bar .edicon:hover {background:#e5e5e5;} .do-meditor .tool-bar .icon-pipe {width:20px;} .do-meditor .tool-bar .icon-pipe:hover {background:none;} .do-meditor .tool-bar .icon-pipe::before {content:"\e612"} .do-meditor .tool-bar .icon-h1::before {content:"\e611"} .do-meditor .tool-bar .icon-bold::before {content:"\e615"} .do-meditor .tool-bar .icon-italic::before {content:"\e61d"} .do-meditor .tool-bar .icon-through::before {content:"\e604"} .do-meditor .tool-bar .icon-link::before {content:"\e606"} .do-meditor .tool-bar .icon-inlinecode::before {content:"\e61e"} .do-meditor .tool-bar .icon-blockcode::before {content:"\e617"} .do-meditor .tool-bar .icon-quote::before {content:"\e607"} .do-meditor .tool-bar .icon-hr::before {content:"\e619"} .do-meditor .tool-bar .icon-time::before {content:"\e61a"} .do-meditor .tool-bar .icon-face::before {content:"\e616"} .do-meditor .tool-bar .icon-image::before {content:"\e61b"} .do-meditor .tool-bar .icon-file::before {content:"\e603"} .do-meditor .tool-bar .icon-preview::before {content:"\e60a"} .do-meditor .tool-bar .icon-fullscreen::before {content:"\e608"} .do-meditor .tool-bar .icon-table::before {content:"\e601"} .do-meditor .tool-bar .icon-ordered::before {content:"\e61c"} .do-meditor .tool-bar .icon-unordered::before {content:"\e618"} .do-meditor .tool-bar .icon-about::before {content:"\e613"} .do-meditor .tool-bar .icon-help::before {content:"\e614"} .do-meditor .editor-body {float:left;width:100%;height:100%;background:#fff;} .do-meditor .editor-body>textarea {overflow:hidden;overflow-y:auto;width:100%;height:100%;padding:5px;border:0;outline:none;resize:none;color:#666;background:none;} .do-meditor .md-preview {float:right;overflow:hidden;overflow-y:auto;display:block;width:50%;height:100%;padding:10px;line-height:2;border-left:1px solid #ddd;color:#666;font-size:14px;background:#fff;} .do-meditor .md-preview .md-hd {position:relative;margin:15px 0;padding-left:30px;font-weight:normal;font-size:17px;} .do-meditor .md-preview h1.md-hd {padding-left:0;} .do-meditor .md-preview .md-hd a {position:relative;display:inline-block;padding:0 8px;background:#fff;color:#454545} .do-meditor .md-preview .md-hd a:hover {text-decoration:none;} .do-meditor .md-preview h1.md-hd a {padding-left:0;color:#000;} .do-meditor .md-preview h2.md-hd a {color:#000;} .do-meditor .md-preview h1.md-hd {margin:0 0 30px;font-size:25px;} .do-meditor .md-preview h2.md-hd {margin:20px 0;font-size:23px;} .do-meditor .md-preview h3.md-hd {margin:20px 0 15px;font-size:20px;} .do-meditor .md-preview h1:after {display:block;width:100%;content:" ";border-bottom:1px solid #ddd;} .do-meditor .md-preview h2:before, .do-meditor .md-preview h3:before, .do-meditor .md-preview h4:before, .do-meditor .md-preview h5:before, .do-meditor .md-preview h6:before {display:block;position:absolute;left:0;top:50%;width:100%;content:" ";border-bottom:1px solid #ddd;} .do-meditor .md-preview a {text-decoration:none;} .do-meditor .md-preview a:hover {text-decoration:underline;} .do-meditor .md-preview p {margin:15px 0;} .do-meditor .md-preview blockquote {margin:10px 0;padding:5px 10px;border-left:5px solid #6bb294;background:#f7f7f7} .do-meditor .md-preview blockquote p {margin:0;} .do-meditor .md-preview table thead tr {background:#f2f2f2} .do-meditor .md-preview table thead th {padding:0 8px;border:1px solid #ddd} .do-meditor .md-preview table tbody td {padding:0 8px;border:1px solid #ddd} .do-meditor .md-preview hr {margin:30px 0;border-bottom:0;} .do-meditor .md-preview ol {margin-left:2em;list-style:decimal outside none;} .do-meditor .md-preview ul {margin-left:2em;list-style:disc outside none;} .do-meditor .md-preview li ol {margin-left:2em;} .do-meditor .md-preview li ul {margin-left:2em;list-style-type: circle;} .do-meditor .md-preview li ol ul, .do-meditor .md-preview li ul ul {list-style-type: square;} /*全屏模式*/ .do-meditor.fullscreen {position:fixed;left:0;top:0;z-index:999;} .do-meditor.preview .editor-body, .do-meditor.fullscreen .editor-body {width:50%}