editor-style.css 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491
  1. /*
  2. Theme Name: Twenty Fifteen
  3. Description: Used to style the TinyMCE editor.
  4. */
  5. /**
  6. * Table of Contents:
  7. *
  8. * 1.0 - Body
  9. * 2.0 - Typography
  10. * 3.0 - Elements
  11. * 4.0 - Alignment
  12. * 5.0 - Caption
  13. * 6.0 - Galleries
  14. * 7.0 - Audio / Video
  15. * 8.0 - RTL
  16. */
  17. /**
  18. * 1.0 Body
  19. */
  20. html .mceContentBody {
  21. font-size: 19px;
  22. max-width: 660px;
  23. }
  24. body {
  25. color: #333;
  26. font-family: "Noto Serif", sans-serif;
  27. font-weight: 400;
  28. line-height: 1.6842;
  29. margin: 83px 0 83px 83px;
  30. vertical-align: baseline;
  31. }
  32. /**
  33. * 2.0 Typography
  34. */
  35. h1,
  36. h2,
  37. h3,
  38. h4,
  39. h5,
  40. h6 {
  41. clear: both;
  42. font-weight: 700;
  43. margin: 64px 0 32px;
  44. }
  45. h1 {
  46. font-size: 39px;
  47. line-height: 1.2308;
  48. }
  49. h2 {
  50. font-size: 32px;
  51. line-height: 1.25;
  52. }
  53. h3 {
  54. font-size: 27px;
  55. line-height: 1.1852;
  56. }
  57. h4 {
  58. font-size: 22px;
  59. line-height: 1.4545;
  60. }
  61. h5,
  62. h6 {
  63. font-size: 19px;
  64. letter-spacing: 0.1em;
  65. line-height: 1.2632;
  66. text-transform: uppercase;
  67. }
  68. h1:first-child,
  69. h2:first-child,
  70. h3:first-child,
  71. h4:first-child,
  72. h5:first-child,
  73. h6:first-child {
  74. margin-top: 0;
  75. }
  76. p {
  77. margin: 0 0 32px;
  78. }
  79. b,
  80. strong {
  81. font-weight: 700;
  82. }
  83. dfn,
  84. cite,
  85. em,
  86. i {
  87. font-style: italic;
  88. }
  89. blockquote {
  90. border-left: 4px solid #707070;
  91. color: #707070;
  92. font-size: 22px;
  93. font-style: italic;
  94. line-height: 1.8182;
  95. margin: 0 0 40px -24px;
  96. padding-left: 20px;
  97. }
  98. blockquote > blockquote {
  99. margin-left: 0;
  100. }
  101. blockquote p {
  102. margin-bottom: 40px;
  103. }
  104. blockquote > p:last-child {
  105. margin-bottom: 0;
  106. }
  107. blockquote cite,
  108. blockquote small {
  109. color: #333;
  110. font-size: 19px;
  111. font-family: "Noto Sans", sans-serif;
  112. line-height: 1.6842;
  113. }
  114. blockquote em,
  115. blockquote i,
  116. blockquote cite {
  117. font-style: normal;
  118. }
  119. blockquote strong,
  120. blockquote b {
  121. font-weight: 400;
  122. }
  123. address {
  124. font-style: italic;
  125. margin: 0 0 32px;
  126. }
  127. code,
  128. kbd,
  129. tt,
  130. var,
  131. samp,
  132. pre {
  133. font-family: Inconsolata, monospace;
  134. }
  135. pre {
  136. background-color: #fcfcfc;
  137. border: 1px solid #eaeaea;
  138. font-size: 19px;
  139. line-height: 1.2632;
  140. margin-bottom: 32px;
  141. max-width: 100%;
  142. overflow: auto;
  143. padding: 15px;
  144. white-space: pre;
  145. white-space: pre-wrap;
  146. word-wrap: break-word;
  147. }
  148. abbr[title] {
  149. border-bottom: 1px dotted #eaeaea;
  150. cursor: help;
  151. }
  152. mark,
  153. ins {
  154. background-color: #fff9c0;
  155. text-decoration: none;
  156. }
  157. sup,
  158. sub {
  159. font-size: 75%;
  160. height: 0;
  161. line-height: 0;
  162. position: relative;
  163. vertical-align: baseline;
  164. }
  165. sup {
  166. bottom: 1ex;
  167. }
  168. sub {
  169. top: .5ex;
  170. }
  171. small {
  172. font-size: 75%;
  173. }
  174. big {
  175. font-size: 125%;
  176. }
  177. /**
  178. * 3.0 Elements
  179. */
  180. hr {
  181. background-color: #eaeaea;
  182. border: 0;
  183. height: 1px;
  184. margin-bottom: 32px;
  185. }
  186. ul,
  187. ol {
  188. margin: 0 0 32px 0;
  189. padding: 0;
  190. }
  191. ul {
  192. list-style: disc;
  193. }
  194. ol {
  195. list-style: decimal;
  196. }
  197. li > ul,
  198. li > ol {
  199. margin: 0 0 0 25px;
  200. }
  201. dl {
  202. margin: 0 0 32px;
  203. }
  204. dt {
  205. font-weight: bold;
  206. }
  207. dd {
  208. margin: 0 0 32px;
  209. }
  210. .mce-item-table,
  211. .mce-item-table th,
  212. .mce-item-table td {
  213. border: 1px solid #eaeaea;
  214. }
  215. .mce-item-table a {
  216. color: #333;
  217. }
  218. .mce-item-table {
  219. border-collapse: separate;
  220. border-spacing: 0;
  221. border-width: 1px 0 0 1px;
  222. margin: 0 0 32px;
  223. width: 100%;
  224. }
  225. .mce-item-table th,
  226. .mce-item-table caption {
  227. border-width: 0 1px 1px 0;
  228. font-family: "Noto Serif", sans-serif;
  229. font-size: 19px;
  230. font-weight: 700;
  231. padding: 8px;
  232. text-align: left;
  233. vertical-align: baseline;
  234. }
  235. .mce-item-table td {
  236. border-width: 0 1px 1px 0;
  237. font-family: "Noto Serif", sans-serif;
  238. font-size: 19px;
  239. padding: 8px;
  240. vertical-align: baseline;
  241. }
  242. img {
  243. border: 0;
  244. height: auto;
  245. max-width: 660px;
  246. vertical-align: middle;
  247. }
  248. figure {
  249. margin: 0;
  250. }
  251. del {
  252. opacity: 0.8;
  253. }
  254. a {
  255. border-bottom: 1px solid #333;
  256. color: #333;
  257. text-decoration: none;
  258. }
  259. /**
  260. * 4.0 Alignment
  261. */
  262. .alignleft {
  263. float: left;
  264. margin: 8px 32px 32px 0;
  265. }
  266. .alignright {
  267. float: right;
  268. margin: 8px 0 32px 32px;
  269. }
  270. .aligncenter {
  271. clear: both;
  272. display: block;
  273. margin: 8px auto;
  274. }
  275. /**
  276. * 5.0 Caption
  277. */
  278. .wp-caption {
  279. background: transparent;
  280. border: none;
  281. color: #707070;
  282. font-family: "Noto Sans", sans-serif;
  283. margin: 0 0 32px 0;
  284. max-width: 660px;
  285. padding: 0;
  286. text-align: center;
  287. }
  288. .wp-caption.alignleft {
  289. margin: 8px 32px 8px 0;
  290. }
  291. .wp-caption.alignright {
  292. margin: 8px 0 8px 32px;
  293. }
  294. .wp-caption.aligncenter {
  295. margin: 8px auto;
  296. }
  297. .wp-caption .wp-caption-text,
  298. .wp-caption-dd {
  299. font-size: 16px;
  300. line-height: 1.5;
  301. padding: 8px 0;
  302. }
  303. /**
  304. * 6.0 Galleries
  305. */
  306. .gallery {
  307. margin-bottom: 32px;
  308. }
  309. .gallery-item {
  310. display: inline-block;
  311. padding: 1.79104477%;
  312. text-align: center;
  313. vertical-align: top;
  314. width: 100%;
  315. }
  316. .gallery-columns-2 .gallery-item {
  317. max-width: 50%;
  318. }
  319. .gallery-columns-3 .gallery-item {
  320. max-width: 33.33%;
  321. }
  322. .gallery-columns-4 .gallery-item {
  323. max-width: 25%;
  324. }
  325. .gallery-columns-5 .gallery-item {
  326. max-width: 20%;
  327. }
  328. .gallery-columns-6 .gallery-item {
  329. max-width: 16.66%;
  330. }
  331. .gallery-columns-7 .gallery-item {
  332. max-width: 14.28%;
  333. }
  334. .gallery-columns-8 .gallery-item {
  335. max-width: 12.5%;
  336. }
  337. .gallery-columns-9 .gallery-item {
  338. max-width: 11.11%;
  339. }
  340. .gallery .gallery-caption {
  341. color: #707070;
  342. display: block;
  343. font-family: "Noto Sans", sans-serif;
  344. font-size: 16px;
  345. line-height: 1.5;
  346. padding: 8px 0;
  347. }
  348. .gallery-columns-6 .gallery-caption,
  349. .gallery-columns-7 .gallery-caption,
  350. .gallery-columns-8 .gallery-caption,
  351. .gallery-columns-9 .gallery-caption {
  352. display: none;
  353. }
  354. /**
  355. * 7.0 Audio / Video
  356. */
  357. .mce-content-body .wpview-wrap {
  358. margin-bottom: 32px;
  359. }
  360. .mce-content-body .wp-audio-playlist {
  361. margin: 0;
  362. }
  363. /**
  364. * 8.0 RTL
  365. */
  366. html .mceContentBody.rtl {
  367. direction: rtl;
  368. unicode-bidi: embed;
  369. }
  370. .rtl body {
  371. margin: 83px 83px 83px 0;
  372. }
  373. .rtl blockquote {
  374. border-right: 4px solid #707070;
  375. border-left: none;
  376. margin: 0 -24px 40px 0;
  377. padding-right: 20px;
  378. padding-left: 0;
  379. }
  380. .rtl blockquote > blockquote {
  381. margin-right: 0;
  382. margin-left: auto;
  383. }
  384. .rtl li > ul,
  385. .rtl li > ol {
  386. margin: 0 25px 0 0;
  387. }
  388. .rtl .mce-item-table th,
  389. .rtl .mce-item-table caption {
  390. text-align: right;
  391. }
  392. .rtl .wp-caption.alignright {
  393. margin: 8px 0 8px 32px;
  394. }
  395. .rtl .wp-caption.alignleft {
  396. margin: 8px 32px 8px 0;
  397. }