wp/wp-includes/css/dist/block-library/theme.css
changeset 18 be944660c56a
parent 16 a86126ab1dd4
child 19 3d72ae0968f4
equal deleted inserted replaced
17:34716fd837a4 18:be944660c56a
     1 /**
     1 /**
     2  * Colors
     2  * Colors
     3  */
     3  */
     4 /**
     4 /**
     5  * Deprecated colors.
       
     6  * Please avoid using these.
       
     7  */
       
     8 /**
       
     9  * Breakpoints & Media Queries
     5  * Breakpoints & Media Queries
    10  */
     6  */
    11 /**
     7 /**
       
     8  * SCSS Variables.
       
     9  *
       
    10  * Please use variables from this sheet to ensure consistency across the UI.
       
    11  * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
       
    12  * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
       
    13  */
       
    14 /**
    12  * Colors
    15  * Colors
    13  */
       
    14 /**
       
    15  * Deprecated colors.
       
    16  * Please avoid using these.
       
    17  */
    16  */
    18 /**
    17 /**
    19  * Fonts & basic variables.
    18  * Fonts & basic variables.
    20  */
    19  */
    21 /**
    20 /**
    30  */
    29  */
    31 /**
    30 /**
    32  * Editor widths.
    31  * Editor widths.
    33  */
    32  */
    34 /**
    33 /**
    35  * Block UI.
    34  * Block & Editor UI.
    36  */
    35  */
    37 /**
    36 /**
    38  * Border radii.
    37  * Block paddings.
       
    38  */
       
    39 /**
       
    40  * React Native specific.
       
    41  * These variables do not appear to be used anywhere else.
    39  */
    42  */
    40 /**
    43 /**
    41  * Breakpoint mixins
    44  * Breakpoint mixins
    42  */
    45  */
    43 /**
    46 /**
    63  * This is a WP-admin agnostic reset
    66  * This is a WP-admin agnostic reset
    64  */
    67  */
    65 /**
    68 /**
    66  * Reset the WP Admin page styles for Gutenberg-like pages.
    69  * Reset the WP Admin page styles for Gutenberg-like pages.
    67  */
    70  */
    68 :root {
       
    69   --wp-admin-theme-color: #007cba;
       
    70   --wp-admin-theme-color-darker-10: #006ba1;
       
    71   --wp-admin-theme-color-darker-20: #005a87; }
       
    72 
       
    73 #start-resizable-editor-section {
    71 #start-resizable-editor-section {
    74   display: none; }
    72   display: none;
       
    73 }
    75 
    74 
    76 .wp-block-audio figcaption {
    75 .wp-block-audio figcaption {
    77   color: #555d66;
    76   color: #555;
    78   font-size: 13px;
    77   font-size: 13px;
    79   text-align: center; }
    78   text-align: center;
       
    79 }
       
    80 .is-dark-theme .wp-block-audio figcaption {
       
    81   color: rgba(255, 255, 255, 0.65);
       
    82 }
    80 
    83 
    81 .wp-block-code {
    84 .wp-block-code {
    82   font-family: Menlo, Consolas, monaco, monospace;
    85   font-family: Menlo, Consolas, monaco, monospace;
    83   font-size: 15px;
       
    84   color: #1e1e1e;
    86   color: #1e1e1e;
    85   padding: 0.8em 1em;
    87   padding: 0.8em 1em;
    86   border: 1px solid #ddd;
    88   border: 1px solid #ddd;
    87   border-radius: 4px; }
    89   border-radius: 4px;
       
    90 }
    88 
    91 
    89 .wp-block-embed figcaption {
    92 .wp-block-embed figcaption {
    90   color: #555d66;
    93   color: #555;
    91   font-size: 13px;
    94   font-size: 13px;
    92   text-align: center; }
    95   text-align: center;
       
    96 }
       
    97 .is-dark-theme .wp-block-embed figcaption {
       
    98   color: rgba(255, 255, 255, 0.65);
       
    99 }
    93 
   100 
    94 .blocks-gallery-caption {
   101 .blocks-gallery-caption {
    95   color: #555d66;
   102   color: #555;
    96   font-size: 13px;
   103   font-size: 13px;
    97   text-align: center; }
   104   text-align: center;
       
   105 }
       
   106 .is-dark-theme .blocks-gallery-caption {
       
   107   color: rgba(255, 255, 255, 0.65);
       
   108 }
    98 
   109 
    99 .wp-block-image figcaption {
   110 .wp-block-image figcaption {
   100   color: #555d66;
   111   color: #555;
   101   font-size: 13px;
   112   font-size: 13px;
   102   text-align: center; }
   113   text-align: center;
       
   114 }
       
   115 .is-dark-theme .wp-block-image figcaption {
       
   116   color: rgba(255, 255, 255, 0.65);
       
   117 }
   103 
   118 
   104 .wp-block-pullquote {
   119 .wp-block-pullquote {
   105   border-top: 4px solid #555d66;
   120   border-top: 4px solid currentColor;
   106   border-bottom: 4px solid #555d66;
   121   border-bottom: 4px solid currentColor;
   107   margin-bottom: 28px;
   122   margin-bottom: 1.75em;
   108   color: #40464d; }
   123   color: currentColor;
   109   .wp-block-pullquote cite,
   124 }
   110   .wp-block-pullquote footer, .wp-block-pullquote__citation {
   125 .wp-block-pullquote cite,
   111     color: #40464d;
   126 .wp-block-pullquote footer, .wp-block-pullquote__citation {
   112     text-transform: uppercase;
   127   color: currentColor;
   113     font-size: 13px;
   128   text-transform: uppercase;
   114     font-style: normal; }
   129   font-size: 0.8125em;
   115 
   130   font-style: normal;
   116 .wp-block-navigation ul,
   131 }
   117 .wp-block-navigation ul li {
       
   118   list-style: none; }
       
   119 
       
   120 .wp-block-navigation-link.wp-block-navigation-link {
       
   121   margin: 0; }
       
   122 
   132 
   123 .wp-block-quote {
   133 .wp-block-quote {
   124   border-left: 4px solid #000;
   134   border-left: 0.25em solid currentColor;
   125   margin: 0 0 28px 0;
   135   margin: 0 0 1.75em 0;
   126   padding-left: 1em; }
   136   padding-left: 1em;
   127   .wp-block-quote cite,
   137 }
   128   .wp-block-quote footer, .wp-block-quote__citation {
   138 .wp-block-quote cite,
   129     color: #6c7781;
   139 .wp-block-quote footer {
   130     font-size: 13px;
   140   color: currentColor;
   131     margin-top: 1em;
   141   font-size: 0.8125em;
   132     position: relative;
   142   position: relative;
   133     font-style: normal; }
   143   font-style: normal;
   134   .wp-block-quote.has-text-align-right, .wp-block-quote.has-text-align-right {
   144 }
   135     border-left: none;
   145 .wp-block-quote.has-text-align-right {
   136     border-right: 4px solid #000;
   146   border-left: none;
   137     padding-left: 0;
   147   border-right: 0.25em solid currentColor;
   138     padding-right: 1em; }
   148   padding-left: 0;
   139   .wp-block-quote.has-text-align-center, .wp-block-quote.has-text-align-center {
   149   padding-right: 1em;
   140     border: none;
   150 }
   141     padding-left: 0; }
   151 .wp-block-quote.has-text-align-center {
   142   .wp-block-quote.is-style-large, .wp-block-quote.is-large {
   152   border: none;
   143     border: none; }
   153   padding-left: 0;
       
   154 }
       
   155 .wp-block-quote.is-style-large, .wp-block-quote.is-large {
       
   156   border: none;
       
   157 }
   144 
   158 
   145 .wp-block-search .wp-block-search__label {
   159 .wp-block-search .wp-block-search__label {
   146   font-weight: bold; }
   160   font-weight: bold;
       
   161 }
   147 
   162 
   148 .wp-block-group.has-background {
   163 .wp-block-group.has-background {
   149   padding: 20px 30px;
   164   padding: 1.25em 2.375em;
   150   margin-top: 0;
   165   margin-top: 0;
   151   margin-bottom: 0; }
   166   margin-bottom: 0;
       
   167 }
   152 
   168 
   153 .wp-block-separator {
   169 .wp-block-separator {
   154   border: none;
   170   border: none;
   155   border-bottom: 2px solid #8f98a1;
   171   border-bottom: 2px solid currentColor;
   156   margin-left: auto;
   172   margin-left: auto;
   157   margin-right: auto; }
   173   margin-right: auto;
   158   .wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
   174   opacity: 0.4;
   159     max-width: 100px; }
   175 }
   160   .wp-block-separator.has-background:not(.is-style-dots) {
   176 .wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
   161     border-bottom: none;
   177   width: 100px;
   162     height: 1px; }
   178 }
   163   .wp-block-separator.has-background:not(.is-style-wide):not(.is-style-dots) {
   179 .wp-block-separator.has-background:not(.is-style-dots) {
   164     height: 2px; }
   180   border-bottom: none;
   165 
   181   height: 1px;
   166 .wp-block-table {
   182 }
   167   border-collapse: collapse; }
   183 .wp-block-separator.has-background:not(.is-style-wide):not(.is-style-dots) {
   168   .wp-block-table thead {
   184   height: 2px;
   169     border-bottom: 3px solid; }
   185 }
   170   .wp-block-table tfoot {
   186 
   171     border-top: 3px solid; }
   187 .wp-block-table thead {
   172   .wp-block-table td,
   188   border-bottom: 3px solid;
   173   .wp-block-table th {
   189 }
   174     padding: 0.5em;
   190 .wp-block-table tfoot {
   175     border: 1px solid;
   191   border-top: 3px solid;
   176     word-break: normal; }
   192 }
   177   .wp-block-table figcaption {
   193 .wp-block-table td,
   178     color: #555d66;
   194 .wp-block-table th {
   179     font-size: 13px;
   195   padding: 0.5em;
   180     text-align: center; }
   196   border: 1px solid;
       
   197   word-break: normal;
       
   198 }
       
   199 .wp-block-table figcaption {
       
   200   color: #555;
       
   201   font-size: 13px;
       
   202   text-align: center;
       
   203 }
       
   204 .is-dark-theme .wp-block-table figcaption {
       
   205   color: rgba(255, 255, 255, 0.65);
       
   206 }
   181 
   207 
   182 .wp-block-video figcaption {
   208 .wp-block-video figcaption {
   183   color: #555d66;
   209   color: #555;
   184   font-size: 13px;
   210   font-size: 13px;
   185   text-align: center; }
   211   text-align: center;
       
   212 }
       
   213 .is-dark-theme .wp-block-video figcaption {
       
   214   color: rgba(255, 255, 255, 0.65);
       
   215 }
       
   216 
       
   217 .wp-block-template-part.has-background {
       
   218   padding: 1.25em 2.375em;
       
   219   margin-top: 0;
       
   220   margin-bottom: 0;
       
   221 }
   186 
   222 
   187 #end-resizable-editor-section {
   223 #end-resizable-editor-section {
   188   display: none; }
   224   display: none;
       
   225 }