[ Index ]

PHP Cross Reference of WordPress Trunk (Updated Daily)

Search

title

Body

[close]

/wp-content/themes/twentyseventeen/assets/css/ -> blocks.css (source)

   1  /*
   2  Theme Name: Twenty Seventeen
   3  Description: Used to style blocks.
   4  */
   5  
   6  /*--------------------------------------------------------------
   7  >>> TABLE OF CONTENTS:
   8  ----------------------------------------------------------------
   9  1.0 General Block Styles
  10  2.0 Blocks - Common Blocks
  11  3.0 Blocks - Formatting
  12  4.0 Blocks - Layout Elements
  13  5.0 Blocks - Widgets
  14  6.0 Blocks - Colors
  15  --------------------------------------------------------------*/
  16  
  17  /*--------------------------------------------------------------
  18  1.0 General Block Styles
  19  --------------------------------------------------------------*/
  20  
  21  /* Captions */
  22  
  23  [class^="wp-block-"]:not(.wp-block-gallery) figcaption {
  24      font-style: italic;
  25      margin-bottom: 1.5em;
  26      text-align: left;
  27  }
  28  
  29  .rtl [class^="wp-block-"]:not(.wp-block-gallery) figcaption {
  30      text-align: right;
  31  }
  32  
  33  /*--------------------------------------------------------------
  34  2.0 Blocks - Common Blocks
  35  --------------------------------------------------------------*/
  36  
  37  /* Paragraph */
  38  
  39  p.has-drop-cap:not(:focus)::first-letter {
  40      font-size: 5em;
  41      margin-top: 0.075em;
  42  }
  43  
  44  /* Image */
  45  
  46  .wp-block-image {
  47      margin-bottom: 1.5em;
  48  }
  49  
  50  .wp-block-image figure {
  51      margin-bottom: 0;
  52      margin-top: 0;
  53  }
  54  
  55  .wp-block-image figure.alignleft {
  56      margin-right: 1.5em;
  57  }
  58  
  59  .wp-block-image figure.alignright {
  60      margin-left: 1.5em;
  61  }
  62  
  63  .wp-block-image a,
  64  .wp-block-image a:hover,
  65  .wp-block-image a:focus,
  66  .widget-area .wp-block-image a,
  67  .widget-area .wp-block-image a:hover,
  68  .widget-area .wp-block-image a:focus {
  69      -webkit-box-shadow: none;
  70      box-shadow: none;
  71  }
  72  
  73  /* Gallery */
  74  
  75  .wp-block-gallery {
  76      margin-bottom: 1.5em;
  77  }
  78  
  79  .wp-block-gallery figcaption {
  80      font-style: italic;
  81  }
  82  
  83  .wp-block-gallery.aligncenter {
  84      display: flex;
  85      margin: 0 -8px;
  86  }
  87  
  88  /* Quote */
  89  
  90  .wp-block-quote:not(.is-large):not(.is-style-large) {
  91      border: 0;
  92      padding: 0;
  93  }
  94  
  95  .wp-block-quote.alignleft p:last-of-type,
  96  .wp-block-quote.alignright p:last-of-type {
  97      margin-bottom: 0;
  98  }
  99  
 100  .wp-block-quote cite {
 101      color: inherit;
 102      font-size: inherit;
 103  }
 104  
 105  /* Audio */
 106  
 107  .wp-block-audio audio {
 108      display: block;
 109      width: 100%;
 110  }
 111  
 112  /* Cover */
 113  
 114  .wp-block-cover-image.alignright,
 115  .wp-block-cover.alignright,
 116  .wp-block-cover-image.alignleft,
 117  .wp-block-cover.alignleft,
 118  .wp-block-cover-image.aligncenter,
 119  .wp-block-cover.aligncenter {
 120      display: flex;
 121  }
 122  
 123  /* File */
 124  
 125  .wp-block-file .wp-block-file__button {
 126      background-color: #222;
 127      -webkit-border-radius: 2px;
 128      border-radius: 2px;
 129      -webkit-box-shadow: none;
 130      box-shadow: none;
 131      color: #fff;
 132      display: inline-block;
 133      font-size: 14px;
 134      font-size: 0.875rem;
 135      font-weight: 800;
 136      margin-top: 2em;
 137      padding: 0.7em 2em;
 138      -webkit-transition: background-color 0.2s ease-in-out;
 139      transition: background-color 0.2s ease-in-out;
 140      white-space: pre-line;
 141  }
 142  
 143  .wp-block-file .wp-block-file__button:hover,
 144  .wp-block-file .wp-block-file__button:focus {
 145      background-color: #767676;
 146      -webkit-box-shadow: none;
 147      box-shadow: none;
 148  }
 149  
 150  /*--------------------------------------------------------------
 151  3.0 Blocks - Formatting
 152  --------------------------------------------------------------*/
 153  
 154  /* Code */
 155  
 156  .wp-block-code {
 157      background: transparent;
 158      border: 0;
 159      padding: 0;
 160  }
 161  
 162  .wp-block-code code {
 163      font-size: inherit;
 164  }
 165  
 166  /* Pullquote */
 167  
 168  .wp-block-pullquote {
 169      border: 0;
 170  }
 171  
 172  .wp-block-pullquote__citation,
 173  .wp-block-pullquote cite {
 174      font-size: inherit;
 175      text-transform: none;
 176  }
 177  
 178  /* Table */
 179  
 180  .wp-block-table thead th {
 181      border-bottom: 2px solid #bbb;
 182      padding-bottom: 0.5em;
 183  }
 184  
 185  .wp-block-table tr {
 186      border-bottom: 1px solid #eee;
 187  }
 188  
 189  .wp-block-table th,
 190  .wp-block-table td {
 191      border: 0;
 192  }
 193  
 194  .rtl .wp-block-table th,
 195  .rtl .wp-block-table td {
 196      text-align: right;
 197  }
 198  
 199  /*--------------------------------------------------------------
 200  4.0 Blocks - Layout Elements
 201  --------------------------------------------------------------*/
 202  
 203  /* Buttons */
 204  
 205  .wp-block-button .wp-block-button__link {
 206      -webkit-box-shadow: none;
 207      box-shadow: none;
 208      display: inline-block;
 209      font-size: 14px;
 210      font-size: 0.875rem;
 211      font-weight: 800;
 212      line-height: 1.66;
 213      margin-top: 2em;
 214      padding: 0.7em 2em;
 215      -webkit-transition: background-color 0.2s ease-in-out;
 216      transition: background-color 0.2s ease-in-out;
 217      white-space: pre-line;
 218  }
 219  
 220  .entry-content .wp-block-button__link {
 221      background-color: #222;
 222      color: #fff;
 223  }
 224  
 225  .entry-content .is-style-outline .wp-block-button__link:not(.has-background) {
 226      background-color: transparent;
 227  }
 228  
 229  .entry-content .is-style-outline .wp-block-button__link:not(.has-text-color) {
 230      color: #222;
 231  }
 232  
 233  .colors-dark .wp-block-button__link {
 234      background-color: #fff;
 235      color: #000;
 236  }
 237  
 238  .entry-content .wp-block-button__link:hover,
 239  .entry-content .wp-block-button__link:focus,
 240  .entry-content .is-style-outline .wp-block-button__link:not(.has-background):hover,
 241  .entry-content .is-style-outline .wp-block-button__link:not(.has-background):focus {
 242      background-color: #767676;
 243      -webkit-box-shadow: none;
 244      box-shadow: none;
 245      color: #fff;
 246  }
 247  
 248  .colors-dark .entry-content .wp-block-button__link:hover,
 249  .colors-dark .entry-content .wp-block-button__link:focus,
 250  .colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-background):hover,
 251  .colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-background):focus {
 252      background-color: #bbb;
 253      color: #000;
 254  }
 255  
 256  .colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-text-color) {
 257      color: #fff;
 258  }
 259  
 260  .colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-text-color):hover,
 261  .colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-text-color):focus {
 262      color: #222;
 263  }
 264  
 265  .colors-custom .entry-content .wp-block-button__link,
 266  .colors-custom .entry-content .wp-block-button__link:hover,
 267  .colors-custom .entry-content .wp-block-button__link:focus,
 268  .colors-dark .entry-content .wp-block-button__link,
 269  .colors-dark .entry-content .wp-block-button__link:hover,
 270  .colors-dark .entry-content .wp-block-button__link:focus {
 271      -webkit-box-shadow: none;
 272      box-shadow: none;
 273  }
 274  
 275  .colors-custom .entry-content .wp-block-button__link:hover,
 276  .colors-custom .entry-content .wp-block-button__link:focus {
 277      color: #fff;
 278  }
 279  
 280  /* Separator */
 281  
 282  .wp-block-separator {
 283      border: 0;
 284  }
 285  
 286  .wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
 287      max-width: 100px;
 288  }
 289  
 290  /* Media & Text */
 291  
 292  .wp-block-media-text {
 293      margin-bottom: 1.5em;
 294  }
 295  
 296  .wp-block-media-text *:last-child {
 297      margin-bottom: 0;
 298  }
 299  
 300  /*--------------------------------------------------------------
 301  5.0 Blocks - Widgets
 302  --------------------------------------------------------------*/
 303  
 304  /* Archives, Categories & Latest Posts */
 305  
 306  .wp-block-archives.aligncenter,
 307  .wp-block-categories.aligncenter,
 308  .wp-block-latest-posts.aligncenter {
 309      list-style-position: inside;
 310      text-align: center;
 311  }
 312  
 313  /* Comments */
 314  
 315  .wp-block-latest-comments article {
 316      margin-bottom: 4em;
 317  }
 318  
 319  .widget-area .wp-block-latest-comments article {
 320      margin-bottom: 1em;
 321  }
 322  
 323  .blog:not(.has-sidebar) #primary .wp-block-latest-comments article,
 324  .archive:not(.page-one-column):not(.has-sidebar) #primary .wp-block-latest-comments article,
 325  .search:not(.has-sidebar) #primary .wp-block-latest-comments article {
 326      float: none;
 327      width: 100%;
 328  }
 329  
 330  .wp-block-latest-comments .avatar,
 331  .wp-block-latest-comments__comment-avatar {
 332      border-radius: 0;
 333  }
 334  
 335  .wp-block-latest-comments a {
 336      -webkit-box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1);
 337      box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1);
 338  
 339  }
 340  
 341  .wp-block-latest-comments .wp-block-latest-comments__comment {
 342      border-top: none;
 343  }
 344  
 345  .wp-block-latest-comments__comment-meta {
 346      font-size: 16px;
 347      font-size: 1rem;
 348      margin-bottom: 0.4em;
 349  }
 350  
 351  .wp-block-latest-comments__comment-author,
 352  .wp-block-latest-comments__comment-link {
 353      font-weight: 700;
 354      text-decoration: none;
 355  }
 356  
 357  .wp-block-latest-comments__comment-date {
 358      color: #767676;
 359      font-size: 10px;
 360      font-size: 0.625rem;
 361      font-weight: 800;
 362      letter-spacing: 0.1818em;
 363      margin-top: 0.4em;
 364      text-transform: uppercase;
 365  }
 366  
 367  .editor-block-list__block .wp-block-latest-comments__comment-excerpt p {
 368      font-size: 14px;
 369      font-size: 0.875rem;
 370  }
 371  
 372  /* Query Loop & Post Template */
 373  
 374  .wp-block-query .wp-block-post-template > li {
 375      border-top: none;
 376  }
 377  
 378  /*--------------------------------------------------------------
 379  6.0 Blocks - Colors
 380  --------------------------------------------------------------*/
 381  
 382  .entry-content .has-pale-pink-color {
 383      color: #f78da7;
 384  }
 385  
 386  .entry-content .has-pale-pink-background-color,
 387  .wp-block-button.is-style-outline .has-pale-pink-background-color:link {
 388      background-color: #f78da7;
 389  }
 390  
 391  .entry-content .has-vivid-red-color {
 392      color: #cf2e2e;
 393  }
 394  
 395  .entry-content .has-vivid-red-background-color,
 396  .wp-block-button.is-style-outline .has-vivid-red-background-color:link {
 397      background-color: #cf2e2e;
 398  }
 399  
 400  .entry-content .has-luminous-vivid-orange-color {
 401      color: #ff6900;
 402  }
 403  
 404  .entry-content .has-luminous-vivid-orange-background-color,
 405  .wp-block-button.is-style-outline .has-luminous-vivid-orange-background-color:link {
 406      background-color: #ff6900;
 407  }
 408  
 409  .entry-content .has-luminous-vivid-amber-color {
 410      color: #fcb900;
 411  }
 412  
 413  .entry-content .has-luminous-vivid-amber-background-color,
 414  .wp-block-button.is-style-outline .has-luminous-vivid-amber-background-color:link {
 415      background-color: #fcb900;
 416  }
 417  
 418  .entry-content .has-light-green-cyan-color {
 419      color: #7bdcb5;
 420  }
 421  
 422  .entry-content .has-light-green-cyan-background-color,
 423  .wp-block-button.is-style-outline .has-light-green-cyan-background-color:link {
 424      background-color: #7bdcb5;
 425  }
 426  
 427  .entry-content .has-vivid-green-cyan-color {
 428      color: #00d084;
 429  }
 430  
 431  .entry-content .has-vivid-green-cyan-background-color,
 432  .wp-block-button.is-style-outline .has-vivid-green-cyan-background-color:link {
 433      background-color: #00d084;
 434  }
 435  
 436  .entry-content .has-pale-cyan-blue-color {
 437      color: #8ed1fc;
 438  }
 439  
 440  .entry-content .has-pale-cyan-blue-background-color,
 441  .wp-block-button.is-style-outline .has-pale-cyan-blue-background-color:link {
 442      background-color: #8ed1fc;
 443  }
 444  
 445  .entry-content .has-vivid-cyan-blue-color {
 446      color: #0693e3;
 447  }
 448  
 449  .entry-content .has-vivid-cyan-blue-background-color,
 450  .wp-block-button.is-style-outline .has-vivid-cyan-blue-background-color:link {
 451      background-color: #0693e3;
 452  }
 453  
 454  .entry-content .has-very-light-gray-color {
 455      color: #eee;
 456  }
 457  
 458  .entry-content .has-very-light-gray-background-color,
 459  .wp-block-button.is-style-outline .has-very-light-gray-background-color:link {
 460      background-color: #eee;
 461  }
 462  
 463  .entry-content .has-cyan-bluish-gray-color {
 464      color: #abb8c3;
 465  }
 466  
 467  .entry-content .has-cyan-bluish-gray-background-color,
 468  .wp-block-button.is-style-outline .has-cyan-bluish-gray-background-color:link {
 469      background-color: #abb8c3;
 470  }
 471  
 472  .entry-content .has-very-dark-gray-color {
 473      color: #313131;
 474  }
 475  
 476  .entry-content .has-very-dark-gray-background-color,
 477  .wp-block-button.is-style-outline .has-very-dark-gray-background-color:link {
 478      background-color: #313131;
 479  }


Generated : Fri Mar 29 08:20:02 2024 Cross-referenced by PHPXref