[ Index ]

PHP Cross Reference of WordPress Trunk (Updated Daily)

Search

title

Body

[close]

/wp-content/themes/twentysixteen/css/ -> editor-blocks.css (source)

   1  /*
   2  Theme Name: Twenty Sixteen
   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  .editor-default-block-appender textarea.editor-default-block-appender__content {
  24      font-family: Merriweather, Georgia, serif;
  25      font-size: 16px;
  26      font-size: 1rem;
  27      line-height: 1.75;
  28  }
  29  
  30  .edit-post-visual-editor .editor-block-list__block {
  31      color: #1a1a1a;
  32  }
  33  
  34  .editor-post-title__block .editor-post-title__input {
  35      font-family: Montserrat, "Helvetica Neue", sans-serif;
  36      font-size: 28px;
  37      font-size: 1.75rem;
  38      font-weight: 700;
  39      line-height: 1.25;
  40      margin-bottom: 1em;
  41  }
  42  
  43  .edit-post-visual-editor h1 {
  44      font-size: 28px;
  45      font-size: 1.75rem;
  46      line-height: 1.25;
  47      margin-top: 2em;
  48      margin-bottom: 1em;
  49  }
  50  
  51  .edit-post-visual-editor h2 {
  52      font-size: 23px;
  53      font-size: 1.4375rem;
  54      line-height: 1.2173913043;
  55      margin-top: 2.4347826087em;
  56      margin-bottom: 1.2173913043em;
  57  }
  58  
  59  .edit-post-visual-editor h3 {
  60      font-size: 19px;
  61      font-size: 1.1875rem;
  62      line-height: 1.1052631579;
  63      margin-top: 2.9473684211em;
  64      margin-bottom: 1.4736842105em;
  65  }
  66  
  67  .edit-post-visual-editor h4,
  68  .edit-post-visual-editor h5,
  69  .edit-post-visual-editor h6 {
  70      font-size: 16px;
  71      font-size: 1rem;
  72      line-height: 1.3125;
  73      margin-top: 3.5em;
  74      margin-bottom: 1.75em;
  75  }
  76  
  77  .edit-post-visual-editor h4 {
  78      letter-spacing: 0.140625em;
  79      text-transform: uppercase;
  80  }
  81  
  82  .edit-post-visual-editor h6 {
  83      font-style: italic;
  84  }
  85  
  86  .edit-post-visual-editor h1,
  87  .edit-post-visual-editor h2,
  88  .edit-post-visual-editor h3,
  89  .edit-post-visual-editor h4,
  90  .edit-post-visual-editor h5,
  91  .edit-post-visual-editor h6 {
  92      font-weight: 900;
  93  }
  94  
  95  @media screen and (min-width: 61.5625em) {
  96      .edit-post-visual-editor h1 {
  97          font-size: 33px;
  98          font-size: 2.0625rem;
  99          line-height: 1.2727272727;
 100          margin-top: 1.696969697em;
 101          margin-bottom: 0.8484848485em;
 102      }
 103  
 104      .edit-post-visual-editor h2 {
 105          font-size: 28px;
 106          font-size: 1.75rem;
 107          line-height: 1.25;
 108          margin-top: 2em;
 109          margin-bottom: 1em;
 110      }
 111  
 112      .edit-post-visual-editor h3 {
 113          font-size: 23px;
 114          font-size: 1.4375rem;
 115          line-height: 1.2173913043;
 116          margin-top: 2.4347826087em;
 117          margin-bottom: 1.2173913043em;
 118      }
 119  
 120      .edit-post-visual-editor h4 {
 121          letter-spacing: 0.131578947em;
 122      }
 123  
 124      .edit-post-visual-editor h4,
 125      .edit-post-visual-editor h5,
 126      .edit-post-visual-editor h6 {
 127          font-size: 19px;
 128          font-size: 1.1875rem;
 129          line-height: 1.1052631579;
 130          margin-top: 2.9473684211em;
 131          margin-bottom: 1.473684211em;
 132      }
 133  }
 134  
 135  .edit-post-visual-editor h1:first-child,
 136  .edit-post-visual-editor h2:first-child,
 137  .edit-post-visual-editor h3:first-child,
 138  .edit-post-visual-editor h4:first-child,
 139  .edit-post-visual-editor h5:first-child,
 140  .edit-post-visual-editor h6:first-child {
 141      margin-top: 0;
 142  }
 143  
 144  .edit-post-visual-editor p {
 145      margin: 0 0 1.75em;
 146  }
 147  
 148  .edit-post-visual-editor blockquote p {
 149      margin-bottom: 1.4736842105em;
 150  }
 151  
 152  @media screen and (min-width: 44.375em) {
 153      .editor-post-title__block .editor-post-title__input {
 154          font-size: 33px;
 155          font-size: 2.0625rem;
 156          line-height: 1.2727272727;
 157          margin-bottom: 0.8484848485em;
 158      }
 159  }
 160  
 161  @media screen and (min-width: 61.5625em) {
 162      .editor-post-title__block .editor-post-title__input {
 163          font-size: 40px;
 164          font-size: 2.5rem;
 165          line-height: 1.225;
 166          margin-bottom: 1.05em;
 167      }
 168  }
 169  
 170  /*--------------------------------------------------------------
 171  2.0 General Block Styles
 172  --------------------------------------------------------------*/
 173  
 174  /* Main column width */
 175  
 176  .editor-styles-wrapper {
 177      max-width: 100% !important; /* Override where editor-style.css is affecting this */
 178  }
 179  
 180  .wp-block {
 181      max-width: 630px; /* 600px + 30px to account for padding. */
 182  }
 183  
 184  /* Link styles */
 185  
 186  .edit-post-visual-editor a,
 187  .editor-block-list__block a,
 188  .wp-block-freeform.block-library-rich-text__tinymce a {
 189      color: #007acc;
 190  }
 191  
 192  /* List styles */
 193  
 194  .edit-post-visual-editor ul:not(.wp-block-gallery),
 195  .editor-block-list__block ul:not(.wp-block-gallery),
 196  .block-library-list ul,
 197  .edit-post-visual-editor ol,
 198  .editor-block-list__block ol,
 199  .block-library-list ol {
 200      padding: 0;
 201  }
 202  
 203  .edit-post-visual-editor ul:not(.wp-block-gallery),
 204  .editor-block-list__block ul:not(.wp-block-gallery),
 205  .block-library-list ul {
 206      list-style: disc;
 207  }
 208  
 209  .edit-post-visual-editor ol,
 210  .editor-block-list__block ol,
 211  .block-library-list ol {
 212      list-style: decimal;
 213      margin-left: 1.5em;
 214  }
 215  
 216  .edit-post-visual-editor ul:not(.wp-block-gallery) li,
 217  .editor-block-list__block ul:not(.wp-block-gallery) li,
 218  .edit-post-visual-editor ol li,
 219  .editor-block-list__block ol li,
 220  .block-library-list li {
 221      margin-bottom: 0;
 222  }
 223  
 224  .edit-post-visual-editor ul:not(.wp-block-gallery) li > ul,
 225  .editor-block-list__block ul:not(.wp-block-gallery) li > ul,
 226  .block-library-list li > ul,
 227  .edit-post-visual-editor li > ol,
 228  .editor-block-list__block li > ol,
 229  .block-library-list li > ol {
 230      margin-bottom: 0;
 231  }
 232  
 233  .rtl .editor-styles-wrapper ul ul,
 234  .rtl .editor-styles-wrapper ol ol,
 235  .rtl .editor-styles-wrapper ul ol,
 236  .rtl .editor-styles-wrapper ol ul {
 237      margin-left: 0;
 238      margin-right: 1.5em;
 239  }
 240  
 241  .wp-block-freeform.block-library-rich-text__tinymce ul,
 242  .wp-block-freeform.block-library-rich-text__tinymce ol {
 243      padding-left: 1.5em;
 244  }
 245  
 246  .rtl .wp-block-freeform.block-library-rich-text__tinymce ul,
 247  .rtl .wp-block-freeform.block-library-rich-text__tinymce ol {
 248      padding: 0;
 249  }
 250  
 251  .editor-styles-wrapper ol.has-background,
 252  .editor-styles-wrapper ul.has-background {
 253      padding: 1.25em 2.375em;
 254  }
 255  
 256  /* Quotes */
 257  
 258  .rtl .editor-block-list__block blockquote {
 259      border-left: 0;
 260      padding-left: 0;
 261  }
 262  
 263  /* Captions */
 264  
 265  [class^="wp-block-"] figcaption {
 266      color: #686868;
 267      font-style: italic;
 268      line-height: 1.6153846154;
 269      padding-top: 0.5384615385em;
 270      text-align: left;
 271  }
 272  
 273  .rtl [class^="wp-block-"] figcaption {
 274      text-align: right;
 275  }
 276  
 277  /*--------------------------------------------------------------
 278  3.0 Blocks - Common Blocks
 279  --------------------------------------------------------------*/
 280  
 281  /* Paragraph */
 282  
 283  .wp-block-paragraph.has-drop-cap:not(:focus)::first-letter {
 284      font-size: 5em;
 285      line-height: 0.68;
 286      margin: 0.05em 0.1em 0 0;
 287      text-transform: uppercase;
 288      font-style: normal;
 289  }
 290  
 291  .rtl .wp-block-paragraph.has-drop-cap:not(:focus)::first-letter {
 292      margin: 0.05em 0 0 0.1em;
 293  }
 294  
 295  /* Quote */
 296  
 297  .wp-block-quote {
 298      border: 0 solid #1a1a1a;
 299      border-left-width: 4px;
 300      color: #686868;
 301      font-style: italic;
 302      line-height: 1.4736842105;
 303      margin: 0 0 1.4736842105em;
 304      overflow: hidden;
 305      padding: 0 0 0 1.263157895em;
 306  }
 307  
 308  .wp-block-quote:not(.is-large):not(.is-style-large).alignleft,
 309  .wp-block-quote:not(.is-large):not(.is-style-large).alignright {
 310      border-left: 0;
 311      padding-left: 0;
 312  }
 313  
 314  .editor-block-list__block .wp-block-quote p {
 315      font-size: 19px;
 316      font-size: 1.1875rem;
 317      margin-bottom: 1.4736842105em;
 318  }
 319  
 320  .wp-block-quote__citation {
 321      color: #1a1a1a;
 322      display: block;
 323      font-size: 16px;
 324      font-size: 1rem;
 325      line-height: 1.75;
 326  }
 327  
 328  .wp-block-quote.has-text-color .wp-block-quote__citation {
 329      color: inherit;
 330  }
 331  
 332  .wp-block-quote__citation:before {
 333      content: "\2014\00a0";
 334  }
 335  
 336  .wp-block-quote em,
 337  .wp-block-quote i,
 338  .wp-block-quote__citation:before {
 339      font-style: normal;
 340  }
 341  
 342  .wp-block-quote strong,
 343  .wp-block-quote b {
 344      font-weight: 400;
 345  }
 346  
 347  .wp-block-quote > :last-child {
 348      margin-bottom: 0;
 349  }
 350  
 351  .wp-block-quote.alignleft {
 352      margin: 0.3157894737em 1.4736842105em 1.473684211em 0;
 353  }
 354  
 355  .wp-block-quote.alignright {
 356      margin: 0.3157894737em 0 1.473684211em 1.4736842105em;
 357  }
 358  
 359  .wp-block-quote.aligncenter {
 360      margin-bottom: 1.473684211em;
 361  }
 362  
 363  .rtl .wp-block-quote:not(.is-large):not(.is-style-large).alignleft,
 364  .rtl .wp-block-quote:not(.is-large):not(.is-style-large).alignright  {
 365      border-right: 0;
 366      padding-right: 0;
 367  }
 368  
 369  @media screen and (min-width: 44.375em) {
 370      .wp-block-quote.alignleft,
 371      .wp-block-quote.alignright {
 372          border-width: 4px 0 0 0;
 373          padding: 0.9473684211em 0 0;
 374          width: -webkit-calc(50% - 0.736842105em);
 375          width: calc(50% - 0.736842105em);
 376      }
 377  }
 378  
 379  @media screen and (min-width: 80em) {
 380      .editor-block-list__block .wp-block-quote.alignleft {
 381          margin-left: -40%;
 382          width: -webkit-calc(60% - 1.4736842105em);
 383          width: calc(60% - 1.4736842105em);
 384      }
 385  }
 386  
 387  /* File */
 388  
 389  .wp-block-file__textlink {
 390      box-shadow: 0 1px 0 0 currentColor;
 391      color: #007acc;
 392  }
 393  
 394  .wp-block-file .wp-block-file__button {
 395      background: #1a1a1a;
 396      border: 0;
 397      border-radius: 2px;
 398      color: #fff;
 399      font-family: Montserrat, "Helvetica Neue", sans-serif;
 400      font-weight: 700;
 401      letter-spacing: 0.046875em;
 402      line-height: 1;
 403      padding: 0.84375em 0.875em 0.78125em;
 404      text-transform: uppercase;
 405  }
 406  
 407  /*--------------------------------------------------------------
 408  4.0 Blocks - Formatting
 409  --------------------------------------------------------------*/
 410  
 411  /* Code */
 412  
 413  .editor-styles-wrapper .wp-block-code {
 414      border: 0;
 415      padding: 0.125em 0.25em;
 416      background-color: #d1d1d1;
 417  }
 418  
 419  /* Classic */
 420  
 421  .wp-block-freeform.block-library-rich-text__tinymce blockquote {
 422      border: 0 solid #1a1a1a;
 423      border-left-width: 4px;
 424      color: #686868;
 425      font-style: italic;
 426      line-height: 1.4736842105;
 427      margin: 0 0 1.4736842105em;
 428      overflow: hidden;
 429      padding: 0 0 0 1.263157895em;
 430  }
 431  
 432  .editor-block-list__block .wp-block-freeform.block-library-rich-text__tinymce blockquote:not(.alignleft):not(.alignright) {
 433      margin-left: 0;
 434  }
 435  
 436  .wp-block-freeform.block-library-rich-text__tinymce blockquote p {
 437      font-size: 19px;
 438      font-size: 1.1875rem;
 439  }
 440  
 441  .wp-block-freeform.block-library-rich-text__tinymce blockquote cite {
 442      color: #1a1a1a;
 443      display: block;
 444      font-size: 16px;
 445      font-size: 1rem;
 446      font-style: normal;
 447      line-height: 1.75;
 448  }
 449  
 450  .wp-block-freeform.block-library-rich-text__tinymce blockquote cite:before {
 451      content: "\2014\00a0";
 452  }
 453  
 454  .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignleft {
 455      margin: 0.3157894737em 1.4736842105em 1.473684211em 0;
 456  }
 457  
 458  .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignright {
 459      margin: 0.3157894737em 0 1.473684211em 1.4736842105em;
 460  }
 461  
 462  .wp-block-freeform.block-library-rich-text__tinymce blockquote.aligncenter {
 463      margin-bottom: 1.473684211em;
 464  }
 465  
 466  @media screen and (min-width: 44.375em) {
 467      .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignleft,
 468      .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignright {
 469          border-width: 4px 0 0 0;
 470          padding: 0.9473684211em 0 0;
 471          width: -webkit-calc(50% - 0.736842105em);
 472          width: calc(50% - 0.736842105em);
 473      }
 474  }
 475  
 476  .rtl .wp-block-freeform.block-library-rich-text__tinymce blockquote {
 477      border-left-width: 0;
 478      border-right-width: 4px;
 479      overflow: hidden;
 480      padding-left: 0;
 481      padding-right: 1.263157895em;
 482  }
 483  
 484  .rtl .wp-block-freeform.block-library-rich-text__tinymce .alignleft {
 485      float: left;
 486  }
 487  
 488  .rtl .wp-block-freeform.block-library-rich-text__tinymce .alignright {
 489      float: right;
 490  }
 491  
 492  .rtl .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignleft {
 493      margin: 0.3157894737em 0 1.473684211em 1.4736842105em;
 494  }
 495  
 496  .rtl .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignright {
 497      margin: 0.3157894737em 1.4736842105em 1.473684211em 0;
 498  }
 499  
 500  /* Pullquote */
 501  
 502  .editor-block-list__block .wp-block-pullquote blockquote {
 503      border: 0;
 504      margin: 0;
 505      padding: 0;
 506  }
 507  
 508  .wp-block-pullquote blockquote > .editor-rich-text p {
 509      font-size: 19px;
 510      font-size: 1.1875rem;
 511  }
 512  
 513  .wp-block-pullquote .wp-block-pullquote__citation {
 514      color: #1a1a1a;
 515      display: block;
 516      font-size: 16px;
 517      font-size: 1rem;
 518      font-style: italic;
 519      line-height: 1.75;
 520      text-transform: none;
 521  }
 522  
 523  .wp-block-pullquote.has-text-color blockquote,
 524  .wp-block-pullquote.has-background blockquote,
 525  .has-background .wp-block-pullquote blockquote,
 526  .wp-block-pullquote.has-text-color cite {
 527      color: inherit;
 528  }
 529  
 530  .wp-block-pullquote .wp-block-pullquote__citation:before {
 531      content: "\2014\00a0";
 532  }
 533  
 534  /* Table */
 535  
 536  .editor-block-list__block table.wp-block-table th,
 537  .editor-block-list__block table.wp-block-table td {
 538      padding: 0;
 539  }
 540  
 541  .rtl .wp-block-table th,
 542  .rtl .wp-block-table td {
 543      text-align: right;
 544  }
 545  
 546  /* Verse */
 547  
 548  .editor-styles-wrapper .wp-block-verse {
 549      font-family: inherit;
 550  }
 551  
 552  /*--------------------------------------------------------------
 553  5.0 Blocks - Layout Elements
 554  --------------------------------------------------------------*/
 555  
 556  /* Buttons */
 557  
 558  .wp-block-button .wp-block-button__link {
 559      font-family: Montserrat, "Helvetica Neue", sans-serif;
 560      font-weight: 700;
 561      letter-spacing: 0.046875em;
 562      line-height: 1;
 563      padding: 0.84375em 1.3125em 0.78125em;
 564      text-transform: uppercase;
 565  }
 566  
 567  .wp-block-buttons[style*="text-transform"] .wp-block-button__link,
 568  .wp-block-button[style*="text-transform"] .wp-block-button__link {
 569      text-transform: inherit;
 570  }
 571  
 572  .wp-block-button__link {
 573      background: #1a1a1a;
 574      color: #fff;
 575  }
 576  
 577  .is-style-outline .wp-block-button__link {
 578      color: #1a1a1a;
 579  }
 580  
 581  /* Media & Text */
 582  
 583  .wp-block-media-text *:last-child {
 584      margin-bottom: 0;
 585  }
 586  
 587  /*--------------------------------------------------------------
 588  6.0 Blocks - Widgets
 589  --------------------------------------------------------------*/
 590  
 591  /* Archives, Categories & Latest Posts */
 592  
 593  [data-align="center"] .wp-block-archives ul,
 594  [data-align="center"] .wp-block-categories ul,
 595  [data-align="center"] .wp-block-latest-posts ul {
 596      list-style-position: inside;
 597  }
 598  
 599  /* Latest Comments */
 600  
 601  .editor-block-list__block .wp-block-latest-comments__comment-meta a {
 602      box-shadow: none;
 603      font-weight: 700;
 604      text-decoration: none;
 605  }
 606  
 607  .wp-block-latest-comments__comment-date {
 608      color: #686868;
 609      font-family: Montserrat, "Helvetica Neue", sans-serif;
 610      font-size: 13px;
 611      font-size: 0.8125rem;
 612      line-height: 1.6153846154;
 613  }
 614  
 615  .wp-block-latest-comments .wp-block-latest-comments__comment {
 616      border-top: 1px solid #d1d1d1;
 617      margin-bottom: 0;
 618      padding: 1.75em 0;
 619  }
 620  
 621  .wp-block-latest-comments__comment-excerpt p:last-child {
 622      margin-bottom: 0;
 623  }
 624  
 625  /* Latest Posts */
 626  
 627  .edit-post-visual-editor .wp-block-latest-posts.is-grid {
 628      list-style: none;
 629      margin-left: 0;
 630      margin-right: 0;
 631  }
 632  
 633  .edit-post-visual-editor .wp-block-latest-posts.is-grid li {
 634      margin-bottom: 16px;
 635  }
 636  
 637  /* Avatar & Post Author */
 638  
 639  .editor-styles-wrapper .avatar,
 640  .wp-block-post-author__avatar img {
 641      border-radius: 50%;
 642  }
 643  
 644  /*--------------------------------------------------------------
 645  7.0 Blocks - Colors
 646  --------------------------------------------------------------*/
 647  
 648  :root .editor-styles-wrapper .has-dark-gray-color {
 649      color: #1a1a1a;
 650  }
 651  
 652  :root .editor-styles-wrapper .has-dark-gray-background-color {
 653      background-color: #1a1a1a;
 654  }
 655  
 656  :root .editor-styles-wrapper .has-medium-gray-color {
 657      color: #686868;
 658  }
 659  
 660  :root .editor-styles-wrapper .has-medium-gray-background-color {
 661      background-color: #686868;
 662  }
 663  
 664  :root .editor-styles-wrapper .has-light-gray-color {
 665      color: #e5e5e5;
 666  }
 667  
 668  :root .editor-styles-wrapper .has-light-gray-background-color {
 669      background-color: #e5e5e5;
 670  }
 671  
 672  :root .editor-styles-wrapper .has-white-color {
 673      color: #fff;
 674  }
 675  
 676  :root .editor-styles-wrapper .has-white-background-color {
 677      background-color: #fff;
 678  }
 679  
 680  :root .editor-styles-wrapper .has-blue-gray-color {
 681      color: #4d545c;
 682  }
 683  
 684  :root .editor-styles-wrapper .has-blue-gray-background-color {
 685      background-color: #4d545c;
 686  }
 687  
 688  :root .editor-styles-wrapper .has-bright-blue-color {
 689      color: #007acc;
 690  }
 691  
 692  :root .editor-styles-wrapper .has-bright-blue-background-color {
 693      background-color: #007acc;
 694  }
 695  
 696  :root .editor-styles-wrapper .has-light-blue-color {
 697      color: #9adffd;
 698  }
 699  
 700  :root .editor-styles-wrapper .has-light-blue-background-color {
 701      background-color: #9adffd;
 702  }
 703  
 704  :root .editor-styles-wrapper .has-dark-brown-color {
 705      color: #402b30;
 706  }
 707  
 708  :root .editor-styles-wrapper .has-dark-brown-background-color {
 709      background-color: #402b30;
 710  }
 711  
 712  :root .editor-styles-wrapper .has-medium-brown-color {
 713      color: #774e24;
 714  }
 715  
 716  :root .editor-styles-wrapper .has-medium-brown-background-color {
 717      background-color: #774e24;
 718  }
 719  
 720  :root .editor-styles-wrapper .has-dark-red-color {
 721      color: #640c1f;
 722  }
 723  
 724  :root .editor-styles-wrapper .has-dark-red-background-color {
 725      background-color: #640c1f;
 726  }
 727  
 728  :root .editor-styles-wrapper .has-bright-red-color {
 729      color: #ff675f;
 730  }
 731  
 732  :root .editor-styles-wrapper .has-bright-red-background-color {
 733      background-color: #ff675f;
 734  }
 735  
 736  :root .editor-styles-wrapper .has-yellow-color {
 737      color: #ffef8e;
 738  }
 739  
 740  :root .editor-styles-wrapper .has-yellow-background-color {
 741      background-color: #ffef8e;
 742  }


Generated : Thu Mar 28 08:20:01 2024 Cross-referenced by PHPXref