index.css 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187
  1. @import url("../static/css/bootstrap.min.css");
  2. @import url("editor.css");
  3. #pageContainer>.panel-default {
  4. margin:0;
  5. }
  6. #srcText {
  7. height: 150px;
  8. }
  9. #rstCode {
  10. height: 330px;
  11. width: 100%;
  12. border:none;
  13. padding: 5px;
  14. resize:vertical;
  15. background:#000;
  16. color:#fff;
  17. }
  18. #rstCode::selection {
  19. background: #faf2cc ;
  20. }
  21. .ui-ml-05 {
  22. margin-left: 5px;
  23. }
  24. .x-preview {
  25. height: auto;
  26. word-break: break-all;
  27. white-space: pre-wrap;
  28. }
  29. .x-xdemo,.x-switch {
  30. margin-left: 30px;
  31. font-size: 12px;
  32. color: blue;
  33. cursor: pointer;
  34. text-decoration: underline;
  35. }
  36. .x-xdemo:hover,.x-switch:hover {
  37. color: #cc8841;
  38. }
  39. .x-switch {
  40. color:#f00;
  41. border-bottom: 1px solid #f00;
  42. }
  43. .tbl-editor {
  44. position: fixed;
  45. top: 0;
  46. left: 0;
  47. right: 0;
  48. bottom: 0;
  49. width: 100%;
  50. background: #fff;
  51. }
  52. #title {
  53. width: 320px;
  54. padding: 0 5px;
  55. height: 24px;
  56. }
  57. .mod-toolbar {
  58. position: absolute;
  59. left: 0px;
  60. right: 0px;
  61. top: 46px;
  62. background: #f9f9f9;
  63. border: 1px solid #ddd;
  64. }
  65. .mod-editor, .markdown-body{
  66. position: absolute;
  67. top: 87px;
  68. bottom: 0;
  69. }
  70. .mod-editor {
  71. overflow: auto;
  72. font-size: 14px;
  73. left: 0;
  74. right: 50%;
  75. }
  76. .CodeMirror-scroll {
  77. height: 100%;
  78. min-height: 100%;
  79. }
  80. .markdown-body {
  81. overflow: auto;
  82. padding: 10px;
  83. padding-left: 20px;
  84. left: 50%;
  85. right: 0;
  86. box-shadow: inset 1px -5px 10px #ddd
  87. }
  88. .blog-aside {
  89. position: fixed;
  90. top: 50px;
  91. left: 0;
  92. right: 0;
  93. bottom: 0;
  94. z-index: 100;
  95. padding: 20px;
  96. background: rgba(0, 0, 0, .5);
  97. border: 1px solid #ddd;
  98. font-size: 14px;
  99. }
  100. .as-container {
  101. background: #f1f1f1;
  102. width: 800px;
  103. margin: 50px auto 0;
  104. padding: 20px;
  105. border-radius: 6px;
  106. position: relative;
  107. }
  108. fieldset {
  109. padding: 0px 10px 5px;
  110. border: 1px solid #ccc;
  111. line-height: 28px;
  112. }
  113. .as-item {
  114. margin: 0 0 5px;
  115. position: relative;
  116. }
  117. .mod-pageheader, #editor, .mod-footer {
  118. display: none;
  119. }
  120. .mod-markdown.preview-closed .markdown-body {
  121. display:none;
  122. }
  123. .mod-markdown.preview-closed .mod-editor {
  124. right:0;
  125. }
  126. .mod-markdown.mode-h2m .editor-toolbar .x-mask {
  127. position: absolute;
  128. top:0;
  129. left:0;
  130. right:0;
  131. bottom:0;
  132. background: #eee;
  133. opacity: 0.3;
  134. width: 356px;
  135. }
  136. .mod-markdown.mode-h2m textarea {
  137. position: absolute;
  138. top: 0;
  139. left: 0;
  140. right: 0;
  141. bottom: 0;
  142. width: 100%;
  143. resize: none;
  144. border: none;
  145. background: transparent;
  146. outline: none;
  147. font-size: 14px;
  148. padding: 15px;
  149. }
  150. .mod-markdown.mode-h2m .icon-bold,
  151. .mod-markdown.mode-h2m .icon-italic,
  152. .mod-markdown.mode-h2m .icon-quote,
  153. .mod-markdown.mode-h2m .icon-unordered-list,
  154. .mod-markdown.mode-h2m .icon-ordered-list,
  155. .mod-markdown.mode-h2m .icon-link,
  156. .mod-markdown.mode-h2m .icon-image,
  157. .mod-markdown.mode-h2m .icon-play,
  158. .mod-markdown.mode-h2m .icon-music,
  159. .mod-markdown.mode-h2m .icon-contract,
  160. .mod-markdown.mode-h2m .icon-fullscreen,
  161. .mod-markdown.mode-h2m .icon-question,
  162. .mod-markdown.mode-h2m .icon-info,
  163. .mod-markdown.mode-h2m .icon-undo,
  164. .mod-markdown.mode-h2m .icon-redo,
  165. .mod-markdown.mode-h2m .icon-code,
  166. .mod-markdown.mode-h2m .icon-preview {
  167. opacity: 0.2;
  168. }