Kirki - Version 0.5

Version Description

= * New: Automatic output of styles for generic controls. * New: Automatic output of styles + scripts for fonts (including googlefonts ) * New: The 'output' argument on background controls is now an array for consistency with other controls. Older syntax is still compatible though. :) * New: Add the ability to auto-generate styles for colors. * Fix: Add a blank stylesheet if we need one and no stylesheet_id has been defined in the config options. * Fix: CSS-only tooltips. Fixes issue with tooltips now showing up on WP >

Download this release

Release Info

Developer aristath
Plugin Icon 128x128 Kirki
Version 0.5
Comparing to
See all releases

Code changes from version 0.3 to 0.5

Files changed (37) hide show
  1. LICENSE +0 -0
  2. README.md +0 -0
  3. assets/css/customizer.css +25 -41
  4. assets/css/hint.css +293 -0
  5. assets/css/jquery-ui-1.10.0.custom.css +0 -0
  6. assets/css/kirki-styles.css +0 -0
  7. assets/images/ui-icons_f6cf3b_256x240.png +0 -0
  8. assets/js/customizer.js +2 -22
  9. assets/js/tooltipsy.min.js +0 -20
  10. includes/class-Kirki_Color.php +121 -0
  11. includes/class-Kirki_Controls.php +302 -0
  12. includes/class-Kirki_Fonts.php +7201 -0
  13. includes/class-Kirki_Scripts.php +296 -0
  14. includes/class-Kirki_Settings.php +232 -0
  15. includes/class-Kirki_Style_Background.php +79 -0
  16. includes/class-Kirki_Style_Color.php +47 -0
  17. includes/class-Kirki_Style_Fonts.php +135 -0
  18. includes/class-Kirki_Style_Generic.php +67 -0
  19. includes/controls/class-Kirki_Customize_Checkbox_Control.php +2 -39
  20. includes/controls/class-Kirki_Customize_Color_Control.php +12 -40
  21. includes/controls/class-Kirki_Customize_Group_Title_Control.php +26 -0
  22. includes/controls/class-Kirki_Customize_Image_Control.php +7 -44
  23. includes/controls/class-Kirki_Customize_Multicheck_Control.php +2 -37
  24. includes/controls/class-Kirki_Customize_Number_Control.php +2 -7
  25. includes/controls/class-Kirki_Customize_Radio_Control.php +5 -44
  26. includes/controls/class-Kirki_Customize_Sliderui_Control.php +5 -44
  27. includes/controls/class-Kirki_Customize_Text_Control.php +2 -38
  28. includes/controls/class-Kirki_Customize_Textarea_Control.php +2 -38
  29. includes/controls/class-Kirki_Customize_Upload_Control.php +4 -40
  30. includes/controls/class-Kirki_Select_Control.php +2 -38
  31. includes/controls/controls-init.php +0 -385
  32. includes/deprecated.php +21 -0
  33. includes/functions/background-css.php +0 -62
  34. includes/functions/color-functions.php +0 -126
  35. includes/required.php +55 -0
  36. kirki.php +72 -128
  37. readme.txt +45 -10
LICENSE CHANGED
File without changes
README.md CHANGED
File without changes
assets/css/customizer.css CHANGED
@@ -1,12 +1,3 @@
1
- body {
2
- font-family: 'Roboto', sans-serif;
3
- }
4
-
5
- h3,
6
- .customize-control-title {
7
- font-family: 'Roboto Slab', serif;
8
- }
9
-
10
li.customize-control.customize-control-slider input[type=text] {
11
width: 20%;
12
float: left;
@@ -54,38 +45,10 @@ li .image.ui-buttonset label.ui-button {
54
}
55
56
.customizer-subtitle {
57
- color: #999;
58
font-size: 0.9em;
59
margin-bottom: 5px;
60
}
61
62
- #customize-info .accordion-section-title,
63
- #customize-info .accordion-section-title:hover {
64
- color: #fff;
65
- }
66
-
67
- #customize-theme-controls .accordion-section-title {
68
- color: #fff;
69
- }
70
-
71
- #customize-theme-controls .control-section .accordion-section-title {
72
- color: #fff;
73
- }
74
-
75
- #customize-theme-controls .control-section .accordion-section-title:focus,
76
- #customize-theme-controls .control-section .accordion-section-title:hover,
77
- #customize-theme-controls .control-section.open .accordion-section-title,
78
- #customize-theme-controls .control-section:hover .accordion-section-title {
79
- color: #fff;
80
- }
81
-
82
- #customize-theme-controls .control-section .accordion-section-title:focus::after,
83
- #customize-theme-controls .control-section .accordion-section-title:hover::after,
84
- #customize-theme-controls .control-section.open .accordion-section-title::after,
85
- #customize-theme-controls .control-section:hover .accordion-section-title::after {
86
- color: #fff;
87
- }
88
-
89
div.kirki-customizer {
90
height: 80px;
91
}
@@ -115,10 +78,6 @@ div.kirki-customizer {
115
border: 0px !important;
116
}
117
118
- .customize-control-title {
119
- color: #555;
120
- }
121
-
122
li.customize-control {
123
margin: 5px 0;
124
}
@@ -130,3 +89,28 @@ li.customize-control {
130
div.kirki-customizer {
131
border-bottom: 1px solid rgba( 255, 255, 255, 0.2 );
132
}
1
li.customize-control.customize-control-slider input[type=text] {
2
width: 20%;
3
float: left;
45
}
46
47
.customizer-subtitle {
48
font-size: 0.9em;
49
margin-bottom: 5px;
50
}
51
52
div.kirki-customizer {
53
height: 80px;
54
}
78
border: 0px !important;
79
}
80
81
li.customize-control {
82
margin: 5px 0;
83
}
89
div.kirki-customizer {
90
border-bottom: 1px solid rgba( 255, 255, 255, 0.2 );
91
}
92
+
93
+ .hide {
94
+ display: none;
95
+ }
96
+
97
+ li.customize-control.customize-control-group_title {
98
+ background: #f7f7f7;
99
+ margin: 20px -20px;
100
+ padding: 5px 20px 0;
101
+ border-bottom: 1px solid #dedede;
102
+ border-top: 1px solid #dedede;
103
+ }
104
+
105
+ a.hint--left:after {
106
+ height: auto;
107
+ margin-bottom: -14px;
108
+ width: 250px;
109
+ max-width: 250px;
110
+ display: block;
111
+ white-space: normal;
112
+ text-align: right;
113
+ position: relative;
114
+ top: -22px;
115
+ left: -270px;
116
+ }
assets/css/hint.css ADDED
@@ -0,0 +1,293 @@
1
+ /*! Hint.css - v1.3.3 - 2014-07-06
2
+ * http://kushagragour.in/lab/hint/
3
+ * Copyright (c) 2014 Kushagra Gour; Licensed MIT */
4
+
5
+ /*-------------------------------------*\
6
+ HINT.css - A CSS tooltip library
7
+ \*-------------------------------------*/
8
+ /**
9
+ * HINT.css is a tooltip library made in pure CSS.
10
+ *
11
+ * Source: https://github.com/chinchang/hint.css
12
+ * Demo: http://kushagragour.in/lab/hint/
13
+ *
14
+ * Release under The MIT License
15
+ *
16
+ */
17
+ /**
18
+ * source: hint-core.scss
19
+ *
20
+ * Defines the basic styling for the tooltip.
21
+ * Each tooltip is made of 2 parts:
22
+ * 1) body (:after)
23
+ * 2) arrow (:before)
24
+ *
25
+ * Classes added:
26
+ * 1) hint
27
+ */
28
+ .hint, [data-hint] {
29
+ position: relative;
30
+ display: inline-block;
31
+ /**
32
+ * tooltip arrow
33
+ */
34
+ /**
35
+ * tooltip body
36
+ */ }
37
+ .hint:before, .hint:after, [data-hint]:before, [data-hint]:after {
38
+ position: absolute;
39
+ -webkit-transform: translate3d(0, 0, 0);
40
+ -moz-transform: translate3d(0, 0, 0);
41
+ transform: translate3d(0, 0, 0);
42
+ visibility: hidden;
43
+ opacity: 0;
44
+ z-index: 1000000;
45
+ pointer-events: none;
46
+ -webkit-transition: 0.3s ease;
47
+ -moz-transition: 0.3s ease;
48
+ transition: 0.3s ease;
49
+ -webkit-transition-delay: 0ms;
50
+ -moz-transition-delay: 0ms;
51
+ transition-delay: 0ms; }
52
+ .hint:hover:before, .hint:hover:after, .hint:focus:before, .hint:focus:after, [data-hint]:hover:before, [data-hint]:hover:after, [data-hint]:focus:before, [data-hint]:focus:after {
53
+ visibility: visible;
54
+ opacity: 1; }
55
+ .hint:hover:before, .hint:hover:after, [data-hint]:hover:before, [data-hint]:hover:after {
56
+ -webkit-transition-delay: 100ms;
57
+ -moz-transition-delay: 100ms;
58
+ transition-delay: 100ms; }
59
+ .hint:before, [data-hint]:before {
60
+ content: '';
61
+ position: absolute;
62
+ background: transparent;
63
+ border: 6px solid transparent;
64
+ z-index: 1000001; }
65
+ .hint:after, [data-hint]:after {
66
+ content: attr(data-hint);
67
+ background: #383838;
68
+ color: white;
69
+ padding: 8px 10px;
70
+ font-size: 12px;
71
+ line-height: 12px;
72
+ white-space: nowrap; }
73
+
74
+ /**
75
+ * source: hint-position.scss
76
+ *
77
+ * Defines the positoning logic for the tooltips.
78
+ *
79
+ * Classes added:
80
+ * 1) hint--top
81
+ * 2) hint--bottom
82
+ * 3) hint--left
83
+ * 4) hint--right
84
+ */
85
+ /**
86
+ * set default color for tooltip arrows
87
+ */
88
+ .hint--top:before {
89
+ border-top-color: #383838; }
90
+
91
+ .hint--bottom:before {
92
+ border-bottom-color: #383838; }
93
+
94
+ .hint--left:before {
95
+ border-left-color: #383838; }
96
+
97
+ .hint--right:before {
98
+ border-right-color: #383838; }
99
+
100
+ /**
101
+ * top tooltip
102
+ */
103
+ .hint--top:before {
104
+ margin-bottom: -12px; }
105
+ .hint--top:after {
106
+ margin-left: -18px; }
107
+ .hint--top:before, .hint--top:after {
108
+ bottom: 100%;
109
+ left: 50%; }
110
+ .hint--top:hover:after, .hint--top:hover:before, .hint--top:focus:after, .hint--top:focus:before {
111
+ -webkit-transform: translateY(-8px);
112
+ -moz-transform: translateY(-8px);
113
+ transform: translateY(-8px); }
114
+
115
+ /**
116
+ * bottom tooltip
117
+ */
118
+ .hint--bottom:before {
119
+ margin-top: -12px; }
120
+ .hint--bottom:after {
121
+ margin-left: -18px; }
122
+ .hint--bottom:before, .hint--bottom:after {
123
+ top: 100%;
124
+ left: 50%; }
125
+ .hint--bottom:hover:after, .hint--bottom:hover:before, .hint--bottom:focus:after, .hint--bottom:focus:before {
126
+ -webkit-transform: translateY(8px);
127
+ -moz-transform: translateY(8px);
128
+ transform: translateY(8px); }
129
+
130
+ /**
131
+ * right tooltip
132
+ */
133
+ .hint--right:before {
134
+ margin-left: -12px;
135
+ margin-bottom: -6px; }
136
+ .hint--right:after {
137
+ margin-bottom: -14px; }
138
+ .hint--right:before, .hint--right:after {
139
+ left: 100%;
140
+ bottom: 50%; }
141
+ .hint--right:hover:after, .hint--right:hover:before, .hint--right:focus:after, .hint--right:focus:before {
142
+ -webkit-transform: translateX(8px);
143
+ -moz-transform: translateX(8px);
144
+ transform: translateX(8px); }
145
+
146
+ /**
147
+ * left tooltip
148
+ */
149
+ .hint--left:before {
150
+ margin-right: -12px;
151
+ margin-bottom: -6px; }
152
+ .hint--left:after {
153
+ margin-bottom: -14px; }
154
+ .hint--left:before, .hint--left:after {
155
+ right: 100%;
156
+ bottom: 50%; }
157
+ .hint--left:hover:after, .hint--left:hover:before, .hint--left:focus:after, .hint--left:focus:before {
158
+ -webkit-transform: translateX(-8px);
159
+ -moz-transform: translateX(-8px);
160
+ transform: translateX(-8px); }
161
+
162
+ /**
163
+ * source: hint-color-types.scss
164
+ *
165
+ * Contains tooltips of various types based on color differences.
166
+ *
167
+ * Classes added:
168
+ * 1) hint--error
169
+ * 2) hint--warning
170
+ * 3) hint--info
171
+ * 4) hint--success
172
+ *
173
+ */
174
+ /**
175
+ * Error
176
+ */
177
+ .hint--error:after {
178
+ background-color: #b34e4d;
179
+ text-shadow: 0 -1px 0px #592726; }
180
+ .hint--error.hint--top:before {
181
+ border-top-color: #b34e4d; }
182
+ .hint--error.hint--bottom:before {
183
+ border-bottom-color: #b34e4d; }
184
+ .hint--error.hint--left:before {
185
+ border-left-color: #b34e4d; }
186
+ .hint--error.hint--right:before {
187
+ border-right-color: #b34e4d; }
188
+
189
+ /**
190
+ * Warning
191
+ */
192
+ .hint--warning:after {
193
+ background-color: #c09854;
194
+ text-shadow: 0 -1px 0px #6c5328; }
195
+ .hint--warning.hint--top:before {
196
+ border-top-color: #c09854; }
197
+ .hint--warning.hint--bottom:before {
198
+ border-bottom-color: #c09854; }
199
+ .hint--warning.hint--left:before {
200
+ border-left-color: #c09854; }
201
+ .hint--warning.hint--right:before {
202
+ border-right-color: #c09854; }
203
+
204
+ /**
205
+ * Info
206
+ */
207
+ .hint--info:after {
208
+ background-color: #3986ac;
209
+ text-shadow: 0 -1px 0px #193b4d; }
210
+ .hint--info.hint--top:before {
211
+ border-top-color: #3986ac; }
212
+ .hint--info.hint--bottom:before {
213
+ border-bottom-color: #3986ac; }
214
+ .hint--info.hint--left:before {
215
+ border-left-color: #3986ac; }
216
+ .hint--info.hint--right:before {
217
+ border-right-color: #3986ac; }
218
+
219
+ /**
220
+ * Success
221
+ */
222
+ .hint--success:after {
223
+ background-color: #458746;
224
+ text-shadow: 0 -1px 0px #1a321a; }
225
+ .hint--success.hint--top:before {
226
+ border-top-color: #458746; }
227
+ .hint--success.hint--bottom:before {
228
+ border-bottom-color: #458746; }
229
+ .hint--success.hint--left:before {
230
+ border-left-color: #458746; }
231
+ .hint--success.hint--right:before {
232
+ border-right-color: #458746; }
233
+
234
+ /**
235
+ * source: hint-always.scss
236
+ *
237
+ * Defines a persisted tooltip which shows always.
238
+ *
239
+ * Classes added:
240
+ * 1) hint--always
241
+ *
242
+ */
243
+ .hint--always:after, .hint--always:before {
244
+ opacity: 1;
245
+ visibility: visible; }
246
+ .hint--always.hint--top:after, .hint--always.hint--top:before {
247
+ -webkit-transform: translateY(-8px);
248
+ -moz-transform: translateY(-8px);
249
+ transform: translateY(-8px); }
250
+ .hint--always.hint--bottom:after, .hint--always.hint--bottom:before {
251
+ -webkit-transform: translateY(8px);
252
+ -moz-transform: translateY(8px);
253
+ transform: translateY(8px); }
254
+ .hint--always.hint--left:after, .hint--always.hint--left:before {
255
+ -webkit-transform: translateX(-8px);
256
+ -moz-transform: translateX(-8px);
257
+ transform: translateX(-8px); }
258
+ .hint--always.hint--right:after, .hint--always.hint--right:before {
259
+ -webkit-transform: translateX(8px);
260
+ -moz-transform: translateX(8px);
261
+ transform: translateX(8px); }
262
+
263
+ /**
264
+ * source: hint-rounded.scss
265
+ *
266
+ * Defines rounded corner tooltips.
267
+ *
268
+ * Classes added:
269
+ * 1) hint--rounded
270
+ *
271
+ */
272
+ .hint--rounded:after {
273
+ border-radius: 4px; }
274
+
275
+ /**
276
+ * source: hint-effects.scss
277
+ *
278
+ * Defines various transition effects for the tooltips.
279
+ *
280
+ * Classes added:
281
+ * 1) hint--no-animate
282
+ * 2) hint--bounce
283
+ *
284
+ */
285
+ .hint--no-animate:before, .hint--no-animate:after {
286
+ -webkit-transition-duration: 0ms;
287
+ -moz-transition-duration: 0ms;
288
+ transition-duration: 0ms; }
289
+
290
+ .hint--bounce:before, .hint--bounce:after {
291
+ -webkit-transition: opacity 0.3s ease, visibility 0.3s ease, -webkit-transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
292
+ -moz-transition: opacity 0.3s ease, visibility 0.3s ease, -moz-transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
293
+ transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24); }
assets/css/jquery-ui-1.10.0.custom.css CHANGED
File without changes
assets/css/kirki-styles.css ADDED
File without changes
assets/images/ui-icons_f6cf3b_256x240.png CHANGED
File without changes
assets/js/customizer.js CHANGED
@@ -1,25 +1,5 @@
1
jQuery.noConflict();
2
-
3
- /** Fire up jQuery - let's dance!
4
- */
5
jQuery(document).ready(function($){
6
-
7
- $('a.tooltip').tooltipsy({
8
- offset: [10, 0],
9
- css: {
10
- 'padding': '6px 15px',
11
- 'max-width': '200px',
12
- 'color': '#f7f7f7',
13
- 'background-color': '#222222',
14
- 'border': '1px solid #333333',
15
- '-moz-box-shadow': '0 0 10px rgba(0, 0, 0, .5)',
16
- '-webkit-box-shadow': '0 0 10px rgba(0, 0, 0, .5)',
17
- 'box-shadow': '0 0 10px rgba(0, 0, 0, .5)',
18
- 'text-shadow': 'none',
19
- 'border-radius' : '3px'
20
- }
21
- });
22
-
23
});
24
-
25
-
1
jQuery.noConflict();
2
+ /** Fire up jQuery - let's dance! */
3
jQuery(document).ready(function($){
4
+ $("a.tooltip").tooltip();
5
});
assets/js/tooltipsy.min.js DELETED
@@ -1,20 +0,0 @@
1
- /* tooltipsy by Brian Cray
2
- * Lincensed under GPL2 - http://www.gnu.org/licenses/gpl-2.0.html
3
- * Option quick reference:
4
- * - alignTo: "element" or "cursor" (Defaults to "element")
5
- * - offset: Tooltipsy distance from element or mouse cursor, dependent on alignTo setting. Set as array [x, y] (Defaults to [0, -1])
6
- * - content: HTML or text content of tooltip. Defaults to "" (empty string), which pulls content from target element's title attribute
7
- * - show: function(event, tooltip) to show the tooltip. Defaults to a show(100) effect
8
- * - hide: function(event, tooltip) to hide the tooltip. Defaults to a fadeOut(100) effect
9
- * - delay: A delay in milliseconds before showing a tooltip. Set to 0 for no delay. Defaults to 200
10
- * - css: object containing CSS properties and values. Defaults to {} to use stylesheet for styles
11
- * - className: DOM class for styling tooltips with CSS. Defaults to "tooltipsy"
12
- * - showEvent: Set a custom event to bind the show function. Defaults to mouseenter
13
- * - hideEvent: Set a custom event to bind the show function. Defaults to mouseleave
14
- * Method quick reference:
15
- * - $('element').data('tooltipsy').show(): Force the tooltip to show
16
- * - $('element').data('tooltipsy').hide(): Force the tooltip to hide
17
- * - $('element').data('tooltipsy').destroy(): Remove tooltip from DOM
18
- * More information visit http://tooltipsy.com/
19
- */
20
- ;(function(a){a.tooltipsy=function(c,b){this.options=b;this.$el=a(c);this.title=this.$el.attr("title")||"";this.$el.attr("title","");this.random=parseInt(Math.random()*10000);this.ready=false;this.shown=false;this.width=0;this.height=0;this.delaytimer=null;this.$el.data("tooltipsy",this);this.init()};a.tooltipsy.prototype={init:function(){var e=this,d,b=e.$el,c=b[0];e.settings=d=a.extend({},e.defaults,e.options);d.delay=+d.delay;if(typeof d.content==="function"){e.readify()}if(d.showEvent===d.hideEvent&&d.showEvent==="click"){b.toggle(function(f){if(d.showEvent==="click"&&c.tagName=="A"){f.preventDefault()}if(d.delay>0){e.delaytimer=window.setTimeout(function(){e.show(f)},d.delay)}else{e.show(f)}},function(f){if(d.showEvent==="click"&&c.tagName=="A"){f.preventDefault()}window.clearTimeout(e.delaytimer);e.delaytimer=null;e.hide(f)})}else{b.bind(d.showEvent,function(f){if(d.showEvent==="click"&&c.tagName=="A"){f.preventDefault()}e.delaytimer=window.setTimeout(function(){e.show(f)},d.delay||0)}).bind(d.hideEvent,function(f){if(d.showEvent==="click"&&c.tagName=="A"){f.preventDefault()}window.clearTimeout(e.delaytimer);e.delaytimer=null;e.hide(f)})}},show:function(i){if(this.ready===false){this.readify()}var b=this,f=b.settings,h=b.$tipsy,k=b.$el,d=k[0],g=b.offset(d);if(b.shown===false){if((function(m){var l=0,e;for(e in m){if(m.hasOwnProperty(e)){l++}}return l})(f.css)>0){b.$tip.css(f.css)}b.width=h.outerWidth();b.height=h.outerHeight()}if(f.alignTo==="cursor"&&i){var j=[i.clientX+f.offset[0],i.clientY+f.offset[1]];if(j[0]+b.width>a(window).width()){var c={top:j[1]+"px",right:j[0]+"px",left:"auto"}}else{var c={top:j[1]+"px",left:j[0]+"px",right:"auto"}}}else{var j=[(function(){if(f.offset[0]<0){return g.left-Math.abs(f.offset[0])-b.width}else{if(f.offset[0]===0){return g.left-((b.width-k.outerWidth())/2)}else{return g.left+k.outerWidth()+f.offset[0]}}})(),(function(){if(f.offset[1]<0){return g.top-Math.abs(f.offset[1])-b.height}else{if(f.offset[1]===0){return g.top-((b.height-b.$el.outerHeight())/2)}else{return g.top+b.$el.outerHeight()+f.offset[1]}}})()]}h.css({top:j[1]+"px",left:j[0]+"px"});b.settings.show(i,h.stop(true,true))},hide:function(c){var b=this;if(b.ready===false){return}if(c&&c.relatedTarget===b.$tip[0]){b.$tip.bind("mouseleave",function(d){if(d.relatedTarget===b.$el[0]){return}b.settings.hide(d,b.$tipsy.stop(true,true))});return}b.settings.hide(c,b.$tipsy.stop(true,true))},readify:function(){this.ready=true;this.$tipsy=a('<div id="tooltipsy'+this.random+'" style="position:fixed;z-index:2147483647;display:none">').appendTo("body");this.$tip=a('<div class="'+this.settings.className+'">').appendTo(this.$tipsy);this.$tip.data("rootel",this.$el);var c=this.$el;var b=this.$tip;this.$tip.html(this.settings.content!=""?(typeof this.settings.content=="string"?this.settings.content:this.settings.content(c,b)):this.title)},offset:function(b){return this.$el[0].getBoundingClientRect()},destroy:function(){if(this.$tipsy){this.$tipsy.remove();a.removeData(this.$el,"tooltipsy")}},defaults:{alignTo:"element",offset:[0,-1],content:"",show:function(c,b){b.fadeIn(100)},hide:function(c,b){b.fadeOut(100)},css:{},className:"tooltipsy",delay:200,showEvent:"mouseenter",hideEvent:"mouseleave"}};a.fn.tooltipsy=function(b){return this.each(function(){new a.tooltipsy(this,b)})}})(jQuery);
includes/class-Kirki_Color.php ADDED
@@ -0,0 +1,121 @@
1
+ <?php
2
+
3
+ class Kirki_Color {
4
+
5
+ /**
6
+ * Sanitize hex colors
7
+ */
8
+ public static function sanitize_hex( $color ) {
9
+
10
+ // Remove any spaces and special characters before and after the string
11
+ $color = trim( $color. ' \t\n\r\0\x0B' );
12
+ // Remove any trailing '#' symbols from the color value
13
+ $color = str_replace( '#', '', $color );
14
+ // If there are more than 6 characters, only keep the first 6.
15
+ $color = ( strlen( $color ) > 6 ) ? substr( $color, 0, 6 ) : $color;
16
+
17
+ if ( strlen( $color ) == 6 ) {
18
+
19
+ $hex = $color; // If string consists of 6 characters, then this is our color
20
+
21
+ } else {
22
+
23
+ // String is shorter than 6 characters.
24
+ // We will have to do some calculations below to get the actual 6-digit hex value.
25
+
26
+ // If the string is longer than 3 characters, only keep the first 3.
27
+ $color = ( strlen( $color ) > 3 ) ? substr( $color, 0, 3 ) : $color;
28
+
29
+ // If this is a 3-character string, format it to 6 characters.
30
+ if ( 3 == strlen( $color ) ) {
31
+
32
+ $red = substr( $color, 0, 1 ) . substr( $color, 0, 1 );
33
+ $green = substr( $color, 1, 1 ) . substr( $color, 1, 1 );
34
+ $blue = substr( $color, 2, 1 ) . substr( $color, 2, 1 );
35
+
36
+ $hex = $red . $green . $blue;
37
+
38
+ }
39
+
40
+ // If this is shorter than 3 characters, do some voodoo.
41
+ if ( 2 == strlen( $color ) ) {
42
+ $hex = $color . $color . $color;
43
+ } else if ( 1 == strlen( $color ) ) {
44
+ $hex = $color . $color . $color . $color . $color . $color;
45
+ }
46
+
47
+ }
48
+
49
+ return '#' . $hex;
50
+
51
+ }
52
+
53
+ /*
54
+ * Gets the rgb value of the $hex color.
55
+ * Returns an array.
56
+ */
57
+ public static function get_rgb( $hex, $implode = false ) {
58
+
59
+ // Remove any trailing '#' symbols from the color value
60
+ $hex = str_replace( '#', '', self::sanitize_hex( $hex ) );
61
+
62
+ $red = hexdec( substr( $hex, 0, 2 ) );
63
+ $green = hexdec( substr( $hex, 2, 2 ) );
64
+ $blue = hexdec( substr( $hex, 4, 2 ) );
65
+
66
+ // rgb is an array
67
+ $rgb = array( $red, $green, $blue );
68
+ if ( $implode ) {
69
+ return implode( ',', $rgb );
70
+ } else {
71
+ return $rgb;
72
+ }
73
+
74
+ }
75
+
76
+ /*
77
+ * Gets the rgba value of a color.
78
+ */
79
+ public static function get_rgba( $hex = '#fff', $opacity = 100 ) {
80
+
81
+ $hex = self::sanitize_hex( $hex );
82
+
83
+ if ( 100 <= $opacity ) { // Set the opacity to 100 if a larger value has been entered by mistake.
84
+ $opacity = 100;
85
+ } elseif ( 0 > $opacity ) { // If a negative value is used, then set to 0.
86
+ $opacity = 0;
87
+ } elseif ( $opacity < 1 && $opacity != 0 ) { // If an opacity value is entered in a decimal form (for example 0.25), then multiply by 100.
88
+ $opacity = ( $opacity * 100 );
89
+ } else { // Normal value has been entered
90
+ $opacity = $opacity;
91
+ }
92
+
93
+ // Divide the opacity by 100 to end-up with a CSS value for the opacity
94
+ $opacity = ( $opacity / 100 );
95
+
96
+ $color = 'rgba(' . self::get_rgb( $hex, true ) . ', ' . $opacity . ')';
97
+
98
+ return $color;
99
+
100
+ }
101
+
102
+ /*
103
+ * Gets the brightness of the $hex color.
104
+ * Returns a value between 0 and 255
105
+ */
106
+ public static function get_brightness( $hex ) {
107
+
108
+ $hex = self::sanitize_hex( $hex );
109
+ // returns brightness value from 0 to 255
110
+ // strip off any leading #
111
+ $hex = str_replace( '#', '', $hex );
112
+
113
+ $red = hexdec( substr( $hex, 0, 2 ) );
114
+ $green = hexdec( substr( $hex, 2, 2 ) );
115
+ $blue = hexdec( substr( $hex, 4, 2 ) );
116
+
117
+ return ( ( $red * 299 ) + ( $green * 587 ) + ( $blue * 114 ) ) / 1000;
118
+
119
+ }
120
+
121
+ }
includes/class-Kirki_Controls.php ADDED
@@ -0,0 +1,302 @@
1
+ <?php
2
+
3
+
4
+ class Kirki_Controls extends Kirki {
5
+
6
+ function add_control( $wp_customize, $control ) {
7
+
8
+ // Checkbox control
9
+ if ( 'checkbox' == $control['type'] ) {
10
+
11
+ $wp_customize->add_control( new Kirki_Customize_Checkbox_Control( $wp_customize, $control['setting'], array(
12
+ 'label' => isset( $control['label'] ) ? $control['label'] : '',
13
+ 'section' => $control['section'],
14
+ 'settings' => $control['setting'],
15
+ 'priority' => $control['priority'],
16
+ 'description' => isset( $control['description'] ) ? $control['description'] : null,
17
+ 'subtitle' => isset( $control['subtitle'] ) ? $control['subtitle'] : '',
18
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
19
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
20
+ ) ) );
21
+
22
+ // Background Control
23
+ } elseif ( 'background' == $control['type'] ) {
24
+
25
+ $wp_customize->add_control( new Kirki_Customize_Color_Control( $wp_customize, $control['setting'] . '_color', array(
26
+ 'label' => isset( $control['label'] ) ? $control['label'] : '',
27
+ 'section' => $control['section'],
28
+ 'settings' => $control['setting'] . '_color',
29
+ 'priority' => $control['priority'],
30
+ 'description' => isset( $control['description'] ) ? $control['description'] : null,
31
+ 'subtitle' => __( 'Background Color', 'kirki' ),
32
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
33
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
34
+ ) ) );
35
+
36
+ $wp_customize->add_control( new Kirki_Customize_Image_Control( $wp_customize, $control['setting'] . '_image', array(
37
+ 'label' => null,
38
+ 'section' => $control['section'],
39
+ 'settings' => $control['setting'] . '_image',
40
+ 'priority' => $control['priority'] + 1,
41
+ 'description' => null,
42
+ 'subtitle' => __( 'Background Image', 'kirki' ),
43
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
44
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
45
+ ) ) );
46
+
47
+ $wp_customize->add_control( new Kirki_Select_Control( $wp_customize, $control['setting'] . '_repeat', array(
48
+ 'label' => null,
49
+ 'section' => $control['section'],
50
+ 'settings' => $control['setting'] . '_repeat',
51
+ 'priority' => $control['priority'] + 2,
52
+ 'choices' => array(
53
+ 'no-repeat' => __( 'No Repeat', 'kirki' ),
54
+ 'repeat' => __( 'Repeat All', 'kirki' ),
55
+ 'repeat-x' => __( 'Repeat Horizontally', 'kirki' ),
56
+ 'repeat-y' => __( 'Repeat Vertically', 'kirki' ),
57
+ 'inherit' => __( 'Inherit', 'kirki' )
58
+ ),
59
+ 'description' => null,
60
+ 'subtitle' => __( 'Background Repeat', 'kirki' ),
61
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
62
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
63
+ ) ) );
64
+
65
+ $wp_customize->add_control( new Kirki_Customize_Radio_Control( $wp_customize, $control['setting'] . '_size', array(
66
+ 'label' => null,
67
+ 'section' => $control['section'],
68
+ 'settings' => $control['setting'] . '_size',
69
+ 'priority' => $control['priority'] + 3,
70
+ 'choices' => array(
71
+ 'inherit' => __( 'Inherit', 'kirki' ),
72
+ 'cover' => __( 'Cover', 'kirki' ),
73
+ 'contain' => __( 'Contain', 'kirki' ),
74
+ ),
75
+ 'description' => null,
76
+ 'mode' => 'buttonset',
77
+ 'subtitle' => __( 'Background Size', 'kirki' ),
78
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
79
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
80
+ ) ) );
81
+
82
+ $wp_customize->add_control( new Kirki_Customize_Radio_Control( $wp_customize, $control['setting'] . '_attach', array(
83
+ 'label' => null,
84
+ 'section' => $control['section'],
85
+ 'settings' => $control['setting'] . '_attach',
86
+ 'priority' => $control['priority'] + 4,
87
+ 'choices' => array(
88
+ 'inherit' => __( 'Inherit', 'kirki' ),
89
+ 'fixed' => __( 'Fixed', 'kirki' ),
90
+ 'scroll' => __( 'Scroll', 'kirki' ),
91
+ ),
92
+ 'description' => null,
93
+ 'mode' => 'buttonset',
94
+ 'subtitle' => __( 'Background Attachment', 'kirki' ),
95
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
96
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
97
+ ) ) );
98
+
99
+ $wp_customize->add_control( new Kirki_Select_Control( $wp_customize, $control['setting'] . '_position', array(
100
+ 'label' => null,
101
+ 'section' => $control['section'],
102
+ 'settings' => $control['setting'] . '_position',
103
+ 'priority' => $control['priority'] + 5,
104
+ 'choices' => array(
105
+ 'left-top' => __( 'Left Top', 'kirki' ),
106
+ 'left-center' => __( 'Left Center', 'kirki' ),
107
+ 'left-bottom' => __( 'Left Bottom', 'kirki' ),
108
+ 'right-top' => __( 'Right Top', 'kirki' ),
109
+ 'right-center' => __( 'Right Center', 'kirki' ),
110
+ 'right-bottom' => __( 'Right Bottom', 'kirki' ),
111
+ 'center-top' => __( 'Center Top', 'kirki' ),
112
+ 'center-center' => __( 'Center Center', 'kirki' ),
113
+ 'center-bottom' => __( 'Center Bottom', 'kirki' ),
114
+ ),
115
+ 'description' => null,
116
+ 'subtitle' => __( 'Background Position', 'kirki' ),
117
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
118
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
119
+ ) ) );
120
+
121
+ if ( false != $control['default']['opacity'] ) {
122
+ $wp_customize->add_control( new Kirki_Customize_Sliderui_Control( $wp_customize, $control['setting'] . '_opacity', array(
123
+ 'label' => null,
124
+ 'section' => $control['section'],
125
+ 'settings' => $control['setting'] . '_opacity',
126
+ 'priority' => $control['priority'] + 6,
127
+ 'choices' => array(
128
+ 'min' => 0,
129
+ 'max' => 100,
130
+ 'step' => 1,
131
+ ),
132
+ 'description' => null,
133
+ 'subtitle' => __( 'Background Opacity', 'kirki' ),
134
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
135
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
136
+ ) ) );
137
+ }
138
+
139
+ // Color Control
140
+ } elseif ( 'color' == $control['type'] ) {
141
+
142
+ $wp_customize->add_control( new Kirki_Customize_Color_Control( $wp_customize, $control['setting'], array(
143
+ 'label' => isset( $control['label'] ) ? $control['label'] : '',
144
+ 'section' => $control['section'],
145
+ 'settings' => $control['setting'],
146
+ 'priority' => isset( $control['priority'] ) ? $control['priority'] : '',
147
+ 'description' => isset( $control['description'] ) ? $control['description'] : null,
148
+ 'subtitle' => isset( $control['subtitle'] ) ? $control['subtitle'] : '',
149
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
150
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
151
+ ) ) );
152
+
153
+ // Image Control
154
+ } elseif ( 'image' == $control['type'] ) {
155
+
156
+ $wp_customize->add_control( new Kirki_Customize_Image_Control( $wp_customize, $control['setting'], array(
157
+ 'label' => isset( $control['label'] ) ? $control['label'] : '',
158
+ 'section' => $control['section'],
159
+ 'settings' => $control['setting'],
160
+ 'priority' => $control['priority'],
161
+ 'description' => isset( $control['description'] ) ? $control['description'] : null,
162
+ 'subtitle' => isset( $control['subtitle'] ) ? $control['subtitle'] : '',
163
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
164
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
165
+ ) ) );
166
+
167
+ // Radio Control
168
+ } elseif ( 'radio' == $control['type'] ) {
169
+
170
+ $wp_customize->add_control( new Kirki_Customize_Radio_Control( $wp_customize, $control['setting'], array(
171
+ 'label' => isset( $control['label'] ) ? $control['label'] : '',
172
+ 'section' => $control['section'],
173
+ 'settings' => $control['setting'],
174
+ 'priority' => $control['priority'],
175
+ 'choices' => $control['choices'],
176
+ 'description' => isset( $control['description'] ) ? $control['description'] : null,
177
+ 'mode' => isset( $control['mode'] ) ? $control['mode'] : 'radio', // Can be 'radio', 'image' or 'buttonset'.
178
+ 'subtitle' => isset( $control['subtitle'] ) ? $control['subtitle'] : '',
179
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
180
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
181
+ ) ) );
182
+
183
+ // Select Control
184
+ } elseif ( 'select' == $control['type'] ) {
185
+
186
+ $wp_customize->add_control( new Kirki_Select_Control( $wp_customize, $control['setting'], array(
187
+ 'label' => isset( $control['label'] ) ? $control['label'] : '',
188
+ 'section' => $control['section'],
189
+ 'settings' => $control['setting'],
190
+ 'priority' => $control['priority'],
191
+ 'choices' => $control['choices'],
192
+ 'description' => isset( $control['description'] ) ? $control['description'] : null,
193
+ 'subtitle' => isset( $control['subtitle'] ) ? $control['subtitle'] : '',
194
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
195
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
196
+ ) ) );
197
+
198
+ // Slider Control
199
+ } elseif ( 'slider' == $control['type'] ) {
200
+
201
+ $wp_customize->add_control( new Kirki_Customize_Sliderui_Control( $wp_customize, $control['setting'], array(
202
+ 'label' => isset( $control['label'] ) ? $control['label'] : '',
203
+ 'section' => $control['section'],
204
+ 'settings' => $control['setting'],
205
+ 'priority' => $control['priority'],
206
+ 'choices' => $control['choices'],
207
+ 'description' => isset( $control['description'] ) ? $control['description'] : null,
208
+ 'subtitle' => isset( $control['subtitle'] ) ? $control['subtitle'] : '',
209
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
210
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
211
+ ) ) );
212
+
213
+ // Text Control
214
+ } elseif ( 'text' == $control['type'] ) {
215
+
216
+ $wp_customize->add_control( new Kirki_Customize_Text_Control( $wp_customize, $control['setting'], array(
217
+ 'label' => isset( $control['label'] ) ? $control['label'] : '',
218
+ 'section' => $control['section'],
219
+ 'settings' => $control['setting'],
220
+ 'priority' => $control['priority'],
221
+ 'description' => isset( $control['description'] ) ? $control['description'] : null,
222
+ 'subtitle' => isset( $control['subtitle'] ) ? $control['subtitle'] : '',
223
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
224
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
225
+ ) ) );
226
+
227
+ // Text Control
228
+ } elseif ( 'textarea' == $control['type'] ) {
229
+
230
+ $wp_customize->add_control( new Kirki_Customize_Textarea_Control( $wp_customize, $control['setting'], array(
231
+ 'label' => $control['label'],
232
+ 'section' => $control['section'],
233
+ 'settings' => $control['setting'],
234
+ 'priority' => $control['priority'],
235
+ 'description' => isset( $control['description'] ) ? $control['description'] : null,
236
+ 'subtitle' => isset( $control['subtitle'] ) ? $control['subtitle'] : '',
237
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
238
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
239
+ ) ) );
240
+
241
+ // Upload Control
242
+ } elseif ( 'upload' == $control['type'] ) {
243
+
244
+ $wp_customize->add_control( new Kirki_Customize_Upload_Control( $wp_customize, $control['setting'], array(
245
+ 'label' => $control['label'],
246
+ 'section' => $control['section'],
247
+ 'settings' => $control['setting'],
248
+ 'priority' => $control['priority'],
249
+ 'choices' => $control['choices'],
250
+ 'description' => isset( $control['description'] ) ? $control['description'] : null,
251
+ 'subtitle' => isset( $control['subtitle'] ) ? $control['subtitle'] : '',
252
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
253
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
254
+ ) ) );
255
+
256
+ // Number Control
257
+ } elseif ( 'number' == $control['type'] ) {
258
+
259
+ $wp_customize->add_control( new Kirki_Customize_Number_Control( $wp_customize, $control['setting'], array(
260
+ 'label' => $control['label'],
261
+ 'section' => $control['section'],
262
+ 'settings' => $control['setting'],
263
+ 'priority' => $control['priority'],
264
+ 'description' => isset( $control['description'] ) ? $control['description'] : null,
265
+ 'subtitle' => isset( $control['subtitle'] ) ? $control['subtitle'] : '',
266
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
267
+ ) ) );
268
+
269
+ // Multicheck Control
270
+ } elseif ( 'multicheck' == $control['type'] ) {
271
+
272
+ $wp_customize->add_control( new Kirki_Customize_Multicheck_Control( $wp_customize, $control['setting'], array(
273
+ 'label' => $control['label'],
274
+ 'section' => $control['section'],
275
+ 'settings' => $control['setting'],
276
+ 'priority' => $control['priority'],
277
+ 'choices' => $control['choices'],
278
+ 'description' => isset( $control['description'] ) ? $control['description'] : null,
279
+ 'subtitle' => isset( $control['subtitle'] ) ? $control['subtitle'] : '',
280
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
281
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
282
+ ) ) );
283
+
284
+ // Separator Controls
285
+ } elseif ( 'group_title' == $control['type'] ) {
286
+
287
+ $wp_customize->add_control( new Kirki_Customize_Group_Title_Control( $wp_customize, $control['setting'], array(
288
+ 'label' => $control['label'],
289
+ 'section' => $control['section'],
290
+ 'settings' => $control['setting'],
291
+ 'priority' => $control['priority'],
292
+ 'description' => isset( $control['description'] ) ? $control['description'] : null,
293
+ 'subtitle' => isset( $control['subtitle'] ) ? $control['subtitle'] : '',
294
+ 'required' => isset( $control['required'] ) ? $control['required'] : array(),
295
+ 'transport' => isset( $control['transport'] ) ? $control['transport'] : 'refresh',
296
+ ) ) );
297
+
298
+ }
299
+
300
+ }
301
+
302
+ }
includes/class-Kirki_Fonts.php ADDED
@@ -0,0 +1,7201 @@