66 * This is a WP-admin agnostic reset |
72 * This is a WP-admin agnostic reset |
67 */ |
73 */ |
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 .wp-block[data-align=center] > .wp-block-site-logo { |
77 .wp-block[data-align=center] > .wp-block-site-logo, |
|
78 .wp-block-site-logo.aligncenter > div { |
|
79 display: table; |
72 margin-right: auto; |
80 margin-right: auto; |
73 margin-left: auto; |
81 margin-left: auto; |
74 text-align: center; |
|
75 } |
82 } |
76 |
83 |
77 .wp-block-site-logo a { |
84 .wp-block-site-logo a { |
78 pointer-events: none; |
85 pointer-events: none; |
79 } |
|
80 .wp-block-site-logo:not(.is-default-size) { |
|
81 display: table; |
|
82 } |
|
83 .wp-block-site-logo.is-default-size { |
|
84 width: 120px; |
|
85 } |
|
86 .wp-block-site-logo.is-default-size img { |
|
87 width: 100%; |
|
88 } |
86 } |
89 .wp-block-site-logo .custom-logo-link { |
87 .wp-block-site-logo .custom-logo-link { |
90 cursor: inherit; |
88 cursor: inherit; |
91 } |
89 } |
92 .wp-block-site-logo .custom-logo-link:focus { |
90 .wp-block-site-logo .custom-logo-link:focus { |
95 .wp-block-site-logo .custom-logo-link.is-transient img { |
93 .wp-block-site-logo .custom-logo-link.is-transient img { |
96 opacity: 0.3; |
94 opacity: 0.3; |
97 } |
95 } |
98 .wp-block-site-logo img { |
96 .wp-block-site-logo img { |
99 display: block; |
97 display: block; |
|
98 height: auto; |
100 max-width: 100%; |
99 max-width: 100%; |
101 } |
100 } |
102 .wp-block-site-logo .components-placeholder { |
101 |
103 justify-content: flex-start; |
102 .wp-block-site-logo.wp-block-site-logo .components-placeholder, |
104 min-height: auto; |
103 .wp-block-site-logo.wp-block-site-logo .components-resizable-box__container { |
|
104 border-radius: inherit; |
|
105 } |
|
106 .wp-block-site-logo.wp-block-site-logo.is-default-size .components-placeholder { |
105 height: 120px; |
107 height: 120px; |
106 padding: 12px; |
108 width: 120px; |
107 } |
109 } |
108 .wp-block-site-logo .components-placeholder .components-placeholder__label { |
110 .wp-block-site-logo.wp-block-site-logo .components-placeholder { |
109 margin-top: 12px; |
111 display: flex; |
110 white-space: nowrap; |
112 justify-content: center; |
|
113 align-items: center; |
|
114 box-shadow: none; |
|
115 padding: 0; |
|
116 min-height: 48px; |
|
117 min-width: 48px; |
|
118 height: 100%; |
|
119 width: 100%; |
|
120 color: currentColor; |
|
121 background: transparent; |
111 } |
122 } |
112 .wp-block-site-logo .components-placeholder .components-placeholder__label .block-editor-block-icon, |
123 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-form-file-upload { |
113 .wp-block-site-logo .components-placeholder .components-placeholder__label > svg { |
|
114 margin-left: 4px; |
|
115 } |
|
116 .wp-block-site-logo .components-placeholder .components-form-file-upload { |
|
117 display: none; |
124 display: none; |
118 } |
125 } |
119 .wp-block-site-logo .components-placeholder .components-placeholder__preview { |
126 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-placeholder__preview { |
120 position: absolute; |
127 position: absolute; |
121 top: 4px; |
128 top: 4px; |
122 left: 4px; |
129 left: 4px; |
123 bottom: 4px; |
130 bottom: 4px; |
124 right: 4px; |
131 right: 4px; |
125 background: rgba(255, 255, 255, 0.8); |
132 background: rgba(255, 255, 255, 0.8); |
126 display: flex; |
133 display: flex; |
127 align-items: center; |
134 align-items: center; |
128 justify-content: center; |
135 justify-content: center; |
129 } |
136 } |
130 .wp-block-site-logo .components-placeholder .components-drop-zone__content-text { |
137 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-drop-zone__content-text { |
131 display: none; |
138 display: none; |
132 } |
139 } |
|
140 .wp-block-site-logo.wp-block-site-logo .components-placeholder::before { |
|
141 content: ""; |
|
142 display: block; |
|
143 position: absolute; |
|
144 top: 0; |
|
145 left: 0; |
|
146 bottom: 0; |
|
147 right: 0; |
|
148 border: 1px dashed currentColor; |
|
149 opacity: 0.4; |
|
150 pointer-events: none; |
|
151 border-radius: inherit; |
|
152 } |
|
153 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-placeholder__fieldset { |
|
154 width: auto; |
|
155 } |
|
156 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-button.components-button { |
|
157 color: inherit; |
|
158 padding: 0; |
|
159 display: flex; |
|
160 justify-content: center; |
|
161 align-items: center; |
|
162 width: 48px; |
|
163 height: 48px; |
|
164 border-radius: 50%; |
|
165 position: relative; |
|
166 visibility: hidden; |
|
167 background: transparent; |
|
168 transition: all 0.1s linear; |
|
169 } |
|
170 @media (prefers-reduced-motion: reduce) { |
|
171 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-button.components-button { |
|
172 transition-duration: 0s; |
|
173 transition-delay: 0s; |
|
174 } |
|
175 } |
|
176 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-button.components-button > svg { |
|
177 color: #fff; |
|
178 } |
|
179 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-placeholder__illustration { |
|
180 position: absolute; |
|
181 top: 0; |
|
182 left: 0; |
|
183 bottom: 0; |
|
184 right: 0; |
|
185 width: 100%; |
|
186 height: 100%; |
|
187 stroke: currentColor; |
|
188 stroke-dasharray: 3; |
|
189 opacity: 0.4; |
|
190 } |
|
191 .wp-block-site-logo.wp-block-site-logo.is-selected .components-button.components-button { |
|
192 background: var(--wp-admin-theme-color); |
|
193 border-color: var(--wp-admin-theme-color); |
|
194 border-style: solid; |
|
195 color: #fff; |
|
196 opacity: 1; |
|
197 visibility: visible; |
|
198 } |