balmet.com

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs

editor-style.css (10310B)


      1 /*
      2 Theme Name: Appside
      3 Description: Used to style the TinyMCE editor.
      4 */
      5 
      6 
      7 /**
      8  * Table of Contents:
      9  *
     10  * 1.0 - Body
     11  * 2.0 - Typography
     12  * 3.0 - Elements
     13  * 4.0 - Alignment
     14  * 5.0 - Caption
     15  * 6.0 - Galleries
     16  * 7.0 - Media Elements
     17  * 8.0 - RTL
     18  */
     19 
     20 /**
     21  * 1.0 - Body
     22  */
     23 
     24 body {
     25     background-color: #fff;
     26     color: #333;
     27     margin: 20px 40px;
     28     max-width: 580px;
     29 }
     30 
     31 /**
     32  * 2.0 - Typography
     33  */
     34 
     35 body,
     36 button,
     37 input,
     38 select,
     39 textarea {
     40     font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
     41     font-size: 16px;
     42     font-size: 1rem;
     43     font-weight: 400;
     44     line-height: 1.66;
     45 }
     46 
     47 h1,
     48 h2,
     49 h3,
     50 h4,
     51 h5,
     52 h6 {
     53     clear: both;
     54     line-height: 1.4;
     55     margin: 0 0 0.75em;
     56     padding: 1.5em 0 0;
     57 }
     58 
     59 h1:first-child,
     60 h2:first-child,
     61 h3:first-child,
     62 h4:first-child,
     63 h5:first-child,
     64 h6:first-child {
     65     padding-top: 0;
     66 }
     67 
     68 h1 {
     69     font-size: 24px;
     70     font-size: 1.5rem;
     71     font-weight: 300;
     72 }
     73 
     74 h2 {
     75     color: #666;
     76     font-size: 20px;
     77     font-size: 1.25rem;
     78     font-weight: 300;
     79 }
     80 
     81 h3 {
     82     color: #333;
     83     font-size: 18px;
     84     font-size: 1.125rem;
     85     font-weight: 300;
     86 }
     87 
     88 h4 {
     89     color: #333;
     90     font-size: 16px;
     91     font-size: 1rem;
     92     font-weight: 800;
     93 }
     94 
     95 h5 {
     96     color: #767676;
     97     font-size: 13px;
     98     font-size: 0.8125rem;
     99     font-weight: 800;
    100     letter-spacing: 0.15em;
    101     text-transform: uppercase;
    102 }
    103 
    104 h6 {
    105     color: #333;
    106     font-size: 15px;
    107     font-size: 0.9375rem;
    108     font-weight: 800;
    109 }
    110 
    111 p {
    112     margin: 0 0 1.5em;
    113     padding: 0;
    114 }
    115 
    116 dfn,
    117 cite,
    118 em,
    119 i {
    120     font-style: italic;
    121 }
    122 
    123 blockquote {
    124     color: #666;
    125     font-size: 18px;
    126     font-size: 1.125rem;
    127     font-style: italic;
    128     line-height: 1.7;
    129     margin: 0;
    130     overflow: hidden;
    131     padding: 0;
    132 }
    133 
    134 blockquote.alignleft,
    135 blockquote.alignright {
    136     font-size: 14px;
    137     font-size: 0.875rem;
    138     width: 34%;
    139 }
    140 
    141 address {
    142     margin: 0 0 1.5em;
    143 }
    144 
    145 pre {
    146     background: #eee;
    147     font-family: "Courier 10 Pitch", Courier, monospace;
    148     font-size: 15px;
    149     font-size: 0.9375rem;
    150     line-height: 1.6;
    151     margin-bottom: 1.6em;
    152     max-width: 100%;
    153     overflow: auto;
    154     padding: 1.6em;
    155 }
    156 
    157 code,
    158 kbd,
    159 tt,
    160 var {
    161     font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
    162     font-size: 15px;
    163     font-size: 0.9375rem;
    164 }
    165 
    166 abbr,
    167 acronym {
    168     border-bottom: 1px dotted #666;
    169     cursor: help;
    170 }
    171 
    172 mark,
    173 ins {
    174     background: #eee;
    175     text-decoration: none;
    176 }
    177 
    178 big {
    179     font-size: 125%;
    180 }
    181 
    182 blockquote,
    183 q {
    184     quotes: "" "";
    185 }
    186 
    187 blockquote:before,
    188 blockquote:after,
    189 q:before,
    190 q:after {
    191     content: "";
    192 }
    193 
    194 /* Typography for Thai Font */
    195 
    196 html[lang="th"] h1,
    197 html[lang="th"] h2,
    198 html[lang="th"] h3,
    199 html[lang="th"] h4,
    200 html[lang="th"] h5,
    201 html[lang="th"] h6 {
    202     letter-spacing: 0;
    203     line-height: 1.65;
    204 }
    205 
    206 html[lang="th"] body,
    207 html[lang="th"] button,
    208 html[lang="th"] input,
    209 html[lang="th"] select,
    210 html[lang="th"] textarea {
    211     line-height: 1.8;
    212 }
    213 
    214 /**
    215  * 3.0 - Elements
    216  */
    217 
    218 hr {
    219     background-color: #bbb;
    220     border: 0;
    221     height: 1px;
    222     margin-bottom: 1.5em;
    223 }
    224 
    225 ul,
    226 ol {
    227     margin: 0 0 1.5em;
    228     padding: 0;
    229 }
    230 
    231 ul {
    232     list-style: disc;
    233 }
    234 
    235 ol {
    236     counter-reset: item;
    237 }
    238 
    239 ol > li {
    240     display: block;
    241     position: relative;
    242 }
    243 
    244 ol > li:before {
    245     content: counter(item);
    246     counter-increment: item;
    247     font-weight: 800;
    248     left: -1.5em;
    249     position: absolute;
    250 }
    251 
    252 li > ul,
    253 li > ol {
    254     margin-bottom: 0;
    255     margin-left: 1.5em;
    256 }
    257 
    258 dt {
    259     font-weight: 700;
    260 }
    261 
    262 dd {
    263     margin: 0 1.5em 1.5em;
    264 }
    265 
    266 table {
    267     border-collapse: collapse;
    268     margin: 0 0 1.5em;
    269     width: 100%;
    270 }
    271 
    272 thead th {
    273     border-bottom: 2px solid #bbb;
    274     padding-bottom: 0.5em;
    275 }
    276 
    277 th {
    278     padding: 0.4em;
    279     text-align: left;
    280 }
    281 
    282 tr {
    283     border-bottom: 1px solid #eee;
    284 }
    285 
    286 td {
    287     padding: 0.4em;
    288 }
    289 
    290 th:first-child,
    291 td:first-child {
    292     padding-left: 0;
    293 }
    294 
    295 th:last-child,
    296 td:last-child {
    297     padding-right: 0;
    298 }
    299 
    300 a {
    301     -webkit-box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1);
    302     box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1);
    303     color: #222;
    304     text-decoration: none;
    305     -webkit-transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
    306     transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
    307     transition: color 80ms ease-in, box-shadow 130ms ease-in-out;
    308     transition: color 80ms ease-in, box-shadow 130ms ease-in-out, -webkit-box-shadow 130ms ease-in-out;
    309 }
    310 
    311 a:focus {
    312     outline: thin dotted;
    313 }
    314 
    315 a:hover,
    316 a:focus {
    317     color: #000;
    318     -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1);
    319     box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1);
    320 }
    321 
    322 /* Fixes linked images */
    323 
    324 a img {
    325     background: #fff;
    326     -webkit-box-shadow: 0 0 0 6px #fff;
    327     box-shadow: 0 0 0 6px #fff;
    328 }
    329 
    330 /**
    331  * 4.0 - Alignment
    332  */
    333 
    334 img {
    335     height: auto; /* Make sure images are scaled correctly. */
    336     width: inherit;  /* Make images fill their parent's space. Solves IE8. */
    337     max-width: 100%; /* Adhere to container width. */
    338 }
    339 
    340 embed,
    341 iframe,
    342 object {
    343     margin-bottom: 1.5em;
    344     max-width: 100%;
    345 }
    346 
    347 /**
    348  * 5.0 - Caption
    349  */
    350 
    351 .wp-caption {
    352     color: #666;
    353     font-size: 13px;
    354     font-size: 0.8125rem;
    355     font-style: italic;
    356     margin-bottom: 1.5em;
    357     max-width: 100%;
    358 }
    359 
    360 .wp-caption img[class*="wp-image-"] {
    361     display: block;
    362     margin-left: auto;
    363     margin-right: auto;
    364 }
    365 
    366 .wp-caption .wp-caption-text {
    367     margin: 0.8075em 0;
    368 }
    369 
    370 /**
    371  * 6.0 - Galleries
    372  */
    373 
    374 .gallery {
    375     margin-bottom: 1.5em;
    376 }
    377 
    378 .gallery-item {
    379     display: inline-block;
    380     text-align: center;
    381     vertical-align: top;
    382     width: 100%;
    383 }
    384 
    385 .gallery-item a,
    386 .gallery-item a:hover,
    387 .gallery-item a:focus {
    388     -webkit-box-shadow: none;
    389     box-shadow: none;
    390     background: none;
    391     display: inline-block;
    392 }
    393 
    394 .gallery-columns-2 .gallery-item {
    395     max-width: 50%;
    396 }
    397 
    398 .gallery-columns-3 .gallery-item {
    399     max-width: 33.33%;
    400 }
    401 
    402 .gallery-columns-4 .gallery-item {
    403     max-width: 25%;
    404 }
    405 
    406 .gallery-columns-5 .gallery-item {
    407     max-width: 20%;
    408 }
    409 
    410 .gallery-columns-6 .gallery-item {
    411     max-width: 16.66%;
    412 }
    413 
    414 .gallery-columns-7 .gallery-item {
    415     max-width: 14.28%;
    416 }
    417 
    418 .gallery-columns-8 .gallery-item {
    419     max-width: 12.5%;
    420 }
    421 
    422 .gallery-columns-9 .gallery-item {
    423     max-width: 11.11%;
    424 }
    425 
    426 .gallery-caption {
    427     display: block;
    428 }
    429 
    430 /**
    431  * 7.0 - Media Elements
    432  */
    433 
    434 .mejs-container {
    435     margin-bottom: 1.5em;
    436 }
    437 
    438 /* Audio Player */
    439 
    440 .mejs-controls a.mejs-horizontal-volume-slider,
    441 .mejs-controls a.mejs-horizontal-volume-slider:focus,
    442 .mejs-controls a.mejs-horizontal-volume-slider:hover {
    443     background: transparent;
    444     border: 0;
    445 }
    446 
    447 /* Playlist Color Overrides: Light */
    448 
    449 .wp-playlist-light {
    450     border-color: #eee;
    451     color: #222;
    452 }
    453 
    454 .wp-playlist-light .wp-playlist-current-item .wp-playlist-item-album {
    455     color: #333;
    456 }
    457 
    458 .wp-playlist-light .wp-playlist-current-item .wp-playlist-item-artist {
    459     color: #767676;
    460 }
    461 
    462 .wp-playlist-light .wp-playlist-item {
    463     border-bottom: 1px dotted #eee;
    464     -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
    465     transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
    466 }
    467 
    468 .wp-playlist-light .wp-playlist-item:hover,
    469 .wp-playlist-light .wp-playlist-item:focus {
    470     border-bottom-color: rgba(0, 0, 0, 0);
    471     background-color: #767676;
    472     color: #fff;
    473 }
    474 
    475 .wp-playlist-light a.wp-playlist-caption:hover,
    476 .wp-playlist-light .wp-playlist-item:hover a,
    477 .wp-playlist-light .wp-playlist-item:focus a {
    478     color: #fff;
    479 }
    480 
    481 /* Playlist Color Overrides: Dark */
    482 
    483 .wp-playlist-dark {
    484     background: #222;
    485     border-color: #333;
    486 }
    487 
    488 .wp-playlist-dark .mejs-container .mejs-controls {
    489     background-color: #333;
    490 }
    491 
    492 .wp-playlist-dark .wp-playlist-caption {
    493     color: #fff;
    494 }
    495 
    496 .wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-album {
    497     color: #eee;
    498 }
    499 
    500 .wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-artist {
    501     color: #aaa;
    502 }
    503 
    504 .wp-playlist-dark .wp-playlist-playing {
    505     background-color: #333;
    506 }
    507 
    508 .wp-playlist-dark .wp-playlist-item {
    509     border-bottom: 1px dotted #555;
    510     -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
    511     transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
    512 }
    513 
    514 .wp-playlist-dark .wp-playlist-item:hover,
    515 .wp-playlist-dark .wp-playlist-item:focus {
    516     border-bottom-color: rgba(0, 0, 0, 0);
    517     background-color: #aaa;
    518     color: #222;
    519 }
    520 
    521 .wp-playlist-dark a.wp-playlist-caption:hover,
    522 .wp-playlist-dark .wp-playlist-item:hover a,
    523 .wp-playlist-dark .wp-playlist-item:focus a {
    524     color: #222;
    525 }
    526 
    527 /* Playlist Style Overrides */
    528 
    529 .wp-playlist {
    530     padding: 0.625em 0.625em 0.3125em;
    531 }
    532 
    533 .wp-playlist-current-item .wp-playlist-item-title {
    534     font-weight: 700;
    535 }
    536 
    537 .wp-playlist-current-item .wp-playlist-item-album {
    538     font-style: normal;
    539 }
    540 
    541 .wp-playlist-current-item .wp-playlist-item-artist {
    542     font-size: 10px;
    543     font-size: 0.625rem;
    544     font-weight: 800;
    545     letter-spacing: 0.1818em;
    546     text-transform: uppercase;
    547 }
    548 
    549 .wp-playlist-item {
    550     padding: 0 0.3125em;
    551     cursor: pointer;
    552 }
    553 
    554 .wp-playlist-item:last-of-type {
    555     border-bottom: none;
    556 }
    557 
    558 .wp-playlist-item a {
    559     padding: 0.3125em 0;
    560     border-bottom: none;
    561 }
    562 
    563 .wp-playlist-item a,
    564 .wp-playlist-item a:focus,
    565 .wp-playlist-item a:hover {
    566     -webkit-box-shadow: none;
    567     box-shadow: none;
    568     background: transparent;
    569 }
    570 
    571 .wp-playlist-item-length {
    572     top: 5px;
    573 }
    574 
    575 /**
    576  * 8.0 - RTL
    577  */
    578 
    579 .rtl th {
    580     text-align: right;
    581 }
    582 
    583 .rtl ol {
    584     counter-reset: item;
    585 }
    586 
    587 .rtl ol > li:before {
    588     left: auto;
    589     right: -1.5em;
    590 }
    591 
    592 .rtl li > ul,
    593 .rtl li > ol {
    594     margin-left: 0;
    595     margin-right: 1.5em;
    596 }
    597 
    598 .rtl .mejs-offscreen {
    599     right: -10000px;
    600 }