SiteOrigin CSS - Version 1.2.5

Version Description

  • 05 February 2020 =
  • Removed themeCSS localized script to prevent preg_replace() warning.
  • Minor form styling fixes.
  • Updated CSS NPM library.
  • Rebuilt minified files using new build script.
Download this release

Release Info

Developer gpriday
Plugin Icon 128x128 SiteOrigin CSS
Version 1.2.5
Comparing to
See all releases

Code changes from version 1.2.4 to 1.2.5

Files changed (46) hide show
  1. css/admin.css +645 -645
  2. css/admin.less +0 -754
  3. css/inspector.css +1 -1
  4. css/inspector.less +0 -252
  5. css/mixins.less +0 -189
  6. js/URI.min.js +13 -1
  7. js/css.js +3119 -2185
  8. js/css.min.js +1 -2
  9. js/csslint.min.js +46 -4
  10. js/editor.js +1820 -1820
  11. js/editor.min.js +1 -1
  12. js/inspector.js +488 -488
  13. js/inspector.min.js +1 -1
  14. js/jquery.sizes.min.js +8 -1
  15. js/specificity.min.js +1 -1
  16. lang/so-css.pot +93 -93
  17. lib/codemirror/addon/dialog/dialog.css +32 -32
  18. lib/codemirror/addon/dialog/dialog.js +157 -157
  19. lib/codemirror/addon/dialog/dialog.min.js +1 -1
  20. lib/codemirror/addon/fold/brace-fold.min.js +1 -1
  21. lib/codemirror/addon/fold/comment-fold.min.js +1 -1
  22. lib/codemirror/addon/fold/foldcode.min.js +1 -1
  23. lib/codemirror/addon/fold/foldgutter.min.js +1 -1
  24. lib/codemirror/addon/fold/indent-fold.min.js +1 -1
  25. lib/codemirror/addon/fold/markdown-fold.min.js +1 -1
  26. lib/codemirror/addon/fold/xml-fold.min.js +1 -1
  27. lib/codemirror/addon/hint/anyword-hint.min.js +1 -1
  28. lib/codemirror/addon/hint/css-hint.min.js +1 -1
  29. lib/codemirror/addon/hint/html-hint.min.js +1 -1
  30. lib/codemirror/addon/hint/javascript-hint.min.js +1 -1
  31. lib/codemirror/addon/hint/show-hint.min.js +1 -1
  32. lib/codemirror/addon/hint/sql-hint.min.js +1 -1
  33. lib/codemirror/addon/hint/xml-hint.min.js +1 -1
  34. lib/codemirror/addon/lint/coffeescript-lint.min.js +1 -1
  35. lib/codemirror/addon/lint/css-lint.min.js +1 -1
  36. lib/codemirror/addon/lint/html-lint.min.js +1 -1
  37. lib/codemirror/addon/lint/javascript-lint.min.js +1 -1
  38. lib/codemirror/addon/lint/json-lint.min.js +1 -1
  39. lib/codemirror/addon/lint/lint.min.js +1 -1
  40. lib/codemirror/addon/lint/yaml-lint.min.js +1 -1
  41. lib/codemirror/addon/merge/merge.min.js +1 -1
  42. lib/codemirror/addon/scroll/annotatescrollbar.js +122 -122
  43. lib/codemirror/addon/scroll/annotatescrollbar.min.js +1 -1
  44. lib/codemirror/addon/search/jump-to-line.js +49 -49
  45. lib/codemirror/addon/search/jump-to-line.min.js +1 -1
  46. lib/codemirror/addon/search/match-highlighter.js +0 -16
css/admin.css CHANGED
@@ -1,645 +1,645 @@
1
- #siteorigin-custom-css {
2
- color: #333;
3
- margin: 0 0 0 -20px;
4
- }
5
- #siteorigin-custom-css h2 {
6
- background: #f8f8f8;
7
- padding: 20px;
8
- border-bottom: 1px solid #d0d0d0;
9
- margin-bottom: 20px;
10
- box-shadow: 0 1px 1px rgba(0, 0, 0, 0.035);
11
- }
12
- #siteorigin-custom-css h2 .icon {
13
- width: 40px;
14
- height: auto;
15
- margin: -8px 10px -8px 0;
16
- }
17
- #siteorigin-custom-css .notice {
18
- margin: 0 20px 20px 20px;
19
- }
20
- #siteorigin-custom-css #poststuff {
21
- padding: 0 20px;
22
- }
23
- #siteorigin-custom-css #poststuff .postbox {
24
- border: 1px solid #D0D0D0;
25
- }
26
- #siteorigin-custom-css #poststuff .postbox h3.hndle {
27
- cursor: default;
28
- border-bottom: 1px solid #D0D0D0;
29
- background: #efefef;
30
- position: relative;
31
- }
32
- #siteorigin-custom-css #poststuff .postbox h3.hndle .hide {
33
- position: absolute;
34
- top: 50%;
35
- line-height: 1em;
36
- margin-top: -0.5em;
37
- right: 12px;
38
- }
39
- #siteorigin-custom-css #poststuff #so-custom-css-getting-started .inside {
40
- padding: 0 6px 6px 6px;
41
- }
42
- #siteorigin-custom-css #poststuff #so-custom-css-getting-started .inside img {
43
- display: block;
44
- width: 100%;
45
- height: auto;
46
- }
47
- #so-custom-css-form {
48
- margin-right: 340px;
49
- }
50
- #so-custom-css-info {
51
- width: 315px;
52
- float: right;
53
- }
54
- #so-custom-css-info *:first-child {
55
- margin-top: 0;
56
- }
57
- #so-custom-css-info *:last-child {
58
- margin-bottom: 0;
59
- }
60
- #so-custom-css-revisions ol {
61
- list-style: none;
62
- margin: 0;
63
- }
64
- #so-custom-css-revisions ol li {
65
- margin: 0;
66
- line-height: 2.2em;
67
- }
68
- #so-custom-css-form .custom-css-preview iframe,
69
- #so-custom-css-form .custom-css-preview #preview-navigator {
70
- display: none;
71
- }
72
- #so-custom-css-form .custom-css-toolbar {
73
- border: 1px solid #D0D0D0;
74
- border-bottom: none;
75
- background: #efefef;
76
- padding: 8px 10px;
77
- overflow: auto;
78
- }
79
- #so-custom-css-form .custom-css-toolbar .toolbar-function-buttons {
80
- float: left;
81
- }
82
- #so-custom-css-form .custom-css-toolbar .toolbar-function-buttons .toolbar-functions-dropdown {
83
- display: none;
84
- }
85
- #so-custom-css-form .custom-css-toolbar .toolbar-function-buttons ul.toolbar-buttons {
86
- margin: 0;
87
- }
88
- #so-custom-css-form .custom-css-toolbar .toolbar-function-buttons ul.toolbar-buttons li {
89
- display: inline-block;
90
- margin: 0;
91
- padding: 0;
92
- }
93
- #so-custom-css-form .custom-css-toolbar .toolbar-action-buttons {
94
- float: right;
95
- }
96
- #so-custom-css-form .custom-css-toolbar .toolbar-action-buttons a.active {
97
- border-color: #b4c4cf;
98
- background-color: #e9f9ff;
99
- color: #596872;
100
- }
101
- #so-custom-css-form .custom-css-toolbar .toolbar-action-buttons .editor-expand {
102
- float: right;
103
- text-decoration: none;
104
- color: #666;
105
- }
106
- #so-custom-css-form .custom-css-toolbar .toolbar-action-buttons .editor-expand .fa-compress {
107
- display: none;
108
- }
109
- #so-custom-css-form .custom-css-toolbar .fa {
110
- font-size: 14px;
111
- }
112
- #so-custom-css-form .custom-css-container {
113
- border: 1px solid #D0D0D0;
114
- background: #f7f7f7;
115
- cursor: text;
116
- overflow: hidden;
117
- }
118
- #so-custom-css-form .custom-css-container .CodeMirror {
119
- height: auto;
120
- }
121
- #so-custom-css-form .custom-css-container .CodeMirror-scroll {
122
- min-height: 300px;
123
- }
124
- #so-custom-css-form .custom-css-container .CodeMirror-lines {
125
- padding: 8px 0 8px 0;
126
- }
127
- #so-custom-css-form .custom-css-container textarea {
128
- border: 0;
129
- padding: 8px 0 8px 4px;
130
- width: 100%;
131
- min-height: 300px;
132
- display: block;
133
- font-family: monospace;
134
- font-size: 13px;
135
- line-height: 1.4em;
136
- border-left: 1px solid #ddd;
137
- margin-left: 16px;
138
- }
139
- #so-custom-css-form .decoration {
140
- display: none;
141
- }
142
- #so-custom-css-form.expanded {
143
- z-index: 100000;
144
- position: fixed;
145
- top: 0;
146
- left: 0;
147
- bottom: 0;
148
- width: 340px;
149
- }
150
- #so-custom-css-form.expanded .custom-css-toolbar .editor-expand .fa-expand {
151
- display: none;
152
- }
153
- #so-custom-css-form.expanded .custom-css-toolbar .editor-expand .fa-compress {
154
- display: inline-block;
155
- }
156
- #so-custom-css-form.expanded .decoration {
157
- display: block;
158
- position: absolute;
159
- top: 0;
160
- bottom: 0;
161
- left: 339px;
162
- width: 2px;
163
- background: rgba(0, 0, 0, 0.1);
164
- }
165
- #so-custom-css-form.expanded .description {
166
- display: none;
167
- }
168
- #so-custom-css-form.expanded .submit {
169
- display: none;
170
- }
171
- #so-custom-css-form.expanded .custom-css-preview {
172
- position: fixed;
173
- display: block;
174
- top: 40px;
175
- right: 0;
176
- bottom: 0;
177
- left: 340px;
178
- background: #ffffff;
179
- }
180
- #so-custom-css-form.expanded .custom-css-preview #preview-navigator {
181
- display: block;
182
- -ms-box-sizing: border-box;
183
- -moz-box-sizing: border-box;
184
- -webkit-box-sizing: border-box;
185
- box-sizing: border-box;
186
- padding: 6px 10px;
187
- position: absolute;
188
- width: 100%;
189
- height: 40px;
190
- top: -40px;
191
- background: #bbb;
192
- background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #bbb), color-stop(1, #eee));
193
- background: -ms-linear-gradient(bottom, #bbb, #eee);
194
- background: -moz-linear-gradient(center bottom, #bbb 0%, #eee 100%);
195
- background: -o-linear-gradient(#eee, #bbb);
196
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eee', endColorstr='#bbb', GradientType=0);
197
- border-bottom: 1px solid #888;
198
- }
199
- #so-custom-css-form.expanded .custom-css-preview #preview-navigator input {
200
- width: 100%;
201
- border: 1px solid #888;
202
- border-radius: 2px;
203
- color: #444;
204
- -webkit-box-shadow: inset 2px 2px 2px rgba( 0,0,0,0.1 );
205
- -moz-box-shadow: inset 2px 2px 2px rgba( 0,0,0,0.1 );
206
- box-shadow: inset 2px 2px 2px rgba( 0,0,0,0.1 );
207
- }
208
- #so-custom-css-form.expanded .custom-css-preview #preview-iframe {
209
- display: block;
210
- width: 100%;
211
- height: 100%;
212
- overflow-x: hidden;
213
- }
214
- #so-custom-css-properties {
215
- display: none;
216
- position: fixed;
217
- top: 0;
218
- left: -338px;
219
- bottom: 0;
220
- width: 338px;
221
- background: #ffffff;
222
- border: 1px solid #D0D0D0;
223
- overflow-y: auto;
224
- z-index: 100000;
225
- }
226
- #so-custom-css-properties .toolbar {
227
- display: block;
228
- padding: 7px 10px;
229
- border-bottom: 1px solid #aaa;
230
- background: #F6F6F6;
231
- text-align: left;
232
- }
233
- #so-custom-css-properties .toolbar select {
234
- line-height: 1;
235
- font-size: 13px;
236
- max-width: 265px;
237
- -webkit-transition: all 0.5s ease;
238
- -moz-transition: all 0.5s ease;
239
- -o-transition: all 0.5s ease;
240
- transition: all 0.5s ease;
241
- }
242
- #so-custom-css-properties .toolbar select.highlighted {
243
- background: #daeaf7;
244
- }
245
- #so-custom-css-properties .toolbar .close {
246
- float: right;
247
- margin: 2px 4px 0 0;
248
- }
249
- #so-custom-css-properties .section-tabs {
250
- list-style: none;
251
- height: auto;
252
- margin: 0;
253
- box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
254
- }
255
- #so-custom-css-properties .section-tabs li {
256
- box-sizing: border-box;
257
- float: left;
258
- width: 33.333%;
259
- padding: 10px 7px;
260
- border: 1px solid #aaa;
261
- background: #F6F6F6;
262
- font-weight: bold;
263
- border-top: 0;
264
- border-left: 0;
265
- font-size: 13px;
266
- line-height: 1em;
267
- cursor: pointer;
268
- white-space: nowrap;
269
- overflow: hidden;
270
- color: #666;
271
- }
272
- #so-custom-css-properties .section-tabs li:hover {
273
- background: #fff;
274
- }
275
- #so-custom-css-properties .section-tabs li .fa {
276
- float: left;
277
- display: block;
278
- margin: -1px 6px -1px 0;
279
- font-size: 15px;
280
- color: #666;
281
- }
282
- #so-custom-css-properties .section-tabs li:last-child {
283
- border-right: 0;
284
- }
285
- #so-custom-css-properties .section-tabs li.active {
286
- color: #444;
287
- background: #e8e8e8;
288
- }
289
- #so-custom-css-properties .section-tabs li.active .fa {
290
- color: #333;
291
- }
292
- #so-custom-css-properties .sections .section {
293
- display: none;
294
- padding: 10px;
295
- }
296
- #so-custom-css-properties .sections .fields-table {
297
- width: 100%;
298
- padding-top: 5px;
299
- }
300
- #so-custom-css-properties .sections .fields-table th,
301
- #so-custom-css-properties .sections .fields-table td {
302
- position: relative;
303
- zoom: 1;
304
- }
305
- #so-custom-css-properties .sections .fields-table th:before,
306
- #so-custom-css-properties .sections .fields-table td:before {
307
- content: '';
308
- display: block;
309
- }
310
- #so-custom-css-properties .sections .fields-table th:after,
311
- #so-custom-css-properties .sections .fields-table td:after {
312
- content: '';
313
- display: table;
314
- clear: both;
315
- }
316
- #so-custom-css-properties .sections .fields-table th[scope="row"] {
317
- font-weight: bold;
318
- font-size: 12px;
319
- padding-right: 10px;
320
- text-align: left;
321
- width: 36%;
322
- vertical-align: top;
323
- }
324
- #so-custom-css-properties .sections .fields-table td {
325
- padding: 0 0 12px 0 ;
326
- }
327
- #so-custom-css-properties .sections .fields-table input,
328
- #so-custom-css-properties .sections .fields-table select {
329
- display: block;
330
- margin: 0 25px 0 0;
331
- border: 1px solid #c0c0c0;
332
- width: 175px;
333
- box-sizing: border-box;
334
- border-radius: 0;
335
- font-size: 12px;
336
- padding: 5px 8px;
337
- }
338
- #so-custom-css-properties .sections .fields-table .minicolors input {
339
- box-sizing: border-box;
340
- height: 30px;
341
- padding: 5px 0 5px 30px;
342
- }
343
- #so-custom-css-properties .sections .fields-table .select {
344
- display: block;
345
- position: absolute;
346
- top: 0px;
347
- right: 1px;
348
- padding: 5px;
349
- cursor: pointer;
350
- font-size: 15px;
351
- }
352
- #so-custom-css-properties .sections .fields-table .select-tabs {
353
- margin: 0;
354
- height: 40px;
355
- }
356
- #so-custom-css-properties .sections .fields-table .select-tabs .select-tab {
357
- cursor: pointer;
358
- float: left;
359
- -webkit-box-sizing: border-box;
360
- -moz-box-sizing: border-box;
361
- box-sizing: border-box;
362
- text-align: center;
363
- border: 1px solid #c0c0c0;
364
- padding: 4px 2px;
365
- border-right-width: 0;
366
- background: #f7f7f7;
367
- }
368
- #so-custom-css-properties .sections .fields-table .select-tabs .select-tab .fa {
369
- line-height: 14px;
370
- font-size: 14px;
371
- color: #777;
372
- }
373
- #so-custom-css-properties .sections .fields-table .select-tabs .select-tab:last-child {
374
- border-right-width: 1px;
375
- }
376
- #so-custom-css-properties .sections .fields-table .select-tabs .select-tab:hover,
377
- #so-custom-css-properties .sections .fields-table .select-tabs .select-tab.active {
378
- background: #e9e9e9;
379
- }
380
- #so-custom-css-properties .sections .fields-table .select-tabs .select-tab:hover .fa,
381
- #so-custom-css-properties .sections .fields-table .select-tabs .select-tab.active .fa {
382
- color: #333;
383
- }
384
- #so-custom-css-properties .sections .fields-table .side-tabs {
385
- height: 26px;
386
- }
387
- #so-custom-css-properties .sections .fields-table .side-tabs .side-tab {
388
- width: 20%;
389
- text-align: center;
390
- padding: 5px;
391
- line-height: 0;
392
- }
393
- #so-custom-css-properties .sections .fields-table .side-tabs .side-tab div {
394
- display: inline-block;
395
- width: 10px;
396
- height: 10px;
397
- border: 2px solid #aaa;
398
- }
399
- #so-custom-css-properties .sections .fields-table .side-tabs .side-tab .spacing-all {
400
- border-color: #12609b;
401
- }
402
- #so-custom-css-properties .sections .fields-table .side-tabs .side-tab .spacing-top {
403
- border-top-color: #12609b;
404
- }
405
- #so-custom-css-properties .sections .fields-table .side-tabs .side-tab .spacing-left {
406
- border-left-color: #12609b;
407
- }
408
- #so-custom-css-properties .sections .fields-table .side-tabs .side-tab .spacing-bottom {
409
- border-bottom-color: #12609b;
410
- }
411
- #so-custom-css-properties .sections .fields-table .side-tabs .side-tab .spacing-right {
412
- border-right-color: #12609b;
413
- }
414
- #so-custom-css-properties .sections .fields-table .sides .side > div {
415
- margin-bottom: 5px;
416
- }
417
- #so-custom-css-properties .sections .fields-table .sides .side > div:last-child {
418
- margin-bottom: 0;
419
- }
420
- .css-editor-snippet-browser {
421
- display: none;
422
- }
423
- .css-editor-snippet-browser .snippet-browser-overlay {
424
- position: fixed;
425
- z-index: 100000;
426
- top: 0;
427
- left: 0;
428
- right: 0;
429
- bottom: 0;
430
- background: rgba(0, 0, 0, 0.8);
431
- }
432
- .css-editor-snippet-browser .snippet-browser-dialog > div {
433
- position: fixed;
434
- z-index: 100001;
435
- background: #fff;
436
- box-sizing: border-box;
437
- }
438
- .css-editor-snippet-browser .snippet-browser-dialog .toolbar {
439
- top: 40px;
440
- left: 40px;
441
- right: 40px;
442
- height: 50px;
443
- background: #FCFCFC;
444
- border-bottom: 1px solid #dddddd;
445
- overflow: hidden;
446
- }
447
- .css-editor-snippet-browser .snippet-browser-dialog .toolbar h1 {
448
- padding: 0 16px;
449
- font-size: 22px;
450
- line-height: 50px;
451
- margin: 0;
452
- color: #444;
453
- }
454
- .css-editor-snippet-browser .snippet-browser-dialog .toolbar .close {
455
- cursor: pointer;
456
- color: #777;
457
- background-color: transparent;
458
- height: 50px;
459
- width: 50px;
460
- padding: 15px 0 0 0;
461
- position: absolute;
462
- text-align: center;
463
- border: 0;
464
- border-left: 1px solid #ddd;
465
- top: 0;
466
- right: 0;
467
- text-decoration: none;
468
- box-sizing: border-box;
469
- }
470
- .css-editor-snippet-browser .snippet-browser-dialog .toolbar .close:hover {
471
- background: #dddddd;
472
- }
473
- .css-editor-snippet-browser .snippet-browser-dialog .toolbar .close .icon:before {
474
- content: '\f158';
475
- font: normal 20px/1 'dashicons';
476
- vertical-align: middle;
477
- -webkit-font-smoothing: antialiased;
478
- -moz-osx-font-smoothing: grayscale;
479
- color: #666;
480
- }
481
- .css-editor-snippet-browser .snippet-browser-dialog .sidebar {
482
- top: 90px;
483
- left: 40px;
484
- bottom: 90px;
485
- width: 300px;
486
- background: #f3f3f3;
487
- border-right: 1px solid #dddddd;
488
- padding: 16px;
489
- overflow: auto;
490
- }
491
- .css-editor-snippet-browser .snippet-browser-dialog .sidebar .snippet-search {
492
- width: 100%;
493
- margin-bottom: 20px;
494
- padding: 8px;
495
- }
496
- .css-editor-snippet-browser .snippet-browser-dialog .sidebar .snippets {
497
- margin: 0;
498
- }
499
- .css-editor-snippet-browser .snippet-browser-dialog .sidebar .snippets .snippet {
500
- cursor: pointer;
501
- font-size: 1.1em;
502
- line-height: 1.35em;
503
- margin-bottom: 20px;
504
- }
505
- .css-editor-snippet-browser .snippet-browser-dialog .sidebar .snippets .snippet.active {
506
- font-weight: bold;
507
- }
508
- .css-editor-snippet-browser .snippet-browser-dialog .main {
509
- top: 90px;
510
- left: 340px;
511
- right: 40px;
512
- bottom: 90px;
513
- background: #fff;
514
- overflow: auto;
515
- }
516
- .css-editor-snippet-browser .snippet-browser-dialog .main .snippet-view {
517
- padding: 20px;
518
- }
519
- .css-editor-snippet-browser .snippet-browser-dialog .main .snippet-view .snippet-title {
520
- margin: 0 0 0.75em 0;
521
- padding: 0;
522
- }
523
- .css-editor-snippet-browser .snippet-browser-dialog .main .snippet-view .snippet-description {
524
- font-size: 1.1em;
525
- color: #666;
526
- margin-bottom: 2em;
527
- }
528
- .css-editor-snippet-browser .snippet-browser-dialog .main .snippet-view .snippet-code {
529
- padding: 20px;
530
- border: 1px solid #d0d0d0;
531
- background: #f8f8f8;
532
- }
533
- .css-editor-snippet-browser .snippet-browser-dialog .buttons {
534
- bottom: 40px;
535
- left: 40px;
536
- right: 40px;
537
- height: 50px;
538
- background: #FCFCFC;
539
- border-top: 1px solid #dddddd;
540
- text-align: right;
541
- padding: 10px 20px;
542
- overflow: hidden;
543
- }
544
- .socss-field-measurement {
545
- position: relative;
546
- }
547
- .socss-field-measurement input.socss-field-input {
548
- min-height: 1.5em;
549
- padding-right: 50px;
550
- width: 120px !important;
551
- box-sizing: border-box;
552
- }
553
- .socss-field-measurement .dashicons-arrow-down {
554
- position: absolute;
555
- top: 4px;
556
- left: 97px;
557
- cursor: pointer;
558
- }
559
- .socss-field-measurement .dropdown {
560
- display: none;
561
- background: #F5F5F5;
562
- border: 1px solid #c0c0c0;
563
- position: absolute;
564
- top: 27px;
565
- left: 71px;
566
- width: 50px;
567
- z-index: 2;
568
- margin: 0;
569
- box-sizing: border-box;
570
- box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
571
- }
572
- .socss-field-measurement .dropdown li {
573
- padding: 5px 0;
574
- text-align: center;
575
- line-height: 1.1em;
576
- font-size: 11px;
577
- margin: 0;
578
- }
579
- .socss-field-measurement .dropdown li:hover,
580
- .socss-field-measurement .dropdown li.active {
581
- background: #e8e8e8;
582
- cursor: pointer;
583
- }
584
- .socss-field-measurement .units {
585
- position: absolute;
586
- top: 5px;
587
- left: 12px;
588
- color: #bbb;
589
- pointer-events: none;
590
- }
591
- .socss-diw {
592
- position: absolute;
593
- top: 0px;
594
- left: 124px;
595
- }
596
- .socss-diw .inc-button,
597
- .socss-diw .dec-button {
598
- cursor: pointer;
599
- box-sizing: border-box;
600
- float: left;
601
- padding: 8px;
602
- user-select: none;
603
- text-align: center;
604
- margin: 0;
605
- width: 27px;
606
- height: 27px;
607
- font-size: 10px;
608
- }
609
- .socss-diw .inc-button {
610
- border-left: 0;
611
- }
612
- .socss-button {
613
- cursor: pointer;
614
- line-height: 1em;
615
- display: inline-block;
616
- border: 1px solid #c0c0c0;
617
- background: #f7f7f7;
618
- text-decoration: none;
619
- padding: 6px;
620
- font-weight: bold;
621
- color: #555;
622
- font-size: 0.95em;
623
- margin-left: 5px;
624
- -webkit-user-select: none;
625
- -moz-user-select: none;
626
- -ms-user-select: none;
627
- -o-user-select: none;
628
- user-select: none;
629
- }
630
- .socss-button:hover {
631
- border-color: #b0b0b0;
632
- background: #fff;
633
- box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
634
- }
635
- .socss-button:hover .fa {
636
- color: #333;
637
- }
638
- .socss-button .fa {
639
- color: #555;
640
- }
641
- .CodeMirror-lint-tooltip,
642
- .CodeMirror-hints {
643
- /* This is above the editor in full-screen mode */
644
- z-index: 100002;
645
- }
1
+ #siteorigin-custom-css {
2
+ color: #333;
3
+ margin: 0 0 0 -20px;
4
+ }
5
+ #siteorigin-custom-css h2 {
6
+ background: #f8f8f8;
7
+ padding: 20px;
8
+ border-bottom: 1px solid #d0d0d0;
9
+ margin-bottom: 20px;
10
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.035);
11
+ }
12
+ #siteorigin-custom-css h2 .icon {
13
+ width: 40px;
14
+ height: auto;
15
+ margin: -8px 10px -8px 0;
16
+ }
17
+ #siteorigin-custom-css .notice {
18
+ margin: 0 20px 20px 20px;
19
+ }
20
+ #siteorigin-custom-css #poststuff {
21
+ padding: 0 20px;
22
+ }
23
+ #siteorigin-custom-css #poststuff .postbox {
24
+ border: 1px solid #D0D0D0;
25
+ }
26
+ #siteorigin-custom-css #poststuff .postbox h3.hndle {
27
+ cursor: default;
28
+ border-bottom: 1px solid #D0D0D0;
29
+ background: #efefef;
30
+ position: relative;
31
+ }
32
+ #siteorigin-custom-css #poststuff .postbox h3.hndle .hide {
33
+ position: absolute;
34
+ top: 50%;
35
+ line-height: 1em;
36
+ margin-top: -0.5em;
37
+ right: 12px;
38
+ }
39
+ #siteorigin-custom-css #poststuff #so-custom-css-getting-started .inside {
40
+ padding: 0 6px 6px 6px;
41
+ }
42
+ #siteorigin-custom-css #poststuff #so-custom-css-getting-started .inside img {
43
+ display: block;
44
+ width: 100%;
45
+ height: auto;
46
+ }
47
+ #so-custom-css-form {
48
+ margin-right: 340px;
49
+ }
50
+ #so-custom-css-info {
51
+ width: 315px;
52
+ float: right;
53
+ }
54
+ #so-custom-css-info *:first-child {
55
+ margin-top: 0;
56
+ }
57
+ #so-custom-css-info *:last-child {
58
+ margin-bottom: 0;
59
+ }
60
+ #so-custom-css-revisions ol {
61
+ list-style: none;
62
+ margin: 0;
63
+ }
64
+ #so-custom-css-revisions ol li {
65
+ margin: 0;
66
+ line-height: 2.2em;
67
+ }
68
+ #so-custom-css-form .custom-css-preview iframe,
69
+ #so-custom-css-form .custom-css-preview #preview-navigator {
70
+ display: none;
71
+ }
72
+ #so-custom-css-form .custom-css-toolbar {
73
+ border: 1px solid #D0D0D0;
74
+ border-bottom: none;
75
+ background: #efefef;
76
+ padding: 8px 10px;
77
+ overflow: auto;
78
+ }
79
+ #so-custom-css-form .custom-css-toolbar .toolbar-function-buttons {
80
+ float: left;
81
+ }
82
+ #so-custom-css-form .custom-css-toolbar .toolbar-function-buttons .toolbar-functions-dropdown {
83
+ display: none;
84
+ }
85
+ #so-custom-css-form .custom-css-toolbar .toolbar-function-buttons ul.toolbar-buttons {
86
+ margin: 0;
87
+ }
88
+ #so-custom-css-form .custom-css-toolbar .toolbar-function-buttons ul.toolbar-buttons li {
89
+ display: inline-block;
90
+ margin: 0;
91
+ padding: 0;
92
+ }
93
+ #so-custom-css-form .custom-css-toolbar .toolbar-action-buttons {
94
+ float: right;
95
+ }
96
+ #so-custom-css-form .custom-css-toolbar .toolbar-action-buttons a.active {
97
+ border-color: #b4c4cf;
98
+ background-color: #e9f9ff;
99
+ color: #596872;
100
+ }
101
+ #so-custom-css-form .custom-css-toolbar .toolbar-action-buttons .editor-expand {
102
+ float: right;
103
+ text-decoration: none;
104
+ color: #666;
105
+ }
106
+ #so-custom-css-form .custom-css-toolbar .toolbar-action-buttons .editor-expand .fa-compress {
107
+ display: none;
108
+ }
109
+ #so-custom-css-form .custom-css-toolbar .fa {
110
+ font-size: 14px;
111
+ }
112
+ #so-custom-css-form .custom-css-container {
113
+ border: 1px solid #D0D0D0;
114
+ background: #f7f7f7;
115
+ cursor: text;
116
+ overflow: hidden;
117
+ }
118
+ #so-custom-css-form .custom-css-container .CodeMirror {
119
+ height: auto;
120
+ }
121
+ #so-custom-css-form .custom-css-container .CodeMirror-scroll {
122
+ min-height: 300px;
123
+ }
124
+ #so-custom-css-form .custom-css-container .CodeMirror-lines {
125
+ padding: 8px 0 8px 0;
126
+ }
127
+ #so-custom-css-form .custom-css-container textarea {
128
+ border: 0;
129
+ padding: 8px 0 8px 4px;
130
+ width: 100%;
131
+ min-height: 300px;
132
+ display: block;
133
+ font-family: monospace;
134
+ font-size: 13px;
135
+ line-height: 1.4em;
136
+ border-left: 1px solid #ddd;
137
+ margin-left: 16px;
138
+ }
139
+ #so-custom-css-form .decoration {
140
+ display: none;
141
+ }
142
+ #so-custom-css-form.expanded {
143
+ z-index: 100000;
144
+ position: fixed;
145
+ top: 0;
146
+ left: 0;
147
+ bottom: 0;
148
+ width: 340px;
149
+ }
150
+ #so-custom-css-form.expanded .custom-css-toolbar .editor-expand .fa-expand {
151
+ display: none;
152
+ }
153
+ #so-custom-css-form.expanded .custom-css-toolbar .editor-expand .fa-compress {
154
+ display: inline-block;
155
+ }
156
+ #so-custom-css-form.expanded .decoration {
157
+ display: block;
158
+ position: absolute;
159
+ top: 0;
160
+ bottom: 0;
161
+ left: 339px;
162
+ width: 2px;
163
+ background: rgba(0, 0, 0, 0.1);
164
+ }
165
+ #so-custom-css-form.expanded .description {
166
+ display: none;
167
+ }
168
+ #so-custom-css-form.expanded .submit {
169
+ display: none;
170
+ }
171
+ #so-custom-css-form.expanded .custom-css-preview {
172
+ position: fixed;
173
+ display: block;
174
+ top: 40px;
175
+ right: 0;
176
+ bottom: 0;
177
+ left: 340px;
178
+ background: #ffffff;
179
+ }
180
+ #so-custom-css-form.expanded .custom-css-preview #preview-navigator {
181
+ display: block;
182
+ -ms-box-sizing: border-box;
183
+ -moz-box-sizing: border-box;
184
+ -webkit-box-sizing: border-box;
185
+ box-sizing: border-box;
186
+ padding: 6px 10px;
187
+ position: absolute;
188
+ width: 100%;
189
+ height: 40px;
190
+ top: -40px;
191
+ background: #bbb;
192
+ background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #bbb), color-stop(1, #eee));
193
+ background: -ms-linear-gradient(bottom, #bbb, #eee);
194
+ background: -moz-linear-gradient(center bottom, #bbb 0%, #eee 100%);
195
+ background: -o-linear-gradient(#eee, #bbb);
196
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eee', endColorstr='#bbb', GradientType=0);
197
+ border-bottom: 1px solid #888;
198
+ }
199
+ #so-custom-css-form.expanded .custom-css-preview #preview-navigator input {
200
+ width: 100%;
201
+ border: 1px solid #888;
202
+ border-radius: 2px;
203
+ color: #444;
204
+ -webkit-box-shadow: inset 2px 2px 2px rgba( 0,0,0,0.1 );
205
+ -moz-box-shadow: inset 2px 2px 2px rgba( 0,0,0,0.1 );
206
+ box-shadow: inset 2px 2px 2px rgba( 0,0,0,0.1 );
207
+ }
208
+ #so-custom-css-form.expanded .custom-css-preview #preview-iframe {
209
+ display: block;
210
+ width: 100%;
211
+ height: 100%;
212
+ overflow-x: hidden;
213
+ }
214
+ #so-custom-css-properties {
215
+ display: none;
216
+ position: fixed;
217
+ top: 0;
218
+ left: -338px;
219
+ bottom: 0;
220
+ width: 338px;
221
+ background: #ffffff;
222
+ border: 1px solid #D0D0D0;
223
+ overflow-y: auto;
224
+ z-index: 100000;
225
+ }
226
+ #so-custom-css-properties .toolbar {
227
+ display: block;
228
+ padding: 7px 10px;
229
+ border-bottom: 1px solid #aaa;
230
+ background: #F6F6F6;
231
+ text-align: left;
232
+ }
233
+ #so-custom-css-properties .toolbar select {
234
+ line-height: 1;
235
+ font-size: 13px;
236
+ max-width: 265px;
237
+ -webkit-transition: all 0.5s ease;
238
+ -moz-transition: all 0.5s ease;
239
+ -o-transition: all 0.5s ease;
240
+ transition: all 0.5s ease;
241
+ }
242
+ #so-custom-css-properties .toolbar select.highlighted {
243
+ background: #daeaf7;
244
+ }
245
+ #so-custom-css-properties .toolbar .close {
246
+ float: right;
247
+ margin: 2px 4px 0 0;
248
+ }
249
+ #so-custom-css-properties .section-tabs {
250
+ list-style: none;
251
+ height: auto;
252
+ margin: 0;
253
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
254
+ }
255
+ #so-custom-css-properties .section-tabs li {
256
+ box-sizing: border-box;
257
+ float: left;
258
+ width: 33.333%;
259
+ padding: 10px 7px;
260
+ border: 1px solid #aaa;
261
+ background: #F6F6F6;
262
+ font-weight: bold;
263
+ border-top: 0;
264
+ border-left: 0;
265
+ font-size: 13px;
266
+ line-height: 1em;
267
+ cursor: pointer;
268
+ white-space: nowrap;
269
+ overflow: hidden;
270
+ color: #666;
271
+ }
272
+ #so-custom-css-properties .section-tabs li:hover {
273
+ background: #fff;
274
+ }
275
+ #so-custom-css-properties .section-tabs li .fa {
276
+ float: left;
277
+ display: block;
278
+ margin: -1px 6px -1px 0;
279
+ font-size: 15px;
280
+ color: #666;
281
+ }
282
+ #so-custom-css-properties .section-tabs li:last-child {
283
+ border-right: 0;
284
+ }
285
+ #so-custom-css-properties .section-tabs li.active {
286
+ color: #444;
287
+ background: #e8e8e8;
288
+ }
289
+ #so-custom-css-properties .section-tabs li.active .fa {
290
+ color: #333;
291
+ }
292
+ #so-custom-css-properties .sections .section {
293
+ display: none;
294
+ padding: 10px;
295
+ }
296
+ #so-custom-css-properties .sections .fields-table {
297
+ width: 100%;
298
+ padding-top: 5px;
299
+ }
300
+ #so-custom-css-properties .sections .fields-table th,
301
+ #so-custom-css-properties .sections .fields-table td {
302
+ position: relative;
303
+ zoom: 1;
304
+ }
305
+ #so-custom-css-properties .sections .fields-table th:before,
306
+ #so-custom-css-properties .sections .fields-table td:before {
307
+ content: '';
308
+ display: block;
309
+ }
310
+ #so-custom-css-properties .sections .fields-table th:after,
311
+ #so-custom-css-properties .sections .fields-table td:after {
312
+ content: '';
313
+ display: table;
314
+ clear: both;
315
+ }
316
+ #so-custom-css-properties .sections .fields-table th[scope="row"] {
317
+ font-weight: bold;
318
+ font-size: 12px;
319
+ padding-right: 10px;
320
+ text-align: left;
321
+ width: 36%;
322
+ vertical-align: top;
323
+ }
324
+ #so-custom-css-properties .sections .fields-table td {
325
+ padding: 0 0 12px 0 ;
326
+ }
327
+ #so-custom-css-properties .sections .fields-table input,
328
+ #so-custom-css-properties .sections .fields-table select {
329
+ display: block;
330
+ margin: 0 25px 0 0;
331
+ border: 1px solid #c0c0c0;
332
+ width: 175px;
333
+ box-sizing: border-box;
334
+ border-radius: 0;
335
+ font-size: 12px;
336
+ }
337
+ #so-custom-css-properties .sections .fields-table .minicolors input {
338
+ box-sizing: border-box;
339
+ height: 30px;
340
+ padding: 5px 0 5px 30px;
341
+ }
342
+ #so-custom-css-properties .sections .fields-table .select {
343
+ display: block;
344
+ position: absolute;
345
+ top: 0px;
346
+ right: 0;
347
+ line-height: inherit;
348
+ margin: 0;
349
+ padding: 4px 5px 6px;
350
+ cursor: pointer;
351
+ font-size: 15px;
352
+ }
353
+ #so-custom-css-properties .sections .fields-table .select-tabs {
354
+ margin: 0;
355
+ height: 40px;
356
+ }
357
+ #so-custom-css-properties .sections .fields-table .select-tabs .select-tab {
358
+ cursor: pointer;
359
+ float: left;
360
+ -webkit-box-sizing: border-box;
361
+ -moz-box-sizing: border-box;
362
+ box-sizing: border-box;
363
+ text-align: center;
364
+ border: 1px solid #c0c0c0;
365
+ padding: 4px 2px;
366
+ border-right-width: 0;
367
+ background: #f7f7f7;
368
+ }
369
+ #so-custom-css-properties .sections .fields-table .select-tabs .select-tab .fa {
370
+ line-height: 14px;
371
+ font-size: 14px;
372
+ color: #777;
373
+ }
374
+ #so-custom-css-properties .sections .fields-table .select-tabs .select-tab:last-child {
375
+ border-right-width: 1px;
376
+ }
377
+ #so-custom-css-properties .sections .fields-table .select-tabs .select-tab:hover,
378
+ #so-custom-css-properties .sections .fields-table .select-tabs .select-tab.active {
379
+ background: #e9e9e9;
380
+ }
381
+ #so-custom-css-properties .sections .fields-table .select-tabs .select-tab:hover .fa,
382
+ #so-custom-css-properties .sections .fields-table .select-tabs .select-tab.active .fa {
383
+ color: #333;
384
+ }
385
+ #so-custom-css-properties .sections .fields-table .side-tabs {
386
+ height: 26px;
387
+ }
388
+ #so-custom-css-properties .sections .fields-table .side-tabs .side-tab {
389
+ width: 20%;
390
+ text-align: center;
391
+ padding: 5px;
392
+ line-height: 0;
393
+ }
394
+ #so-custom-css-properties .sections .fields-table .side-tabs .side-tab div {
395
+ display: inline-block;
396
+ width: 10px;
397
+ height: 10px;
398
+ border: 2px solid #aaa;
399
+ }
400
+ #so-custom-css-properties .sections .fields-table .side-tabs .side-tab .spacing-all {
401
+ border-color: #12609b;
402
+ }
403
+ #so-custom-css-properties .sections .fields-table .side-tabs .side-tab .spacing-top {
404
+ border-top-color: #12609b;
405
+ }
406
+ #so-custom-css-properties .sections .fields-table .side-tabs .side-tab .spacing-left {
407
+ border-left-color: #12609b;
408
+ }
409
+ #so-custom-css-properties .sections .fields-table .side-tabs .side-tab .spacing-bottom {
410
+ border-bottom-color: #12609b;
411
+ }
412
+ #so-custom-css-properties .sections .fields-table .side-tabs .side-tab .spacing-right {
413
+ border-right-color: #12609b;
414
+ }
415
+ #so-custom-css-properties .sections .fields-table .sides .side > div {
416
+ margin-bottom: 5px;
417
+ }
418
+ #so-custom-css-properties .sections .fields-table .sides .side > div:last-child {
419
+ margin-bottom: 0;
420
+ }
421
+ .css-editor-snippet-browser {
422
+ display: none;
423
+ }
424
+ .css-editor-snippet-browser .snippet-browser-overlay {
425
+ position: fixed;
426
+ z-index: 100000;
427
+ top: 0;
428
+ left: 0;
429
+ right: 0;
430
+ bottom: 0;
431
+ background: rgba(0, 0, 0, 0.8);
432
+ }
433
+ .css-editor-snippet-browser .snippet-browser-dialog > div {
434
+ position: fixed;
435
+ z-index: 100001;
436
+ background: #fff;
437
+ box-sizing: border-box;
438
+ }
439
+ .css-editor-snippet-browser .snippet-browser-dialog .toolbar {
440
+ top: 40px;
441
+ left: 40px;
442
+ right: 40px;
443
+ height: 50px;
444
+ background: #FCFCFC;
445
+ border-bottom: 1px solid #dddddd;
446
+ overflow: hidden;
447
+ }
448
+ .css-editor-snippet-browser .snippet-browser-dialog .toolbar h1 {
449
+ padding: 0 16px;
450
+ font-size: 22px;
451
+ line-height: 50px;
452
+ margin: 0;
453
+ color: #444;
454
+ }
455
+ .css-editor-snippet-browser .snippet-browser-dialog .toolbar .close {
456
+ cursor: pointer;
457
+ color: #777;
458
+ background-color: transparent;
459
+ height: 50px;
460
+ width: 50px;
461
+ padding: 15px 0 0 0;
462
+ position: absolute;
463
+ text-align: center;
464
+ border: 0;
465
+ border-left: 1px solid #ddd;
466
+ top: 0;
467
+ right: 0;
468
+ text-decoration: none;
469
+ box-sizing: border-box;
470
+ }
471
+ .css-editor-snippet-browser .snippet-browser-dialog .toolbar .close:hover {
472
+ background: #dddddd;
473
+ }
474
+ .css-editor-snippet-browser .snippet-browser-dialog .toolbar .close .icon:before {
475
+ content: '\f158';
476
+ font: normal 20px/1 'dashicons';
477
+ vertical-align: middle;
478
+ -webkit-font-smoothing: antialiased;
479
+ -moz-osx-font-smoothing: grayscale;
480
+ color: #666;
481
+ }
482
+ .css-editor-snippet-browser .snippet-browser-dialog .sidebar {
483
+ top: 90px;
484
+ left: 40px;
485
+ bottom: 90px;
486
+ width: 300px;
487
+ background: #f3f3f3;
488
+ border-right: 1px solid #dddddd;
489
+ padding: 16px;
490
+ overflow: auto;
491
+ }
492
+ .css-editor-snippet-browser .snippet-browser-dialog .sidebar .snippet-search {
493
+ width: 100%;
494
+ margin-bottom: 20px;
495
+ padding: 8px;
496
+ }
497
+ .css-editor-snippet-browser .snippet-browser-dialog .sidebar .snippets {
498
+ margin: 0;
499
+ }
500
+ .css-editor-snippet-browser .snippet-browser-dialog .sidebar .snippets .snippet {
501
+ cursor: pointer;
502
+ font-size: 1.1em;
503
+ line-height: 1.35em;
504
+ margin-bottom: 20px;
505
+ }
506
+ .css-editor-snippet-browser .snippet-browser-dialog .sidebar .snippets .snippet.active {
507
+ font-weight: bold;
508
+ }
509
+ .css-editor-snippet-browser .snippet-browser-dialog .main {
510
+ top: 90px;
511
+ left: 340px;
512
+ right: 40px;
513
+ bottom: 90px;
514
+ background: #fff;
515
+ overflow: auto;
516
+ }
517
+ .css-editor-snippet-browser .snippet-browser-dialog .main .snippet-view {
518
+ padding: 20px;
519
+ }
520
+ .css-editor-snippet-browser .snippet-browser-dialog .main .snippet-view .snippet-title {
521
+ margin: 0 0 0.75em 0;
522
+ padding: 0;
523
+ }
524
+ .css-editor-snippet-browser .snippet-browser-dialog .main .snippet-view .snippet-description {
525
+ font-size: 1.1em;
526
+ color: #666;
527
+ margin-bottom: 2em;
528
+ }
529
+ .css-editor-snippet-browser .snippet-browser-dialog .main .snippet-view .snippet-code {
530
+ padding: 20px;
531
+ border: 1px solid #d0d0d0;
532
+ background: #f8f8f8;
533
+ }
534
+ .css-editor-snippet-browser .snippet-browser-dialog .buttons {
535
+ bottom: 40px;
536
+ left: 40px;
537
+ right: 40px;
538
+ height: 50px;
539
+ background: #FCFCFC;
540
+ border-top: 1px solid #dddddd;
541
+ text-align: right;
542
+ padding: 10px 20px;
543
+ overflow: hidden;
544
+ }
545
+ .socss-field-measurement {
546
+ position: relative;
547
+ }
548
+ .socss-field-measurement input.socss-field-input {
549
+ padding-right: 50px;
550
+ width: 120px !important;
551
+ box-sizing: border-box;
552
+ }
553
+ .socss-field-measurement .dashicons-arrow-down {
554
+ position: absolute;
555
+ top: 4px;
556
+ left: 97px;
557
+ cursor: pointer;
558
+ }
559
+ .socss-field-measurement .dropdown {
560
+ display: none;
561
+ background: #F5F5F5;
562
+ border: 1px solid #c0c0c0;
563
+ position: absolute;
564
+ top: 27px;
565
+ left: 71px;
566
+ width: 50px;
567
+ z-index: 2;
568
+ margin: 0;
569
+ box-sizing: border-box;
570
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
571
+ }
572
+ .socss-field-measurement .dropdown li {
573
+ padding: 5px 0;
574
+ text-align: center;
575
+ line-height: 1.1em;
576
+ font-size: 11px;
577
+ margin: 0;
578
+ }
579
+ .socss-field-measurement .dropdown li:hover,
580
+ .socss-field-measurement .dropdown li.active {
581
+ background: #e8e8e8;
582
+ cursor: pointer;
583
+ }
584
+ .socss-field-measurement .units {
585
+ position: absolute;
586
+ top: 5px;
587
+ left: 12px;
588
+ color: #bbb;
589
+ pointer-events: none;
590
+ }
591
+ .socss-diw {
592
+ position: absolute;
593
+ top: 0px;
594
+ left: 124px;
595
+ }
596
+ .socss-diw .inc-button,
597
+ .socss-diw .dec-button {
598
+ cursor: pointer;
599
+ box-sizing: border-box;
600
+ float: left;
601
+ padding: 9px;
602
+ user-select: none;
603
+ text-align: center;
604
+ margin: 0;
605
+ width: 30px;
606
+ height: 30px;
607
+ font-size: 10px;
608
+ }
609
+ .socss-diw .inc-button {
610
+ border-left: 0;
611
+ }
612
+ .socss-button {
613
+ cursor: pointer;
614
+ line-height: 1em;
615
+ display: inline-block;
616
+ border: 1px solid #c0c0c0;
617
+ background: #f7f7f7;
618
+ text-decoration: none;
619
+ padding: 6px;
620
+ font-weight: bold;
621
+ color: #555;
622
+ font-size: 0.95em;
623
+ margin-left: 5px;
624
+ -webkit-user-select: none;
625
+ -moz-user-select: none;
626
+ -ms-user-select: none;
627
+ -o-user-select: none;
628
+ user-select: none;
629
+ }
630
+ .socss-button:hover {
631
+ border-color: #b0b0b0;
632
+ background: #fff;
633
+ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
634
+ }
635
+ .socss-button:hover .fa {
636
+ color: #333;
637
+ }
638
+ .socss-button .fa {
639
+ color: #555;
640
+ }
641
+ .CodeMirror-lint-tooltip,
642
+ .CodeMirror-hints {
643
+ /* This is above the editor in full-screen mode */
644
+ z-index: 100002;
645
+ }
css/admin.less DELETED
@@ -1,754 +0,0 @@
1
- @import "mixins";
2
-
3
- #siteorigin-custom-css {
4
- margin: 0 0 0 -20px;
5
-
6
- h2 {
7
- background: #f8f8f8;
8
- padding: 20px;
9
- border-bottom: 1px solid #d0d0d0;
10
- margin-bottom: 20px;
11
-
12
- .icon {
13
- width: 40px;
14
- height: auto;
15
- margin: -8px 10px -8px 0;
16
- }
17
-
18
- box-shadow: 0 1px 1px rgba(0,0,0,0.035);
19
- }
20
-
21
- .updated {
22
- margin: 0 20px 20px 20px ;
23
- }
24
-
25
- #poststuff {
26
- padding: 0 20px;
27
-
28
- .postbox {
29
- border: 1px solid #D0D0D0;
30
-
31
- h3.hndle {
32
- cursor: default;
33
- border-bottom: 1px solid #D0D0D0;
34
- background: #efefef;
35
- position: relative;
36
-
37
- .hide {
38
- position: absolute;
39
- top: 50%;
40
- line-height: 1em;
41
- margin-top: -0.5em;
42
- right: 12px;
43
- }
44
- }
45
- }
46
-
47
- #so-custom-css-getting-started {
48
- .inside {
49
- padding: 0 6px 6px 6px;
50
-
51
- img {
52
- display: block;
53
- width: 100%;
54
- height: auto;
55
- }
56
- }
57
- }
58
- }
59
- }
60
-
61
- #so-custom-css-form {
62
- margin-right: 340px;
63
- }
64
-
65
- #so-custom-css-info{
66
- width: 315px;
67
- float: right;
68
-
69
- *:first-child {
70
- margin-top: 0;
71
- }
72
-
73
- *:last-child {
74
- margin-bottom: 0;
75
- }
76
- }
77
-
78
- #so-custom-css-revisions {
79
- ol {
80
- list-style: none;
81
- margin: 0;
82
-
83
- li{
84
- margin: 0;
85
- line-height: 2.2em;
86
- }
87
- }
88
- }
89
-
90
- #so-custom-css-form {
91
-
92
- .custom-css-preview {
93
- iframe {
94
- display: none;
95
- }
96
- }
97
-
98
- .custom-css-toolbar {
99
- border:1px solid #D0D0D0;
100
- border-bottom: none;
101
- background: #efefef;
102
- padding: 8px 10px;
103
- overflow: auto;
104
-
105
- .toolbar-function-buttons{
106
- float: left;
107
-
108
- .toolbar-functions-dropdown {
109
- display: none;
110
- }
111
-
112
- ul.toolbar-buttons {
113
- margin: 0;
114
-
115
- li {
116
- display: inline-block;
117
- margin: 0;
118
- padding: 0;
119
- }
120
- }
121
- }
122
-
123
- .toolbar-action-buttons {
124
- float: right;
125
-
126
- a {
127
- &.active {
128
- border-color: #b4c4cf;
129
- background-color: #e9f9ff;
130
- color: #596872;
131
- }
132
- }
133
-
134
- .editor-expand {
135
- float: right;
136
- text-decoration: none;
137
- color: #666;
138
-
139
- .fa-compress {
140
- display: none;
141
- }
142
- }
143
- }
144
-
145
- .fa {
146
- font-size: 14px;
147
- }
148
- }
149
-
150
- .custom-css-container {
151
- border:1px solid #D0D0D0;
152
- background: #f7f7f7;
153
- cursor: text;
154
- overflow: hidden;
155
-
156
- .CodeMirror {
157
- height: auto;
158
- }
159
-
160
- .CodeMirror-scroll {
161
- min-height: 300px;
162
- }
163
-
164
- .CodeMirror-lines {
165
- padding: 8px 0 8px 0;
166
- }
167
-
168
- textarea {
169
- border: 0;
170
- padding: 8px 0 8px 4px;
171
- width: 100%;
172
- min-height: 300px;
173
- display: block;
174
- font-family: monospace;
175
- font-size: 13px;
176
- line-height: 1.4em;
177
- border-left: 1px solid #ddd;
178
- margin-left: 16px;
179
- }
180
- }
181
-
182
- .decoration {
183
- display: none;
184
- }
185
-
186
- &.expanded {
187
- @expanded_form_width: 340px;
188
-
189
- z-index: 100000;
190
- position: fixed;
191
- top: 0;
192
- left: 0;
193
- bottom: 0;
194
- width: @expanded_form_width;
195
-
196
- .custom-css-toolbar {
197
-
198
- .editor-expand {
199
-
200
- .fa-expand {
201
- display: none;
202
- }
203
- .fa-compress {
204
- display: inline-block;
205
- }
206
-
207
- }
208
- }
209
-
210
- .decoration {
211
- display: block;
212
- position: absolute;
213
- top: 0;
214
- bottom: 0;
215
- left: @expanded_form_width - 1px;
216
- width: 2px;
217
- background: rgba(0,0,0,0.1);
218
- }
219
-
220
- .description {
221
- display: none;
222
- }
223
-
224
- .submit {
225
- display: none;
226
- }
227
-
228
- .custom-css-preview {
229
- position: fixed;
230
- display: block;
231
- top: 0;
232
- right: 0;
233
- bottom: 0;
234
- left: @expanded_form_width;
235
- background: #ffffff;
236
-
237
- iframe {
238
- display: block;
239
- width: 100%;
240
- height: 100%;
241
- overflow-x: hidden;
242
- }
243
-
244
- }
245
- }
246
- }
247
-
248
- #so-custom-css-properties {
249
-
250
- display: none;
251
-
252
- position: fixed;
253
- top: 0;
254
- left: -338px;
255
- bottom: 0;
256
- width: 338px;
257
- background: #ffffff;
258
- border:1px solid #D0D0D0;
259
- overflow-y: auto;
260
-
261
- z-index: 100000;
262
-
263
- .toolbar {
264
- display: block;
265
- padding: 7px 10px;
266
- border-bottom: 1px solid #aaa;
267
- background: #F6F6F6;
268
- text-align: left;
269
-
270
- select {
271
- line-height: 1;
272
- font-size: 13px;
273
- max-width: 265px;
274
- .transition(0.5s);
275
-
276
- &.highlighted {
277
- background: #daeaf7;
278
- }
279
- }
280
-
281
- .close {
282
- float: right;
283
- margin: 2px 4px 0 0;
284
- }
285
- }
286
-
287
- .section-tabs {
288
- list-style: none;
289
- height: auto;
290
- margin: 0;
291
- box-shadow: 0 1px 1px rgba(0,0,0,0.1);
292
-
293
- li {
294
- box-sizing: border-box;
295
- float: left;
296
- width: 33.333%;
297
- padding: 10px 7px;
298
- border: 1px solid #aaa;
299
- background: #F6F6F6;
300
- font-weight: bold;
301
-
302
- border-top: 0;
303
- border-left: 0;
304
- font-size: 13px;
305
- line-height: 1em;
306
-
307
- cursor: pointer;
308
- white-space: nowrap;
309
- overflow: hidden;
310
-
311
- color: #666;
312
-
313
- &:hover {
314
- background: #fff;
315
- }
316
-
317
- .fa {
318
- float: left;
319
- display: block;
320
- margin: -1px 6px -1px 0;
321
- font-size: 15px;
322
- color: #666;
323
- }
324
-
325
- &:last-child {
326
- border-right: 0;
327
- }
328
-
329
- &.active {
330
- color: #444;
331
- background: #e8e8e8;
332
-
333
- .fa {
334
- color: #333;
335
- }
336
- }
337
- }
338
- }
339
-
340
- .sections {
341
-
342
- .section {
343
- display: none;
344
- padding: 10px;
345
- }
346
-
347
- .fields-table {
348
- width: 100%;
349
- padding-top: 5px;
350
-
351
- th, td {
352
- position: relative;
353
- .clearfix();
354
- }
355
-
356
- th[scope="row"] {
357
- font-weight: bold;
358
- font-size: 12px;
359
- padding-right: 10px;
360
- text-align: left;
361
- width: 36%;
362
- vertical-align: top;
363
- }
364
-
365
- td {
366
- padding: 0 0 12px 0 ;
367
- }
368
-
369
- input, select {
370
- display: block;
371
- margin: 0 25px 0 0;
372
- border: 1px solid #c0c0c0;
373
- width: 175px;
374
-
375
- box-sizing: border-box;
376
- border-radius: 0;
377
- }
378
-
379
- .select {
380
- display: block;
381
- position: absolute;
382
- top: 0px;
383
- right: 1px;
384
-
385
- padding: 5px;
386
- cursor: pointer;
387
- font-size: 15px;
388
- }
389
-
390
- .select-tabs {
391
- margin: 0;
392
- height: 40px;
393
-
394
- .select-tab {
395
- cursor: pointer;
396
- float: left;
397
-
398
- -webkit-box-sizing: border-box;
399
- -moz-box-sizing: border-box;
400
- box-sizing: border-box;
401
-
402
- text-align: center;
403
- border: 1px solid #c0c0c0;
404
- padding: 4px 2px;
405
- border-right-width: 0;
406
- background: #f7f7f7;
407
-
408
- .fa {
409
- line-height: 14px;
410
- font-size: 14px;
411
- color: #777;
412
- }
413
-
414
- &:last-child {
415
- border-right-width: 1px;
416
- }
417
-
418
- &:hover, &.active {
419
- background: #e9e9e9;
420
-
421
- .fa {
422
- color: #333;
423
- }
424
- }
425
-
426
- }
427
-
428
- }
429
-
430
- .side-tabs {
431
- height: 26px;
432
-
433
- .side-tab {
434
- width: 20%;
435
- text-align: center;
436
- padding: 5px;
437
- line-height: 0;
438
-
439
- div {
440
- display: inline-block;
441
- width: 10px;
442
- height: 10px;
443
- border: 2px solid #aaa;
444
- }
445
-
446
- @border_color: #12609b;
447
-
448
- .spacing-all {
449
- border-color: @border_color;
450
- }
451
-
452
- .spacing-top {
453
- border-top-color: @border_color;
454
- }
455
-
456
- .spacing-left {
457
- border-left-color: @border_color;
458
- }
459
-
460
- .spacing-bottom {
461
- border-bottom-color: @border_color;
462
- }
463
-
464
- .spacing-right {
465
- border-right-color: @border_color;
466
- }
467
- }
468
- }
469
-
470
- .sides {
471
- .side > div {
472
- margin-bottom: 5px;
473
-
474
- &:last-child {
475
- margin-bottom: 0;
476
- }
477
- }
478
- }
479
-
480
- }
481
- }
482
- }
483
-
484
- .css-editor-snippet-browser {
485
- display: none;
486
-
487
- .snippet-browser-overlay {
488
- position: fixed;
489
- z-index: 100000;
490
- top: 0;
491
- left: 0;
492
- right: 0;
493
- bottom: 0;
494
- background: rgba(0,0,0,0.8);
495
- }
496
-
497
- .snippet-browser-dialog {
498
-
499
- @dialog_side_space: 40px;
500
-
501
- > div {
502
- position: fixed;
503
- z-index: 100001;
504
- background: #fff;
505
- box-sizing: border-box;
506
- }
507
-
508
- .toolbar {
509
- top: @dialog_side_space;
510
- left: @dialog_side_space;
511
- right: @dialog_side_space;
512
- height: 50px;
513
- background: #FCFCFC;
514
- border-bottom: 1px solid #dddddd;
515
- overflow: hidden;
516
-
517
- h1 {
518
- padding: 0 16px;
519
- font-size: 22px;
520
- line-height: 50px;
521
- margin: 0;
522
- color: #444;
523
- }
524
-
525
- .close {
526
- cursor: pointer;
527
- color: #777;
528
- background-color: transparent;
529
- height: 50px;
530
- width: 50px;
531
- padding: 15px 0 0 0;
532
- position: absolute;
533
- text-align: center;
534
- border: 0;
535
- border-left: 1px solid #ddd;
536
- top: 0;
537
- right: 0;
538
- text-decoration: none;
539
- box-sizing: border-box;
540
-
541
- &:hover {
542
- background: #dddddd;
543
- }
544
-
545
- .icon {
546
- &:before {
547
- content: '\f158';
548
- font: normal 20px/1 'dashicons';
549
- vertical-align: middle;
550
- -webkit-font-smoothing: antialiased;
551
- -moz-osx-font-smoothing: grayscale;
552
- color: #666;
553
- }
554
- }
555
- }
556
- }
557
-
558
- .sidebar {
559
- top: @dialog_side_space + 50px;
560
- left: @dialog_side_space;
561
- bottom: @dialog_side_space + 50px;
562
- width: 300px;
563
- background: #f3f3f3;
564
- border-right: 1px solid #dddddd;
565
- padding: 16px;
566
- overflow: auto;
567
-
568
- .snippet-search {
569
- width: 100%;
570
- margin-bottom: 20px;
571
- padding: 8px;
572
- }
573
-
574
- .snippets {
575
- margin: 0;
576
-
577
- .snippet {
578
- cursor: pointer;
579
- font-size: 1.1em;
580
- line-height: 1.35em;
581
- margin-bottom: 20px;
582
-
583
- &.active {
584
- font-weight: bold;
585
- }
586
- }
587
- }
588
- }
589
-
590
- .main {
591
- top: @dialog_side_space + 50px;
592
- left: @dialog_side_space + 300px;
593
- right: @dialog_side_space;
594
- bottom: @dialog_side_space + 50px;
595
- background: #fff;
596
- overflow: auto;
597
-
598
- .snippet-view {
599
- padding: 20px;
600
-
601
- .snippet-title {
602
- margin: 0 0 0.75em 0;
603
- padding: 0;
604
- }
605
-
606
- .snippet-description {
607
- font-size: 1.1em;
608
- color: #666;
609
- margin-bottom: 2em;
610
- }
611
-
612
- .snippet-code {
613
- padding: 20px;
614
- border: 1px solid #d0d0d0;
615
- background: #f8f8f8;
616
- }
617
- }
618
- }
619
-
620
- .buttons {
621
- bottom: @dialog_side_space;
622
- left: @dialog_side_space;
623
- right: @dialog_side_space;
624
- height: 50px;
625
- background: #FCFCFC;
626
- border-top: 1px solid #dddddd;
627
- text-align: right;
628
- padding: 10px 20px;
629
- overflow: hidden;
630
- }
631
-
632
-
633
- }
634
- }
635
-
636
- .socss-field-measurement {
637
-
638
- position: relative;
639
-
640
- input.socss-field-input {
641
- min-height: 1.5em;
642
- padding-right: 50px;
643
- width: 120px !important;
644
- box-sizing: border-box;
645
- }
646
-
647
- .dashicons-arrow-down {
648
- position: absolute;
649
- top: 4px;
650
- left: 97px;
651
- cursor: pointer;
652
- }
653
-
654
- .dropdown {
655
- display: none;
656
- background: #F5F5F5;
657
- border: 1px solid #c0c0c0;
658
- position: absolute;
659
- top: 27px;
660
- left: 120px - 50px + 1px;
661
- width: 50px;
662
- z-index: 2;
663
- margin: 0;
664
-
665
- box-sizing: border-box;
666
- box-shadow: 0 1px 1px rgba(0,0,0,0.15);
667
-
668
- li {
669
- padding: 5px 0;
670
- text-align: center;
671
- line-height: 1.1em;
672
- font-size: 11px;
673
- margin: 0;
674
-
675
- &:hover, &.active {
676
- background: #e8e8e8;
677
- cursor: pointer;
678
- }
679
- }
680
- }
681
-
682
- .units {
683
- position: absolute;
684
- top: 5px;
685
- left: 12px;
686
- color: #bbb;
687
- pointer-events: none;
688
- }
689
- }
690
-
691
- .socss-diw {
692
- position: absolute;
693
- top: 0px;
694
- left: 124px;
695
-
696
- .inc-button,
697
- .dec-button{
698
- cursor: pointer;
699
- box-sizing: border-box;
700
- float: left;
701
- padding: 8px;
702
- user-select: none;
703
- text-align: center;
704
- margin: 0;
705
- width: 27px;
706
- height: 27px;
707
- font-size: 10px;
708
- }
709
-
710
- .inc-button {
711
- border-left: 0;
712
- }
713
- }
714
-
715
- .socss-button {
716
- cursor: pointer;
717
-
718
- line-height: 1em;
719
- display: inline-block;
720
- border: 1px solid #c0c0c0;
721
- background: #f7f7f7;
722
- text-decoration: none;
723
- padding: 6px;
724
- font-weight: bold;
725
- color: #555;
726
- font-size: 0.95em;
727
- margin-left: 5px;
728
-
729
- -webkit-user-select: none;
730
- -moz-user-select: none;
731
- -ms-user-select: none;
732
- -o-user-select: none;
733
- user-select: none;
734
-
735
- &:hover {
736
- border-color:#b0b0b0;
737
- background: #fff;
738
- box-shadow: 0 1px 2px rgba(0,0,0,0.1);
739
-
740
- .fa {
741
- color: #333;
742
- }
743
- }
744
-
745
- .fa {
746
- color: #555;
747
- }
748
- }
749
-
750
- .CodeMirror-lint-tooltip,
751
- .CodeMirror-hints {
752
- /* This is above the editor in full-screen mode */
753
- z-index: 100002;
754
- }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
css/inspector.css CHANGED
@@ -77,7 +77,7 @@
77
  line-height: 1em;
78
  padding: 9px 20px 9px 9px;
79
  display: inline-block;
80
- background: url(images/separator.png) top right no-repeat;
81
  background-size: contain;
82
  cursor: pointer;
83
  }
77
  line-height: 1em;
78
  padding: 9px 20px 9px 9px;
79
  display: inline-block;
80