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; |
72 |
75 --wp-admin-border-width-focus: 2px; |
73 .block-directory-block-ratings { |
76 } |
74 display: flex; } |
77 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { |
75 .block-directory-block-ratings > div { |
78 :root { |
76 line-height: 1; |
79 --wp-admin-border-width-focus: 1.5px; |
77 display: flex; } |
80 } |
78 .block-directory-block-ratings .block-directory-block-ratings__rating-count { |
81 } |
79 color: #606a73; |
82 |
80 font-size: ms(-2); } |
83 .block-directory-block-ratings > span { |
81 .block-directory-block-ratings svg { |
84 display: flex; |
82 fill: #ffb900; } |
85 } |
|
86 .block-directory-block-ratings svg { |
|
87 fill: #1e1e1e; |
|
88 margin-right: -4px; |
|
89 } |
|
90 .block-directory-block-ratings .block-directory-block-ratings__star-empty { |
|
91 fill: #ccc; |
|
92 } |
83 |
93 |
84 .block-directory-compact-list { |
94 .block-directory-compact-list { |
85 margin: 0; |
95 margin: 0; |
86 list-style: none; } |
96 list-style: none; |
|
97 } |
87 |
98 |
88 .block-directory-compact-list__item { |
99 .block-directory-compact-list__item { |
89 display: flex; |
100 display: flex; |
90 flex-direction: row; |
101 flex-direction: row; |
91 align-items: center; |
102 align-items: center; |
92 margin-bottom: 16px; } |
103 margin-bottom: 16px; |
93 .block-directory-compact-list__item:last-child { |
104 } |
94 margin-bottom: 0; } |
105 .block-directory-compact-list__item:last-child { |
|
106 margin-bottom: 0; |
|
107 } |
95 |
108 |
96 .block-directory-compact-list__item-details { |
109 .block-directory-compact-list__item-details { |
97 margin-right: 8px; } |
110 margin-right: 8px; |
|
111 } |
98 |
112 |
99 .block-directory-compact-list__item-title { |
113 .block-directory-compact-list__item-title { |
100 font-weight: 500; } |
114 font-weight: 500; |
|
115 } |
101 |
116 |
102 .block-directory-compact-list__item-author { |
117 .block-directory-compact-list__item-author { |
103 color: #555d66; |
118 color: #757575; |
104 font-size: 11px; } |
119 font-size: 11px; |
105 |
120 } |
106 .block-directory-downloadable-block-author-info__content { |
|
107 color: #606a73; |
|
108 font-size: 12px; } |
|
109 |
|
110 .block-directory-downloadable-block-author-info__content-author { |
|
111 margin-bottom: 4px; |
|
112 font-size: 13px; } |
|
113 |
|
114 .block-directory-downloadable-block-header__row { |
|
115 display: flex; |
|
116 flex-grow: 1; } |
|
117 .block-directory-downloadable-block-header__row .block-directory-downloadable-block-header__column { |
|
118 display: flex; |
|
119 flex-direction: column; |
|
120 flex-grow: 1; |
|
121 padding-right: 12px; } |
|
122 |
|
123 .block-directory-downloadable-block-header__title { |
|
124 margin: 0; |
|
125 font-size: 13px; |
|
126 color: currentColor; } |
|
127 |
121 |
128 .block-directory-downloadable-block-icon { |
122 .block-directory-downloadable-block-icon { |
129 width: 36px; |
123 min-width: 54px; |
130 height: 36px; } |
124 width: 54px; |
131 .block-directory-downloadable-block-icon .block-editor-block-icon { |
125 height: 54px; |
132 width: 36px; |
126 vertical-align: middle; |
133 height: 36px; |
127 border: 1px solid #ddd; |
134 font-size: 36px; |
128 } |
135 background-color: #ddd; } |
129 |
136 |
130 .block-directory-downloadable-block-list-item { |
137 .block-directory-downloadable-block-info__content { |
131 padding: 12px; |
138 margin: 0 0 16px; |
132 width: 100%; |
139 font-size: 13px; } |
133 height: auto; |
140 |
134 text-align: right; |
141 .block-directory-downloadable-block-info__meta { |
135 display: grid; |
|
136 grid-template-columns: auto 1fr; |
|
137 } |
|
138 .block-directory-downloadable-block-list-item:hover { |
|
139 box-shadow: 0 0 0 2px var(--wp-admin-theme-color); |
|
140 } |
|
141 .block-directory-downloadable-block-list-item.is-busy { |
|
142 background: transparent; |
|
143 } |
|
144 .block-directory-downloadable-block-list-item.is-busy .block-directory-downloadable-block-list-item__author { |
|
145 border: 0; |
|
146 clip: rect(1px, 1px, 1px, 1px); |
|
147 -webkit-clip-path: inset(50%); |
|
148 clip-path: inset(50%); |
|
149 height: 1px; |
|
150 margin: -1px; |
|
151 overflow: hidden; |
|
152 padding: 0; |
|
153 position: absolute; |
|
154 width: 1px; |
|
155 word-wrap: normal !important; |
|
156 } |
|
157 .block-directory-downloadable-block-list-item:disabled, .block-directory-downloadable-block-list-item[aria-disabled] { |
|
158 opacity: 1; |
|
159 } |
|
160 |
|
161 .block-directory-downloadable-block-list-item__icon { |
|
162 position: relative; |
|
163 margin-left: 16px; |
|
164 align-self: flex-start; |
|
165 } |
|
166 .block-directory-downloadable-block-list-item__icon .block-directory-downloadable-block-list-item__spinner { |
|
167 position: absolute; |
|
168 top: 0; |
|
169 left: 0; |
|
170 bottom: 0; |
|
171 right: 0; |
|
172 background: rgba(255, 255, 255, 0.75); |
142 display: flex; |
173 display: flex; |
143 align-items: center; |
174 align-items: center; |
144 margin-bottom: 2px; |
|
145 color: #606a73; |
|
146 font-size: 12px; } |
|
147 |
|
148 .block-directory-downloadable-block-info__meta:last-child { |
|
149 margin-bottom: 0; } |
|
150 |
|
151 .block-directory-downloadable-block-info__icon { |
|
152 margin-left: 4px; |
|
153 fill: #606a73; } |
|
154 |
|
155 .block-directory-downloadable-block-list-item { |
|
156 width: 100%; |
|
157 padding: 0; |
|
158 margin: 0; |
|
159 display: flex; |
|
160 flex-direction: row; |
|
161 font-size: 13px; |
|
162 color: #32373c; |
|
163 align-items: flex-start; |
|
164 justify-content: center; |
175 justify-content: center; |
165 background: transparent; |
176 } |
166 word-break: break-word; |
177 |
167 border-top: 1px solid #ddd; |
178 .block-directory-block-ratings { |
168 border-bottom: 1px solid #ddd; |
179 display: block; |
169 transition: all 0.05s ease-in-out; |
180 margin-top: 4px; |
170 position: relative; |
181 } |
171 text-align: right; |
182 |
172 overflow: hidden; } |
183 .block-directory-downloadable-block-list-item__details { |
173 @media (prefers-reduced-motion: reduce) { |
184 color: #1e1e1e; |
174 .block-directory-downloadable-block-list-item { |
185 } |
175 transition-duration: 0s; } } |
186 |
176 .block-directory-downloadable-block-list-item + .block-directory-downloadable-block-list-item { |
187 .block-directory-downloadable-block-list-item__title { |
177 border-top: none; } |
188 display: block; |
178 |
189 font-weight: 600; |
179 .block-directory-downloadable-block-list-item:last-child:not(:only-of-type) { |
190 } |
180 border-top: 0; } |
191 |
181 |
192 .block-directory-downloadable-block-list-item__author { |
182 .block-directory-downloadable-block-list-item:last-child { |
193 display: block; |
183 border-bottom: 0; } |
194 margin-top: 4px; |
184 |
195 font-weight: normal; |
185 .block-directory-downloadable-block-list-item__panel { |
196 } |
186 display: flex; |
197 |
187 flex-grow: 1; |
198 .block-directory-downloadable-block-list-item__desc { |
188 flex-direction: column; } |
199 display: block; |
189 |
200 margin-top: 8px; |
190 .block-directory-downloadable-block-list-item__header { |
201 } |
191 display: flex; |
|
192 flex-direction: column; |
|
193 padding: 16px 16px 0; } |
|
194 |
|
195 .block-directory-downloadable-block-list-item__body { |
|
196 display: flex; |
|
197 flex-direction: column; |
|
198 padding: 16px; } |
|
199 |
|
200 .block-directory-downloadable-block-list-item__footer { |
|
201 display: flex; |
|
202 flex-direction: column; |
|
203 padding: 16px; |
|
204 background-color: #f0f0f0; } |
|
205 |
|
206 .block-directory-downloadable-block-list-item__content { |
|
207 color: #606a73; } |
|
208 |
202 |
209 .block-directory-downloadable-block-notice { |
203 .block-directory-downloadable-block-notice { |
210 margin: 0 0 16px; } |
204 margin: 8px 0 0; |
|
205 color: #cc1818; |
|
206 } |
211 |
207 |
212 .block-directory-downloadable-block-notice__content { |
208 .block-directory-downloadable-block-notice__content { |
213 padding-left: 12px; |
209 padding-left: 12px; |
214 margin-bottom: 8px; } |
210 margin-bottom: 8px; |
215 |
211 } |
216 .block-directory-downloadable-blocks-list { |
212 |
217 list-style: none; |
213 .block-directory-downloadable-blocks-panel { |
218 margin: 0; |
|
219 overflow: hidden; |
|
220 display: flex; |
|
221 flex-wrap: wrap; } |
|
222 |
|
223 .block-directory-downloadable-blocks-panel__description { |
|
224 font-style: italic; |
|
225 padding: 16px; |
214 padding: 16px; |
226 margin: 0; |
215 } |
227 text-align: right; |
216 .block-directory-downloadable-blocks-panel.has-blocks-loading { |
228 color: #606a73; } |
|
229 |
|
230 .block-directory-downloadable-blocks-panel__description.has-no-results { |
|
231 font-style: normal; |
217 font-style: normal; |
232 padding: 0; |
218 padding: 0; |
233 margin: 112px 0; |
219 margin: 112px 0; |
234 text-align: center; |
220 text-align: center; |
235 color: #606a73; } |
221 color: #757575; |
236 .block-directory-downloadable-blocks-panel__description.has-no-results .components-spinner { |
222 } |
237 float: inherit; } |
223 .block-directory-downloadable-blocks-panel.has-blocks-loading .components-spinner { |
|
224 float: inherit; |
|
225 } |
|
226 |
|
227 .block-directory-downloadable-blocks-panel__no-local { |
|
228 margin: 48px 0; |
|
229 padding: 0 64px; |
|
230 color: #757575; |
|
231 text-align: center; |
|
232 } |
|
233 |
|
234 .block-directory-downloadable-blocks-panel__title { |
|
235 margin: 0 0 4px; |
|
236 font-size: 14px; |
|
237 } |
|
238 |
|
239 .block-directory-downloadable-blocks-panel__description { |
|
240 margin-top: 0; |
|
241 } |
|
242 |
|
243 .block-directory-downloadable-blocks-panel button { |
|
244 margin-top: 4px; |
|
245 } |
238 |
246 |
239 .installed-blocks-pre-publish-panel__copy { |
247 .installed-blocks-pre-publish-panel__copy { |
240 margin-top: 0; } |
248 margin-top: 0; |
|
249 } |