diff --git a/source files/theme.css b/source files/theme.css index f0dc492..22afbc6 100644 --- a/source files/theme.css +++ b/source files/theme.css @@ -4,27 +4,32 @@ border: 1px solid #ddd; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; - padding: 10px + padding: 10px; } + .CodeMirror-scroll { - min-height: 300px; + min-height: 300px } + :-webkit-full-screen { background: #f9f9f5; padding: .5em 1em; width: 100%; - height: 100% + height: 100%; } + :-moz-full-screen { padding: .5em 1em; background: #f9f9f5; width: 100%; - height: 100% + height: 100%; } + .editor-wrapper { font: 16px/1.62 "Helvetica Neue", "Xin Gothic", "Hiragino Sans GB", "WenQuanYi Micro Hei", "Microsoft YaHei", sans-serif; - color: #2c3e50 + color: #2c3e50; } + .editor-wrapper input.title { font: 18px "Helvetica Neue", "Xin Gothic", "Hiragino Sans GB", "WenQuanYi Micro Hei", "Microsoft YaHei", sans-serif; background: 0 0; @@ -32,8 +37,9 @@ width: 100%; border: none; outline: 0; - opacity: .6 + opacity: .6; } + .editor-toolbar { position: relative; opacity: .6; @@ -47,25 +53,27 @@ border-left: 1px solid #bbb; border-right: 1px solid #bbb; border-top-left-radius: 4px; - border-top-right-radius: 4px + border-top-right-radius: 4px; } -.editor-toolbar:after, -.editor-toolbar:before { + +.editor-toolbar:after, .editor-toolbar:before { display: block; content: ' '; - height: 1px + height: 1px; } + .editor-toolbar:before { margin-bottom: 8px } + .editor-toolbar:after { margin-top: 8px } -.editor-toolbar:hover, -.editor-wrapper input.title:focus, -.editor-wrapper input.title:hover { + +.editor-toolbar:hover, .editor-wrapper input.title:focus, .editor-wrapper input.title:hover { opacity: .8 } + .editor-toolbar a { display: inline-block; text-align: center; @@ -76,16 +84,18 @@ margin: 0; border: 1px solid transparent; border-radius: 3px; - cursor: pointer + cursor: pointer; } -.editor-toolbar a.active, -.editor-toolbar a:hover { + +.editor-toolbar a.active, .editor-toolbar a:hover { background: #fcfcfc; - border-color: #95a5a6 + border-color: #95a5a6; } + .editor-toolbar a:before { line-height: 30px } + .editor-toolbar i.separator { display: inline-block; width: 0; @@ -93,34 +103,41 @@ border-right: 1px solid #fff; color: transparent; text-indent: -10px; - margin: 0 6px + margin: 0 6px; } + .editor-toolbar a.icon-fullscreen { position: absolute; - right: 10px + right: 10px; } -.editor-toolbar.disabled-for-preview a:not(.fa-eye){ - pointer-events:none; - background:#fff; - border:none; + +.editor-toolbar.disabled-for-preview a:not(.fa-eye) { + pointer-events: none; + background: #fff; + border: none; } + .editor-statusbar { padding: 8px 10px; font-size: 12px; color: #959694; - text-align: right + text-align: right; } + .editor-statusbar span { display: inline-block; min-width: 4em; - margin-left: 1em + margin-left: 1em; } + .editor-statusbar .lines:before { content: 'lines: ' } + .editor-statusbar .words:before { content: 'words: ' } + .editor-preview { padding: 10px; position: absolute; @@ -131,133 +148,172 @@ background: #fafafa; z-index: 9999; overflow: auto; - display: none + display: none; } + .editor-preview-active { display: block } + .editor-preview>p { margin-top: 0 } + .editor-preview pre { background: #eee; - margin-bottom: 10px + margin-bottom: 10px; +} + +.editor-preview table td, table th { + border: 1px solid #ddd; + padding: 5px; } + .CodeMirror-scroll { overflow: auto } + .CodeMirror-lines { padding: 4px 0 } + .CodeMirror pre { padding: 0 4px } + .CodeMirror-scrollbar-filler { background-color: #fff } + .CodeMirror div.CodeMirror-cursor { border-left: 1px solid #000; - z-index: 3 + z-index: 3; } + .CodeMirror div.CodeMirror-secondarycursor { border-left: 1px solid silver } + .CodeMirror.cm-keymap-fat-cursor div.CodeMirror-cursor { width: auto; border: 0; background: #7e7; - z-index: 1 + z-index: 1; } + .cm-s-paper .cm-keyword { color: #555 } -.cm-s-paper .cm-atom, -.cm-s-paper .cm-number { + +.cm-s-paper .cm-atom, .cm-s-paper .cm-number { color: #7f8c8d } + .cm-s-paper .cm-def { color: #00f } + .cm-s-paper .cm-variable { color: #000 } + .cm-s-paper .cm-variable-2 { color: #555 } + .cm-s-paper .cm-variable-3 { color: #085 } -.cm-s-paper .cm-operator, -.cm-s-paper .cm-property { + +.cm-s-paper .cm-operator, .cm-s-paper .cm-property { color: #000 } + .cm-s-paper .cm-comment { color: #959595 } + .cm-s-paper .cm-string { color: #7f8c8d } + .cm-s-paper .cm-string-2 { color: #f50 } + .cm-s-paper .cm-meta { color: #555 } + .cm-s-paper .cm-error { color: red } -.cm-s-paper .cm-builtin, -.cm-s-paper .cm-qualifier { + +.cm-s-paper .cm-builtin, .cm-s-paper .cm-qualifier { color: #555 } + .cm-s-paper .cm-bracket { color: #997 } -.cm-s-paper .cm-attribute, -.cm-s-paper .cm-tag { + +.cm-s-paper .cm-attribute, .cm-s-paper .cm-tag { color: #7f8c8d } + .cm-s-paper .cm-header { color: #000 } + .cm-s-paper .cm-quote { color: #888 } + .cm-s-paper .cm-hr { color: #999 } + .cm-s-paper .cm-link { color: #7f8c8d } + .cm-negative { color: #d44 } + .cm-positive { color: #292 } -.cm-header, -.cm-strong { + +.cm-header, .cm-strong { font-weight: 700 } + .cm-em { font-style: italic } + .cm-link { text-decoration: underline } + .cm-invalidchar { color: red } + div.CodeMirror span.CodeMirror-matchingbracket { color: #0f0 } + div.CodeMirror span.CodeMirror-nonmatchingbracket { color: #f22 } + .CodeMirror { position: relative; - overflow: hidden + overflow: hidden; } + .CodeMirror-scroll { margin-bottom: -30px; margin-right: -30px; @@ -266,38 +322,43 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket { height: 100%; min-height: 300px; outline: 0; - position: relative + position: relative; } + .CodeMirror-sizer { position: relative } -.CodeMirror-hscrollbar, -.CodeMirror-scrollbar-filler, -.CodeMirror-vscrollbar { + +.CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-vscrollbar { position: absolute; z-index: 6; - display: none + display: none; } + .CodeMirror-vscrollbar { right: 0; top: 0; overflow-x: hidden; - overflow-y: scroll + overflow-y: scroll; } + .CodeMirror-hscrollbar { bottom: 0; left: 0; overflow-y: hidden; - overflow-x: scroll + overflow-x: scroll; } + .CodeMirror-scrollbar-filler { right: 0; bottom: 0; - z-index: 6 + z-index: 6; } + .CodeMirror-lines { cursor: text } + .CodeMirror pre { -moz-border-radius: 0; -webkit-border-radius: 0; @@ -314,83 +375,101 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket { color: inherit; z-index: 2; position: relative; - overflow: visible + overflow: visible; } + .CodeMirror-wrap pre { word-wrap: break-word; white-space: pre-wrap; - word-break: normal + word-break: normal; } + .CodeMirror-linebackground { position: absolute; left: 0; right: 0; top: 0; bottom: 0; - z-index: 0 + z-index: 0; } + .CodeMirror-linewidget { position: relative; z-index: 2; - overflow: auto + overflow: auto; } + .CodeMirror-widget { display: inline-block } + .CodeMirror-wrap .CodeMirror-scroll { overflow-x: hidden } + .CodeMirror-measure { position: absolute; width: 100%; height: 0; overflow: hidden; - visibility: hidden + visibility: hidden; } + .CodeMirror-measure pre { position: static } + .CodeMirror div.CodeMirror-cursor { position: absolute; visibility: hidden; border-right: none; - width: 0 + width: 0; } + .CodeMirror-focused div.CodeMirror-cursor { visibility: visible } + .CodeMirror-selected { background: #d9d9d9 } + .CodeMirror-focused .CodeMirror-selected { background: #BDC3C7 } + .cm-searching { background: #ffa; - background: rgba(255, 255, 0, .4) + background: rgba(255, 255, 0, .4); } + @media print { .CodeMirror div.CodeMirror-cursor { visibility: hidden } } + .CodeMirror .CodeMirror-code .cm-header-1 { font-size: 200%; - line-height: 200% + line-height: 200%; } + .CodeMirror .CodeMirror-code .cm-header-2 { font-size: 160%; - line-height: 160% + line-height: 160%; } + .CodeMirror .CodeMirror-code .cm-header-3 { font-size: 125%; - line-height: 125% + line-height: 125%; } + .CodeMirror .CodeMirror-code .cm-header-4 { font-size: 110%; - line-height: 110% + line-height: 110%; } + .CodeMirror .CodeMirror-code .cm-comment { background: #eee; - border-radius: 2px + border-radius: 2px; } \ No newline at end of file