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 */ |
|
77 .wp-block-cover { |
|
78 /* Extra specificity needed because the reset.css applied in the editor context is overriding this rule. */ |
|
79 } |
|
80 .editor-styles-wrapper .wp-block-cover { |
|
81 box-sizing: border-box; |
|
82 } |
71 .wp-block-cover.is-placeholder { |
83 .wp-block-cover.is-placeholder { |
72 min-height: auto !important; |
84 min-height: auto !important; |
73 padding: 0 !important; |
85 padding: 0 !important; |
|
86 } |
|
87 .wp-block-cover.is-placeholder .block-library-cover__resize-container { |
|
88 display: none; |
|
89 } |
|
90 .wp-block-cover.is-placeholder .components-placeholder.is-large { |
|
91 min-height: 240px; |
|
92 justify-content: flex-start; |
|
93 z-index: 1; |
|
94 } |
|
95 .wp-block-cover.is-placeholder .components-placeholder.is-large + .block-library-cover__resize-container { |
|
96 min-height: 240px; |
|
97 display: block; |
74 } |
98 } |
75 .wp-block-cover.components-placeholder h2 { |
99 .wp-block-cover.components-placeholder h2 { |
76 color: inherit; |
100 color: inherit; |
77 } |
101 } |
78 .wp-block-cover.is-transient::before { |
102 .wp-block-cover.is-transient::before { |
113 position: absolute !important; |
137 position: absolute !important; |
114 top: 0; |
138 top: 0; |
115 right: 0; |
139 right: 0; |
116 left: 0; |
140 left: 0; |
117 bottom: 0; |
141 bottom: 0; |
|
142 min-height: 50px; |
118 } |
143 } |
119 |
144 |
120 .block-library-cover__resize-container:not(.is-resizing) { |
145 .block-library-cover__resize-container:not(.is-resizing) { |
121 height: auto !important; |
146 height: auto !important; |
122 } |
147 } |
123 |
148 |
124 .wp-block-cover > .components-drop-zone.is-active { |
|
125 transition: 0.2s opacity, 0.2s border; |
|
126 } |
|
127 @media (prefers-reduced-motion: reduce) { |
|
128 .wp-block-cover > .components-drop-zone.is-active { |
|
129 transition-duration: 0s; |
|
130 transition-delay: 0s; |
|
131 } |
|
132 } |
|
133 .wp-block-cover > .components-drop-zone.is-dragging-over-element { |
|
134 background-color: transparent; |
|
135 border: 48px solid var(--wp-admin-theme-color); |
|
136 } |
|
137 .wp-block-cover > .components-drop-zone.is-dragging-over-element .components-drop-zone__content { |
|
138 transform: none; |
|
139 } |
|
140 .wp-block-cover > .components-drop-zone .components-drop-zone__content { |
149 .wp-block-cover > .components-drop-zone .components-drop-zone__content { |
141 display: flex; |
150 opacity: 0.8 !important; |
142 align-items: center; |
|
143 top: -36px; |
|
144 right: -36px; |
|
145 transform: none; |
|
146 } |
|
147 .wp-block-cover > .components-drop-zone .components-drop-zone__content-icon, |
|
148 .wp-block-cover > .components-drop-zone .components-drop-zone__content-text { |
|
149 display: inline; |
|
150 } |
|
151 .wp-block-cover > .components-drop-zone .components-drop-zone__content-icon { |
|
152 margin: 0; |
|
153 margin-left: 8px; |
|
154 } |
|
155 .wp-block-cover > .components-drop-zone .components-drop-zone__content-text { |
|
156 font-size: 13px; |
|
157 } |
151 } |
158 |
152 |
159 .block-editor-block-patterns-list__list-item .has-parallax.wp-block-cover { |
153 .block-editor-block-patterns-list__list-item .has-parallax.wp-block-cover { |
160 background-attachment: scroll; |
154 background-attachment: scroll; |
161 } |
155 } |