main.css 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401
  1. /* 기본 전체 옵션 */
  2. body, html, video, table, iframe, input, textarea, img, hr, blockquote, pre, iframe, .table_safe {
  3. max-width: 100%;
  4. }
  5. body {
  6. word-break: break-all;
  7. overflow: auto;
  8. font-size: 14px;
  9. }
  10. /* 텍스트 필드 */
  11. textarea, input {
  12. width: 100%;
  13. }
  14. input {
  15. box-sizing: border-box;
  16. }
  17. input[type="checkbox"], input[type="radio"] {
  18. width: auto;
  19. }
  20. /* 테이블 */
  21. table {
  22. overflow-x: scroll;
  23. border-collapse: collapse;
  24. }
  25. td {
  26. border: 0.5px solid gainsboro;
  27. border-width: 0.5px;
  28. padding: 8px 10px;
  29. }
  30. @supports (-webkit-touch-callout: none) {
  31. td {
  32. border: 1px solid gainsboro;
  33. border-width: 1px;
  34. }
  35. }
  36. /* 폴딩 */
  37. details summary {
  38. cursor: pointer;
  39. user-select: none;
  40. display: list-item;
  41. }
  42. /* diff */
  43. .opennamu_diff_green {
  44. background: #eaf2c2;
  45. }
  46. .opennamu_diff_red {
  47. background: #fadad7;
  48. }
  49. /* list */
  50. .opennamu_ul {
  51. padding-left: 20px;
  52. }
  53. .opennamu_ul li {
  54. margin-left: 20px;
  55. margin-top: 5px;
  56. margin-bottom: 5px;
  57. }
  58. /* thread */
  59. .opennamu_comment {
  60. display: inline-table;
  61. width: 100%;
  62. }
  63. .opennamu_comment_color_green {
  64. background: palegreen;
  65. }
  66. .opennamu_comment_color_blue {
  67. background: paleturquoise;
  68. }
  69. .opennamu_comment_color_red {
  70. background: pink;
  71. }
  72. .opennamu_comment_color_default {
  73. background: palegoldenrod;
  74. }
  75. .opennamu_comment_color_gray {
  76. background: gainsboro;
  77. }
  78. .opennamu_comment_blind {
  79. display: none;
  80. }
  81. .opennamu_comment_blind_admin {
  82. background: gainsboro;
  83. }
  84. .opennamu_comment_scroll {
  85. max-height: 500px;
  86. overflow: scroll;
  87. -ms-overflow-style: none;
  88. scrollbar-width: none;
  89. }
  90. .opennamu_comment_scroll::-webkit-scrollbar {
  91. display: none;
  92. }
  93. /* render */
  94. /* - link */
  95. a {
  96. color: dodgerblue;
  97. text-decoration: none;
  98. }
  99. a:hover {
  100. color: darkblue;
  101. }
  102. .opennamu_not_exist_link {
  103. color: red;
  104. }
  105. .opennamu_not_exist_link:hover {
  106. color: darkred;
  107. }
  108. .opennamu_same_link {
  109. font-weight: bold;
  110. }
  111. .opennamu_link_out, .opennamu_link_inter {
  112. color: green;
  113. }
  114. .opennamu_link_out:hover, .opennamu_link_inter:hover {
  115. color: darkgreen;
  116. }
  117. .opennamu_link_out::before {
  118. content: '🅴';
  119. font-weight: lighter;
  120. background: transparent;
  121. }
  122. /* - toc */
  123. .opennamu_TOC {
  124. border: 1px solid gainsboro;
  125. padding: 20px;
  126. width: fit-content;
  127. width: -moz-fit-content;
  128. display: inline-block;
  129. clear: both;
  130. margin-top: 10px;
  131. }
  132. .opennamu_TOC_title {
  133. font-size: 18px;
  134. }
  135. /* - category */
  136. .opennamu_category {
  137. border: 1px solid gainsboro;
  138. padding: 10px;
  139. }
  140. .opennamu_category_blur {
  141. filter: blur(5px);
  142. }
  143. .opennamu_category_blur:hover {
  144. filter: none;
  145. }
  146. /* - footnote */
  147. .opennamu_footnote {
  148. border-top: 1px solid gainsboro;
  149. padding-top: 10px;
  150. margin-top: 10px;
  151. }
  152. pre, #redirect {
  153. border: 1px solid gainsboro;
  154. padding: 10px;
  155. }
  156. pre {
  157. white-space: pre-wrap;
  158. margin: 0;
  159. }
  160. code, pre {
  161. font-family: Consolas, Monaco, monospace;
  162. }
  163. #syntax {
  164. padding: 0;
  165. }
  166. .opennamu_textarea_500 {
  167. height: 500px;
  168. }
  169. .opennamu_textarea_100 {
  170. height: 100px;
  171. }
  172. .opennamu_spead_footnote {
  173. color: #555;
  174. background-color: #efefef;
  175. border: 1px solid #cecece;
  176. font-size: small;
  177. font-weight: initial;
  178. }
  179. .opennamu_popup_footnote {
  180. position: absolute;
  181. z-index: 10000;
  182. max-width: 50%;
  183. padding: 10px;
  184. background-color: #efefef;
  185. border: 1px solid #cecece;
  186. font-size: small;
  187. font-weight: initial;
  188. }
  189. @media ( max-width: 768px ) {
  190. .opennamu_popup_footnote {
  191. max-width: 100%;
  192. }
  193. }
  194. hr {
  195. border: 0;
  196. border-top: 1px solid gainsboro;
  197. }
  198. .opennamu_render_complete {
  199. white-space: pre-wrap;
  200. line-break: anywhere;
  201. display: inline;
  202. }
  203. .opennamu_render_complete img {
  204. vertical-align: middle;
  205. }
  206. blockquote {
  207. padding: 15px 40px 15px 15px;
  208. margin: 0;
  209. display: inline-block;
  210. border: 2px solid #ccc;
  211. border-left: 5px solid black;
  212. background-image: url('/views/main_css/file/quote.png');
  213. background-position: calc(100% - 10px) 10px;
  214. background-repeat: no-repeat;
  215. background-size: 25px;
  216. }
  217. /* 취소선 */
  218. s, strike, del {
  219. color: gray;
  220. }
  221. s:hover, strike:hover, del:hover {
  222. text-decoration: none;
  223. }
  224. /* 최근 변경 관련 테이블 */
  225. #main_table_set {
  226. width: 100%;
  227. text-align: center;
  228. }
  229. #main_table_width {
  230. width: 33.3%;
  231. }
  232. #main_table_width_half {
  233. width: 50%;
  234. }
  235. #main_table_width_quarter {
  236. width: 25%;
  237. }
  238. #main_table_top_tr {
  239. background: gainsboro;
  240. }
  241. .opennamu_history_blind {
  242. background: gainsboro;
  243. }
  244. /* 기타 */
  245. .main_hr {
  246. border: none;
  247. padding-top: 6px;
  248. padding-bottom: 6px;
  249. margin: 0;
  250. }
  251. .change_space {
  252. white-space: pre-line;
  253. }
  254. .katex .base {
  255. max-width: 100%;
  256. overflow-x: hidden;
  257. overflow-y: hidden;
  258. }
  259. .opennamu_width_200 {
  260. width: 200px;
  261. }
  262. .opennamu_list_1 {
  263. list-style: disc;
  264. }
  265. .opennamu_list_2 {
  266. list-style: circle;
  267. }
  268. .opennamu_list_3 {
  269. list-style: square;
  270. }
  271. .opennamu_list_4 {
  272. list-style: none;
  273. }
  274. .opennamu_list_4::before {
  275. display: inline-block;
  276. content: "⬦";
  277. width: 1.2em;
  278. margin-left: -1.2em;
  279. }
  280. .opennamu_list_5 {
  281. list-style: none;
  282. }
  283. .opennamu_list_5::before {
  284. display: inline-block;
  285. content: "⬥";
  286. width: 1.2em;
  287. margin-left: -1.2em;
  288. }
  289. .opennamu_list_none {
  290. list-style: none;
  291. }
  292. /* 이 부분 이하로는 레거시 */
  293. #topic_color {
  294. background: #bbeabb;
  295. }