Customify – A Theme Customizer Booster - Version 1.7.0

Version Description

  • Added Dynamic Color Palettes for a smoother experience
  • Fixed issue with the Style Manager crashing the Customizer when not using a theme with support for it.
Download this release

Release Info

Developer pixelgrade
Plugin Icon Customify – A Theme Customizer Booster
Version 1.7.0
Comparing to
See all releases

Code changes from version 1.6.5 to 1.7.0

Files changed (14) hide show
  1. class-pixcustomify.php +31 -11
  2. css/admin.css +24 -25
  3. css/customizer.css +1574 -1832
  4. customify.php +2 -2
  5. includes/class-customify-style-manager.php +1012 -0
  6. js/customizer.js +98 -0
  7. js/customizer/customify-palette-variations.js +7 -7
  8. js/customizer/customify-palettes.js +38 -8
  9. js/customizer_preview.js +1 -1
  10. mock_style_manager_config.php +0 -408
  11. plugin-config.php +0 -4
  12. readme.txt +5 -1
  13. scss/_feedback-modal.scss +439 -0
  14. scss/customizer.scss +69 -34
class-pixcustomify.php CHANGED
@@ -125,6 +125,14 @@ class PixCustomifyPlugin {
125
  */
126
  public $file;
127
 
 
 
 
 
 
 
 
 
128
  /**
129
  * Minimal Required PHP Version
130
  * @var string
@@ -157,6 +165,12 @@ class PixCustomifyPlugin {
157
  // Load the plugin's settings from the DB
158
  $this->plugin_settings = get_option( $this->config['settings-key'] );
159
 
 
 
 
 
 
 
160
  // Register all the needed hooks
161
  $this->register_hooks();
162
  }
@@ -208,8 +222,8 @@ class PixCustomifyPlugin {
208
  add_action( 'customize_controls_init', array( $this, 'register_admin_customizer_styles' ), 10 );
209
  add_action( 'customize_controls_enqueue_scripts', array( $this, 'enqueue_admin_customizer_styles' ), 10 );
210
  // Scripts enqueued in the Customizer
211
- add_action( 'customize_controls_init', array( $this, 'register_admin_customizer_scripts' ), 10 );
212
- add_action( 'customize_controls_enqueue_scripts', array( $this, 'enqueue_admin_customizer_scripts' ), 10 );
213
 
214
  // Scripts enqueued only in the theme preview
215
  add_action( 'customize_preview_init', array( $this, 'customizer_live_preview_register_scripts' ), 10 );
@@ -282,6 +296,18 @@ class PixCustomifyPlugin {
282
  }
283
 
284
  $this->localized['theme_fonts'] = $this->theme_fonts = Customify_Font_Selector::instance()->get_theme_fonts();
 
 
 
 
 
 
 
 
 
 
 
 
285
  }
286
 
287
  /**
@@ -339,10 +365,6 @@ class PixCustomifyPlugin {
339
  wp_register_script( 'jquery-react', plugins_url( 'js/jquery-react.js', $this->file ), array( 'jquery' ), $this->_version );
340
 
341
  wp_register_script( 'customify-scale', plugins_url( 'js/customizer/customify-scale.js', $this->file ), array( 'jquery' ), $this->_version );
342
- wp_register_script( 'customify-swap-values', plugins_url( 'js/customizer/customify-swap-values.js', $this->file ), array( 'jquery' ), $this->_version );
343
-
344
- wp_register_script( 'customify-palette-variations', plugins_url( 'js/customizer/customify-palette-variations.js', $this->file ), array( 'jquery' ), $this->_version );
345
- wp_register_script( 'customify-palettes', plugins_url( 'js/customizer/customify-palettes.js', $this->file ), array( 'jquery', 'customify-palette-variations' ), $this->_version );
346
 
347
  wp_register_script( $this->plugin_slug . '-customizer-scripts', plugins_url( 'js/customizer.js', $this->file ), array(
348
  'jquery',
@@ -351,8 +373,6 @@ class PixCustomifyPlugin {
351
  'customize-controls',
352
 
353
  'customify-scale',
354
- 'customify-swap-values',
355
- 'customify-palettes',
356
  ), $this->_version );
357
  }
358
 
@@ -1910,9 +1930,9 @@ class PixCustomifyPlugin {
1910
  }
1911
 
1912
  /**
1913
- * A public function to retreat an option's value
1914
- * If there is a value and return it
1915
- * Otherwise try to get the default parameter or the default from config
1916
  *
1917
  * @param $option
1918
  * @param mixed $default Optional.
125
  */
126
  public $file;
127
 
128
+ /**
129
+ * Style Manager class object.
130
+ * @var Customify_Style_Manager
131
+ * @access public
132
+ * @since 1.0.0
133
+ */
134
+ public $style_manager = null;
135
+
136
  /**
137
  * Minimal Required PHP Version
138
  * @var string
165
  // Load the plugin's settings from the DB
166
  $this->plugin_settings = get_option( $this->config['settings-key'] );
167
 
168
+ /* Initialize the Style Manager logic. */
169
+ require_once( $this->plugin_basepath . 'includes/class-customify-style-manager.php' );
170
+ if ( is_null( $this->style_manager ) ) {
171
+ $this->style_manager = Customify_Style_Manager::instance( $this );
172
+ }
173
+
174
  // Register all the needed hooks
175
  $this->register_hooks();
176
  }
222
  add_action( 'customize_controls_init', array( $this, 'register_admin_customizer_styles' ), 10 );
223
  add_action( 'customize_controls_enqueue_scripts', array( $this, 'enqueue_admin_customizer_styles' ), 10 );
224
  // Scripts enqueued in the Customizer
225
+ add_action( 'customize_controls_init', array( $this, 'register_admin_customizer_scripts' ), 15 );
226
+ add_action( 'customize_controls_enqueue_scripts', array( $this, 'enqueue_admin_customizer_scripts' ), 15 );
227
 
228
  // Scripts enqueued only in the theme preview
229
  add_action( 'customize_preview_init', array( $this, 'customizer_live_preview_register_scripts' ), 10 );
296
  }
297
 
298
  $this->localized['theme_fonts'] = $this->theme_fonts = Customify_Font_Selector::instance()->get_theme_fonts();
299
+
300
+ $this->localized['ajax_url'] = admin_url( 'admin-ajax.php' );
301
+ $this->localized['style_manager_user_feedback_nonce'] = wp_create_nonce( 'customify_style_manager_user_feedback' );
302
+ $this->localized['style_manager_user_feedback_provided'] = $this->get_option( 'style_manager_user_feedback_provided', false );
303
+ }
304
+
305
+ public function get_version() {
306
+ return $this->_version;
307
+ }
308
+
309
+ public function get_slug() {
310
+ return $this->plugin_slug;
311
  }
312
 
313
  /**
365
  wp_register_script( 'jquery-react', plugins_url( 'js/jquery-react.js', $this->file ), array( 'jquery' ), $this->_version );
366
 
367
  wp_register_script( 'customify-scale', plugins_url( 'js/customizer/customify-scale.js', $this->file ), array( 'jquery' ), $this->_version );
 
 
 
 
368
 
369
  wp_register_script( $this->plugin_slug . '-customizer-scripts', plugins_url( 'js/customizer.js', $this->file ), array(
370
  'jquery',
373
  'customize-controls',
374
 
375
  'customify-scale',
 
 
376
  ), $this->_version );
377
  }
378
 
1930
  }
1931
 
1932
  /**
1933
+ * A public function to get an option's value.
1934
+ * If there is a value and return it.
1935
+ * Otherwise try to get the default parameter or the default from config.
1936
  *
1937
  * @param $option
1938
  * @param mixed $default Optional.
css/admin.css CHANGED
@@ -1,29 +1,28 @@
1
- /* This stylesheet is used to style the admin option form of the plugin. */
2
- .extendable_options {
3
- height: 0;
4
- overflow: hidden; }
5
 
6
- fieldset.group {
7
- border-left: 1px solid #333;
8
- padding-left: 20px; }
9
 
10
- .postbox h3.hndle {
11
- padding: 7px;
12
- font-size: 15px; }
13
 
14
- .postbox .row {
15
- width: 100%;
16
- display: inline-block;
17
- padding: 5px 0; }
18
- .postbox .row .field {
19
- width: 100%;
20
- display: inline-block;
21
- padding: 5px 0; }
22
- .postbox .row .group {
23
- border: 1px solid rgba(203, 203, 203, 0.2);
24
- background-color: rgba(203, 203, 203, 0.2);
25
- padding-left: 15px;
26
- margin-left: 5px; }
27
 
28
- .postbox .uninstall_area {
29
- margin-top: 15px; }
 
 
 
 
 
 
 
 
 
 
 
1
+ .extendable_options
2
+ {overflow: hidden;
 
 
3
 
4
+ height: 0;
5
+ }fieldset.group
6
+ {padding-left: 20px;
7
 
8
+ border-left: 1px solid #333;
9
+ }.postbox h3.hndle
10
+ {font-size: 15px;
11
 
12
+ padding: 7px;
13
+ }.postbox .row
14
+ {display: inline-block;
 
 
 
 
 
 
 
 
 
 
15
 
16
+ width: 100%;padding: 5px 0;
17
+ }.postbox .row .field
18
+ {display: inline-block;
19
+
20
+ width: 100%;padding: 5px 0;
21
+ }.postbox .row .group
22
+ {margin-left: 5px;padding-left: 15px;
23
+
24
+ border: 1px solid rgba(203,203,203,.2);background-color: rgba(203,203,203,.2);
25
+ }.postbox .uninstall_area
26
+ {
27
+ margin-top: 15px;
28
+ }
css/customizer.css CHANGED
@@ -1,326 +1,241 @@
1
- .wp-full-overlay-sidebar *, .wp-full-overlay-sidebar *:before, .wp-full-overlay-sidebar *:after {
2
- box-sizing: border-box; }
3
-
4
- .iris-picker,
5
- .iris-picker * {
6
- box-sizing: content-box; }
7
-
8
- .wp-full-overlay-sidebar-content .accordion-section-content {
9
- overflow: visible; }
10
-
11
- .control-section:not(.control-section-themes) .customize-control {
12
- padding: 0;
13
- width: 100%;
14
- min-height: initial; }
15
-
16
- #customize-header-actions #customize-save-button-wrapper {
17
- margin-top: 7px; }
18
-
19
- .wp-full-overlay-footer .devices button {
20
- float: left;
21
- border-radius: 0; }
22
-
23
- .customize-controls-close {
24
- width: 48px;
25
- height: 44px;
26
- color: #7da9c3;
27
- background: #ffffff;
28
- border-top: none;
29
- border-right-color: #e0e8ef; }
30
- .customize-controls-close:focus, .customize-controls-close:hover {
31
- background: #f5fcff; }
32
- .customize-controls-close:before {
33
- top: 0px; }
34
-
35
- #customize-controls .customize-info {
36
- border-bottom-color: #e0e8ef; }
37
-
38
- .customize-panel-back, .customize-section-back {
39
- height: 74px;
40
- color: #7da9c3;
41
- border-right-color: #e0e8ef; }
42
- .customize-panel-back:hover, .customize-panel-back:focus, .customize-section-back:hover, .customize-section-back:focus {
43
- border-left-color: #f5fcff;
44
- background: #f5fcff; }
45
-
46
- #customize-theme-controls .theme * {
47
- box-sizing: content-box; }
48
-
49
- #customize-theme-controls .accordion-section-content {
50
- padding: 17px; }
51
-
52
- #customize-theme-controls .customize-section-title {
53
- margin-top: -17px;
54
- margin-right: -17px; }
55
-
56
- #customize-theme-controls .control-panel-content .control-section:nth-child(2),
57
- #customize-theme-controls .control-panel-content .control-section:nth-child(3) {
58
- border-top: none; }
59
-
60
- #customize-theme-controls .control-panel-content .control-section:nth-last-child(2) {
61
- border-bottom: 1px solid #e0e8ef; }
62
-
63
- #customize-theme-controls #accordion-section-add_menu {
64
- border-bottom: none; }
65
- #customize-theme-controls #accordion-section-add_menu .add-menu-toggle {
66
- float: none; }
67
-
68
- #customize-theme-controls .customize-pane-child.open {
69
- height: 100%; }
70
-
71
- #customize-controls .description {
72
- margin-bottom: 9px;
73
- font-size: 12px;
74
- font-weight: 300;
75
- font-style: normal;
76
- line-height: 1.6;
77
- color: #4d7b90;
78
- text-indent: 0; }
79
-
80
- .customize-control-description {
81
- margin-top: 6px; }
82
-
83
- .customize-control {
84
- margin-bottom: 24px; }
85
-
86
- #accordion-section-themes + .control-section {
87
- border-top: none; }
88
-
89
- #customize-controls .panel-meta.customize-info .accordion-section-title {
90
- border-top: none;
91
- height: 74px; }
92
-
93
- .button-controls:after {
94
- content: " ";
95
- display: table;
96
- clear: both; }
97
-
98
- .wp-core-ui .button:not(.theme-details):not(.collapse-sidebar):not(.wp-color-result),
99
- .wp-core-ui .button-primary,
100
- .wp-core-ui .button-secondary {
101
- width: auto;
102
- padding-left: 15px;
103
- padding-right: 15px;
104
- font-weight: 400;
105
- color: #F5FCFF;
106
- text-shadow: none;
107
- border: none;
108
- background: #AED2E5;
109
- box-shadow: 0px 2px 0px 0px #8DBED7;
110
- border-radius: 4px; }
111
- .wp-core-ui .button:not(.theme-details):not(.collapse-sidebar):not(.wp-color-result):hover,
112
- .wp-core-ui .button-primary:hover,
113
- .wp-core-ui .button-secondary:hover {
114
- color: white;
115
- text-shadow: none;
116
- background: #98C6DD;
117
- box-shadow: 0px 2px 0px 0px #74A7C2; }
118
-
119
- .wp-core-ui #customize-header-actions .button-primary {
120
- background: #73C5EE;
121
- box-shadow: 0px 2px 0px 0px #57ABD5; }
122
- .wp-core-ui #customize-header-actions .button-primary:hover {
123
- background: #58B0DD;
124
- box-shadow: 0px 2px 0px 0px #3F8AAF; }
125
- .wp-core-ui #customize-header-actions .button-primary.has-next-sibling {
126
- border-right: 1px solid #57ABD5; }
127
- .wp-core-ui #customize-header-actions .button-primary:disabled {
128
- color: white !important;
129
- background: #AED2E5 !important;
130
- opacity: 0.7;
131
- box-shadow: 0px 2px 0px 0px #8db5ca !important; }
132
- .wp-core-ui #customize-header-actions .button-primary:disabled.has-next-sibling {
133
- border-right: none; }
134
-
135
- .wp-core-ui .reset_section,
136
- .wp-core-ui .reset_panel {
137
- width: 100%;
138
- height: 4em;
139
- display: block;
140
- margin: 0px 0 25px; }
141
-
142
- .wp-core-ui .reset_panel {
143
- margin-top: 10px; }
144
-
145
- .separator.label {
146
- display: block;
147
- font-size: 14px;
148
- line-height: 24px;
149
- font-weight: 600; }
150
-
151
- .customize-control-title, .separator.label {
152
- color: #416B7E; }
153
-
154
- .separator.section:before, .separator.sub-section:before {
155
- content: "";
156
- position: absolute;
157
- top: 0;
158
- bottom: 0;
159
- left: -18px;
160
- right: -18px;
161
- z-index: -1; }
162
-
163
- .separator.label {
164
- font-weight: 500; }
165
-
166
- .separator.large {
167
- margin-top: 12px;
168
- font-size: 16px;
169
- color: #39474D; }
170
-
171
- .separator.section {
172
- position: relative;
173
- padding: 14px 0;
174
- margin-bottom: 0;
175
- background: none;
176
- border: none; }
177
- .separator.section[id*="layout"] {
178
- margin-top: 0; }
179
- .separator.section[id*="layout"]:before {
180
- border: none; }
181
- .separator.section:before {
182
- border: 1px solid #e0e8ef;
183
- background-color: #ffffff;
184
- box-shadow: 0px 1px 0px 0px #DFE8EF; }
185
-
186
- .separator.sub-section {
187
- position: relative;
188
- padding: 12px 0; }
189
- .separator.sub-section:before {
190
- border-top: 1px solid #e0e8ef;
191
- border-bottom: 1px solid #e0e8ef;
192
- background-color: #f6fbff; }
193
- .separator.sub-section + span {
194
- margin-top: 20px;
195
- font-style: normal; }
196
-
197
- .section-navigation-wrapper {
198
- position: relative;
199
- height: 43px;
200
- margin: -15px -12px 0 -12px;
201
- margin-right: -17px;
202
- margin-left: -17px; }
203
-
204
- .section-navigation {
205
- display: -ms-flexbox;
206
- display: flex;
207
- margin-top: -1px;
208
- clear: both;
209
- border-top: 1px solid #e0e8ef; }
210
- .section-navigation a {
211
- -ms-flex: 1 1 auto;
212
- flex: 1 1 auto;
213
- display: block;
214
- padding: 12px 0;
215
- color: #3b484e;
216
- background-color: #ffffff;
217
  border-bottom: 1px solid #e0e8ef;
218
- border-right: 1px solid #e0e8ef;
219
- text-align: center;
220
- text-decoration: none;
221
- transition: background-color .15s ease-in-out; }
222
- .section-navigation a:last-child {
223
- border-right: 0; }
224
-
225
- #customize-controls .customize-info.is-sticky.is-sticky,
226
- #customize-controls .customize-section-title.is-sticky.is-sticky {
227
- top: 40px; }
228
-
229
- #customize-controls .customize-info.is-in-view.is-in-view,
230
- #customize-controls .customize-section-title.is-in-view.is-in-view {
231
- box-shadow: none; }
232
-
233
- #customize-controls .has-nav .customize-info,
234
- #customize-controls .has-nav .customize-section-title {
235
- margin-right: -12px; }
236
-
237
- #customize-controls .customize-section-title.customize-section-title {
238
- border-bottom: 0; }
239
-
240
- .customize-section-description-container.section-meta.has-nav {
241
- margin-bottom: 0; }
242
-
243
- .font-options__wrapper {
244
- position: relative; }
245
- .font-options__wrapper:after {
246
- content: "";
247
- position: absolute;
248
- top: 90%;
249
- left: 0;
250
- right: 0;
251
- z-index: 0;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
252
  display: block;
253
- height: 30px; }
254
-
255
- .font-options__head {
256
- display: -ms-flexbox;
257
- display: flex;
258
- -ms-flex-pack: justify;
259
- justify-content: space-between; }
260
- .font-options__head.font-options__head {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
261
  -webkit-appearance: none;
262
- text-overflow: ellipsis;
263
- white-space: nowrap; }
264
-
265
- .font-options__font-title {
266
- margin-right: 26px;
267
- margin-left: 10px;
268
- font-size: 12px;
269
- line-height: 20px;
270
- font-weight: 300;
271
- color: #98c6dd;
272
- text-overflow: ellipsis;
273
- overflow: hidden;
274
- white-space: nowrap; }
275
-
276
- .font-options__options-list {
277
- position: absolute;
278
- top: calc(100% + 6px);
279
- left: -6px;
280
- right: -6px;
281
- z-index: 2;
282
- display: block;
283
- padding: 10px;
284
- border: 1px solid #dfe8ef;
285
- border-radius: 5px;
286
- background-color: #ffffff;
287
- opacity: 0;
288
- display: none;
289
- transition: opacity .15s linear; }
290
- .font-options__options-list:last-child {
291
- margin-bottom: 0; }
292
- .font-options__options-list:before, .font-options__options-list:after {
293
- content: "";
294
- position: absolute;
295
- top: -20px;
296
- right: 25px;
297
- height: 0;
298
- width: 0;
299
- border: solid transparent;
300
- z-index: 10; }
301
- .font-options__options-list:before {
302
  border-bottom-color: white;
303
- border-width: 10px;
304
- z-index: 11; }
305
- .font-options__options-list:after {
306
- border-bottom-color: rgba(0, 0, 0, 0.075);
307
- border-width: 12px;
308
- top: -24px;
309
- right: 23px; }
310
-
311
- .customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap:after {
312
- content: "";
313
- position: absolute;
314
- bottom: 100%;
315
- right: 12px;
316
- border-collapse: separate;
317
- width: 0;
318
- height: 0;
319
- border-width: 0 9px 9px 9px;
320
- border-style: solid;
321
- border-color: transparent transparent #fff transparent; }
322
-
323
- .font-options__head, .wp-full-overlay-sidebar-content .customize-control input[type=text]:not(#_customize-input-wpcom_custom_css_content_width_control):not(.wp-color-picker),
324
  .wp-full-overlay-sidebar-content .customize-control input[type=checkbox],
325
  .wp-full-overlay-sidebar-content .customize-control input[type=password],
326
  .wp-full-overlay-sidebar-content .customize-control input[type=color],
@@ -338,1575 +253,1402 @@
338
  .wp-full-overlay-sidebar-content .customize-control input[type=search],
339
  .wp-full-overlay-sidebar-content .customize-control select,
340
  .wp-full-overlay-sidebar-content .customize-control textarea,
341
- .wp-full-overlay-sidebar-content .customize-control input[type="number"].range-value, ul.font-options__options-list .select2-container .select2-selection--single, #customize-theme-controls .select2-container .select2-selection--multiple {
342
- width: 100%;
343
- height: 44px;
344
- padding: 10px 14px;
345
- background: #FFFFFF;
346
- border: 2px solid #B8DAEB;
347
- border-radius: 4px;
348
- font-size: 14px;
349
- line-height: 1.5;
350
- color: #416B7E;
351
- outline: 0; }
352
- .font-options__head:focus, .wp-full-overlay-sidebar-content .customize-control input[type=text]:focus:not(#_customize-input-wpcom_custom_css_content_width_control):not(.wp-color-picker),
353
- .wp-full-overlay-sidebar-content .customize-control input[type=checkbox]:focus,
354
- .wp-full-overlay-sidebar-content .customize-control input[type=password]:focus,
355
- .wp-full-overlay-sidebar-content .customize-control input[type=color]:focus,
356
- .wp-full-overlay-sidebar-content .customize-control input[type=date]:focus,
357
- .wp-full-overlay-sidebar-content .customize-control input[type=datetime]:focus,
358
- .wp-full-overlay-sidebar-content .customize-control input[type=datetime-local]:focus,
359
- .wp-full-overlay-sidebar-content .customize-control input[type=email]:focus,
360
- .wp-full-overlay-sidebar-content .customize-control input[type=month]:focus,
361
- .wp-full-overlay-sidebar-content .customize-control input[type=number]:focus,
362
- .wp-full-overlay-sidebar-content .customize-control input[type=radio]:focus,
363
- .wp-full-overlay-sidebar-content .customize-control input[type=tel]:focus,
364
- .wp-full-overlay-sidebar-content .customize-control input[type=time]:focus,
365
- .wp-full-overlay-sidebar-content .customize-control input[type=url]:focus,
366
- .wp-full-overlay-sidebar-content .customize-control input[type=week]:focus,
367
- .wp-full-overlay-sidebar-content .customize-control input[type=search]:focus,
368
- .wp-full-overlay-sidebar-content .customize-control select:focus,
369
- .wp-full-overlay-sidebar-content .customize-control textarea:focus,
370
- .wp-full-overlay-sidebar-content .customize-control input[type="number"].range-value:focus, ul.font-options__options-list .select2-container .select2-selection--single:focus, #customize-theme-controls .select2-container .select2-selection--multiple:focus {
371
- border-color: #73C5EE;
372
- box-shadow: none; }
373
-
374
- .font-options__head, .wp-full-overlay-sidebar-content .customize-control select, ul.font-options__options-list .select2-container .select2-selection--single, #customize-theme-controls .select2-container .select2-selection--multiple {
375
- width: 100%;
376
- -webkit-appearance: button;
377
- -moz-appearance: none;
378
- font-weight: 600;
379
- background: white url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjE1cHgiIGhlaWdodD0iOXB4IiB2aWV3Qm94PSIwIDAgMTUgOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJDdXN0b21pZnktQ29weS0yIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjU2LjAwMDAwMCwgLTM4Ni4wMDAwMDApIiBmaWxsPSIjOThDNkRFIj4KICAgICAgICAgICAgPGcgaWQ9IkhlYWRlciIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgNDcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0iQ29udGVudCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuMDAwMDAwLCA3NS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iVGl0bGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI2LjAwMDAwMCwgMjE5LjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iRmllbGQtLS1TZWxlY3QtQ29weSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iU2VsZWN0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgMjcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTI1NC40ODEyLDE4IEwyNTYsMTkuNTE0IEwyNDguNSwyNyBMMjQxLDE5LjUxNCBMMjQyLjUxODgsMTggTDI0OC41LDIzLjk2NzIgTDI1NC40ODEyLDE4IFoiIGlkPSJQYWdlLTEiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+) no-repeat;
380
- background-position: right 16px top 16px; }
381
- [multiple].font-options__head, .wp-full-overlay-sidebar-content .customize-control select[multiple], ul.font-options__options-list .select2-container [multiple].select2-selection--single, #customize-theme-controls .select2-container [multiple].select2-selection--multiple {
382
- background: white; }
383
-
384
- .wp-full-overlay-sidebar-content .customize-control input[type=text],
385
- .wp-full-overlay-sidebar-content .customize-control textarea {
386
- font-size: 13px; }
387
-
388
- .wp-full-overlay-sidebar-content .customize-control textarea {
389
- height: auto; }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
390
 
391
- .wp-full-overlay-sidebar-content .customize-control input[type=checkbox],
392
- .wp-full-overlay-sidebar-content .customize-control input[type=radio] {
393
- width: 22px;
394
- height: 22px; }
395
- .wp-full-overlay-sidebar-content .customize-control input[type=checkbox]:checked,
396
- .wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked {
397
- background: #73C5EE;
398
- border-color: #5AB9E8; }
399
- .wp-full-overlay-sidebar-content .customize-control input[type=checkbox]:checked:before,
400
- .wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked:before {
401
- color: white;
402
- margin: -1px 0 0 -2px; }
403
-
404
- .wp-full-overlay-sidebar-content .customize-control .awesome_preset input[type=radio]:checked {
405
- background: transparent; }
406
-
407
- .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control) label:not(:only-of-type),
408
- .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control) > .customize-inside-control-row:not(:only-of-type), .wp-full-overlay-sidebar-content .customize-control.customize-control-radio label:not(:only-of-type),
409
- .wp-full-overlay-sidebar-content .customize-control.customize-control-radio > .customize-inside-control-row:not(:only-of-type) {
410
- margin-left: 30px;
411
- padding-top: 0;
412
- padding-bottom: 0;
413
- display: inline-block;
414
- width: calc(49% - 30px);
415
- text-indent: -6px; }
416
-
417
- .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control) label, .wp-full-overlay-sidebar-content .customize-control.customize-control-radio label {
418
- color: #416B7E; }
419
-
420
- [id*="divider"] + .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control), [id*="divider"] + .wp-full-overlay-sidebar-content .customize-control.customize-control-radio {
421
- margin-top: 0; }
422
-
423
- .wp-full-overlay-sidebar-content .customize-control input[type=radio] {
424
- border-radius: 50%; }
425
- .wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked:before {
426
- content: none; }
427
-
428
- .customize-control-html + .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox {
429
- margin-top: -24px; }
430
-
431
- .wp-full-overlay-sidebar-content .customize-control.customize-control-radio label,
432
- .wp-full-overlay-sidebar-content .customize-control.customize-control-radio .customize-inside-control-row {
433
- margin-top: 12px; }
434
-
435
- .wp-full-overlay-sidebar-content .customize-control.customize-control-radio#customize-control-changeset_status .customize-inside-control-row {
436
- margin-top: 0;
437
- text-indent: 0; }
438
-
439
- .wp-full-overlay-sidebar-content .customize-control input[type="range"] {
440
- width: 65%; }
441
-
442
- .wp-full-overlay-sidebar-content .customize-control input[type="range"] {
443
- position: relative;
444
- -webkit-appearance: none;
445
- width: calc(100% - 55px);
446
- height: 22px;
447
- overflow: hidden;
448
- outline: none;
449
- background: none; }
450
- .wp-full-overlay-sidebar-content .customize-control input[type="range"]:before {
451
- content: " ";
452
- position: absolute;
453
- top: 8px;
454
- left: 0;
455
- height: 6px;
456
- width: 100%;
457
- background: #DFE8EF;
458
- box-shadow: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
459
- border-radius: 10px; }
460
- .wp-full-overlay-sidebar-content .customize-control input[type="range"]::-webkit-slider-thumb {
461
  -webkit-appearance: none;
462
- width: 22px;
463
- height: 22px;
464
- background: #27ae60;
465
- position: relative;
466
- z-index: 3;
467
- background: #FFFFFF;
468
- border: 2px solid #B8DAEB;
469
- border-radius: 4px; }
470
- .wp-full-overlay-sidebar-content .customize-control input[type="range"]::-webkit-slider-thumb:before {
471
- content: "..";
472
- position: absolute;
473
- left: 5px;
474
- top: -5px;
475
- color: #B8DAEB;
476
- font-size: 1em;
477
- letter-spacing: 1px; }
478
- .wp-full-overlay-sidebar-content .customize-control input[type="range"]::-webkit-slider-thumb:after {
479
- content: " ";
480
- width: calc(100% - 55px);
481
- height: 6px;
482
- position: absolute;
483
- z-index: 1;
484
- right: 20px;
485
- top: 6px;
486
- background: #73C5EE; }
487
-
488
- .wp-full-overlay-sidebar-content .customize-control input[type="number"].range-value {
489
- min-width: 40px;
490
- max-width: 80px;
491
- width: auto;
492
- height: 30px;
493
- top: -5px;
494
- float: right;
495
- padding: 4px 0px 5px 0px;
496
- margin-left: 10px;
497
- font-size: 13px;
498
- line-height: 1;
499
- text-align: center; }
500
-
501
- .wp-full-overlay-sidebar-content .customize-control input[type=number]::-webkit-inner-spin-button,
502
- .wp-full-overlay-sidebar-content .customize-control input[type=number]::-webkit-outer-spin-button {
503
- -webkit-appearance: none;
504
- margin: 0; }
505
-
506
- .customize-control-color {
507
- display: block; }
508
- .customize-control-color .customize-control-title, .customize-control-color .separator.label {
509
- float: left; }
510
- .customize-control-color .wp-picker-container {
511
- position: relative;
512
- float: right;
513
- top: -3px; }
514
- .customize-control-color .wp-picker-container .wp-picker-holder {
515
- position: relative; }
516
- .customize-control-color .wp-picker-container .wp-color-result,
517
- .customize-control-color .wp-picker-container .wp-color-result.button {
518
- top: 0;
519
- height: 30px;
520
- width: 40px;
521
- margin: 0;
522
- padding: 0;
523
- border-radius: 4px;
524
- background: #2ECC71;
525
- border: 2px solid #B8DAEB;
526
- box-shadow: none; }
527
- .customize-control-color .wp-picker-container .wp-color-result:after,
528
- .customize-control-color .wp-picker-container .wp-color-result .wp-color-result-text,
529
- .customize-control-color .wp-picker-container .wp-color-result.button:after,
530
- .customize-control-color .wp-picker-container .wp-color-result.button .wp-color-result-text {
531
- display: none; }
532
- .customize-control-color .wp-picker-container .iris-picker {
533
- position: absolute;
534
- top: 40px;
535
- right: 0;
536
- z-index: 1000;
537
- width: 275px !important;
538
- border-top: none;
539
- border-color: #DFDFDE;
540
- border-radius: 0 0 3px 3px;
541
- border: none;
542
- background: white; }
543
- .customize-control-color .wp-picker-container .iris-picker, .customize-control-color .wp-picker-container .iris-picker * {
544
- box-sizing: content-box; }
545
- .customize-control-color .wp-picker-container .iris-picker .iris-square {
546
- width: 215px !important;
547
- height: 173px !important;
548
- margin-right: 0; }
549
- .customize-control-color .wp-picker-container .iris-picker .iris-strip {
550
- float: right;
551
- box-shadow: rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
552
- .customize-control-color .wp-picker-container .iris-picker .iris-strip .ui-slider-handle {
553
- border-color: #aaa !important;
554
- opacity: 1;
555
- box-shadow: none; }
556
- .customize-control-color .wp-picker-container .iris-picker .iris-palette {
557
- width: 24px !important;
558
- height: 24px !important;
559
- border-radius: 50px;
560
- box-shadow: rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
561
- .customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap {
562
- position: absolute;
563
- z-index: 1000;
564
- top: 35px;
565
- right: 0;
566
- width: 275px;
567
- padding: 9px 12px;
568
- background: white;
569
- border: none;
570
- border-radius: 3px 3px 0 0; }
571
- .customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap input.wp-color-picker {
572
- float: left;
573
- width: 100px;
574
- font-size: 13px;
575
- text-align: left;
576
- margin: 0;
577
- padding: 6px 12px;
578
- height: auto; }
579
- .customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap input.button {
580
- float: right;
581
- padding: 4px 12px;
582
- height: 30px; }
583
-
584
- .customize-control-font:last-child {
585
- margin-bottom: 150px; }
586
-
587
- #accordion-section-live_css_edit_section .customize-section-title {
588
- margin-top: -13px;
589
- border-bottom: 1px solid #ddd; }
590
-
591
- #accordion-section-live_css_edit_section #css_editor {
592
- top: 70px;
593
- border-top: 10px solid white;
594
- overflow: visible; }
595
- #accordion-section-live_css_edit_section #css_editor:before {
596
- content: "";
597
- width: 48px;
598
- height: 10px;
599
- display: block;
600
- background: #e8e8e8;
601
- top: -10px;
602
- position: absolute;
603
- z-index: 10000000;
604
- left: 0; }
605
 
606
- #accordion-section-live_css_edit_section .ace_scroller {
607
- padding-left: 10px; }
 
608
 
609
- .wp-full-overlay.editor_opened {
610
- margin-left: 500px; }
611
- .wp-full-overlay.editor_opened #customize-controls {
612
- width: 500px; }
613
- .wp-full-overlay.editor_opened.collapsed #customize-controls {
614
- width: 300px; }
 
615
 
616
- .customize-control-media .current,
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
617
  .customize-control-site_icon .current,
618
- li#customize-control-site_logo .current {
619
- margin-bottom: 10px;
620
- min-height: 44px;
621
- background: #F5FCFF;
622
- border: 2px solid #B8DAEB;
623
- border-radius: 4px; }
624
- .customize-control-media .current .container, .customize-control-media .current span,
625
- .customize-control-site_icon .current .container,
626
- .customize-control-site_icon .current span,
627
- li#customize-control-site_logo .current .container,
628
- li#customize-control-site_logo .current span {
629
- border: none; }
630
-
631
- .customize-control-media .inner, .customize-control-media .current span,
632
  .customize-control-site_icon .inner,
633
  .customize-control-site_icon .current span,
634
  li#customize-control-site_logo .inner,
635
- li#customize-control-site_logo .current span {
636
- font-size: 13px;
637
- color: #98C6DD; }
638
-
639
- .customize-control-media .inner,
640
  .customize-control-site_icon .inner,
641
- li#customize-control-site_logo .inner {
642
- line-height: 1.4; }
643
-
644
- .customize-control-media .thumbnail-image,
645
  .customize-control-site_icon .thumbnail-image,
646
- li#customize-control-site_logo .thumbnail-image {
647
- padding: 14px;
648
- text-align: center; }
649
- .customize-control-media .thumbnail-image img,
650
- .customize-control-site_icon .thumbnail-image img,
651
- li#customize-control-site_logo .thumbnail-image img {
652
- width: auto; }
653
-
654
- .customize-control-media .actions,
655
  .customize-control-site_icon .actions,
656
- li#customize-control-site_logo .actions {
657
- margin-bottom: 0; }
658
-
659
- .customize-control-typography select, .customize-control-typography select {
660
- margin-bottom: 10px; }
661
-
662
- .customize-control-typography .description, .customize-control-typography .description {
663
- margin-top: -3px; }
664
-
665
- .customize-control-typography ul li, .customize-control-typography ul li {
666
- width: 100%;
667
- margin: 0; }
668
-
669
- .default-preset-button {
670
- background-color: #F5F6F6;
671
- float: right;
672
- padding: 1px 8px;
673
- border-radius: 3px;
674
- border: 1px solid #CBCBCB;
675
- margin-right: 4px;
676
- font-family: "Open Sans",sans-serif;
677
- font-size: 13px; }
678
-
679
- .customize-control-preset .description {
680
- margin-right: 5px;
681
- font-style: normal; }
682
-
683
- .customify_preset.radio_buttons .customify_radio_button {
684
- border: none;
685
- display: inline-block;
686
- padding: 2px;
687
- margin: 3px;
688
- position: relative;
689
- overflow: hidden;
690
- height: auto; }
691
- .customify_preset.radio_buttons .customify_radio_button input[type="radio"] {
692
  opacity: 0;
693
- width: 100%;
694
- height: 100%;
695
- position: absolute;
696
- z-index: 9999; }
697
- .customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked + label {
698
- background-color: #ebebeb; }
699
- .customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked + label:before {
700
- content: '>';
701
- color: inherit; }
702
- .customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked + label:after {
703
- content: '<';
704
- color: inherit; }
705
- .customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked:before {
706
- opacity: 0; }
707
- .customify_preset.radio_buttons .customify_radio_button label {
708
- position: relative;
709
- z-index: 999;
710
- border-left: 4px solid; }
711
-
712
- .customify_preset .awesome_preset {
713
- width: 45%;
714
- position: relative;
715
- display: inline-block;
716
- text-align: center;
717
- color: white;
718
- margin-top: 5px;
719
- margin-bottom: 25px;
720
- transition: all 0.2s; }
721
- .customify_preset .awesome_preset:hover {
722
- opacity: 0.9; }
723
- .customify_preset .awesome_preset:before {
724
- content: '';
725
- position: absolute;
726
- top: 1px;
727
- left: 1px;
728
- right: 1px;
729
- bottom: 1px;
730
- border: 1px solid #FFF;
731
- background: transparent;
732
- opacity: .5;
733
- border-radius: 4px;
734
- z-index: 5; }
735
- .customify_preset .awesome_preset .preset-wrap .preset-color {
736
- height: 128px;
737
- border-radius: 4px 4px 0 0;
738
- padding: 17px 0 27px; }
739
- .customify_preset .awesome_preset .preset-wrap .preset-color .first-font {
740
- display: inline-block;
741
- width: 100%;
742
- font-size: 55px;
743
- line-height: 1; }
744
- .customify_preset .awesome_preset .preset-wrap .preset-color .secondary-font {
745
- display: inline-block;
746
- width: 100%;
747
- font-size: 20px;
748
- line-height: 1;
749
- margin-top: 8px; }
750
- .customify_preset .awesome_preset .preset-wrap .preset-name {
751
- position: relative;
752
- font-size: 11px;
753
- text-transform: UPPERCASE;
754
- border-radius: 0 0 4px 4px;
755
- padding: 1px; }
756
- .customify_preset .awesome_preset .preset-wrap .preset-name:before {
757
- content: '';
758
- position: absolute;
759
- border-color: inherit;
760
- border: 10px solid;
761
- border-left-color: transparent;
762
- border-right-color: transparent;
763
- border-top: transparent;
764
- top: -10px;
765
- border-bottom-color: inherit;
766
- left: 40%; }
767
- .customify_preset .awesome_preset:nth-child(odd) {
768
- margin-right: 7%; }
769
- .customify_preset .awesome_preset input[type=radio] {
770
- height: 100%;
771
- width: 100%;
772
- position: absolute;
773
- border: 0;
774
- box-shadow: none;
775
- color: #006505;
776
- background-color: transparent;
777
- border-radius: 0;
778
- margin: 0;
779
  display: inline-block;
780
- top: 0;
781
- left: 0;
782
- z-index: 10; }
783
- .customify_preset .awesome_preset input[type=radio]:checked:before {
784
- position: absolute;
785
- height: 25px;
786
- width: 25px;
787
- top: -13px;
788
- right: -14px;
789
- background: #FFF;
790
- z-index: 1; }
791
- .customify_preset .awesome_preset input[type=radio]:checked:after {
792
- -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
793
- filter: alpha(opacity=0);
794
- content: '';
795
- position: absolute;
796
- width: 26px;
797
- height: 26px;
798
- border-radius: 50%;
799
- top: -5px;
800
- right: -5px;
801
- z-index: 10;
802
- background: #73C5EE url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjEzcHgiIGhlaWdodD0iOXB4IiB2aWV3Qm94PSIwIDAgMTMgOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJDdXN0b21pZnktQ29weSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgLTQwOC4wMDAwMDApIiBmaWxsPSIjRkZGRkZGIj4KICAgICAgICAgICAgPGcgaWQ9IkhlYWRlciIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgNDcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0iQ29udGVudCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuMDAwMDAwLCA3NS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iRmllbGQtLS1DaGVja2JveC1Db3B5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNy4wMDAwMDAsIDI0OS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICAgICAgPGcgaWQ9IkNoZWNrYm94IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgMzAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTAuMDM4NDk1LDE2IEwxNy4xMTYxMzc1LDguOTIxNDg3NiBMMTUuMTk0NjQ5OCw3IEwxMC4wMzg0OTUsMTIuMTU1MDY3NCBMNi45MjE0ODc2LDkuMDM4OTI5OTcgTDUsMTAuOTYwNDE3NiBMMTAuMDM4NDk1LDE2IFoiIGlkPSJQYWdlLTEiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+) no-repeat;
803
- background-position: center center; }
804
-
805
- .customify_radio_image {
806
- display: inline-block; }
807
- .customify_radio_image label {
808
- display: block;
809
- float: left;
810
  margin-right: 10px;
811
- position: relative; }
812
- .customify_radio_image label input[type=radio] {
813
- position: absolute;
814
- top: 0;
815
- bottom: 0;
816
- left: 0;
817
- right: 0;
818
- width: 100%;
819
- height: 100%;
820
- visibility: hidden; }
821
- .customify_radio_image label input[type=radio] img {
822
- cursor: pointer;
823
- border: 2px solid transparent; }
824
- .customify_radio_image label input[type=radio]:checked + img {
825
- border: 3px solid #73C5EE; }
826
-
827
- .customify_ace_editor {
828
- display: block;
829
- min-height: 200px;
830
- border: 1px solid #ddd; }
831
-
832
- .customize-control-custom_background .hide {
833
- display: none; }
834
-
835
- .customize-control-custom_background .upload_button_div {
836
- margin: 10px 0; }
837
- .customize-control-custom_background .upload_button_div > * {
838
- margin-right: 10px; }
839
-
840
- .customize-control-custom_background .preview_screenshot {
841
- text-align: center;
842
- margin: 10px 0; }
843
- .customize-control-custom_background .preview_screenshot img {
844
- border: 2px solid #ccc; }
845
-
846
- #customify_import_demo_data_button {
847
- width: 70%;
848
- text-align: center;
849
- padding: 10px;
850
- display: inline-block;
851
- height: auto;
852
- margin: 0 15% 10% 15%; }
853
-
854
- .import_step_note {
855
- margin: 5px;
856
- width: 100%;
857
- display: inline-block; }
858
- .import_step_note:before {
859
- content: "\1F449"; }
860
- .import_step_note.success:before {
861
- content: "\1F44D"; }
862
- .import_step_note.failed:before {
863
- content: "\274C"; }
864
-
865
- #customize-header-actions {
866
- background: #ffffff;
867
- border-color: #e0e8ef; }
868
-
869
- .wp-full-overlay-sidebar,
870
- .customize-themes-panel,
871
- #customize-sidebar-outer-content {
872
- background: #eaf9fe;
873
- border-right: 1px solid #e0e8ef; }
874
-
875
- .outer-section-open #customize-controls .wp-full-overlay-sidebar-content,
876
- .attachment-media-view, .media-widget-preview.media_audio, .media-widget-preview.media_image {
877
- background: #eaf9fe; }
878
-
879
- #customize-theme-controls #accordion-section-menu_locations {
880
- border-bottom: 1px solid #e0e8ef; }
881
-
882
- #customize-controls #accordion-section-themes > .accordion-section-title {
883
- font-weight: 600;
884
- border-bottom: 1px solid #e0e8ef; }
885
- #customize-controls #accordion-section-themes > .accordion-section-title:hover {
886
- background: #fff; }
887
-
888
- #customize-controls .panel-meta.customize-info {
889
- border-bottom-color: #e0e8ef; }
890
-
891
- #customize-theme-controls .control-section .accordion-section-title {
892
- font-weight: 400;
893
- border-top: 1px solid #e0e8ef;
894
- border-bottom: none; }
895
-
896
- #customize-theme-controls .control-section:last-of-type > .accordion-section-title {
897
- border-bottom: 1px solid #e0e8ef; }
898
-
899
- #customize-theme-controls .customize-section-title {
900
- border-top: 1px solid #e0e8ef;
901
- border-bottom: 1px solid #e0e8ef; }
902
-
903
- #customize-controls .control-section .accordion-section-title:focus, #customize-controls .control-section .accordion-section-title:hover, #customize-controls .control-section.open .accordion-section-title, #customize-controls .control-section:hover > .accordion-section-title {
904
- color: #056184;
905
- background: #f5fcff;
906
- border-left-color: #f5fcff; }
907
-
908
- .wp-customizer {
909
- /* SECTION: NAV MENUS */ }
910
- .wp-customizer .menu-item-edit-active .menu-item-handle, .wp-customizer .section-open .menu-item-settings, .wp-customizer .menu-item-bar .menu-item-handle:hover {
911
- border-color: #e0e8ef; }
912
- .wp-customizer .section-open .menu-item-settings {
913
- background: #f5fcff; }
914
- .wp-customizer .control-section-nav_menu .menu-location-settings {
915
- border-top-color: #e0e8ef !important; }
916
-
917
- [data-balloon] {
918
- position: relative; }
919
-
920
- [data-balloon]::before {
921
- opacity: 0;
922
- pointer-events: none;
923
- transition: all .18s ease-out;
924
- background: rgba(17, 17, 17, 0.9);
925
- border-radius: 4px;
926
- color: #fff;
927
- content: attr(data-balloon);
928
- font-size: 12px;
929
- padding: .5em 1em;
930
- position: absolute;
931
- white-space: nowrap;
932
- z-index: 10; }
933
-
934
- [data-balloon]::after {
935
- background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="36px" height="12px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(0)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');
936
- background-size: 100% auto;
937
- width: 18px;
938
- height: 6px;
939
- opacity: 0;
940
- pointer-events: none;
941
- transition: all .18s ease-out;
942
- content: '';
943
- position: absolute;
944
- z-index: 10; }
945
-
946
- [data-balloon]:hover::before, [data-balloon]:hover::after {
947
- opacity: 1;
948
- pointer-events: auto; }
949
-
950
- [data-balloon][data-balloon-pos="up"]::before {
951
- bottom: 100%;
952
- left: 50%;
953
- margin-bottom: 11px;
954
- -webkit-transform: translate3d(-50%, 10px, 0);
955
- transform: translate3d(-50%, 10px, 0);
956
- -webkit-transform-origin: top;
957
- transform-origin: top; }
958
-
959
- [data-balloon][data-balloon-pos="up"]::after {
960
- bottom: 100%;
961
- left: 50%;
962
- margin-bottom: 5px;
963
- -webkit-transform: translate3d(-50%, 10px, 0);
964
- transform: translate3d(-50%, 10px, 0);
965
- -webkit-transform-origin: top;
966
- transform-origin: top; }
967
-
968
- [data-balloon][data-balloon-pos="up"]:hover::before {
969
- -webkit-transform: translate3d(-50%, 0, 0);
970
- transform: translate3d(-50%, 0, 0); }
971
-
972
- [data-balloon][data-balloon-pos="up"]:hover::after {
973
- -webkit-transform: translate3d(-50%, 0, 0);
974
- transform: translate3d(-50%, 0, 0); }
975
-
976
- [data-balloon][data-balloon-pos='down']::before {
977
- left: 50%;
978
- margin-top: 11px;
979
- top: 100%;
980
- -webkit-transform: translate3d(-50%, -10px, 0);
981
- transform: translate3d(-50%, -10px, 0); }
982
-
983
- [data-balloon][data-balloon-pos='down']::after {
984
- background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="36px" height="12px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(180 18 6)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');
985
- background-size: 100% auto;
986
- width: 18px;
987
- height: 6px;
988
- left: 50%;
989
- margin-top: 5px;
990
- top: 100%;
991
- -webkit-transform: translate3d(-50%, -10px, 0);
992
- transform: translate3d(-50%, -10px, 0); }
993
-
994
- [data-balloon][data-balloon-pos='down']:hover::before {
995
- -webkit-transform: translate3d(-50%, 0, 0);
996
- transform: translate3d(-50%, 0, 0); }
997
-
998
- [data-balloon][data-balloon-pos='down']:hover::after {
999
- -webkit-transform: translate3d(-50%, 0, 0);
1000
- transform: translate3d(-50%, 0, 0); }
1001
-
1002
- [data-balloon][data-balloon-pos='left']::before {
1003
- margin-right: 11px;
1004
- right: 100%;
1005
- top: 50%;
1006
- -webkit-transform: translate3d(10px, -50%, 0);
1007
- transform: translate3d(10px, -50%, 0); }
1008
-
1009
- [data-balloon][data-balloon-pos='left']::after {
1010
- background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12px" height="36px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(-90 18 18)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');
1011
- background-size: 100% auto;
1012
- width: 6px;
1013
- height: 18px;
1014
- margin-right: 5px;
1015
- right: 100%;
1016
- top: 50%;
1017
- -webkit-transform: translate3d(10px, -50%, 0);
1018
- transform: translate3d(10px, -50%, 0); }
1019
-
1020
- [data-balloon][data-balloon-pos='left']:hover::before {
1021
- -webkit-transform: translate3d(0, -50%, 0);
1022
- transform: translate3d(0, -50%, 0); }
1023
-
1024
- [data-balloon][data-balloon-pos='left']:hover::after {
1025
- -webkit-transform: translate3d(0, -50%, 0);
1026
- transform: translate3d(0, -50%, 0); }
1027
-
1028
- [data-balloon][data-balloon-pos='right']::before {
1029
- left: 100%;
1030
- margin-left: 11px;
1031
- top: 50%;
1032
- -webkit-transform: translate3d(-10px, -50%, 0);
1033
- transform: translate3d(-10px, -50%, 0); }
1034
-
1035
- [data-balloon][data-balloon-pos='right']::after {
1036
- background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12px" height="36px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(90 6 6)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');
1037
- background-size: 100% auto;
1038
- width: 6px;
1039
- height: 18px;
1040
- left: 100%;
1041
- margin-left: 5px;
1042
- top: 50%;
1043
- -webkit-transform: translate3d(-10px, -50%, 0);
1044
- transform: translate3d(-10px, -50%, 0); }
1045
-
1046
- [data-balloon][data-balloon-pos='right']:hover::before {
1047
- -webkit-transform: translate3d(0, -50%, 0);
1048
- transform: translate3d(0, -50%, 0); }
1049
-
1050
- [data-balloon][data-balloon-pos='right']:hover::after {
1051
- -webkit-transform: translate3d(0, -50%, 0);
1052
- transform: translate3d(0, -50%, 0); }
1053
-
1054
- [data-balloon][data-balloon-length='small']::before {
1055
- white-space: normal;
1056
- width: 80px; }
1057
-
1058
- [data-balloon][data-balloon-length='medium']::before {
1059
- white-space: normal;
1060
- width: 150px; }
1061
-
1062
- [data-balloon][data-balloon-length='large']::before {
1063
- white-space: normal;
1064
- width: 260px; }
1065
-
1066
- [data-balloon][data-balloon-length='xlarge']::before {
1067
- white-space: normal;
1068
- width: 380px; }
1069
-
1070
- @media screen and (max-width: 768px) {
1071
- [data-balloon][data-balloon-length='xlarge']::before {
1072
- white-space: normal;
1073
- width: 90vw; } }
1074
 
1075
- [data-balloon][data-balloon-length='fit']::before {
1076
- white-space: normal;
1077
- width: 100%; }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1078
 
1079
- .font-options__wrapper .font-options__options-list {
1080
- border-color: #B8DAEB;
1081
- box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.15); }
 
 
 
 
1082
 
1083
- .font-options__wrapper .font-options__option {
1084
- margin-bottom: 12px; }
1085
- .font-options__wrapper .font-options__option label {
1086
- display: block;
1087
- margin-bottom: 6px; }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1088
 
1089
- .font-options__wrapper [type=checkbox]:checked ~ .font-options__options-list {
1090
- opacity: 1;
1091
- display: block; }
1092
 
1093
- input.customify_font_tooltip {
1094
- display: none; }
 
1095
 
1096
- ul.font-options__options-list .select2-container {
1097
- width: 100% !important; }
1098
- ul.font-options__options-list .select2-container .select2-selection--single {
1099
- -webkit-appearance: initial; }
1100
- ul.font-options__options-list .select2-container .select2-selection--single .select2-selection__arrow {
1101
- display: none; }
1102
 
1103
- ul.font-options__options-list .select2-container--default .select2-selection--single .select2-selection__rendered {
1104
- color: inherit;
1105
- line-height: initial; }
 
 
1106
 
1107
- .select2-container.select2-container--open {
1108
- z-index: 99999999; }
 
 
1109
 
1110
- #customize-theme-controls .select2-container {
1111
- width: 100% !important; }
1112
- #customize-theme-controls .select2-container .select2-selection--multiple {
1113
- -webkit-appearance: initial;
1114
- padding: 4px 8px 4px;
1115
- height: auto;
1116
- background: none; }
1117
- #customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__arrow {
1118
- display: none; }
1119
- #customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered {
1120
- padding: 0;
1121
- display: -ms-flexbox;
1122
- display: flex; }
1123
- #customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered .select2-search--inline {
1124
- -ms-flex: 1;
1125
- flex: 1; }
1126
- #customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered .select2-search--inline .select2-search__field[class] {
1127
- min-width: 100%;
1128
- border-width: 0;
1129
- margin-top: 3px !important; }
1130
- #customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
1131
- padding: 3px 7px;
1132
- margin-right: 6px;
1133
- margin-top: 0px;
1134
- border-color: #e0e8ef;
1135
- background-color: #f6fbff; }
1136
- #customize-theme-controls .select2-container .select2-search--inline .select2-search__field {
1137
- height: 29px;
1138
- min-width: 9em;
1139
- margin-top: 0; }
1140
-
1141
- .select2-container--default .select2-results__option[aria-selected=true][class] {
1142
- background: transparent;
1143
- opacity: 0.3;
1144
- pointer-events: none; }
1145
-
1146
- .select2-container .select2-dropdown {
1147
- border-color: #e0e8ef; }
1148
-
1149
- #customize-theme-controls .widget-content .accordion-container {
1150
- margin-left: -10px;
1151
- margin-right: -10px;
1152
- margin-top: 20px;
1153
- margin-bottom: 10px; }
1154
- #customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content {
1155
- position: relative;
1156
- left: 0;
1157
- max-height: 0;
1158
- padding-top: 0;
1159
- padding-bottom: 0;
1160
  overflow: hidden;
1161
- transition: all .4s ease;
1162
- color: #416B7E; }
1163
- #customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content p:first-child {
1164
- margin-top: 0; }
1165
- #customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content p:last-child {
1166
- margin-bottom: 0; }
1167
- #customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-title {
1168
- color: #39474D; }
1169
- #customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-title:after {
1170
- content: "\f142";
1171
- -webkit-transform: rotate(180deg);
1172
- transform: rotate(180deg); }
1173
- #customize-theme-controls .widget-content .accordion-container .accordion-section.open {
1174
- border-bottom: none; }
1175
- #customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-content {
1176
- max-height: 100%;
1177
- padding-top: 17px;
1178
- padding-bottom: 17px; }
1179
- #customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-title {
1180
- border-bottom: 1px solid; }
1181
- #customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-title:after {
1182
- -webkit-transform: rotate(0deg);
1183
- transform: rotate(0deg); }
1184
- #customize-theme-controls .widget-content .accordion-container label.customize-control-title, #customize-theme-controls .widget-content .accordion-container label.separator.label {
1185
- cursor: default; }
1186
-
1187
- .widget .widget-content > p input[type=checkbox],
1188
- .widget .widget-content > p input[type=radio] {
1189
- margin-bottom: 3px;
1190
- margin-top: 3px; }
1191
-
1192
- .widget .widget-content small {
1193
- margin-top: 5px;
1194
- display: block; }
1195
-
1196
- #available-widgets [class*=pixelgrade] .widget .widget-title:before,
1197
- #available-widgets [class*=featured-posts] .widget .widget-title:before,
1198
- #available-widgets [class*=categories-image-grid] .widget .widget-title:before {
1199
- content: "\f538";
1200
- color: #9660c6; }
1201
-
1202
- #available-widgets [class*=pixelgrade-featured-posts-slideshow] .widget .widget-title:before {
1203
- content: "\f233"; }
1204
-
1205
- #available-widgets [class*=pixelgrade-featured-posts-carousel] .widget .widget-title:before {
1206
- content: "\f169"; }
1207
-
1208
- #available-widgets [class*=featured-posts-grid] .widget .widget-title:before {
1209
- content: "\f180"; }
1210
-
1211
- #available-widgets [class*=featured-posts-list] .widget .widget-title:before {
1212
- content: "\f164"; }
1213
-
1214
- #available-widgets [class*=categories-image-grid] .widget .widget-title:before {
1215
- content: "\f163"; }
1216
-
1217
- #available-widgets [class*=pixelgrade-promo-box] .widget .widget-title:before {
1218
- content: "\f488"; }
1219
-
1220
- .ui-tooltip {
1221
- z-index: 999999; }
1222
-
1223
- .wp-customizer .widget-conditional .condition-control:after {
1224
- content: " ";
1225
- display: table;
1226
- clear: both; }
1227
-
1228
- .wp-customizer .widget-conditional .selection {
1229
- padding-right: 50px;
1230
- padding-left: 28px;
1231
- padding-bottom: 19px;
1232
- margin-left: 0;
1233
- margin-right: 0;
1234
- margin-bottom: 10px;
1235
- border-bottom: 1px solid #cbcfd4; }
1236
-
1237
- .wp-customizer .widget-conditional .condition:last-child .selection {
1238
- border: 0; }
1239
-
1240
- .wp-customizer .widget-conditional select {
1241
- max-width: 100%;
1242
- width: 170px; }
1243
-
1244
- .wp-customizer .widget-conditional .condition-top select {
1245
- width: 130px; }
1246
-
1247
- .pix_customizer_setting .customize-inside-control-row {
1248
- position: relative;
1249
- width: 100% !important;
1250
- margin-left: 0 !important;
1251
- text-indent: 0 !important;
1252
- background-size: cover;
1253
- background-position: 50% 50%;
1254
- height: 64px;
1255
- border-radius: 5px;
1256
- overflow: hidden; }
1257
- .pix_customizer_setting .customize-inside-control-row:before {
1258
- content: '';
1259
- position: absolute;
1260
- top: 0;
1261
- bottom: 0;
1262
- left: 0;
1263
- right: 0;
1264
- z-index: 10;
1265
- pointer-events: none;
1266
- box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.15), inset 0 1px 3px 0 rgba(0, 0, 0, 0.15); }
1267
- .pix_customizer_setting .customize-inside-control-row:hover:before {
1268
- box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, 0.15), inset 0 0 3px 0 rgba(0, 0, 0, 0.15); }
1269
- .pix_customizer_setting .customize-inside-control-row:hover .palette__item {
1270
- -webkit-transform: translateY(0%);
1271
- transform: translateY(0%); }
1272
- .pix_customizer_setting .customize-inside-control-row:hover label {
1273
- left: 10px; }
1274
- .pix_customizer_setting .customize-inside-control-row input {
1275
- opacity: 0; }
1276
- .pix_customizer_setting .customize-inside-control-row input:checked + label .preview__letter--checked {
1277
- display: inline-block;
1278
- vertical-align: middle; }
1279
- .pix_customizer_setting .customize-inside-control-row input:checked + label .preview__letter {
1280
- display: none; }
1281
- .pix_customizer_setting .customize-inside-control-row label {
1282
- position: absolute;
1283
- display: -ms-flexbox;
1284
- display: flex;
1285
- z-index: 2;
1286
- width: 100%;
1287
  height: 100%;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1288
  top: 0;
1289
- left: 0;
1290
- padding: 0 10px;
1291
- margin-top: 0 !important;
1292
- -ms-flex-align: center;
1293
- align-items: center;
1294
- transition: all .3s ease; }
1295
- .pix_customizer_setting .customize-inside-control-row .palette {
1296
- position: absolute;
1297
- display: -ms-flexbox;
1298
- display: flex;
1299
- top: 0;
1300
- left: 0;
1301
- z-index: 1;
 
 
 
 
 
 
 
1302
  width: 100%;
1303
- height: 100%;
1304
- transition: all .2s ease; }
1305
- .pix_customizer_setting .customize-inside-control-row .palette__item {
1306
- -ms-flex: 1;
1307
- flex: 1;
1308
- -webkit-transform: translateY(100%);
1309
- transform: translateY(100%);
1310
- transition: all .3s ease; }
1311
- .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(1) {
1312
- transition-delay: 0s; }
1313
- .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(2) {
1314
- transition-delay: 0.05s; }
1315
- .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(3) {
1316
- transition-delay: 0.1s; }
1317
- .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(4) {
1318
- transition-delay: 0.15s; }
1319
- .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(5) {
1320
- transition-delay: 0.2s; }
1321
- .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(6) {
1322
- transition-delay: 0.25s; }
1323
- .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(7) {
1324
- transition-delay: 0.3s; }
1325
- .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(8) {
1326
- transition-delay: 0.35s; }
1327
- .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(9) {
1328
- transition-delay: 0.4s; }
1329
- .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(10) {
1330
- transition-delay: 0.45s; }
1331
- .pix_customizer_setting .customize-inside-control-row .preview__letter,
1332
- .pix_customizer_setting .customize-inside-control-row .preview__letter--checked {
1333
- display: inline-block;
1334
- padding: 3px;
1335
- border-radius: 2px;
1336
- color: white;
1337
- margin-right: 5px;
1338
- min-height: 26px;
1339
- min-width: 26px;
1340
  text-align: center;
1341
- background-position: center center;
1342
- background-repeat: no-repeat;
1343
- background-size: 15px 15px;
1344
- font-style: normal;
1345
- vertical-align: baseline; }
1346
- .pix_customizer_setting .customize-inside-control-row .preview__letter--checked {
1347
- display: none; }
1348
-
1349
- [id*="sm_current_palette_control"] .customize-inside-control-row .palette__item[class] {
1350
- -webkit-transform: none;
1351
- transform: none; }
1352
-
1353
- [id*="sm_current_palette_control"] .variation-control {
1354
- display: -ms-flexbox;
1355
- display: flex; }
1356
-
1357
- #customize-control-sm_color_palette_control ~ li[id*="sm_color_"],
1358
- #customize-control-sm_color_palette_control ~ li[id*="sm_dark_"],
1359
- #customize-control-sm_color_palette_control ~ li[id*="sm_light_"] {
1360
- visibility: hidden; }
1361
- #customize-control-sm_color_palette_control ~ li[id*="sm_color_"] > span,
1362
- #customize-control-sm_color_palette_control ~ li[id*="sm_dark_"] > span,
1363
- #customize-control-sm_color_palette_control ~ li[id*="sm_light_"] > span {
1364
- display: none; }
1365
- #customize-control-sm_color_palette_control ~ li[id*="sm_color_"] .wp-picker-input-wrap,
1366
- #customize-control-sm_color_palette_control ~ li[id*="sm_color_"] .wp-picker-holder,
1367
- #customize-control-sm_color_palette_control ~ li[id*="sm_dark_"] .wp-picker-input-wrap,
1368
- #customize-control-sm_color_palette_control ~ li[id*="sm_dark_"] .wp-picker-holder,
1369
- #customize-control-sm_color_palette_control ~ li[id*="sm_light_"] .wp-picker-input-wrap,
1370
- #customize-control-sm_color_palette_control ~ li[id*="sm_light_"] .wp-picker-holder {
1371
- visibility: visible; }
1372
- #customize-control-sm_color_palette_control ~ li[id*="sm_color_"] .wp-picker-container,
1373
- #customize-control-sm_color_palette_control ~ li[id*="sm_dark_"] .wp-picker-container,
1374
- #customize-control-sm_color_palette_control ~ li[id*="sm_light_"] .wp-picker-container {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1375
  width: 100%;
1376
- float: left; }
1377
- #customize-control-sm_color_palette_control ~ li[id*="sm_color_"] .wp-picker-container button:before,
1378
- #customize-control-sm_color_palette_control ~ li[id*="sm_dark_"] .wp-picker-container button:before,
1379
- #customize-control-sm_color_palette_control ~ li[id*="sm_light_"] .wp-picker-container button:before {
1380
- content: "";
1381
- position: relative;
1382
- display: block;
1383
- visibility: visible;
1384
- background-color: inherit;
1385
- width: 90px;
1386
- height: 90px;
1387
- border-radius: 50%;
1388
- border: 3px solid #DDD; }
1389
-
1390
- #customize-control-sm_color_palette_control ~ [id*="sm_color_secondary"] .wp-picker-container button:before {
1391
- top: -54px;
1392
- right: -70px; }
1393
-
1394
- #customize-control-sm_color_palette_control ~ [id*="sm_color_tertiary"] .wp-picker-container button:before {
1395
- top: -108px;
1396
- right: -140px; }
1397
-
1398
- #customize-control-sm_color_palette_control ~ [id*="sm_dark_primary"] .wp-picker-container button:before {
1399
- top: -54px; }
1400
-
1401
- #customize-control-sm_color_palette_control ~ [id*="sm_dark_secondary"] .wp-picker-container button:before {
1402
- top: -108px;
1403
- right: -70px; }
1404
-
1405
- #customize-control-sm_color_palette_control ~ [id*="sm_dark_tertiary"] .wp-picker-container button:before {
1406
- top: -162px;
1407
- right: -140px; }
1408
-
1409
- #customize-control-sm_color_palette_control ~ [id*="sm_light_primary"] .wp-picker-container button:before {
1410
- top: -108px; }
1411
-
1412
- #customize-control-sm_color_palette_control ~ [id*="sm_light_secondary"] .wp-picker-container button:before {
1413
- top: -162px;
1414
- right: -70px; }
1415
-
1416
- #customize-control-sm_color_palette_control ~ [id*="sm_light_tertiary"] .wp-picker-container button:before {
1417
- top: -216px;
1418
- right: -140px; }
1419
-
1420
- .c-palette {
1421
- position: relative; }
1422
- .c-palette .c-palette__label {
1423
- -ms-flex-positive: 1;
1424
- flex-grow: 1; }
1425
-
1426
- .c-palette:after {
1427
- height: 64px;
1428
- border-radius: 5px; }
1429
-
1430
- .c-palette:after {
1431
- content: "";
1432
- display: block;
1433
- position: absolute;
1434
- top: 0;
1435
- left: 0;
1436
- right: 0;
1437
- box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.15), inset 0 1px 3px 0 rgba(0, 0, 0, 0.15);
1438
- pointer-events: none; }
1439
-
1440
- .label__inner {
1441
- color: #000000;
1442
- background: #F5F6F1;
1443
- padding: 7px 12px 7px 7px;
1444
- z-index: 2;
1445
- border-radius: 3px;
1446
- box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15); }
1447
-
1448
- .c-palette__label {
1449
- display: -ms-flexbox;
1450
- display: flex;
1451
- -ms-flex-align: center;
1452
- align-items: center;
1453
- height: 40px;
1454
- padding: 12px;
1455
- color: black;
1456
- background: white; }
1457
-
1458
- .colors {
1459
- position: relative;
1460
- display: -ms-flexbox;
1461
- display: flex;
1462
- -ms-flex-align: stretch;
1463
- align-items: stretch;
1464
- width: 100%; }
1465
-
1466
- .color {
1467
- display: -ms-flexbox;
1468
- display: flex;
1469
- -ms-flex-direction: column;
1470
- flex-direction: column;
1471
- -ms-flex-positive: 1;
1472
- flex-grow: 1;
1473
- overflow: hidden; }
1474
-
1475
- .fill {
1476
- position: relative;
1477
- height: 64px; }
1478
-
1479
- .c-palette__overlay {
1480
- position: absolute;
1481
- top: 0;
1482
- left: 0;
1483
- right: 0;
1484
- height: 64px;
1485
- display: -ms-flexbox;
1486
- display: flex;
1487
- -ms-flex-align: center;
1488
- align-items: center; }
1489
-
1490
- .fill:before {
1491
- position: absolute;
1492
- top: 0;
1493
- left: 0;
1494
- right: 0;
1495
- bottom: 0; }
1496
-
1497
- .fill:before {
1498
- content: "";
1499
- background: currentColor; }
1500
-
1501
- .picker {
1502
- position: relative;
1503
- top: 0;
1504
- left: 50%;
1505
- width: 80%;
1506
- margin-top: 1em;
1507
- border-radius: 50%;
1508
- -webkit-transform: translateX(-50%);
1509
- transform: translateX(-50%); }
1510
-
1511
- .colors.next .picker > i {
1512
- display: block;
1513
- position: absolute;
1514
- top: 0;
1515
- right: 0;
1516
- bottom: 0;
1517
- left: 0;
1518
- border-radius: 50%;
1519
- box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.15), inset 0 1px 3px 0 rgba(0, 0, 0, 0.15);
1520
- pointer-events: none;
1521
- z-index: 20; }
1522
-
1523
- .picker:before,
1524
- .picker:after {
1525
- content: "";
1526
- display: block;
1527
- background: currentColor;
1528
- border-radius: 50%; }
1529
-
1530
- .picker:before {
1531
- padding-top: 100%; }
1532
-
1533
- .picker:after {
1534
- position: absolute;
1535
- top: 0;
1536
- left: 0;
1537
- width: 100%;
1538
- height: 100%; }
1539
-
1540
- .fill {
1541
- overflow: hidden; }
1542
-
1543
- .color:first-child .fill {
1544
- border-top-left-radius: 5px;
1545
- border-bottom-left-radius: 5px; }
1546
-
1547
- .color:last-child .fill {
1548
- border-top-right-radius: 5px;
1549
- border-bottom-right-radius: 5px; }
1550
-
1551
- .colors.next {
1552
- position: absolute;
1553
- top: 0;
1554
- left: 0; }
1555
- .colors.next .fill:before {
1556
- -webkit-transform: translateY(-100%);
1557
- transform: translateY(-100%); }
1558
- .colors.next .picker:before {
1559
- -webkit-transform: translateY(-100%);
1560
- transform: translateY(-100%);
1561
- opacity: 0; }
1562
- .colors.next .picker:after {
1563
- opacity: 0; }
1564
-
1565
- .c-palette.animate .next .fill:before {
1566
- -webkit-animation: fill 1s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
1567
- animation: fill 1s cubic-bezier(0.215, 0.61, 0.355, 1) forwards; }
1568
-
1569
- .c-palette.animate .next .picker {
1570
- -webkit-animation: picker-filter 1s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
1571
- animation: picker-filter 1s cubic-bezier(0.215, 0.61, 0.355, 1) forwards; }
1572
-
1573
- .c-palette.animate .next .picker:before {
1574
- -webkit-animation: fill-picker-before 1s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
1575
- animation: fill-picker-before 1s cubic-bezier(0.215, 0.61, 0.355, 1) forwards; }
1576
-
1577
- .c-palette.animate .next .picker:after {
1578
- -webkit-animation: fill-picker-after 1s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
1579
- animation: fill-picker-after 1s cubic-bezier(0.215, 0.61, 0.355, 1) forwards; }
1580
-
1581
- .c-palette.animate .current .fill,
1582
- .c-palette.animate .current .picker {
1583
- -webkit-animation: fade-out 1s forwards;
1584
- animation: fade-out 1s forwards; }
1585
-
1586
- .c-palette.animate .color:nth-child(1) .fill,
1587
  .c-palette.animate .color:nth-child(1) .fill:before,
1588
  .c-palette.animate .color:nth-child(1) .picker,
1589
  .c-palette.animate .color:nth-child(1) .picker:after,
1590
- .c-palette.animate .color:nth-child(1) .picker:before {
1591
- -webkit-animation-delay: 0.05s;
1592
- animation-delay: 0.05s; }
1593
-
1594
- .c-palette.animate .color:nth-child(2) .fill,
1595
  .c-palette.animate .color:nth-child(2) .fill:before,
1596
  .c-palette.animate .color:nth-child(2) .picker,
1597
  .c-palette.animate .color:nth-child(2) .picker:after,
1598
- .c-palette.animate .color:nth-child(2) .picker:before {
1599
- -webkit-animation-delay: 0.35s;
1600
- animation-delay: 0.35s; }
1601
-
1602
- .c-palette.animate .color:nth-child(3) .fill,
1603
  .c-palette.animate .color:nth-child(3) .fill:before,
1604
  .c-palette.animate .color:nth-child(3) .picker,
1605
  .c-palette.animate .color:nth-child(3) .picker:after,
1606
- .c-palette.animate .color:nth-child(3) .picker:before {
1607
- -webkit-animation-delay: 0.15s;
1608
- animation-delay: 0.15s; }
1609
-
1610
- .c-palette.animate .color:nth-child(4) .fill,
1611
  .c-palette.animate .color:nth-child(4) .fill:before,
1612
  .c-palette.animate .color:nth-child(4) .picker,
1613
  .c-palette.animate .color:nth-child(4) .picker:after,
1614
- .c-palette.animate .color:nth-child(4) .picker:before {
1615
- -webkit-animation-delay: 0.45s;
1616
- animation-delay: 0.45s; }
1617
-
1618
- .c-palette.animate .color:nth-child(5) .fill,
1619
  .c-palette.animate .color:nth-child(5) .fill:before,
1620
  .c-palette.animate .color:nth-child(5) .picker,
1621
  .c-palette.animate .color:nth-child(5) .picker:after,
1622
- .c-palette.animate .color:nth-child(5) .picker:before {
1623
- -webkit-animation-delay: 0.1s;
1624
- animation-delay: 0.1s; }
1625
-
1626
- .c-palette.animate .color:nth-child(6) .fill,
1627
  .c-palette.animate .color:nth-child(6) .fill:before,
1628
  .c-palette.animate .color:nth-child(6) .picker,
1629
  .c-palette.animate .color:nth-child(6) .picker:after,
1630
- .c-palette.animate .color:nth-child(6) .picker:before {
1631
- -webkit-animation-delay: 0.2s;
1632
- animation-delay: 0.2s; }
1633
-
1634
- .c-palette.animate .color:nth-child(7) .fill,
1635
  .c-palette.animate .color:nth-child(7) .fill:before,
1636
  .c-palette.animate .color:nth-child(7) .picker,
1637
  .c-palette.animate .color:nth-child(7) .picker:after,
1638
- .c-palette.animate .color:nth-child(7) .picker:before {
1639
- -webkit-animation-delay: 0.25s;
1640
- animation-delay: 0.25s; }
1641
-
1642
- .c-palette.animate .color:nth-child(8) .fill,
1643
  .c-palette.animate .color:nth-child(8) .fill:before,
1644
  .c-palette.animate .color:nth-child(8) .picker,
1645
  .c-palette.animate .color:nth-child(8) .picker:after,
1646
- .c-palette.animate .color:nth-child(8) .picker:before {
1647
- -webkit-animation-delay: 0.3s;
1648
- animation-delay: 0.3s; }
1649
-
1650
- .c-palette.animate .color:nth-child(9) .fill,
1651
  .c-palette.animate .color:nth-child(9) .fill:before,
1652
  .c-palette.animate .color:nth-child(9) .picker,
1653
  .c-palette.animate .color:nth-child(9) .picker:after,
1654
- .c-palette.animate .color:nth-child(9) .picker:before {
1655
- -webkit-animation-delay: 0.4s;
1656
- animation-delay: 0.4s; }
1657
-
1658
- @-webkit-keyframes fill {
1659
- 30% {
1660
- -webkit-transform: translateY(0);
1661
- transform: translateY(0); }
1662
- 100% {
1663
- -webkit-transform: translateY(0);
1664
- transform: translateY(0); } }
1665
-
1666
- @keyframes fill {
1667
- 30% {
1668
- -webkit-transform: translateY(0);
1669
- transform: translateY(0); }
1670
- 100% {
1671
- -webkit-transform: translateY(0);
1672
- transform: translateY(0); } }
1673
-
1674
- @-webkit-keyframes picker-filter {
1675
- 0% {
1676
- -webkit-filter: none;
1677
- filter: none; }
1678
- 1% {
1679
- -webkit-filter: url("#goo");
1680
- filter: url("#goo"); }
1681
- 99% {
1682
- -webkit-filter: url("#goo");
1683
- filter: url("#goo"); }
1684
- 100% {
1685
- -webkit-filter: none;
1686
- filter: none; } }
1687
-
1688
- @keyframes picker-filter {
1689
- 0% {
1690
- -webkit-filter: none;
1691
- filter: none; }
1692
- 1% {
1693
- -webkit-filter: url("#goo");
1694
- filter: url("#goo"); }
1695
- 99% {
1696
- -webkit-filter: url("#goo");
1697
- filter: url("#goo"); }
1698
- 100% {
1699
- -webkit-filter: none;
1700
- filter: none; } }
1701
-
1702
- @-webkit-keyframes fill-picker-before {
1703
- 24% {
1704
- opacity: 0;
1705
- -webkit-transform: translateY(-130%);
1706
- transform: translateY(-130%); }
1707
- 25% {
1708
- opacity: 1;
1709
- -webkit-transform: translateY(-130%);
1710
- transform: translateY(-130%); }
1711
- 32% {
1712
- opacity: 1;
1713
- -webkit-transform: translateY(-130%);
1714
- transform: translateY(-130%); }
1715
- 52% {
1716
- opacity: 1;
1717
- -webkit-transform: translateY(-130%);
1718
- transform: translateY(-130%); }
1719
- 100% {
1720
- opacity: 1;
1721
- -webkit-transform: translateY(-160%);
1722
- transform: translateY(-160%); } }
1723
-
1724
- @keyframes fill-picker-before {
1725
- 24% {
1726
- opacity: 0;
1727
- -webkit-transform: translateY(-130%);
1728
- transform: translateY(-130%); }
1729
- 25% {
1730
- opacity: 1;
1731
- -webkit-transform: translateY(-130%);
1732
- transform: translateY(-130%); }
1733
- 32% {
1734
- opacity: 1;
1735
- -webkit-transform: translateY(-130%);
1736
- transform: translateY(-130%); }
1737
- 52% {
1738
- opacity: 1;
1739
- -webkit-transform: translateY(-130%);
1740
- transform: translateY(-130%); }
1741
- 100% {
1742
- opacity: 1;
1743
- -webkit-transform: translateY(-160%);
1744
- transform: translateY(-160%); } }
1745
-
1746
- @-webkit-keyframes fill-picker-after {
1747
- 24% {
1748
- opacity: 0;
1749
- -webkit-transform: translateY(-160%);
1750
- transform: translateY(-160%); }
1751
- 25% {
1752
- opacity: 1;
1753
- -webkit-transform: translateY(-160%);
1754
- transform: translateY(-160%); }
1755
- 32% {
1756
- opacity: 1;
1757
- -webkit-transform: translateY(-120%);
1758
- transform: translateY(-120%); }
1759
- 100% {
1760
- opacity: 1;
1761
- -webkit-transform: translateY(0);
1762
- transform: translateY(0); } }
1763
-
1764
- @keyframes fill-picker-after {
1765
- 24% {
1766
- opacity: 0;
1767
- -webkit-transform: translateY(-160%);
1768
- transform: translateY(-160%); }
1769
- 25% {
1770
- opacity: 1;
1771
- -webkit-transform: translateY(-160%);
1772
- transform: translateY(-160%); }
1773
- 32% {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1774
  opacity: 1;
1775
- -webkit-transform: translateY(-120%);
1776
- transform: translateY(-120%); }
1777
- 100% {
 
 
 
 
 
 
1778
  opacity: 1;
1779
- -webkit-transform: translateY(0);
1780
- transform: translateY(0); } }
1781
-
1782
- @-webkit-keyframes fade-out {
1783
- 90% {
1784
- opacity: 1; }
1785
- 100% {
1786
- opacity: 0; } }
1787
-
1788
- @keyframes fade-out {
1789
- 90% {
1790
- opacity: 1; }
1791
- 100% {
1792
- opacity: 0; } }
1793
-
1794
- .label {
1795
- margin-right: auto; }
1796
-
1797
- .c-palette__blur {
1798
- display: none; }
1799
-
1800
- #customize-theme-controls [id*="sm_current_palette_control"] {
1801
- display: block;
1802
- margin: -12px -12px 19px;
1803
- width: auto; }
1804
- #customize-theme-controls [id*="sm_current_palette_control"] .palette-container {
1805
- padding: 19px;
1806
- background: white; }
1807
-
1808
- .c-palette__name {
1809
- margin-right: auto; }
1810
-
1811
- .c-palette__control {
1812
- width: 2em;
1813
- height: 2em;
1814
- margin-left: 0.25em;
1815
- display: -ms-flexbox;
1816
- display: flex;
1817
- -ms-flex-pack: center;
1818
- justify-content: center;
1819
- -ms-flex-align: center;
1820
- align-items: center;
1821
- border-radius: 50%; }
1822
- .c-palette__control, .c-palette__control span {
1823
- transition: color .3s ease-in-out; }
1824
- .c-palette__control span {
1825
- color: rgba(0, 0, 0, 0.25);
1826
- -webkit-transform: scale(0.8);
1827
- transform: scale(0.8); }
1828
- .c-palette__control.active {
1829
- background: currentColor; }
1830
- .c-palette__control.active span {
1831
- color: white; }
1832
-
1833
- #sub-accordion-section-style_manager_section {
1834
- display: -ms-flexbox !important;
1835
- display: flex !important;
1836
- -ms-flex-direction: column;
1837
- flex-direction: column;
1838
- padding: 12px 0 0 !important;
1839
- overflow: hidden; }
1840
- #sub-accordion-section-style_manager_section > * {
1841
- display: block !important;
1842
- -ms-flex-positive: 0;
1843
- flex-grow: 0;
1844
- padding: 0 12px; }
1845
- #sub-accordion-section-style_manager_section #customize-control-sm_color_palette_control {
1846
- -ms-flex-preferred-size: 0;
1847
- flex-basis: 0;
1848
- -ms-flex-positive: 1;
1849
- flex-grow: 1;
1850
- overflow-y: scroll;
1851
- margin-top: -19px;
1852
- padding-top: 19px;
1853
- margin-bottom: 0; }
1854
- #sub-accordion-section-style_manager_section:not(.advanced) #customize-control-sm_color_palette_control ~ li:not([id="customize-control-sm_toggle_advanced_settings_control"]) {
1855
- display: none !important; }
1856
- #sub-accordion-section-style_manager_section.advanced #customize-control-sm_color_palette_control {
1857
- display: none !important; }
1858
-
1859
- .c-palette .iris-picker {
1860
- position: absolute;
1861
- top: 100%;
1862
- left: 0;
1863
- z-index: 100;
1864
- margin-top: 1em; }
1865
-
1866
- .color .picker {
1867
- transition: opacity .3s ease-in-out;
1868
- cursor: pointer; }
1869
-
1870
- .color.inactive .picker {
1871
- opacity: 0.2; }
1872
-
1873
- .color.inactive .picker:hover {
1874
- opacity: 1; }
1875
-
1876
- .c-palette__tooltip {
1877
- position: absolute;
1878
- bottom: 100%;
1879
- left: 50%;
1880
- z-index: 300;
1881
- margin-bottom: 5px;
1882
- padding: 4px 14px;
1883
- opacity: 0;
1884
- -webkit-transform: translateX(-50%);
1885
- transform: translateX(-50%);
1886
- transition: opacity .2s ease-out;
1887
- color: white;
1888
- background-color: #606A72;
1889
- box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.15); }
1890
- .c-palette__tooltip:after {
1891
- content: "";
1892
- position: absolute;
1893
- top: 100%;
1894
- left: 50%;
1895
- display: block;
1896
- border: 5px solid transparent;
1897
- border-bottom-width: 0;
1898
- border-top-color: #606A72;
1899
- -webkit-transform: translateX(-50%);
1900
- transform: translateX(-50%); }
1901
- .c-palette__control:hover .c-palette__tooltip {
1902
- opacity: 1; }
1903
-
1904
- .c-palette__control {
1905
- position: relative;
1906
- cursor: pointer; }
1907
-
1908
- #customize-control-sm_toggle_advanced_settings_control {
1909
- margin-bottom: 0;
1910
- opacity: 0; }
1911
- #customize-control-sm_toggle_advanced_settings_control button {
1912
- width: 100%; }
1
+ .wp-full-overlay-sidebar *,
2
+ .wp-full-overlay-sidebar *:before,
3
+ .wp-full-overlay-sidebar *:after
4
+ {
5
+ box-sizing: border-box;
6
+ }.iris-picker,
7
+ .iris-picker *
8
+ {
9
+ box-sizing: content-box;
10
+ }.wp-full-overlay-sidebar-content .accordion-section-content
11
+ {
12
+ overflow: visible;
13
+ }.control-section:not(.control-section-themes) .customize-control
14
+ {width: 100%;min-height: initial;
15
+ padding: 0;
16
+ }#customize-header-actions #customize-save-button-wrapper
17
+ {
18
+ margin-top: 7px;
19
+ }.wp-full-overlay-footer .devices button
20
+ {
21
+ float: left;border-radius: 0;
22
+ }.customize-controls-close
23
+ {
24
+ width: 48px;height: 44px;color: #7da9c3;border-top: none;border-right-color: #e0e8ef;background: #fff;
25
+ }.customize-controls-close:focus,
26
+ .customize-controls-close:hover
27
+ {
28
+ background: #f5fcff;
29
+ }.customize-controls-close:before
30
+ {
31
+ top: 0;
32
+ }#customize-controls .customize-info
33
+ {
34
+ border-bottom-color: #e0e8ef;
35
+ }.customize-panel-back,
36
+ .customize-section-back
37
+ {
38
+ height: 74px;color: #7da9c3;border-right-color: #e0e8ef;
39
+ }.customize-panel-back:hover,
40
+ .customize-panel-back:focus,
41
+ .customize-section-back:hover,
42
+ .customize-section-back:focus
43
+ {
44
+ border-left-color: #f5fcff;background: #f5fcff;
45
+ }#customize-theme-controls .theme *
46
+ {
47
+ box-sizing: content-box;
48
+ }#customize-theme-controls .accordion-section-content
49
+ {
50
+ padding: 17px;
51
+ }#customize-theme-controls .customize-section-title
52
+ {
53
+ margin-top: -17px;margin-right: -17px;
54
+ }#customize-theme-controls .control-panel-content .control-section:nth-child(2),
55
+ #customize-theme-controls .control-panel-content .control-section:nth-child(3)
56
+ {
57
+ border-top: none;
58
+ }#customize-theme-controls .control-panel-content .control-section:nth-last-child(2)
59
+ {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
60
  border-bottom: 1px solid #e0e8ef;
61
+ }#customize-theme-controls #accordion-section-add_menu
62
+ {
63
+ border-bottom: none;
64
+ }#customize-theme-controls #accordion-section-add_menu .add-menu-toggle
65
+ {
66
+ float: none;
67
+ }#customize-theme-controls .customize-pane-child.open
68
+ {
69
+ height: 100%;
70
+ }#customize-controls .description
71
+ {font-size: 12px;font-weight: 300;font-style: normal;line-height: 1.6;
72
+
73
+ margin-bottom: 9px;text-indent: 0;color: #4d7b90;
74
+ }.customize-control-description
75
+ {
76
+ margin-top: 6px;
77
+ }.customize-control
78
+ {
79
+ margin-bottom: 24px;
80
+ }#accordion-section-themes + .control-section
81
+ {
82
+ border-top: none;
83
+ }#customize-controls .panel-meta.customize-info .accordion-section-title
84
+ {height: 74px;
85
+
86
+ border-top: none;
87
+ }.button-controls:after
88
+ {display: table;clear: both;
89
+
90
+ content: ' ';
91
+ }.wp-core-ui .button:not(.theme-details):not(.collapse-sidebar):not(.wp-color-result),
92
+ .wp-core-ui .button-primary,
93
+ .wp-core-ui .button-secondary
94
+ {font-weight: 400;
95
+
96
+ width: auto;padding-right: 15px;padding-left: 15px;color: #f5fcff;border: none;border-radius: 4px;background: #aed2e5;box-shadow: 0 2px 0 0 #8dbed7;text-shadow: none;
97
+ }.wp-core-ui .button:not(.theme-details):not(.collapse-sidebar):not(.wp-color-result):hover,
98
+ .wp-core-ui .button-primary:hover,
99
+ .wp-core-ui .button-secondary:hover
100
+ {
101
+ color: white;background: #98c6dd;box-shadow: 0 2px 0 0 #74a7c2;text-shadow: none;
102
+ }.wp-core-ui #customize-header-actions .button-primary
103
+ {
104
+ background: #73c5ee;box-shadow: 0 2px 0 0 #57abd5;
105
+ }.wp-core-ui #customize-header-actions .button-primary:hover
106
+ {
107
+ background: #58b0dd;box-shadow: 0 2px 0 0 #3f8aaf;
108
+ }.wp-core-ui #customize-header-actions .button-primary.has-next-sibling
109
+ {
110
+ border-right: 1px solid #57abd5;
111
+ }.wp-core-ui #customize-header-actions .button-primary:disabled
112
+ {opacity: .7;
113
+ color: white !important;background: #aed2e5 !important;box-shadow: 0 2px 0 0 #8db5ca !important;
114
+ }.wp-core-ui #customize-header-actions .button-primary:disabled.has-next-sibling
115
+ {
116
+ border-right: none;
117
+ }.wp-core-ui .reset_section,
118
+ .wp-core-ui .reset_panel
119
+ {display: block;
120
+
121
+ width: 100%;height: 4em;margin: 0 0 25px;
122
+ }.wp-core-ui .reset_panel
123
+ {
124
+ margin-top: 10px;
125
+ }.separator.label
126
+ {font-size: 14px;font-weight: 600;line-height: 24px;
127
+
128
  display: block;
129
+ }.customize-control-title,
130
+ .separator.label
131
+ {
132
+ color: #416b7e;
133
+ }.separator.section:before,
134
+ .separator.sub-section:before
135
+ {position: absolute;z-index: -1;top: 0;right: -18px;bottom: 0;left: -18px;
136
+
137
+ content: '';
138
+ }.separator.label
139
+ {
140
+ font-weight: 500;
141
+ }.separator.large
142
+ {font-size: 16px;
143
+
144
+ margin-top: 12px;color: #39474d;
145
+ }.separator.section
146
+ {
147
+ position: relative;margin-bottom: 0;padding: 14px 0;border: none;background: none;
148
+ }.separator.section[id*='layout']
149
+ {
150
+ margin-top: 0;
151
+ }.separator.section[id*='layout']:before
152
+ {
153
+ border: none;
154
+ }.separator.section:before
155
+ {
156
+ border: 1px solid #e0e8ef;background-color: #fff;box-shadow: 0 1px 0 0 #dfe8ef;
157
+ }.separator.sub-section
158
+ {
159
+ position: relative;padding: 12px 0;
160
+ }.separator.sub-section:before
161
+ {
162
+ border-top: 1px solid #e0e8ef;border-bottom: 1px solid #e0e8ef;background-color: #f6fbff;
163
+ }.separator.sub-section + span
164
+ {font-style: normal;
165
+
166
+ margin-top: 20px;
167
+ }.section-navigation-wrapper
168
+ {
169
+ position: relative;height: 43px;margin: -15px -12px 0 -12px;margin-right: -17px;margin-left: -17px;
170
+ }.section-navigation
171
+ {
172
+ display: -ms-flexbox ;display: flex;clear: both;margin-top: -1px;border-top: 1px solid #e0e8ef;
173
+ }.section-navigation a
174
+ {display: block;padding: 12px 0;transition: background-color .15s ease-in-out;text-align: center;text-decoration: none;color: #3b484e;border-right: 1px solid #e0e8ef;border-bottom: 1px solid #e0e8ef;background-color: #fff;
175
+
176
+ -ms-flex: 1 1 auto;flex: 1 1 auto;
177
+ }.section-navigation a:last-child
178
+ {
179
+ border-right: 0;
180
+ }#customize-controls .customize-info.is-sticky.is-sticky,
181
+ #customize-controls .customize-section-title.is-sticky.is-sticky
182
+ {
183
+ top: 40px;
184
+ }#customize-controls .customize-info.is-in-view.is-in-view,
185
+ #customize-controls .customize-section-title.is-in-view.is-in-view
186
+ {
187
+ box-shadow: none;
188
+ }#customize-controls .has-nav .customize-info,
189
+ #customize-controls .has-nav .customize-section-title
190
+ {
191
+ margin-right: -12px;
192
+ }#customize-controls .customize-section-title.customize-section-title
193
+ {
194
+ border-bottom: 0;
195
+ }.customize-section-description-container.section-meta.has-nav
196
+ {
197
+ margin-bottom: 0;
198
+ }.font-options__wrapper
199
+ {
200
+ position: relative;
201
+ }.font-options__wrapper:after
202
+ {position: absolute;z-index: 0;top: 90%;right: 0;left: 0;display: block;height: 30px;
203
+
204
+ content: '';
205
+ }.font-options__head
206
+ {
207
+ display: -ms-flexbox ;display: flex;-ms-flex-pack: justify;justify-content: space-between;
208
+ }.font-options__head.font-options__head
209
+ {white-space: nowrap;text-overflow: ellipsis;
210
+
211
  -webkit-appearance: none;
212
+ }.font-options__font-title
213
+ {font-size: 12px;font-weight: 300;line-height: 20px;overflow: hidden;
214
+
215
+ margin-right: 26px;margin-left: 10px;white-space: nowrap;text-overflow: ellipsis;color: #98c6dd;
216
+ }.font-options__options-list
217
+ {
218
+ position: absolute;z-index: 2;top: calc(100% + 6px);right: -6px;left: -6px;display: block;display: none;padding: 10px;transition: opacity .15s linear;opacity: 0;border: 1px solid #dfe8ef;border-radius: 5px;background-color: #fff;
219
+ }.font-options__options-list:last-child
220
+ {
221
+ margin-bottom: 0;
222
+ }.font-options__options-list:before,
223
+ .font-options__options-list:after
224
+ {position: absolute;z-index: 10;top: -20px;right: 25px;width: 0;height: 0;
225
+
226
+ content: '';border: solid transparent;
227
+ }.font-options__options-list:before
228
+ {z-index: 11;border-width: 10px;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
229
  border-bottom-color: white;
230
+ }.font-options__options-list:after
231
+ {top: -24px;right: 23px;border-width: 12px;
232
+ border-bottom-color: rgba(0,0,0,.075);
233
+ }.customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap:after
234
+ {position: absolute;right: 12px;bottom: 100%;width: 0;height: 0;border-collapse: separate;
235
+
236
+ content: '';border-width: 0 9px 9px 9px;border-style: solid;border-color: transparent transparent #fff transparent;
237
+ }.font-options__head,
238
+ .wp-full-overlay-sidebar-content .customize-control input[type=text]:not(#_customize-input-wpcom_custom_css_content_width_control):not(.wp-color-picker),
 
 
 
 
 
 
 
 
 
 
 
 
239
  .wp-full-overlay-sidebar-content .customize-control input[type=checkbox],
240
  .wp-full-overlay-sidebar-content .customize-control input[type=password],
241
  .wp-full-overlay-sidebar-content .customize-control input[type=color],
253
  .wp-full-overlay-sidebar-content .customize-control input[type=search],
254
  .wp-full-overlay-sidebar-content .customize-control select,
255
  .wp-full-overlay-sidebar-content .customize-control textarea,
256
+ .wp-full-overlay-sidebar-content .customize-control input[type='number'].range-value,
257
+ ul.font-options__options-list .select2-container .select2-selection--single,
258
+ #customize-theme-controls .select2-container .select2-selection--multiple
259
+ {font-size: 14px;line-height: 1.5;
260
+
261
+ width: 100%;height: 44px;padding: 10px 14px;color: #416b7e;border: 2px solid #b8daeb;border-radius: 4px;outline: 0;background: #fff;
262
+ }.font-options__head:focus,
263
+ .wp-full-overlay-sidebar-content .customize-control input[type=text]:focus:not(#_customize-input-wpcom_custom_css_content_width_control):not(.wp-color-picker),
264
+ .wp-full-overlay-sidebar-content .customize-control input[type=checkbox]:focus,
265
+ .wp-full-overlay-sidebar-content .customize-control input[type=password]:focus,
266
+ .wp-full-overlay-sidebar-content .customize-control input[type=color]:focus,
267
+ .wp-full-overlay-sidebar-content .customize-control input[type=date]:focus,
268
+ .wp-full-overlay-sidebar-content .customize-control input[type=datetime]:focus,
269
+ .wp-full-overlay-sidebar-content .customize-control input[type=datetime-local]:focus,
270
+ .wp-full-overlay-sidebar-content .customize-control input[type=email]:focus,
271
+ .wp-full-overlay-sidebar-content .customize-control input[type=month]:focus,
272
+ .wp-full-overlay-sidebar-content .customize-control input[type=number]:focus,
273
+ .wp-full-overlay-sidebar-content .customize-control input[type=radio]:focus,
274
+ .wp-full-overlay-sidebar-content .customize-control input[type=tel]:focus,
275
+ .wp-full-overlay-sidebar-content .customize-control input[type=time]:focus,
276
+ .wp-full-overlay-sidebar-content .customize-control input[type=url]:focus,
277
+ .wp-full-overlay-sidebar-content .customize-control input[type=week]:focus,
278
+ .wp-full-overlay-sidebar-content .customize-control input[type=search]:focus,
279
+ .wp-full-overlay-sidebar-content .customize-control select:focus,
280
+ .wp-full-overlay-sidebar-content .customize-control textarea:focus,
281
+ .wp-full-overlay-sidebar-content .customize-control input[type='number'].range-value:focus,
282
+ ul.font-options__options-list .select2-container .select2-selection--single:focus,
283
+ #customize-theme-controls .select2-container .select2-selection--multiple:focus
284
+ {
285
+ border-color: #73c5ee;box-shadow: none;
286
+ }.font-options__head,
287
+ .wp-full-overlay-sidebar-content .customize-control select,
288
+ ul.font-options__options-list .select2-container .select2-selection--single,
289
+ #customize-theme-controls .select2-container .select2-selection--multiple
290
+ {font-weight: 600;
291
+
292
+ width: 100%;background: white url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjE1cHgiIGhlaWdodD0iOXB4IiB2aWV3Qm94PSIwIDAgMTUgOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJDdXN0b21pZnktQ29weS0yIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjU2LjAwMDAwMCwgLTM4Ni4wMDAwMDApIiBmaWxsPSIjOThDNkRFIj4KICAgICAgICAgICAgPGcgaWQ9IkhlYWRlciIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgNDcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0iQ29udGVudCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuMDAwMDAwLCA3NS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iVGl0bGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI2LjAwMDAwMCwgMjE5LjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iRmllbGQtLS1TZWxlY3QtQ29weSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iU2VsZWN0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgMjcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTI1NC40ODEyLDE4IEwyNTYsMTkuNTE0IEwyNDguNSwyNyBMMjQxLDE5LjUxNCBMMjQyLjUxODgsMTggTDI0OC41LDIzLjk2NzIgTDI1NC40ODEyLDE4IFoiIGlkPSJQYWdlLTEiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+) no-repeat;background-position: right 16px top 16px;-webkit-appearance: button;-moz-appearance: none;
293
+ }[multiple].font-options__head,
294
+ .wp-full-overlay-sidebar-content .customize-control select[multiple],
295
+ ul.font-options__options-list .select2-container [multiple].select2-selection--single,
296
+ #customize-theme-controls .select2-container [multiple].select2-selection--multiple
297
+ {
298
+ background: white;
299
+ }.wp-full-overlay-sidebar-content .customize-control input[type=text],
300
+ .wp-full-overlay-sidebar-content .customize-control textarea
301
+ {
302
+ font-size: 13px;
303
+ }.wp-full-overlay-sidebar-content .customize-control textarea
304
+ {
305
+ height: auto;
306
+ }.wp-full-overlay-sidebar-content .customize-control input[type=checkbox],
307
+ .wp-full-overlay-sidebar-content .customize-control input[type=radio]
308
+ {
309
+ width: 22px;height: 22px;
310
+ }.wp-full-overlay-sidebar-content .customize-control input[type=checkbox]:checked,
311
+ .wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked
312
+ {border-color: #5ab9e8;
313
+ background: #73c5ee;
314
+ }.wp-full-overlay-sidebar-content .customize-control input[type=checkbox]:checked:before,
315
+ .wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked:before
316
+ {margin: -1px 0 0 -2px;
317
+
318
+ color: white;
319
+ }.wp-full-overlay-sidebar-content .customize-control .awesome_preset input[type=radio]:checked
320
+ {
321
+ background: transparent;
322
+ }.wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control) label:not(:only-of-type),
323
+ .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control) > .customize-inside-control-row:not(:only-of-type),
324
+ .wp-full-overlay-sidebar-content .customize-control.customize-control-radio label:not(:only-of-type),
325
+ .wp-full-overlay-sidebar-content .customize-control.customize-control-radio > .customize-inside-control-row:not(:only-of-type)
326
+ {display: inline-block;width: calc(49% - 30px);
327
+ margin-left: 30px;padding-top: 0;padding-bottom: 0;text-indent: -6px;
328
+ }.wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control) label,
329
+ .wp-full-overlay-sidebar-content .customize-control.customize-control-radio label
330
+ {
331
+ color: #416b7e;
332
+ }[id*='divider'] + .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control),
333
+ [id*='divider'] + .wp-full-overlay-sidebar-content .customize-control.customize-control-radio
334
+ {
335
+ margin-top: 0;
336
+ }.wp-full-overlay-sidebar-content .customize-control input[type=radio]
337
+ {
338
+ border-radius: 50%;
339
+ }.wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked:before
340
+ {
341
+ content: none;
342
+ }.customize-control-html + .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox
343
+ {
344
+ margin-top: -24px;
345
+ }.wp-full-overlay-sidebar-content .customize-control.customize-control-radio label,
346
+ .wp-full-overlay-sidebar-content .customize-control.customize-control-radio .customize-inside-control-row
347
+ {
348
+ margin-top: 12px;
349
+ }.wp-full-overlay-sidebar-content .customize-control.customize-control-radio#customize-control-changeset_status .customize-inside-control-row
350
+ {
351
+ margin-top: 0;text-indent: 0;
352
+ }.wp-full-overlay-sidebar-content .customize-control input[type='range']
353
+ {
354
+ width: 65%;
355
+ }.wp-full-overlay-sidebar-content .customize-control input[type='range']
356
+ {
357
+ position: relative;overflow: hidden;width: calc(100% - 55px);height: 22px;outline: none;background: none;-webkit-appearance: none;
358
+ }.wp-full-overlay-sidebar-content .customize-control input[type='range']:before
359
+ {position: absolute;top: 8px;left: 0;width: 100%;height: 6px;
360
+
361
+ content: ' ';border-radius: 10px;background: #dfe8ef;box-shadow: inset 0 1px 3px 0 rgba(0,0,0,.3);
362
+ }.wp-full-overlay-sidebar-content .customize-control input[type='range']::-webkit-slider-thumb
363
+ {position: relative;z-index: 3;width: 22px;height: 22px;border: 2px solid #b8daeb;border-radius: 4px;background: #27ae60;background: #fff;
364
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
365
  -webkit-appearance: none;
366
+ }.wp-full-overlay-sidebar-content .customize-control input[type='range']::-webkit-slider-thumb:before
367
+ {font-size: 1em;position: absolute;top: -5px;left: 5px;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
368
 
369
+ content: '..';letter-spacing: 1px;color: #b8daeb;
370
+ }.wp-full-overlay-sidebar-content .customize-control input[type='range']::-webkit-slider-thumb:after
371
+ {position: absolute;z-index: 1;top: 6px;right: 20px;width: calc(100% - 55px);height: 6px;
372
 
373
+ content: ' ';background: #73c5ee;
374
+ }.wp-full-overlay-sidebar-content .customize-control input[type='number'].range-value
375
+ {font-size: 13px;line-height: 1;top: -5px;float: right;width: auto;
376
+ min-width: 40px;max-width: 80px;height: 30px;margin-left: 10px;padding: 4px 0 5px 0;text-align: center;
377
+ }.wp-full-overlay-sidebar-content .customize-control input[type=number]::-webkit-inner-spin-button,
378
+ .wp-full-overlay-sidebar-content .customize-control input[type=number]::-webkit-outer-spin-button
379
+ {margin: 0;
380
 
381
+ -webkit-appearance: none;
382
+ }.customize-control-color
383
+ {
384
+ display: block;
385
+ }.customize-control-color .customize-control-title,
386
+ .customize-control-color .separator.label
387
+ {
388
+ float: left;
389
+ }.customize-control-color .wp-picker-container
390
+ {
391
+ position: relative;top: -3px;float: right;
392
+ }.customize-control-color .wp-picker-container .wp-picker-holder
393
+ {
394
+ position: relative;
395
+ }.customize-control-color .wp-picker-container .wp-color-result,
396
+ .customize-control-color .wp-picker-container .wp-color-result.button
397
+ {
398
+ top: 0;width: 40px;height: 30px;margin: 0;padding: 0;border: 2px solid #b8daeb;border-radius: 4px;background: #2ecc71;box-shadow: none;
399
+ }.customize-control-color .wp-picker-container .wp-color-result:after,
400
+ .customize-control-color .wp-picker-container .wp-color-result .wp-color-result-text,
401
+ .customize-control-color .wp-picker-container .wp-color-result.button:after,
402
+ .customize-control-color .wp-picker-container .wp-color-result.button .wp-color-result-text
403
+ {
404
+ display: none;
405
+ }.customize-control-color .wp-picker-container .iris-picker
406
+ {
407
+ position: absolute;z-index: 1000;top: 40px;right: 0;width: 275px !important;border: none;border-color: #dfdfde;border-top: none;border-radius: 0 0 3px 3px;background: white;
408
+ }.customize-control-color .wp-picker-container .iris-picker,
409
+ .customize-control-color .wp-picker-container .iris-picker *
410
+ {
411
+ box-sizing: content-box;
412
+ }.customize-control-color .wp-picker-container .iris-picker .iris-square
413
+ {
414
+ width: 215px !important;height: 173px !important;margin-right: 0;
415
+ }.customize-control-color .wp-picker-container .iris-picker .iris-strip
416
+ {
417
+ float: right;box-shadow: rgba(0,0,0,.4) 0 1px 1px inset;
418
+ }.customize-control-color .wp-picker-container .iris-picker .iris-strip .ui-slider-handle
419
+ {opacity: 1;
420
+ border-color: #aaa !important;box-shadow: none;
421
+ }.customize-control-color .wp-picker-container .iris-picker .iris-palette
422
+ {
423
+ width: 24px !important;height: 24px !important;border-radius: 50px;box-shadow: rgba(0,0,0,.4) 0 1px 1px inset;
424
+ }.customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap
425
+ {
426
+ position: absolute;z-index: 1000;top: 35px;right: 0;width: 275px;padding: 9px 12px;border: none;border-radius: 3px 3px 0 0;background: white;
427
+ }.customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap input.wp-color-picker
428
+ {font-size: 13px;
429
+
430
+ float: left;width: 100px;height: auto;margin: 0;padding: 6px 12px;text-align: left;
431
+ }.customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap input.button
432
+ {
433
+ float: right;height: 30px;padding: 4px 12px;
434
+ }.customize-control-font:last-child
435
+ {
436
+ margin-bottom: 150px;
437
+ }#accordion-section-live_css_edit_section .customize-section-title
438
+ {
439
+ margin-top: -13px;border-bottom: 1px solid #ddd;
440
+ }#accordion-section-live_css_edit_section #css_editor
441
+ {
442
+ top: 70px;overflow: visible;border-top: 10px solid white;
443
+ }#accordion-section-live_css_edit_section #css_editor:before
444
+ {position: absolute;z-index: 10000000;top: -10px;left: 0;display: block;width: 48px;height: 10px;
445
+
446
+ content: '';background: #e8e8e8;
447
+ }#accordion-section-live_css_edit_section .ace_scroller
448
+ {
449
+ padding-left: 10px;
450
+ }.wp-full-overlay.editor_opened
451
+ {
452
+ margin-left: 500px;
453
+ }.wp-full-overlay.editor_opened #customize-controls
454
+ {
455
+ width: 500px;
456
+ }.wp-full-overlay.editor_opened.collapsed #customize-controls
457
+ {
458
+ width: 300px;
459
+ }.customize-control-media .current,
460
  .customize-control-site_icon .current,
461
+ li#customize-control-site_logo .current
462
+ {min-height: 44px;
463
+ margin-bottom: 10px;border: 2px solid #b8daeb;border-radius: 4px;background: #f5fcff;
464
+ }.customize-control-media .current .container,
465
+ .customize-control-media .current span,
466
+ .customize-control-site_icon .current .container,
467
+ .customize-control-site_icon .current span,
468
+ li#customize-control-site_logo .current .container,
469
+ li#customize-control-site_logo .current span
470
+ {
471
+ border: none;
472
+ }.customize-control-media .inner,
473
+ .customize-control-media .current span,
 
474
  .customize-control-site_icon .inner,
475
  .customize-control-site_icon .current span,
476
  li#customize-control-site_logo .inner,
477
+ li#customize-control-site_logo .current span
478
+ {
479
+ font-size: 13px;color: #98c6dd;
480
+ }.customize-control-media .inner,
 
481
  .customize-control-site_icon .inner,
482
+ li#customize-control-site_logo .inner
483
+ {
484
+ line-height: 1.4;
485
+ }.customize-control-media .thumbnail-image,
486
  .customize-control-site_icon .thumbnail-image,
487
+ li#customize-control-site_logo .thumbnail-image
488
+ {
489
+ padding: 14px;text-align: center;
490
+ }.customize-control-media .thumbnail-image img,
491
+ .customize-control-site_icon .thumbnail-image img,
492
+ li#customize-control-site_logo .thumbnail-image img
493
+ {
494
+ width: auto;
495
+ }.customize-control-media .actions,
496
  .customize-control-site_icon .actions,
497
+ li#customize-control-site_logo .actions
498
+ {
499
+ margin-bottom: 0;
500
+ }.customize-control-typography select,
501
+ .customize-control-typography select
502
+ {
503
+ margin-bottom: 10px;
504
+ }.customize-control-typography .description,
505
+ .customize-control-typography .description
506
+ {
507
+ margin-top: -3px;
508
+ }.customize-control-typography ul li,
509
+ .customize-control-typography ul li
510
+ {
511
+ width: 100%;margin: 0;
512
+ }.default-preset-button
513
+ {font-family: 'Open Sans',sans-serif;font-size: 13px;float: right;margin-right: 4px;padding: 1px 8px;border: 1px solid #cbcbcb;border-radius: 3px;
514
+ background-color: #f5f6f6;
515
+ }.customize-control-preset .description
516
+ {font-style: normal;
517
+
518
+ margin-right: 5px;
519
+ }.customify_preset.radio_buttons .customify_radio_button
520
+ {position: relative;display: inline-block;overflow: hidden;height: auto;margin: 3px;padding: 2px;
521
+
522
+ border: none;
523
+ }.customify_preset.radio_buttons .customify_radio_button input[type='radio']
524
+ {position: absolute;z-index: 9999;width: 100%;height: 100%;
525
+
 
 
 
 
 
 
 
526
  opacity: 0;
527
+ }.customify_preset.radio_buttons .customify_radio_button input[type='radio']:checked + label
528
+ {
529
+ background-color: #ebebeb;
530
+ }.customify_preset.radio_buttons .customify_radio_button input[type='radio']:checked + label:before
531
+ {
532
+ content: '>';color: inherit;
533
+ }.customify_preset.radio_buttons .customify_radio_button input[type='radio']:checked + label:after
534
+ {
535
+ content: '<';color: inherit;
536
+ }.customify_preset.radio_buttons .customify_radio_button input[type='radio']:checked:before
537
+ {
538
+ opacity: 0;
539
+ }.customify_preset.radio_buttons .customify_radio_button label
540
+ {
541
+ position: relative;z-index: 999;border-left: 4px solid;
542
+ }.customify_preset .awesome_preset
543
+ {position: relative;display: inline-block;
544
+
545
+ width: 45%;margin-top: 5px;margin-bottom: 25px;transition: all .2s;text-align: center;color: white;
546
+ }.customify_preset .awesome_preset:hover
547
+ {
548
+ opacity: .9;
549
+ }.customify_preset .awesome_preset:before
550
+ {position: absolute;z-index: 5;top: 1px;right: 1px;bottom: 1px;left: 1px;
551
+
552
+ content: '';opacity: .5;border: 1px solid #fff;border-radius: 4px;background: transparent;
553
+ }.customify_preset .awesome_preset .preset-wrap .preset-color
554
+ {
555
+ height: 128px;padding: 17px 0 27px;border-radius: 4px 4px 0 0;
556
+ }.customify_preset .awesome_preset .preset-wrap .preset-color .first-font
557
+ {font-size: 55px;line-height: 1;
558
+
559
+ display: inline-block;width: 100%;
560
+ }.customify_preset .awesome_preset .preset-wrap .preset-color .secondary-font
561
+ {font-size: 20px;line-height: 1;
562
+
563
+ display: inline-block;width: 100%;margin-top: 8px;
564
+ }.customify_preset .awesome_preset .preset-wrap .preset-name
565
+ {font-size: 11px;
566
+
567
+ position: relative;padding: 1px;text-transform: UPPERCASE;border-radius: 0 0 4px 4px;
568
+ }.customify_preset .awesome_preset .preset-wrap .preset-name:before
569
+ {position: absolute;top: -10px;left: 40%;
570
+
571
+ content: '';border: 10px solid;border-color: inherit;border-top: transparent;border-right-color: transparent;border-bottom-color: inherit;border-left-color: transparent;
572
+ }.customify_preset .awesome_preset:nth-child(odd)
573
+ {
574
+ margin-right: 7%;
575
+ }.customify_preset .awesome_preset input[type=radio]
576
+ {position: absolute;z-index: 10;top: 0;left: 0;display: inline-block;width: 100%;
577
+ height: 100%;margin: 0;color: #006505;border: 0;border-radius: 0;background-color: transparent;box-shadow: none;
578
+ }.customify_preset .awesome_preset input[type=radio]:checked:before
579
+ {
580
+ position: absolute;z-index: 1;top: -13px;right: -14px;width: 25px;height: 25px;background: #fff;
581
+ }.customify_preset .awesome_preset input[type=radio]:checked:after
582
+ {position: absolute;z-index: 10;top: -5px;right: -5px;width: 26px;height: 26px;content: '';border-radius: 50%;background: #73c5ee url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjEzcHgiIGhlaWdodD0iOXB4IiB2aWV3Qm94PSIwIDAgMTMgOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJDdXN0b21pZnktQ29weSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgLTQwOC4wMDAwMDApIiBmaWxsPSIjRkZGRkZGIj4KICAgICAgICAgICAgPGcgaWQ9IkhlYWRlciIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgNDcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0iQ29udGVudCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuMDAwMDAwLCA3NS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iRmllbGQtLS1DaGVja2JveC1Db3B5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNy4wMDAwMDAsIDI0OS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICAgICAgPGcgaWQ9IkNoZWNrYm94IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgMzAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTAuMDM4NDk1LDE2IEwxNy4xMTYxMzc1LDguOTIxNDg3NiBMMTUuMTk0NjQ5OCw3IEwxMC4wMzg0OTUsMTIuMTU1MDY3NCBMNi45MjE0ODc2LDkuMDM4OTI5OTcgTDUsMTAuOTYwNDE3NiBMMTAuMDM4NDk1LDE2IFoiIGlkPSJQYWdlLTEiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+) no-repeat;background-position: center center;
583
+
584
+ -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';filter: alpha(opacity=0);
585
+ }.customify_radio_image
586
+ {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
587
  display: inline-block;
588
+ }.customify_radio_image label
589
+ {position: relative;
590
+
591
+ display: block;float: left;margin-right: 10px;
592
+ }.customify_radio_image label input[type=radio]
593
+ {
594
+ position: absolute;top: 0;right: 0;bottom: 0;left: 0;visibility: hidden;width: 100%;height: 100%;
595
+ }.customify_radio_image label input[type=radio] img
596
+ {
597
+ cursor: pointer;border: 2px solid transparent;
598
+ }.customify_radio_image label input[type=radio]:checked + img
599
+ {
600
+ border: 3px solid #73c5ee;
601
+ }.customify_ace_editor
602
+ {
603
+ display: block;min-height: 200px;border: 1px solid #ddd;
604
+ }.customize-control-custom_background .hide
605
+ {
606
+ display: none;
607
+ }.customize-control-custom_background .upload_button_div
608
+ {
609
+ margin: 10px 0;
610
+ }.customize-control-custom_background .upload_button_div > *
611
+ {
 
 
 
 
 
 
612
  margin-right: 10px;
613
+ }.customize-control-custom_background .preview_screenshot
614
+ {margin: 10px 0;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
615
 
616
+ text-align: center;
617
+ }.customize-control-custom_background .preview_screenshot img
618
+ {
619
+ border: 2px solid #ccc;
620
+ }#customify_import_demo_data_button
621
+ {display: inline-block;
622
+
623
+ width: 70%;height: auto;margin: 0 15% 10% 15%;padding: 10px;text-align: center;
624
+ }.import_step_note
625
+ {display: inline-block;width: 100%;
626
+ margin: 5px;
627
+ }.import_step_note:before
628
+ {
629
+ content: '\1F449';
630
+ }.import_step_note.success:before
631
+ {
632
+ content: '\1F44D';
633
+ }.import_step_note.failed:before
634
+ {
635
+ content: '\274C';
636
+ }#customize-header-actions
637
+ {border-color: #e0e8ef;
638
+ background: #fff;
639
+ }.wp-full-overlay-sidebar,
640
+ .customize-themes-panel,
641
+ #customize-sidebar-outer-content
642
+ {border-right: 1px solid #e0e8ef;
643
+ background: #eaf9fe;
644
+ }.outer-section-open #customize-controls .wp-full-overlay-sidebar-content,
645
+ .attachment-media-view,
646
+ .media-widget-preview.media_audio,
647
+ .media-widget-preview.media_image
648
+ {
649
+ background: #eaf9fe;
650
+ }#customize-theme-controls #accordion-section-menu_locations
651
+ {
652
+ border-bottom: 1px solid #e0e8ef;
653
+ }#customize-controls #accordion-section-themes > .accordion-section-title
654
+ {
655
+ font-weight: 600;border-bottom: 1px solid #e0e8ef;
656
+ }#customize-controls #accordion-section-themes > .accordion-section-title:hover
657
+ {
658
+ background: #fff;
659
+ }#customize-controls .panel-meta.customize-info
660
+ {
661
+ border-bottom-color: #e0e8ef;
662
+ }#customize-theme-controls .control-section .accordion-section-title
663
+ {
664
+ font-weight: 400;border-top: 1px solid #e0e8ef;border-bottom: none;
665
+ }#customize-theme-controls .control-section:last-of-type > .accordion-section-title
666
+ {
667
+ border-bottom: 1px solid #e0e8ef;
668
+ }#customize-theme-controls .customize-section-title
669
+ {
670
+ border-top: 1px solid #e0e8ef;border-bottom: 1px solid #e0e8ef;
671
+ }#customize-controls .control-section .accordion-section-title:focus,
672
+ #customize-controls .control-section .accordion-section-title:hover,
673
+ #customize-controls .control-section.open .accordion-section-title,
674
+ #customize-controls .control-section:hover > .accordion-section-title
675
+ {
676
+ color: #056184;border-left-color: #f5fcff;background: #f5fcff;
677
+ }.wp-customizer .menu-item-edit-active .menu-item-handle,
678
+ .wp-customizer .section-open .menu-item-settings,
679
+ .wp-customizer .menu-item-bar .menu-item-handle:hover
680
+ {
681
+ border-color: #e0e8ef;
682
+ }.wp-customizer .section-open .menu-item-settings
683
+ {
684
+ background: #f5fcff;
685
+ }.wp-customizer .control-section-nav_menu .menu-location-settings
686
+ {
687
+ border-top-color: #e0e8ef !important;
688
+ }[data-balloon]
689
+ {
690
+ position: relative;
691
+ }[data-balloon]::before
692
+ {font-size: 12px;position: absolute;z-index: 10;padding: .5em 1em;content: attr(data-balloon);transition: all .18s ease-out;white-space: nowrap;pointer-events: none;
693
 
694
+ opacity: 0;color: #fff;border-radius: 4px;background: rgba(17,17,17,.9);
695
+ }[data-balloon]::after
696
+ {position: absolute;z-index: 10;width: 18px;height: 6px;content: '';transition: all .18s ease-out;pointer-events: none;opacity: 0;
697
+ background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="36px" height="12px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(0)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');background-size: 100% auto;
698
+ }[data-balloon]:hover::before,
699
+ [data-balloon]:hover::after
700
+ {pointer-events: auto;
701
 
702
+ opacity: 1;
703
+ }[data-balloon][data-balloon-pos='up']::before
704
+ {
705
+ bottom: 100%;left: 50%;margin-bottom: 11px;-webkit-transform: translate3d(-50%, 10px, 0);transform: translate3d(-50%, 10px, 0);-webkit-transform-origin: top;transform-origin: top;
706
+ }[data-balloon][data-balloon-pos='up']::after
707
+ {
708
+ bottom: 100%;left: 50%;margin-bottom: 5px;-webkit-transform: translate3d(-50%, 10px, 0);transform: translate3d(-50%, 10px, 0);-webkit-transform-origin: top;transform-origin: top;
709
+ }[data-balloon][data-balloon-pos='up']:hover::before
710
+ {
711
+ -webkit-transform: translate3d(-50%, 0, 0) ;transform: translate3d(-50%, 0, 0);
712
+ }[data-balloon][data-balloon-pos='up']:hover::after
713
+ {
714
+ -webkit-transform: translate3d(-50%, 0, 0) ;transform: translate3d(-50%, 0, 0);
715
+ }[data-balloon][data-balloon-pos='down']::before
716
+ {top: 100%;
717
+ left: 50%;margin-top: 11px;-webkit-transform: translate3d(-50%, -10px, 0);transform: translate3d(-50%, -10px, 0);
718
+ }[data-balloon][data-balloon-pos='down']::after
719
+ {top: 100%;left: 50%;width: 18px;height: 6px;margin-top: 5px;-webkit-transform: translate3d(-50%, -10px, 0);transform: translate3d(-50%, -10px, 0);
720
+
721
+ background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="36px" height="12px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(180 18 6)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');background-size: 100% auto;
722
+ }[data-balloon][data-balloon-pos='down']:hover::before
723
+ {
724
+ -webkit-transform: translate3d(-50%, 0, 0) ;transform: translate3d(-50%, 0, 0);
725
+ }[data-balloon][data-balloon-pos='down']:hover::after
726
+ {
727
+ -webkit-transform: translate3d(-50%, 0, 0) ;transform: translate3d(-50%, 0, 0);
728
+ }[data-balloon][data-balloon-pos='left']::before
729
+ {top: 50%;right: 100%;
730
+
731
+ margin-right: 11px;-webkit-transform: translate3d(10px, -50%, 0);transform: translate3d(10px, -50%, 0);
732
+ }[data-balloon][data-balloon-pos='left']::after
733
+ {top: 50%;right: 100%;width: 6px;height: 18px;margin-right: 5px;-webkit-transform: translate3d(10px, -50%, 0);transform: translate3d(10px, -50%, 0);
734
+
735
+ background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12px" height="36px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(-90 18 18)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');background-size: 100% auto;
736
+ }[data-balloon][data-balloon-pos='left']:hover::before
737
+ {
738
+ -webkit-transform: translate3d(0, -50%, 0) ;transform: translate3d(0, -50%, 0);
739
+ }[data-balloon][data-balloon-pos='left']:hover::after
740
+ {
741
+ -webkit-transform: translate3d(0, -50%, 0) ;transform: translate3d(0, -50%, 0);
742
+ }[data-balloon][data-balloon-pos='right']::before
743
+ {top: 50%;
744
+ left: 100%;margin-left: 11px;-webkit-transform: translate3d(-10px, -50%, 0);transform: translate3d(-10px, -50%, 0);
745
+ }[data-balloon][data-balloon-pos='right']::after
746
+ {top: 50%;left: 100%;width: 6px;height: 18px;margin-left: 5px;-webkit-transform: translate3d(-10px, -50%, 0);transform: translate3d(-10px, -50%, 0);
747
+
748
+ background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12px" height="36px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(90 6 6)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');background-size: 100% auto;
749
+ }[data-balloon][data-balloon-pos='right']:hover::before
750
+ {
751
+ -webkit-transform: translate3d(0, -50%, 0) ;transform: translate3d(0, -50%, 0);
752
+ }[data-balloon][data-balloon-pos='right']:hover::after
753
+ {
754
+ -webkit-transform: translate3d(0, -50%, 0) ;transform: translate3d(0, -50%, 0);
755
+ }[data-balloon][data-balloon-length='small']::before
756
+ {width: 80px;
757
 
758
+ white-space: normal;
759
+ }[data-balloon][data-balloon-length='medium']::before
760
+ {width: 150px;
761
 
762
+ white-space: normal;
763
+ }[data-balloon][data-balloon-length='large']::before
764
+ {width: 260px;
765
 
766
+ white-space: normal;
767
+ }[data-balloon][data-balloon-length='xlarge']::before
768
+ {width: 380px;
 
 
 
769
 
770
+ white-space: normal;
771
+ }@media screen and (max-width: 768px)
772
+ {
773
+ [data-balloon][data-balloon-length='xlarge']::before
774
+ {width: 90vw;
775
 
776
+ white-space: normal;
777
+ }
778
+ }[data-balloon][data-balloon-length='fit']::before
779
+ {width: 100%;
780
 
781
+ white-space: normal;
782
+ }body.modal-open
783
+ {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
784
  overflow: hidden;
785
+ }body.modal-open #style-manager-user-feedback-modal .modal
786
+ {visibility: visible;
787
+ overflow-x: hidden;overflow-y: auto;-webkit-transform: translate(0, 0);transform: translate(0, 0);opacity: 1;
788
+ }#style-manager-user-feedback-modal
789
+ {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
790
  height: 100%;
791
+ }#style-manager-user-feedback-modal .modal
792
+ {font-family: 'Galano Grotesque Alt', -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;font-size: 16px;font-weight: 400;line-height: 1.7;
793
+
794
+ position: relative;z-index: 1050;top: 0;right: 0;bottom: 0;left: 0;display: -ms-flexbox;display: flex;visibility: hidden;overflow: hidden;height: 100%;transition: all .3s ease;-webkit-transform: translate(0, -10%);transform: translate(0, -10%);opacity: 0;outline: 0;-ms-flex-align: center;align-items: center;
795
+ }#style-manager-user-feedback-modal .modal-dialog
796
+ {
797
+ position: relative;width: auto;margin: 10px;text-align: left;
798
+ }#style-manager-user-feedback-modal .modal-content
799
+ {
800
+ position: relative;display: -ms-flexbox;display: flex;flex-direction: column;border: none;border-radius: 4px;outline: 0;background-color: #fff;background-clip: padding-box;box-shadow: 0 4px 4px 0 rgba(42,54,52,.1),0 8px 8px 0 rgba(42,54,52,.1),0 16px 16px 0 rgba(42,54,52,.1),0 16px 32px 0 rgba(42,54,52,.1),0 32px 64px 0 rgba(42,54,52,.1),0 64px 128px 0 rgba(42,54,52,.1);-ms-flex-direction: column;
801
+ }#style-manager-user-feedback-modal .modal-content p
802
+ {
803
+ color: #000;
804
+ }#style-manager-user-feedback-modal .modal-content p a
805
+ {
806
+ font-weight: 500;color: #9660c6;border-bottom: 1px solid #9660c6;
807
+ }#style-manager-user-feedback-modal .modal-content > form
808
+ {
809
+ margin-bottom: 20px;
810
+ }#style-manager-user-feedback-modal .modal-backdrop
811
+ {
812
+ position: fixed;z-index: 1040;top: 0;right: 0;bottom: 0;left: 0;visibility: hidden;transition: all .3s ease;opacity: 0;background-color: #000;
813
+ }.modal-open #style-manager-user-feedback-modal .modal-backdrop
814
+ {visibility: visible;
815
+
816
+ opacity: .8;
817
+ }#style-manager-user-feedback-modal .modal-header
818
+ {
819
+ display: -ms-flexbox ;display: flex;padding: 30px 48px 10px 48px;-ms-flex-align: start;align-items: flex-start;-ms-flex-pack: justify;justify-content: space-between;
820
+ }#style-manager-user-feedback-modal .modal-header .close.button
821
+ {
822
+ top: -10px;
823
+ }#style-manager-user-feedback-modal .modal-header .close.icon
824
+ {
825
+ opacity: .5;
826
+ }#style-manager-user-feedback-modal .modal-header .close:hover
827
+ {
828
+ opacity: 1;
829
+ }#style-manager-user-feedback-modal .modal-title
830
+ {line-height: 1.5;
831
+
832
+ margin-bottom: 10px;
833
+ }#style-manager-user-feedback-modal .modal-title.modal-title--small
834
+ {
835
+ font-weight: 500;
836
+ }#style-manager-user-feedback-modal .modal-body
837
+ {
838
+ position: relative;padding: 30px 30px 0 30px;-ms-flex: 1 1 auto;flex: 1 1 auto;
839
+ }#style-manager-user-feedback-modal .modal-body.full
840
+ {
841
+ padding: 0;
842
+ }#style-manager-user-feedback-modal .modal-body.full .box
843
+ {margin-top: 0;
844
+ padding-top: 0;padding-bottom: 0;
845
+ }#style-manager-user-feedback-modal .modal-body.full + .modal-footer.full .box
846
+ {
847
+ padding-top: 18px;
848
+ }#style-manager-user-feedback-modal .modal-footer
849
+ {
850
+ padding: 30px;text-align: center;
851
+ }#style-manager-user-feedback-modal .modal-footer .box .button:last-child
852
+ {
853
+ margin-bottom: 0;
854
+ }#style-manager-user-feedback-modal .modal-footer.full
855
+ {
856
+ padding: 0;
857
+ }#style-manager-user-feedback-modal .modal-scrollbar-measure
858
+ {
859
+ position: absolute;top: -9999px;overflow: scroll;width: 50px;height: 50px;
860
+ }#style-manager-user-feedback-modal .modal-state
861
+ {
862
+ display: none;
863
+ }#style-manager-user-feedback-modal .modal-state:checked + .modal
864
+ {visibility: visible;
865
+
866
+ opacity: 1;
867
+ }#style-manager-user-feedback-modal .modal-state:checked + .modal .modal__inner
868
+ {
869
  top: 0;
870
+ }@media (min-width: 576px)
871
+ {
872
+ #style-manager-user-feedback-modal .modal-dialog
873
+ {
874
+ max-width: 655px;margin: 30px auto;
875
+ }#style-manager-user-feedback-modal .modal-sm
876
+ {
877
+ max-width: 300px;
878
+ }
879
+ }@media (min-width: 576px)
880
+ {
881
+ #style-manager-user-feedback-modal .modal-lg
882
+ {
883
+ max-width: 800px;
884
+ }
885
+ }#style-manager-user-feedback .modal-body .box
886
+ {
887
+ position: relative;display: -ms-flexbox;display: flex;flex-direction: column;margin: 20px 0;padding: 16px 52px;border-radius: 4px;-ms-flex-direction: column;-ms-flex-wrap: nowrap;flex-wrap: nowrap;-ms-flex-align: center;align-items: center;
888
+ }#style-manager-user-feedback .modal-body .box > *
889
+ {
890
  width: 100%;
891
+ }#style-manager-user-feedback .modal-body p
892
+ {
893
+ font-size: 16px;margin-bottom: 20px;
894
+ }#style-manager-user-feedback .modal-body textarea
895
+ {font-family: 'Galano Grotesque Alt', -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;font-size: 16px;line-height: 26px;
896
+
897
+ width: 100%;margin: 0;padding: 11px 18px;color: #473850;border: 1px solid #ddd;border-radius: 4px;box-shadow: none;
898
+ }#style-manager-user-feedback .modal-title
899
+ {font-family: 'Galano Classic', -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;font-size: 28px;font-weight: 600;line-height: 1.4;
900
+
901
+ margin-top: 0;margin-bottom: 34px;text-align: center;
902
+ }#style-manager-user-feedback .button
903
+ {font-family: 'Galano Classic', -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;font-size: 16px;font-weight: 600;line-height: 23px;position: relative;display: inline-block;width: 100%;height: auto;margin-top: 20px;padding: 15px 50px;cursor: pointer;transition-timing-function: cubic-bezier(0, 0, .58, 1);transition-duration: .2s;transition-property: -webkit-transform,background,background-color,color,box-shadow;transition-property: transform,background,background-color,color,box-shadow;text-align: center;
904
+ text-decoration: none;color: #fff;border-radius: 2px;border-radius: 4px;background-color: #9660c6;box-shadow: none;-webkit-font-smoothing: antialiased;
905
+ }#style-manager-user-feedback .button:hover
906
+ {-webkit-transform: scale(1.05) translateY(-3px) ;transform: scale(1.05) translateY(-3px);color: #fff;
907
+ background-color: #9660c6;box-shadow: 0 10px 20px -10px rgba(0,0,0,.7);
908
+ }#style-manager-user-feedback .second-step
909
+ {
910
+ margin-top: 18px;
911
+ }#style-manager-user-feedback .thanks-step,
912
+ #style-manager-user-feedback .error-step
913
+ {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
914
  text-align: center;
915
+ }#style-manager-user-feedback .thanks-step .modal-title,
916
+ #style-manager-user-feedback .error-step .modal-title
917
+ {
918
+ margin-bottom: 0;
919
+ }#style-manager-user-feedback .thanks-step p:last-child,
920
+ #style-manager-user-feedback .error-step p:last-child
921
+ {
922
+ margin-bottom: 10px;
923
+ }.scorecard
924
+ {font-family: 'Galano Classic', -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;font-size: 18px;font-weight: 600;
925
+
926
+ display: -ms-flexbox;display: flex;text-align: center;color: #9660c6;-ms-flex-align: baseline;align-items: baseline;-ms-flex-pack: space-evenly;justify-content: space-evenly;
927
+ }.scorecard > label
928
+ {
929
+ font-size: 20px;
930
+ }.scorecard > label span
931
+ {line-height: 46px;
932
+
933
+ display: block;width: 46px;transition: all .25s ease;border: 2px solid #9660c6;border-radius: 100%;background: #fff;
934
+ }.scorecard > label input[type='radio']
935
+ {
936
+ display: none;
937
+ }.scorecard > label span:hover,
938
+ .scorecard > label input[type='radio']:checked ~ span
939
+ {color: #fff;
940
+ background: #9660c6;
941
+ }.font-options__wrapper .font-options__options-list
942
+ {
943
+ border-color: #b8daeb;box-shadow: 0 10px 20px 0 rgba(0,0,0,.15);
944
+ }.font-options__wrapper .font-options__option
945
+ {
946
+ margin-bottom: 12px;
947
+ }.font-options__wrapper .font-options__option label
948
+ {
949
+ display: block;margin-bottom: 6px;
950
+ }.font-options__wrapper [type=checkbox]:checked ~ .font-options__options-list
951
+ {display: block;
952
+
953
+ opacity: 1;
954
+ }input.customify_font_tooltip
955
+ {
956
+ display: none;
957
+ }ul.font-options__options-list .select2-container
958
+ {
959
+ width: 100% !important;
960
+ }ul.font-options__options-list .select2-container .select2-selection--single
961
+ {
962
+ -webkit-appearance: initial;
963
+ }ul.font-options__options-list .select2-container .select2-selection--single .select2-selection__arrow
964
+ {
965
+ display: none;
966
+ }ul.font-options__options-list .select2-container--default .select2-selection--single .select2-selection__rendered
967
+ {line-height: initial;
968
+
969
+ color: inherit;
970
+ }.select2-container.select2-container--open
971
+ {
972
+ z-index: 99999999;
973
+ }#customize-theme-controls .select2-container
974
+ {
975
+ width: 100% !important;
976
+ }#customize-theme-controls .select2-container .select2-selection--multiple
977
+ {height: auto;padding: 4px 8px 4px;background: none;
978
+
979
+ -webkit-appearance: initial;
980
+ }#customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__arrow
981
+ {
982
+ display: none;
983
+ }#customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered
984
+ {display: -ms-flexbox;display: flex;
985
+
986
+ padding: 0;
987
+ }#customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered .select2-search--inline
988
+ {
989
+ -ms-flex: 1 ;flex: 1;
990
+ }#customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered .select2-search--inline .select2-search__field[class]
991
+ {
992
+ min-width: 100%;margin-top: 3px !important;border-width: 0;
993
+ }#customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered .select2-selection__choice
994
+ {margin-top: 0;margin-right: 6px;
995
+ padding: 3px 7px;border-color: #e0e8ef;background-color: #f6fbff;
996
+ }#customize-theme-controls .select2-container .select2-search--inline .select2-search__field
997
+ {min-width: 9em;
998
+ height: 29px;margin-top: 0;
999
+ }.select2-container--default .select2-results__option[aria-selected=true][class]
1000
+ {pointer-events: none;opacity: .3;
1001
+ background: transparent;
1002
+ }.select2-container .select2-dropdown
1003
+ {
1004
+ border-color: #e0e8ef;
1005
+ }#customize-theme-controls .widget-content .accordion-container
1006
+ {margin-top: 20px;margin-right: -10px;margin-bottom: 10px;
1007
+ margin-left: -10px;
1008
+ }#customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content
1009
+ {
1010
+ position: relative;left: 0;overflow: hidden;max-height: 0;padding-top: 0;padding-bottom: 0;transition: all .4s ease;color: #416b7e;
1011
+ }#customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content p:first-child
1012
+ {
1013
+ margin-top: 0;
1014
+ }#customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content p:last-child
1015
+ {
1016
+ margin-bottom: 0;
1017
+ }#customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-title
1018
+ {
1019
+ color: #39474d;
1020
+ }#customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-title:after
1021
+ {
1022
+ content: '\f142';-webkit-transform: rotate(180deg);transform: rotate(180deg);
1023
+ }#customize-theme-controls .widget-content .accordion-container .accordion-section.open
1024
+ {
1025
+ border-bottom: none;
1026
+ }#customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-content
1027
+ {
1028
+ max-height: 100%;padding-top: 17px;padding-bottom: 17px;
1029
+ }#customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-title
1030
+ {
1031
+ border-bottom: 1px solid;
1032
+ }#customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-title:after
1033
+ {
1034
+ -webkit-transform: rotate(0deg) ;transform: rotate(0deg);
1035
+ }#customize-theme-controls .widget-content .accordion-container label.customize-control-title,
1036
+ #customize-theme-controls .widget-content .accordion-container label.separator.label
1037
+ {
1038
+ cursor: default;
1039
+ }.widget .widget-content > p input[type=checkbox],
1040
+ .widget .widget-content > p input[type=radio]
1041
+ {margin-top: 3px;
1042
+ margin-bottom: 3px;
1043
+ }.widget .widget-content small
1044
+ {display: block;
1045
+
1046
+ margin-top: 5px;
1047
+ }#available-widgets [class*=pixelgrade] .widget .widget-title:before,
1048
+ #available-widgets [class*=featured-posts] .widget .widget-title:before,
1049
+ #available-widgets [class*=categories-image-grid] .widget .widget-title:before
1050
+ {
1051
+ content: '\f538';color: #9660c6;
1052
+ }#available-widgets [class*=pixelgrade-featured-posts-slideshow] .widget .widget-title:before
1053
+ {
1054
+ content: '\f233';
1055
+ }#available-widgets [class*=pixelgrade-featured-posts-carousel] .widget .widget-title:before
1056
+ {
1057
+ content: '\f169';
1058
+ }#available-widgets [class*=featured-posts-grid] .widget .widget-title:before
1059
+ {
1060
+ content: '\f180';
1061
+ }#available-widgets [class*=featured-posts-list] .widget .widget-title:before
1062
+ {
1063
+ content: '\f164';
1064
+ }#available-widgets [class*=categories-image-grid] .widget .widget-title:before
1065
+ {
1066
+ content: '\f163';
1067
+ }#available-widgets [class*=pixelgrade-promo-box] .widget .widget-title:before
1068
+ {
1069
+ content: '\f488';
1070
+ }.ui-tooltip
1071
+ {
1072
+ z-index: 999999;
1073
+ }.wp-customizer .widget-conditional .condition-control:after
1074
+ {display: table;clear: both;
1075
+
1076
+ content: ' ';
1077
+ }.wp-customizer .widget-conditional .selection
1078
+ {margin-right: 0;margin-bottom: 10px;margin-left: 0;
1079
+ padding-right: 50px;padding-bottom: 19px;padding-left: 28px;border-bottom: 1px solid #cbcfd4;
1080
+ }.wp-customizer .widget-conditional .condition:last-child .selection
1081
+ {
1082
+ border: 0;
1083
+ }.wp-customizer .widget-conditional select
1084
+ {width: 170px;
1085
+ max-width: 100%;
1086
+ }.wp-customizer .widget-conditional .condition-top select
1087
+ {
1088
+ width: 130px;
1089
+ }.pix_customizer_setting .customize-inside-control-row
1090
+ {
1091
+ position: relative;overflow: hidden;width: 100% !important;height: 64px;margin-left: 0 !important;text-indent: 0 !important;border-radius: 5px;background-position: 50% 50%;background-size: cover;
1092
+ }.pix_customizer_setting .customize-inside-control-row:before
1093
+ {position: absolute;z-index: 10;top: 0;right: 0;bottom: 0;left: 0;
1094
+
1095
+ content: '';pointer-events: none;box-shadow: inset 0 0 3px 0 rgba(0,0,0,.15),inset 0 1px 3px 0 rgba(0,0,0,.15);
1096
+ }.pix_customizer_setting .customize-inside-control-row:hover:before
1097
+ {
1098
+ box-shadow: inset 0 2px 3px 0 rgba(0,0,0,.15),inset 0 0 3px 0 rgba(0,0,0,.15);
1099
+ }.pix_customizer_setting .customize-inside-control-row:hover .palette__item
1100
+ {
1101
+ -webkit-transform: translateY(0%) ;transform: translateY(0%);
1102
+ }.pix_customizer_setting .customize-inside-control-row:hover label
1103
+ {
1104
+ left: 10px;
1105
+ }.pix_customizer_setting .customize-inside-control-row input
1106
+ {
1107
+ opacity: 0;
1108
+ }.pix_customizer_setting .customize-inside-control-row input:checked + label .preview__letter--checked
1109
+ {
1110
+ display: inline-block;vertical-align: middle;
1111
+ }.pix_customizer_setting .customize-inside-control-row input:checked + label .preview__letter
1112
+ {
1113
+ display: none;
1114
+ }.pix_customizer_setting .customize-inside-control-row label
1115
+ {
1116
+ position: absolute;z-index: 2;top: 0;left: 0;display: -ms-flexbox;display: flex;width: 100%;height: 100%;margin-top: 0 !important;padding: 0 10px;transition: all .3s ease;-ms-flex-align: center;align-items: center;
1117
+ }.pix_customizer_setting .customize-inside-control-row .palette
1118
+ {
1119
+ position: absolute;z-index: 1;top: 0;left: 0;display: -ms-flexbox;display: flex;width: 100%;height: 100%;transition: all .2s ease;
1120
+ }.pix_customizer_setting .customize-inside-control-row .palette__item
1121
+ {transition: all .3s ease;-webkit-transform: translateY(100%);transform: translateY(100%);
1122
+
1123
+ -ms-flex: 1;flex: 1;
1124
+ }.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(1)
1125
+ {
1126
+ transition-delay: 0s;
1127
+ }.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(2)
1128
+ {
1129
+ transition-delay: .05s;
1130
+ }.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(3)
1131
+ {
1132
+ transition-delay: .1s;
1133
+ }.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(4)
1134
+ {
1135
+ transition-delay: .15s;
1136
+ }.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(5)
1137
+ {
1138
+ transition-delay: .2s;
1139
+ }.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(6)
1140
+ {
1141
+ transition-delay: .25s;
1142
+ }.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(7)
1143
+ {
1144
+ transition-delay: .3s;
1145
+ }.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(8)
1146
+ {
1147
+ transition-delay: .35s;
1148
+ }.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(9)
1149
+ {
1150
+ transition-delay: .4s;
1151
+ }.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(10)
1152
+ {
1153
+ transition-delay: .45s;
1154
+ }.pix_customizer_setting .customize-inside-control-row .preview__letter,
1155
+ .pix_customizer_setting .customize-inside-control-row .preview__letter--checked
1156
+ {font-style: normal;
1157
+
1158
+ display: inline-block;min-width: 26px;min-height: 26px;margin-right: 5px;padding: 3px;text-align: center;vertical-align: baseline;color: white;border-radius: 2px;background-repeat: no-repeat;background-position: center center;background-size: 15px 15px;
1159
+ }.pix_customizer_setting .customize-inside-control-row .preview__letter--checked
1160
+ {
1161
+ display: none;
1162
+ }[id*='sm_current_color_palette_control'] .customize-inside-control-row .palette__item[class]
1163
+ {
1164
+ -webkit-transform: none ;transform: none;
1165
+ }[id*='sm_current_color_palette_control'] .variation-control
1166
+ {
1167
+ display: -ms-flexbox ;display: flex;
1168
+ }[id='customize-control-sm_color_primary_control'],
1169
+ [id='customize-control-sm_dark_primary_control'],
1170
+ [id='customize-control-sm_light_primary_control'],
1171
+ [id='customize-control-sm_color_secondary_control'],
1172
+ [id='customize-control-sm_dark_secondary_control'],
1173
+ [id='customize-control-sm_light_secondary_control'],
1174
+ [id='customize-control-sm_color_tertiary_control'],
1175
+ [id='customize-control-sm_dark_tertiary_control'],
1176
+ [id='customize-control-sm_light_tertiary_control']
1177
+ {
1178
+ visibility: hidden;
1179
+ }[id='customize-control-sm_color_primary_control'] > span,
1180
+ [id='customize-control-sm_dark_primary_control'] > span,
1181
+ [id='customize-control-sm_light_primary_control'] > span,
1182
+ [id='customize-control-sm_color_secondary_control'] > span,
1183
+ [id='customize-control-sm_dark_secondary_control'] > span,
1184
+ [id='customize-control-sm_light_secondary_control'] > span,
1185
+ [id='customize-control-sm_color_tertiary_control'] > span,
1186
+ [id='customize-control-sm_dark_tertiary_control'] > span,
1187
+ [id='customize-control-sm_light_tertiary_control'] > span
1188
+ {
1189
+ display: none;
1190
+ }[id='customize-control-sm_color_primary_control'] .wp-picker-input-wrap,
1191
+ [id='customize-control-sm_color_primary_control'] .wp-picker-holder,
1192
+ [id='customize-control-sm_dark_primary_control'] .wp-picker-input-wrap,
1193
+ [id='customize-control-sm_dark_primary_control'] .wp-picker-holder,
1194
+ [id='customize-control-sm_light_primary_control'] .wp-picker-input-wrap,
1195
+ [id='customize-control-sm_light_primary_control'] .wp-picker-holder,
1196
+ [id='customize-control-sm_color_secondary_control'] .wp-picker-input-wrap,
1197
+ [id='customize-control-sm_color_secondary_control'] .wp-picker-holder,
1198
+ [id='customize-control-sm_dark_secondary_control'] .wp-picker-input-wrap,
1199
+ [id='customize-control-sm_dark_secondary_control'] .wp-picker-holder,
1200
+ [id='customize-control-sm_light_secondary_control'] .wp-picker-input-wrap,
1201
+ [id='customize-control-sm_light_secondary_control'] .wp-picker-holder,
1202
+ [id='customize-control-sm_color_tertiary_control'] .wp-picker-input-wrap,
1203
+ [id='customize-control-sm_color_tertiary_control'] .wp-picker-holder,
1204
+ [id='customize-control-sm_dark_tertiary_control'] .wp-picker-input-wrap,
1205
+ [id='customize-control-sm_dark_tertiary_control'] .wp-picker-holder,
1206
+ [id='customize-control-sm_light_tertiary_control'] .wp-picker-input-wrap,
1207
+ [id='customize-control-sm_light_tertiary_control'] .wp-picker-holder
1208
+ {
1209
+ visibility: visible;
1210
+ }[id='customize-control-sm_color_primary_control'] .wp-picker-container,
1211
+ [id='customize-control-sm_dark_primary_control'] .wp-picker-container,
1212
+ [id='customize-control-sm_light_primary_control'] .wp-picker-container,
1213
+ [id='customize-control-sm_color_secondary_control'] .wp-picker-container,
1214
+ [id='customize-control-sm_dark_secondary_control'] .wp-picker-container,
1215
+ [id='customize-control-sm_light_secondary_control'] .wp-picker-container,
1216
+ [id='customize-control-sm_color_tertiary_control'] .wp-picker-container,
1217
+ [id='customize-control-sm_dark_tertiary_control'] .wp-picker-container,
1218
+ [id='customize-control-sm_light_tertiary_control'] .wp-picker-container
1219
+ {float: left;
1220
+
1221
  width: 100%;
1222
+ }[id='customize-control-sm_color_primary_control'] .wp-picker-container button:before,
1223
+ [id='customize-control-sm_dark_primary_control'] .wp-picker-container button:before,
1224
+ [id='customize-control-sm_light_primary_control'] .wp-picker-container button:before,
1225
+ [id='customize-control-sm_color_secondary_control'] .wp-picker-container button:before,
1226
+ [id='customize-control-sm_dark_secondary_control'] .wp-picker-container button:before,
1227
+ [id='customize-control-sm_light_secondary_control'] .wp-picker-container button:before,
1228
+ [id='customize-control-sm_color_tertiary_control'] .wp-picker-container button:before,
1229
+ [id='customize-control-sm_dark_tertiary_control'] .wp-picker-container button:before,
1230
+ [id='customize-control-sm_light_tertiary_control'] .wp-picker-container button:before
1231
+ {position: relative;display: block;visibility: visible;width: 90px;height: 90px;
1232
+
1233
+ content: '';border: 3px solid #ddd;border-radius: 50%;background-color: inherit;
1234
+ }#customize-control-sm_color_palette_control ~ [id*='sm_color_secondary'] .wp-picker-container button:before
1235
+ {
1236
+ top: -54px;right: -70px;
1237
+ }#customize-control-sm_color_palette_control ~ [id*='sm_color_tertiary'] .wp-picker-container button:before
1238
+ {
1239
+ top: -108px;right: -140px;
1240
+ }#customize-control-sm_color_palette_control ~ [id*='sm_dark_primary'] .wp-picker-container button:before
1241
+ {
1242
+ top: -54px;
1243
+ }#customize-control-sm_color_palette_control ~ [id*='sm_dark_secondary'] .wp-picker-container button:before
1244
+ {
1245
+ top: -108px;right: -70px;
1246
+ }#customize-control-sm_color_palette_control ~ [id*='sm_dark_tertiary'] .wp-picker-container button:before
1247
+ {
1248
+ top: -162px;right: -140px;
1249
+ }#customize-control-sm_color_palette_control ~ [id*='sm_light_primary'] .wp-picker-container button:before
1250
+ {
1251
+ top: -108px;
1252
+ }#customize-control-sm_color_palette_control ~ [id*='sm_light_secondary'] .wp-picker-container button:before
1253
+ {
1254
+ top: -162px;right: -70px;
1255
+ }#customize-control-sm_color_palette_control ~ [id*='sm_light_tertiary'] .wp-picker-container button:before
1256
+ {
1257
+ top: -216px;right: -140px;
1258
+ }.c-palette
1259
+ {
1260
+ position: relative;
1261
+ }.c-palette .c-palette__label
1262
+ {
1263
+ -ms-flex-positive: 1;flex-grow: 1;
1264
+ }.c-palette:after
1265
+ {
1266
+ height: 64px;border-radius: 5px;
1267
+ }.c-palette:after
1268
+ {position: absolute;top: 0;right: 0;left: 0;display: block;
1269
+
1270
+ content: '';pointer-events: none;box-shadow: inset 0 0 3px 0 rgba(0,0,0,.15),inset 0 1px 3px 0 rgba(0,0,0,.15);
1271
+ }.label__inner
1272
+ {z-index: 2;padding: 7px 12px 7px 7px;
1273
+
1274
+ color: #000;border-radius: 3px;background: #f5f6f1;box-shadow: 0 2px 5px rgba(0,0,0,.15);
1275
+ }.c-palette__label
1276
+ {
1277
+ display: -ms-flexbox ;display: flex;height: 40px;padding: 12px;color: black;background: white;-ms-flex-align: center;align-items: center;
1278
+ }.colors
1279
+ {
1280
+ position: relative;display: -ms-flexbox;display: flex;width: 100%;-ms-flex-align: stretch;align-items: stretch;
1281
+ }.color
1282
+ {
1283
+ display: -ms-flexbox ;display: flex;overflow: hidden;flex-direction: column;-ms-flex-direction: column;-ms-flex-positive: 1;flex-grow: 1;
1284
+ }.fill
1285
+ {
1286
+ position: relative;height: 64px;
1287
+ }.c-palette__overlay
1288
+ {
1289
+ position: absolute;top: 0;right: 0;left: 0;display: -ms-flexbox;display: flex;height: 64px;-ms-flex-align: center;align-items: center;
1290
+ }.fill:before
1291
+ {
1292
+ position: absolute;top: 0;right: 0;bottom: 0;left: 0;
1293
+ }.fill:before
1294
+ {
1295
+ content: '';background: currentColor;
1296
+ }.picker
1297
+ {
1298
+ position: relative;top: 0;left: 50%;width: 80%;max-width: 3em;margin-top: 1em;-webkit-transform: translateX(-50%);transform: translateX(-50%);border-radius: 50%;
1299
+ }.colors.next .picker > i
1300
+ {position: absolute;z-index: 20;top: 0;right: 0;bottom: 0;left: 0;
1301
+
1302
+ display: block;pointer-events: none;border-radius: 50%;box-shadow: inset 0 0 3px 0 rgba(0,0,0,.15),inset 0 1px 3px 0 rgba(0,0,0,.15);
1303
+ }.picker:before,
1304
+ .picker:after
1305
+ {display: block;
1306
+
1307
+ content: '';border-radius: 50%;background: currentColor;
1308
+ }.picker:before
1309
+ {
1310
+ padding-top: 100%;
1311
+ }.picker:after
1312
+ {
1313
+ position: absolute;top: 0;left: 0;width: 100%;height: 100%;
1314
+ }.fill
1315
+ {
1316
+ overflow: hidden;
1317
+ }.color:first-child .fill
1318
+ {
1319
+ border-top-left-radius: 5px;border-bottom-left-radius: 5px;
1320
+ }.color:last-child .fill
1321
+ {
1322
+ border-top-right-radius: 5px;border-bottom-right-radius: 5px;
1323
+ }.colors.next
1324
+ {
1325
+ position: absolute;top: 0;left: 0;
1326
+ }.colors.next .fill:before
1327
+ {
1328
+ -webkit-transform: translateY(-100%) ;transform: translateY(-100%);
1329
+ }.colors.next .picker:before
1330
+ {
1331
+ -webkit-transform: translateY(-100%) ;transform: translateY(-100%);opacity: 0;
1332
+ }.colors.next .picker:after
1333
+ {
1334
+ opacity: 0;
1335
+ }.c-palette.animate .next .fill:before
1336
+ {
1337
+ -webkit-animation: fill 1s cubic-bezier(.215, .61, .355, 1) forwards ;animation: fill 1s cubic-bezier(.215, .61, .355, 1) forwards;
1338
+ }.c-palette.animate .next .picker
1339
+ {
1340
+ -webkit-animation: picker-filter 1s cubic-bezier(.215, .61, .355, 1) forwards ;animation: picker-filter 1s cubic-bezier(.215, .61, .355, 1) forwards;
1341
+ }.c-palette.animate .next .picker:before
1342
+ {
1343
+ -webkit-animation: fill-picker-before 1s cubic-bezier(.215, .61, .355, 1) forwards ;animation: fill-picker-before 1s cubic-bezier(.215, .61, .355, 1) forwards;
1344
+ }.c-palette.animate .next .picker:after
1345
+ {
1346
+ -webkit-animation: fill-picker-after 1s cubic-bezier(.215, .61, .355, 1) forwards ;animation: fill-picker-after 1s cubic-bezier(.215, .61, .355, 1) forwards;
1347
+ }.c-palette.animate .current .fill,
1348
+ .c-palette.animate .current .picker
1349
+ {
1350
+ -webkit-animation: fade-out 1s forwards ;animation: fade-out 1s forwards;
1351
+ }.c-palette.animate .color:nth-child(1) .fill,
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1352
  .c-palette.animate .color:nth-child(1) .fill:before,
1353
  .c-palette.animate .color:nth-child(1) .picker,
1354
  .c-palette.animate .color:nth-child(1) .picker:after,
1355
+ .c-palette.animate .color:nth-child(1) .picker:before
1356
+ {
1357
+ -webkit-animation-delay: .4s ;animation-delay: .4s;
1358
+ }.c-palette.animate .color:nth-child(2) .fill,
 
1359
  .c-palette.animate .color:nth-child(2) .fill:before,
1360
  .c-palette.animate .color:nth-child(2) .picker,
1361
  .c-palette.animate .color:nth-child(2) .picker:after,
1362
+ .c-palette.animate .color:nth-child(2) .picker:before
1363
+ {
1364
+ -webkit-animation-delay: .2s ;animation-delay: .2s;
1365
+ }.c-palette.animate .color:nth-child(3) .fill,
 
1366
  .c-palette.animate .color:nth-child(3) .fill:before,
1367
  .c-palette.animate .color:nth-child(3) .picker,
1368
  .c-palette.animate .color:nth-child(3) .picker:after,
1369
+ .c-palette.animate .color:nth-child(3) .picker:before
1370
+ {
1371
+ -webkit-animation-delay: .45s ;animation-delay: .45s;
1372
+ }.c-palette.animate .color:nth-child(4) .fill,
 
1373
  .c-palette.animate .color:nth-child(4) .fill:before,
1374
  .c-palette.animate .color:nth-child(4) .picker,
1375
  .c-palette.animate .color:nth-child(4) .picker:after,
1376
+ .c-palette.animate .color:nth-child(4) .picker:before
1377
+ {
1378
+ -webkit-animation-delay: .1s ;animation-delay: .1s;
1379
+ }.c-palette.animate .color:nth-child(5) .fill,
 
1380
  .c-palette.animate .color:nth-child(5) .fill:before,
1381
  .c-palette.animate .color:nth-child(5) .picker,
1382
  .c-palette.animate .color:nth-child(5) .picker:after,
1383
+ .c-palette.animate .color:nth-child(5) .picker:before
1384
+ {
1385
+ -webkit-animation-delay: .3s ;animation-delay: .3s;
1386
+ }.c-palette.animate .color:nth-child(6) .fill,
 
1387
  .c-palette.animate .color:nth-child(6) .fill:before,
1388
  .c-palette.animate .color:nth-child(6) .picker,
1389
  .c-palette.animate .color:nth-child(6) .picker:after,
1390
+ .c-palette.animate .color:nth-child(6) .picker:before
1391
+ {
1392
+ -webkit-animation-delay: .05s ;animation-delay: .05s;
1393
+ }.c-palette.animate .color:nth-child(7) .fill,
 
1394
  .c-palette.animate .color:nth-child(7) .fill:before,
1395
  .c-palette.animate .color:nth-child(7) .picker,
1396
  .c-palette.animate .color:nth-child(7) .picker:after,
1397
+ .c-palette.animate .color:nth-child(7) .picker:before
1398
+ {
1399
+ -webkit-animation-delay: .35s ;animation-delay: .35s;
1400
+ }.c-palette.animate .color:nth-child(8) .fill,
 
1401
  .c-palette.animate .color:nth-child(8) .fill:before,
1402
  .c-palette.animate .color:nth-child(8) .picker,
1403
  .c-palette.animate .color:nth-child(8) .picker:after,
1404
+ .c-palette.animate .color:nth-child(8) .picker:before
1405
+ {
1406
+ -webkit-animation-delay: .15s ;animation-delay: .15s;
1407
+ }.c-palette.animate .color:nth-child(9) .fill,
 
1408
  .c-palette.animate .color:nth-child(9) .fill:before,
1409
  .c-palette.animate .color:nth-child(9) .picker,
1410
  .c-palette.animate .color:nth-child(9) .picker:after,
1411
+ .c-palette.animate .color:nth-child(9) .picker:before
1412
+ {
1413
+ -webkit-animation-delay: .25s ;animation-delay: .25s;
1414
+ }@-webkit-keyframes fill
1415
+ {
1416
+ 30%
1417
+ {
1418
+ -webkit-transform: translateY(0) ;transform: translateY(0);
1419
+ }100%
1420
+ {
1421
+ -webkit-transform: translateY(0) ;transform: translateY(0);
1422
+ }
1423
+ }@keyframes fill
1424
+ {
1425
+ 30%
1426
+ {
1427
+ -webkit-transform: translateY(0) ;transform: translateY(0);
1428
+ }100%
1429
+ {
1430
+ -webkit-transform: translateY(0) ;transform: translateY(0);
1431
+ }
1432
+ }@-webkit-keyframes picker-filter
1433
+ {
1434
+ 0%
1435
+ {
1436
+ -webkit-filter: none ;filter: none;
1437
+ }1%
1438
+ {
1439
+ -webkit-filter: url('#goo') ;filter: url('#goo');
1440
+ }99%
1441
+ {
1442
+ -webkit-filter: url('#goo') ;filter: url('#goo');
1443
+ }100%
1444
+ {
1445
+ -webkit-filter: none ;filter: none;
1446
+ }
1447
+ }@keyframes picker-filter
1448
+ {
1449
+ 0%
1450
+ {
1451
+ -webkit-filter: none ;filter: none;
1452
+ }1%
1453
+ {
1454
+ -webkit-filter: url('#goo') ;filter: url('#goo');
1455
+ }99%
1456
+ {
1457
+ -webkit-filter: url('#goo') ;filter: url('#goo');
1458
+ }100%
1459
+ {
1460
+ -webkit-filter: none ;filter: none;
1461
+ }
1462
+ }@-webkit-keyframes fill-picker-before
1463
+ {
1464
+ 24%
1465
+ {-webkit-transform: translateY(-130%) ;transform: translateY(-130%);
1466
+
1467
+ opacity: 0;
1468
+ }25%
1469
+ {-webkit-transform: translateY(-130%) ;transform: translateY(-130%);
1470
+
1471
+ opacity: 1;
1472
+ }32%
1473
+ {-webkit-transform: translateY(-130%) ;transform: translateY(-130%);
1474
+
1475
+ opacity: 1;
1476
+ }52%
1477
+ {-webkit-transform: translateY(-130%) ;transform: translateY(-130%);
1478
+
1479
+ opacity: 1;
1480
+ }100%
1481
+ {-webkit-transform: translateY(-160%) ;transform: translateY(-160%);
1482
+
1483
+ opacity: 1;
1484
+ }
1485
+ }@keyframes fill-picker-before
1486
+ {
1487
+ 24%
1488
+ {-webkit-transform: translateY(-130%) ;transform: translateY(-130%);
1489
+
1490
+ opacity: 0;
1491
+ }25%
1492
+ {-webkit-transform: translateY(-130%) ;transform: translateY(-130%);
1493
+
1494
+ opacity: 1;
1495
+ }32%
1496
+ {-webkit-transform: translateY(-130%) ;transform: translateY(-130%);
1497
+
1498
+ opacity: 1;
1499
+ }52%
1500
+ {-webkit-transform: translateY(-130%) ;transform: translateY(-130%);
1501
+
1502
+ opacity: 1;
1503
+ }100%
1504
+ {-webkit-transform: translateY(-160%) ;transform: translateY(-160%);
1505
+
1506
+ opacity: 1;
1507
+ }
1508
+ }@-webkit-keyframes fill-picker-after
1509
+ {
1510
+ 24%
1511
+ {-webkit-transform: translateY(-160%) ;transform: translateY(-160%);
1512
+
1513
+ opacity: 0;
1514
+ }25%
1515
+ {-webkit-transform: translateY(-160%) ;transform: translateY(-160%);
1516
+
1517
+ opacity: 1;
1518
+ }32%
1519
+ {-webkit-transform: translateY(-120%) ;transform: translateY(-120%);
1520
+
1521
+ opacity: 1;
1522
+ }100%
1523
+ {-webkit-transform: translateY(0) ;transform: translateY(0);
1524
+
1525
+ opacity: 1;
1526
+ }
1527
+ }@keyframes fill-picker-after
1528
+ {
1529
+ 24%
1530
+ {-webkit-transform: translateY(-160%) ;transform: translateY(-160%);
1531
+
1532
+ opacity: 0;
1533
+ }25%
1534
+ {-webkit-transform: translateY(-160%) ;transform: translateY(-160%);
1535
+
1536
+ opacity: 1;
1537
+ }32%
1538
+ {-webkit-transform: translateY(-120%) ;transform: translateY(-120%);
1539
+
1540
+ opacity: 1;
1541
+ }100%
1542
+ {-webkit-transform: translateY(0) ;transform: translateY(0);
1543
+
1544
+ opacity: 1;
1545
+ }
1546
+ }@-webkit-keyframes fade-out
1547
+ {
1548
+ 90%
1549
+ {
1550
+ opacity: 1;
1551
+ }100%
1552
+ {
1553
+ opacity: 0;
1554
+ }
1555
+ }@keyframes fade-out
1556
+ {
1557
+ 90%
1558
+ {
1559
+ opacity: 1;
1560
+ }100%
1561
+ {
1562
+ opacity: 0;
1563
+ }
1564
+ }.label
1565
+ {
1566
+ margin-right: auto;
1567
+ }.c-palette__blur
1568
+ {
1569
+ display: none;
1570
+ }#customize-theme-controls [id*='sm_current_color_palette_control']
1571
+ {
1572
+ display: block;width: auto;margin: -12px -12px 19px;
1573
+ }#customize-theme-controls [id*='sm_current_color_palette_control'] .palette-container
1574
+ {
1575
+ padding: 19px;background: white;
1576
+ }.c-palette__name
1577
+ {
1578
+ margin-right: auto;
1579
+ }.c-palette__control
1580
+ {display: -ms-flexbox;display: flex;
1581
+
1582
+ width: 2em;height: 2em;margin-left: .25em;border-radius: 50%;-ms-flex-pack: center;justify-content: center;-ms-flex-align: center;align-items: center;
1583
+ }.c-palette__control,
1584
+ .c-palette__control span
1585
+ {
1586
+ transition: color .3s ease-in-out;
1587
+ }.c-palette__control span
1588
+ {-webkit-transform: scale(.8) ;transform: scale(.8);
1589
+
1590
+ color: rgba(0,0,0,.25);
1591
+ }.c-palette__control.active
1592
+ {
1593
+ background: currentColor;
1594
+ }.c-palette__control.active span
1595
+ {
1596
+ color: white;
1597
+ }#sub-accordion-section-style_manager_section
1598
+ {
1599
+ display: -ms-flexbox !important ;display: flex !important;overflow: hidden;flex-direction: column;padding: 12px 0 0 !important;-ms-flex-direction: column;
1600
+ }#sub-accordion-section-style_manager_section > *
1601
+ {
1602
+ display: block !important;padding: 0 12px;-ms-flex-positive: 0;flex-grow: 0;
1603
+ }#sub-accordion-section-style_manager_section #customize-control-sm_color_palette_control
1604
+ {overflow-y: scroll;margin-top: -19px;margin-bottom: 0;padding-top: 19px;
1605
+
1606
+ -ms-flex-preferred-size: 0;flex-basis: 0;-ms-flex-positive: 1;flex-grow: 1;
1607
+ }#sub-accordion-section-style_manager_section:not(.advanced) #customize-control-sm_color_palette_control ~ li:not([id='customize-control-sm_toggle_advanced_settings_control'])
1608
+ {
1609
+ display: none !important;
1610
+ }#sub-accordion-section-style_manager_section.advanced #customize-control-sm_color_palette_control
1611
+ {
1612
+ display: none !important;
1613
+ }.c-palette .iris-picker
1614
+ {
1615
+ position: absolute;z-index: 100;top: 100%;left: 0;margin-top: 1em;border: 0;box-shadow: black 0 3px 12px -4px;
1616
+ }.c-palette .iris-picker .iris-square-handle
1617
+ {top: -6px;left: -6px;
1618
+
1619
+ border-color: transparent;
1620
+ }.c-palette .iris-picker .iris-square-handle:after
1621
+ {
1622
+ position: absolute;top: 0;right: 0;bottom: 0;left: 0;border: 2px solid white;
1623
+ }.c-palette .iris-picker .iris-square-value
1624
+ {
1625
+ box-shadow: none !important;
1626
+ }.color .picker
1627
+ {cursor: pointer;
1628
+ transition: opacity .3s ease-in-out;
1629
+ }.color.inactive .picker
1630
+ {
1631
+ opacity: .2;
1632
+ }.color.inactive .picker:hover
1633
+ {
1634
  opacity: 1;
1635
+ }.c-palette__tooltip
1636
+ {
1637
+ position: absolute;z-index: 300;bottom: 100%;left: 50%;margin-bottom: 5px;padding: 4px 14px;transition: opacity .2s ease-out;-webkit-transform: translateX(-50%);transform: translateX(-50%);opacity: 0;color: white;background-color: #606a72;box-shadow: 0 2px 5px 0 rgba(0,0,0,.15);
1638
+ }.c-palette__tooltip:after
1639
+ {position: absolute;top: 100%;left: 50%;display: block;
1640
+
1641
+ content: '';-webkit-transform: translateX(-50%);transform: translateX(-50%);border: 5px solid transparent;border-top-color: #606a72;border-bottom-width: 0;
1642
+ }.c-palette__control:hover .c-palette__tooltip
1643
+ {
1644
  opacity: 1;
1645
+ }.c-palette__control
1646
+ {
1647
+ position: relative;cursor: pointer;
1648
+ }#customize-control-sm_toggle_advanced_settings_control
1649
+ {
1650
+ margin-bottom: 0;opacity: 0;
1651
+ }#customize-control-sm_toggle_advanced_settings_control button
1652
+ {
1653
+ width: 100%;
1654
+ }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
customify.php CHANGED
@@ -3,7 +3,7 @@
3
  Plugin Name: Customify
4
  Plugin URI: https://wordpress.org/plugins/customify/
5
  Description: A Theme Customizer Booster
6
- Version: 1.6.5
7
  Author: Pixelgrade
8
  Author URI: https://pixelgrade.com
9
  Author Email: contact@pixelgrade.com
@@ -58,7 +58,7 @@ function PixCustomifyPlugin() {
58
  */
59
  require_once( plugin_dir_path( __FILE__ ) . 'class-pixcustomify.php' );
60
 
61
- $instance = PixCustomifyPlugin::instance( __FILE__, '1.6.5' );
62
 
63
  return $instance;
64
  }
3
  Plugin Name: Customify
4
  Plugin URI: https://wordpress.org/plugins/customify/
5
  Description: A Theme Customizer Booster
6
+ Version: 1.7.0
7
  Author: Pixelgrade
8
  Author URI: https://pixelgrade.com
9
  Author Email: contact@pixelgrade.com
58
  */
59
  require_once( plugin_dir_path( __FILE__ ) . 'class-pixcustomify.php' );
60
 
61
+ $instance = PixCustomifyPlugin::instance( __FILE__, '1.7.0' );
62
 
63
  return $instance;
64
  }
includes/class-customify-style-manager.php ADDED
@@ -0,0 +1,1012 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+
3
+ class Customify_Style_Manager {
4
+
5
+ /**
6
+ * Holds the only instance of this class.
7
+ * @var null|Customify_Style_Manager
8
+ * @access protected
9
+ * @since 1.7.0
10
+ */
11
+ protected static $_instance = null;
12
+
13
+ /**
14
+ * The main plugin object (the parent).
15
+ * @var PixCustomifyPlugin
16
+ * @access public
17
+ * @since 1.7.0
18
+ */
19
+ public $parent = null;
20
+
21
+ /**
22
+ * External REST API endpoints used for communicating with the Pixelgrade Cloud.
23
+ * @var array
24
+ * @access public
25
+ * @since 1.7.0
26
+ */
27
+ public static $externalApiEndpoints;
28
+
29
+ /**
30
+ * The current design assets config.
31
+ * @var array
32
+ * @access public
33
+ * @since 1.7.0
34
+ */
35
+ public $design_assets = null;
36
+
37
+ /**
38
+ * Constructor.
39
+ *
40
+ * @since 1.7.0
41
+ *
42
+ * @param $parent
43
+ */
44
+ protected function __construct( $parent = null ) {
45
+ $this->parent = $parent;
46
+
47
+ // Make sure our constants are in place, if not already defined.
48
+ defined( 'PIXELGRADE_CLOUD__API_BASE' ) || define( 'PIXELGRADE_CLOUD__API_BASE', 'https://cloud.pixelgrade.com/' );
49
+
50
+ // Save the external API endpoints in a easy to get property.
51
+ self::$externalApiEndpoints = apply_filters( 'customify_style_manager_external_api_endpoints', array(
52
+ 'cloud' => array(
53
+ 'getDesignAssets' => array(
54
+ 'method' => 'GET',
55
+ 'url' => PIXELGRADE_CLOUD__API_BASE . 'wp-json/pixcloud/v1/front/design_assets',
56
+ ),
57
+ 'stats' => array(
58
+ 'method' => 'POST',
59
+ 'url' => PIXELGRADE_CLOUD__API_BASE . 'wp-json/pixcloud/v1/front/stats',
60
+ ),
61
+ ),
62
+ ) );
63
+
64
+ // Hook up.
65
+ $this->add_hooks();
66
+ }
67
+
68
+ /**
69
+ * Initiate our hooks
70
+ *
71
+ * @since 1.7.0
72
+ */
73
+ public function add_hooks() {
74
+ // Handle the Customizer Style Manager config.
75
+ add_filter( 'customify_filter_fields', array( $this, 'style_manager_section_config' ), 12, 1 );
76
+ add_filter( 'customify_filter_fields', array( $this, 'add_current_color_palette_control' ), 20, 1 );
77
+
78
+ // Handle the logic on settings update/save.
79
+ add_action( 'customize_save_after', array( $this, 'update_custom_palette_in_use' ), 10, 1 );
80
+
81
+ // Handle the logic for user feedback.
82
+ add_action( 'customize_controls_print_footer_scripts', array( $this, 'output_user_feedback_modal' ) );
83
+ add_action( 'wp_ajax_customify_style_manager_user_feedback', array( $this, 'user_feedback_callback' ) );
84
+
85
+ // Scripts enqueued in the Customizer
86
+ add_action( 'customize_controls_init', array( $this, 'register_admin_customizer_scripts' ), 10 );
87
+ add_action( 'customize_controls_enqueue_scripts', array( $this, 'enqueue_admin_customizer_scripts' ), 10 );
88
+ }
89
+
90
+ /**
91
+ * Register Customizer admin scripts
92
+ */
93
+ function register_admin_customizer_scripts() {
94
+ wp_register_script( $this->parent->get_slug() . '-swap-values', plugins_url( 'js/customizer/customify-swap-values.js', $this->parent->file ), array( 'jquery' ), $this->parent->get_version() );
95
+ wp_register_script( $this->parent->get_slug() . '-palette-variations', plugins_url( 'js/customizer/customify-palette-variations.js', $this->parent->file ), array( 'jquery' ), $this->parent->get_version() );
96
+ wp_register_script( $this->parent->get_slug() . '-palettes', plugins_url( 'js/customizer/customify-palettes.js', $this->parent->file ), array( 'jquery', $this->parent->get_slug() . '-palette-variations', $this->parent->get_slug() . '-swap-values' ), $this->parent->get_version() );
97
+ }
98
+
99
+ /**
100
+ * Enqueue Customizer admin scripts
101
+ */
102
+ function enqueue_admin_customizer_scripts() {
103
+ // If there is no style manager support, bail early.
104
+ if ( ! $this->is_supported() ) {
105
+ return;
106
+ }
107
+
108
+ wp_enqueue_script( $this->parent->get_slug() . '-palettes' );
109
+ }
110
+
111
+ /**
112
+ * Determine if Style Manager is supported.
113
+ *
114
+ * @since 1.7.0
115
+ *
116
+ * @return bool
117
+ */
118
+ public function is_supported() {
119
+ $has_support = (bool) current_theme_supports( 'customizer_style_manager' );
120
+
121
+ return apply_filters( 'customify_style_manager_is_supported', $has_support );
122
+ }
123
+
124
+ /**
125
+ * Setup the Style Manager Customizer section config.
126
+ *
127
+ * @since 1.7.0
128
+ *
129
+ * @param array $config This holds required keys for the plugin config like 'opt-name', 'panels', 'settings'
130
+ * @return array
131
+ */
132
+ public function style_manager_section_config( $config ) {
133
+ // If there is no style manager support, bail early.
134
+ if ( ! $this->is_supported() ) {
135
+ return $config;
136
+ }
137
+
138
+ if ( ! isset( $config['sections']['style_manager_section'] ) ) {
139
+ $config['sections']['style_manager_section'] = array();
140
+ }
141
+
142
+ // The section might be already defined, thus we merge, not replace the entire section config.
143
+ $config['sections']['style_manager_section'] = array_replace_recursive( $config['sections']['style_manager_section'], array(
144
+ 'title' => esc_html__( 'Style Manager', 'customify' ),
145
+ 'section_id' => 'style_manager_section', // We will force this section id preventing prefixing and other regular processing.
146
+ 'options' => array(
147
+ 'sm_color_palette' => array(
148
+ 'type' => 'preset',
149
+ // We will bypass the plugin setting regarding where to store - we will store it cross-theme in wp_options
150
+ 'setting_type' => 'option',
151
+ // We will force this setting id preventing prefixing and other regular processing.
152
+ 'setting_id' => 'sm_color_palette',
153
+ // We don't want to refresh the preview window, even though we have no direct effect on it through this field.
154
+ 'live' => true,
155
+ 'label' => esc_html__( 'Select a color palette:', 'customify' ),
156
+ 'desc' => esc_html__( 'Conveniently change the design of your site with color palettes. Easy as pie.', 'customify' ),
157
+ 'default' => 'lilac',
158
+ 'choices_type' => 'color_palette',
159
+ 'choices' => $this->get_color_palettes(),
160
+ ),
161
+ 'sm_color_palette_variation' => array(
162
+ 'type' => 'radio',
163
+ 'setting_type' => 'option',
164
+ 'setting_id' => 'sm_color_palette_variation',
165
+ 'label' => esc_html__( 'Palette Variation', 'customify' ),
166
+ 'default' => 'light',
167
+ 'live' => true,
168
+ 'choices' => array(
169
+ 'light' => esc_html__( 'light', 'customify' ),
170
+ 'light_alt' => esc_html__( 'light_alt', 'customify' ),
171
+
172
+ 'dark' => esc_html__( 'dark', 'customify' ),
173
+ 'dark_alt' => esc_html__( 'dark_alt', 'customify' ),
174
+
175
+ 'colorful' => esc_html__( 'colorful', 'customify' ),
176
+ 'colorful_alt' => esc_html__( 'colorful_alt', 'customify' ),
177
+ ),
178
+ ),
179
+ 'sm_color_primary' => array(
180
+ 'type' => 'color',
181
+ // We will bypass the plugin setting regarding where to store - we will store it cross-theme in wp_options
182
+ 'setting_type' => 'option',
183
+ // We will force this setting id preventing prefixing and other regular processing.
184
+ 'setting_id' => 'sm_color_primary',
185
+ // We don't want to refresh the preview window, even though we have no direct effect on it through this field.
186
+ 'live' => true,
187
+ 'label' => esc_html__( 'Color Primary', 'customify' ),
188
+ 'default' => '#ffeb00',
189
+ 'connected_fields' => array(),
190
+ ),
191
+ 'sm_color_secondary' => array(
192
+ 'type' => 'color',
193
+ 'setting_type' => 'option',
194
+ 'setting_id' => 'sm_color_secondary',
195
+ 'live' => true,
196
+ 'label' => esc_html__( 'Color Secondary', 'customify' ),
197
+ 'default' => '#00ecff',
198
+ 'connected_fields' => array(),
199
+ ),
200
+ 'sm_color_tertiary' => array(
201
+ 'type' => 'color',
202
+ 'setting_type' => 'option',
203
+ 'setting_id' => 'sm_color_tertiary',
204
+ 'live' => true,
205
+ 'label' => esc_html__( 'Color Tertiary', 'customify' ),
206
+ 'default' => '#00ecff',
207
+ 'connected_fields' => array(),
208
+ ),
209
+ 'sm_dark_primary' => array(
210
+ 'type' => 'color',
211
+ 'setting_type' => 'option',
212
+ 'setting_id' => 'sm_dark_primary',
213
+ 'live' => true,
214
+ 'label' => esc_html__( 'Dark Primary', 'customify' ),
215
+ 'default' => '#171617',
216
+ 'connected_fields' => array(),
217
+ ),
218
+ 'sm_dark_secondary' => array(
219
+ 'type' => 'color',
220
+ 'setting_type' => 'option',
221
+ 'setting_id' => 'sm_dark_secondary',
222
+ 'live' => true,
223
+ 'label' => esc_html__( 'Dark Secondary', 'customify' ),
224
+ 'default' => '#383c50',
225
+ 'connected_fields' => array(),
226
+ ),
227
+ 'sm_dark_tertiary' => array(
228
+ 'type' => 'color',
229
+ 'setting_type' => 'option',
230
+ 'setting_id' => 'sm_dark_tertiary',
231
+ 'live' => true,
232
+ 'label' => esc_html__( 'Dark Tertiary', 'customify' ),
233
+ 'default' => '#65726F',
234
+ 'connected_fields' => array(),
235
+ ),
236
+ 'sm_light_primary' => array(
237
+ 'type' => 'color',
238
+ 'setting_type' => 'option',
239
+ 'setting_id' => 'sm_light_primary',
240
+ 'live' => true,
241
+ 'label' => esc_html__( 'Light Primary', 'customify' ),
242
+ 'default' => '#ffffff',
243
+ 'connected_fields' => array(),
244
+ ),
245
+ 'sm_light_secondary' => array(
246
+ 'type' => 'color',
247
+ 'setting_type' => 'option',
248
+ 'setting_id' => 'sm_light_secondary',
249
+ 'live' => true,
250
+ 'label' => esc_html__( 'Light Secondary', 'customify' ),
251
+ 'default' => '#ffffff',
252
+ 'connected_fields' => array(),
253
+ ),
254
+ 'sm_light_tertiary' => array(
255
+ 'type' => 'color',
256
+ 'setting_type' => 'option',
257
+ 'setting_id' => 'sm_light_tertiary',
258
+ 'live' => true,
259
+ 'label' => esc_html__( 'Light Tertiary', 'customify' ),
260
+ 'default' => '#ffffff',
261
+ 'connected_fields' => array(),
262
+ ),
263
+ 'sm_swap_colors' => array(
264
+ 'type' => 'button',
265
+ 'setting_type' => 'option',
266
+ 'setting_id' => 'sm_swap_colors',
267
+ 'label' => esc_html__( 'Swap Colors', 'customify' ),
268
+ 'action' => 'sm_swap_colors',
269
+ ),
270
+ 'sm_swap_dark_light' => array(
271
+ 'type' => 'button',
272
+ 'setting_type' => 'option',
273
+ 'setting_id' => 'sm_swap_dark_light',
274
+ 'label' => esc_html__( 'Swap Dark ⇆ Light', 'customify' ),
275
+ 'action' => 'sm_swap_dark_light',
276
+ ),
277
+ 'sm_swap_colors_dark' => array(
278
+ 'type' => 'button',
279
+ 'setting_type' => 'option',
280
+ 'setting_id' => 'sm_swap_colors_dark',
281
+ 'label' => esc_html__( 'Swap Colors ⇆ Dark', 'customify' ),
282
+ 'action' => 'sm_swap_colors_dark',
283
+ ),
284
+ 'sm_swap_secondary_colors_dark' => array(
285
+ 'type' => 'button',
286
+ 'setting_type' => 'option',
287
+ 'setting_id' => 'sm_swap_secondary_colors_dark',
288
+ 'label' => esc_html__( 'Swap Secondary Color ⇆ Secondary Dark', 'customify' ),
289
+ 'action' => 'sm_swap_secondary_colors_dark',
290
+ ),
291
+ 'sm_advanced_toggle' => array(
292
+ 'type' => 'button',
293
+ 'setting_type' => 'option',
294
+ 'setting_id' => 'sm_toggle_advanced_settings',
295
+ 'label' => esc_html__( 'Toggle Advanced Settings', 'customify' ),
296
+ 'action' => 'sm_toggle_advanced_settings',
297
+ ),
298
+ ),
299
+ ) );
300
+
301
+ return $config;
302
+ }
303
+
304
+ /**
305
+ * Add the current color palette control to the Style Manager section.
306
+ *
307
+ * @since 1.7.0
308
+ *
309
+ * @param array $config
310
+ * @return array
311
+ */
312
+ public function add_current_color_palette_control( $config ) {
313
+ // If there is no style manager support, bail early.
314
+ if ( ! $this->is_supported() ) {
315
+ return $config;
316
+ }
317
+
318
+ if ( ! isset( $config['sections']['style_manager_section'] ) ) {
319
+ $config['sections']['style_manager_section'] = array();
320
+ }
321
+
322
+ $current_palette = '';
323
+ $current_palette_sets = array( 'current', 'next' );
324
+
325
+ $master_color_controls_ids = $this->get_all_master_color_controls_ids( $config['sections']['style_manager_section']['options'] );
326
+
327
+ foreach ( $current_palette_sets as $set ) {
328
+ $current_palette .= '<div class="colors ' . $set . '">';
329
+ foreach ( $master_color_controls_ids as $setting_id ) {
330
+ if ( ! empty( $config['sections']['style_manager_section']['options'][ $setting_id ]['connected_fields'] ) ) {
331
+ $current_palette .=
332
+ '<div class="color ' . $setting_id . '" data-setting="' . $setting_id . '">' . PHP_EOL .
333
+ '<div class="fill"></div>' . PHP_EOL .
334
+ '<div class="picker"><i></i></div>' . PHP_EOL .
335
+ '</div>' . PHP_EOL;
336
+ }
337
+ }
338
+ $current_palette .= '</div>';
339
+ }
340
+
341
+ // The section might be already defined, thus we merge, not replace the entire section config.
342
+ $config['sections']['style_manager_section']['options'] = array(
343
+ 'sm_current_color_palette' => array(
344
+ 'type' => 'html',
345
+ 'html' =>
346
+ '<div class="palette-container">' . PHP_EOL .
347
+ '<span class="customize-control-title">Current Color Palette:</span>' . PHP_EOL .
348
+ '<span class="description customize-control-description">Choose a color palette to start with. Adjust its style using the variation buttons below.</span>' . PHP_EOL .
349
+ '<div class="c-palette">' . PHP_EOL .
350
+ $current_palette .
351
+ '<div class="c-palette__overlay">' . PHP_EOL .
352
+ '<div class="c-palette__label">' .
353
+ '<div class="c-palette__name">' . 'Original Style' . '</div>' .
354
+ '<div class="c-palette__control variation-light active" data-target="#_customize-input-sm_color_palette_variation_control-radio-light">' .
355
+ '<span class="dashicons dashicons-image-rotate"></span>' .
356
+ '<div class="c-palette__tooltip">Light</div>' .
357
+ '</div>' .
358
+ '<div class="c-palette__control variation-dark" data-target="#_customize-input-sm_color_palette_variation_control-radio-dark">' .
359
+ '<span class="dashicons dashicons-image-filter"></span>'.
360
+ '<div class="c-palette__tooltip">Dark</div>' .
361
+ '</div>' .
362
+ '<div class="c-palette__control variation-colorful" data-target="#_customize-input-sm_color_palette_variation_control-radio-colorful">' .
363
+ '<span class="dashicons dashicons-admin-appearance"></span>' .
364
+ '<div class="c-palette__tooltip">Colorful</div>' .
365
+ '</div>' .
366
+ '</div>' . PHP_EOL .
367
+ '</div>' . PHP_EOL .
368
+ '</div>' . PHP_EOL .
369
+ '</div>' . PHP_EOL .
370
+ '<svg class="c-palette__blur" width="15em" height="15em" viewBox="0 0 15 15" xmlns="http://www.w3.org/2000/svg" version="1.1">' . PHP_EOL .
371
+ '<defs>' . PHP_EOL .
372
+ '<filter id="goo">' . PHP_EOL .
373
+ '<feGaussianBlur in="SourceGraphic" stdDeviation="10" result="blur" />' . PHP_EOL .
374
+ '<feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 50 -20" result="goo" />' . PHP_EOL .
375
+ '<feBlend in="SourceGraphic" in2="goo" />' . PHP_EOL .
376
+ '</filter>' . PHP_EOL .
377
+ '</defs>' . PHP_EOL .
378
+ '</svg>',
379
+ ),
380
+ ) + $config['sections']['style_manager_section']['options'];
381
+
382
+ return $config;
383
+ }
384
+
385
+ /**
386
+ * Get the color palettes configuration.
387
+ * @since 1.7.0
388
+ *
389
+ * @param bool $skip_cache Optional. Whether to use the cached config or fetch a new one.
390
+ * @return array
391
+ */
392
+ protected function get_color_palettes( $skip_cache = false ) {
393
+ // Get the design assets data.
394
+ $design_assets = $this->get_design_assets( $skip_cache );
395
+ if ( false === $design_assets || empty( $design_assets['color_palettes'] ) ) {
396
+ $color_palettes_config = $this->get_default_color_palettes_config();
397
+ } else {
398
+ $color_palettes_config = $design_assets['color_palettes'];
399
+ }
400
+
401
+ return apply_filters( 'customify_get_color_palettes', $color_palettes_config );
402
+ }
403
+
404
+ /**
405
+ * Get the design assets configuration.
406
+ *
407
+ * @since 1.7.0
408
+ *
409
+ * @param bool $skip_cache Optional. Whether to use the cached config or fetch a new one.
410
+ * @return array
411
+ */
412
+ protected function get_design_assets( $skip_cache = false ) {
413
+ if ( ! is_null( $this->design_assets ) ) {
414
+ return $this->design_assets;
415
+ }
416
+
417
+ $this->design_assets = apply_filters( 'customify_style_manager_maybe_fetch_design_assets', $this->maybe_fetch_design_assets( $skip_cache ) );
418
+
419
+ return $this->design_assets;
420
+ }
421
+
422
+ /**
423
+ * Fetch the design assets data from the Pixelgrade Cloud.
424
+ *
425
+ * Caches the data for 12 hours. Use local defaults if not available.
426
+ *
427
+ * @since 1.7.0
428
+ *
429
+ * @param bool $skip_cache Optional. Whether to use the cached data or fetch a new one.
430
+ * @return array|false
431
+ */
432
+ protected function maybe_fetch_design_assets( $skip_cache = false ) {
433
+ // First try and get the cached data
434
+ $data = get_option( $this->_get_design_assets_cache_key() );
435
+
436
+ // For performance reasons, we will ONLY fetch remotely when in the WP ADMIN area or via an ADMIN AJAX call, regardless of settings.
437
+ if ( ! is_admin() ) {
438
+ return $data;
439
+ }
440
+
441
+ // Get the cache data expiration timestamp.
442
+ $expire_timestamp = get_option( $this->_get_design_assets_cache_key() . '_timestamp' );
443
+
444
+ // We don't force skip the cache for AJAX requests for performance reasons.
445
+ if ( ! wp_doing_ajax() && defined('CUSTOMIFY_SM_ALWAYS_FETCH_DESIGN_ASSETS' ) && true === CUSTOMIFY_SM_ALWAYS_FETCH_DESIGN_ASSETS ) {
446
+ $skip_cache = true;
447
+ }
448
+
449
+ // The data isn't set, is expired or we were instructed to skip the cache; we need to fetch fresh data.
450
+ if ( true === $skip_cache || false === $data || false === $expire_timestamp || $expire_timestamp < time() ) {
451
+ $request_data = apply_filters( 'customify_pixelgrade_cloud_request_data', array(
452
+ 'site_url' => home_url('/'),
453
+ // We are only interested in data needed to identify the theme and eventually deliver only design assets suitable for it.
454
+ 'theme_data' => $this->get_active_theme_data(),
455
+ // We are only interested in data needed to identify the plugin version and eventually deliver design assets suitable for it.
456
+ 'site_data' => $this->get_site_data(),
457
+ ), $this );
458
+
459
+ $request_args = array(
460
+ 'method' => self::$externalApiEndpoints['cloud']['getDesignAssets']['method'],
461
+ 'timeout' => 4,
462
+ 'blocking' => true,
463
+ 'body' => $request_data,
464
+ 'sslverify' => false,
465
+ );
466
+ // Get the design assets from the cloud.
467
+ $response = wp_remote_request( self::$externalApiEndpoints['cloud']['getDesignAssets']['url'], $request_args );
468
+ // Bail in case of decode error or failure to retrieve data.
469
+ // We will return the data already available.
470
+ if ( is_wp_error( $response ) ) {
471
+ return $data;
472
+ }
473
+ $response_data = json_decode( wp_remote_retrieve_body( $response ), true );
474
+ // Bail in case of decode error or failure to retrieve data.
475
+ // We will return the data already available.
476
+ if ( null === $response_data || empty( $response_data['data'] ) || empty( $response_data['code'] ) || 'success' !== $response_data['code'] ) {
477
+ return $data;
478
+ }
479
+
480
+ $data = apply_filters( 'customify_style_manager_fetch_design_assets', $response_data['data'] );
481
+
482
+ // Cache the data in an option for 6 hours
483
+ update_option( $this->_get_design_assets_cache_key() , $data, true );
484
+ update_option( $this->_get_design_assets_cache_key() . '_timestamp' , time() + 6 * HOUR_IN_SECONDS, true );
485
+ }
486
+
487
+ return $data;
488
+ }
489
+
490
+ /**
491
+ * Get the design assets cache key.
492
+ *
493
+ * @since 1.7.0
494
+ *
495
+ * @return string
496
+ */
497
+ protected function _get_design_assets_cache_key() {
498
+ return 'customify_style_manager_design_assets';
499
+ }
500
+
501
+ /**
502
+ * Get the default (hard-coded) color palettes configuration.
503
+ *
504
+ * @since 1.7.0
505
+ *
506
+ * @return array
507
+ */
508
+ protected function get_default_color_palettes_config() {
509
+ $default_color_palettes = array(
510
+ 'vasco' => array(
511
+ 'label' => esc_html__( 'Restful Beach', 'customify' ),
512
+ 'preview' => array(
513
+ 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/vasco-theme-palette.jpg',
514
+ ),
515
+ 'options' => array(
516
+ 'sm_color_primary' => '#38C3C8',
517
+ 'sm_color_secondary' => '#F59828',
518
+ 'sm_color_tertiary' => '#FB551C',
519
+ 'sm_dark_primary' => '#2b2b28',
520
+ 'sm_dark_secondary' => '#2B3D39',
521
+ 'sm_dark_tertiary' => '#65726F',
522
+ 'sm_light_primary' => '#F5F6F1',
523
+ 'sm_light_secondary' => '#E6F7F7',
524
+ 'sm_light_tertiary' => '#FAEDE8',
525
+ ),
526
+ ),
527
+ 'felt' => array(
528
+ 'label' => esc_html__( 'Warm Summer', 'customify' ),
529
+ 'preview' => array(
530
+ 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/felt-theme-palette.jpg',
531
+ ),
532
+ 'options' => array(
533
+ 'sm_color_primary' => '#ff6000',
534
+ 'sm_color_secondary' => '#FF9200',
535
+ 'sm_color_tertiary' => '#FF7019',
536
+ 'sm_dark_primary' => '#1C1C1C',
537
+ 'sm_dark_secondary' => '#161616',
538
+ 'sm_dark_tertiary' => '#161616',
539
+ 'sm_light_primary' => '#FFFCFC',
540
+ 'sm_light_secondary' => '#FFF4E8',
541
+ 'sm_light_tertiary' => '#F7F3F0',
542
+ ),
543
+ ),
544
+ 'julia' => array(
545
+ 'label' => esc_html__( 'Serenity', 'customify' ),
546
+ 'preview' => array(
547
+ 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/julia-theme-palette.jpg',
548
+ ),
549
+ 'options' => array(
550
+ 'sm_color_primary' => '#3349B8',
551
+ 'sm_color_secondary' => '#3393B8',
552
+ 'sm_color_tertiary' => '#C18866',
553
+ 'sm_dark_primary' => '#161616',
554
+ 'sm_dark_secondary' => '#383C50',
555
+ 'sm_dark_tertiary' => '#383C50',
556
+ 'sm_light_primary' => '#f7f6f5',
557
+ 'sm_light_secondary' => '#E7F2F8',
558
+ 'sm_light_tertiary' => '#F7ECE6',
559
+ ),
560
+ ),
561
+ 'gema' => array(
562
+ 'label' => esc_html__( 'Burning Red', 'customify' ),
563
+ 'preview' => array(
564
+ 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/gema-theme-palette.jpg',
565
+ ),
566
+ 'options' => array(
567
+ 'sm_color_primary' => '#E03A3A',
568
+ 'sm_color_secondary' => '#F75034',
569
+ 'sm_color_tertiary' => '#AD2D2D',
570
+ 'sm_dark_primary' => '#000000',
571
+ 'sm_dark_secondary' => '#000000',
572
+ 'sm_dark_tertiary' => '#A3A3A1',
573
+ 'sm_light_primary' => '#FFFFFF',
574
+ 'sm_light_secondary' => '#F7F5F5',
575
+ 'sm_light_tertiary' => '#F7F2F2',
576
+ ),
577
+ ),
578
+ 'patch' => array(
579
+ 'label' => esc_html__( 'Fresh Lemon', 'customify' ),
580
+ 'preview' => array(
581
+ 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/patch-theme-palette.jpg',
582
+ ),
583
+ 'options' => array(
584
+ 'sm_color_primary' => '#ffeb00',
585
+ 'sm_color_secondary' => '#19CDFF',
586
+ 'sm_color_tertiary' => '#0BE8DD',
587
+ 'sm_dark_primary' => '#171617',
588
+ 'sm_dark_secondary' => '#3d3e40',
589
+ 'sm_dark_tertiary' => '#b5b5b5',
590
+ 'sm_light_primary' => '#FFFFFF',
591
+ 'sm_light_secondary' => '#E8FAFF',
592
+ 'sm_light_tertiary' => '#F2FFFE',
593
+ ),
594
+ ),
595
+ 'silk' => array(
596
+ 'label' => esc_html__( 'Floral Bloom', 'customify' ),
597
+ 'preview' => array(
598
+ 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/silk-theme-palette.jpg',
599
+ ),
600
+ 'options' => array(
601
+ 'sm_color_primary' => '#A33B61',
602
+ 'sm_color_secondary' => '#FCC9B0',
603
+ 'sm_color_tertiary' => '#C9648A',
604
+ 'sm_dark_primary' => '#000000',
605
+ 'sm_dark_secondary' => '#000000',
606
+ 'sm_dark_tertiary' => '#A3A3A1',
607
+ 'sm_light_primary' => '#FFFFFF',
608
+ 'sm_light_secondary' => '#F7F5F6',
609
+ 'sm_light_tertiary' => '#F7F0F3',
610
+ ),
611
+ ),
612
+ 'hive' => array(
613
+ 'label' => esc_html__( 'Powerful', 'customify' ),
614
+ 'preview' => array(
615
+ 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/hive-theme-palette.jpg',
616
+ ),
617
+ 'options' => array(
618
+ 'sm_color_primary' => '#ffeb00',
619
+ 'sm_color_secondary' => '#3200B2',
620
+ 'sm_color_tertiary' => '#740AC9',
621
+ 'sm_dark_primary' => '#171617',
622
+ 'sm_dark_secondary' => '#171617',
623
+ 'sm_dark_tertiary' => '#363636',
624
+ 'sm_light_primary' => '#FFFFFF',
625
+ 'sm_light_secondary' => '#F2F5F7',
626
+ 'sm_light_tertiary' => '#F5F2F7',
627
+ ),
628
+ ),
629
+ 'lilac' => array(
630
+ 'label' => esc_html__( 'Soft Lilac', 'customify' ),
631
+ 'preview' => array(
632
+ 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/lilac-palette.jpg',
633
+ ),
634
+ 'options' => array(
635
+ 'sm_color_primary' => '#DD8CA9',
636
+ 'sm_color_secondary' => '#8C9CDE',
637
+ 'sm_color_tertiary' => '#E3B4A6',
638
+ 'sm_dark_primary' => '#1A1A1A',
639
+ 'sm_dark_secondary' => '#303030',
640
+ 'sm_dark_tertiary' => '#A3A3A1',
641
+ 'sm_light_primary' => '#F0F2F1',
642
+ 'sm_light_secondary' => '#CED5F2',
643
+ 'sm_light_tertiary' => '#F7E1DA',
644
+ ),
645
+ ),
646
+ );
647
+
648
+ return apply_filters( 'customify_style_manager_default_color_palettes', $default_color_palettes );
649
+ }
650
+
651
+ /**
652
+ * Get the active theme data.
653
+ *
654
+ * @since 1.7.0
655
+ *
656
+ * @return array
657
+ */
658
+ public function get_active_theme_data() {
659
+ $theme_data = array();
660
+
661
+ $slug = basename( get_template_directory() );
662
+
663
+ $theme_data['slug'] = $slug;
664
+
665
+ // Get the current theme style.css data.
666
+ $current_theme = wp_get_theme( get_template() );
667
+ if ( ! empty( $current_theme ) && ! is_wp_error( $current_theme ) ) {
668
+ $theme_data['name'] = $current_theme->get('Name');
669
+ $theme_data['themeuri'] = $current_theme->get('ThemeURI');
670
+ $theme_data['version'] = $current_theme->get('Version');
671
+ $theme_data['textdomain'] = $current_theme->get('TextDomain');
672
+ }
673
+
674
+ // Maybe get the WUpdates theme info if it's a theme delivered from WUpdates.
675
+ $wupdates_ids = apply_filters( 'wupdates_gather_ids', array() );
676
+ if ( ! empty( $wupdates_ids[ $slug ] ) ) {
677
+ $theme_data['wupdates'] = $wupdates_ids[ $slug ];
678
+ }
679
+
680
+ return apply_filters( 'customify_style_manager_get_theme_data', $theme_data );
681
+ }
682
+
683
+ /**
684
+ * Get the site data.
685
+ *
686
+ * @since 1.7.0
687
+ *
688
+ * @return array
689
+ */
690
+ public function get_site_data() {
691
+ $site_data = array(
692
+ 'url' => home_url('/'),
693
+ 'is_ssl' => is_ssl(),
694
+ );
695
+
696
+ $site_data['wp'] = array(
697
+ 'version' => get_bloginfo('version'),
698
+ );
699
+
700
+ $site_data['customify'] = array(
701
+ 'version' => PixCustomifyPlugin()->get_version(),
702
+ );
703
+
704
+ $site_data['color_palettes'] = array(
705
+ 'current' => $this->get_current_color_palette(),
706
+ 'variation' => $this->get_current_color_palette_variation(),
707
+ 'custom' => $this->is_using_custom_color_palette(),
708
+ );
709
+
710
+ return apply_filters( 'customify_style_manager_get_site_data', $site_data );
711
+ }
712
+
713
+ /**
714
+ * Get the current color palette ID or false if none is selected.
715
+ *
716
+ * @since 1.7.0
717
+ *
718
+ * @return string|false
719
+ */
720
+ protected function get_current_color_palette() {
721
+ return get_option( 'sm_color_palette', false );
722
+ }
723
+
724
+ /**
725
+ * Get the current color palette variation ID or false if none is selected.
726
+ *
727
+ * @since 1.7.0
728
+ *
729
+ * @return string|false
730
+ */
731
+ protected function get_current_color_palette_variation() {
732
+ return get_option( 'sm_color_palette_variation', false );
733
+ }
734
+
735
+ /**
736
+ * Determine if the selected color palette has been customized and remember this in an option.
737
+ *
738
+ * @since 1.7.0
739
+ *
740
+ * @return bool
741
+ */
742
+ public function update_custom_palette_in_use() {
743
+ // If there is no style manager support, bail early.
744
+ if ( ! $this->is_supported() ) {
745
+ return false;
746
+ }
747
+
748
+ $current_palette = $this->get_current_color_palette();
749
+ if ( empty( $current_palette ) ) {
750
+ return false;
751
+ }
752
+
753
+ $color_palettes = $this->get_color_palettes();
754
+ if ( ! isset( $color_palettes[ $current_palette ] ) || empty( $color_palettes[ $current_palette ]['options'] ) ) {
755
+ return false;
756
+ }
757
+
758
+ $is_custom_palette = false;
759
+ // If any of the current master colors has a different value than the one provided by the color palette,
760
+ // it means a custom color palette is in use.
761
+ $current_palette_options = $color_palettes[ $current_palette ]['options'];
762
+ foreach ( $current_palette_options as $setting_id => $value ) {
763
+ if ( $value != get_option( $setting_id ) ) {
764
+ $is_custom_palette = true;
765
+ break;
766
+ }
767
+ }
768
+
769
+ update_option( 'sm_is_custom_color_palette', $is_custom_palette, true );
770
+
771
+ do_action( 'customify_style_manager_updated_custom_palette_in_use', $is_custom_palette, $this );
772
+
773
+ return true;
774
+ }
775
+
776
+ /**
777
+ * Determine if a custom color palette is in use.
778
+ *
779
+ * @since 1.7.0
780
+ *
781
+ * @return bool
782
+ */
783
+ protected function is_using_custom_color_palette(){
784
+ return (bool) get_option( 'sm_is_custom_color_palette', false );
785
+ }
786
+
787
+ /**
788
+ * Get all the defined Style Manager master color field ids.
789
+ *
790
+ * @since 1.7.0
791
+ *
792
+ * @param array $options
793
+ * @return array
794
+ */
795
+ public function get_all_master_color_controls_ids( $options ) {
796
+ $master_color_controls = array();
797
+
798
+ foreach ( $options as $option_id => $option_settings ) {
799
+ if ( 'color' === $option_settings['type'] ) {
800
+ $master_color_controls[] = $option_id;
801
+ }
802
+ }
803
+
804
+ return $master_color_controls;
805
+ }
806
+
807
+ /**
808
+ * Output the user feedback modal markup, if we need to.
809
+ *
810
+ * @since 1.7.0
811
+ */
812
+ public function output_user_feedback_modal() {
813
+ // If there is no style manager support, bail early.
814
+ if ( ! $this->is_supported() ) {
815
+ return;
816
+ }
817
+
818
+ // Only output if the user didn't provide feedback.
819
+ if ( ! $this->user_provided_feedback() ) { ?>
820
+ <div id="style-manager-user-feedback-modal">
821
+ <div class="modal">
822
+ <div class="modal-dialog" role="document">
823
+ <div class="modal-content">
824
+ <form id="style-manager-user-feedback" action="#" method="post">
825
+ <input type="hidden" name="type" value="1_to_5" />
826
+ <div class="modal-header">
827
+ <button type="button" class="close icon media-modal-close" data-dismiss="modal" aria-label="Close"><span class="media-modal-icon"><span class="screen-reader-text">Close media panel</span></span></button>
828
+ <!-- <a href="#" class="close button button--naked gray" data-dismiss="modal" aria-label="Close">Close</a> -->
829
+ </div>
830
+ <div class="modal-body full">
831
+ <div class="box box--large">
832
+ <div class="first-step">
833
+ <h2 class="modal-title">How would you rate your experience with using Color Palettes?</h2>
834
+ <div class="scorecard">
835
+ <span>Worst</span>
836
+ <label>
837
+ <input type="radio" name="rating" value="1" required />
838
+ <span>1</span>
839
+ </label>
840
+ <label>
841
+ <input type="radio" name="rating" value="2" required />
842
+ <span>2</span>
843
+ </label>
844
+ <label>
845
+ <input type="radio" name="rating" value="3" required />
846
+ <span>3</span>
847
+ </label>
848
+ <label>
849
+ <input type="radio" name="rating" value="4" required />
850
+ <span>4</span>
851
+ </label>
852
+ <label>
853
+ <input type="radio" name="rating" value="5" required />
854
+ <span>5</span>
855
+ </label>
856
+ <span>Best</span>
857
+ </div>
858
+ </div>
859
+ <div class="second-step hidden">
860
+ <p><strong>What makes you give <span class="rating-placeholder">5</span>*?</strong> I hope you’ll answer and help us do better:</p>
861
+ <div class="not-floating-labels">
862
+ <div class="form-row field">
863
+ <textarea name="message" placeholder="Your message.."
864
+ id="style-manager-user-feedback-message" rows="4" oninvalid="this.setCustomValidity('May we have a little more info about your experience?')" oninput="setCustomValidity('')" required></textarea>
865
+ </div>
866
+ </div>
867
+ <button id="style-manager-user-feedback_btn" class="button" type="submit"><?php _e( 'Submit my feedback', 'customify' ); ?></button>
868
+ </div>
869
+ <div class="thanks-step hidden">
870
+ <h3 class="modal-title">Thanks for your feedback!</h3>
871
+ <p>This will help us improve the product. Stay awesome! 🤗</p>
872
+ </div>
873
+ <div class="error-step hidden">
874
+ <h3 class="modal-title">We've hit a snag!</h3>
875
+ <p>We couldn't record your feedback and we would truly appreciate it if you would try it again at a latter time. Stay awesome! 🤗</p>
876
+ </div>
877
+ </div>
878
+ </div>
879
+ <div class="modal-footer full">
880
+
881
+ </div>
882
+ </form>
883
+ </div>
884
+ </div>
885
+ </div>
886
+ <!-- End Modal -->
887
+ <!-- Modal Backdrop (Shadow) -->
888
+ <div class="modal-backdrop"></div>
889
+ </div>
890
+
891
+ <?php }
892
+ }
893
+
894
+ /**
895
+ * @param bool|int $timestamp_limit Optional. Timestamp to compare the time the user provided feedback.
896
+ * If the provided timestamp is earlier than the time the user provided feedback, returns false.
897
+ *
898
+ * @return bool
899
+ */
900
+ public function user_provided_feedback( $timestamp_limit = false ) {
901
+ if ( defined( 'CUSTOMIFY_SM_ALWAYS_ASK_FOR_FEEDBACK' ) && true === CUSTOMIFY_SM_ALWAYS_ASK_FOR_FEEDBACK ) {
902
+ return false;
903
+ }
904
+
905
+ $user_provided_feedback = get_option( 'style_manager_user_feedback_provided' );
906
+ if ( empty( $user_provided_feedback ) ) {
907
+ return false;
908
+ }
909
+
910
+ if ( ! empty( $timestamp ) && is_int( $timestamp ) && $timestamp_limit > $user_provided_feedback ) {
911
+ return false;
912
+ }
913
+
914
+ return true;
915
+ }
916
+
917
+ /**
918
+ * Callback for the user feedback AJAX call.
919
+ *
920
+ * @since 1.7.0
921
+ */
922
+ public function user_feedback_callback() {
923
+ check_ajax_referer( 'customify_style_manager_user_feedback', 'nonce' );
924
+
925
+ if ( empty( $_POST['type'] ) ) {
926
+ wp_send_json_error( esc_html__( 'No type provided', 'customify' ) );
927
+ }
928
+
929
+ if ( empty( $_POST['rating'] ) ) {
930
+ wp_send_json_error( esc_html__( 'No rating provided', 'customify' ) );
931
+ }
932
+
933
+ $type = sanitize_text_field( $_POST['type'] );
934
+ $rating = intval( $_POST['rating'] );
935
+ $message = '';
936
+ if ( ! empty( $_POST['message'] ) ) {
937
+ $message = wp_kses_post( $_POST['message'] );
938
+ }
939
+
940
+ $request_data = apply_filters( 'customify_pixelgrade_cloud_request_data', array(
941
+ 'site_url' => home_url( '/' ),
942
+ 'satisfaction_data' => array(
943
+ 'type' => $type,
944
+ 'rating' => $rating,
945
+ 'message' => $message,
946
+ ),
947
+ ), $this );
948
+
949
+ $request_args = array(
950
+ 'method' => self::$externalApiEndpoints['cloud']['stats']['method'],
951
+ 'timeout' => 5,
952
+ 'blocking' => true,
953
+ 'body' => $request_data,
954
+ 'sslverify' => false,
955
+ );
956
+
957
+ // Send the feedback.
958
+ $response = wp_remote_request( self::$externalApiEndpoints['cloud']['stats']['url'], $request_args );
959
+ if ( is_wp_error( $response ) ) {
960
+ wp_send_json_error( esc_html__( 'Sorry, something went wrong and we couldn\'t save your feedback.', 'customify' ) );
961
+ }
962
+ $response_data = json_decode( wp_remote_retrieve_body( $response ), true );
963
+ // Bail in case of decode error or failure to retrieve data
964
+ if ( null === $response_data || empty( $response_data['code'] ) || 'success' !== $response_data['code'] ) {
965
+ wp_send_json_error( esc_html__( 'Sorry, something went wrong and we couldn\'t save your feedback.', 'customify' ) );
966
+ }
967
+
968
+ // We need to remember that the user provided feedback (and at what timestamp).
969
+ update_option( 'style_manager_user_feedback_provided', time(), true );
970
+
971
+ wp_send_json_success( esc_html__( 'Thank you for your feedback.', 'customify' ) );
972
+ }
973
+
974
+ /**
975
+ * Main Customify_Style_Manager Instance
976
+ *
977
+ * Ensures only one instance of Customify_Style_Manager is loaded or can be loaded.
978
+ *
979
+ * @since 1.7.0
980
+ * @static
981
+ * @param object $parent Main PixCustomifyPlugin instance.
982
+ *
983
+ * @return Customify_Style_Manager Main Customify_Style_Manager instance
984
+ */
985
+ public static function instance( $parent = null ) {
986
+
987
+ if ( is_null( self::$_instance ) ) {
988
+ self::$_instance = new self( $parent );
989
+ }
990
+ return self::$_instance;
991
+ } // End instance ()
992
+
993
+ /**
994
+ * Cloning is forbidden.
995
+ *
996
+ * @since 1.7.0
997
+ */
998
+ public function __clone() {
999
+
1000
+ _doing_it_wrong( __FUNCTION__,esc_html( __( 'Cheatin&#8217; huh?' ) ), null );
1001
+ } // End __clone ()
1002
+
1003
+ /**
1004
+ * Unserializing instances of this class is forbidden.
1005
+ *
1006
+ * @since 1.7.0
1007
+ */
1008
+ public function __wakeup() {
1009
+
1010
+ _doing_it_wrong( __FUNCTION__, esc_html( __( 'Cheatin&#8217; huh?' ) ), null );
1011
+ } // End __wakeup ()
1012
+ }
js/customizer.js CHANGED
@@ -313,6 +313,104 @@
313
  } );
314
  }
315
  )();
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
316
  } );
317
 
318
  const customifyHandleRangeFields = function( el ) {
313
  } );
314
  }
315
  )();
316
+
317
+ // Handle the Style Manager user feedback logic.
318
+ var $styleManagerUserFeedbackModal = $('#style-manager-user-feedback-modal');
319
+ if ( $styleManagerUserFeedbackModal.length ) {
320
+ var $styleManagerUserFeedbackForm = $styleManagerUserFeedbackModal.find('form'),
321
+ $styleManagerUserFeedbackCloseBtn = $styleManagerUserFeedbackModal.find('.close'),
322
+ $styleManagerUserFeedbackFirstStep = $styleManagerUserFeedbackModal.find('.first-step'),
323
+ $styleManagerUserFeedbackSecondStep = $styleManagerUserFeedbackModal.find('.second-step'),
324
+ $styleManagerUserFeedbackThanksStep = $styleManagerUserFeedbackModal.find('.thanks-step'),
325
+ $styleManagerUserFeedbackErrorStep = $styleManagerUserFeedbackModal.find('.error-step'),
326
+ styleManagerUserFeedbackModalShown = false,
327
+ styleManagerColorPaletteChanged = false;
328
+
329
+ // Handle when to open the modal.
330
+ api.bind('saved', function () {
331
+ // We will only show the modal once per Customizer session.
332
+ if (!styleManagerUserFeedbackModalShown && styleManagerColorPaletteChanged) {
333
+ $('body').addClass('modal-open');
334
+ styleManagerUserFeedbackModalShown = true;
335
+ }
336
+ });
337
+
338
+ // Handle the color palette changed info update.
339
+ const colorPaletteSetting = api( 'sm_color_palette' );
340
+ if ( !_.isUndefined(colorPaletteSetting) ) {
341
+ colorPaletteSetting.bind( function( new_value, old_value ) {
342
+ if ( new_value != old_value ) {
343
+ styleManagerColorPaletteChanged = true;
344
+ }
345
+ } )
346
+ }
347
+ const colorPaletteVariationSetting = api( 'sm_color_palette_variation' );
348
+ if ( !_.isUndefined(colorPaletteVariationSetting) ) {
349
+ colorPaletteVariationSetting.bind( function( new_value, old_value ) {
350
+ if ( new_value != old_value ) {
351
+ styleManagerColorPaletteChanged = true;
352
+ }
353
+ } )
354
+ }
355
+
356
+ // Handle the modal submit.
357
+ $styleManagerUserFeedbackForm.on('submit', function (event) {
358
+ event.preventDefault();
359
+
360
+ let $form = $(event.target);
361
+
362
+ let data = {
363
+ action: 'customify_style_manager_user_feedback',
364
+ nonce: customify_settings.style_manager_user_feedback_nonce,
365
+ type: $form.find('input[name=type]').val(),
366
+ rating: $form.find('input[name=rating]:checked').val(),
367
+ message: $form.find('textarea[name=message]').val()
368
+ };
369
+
370
+ $.post(
371
+ customify_settings.ajax_url,
372
+ data,
373
+ function (response) {
374
+ if (true === response.success) {
375
+ $styleManagerUserFeedbackFirstStep.hide();
376
+ $styleManagerUserFeedbackSecondStep.hide();
377
+ $styleManagerUserFeedbackThanksStep.show();
378
+ $styleManagerUserFeedbackErrorStep.hide();
379
+ } else {
380
+ $styleManagerUserFeedbackFirstStep.hide();
381
+ $styleManagerUserFeedbackSecondStep.hide();
382
+ $styleManagerUserFeedbackThanksStep.hide();
383
+ $styleManagerUserFeedbackErrorStep.show();
384
+ }
385
+ }
386
+ );
387
+ });
388
+
389
+ $styleManagerUserFeedbackForm.find('input[name=rating]').on('change', function (event) {
390
+ // Leave everything in working order
391
+ setTimeout(function () {
392
+ $styleManagerUserFeedbackSecondStep.show();
393
+ }, 300);
394
+
395
+ let rating = $styleManagerUserFeedbackForm.find('input[name=rating]:checked').val();
396
+
397
+ $styleManagerUserFeedbackForm.find('.rating-placeholder').text(rating);
398
+ });
399
+
400
+ $styleManagerUserFeedbackCloseBtn.on('click', function (event) {
401
+ event.preventDefault();
402
+
403
+ $('body').removeClass('modal-open');
404
+
405
+ // Leave everything in working order
406
+ setTimeout(function () {
407
+ $styleManagerUserFeedbackFirstStep.show();
408
+ $styleManagerUserFeedbackSecondStep.hide();
409
+ $styleManagerUserFeedbackThanksStep.hide();
410
+ $styleManagerUserFeedbackErrorStep.hide();
411
+ }, 300);
412
+ });
413
+ }
414
  } );
415
 
416
  const customifyHandleRangeFields = function( el ) {
js/customizer/customify-palette-variations.js CHANGED
@@ -1,5 +1,5 @@
1
  window.variations = {
2
- 'color_dark_light': {
3
  'sm_color_primary': 'sm_color_primary',
4
  'sm_color_secondary': 'sm_color_secondary',
5
  'sm_color_tertiary': 'sm_color_tertiary',
@@ -10,7 +10,7 @@ window.variations = {
10
  'sm_light_secondary': 'sm_light_secondary',
11
  'sm_light_tertiary': 'sm_light_tertiary',
12
  },
13
- 'color_light_dark': {
14
  'sm_color_primary': 'sm_color_primary',
15
  'sm_color_secondary': 'sm_color_secondary',
16
  'sm_color_tertiary': 'sm_color_tertiary',
@@ -21,7 +21,7 @@ window.variations = {
21
  'sm_light_secondary': 'sm_dark_secondary',
22
  'sm_light_tertiary': 'sm_dark_tertiary',
23
  },
24
- 'light_dark_color': {
25
  'sm_color_primary': 'sm_light_primary',
26
  'sm_color_secondary': 'sm_light_secondary',
27
  'sm_color_tertiary': 'sm_light_tertiary',
@@ -32,7 +32,7 @@ window.variations = {
32
  'sm_light_secondary': ['sm_color_secondary', 'sm_dark_secondary'],
33
  'sm_light_tertiary': ['sm_color_tertiary', 'sm_dark_tertiary'],
34
  },
35
- 'light_color_dark': {
36
  'sm_color_primary': 'sm_light_primary',
37
  'sm_color_secondary': 'sm_light_secondary',
38
  'sm_color_tertiary': 'sm_light_tertiary',
@@ -43,7 +43,7 @@ window.variations = {
43
  'sm_light_secondary': 'sm_dark_secondary',
44
  'sm_light_tertiary': 'sm_dark_tertiary',
45
  },
46
- 'dark_light_color': {
47
  'sm_color_primary': 'sm_dark_primary',
48
  'sm_color_secondary': 'sm_dark_secondary',
49
  'sm_color_tertiary': 'sm_dark_tertiary',
@@ -54,7 +54,7 @@ window.variations = {
54
  'sm_light_secondary': 'sm_color_secondary',
55
  'sm_light_tertiary': 'sm_color_tertiary',
56
  },
57
- 'dark_color_light': {
58
  'sm_color_primary': 'sm_dark_primary',
59
  'sm_color_secondary': 'sm_dark_secondary',
60
  'sm_color_tertiary': 'sm_dark_tertiary',
@@ -64,5 +64,5 @@ window.variations = {
64
  'sm_light_primary': 'sm_light_primary',
65
  'sm_light_secondary': 'sm_light_secondary',
66
  'sm_light_tertiary': 'sm_light_tertiary',
67
- }
68
  };
1
  window.variations = {
2
+ 'light': {
3
  'sm_color_primary': 'sm_color_primary',
4
  'sm_color_secondary': 'sm_color_secondary',
5
  'sm_color_tertiary': 'sm_color_tertiary',
10
  'sm_light_secondary': 'sm_light_secondary',
11
  'sm_light_tertiary': 'sm_light_tertiary',
12
  },
13
+ 'dark': {
14
  'sm_color_primary': 'sm_color_primary',
15
  'sm_color_secondary': 'sm_color_secondary',
16
  'sm_color_tertiary': 'sm_color_tertiary',
21
  'sm_light_secondary': 'sm_dark_secondary',
22
  'sm_light_tertiary': 'sm_dark_tertiary',
23
  },
24
+ 'colorful': {
25
  'sm_color_primary': 'sm_light_primary',
26
  'sm_color_secondary': 'sm_light_secondary',
27
  'sm_color_tertiary': 'sm_light_tertiary',
32
  'sm_light_secondary': ['sm_color_secondary', 'sm_dark_secondary'],
33
  'sm_light_tertiary': ['sm_color_tertiary', 'sm_dark_tertiary'],
34
  },
35
+ 'dark_alt': {
36
  'sm_color_primary': 'sm_light_primary',
37
  'sm_color_secondary': 'sm_light_secondary',
38
  'sm_color_tertiary': 'sm_light_tertiary',
43
  'sm_light_secondary': 'sm_dark_secondary',
44
  'sm_light_tertiary': 'sm_dark_tertiary',
45
  },
46
+ 'colorful_alt': {
47
  'sm_color_primary': 'sm_dark_primary',
48
  'sm_color_secondary': 'sm_dark_secondary',
49
  'sm_color_tertiary': 'sm_dark_tertiary',
54
  'sm_light_secondary': 'sm_color_secondary',
55
  'sm_light_tertiary': 'sm_color_tertiary',
56
  },
57
+ 'light_alt': {
58
  'sm_color_primary': 'sm_dark_primary',
59
  'sm_color_secondary': 'sm_dark_secondary',
60
  'sm_color_tertiary': 'sm_dark_tertiary',
64
  'sm_light_primary': 'sm_light_primary',
65
  'sm_light_secondary': 'sm_light_secondary',
66
  'sm_light_tertiary': 'sm_light_tertiary',
67
+ },
68
  };
js/customizer/customify-palettes.js CHANGED
@@ -19,10 +19,15 @@
19
  // create a stack of callbacks bound to parent settings to be able to unbind them
20
  // when altering the connected_fields attribute
21
  window.connectedFieldsCallbacks = {};
22
- }
23
 
24
  const updateCurrentPalette = ( label ) => {
25
  const $palette = $( '.c-palette' );
 
 
 
 
 
26
  const $current = $palette.find( '.colors.current' );
27
  const $next = $palette.find( '.colors.next' );
28
 
@@ -57,13 +62,17 @@
57
 
58
  const bindVariationChange = () => {
59
  const paletteControlSelector = '.c-palette__control';
60
- const variation = wp.customize( 'sm_palette_variation' )();
 
61
 
62
- $( paletteControlSelector ).removeClass( 'active' );
63
- $( paletteControlSelector ).filter( '[data-target*="' + variation + '"]' ).addClass( 'active' );
 
64
 
 
 
65
  $( 'body' ).on( 'click', paletteControlSelector, function() {
66
- var $obj = $( this ),
67
  $target = $( $obj.data( 'target' ) );
68
 
69
  $obj.siblings( paletteControlSelector ).removeClass( 'active' );
@@ -147,7 +156,12 @@
147
 
148
  // alter connected fields of the master colors controls depending on the selected palette variation
149
  const reloadConnectedFields = () => {
150
- const setting = wp.customize( 'sm_palette_variation' );
 
 
 
 
 
151
  const variation = setting();
152
 
153
  if ( ! window.variations.hasOwnProperty( variation ) ) {
@@ -162,6 +176,11 @@
162
 
163
  const createCurrentPaletteControls = () => {
164
  const $palette = $( '.c-palette' );
 
 
 
 
 
165
  const $colors = $palette.find( '.colors.next .color' );
166
 
167
  $colors.each( ( i, obj ) => {
@@ -186,15 +205,26 @@
186
  }
187
  } );
188
 
 
 
 
 
 
189
  $obj.on( 'click', ( e ) => {
190
  e.stopPropagation();
191
  e.preventDefault();
192
 
193
- var hidden = ! $obj.find( '.iris-picker' ).is( ":visible" );
194
 
195
  if ( hidden ) {
196
  $colors.not( $obj ).addClass( 'inactive' ).iris( 'hide' );
197
  $obj.removeClass( 'inactive' );
 
 
 
 
 
 
198
  } else {
199
  $colors.removeClass( 'inactive' );
200
  }
@@ -229,7 +259,7 @@
229
  bindVariationChange();
230
 
231
  // when variation is changed reload connected fields from cached version of customizer settings config
232
- $( document ).on( 'change', '[name="_customize-radio-sm_palette_variation_control"]', reloadConnectedFields );
233
  $( document ).on( 'click', '.customify_preset.color_palette input', onPaletteChange );
234
  };
235
 
19
  // create a stack of callbacks bound to parent settings to be able to unbind them
20
  // when altering the connected_fields attribute
21
  window.connectedFieldsCallbacks = {};
22
+ };
23
 
24
  const updateCurrentPalette = ( label ) => {
25
  const $palette = $( '.c-palette' );
26
+
27
+ if ( ! $palette.length ) {
28
+ return;
29
+ }
30
+
31
  const $current = $palette.find( '.colors.current' );
32
  const $next = $palette.find( '.colors.next' );
33
 
62
 
63
  const bindVariationChange = () => {
64
  const paletteControlSelector = '.c-palette__control';
65
+ const $paletteControl = $( paletteControlSelector );
66
+ const variation = wp.customize( 'sm_color_palette_variation' )();
67
 
68
+ if ( _.isUndefined( variation ) || ! $paletteControl.length ) {
69
+ return;
70
+ }
71
 
72
+ $paletteControl.removeClass( 'active' );
73
+ $paletteControl.filter( '.variation-' + variation ).addClass( 'active' );
74
  $( 'body' ).on( 'click', paletteControlSelector, function() {
75
+ let $obj = $( this ),
76
  $target = $( $obj.data( 'target' ) );
77
 
78
  $obj.siblings( paletteControlSelector ).removeClass( 'active' );
156
 
157
  // alter connected fields of the master colors controls depending on the selected palette variation
158
  const reloadConnectedFields = () => {
159
+ const setting = wp.customize( 'sm_color_palette_variation' );
160
+
161
+ if ( _.isUndefined( setting ) ) {
162
+ return;
163
+ }
164
+
165
  const variation = setting();
166
 
167
  if ( ! window.variations.hasOwnProperty( variation ) ) {
176
 
177
  const createCurrentPaletteControls = () => {
178
  const $palette = $( '.c-palette' );
179
+
180
+ if ( ! $palette.length ) {
181
+ return;
182
+ }
183
+
184
  const $colors = $palette.find( '.colors.next .color' );
185
 
186
  $colors.each( ( i, obj ) => {
205
  }
206
  } );
207
 
208
+ $obj.find( '.iris-picker' ).on( 'click', function( e ) {
209
+ e.stopPropagation();
210
+ e.preventDefault();
211
+ } );
212
+
213
  $obj.on( 'click', ( e ) => {
214
  e.stopPropagation();
215
  e.preventDefault();
216
 
217
+ const hidden = ! $obj.find( '.iris-picker' ).is( ":visible" );
218
 
219
  if ( hidden ) {
220
  $colors.not( $obj ).addClass( 'inactive' ).iris( 'hide' );
221
  $obj.removeClass( 'inactive' );
222
+
223
+ const $iris = $obj.find( '.iris-picker' );
224
+ const paletteWidth = $palette.outerWidth();
225
+ const irisWidth = $iris.outerWidth();
226
+
227
+ $iris.css( 'left', ( paletteWidth - irisWidth ) * i / ( $colors.length - 1 ) );
228
  } else {
229
  $colors.removeClass( 'inactive' );
230
  }
259
  bindVariationChange();
260
 
261
  // when variation is changed reload connected fields from cached version of customizer settings config
262
+ $( document ).on( 'change', '[name="_customize-radio-sm_color_palette_variation_control"]', reloadConnectedFields );
263
  $( document ).on( 'click', '.customify_preset.color_palette input', onPaletteChange );
264
  };
265
 
js/customizer_preview.js CHANGED
@@ -31,9 +31,9 @@
31
  api(key, function (setting) {
32
 
33
  setting.bind(function (to) {
34
- var properties = [];
35
 
36
  $.each(el.css, function (counter, property_config) {
 
37
 
38
  properties[property_config.property] = property_config.selector;
39
  if (typeof property_config.callback_filter !== "undefined") {
31
  api(key, function (setting) {
32
 
33
  setting.bind(function (to) {
 
34
 
35
  $.each(el.css, function (counter, property_config) {
36
+ var properties = [];
37
 
38
  properties[property_config.property] = property_config.selector;
39
  if (typeof property_config.callback_filter !== "undefined") {
mock_style_manager_config.php DELETED
@@ -1,408 +0,0 @@
1
- <?php
2
- if ( ! function_exists('mock_style_manager_section') ) {
3
-
4
- /**
5
- * Setup the Style Manager Customizer section and mock some color palettes.
6
- *
7
- * @param $config array This holds required keys for the plugin config like 'opt-name', 'panels', 'settings'
8
- * @return $config
9
- */
10
- function mock_style_manager_section( $config ) {
11
- // If the theme hasn't declared support for style manager, bail.
12
- if ( ! current_theme_supports( 'customizer_style_manager' ) ) {
13
- return $config;
14
- }
15
-
16
- if ( ! isset( $config['sections']['style_manager_section'] ) ) {
17
- $config['sections']['style_manager_section'] = array();
18
- }
19
-
20
- // The section might be already defined, thus we merge, not replace the entire section config.
21
- $config['sections']['style_manager_section'] = array_replace_recursive( $config['sections']['style_manager_section'], array(
22
- 'title' => esc_html__( 'Style Manager', 'customify' ),
23
- 'section_id' => 'style_manager_section', // We will force this section id preventing prefixing and other regular processing.
24
- 'options' => array(
25
- 'sm_color_palette' => array(
26
- 'type' => 'preset',
27
- // We will bypass the plugin setting regarding where to store - we will store it cross-theme in wp_options
28
- 'setting_type' => 'option',
29
- // We will force this setting id preventing prefixing and other regular processing.
30
- 'setting_id' => 'sm_color_palette',
31
- // We don't want to refresh the preview window, even though we have no direct effect on it through this field.
32
- 'live' => true,
33
- 'label' => __( 'Select a color palette:', 'customify' ),
34
- 'desc' => __( 'Conveniently change the design of your site with color palettes. Easy as pie.', 'customify' ),
35
- 'default' => 'lilac',
36
- 'choices_type' => 'color_palette',
37
- 'choices' => array(
38
- 'vasco' => array(
39
- 'label' => __( 'Vasco', 'customify' ),
40
- 'preview' => array(
41
- 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/vasco-theme-palette.jpg',
42
- ),
43
- 'options' => array(
44
- 'sm_color_primary' => '#38C3C8',
45
- 'sm_color_secondary' => '#F59828',
46
- 'sm_color_tertiary' => '#F59828',
47
- 'sm_dark_primary' => '#2b2b28',
48
- 'sm_dark_secondary' => '#2B3D39',
49
- 'sm_dark_tertiary' => '#65726F',
50
- 'sm_light_primary' => '#F5F6F1',
51
- 'sm_light_secondary' => '#FFFFFF',
52
- ),
53
- ),
54
- 'felt' => array(
55
- 'label' => __( 'Felt', 'customify' ),
56
- 'preview' => array(
57
- 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/felt-theme-palette.jpg',
58
- ),
59
- 'options' => array(
60
- 'sm_color_primary' => '#ff6000',
61
- 'sm_color_secondary' => '#FF9200',
62
- 'sm_color_tertiary' => '#FF9200',
63
- 'sm_dark_primary' => '#1C1C1C',
64
- 'sm_dark_secondary' => '#161616',
65
- 'sm_dark_tertiary' => '#161616',
66
- 'sm_light_primary' => '#FFFCFC',
67
- 'sm_light_secondary' => '#fff4e8',
68
- 'sm_light_tertiary' => '#fff4e8',
69
- ),
70
- ),
71
- 'julia' => array(
72
- 'label' => __( 'Julia', 'customify' ),
73
- 'preview' => array(
74
- 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/julia-theme-palette.jpg',
75
- ),
76
- 'options' => array(
77
- 'sm_color_primary' => '#3349B8',
78
- 'sm_color_secondary' => '#3393B8',
79
- 'sm_color_tertiary' => '#3393B8',
80
- 'sm_dark_primary' => '#161616',
81
- 'sm_dark_secondary' => '#383C50',
82
- 'sm_dark_tertiary' => '#383C50',
83
- 'sm_light_primary' => '#f7f6f5',
84
- 'sm_light_secondary' => '#e7f2f8',
85
- 'sm_light_tertiary' => '#e7f2f8',
86
- ),
87
- ),
88
- 'gema' => array(
89
- 'label' => __( 'Gema', 'customify' ),
90
- 'preview' => array(
91
- 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/gema-theme-palette.jpg',
92
- ),
93
- 'options' => array(
94
- 'sm_color_primary' => '#E03A3A',
95
- 'sm_color_secondary' => '#E03A3A',
96
- 'sm_color_tertiary' => '#E03A3A',
97
- 'sm_dark_primary' => '#000000',
98
- 'sm_dark_secondary' => '#000000',
99
- 'sm_dark_tertiary' => '#A3A3A1',
100
- 'sm_light_primary' => '#FFFFFF',
101
- 'sm_light_secondary' => '#FFFFFF',
102
- 'sm_light_tertiary' => '#FFFFFF',
103
- ),
104
- ),
105
- 'patch' => array(
106
- 'label' => __( 'Patch', 'customify' ),
107
- 'preview' => array(
108
- 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/patch-theme-palette.jpg',
109
- ),
110
- 'options' => array(
111
- 'sm_color_primary' => '#ffeb00',
112
- 'sm_color_secondary' => '#3200B2',
113
- 'sm_color_tertiary' => '#3200B2',
114
- 'sm_dark_primary' => '#171617',
115
- 'sm_dark_secondary' => '#3d3e40',
116
- 'sm_dark_tertiary' => '#b5b5b5',
117
- 'sm_light_primary' => '#FFFFFF',
118
- 'sm_light_secondary' => '#FFFFFF',
119
- 'sm_light_tertiary' => '#FFFFFF',
120
- ),
121
- ),
122
- 'silk' => array(
123
- 'label' => __( 'Silk', 'customify' ),
124
- 'preview' => array(
125
- 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/silk-theme-palette.jpg',
126
- ),
127
- 'options' => array(
128
- 'sm_color_primary' => '#A33B61',
129
- 'sm_color_secondary' => '#FCC9B0',
130
- 'sm_color_tertiary' => '#FCC9B0',
131
- 'sm_dark_primary' => '#000000',
132
- 'sm_dark_secondary' => '#000000',
133
- 'sm_dark_tertiary' => '#A3A3A1',
134
- 'sm_light_primary' => '#FFFFFF',
135
- 'sm_light_secondary' => '#FFFFFF',
136
- 'sm_light_tertiary' => '#FFFFFF',
137
- ),
138
- ),
139
- 'hive' => array(
140
- 'label' => __( 'Hive', 'customify' ),
141
- 'preview' => array(
142
- 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/hive-theme-palette.jpg',
143
- ),
144
- 'options' => array(
145
- 'sm_color_primary' => '#ffeb00',
146
- 'sm_color_secondary' => '#3200B2',
147
- 'sm_color_tertiary' => '#3200B2',
148
- 'sm_dark_primary' => '#171617',
149
- 'sm_dark_secondary' => '#171617',
150
- 'sm_dark_tertiary' => '#363636',
151
- 'sm_light_primary' => '#FFFFFF',
152
- 'sm_light_secondary' => '#FFFFFF',
153
- 'sm_light_tertiary' => '#FFFFFF',
154
- ),
155
- ),
156
- 'lilac' => array(
157
- 'label' => __( 'Lilac', 'customify' ),
158
- 'preview' => array(
159
- 'background_image_url' => 'http://pxgcdn.com/images/style-manager/color-palettes/lilac-palette.jpg',
160
- ),
161
- 'options' => array(
162
- 'sm_color_primary' => '#DD8CA9',
163
- 'sm_color_secondary' => '#8C9CDE',
164
- 'sm_color_tertiary' => '#8C9CDE',
165
- 'sm_dark_primary' => '#303030',
166
- 'sm_dark_secondary' => '#303030',
167
- 'sm_dark_tertiary' => '#A3A3A1',
168
- 'sm_light_primary' => '#ECEEED',
169
- 'sm_light_secondary' => '#FFE9E5',
170
- 'sm_light_tertiary' => '#FFE9E5',
171
- ),
172
- ),
173
- ),
174
- ),
175
- 'sm_palette_variation' => array(
176
- 'type' => 'radio',
177
- 'setting_type' => 'option',
178
- 'setting_id' => 'sm_palette_variation',
179
- 'label' => __( 'Palette Variation', 'customify' ),
180
- 'default' => 'color_dark_light',
181
- 'live' => true,
182
- 'choices' => array(
183
- 'color_dark_light' => __( 'Default', 'customify' ),
184
- 'dark_color_light' => __( 'Alt', 'customify' ),
185
-
186
- 'color_light_dark' => __( 'Dark', 'customify' ),
187
- 'light_color_dark' => __( 'Dark Alt', 'customify' ),
188
-
189
- 'light_dark_color' => __( 'Color', 'customify' ),
190
- 'dark_light_color' => __( 'Color Alt', 'customify' ),
191
- ),
192
- ),
193
- 'sm_color_primary' => array(
194
- 'type' => 'color',
195
- // We will bypass the plugin setting regarding where to store - we will store it cross-theme in wp_options
196
- 'setting_type' => 'option',
197
- // We will force this setting id preventing prefixing and other regular processing.
198
- 'setting_id' => 'sm_color_primary',
199
- // We don't want to refresh the preview window, even though we have no direct effect on it through this field.
200
- 'live' => true,
201
- 'label' => esc_html__( 'Color Primary', 'customify' ),
202
- 'default' => '#ffeb00',
203
- 'connected_fields' => array(),
204
- ),
205
- 'sm_color_secondary' => array(
206
- 'type' => 'color',
207
- 'setting_type' => 'option',
208
- 'setting_id' => 'sm_color_secondary',
209
- 'live' => true,
210
- 'label' => esc_html__( 'Color Secondary', 'customify' ),
211
- 'default' => '#00ecff',
212
- 'connected_fields' => array(),
213
- ),
214
- 'sm_color_tertiary' => array(
215
- 'type' => 'color',
216
- 'setting_type' => 'option',
217
- 'setting_id' => 'sm_color_tertiary',
218
- 'live' => true,
219
- 'label' => esc_html__( 'Color Tertiary', 'customify' ),
220
- 'default' => '#00ecff',
221
- 'connected_fields' => array(),
222
- ),
223
- 'sm_dark_primary' => array(
224
- 'type' => 'color',
225
- 'setting_type' => 'option',
226
- 'setting_id' => 'sm_dark_primary',
227
- 'live' => true,
228
- 'label' => esc_html__( 'Dark Primary', 'customify' ),
229
- 'default' => '#171617',
230
- 'connected_fields' => array(),
231
- ),
232
- 'sm_dark_secondary' => array(
233
- 'type' => 'color',
234
- 'setting_type' => 'option',
235
- 'setting_id' => 'sm_dark_secondary',
236
- 'live' => true,
237
- 'label' => esc_html__( 'Dark Secondary', 'customify' ),
238
- 'default' => '#383c50',
239
- 'connected_fields' => array(),
240
- ),
241
- 'sm_dark_tertiary' => array(
242
- 'type' => 'color',
243
- 'setting_type' => 'option',
244
- 'setting_id' => 'sm_dark_tertiary',
245
- 'live' => true,
246
- 'label' => esc_html__( 'Dark Tertiary', 'customify' ),
247
- 'default' => '#65726F',
248
- 'connected_fields' => array(),
249
- ),
250
- 'sm_light_primary' => array(
251
- 'type' => 'color',
252
- 'setting_type' => 'option',
253
- 'setting_id' => 'sm_light_primary',
254
- 'live' => true,
255
- 'label' => esc_html__( 'Light Primary', 'customify' ),
256
- 'default' => '#ffffff',
257
- 'connected_fields' => array(),
258
- ),
259
- 'sm_light_secondary' => array(
260
- 'type' => 'color',
261
- 'setting_type' => 'option',
262
- 'setting_id' => 'sm_light_secondary',
263
- 'live' => true,
264
- 'label' => esc_html__( 'Light Secondary', 'customify' ),
265
- 'default' => '#ffffff',
266
- 'connected_fields' => array(),
267
- ),
268
- 'sm_light_tertiary' => array(
269
- 'type' => 'color',
270
- 'setting_type' => 'option',
271
- 'setting_id' => 'sm_light_tertiary',
272
- 'live' => true,
273
- 'label' => esc_html__( 'Light Tertiary', 'customify' ),
274
- 'default' => '#ffffff',
275
- 'connected_fields' => array(),
276
- ),
277
- 'sm_swap_colors' => array(
278
- 'type' => 'button',
279
- 'setting_type' => 'option',
280
- 'setting_id' => 'sm_swap_colors',
281
- 'label' => __( 'Swap Colors', 'customify' ),
282
- 'action' => 'sm_swap_colors',
283
- ),
284
- 'sm_swap_dark_light' => array(
285
- 'type' => 'button',
286
- 'setting_type' => 'option',
287
- 'setting_id' => 'sm_swap_dark_light',
288
- 'label' => __( 'Swap Dark ⇆ Light', 'customify' ),
289
- 'action' => 'sm_swap_dark_light',
290
- ),
291
- 'sm_swap_colors_dark' => array(
292
- 'type' => 'button',
293
- 'setting_type' => 'option',
294
- 'setting_id' => 'sm_swap_colors_dark',
295
- 'label' => __( 'Swap Colors ⇆ Dark', 'customify' ),
296
- 'action' => 'sm_swap_colors_dark',
297
- ),
298
- 'sm_swap_secondary_colors_dark' => array(
299
- 'type' => 'button',
300
- 'setting_type' => 'option',
301
- 'setting_id' => 'sm_swap_secondary_colors_dark',
302
- 'label' => __( 'Swap Secondary Color ⇆ Secondary Dark', 'customify' ),
303
- 'action' => 'sm_swap_secondary_colors_dark',
304
- ),
305
- 'sm_advanced_toggle' => array(
306
- 'type' => 'button',
307
- 'setting_type' => 'option',
308
- 'setting_id' => 'sm_toggle_advanced_settings',
309
- 'label' => __( 'Toggle Advanced Settings', 'customify' ),
310
- 'action' => 'sm_toggle_advanced_settings',
311
- ),
312
- ),
313
- ) );
314
-
315
- return $config;
316
- }
317
-
318
- }
319
- add_filter( 'customify_filter_fields', 'mock_style_manager_section', 12, 1 );
320
-
321
- if ( ! function_exists('add_current_palette_control') ) {
322
-
323
- function add_current_palette_control( $config ) {
324
- // If the theme hasn't declared support for style manager, bail.
325
- if ( ! current_theme_supports( 'customizer_style_manager' ) ) {
326
- return $config;
327
- }
328
-
329
- if ( ! isset( $config['sections']['style_manager_section'] ) ) {
330
- $config['sections']['style_manager_section'] = array();
331
- }
332
-
333
- $current_palette = '';
334
- $current_palette_sets = array( 'current', 'next' );
335
-
336
- $master_color_controls_ids = get_all_master_color_controls_ids( $config['sections']['style_manager_section']['options'] );
337
-
338
- foreach ( $current_palette_sets as $set ) {
339
- $current_palette .= '<div class="colors ' . $set . '">';
340
- foreach ( $master_color_controls_ids as $setting_id ) {
341
- if ( ! empty( $config["sections"]["style_manager_section"]["options"][$setting_id]['connected_fields'] ) ) {
342
- $current_palette .=
343
- '<div class="color ' . $setting_id . '" data-setting="' . $setting_id . '">' . PHP_EOL .
344
- '<div class="fill"></div>' . PHP_EOL .
345
- '<div class="picker"><i></i></div>' . PHP_EOL .
346
- '</div>' . PHP_EOL;
347
- }
348
- }
349
- $current_palette .= '</div>';
350
- }
351
-
352
- // The section might be already defined, thus we merge, not replace the entire section config.
353
- $config['sections']['style_manager_section']['options'] = array(
354
- 'sm_current_palette' => array(
355
- 'type' => 'html',
356
- 'html' =>
357
- '<div class="palette-container">' . PHP_EOL .
358
- '<span class="customize-control-title">Current Color Palette:</span>' . PHP_EOL .
359
- '<span class="description customize-control-description">Choose a color palette to start with. Adjust its style using the variation buttons below.</span>' . PHP_EOL .
360
- '<div class="c-palette">' . PHP_EOL .
361
- $current_palette .
362
- '<div class="c-palette__overlay">' . PHP_EOL .
363
- '<div class="c-palette__label">' .
364
- '<div class="c-palette__name">' . 'Original Style' . '</div>' .
365
- '<div class="c-palette__control active" data-target="#_customize-input-sm_palette_variation_control-radio-color_dark_light">' .
366
- '<span class="dashicons dashicons-image-rotate"></span>' .
367
- '<div class="c-palette__tooltip">Light</div>' .
368
- '</div>' .
369
- '<div class="c-palette__control" data-target="#_customize-input-sm_palette_variation_control-radio-color_light_dark">' .
370
- '<span class="dashicons dashicons-image-filter"></span>'.
371
- '<div class="c-palette__tooltip">Dark</div>' .
372
- '</div>' .
373
- '<div class="c-palette__control" data-target="#_customize-input-sm_palette_variation_control-radio-light_dark_color">' .
374
- '<span class="dashicons dashicons-admin-appearance"></span>' .
375
- '<div class="c-palette__tooltip">Colorful</div>' .
376
- '</div>' .
377
- '</div>' . PHP_EOL .
378
- '</div>' . PHP_EOL .
379
- '</div>' . PHP_EOL .
380
- '</div>' . PHP_EOL .
381
- '<svg class="c-palette__blur" width="15em" height="15em" viewBox="0 0 15 15" xmlns="http://www.w3.org/2000/svg" version="1.1">' . PHP_EOL .
382
- '<defs>' . PHP_EOL .
383
- '<filter id="goo">' . PHP_EOL .
384
- '<feGaussianBlur in="SourceGraphic" stdDeviation="10" result="blur" />' . PHP_EOL .
385
- '<feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 50 -20" result="goo" />' . PHP_EOL .
386
- '<feBlend in="SourceGraphic" in2="goo" />' . PHP_EOL .
387
- '</filter>' . PHP_EOL .
388
- '</defs>' . PHP_EOL .
389
- '</svg>',
390
- ),
391
- ) + $config['sections']['style_manager_section']['options'];
392
-
393
- return $config;
394
- }
395
- }
396
- add_filter( 'customify_filter_fields', 'add_current_palette_control', 20, 1 );
397
-
398
- function get_all_master_color_controls_ids( $options ) {
399
- $master_color_controls = array();
400
-
401
- foreach ( $options as $option_id => $option_settings ) {
402
- if ( 'color' === $option_settings['type'] ) {
403
- $master_color_controls[] = $option_id;
404
- }
405
- }
406
-
407
- return $master_color_controls;
408
- }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
plugin-config.php CHANGED
@@ -11,10 +11,6 @@ $debug = true;
11
 
12
  $customify_config = require $basepath . 'customify_config.php';
13
 
14
- // Load our mock customizer section
15
- // @todo Remove this at some point.
16
- require_once $basepath . 'mock_style_manager_config.php';
17
-
18
  return array(
19
  'plugin-name' => 'pixcustomify',
20
  'settings-key' => 'pixcustomify_settings',
11
 
12
  $customify_config = require $basepath . 'customify_config.php';
13
 
 
 
 
 
14
  return array(
15
  'plugin-name' => 'pixcustomify',
16
  'settings-key' => 'pixcustomify_settings',
readme.txt CHANGED
@@ -3,7 +3,7 @@ Contributors: pixelgrade, euthelup, babbardel, vlad.olaru, cristianfrumusanu, ra
3
  Tags: customizer, css, editor, live, preview, customizer
4
  Requires at least: 4.7.0
5
  Tested up to: 4.9.5
6
- Stable tag: 1.6.5
7
  License: GPLv2 or later
8
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
 
@@ -45,6 +45,10 @@ With [Customify](https://github.com/pixelgrade/customify), developers can easily
45
 
46
  == Changelog ==
47
 
 
 
 
 
48
  = 1.6.5 =
49
  * Added **Color Palettes Variations** to the Style Manager Customizer section
50
  * Improved Color Palettes logic to better handle differences between various color palettes
3
  Tags: customizer, css, editor, live, preview, customizer
4
  Requires at least: 4.7.0
5
  Tested up to: 4.9.5
6
+ Stable tag: 1.7.0
7
  License: GPLv2 or later
8
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
 
45
 
46
  == Changelog ==
47
 
48
+ = 1.7.0 =
49
+ * Added **Dynamic Color Palettes** for a smoother experience
50
+ * Fixed issue with the Style Manager crashing the Customizer when not using a theme with support for it.
51
+
52
  = 1.6.5 =
53
  * Added **Color Palettes Variations** to the Style Manager Customizer section
54
  * Improved Color Palettes logic to better handle differences between various color palettes
scss/_feedback-modal.scss ADDED
@@ -0,0 +1,439 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /* ==========================================================================
2
+ #FEEDBACK MODAL
3
+ ========================================================================== */
4
+
5
+ // Modals
6
+ $zindex-modal: 1050 !default;
7
+ $zindex-modal-backdrop: 1040 !default;
8
+ $white: #fff !default;
9
+ $black: #000 !default;
10
+ $gray-200: #e9ecef !default;
11
+ $purple-light: #9660C6 !default;
12
+
13
+ // Padding applied to the modal body
14
+ $modal-inner-padding: 30px !default;
15
+
16
+ $modal-dialog-margin: 10px !default;
17
+ $modal-dialog-margin-y-sm-up: 30px !default;
18
+
19
+ $modal-title-line-height: 1.5 !default;
20
+
21
+ $modal-content-bg: $white !default;
22
+ $modal-content-border-color: rgba($black,.2) !default;
23
+ $modal-content-border-width: 1px;
24
+ $modal-backdrop-bg: #000 !default;
25
+ $modal-backdrop-opacity: .8 !default;
26
+ $modal-header-border-color: $gray-200 !default;
27
+ $modal-footer-border-color: $modal-header-border-color !default;
28
+ $modal-header-border-width: $modal-content-border-width !default;
29
+ $modal-footer-border-width: $modal-header-border-width !default;
30
+ $modal-header-padding: 48px !default;
31
+
32
+ $modal-lg: 800px !default;
33
+ $modal-md: 655px !default;
34
+ $modal-sm: 300px !default;
35
+
36
+ $modal-transition: transform .3s ease-out !default;
37
+
38
+ // .modal-open - body class for killing the scroll
39
+ // .modal - container to scroll within
40
+ // .modal-dialog - positioning shell for the actual modal
41
+ // .modal-content - actual modal w/ bg and corners and stuff
42
+
43
+
44
+ // Kill the scroll on the body
45
+ body.modal-open {
46
+ overflow: hidden;
47
+ }
48
+
49
+ body.modal-open
50
+ #style-manager-user-feedback-modal
51
+ .modal {
52
+ overflow-x: hidden;
53
+ overflow-y: auto;
54
+ visibility: visible;
55
+ opacity: 1;
56
+
57
+ transform: translate(0, 0);
58
+ }
59
+
60
+ #style-manager-user-feedback-modal {
61
+ height: 100%;
62
+ // Container that the modal scrolls within
63
+ .modal {
64
+ position: relative;
65
+ height: 100%;
66
+ display: flex;
67
+ align-items: center;
68
+
69
+ top: 0;
70
+ right: 0;
71
+ bottom: 0;
72
+ left: 0;
73
+ z-index: $zindex-modal;
74
+ // display: none;
75
+ opacity: 0;
76
+ visibility: hidden;
77
+ overflow: hidden;
78
+ // Prevent Chrome on Windows from adding a focus outline. For details, see
79
+ // https://github.com/twbs/bootstrap/pull/10951.
80
+ outline: 0;
81
+ // We deliberately don't use `-webkit-overflow-scrolling: touch;` due to a
82
+ // gnarly iOS Safari bug: https://bugs.webkit.org/show_bug.cgi?id=158342
83
+ // See also https://github.com/twbs/bootstrap/issues/17695
84
+
85
+ // When fading in the modal, animate it to slide down
86
+ transition: all .3s ease;
87
+ transform: translate(0, -10%);
88
+
89
+ // Font Styling
90
+ font-family: 'Galano Grotesque Alt', -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
91
+ font-weight: 400;
92
+ font-size: 16px;
93
+ line-height: 1.7;
94
+ }
95
+
96
+ // Shell div to position the modal with bottom padding
97
+ .modal-dialog {
98
+ position: relative;
99
+ width: auto;
100
+ margin: $modal-dialog-margin;
101
+ text-align: left;
102
+ }
103
+
104
+ // Actual modal
105
+ .modal-content {
106
+ position: relative;
107
+ display: flex;
108
+ flex-direction: column;
109
+ background-color: $modal-content-bg;
110
+ background-clip: padding-box;
111
+ border: none;
112
+ border-radius: 4px;
113
+ box-shadow: 0 4px 4px 0 rgba(42, 54, 52, 0.10), 0 8px 8px 0 rgba(42, 54, 52, 0.10), 0 16px 16px 0 rgba(42, 54, 52, 0.10), 0 16px 32px 0 rgba(42, 54, 52, 0.10), 0 32px 64px 0 rgba(42, 54, 52, 0.10), 0 64px 128px 0 rgba(42, 54, 52, 0.10);
114
+ // Remove focus outline from opened modal
115
+ outline: 0;
116
+
117
+ p {
118
+ color: $black;
119
+ }
120
+
121
+ p a {
122
+ font-weight: 500;
123
+ color: $purple-light;
124
+ border-bottom: 1px solid $purple-light;
125
+ }
126
+
127
+ > form {
128
+ margin-bottom: 20px;
129
+ }
130
+ }
131
+
132
+ // Modal background
133
+ .modal-backdrop {
134
+ position: fixed;
135
+ top: 0;
136
+ right: 0;
137
+ bottom: 0;
138
+ left: 0;
139
+ z-index: $zindex-modal-backdrop;
140
+ background-color: $modal-backdrop-bg;
141
+
142
+ opacity: 0;
143
+ visibility: hidden;
144
+
145
+ transition: all 0.3s ease;
146
+
147
+ .modal-open
148
+ & {
149
+ opacity: $modal-backdrop-opacity;
150
+ visibility: visible;
151
+ }
152
+ }
153
+
154
+ // Modal header
155
+ // Top section of the modal w/ title and dismiss
156
+ .modal-header {
157
+ display: flex;
158
+ align-items: flex-start; // vertically center it
159
+ justify-content: space-between; // Put modal header elements (title and dismiss) on opposite ends
160
+ // padding: $modal-header-padding $modal-header-padding 0 $modal-header-padding; // Old
161
+ padding: $modal-inner-padding $modal-header-padding $modal-dialog-margin $modal-header-padding;
162
+ // border-bottom: $modal-header-border-width solid $modal-header-border-color;
163
+
164
+ .close {
165
+ &.button {
166
+ top: -10px;
167
+ }
168
+
169
+ &.icon {
170
+ opacity: 0.5;
171
+ }
172
+
173
+ &:hover {
174
+ opacity: 1;
175
+ }
176
+ }
177
+ }
178
+
179
+ // Title text within header
180
+ .modal-title {
181
+ margin-bottom: $modal-dialog-margin;
182
+ line-height: $modal-title-line-height;
183
+
184
+ &.modal-title--small {
185
+ font-weight: 500;
186
+ }
187
+ }
188
+
189
+ // Modal body
190
+ // Where all modal content resides (sibling of .modal-header and .modal-footer)
191
+ .modal-body {
192
+ position: relative;
193
+ // Enable `flex-grow: 1` so that the body take up as much space as possible
194
+ // when should there be a fixed height on `.modal-dialog`.
195
+ flex: 1 1 auto;
196
+ padding: $modal-inner-padding $modal-inner-padding 0 $modal-inner-padding;
197
+
198
+ // Variations for Cancel Subscription Screen
199
+ &.full {
200
+ padding: 0;
201
+
202
+ .box {
203
+ padding-top: 0;
204
+ padding-bottom: 0;
205
+ margin-top: 0;
206
+ }
207
+
208
+ + .modal-footer.full {
209
+ .box {
210
+ padding-top: 18px;
211
+ }
212
+ }
213
+ }
214
+ }
215
+
216
+ // Footer (for actions)
217
+ .modal-footer {
218
+ padding: $modal-inner-padding;
219
+ text-align: center;
220
+
221
+ // Variations for Cancel Subscription Screen
222
+ .box {
223
+
224
+ .button:last-child {
225
+ margin-bottom: 0;
226
+ }
227
+ }
228
+
229
+ &.full {
230
+ padding: 0;
231
+ }
232
+ }
233
+
234
+ // Measure scrollbar width for padding body during modal show/hide
235
+ .modal-scrollbar-measure {
236
+ position: absolute;
237
+ top: -9999px;
238
+ width: 50px;
239
+ height: 50px;
240
+ overflow: scroll;
241
+ }
242
+
243
+ .modal-state {
244
+ display: none;
245
+ }
246
+
247
+ // Show/Hide Modal
248
+ .modal-state:checked + .modal {
249
+ // display: block;
250
+ opacity: 1;
251
+ visibility: visible;
252
+ }
253
+
254
+ .modal-state:checked + .modal .modal__inner {
255
+ top: 0;
256
+ }
257
+ }
258
+
259
+ // Scale up the modal
260
+ @media (min-width: 576px) {
261
+ #style-manager-user-feedback-modal {
262
+ // Automatically set modal's width for larger viewports
263
+ .modal-dialog {
264
+ max-width: $modal-md;
265
+ margin: $modal-dialog-margin-y-sm-up auto;
266
+ }
267
+
268
+ .modal-content {
269
+ // box-shadow: $modal-content-box-shadow-xs;
270
+ }
271
+
272
+ .modal-sm {
273
+ max-width: $modal-sm;
274
+ }
275
+ }
276
+ }
277
+
278
+ @media (min-width: 576px) {
279
+ #style-manager-user-feedback-modal {
280
+ .modal-lg {
281
+ max-width: $modal-lg;
282
+ }
283
+ }
284
+ }
285
+
286
+ // Specific Styling for Feedback Modal
287
+ #style-manager-user-feedback {
288
+ .modal-body {
289
+ .box {
290
+ position: relative;
291
+ flex-direction: column;
292
+ display: flex;
293
+ flex-wrap: nowrap;
294
+ align-items: center;
295
+ margin: 20px 0;
296
+ padding: 16px 52px;
297
+ border-radius: 4px;
298
+
299
+ > * {
300
+ width: 100%;
301
+ }
302
+ }
303
+
304
+ p {
305
+ font-size: 16px;
306
+ margin-bottom: 20px;
307
+ }
308
+
309
+ textarea {
310
+ width: 100%;
311
+ margin: 0;
312
+ padding: 11px 18px;
313
+ border: 1px solid #dddddd;
314
+ border-radius: 4px;
315
+ box-shadow: none;
316
+ font-family: 'Galano Grotesque Alt', -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
317
+ font-size: 16px;
318
+ line-height: 26px;
319
+ color: #473850;
320
+ }
321
+ }
322
+
323
+ .modal-title {
324
+ margin-top: 0;
325
+ margin-bottom: 34px;
326
+
327
+ font-family: 'Galano Classic', -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
328
+ font-weight: 600;
329
+ font-size: 28px;
330
+ line-height: 1.4;
331
+ text-align: center;
332
+ }
333
+
334
+
335
+ // Button Style
336
+ .button {
337
+ text-decoration: none;
338
+ cursor: pointer;
339
+ -webkit-font-smoothing: antialiased;
340
+ position: relative;
341
+ transition-duration: .2s;
342
+ transition-timing-function: cubic-bezier(0, 0, 0.58, 1);
343
+ transition-property: transform,background,background-color,color,box-shadow;
344
+
345
+ display: inline-block;
346
+ padding: 15px 50px;
347
+ border-radius: 2px;
348
+ font-family: "Galano Classic", -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
349
+ font-size: 16px;
350
+ line-height: 23px;
351
+ font-weight: 600;
352
+ text-align: center;
353
+ background-color: #9660c6;
354
+ color: #ffffff;
355
+ border-radius: 4px;
356
+
357
+ box-shadow: none;
358
+ height: auto;
359
+ width: 100%;
360
+ margin-top: 20px;
361
+
362
+ &:hover {
363
+ background-color: #9660c6;
364
+ color: #ffffff;
365
+ transform: scale(1.05) translateY(-3px);
366
+ box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.7);
367
+ }
368
+ }
369
+
370
+ // Steps
371
+ .first-step {
372
+
373
+ }
374
+
375
+ .second-step {
376
+ margin-top: 18px;
377
+ }
378
+
379
+ .thanks-step,
380
+ .error-step {
381
+ text-align: center;
382
+
383
+ .modal-title {
384
+ margin-bottom: 0;
385
+ }
386
+
387
+ p:last-child {
388
+ margin-bottom: 10px;
389
+ }
390
+ }
391
+ }
392
+
393
+ // Scorecard System
394
+ .scorecard {
395
+ display: flex;
396
+ align-items: baseline;
397
+ justify-content: space-evenly;
398
+
399
+ color: $purple-light;
400
+ font-family: "Galano Classic", -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
401
+ font-size: 18px;
402
+ font-weight: 600;
403
+ text-align: center;
404
+
405
+
406
+ > span {
407
+ // line-height: 39px;
408
+ }
409
+
410
+ > label {
411
+ font-size: 20px;
412
+
413
+ span {
414
+ display: block;
415
+ width: 46px;
416
+ border: 2px solid $purple-light;
417
+ line-height: 46px;
418
+ border-radius: 100%;
419
+ background: #FFF;
420
+
421
+ transition: all 0.25s ease;
422
+
423
+ &:hover {
424
+
425
+ }
426
+ }
427
+
428
+ input[type="radio"] {
429
+ display: none;
430
+ }
431
+
432
+ span:hover,
433
+ input[type="radio"]:checked ~ span {
434
+ background: $purple-light;
435
+ color: #FFF;
436
+ }
437
+ }
438
+ }
439
+
scss/customizer.scss CHANGED
@@ -1489,6 +1489,7 @@ li#customize-control-site_logo {
1489
 
1490
  @import 'theme';
1491
  @import 'balloon';
 
1492
 
1493
 
1494
 
@@ -1958,7 +1959,7 @@ $palette_box_shadow_stronger: inset 0 2px 3px 0 rgba(0,0,0,0.15), inset 0 0 3px
1958
  }
1959
  }
1960
 
1961
- [id*="sm_current_palette_control"] {
1962
  .customize-inside-control-row .palette__item[class] {
1963
  transform: none;
1964
  }
@@ -1974,47 +1975,53 @@ $palette_box_shadow_stronger: inset 0 2px 3px 0 rgba(0,0,0,0.15), inset 0 0 3px
1974
  }
1975
  }
1976
 
1977
- #customize-control-sm_color_palette_control {
 
 
 
 
 
 
 
 
 
1978
 
1979
- ~ li[id*="sm_color_"],
1980
- ~ li[id*="sm_dark_"],
1981
- ~ li[id*="sm_light_"] {
1982
- visibility: hidden;
1983
 
1984
- > span {
1985
- display: none;
1986
- }
 
1987
 
1988
- .wp-picker-input-wrap,
1989
- .wp-picker-holder {
1990
- visibility: visible;
1991
- }
1992
 
1993
- .wp-picker-container {
1994
- width: 100%;
1995
- float: left;
1996
  //border-radius: 50%;
 
1997
 
1998
- button {
1999
- //width: 100px;
2000
- //height: 100px;
2001
- //border-radius: 50%;
2002
- //border: 4px solid #CCC;
2003
-
2004
- &:before {
2005
- content: "";
2006
- position: relative;
2007
- display: block;
2008
- visibility: visible;
2009
- background-color: inherit;
2010
- width: 90px;
2011
- height: 90px;
2012
- border-radius: 50%;
2013
- border: 3px solid #DDD;
2014
- }
2015
  }
2016
  }
2017
  }
 
 
 
2018
 
2019
  $x: 70px;
2020
  $y: 54px;
@@ -2161,6 +2168,7 @@ $palette_border-radius: 5px;
2161
  left: 50%;
2162
 
2163
  width: 80%;
 
2164
  margin-top: 1em;
2165
 
2166
  border-radius: 50%;
@@ -2349,7 +2357,7 @@ $animation-duration: 1s;
2349
  display: none;
2350
  }
2351
 
2352
- #customize-theme-controls [id*="sm_current_palette_control"] {
2353
  display: block;
2354
  margin: -12px -12px 19px;
2355
  width: auto;
@@ -2426,7 +2434,30 @@ $animation-duration: 1s;
2426
  top: 100%;
2427
  left: 0;
2428
  z-index: 100;
 
2429
  margin-top: 1em;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
2430
  }
2431
 
2432
  .color {
@@ -2494,3 +2525,7 @@ $animation-duration: 1s;
2494
  width: 100%;
2495
  }
2496
  }
 
 
 
 
1489
 
1490
  @import 'theme';
1491
  @import 'balloon';
1492
+ @import 'feedback-modal';
1493
 
1494
 
1495
 
1959
  }
1960
  }
1961
 
1962
+ [id*="sm_current_color_palette_control"] {
1963
  .customize-inside-control-row .palette__item[class] {
1964
  transform: none;
1965
  }
1975
  }
1976
  }
1977
 
1978
+ [id="customize-control-sm_color_primary_control"],
1979
+ [id="customize-control-sm_dark_primary_control"],
1980
+ [id="customize-control-sm_light_primary_control"],
1981
+ [id="customize-control-sm_color_secondary_control"],
1982
+ [id="customize-control-sm_dark_secondary_control"],
1983
+ [id="customize-control-sm_light_secondary_control"],
1984
+ [id="customize-control-sm_color_tertiary_control"],
1985
+ [id="customize-control-sm_dark_tertiary_control"],
1986
+ [id="customize-control-sm_light_tertiary_control"] {
1987
+ visibility: hidden;
1988
 
1989
+ > span {
1990
+ display: none;
1991
+ }
 
1992
 
1993
+ .wp-picker-input-wrap,
1994
+ .wp-picker-holder {
1995
+ visibility: visible;
1996
+ }
1997
 
1998
+ .wp-picker-container {
1999
+ width: 100%;
2000
+ float: left;
2001
+ //border-radius: 50%;
2002
 
2003
+ button {
2004
+ //width: 100px;
2005
+ //height: 100px;
2006
  //border-radius: 50%;
2007
+ //border: 4px solid #CCC;
2008
 
2009
+ &:before {
2010
+ content: "";
2011
+ position: relative;
2012
+ display: block;
2013
+ visibility: visible;
2014
+ background-color: inherit;
2015
+ width: 90px;
2016
+ height: 90px;
2017
+ border-radius: 50%;
2018
+ border: 3px solid #DDD;
 
 
 
 
 
 
 
2019
  }
2020
  }
2021
  }
2022
+ }
2023
+
2024
+ #customize-control-sm_color_palette_control {
2025
 
2026
  $x: 70px;
2027
  $y: 54px;
2168
  left: 50%;
2169
 
2170
  width: 80%;
2171
+ max-width: 3em;
2172
  margin-top: 1em;
2173
 
2174
  border-radius: 50%;
2357
  display: none;
2358
  }
2359
 
2360
+ #customize-theme-controls [id*="sm_current_color_palette_control"] {
2361
  display: block;
2362
  margin: -12px -12px 19px;
2363
  width: auto;
2434
  top: 100%;
2435
  left: 0;
2436
  z-index: 100;
2437
+
2438
  margin-top: 1em;
2439
+ border: 0;
2440
+
2441
+ box-shadow: black 0 3px 12px -4px;
2442
+
2443
+ .iris-square-handle {
2444
+ border-color: transparent;
2445
+ left: -6px;
2446
+ top: -6px;
2447
+
2448
+ &:after {
2449
+ position: absolute;
2450
+ bottom: 0;
2451
+ right: 0;
2452
+ left: 0;
2453
+ top: 0;
2454
+ border: 2px solid white;
2455
+ }
2456
+ }
2457
+
2458
+ .iris-square-value {
2459
+ box-shadow: none !important;
2460
+ }
2461
  }
2462
 
2463
  .color {
2525
  width: 100%;
2526
  }
2527
  }
2528
+
2529
+ //.wp-full-overlay-sidebar {
2530
+ // overflow: hidden;
2531
+ //}