wp/wp-includes/css/dist/list-reusable-blocks/style.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 /**
    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 {
    71 :root {
    69   --wp-admin-theme-color: #007cba;
    72   --wp-admin-theme-color: #007cba;
    70   --wp-admin-theme-color-darker-10: #006ba1;
    73   --wp-admin-theme-color-darker-10: #006ba1;
    71   --wp-admin-theme-color-darker-20: #005a87; }
    74   --wp-admin-theme-color-darker-20: #005a87;
       
    75   --wp-admin-border-width-focus: 2px;
       
    76 }
       
    77 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
       
    78   :root {
       
    79     --wp-admin-border-width-focus: 1.5px;
       
    80   }
       
    81 }
    72 
    82 
    73 .list-reusable-blocks-import-dropdown__content .components-popover__content > div {
    83 .list-reusable-blocks-import-dropdown__content .components-popover__content > div {
    74   padding: 10px; }
    84   padding: 10px;
       
    85 }
    75 
    86 
    76 .list-reusable-blocks-import-form__label {
    87 .list-reusable-blocks-import-form__label {
    77   display: block;
    88   display: block;
    78   margin-bottom: 10px; }
    89   margin-bottom: 10px;
       
    90 }
    79 
    91 
    80 .list-reusable-blocks-import-form__button {
    92 .list-reusable-blocks-import-form__button {
    81   margin-top: 20px;
    93   margin-top: 10px;
    82   float: right; }
    94   margin-bottom: 10px;
       
    95   float: right;
       
    96 }
    83 
    97 
    84 .list-reusable-blocks-import-form .components-notice__content {
    98 .list-reusable-blocks-import-form .components-notice__content {
    85   margin: 0; }
    99   margin: 0;
       
   100 }
       
   101 .list-reusable-blocks-import-form .components-notice.is-dismissible {
       
   102   padding-right: 0;
       
   103   margin: 5px 0;
       
   104 }
    86 
   105 
    87 .list-reusable-blocks__container {
   106 .list-reusable-blocks__container {
    88   display: inline-flex;
   107   display: inline-flex;
    89   align-items: center;
   108   align-items: center;
    90   position: relative;
   109   position: relative;
    91   top: -3px; }
   110   top: -3px;
    92   .list-reusable-blocks__container .components-button {
   111 }
    93     height: 26px; }
   112 .list-reusable-blocks__container .components-button {
       
   113   height: 26px;
       
   114 }
    94 
   115 
    95 body.admin-color-light {
   116 body.admin-color-light {
    96   --wp-admin-theme-color: #0085ba;
   117   --wp-admin-theme-color: #0085ba;
    97   --wp-admin-theme-color-darker-10: #0073a1;
   118   --wp-admin-theme-color-darker-10: #0073a1;
    98   --wp-admin-theme-color-darker-20: #006187; }
   119   --wp-admin-theme-color-darker-20: #006187;
       
   120   --wp-admin-border-width-focus: 2px;
       
   121 }
       
   122 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
       
   123   body.admin-color-light {
       
   124     --wp-admin-border-width-focus: 1.5px;
       
   125   }
       
   126 }
    99 
   127 
   100 body.admin-color-modern {
   128 body.admin-color-modern {
   101   --wp-admin-theme-color: #3858e9;
   129   --wp-admin-theme-color: #3858e9;
   102   --wp-admin-theme-color-darker-10: #2145e6;
   130   --wp-admin-theme-color-darker-10: #2145e6;
   103   --wp-admin-theme-color-darker-20: #183ad6; }
   131   --wp-admin-theme-color-darker-20: #183ad6;
       
   132   --wp-admin-border-width-focus: 2px;
       
   133 }
       
   134 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
       
   135   body.admin-color-modern {
       
   136     --wp-admin-border-width-focus: 1.5px;
       
   137   }
       
   138 }
   104 
   139 
   105 body.admin-color-blue {
   140 body.admin-color-blue {
   106   --wp-admin-theme-color: #096484;
   141   --wp-admin-theme-color: #096484;
   107   --wp-admin-theme-color-darker-10: #07526c;
   142   --wp-admin-theme-color-darker-10: #07526c;
   108   --wp-admin-theme-color-darker-20: #064054; }
   143   --wp-admin-theme-color-darker-20: #064054;
       
   144   --wp-admin-border-width-focus: 2px;
       
   145 }
       
   146 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
       
   147   body.admin-color-blue {
       
   148     --wp-admin-border-width-focus: 1.5px;
       
   149   }
       
   150 }
   109 
   151 
   110 body.admin-color-coffee {
   152 body.admin-color-coffee {
   111   --wp-admin-theme-color: #46403c;
   153   --wp-admin-theme-color: #46403c;
   112   --wp-admin-theme-color-darker-10: #383330;
   154   --wp-admin-theme-color-darker-10: #383330;
   113   --wp-admin-theme-color-darker-20: #2b2724; }
   155   --wp-admin-theme-color-darker-20: #2b2724;
       
   156   --wp-admin-border-width-focus: 2px;
       
   157 }
       
   158 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
       
   159   body.admin-color-coffee {
       
   160     --wp-admin-border-width-focus: 1.5px;
       
   161   }
       
   162 }
   114 
   163 
   115 body.admin-color-ectoplasm {
   164 body.admin-color-ectoplasm {
   116   --wp-admin-theme-color: #523f6d;
   165   --wp-admin-theme-color: #523f6d;
   117   --wp-admin-theme-color-darker-10: #46365d;
   166   --wp-admin-theme-color-darker-10: #46365d;
   118   --wp-admin-theme-color-darker-20: #3a2c4d; }
   167   --wp-admin-theme-color-darker-20: #3a2c4d;
       
   168   --wp-admin-border-width-focus: 2px;
       
   169 }
       
   170 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
       
   171   body.admin-color-ectoplasm {
       
   172     --wp-admin-border-width-focus: 1.5px;
       
   173   }
       
   174 }
   119 
   175 
   120 body.admin-color-midnight {
   176 body.admin-color-midnight {
   121   --wp-admin-theme-color: #e14d43;
   177   --wp-admin-theme-color: #e14d43;
   122   --wp-admin-theme-color-darker-10: #dd382d;
   178   --wp-admin-theme-color-darker-10: #dd382d;
   123   --wp-admin-theme-color-darker-20: #d02c21; }
   179   --wp-admin-theme-color-darker-20: #d02c21;
       
   180   --wp-admin-border-width-focus: 2px;
       
   181 }
       
   182 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
       
   183   body.admin-color-midnight {
       
   184     --wp-admin-border-width-focus: 1.5px;
       
   185   }
       
   186 }
   124 
   187 
   125 body.admin-color-ocean {
   188 body.admin-color-ocean {
   126   --wp-admin-theme-color: #627c83;
   189   --wp-admin-theme-color: #627c83;
   127   --wp-admin-theme-color-darker-10: #576e74;
   190   --wp-admin-theme-color-darker-10: #576e74;
   128   --wp-admin-theme-color-darker-20: #4c6066; }
   191   --wp-admin-theme-color-darker-20: #4c6066;
       
   192   --wp-admin-border-width-focus: 2px;
       
   193 }
       
   194 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
       
   195   body.admin-color-ocean {
       
   196     --wp-admin-border-width-focus: 1.5px;
       
   197   }
       
   198 }
   129 
   199 
   130 body.admin-color-sunrise {
   200 body.admin-color-sunrise {
   131   --wp-admin-theme-color: #dd823b;
   201   --wp-admin-theme-color: #dd823b;
   132   --wp-admin-theme-color-darker-10: #d97426;
   202   --wp-admin-theme-color-darker-10: #d97426;
   133   --wp-admin-theme-color-darker-20: #c36922; }
   203   --wp-admin-theme-color-darker-20: #c36922;
       
   204   --wp-admin-border-width-focus: 2px;
       
   205 }
       
   206 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
       
   207   body.admin-color-sunrise {
       
   208     --wp-admin-border-width-focus: 1.5px;
       
   209   }
       
   210 }