wp/wp-includes/css/dist/block-library/common-rtl.css
changeset 19 3d72ae0968f4
parent 18 be944660c56a
child 21 48c4eec2b7e6
equal deleted inserted replaced
18:be944660c56a 19:3d72ae0968f4
    39 /**
    39 /**
    40  * React Native specific.
    40  * React Native specific.
    41  * These variables do not appear to be used anywhere else.
    41  * These variables do not appear to be used anywhere else.
    42  */
    42  */
    43 /**
    43 /**
       
    44 *  Converts a hex value into the rgb equivalent.
       
    45 *
       
    46 * @param {string} hex - the hexadecimal value to convert
       
    47 * @return {string} comma separated rgb values
       
    48 */
       
    49 /**
    44  * Breakpoint mixins
    50  * Breakpoint mixins
    45  */
    51  */
    46 /**
    52 /**
    47  * Long content fade mixin
    53  * Long content fade mixin
    48  *
    54  *
    68 /**
    74 /**
    69  * Reset the WP Admin page styles for Gutenberg-like pages.
    75  * Reset the WP Admin page styles for Gutenberg-like pages.
    70  */
    76  */
    71 :root {
    77 :root {
    72   --wp-admin-theme-color: #007cba;
    78   --wp-admin-theme-color: #007cba;
       
    79   --wp-admin-theme-color--rgb: 0, 124, 186;
    73   --wp-admin-theme-color-darker-10: #006ba1;
    80   --wp-admin-theme-color-darker-10: #006ba1;
       
    81   --wp-admin-theme-color-darker-10--rgb: 0, 107, 161;
    74   --wp-admin-theme-color-darker-20: #005a87;
    82   --wp-admin-theme-color-darker-20: #005a87;
       
    83   --wp-admin-theme-color-darker-20--rgb: 0, 90, 135;
    75   --wp-admin-border-width-focus: 2px;
    84   --wp-admin-border-width-focus: 2px;
    76 }
    85 }
    77 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    86 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    78   :root {
    87   :root {
    79     --wp-admin-border-width-focus: 1.5px;
    88     --wp-admin-border-width-focus: 1.5px;
    80   }
    89   }
    81 }
    90 }
    82 
    91 
    83 :root {
    92 :root {
       
    93   /*
       
    94    * Our classes uses the same values we set for gradient value attributes,
       
    95    * and we can not use spacing because of WP multi site kses rule.
       
    96    */
    84   /* stylelint-disable function-comma-space-after */
    97   /* stylelint-disable function-comma-space-after */
    85   /* stylelint-enable function-comma-space-after */
    98   /* stylelint-enable function-comma-space-after */
    86 }
    99   --wp--preset--font-size--normal: 16px;
    87 :root .has-pale-pink-background-color {
   100   --wp--preset--font-size--huge: 42px;
    88   background-color: #f78da7;
       
    89 }
       
    90 :root .has-vivid-red-background-color {
       
    91   background-color: #cf2e2e;
       
    92 }
       
    93 :root .has-luminous-vivid-orange-background-color {
       
    94   background-color: #ff6900;
       
    95 }
       
    96 :root .has-luminous-vivid-amber-background-color {
       
    97   background-color: #fcb900;
       
    98 }
       
    99 :root .has-light-green-cyan-background-color {
       
   100   background-color: #7bdcb5;
       
   101 }
       
   102 :root .has-vivid-green-cyan-background-color {
       
   103   background-color: #00d084;
       
   104 }
       
   105 :root .has-pale-cyan-blue-background-color {
       
   106   background-color: #8ed1fc;
       
   107 }
       
   108 :root .has-vivid-cyan-blue-background-color {
       
   109   background-color: #0693e3;
       
   110 }
       
   111 :root .has-vivid-purple-background-color {
       
   112   background-color: #9b51e0;
       
   113 }
       
   114 :root .has-white-background-color {
       
   115   background-color: #fff;
       
   116 }
   101 }
   117 :root .has-very-light-gray-background-color {
   102 :root .has-very-light-gray-background-color {
   118   background-color: #eee;
   103   background-color: #eee;
   119 }
   104 }
   120 :root .has-cyan-bluish-gray-background-color {
       
   121   background-color: #abb8c3;
       
   122 }
       
   123 :root .has-very-dark-gray-background-color {
   105 :root .has-very-dark-gray-background-color {
   124   background-color: #313131;
   106   background-color: #313131;
   125 }
   107 }
   126 :root .has-black-background-color {
       
   127   background-color: #000;
       
   128 }
       
   129 :root .has-pale-pink-color {
       
   130   color: #f78da7;
       
   131 }
       
   132 :root .has-vivid-red-color {
       
   133   color: #cf2e2e;
       
   134 }
       
   135 :root .has-luminous-vivid-orange-color {
       
   136   color: #ff6900;
       
   137 }
       
   138 :root .has-luminous-vivid-amber-color {
       
   139   color: #fcb900;
       
   140 }
       
   141 :root .has-light-green-cyan-color {
       
   142   color: #7bdcb5;
       
   143 }
       
   144 :root .has-vivid-green-cyan-color {
       
   145   color: #00d084;
       
   146 }
       
   147 :root .has-pale-cyan-blue-color {
       
   148   color: #8ed1fc;
       
   149 }
       
   150 :root .has-vivid-cyan-blue-color {
       
   151   color: #0693e3;
       
   152 }
       
   153 :root .has-vivid-purple-color {
       
   154   color: #9b51e0;
       
   155 }
       
   156 :root .has-white-color {
       
   157   color: #fff;
       
   158 }
       
   159 :root .has-very-light-gray-color {
   108 :root .has-very-light-gray-color {
   160   color: #eee;
   109   color: #eee;
   161 }
   110 }
   162 :root .has-cyan-bluish-gray-color {
       
   163   color: #abb8c3;
       
   164 }
       
   165 :root .has-very-dark-gray-color {
   111 :root .has-very-dark-gray-color {
   166   color: #313131;
   112   color: #313131;
   167 }
   113 }
   168 :root .has-black-color {
       
   169   color: #000;
       
   170 }
       
   171 :root .has-vivid-cyan-blue-to-vivid-purple-gradient-background {
       
   172   background: linear-gradient(-135deg, #0693e3 0%, #9b51e0 100%);
       
   173 }
       
   174 :root .has-vivid-green-cyan-to-vivid-cyan-blue-gradient-background {
   114 :root .has-vivid-green-cyan-to-vivid-cyan-blue-gradient-background {
   175   background: linear-gradient(-135deg, #00d084 0%, #0693e3 100%);
   115   background: linear-gradient(-135deg, #00d084 0%, #0693e3 100%);
   176 }
   116 }
   177 :root .has-light-green-cyan-to-vivid-green-cyan-gradient-background {
       
   178   background: linear-gradient(-135deg, #7adcb4 0%, #00d082 100%);
       
   179 }
       
   180 :root .has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background {
       
   181   background: linear-gradient(-135deg, #fcb900 0%, #ff6900 100%);
       
   182 }
       
   183 :root .has-luminous-vivid-orange-to-vivid-red-gradient-background {
       
   184   background: linear-gradient(-135deg, #ff6900 0%, #cf2e2e 100%);
       
   185 }
       
   186 :root .has-very-light-gray-to-cyan-bluish-gray-gradient-background {
       
   187   background: linear-gradient(-135deg, #eeeeee 0%, #a9b8c3 100%);
       
   188 }
       
   189 :root .has-cool-to-warm-spectrum-gradient-background {
       
   190   background: linear-gradient(-135deg, #4aeadc 0%, #9778d1 20%, #cf2aba 40%, #ee2c82 60%, #fb6962 80%, #fef84c 100%);
       
   191 }
       
   192 :root .has-blush-light-purple-gradient-background {
       
   193   background: linear-gradient(-135deg, #ffceec 0%, #9896f0 100%);
       
   194 }
       
   195 :root .has-blush-bordeaux-gradient-background {
       
   196   background: linear-gradient(-135deg, #fecda5 0%, #fe2d2d 50%, #6b003e 100%);
       
   197 }
       
   198 :root .has-purple-crush-gradient-background {
   117 :root .has-purple-crush-gradient-background {
   199   background: linear-gradient(-135deg, #34e2e4 0%, #4721fb 50%, #ab1dfe 100%);
   118   background: linear-gradient(-135deg, #34e2e4 0%, #4721fb 50%, #ab1dfe 100%);
   200 }
   119 }
   201 :root .has-luminous-dusk-gradient-background {
       
   202   background: linear-gradient(-135deg, #ffcb70 0%, #c751c0 50%, #4158d0 100%);
       
   203 }
       
   204 :root .has-hazy-dawn-gradient-background {
   120 :root .has-hazy-dawn-gradient-background {
   205   background: linear-gradient(-135deg, #faaca8 0%, #dad0ec 100%);
   121   background: linear-gradient(-135deg, #faaca8 0%, #dad0ec 100%);
   206 }
   122 }
   207 :root .has-pale-ocean-gradient-background {
       
   208   background: linear-gradient(-135deg, #fff5cb 0%, #b6e3d4 50%, #33a7b5 100%);
       
   209 }
       
   210 :root .has-electric-grass-gradient-background {
       
   211   background: linear-gradient(-135deg, #caf880 0%, #71ce7e 100%);
       
   212 }
       
   213 :root .has-subdued-olive-gradient-background {
   123 :root .has-subdued-olive-gradient-background {
   214   background: linear-gradient(-135deg, #fafae1 0%, #67a671 100%);
   124   background: linear-gradient(-135deg, #fafae1 0%, #67a671 100%);
   215 }
   125 }
   216 :root .has-atomic-cream-gradient-background {
   126 :root .has-atomic-cream-gradient-background {
   217   background: linear-gradient(-135deg, #fdd79a 0%, #004a59 100%);
   127   background: linear-gradient(-135deg, #fdd79a 0%, #004a59 100%);
   221 }
   131 }
   222 :root .has-midnight-gradient-background {
   132 :root .has-midnight-gradient-background {
   223   background: linear-gradient(-135deg, #020381 0%, #2874fc 100%);
   133   background: linear-gradient(-135deg, #020381 0%, #2874fc 100%);
   224 }
   134 }
   225 
   135 
   226 .has-small-font-size {
   136 .has-regular-font-size {
   227   font-size: 0.8125em;
   137   font-size: 1em;
   228 }
   138 }
   229 
   139 
   230 .has-regular-font-size,
   140 .has-larger-font-size {
       
   141   font-size: 2.625em;
       
   142 }
       
   143 
   231 .has-normal-font-size {
   144 .has-normal-font-size {
   232   font-size: 1em;
   145   font-size: var(--wp--preset--font-size--normal);
   233 }
   146 }
   234 
   147 
   235 .has-medium-font-size {
       
   236   font-size: 1.25em;
       
   237 }
       
   238 
       
   239 .has-large-font-size {
       
   240   font-size: 2.25em;
       
   241 }
       
   242 
       
   243 .has-larger-font-size,
       
   244 .has-huge-font-size {
   148 .has-huge-font-size {
   245   font-size: 2.625em;
   149   font-size: var(--wp--preset--font-size--huge);
   246 }
   150 }
   247 
   151 
   248 .has-text-align-center {
   152 .has-text-align-center {
   249   text-align: center;
   153   text-align: center;
   250 }
   154 }
   310   text-decoration: none;
   214   text-decoration: none;
   311   top: 5px;
   215   top: 5px;
   312   width: auto;
   216   width: auto;
   313   z-index: 100000;
   217   z-index: 100000;
   314 }
   218 }
       
   219 
       
   220 /**
       
   221  * The following provide a simple means of applying a default border style when
       
   222  * a user first makes a selection in the border block support panel.
       
   223  * This prevents issues such as where the user could set a border width
       
   224  * and see no border due there being no border style set.
       
   225  *
       
   226  * This is intended to be removed once intelligent defaults can be set while
       
   227  * making border selections via the block support.
       
   228  *
       
   229  * See: https://github.com/WordPress/gutenberg/pull/33743
       
   230  */
       
   231 html :where(.has-border-color) {
       
   232   border-style: solid;
       
   233 }
       
   234 
       
   235 html :where([style*="border-width"]) {
       
   236   border-style: solid;
       
   237 }
       
   238 
       
   239 /**
       
   240  * Provide baseline responsiveness for images.
       
   241  */
       
   242 html :where(img[class*="wp-image-"]) {
       
   243   height: auto;
       
   244   max-width: 100%;
       
   245 }