PluginProbe ʕ •ᴥ•ʔ
WooCommerce / 8.1.0
WooCommerce v8.1.0
10.8.1 10.8.0 10.8.0-rc.1 10.8.0-beta.2 10.8.0-beta.1 7.8.0-beta.1 7.8.0-beta.2 7.8.0-rc.1 7.8.0-rc.2 7.8.1 7.8.2 7.8.3 7.8.4 7.9.0 7.9.0-beta.1 7.9.0-beta.2 7.9.0-rc.2 7.9.0-rc.3 7.9.1 7.9.2 8.0.0 8.0.0-beta.1 8.0.0-beta.2 8.0.0-rc.1 8.0.0-rc.2 8.0.1 8.0.2 8.0.3 8.0.4 8.0.5 8.1.0 8.1.0-beta.1 8.1.0-rc.1 8.1.0-rc.2 8.1.1 8.1.2 8.1.3 8.1.4 8.2.0 8.2.0-beta.1 8.2.0-rc.1 8.2.0-rc.2 8.2.1 8.2.2 8.2.3 8.2.4 8.2.5 8.3.0 8.3.0-beta.1 8.3.0-rc.1 8.3.0-rc.2 8.3.1 8.3.2 8.3.3 8.3.4 8.4.0 8.4.0-beta.1 8.4.0-rc.1 8.4.1 8.4.2 8.4.3 8.5.0 8.5.0-beta.1 8.5.0-rc.1 8.5.1 8.5.2 8.5.3 8.5.4 8.5.5 8.6.0 8.6.0-beta.1 8.6.0-rc.1 8.6.1 8.6.2 8.6.3 8.6.4 8.7.0 8.7.0-beta.1 8.7.0-beta.2 8.7.0-rc.1 8.7.1 8.7.2 8.7.3 8.8.0 8.8.0-beta.1 8.8.0-rc.1 8.8.1 8.8.2 8.8.3 8.8.4 8.8.5 8.8.6 8.8.7 8.9.0 8.9.0-beta.1 8.9.0-rc.1 8.9.1 8.9.2 8.9.3 8.9.4 8.9.5 9.0.0 9.0.0-beta.1 9.0.0-beta.2 9.0.0-rc.1 9.0.1 9.0.2 9.0.3 9.0.4 9.1.0 9.1.0-beta.1 9.1.0-rc.1 9.1.1 9.1.2 9.1.3 9.1.4 9.1.5 9.1.6 9.2.0 9.2.0-beta.1 9.2.0-rc.1 9.2.1 9.2.2 9.2.3 9.2.4 9.2.5 9.3.0 9.3.0-beta.1 9.3.0-rc.1 9.3.1 9.3.2 9.3.3 9.3.4 9.3.5 9.3.6 9.4.0 9.4.0-beta.1 9.4.0-beta.2 9.4.0-rc.1 9.4.0-rc.2 9.4.0-rc.3 9.4.0-rc.4 9.4.1 9.4.2 9.4.3 9.4.4 9.4.5 9.5.0 9.5.0-beta.1 9.5.0-beta.2 9.5.0-rc.1 9.5.1 9.5.2 9.5.3 9.5.4 9.6.0 9.6.0-beta.1 9.6.0-beta.2 9.6.0-rc.1 9.6.1 9.6.2 9.6.3 9.6.4 9.7.0 9.7.0-beta.1 9.7.0-rc.1 9.7.1 9.7.2 9.7.3 9.8.0 9.8.0-beta.1 9.8.0-rc.1 9.8.1 9.8.2 9.8.3 9.8.4 9.8.5 9.8.6 9.8.7 9.9.0 9.9.0-beta.1 9.9.0-rc.1 9.9.1 9.9.2 9.9.3 9.9.4 9.9.5 9.9.6 9.9.7 3.7.3 7.1.2 3.8.0 7.2.0 3.8.0-beta.1 7.2.0-beta.1 3.8.0-rc.1 7.2.0-beta.2 3.8.0-rc.2 7.2.0-rc.1 3.8.1 7.2.0-rc.2 3.8.2 7.2.1 3.8.3 7.2.2 3.9.0 7.2.3 3.9.0-beta.1 7.2.4 3.9.0-beta.2 7.3.0 3.9.0-rc.1 7.3.0-beta.1 3.9.0-rc.2 7.3.0-beta.2 3.9.0-rc.3 7.3.0-rc.1 3.9.0-rc.4 7.3.0-rc.2 3.9.1 7.3.1 3.9.2 7.4.0 3.9.3 7.4.0-beta.1 3.9.4 7.4.0-beta.2 3.9.5 7.4.0-rc.1 4.0.0 7.4.0-rc.2 4.0.0-beta.1 7.4.1 4.0.0-rc.1 7.4.2 4.0.0-rc.2 7.5.0 4.0.1 7.5.0-beta.1 4.0.2 7.5.0-beta.2 4.0.3 7.5.0-rc.1 4.0.4 7.5.1 4.1.0 7.5.2 4.1.0-beta.1 7.6.0 4.1.0-beta.2 7.6.0-beta.1 4.1.0-rc.1 7.6.0-beta.2 4.1.0-rc.2 7.6.0-rc.1 4.1.1 7.6.0-rc.2 4.1.2 7.6.0-rc.3 4.1.3 7.6.1 4.1.4 7.6.2 4.2.0 7.7.0 4.2.0-RC.1 7.7.0-beta.1 4.2.0-RC.2 7.7.0-beta.2 4.2.0-beta.1 7.7.0-rc.1 4.2.1 7.7.1 4.2.2 7.7.2 4.2.3 7.7.3 4.2.4 7.8.0 4.2.5 4.3.0 4.3.0-beta.1 4.3.0-rc.1 4.3.0-rc.2 4.3.0-rc.3 4.3.1 4.3.2 4.3.3 4.3.4 4.3.5 4.3.6 4.4.0 4.4.0-beta.1 4.4.0-rc.1 4.4.1 4.4.2 4.4.3 4.4.4 4.5.0 4.5.0-beta.1 4.5.0-rc.1 4.5.0-rc.3 4.5.1 4.5.2 4.5.3 4.5.4 4.5.5 4.6.0 4.6.0-beta.1 4.6.0-rc.1 4.6.1 4.6.2 4.6.3 4.6.4 4.6.5 4.7.0 4.7.0-beta.1 4.7.0-beta.2 4.7.0-rc.1 4.7.1 4.7.1-beta.1 4.7.2 4.7.3 4.7.4 4.8.0 4.8.0-beta.1 4.8.0-rc.1 4.8.0-rc.2 4.8.1 4.8.2 4.8.3 4.9.0 4.9.0-beta.1 4.9.0-rc.1 4.9.0-rc.2 4.9.1 4.9.2 4.9.3 4.9.4 4.9.5 5.0.0 5.0.0-beta.1 5.0.0-beta.2 5.0.0-rc.1 5.0.0-rc.2 5.0.0-rc.3 5.0.1 5.0.2 5.0.3 5.1.0 5.1.0-beta.1 5.1.0-rc.1 trunk 5.1.1 10.0.0 5.1.2 10.0.0-rc.1 5.1.3 10.0.0-rc.2 5.2.0 10.0.1 5.2.0-beta.1 10.0.2 5.2.0-rc.1 10.0.3 5.2.0-rc.2 10.0.4 5.2.1 10.0.5 5.2.2 10.0.6 5.2.3 10.1.0 5.2.4 10.1.0-rc.1 5.2.5 10.1.0-rc.2 5.3.0 10.1.0-rc.3 5.3.0-beta.1 10.1.0-rc.4 5.3.0-rc.1 10.1.1 5.3.0-rc.2 10.1.2 5.3.1 10.1.3 5.3.2 10.1.4 5.3.3 10.2.0 5.4.0 10.2.0-beta.1 5.4.0-beta.1 10.2.0-beta.2 5.4.0-rc.1 10.2.0-rc.1 5.4.1 10.2.1 5.4.2 10.2.2 5.4.3 10.2.3 5.4.4 10.2.4 5.4.5 10.3.0 5.5.0 10.3.0-beta.1 5.5.0-beta.1 10.3.0-beta.2 5.5.0-rc.1 10.3.0-rc.1 5.5.0-rc.2 10.3.0-rc.2 5.5.1 10.3.1 5.5.2 10.3.2 5.5.3 10.3.3 5.5.4 10.3.4 5.5.5 10.3.5 5.6.0 10.3.6 5.6.0-beta.1 10.3.7 5.6.0-rc.1 10.3.8 5.6.0-rc.2 10.4.0 5.6.1 10.4.0-beta.1 5.6.2 10.4.0-beta.2 5.6.3 10.4.0-rc.1 5.7.0 10.4.1 5.7.0-beta.1 10.4.2 5.7.0-rc.1 10.4.3 5.7.1 10.4.4 5.7.2 10.5.0 5.7.3 10.5.0-beta.1 5.8.0 10.5.0-beta.2 5.8.0-beta.1 10.5.0-rc.1 5.8.0-beta.2 10.5.0-rc.2 5.8.0-rc.1 10.5.0-rc.3 5.8.1 10.5.1 5.8.2 10.5.2 5.9.0 10.5.3 5.9.0-beta.1 10.6.0 5.9.0-rc.1 10.6.0-beta.1 5.9.0-rc.2 10.6.0-beta.2 5.9.1 10.6.0-rc.1 5.9.2 10.6.1 6.0.0 10.6.2 6.0.0-beta.1 10.7.0 6.0.0-rc.1 10.7.0-beta.1 6.0.1 10.7.0-beta.2 6.0.2 10.7.0-rc.1 6.1.0 3.0.0 6.1.0-beta.1 3.0.1 6.1.0-rc.1 3.0.2 6.1.0-rc.2 3.0.3 6.1.1 3.0.4 6.1.2 3.0.5 6.1.3 3.0.6 6.2.0 3.0.7 6.2.0-beta.1 3.0.8 6.2.0-rc.1 3.0.9 6.2.0-rc.2 3.1.0 6.2.1 3.1.1 6.2.2 3.1.2 6.2.3 3.2.0 6.3.0 3.2.1 6.3.0-beta.1 3.2.2 6.3.0-rc.1 3.2.3 6.3.0-rc.2 3.2.4 6.3.1 3.2.5 6.3.2 3.2.6 6.4.0 3.3.0 6.4.0-beta.1 3.3.1 6.4.0-rc.1 3.3.2 6.4.1 3.3.2-rc.1 6.4.2 3.3.3 6.5.0 3.3.4 6.5.0-beta.1 3.3.5 6.5.0-rc.1 3.3.6 6.5.0-rc.2 3.4.0 6.5.1 3.4.0-beta.1 6.5.2 3.4.0-rc.2 6.6.0 3.4.1 6.6.0-beta.1 3.4.2 6.6.0-rc.1 3.4.3 6.6.0-rc.2 3.4.4 6.6.1 3.4.5 6.6.2 3.4.6 6.7.0 3.4.7 6.7.0-beta.1 3.4.8 6.7.0-beta.2 3.5.0 6.7.0-rc.1 3.5.0-beta.1 6.7.1 3.5.0-rc.1 6.8.0 3.5.0-rc.2 6.8.0-beta.1 3.5.1 6.8.0-beta.2 3.5.10 6.8.0-rc.1 3.5.2 6.8.1 3.5.3 6.8.2 3.5.4 6.8.3 3.5.5 6.9.0 3.5.6 6.9.0-beta.1 3.5.7 6.9.0-beta.2 3.5.8 6.9.0-rc.1 3.5.9 6.9.1 3.6.0 6.9.2 3.6.0-beta.1 6.9.3 3.6.0-rc.1 6.9.4 3.6.0-rc.2 6.9.5 3.6.0-rc.3 7.0.0 3.6.1 7.0.0-beta.1 3.6.2 7.0.0-beta.2 3.6.3 7.0.0-beta.3 3.6.4 7.0.0-rc.1 3.6.5 7.0.0-rc.2 3.6.6 7.0.1 3.6.7 7.0.2 3.7.0 7.1.0 3.7.0-beta.1 7.1.0-beta.1 3.7.0-rc.1 7.1.0-beta.2 3.7.0-rc.2 7.1.0-rc.1 3.7.1 7.1.0-rc.2 3.7.2 7.1.1
woocommerce / assets / css / admin.scss
woocommerce / assets / css Last commit date
jquery-ui 5 years ago photoswipe 5 years ago _animation.scss 3 years ago _fonts.scss 3 years ago _mixins.scss 3 years ago _variables.scss 2 years ago activation-rtl.css 2 years ago activation.css 2 years ago activation.scss 2 years ago admin-rtl.css 2 years ago admin.css 2 years ago admin.scss 2 years ago auth-rtl.css 2 years ago auth.css 2 years ago auth.scss 2 years ago dashboard-rtl.css 2 years ago dashboard-setup-rtl.css 4 years ago dashboard-setup.css 4 years ago dashboard-setup.scss 3 years ago dashboard.css 2 years ago dashboard.scss 3 years ago helper-rtl.css 2 years ago helper.css 2 years ago helper.scss 2 years ago marketplace-suggestions-rtl.css 2 years ago marketplace-suggestions.css 2 years ago marketplace-suggestions.scss 3 years ago menu-rtl.css 2 years ago menu.css 2 years ago menu.scss 2 years ago network-order-widget-rtl.css 4 years ago network-order-widget.css 4 years ago network-order-widget.scss 3 years ago prettyPhoto-rtl.css 2 years ago prettyPhoto.css 2 years ago prettyPhoto.scss 3 years ago privacy-rtl.css 6 years ago privacy.css 6 years ago privacy.scss 3 years ago reports-print-rtl.css 3 years ago reports-print.css 3 years ago reports-print.scss 3 years ago select2.css 3 years ago select2.scss 3 years ago twenty-nineteen-rtl.css 3 years ago twenty-nineteen.css 3 years ago twenty-nineteen.scss 3 years ago twenty-seventeen-rtl.css 3 years ago twenty-seventeen.css 3 years ago twenty-seventeen.scss 3 years ago twenty-twenty-one-admin-rtl.css 5 years ago twenty-twenty-one-admin.css 5 years ago twenty-twenty-one-admin.scss 3 years ago twenty-twenty-one-rtl.css 3 years ago twenty-twenty-one.css 3 years ago twenty-twenty-one.scss 3 years ago twenty-twenty-rtl.css 3 years ago twenty-twenty-three-rtl.css 3 years ago twenty-twenty-three.css 3 years ago twenty-twenty-three.scss 3 years ago twenty-twenty-two-rtl.css 2 years ago twenty-twenty-two.css 2 years ago twenty-twenty-two.scss 3 years ago twenty-twenty.css 3 years ago twenty-twenty.scss 3 years ago wc-setup-rtl.css 2 years ago wc-setup.css 2 years ago wc-setup.scss 2 years ago woocommerce-blocktheme-rtl.css 2 years ago woocommerce-blocktheme.css 2 years ago woocommerce-blocktheme.scss 2 years ago woocommerce-layout-rtl.css 2 years ago woocommerce-layout.css 2 years ago woocommerce-layout.scss 3 years ago woocommerce-rtl.css 2 years ago woocommerce-smallscreen-rtl.css 2 years ago woocommerce-smallscreen.css 2 years ago woocommerce-smallscreen.scss 3 years ago woocommerce.css 2 years ago woocommerce.scss 3 years ago
admin.scss
7962 lines
1 /**
2 * admin.scss
3 * General WooCommerce admin styles. Settings, product data tabs, reports, etc.
4 */
5
6 /**
7 * Imports
8 */
9 @import "mixins";
10 @import "variables";
11 @import "animation";
12 @import "fonts";
13
14 /**
15 * Styling begins
16 */
17 .blockUI.blockOverlay {
18 @include loader();
19 }
20
21 .wc-addons-wrap {
22 .marketplace-header {
23 background-image: url(../images/marketplace-header-bg@2x.png);
24 background-position: right;
25 background-size: cover;
26 box-sizing: border-box;
27 display: flex;
28 flex-direction: column;
29 justify-content: center;
30 min-height: 216px;
31 padding: 24px 16px;
32 width: 100%;
33
34 &__title {
35 color: #fff;
36 font-size: 32px;
37 font-style: normal;
38 font-weight: 400;
39 line-height: 1.15;
40 margin-bottom: 8px;
41 padding: 0;
42 }
43
44 &__description {
45 color: #fff;
46 font-size: 16px;
47 line-height: 24px;
48 margin-bottom: 24px;
49 margin-top: 0;
50 }
51
52 &__search-form {
53 clear: both;
54 display: block;
55 max-width: 318px;
56 position: relative;
57
58 input {
59 border: 1px solid #ddd;
60 box-shadow: none;
61 font-size: 13px;
62 height: 48px;
63 padding-left: 16px;
64 padding-right: 50px;
65 width: 100%;
66 margin: 0;
67 }
68
69 button {
70 background: none;
71 border: none;
72 cursor: pointer;
73 height: 48px;
74 position: absolute;
75 right: 0;
76 width: 53px;
77 }
78 }
79 }
80
81 .top-bar {
82 background: #fff;
83 box-shadow: inset 0 -1px 0 #ccc;
84 display: block;
85 height: 60px;
86 margin: 0 0 16px;
87
88 @media only screen and (min-width: 768px) {
89 margin-bottom: 24px;
90 }
91 }
92
93 .current-section-dropdown {
94 background: #fff;
95 border: 1px solid #a7aaad;
96 margin-bottom: 20px;
97 position: relative;
98 width: 100%;
99
100 @media only screen and (min-width: 600px) {
101 width: 288px;
102 }
103
104 ul {
105 background: #fff;
106 border-radius: 2px;
107 display: none;
108 flex-direction: column;
109 justify-content: left;
110 left: 0;
111 margin: 0;
112 padding: 14px 0;
113 position: absolute;
114 top: 50px;
115 width: 100%;
116 z-index: 10;
117
118 @media only screen and (min-width: 600px) {
119 border: 1px solid #1e1e1e;
120 left: -1px;
121 top: 48px;
122 }
123
124 @media only screen and (min-width: 1100px) {
125 justify-content: center;
126 }
127
128 li {
129 font-size: 13px;
130 line-height: 16px;
131 margin: 0;
132
133 &.current a::after {
134 background-image: url(../images/icons/gridicons-checkmark.svg);
135 content: "";
136 display: block;
137 height: 20px;
138 position: absolute;
139 right: 20px;
140 top: 7px;
141 width: 20px;
142 }
143 }
144
145 a,
146 a:visited,
147 a:hover,
148 a:focus {
149 border: none;
150 box-shadow: none;
151 box-sizing: border-box;
152 color: #1e1e1e;
153 display: inline-block;
154 text-decoration: none;
155 outline: none;
156 padding: 14px 18px;
157 position: relative;
158 width: 100%;
159
160 @media only screen and (min-width: 600px) {
161 padding: 10px 18px;
162 }
163 }
164 }
165
166 &.wp-tour-kit-spotlit {
167 padding: 20px;
168 }
169 }
170
171 .current-section-name {
172 cursor: pointer;
173 font-size: 14px;
174 line-height: 24px;
175 padding: 12px 16px;
176 position: relative;
177 }
178
179 .current-section-name::after {
180 background-image: url(../images/icons/gridicons-chevron-down.svg);
181 background-size: contain;
182 content: "";
183 display: block;
184 height: 20px;
185 position: absolute;
186 right: 20px;
187 top: 16px;
188 width: 20px;
189 }
190
191 .current-section-dropdown.is-open {
192 ul {
193 display: flex;
194 }
195
196 .current-section-name::after {
197 transform: rotate(0.5turn);
198 }
199 }
200
201 .update-plugins .update-count {
202 background-color: var(--wp-admin-theme-color);
203 border-radius: 10px;
204 color: #fff;
205 display: inline-block;
206 font-size: 9px;
207 font-weight: 600;
208 line-height: 17px;
209 margin: 1px 0 0 4px;
210 padding: 0 6px;
211 vertical-align: text-top;
212 }
213
214 /**
215 * Marketplace related variables
216 */
217 $font-sf-pro-text: helveticaneue-light, "Helvetica Neue Light",
218 "Helvetica Neue", sans-serif;
219
220 $font-sf-pro-display: sans-serif;
221
222 h1.search-form-title {
223 clear: left;
224 font-size: 20px;
225 font-family: $font-sf-pro-display;
226 line-height: 1.2;
227 margin: 48px 0 12px;
228 padding: 0;
229 }
230
231 .addons-featured {
232 margin: 0;
233 }
234
235 ul.subsubsub.subsubsub {
236 margin: -2px 0 12px;
237 }
238
239 .subsubsub li::after {
240 content: "|";
241 }
242
243 .subsubsub li:last-child::after {
244 content: "";
245 }
246
247 .addons-button {
248 border-radius: 3px;
249 cursor: pointer;
250 display: block;
251 height: 37px;
252 line-height: 37px;
253 margin-top: 16px;
254 text-align: center;
255 text-decoration: none;
256 width: 124px;
257 }
258
259 .addons-wcs-banner-block {
260 align-items: center;
261 background: #fff;
262 border: 1px solid #ddd;
263 display: flex;
264 margin: 0 0 1em 0;
265 padding: 2em 2em 1em;
266 }
267
268 .addons-wcs-banner-block-image {
269 background: #f7f7f7;
270 border: 1px solid #e6e6e6;
271 margin-right: 2em;
272 padding: 4em;
273 max-width: 200px;
274
275 .addons-img {
276 max-height: 86px;
277 max-width: 97px;
278 }
279
280 &.is-full-image {
281 padding: 0;
282 background: none;
283 border: none;
284
285 .addons-img {
286 max-height: 100%;
287 max-width: 100%;
288 }
289 }
290 }
291
292 .addons-shipping-methods .addons-wcs-banner-block {
293 margin-left: 0;
294 margin-right: 0;
295 margin-top: 1em;
296 }
297
298 .addons-wcs-banner-block-content {
299 display: flex;
300 flex-direction: column;
301 justify-content: space-around;
302 align-self: stretch;
303 padding: 1em 0;
304
305 h1 {
306 padding-bottom: 0;
307 }
308
309 p {
310 margin-bottom: 0;
311 }
312
313 .wcs-logos-container {
314 display: flex;
315 align-items: center;
316 flex-direction: row;
317 justify-content: center;
318
319 @media screen and (min-width: 500px) {
320 justify-content: left;
321 }
322
323 li {
324 margin-right: 8px;
325
326 &:last-child {
327 margin-right: 0;
328 }
329 }
330 }
331
332 .wcs-service-logo {
333 max-width: 45px;
334 }
335 }
336
337 .addons-column {
338 flex: 1;
339 width: 50%;
340 padding: 0 0.5em;
341 }
342
343 .addons-column:nth-child(2) {
344 margin-right: 0;
345 }
346
347 .addons-small-dark-items {
348 display: flex;
349 flex-wrap: wrap;
350 justify-content: space-around;
351 }
352
353 .addons-small-dark-item {
354 margin: 0 0 20px;
355 }
356
357 .addons-small-dark-item-icon img {
358 height: 30px;
359 }
360
361 .addons-small-dark-item a {
362 margin: 28px auto 0;
363 }
364
365 .addons-button-solid {
366 background-color: #674399;
367 color: #fff;
368 }
369
370 .addons-button-promoted {
371 float: right;
372 width: auto;
373 padding: 0 20px;
374 margin-top: 0;
375 }
376
377 .addons-button-promoted:hover {
378 opacity: 0.8;
379 }
380
381 .addons-button-expandable {
382 display: inline-block;
383 padding: 0 16px;
384 width: auto;
385 }
386
387 .addons-button-solid:hover {
388 color: #fff;
389 opacity: 0.8;
390 }
391
392 .addons-button-outline-green {
393 border: 1px solid #73ae39;
394 color: #73ae39;
395 }
396
397 .addons-button-outline-green:hover {
398 color: #73ae39;
399 opacity: 0.8;
400 }
401
402 .addons-button-outline-purple {
403 border: 1px solid #674399;
404 color: #674399;
405 }
406
407 .addons-button-outline-purple:hover {
408 color: #674399;
409 opacity: 0.8;
410 }
411
412 .addons-button-outline-white {
413 border: 1px solid #fff;
414 color: #fff;
415 }
416
417 .addons-button-outline-white:hover {
418 color: #fff;
419 opacity: 0.8;
420 }
421
422 .addons-button-installed {
423 background: #e6e6e6;
424 color: #3c3c3c;
425 }
426
427 .addons-button-installed:hover {
428 color: #3c3c3c;
429 opacity: 0.8;
430 }
431
432 @media only screen and (max-width: 400px) {
433 .addons-button {
434 width: 100%;
435 }
436
437 .addons-small-dark-item {
438 width: 100%;
439 }
440 }
441
442 .marketplace-content-wrapper {
443 font-family: $font-sf-pro-text;
444 margin: 0 auto;
445 max-width: 1032px;
446 width: 100%;
447 }
448
449 .addon-product-group {
450 margin-bottom: 24px;
451
452 &.wp-tour-kit-spotlit {
453 padding: 20px;
454 }
455 }
456
457 .addon-product-group-title {
458 font-family: $font-sf-pro-display;
459 font-size: 20px;
460 font-weight: 400;
461 line-height: 24px;
462 margin: 0 0 4px;
463 }
464
465 .current-section-dropdown__title {
466 display: none;
467 font-family: $font-sf-pro-display;
468 }
469
470 .addon-product-group-description-container {
471 align-items: center;
472 display: flex;
473 flex-direction: row;
474 font-size: 14px;
475 justify-content: space-between;
476 line-height: 20px;
477
478 .addon-product-group-see-more,
479 .addon-product-group-see-more:visited {
480 color: var(--wp-admin-theme-color);
481 /* Primary / Blue */
482 display: block;
483 font-size: 13px;
484 text-decoration: none;
485 }
486 }
487
488 .products {
489 display: flex;
490 flex-flow: row;
491 flex-wrap: wrap;
492 font-weight: normal;
493 justify-content: space-between;
494 margin: 0;
495 max-width: 1032px;
496 overflow: hidden;
497
498 .product.addons-product-banner,
499 .product.addons-buttons-banner {
500 max-width: calc(100% - 2px);
501 }
502
503 @media screen and (min-width: 960px) {
504 // Adjust heading titles font for three-column product groups
505 &.addons-products-three-column li.product {
506 max-width: calc(33.33% - 12px);
507
508 h2,
509 h3 {
510 font-size: 16px;
511 }
512 }
513 }
514
515 li {
516 background: #fff;
517 border: 1px solid #dcdcde;
518 border-radius: 2px;
519 box-sizing: border-box;
520 display: flex;
521 flex: 1 0 auto;
522 flex-direction: column;
523 justify-content: space-between;
524 margin: 12px 0;
525 max-width: calc(50% - 12px);
526 min-width: 280px;
527 min-height: 220px;
528 overflow: hidden;
529 padding: 0;
530 vertical-align: top;
531
532 &.addons-full-width {
533 max-width: 100%;
534 }
535
536 @media only screen and (max-width: 768px) {
537 max-width: none;
538 width: 100%;
539 }
540
541 a {
542 text-decoration: none;
543 }
544
545 .product-details {
546 padding: 24px;
547 position: relative;
548
549 /* Display an image (product's icon) top right */
550 .product-img-wrap {
551 display: block;
552 margin-left: 24px;
553 position: absolute;
554 right: 24px;
555 top: 24px;
556
557 img {
558 border-radius: 3px;
559 display: block;
560 margin: 0;
561 max-width: 48px;
562 max-height: 48px;
563 }
564 }
565
566 /* Align aproduct-related banner image vertically centered */
567 &.addon-product-banner-details {
568 align-items: center;
569 display: flex;
570 flex-direction: row;
571 justify-content: space-between;
572
573 .product-img-wrap {
574 position: unset;
575
576 img {
577 max-width: 150px;
578 max-height: 150px;
579 }
580 }
581 }
582
583 h2,
584 h3 {
585 color: var(--wp-admin-theme-color);
586 font-size: 20px;
587 font-weight: 400;
588 letter-spacing: -0.32px;
589 line-height: 28px;
590 margin: 0 !important;
591 // Don't cover a product icon
592 max-width: calc(100% - 48px);
593 }
594
595 .addons-buttons-banner-details h2 {
596 color: #1d2327; // Gray / Gray 90
597 }
598
599 &.featured,
600 &.promoted {
601 .label {
602 align-items: center;
603 border-radius: 2px;
604 background: #dcdcde;
605 display: flex;
606 flex-direction: row;
607 height: 20px;
608 justify-content: flex-end;
609 margin-bottom: 8px;
610 max-width: 52px;
611 padding: 3px 12px;
612 top: 28px;
613 right: 24px;
614 text-align: center;
615
616 &.promoted {
617 float: right;
618 max-width: 58px;
619 }
620 }
621
622 h2 {
623 color: var(--wp-admin-theme-color);
624 }
625 }
626
627 p {
628 color: #2c3338;
629 font-size: 14px;
630 line-height: 20px;
631 margin: 14px 64px 0 0;
632 width: 100%;
633 }
634
635 .addons-buttons-banner-details p {
636 font-size: 14px;
637 margin-bottom: 14px;
638 max-width: none;
639 }
640
641 .product-developed-by {
642 color: #50575e;
643 /* Gray 60 */
644 font-size: 12px;
645 line-height: 20px;
646 margin-top: 4px;
647
648 .product-vendor-link {
649 color: #50575e;
650 /* Gray 60 */
651 }
652 }
653
654 .product-developed-by {
655 color: #50575e; // Gray 60
656 font-size: 12px;
657 font-family: sans-serif;
658 line-height: 20px;
659 margin-top: 4px;
660
661 .product-vendor-link {
662 color: #50575e; // Gray 60
663 }
664 }
665 }
666
667 .product-footer {
668 align-items: center;
669 border-top: 1px solid #dcdcde;
670 display: flex;
671 flex-direction: row;
672 justify-content: space-between;
673 padding: 24px;
674
675 .price {
676 font-size: 16px;
677 color: #1d2327;
678 }
679
680 .price-suffix {
681 color: #646970; // Gray 50
682 }
683
684 .product-reviews-block {
685 display: flex;
686 flex-direction: row;
687 margin-top: 4px;
688
689 .product-rating-star {
690 background-repeat: no-repeat;
691 background-size: contain;
692 height: 16px;
693 margin: 4px 4px 4px 0;
694 width: 17px;
695
696 &__fill {
697 background-image: url(../images/icons/star-golden.svg);
698 }
699
700 &__half-fill {
701 background-image: url(../images/icons/star-half-filled.svg);
702 }
703
704 &__no-fill {
705 background-image: url(../images/icons/star-gray.svg);
706 }
707 }
708
709 .product-reviews-count {
710 color: #646970; // Gray 50
711 font-size: 12px;
712 font-family: sans-serif;
713 line-height: 24px;
714 letter-spacing: -0.154px;
715 margin-left: 4px;
716 }
717 }
718
719 .button {
720 background-color: #fff;
721 border-color: var(--wp-admin-theme-color);
722 color: var(--wp-admin-theme-color);
723 float: right;
724 font-size: 13px;
725 height: 36px;
726 line-height: 30px;
727 padding: 2px 14px;
728 }
729 }
730 }
731
732 .product-footer-promoted {
733 align-items: flex-end;
734 display: flex;
735 justify-content: space-between;
736 padding: 24px;
737
738 .icon img {
739 border-radius: 4px;
740 width: 80px;
741 }
742 }
743
744 .addons-buttons-banner {
745 display: flex;
746 flex-direction: row;
747
748 .addons-buttons-banner-image {
749 background-repeat: no-repeat;
750 background-size: cover;
751 height: 190px;
752 margin: 24px;
753 width: 200px;
754 }
755
756 .addons-buttons-banner-details-container {
757 padding-left: 0;
758 width: calc(100% - 198px - 24px - 24px);
759 }
760
761 .addons-buttons-banner-details-container {
762 display: flex;
763 flex-direction: column;
764 justify-content: space-between;
765 }
766
767 .button.addons-buttons-banner-button,
768 .button.addons-buttons-banner-button:hover {
769 background: #fff;
770 border: 1.5px solid #624594;
771 color: #624594;
772 padding: 4px 12px;
773 margin-right: 16px;
774
775 &.addons-buttons-banner-button-primary {
776 background-color: #624594;
777 color: #fff;
778 }
779 }
780 }
781 }
782
783 .storefront {
784 max-width: 990px;
785 background: url(../images/storefront-bg.jpg) bottom right #f6f6f6;
786 border: 1px solid #ddd;
787 margin: 1em auto;
788 padding: 24px;
789 overflow: hidden;
790 zoom: 1;
791
792 img {
793 display: block;
794 width: 100%;
795 max-width: 400px;
796 height: auto;
797 margin: 0 auto 16px;
798 box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
799 }
800
801 p:last-of-type {
802 margin-bottom: 0;
803 }
804
805 p {
806 max-width: 750px;
807 }
808 }
809 }
810
811 .marketplace-header__tabs {
812 display: flex;
813 margin: 0;
814 }
815
816 .marketplace-header__tab {
817 display: flex;
818 flex: 1;
819 margin: 0;
820 }
821
822 .marketplace-header__tab-link {
823 align-items: center;
824 border-bottom: 2px solid transparent;
825 box-sizing: border-box;
826 display: flex;
827 font-size: 14px;
828 height: 60px;
829 justify-content: center;
830 line-height: 20px;
831 padding: 0 24px;
832 text-decoration: none;
833 width: 100%;
834
835 &.is-current {
836 border-bottom: 2px solid #1e1e1e;
837 color: #1e1e1e;
838 }
839 }
840
841 .no-touch,
842 .no-js {
843 .wc-addons-wrap {
844 .current-section-dropdown:hover {
845 ul {
846 display: flex;
847 }
848
849 .current-section-name::after {
850 transform: rotate(0.5turn);
851 }
852 }
853 }
854 }
855
856 .wc-subscriptions-wrap {
857 max-width: 1200px;
858
859 .update-plugins .update-count {
860 background-color: var(--wp-admin-theme-color);
861 border-radius: 10px;
862 color: #fff;
863 display: inline-block;
864 font-size: 9px;
865 font-weight: 600;
866 line-height: 17px;
867 margin: 1px 0 0 2px;
868 padding: 0 6px;
869 vertical-align: text-top;
870 }
871 }
872
873 .woocommerce-page-wc-marketplace {
874 .notice {
875 margin-left: 20px;
876 margin-right: 20px;
877 }
878
879 &.woocommerce-page {
880 .wrap {
881 margin-top: 32px;
882 }
883 }
884 }
885
886 .woocommerce-page-wc-subscriptions {
887 #wpbody-content {
888 .screen-reader-text + .notice {
889 margin-top: 32px;
890 }
891 }
892 }
893
894 .woocommerce-embed-page.woocommerce-page-wc-marketplace {
895 #screen-meta-links {
896 position: absolute;
897 right: 0;
898 }
899 }
900
901 .woocommerce-message,
902 .woocommerce-BlankState {
903 a.button-primary,
904 button.button-primary {
905 display: inline-block;
906 }
907 }
908
909 .woocommerce-message {
910 position: relative;
911 overflow: hidden;
912
913 &.updated {
914 border-left-color: var(--wp-admin-theme-color) !important;
915 }
916
917 a.skip,
918 a.docs {
919 text-decoration: none !important;
920 }
921
922 a.woocommerce-message-close {
923 position: static;
924 float: right;
925 padding: 0 15px 10px 28px;
926 margin-top: -10px;
927 font-size: 13px;
928 line-height: 1.23076923;
929 text-decoration: none;
930
931 &::before {
932 position: relative;
933 top: 18px;
934 left: -20px;
935 transition: all 0.1s ease-in-out;
936 }
937 }
938
939 .twitter-share-button {
940 margin-top: -3px;
941 margin-left: 3px;
942 vertical-align: middle;
943 }
944 }
945
946 #variable_product_options #message,
947 #inventory_product_data .notice,
948 #variable_product_options .notice {
949 display: flex;
950 margin: 10px;
951 background-color: #ffffff;
952 > p {
953 a {
954 text-decoration: none;
955 white-space: nowrap;
956 }
957 }
958 > p:not(:last-child) {
959 width: 85%;
960 }
961 .woocommerce-add-variation-price-container {
962 width: 15%;
963 display: flex;
964 justify-content: flex-end;
965 > button {
966 align-self: center;
967 }
968 }
969 }
970
971 .woocommerce-set-price-variations {
972 .woocommerce-usage-modal__wrapper {
973 .woocommerce-usage-modal__message {
974 height: 60px;
975 flex-wrap: wrap;
976 display: flex;
977 > span {
978 padding-bottom: 16px;
979 }
980 }
981 .woocommerce-usage-modal__actions {
982 display: flex;
983 justify-content: flex-end;
984 margin-top: 20px;
985 > button {
986 margin-left: 16px;
987 width: 88px;
988 display: unset;
989 }
990 }
991 }
992 }
993
994 /**
995 * Variations related variables
996 */
997 $container-height: 360px;
998 $max-content-width: 544px;
999 $default-font-size: 14px;
1000 $default-line-height: 18px;
1001
1002 #variable_product_options {
1003 .form-row select {
1004 max-width: 100%;
1005 }
1006
1007 .variation_actions {
1008 max-width: 131px;
1009 }
1010
1011 .toolbar-top {
1012 .button,
1013 .select {
1014 margin: 1px;
1015 }
1016 }
1017
1018 %container-defaults {
1019 box-sizing: border-box;
1020 display: flex;
1021 padding: 32px 0;
1022 height: $container-height;
1023 }
1024
1025 %centered-text {
1026 width: 90%;
1027 max-width: $max-content-width;
1028 font-size: $default-font-size;
1029 line-height: $default-line-height;
1030 text-align: center;
1031 }
1032
1033 .add-attributes-container {
1034 @extend %container-defaults;
1035 align-items: center;
1036
1037 a {
1038 text-decoration: none;
1039
1040 &[target="_blank"]="_blank""]::after {
1041 content: url("../images/icons/external-link.svg");
1042 margin-left: 2px;
1043 vertical-align: sub;
1044 }
1045 }
1046
1047 .add-attributes-message {
1048 display: flex;
1049 flex-direction: column;
1050 align-items: center;
1051 gap: 24px;
1052 width: 100%;
1053
1054 p {
1055 @extend %centered-text;
1056 }
1057 }
1058 }
1059
1060 #variable_product_options_inner {
1061 > .toolbar:not(.expand-close-hidden) {
1062 border-bottom: 1px solid #eee;
1063 }
1064 .add-variation-container {
1065 display: none;
1066 }
1067
1068 &.no-variations {
1069 > .toolbar:not(.expand-close-hidden) {
1070 border-bottom: none;
1071 }
1072 .add-variation-container {
1073 display: flex;
1074 @extend %container-defaults;
1075 flex-direction: column;
1076 justify-content: center;
1077 align-items: center;
1078 gap: 24px;
1079 position: relative;
1080
1081 .arrow-image-wrapper {
1082 position: absolute;
1083 top: 10px;
1084 left: 87px;
1085 }
1086
1087 p {
1088 @extend %centered-text;
1089 }
1090 }
1091 }
1092 }
1093 }
1094
1095 #product_attributes {
1096 .add-global-attribute-container {
1097 display: flex;
1098 flex-direction: column;
1099 height: 360px;
1100
1101 &.hidden {
1102 display: none;
1103 }
1104
1105 .message {
1106 box-sizing: border-box;
1107 display: flex;
1108 flex-direction: column;
1109 justify-content: center;
1110 align-items: center;
1111 padding: 32px 0px;
1112 gap: 24px;
1113 flex: 1;
1114 @media screen and (max-width: 782px) {
1115 button {
1116 vertical-align: top;
1117 }
1118 }
1119 p {
1120 width: 90%;
1121 max-width: 544px;
1122 font-size: 14px;
1123 line-height: 18px;
1124 text-align: center;
1125 }
1126 }
1127 }
1128 .toolbar-top {
1129 .button,
1130 .select2-container {
1131 margin: 1px;
1132 }
1133 }
1134 .select2-container {
1135 min-width: 190px;
1136 }
1137 }
1138 #select2-attribute_taxonomy-results {
1139 .select2-results__option,
1140 .select2-results__group {
1141 margin: 0;
1142 padding: 8px 4px;
1143 }
1144 }
1145
1146 .clear {
1147 clear: both;
1148 }
1149
1150 .wrap.woocommerce div.updated,
1151 .wrap.woocommerce div.error {
1152 margin-top: 10px;
1153 }
1154
1155 mark.amount {
1156 background: transparent none;
1157 color: inherit;
1158 }
1159
1160 /**
1161 * Help Tip
1162 */
1163 .woocommerce-help-tip,
1164 .woocommerce-product-type-tip {
1165 color: #666;
1166 display: inline-block;
1167 font-size: 1.1em;
1168 font-style: normal;
1169 height: 16px;
1170 line-height: 16px;
1171 position: relative;
1172 vertical-align: middle;
1173 width: 16px;
1174
1175 &::after {
1176 @include icon_dashicons("\f223");
1177 cursor: help;
1178 }
1179 }
1180
1181 .wc-wp-version-gte-53 {
1182 .woocommerce-help-tip,
1183 .woocommerce-product-type-tip {
1184 font-size: 1.2em;
1185 cursor: help;
1186 }
1187 }
1188
1189 h2 .woocommerce-help-tip,
1190 .woocommerce-product-type-tip {
1191 margin-top: -5px;
1192 margin-left: 0.25em;
1193 }
1194
1195 table.wc_status_table {
1196 margin-bottom: 1em;
1197
1198 h2 {
1199 font-size: 14px;
1200 margin: 0;
1201 }
1202
1203 tr:nth-child(2n) {
1204 th,
1205 td {
1206 background: #fcfcfc;
1207 }
1208 }
1209
1210 th {
1211 font-weight: 700;
1212 padding: 9px;
1213 }
1214
1215 td:first-child {
1216 width: 33%;
1217 }
1218
1219 td.help {
1220 width: 1em;
1221 }
1222
1223 td,
1224 th {
1225 font-size: 1.1em;
1226 font-weight: normal;
1227
1228 &.run-tool {
1229 text-align: right;
1230 }
1231
1232 strong.name {
1233 display: block;
1234 margin-bottom: 0.5em;
1235 }
1236
1237 @include table-marks();
1238
1239 mark.error,
1240 .red {
1241 color: $red;
1242 }
1243
1244 ul {
1245 margin: 0;
1246 }
1247 }
1248
1249 .help_tip {
1250 cursor: help;
1251 }
1252 }
1253
1254 table.wp-list-table.urls {
1255 td,
1256 th {
1257 @include table-marks();
1258 }
1259 }
1260
1261 table.wc_status_table--tools {
1262 td,
1263 th {
1264 padding: 2em;
1265 }
1266 }
1267
1268 .taxonomy-product_cat {
1269 .check-column .woocommerce-help-tip {
1270 font-size: 1.5em;
1271 margin: -3px 0 0 5px;
1272 display: block;
1273 position: absolute;
1274 }
1275 }
1276
1277 #debug-report {
1278 display: none;
1279 margin: 10px 0;
1280 padding: 0;
1281 position: relative;
1282
1283 textarea {
1284 font-family: monospace;
1285 width: 100%;
1286 margin: 0;
1287 height: 300px;
1288 padding: 20px;
1289 border-radius: 0;
1290 resize: none;
1291 font-size: 12px;
1292 line-height: 20px;
1293 outline: 0;
1294 }
1295 }
1296
1297 /**
1298 * DB log viewer
1299 */
1300 .wp-list-table.logs {
1301 .log-level {
1302 display: inline;
1303 padding: 0.2em 0.6em 0.3em;
1304 font-size: 80%;
1305 font-weight: bold;
1306 line-height: 1;
1307 color: #fff;
1308 text-align: center;
1309 white-space: nowrap;
1310 vertical-align: baseline;
1311 border-radius: 0.2em;
1312
1313 &:empty {
1314 display: none;
1315 }
1316 }
1317
1318 /**
1319 * Add color to levels
1320 *
1321 * Descending severity:
1322 * emergency, alert -> red
1323 * critical, error -> orange
1324 * warning, notice -> yellow
1325 * info -> blue
1326 * debug -> gree
1327 */
1328
1329 .log-level--emergency,
1330 .log-level--alert {
1331 background-color: #ff4136;
1332 }
1333
1334 .log-level--critical,
1335 .log-level--error {
1336 background-color: #ff851b;
1337 }
1338
1339 .log-level--warning,
1340 .log-level--notice {
1341 color: #222;
1342 background-color: #ffdc00;
1343 }
1344
1345 .log-level--info {
1346 background-color: #0074d9;
1347 }
1348
1349 .log-level--debug {
1350 background-color: #3d9970;
1351 }
1352
1353 // Adjust log table columns only when table is not collapsed
1354 @media screen and (min-width: 783px) {
1355 .column-timestamp {
1356 width: 18%;
1357 }
1358
1359 .column-level {
1360 width: 14%;
1361 }
1362
1363 .column-source {
1364 width: 15%;
1365 }
1366 }
1367 }
1368
1369 #log-viewer-select {
1370 padding: 10px 0 8px;
1371 line-height: 28px;
1372
1373 h2 a {
1374 vertical-align: middle;
1375 }
1376 }
1377
1378 #log-viewer {
1379 background: #fff;
1380 border: 1px solid #e5e5e5;
1381 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1382 padding: 5px 20px;
1383
1384 pre {
1385 font-family: monospace;
1386 white-space: pre-wrap;
1387 word-wrap: break-word;
1388 }
1389 }
1390
1391 .inline-edit-product.quick-edit-row {
1392 .inline-edit-col-center,
1393 .inline-edit-col-right {
1394 float: right !important;
1395 }
1396 }
1397
1398 #woocommerce-fields.inline-edit-col {
1399 clear: left;
1400
1401 label.featured,
1402 label.manage_stock {
1403 margin-left: 10px;
1404 }
1405
1406 label.stock_status_field {
1407 clear: both;
1408 float: left;
1409 }
1410
1411 .dimensions div {
1412 display: block;
1413 margin: 0.2em 0;
1414
1415 span.title {
1416 display: block;
1417 float: left;
1418 width: 5em;
1419 }
1420
1421 span.input-text-wrap {
1422 display: block;
1423 margin-left: 5em;
1424 }
1425 }
1426
1427 .text {
1428 box-sizing: border-box;
1429 width: 99%;
1430 float: left;
1431 margin: 1px 1% 1px 1px;
1432 }
1433
1434 .length,
1435 .width,
1436 .height {
1437 width: 32.33%;
1438 }
1439
1440 .height {
1441 margin-right: 0;
1442 }
1443 }
1444
1445 #woocommerce-fields-bulk.inline-edit-col {
1446 label {
1447 clear: left;
1448 }
1449
1450 .inline-edit-group {
1451 label {
1452 clear: none;
1453 width: 49%;
1454 margin: 0.2em 0;
1455 }
1456
1457 &.dimensions label {
1458 width: 75%;
1459 max-width: 75%;
1460 }
1461 }
1462
1463 .regular_price,
1464 .sale_price,
1465 .weight,
1466 .stock,
1467 .length {
1468 box-sizing: border-box;
1469 width: 100%;
1470 margin-left: 4.4em;
1471 }
1472
1473 .length,
1474 .width,
1475 .height {
1476 box-sizing: border-box;
1477 width: 25%;
1478 }
1479 }
1480
1481 .column-coupon_code {
1482 line-height: 2.25em;
1483 }
1484
1485 ul.wc_coupon_list,
1486 .column-coupon_code {
1487 margin: 0;
1488 overflow: hidden;
1489 zoom: 1;
1490 clear: both;
1491 }
1492
1493 ul.wc_coupon_list {
1494 padding-bottom: 5px;
1495
1496 li {
1497 margin: 0;
1498
1499 &.code {
1500 display: inline-block;
1501 position: relative;
1502 padding: 0 0.5em;
1503 background-color: #fff;
1504 border: 1px solid #aaa;
1505 -webkit-box-shadow: 0 1px 0 #dfdfdf;
1506 box-shadow: 0 1px 0 #dfdfdf;
1507
1508 border-radius: 4px;
1509 margin-right: 5px;
1510 margin-top: 5px;
1511
1512 &.editable {
1513 padding-right: 2em;
1514 }
1515
1516 .tips {
1517 cursor: pointer;
1518
1519 span {
1520 color: #888;
1521
1522 &:hover {
1523 color: #000;
1524 }
1525 }
1526 }
1527
1528 .remove-coupon {
1529 text-decoration: none;
1530 color: #888;
1531 position: absolute;
1532 top: 7px;
1533 right: 20px;
1534
1535 /*rtl:raw:
1536 left: 7px;
1537 */
1538
1539 &::before {
1540 @include icon_dashicons("\f158");
1541 }
1542
1543 &:hover::before {
1544 color: $red;
1545 }
1546 }
1547 }
1548 }
1549 }
1550
1551 ul.wc_coupon_list_block {
1552 margin: 0;
1553 padding-bottom: 2px;
1554
1555 li {
1556 border-top: 1px solid #fff;
1557 border-bottom: 1px solid #ccc;
1558 line-height: 2.5em;
1559 margin: 0;
1560 padding: 0.5em 0;
1561 }
1562
1563 li:first-child {
1564 border-top: 0;
1565 padding-top: 0;
1566 }
1567
1568 li:last-child {
1569 border-bottom: 0;
1570 padding-bottom: 0;
1571 }
1572 }
1573
1574 .button.wc-reload {
1575 @include ir();
1576 padding: 0;
1577 height: 28px;
1578 width: 28px !important;
1579 display: inline-block;
1580
1581 &::after {
1582 @include icon_dashicons("\f345");
1583 line-height: 28px;
1584 }
1585 }
1586
1587 #woocommerce-order-data {
1588 .postbox-header,
1589 .hndle,
1590 .handlediv {
1591 display: none;
1592 }
1593
1594 .inside {
1595 display: block !important;
1596 }
1597 }
1598
1599 #order_data {
1600 padding: 23px 24px 12px;
1601
1602 h2 {
1603 margin: 0;
1604 font-family: "HelveticaNeue-Light", "Helvetica Neue Light",
1605 "Helvetica Neue", sans-serif;
1606 font-size: 21px;
1607 font-weight: normal;
1608 line-height: 1.2;
1609 text-shadow: 1px 1px 1px white;
1610 padding: 0;
1611 }
1612
1613 h3 {
1614 font-size: 14px;
1615 }
1616
1617 h3,
1618 h4 {
1619 color: #333;
1620 margin: 1.33em 0 0;
1621 }
1622
1623 p {
1624 color: #777;
1625 }
1626
1627 p.order_number {
1628 margin: 0;
1629 font-family: "HelveticaNeue-Light", "Helvetica Neue Light",
1630 "Helvetica Neue", sans-serif;
1631 font-weight: normal;
1632 line-height: 1.6em;
1633 font-size: 16px;
1634 }
1635
1636 .order_data_column_container {
1637 clear: both;
1638
1639 p._billing_email_field {
1640 margin-top: 13px;
1641 }
1642 }
1643
1644 .order_data_column {
1645 width: 32%;
1646 padding: 0 2% 0 0;
1647 float: left;
1648
1649 > h3 span {
1650 display: block;
1651 }
1652
1653 &:last-child {
1654 padding-right: 0;
1655 }
1656
1657 p {
1658 padding: 0 !important;
1659 }
1660
1661 .address strong {
1662 display: block;
1663 }
1664
1665 .form-field {
1666 float: left;
1667 clear: left;
1668 width: 48%;
1669 padding: 0;
1670 margin: 9px 0 0;
1671
1672 label {
1673 display: block;
1674 padding: 0 0 3px;
1675 }
1676
1677 input,
1678 textarea {
1679 width: 100%;
1680 }
1681
1682 select {
1683 width: 100%;
1684 max-width: 100%;
1685 }
1686
1687 .select2-container {
1688 width: 100% !important;
1689 }
1690
1691 .date-picker {
1692 width: 50%;
1693 }
1694
1695 .hour,
1696 .minute {
1697 width: 3.5em;
1698 }
1699
1700 small {
1701 display: block;
1702 margin: 5px 0 0;
1703 color: #999;
1704 }
1705 }
1706
1707 .form-field.last,
1708 ._billing_last_name_field,
1709 ._billing_address_2_field,
1710 ._billing_postcode_field,
1711 ._billing_state_field,
1712 ._billing_phone_field,
1713 ._shipping_last_name_field,
1714 ._shipping_address_2_field,
1715 ._shipping_postcode_field,
1716 ._shipping_state_field {
1717 float: right;
1718 clear: right;
1719 }
1720
1721 .form-field-wide,
1722 ._billing_company_field,
1723 ._shipping_company_field,
1724 ._transaction_id_field {
1725 width: 100%;
1726 clear: both;
1727
1728 input,
1729 textarea,
1730 select,
1731 .wc-enhanced-select,
1732 .wc-category-search,
1733 .wc-customer-search {
1734 width: 100%;
1735 }
1736 }
1737
1738 p.none_set {
1739 color: #999;
1740 }
1741
1742 div.edit_address {
1743 display: none;
1744 zoom: 1;
1745 padding-right: 1px;
1746
1747 .select2-container {
1748 .select2-selection--single {
1749 height: 32px;
1750
1751 .select2-selection__rendered {
1752 line-height: 32px;
1753 }
1754 }
1755 }
1756 }
1757
1758 .wc-customer-user,
1759 .wc-order-status {
1760 label a {
1761 float: right;
1762 margin-left: 8px;
1763 }
1764 }
1765
1766 a.edit_address {
1767 width: 14px;
1768 height: 0;
1769 padding: 14px 0 0;
1770 margin: 0 0 0 6px;
1771 overflow: hidden;
1772 position: relative;
1773 color: #999;
1774 border: 0;
1775 float: right;
1776
1777 &:hover,
1778 &:focus {
1779 color: #000;
1780 }
1781
1782 &::after {
1783 font-family: "WooCommerce";
1784 position: absolute;
1785 top: 0;
1786 left: 0;
1787 text-align: center;
1788 vertical-align: top;
1789 line-height: 14px;
1790 font-size: 14px;
1791 font-weight: 400;
1792 }
1793 }
1794
1795 a.edit_address::after {
1796 font-family: "Dashicons";
1797 content: "\f464";
1798 }
1799
1800 .billing-same-as-shipping,
1801 .load_customer_shipping,
1802 .load_customer_billing {
1803 font-size: 13px;
1804 display: inline-block;
1805 font-weight: normal;
1806 }
1807
1808 .load_customer_shipping {
1809 margin-right: 0.3em;
1810 }
1811 }
1812 }
1813
1814 .order_actions {
1815 margin: 0;
1816 overflow: hidden;
1817 zoom: 1;
1818
1819 li {
1820 border-top: 1px solid #fff;
1821 border-bottom: 1px solid #ddd;
1822 padding: 6px 0;
1823 margin: 0;
1824 line-height: 1.6em;
1825 float: left;
1826 width: 50%;
1827 text-align: center;
1828
1829 a {
1830 float: none;
1831 text-align: center;
1832 text-decoration: underline;
1833 }
1834
1835 &.wide {
1836 width: auto;
1837 float: none;
1838 clear: both;
1839 padding: 6px;
1840 text-align: left;
1841 overflow: hidden;
1842 }
1843
1844 #delete-action {
1845 line-height: 25px;
1846 vertical-align: middle;
1847 text-align: left;
1848 float: left;
1849 }
1850
1851 .save_order {
1852 float: right;
1853 }
1854
1855 &#actions {
1856 overflow: hidden;
1857
1858 .button {
1859 width: 24px;
1860 box-sizing: border-box;
1861 float: right;
1862 }
1863
1864 select {
1865 width: 225px;
1866 box-sizing: border-box;
1867 float: left;
1868 }
1869 }
1870 }
1871 }
1872
1873 #woocommerce-order-items {
1874 .inside {
1875 margin: 0;
1876 padding: 0;
1877 background: #fefefe;
1878 }
1879
1880 .wc-order-data-row {
1881 border-bottom: 1px solid #dfdfdf;
1882 padding: 1.5em 2em;
1883 background: #f8f8f8;
1884
1885 @include clearfix();
1886 line-height: 2em;
1887 text-align: right;
1888
1889 p {
1890 margin: 0;
1891 line-height: 2em;
1892 }
1893
1894 .wc-used-coupons {
1895 text-align: left;
1896
1897 .tips {
1898 display: inline-block;
1899 }
1900 }
1901 }
1902
1903 .wc-used-coupons {
1904 float: left;
1905 width: 50%;
1906 }
1907
1908 .wc-order-totals {
1909 float: right;
1910 width: 50%;
1911 margin: 0;
1912 padding: 0;
1913 text-align: right;
1914
1915 .amount {
1916 font-weight: 700;
1917 }
1918
1919 .label {
1920 vertical-align: top;
1921 }
1922
1923 .total {
1924 font-size: 1em !important;
1925 width: 10em;
1926 margin: 0 0 0 0.5em;
1927 box-sizing: border-box;
1928
1929 input[type="text"]="text""] {
1930 width: 96%;
1931 float: right;
1932 }
1933 }
1934
1935 .refunded-total {
1936 color: $red;
1937 }
1938
1939 .label-highlight {
1940 font-weight: bold;
1941 }
1942 }
1943
1944 .refund-actions {
1945 margin-top: 5px;
1946 padding-top: 12px;
1947 border-top: 1px solid #dfdfdf;
1948
1949 .button {
1950 float: right;
1951 margin-left: 4px;
1952 }
1953
1954 .cancel-action {
1955 float: left;
1956 margin-left: 0;
1957 }
1958 }
1959
1960 .add_meta {
1961 margin-left: 0 !important;
1962 }
1963
1964 h3 small {
1965 color: #999;
1966 }
1967
1968 .amount {
1969 white-space: nowrap;
1970 }
1971
1972 .add-items {
1973 .description {
1974 margin-right: 10px;
1975 }
1976
1977 .button {
1978 float: left;
1979 margin-right: 0.25em;
1980 }
1981
1982 .button-primary {
1983 float: none;
1984 margin-right: 0;
1985 }
1986 }
1987 }
1988
1989 #woocommerce-order-items {
1990 .inside {
1991 display: block !important;
1992 }
1993
1994 .postbox-header,
1995 .hndle,
1996 .handlediv {
1997 display: none;
1998 }
1999
2000 .woocommerce_order_items_wrapper {
2001 margin: 0;
2002 overflow-x: auto;
2003
2004 table.woocommerce_order_items {
2005 width: 100%;
2006 background: #fff;
2007
2008 thead th {
2009 text-align: left;
2010 padding: 1em;
2011 font-weight: normal;
2012 color: #999;
2013 background: #f8f8f8;
2014 -webkit-touch-callout: none;
2015 -webkit-user-select: none;
2016 -khtml-user-select: none;
2017 -moz-user-select: none;
2018 -ms-user-select: none;
2019 user-select: none;
2020
2021 &.sortable {
2022 cursor: pointer;
2023 }
2024
2025 &:last-child {
2026 padding-right: 2em;
2027 }
2028
2029 &:first-child {
2030 padding-left: 2em;
2031 }
2032
2033 .wc-arrow {
2034 float: right;
2035 position: relative;
2036 margin-right: -1em;
2037 }
2038 }
2039
2040 tbody th,
2041 td {
2042 padding: 1.5em 1em 1em;
2043 text-align: left;
2044 line-height: 1.5em;
2045 vertical-align: top;
2046 border-bottom: 1px solid #f8f8f8;
2047
2048 textarea {
2049 width: 100%;
2050 }
2051
2052 select {
2053 width: 50%;
2054 }
2055
2056 input,
2057 textarea {
2058 font-size: 14px;
2059 padding: 4px;
2060 color: #555;
2061 }
2062
2063 &:last-child {
2064 padding-right: 2em;
2065 }
2066
2067 &:first-child {
2068 padding-left: 2em;
2069 }
2070 }
2071
2072 tbody tr:last-child td {
2073 border-bottom: 1px solid #dfdfdf;
2074 }
2075
2076 tbody tr:first-child td {
2077 border-top: 8px solid #f8f8f8;
2078 }
2079
2080 tbody#order_line_items tr:first-child td {
2081 border-top: none;
2082 }
2083
2084 td.thumb {
2085 text-align: left;
2086 width: 38px;
2087 padding-bottom: 1.5em;
2088
2089 .wc-order-item-thumbnail {
2090 width: 38px;
2091 height: 38px;
2092 border: 2px solid #e8e8e8;
2093 background: #f8f8f8;
2094 color: #ccc;
2095 position: relative;
2096 font-size: 21px;
2097 display: block;
2098 text-align: center;
2099
2100 &:empty::before {
2101 @include icon_dashicons("\f128");
2102 width: 38px;
2103 line-height: 38px;
2104 display: block;
2105 }
2106
2107 img {
2108 width: 100%;
2109 height: 100%;
2110 margin: 0;
2111 padding: 0;
2112 position: relative;
2113 }
2114 }
2115 }
2116
2117 td.name {
2118 .wc-order-item-sku,
2119 .wc-order-item-variation {
2120 display: block;
2121 margin-top: 0.5em;
2122 font-size: 0.92em !important;
2123 color: #888;
2124 }
2125 }
2126
2127 .item {
2128 min-width: 200px;
2129 }
2130
2131 .center,
2132 .variation-id {
2133 text-align: center;
2134 }
2135
2136 .cost,
2137 .tax,
2138 .quantity,
2139 .line_cost,
2140 .line_tax,
2141 .tax_class,
2142 .item_cost {
2143 text-align: right;
2144
2145 label {
2146 white-space: nowrap;
2147 color: #999;
2148 font-size: 0.833em;
2149
2150 input {
2151 display: inline;
2152 }
2153 }
2154
2155 input {
2156 width: 70px;
2157 vertical-align: middle;
2158 text-align: right;
2159 }
2160
2161 select {
2162 width: 85px;
2163 height: 26px;
2164 vertical-align: middle;
2165 font-size: 1em;
2166 }
2167
2168 .split-input {
2169 display: inline-block;
2170 background: #fff;
2171 border: 1px solid #ddd;
2172 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07);
2173 margin: 1px 0;
2174 min-width: 80px;
2175 overflow: hidden;
2176 line-height: 1em;
2177 text-align: right;
2178
2179 div.input {
2180 width: 100%;
2181 box-sizing: border-box;
2182
2183 label {
2184 font-size: 0.75em;
2185 padding: 4px 6px 0;
2186 color: #555;
2187 display: block;
2188 }
2189
2190 input {
2191 width: 100%;
2192 box-sizing: border-box;
2193 border: 0;
2194 box-shadow: none;
2195 margin: 0;
2196 padding: 0 6px 4px;
2197 color: #555;
2198 background: transparent;
2199
2200 &::-webkit-input-placeholder {
2201 color: #ddd;
2202 }
2203 }
2204 }
2205
2206 div.input:first-child {
2207 border-bottom: 1px dashed #ddd;
2208 background: #fff;
2209
2210 label {
2211 color: #ccc;
2212 }
2213
2214 input {
2215 color: #ccc;
2216 }
2217 }
2218 }
2219
2220 .view {
2221 white-space: nowrap;
2222 }
2223
2224 .edit {
2225 text-align: left;
2226 }
2227
2228 small.times,
2229 del,
2230 .wc-order-item-taxes,
2231 .wc-order-item-discount,
2232 .wc-order-item-refund-fields {
2233 font-size: 0.92em !important;
2234 color: #888;
2235 }
2236
2237 .wc-order-item-taxes,
2238 .wc-order-item-refund-fields {
2239 margin: 0;
2240
2241 label {
2242 display: block;
2243 }
2244 }
2245
2246 .wc-order-item-discount {
2247 display: block;
2248 margin-top: 0.5em;
2249 }
2250
2251 small.times {
2252 margin-right: 0.25em;
2253 }
2254 }
2255
2256 .quantity {
2257 text-align: center;
2258
2259 input {
2260 text-align: center;
2261 width: 50px;
2262 }
2263 }
2264
2265 span.subtotal {
2266 opacity: 0.5;
2267 }
2268
2269 td.tax_class,
2270 th.tax_class {
2271 text-align: left;
2272 }
2273
2274 .calculated {
2275 border-color: #ae8ca2;
2276 border-style: dotted;
2277 }
2278
2279 table.meta {
2280 width: 100%;
2281 }
2282
2283 table.meta,
2284 table.display_meta {
2285 margin: 0.5em 0 0;
2286 font-size: 0.92em !important;
2287 color: #888;
2288
2289 tr {
2290 th {
2291 border: 0;
2292 padding: 0 4px 0.5em 0;
2293 line-height: 1.5em;
2294 width: 20%;
2295 }
2296
2297 td {
2298 padding: 0 4px 0.5em 0;
2299 border: 0;
2300 line-height: 1.5em;
2301
2302 input {
2303 width: 100%;
2304 margin: 0;
2305 position: relative;
2306 border-bottom: 0;
2307 box-shadow: none;
2308 }
2309
2310 textarea {
2311 width: 100%;
2312 height: 4em;
2313 margin: 0;
2314 box-shadow: none;
2315 }
2316
2317 input:focus + textarea {
2318 border-top-color: #999;
2319 }
2320
2321 p {
2322 margin: 0 0 0.5em;
2323 line-height: 1.5em;
2324 }
2325
2326 p:last-child {
2327 margin: 0;
2328 }
2329 }
2330 }
2331 }
2332
2333 .refund_by {
2334 border-bottom: 1px dotted #999;
2335 }
2336
2337 tr.fee .thumb div {
2338 @include ir();
2339 font-size: 1.5em;
2340 line-height: 1em;
2341 vertical-align: middle;
2342 margin: 0 auto;
2343
2344 &::before {
2345 @include icon("\e007");
2346 color: #ccc;
2347 }
2348 }
2349
2350 tr.refund .thumb div {
2351 @include ir();
2352 font-size: 1.5em;
2353 line-height: 1em;
2354 vertical-align: middle;
2355 margin: 0 auto;
2356
2357 &::before {
2358 @include icon("\e014");
2359 color: #ccc;
2360 }
2361 }
2362
2363 tr.shipping {
2364 .thumb div {
2365 @include ir();
2366 font-size: 1.5em;
2367 line-height: 1em;
2368 vertical-align: middle;
2369 margin: 0 auto;
2370
2371 &::before {
2372 @include icon("\e01a");
2373 color: #ccc;
2374 }
2375 }
2376
2377 .shipping_method_name,
2378 .shipping_method {
2379 width: 100%;
2380 margin: 0 0 0.5em;
2381 }
2382 }
2383
2384 th.line_tax {
2385 white-space: nowrap;
2386 }
2387
2388 th.line_tax,
2389 td.line_tax {
2390 .delete-order-tax {
2391 @include ir();
2392 float: right;
2393 font-size: 14px;
2394 visibility: hidden;
2395 margin: 3px -18px 0 0;
2396
2397 &::before {
2398 @include icon_dashicons("\f153");
2399 color: #999;
2400 }
2401
2402 &:hover::before {
2403 color: $red;
2404 }
2405 }
2406
2407 &:hover .delete-order-tax {
2408 visibility: visible;
2409 }
2410 }
2411
2412 small.refunded {
2413 display: block;
2414 color: $red;
2415 white-space: nowrap;
2416 margin-top: 0.5em;
2417
2418 &::before {
2419 @include icon_dashicons("\f171");
2420 position: relative;
2421 top: auto;
2422 left: auto;
2423 margin: -1px 4px 0 0;
2424 vertical-align: middle;
2425 line-height: 1em;
2426 }
2427 }
2428 }
2429 }
2430
2431 .wc-order-edit-line-item {
2432 padding-left: 0;
2433 }
2434
2435 .wc-order-edit-line-item-actions {
2436 width: 44px;
2437 text-align: right;
2438 padding-left: 0;
2439 vertical-align: middle;
2440
2441 a {
2442 color: #ccc;
2443 display: inline-block;
2444 cursor: pointer;
2445 padding: 0 0 0.5em;
2446 margin: 0 0 0 12px;
2447 vertical-align: middle;
2448 text-decoration: none;
2449 line-height: 16px;
2450 width: 16px;
2451 overflow: hidden;
2452
2453 &::before {
2454 margin: 0;
2455 padding: 0;
2456 font-size: 16px;
2457 width: 16px;
2458 height: 16px;
2459 }
2460
2461 &:hover {
2462 &::before {
2463 color: #999;
2464 }
2465 }
2466
2467 &:first-child {
2468 margin-left: 0;
2469 }
2470 }
2471
2472 .edit-order-item::before {
2473 @include icon_dashicons("\f464");
2474 position: relative;
2475 }
2476
2477 .delete-order-item,
2478 .delete_refund {
2479 &::before {
2480 @include icon_dashicons("\f158");
2481 position: relative;
2482 }
2483
2484 &:hover::before {
2485 color: $red;
2486 }
2487 }
2488 }
2489
2490 tbody tr .wc-order-edit-line-item-actions {
2491 visibility: hidden;
2492 }
2493
2494 tbody tr:hover .wc-order-edit-line-item-actions {
2495 visibility: visible;
2496 }
2497
2498 .wc-order-totals .wc-order-edit-line-item-actions {
2499 width: 1.5em;
2500 visibility: visible !important;
2501
2502 a {
2503 padding: 0;
2504 }
2505 }
2506 }
2507
2508 #woocommerce-order-downloads {
2509 .buttons {
2510 float: left;
2511 padding: 0;
2512 margin: 0;
2513 vertical-align: top;
2514
2515 .add_item_id,
2516 .select2-container {
2517 width: 400px !important;
2518 margin-right: 9px;
2519 vertical-align: top;
2520 float: left;
2521 }
2522
2523 button {
2524 margin: 2px 0 0;
2525 }
2526 }
2527
2528 h3 small {
2529 color: #999;
2530 }
2531 }
2532
2533 #side-sortables #woocommerce-order-downloads {
2534 .buttons,
2535 .select2-container {
2536 max-width: 100%;
2537 }
2538 }
2539
2540 #poststuff #woocommerce-order-actions .inside {
2541 margin: 0;
2542 padding: 0;
2543
2544 ul.order_actions li {
2545 padding: 6px 10px;
2546 box-sizing: border-box;
2547
2548 &:last-child {
2549 border-bottom: 0;
2550 }
2551 }
2552
2553 button {
2554 margin: 1px;
2555 }
2556 }
2557
2558 #poststuff #woocommerce-order-notes .inside {
2559 margin: 0;
2560 padding: 0;
2561
2562 ul.order_notes li {
2563 padding: 0 10px;
2564 }
2565
2566 button {
2567 margin: 1px;
2568 vertical-align: top;
2569 }
2570 }
2571
2572 #woocommerce_customers {
2573 p.search-box {
2574 margin: 6px 0 4px;
2575 float: left;
2576 }
2577
2578 .tablenav {
2579 float: right;
2580 clear: none;
2581 }
2582 }
2583
2584 .widefat {
2585 &.customers td {
2586 vertical-align: middle;
2587 padding: 4px 7px;
2588 }
2589
2590 .column-order_title {
2591 width: 15%;
2592
2593 time {
2594 display: block;
2595 color: #999;
2596 margin: 3px 0;
2597 }
2598 }
2599
2600 .column-orders,
2601 .column-paying,
2602 .column-spent {
2603 text-align: center;
2604 width: 8%;
2605 }
2606
2607 .column-last_order {
2608 width: 11%;
2609 }
2610
2611 .column-wc_actions {
2612 width: 110px;
2613
2614 a.button {
2615 @include ir();
2616 display: inline-block;
2617 margin: 2px 4px 2px 0;
2618 padding: 0 !important;
2619 height: 2em !important;
2620 width: 2em;
2621 overflow: hidden;
2622 vertical-align: middle;
2623
2624 &::after {
2625 font-family: "Dashicons";
2626 speak: never;
2627 font-weight: normal;
2628 font-variant: normal;
2629 text-transform: none;
2630 margin: 0;
2631 text-indent: 0;
2632 position: absolute;
2633 top: 0;
2634 left: 0;
2635 width: 100%;
2636 height: 100%;
2637 text-align: center;
2638 line-height: 1.85;
2639 }
2640
2641 img {
2642 display: block;
2643 width: 12px;
2644 height: auto;
2645 }
2646 }
2647
2648 a.edit::after {
2649 content: "\f464";
2650 }
2651
2652 a.link::after {
2653 font-family: "WooCommerce";
2654 content: "\e00d";
2655 }
2656
2657 a.view::after {
2658 content: "\f177";
2659 }
2660
2661 a.refresh::after {
2662 font-family: "WooCommerce";
2663 content: "\e031";
2664 }
2665
2666 a.processing::after {
2667 font-family: "WooCommerce";
2668 content: "\e00f";
2669 }
2670
2671 a.complete::after {
2672 content: "\f147";
2673 }
2674 }
2675
2676 small.meta {
2677 display: block;
2678 color: #999;
2679 font-size: inherit;
2680 margin: 3px 0;
2681 }
2682 }
2683
2684 .wc-wp-version-gte-53 {
2685 .widefat {
2686 .column-wc_actions {
2687 a.button {
2688 &::after {
2689 margin-top: 2px;
2690 }
2691 }
2692 }
2693 }
2694 }
2695
2696 .woocommerce_page_wc-orders,
2697 .post-type-shop_order {
2698 .tablenav .one-page .displaying-num {
2699 display: none;
2700 }
2701
2702 .tablenav {
2703 .select2-selection--single {
2704 height: 32px;
2705
2706 .select2-selection__rendered {
2707 line-height: 29px;
2708 }
2709
2710 .select2-selection__arrow {
2711 height: 30px;
2712 }
2713 }
2714
2715 #order-query-submit {
2716 margin: 0 8px 0 0;
2717 }
2718 }
2719
2720 .wp-list-table {
2721 margin-top: 1em;
2722
2723 thead,
2724 tfoot {
2725 th {
2726 padding: 0.75em 1em;
2727 }
2728
2729 th.sortable a,
2730 th.sorted a {
2731 padding: 0;
2732 }
2733
2734 th:first-child {
2735 padding-left: 2em;
2736 }
2737
2738 th:last-child {
2739 padding-right: 2em;
2740 }
2741 }
2742
2743 tbody {
2744 td,
2745 th {
2746 padding: 1em;
2747 line-height: 26px;
2748 }
2749
2750 td:first-child {
2751 padding-left: 2em;
2752 }
2753
2754 td:last-child {
2755 padding-right: 2em;
2756 }
2757 }
2758
2759 tbody tr {
2760 border-top: 1px solid #f5f5f5;
2761 }
2762
2763 tbody tr:hover:not(.status-trash):not(.no-link) td {
2764 cursor: pointer;
2765 }
2766
2767 .no-link {
2768 cursor: default !important;
2769 }
2770
2771 // Columns.
2772 td,
2773 th {
2774 width: 12ch;
2775 vertical-align: middle;
2776
2777 p {
2778 margin: 0;
2779 }
2780 }
2781
2782 .check-column {
2783 width: 1px;
2784 white-space: nowrap;
2785 padding: 1em 1em 1em 1em !important;
2786 vertical-align: middle;
2787
2788 .locked-indicator {
2789 margin-left: 0;
2790 }
2791
2792 input {
2793 vertical-align: text-top;
2794 margin: 1px 0;
2795 }
2796 }
2797
2798 .column-order_number {
2799 width: 20ch;
2800 }
2801
2802 .column-order_total {
2803 width: 8ch;
2804 text-align: right;
2805
2806 a span {
2807 float: right;
2808 }
2809 }
2810
2811 .column-order_date,
2812 .column-order_status {
2813 width: 10ch;
2814 }
2815
2816 .column-order_status {
2817 width: 14ch;
2818 }
2819
2820 .column-shipping_address,
2821 .column-billing_address {
2822 width: 20ch;
2823 line-height: 1.5em;
2824
2825 .description {
2826 display: block;
2827 color: #999;
2828 }
2829 }
2830
2831 .column-wc_actions {
2832 text-align: right;
2833
2834 a.button {
2835 text-indent: 9999px;
2836 margin: 2px 0 2px 4px;
2837 }
2838 }
2839
2840 .order-preview {
2841 float: right;
2842 width: 16px;
2843 padding: 20px 4px 4px 4px;
2844 height: 0;
2845 overflow: hidden;
2846 position: relative;
2847 border: 2px solid transparent;
2848 border-radius: 4px;
2849
2850 &::before {
2851 @include icon("\e010");
2852 line-height: 16px;
2853 font-size: 14px;
2854 vertical-align: middle;
2855 top: 4px;
2856 }
2857
2858 &:hover {
2859 border: 2px solid var(--wp-admin-theme-color);
2860 }
2861 }
2862
2863 .order-preview.disabled {
2864 &::before {
2865 content: "";
2866 background: url("../images/wpspin-2x.gif") no-repeat center top;
2867 background-size: 71%;
2868 }
2869 }
2870 }
2871 }
2872
2873 .woocommerce_page_wc-orders .wp-list-table .locked-indicator-icon {
2874 margin-left: -2px;
2875
2876 &:before {
2877 vertical-align: top;
2878 }
2879 }
2880
2881 .order-status {
2882 display: inline-flex;
2883 line-height: 2.5em;
2884 color: #777;
2885 background: #e5e5e5;
2886 border-radius: 4px;
2887 border-bottom: 1px solid rgba(0, 0, 0, 0.05);
2888 margin: -0.25em 0;
2889 cursor: inherit !important;
2890 white-space: nowrap;
2891 max-width: 100%;
2892
2893 &.status-completed {
2894 background: #c8d7e1;
2895 color: #2e4453;
2896 }
2897
2898 &.status-on-hold {
2899 background: #f8dda7;
2900 color: #94660c;
2901 }
2902
2903 &.status-failed {
2904 background: #eba3a3;
2905 color: #761919;
2906 }
2907
2908 &.status-processing {
2909 background: #c6e1c6;
2910 color: #5b841b;
2911 }
2912
2913 &.status-trash {
2914 background: #eba3a3;
2915 color: #761919;
2916 }
2917
2918 > span {
2919 margin: 0 1em;
2920 overflow: hidden;
2921 text-overflow: ellipsis;
2922 }
2923 }
2924
2925 .wc-order-preview {
2926 .order-status {
2927 float: right;
2928 margin-right: 54px;
2929 }
2930
2931 article {
2932 padding: 0 !important;
2933 }
2934
2935 .modal-close {
2936 border-radius: 0;
2937 }
2938
2939 .wc-order-preview-table {
2940 width: 100%;
2941 margin: 0;
2942
2943 th,
2944 td {
2945 padding: 1em 1.5em;
2946 text-align: left;
2947 border: 0;
2948 border-bottom: 1px solid #eee;
2949 margin: 0;
2950 background: transparent;
2951 box-shadow: none;
2952 text-align: right;
2953 vertical-align: top;
2954 }
2955
2956 td:first-child,
2957 th:first-child {
2958 text-align: left;
2959 }
2960
2961 th {
2962 border-color: #ccc;
2963 }
2964
2965 tr:last-child td {
2966 border: 0;
2967 }
2968
2969 .wc-order-item-sku {
2970 margin-top: 0.5em;
2971 }
2972
2973 .wc-order-item-meta {
2974 margin-top: 0.5em;
2975
2976 th,
2977 td {
2978 padding: 0;
2979 border: 0;
2980 text-align: left;
2981 vertical-align: top;
2982 }
2983
2984 td:last-child {
2985 padding-left: 0.5em;
2986 }
2987 }
2988 }
2989
2990 .wc-order-preview-addresses {
2991 overflow: hidden;
2992 padding-bottom: 1.5em;
2993
2994 .wc-order-preview-address,
2995 .wc-order-preview-note {
2996 width: 50%;
2997 float: left;
2998 padding: 1.5em 1.5em 0;
2999 box-sizing: border-box;
3000 word-wrap: break-word;
3001
3002 h2 {
3003 margin-top: 0;
3004 }
3005
3006 strong {
3007 display: block;
3008 margin-top: 1.5em;
3009 }
3010
3011 strong:first-child {
3012 margin-top: 0;
3013 }
3014 }
3015 }
3016
3017 footer {
3018 .wc-action-button-group {
3019 display: inline-block;
3020 float: left;
3021 }
3022
3023 .button.button-large {
3024 margin-left: 10px;
3025 padding: 0 10px !important;
3026 line-height: 28px;
3027 height: auto;
3028 display: inline-block;
3029 }
3030 }
3031
3032 .wc-action-button-group label {
3033 display: none;
3034 }
3035 }
3036
3037 .wc-action-button-group {
3038 vertical-align: middle;
3039 line-height: 26px;
3040 text-align: left;
3041
3042 label {
3043 margin-right: 6px;
3044 cursor: default;
3045 font-weight: bold;
3046 line-height: 28px;
3047 }
3048
3049 .wc-action-button-group__items {
3050 display: inline-flex;
3051 flex-flow: row wrap;
3052 align-content: flex-start;
3053 justify-content: flex-start;
3054 }
3055
3056 .wc-action-button {
3057 margin: 0 0 0 -1px !important;
3058 border: 1px solid #ccc;
3059 padding: 0 10px !important;
3060 border-radius: 0 !important;
3061 float: none;
3062 line-height: 28px;
3063 height: auto;
3064 z-index: 1;
3065 position: relative;
3066 overflow: hidden;
3067 text-overflow: ellipsis;
3068 flex: 1 0 auto;
3069 box-sizing: border-box;
3070 text-align: center;
3071 white-space: nowrap;
3072 }
3073
3074 .wc-action-button:hover,
3075 .wc-action-button:focus {
3076 border: 1px solid #999;
3077 z-index: 2;
3078 }
3079
3080 .wc-action-button:first-child {
3081 margin-left: 0 !important;
3082 border-top-left-radius: 3px !important;
3083 border-bottom-left-radius: 3px !important;
3084 }
3085
3086 .wc-action-button:last-child {
3087 border-top-right-radius: 3px !important;
3088 border-bottom-right-radius: 3px !important;
3089 }
3090 }
3091
3092 @media screen and (max-width: 782px) {
3093 .wc-order-preview footer {
3094 .wc-action-button-group .wc-action-button-group__items {
3095 display: flex;
3096 }
3097
3098 .wc-action-button-group {
3099 float: none;
3100 display: block;
3101 margin-bottom: 4px;
3102 }
3103
3104 .button.button-large {
3105 width: 100%;
3106 float: none;
3107 text-align: center;
3108 margin: 0;
3109 display: block;
3110 }
3111 }
3112
3113 .post-type-shop_order .wp-list-table {
3114 td.check-column {
3115 width: 1em;
3116 }
3117
3118 td.column-order_number {
3119 padding-left: 0;
3120 padding-bottom: 0.5em;
3121 }
3122
3123 td.column-order_status,
3124 td.column-order_date {
3125 display: inline-block !important;
3126 padding: 0 1em 1em 1em !important;
3127
3128 &::before {
3129 display: none !important;
3130 }
3131 }
3132
3133 td.column-order_date {
3134 padding-left: 0 !important;
3135 }
3136
3137 td.column-order_status {
3138 float: right;
3139 }
3140 }
3141 }
3142
3143 .column-customer_message .note-on {
3144 @include ir();
3145 margin: 0 auto;
3146 color: #999;
3147
3148 &::after {
3149 @include icon("\e026");
3150 line-height: 16px;
3151 }
3152 }
3153
3154 .column-order_notes .note-on {
3155 @include ir();
3156 margin: 0 auto;
3157 color: #999;
3158
3159 &::after {
3160 @include icon("\e027");
3161 line-height: 16px;
3162 }
3163 }
3164
3165 .attributes-table {
3166 td,
3167 th {
3168 width: 15%;
3169 vertical-align: top;
3170 }
3171
3172 .attribute-terms {
3173 width: 32%;
3174 }
3175
3176 .attribute-actions {
3177 width: 2em;
3178
3179 .configure-terms {
3180 @include ir();
3181 padding: 0 !important;
3182 height: 2em !important;
3183 width: 2em;
3184
3185 &::after {
3186 @include icon("\f111");
3187 font-family: "Dashicons";
3188 line-height: 1.85;
3189 }
3190 }
3191 }
3192 }
3193
3194 /* Order notes */
3195 ul.order_notes {
3196 padding: 2px 0 0;
3197
3198 li {
3199 .note_content {
3200 padding: 10px;
3201 background: #efefef;
3202 position: relative;
3203
3204 p {
3205 margin: 0;
3206 padding: 0;
3207 word-wrap: break-word;
3208 }
3209 }
3210
3211 p.meta {
3212 padding: 10px;
3213 color: #999;
3214 margin: 0;
3215 font-size: 11px;
3216
3217 .exact-date {
3218 border-bottom: 1px dotted #999;
3219 }
3220 }
3221
3222 a.delete_note {
3223 color: $red;
3224 }
3225
3226 .note_content::after {
3227 content: "";
3228 display: block;
3229 position: absolute;
3230 bottom: -10px;
3231 left: 20px;
3232 width: 0;
3233 height: 0;
3234 border-width: 10px 10px 0 0;
3235 border-style: solid;
3236 border-color: #efefef transparent;
3237 }
3238 }
3239
3240 li.system-note {
3241 .note_content {
3242 background: #d7cad2;
3243 }
3244
3245 .note_content::after {
3246 border-color: #d7cad2 transparent;
3247 }
3248 }
3249
3250 li.customer-note {
3251 .note_content {
3252 background: #a7cedc;
3253 }
3254
3255 .note_content::after {
3256 border-color: #a7cedc transparent;
3257 }
3258 }
3259 }
3260
3261 .add_note {
3262 border-top: 1px solid #ddd;
3263 padding: 10px 10px 0;
3264
3265 h4 {
3266 margin-top: 5px !important;
3267 }
3268
3269 #add_order_note {
3270 width: 100%;
3271 height: 50px;
3272 }
3273 }
3274
3275 table.wp-list-table {
3276 .column-thumb {
3277 width: 52px;
3278 text-align: center;
3279 white-space: nowrap;
3280 }
3281
3282 .column-handle {
3283 width: 17px;
3284 display: none;
3285 }
3286
3287 tbody {
3288 td.column-handle {
3289 cursor: move;
3290 width: 17px;
3291 text-align: center;
3292 vertical-align: text-top;
3293
3294 &::before {
3295 content: "\f333";
3296 font-family: "Dashicons";
3297 text-align: center;
3298 line-height: 1;
3299 color: #999;
3300 display: block;
3301 width: 17px;
3302 height: 100%;
3303 margin: 4px 0 0 0;
3304 }
3305 }
3306 }
3307
3308 .column-name {
3309 width: 22%;
3310 }
3311
3312 .column-product_cat,
3313 .column-product_tag {
3314 width: 11% !important;
3315 }
3316
3317 .column-featured,
3318 .column-product_type {
3319 width: 48px;
3320 text-align: left !important;
3321 }
3322
3323 .column-customer_message,
3324 .column-order_notes {
3325 width: 48px;
3326 text-align: center;
3327
3328 img {
3329 margin: 0 auto;
3330 padding-top: 0 !important;
3331 }
3332 }
3333
3334 .manage-column.column-featured img,
3335 .manage-column.column-product_type img {
3336 padding-left: 2px;
3337 }
3338
3339 .column-price .woocommerce-price-suffix {
3340 display: none;
3341 }
3342
3343 .row-actions {
3344 color: #999;
3345 }
3346
3347 .row-actions span.id {
3348 padding-top: 8px;
3349 }
3350
3351 td.column-thumb img {
3352 margin: 0;
3353 width: auto;
3354 height: auto;
3355 max-width: 40px;
3356 max-height: 40px;
3357 vertical-align: middle;
3358 }
3359
3360 span.na {
3361 color: #999;
3362 }
3363
3364 .column-sku {
3365 width: 10%;
3366 }
3367
3368 .column-price {
3369 width: 10ch;
3370 }
3371
3372 .column-is_in_stock {
3373 text-align: left !important;
3374 width: 12ch;
3375 }
3376
3377 span.wc-image,
3378 span.wc-featured {
3379 @include ir();
3380 margin: 0 auto;
3381
3382 &::before {
3383 @include icon_dashicons("\f128");
3384 }
3385 }
3386
3387 span.wc-featured {
3388 &::before {
3389 content: "\f155";
3390 }
3391
3392 &.not-featured::before {
3393 content: "\f154";
3394 }
3395 }
3396
3397 td.column-featured span.wc-featured {
3398 font-size: 1.6em;
3399 cursor: pointer;
3400 }
3401
3402 mark {
3403 &.instock,
3404 &.outofstock,
3405 &.onbackorder {
3406 font-weight: 700;
3407 background: transparent none;
3408 line-height: 1;
3409 }
3410
3411 &.instock {
3412 color: $green;
3413 }
3414
3415 &.outofstock {
3416 color: #a44;
3417 }
3418
3419 &.onbackorder {
3420 color: #eaa600;
3421 }
3422 }
3423
3424 .order-notes_head,
3425 .notes_head,
3426 .status_head {
3427 @include ir();
3428 margin: 0 auto;
3429
3430 &::after {
3431 @include icon;
3432 }
3433 }
3434
3435 .order-notes_head::after {
3436 content: "\e028";
3437 }
3438
3439 .notes_head::after {
3440 content: "\e026";
3441 }
3442
3443 .status_head::after {
3444 content: "\e011";
3445 }
3446
3447 .column-order_items {
3448 width: 12%;
3449
3450 table.order_items {
3451 width: 100%;
3452 margin: 3px 0 0;
3453 padding: 0;
3454 display: none;
3455
3456 td {
3457 border: 0;
3458 margin: 0;
3459 padding: 0 0 3px;
3460 }
3461
3462 td.qty {
3463 color: #999;
3464 padding-right: 6px;
3465 text-align: left;
3466 }
3467 }
3468 }
3469 }
3470
3471 mark.notice {
3472 background: #fff;
3473 color: $red;
3474 margin: 0 0 0 10px;
3475 }
3476
3477 a.export_rates,
3478 a.import_rates {
3479 float: right;
3480 margin-left: 9px;
3481 margin-top: -2px;
3482 margin-bottom: 0;
3483 }
3484
3485 #rates-search {
3486 float: right;
3487
3488 input.wc-tax-rates-search-field {
3489 padding: 4px 8px;
3490 font-size: 1.2em;
3491 }
3492 }
3493
3494 #rates-pagination {
3495 float: right;
3496 margin-right: 0.5em;
3497
3498 .tablenav {
3499 margin: 0;
3500 }
3501 }
3502
3503 .wc_input_table_wrapper {
3504 overflow-x: auto;
3505 display: block;
3506 }
3507
3508 table.wc_tax_rates,
3509 table.wc_input_table {
3510 width: 100%;
3511
3512 th,
3513 td {
3514 display: table-cell !important;
3515 }
3516
3517 span.tips {
3518 color: $blue;
3519 }
3520
3521 th {
3522 white-space: nowrap;
3523 padding: 10px;
3524 }
3525
3526 td {
3527 padding: 0;
3528 border-right: 1px solid #dfdfdf;
3529 border-bottom: 1px solid #dfdfdf;
3530 border-top: 0;
3531 background: #fff;
3532 cursor: default;
3533
3534 input[type="text"]="text""],
3535 input[type="number"]="number""] {
3536 width: 100% !important;
3537 min-width: 100px;
3538 padding: 8px 10px;
3539 margin: 0;
3540 border: 0;
3541 outline: 0;
3542 background: transparent none;
3543
3544 &:focus {
3545 outline: 0;
3546 box-shadow: none;
3547 }
3548 }
3549
3550 &.compound,
3551 &.apply_to_shipping {
3552 padding: 5px 7px;
3553 vertical-align: middle;
3554
3555 input {
3556 padding: 0;
3557 }
3558 }
3559 }
3560
3561 td:last-child {
3562 border-right: 0;
3563 }
3564
3565 tr.current td {
3566 background-color: #fefbcc;
3567 }
3568
3569 .item_cost,
3570 .cost {
3571 text-align: right;
3572
3573 input {
3574 text-align: right;
3575 }
3576 }
3577
3578 th.sort {
3579 width: 17px;
3580 padding: 0 4px;
3581 }
3582
3583 td.sort {
3584 padding: 0 4px;
3585 }
3586
3587 .ui-sortable:not(.ui-sortable-disabled) td.sort {
3588 cursor: move;
3589 font-size: 15px;
3590 background: #f9f9f9;
3591 text-align: center;
3592 vertical-align: middle;
3593
3594 &::before {
3595 content: "\f333";
3596 font-family: "Dashicons";
3597 text-align: center;
3598 line-height: 1;
3599 color: #999;
3600 display: block;
3601 width: 17px;
3602 float: left;
3603 height: 100%;
3604 }
3605
3606 &:hover::before {
3607 color: #333;
3608 }
3609 }
3610
3611 .button {
3612 float: left;
3613 margin-right: 5px;
3614 }
3615
3616 .export,
3617 .import {
3618 float: right;
3619 margin-right: 0;
3620 margin-left: 5px;
3621 }
3622
3623 span.tips {
3624 padding: 0 3px;
3625 }
3626
3627 .pagination {
3628 float: right;
3629
3630 .button {
3631 margin-left: 5px;
3632 margin-right: 0;
3633 }
3634
3635 .current {
3636 background: #bbb;
3637 text-shadow: none;
3638 }
3639 }
3640
3641 tr:last-child td {
3642 border-bottom: 0;
3643 }
3644 }
3645
3646 table.wc_tax_rates {
3647 td.country {
3648 position: relative;
3649 }
3650 }
3651
3652 table.wc_gateways,
3653 table.wc_emails,
3654 table.wc_shipping {
3655 position: relative;
3656
3657 th,
3658 td {
3659 display: table-cell !important;
3660 padding: 1em !important;
3661 vertical-align: top;
3662 line-height: 1.75em;
3663 }
3664
3665 &.wc_emails td {
3666 vertical-align: middle;
3667 }
3668
3669 tr:nth-child(odd) td {
3670 background: #f9f9f9;
3671 }
3672
3673 td.name {
3674 font-weight: 700;
3675 }
3676
3677 .settings {
3678 text-align: right;
3679 }
3680
3681 .radio,
3682 .default,
3683 .status {
3684 text-align: center;
3685
3686 .tips {
3687 margin: 0 auto;
3688 }
3689
3690 input {
3691 margin: 0;
3692 }
3693 }
3694
3695 td.sort {
3696 font-size: 15px;
3697 text-align: center;
3698
3699 .wc-item-reorder-nav {
3700 white-space: nowrap;
3701 width: 72px;
3702
3703 &::before {
3704 content: "\f333";
3705 font-family: "Dashicons";
3706 text-align: center;
3707 line-height: 1;
3708 color: #999;
3709 display: block;
3710 width: 24px;
3711 float: left;
3712 height: 100%;
3713 line-height: 24px;
3714 cursor: move;
3715 }
3716
3717 button {
3718 position: relative;
3719 overflow: hidden;
3720 float: left;
3721 display: block;
3722 width: 24px;
3723 height: 24px;
3724 margin: 0;
3725 background: transparent;
3726 border: none;
3727 box-shadow: none;
3728 color: #82878c;
3729 text-indent: -9999px;
3730 cursor: pointer;
3731 outline: none;
3732 }
3733
3734 button::before {
3735 display: inline-block;
3736 position: absolute;
3737 top: 0;
3738 right: 0;
3739 width: 100%;
3740 height: 100%;
3741 font: normal 20px/23px dashicons;
3742 text-align: center;
3743 text-indent: 0;
3744 -webkit-font-smoothing: antialiased;
3745 -moz-osx-font-smoothing: grayscale;
3746 }
3747
3748 button:hover,
3749 button:focus {
3750 color: #191e23;
3751 }
3752
3753 .wc-move-down::before {
3754 content: "\f347";
3755 }
3756
3757 .wc-move-up::before {
3758 content: "\f343";
3759 }
3760
3761 .wc-move-disabled {
3762 color: #d5d5d5 !important;
3763 cursor: default;
3764 pointer-events: none;
3765 }
3766 }
3767 }
3768
3769 .wc-payment-gateway-method-name {
3770 font-weight: normal;
3771 }
3772
3773 .wc-email-settings-table-name {
3774 font-weight: 700;
3775
3776 span {
3777 font-weight: normal;
3778 color: #999;
3779 margin: 0 0 0 4px !important;
3780 }
3781 }
3782
3783 .wc-payment-gateway-method-toggle-enabled,
3784 .wc-payment-gateway-method-toggle-disabled {
3785 padding-top: 1px;
3786 display: block;
3787 outline: 0;
3788 box-shadow: none;
3789 }
3790
3791 .wc-email-settings-table-status {
3792 text-align: center;
3793 width: 1em;
3794
3795 .tips {
3796 margin: 0 auto;
3797 }
3798 }
3799 }
3800
3801 .wc-shipping-zone-settings {
3802 th {
3803 padding: 24px 24px 24px 0;
3804 }
3805
3806 td.forminp {
3807 input,
3808 textarea {
3809 padding: 8px;
3810 max-width: 100% !important;
3811 }
3812
3813 .wc-shipping-zone-region-select {
3814 width: 448px;
3815 max-width: 100% !important;
3816
3817 .select2-choices {
3818 padding: 8px 8px 4px;
3819 border-color: #ddd;
3820 min-height: 0;
3821 line-height: 1;
3822
3823 input {
3824 padding: 0;
3825 }
3826
3827 li {
3828 margin: 0 4px 4px 0;
3829 }
3830 }
3831 }
3832 }
3833
3834 .wc-shipping-zone-postcodes-toggle {
3835 margin: 0.5em 0 0;
3836 font-size: 0.9em;
3837 text-decoration: underline;
3838 display: block;
3839 }
3840
3841 .wc-shipping-zone-postcodes-toggle + .wc-shipping-zone-postcodes {
3842 display: none;
3843 }
3844
3845 .wc-shipping-zone-postcodes {
3846 textarea {
3847 margin: 10px 0;
3848 }
3849
3850 .description {
3851 font-size: 0.9em;
3852 color: #999;
3853 }
3854 }
3855 }
3856
3857 .wc-shipping-zone-settings + p.submit {
3858 margin-top: 0;
3859 }
3860
3861 .wc-shipping-zone-settings tbody {
3862 display: table-row-group;
3863 }
3864
3865 table {
3866 tr,
3867 tr:hover {
3868 table.wc-shipping-zone-methods {
3869 tr .row-actions {
3870 position: relative;
3871 }
3872
3873 tr:hover .row-actions {
3874 position: static;
3875 }
3876 }
3877 }
3878 }
3879
3880 .wc-shipping-zones-heading .page-title-action {
3881 display: inline-block;
3882 }
3883
3884 table.wc-shipping-zones,
3885 table.wc-shipping-zone-methods,
3886 table.wc-shipping-classes {
3887 td,
3888 th {
3889 vertical-align: top;
3890 line-height: 24px;
3891 padding: 1em !important;
3892 font-size: 14px;
3893 background: #fff;
3894 display: table-cell !important;
3895
3896 li {
3897 line-height: 24px;
3898 font-size: 14px;
3899 }
3900
3901 .woocommerce-help-tip {
3902 margin: 0 !important;
3903 }
3904 }
3905
3906 thead {
3907 th {
3908 vertical-align: middle;
3909 }
3910
3911 .wc-shipping-zone-sort {
3912 text-align: center;
3913 }
3914 }
3915
3916 td.wc-shipping-zones-blank-state,
3917 td.wc-shipping-zone-method-blank-state {
3918 overflow: hidden;
3919 position: relative;
3920 padding: 7.5em 7.5% !important;
3921
3922 &.wc-shipping-zone-method-blank-state {
3923 padding: 2em !important;
3924
3925 p {
3926 margin-bottom: 0;
3927 }
3928 }
3929
3930 p,
3931 li {
3932 color: var(--wc-secondary-text);
3933 font-size: 1.2em;
3934 line-height: 1.2em;
3935 margin: 0 0 1.5em;
3936 position: relative;
3937 z-index: 1;
3938 text-shadow: 1px 1px 1px white;
3939
3940 &.main {
3941 font-size: 1.6em;
3942 }
3943 }
3944
3945 li {
3946 margin-left: 1em;
3947 list-style: circle inside;
3948 }
3949
3950 &::before {
3951 content: "\e01b";
3952 font-family: "WooCommerce";
3953 text-align: center;
3954 line-height: 1;
3955 color: #e9e9e9;
3956 display: block;
3957 width: 1em;
3958 font-size: 40em;
3959 top: 50%;
3960 right: -3.75%;
3961 margin-top: -0.1875em;
3962 position: absolute;
3963 }
3964
3965 .button-primary {
3966 font-size: 1.2em;
3967 padding: 0.75em 1.5em;
3968 margin: 0 0.25em;
3969 height: auto;
3970 position: relative;
3971 z-index: 1;
3972 }
3973 }
3974
3975 .wc-shipping-zone-method-rows {
3976 tr:nth-child(even) td {
3977 background: #f9f9f9;
3978 }
3979 }
3980
3981 tr.odd,
3982 .wc-shipping-class-rows tr:nth-child(odd) {
3983 td {
3984 background: #f9f9f9;
3985 }
3986 }
3987
3988 tbody.wc-shipping-zone-rows {
3989 td {
3990 border-top: 2px solid #f9f9f9;
3991 }
3992
3993 tr:first-child {
3994 td {
3995 border-top: 0;
3996 }
3997 }
3998 }
3999
4000 tr.wc-shipping-zone-worldwide {
4001 td {
4002 background: #f9f9f9;
4003 border-top: 2px solid #e1e1e1;
4004 }
4005 }
4006
4007 ul,
4008 p {
4009 margin: 0;
4010 }
4011
4012 td.wc-shipping-zone-sort,
4013 td.wc-shipping-zone-method-sort {
4014 cursor: move;
4015 font-size: 15px;
4016 text-align: center;
4017
4018 &::before {
4019 content: "\f333";
4020 font-family: "Dashicons";
4021 text-align: center;
4022 line-height: 1;
4023 color: #999;
4024 display: block;
4025 width: 17px;
4026 float: left;
4027 height: 100%;
4028 line-height: 24px;
4029 }
4030
4031 &:hover::before {
4032 color: #333;
4033 }
4034 }
4035
4036 td.wc-shipping-zone-worldwide {
4037 text-align: center;
4038
4039 &::before {
4040 content: "\f319";
4041 font-family: "dashicons";
4042 text-align: center;
4043 line-height: 1;
4044 color: #999;
4045 display: block;
4046 width: 17px;
4047 float: left;
4048 height: 100%;
4049 line-height: 24px;
4050 }
4051 }
4052
4053 .wc-shipping-zone-name,
4054 .wc-shipping-zone-methods {
4055 width: 25%;
4056 }
4057
4058 .wc-shipping-class-description,
4059 .wc-shipping-class-name,
4060 .wc-shipping-class-slug,
4061 .wc-shipping-zone-name,
4062 .wc-shipping-zone-region {
4063 input,
4064 select,
4065 textarea {
4066 width: 100%;
4067 }
4068
4069 a.wc-shipping-zone-delete,
4070 a.wc-shipping-class-delete {
4071 color: #a00;
4072 }
4073
4074 a.wc-shipping-zone-delete:hover,
4075 a.wc-shipping-class-delete:hover {
4076 color: red;
4077 }
4078 }
4079
4080 .wc-shipping-class-count {
4081 text-align: center;
4082 }
4083
4084 td.wc-shipping-zone-methods {
4085 color: #555;
4086
4087 .method_disabled {
4088 text-decoration: line-through;
4089 }
4090
4091 ul {
4092 position: relative;
4093 padding-right: 32px;
4094
4095 li {
4096 color: #555;
4097 display: inline;
4098 margin: 0;
4099 }
4100
4101 li::before {
4102 content: ", ";
4103 }
4104
4105 li:first-child::before {
4106 content: "";
4107 }
4108 }
4109
4110 .add_shipping_method {
4111 display: block;
4112 width: 24px;
4113 padding: 24px 0 0;
4114 height: 0;
4115 overflow: hidden;
4116 cursor: pointer;
4117
4118 &::before {
4119 @include icon;
4120 font-family: "Dashicons";
4121 content: "\f502";
4122 color: #999;
4123 vertical-align: middle;
4124 line-height: 24px;
4125 font-size: 16px;
4126 margin: 0;
4127 }
4128
4129 &.disabled {
4130 cursor: not-allowed;
4131
4132 &::before {
4133 color: #ccc;
4134 }
4135 }
4136 }
4137 }
4138
4139 .wc-shipping-zone-method-title {
4140 width: 25%;
4141
4142 .wc-shipping-zone-method-delete {
4143 color: red;
4144 }
4145 }
4146
4147 .wc-shipping-zone-method-enabled {
4148 text-align: center;
4149
4150 a {
4151 display: inline-block;
4152 }
4153
4154 .woocommerce-input-toggle {
4155 margin-top: 3px;
4156 }
4157 }
4158
4159 .wc-shipping-zone-method-type {
4160 display: block;
4161 }
4162
4163 tfoot {
4164 input,
4165 select {
4166 vertical-align: middle !important;
4167 }
4168
4169 .button-secondary {
4170 float: right;
4171 }
4172 }
4173
4174 .editing {
4175 .wc-shipping-zone-view,
4176 .wc-shipping-zone-edit {
4177 display: none;
4178 }
4179 }
4180 }
4181
4182 .woocommerce-input-toggle {
4183 height: 16px;
4184 width: 32px;
4185 border: 2px solid var(--wp-admin-theme-color);
4186 background-color: var(--wp-admin-theme-color);
4187 display: inline-block;
4188 text-indent: -9999px;
4189 border-radius: 10em;
4190 position: relative;
4191 margin-top: -1px;
4192 vertical-align: text-top;
4193
4194 &::before {
4195 content: "";
4196 display: block;
4197 width: 16px;
4198 height: 16px;
4199 background: #fff;
4200 position: absolute;
4201 top: 0;
4202 right: 0;
4203 border-radius: 100%;
4204 }
4205
4206 &.woocommerce-input-toggle--disabled {
4207 border-color: #999;
4208 background-color: #999;
4209
4210 &::before {
4211 right: auto;
4212 left: 0;
4213 }
4214 }
4215
4216 &.woocommerce-input-toggle--loading {
4217 opacity: 0.5;
4218 }
4219 }
4220
4221 .wc-modal-shipping-method-settings {
4222 background: #f8f8f8;
4223 padding: 1em !important;
4224
4225 form .form-table {
4226 width: 100%;
4227 background: #fff;
4228 margin: 0 0 1.5em;
4229
4230 tr {
4231 th {
4232 width: 30%;
4233 position: relative;
4234
4235 .woocommerce-help-tip {
4236 float: right;
4237 margin: -8px -0.5em 0 0;
4238 vertical-align: middle;
4239 right: 0;
4240 top: 50%;
4241 position: absolute;
4242 }
4243 }
4244
4245 td {
4246 input,
4247 select,
4248 textarea {
4249 width: 50%;
4250 min-width: 250px;
4251 }
4252
4253 input[type="checkbox"]="checkbox""] {
4254 width: auto;
4255 min-width: 16px;
4256 }
4257 }
4258
4259 td,
4260 th {
4261 vertical-align: middle;
4262 margin: 0;
4263 line-height: 24px;
4264 padding: 1em;
4265 border-bottom: 1px solid #f8f8f8;
4266 }
4267 }
4268
4269 &:last-of-type {
4270 margin-bottom: 0;
4271 }
4272 }
4273 }
4274
4275 .wc-backbone-modal .wc-shipping-zone-method-selector {
4276 p {
4277 margin-top: 0;
4278 }
4279
4280 .wc-shipping-zone-method-description {
4281 margin: 0.75em 1px 0;
4282 line-height: 1.5em;
4283 color: #999;
4284 font-style: italic;
4285 }
4286
4287 select {
4288 width: 100%;
4289 cursor: pointer;
4290 }
4291 }
4292
4293 img.help_tip {
4294 margin: 0 0 0 9px;
4295 vertical-align: middle;
4296 }
4297
4298 .postbox img.help_tip {
4299 margin-top: 0;
4300 }
4301
4302 .postbox .woocommerce-help-tip {
4303 margin: 0 0 0 9px;
4304 }
4305
4306 .status-enabled,
4307 .status-manual,
4308 .status-disabled {
4309 font-size: 1.4em;
4310
4311 @include ir();
4312 }
4313
4314 .status-manual::before {
4315 @include icon("\e008");
4316 color: #999;
4317 }
4318
4319 .status-enabled::before {
4320 @include icon("\e015");
4321 color: var(--wp-admin-theme-color);
4322 }
4323
4324 .status-disabled::before {
4325 @include icon("\e013");
4326 color: #ccc;
4327 }
4328
4329 .woocommerce {
4330 h2.woo-nav-tab-wrapper {
4331 margin-bottom: 1em;
4332 }
4333
4334 nav.woo-nav-tab-wrapper {
4335 margin: 1.5em 0 1em;
4336 }
4337
4338 .subsubsub:not(.list-table-filters) {
4339 margin: -8px 0 0;
4340 }
4341
4342 .wc-admin-breadcrumb {
4343 margin-left: 0.5em;
4344
4345 a {
4346 color: var(--wp-admin-theme-color);
4347 }
4348 }
4349
4350 #template div {
4351 margin: 0;
4352
4353 p .button {
4354 float: right;
4355 margin-left: 10px;
4356 margin-top: -4px;
4357 }
4358
4359 .editor textarea {
4360 margin-bottom: 8px;
4361 }
4362 }
4363
4364 textarea[disabled="disabled"]="disabled""] {
4365 background: #dfdfdf !important;
4366 }
4367
4368 table.form-table {
4369 margin: 0;
4370 position: relative;
4371 table-layout: fixed;
4372
4373 .forminp-radio ul {
4374 margin: 0;
4375
4376 li {
4377 line-height: 1.4em;
4378 }
4379 }
4380
4381 input[type="text"]="text""],
4382 input[type="number"]="number""],
4383 input[type="email"]="email""] {
4384 height: auto;
4385 }
4386
4387 textarea.input-text {
4388 height: 100%;
4389 min-width: 150px;
4390 display: block;
4391 }
4392
4393 // Give regular settings inputs a standard width and padding.
4394 textarea,
4395 input[type="text"]="text""],
4396 input[type="email"]="email""],
4397 input[type="number"]="number""],
4398 input[type="password"]="password""],
4399 input[type="datetime"]="datetime""],
4400 input[type="datetime-local"]="datetime-local""],
4401 input[type="date"]="date""],
4402 input[type="time"]="time""],
4403 input[type="week"]="week""],
4404 input[type="url"]="url""],
4405 input[type="tel"]="tel""],
4406 input.regular-input {
4407 width: 400px;
4408 margin: 0;
4409 padding: 6px;
4410 box-sizing: border-box;
4411 vertical-align: top;
4412 }
4413
4414 input[type="datetime-local"]="datetime-local""],
4415 input[type="date"]="date""],
4416 input[type="time"]="time""],
4417 input[type="week"]="week""],
4418 input[type="tel"]="tel""] {
4419 width: 200px;
4420 }
4421
4422 select {
4423 width: 400px;
4424 margin: 0;
4425 box-sizing: border-box;
4426 line-height: 32px;
4427 vertical-align: top;
4428 }
4429
4430 input[size]] {
4431 width: auto !important;
4432 }
4433
4434 // Ignore nested inputs.
4435 table {
4436 select,
4437 textarea,
4438 input[type="text"]="text""],
4439 input[type="email"]="email""],
4440 input[type="number"]="number""],
4441 input.regular-input {
4442 width: auto;
4443 }
4444 }
4445
4446 textarea.wide-input {
4447 width: 100%;
4448 }
4449
4450 img.help_tip,
4451 .woocommerce-help-tip {
4452 padding: 0;
4453 margin: -4px 0 0 5px;
4454 vertical-align: middle;
4455 cursor: help;
4456 line-height: 1;
4457 }
4458
4459 span.help_tip {
4460 cursor: help;
4461 color: $blue;
4462 }
4463
4464 th {
4465 position: relative;
4466 padding-right: 24px;
4467 }
4468
4469 th label {
4470 position: relative;
4471 display: block;
4472
4473 img.help_tip,
4474 .woocommerce-help-tip {
4475 margin: -8px -24px 0 0;
4476 position: absolute;
4477 right: 0;
4478 top: 50%;
4479 }
4480 }
4481
4482 th label + .woocommerce-help-tip {
4483 margin: 0 0 0 0;
4484 position: absolute;
4485 right: 0;
4486 top: 20px;
4487 }
4488
4489 .select2-container {
4490 vertical-align: top;
4491 margin-bottom: 3px;
4492 }
4493
4494 .select2-container + span.description {
4495 display: block;
4496 margin-top: 8px;
4497 }
4498
4499 table.widefat th {
4500 padding-right: inherit;
4501 }
4502
4503 .wp-list-table .woocommerce-help-tip {
4504 float: none;
4505 }
4506
4507 fieldset {
4508 margin-top: 4px;
4509
4510 img.help_tip,
4511 .woocommerce-help-tip {
4512 margin: -3px 0 0 5px;
4513 }
4514
4515 p.description {
4516 margin-bottom: 8px;
4517 }
4518
4519 &:first-child {
4520 margin-top: 0;
4521 }
4522 }
4523
4524 td.with-tooltip {
4525 > fieldset {
4526 margin-top: 0;
4527 }
4528 span.help-tooltip {
4529 position: absolute;
4530 margin-left: -30px;
4531 margin-top: 7px;
4532 }
4533 }
4534
4535 .iris-picker {
4536 z-index: 100;
4537 display: none;
4538 position: absolute;
4539 border: 1px solid #ccc;
4540 border-radius: 3px;
4541 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
4542
4543 .ui-slider {
4544 border: 0 !important;
4545 margin: 0 !important;
4546 width: auto !important;
4547 height: auto !important;
4548 background: none transparent !important;
4549
4550 .ui-slider-handle {
4551 margin-bottom: 0 !important;
4552 }
4553 }
4554 }
4555
4556 .iris-error {
4557 background-color: #ffafaf;
4558 }
4559
4560 .colorpickpreview {
4561 padding: 7px 0;
4562 line-height: 1em;
4563 display: inline-block;
4564 width: 26px;
4565 border: 1px solid #ddd;
4566 font-size: 14px;
4567 }
4568
4569 .image_width_settings {
4570 vertical-align: middle;
4571
4572 label {
4573 margin-left: 10px;
4574 }
4575
4576 input {
4577 width: auto;
4578 }
4579 }
4580
4581 .wc_payment_gateways_wrapper,
4582 .wc_emails_wrapper {
4583 padding: 0 15px 10px 0;
4584 }
4585 }
4586
4587 .wc-shipping-zone-settings {
4588 td.forminp {
4589 input,
4590 textarea {
4591 width: 448px;
4592 padding: 6px 11px;
4593 }
4594
4595 .select2-search input {
4596 padding: 6px;
4597 }
4598 }
4599 }
4600 }
4601
4602 .wc-wp-version-gte-53 {
4603 .woocommerce {
4604 h2.wc-table-list-header {
4605 margin: 1em 0 0.35em 0;
4606 }
4607
4608 input + .subsubsub {
4609 margin: 8px 0 0;
4610 }
4611
4612 table.form-table {
4613 // Give regular settings inputs a standard width and padding.
4614 textarea,
4615 input[type="text"]="text""],
4616 input[type="email"]="email""],
4617 input[type="number"]="number""],
4618 input[type="password"]="password""],
4619 input[type="datetime"]="datetime""],
4620 input[type="datetime-local"]="datetime-local""],
4621 input[type="date"]="date""],
4622 input[type="time"]="time""],
4623 input[type="week"]="week""],
4624 input[type="url"]="url""],
4625 input[type="tel"]="tel""],
4626 input.regular-input {
4627 padding: 0 8px;
4628
4629 @media only screen and (max-width: 782px) {
4630 width: 100%;
4631 }
4632 }
4633
4634 select {
4635 @media only screen and (max-width: 782px) {
4636 width: 100%;
4637 }
4638 }
4639
4640 th label {
4641 img.help_tip,
4642 .woocommerce-help-tip {
4643 margin: -7px -24px 0 0;
4644
4645 @media only screen and (max-width: 782px) {
4646 right: auto;
4647 margin-left: 5px;
4648 }
4649 }
4650 }
4651
4652 .forminp-color {
4653 font-size: 0;
4654 }
4655
4656 .colorpickpreview {
4657 padding: 0;
4658 width: 30px;
4659 height: 30px;
4660 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
4661 font-size: 16px;
4662 border-radius: 4px;
4663 margin-right: 3px;
4664
4665 @media only screen and (max-width: 782px) {
4666 float: left;
4667 width: 40px;
4668 height: 40px;
4669 }
4670 }
4671 }
4672 }
4673 }
4674
4675 .woocommerce #tabs-wrap table a.remove {
4676 margin-left: 4px;
4677 }
4678
4679 .woocommerce #tabs-wrap table p {
4680 margin: 0 0 4px !important;
4681 overflow: hidden;
4682 zoom: 1;
4683 }
4684
4685 .woocommerce #tabs-wrap table p a.add {
4686 float: left;
4687 }
4688
4689 #wp-excerpt-editor-container {
4690 background: #fff;
4691 }
4692
4693 #product_variation-parent #parent_id {
4694 width: 100%;
4695 }
4696
4697 #postimagediv {
4698 .inside {
4699 padding: 0;
4700 margin: 0;
4701 }
4702
4703 p {
4704 margin: 0;
4705 padding: 10px;
4706 }
4707
4708 .image-added-detail {
4709 border-top: 1px solid #dcdcde;
4710 background-color: #f6f7f7;
4711 color: #7f8388;
4712 font-size: 12px;
4713 margin-top: 4px;
4714
4715 .dashicons {
4716 font-size: 13px;
4717 width: 13px;
4718 height: 13px;
4719 margin: 3px 3px 0 0;
4720 }
4721
4722 a {
4723 text-decoration: none;
4724 }
4725 }
4726
4727 img {
4728 border: 1px solid #d5d5d5;
4729 max-width: 100%;
4730 }
4731 }
4732
4733 #woocommerce-product-images .inside {
4734 margin: 0;
4735 padding: 0;
4736
4737 .add_product_images {
4738 padding: 0 12px 12px;
4739 }
4740
4741 #product_images_container {
4742 padding: 0 0 0 9px;
4743
4744 ul {
4745 @include clearfix();
4746 margin: 0;
4747 padding: 0;
4748
4749 li.image,
4750 li.add,
4751 li.wc-metabox-sortable-placeholder {
4752 width: 80px;
4753 float: left;
4754 cursor: move;
4755 border: 1px solid #d5d5d5;
4756 margin: 9px 9px 0 0;
4757 background: #f7f7f7;
4758
4759 @include border-radius(2px);
4760 position: relative;
4761 box-sizing: border-box;
4762
4763 img {
4764 width: 100%;
4765 height: auto;
4766 display: block;
4767 }
4768 }
4769
4770 li.wc-metabox-sortable-placeholder {
4771 border: 3px dashed #ddd;
4772 position: relative;
4773
4774 &::after {
4775 @include icon_dashicons("\f161");
4776 font-size: 2.618em;
4777 line-height: 72px;
4778 color: #ddd;
4779 }
4780 }
4781
4782 ul.actions {
4783 position: absolute;
4784 top: -8px;
4785 right: -8px;
4786 padding: 2px;
4787 display: none;
4788
4789 @media (max-width: 768px) {
4790 display: block;
4791 }
4792
4793 li {
4794 float: right;
4795 margin: 0 0 0 2px;
4796
4797 a {
4798 width: 1em;
4799 height: 1em;
4800 margin: 0;
4801 height: 0;
4802 display: block;
4803 overflow: hidden;
4804
4805 &.tips {
4806 cursor: pointer;
4807 }
4808 }
4809
4810 a.delete {
4811 @include ir();
4812 font-size: 1.4em;
4813
4814 &::before {
4815 @include icon_dashicons("\f153");
4816 color: #999;
4817 background: #fff;
4818 border-radius: 50%;
4819 height: 1em;
4820 width: 1em;
4821 line-height: 1em;
4822 }
4823
4824 &:hover::before {
4825 color: $red;
4826 }
4827 }
4828 }
4829 }
4830
4831 li:hover ul.actions {
4832 display: block;
4833 }
4834 }
4835 }
4836 }
4837
4838 #woocommerce-product-data {
4839 .hndle {
4840 padding: 10px;
4841
4842 span {
4843 display: block;
4844 line-height: 24px;
4845 }
4846
4847 .product-data-wrapper {
4848 label > * {
4849 display: inline-block;
4850 }
4851
4852 .woocommerce-product-type-tip {
4853 font-size: 1.4em;
4854 margin-left: 9px;
4855 }
4856 }
4857
4858 .type_box {
4859 display: inline;
4860 line-height: inherit;
4861 vertical-align: baseline;
4862 }
4863
4864 select {
4865 margin: 0;
4866 }
4867
4868 label {
4869 padding-right: 1em;
4870 font-size: 12px;
4871 vertical-align: baseline;
4872 }
4873
4874 label:first-child {
4875 margin-right: 1em;
4876 border-right: 1px solid #dfdfdf;
4877 }
4878
4879 input,
4880 select {
4881 margin-top: -3px 0 0;
4882 vertical-align: middle;
4883 }
4884
4885 select {
4886 margin-left: 0.5em;
4887 }
4888 }
4889
4890 > .handlediv {
4891 margin-top: 4px;
4892 }
4893
4894 .wrap {
4895 margin: 0;
4896 }
4897 }
4898
4899 #woocommerce-coupon-description {
4900 padding: 3px 8px;
4901 font-size: 1.7em;
4902 line-height: 1.42em;
4903 height: auto;
4904 width: 100%;
4905 outline: 0;
4906 margin: 10px 0;
4907 display: block;
4908
4909 &::-webkit-input-placeholder {
4910 line-height: 1.42em;
4911 color: #bbb;
4912 }
4913
4914 &::-moz-placeholder {
4915 line-height: 1.42em;
4916 color: #bbb;
4917 }
4918
4919 &:-ms-input-placeholder {
4920 line-height: 1.42em;
4921 color: #bbb;
4922 }
4923
4924 &:-moz-placeholder {
4925 line-height: 1.42em;
4926 color: #bbb;
4927 }
4928 }
4929
4930 #woocommerce-product-data,
4931 #woocommerce-coupon-data {
4932 .panel-wrap {
4933 background: #fff;
4934 }
4935
4936 .woocommerce_options_panel,
4937 .wc-metaboxes-wrapper {
4938 float: left;
4939 width: 80%;
4940
4941 .wc-radios {
4942 display: block;
4943 float: left;
4944 margin: 0;
4945
4946 li {
4947 display: block;
4948 padding: 0 0 10px;
4949
4950 input {
4951 width: auto;
4952 }
4953 }
4954 }
4955 }
4956 }
4957
4958 #woocommerce-product-data,
4959 #woocommerce-coupon-data,
4960 .woocommerce {
4961 .panel-wrap {
4962 overflow: hidden;
4963 }
4964
4965 ul.wc-tabs {
4966 margin: 0;
4967 width: 20%;
4968 float: left;
4969 line-height: 1em;
4970 padding: 0 0 10px;
4971 position: relative;
4972 background-color: #fafafa;
4973 border-right: 1px solid #eee;
4974 box-sizing: border-box;
4975
4976 &::after {
4977 content: "";
4978 display: block;
4979 width: 100%;
4980 height: 9999em;
4981 position: absolute;
4982 bottom: -9999em;
4983 left: 0;
4984 background-color: #fafafa;
4985 border-right: 1px solid #eee;
4986 }
4987
4988 li {
4989 margin: 0;
4990 padding: 0;
4991 display: block;
4992 position: relative;
4993
4994 a {
4995 margin: 0;
4996 padding: 10px;
4997 display: block;
4998 box-shadow: none;
4999 text-decoration: none;
5000 line-height: 20px !important;
5001 border-bottom: 1px solid #eee;
5002
5003 span {
5004 margin-left: 0.618em;
5005 margin-right: 0.618em;
5006 }
5007
5008 &::before {
5009 @include iconbeforedashicons("\f107");
5010 }
5011 }
5012
5013 &.general_options a::before {
5014 content: "\f107";
5015 }
5016
5017 &.inventory_options a::before {
5018 content: "\f481";
5019 }
5020
5021 &.shipping_options a::before {
5022 font-family: "WooCommerce";
5023 content: "\e01a";
5024 }
5025
5026 &.linked_product_options a::before {
5027 content: "\f103";
5028 }
5029
5030 &.attribute_options a::before {
5031 content: "\f175";
5032 }
5033
5034 &.advanced_options a::before {
5035 font-family: "Dashicons";
5036 content: "\f111";
5037 }
5038
5039 &.marketplace-suggestions_options a::before {
5040 content: none;
5041 }
5042
5043 &.variations_options a::before {
5044 content: "\f509";
5045 }
5046
5047 &.usage_restriction_options a::before {
5048 font-family: "WooCommerce";
5049 content: "\e602";
5050 }
5051
5052 &.usage_limit_options a::before {
5053 font-family: "WooCommerce";
5054 content: "\e601";
5055 }
5056
5057 &.general_coupon_data a::before {
5058 font-family: "WooCommerce";
5059 content: "\e600";
5060 }
5061
5062 &.active a {
5063 color: #555;
5064 position: relative;
5065 background-color: #eee;
5066 }
5067 }
5068 }
5069 }
5070
5071 /**
5072 * Shipping
5073 */
5074 .woocommerce_page_wc-settings {
5075 input[type="url"]="url""],
5076 input[type="email"]="email""] {
5077 direction: ltr;
5078 }
5079
5080 .shippingrows {
5081 th.check-column {
5082 padding-top: 20px;
5083 }
5084
5085 tfoot th {
5086 padding-left: 10px;
5087 }
5088
5089 .add.button::before {
5090 @include iconbefore("\e007");
5091 }
5092 }
5093
5094 h3.wc-settings-sub-title {
5095 font-size: 1.2em;
5096 }
5097 }
5098
5099 #woocommerce-product-data,
5100 #woocommerce-product-type-options,
5101 #woocommerce-order-data,
5102 #woocommerce-order-downloads,
5103 #woocommerce-coupon-data {
5104 .inside {
5105 margin: 0;
5106 padding: 0;
5107 }
5108 }
5109
5110 .woocommerce_options_panel,
5111 .panel {
5112 padding: 9px;
5113 color: #555;
5114
5115 .form-field .woocommerce-help-tip {
5116 font-size: 1.4em;
5117 }
5118 }
5119
5120 .woocommerce_page_settings .woocommerce_options_panel,
5121 .panel {
5122 padding: 0;
5123 }
5124
5125 #woocommerce-product-type-options .panel,
5126 #woocommerce-product-specs .inside {
5127 margin: 0;
5128 padding: 9px;
5129 }
5130
5131 .woocommerce_options_panel p,
5132 #woocommerce-product-type-options .panel p,
5133 .woocommerce_options_panel fieldset.form-field {
5134 margin: 0 0 9px;
5135 font-size: 12px;
5136 padding: 5px 9px;
5137 line-height: 24px;
5138
5139 &::after {
5140 content: ".";
5141 display: block;
5142 height: 0;
5143 clear: both;
5144 visibility: hidden;
5145 }
5146 }
5147
5148 .woocommerce_options_panel .checkbox,
5149 .woocommerce_variable_attributes .checkbox {
5150 margin: 4px 0 !important;
5151 vertical-align: middle;
5152 float: left;
5153 }
5154
5155 .woocommerce_variations,
5156 .woocommerce_options_panel {
5157 .downloadable_files table {
5158 width: 100%;
5159 padding: 0 !important;
5160
5161 th {
5162 padding: 7px 0 7px 7px !important;
5163
5164 &.sort {
5165 width: 17px;
5166 padding: 7px !important;
5167 }
5168
5169 .woocommerce-help-tip {
5170 font-size: 1.1em;
5171 margin-left: 0;
5172 }
5173 }
5174
5175 td {
5176 vertical-align: middle !important;
5177 padding: 4px 0 4px 7px !important;
5178 position: relative;
5179
5180 &:last-child {
5181 padding-right: 7px !important;
5182 }
5183
5184 input.input_text {
5185 width: 100%;
5186 float: none;
5187 min-width: 0;
5188 margin: 1px 0;
5189 }
5190
5191 &.file_url {
5192 /* Reduce the size of this field to make space for a warning asterisk. */
5193 input {
5194 display: inline-block;
5195 width: 96%;
5196 }
5197 }
5198
5199 .upload_file_button {
5200 width: auto;
5201 float: right;
5202 cursor: pointer;
5203 }
5204
5205 .delete {
5206 @include ir();
5207 font-size: 1.2em;
5208
5209 &::before {
5210 @include icon_dashicons("\f153");
5211 color: #999;
5212 }
5213
5214 &:hover {
5215 &::before {
5216 color: $red;
5217 }
5218 }
5219 }
5220 }
5221
5222 td.sort {
5223 width: 17px;
5224 cursor: move;
5225 font-size: 15px;
5226 text-align: center;
5227 background: #f9f9f9;
5228 padding-right: 7px !important;
5229
5230 &::before {
5231 content: "\f333";
5232 font-family: "Dashicons";
5233 text-align: center;
5234 line-height: 1;
5235 color: #999;
5236 display: block;
5237 width: 17px;
5238 float: left;
5239 height: 100%;
5240 }
5241
5242 &:hover::before {
5243 color: #333;
5244 }
5245 }
5246
5247 /* Warning asterisk (indicates if there is a problem with a downloadable file). */
5248 span.disabled {
5249 color: var(--wc-red);
5250 }
5251 }
5252 }
5253
5254 .woocommerce_attribute,
5255 .woocommerce_variation {
5256 h3 .sort {
5257 width: 17px;
5258 height: 26px;
5259 cursor: move;
5260 float: right;
5261 font-size: 15px;
5262 font-weight: 400;
5263 margin-right: 0.5em;
5264 text-align: center;
5265 vertical-align: middle;
5266
5267 &::before {
5268 content: "\f333";
5269 font-family: "Dashicons";
5270 text-align: center;
5271 line-height: 28px;
5272 color: #999;
5273 display: block;
5274 width: 17px;
5275 float: left;
5276 height: 100%;
5277 }
5278
5279 &:hover::before {
5280 color: #777;
5281 }
5282 }
5283 .edit_variation {
5284 margin-left: 0.5em;
5285 }
5286
5287 h3:hover,
5288 &.ui-sortable-helper {
5289 .sort {
5290 visibility: visible;
5291 }
5292 }
5293 }
5294
5295 .woocommerce_options_panel {
5296 min-height: 175px;
5297 box-sizing: border-box;
5298
5299 .downloadable_files {
5300 padding: 0 9px 0 162px;
5301 position: relative;
5302 margin: 9px 0;
5303
5304 label {
5305 position: absolute;
5306 left: 0;
5307 margin: 0 0 0 12px;
5308 line-height: 24px;
5309 }
5310 }
5311
5312 p {
5313 margin: 9px 0;
5314 }
5315
5316 p.form-field,
5317 fieldset.form-field {
5318 padding: 5px 20px 5px 162px !important;
5319
5320 /** Padding for aligning labels left - 12px + 150 label width **/
5321 &._sold_individually_field {
5322 padding-right: 0px !important;
5323 }
5324 }
5325
5326 .sale_price_dates_fields {
5327 .short:first-of-type {
5328 margin-bottom: 1em;
5329 }
5330
5331 .short:nth-of-type(2) {
5332 clear: left;
5333 }
5334 }
5335
5336 label,
5337 legend {
5338 float: left;
5339 width: 150px;
5340 padding: 0;
5341 margin: 0 0 0 -150px;
5342
5343 .req {
5344 font-weight: 700;
5345 font-style: normal;
5346 color: $red;
5347 }
5348 }
5349
5350 .description,
5351 input[type="checkbox"]="checkbox""] + .description,
5352 input[type="radio"]="radio""] + .description {
5353 padding: 0;
5354 margin: 0 0 0 7px;
5355 clear: none;
5356 display: inline;
5357 }
5358
5359 input:not([type="checkbox"]):not([type="radio"]) + .description {
5360 display: block;
5361 clear: both;
5362 margin-left: 0;
5363 }
5364
5365 .description-block {
5366 margin-left: 0;
5367 display: block;
5368 }
5369
5370 textarea,
5371 input,
5372 select {
5373 margin: 0;
5374 }
5375
5376 textarea {
5377 float: left;
5378 height: 3.5em;
5379 line-height: 1.5em;
5380 vertical-align: top;
5381 }
5382
5383 input[type="text"]="text""],
5384 input[type="email"]="email""],
5385 input[type="number"]="number""],
5386 input[type="password"]="password""] {
5387 width: 50%;
5388 float: left;
5389 }
5390
5391 input.button {
5392 width: auto;
5393 margin-left: 8px;
5394 }
5395
5396 select {
5397 float: left;
5398 }
5399
5400 input[type="text"]="text""].short,
5401 input[type="email"]="email""].short,
5402 input[type="number"]="number""].short,
5403 input[type="password"]="password""].short,
5404 .short {
5405 width: 50%;
5406 }
5407
5408 .sized {
5409 width: auto !important;
5410 margin-right: 6px;
5411 }
5412
5413 .options_group {
5414 border-top: 1px solid white;
5415 border-bottom: 1px solid #eee;
5416
5417 &:first-child {
5418 border-top: 0;
5419 }
5420
5421 &:last-child {
5422 border-bottom: 0;
5423 }
5424
5425 fieldset {
5426 margin: 9px 0;
5427 font-size: 12px;
5428 padding: 5px 9px;
5429 line-height: 24px;
5430
5431 label {
5432 width: auto;
5433 float: none;
5434 }
5435
5436 ul {
5437 float: left;
5438 width: 50%;
5439 margin: 0;
5440 padding: 0;
5441
5442 li {
5443 margin: 0;
5444 width: auto;
5445
5446 input {
5447 width: auto;
5448 float: none;
5449 margin-right: 4px;
5450 }
5451 }
5452 }
5453
5454 ul.wc-radios label {
5455 margin-left: 0;
5456 }
5457 }
5458 }
5459
5460 .dimensions_field .wrap {
5461 display: block;
5462 width: 50%;
5463
5464 input {
5465 width: 30.75%;
5466 margin-right: 3.8%;
5467 }
5468
5469 .last {
5470 margin-right: 0;
5471 }
5472 }
5473
5474 &.padded {
5475 padding: 1em;
5476 }
5477
5478 .select2-container {
5479 float: left;
5480 }
5481
5482 .inventory_sold_individually {
5483 display: flex;
5484
5485 .woocommerce-help-tip {
5486 align-self: center;
5487 }
5488 }
5489 }
5490
5491 #woocommerce-product-data input.dp-applied {
5492 float: left;
5493 }
5494
5495 #grouped_product_options,
5496 #virtual_product_options,
5497 #simple_product_options {
5498 padding: 12px;
5499 font-style: italic;
5500 color: #666;
5501 }
5502
5503 /**
5504 * WooCommerce meta boxes
5505 */
5506 .wc-metaboxes-wrapper {
5507 :not(#variable_product_options_inner) {
5508 .toolbar:not(.expand-close-hidden) {
5509 border-bottom: 1px solid #eee;
5510 }
5511 }
5512 .toolbar {
5513 margin: 0 !important;
5514 border-top: 1px solid white;
5515 padding: 9px 12px !important;
5516
5517 &:first-child {
5518 border-top: 0;
5519 }
5520
5521 &:last-child {
5522 border-bottom: 0;
5523 }
5524
5525 .add_variation {
5526 float: right;
5527 margin-left: 5px;
5528 }
5529
5530 .save-variation-changes,
5531 .cancel-variation-changes {
5532 float: left;
5533 margin-right: 5px;
5534 }
5535 }
5536
5537 p.toolbar {
5538 overflow: hidden;
5539 zoom: 1;
5540 }
5541
5542 .expand-close {
5543 margin-right: 2px;
5544 color: #777;
5545 font-size: 12px;
5546 font-style: italic;
5547
5548 a {
5549 background: none;
5550 padding: 0;
5551 font-size: 12px;
5552 text-decoration: none;
5553 }
5554 }
5555
5556 &#product_attributes .expand-close {
5557 float: right;
5558 line-height: 28px;
5559 }
5560
5561 button.add_variable_attribute,
5562 .fr {
5563 float: right;
5564 margin: 0 0 0 6px;
5565 }
5566
5567 .wc-metaboxes {
5568 border-bottom: 1px solid #eee;
5569 }
5570
5571 .wc-metabox-sortable-placeholder {
5572 border-color: #bbb;
5573 background-color: #f5f5f5;
5574 margin-bottom: 9px;
5575 border-width: 1px;
5576 border-style: dashed;
5577 }
5578
5579 .wc-metabox {
5580 background: #fff;
5581 border-bottom: 1px solid #eee;
5582 margin: 0 !important;
5583
5584 select {
5585 font-weight: 400;
5586 }
5587
5588 &:last-of-type {
5589 border-bottom: 0;
5590 }
5591
5592 .handlediv {
5593 width: 27px;
5594 float: right;
5595
5596 &::before {
5597 content: "\f142" !important;
5598 cursor: pointer;
5599 display: inline-block;
5600 font: 400 20px/1 "Dashicons";
5601 line-height: 0.5 !important;
5602 padding: 8px 10px;
5603 position: relative;
5604 right: 12px;
5605 top: 0;
5606 }
5607 }
5608
5609 &.closed {
5610 @include border-radius(3px);
5611
5612 .handlediv::before {
5613 content: "\f140" !important;
5614 }
5615
5616 h3 {
5617 border: 0;
5618 }
5619 }
5620
5621 h3 {
5622 margin: 0 !important;
5623 padding: 0.75em 0.75em 0.75em 1em !important;
5624 font-size: 1em !important;
5625 overflow: hidden;
5626 zoom: 1;
5627 cursor: move;
5628
5629 button,
5630 a.delete,
5631 a.edit {
5632 float: right;
5633 margin-right: 12px;
5634 }
5635
5636 a.delete {
5637 color: red;
5638 font-weight: normal;
5639 line-height: 26px;
5640 text-decoration: none;
5641 position: relative;
5642 }
5643
5644 a.edit {
5645 font-weight: normal;
5646 line-height: 26px;
5647 text-decoration: none;
5648 position: relative;
5649 }
5650
5651 a.remove_variation {
5652 margin: 0 0.5em;
5653 }
5654
5655 strong {
5656 font-weight: normal;
5657 line-height: 26px;
5658 font-weight: 700;
5659 }
5660
5661 select {
5662 font-family: sans-serif;
5663 max-width: 20%;
5664 margin: 0.25em 0.25em 0.25em 0;
5665 }
5666
5667 .handlediv {
5668 background-position: 6px 5px !important;
5669 margin: 4px 0 -1px !important;
5670 height: 26px;
5671 }
5672
5673 &.fixed {
5674 cursor: pointer !important;
5675 }
5676 }
5677
5678 &.woocommerce_attribute h3,
5679 &.woocommerce_variation h3 {
5680 cursor: pointer;
5681 padding: 0.5em 0.75em 0.5em 1em !important;
5682
5683 a.delete,
5684 a.edit,
5685 .sort {
5686 margin-top: 0.25em;
5687 }
5688 }
5689 &.woocommerce_variation h3 {
5690 a.delete,
5691 a.edit,
5692 .sort {
5693 margin-top: 0.45em;
5694 }
5695 }
5696
5697 table {
5698 width: 100%;
5699 position: relative;
5700 background-color: #fdfdfd;
5701 padding: 1em;
5702 border-top: 1px solid #eee;
5703
5704 td {
5705 text-align: left;
5706 padding: 0 6px 1em 0;
5707 vertical-align: top;
5708 border: 0;
5709
5710 label {
5711 text-align: left;
5712 display: block;
5713 line-height: 21px;
5714 }
5715
5716 input {
5717 float: left;
5718 min-width: 200px;
5719 }
5720
5721 input,
5722 textarea {
5723 width: 100%;
5724 margin: 0;
5725 display: block;
5726 font-size: 14px;
5727 padding: 4px;
5728 color: #555;
5729 }
5730
5731 select,
5732 .select2-container {
5733 width: 100% !important;
5734 }
5735
5736 input.short {
5737 width: 200px;
5738 }
5739
5740 input.checkbox {
5741 width: 16px;
5742 min-width: inherit;
5743 vertical-align: text-bottom;
5744 display: inline-block;
5745 float: none;
5746 }
5747 }
5748
5749 td.attribute_name {
5750 width: 200px;
5751 }
5752
5753 .plus,
5754 .minus {
5755 margin-top: 6px;
5756 }
5757
5758 .fl {
5759 float: left;
5760 }
5761
5762 .fr {
5763 float: right;
5764 }
5765 }
5766 .placeholder {
5767 opacity: 0.4;
5768 }
5769 }
5770 }
5771
5772 .variations-pagenav {
5773 float: right;
5774 line-height: 24px;
5775
5776 .displaying-num {
5777 color: #777;
5778 font-size: 12px;
5779 font-style: italic;
5780 }
5781
5782 a {
5783 padding: 0 10px 3px;
5784 background: rgba(0, 0, 0, 0.05);
5785 font-size: 16px;
5786 font-weight: 400;
5787 text-decoration: none;
5788 }
5789
5790 a.disabled,
5791 a.disabled:active,
5792 a.disabled:focus,
5793 a.disabled:hover {
5794 color: #a0a5aa;
5795 background: rgba(0, 0, 0, 0.05);
5796 }
5797 }
5798
5799 .variations-defaults {
5800 float: left;
5801
5802 select {
5803 margin: 0.25em 0.25em 0.25em 0;
5804 }
5805 }
5806
5807 .woocommerce_variable_attributes {
5808 background-color: #fdfdfd;
5809 border-top: 1px solid #eee;
5810
5811 .data {
5812 @include clearfix;
5813 padding: 1em 2em;
5814 }
5815
5816 .upload_image_button {
5817 display: block;
5818 width: 64px;
5819 height: 64px;
5820 float: left;
5821 margin-right: 20px;
5822 position: relative;
5823 cursor: pointer;
5824
5825 img {
5826 width: 100%;
5827 height: auto;
5828 display: none;
5829 }
5830
5831 &::before {
5832 content: "\f128";
5833 font-family: "Dashicons";
5834 position: absolute;
5835 top: 0;
5836 left: 0;
5837 right: 0;
5838 bottom: 0;
5839 text-align: center;
5840 line-height: 64px;
5841 font-size: 64px;
5842 font-weight: 400;
5843 -webkit-font-smoothing: antialiased;
5844 }
5845
5846 &.remove {
5847 img {
5848 display: block;
5849 }
5850
5851 &::before {
5852 content: "\f335";
5853 display: none;
5854 }
5855
5856 &:hover::before {
5857 display: block;
5858 }
5859 }
5860 }
5861
5862 .options {
5863 border: 1px solid #eee;
5864 border-width: 1px 0;
5865 padding: 0.25em 0;
5866
5867 label {
5868 display: inline-block;
5869 padding: 4px 1em 2px 0;
5870 }
5871
5872 input[type="checkbox"]="checkbox""] {
5873 margin: 0 5px 0 0.5em !important;
5874 vertical-align: middle;
5875 }
5876 }
5877 }
5878
5879 .form-row {
5880 label {
5881 display: inline-block;
5882 }
5883
5884 .woocommerce-help-tip {
5885 float: right;
5886 }
5887
5888 input[type="text"]="text""],
5889 input[type="number"]="number""],
5890 input[type="password"]="password""],
5891 input[type="color"]="color""],
5892 input[type="date"]="date""],
5893 input[type="datetime"]="datetime""],
5894 input[type="datetime-local"]="datetime-local""],
5895 input[type="email"]="email""],
5896 input[type="month"]="month""],
5897 input[type="search"]="search""],
5898 input[type="tel"]="tel""],
5899 input[type="time"]="time""],
5900 input[type="url"]="url""],
5901 input[type="week"]="week""],
5902 select,
5903 textarea {
5904 width: 100%;
5905 vertical-align: middle;
5906 margin: 2px 0 0;
5907 padding: 5px;
5908 }
5909
5910 select {
5911 height: 40px;
5912 }
5913
5914 &.dimensions_field {
5915 .wrap {
5916 clear: left;
5917 display: block;
5918 }
5919
5920 input {
5921 width: 33%;
5922 float: left;
5923 vertical-align: middle;
5924
5925 &:last-of-type {
5926 margin-right: 0;
5927 width: 34%;
5928 }
5929 }
5930 }
5931
5932 &.form-row-first,
5933 &.form-row-last {
5934 width: 48%;
5935 float: right;
5936 }
5937
5938 &.form-row-first {
5939 clear: both;
5940 float: left;
5941 }
5942
5943 &.form-row-full {
5944 clear: both;
5945 }
5946 }
5947
5948 /**
5949 * Tooltips
5950 */
5951 .tips {
5952 cursor: help;
5953 text-decoration: none;
5954 }
5955
5956 img.tips {
5957 padding: 5px 0 0;
5958 }
5959
5960 #tiptip_holder {
5961 display: none;
5962 z-index: 8675309;
5963 position: absolute;
5964 top: 0;
5965 pointer-events: none;
5966
5967 /*rtl:ignore*/
5968 left: 0;
5969
5970 &.tip_top {
5971 padding-bottom: 5px;
5972
5973 #tiptip_arrow_inner {
5974 margin-top: -7px;
5975 margin-left: -6px;
5976 border-top-color: #333;
5977 }
5978 }
5979
5980 &.tip_bottom {
5981 padding-top: 5px;
5982
5983 #tiptip_arrow_inner {
5984 margin-top: -5px;
5985 margin-left: -6px;
5986 border-bottom-color: #333;
5987 }
5988 }
5989
5990 &.tip_right {
5991 padding-left: 5px;
5992
5993 #tiptip_arrow_inner {
5994 margin-top: -6px;
5995 margin-left: -5px;
5996 border-right-color: #333;
5997 }
5998 }
5999
6000 &.tip_left {
6001 padding-right: 5px;
6002
6003 #tiptip_arrow_inner {
6004 margin-top: -6px;
6005 margin-left: -7px;
6006 border-left-color: #333;
6007 }
6008 }
6009 }
6010
6011 #tiptip_content,
6012 .chart-tooltip,
6013 .wc_error_tip {
6014 color: #fff;
6015 font-size: 0.8em;
6016 max-width: 150px;
6017 background: #333;
6018 text-align: center;
6019 border-radius: 3px;
6020 padding: 0.618em 1em;
6021 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
6022
6023 code {
6024 padding: 1px;
6025 background: #888;
6026 }
6027 }
6028
6029 #tiptip_arrow,
6030 #tiptip_arrow_inner {
6031 position: absolute;
6032 border-color: transparent;
6033 border-style: solid;
6034 border-width: 6px;
6035 height: 0;
6036 width: 0;
6037 }
6038
6039 /*rtl:raw:
6040 #tiptip_arrow {
6041 right: 50%;
6042 margin-right: -6px;
6043 }
6044 */
6045
6046 .wc_error_tip {
6047 max-width: 20em;
6048 line-height: 1.8em;
6049 position: absolute;
6050 white-space: normal;
6051 background: #d82223;
6052 margin: 1.5em 1px 0 -1em;
6053 z-index: 9999999;
6054
6055 &::after {
6056 content: "";
6057 display: block;
6058 border: 8px solid #d82223;
6059 border-right-color: transparent;
6060 border-left-color: transparent;
6061 border-top-color: transparent;
6062 position: absolute;
6063 top: -3px;
6064 left: 50%;
6065 margin: -1em 0 0 -3px;
6066 }
6067 }
6068
6069 /**
6070 * Date picker
6071 */
6072 img.ui-datepicker-trigger {
6073 vertical-align: middle;
6074 margin-top: -1px;
6075 cursor: pointer;
6076 }
6077
6078 .woocommerce_options_panel img.ui-datepicker-trigger,
6079 .wc-metabox-content img.ui-datepicker-trigger {
6080 float: left;
6081 margin-right: 8px;
6082 margin-top: 4px;
6083 margin-left: 4px;
6084 }
6085
6086 #ui-datepicker-div {
6087 display: none;
6088 }
6089
6090 /**
6091 * Reports
6092 */
6093 .woocommerce-reports-remove-filter {
6094 color: red;
6095 text-decoration: none;
6096 }
6097
6098 .woocommerce-reports-wrap,
6099 .woocommerce-reports-wide {
6100 &.woocommerce-reports-wrap {
6101 margin-left: 300px;
6102 padding-top: 18px;
6103 }
6104
6105 &.halved {
6106 margin: 0;
6107 overflow: hidden;
6108 zoom: 1;
6109 }
6110
6111 .widefat th {
6112 padding: 7px;
6113 }
6114
6115 .widefat td {
6116 vertical-align: top;
6117 padding: 7px;
6118
6119 .description {
6120 margin: 4px 0 0;
6121 }
6122 }
6123
6124 .postbox {
6125 &::after {
6126 content: ".";
6127 display: block;
6128 height: 0;
6129 clear: both;
6130 visibility: hidden;
6131 }
6132
6133 h3 {
6134 cursor: default !important;
6135 }
6136
6137 .inside {
6138 padding: 10px;
6139 margin: 0 !important;
6140 }
6141
6142 div.stats_range,
6143 h3.stats_range {
6144 border-bottom-color: #dfdfdf;
6145 margin: 0;
6146 padding: 0 !important;
6147
6148 .export_csv {
6149 float: right;
6150 line-height: 26px;
6151 border-left: 1px solid #dfdfdf;
6152 padding: 10px;
6153 display: block;
6154 text-decoration: none;
6155
6156 &::before {
6157 @include iconbeforedashicons("\f346");
6158 margin-right: 4px;
6159 }
6160 }
6161
6162 ul {
6163 list-style: none outside;
6164 margin: 0;
6165 padding: 0;
6166 zoom: 1;
6167 background: #f5f5f5;
6168 border-bottom: 1px solid #ccc;
6169
6170 &::before,
6171 &::after {
6172 content: " ";
6173 display: table;
6174 }
6175
6176 &::after {
6177 clear: both;
6178 }
6179
6180 li {
6181 float: left;
6182 margin: 0;
6183 padding: 0;
6184 line-height: 26px;
6185 font-weight: bold;
6186 font-size: 14px;
6187
6188 a {
6189 border-right: 1px solid #dfdfdf;
6190 padding: 10px;
6191 display: block;
6192 text-decoration: none;
6193 }
6194
6195 &.active {
6196 background: #fff;
6197 box-shadow: 0 4px 0 0 #fff;
6198
6199 a {
6200 color: #777;
6201 }
6202 }
6203
6204 &.custom {
6205 padding: 9px 10px;
6206 vertical-align: middle;
6207
6208 form,
6209 div {
6210 display: inline;
6211 margin: 0;
6212
6213 input.range_datepicker {
6214 padding: 0;
6215 margin: 0 10px 0 0;
6216 background: transparent;
6217 border: 0;
6218 color: #777;
6219 text-align: center;
6220 box-shadow: none;
6221
6222 &.from {
6223 margin-right: 0;
6224 }
6225 }
6226 }
6227 }
6228 }
6229 }
6230 }
6231
6232 .chart-with-sidebar {
6233 padding: 12px 12px 12px 249px;
6234 margin: 0 !important;
6235
6236 .chart-sidebar {
6237 width: 225px;
6238 margin-left: -237px;
6239 float: left;
6240 }
6241 }
6242
6243 .chart-widgets {
6244 margin: 0;
6245 padding: 0;
6246
6247 li.chart-widget {
6248 margin: 0 0 1em;
6249 background: #fafafa;
6250 border: 1px solid #dfdfdf;
6251
6252 &::after {
6253 content: ".";
6254 display: block;
6255 height: 0;
6256 clear: both;
6257 visibility: hidden;
6258 }
6259
6260 h4 {
6261 background: #fff;
6262 border: 1px solid #dfdfdf;
6263 border-left-width: 0;
6264 border-right-width: 0;
6265 padding: 10px;
6266 margin: 0;
6267 color: $blue;
6268 border-top-width: 0;
6269 background-image: linear-gradient(to top, #ececec, #f9f9f9);
6270
6271 &.section_title:hover {
6272 color: $red;
6273 }
6274 }
6275
6276 .section_title {
6277 cursor: pointer;
6278
6279 span {
6280 display: block;
6281
6282 &::after {
6283 @include iconafter("\e035");
6284 float: right;
6285 font-size: 0.9em;
6286 line-height: 1.618;
6287 }
6288 }
6289
6290 &.open {
6291 color: #333;
6292
6293 span::after {
6294 display: none;
6295 }
6296 }
6297 }
6298
6299 .section {
6300 border-bottom: 1px solid #dfdfdf;
6301
6302 .select2-container {
6303 width: 100% !important;
6304 }
6305
6306 &:last-of-type {
6307 border-radius: 0 0 3px 3px;
6308 }
6309 }
6310
6311 table {
6312 width: 100%;
6313
6314 td {
6315 padding: 7px 10px;
6316 vertical-align: top;
6317 border-top: 1px solid #e5e5e5;
6318 line-height: 1.4em;
6319 }
6320
6321 tr:first-child td {
6322 border-top: 0;
6323 }
6324
6325 td.count {
6326 background: #f5f5f5;
6327 }
6328
6329 td.name {
6330 max-width: 175px;
6331
6332 a {
6333 word-wrap: break-word;
6334 }
6335 }
6336
6337 td.sparkline {
6338 vertical-align: middle;
6339 }
6340
6341 .wc_sparkline {
6342 width: 32px;
6343 height: 1em;
6344 display: block;
6345 float: right;
6346 }
6347
6348 tr.active td {
6349 background: #f5f5f5;
6350 }
6351 }
6352
6353 form,
6354 p {
6355 margin: 0;
6356 padding: 10px;
6357
6358 .submit {
6359 margin-top: 10px;
6360 }
6361 }
6362
6363 #product_ids {
6364 width: 100%;
6365 }
6366
6367 .select_all,
6368 .select_none {
6369 float: right;
6370 color: #999;
6371 margin-left: 4px;
6372 margin-top: 10px;
6373 }
6374
6375 .description {
6376 margin-left: 0.5em;
6377 font-weight: normal;
6378 opacity: 0.8;
6379 }
6380 }
6381 }
6382
6383 .chart-legend {
6384 list-style: none outside;
6385 margin: 0 0 1em;
6386 padding: 0;
6387 border: 1px solid #dfdfdf;
6388 border-right-width: 0;
6389 border-bottom-width: 0;
6390 background: #fff;
6391
6392 li {
6393 border-right: 5px solid #aaa;
6394 color: #aaa;
6395 padding: 1em;
6396 display: block;
6397 margin: 0;
6398 transition: all ease 0.5s;
6399 box-shadow: inset 0 -1px 0 0 #dfdfdf;
6400
6401 strong {
6402 font-size: 1.618em;
6403 line-height: 1.2em;
6404 color: #464646;
6405 font-weight: normal;
6406 display: block;
6407 font-family: "HelveticaNeue-Light", "Helvetica Neue Light",
6408 "Helvetica Neue", sans-serif;
6409
6410 del {
6411 color: #e74c3c;
6412 font-weight: normal;
6413 }
6414 }
6415
6416 &:hover {
6417 box-shadow: inset 0 -1px 0 0 #dfdfdf,
6418 inset 300px 0 0 rgba(156, 93, 144, 0.1);
6419 border-right: 5px solid #9c5d90 !important;
6420 padding-left: 1.5em;
6421 color: #9c5d90;
6422 }
6423 }
6424 }
6425
6426 .pie-chart-legend {
6427 margin: 12px 0 0;
6428 overflow: hidden;
6429
6430 li {
6431 float: left;
6432 margin: 0;
6433 padding: 6px 0 0;
6434 border-top: 4px solid #999;
6435 text-align: center;
6436 box-sizing: border-box;
6437 width: 50%;
6438 }
6439 }
6440
6441 .stat {
6442 font-size: 1.5em !important;
6443 font-weight: 700;
6444 text-align: center;
6445 }
6446
6447 .chart-placeholder {
6448 width: 100%;
6449 height: 650px;
6450 overflow: hidden;
6451 position: relative;
6452 }
6453
6454 .chart-prompt {
6455 line-height: 650px;
6456 margin: 0;
6457 color: #999;
6458 font-size: 1.2em;
6459 font-style: italic;
6460 text-align: center;
6461 }
6462
6463 .chart-container {
6464 background: #fff;
6465 padding: 12px;
6466 position: relative;
6467 border: 1px solid #dfdfdf;
6468 border-radius: 3px;
6469 }
6470
6471 .main .chart-legend {
6472 margin-top: 12px;
6473
6474 li {
6475 border-right: 0;
6476 margin: 0 8px 0 0;
6477 float: left;
6478 border-top: 4px solid #aaa;
6479 }
6480 }
6481 }
6482
6483 .woocommerce-reports-main {
6484 float: left;
6485 min-width: 100%;
6486
6487 table td {
6488 padding: 9px;
6489 }
6490 }
6491
6492 .woocommerce-reports-sidebar {
6493 display: inline;
6494 width: 281px;
6495 margin-left: -300px;
6496 clear: both;
6497 float: left;
6498 }
6499
6500 .woocommerce-reports-left {
6501 width: 49.5%;
6502 float: left;
6503 }
6504
6505 .woocommerce-reports-right {
6506 width: 49.5%;
6507 float: right;
6508 }
6509 }
6510
6511 .woocommerce-wide-reports-wrap {
6512 padding-bottom: 11px;
6513
6514 .widefat {
6515 .export-data {
6516 float: right;
6517 }
6518
6519 th,
6520 td {
6521 vertical-align: middle;
6522 padding: 7px;
6523 }
6524 }
6525 }
6526
6527 form.report_filters {
6528 p {
6529 vertical-align: middle;
6530 }
6531
6532 label,
6533 input,
6534 div {
6535 vertical-align: middle;
6536 }
6537 }
6538
6539 .chart-tooltip {
6540 position: absolute;
6541 display: none;
6542 line-height: 1;
6543 }
6544
6545 table.bar_chart {
6546 width: 100%;
6547
6548 thead th {
6549 text-align: left;
6550 color: #ccc;
6551 padding: 6px 0;
6552 }
6553
6554 tbody {
6555 th {
6556 padding: 6px 0;
6557 width: 25%;
6558 text-align: left !important;
6559 font-weight: normal !important;
6560 border-bottom: 1px solid #fee;
6561 }
6562
6563 td {
6564 text-align: right;
6565 line-height: 24px;
6566 padding: 6px 6px 6px 0;
6567 border-bottom: 1px solid #fee;
6568
6569 span {
6570 color: #8a4b75;
6571 display: block;
6572 }
6573
6574 span.alt {
6575 color: #47a03e;
6576 margin-top: 6px;
6577 }
6578 }
6579
6580 td.bars {
6581 position: relative;
6582 text-align: left;
6583 padding: 6px 6px 6px 0;
6584 border-bottom: 1px solid #fee;
6585
6586 span,
6587 a {
6588 text-decoration: none;
6589 clear: both;
6590 background: #8a4b75;
6591 float: left;
6592 display: block;
6593 line-height: 24px;
6594 height: 24px;
6595 border-radius: 3px;
6596 }
6597
6598 span.alt {
6599 clear: both;
6600 background: #47a03e;
6601
6602 span {
6603 margin: 0;
6604 color: #c5dec2 !important;
6605 text-shadow: 0 1px 0 #47a03e;
6606 background: transparent;
6607 }
6608 }
6609 }
6610 }
6611 }
6612
6613 .woocommerce_page_wc-orders,
6614 .post-type-shop_order {
6615 .woocommerce-BlankState-message::before {
6616 @include icon("\e01d");
6617 }
6618 }
6619
6620 .post-type-shop_coupon .woocommerce-BlankState-message::before {
6621 @include icon("\e600");
6622 }
6623
6624 .post-type-product .woocommerce-BlankState-message::before {
6625 @include icon("\e006");
6626 }
6627
6628 .woocommerce-BlankState--api .woocommerce-BlankState-message::before {
6629 @include icon("\e01c");
6630 }
6631
6632 .woocommerce-BlankState--webhooks .woocommerce-BlankState-message::before {
6633 @include icon("\e01b");
6634 }
6635
6636 .woocommerce-BlankState {
6637 text-align: center;
6638 padding: 5em 0 0;
6639
6640 .woocommerce-BlankState-message {
6641 color: #aaa;
6642 margin: 0 auto 1.5em;
6643 line-height: 1.5em;
6644 font-size: 1.2em;
6645 max-width: 500px;
6646
6647 &::before {
6648 color: #ddd;
6649 text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.2),
6650 0 1px 0 rgba(255, 255, 255, 0.8);
6651 font-size: 8em;
6652 display: block;
6653 position: relative !important;
6654 top: auto;
6655 left: auto;
6656 line-height: 1em;
6657 margin: 0 0 0.1875em;
6658 }
6659 }
6660
6661 .woocommerce-BlankState-cta {
6662 font-size: 1.2em;
6663 padding: 0.75em 1.5em;
6664 margin: 0 0.25em;
6665 height: auto;
6666 display: inline-block !important;
6667 }
6668 }
6669
6670 .woocommerce_page_wc-orders .woocommerce-BlankState,
6671 .post-type-product .woocommerce-BlankState,
6672 .post-type-shop_order .woocommerce-BlankState {
6673 max-width: 764px;
6674 text-align: center;
6675 margin: auto;
6676
6677 .woocommerce-BlankState-message {
6678 color: #444;
6679 font-size: 1.5em;
6680 margin: 0 auto 1em;
6681 }
6682
6683 .woocommerce-BlankState-message::before {
6684 font-size: 120px;
6685 }
6686
6687 .woocommerce-BlankState-buttons {
6688 margin-bottom: 4em;
6689 }
6690 }
6691
6692 .post-type-product {
6693 #wp-pointer-2 .wp-pointer-arrow {
6694 left: 240px;
6695 }
6696
6697 #wp-pointer-3 .wp-pointer-arrow,
6698 #wp-pointer-4 .wp-pointer-arrow {
6699 left: 46%;
6700 }
6701 }
6702
6703 /**
6704 * Small screen optimisation
6705 */
6706 @media only screen and (max-width: 1280px) {
6707 #order_data {
6708 .order_data_column {
6709 width: 48%;
6710
6711 &:first-child {
6712 width: 100%;
6713 }
6714 }
6715 }
6716
6717 .woocommerce_options_panel {
6718 .description {
6719 display: block;
6720 clear: both;
6721 margin-left: 0;
6722 }
6723
6724 .short,
6725 input[type="text"]="text""].short,
6726 input[type="email"]="email""].short,
6727 input[type="number"]="number""].short,
6728 input[type="password"]="password""].short,
6729 .dimensions_field .wrap {
6730 width: 80%;
6731 }
6732 }
6733
6734 .woocommerce_variations,
6735 .woocommerce_options_panel {
6736 .downloadable_files {
6737 padding: 0;
6738 clear: both;
6739
6740 label {
6741 position: static;
6742 }
6743
6744 table {
6745 margin: 0 12px 24px;
6746 width: 94%;
6747
6748 .sort {
6749 visibility: hidden;
6750 }
6751 }
6752 }
6753
6754 .woocommerce_variable_attributes .downloadable_files table {
6755 margin: 0 0 1em;
6756 width: 100%;
6757 }
6758 }
6759 }
6760
6761 /**
6762 * Optimisation for screens 900px and smaller
6763 */
6764 @media only screen and (max-width: 900px) {
6765 #woocommerce-coupon-data ul.coupon_data_tabs,
6766 #woocommerce-product-data ul.product_data_tabs,
6767 #woocommerce-product-data .wc-tabs-back {
6768 width: 10%;
6769 }
6770
6771 #woocommerce-coupon-data .wc-metaboxes-wrapper,
6772 #woocommerce-coupon-data .woocommerce_options_panel,
6773 #woocommerce-product-data .wc-metaboxes-wrapper,
6774 #woocommerce-product-data .woocommerce_options_panel {
6775 width: 90%;
6776 }
6777
6778 #woocommerce-coupon-data ul.coupon_data_tabs li a,
6779 #woocommerce-product-data ul.product_data_tabs li a {
6780 position: relative;
6781 text-indent: -999px;
6782 padding: 10px;
6783
6784 &::before {
6785 position: absolute;
6786 top: 0;
6787 right: 0;
6788 bottom: 0;
6789 left: 0;
6790 text-indent: 0;
6791 text-align: center;
6792 line-height: 40px;
6793 width: 100%;
6794 height: 40px;
6795 }
6796 }
6797 }
6798
6799 /**
6800 * Optimisation for screens 782px and smaller
6801 */
6802 @media only screen and (max-width: 782px) {
6803 #wp-excerpt-media-buttons a {
6804 font-size: 16px;
6805 line-height: 37px;
6806 height: 39px;
6807 padding: 0 20px 0 15px;
6808 }
6809
6810 #wp-excerpt-editor-tools {
6811 padding-top: 20px;
6812 padding-right: 15px;
6813 overflow: hidden;
6814 margin-bottom: -1px;
6815 }
6816
6817 #woocommerce-product-data .checkbox {
6818 width: 25px;
6819 }
6820
6821 .variations-pagenav {
6822 float: none;
6823 text-align: center;
6824 font-size: 18px;
6825
6826 .displaying-num {
6827 font-size: 16px;
6828 }
6829
6830 a {
6831 padding: 8px 20px 11px;
6832 font-size: 18px;
6833 }
6834
6835 select {
6836 padding: 0 20px;
6837 }
6838 }
6839
6840 .variations-defaults {
6841 float: none;
6842 text-align: center;
6843 margin-top: 10px;
6844 }
6845
6846 .post-type-product {
6847 .wp-list-table {
6848 .column-thumb {
6849 display: none;
6850 text-align: left;
6851 padding-bottom: 0;
6852
6853 &::before {
6854 display: none !important;
6855 }
6856
6857 img {
6858 max-width: 32px;
6859 }
6860 }
6861
6862 .is-expanded td:not(.hidden) {
6863 overflow: visible;
6864 }
6865
6866 .is-expanded .toggle-row {
6867 top: -28px;
6868 }
6869 }
6870 }
6871
6872 .post-type-shop_order {
6873 .wp-list-table {
6874 .column-customer_message,
6875 .column-order_notes {
6876 text-align: inherit;
6877 }
6878
6879 .column-order_notes .note-on {
6880 font-size: 1.3em;
6881 margin: 0;
6882 }
6883
6884 .is-expanded td:not(.hidden) {
6885 overflow: visible;
6886 }
6887
6888 .toggle-row {
6889 top: -15px;
6890 }
6891 }
6892 }
6893 }
6894
6895 @media only screen and (max-width: 500px) {
6896 .woocommerce_options_panel label,
6897 .woocommerce_options_panel legend {
6898 float: none;
6899 width: auto;
6900 display: block;
6901 margin: 0;
6902 }
6903
6904 .woocommerce_options_panel fieldset.form-field,
6905 .woocommerce_options_panel p.form-field {
6906 padding: 5px 20px !important;
6907 }
6908
6909 .addons-wcs-banner-block {
6910 flex-direction: column;
6911 }
6912
6913 .wc-addons-wrap {
6914 .addons-wcs-banner-block {
6915 padding: 40px;
6916 }
6917
6918 .addons-wcs-banner-block-image {
6919 padding: 1em;
6920 text-align: center;
6921 width: 100%;
6922 padding: 2em 0;
6923 margin: 0;
6924
6925 .addons-img {
6926 margin: 0;
6927 }
6928 }
6929 }
6930 }
6931
6932 /**
6933 * Backbone modal dialog
6934 */
6935 .wc-backbone-modal {
6936 * {
6937 box-sizing: border-box;
6938 }
6939
6940 .wc-backbone-modal-content {
6941 position: fixed;
6942 background: #fff;
6943 z-index: 100000;
6944 left: 50%;
6945 top: 50%;
6946 transform: translate(-50%, -50%);
6947 max-width: 100%;
6948 min-width: 500px;
6949
6950 article {
6951 overflow: auto;
6952 }
6953 }
6954
6955 &.wc-backbone-modal-shipping-method-settings .wc-backbone-modal-content {
6956 width: 75%;
6957 min-width: 500px;
6958 }
6959
6960 .select2-container {
6961 width: 100% !important;
6962 }
6963 }
6964
6965 @media screen and (max-width: 782px) {
6966 .wc-backbone-modal .wc-backbone-modal-content {
6967 width: 100%;
6968 height: 100%;
6969 min-width: 100%;
6970 }
6971 }
6972
6973 .wc-backbone-modal-backdrop {
6974 position: fixed;
6975 top: 0;
6976 left: 0;
6977 right: 0;
6978 bottom: 0;
6979 min-height: 360px;
6980 background: #000;
6981 opacity: 0.7;
6982 z-index: 99900;
6983 }
6984
6985 .wc-backbone-modal-main {
6986 padding-bottom: 55px;
6987
6988 header,
6989 article {
6990 display: block;
6991 position: relative;
6992 }
6993
6994 .wc-backbone-modal-header {
6995 height: auto;
6996 background: #fcfcfc;
6997 padding: 1em 1.5em;
6998 border-bottom: 1px solid #ddd;
6999
7000 h1 {
7001 margin: 0;
7002 font-size: 18px;
7003 font-weight: 700;
7004 line-height: 1.5em;
7005 }
7006
7007 .modal-close-link {
7008 cursor: pointer;
7009 color: #777;
7010 height: 54px;
7011 width: 54px;
7012 padding: 0;
7013 position: absolute;
7014 top: 0;
7015 right: 0;
7016 text-align: center;
7017 border: 0;
7018 border-left: 1px solid #ddd;
7019 background-color: transparent;
7020 transition: color 0.1s ease-in-out, background 0.1s ease-in-out;
7021
7022 &::before {
7023 font: normal 22px/50px "dashicons" !important;
7024 color: #666;
7025 display: block;
7026 content: "\f335";
7027 font-weight: 300;
7028 }
7029
7030 &:hover,
7031 &:focus {
7032 background: #ddd;
7033 border-color: #ccc;
7034 color: #000;
7035 }
7036
7037 &:focus {
7038 outline: none;
7039 }
7040 }
7041 }
7042
7043 article {
7044 padding: 1.5em;
7045
7046 p {
7047 margin: 1.5em 0;
7048 }
7049
7050 p:first-child {
7051 margin-top: 0;
7052 }
7053
7054 p:last-child {
7055 margin-bottom: 0;
7056 }
7057
7058 .pagination {
7059 padding: 10px 0 0;
7060 text-align: center;
7061 }
7062
7063 table.widefat {
7064 margin: 0;
7065 width: 100%;
7066 border: 0;
7067 box-shadow: none;
7068
7069 thead th {
7070 padding: 0 1em 1em 1em;
7071 text-align: left;
7072
7073 &:first-child {
7074 padding-left: 0;
7075 }
7076
7077 &:last-child {
7078 padding-right: 0;
7079 text-align: right;
7080 }
7081 }
7082
7083 tbody td,
7084 tbody th {
7085 padding: 1em;
7086 text-align: left;
7087 vertical-align: middle;
7088
7089 &:first-child {
7090 padding-left: 0;
7091 }
7092
7093 &:last-child {
7094 padding-right: 0;
7095 text-align: right;
7096 }
7097
7098 select,
7099 .select2-container {
7100 width: 100%;
7101 }
7102 }
7103 }
7104 }
7105
7106 footer {
7107 position: absolute;
7108 left: 0;
7109 right: 0;
7110 bottom: 0;
7111 z-index: 100;
7112 padding: 1em 1.5em;
7113 background: #fcfcfc;
7114 border-top: 1px solid #dfdfdf;
7115 box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
7116
7117 .inner {
7118 text-align: right;
7119 line-height: 23px;
7120
7121 .button {
7122 margin-bottom: 0;
7123 }
7124 }
7125 }
7126 }
7127
7128 /**
7129 * Select2 elements.
7130 */
7131 .select2-drop,
7132 .select2-dropdown {
7133 z-index: 999999 !important;
7134 }
7135
7136 .select2-results {
7137 line-height: 1.5em;
7138
7139 .select2-results__option,
7140 .select2-results__group {
7141 margin: 0;
7142 padding: 8px;
7143 }
7144
7145 .description {
7146 display: block;
7147 color: #999;
7148 padding-top: 4px;
7149 }
7150 }
7151
7152 .select2-dropdown {
7153 border-color: #ddd;
7154 }
7155
7156 .select2-dropdown--below {
7157 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
7158 }
7159
7160 .select2-dropdown--above {
7161 box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.1);
7162 }
7163
7164 .select2-container {
7165 .select2-selection__rendered.ui-sortable li {
7166 cursor: move;
7167 }
7168
7169 .select2-selection {
7170 border-color: #ddd;
7171 }
7172
7173 .select2-search__field {
7174 min-width: 150px;
7175 }
7176
7177 .select2-selection--single {
7178 height: 40px;
7179
7180 .select2-selection__rendered {
7181 line-height: 40px;
7182 padding-right: 24px;
7183 }
7184
7185 .select2-selection__arrow {
7186 right: 3px;
7187 height: 36px;
7188 }
7189 }
7190
7191 .select2-selection--multiple {
7192 min-height: 28px;
7193 border-radius: 0;
7194 line-height: 1.5;
7195
7196 li {
7197 margin: 0;
7198 }
7199
7200 .select2-selection__choice {
7201 padding: 2px 6px;
7202
7203 .description {
7204 display: none;
7205 }
7206 }
7207 }
7208
7209 .select2-selection__clear {
7210 color: #999;
7211 margin-top: -1px;
7212 z-index: 1;
7213 }
7214
7215 .select2-search--inline .select2-search__field {
7216 font-family: inherit;
7217 font-size: inherit;
7218 font-weight: inherit;
7219 padding: 3px 0;
7220 }
7221 }
7222
7223 .woocommerce table.form-table .select2-container {
7224 min-width: 400px !important;
7225 }
7226
7227 .wc-wp-version-gte-53 {
7228 .select2-results {
7229 .select2-results__option,
7230 .select2-results__group {
7231 &:focus {
7232 outline: none;
7233 }
7234 }
7235 }
7236
7237 .select2-dropdown {
7238 border-color: #007cba;
7239
7240 &::after {
7241 position: absolute;
7242 left: 0;
7243 right: 0;
7244 height: 1px;
7245 background: #fff;
7246 content: "";
7247 }
7248 }
7249
7250 .select2-dropdown--below {
7251 box-shadow: 0 0 0 1px #007cba, 0 2px 1px rgba(0, 0, 0, 0.1);
7252
7253 &::after {
7254 top: -1px;
7255 }
7256 }
7257
7258 .select2-dropdown--above {
7259 box-shadow: 0 0 0 1px #007cba, 0 -2px 1px rgba(0, 0, 0, 0.1);
7260
7261 &::after {
7262 bottom: -1px;
7263 }
7264 }
7265
7266 .select2-container {
7267 @media only screen and (max-width: 782px) {
7268 font-size: 16px;
7269 }
7270
7271 &:focus {
7272 outline: none;
7273 }
7274
7275 .select2-selection--single {
7276 height: 30px;
7277 border-color: #7e8993;
7278
7279 @media only screen and (max-width: 782px) {
7280 height: 40px;
7281 }
7282
7283 &:focus {
7284 outline: none;
7285 }
7286
7287 .select2-selection__rendered {
7288 line-height: 28px;
7289
7290 @media only screen and (max-width: 782px) {
7291 line-height: 38px;
7292 }
7293
7294 &:hover {
7295 color: #007cba;
7296 }
7297 }
7298
7299 .select2-selection__arrow {
7300 right: 1px;
7301 height: 28px;
7302 width: 23px;
7303 background: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E")
7304 no-repeat right 5px top 55%;
7305 background-size: 16px 16px;
7306
7307 @media only screen and (max-width: 782px) {
7308 height: 38px;
7309 }
7310
7311 b {
7312 display: none;
7313 }
7314 }
7315 }
7316
7317 &.select2-container--focus .select2-selection--single,
7318 &.select2-container--open .select2-selection--single,
7319 &.select2-container--open .select2-selection--multiple {
7320 border-color: #007cba;
7321 box-shadow: 0 0 0 1px #007cba;
7322 }
7323
7324 .select2-selection--multiple {
7325 min-height: 30px;
7326 border-color: #7e8993;
7327 border-radius: 4px;
7328 }
7329
7330 .select2-search--inline .select2-search__field {
7331 padding: 0 0 0 3px;
7332 min-height: 28px;
7333 }
7334 }
7335
7336 .woocommerce table.form-table .select2-container {
7337 @media only screen and (max-width: 782px) {
7338 min-width: 100% !important;
7339 }
7340 }
7341 }
7342
7343 .wc-wp-version-gte-55 {
7344 #woocommerce-product-data {
7345 .hndle {
7346 display: block;
7347 line-height: 24px;
7348
7349 .type_box {
7350 display: inline;
7351 line-height: inherit;
7352 vertical-align: baseline;
7353 }
7354 }
7355 }
7356 }
7357
7358 /**
7359 * Select2 colors for built-in admin color themes.
7360 */
7361 .wp-admin {
7362 &.wc-wp-version-gte-53 {
7363 .select2-dropdown {
7364 border-color: var(--wp-admin-theme-color);
7365 }
7366
7367 .select2-dropdown--below {
7368 box-shadow: 0 0 0 1px var(--wp-admin-theme-color), 0 2px 1px rgba(0, 0, 0, 0.1);
7369 }
7370
7371 .select2-dropdown--above {
7372 box-shadow: 0 0 0 1px var(--wp-admin-theme-color), 0 -2px 1px rgba(0, 0, 0, 0.1);
7373 }
7374
7375 .select2-selection--single .select2-selection__rendered:hover {
7376 color: var(--wp-admin-theme-color);
7377 }
7378
7379 .select2-container.select2-container--focus
7380 .select2-selection--single,
7381 .select2-container.select2-container--open
7382 .select2-selection--single,
7383 .select2-container.select2-container--open
7384 .select2-selection--multiple {
7385 border-color: var(--wp-admin-theme-color);
7386 box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
7387 }
7388
7389 .select2-container--default
7390 .select2-results__option--highlighted[aria-selected]],
7391 .select2-container--default
7392 .select2-results__option--highlighted[data-selected]] {
7393 background-color: var(--wp-admin-theme-color);
7394 }
7395 }
7396 }
7397
7398 .woocommerce_page_wc-orders .tablenav,
7399 .post-type-product .tablenav,
7400 .post-type-shop_order .tablenav {
7401 .actions {
7402 overflow: visible;
7403 }
7404
7405 select,
7406 input {
7407 height: 32px;
7408 }
7409
7410 .select2-container {
7411 float: left;
7412 width: 240px !important;
7413 font-size: 14px;
7414 vertical-align: middle;
7415 margin: 1px 6px 4px 1px;
7416 }
7417 }
7418
7419 .woocommerce-progress-form-wrapper,
7420 .woocommerce-exporter-wrapper,
7421 .woocommerce-importer-wrapper {
7422 text-align: center;
7423 max-width: 700px;
7424 margin: 40px auto;
7425
7426 .error {
7427 text-align: left;
7428 }
7429
7430 .wc-progress-steps {
7431 padding: 0 0 24px;
7432 margin: 0;
7433 list-style: none outside;
7434 overflow: hidden;
7435 color: #ccc;
7436 width: 100%;
7437 display: -webkit-inline-flex;
7438 display: -ms-inline-flexbox;
7439 display: inline-flex;
7440
7441 li {
7442 width: 25%;
7443 float: left;
7444 padding: 0 0 0.8em;
7445 margin: 0;
7446 text-align: center;
7447 position: relative;
7448 border-bottom: 4px solid #ccc;
7449 line-height: 1.4em;
7450 }
7451
7452 li::before {
7453 content: "";
7454 border: 4px solid #ccc;
7455 border-radius: 100%;
7456 width: 4px;
7457 height: 4px;
7458 position: absolute;
7459 bottom: 0;
7460 left: 50%;
7461 margin-left: -6px;
7462 margin-bottom: -8px;
7463 background: #fff;
7464 }
7465
7466 li.active {
7467 border-color: var(--wp-admin-theme-color);
7468 color: var(--wp-admin-theme-color);
7469
7470 &::before {
7471 border-color: var(--wp-admin-theme-color);
7472 }
7473 }
7474
7475 li.done {
7476 border-color: var(--wp-admin-theme-color);
7477 color: var(--wp-admin-theme-color);
7478
7479 &::before {
7480 border-color: var(--wp-admin-theme-color);
7481 background: var(--wp-admin-theme-color);
7482 }
7483 }
7484 }
7485
7486 .button {
7487 font-size: 1.25em;
7488 padding: 0.5em 1em !important;
7489 line-height: 1.5em !important;
7490 border-radius: 4px;
7491 }
7492
7493 .error .button {
7494 font-size: 1em;
7495 }
7496
7497 .wc-actions {
7498 overflow: hidden;
7499 border-top: 1px solid #eee;
7500 margin: 0;
7501 padding: 23px 24px 24px;
7502 line-height: 3em;
7503
7504 .button {
7505 float: right;
7506 }
7507
7508 .woocommerce-importer-toggle-advanced-options {
7509 color: #999;
7510 }
7511 }
7512
7513 .woocommerce-exporter,
7514 .woocommerce-importer,
7515 .wc-progress-form-content {
7516 background: #fff;
7517 overflow: hidden;
7518 padding: 0;
7519 margin: 0 0 16px;
7520 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.13);
7521 color: #555;
7522 text-align: left;
7523
7524 header {
7525 border-bottom: 1px solid #eee;
7526 margin: 0;
7527 padding: 24px 24px 0;
7528 }
7529
7530 section {
7531 padding: 24px 24px 0;
7532 }
7533
7534 h2 {
7535 margin: 0 0 24px;
7536 color: #555;
7537 font-size: 24px;
7538 font-weight: normal;
7539 line-height: 1em;
7540 }
7541
7542 p {
7543 font-size: 1em;
7544 line-height: 1.75em;
7545 font-size: 16px;
7546 color: #555;
7547 margin: 0 0 24px;
7548 }
7549
7550 .form-row {
7551 margin-top: 24px;
7552 }
7553
7554 .spinner {
7555 display: none;
7556 }
7557
7558 .woocommerce-importer-options th,
7559 .woocommerce-importer-options td,
7560 .woocommerce-exporter-options th,
7561 .woocommerce-exporter-options td {
7562 vertical-align: top;
7563 line-height: 1.75em;
7564 padding: 0 0 24px 0;
7565
7566 label {
7567 color: #555;
7568 font-weight: normal;
7569 }
7570
7571 input[type="checkbox"]="checkbox""] {
7572 margin: 0 4px 0 0;
7573 padding: 7px;
7574 }
7575
7576 input[type="text"]="text""],
7577 input[type="number"]="number""] {
7578 padding: 7px;
7579 height: auto;
7580 margin: 0;
7581 }
7582
7583 .woocommerce-importer-file-url-field-wrapper {
7584 border: 1px solid #ddd;
7585 -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07);
7586 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07);
7587 background-color: #fff;
7588 color: #32373c;
7589 outline: 0;
7590 line-height: 1;
7591 display: block;
7592
7593 code {
7594 background: none;
7595 font-size: smaller;
7596 padding: 0;
7597 margin: 0;
7598 color: #999;
7599 padding: 7px 0 0 7px;
7600 display: inline-block;
7601 }
7602
7603 input {
7604 font-family: Consolas, Monaco, monospace;
7605 border: 0;
7606 margin: 0;
7607 outline: 0;
7608 box-shadow: none;
7609 display: inline-block;
7610 min-width: 100%;
7611 }
7612 }
7613 }
7614
7615 .woocommerce-exporter-options th,
7616 .woocommerce-importer-options th {
7617 width: 35%;
7618 padding-right: 20px;
7619 }
7620
7621 progress {
7622 width: 100%;
7623 height: 42px;
7624 margin: 0 auto 24px;
7625 display: block;
7626 -webkit-appearance: none;
7627 border: none;
7628 display: none;
7629 background: #f5f5f5;
7630 border: 2px solid #eee;
7631 border-radius: 4px;
7632 padding: 0;
7633 box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.2);
7634 }
7635
7636 progress::-webkit-progress-bar {
7637 background: transparent none;
7638 border: 0;
7639 border-radius: 4px;
7640 padding: 0;
7641 box-shadow: none;
7642 }
7643
7644 progress::-webkit-progress-value {
7645 border-radius: 3px;
7646 box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
7647 background: var(--wp-admin-theme-color);
7648 transition: width 1s ease;
7649 }
7650
7651 progress::-moz-progress-bar {
7652 border-radius: 3px;
7653 box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
7654 background: var(--wp-admin-theme-color);
7655 transition: width 1s ease;
7656 }
7657
7658 progress::-ms-fill {
7659 border-radius: 3px;
7660 box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
7661 background: var(--wp-admin-theme-color);
7662 transition: width 1s ease;
7663 }
7664
7665 &.woocommerce-exporter__exporting,
7666 &.woocommerce-importer__importing {
7667 .spinner {
7668 display: block;
7669 }
7670
7671 progress {
7672 display: block;
7673 }
7674
7675 .wc-actions,
7676 .woocommerce-exporter-options {
7677 display: none;
7678 }
7679 }
7680
7681 .wc-importer-mapping-table-wrapper,
7682 .wc-importer-error-log {
7683 padding: 0;
7684 }
7685
7686 .wc-importer-mapping-table,
7687 .wc-importer-error-log-table {
7688 margin: 0;
7689 border: 0;
7690 box-shadow: none;
7691 width: 100%;
7692 table-layout: fixed;
7693
7694 td,
7695 th {
7696 border: 0;
7697 padding: 12px;
7698 vertical-align: middle;
7699 word-wrap: break-word;
7700
7701 select {
7702 width: 100%;
7703 }
7704 }
7705
7706 tbody tr:nth-child(odd) td,
7707 tbody tr:nth-child(odd) th {
7708 background: #fbfbfb;
7709 }
7710
7711 th {
7712 font-weight: bold;
7713 }
7714
7715 td:first-child,
7716 th:first-child {
7717 padding-left: 24px;
7718 }
7719
7720 td:last-child,
7721 th:last-child {
7722 padding-right: 24px;
7723 }
7724
7725 .wc-importer-mapping-table-name {
7726 width: 50%;
7727
7728 .description {
7729 color: #999;
7730 margin-top: 4px;
7731 display: block;
7732
7733 code {
7734 background: none;
7735 padding: 0;
7736 white-space: pre-line;
7737 /* CSS 3 (and 2.1 as well, actually) */
7738 word-wrap: break-word;
7739 /* IE */
7740 word-break: break-all;
7741 }
7742 }
7743 }
7744 }
7745
7746 .woocommerce-importer-done {
7747 text-align: center;
7748 padding: 48px 24px;
7749 font-size: 1.5em;
7750 line-height: 1.75em;
7751
7752 &::before {
7753 @include icon("\e015");
7754 color: var(--wp-admin-theme-color);
7755 position: static;
7756 font-size: 100px;
7757 display: block;
7758 float: none;
7759 margin: 0 0 24px;
7760 }
7761 }
7762 }
7763 }
7764
7765 .wc-pointer {
7766 .wc-pointer-buttons {
7767 .close {
7768 float: left;
7769 margin: 6px 0 0 15px;
7770 }
7771 }
7772 }
7773
7774 .wc-quick-edit-warning {
7775 color: darkred;
7776 font-weight: bold;
7777 }
7778
7779 .wc-addons__empty {
7780 margin: 48px auto;
7781 max-width: 640px;
7782
7783 h2 {
7784 font-size: 20px;
7785 font-weight: 400;
7786 line-height: 1.2;
7787 }
7788
7789 p {
7790 font-size: 16px;
7791 line-height: 1.5;
7792 }
7793 }
7794
7795 @media screen and (min-width: 600px) {
7796 .wc-addons-wrap {
7797 .marketplace-header {
7798 padding-left: 84px;
7799 }
7800
7801 .storefront {
7802 h2 {
7803 margin-top: 0;
7804 }
7805
7806 img {
7807 float: left;
7808 margin: 0 16px 0 auto;
7809 width: 278px;
7810 }
7811 }
7812 }
7813
7814 .marketplace-header__tab {
7815 flex: none;
7816 }
7817 }
7818
7819 @media screen and (min-width: 961px) {
7820 .marketplace-header__tabs {
7821 margin-left: 84px;
7822 }
7823 }
7824
7825 @media screen and (min-width: 1024px) {
7826 .current-section-name {
7827 display: none;
7828 }
7829
7830 .wc-addons-wrap {
7831 .current-section-dropdown__title {
7832 display: block;
7833 font-size: 20px;
7834 font-weight: 400;
7835 line-height: 24px;
7836 margin: 0 0 16px;
7837 }
7838
7839 .current-section-dropdown {
7840 background: none;
7841 border: none;
7842 margin-bottom: 32px;
7843 width: 100%;
7844
7845 ul {
7846 background: none;
7847 border: none;
7848 display: flex;
7849 flex-direction: row;
7850 flex-wrap: wrap;
7851 justify-content: flex-start;
7852 margin-top: -12px;
7853 padding: 0;
7854 position: static;
7855
7856 li {
7857 background: #fff;
7858 border: 1px solid #ccc;
7859 border-radius: 32px;
7860 font-size: 14px;
7861 line-height: 20px;
7862 margin: 12px 12px 0 0;
7863
7864 &.current {
7865 background: var(--wp-admin-theme-color);
7866 border: 1px solid var(--wp-admin-theme-color);
7867
7868 a {
7869 color: #fff;
7870 }
7871
7872 a::after {
7873 background: none;
7874 }
7875 }
7876 }
7877
7878 a,
7879 a:visited,
7880 a:hover,
7881 a:active {
7882 color: #2c3338;
7883 padding: 10px 16px !important;
7884 }
7885 }
7886
7887 li:last-child {
7888 a::after {
7889 display: none;
7890 }
7891 }
7892 }
7893 }
7894 }
7895
7896 /**
7897 * Product Reviews
7898 */
7899 .wp-list-table.product-reviews {
7900 .column-author {
7901 width: 20%;
7902 }
7903
7904 th.column-type {
7905 width: 10%;
7906 }
7907
7908 @media screen and (max-width: 782px) {
7909 th.column-type,
7910 td.column-type,
7911 th.column-author,
7912 td.column-author,
7913 th.column-rating,
7914 td.column-rating {
7915 display: none !important;
7916 }
7917
7918 .toggle-row {
7919 top: 10px;
7920 }
7921 }
7922 }
7923
7924 #wp-content-media-buttons {
7925 display: flex;
7926 align-items: center;
7927
7928 > .woocommerce-help-tip {
7929 margin: 0 5px 4px 5px;
7930 }
7931 }
7932
7933 #postexcerpt {
7934 > .postbox-header {
7935 > .hndle {
7936 justify-content: flex-start;
7937
7938 > .woocommerce-help-tip {
7939 margin: 0 10px;
7940 }
7941 }
7942 }
7943 }
7944
7945 #postdivrich.woocommerce-product-description {
7946 margin-top: 20px;
7947 margin-bottom: 0px;
7948
7949 .wp-editor-tools {
7950 background: none;
7951 padding-top: 0px;
7952 width: 100%;
7953 }
7954 .wp-editor-wrap {
7955 margin: 6px 12px 0;
7956 }
7957 #post-status-info {
7958 margin: 0px 12px 12px;
7959 width: calc(100% - 24px);
7960 }
7961 }
7962