[Summary view] [Print] [Text view]

   1  /*
   2  Theme Name: Twenty Eleven
   3  Description: Used to style blocks in the editor.
   4  */
   5  
   6  /*--------------------------------------------------------------
   7  >>> TABLE OF CONTENTS:
   8  ----------------------------------------------------------------
   9  1.0 General Typography
  10  2.0 General Block Styles
  11  3.0 Blocks - Common Blocks
  12  4.0 Blocks - Formatting
  13  5.0 Blocks - Layout Elements
  14  6.0 Blocks - Widgets
  15  7.0 Blocks - Colors
  16  --------------------------------------------------------------*/
  17  
  18  /*--------------------------------------------------------------
  19  1.0 General Typography
  20  --------------------------------------------------------------*/
  21  
  22  .edit-post-visual-editor .editor-block-list__block,
  23  .edit-post-visual-editor .editor-block-list__block p,
  24  .editor-default-block-appender textarea.editor-default-block-appender__content {
  25      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  26      font-size: 15px;
  27      font-weight: 300;
  28      line-height: 1.625;
  29  }
  30  
  31  .edit-post-visual-editor .editor-block-list__block {
  32      color: #333;
  33  }
  34  
  35  .editor-post-title__block .editor-post-title__input {
  36      color: #000;
  37      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  38      font-size: 36px;
  39      line-height: 48px;
  40  }
  41  
  42  .edit-post-visual-editor h1,
  43  .wp-block-freeform.block-library-rich-text__tinymce h1,
  44  .edit-post-visual-editor h2,
  45  .wp-block-freeform.block-library-rich-text__tinymce h2 {
  46      font-size: 15px;
  47      margin: 0 0 0.8125em;
  48  }
  49  
  50  .edit-post-visual-editor h3,
  51  .wp-block-freeform.block-library-rich-text__tinymce h3 {
  52      font-size: 10px;
  53      font-weight: 300;
  54      letter-spacing: 0.1em;
  55      line-height: 2.6em;
  56      text-transform: uppercase;
  57  }
  58  
  59  .edit-post-visual-editor h4,
  60  .wp-block-freeform.block-library-rich-text__tinymce h4,
  61  .edit-post-visual-editor h5,
  62  .wp-block-freeform.block-library-rich-text__tinymce h5,
  63  .edit-post-visual-editor h6,
  64  .wp-block-freeform.block-library-rich-text__tinymce h6 {
  65      font-size: 15px;
  66      font-weight: 300;
  67      line-height: 1.625;
  68  }
  69  
  70  /*--------------------------------------------------------------
  71  2.0 General Block Styles
  72  --------------------------------------------------------------*/
  73  
  74  /* Main column width */
  75  
  76  .editor-styles-wrapper {
  77      max-width: 100% !important; /* Override where editor-style.css is affecting this. */
  78  }
  79  
  80  .wp-block {
  81      max-width: 614px; /* 584px + 30px to account for padding */
  82  }
  83  
  84  /* Link styles */
  85  
  86  .edit-post-visual-editor a,
  87  .editor-block-list__block a,
  88  .wp-block-freeform.block-library-rich-text__tinymce a {
  89      color: #1982d1;
  90  }
  91  
  92  /* List styles */
  93  
  94  .edit-post-visual-editor ul:not(.wp-block-gallery),
  95  .editor-block-list__block ul:not(.wp-block-gallery),
  96  .block-library-list ul.editor-rich-text__tinymce,
  97  .edit-post-visual-editor ol,
  98  .editor-block-list__block ol,
  99  .block-library-list ol.editor-rich-text__tinymce,
 100  .block-library-list .editor-rich-text__tinymce {
 101      padding: 0;
 102  }
 103  
 104  .edit-post-visual-editor ul:not(.wp-block-gallery),
 105  .edit-post-visual-editor .editor-block-list__block ul:not(.wp-block-gallery),
 106  .block-library-list ul {
 107      list-style-type: square;
 108  }
 109  
 110  .edit-post-visual-editor ol,
 111  .editor-block-list__block ol,
 112  .block-library-list ol {
 113      list-style: decimal;
 114  }
 115  
 116  .edit-post-visual-editor ol ol,
 117  .editor-block-list__block ol ol,
 118  .block-library-list ol ol {
 119      list-style: upper-alpha;
 120  }
 121  
 122  .edit-post-visual-editor ol ol ol,
 123  .editor-block-list__block ol ol ol,
 124  .block-library-list ol ol ol {
 125      list-style: lower-roman;
 126  }
 127  
 128  .edit-post-visual-editor ol ol ol ol,
 129  .editor-block-list__block ol ol ol ol,
 130  .block-library-list ol ol ol ol {
 131      list-style: lower-alpha;
 132  }
 133  
 134  .edit-post-visual-editor ul:not(.wp-block-gallery) li > ul,
 135  .editor-block-list__block ul:not(.wp-block-gallery) li > ul,
 136  .block-library-list .editor-rich-text__tinymce li > ul,
 137  .edit-post-visual-editor li > ol,
 138  .editor-block-list__block li > ol,
 139  .block-library-list .editor-rich-text__tinymce li > ol,
 140  .wp-block-freeform.block-library-rich-text__tinymce li,
 141  .editor-block-list__block li {
 142      margin-bottom: 0;
 143  }
 144  
 145  .rtl .editor-styles-wrapper ul ul,
 146  .rtl .editor-styles-wrapper ol ol,
 147  .rtl .editor-styles-wrapper ul ol,
 148  .rtl .editor-styles-wrapper ol ul {
 149      margin-left: 0;
 150      margin-right: 2.5em;
 151  }
 152  
 153  .wp-block-freeform.block-library-rich-text__tinymce ul,
 154  .wp-block-freeform.block-library-rich-text__tinymce ol {
 155      padding-left: 2.5em;
 156  }
 157  
 158  .rtl .wp-block-freeform.block-library-rich-text__tinymce ul,
 159  .rtl .wp-block-freeform.block-library-rich-text__tinymce ol {
 160      padding: 0;
 161  }
 162  
 163  /* Captions */
 164  
 165  [class^="wp-block-"] figcaption,
 166  [class*=" wp-block-"] figcaption {
 167      font-family: Georgia, serif;
 168      font-size: 12px;
 169  }
 170  
 171  [class^="wp-block-"]:not(.wp-block-gallery) figcaption,
 172  [class*=" wp-block-"]:not(.wp-block-gallery) figcaption {
 173      color: #666;
 174      margin-bottom: 1.625em;
 175      max-width: 96%;
 176      max-width: calc( 100% - 18px );
 177      padding: 3px 0 5px 40px;
 178      position: relative;
 179      text-align: left;
 180  }
 181  
 182  [class^="wp-block-"]:not(.wp-block-gallery) figcaption:before,
 183  [class*=" wp-block-"]:not(.wp-block-gallery) figcaption:before {
 184      color: #666;
 185      content: '\2014';
 186      font-size: 14px;
 187      font-style: normal;
 188      font-weight: bold;
 189      margin-right: 5px;
 190      position: absolute;
 191      left: 10px;
 192      top: 0;
 193  }
 194  
 195  .rtl [class^="wp-block-"]:not(.wp-block-gallery) figcaption,
 196  .rtl [class*=" wp-block-"]:not(.wp-block-gallery) figcaption {
 197      padding-left: 0;
 198      padding-right: 40px;
 199      text-align: right;
 200  }
 201  
 202  .rtl [class^="wp-block-"]:not(.wp-block-gallery) figcaption:before,
 203  .rtl [class*=" wp-block-"]:not(.wp-block-gallery) figcaption:before {
 204      left: 0;
 205      margin-left: 5px;
 206      margin-right: 0;
 207      right: 10px;
 208  }
 209  
 210  /* Quote */
 211  
 212  .wp-block-freeform.block-library-rich-text__tinymce blockquote {
 213      border: 0;
 214      font-style: italic;
 215      margin: 0 3em;
 216      padding: 0;
 217  }
 218  
 219  .wp-block-freeform.block-library-rich-text__tinymce blockquote p {
 220      font-family: Georgia, "Bitstream Charter", serif;
 221      font-size: 15px;
 222      font-weight: normal;
 223  }
 224  
 225  .wp-block-freeform.block-library-rich-text__tinymce blockquote cite {
 226      color: #666;
 227      font: 12px "Helvetica Neue", Helvetica, Arial, sans-serif;
 228      font-weight: 300;
 229      letter-spacing: 0.05em;
 230      text-transform: uppercase;
 231  }
 232  
 233  /* Code */
 234  
 235  .wp-block-freeform.block-library-rich-text__tinymce code {
 236      background: transparent;
 237  }
 238  
 239  /*--------------------------------------------------------------
 240  3.0 Blocks - Common Blocks
 241  --------------------------------------------------------------*/
 242  
 243  /* Paragraph */
 244  
 245  p.has-drop-cap:not(:focus)::first-letter {
 246      font-size: 5em;
 247      margin-top: 0.1em;
 248  }
 249  
 250  /* Gallery */
 251  
 252  .editor-block-list__block .wp-block-gallery {
 253      margin: 0 0 1.625em;
 254  }
 255  
 256  .wp-block-gallery figcaption {
 257      margin-bottom: 0;
 258      max-width: 100%;
 259  }
 260  
 261  .wp-block-gallery .blocks-gallery-item img {
 262      border: 0;
 263      padding: 0;
 264  }
 265  
 266  /* Quote */
 267  
 268  .wp-block-quote {
 269      font-style: italic;
 270      font-weight: normal;
 271      margin: 0 3em;
 272      padding: 0;
 273  }
 274  
 275  .edit-post-visual-editor .editor-block-list__block .wp-block-quote p,
 276  .editor-styles-wrapper .wp-block-quote p {
 277      font-family: Georgia, "Bitstream Charter", serif;
 278  }
 279  
 280  .wp-block-quote:not(.is-large):not(.is-style-large) {
 281      border: 0;
 282      padding-left: 3em;
 283      padding-right: 3em;
 284  }
 285  
 286  .wp-block-quote .wp-block-quote__citation.editor-rich-text__tinymce.mce-content-body,
 287  .wp-block-quote .wp-block-quote__citation {
 288      color: #666;
 289      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 290      font-weight: 300;
 291      letter-spacing: 0.05em;
 292      text-transform: uppercase;
 293  }
 294  
 295  .wp-block-quote.is-large p,
 296  .wp-block-quote.is-style-large p {
 297      font-size: 20px;
 298  }
 299  
 300  .wp-block-quote.is-large .wp-block-quote__citation,
 301  .wp-block-quote.is-style-large .wp-block-quote__citation  {
 302      font-size: 16px;
 303  }
 304  
 305  /* Cover */
 306  
 307  .edit-post-visual-editor .editor-block-list__block .wp-block-cover-image p.wp-block-cover-image-text,
 308  .edit-post-visual-editor .editor-block-list__block .wp-block-cover p.wp-block-cover-text {
 309      font-size: 30px;
 310      line-height: 37.5px;
 311  }
 312  
 313  /* File */
 314  
 315  .wp-block-file .wp-block-file__textlink {
 316      color: #1982d1;
 317  }
 318  
 319  .wp-block-file .wp-block-file__button {
 320      background: #222;
 321      border: none;
 322      -moz-border-radius: 3px;
 323      border-radius: 3px;
 324      -webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
 325      -moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
 326      box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
 327      color: #eee;
 328      cursor: pointer;
 329      font-size: 15px;
 330      line-height: 24px;
 331      padding: 5px 22px;
 332      text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
 333  }
 334  
 335  /*--------------------------------------------------------------
 336  4.0 Blocks - Formatting
 337  --------------------------------------------------------------*/
 338  
 339  /* Code */
 340  
 341  .editor-styles-wrapper .wp-block-code {
 342      background: transparent;
 343      border: 0;
 344      padding: 0;
 345  }
 346  
 347  /* Pullquote */
 348  
 349  .edit-post-visual-editor .editor-block-list__block .wp-block-pullquote p,
 350  .editor-styles-wrapper .wp-block-pullquote p {
 351      font-family: Georgia, "Bitstream Charter", serif;
 352      font-style: italic;
 353      font-weight: normal;
 354  }
 355  
 356  .wp-block-pullquote.alignleft blockquote > .editor-rich-text p,
 357  .wp-block-pullquote.alignright blockquote > .editor-rich-text p {
 358      font-size: 20px;
 359  }
 360  
 361  /* Table */
 362  
 363  .editor-styles-wrapper .wp-block-table th,
 364  .editor-styles-wrapper .wp-block-table td {
 365      padding: 6px 10px 6px 0;
 366  }
 367  
 368  .rtl .editor-styles-wrapper .wp-block-table th,
 369  .rtl .editor-styles-wrapper .wp-block-table td {
 370      padding: 6px 0 6px 10px;
 371  }
 372  
 373  .wp-block-table .has-text-color th {
 374      color: currentColor;
 375  }
 376  
 377  .wp-block-table__cell-content {
 378      padding: 6px;
 379  }
 380  
 381  .rtl .editor-block-list__block .wp-block-table th,
 382  .rtl .editor-block-list__block .wp-block-table td,
 383  .rtl .editor-block-list__block th,
 384  .rtl .editor-block-list__block td {
 385      text-align: right;
 386  }
 387  
 388  /* Verse */
 389  
 390  .editor-styles-wrapper .wp-block-verse {
 391      font-family: inherit;
 392  }
 393  
 394  
 395  /*--------------------------------------------------------------
 396  5.0 Blocks - Layout Elements
 397  --------------------------------------------------------------*/
 398  
 399  /* Buttons */
 400  
 401  .wp-block-button .wp-block-button__link {
 402      -webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
 403      -moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
 404      box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
 405      cursor: pointer;
 406      font-size: 15px;
 407      line-height: 24px;
 408      margin: 20px 0;
 409      padding: 5px 22px;
 410      text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
 411  }
 412  
 413  .wp-block-button .wp-block-button__link[data-is-placeholder-visible="true"] {
 414      height: auto;
 415  }
 416  
 417  .wp-block-button__link {
 418      background: #222;
 419      color: #eee;
 420  }
 421  
 422  .is-style-outline .wp-block-button__link {
 423      color: #222;
 424  }
 425  
 426  .wp-block-button__link.has-text-color {
 427      text-shadow: none;
 428  }
 429  
 430  /* Media & Text */
 431  
 432  .wp-block-media-text *:last-child {
 433      margin-bottom: 0;
 434  }
 435  
 436  /*--------------------------------------------------------------
 437  6.0 Blocks - Widgets
 438  --------------------------------------------------------------*/
 439  
 440  /* Archives, Categories & Latest Posts */
 441  
 442  [data-align="center"] .wp-block-archives ul,
 443  [data-align="center"] .wp-block-categories ul,
 444  [data-align="center"] .wp-block-latest-posts ul {
 445      list-style-position: inside;
 446      margin-left: 2.5em;
 447      text-align: center;
 448  }
 449  
 450  /* Latest Comments */
 451  
 452  .wp-block-latest-comments {
 453      margin: 0;
 454      padding: 0;
 455  }
 456  
 457  .wp-block-latest-comments .avatar,
 458  .wp-block-latest-comments__comment-avatar {
 459      -moz-border-radius: 3px;
 460      border-radius: 3px;
 461      -webkit-box-shadow: 0 1px 2px #ccc;
 462      -moz-box-shadow: 0 1px 2px #ccc;
 463      box-shadow: 0 1px 2px #ccc;
 464      padding: 0;
 465  }
 466  
 467  .wp-block-latest-comments__comment,
 468  .wp-block-latest-comments__comment-excerpt,
 469  .wp-block-latest-comments__comment-excerpt p {
 470      font-size: 15px;
 471  }
 472  
 473  .wp-block-latest-comments__comment-excerpt p:last-child {
 474      margin-bottom: 0;
 475  }
 476  
 477  .wp-block-latest-comments__comment-meta,
 478  .wp-block-latest-comments__comment-date {
 479      color: #666;
 480      font-size: 12px;
 481      line-height: 2.2em;
 482  }
 483  
 484  .wp-block-latest-comments__comment-meta a {
 485      font-weight: bold;
 486  }
 487  
 488  .wp-block-latest-comments .wp-block-latest-comments__comment {
 489      -moz-border-radius: 3px;
 490      border-radius: 3px;
 491      margin: 0 0 2.625em;
 492      position: relative;
 493  }
 494  
 495  /* Latest Posts */
 496  
 497  .edit-post-visual-editor .editor-block-list__block .wp-block-latest-posts.is-grid {
 498      list-style: none;
 499      margin-left: 0;
 500      margin-right: 0;
 501  }
 502  
 503  /*--------------------------------------------------------------
 504  7.0 Blocks - Colors
 505  --------------------------------------------------------------*/
 506  
 507  :root .editor-styles-wrapper .has-blue-color {
 508      color: #1982d1;
 509  }
 510  
 511  :root .editor-styles-wrapper .has-blue-background-color {
 512      background-color: #1982d1;
 513  }
 514  
 515  :root .editor-styles-wrapper .has-black-color {
 516      color: #000;
 517  }
 518  
 519  :root .editor-styles-wrapper .has-black-background-color {
 520      background-color: #000;
 521  }
 522  
 523  :root .editor-styles-wrapper .has-dark-gray-color {
 524      color: #373737;
 525  }
 526  
 527  :root .editor-styles-wrapper .has-dark-gray-background-color {
 528      background-color: #373737;
 529  }
 530  
 531  :root .editor-styles-wrapper .has-medium-gray-color {
 532      color: #666;
 533  }
 534  
 535  :root .editor-styles-wrapper .has-medium-gray-background-color {
 536      background-color: #666;
 537  }
 538  
 539  :root .editor-styles-wrapper .has-light-gray-color {
 540      color: #e2e2e2;
 541  }
 542  
 543  :root .editor-styles-wrapper .has-light-gray-background-color {
 544      background-color: #e2e2e2;
 545  }
 546  
 547  :root .editor-styles-wrapper .has-white-color {
 548      color: #fff;
 549  }
 550  
 551  :root .editor-styles-wrapper .has-white-background-color {
 552      background-color: #fff;
 553  }