WordPress Page Builder – Beaver Builder

Version Description

Release Info

Developer	pross
Plugin	WordPress Page Builder – Beaver Builder
Version	2.2.0.6
Comparing to
See all releases

Code changes from version 2.1.7.2 to 2.2.0.6

Files changed (152) hide show

changelog.txt +420 -3
classes/class-fl-builder-admin-posts.php +2 -3
classes/class-fl-builder-ajax-layout.php +51 -44
classes/class-fl-builder-ajax.php +4 -3
classes/class-fl-builder-art.php +798 -0
classes/class-fl-builder-color.php +178 -24
classes/class-fl-builder-css.php +530 -0
classes/class-fl-builder-debug.php +7 -1
classes/class-fl-builder-fonts.php +132 -57
classes/class-fl-builder-loader.php +5 -1
classes/class-fl-builder-model.php +136 -69
classes/class-fl-builder-module.php +15 -2
classes/class-fl-builder-settings-compat-column.php +46 -0
classes/class-fl-builder-settings-compat-generic.php +20 -0
classes/class-fl-builder-settings-compat-helper.php +164 -0
classes/class-fl-builder-settings-compat-module.php +21 -0
classes/class-fl-builder-settings-compat-row.php +24 -0
classes/class-fl-builder-settings-compat.php +101 -0
classes/class-fl-builder-settings-presets.php +104 -0
classes/class-fl-builder-ui-content-panel.php +4 -0
classes/class-fl-builder-ui-settings-forms.php +20 -0
classes/class-fl-builder-wp-blocks-layout.php +12 -8
classes/class-fl-builder.php +277 -76
css/animations/bounce-down.css +68 -0
css/animations/bounce-in.css +80 -0
css/animations/bounce-left.css +68 -0
css/animations/bounce-right.css +68 -0
css/animations/bounce-up.css +68 -0
css/animations/bounce.css +64 -0
css/animations/fade-down.css +28 -0
css/animations/fade-in.css +20 -0
css/animations/fade-left.css +28 -0
css/animations/fade-right.css +28 -0
css/animations/fade-up.css +28 -0
css/animations/fancy-flash.css +26 -0
css/animations/fancy-jack-box.css +48 -0
css/animations/fancy-jello.css +78 -0
css/animations/fancy-light-speed.css +48 -0
css/animations/fancy-pulse.css +32 -0
css/animations/fancy-roll-in.css +28 -0
css/animations/fancy-rubber-band.css +64 -0
css/animations/fancy-shake.css +48 -0
css/animations/fancy-swing.css +50 -0
css/animations/fancy-tada.css +60 -0
css/animations/fancy-wobble.css +64 -0
css/animations/flip-horizontal.css +62 -0
css/animations/flip-vertical.css +62 -0
css/animations/rotate-down-left.css +36 -0
css/animations/rotate-down-right.css +36 -0
css/animations/rotate-in.css +36 -0
css/animations/rotate-up-left.css +36 -0
css/animations/rotate-up-right.css +36 -0
css/animations/slide-in-down.css +26 -0
css/animations/slide-in-left.css +26 -0
css/animations/slide-in-right.css +26 -0
css/animations/slide-in-up.css +26 -0
css/animations/zoom-down.css +36 -0
css/animations/zoom-in.css +24 -0
css/animations/zoom-left.css +36 -0
css/animations/zoom-right.css +36 -0
css/animations/zoom-up.css +36 -0
css/build/builder.bundle.css +11 -3
css/build/builder.bundle.min.css +1 -1
css/editor.css +6 -1
css/fl-builder-layout.css +93 -107
css/fl-builder-rtl.css +151 -33
css/fl-builder-ui-skin-dark.css +130 -38
css/fl-builder.css +1070 -247
css/fl-builder.min.css +1 -1
css/fl-color-picker.css +16 -7
css/fl-lightbox.css +26 -13
css/jquery.tiptip.css +1 -0
fl-builder.php +1 -1
fonts/fontawesome/css/all.min.css +2 -2
fonts/fontawesome/webfonts/fa-brands-400.eot +0 -0
fonts/fontawesome/webfonts/fa-brands-400.svg +2 -2
fonts/fontawesome/webfonts/fa-brands-400.ttf +0 -0
fonts/fontawesome/webfonts/fa-brands-400.woff +0 -0
fonts/fontawesome/webfonts/fa-brands-400.woff2 +0 -0
fonts/fontawesome/webfonts/fa-regular-400.eot +0 -0
fonts/fontawesome/webfonts/fa-regular-400.svg +1 -1
fonts/fontawesome/webfonts/fa-regular-400.ttf +0 -0
fonts/fontawesome/webfonts/fa-regular-400.woff +0 -0
fonts/fontawesome/webfonts/fa-regular-400.woff2 +0 -0
fonts/fontawesome/webfonts/fa-solid-900.eot +0 -0
fonts/fontawesome/webfonts/fa-solid-900.svg +5 -2
fonts/fontawesome/webfonts/fa-solid-900.ttf +0 -0
fonts/fontawesome/webfonts/fa-solid-900.woff +0 -0
fonts/fontawesome/webfonts/fa-solid-900.woff2 +0 -0
img/svg/select-arrow-down-alt2-light.svg +1 -1
img/svg/select-arrow-down-alt2.svg +1 -1
img/transp_bg.png +0 -0
includes/admin-settings-welcome.php +7 -8
includes/column-css.php +137 -76
includes/column-settings.php +203 -188
includes/column.php +3 -2
includes/compatibility.php +24 -0
includes/global-settings.php +80 -11
includes/jquery.php +0 -8
includes/module-settings.php +46 -43
includes/module.php +4 -2
includes/row-css.php +182 -112
includes/row-settings.php +237 -145
includes/row.php +4 -3
includes/shape-layer.php +42 -0
includes/shapes/circle.svg.php +1 -0
includes/shapes/concave.svg.php +1 -0
includes/shapes/dot-cluster.svg.php +28 -0
includes/shapes/edge-slant.svg.php +1 -0
includes/shapes/midpoint.svg.php +1 -0
includes/shapes/rect.svg.php +1 -0
includes/shapes/star.svg.php +1 -0
includes/shapes/topography.svg.php +1 -0
includes/shapes/triangle.svg.php +1 -0
includes/shapes/triangles.svg.php +8 -0
includes/shapes/wavy.svg.php +1 -0
includes/ui-field-align.php +31 -0
includes/ui-field-animation.php +143 -0
includes/ui-field-border.php +162 -0
includes/ui-field-button-group.php +31 -0
includes/ui-field-color.php +7 -1
includes/ui-field-date.php +7 -0
includes/ui-field-dimension.php +106 -45
includes/ui-field-font.php +30 -7
includes/ui-field-form.php +3 -1
includes/ui-field-gradient.php +112 -0
includes/ui-field-icon.php +21 -2
includes/ui-field-link.php +24 -0
includes/ui-field-photo.php +21 -5
includes/ui-field-preset.php +5 -0
includes/ui-field-raw.php +1 -0
includes/ui-field-select.php +16 -0
includes/ui-field-shadow.php +82 -0
includes/ui-field-shape-transform.php +105 -0
includes/ui-field-typography.php +237 -0
includes/ui-field-unit.php +52 -6
includes/ui-field.php +8 -9
includes/ui-js-config.php +3 -1
includes/ui-js-templates.php +55 -18
includes/ui-settings-form-row.php +8 -2
includes/ui-settings-form.php +25 -9
includes/updater-config.php +1 -1
includes/updater/classes/class-fl-updater.php +2 -0
includes/vendor/activecampaign/Connector.class.php +4 -6
includes/vendor/aweber/oauth_application.php +5 -5
includes/vendor/drip/Drip_API.class.php +18 -19
includes/vendor/enormail/Enormail/Rest.php +37 -38
includes/vendor/icontact/iContactApi.php +63 -64
includes/vendor/mailerlite/FL_ML_Rest_Base.php +1 -2
includes/vendor/mautic/MauticApi.php +0 -2
includes/vendor/sendinblue/Mailin.php +1 -4
js/build/builder.bundle.js +29 -56

changelog.txt CHANGED Viewed

@@ -1,3 +1,423 @@
             <h4>2.1.7.2 - 01/02/2019</h4>
             <p><strong>Hot Fix</strong></p>
             <ul>
@@ -62,7 +482,6 @@
             	<li>Fixed issue with layout shortcodes in Wocommerce description not rendering their assets.</li>
             </ul>
-            -
             <h4>2.1.6.3 - 10/30/2018</h4>
             <p><strong>Halloween Hot Fix</strong></p>
             <ul>
@@ -176,7 +595,6 @@
               <li>Fixed CORS issue on Pantheon hosting.</li>
             </ul>
-            -
             <h4>2.1.4.5 - 09/10/2018</h4>
             <p><strong>HotFix</strong></p>
             <ul>
@@ -229,7 +647,6 @@
             		</ul>
             	</li>
             </ul>
-            -
             <p><strong>Bug Fixes</strong></p>
             <ul>
             	<li>Fixed issue with paginated category archives not correctly returning a 404 when there are no posts.</li>


1	+ <h4>2.2.0.6 - 01/24/2019</h4>
2	+ <p><strong>Hot Fix</strong></p>
3	+ <ul>
4	+ <li>Update Font Awesome to 5.6.3</li>
5	+ <li>Fixed PHP warnings in Heading module if non existent font is selected when upgrading to 2.2</li>
6	+ <li>Fixed theme white labeling not escaping apostrophes.</li>
7	+ <li>Fixed Themer Preview menu being incorrectly centered.</li>
8	+ <li>Fixed Content Slider button alignment.</li>
9	+ <li>Fixed margin/padding placeholders not showing as zero when the global settings are empty.</li>
10	+ <li>Fixed posts not being converted to the BB block when updating to 5.0</li>
11	+ <li>Fixed Builder link missing on new page when classic editor plugin is active.</li>
12	+ </ul>
13	+
14	+ <h4>2.2.0.5 - 01/14/2019</h4>
15	+ <p><strong>Bug Fixes</strong></p>
16	+ <ul>
17	+ <li>Fixed fatal error with Livemesh addons.</li>
18	+ <li>Fixed Google Fonts showing italic when set to default/normal.</li>
19	+ <li>Fixed Menu Module font sizes.</li>
20	+ </ul>
21	+
22	+ <h4>2.2.0.4 - 01/10/2019</h4>
23	+ <p><strong>Bug Fixes</strong></p>
24	+ <ul>
25	+ <li>Fixed fade left/right animations being reversed when updating to 2.2.</li>
26	+ <li>Fixed row width unit not applying to new rows when changed in the global settings.</li>
27	+ <li>Fixed Powerpack overlay setting not showing in 2.2.</li>
28	+ </ul>
29	+
30	+ <h4>2.2.0.3 - 01/08/2019</h4>
31	+ <p><strong>Enhancements</strong></p>
32	+ <ul>
33	+ <li>Added 12 new pre-built row templates for a total of 100.</li>
34	+ <li>Added typography settings for the caption in the photo module.</li>
35	+ <li>You can now select font weights for the default font.</li>
36	+ </ul>
37	+ <p><strong>Bug Fixes</strong></p>
38	+ <ul>
39	+ <li>Fixed various RTL issues with 2.2.</li>
40	+ <li>Fixed BB's admin UI for the Classic Editor plugin not showing in certain cases.</li>
41	+ <li>Fixed typography settings only falling back to sans-serif.</li>
42	+ <li>Fixed 'Default' showing twice for the default font weight.</li>
43	+ <li>Fixed responsive editing mode not always picking up the medium size as a fallback for the small size.</li>
44	+ </ul>
45	+
46	+ <h4>2.2.0.2 - 12/12/2018</h4>
47	+ <p><strong>Hot Fix</strong></p>
48	+ <ul>
49	+ <li>Update Font Awesome to 5.6.1</li>
50	+ <li>Fixed hidden editor when ACF is active on post/page edit screen.</li>
51	+ <li>Fixed PHP fatal error caused by SEO Press plugin when adding layouts/templates.</li>
52	+ <li>Fixed a JS error when using Cloudfront platform.</li>
53	+ <li>Fixed missing excerpts for posts module in WP 5.0</li>
54	+ </ul>
55	+
56	+ <h4>2.2.0.1 - 12/03/2018</h4>
57	+ <p><strong>Bug Fixes</strong></p>
58	+ <ul>
59	+ <li>Fixed internal server error with the video module when bcmath is not enabled in PHP.</li>
60	+ <li>Fixed JS error when using CloudFront.</li>
61	+ </ul>
62	+
63	+ <h4>2.2 - 11/27/2018</h4>
64	+ <p>Beaver Builder 2.2 is here! This is a major update and will be released as the official download on the <u>My Account page first</u>. Remote updates to all existing sites will begin in early January.</p>
65	+ <p><strong>Enhancements</strong></p>
66	+ <ul>
67	+ <li>Added settings for selecting either div, article or li containers for posts in the posts module.</li>
68	+ <li>Renamed "Header" prebuilt rows to "Heroes."</li>
69	+ </ul>
70	+ <p><strong>Bug Fixes</strong></p>
71	+ <ul>
72	+ <li>Fixed duplicate prebuilt rows showing in the content panel.</li>
73	+ <li>Fixed not being able to select 0% alpha or 100% black in the color picker.</li>
74	+ <li>Fixed settings panels rendering off screen in certain cases.</li>
75	+ <li>Fixed featured images not respecting the posts module border radius setting.</li>
76	+ <li>Fixed posts module box shadows being cut off.</li>
77	+ <li>Fixed photo module responsive alignment not working correctly.</li>
78	+ <li>Fixed low contrast text in the module search input while using dark mode.</li>
79	+ <li>Fixed columns disappearing when clicking the move option without moving the column.</li>
80	+ <li>Fixed row and column background overlays not respecting the border radius settings.</li>
81	+ </ul>
82	+
83	+ <h4>2.2-beta.3 - 11/13/2018</h4>
84	+ <p><strong>Bug Fixes</strong></p>
85	+ <ul>
86	+ <li>Fixed vertically aligned columns not working on small devices.</li>
87	+ <li>Fixed equal height columns not working while the builder is active when device size logic has been applied to the column.</li>
88	+ <li>Fixed responsive preview not correctly rendering image widths with an empty setting value.</li>
89	+ <li>Fixed menu module link spacing when updating to 2.2.</li>
90	+ <li>Fixed menu module background color when updating to 2.2.</li>
91	+ <li>Fixed icons with backgrounds having wrong line height.</li>
92	+ <li>Fixed settings menus cut off in responsive editing mode.</li>
93	+ </ul>
94	+
95	+ <h4>2.2-beta.2 - 11/09/2018</h4>
96	+ <p><strong>Enhancements</strong></p>
97	+ <ul>
98	+ <li>Added labels to the first row of the border field's general section.</li>
99	+ <li>Added structured data settings to the video module.</li>
100	+ <li>Added a remove button for row background videos.</li>
101	+ <li>Added default option for font weights so strong tags still work when a family is selected.</li>
102	+ <li>Added the ability to collapse settings sections by clicking the entire section header.</li>
103	+ </ul>
104	+ <p><strong>Bug Fixes</strong></p>
105	+ <ul>
106	+ <li>Fixed italic Google fonts not working correctly.</li>
107	+ <li>Fixed CSS errors with empty icon group styles.</li>
108	+ <li>Fixed CSS/JS for hidden nodes still rendering on the page.</li>
109	+ <li>Fixed responsive photo fields not working correctly.</li>
110	+ <li>Fixed repeater photo fields not working correctly.</li>
111	+ <li>Fixed menu module font size defaulting to zero.</li>
112	+ <li>Fixed responsive preview not working when parsing a stylesheet fails with a CORS error.</li>
113	+ </ul>
114	+
115	+ <h4>2.2-beta.1 - 10/24/2018</h4>
116	+ <p><strong>Enhancements</strong></p>
117	+ <ul>
118	+ <li>Added prebuilt rows to the content panel.</li>
119	+ </ul>
120	+
121	+ <h4>2.2-alpha.2 - 10/04/2018</h4>
122	+ <p><strong>Enhancements</strong></p>
123	+ <ul>
124	+ <li>Hardened UI styles to prevent style creep from themes.</li>
125	+ <li>Added Themer custom field connections to all color fields.</li>
126	+ </ul>
127	+ <p><strong>Bug Fixes</strong></p>
128	+ <ul>
129	+ <li>Fixed drag and drop breaking when dragging while another element hasn't finished refreshing after save.</li>
130	+ <li>Fixed some changes not saving when done quickly on slow connections.</li>
131	+ <li>Fixed the position of duplicated elements being incorrect when moving the original element during the duplicate process.</li>
132	+ <li>Fixed modules disappearing if moved and the the old column is deleted while the move is saving.</li>
133	+ <li>Fixed dragging into rows that are being saved. That causes things to disappear until the page is refreshed.</li>
134	+ <li>Fixed columns being highlighted as empty after dropping a module to create a new column.</li>
135	+ <li>Fixed pasting into inline editors retaining the copied formatting.</li>
136	+ </ul>
137	+
138	+ <h4>2.2-alpha.1 - 09/05/2018</h4>
139	+ <p><strong>Bug Fixes</strong></p>
140	+ <ul>
141	+ <li>Fixed row shape issues and refined internal logic.</li>
142	+ <li>Fixed black borders in the video module when aspect ratio is not maintained.</li>
143	+ <li>Fixed Google map markers not displaying properly in accordions and tabs.</li>
144	+ </ul>
145	+
146	+ <h4>2.2-dev.9 - 08/28/2018</h4>
147	+ <p><strong>Button Module</strong></p>
148	+ <ul>
149	+ <li>Added responsive border settings.</li>
150	+ <li>Added live preview to button background colors.</li>
151	+ <li>Converted font size setting to a responsive typography setting.</li>
152	+ <li>Converted padding setting to a responsive dimension setting.</li>
153	+ <li>Removed transparent button style. That is now done with alpha backgrounds and border settings.</li>
154	+ <li>Reorganized style settings to work with the new settings.</li>
155	+ <li>Updated all modules that use buttons with new settings.</li>
156	+ </ul>
157	+ <p><strong>Callout Module</strong></p>
158	+ <ul>
159	+ <li>Added background color, border, and padding settings.</li>
160	+ <li>Added link color and typography settings.</li>
161	+ </ul>
162	+ <p><strong>Fixes</strong></p>
163	+ <ul>
164	+ <li>Fixed dark UI affecting buttons in the WordPress media library.</li>
165	+ </ul>
166	+
167	+ <h4>2.2-dev.8 - 08/21/2018</h4>
168	+ <p><strong>Fixes</strong></p>
169	+ <ul>
170	+ <li>Fixed dimension and unit fields not previewing correctly in compound settings (typography, border, etc).</li>
171	+ <li>Fixed JS error when dropping in a new module to create a new column.</li>
172	+ </ul>
173	+
174	+ <h4>2.2-dev.7 - 08/21/2018</h4>
175	+ <p><strong>General Enhancements</strong></p>
176	+ <ul>
177	+ <li>Added duration input for animation settings.</li>
178	+ </ul>
179	+ <p><strong>Callout Module</strong></p>
180	+ <ul>
181	+ <li>Added responsive icon size setting with custom units.</li>
182	+ </ul>
183	+ <p><strong>Icon Module</strong></p>
184	+ <ul>
185	+ <li>Added responsive icon size setting with custom units.</li>
186	+ </ul>
187	+ <p><strong>Icon Group Module</strong></p>
188	+ <ul>
189	+ <li>Added responsive icon size setting with custom units.</li>
190	+ </ul>
191	+ <p><strong>Text Editor Module</strong></p>
192	+ <ul>
193	+ <li>Fixed color setting not overriding colors set by the row.</li>
194	+ </ul>
195	+ <p><strong>API</strong></p>
196	+ <ul>
197	+ <li>Added API for date settings using the HTML date input.</li>
198	+ </ul>
199	+ <p><strong>Fixes</strong></p>
200	+ <ul>
201	+ <li>Fixed layout going off the page when editing a Themer part in responsive editing mode.</li>
202	+ </ul>
203	+
204	+ <h4>2.2-dev.6 - 08/10/2018</h4>
205	+ <p><strong>Fixes</strong></p>
206	+ <ul>
207	+ <li>Fixed duplicating rows and modules leaving an extra copy when the duplicate completes.</li>
208	+ <li>Fixed general loading issues when working in the builder.</li>
209	+ </ul>
210	+
211	+ <h4>2.2-dev.5 - 08/08/2018</h4>
212	+ <p><strong>General Enhancements</strong></p>
213	+ <ul>
214	+ <li>Added a publish layout item to the tools menu for publishing and remaining in the builder.</li>
215	+ <li>Finished work for alpha pickers, live preview, responsive settings, etc. for remaining modules.</li>
216	+ <li>Added advanced setting for changing the HTML wrapper element of rows, columns, and modules.</li>
217	+ <li>Row, column, and module animations are now enabled for mobile devices.</li>
218	+ <li>Moved column settings to the first item in the column dropdown menu.</li>
219	+ <li>Added "None" option for the background overlay setting.</li>
220	+ <li>Streamline the overall visual appearance, specifically of settings forms.</li>
221	+ <li>Allow pinned settings panels to resize down to 320px (formally 380px min) and widen to 600px.</li>
222	+ <li>Rich text and code editor fields now display edge-to-edge on slim settings panels.</li>
223	+ <li>Field connection icons now appear the top of the field for rich text and code editors.</li>
224	+ <li>Settings sections can now be collapsed. Developers can specify if they'd like a section in their custom module to be collapsed by default.</li>
225	+ </ul>
226	+ <p><strong>General Fixes</strong></p>
227	+ <ul>
228	+ <li>Fixed font weights not loading for the selected font in typography settings.</li>
229	+ <li>Fixed border settings not cascading down to smaller device sizes.</li>
230	+ <li>Fixed target and nofollow inputs not showing for link fields with a field connection.</li>
231	+ <li>Fixed PHP warning leaking into row CSS preventing backgrounds from showing.</li>
232	+ <li>Fixed not being able to set a minimum height on columns with no siblings.</li>
233	+ <li>Fixed row and column animations not working because of the waypoint script not being enqueued.</li>
234	+ <li>Fixed color pickers showing the wrong color after saving settings and then editing the color again.</li>
235	+ <li>Fixed row actions in responsive editing mode not showing up and causing a horizontal scrollbar.</li>
236	+ <li>Fixed row min-height not resetting when switching back to default.</li>
237	+ <li>Fixed column dropdown being cut off in responsive editing mode.</li>
238	+ <li>Fixed not being able to resize columns that are too small.</li>
239	+ </ul>
240	+ <p><strong>Shape Layers</strong></p>
241	+ <ul>
242	+ <li>Shape layer controls (formerly Edges tab) have been moved into the style tab.</li>
243	+ <li>Shapes can now be aligned vertically as well as horizontally.</li>
244	+ <li>4 new shapes have been added. More to come.</li>
245	+ </ul>
246	+ <p><strong>Gallery Module</strong></p>
247	+ <ul>
248	+ <li>Added photo border settings to the new style tab.</li>
249	+ <li>Moved photo spacing setting to the new style tab.</li>
250	+ </ul>
251	+ <p><strong>Icon Group Module</strong></p>
252	+ <ul>
253	+ <li>Fixed icon colors only applying to the first icon.</li>
254	+ </ul>
255	+ <p><strong>Menu Module</strong></p>
256	+ <ul>
257	+ <li>Added mobile menu layout options for off-canvas / flyout menus.</li>
258	+ <li>Converted font, text size, and text transform settings to a responsive typography setting.</li>
259	+ <li>The first submenu is now opened when editing a menu to preview changes.</li>
260	+ <li>Added submenu link spacing setting.</li>
261	+ <li>Converted submenu spacing setting to a dimension field.</li>
262	+ </ul>
263	+ <p><strong>Number Counter Module</strong></p>
264	+ <ul>
265	+ <li>Converted number size setting to a responsive setting with custom units.</li>
266	+ </ul>
267	+ <p><strong>Posts Module</strong></p>
268	+ <ul>
269	+ <li>Converted border settings to a responsive border setting.</li>
270	+ <li>Converted font size settings to responsive typography settings.</li>
271	+ </ul>
272	+ <p><strong>Testimonials Module</strong></p>
273	+ <ul>
274	+ <li>Added new style tab with text color and typography settings.</li>
275	+ </ul>
276	+ <p><strong>Text Editor Module</strong></p>
277	+ <ul>
278	+ <li>Fixed style settings not overriding those set by the theme for headings in the Customizer.</li>
279	+ </ul>
280	+
281	+ <h4>2.2-dev.4 - 6/28/2018</h4>
282	+ <p><strong>Enhancements</strong></p>
283	+ <ul>
284	+ <li>Added the ability to set row edges and shapes. More to come!</li>
285	+ <li>Added the option to set background overlay gradients on rows and columns.</li>
286	+ </ul>
287	+ <p><strong>Tweaks</strong></p>
288	+ <ul>
289	+ <li>Refined responsive editing logic to make it even more accurate.</li>
290	+ <li>Added labels to the font family and weight selects in the typography field.</li>
291	+ </ul>
292	+ <p><strong>Fixes</strong></p>
293	+ <ul>
294	+ <li>Fixed multiple issues with animation settings not working correctly.</li>
295	+ <li>Fixed PHP warning caused by the typography field on PHP 5.6 and below.</li>
296	+ <li>Fixed border style and width settings not previewing and rendering correctly.</li>
297	+ <li>Fixed Callout module overall alignment setting not applying to buttons.</li>
298	+ <li>Fixed not being able to edit RGBA values in color picker fields.</li>
299	+ </ul>
300	+ <p><strong>Menu Module</strong></p>
301	+ <ul>
302	+ <li>Converted link spacing fields to a single dimension field.</li>
303	+ </ul>
304	+
305	+ <h4>2.2-dev.3 - 6/20/2018</h4>
306	+ <p><strong>General</strong></p>
307	+ <ul>
308	+ <li>Added unit select to margin and padding settings.</li>
309	+ <li>Added unit select to the row width setting.</li>
310	+ <li>Added minimum height setting with unit select and responsive editing to rows and columns.</li>
311	+ <li>Added border radius setting with responsive editing to rows and columns.</li>
312	+ <li>Added box shadow setting to rows and columns.</li>
313	+ <li>Added unit select to all margin and padding settings in the global settings.</li>
314	+ <li>Added global settings for column margins and padding.</li>
315	+ <li>Added unit selects to various module unit settings.</li>
316	+ <li>Added responsive editing to row and column background photos.</li>
317	+ <li>Added responsive editing to the column width setting and removed old responsive column settings in the advanced tab.</li>
318	+ <li>Added background gradient setting for rows and columns.</li>
319	+ <li>Added entrance animations for rows and columns.</li>
320	+ <li>Added more entrance animations from animate.css.</li>
321	+ <li>Added live preview for editing entrance animations.</li>
322	+ <li>Added alpha slider to all color picker settings and removed old opacity settings.</li>
323	+ <li>Added live preview to more module settings so changes don’t require a refresh.</li>
324	+ <li>Added popup slider control to various unit and dimension settings.</li>
325	+ <li>Added the ability to link values for all dimension settings.</li>
326	+ <li>Added new align setting to various modules in place of the old align selects.</li>
327	+ <li>Added dev feedback button within the builder UI. This is ONLY shown for pre-release versions.</li>
328	+ </ul>
329	+ <p><strong>Responsive Editing Mode</strong></p>
330	+ <ul>
331	+ <li>You can now stay in responsive editing mode after closing settings.</li>
332	+ <li>Added toggle and exit buttons within responsive editing mode.</li>
333	+ <li>Added menu item for switching to responsive editing mode.</li>
334	+ <li>Added keyboard shortcut for switching to responsive editing mode.</li>
335	+ </ul>
336	+ <p><strong>API</strong></p>
337	+ <ul>
338	+ <li>Added API for enabling a unit select (%, em, vh, etc.) on dimension and unit settings.</li>
339	+ <li>Added API for enabling a popup slider input on unit and dimension settings.</li>
340	+ <li>Added API for responsive editing to photo and select settings.</li>
341	+ <li>Added API for making backwards compatible changes to settings.</li>
342	+ <li>Added API for making live preview rules !important.</li>
343	+ <li>Added API for align, animation, border, button group, gradient, shadow, and typography settings.</li>
344	+ <li>Added API for toggling other settings when icon or photo settings are set.</li>
345	+ <li>Added API for adding target and nofollow checkboxes to the link field.</li>
346	+ </ul>
347	+ <p><strong>Tweaks</strong></p>
348	+ <ul>
349	+ <li>FontAwesome is now loaded locally instead of from the CDN.</li>
350	+ </ul>
351	+ <p><strong>Accordion Module</strong></p>
352	+ <ul>
353	+ <li>Added border, color, icon, padding, and typography settings.</li>
354	+ <li>The first item is now open when editing to preview content style changes.</li>
355	+ <li>Moved collapse inactive and expand first item settings to the items tab.</li>
356	+ </ul>
357	+ <p><strong>Button Module</strong></p>
358	+ <ul>
359	+ <li>Added unit select to custom width field.</li>
360	+ <li>Added responsive editing to the alignment setting.</li>
361	+ <li>Icon position and visibility settings only show when an icon is set.</li>
362	+ </ul>
363	+ <p><strong>Call to Action Module</strong></p>
364	+ <ul>
365	+ <li>Converted spacing setting to a responsive padding setting with custom units.</li>
366	+ <li>Added border, text color, and typography settings.</li>
367	+ <li>Moved heading tag setting to the general tab.</li>
368	+ </ul>
369	+ <p><strong>Callout Module</strong></p>
370	+ <ul>
371	+ <li>Added text color and typography settings.</li>
372	+ <li>Added photo width, align, and border settings.</li>
373	+ <li>Moved heading tag setting to the general tab.</li>
374	+ </ul>
375	+ <p><strong>Heading Module</strong></p>
376	+ <ul>
377	+ <li>Converted style settings to the new responsive typography setting.</li>
378	+ <li>Moved HTML tag setting to the general tab.</li>
379	+ <li>Change HTML tag setting default to H2.</li>
380	+ </ul>
381	+ <p><strong>Icon Module</strong></p>
382	+ <ul>
383	+ <li>Added responsive editing to the alignment setting.</li>
384	+ <li>Added color, typography, and spacing settings for the icon text.</li>
385	+ </ul>
386	+ <p><strong>Map Module</strong></p>
387	+ <ul>
388	+ <li>Added custom units and responsive editing to the height setting.</li>
389	+ <li>Added border settings with responsive editing.</li>
390	+ </ul>
391	+ <p><strong>Menu Module</strong></p>
392	+ <ul>
393	+ <li>Added responsive editing to the alignment setting.</li>
394	+ <li>Regrouped style settings for consistency with other modules.</li>
395	+ </ul>
396	+ <p><strong>Photo Module</strong></p>
397	+ <ul>
398	+ <li>Moved alignment and crop settings to the new style tab.</li>
399	+ <li>Added responsive editing to the alignment setting.</li>
400	+ <li>Added new width setting with unit select and responsive editing.</li>
401	+ <li>Added border type, color, width, and radius settings.</li>
402	+ <li>Added box shadow setting.</li>
403	+ </ul>
404	+ <p><strong>Separator Module</strong></p>
405	+ <ul>
406	+ <li>Removed the width select in favor of a single width setting.</li>
407	+ </ul>
408	+ <p><strong>Social Buttons Module</strong></p>
409	+ <ul>
410	+ <li>Fixed spacing issues.</li>
411	+ </ul>
412	+ <p><strong>Tabs Module</strong></p>
413	+ <ul>
414	+ <li>Added border, color, padding, and typography settings.</li>
415	+ </ul>
416	+ <p><strong>Text Editor Module</strong></p>
417	+ <ul>
418	+ <li>Added new style tab with text color and typography settings.</li>
419	+ </ul>
420	+
421	<h4>2.1.7.2 - 01/02/2019</h4>
422	<p><strong>Hot Fix</strong></p>
423	<ul>

482	<li>Fixed issue with layout shortcodes in Wocommerce description not rendering their assets.</li>
483	</ul>
484

485	<h4>2.1.6.3 - 10/30/2018</h4>
486	<p><strong>Halloween Hot Fix</strong></p>
487	<ul>

595	<li>Fixed CORS issue on Pantheon hosting.</li>
596	</ul>
597

598	<h4>2.1.4.5 - 09/10/2018</h4>
599	<p><strong>HotFix</strong></p>
600	<ul>

647	</ul>
648	</li>
649	</ul>

650	<p><strong>Bug Fixes</strong></p>
651	<ul>
652	<li>Fixed issue with paginated category archives not correctly returning a 404 when there are no posts.</li>

classes/class-fl-builder-admin-posts.php CHANGED Viewed

	@@ -56,7 +56,7 @@ final class FLBuilderAdminPosts {
56	* @return bool
57	*/
58	static public function post_type_supports_block_editor( $post_type ) {
59	- if ( ! function_exists( 'use_block_editor_for_post_type' ) ) {
60	return false;
61	}
62
	@@ -78,9 +78,8 @@ final class FLBuilderAdminPosts {
78	$render_ui = apply_filters( 'fl_builder_render_admin_edit_ui', true );
79	$post_type = self::get_post_type();
80	$post_types = FLBuilderModel::get_post_types();
81	- $supports_blocks = self::post_type_supports_block_editor( $post_type );
82
83	- if ( $render_ui && in_array( $post_type, $post_types ) ~~&& ! $supports_blocks~~ ) {
84	add_filter( 'admin_body_class', __CLASS__ . '::body_class', 99 );
85	add_action( 'admin_enqueue_scripts', __CLASS__ . '::styles_scripts' );
86	add_action( 'edit_form_after_title', __CLASS__ . '::render' );


56	* @return bool
57	*/
58	static public function post_type_supports_block_editor( $post_type ) {
59	+ if ( ! function_exists( 'use_block_editor_for_post_type' ) \|\| isset( $_GET['classic-editor'] ) ) {
60	return false;
61	}
62

78	$render_ui = apply_filters( 'fl_builder_render_admin_edit_ui', true );
79	$post_type = self::get_post_type();
80	$post_types = FLBuilderModel::get_post_types();

81
82	+ if ( $render_ui && in_array( $post_type, $post_types ) ) {
83	add_filter( 'admin_body_class', __CLASS__ . '::body_class', 99 );
84	add_action( 'admin_enqueue_scripts', __CLASS__ . '::styles_scripts' );
85	add_action( 'edit_form_after_title', __CLASS__ . '::render' );

classes/class-fl-builder-ajax-layout.php CHANGED Viewed

	@@ -71,48 +71,50 @@ final class FLBuilderAJAXLayout {
71	* @since 1.7
72	* @param string $cols The type of column layout to use.
73	* @param int $position The position of the new row in the layout.
74	- * @param string $~~template_id~~ The ID of a ~~row~~ ~~template~~ to ~~render~~.
75	- * @param string $template_type The type of template. Either "user" or "core".
76	* @return array
77	*/
78	- static public function render_new_row( $cols = '1-col', $position = false, $~~template_id~~ = null, ~~$template_type = 'user'~~ ) {
79	- // Add a row ~~template?~~
80	- if ( ~~null~~ ~~!==~~ $~~template_id~~ ) {
81	-
82	- if ( 'core' == $template_type ) {
83	- $template = FLBuilderModel::get_template( $template_id, 'row' );
84	- $row = FLBuilderModel::apply_node_template( $template_id, null, $position, $template );
85	- } else {
86	- $row = FLBuilderModel::apply_node_template( $template_id, null, $position );
87	- }
88	-
89	- // Return the response.
90	- return array(
91	- 'layout' => self::render( $row->node ),
92	- 'config' => FLBuilderUISettingsForms::get_node_js_config(),
93	- );
94	- } else {
95	-
96	- // Add the row.
97	- $row = FLBuilderModel::add_row( $cols, $position );
98	-
99	- do_action( 'fl_builder_before_render_ajax_layout_html' );
100
101	- // Render the row.
102	- ~~ob_start~~();
103	- ~~FLBuilder::render_row~~( ~~$row~~ );
104	- $~~html~~ ~~= ob_get_clean(~~);


105
106	- ~~do_action(~~ ~~'fl_builder_after_render_ajax_layout_html'~~ );







107
108	- ~~// Return the response.~~
109	- ~~return~~ ~~array(~~
110	- ~~'partial' => true,~~
111	- ~~'nodeType' =>~~ ~~$row->type,~~
112	- ~~'html' =>~~ $~~html,~~
113	- ~~'js' =>~~ ~~'FLBuilder~~.~~_renderLayoutComplete();',~~
114	- );








115	}





116	}
117
118	/**
	@@ -137,19 +139,18 @@ final class FLBuilderAJAXLayout {
137	* @param string $node_id The node ID of a row to add the new group to.
138	* @param string $cols The type of column layout to use.
139	* @param int $position The position of the new column group in the row.

140	* @return array
141	*/
142	- static public function render_new_column_group( $node_id, $cols = '1-col', $position = false ) {
143	// Add the group.
144	- $group = FLBuilderModel::add_col_group( $node_id, $cols, $position );
145	-
146	- do_action( 'fl_builder_before_render_ajax_layout_html' );
147
148	// Render the group.

149	ob_start();
150	FLBuilder::render_column_group( $group );
151	$html = ob_get_clean();
152	-
153	do_action( 'fl_builder_after_render_ajax_layout_html' );
154
155	// Return the response.
	@@ -169,11 +170,12 @@ final class FLBuilderAJAXLayout {
169	* @param string $insert Either before or after.
170	* @param string $type The type of column(s) to insert.
171	* @param boolean $nested Whether these columns are nested or not.

172	* @return array
173	*/
174	- static public function render_new_columns( $node_id, $insert, $type, $nested ) {
175	// Add the column(s).
176	- $group = FLBuilderModel::add_cols( $node_id, $insert, $type, $nested );
177
178	// Return the response.
179	return self::render( $group->node );
	@@ -330,7 +332,8 @@ final class FLBuilderAJAXLayout {
330
331	// Get the node.
332	$node_id = $post_data['node_id'];
333	- $node = FLBuilderModel::get_node( $post_data['node_id'] );

334
335	// Check a module for partial refresh.
336	if ( $node && 'module' == $node->type ) {
	@@ -512,6 +515,10 @@ final class FLBuilderAJAXLayout {
512	$assets['js'] .= FLBuilder::render_row_modules_js( $partial_refresh_data['node'] );
513	break;
514




515	case 'column':
516	$assets['js'] = FLBuilder::render_column_modules_js( $partial_refresh_data['node'] );
517	break;


71	* @since 1.7
72	* @param string $cols The type of column layout to use.
73	* @param int $position The position of the new row in the layout.
74	+ * @param string $module Optional. The node ID of an existing module to move to this row.

75	* @return array
76	*/
77	+ static public function render_new_row( $cols = '1-col', $position = false, $module = null ) {
78	+ // Add the row.
79	+ $row = FLBuilderModel::add_row( $cols, $position, $module );



















80
81	+ // Render the row.
82	+ do_action( 'fl_builder_before_render_ajax_layout_html' );
83	+ ob_start();
84	+ FLBuilder::render_row( $row );
85	+ $html = ob_get_clean();
86	+ do_action( 'fl_builder_after_render_ajax_layout_html' );
87
88	+ // Return the response.
89	+ return array(
90	+ 'partial' => true,
91	+ 'nodeType' => $row->type,
92	+ 'html' => $html,
93	+ 'js' => 'FLBuilder._renderLayoutComplete();',
94	+ );
95	+ }
96
97	+ /**
98	+ * Renders the layout data for a new row template.
99	+ *
100	+ * @since 2.2
101	+ * @param int $position The position of the new row in the layout.
102	+ * @param string $template_id The ID of a row template to render.
103	+ * @param string $template_type The type of template. Either "user" or "core".
104	+ * @return array
105	+ */
106	+ static public function render_new_row_template( $position, $template_id, $template_type = 'user' ) {
107	+ if ( 'core' == $template_type ) {
108	+ $template = FLBuilderModel::get_template( $template_id, 'row' );
109	+ $row = FLBuilderModel::apply_node_template( $template_id, null, $position, $template );
110	+ } else {
111	+ $row = FLBuilderModel::apply_node_template( $template_id, null, $position );
112	}
113	+
114	+ return array(
115	+ 'layout' => self::render( $row->node ),
116	+ 'config' => FLBuilderUISettingsForms::get_node_js_config(),
117	+ );
118	}
119
120	/**

139	* @param string $node_id The node ID of a row to add the new group to.
140	* @param string $cols The type of column layout to use.
141	* @param int $position The position of the new column group in the row.
142	+ * @param string $module Optional. The node ID of an existing module to move to this group.
143	* @return array
144	*/
145	+ static public function render_new_column_group( $node_id, $cols = '1-col', $position = false, $module = null ) {
146	// Add the group.
147	+ $group = FLBuilderModel::add_col_group( $node_id, $cols, $position, $module );


148
149	// Render the group.
150	+ do_action( 'fl_builder_before_render_ajax_layout_html' );
151	ob_start();
152	FLBuilder::render_column_group( $group );
153	$html = ob_get_clean();

154	do_action( 'fl_builder_after_render_ajax_layout_html' );
155
156	// Return the response.

170	* @param string $insert Either before or after.
171	* @param string $type The type of column(s) to insert.
172	* @param boolean $nested Whether these columns are nested or not.
173	+ * @param string $module Optional. The node ID of an existing module to move to this group.
174	* @return array
175	*/
176	+ static public function render_new_columns( $node_id, $insert, $type, $nested, $module = null ) {
177	// Add the column(s).
178	+ $group = FLBuilderModel::add_cols( $node_id, $insert, $type, $nested, $module );
179
180	// Return the response.
181	return self::render( $group->node );

332
333	// Get the node.
334	$node_id = $post_data['node_id'];
335	+ $node = FLBuilderModel::get_node( $post_data['node_id'] );
336	+ $node_type = null;
337
338	// Check a module for partial refresh.
339	if ( $node && 'module' == $node->type ) {

515	$assets['js'] .= FLBuilder::render_row_modules_js( $partial_refresh_data['node'] );
516	break;
517
518	+ case 'column-group':
519	+ $assets['js'] = FLBuilder::render_column_group_modules_js( $partial_refresh_data['node'] );
520	+ break;
521	+
522	case 'column':
523	$assets['js'] = FLBuilder::render_column_modules_js( $partial_refresh_data['node'] );
524	break;

classes/class-fl-builder-ajax.php CHANGED Viewed

	@@ -109,10 +109,11 @@ final class FLBuilderAJAX {
109	// FLBuilderAJAXLayout
110	self::add_action( 'render_layout', 'FLBuilderAJAXLayout::render' );
111	self::add_action( 'render_node', 'FLBuilderAJAXLayout::render', array( 'node_id' ) );
112	- self::add_action( 'render_new_row', 'FLBuilderAJAXLayout::render_new_row', array( 'cols', 'position', '~~template_id~~', ~~'template_type'~~ ) );

113	self::add_action( 'copy_row', 'FLBuilderAJAXLayout::copy_row', array( 'node_id', 'settings', 'settings_id' ) );
114	- self::add_action( 'render_new_column_group', 'FLBuilderAJAXLayout::render_new_column_group', array( 'node_id', 'cols', 'position' ) );
115	- self::add_action( 'render_new_columns', 'FLBuilderAJAXLayout::render_new_columns', array( 'node_id', 'insert', 'type', 'nested' ) );
116	self::add_action( 'render_new_col_template', 'FLBuilderAJAXLayout::render_new_col_template', array( 'template_id', 'parent_id', 'position', 'template_type' ) );
117	self::add_action( 'copy_col', 'FLBuilderAJAXLayout::copy_col', array( 'node_id', 'settings', 'settings_id' ) );
118	self::add_action( 'render_new_module', 'FLBuilderAJAXLayout::render_new_module', array( 'parent_id', 'position', 'type', 'alias', 'template_id', 'template_type' ) );


109	// FLBuilderAJAXLayout
110	self::add_action( 'render_layout', 'FLBuilderAJAXLayout::render' );
111	self::add_action( 'render_node', 'FLBuilderAJAXLayout::render', array( 'node_id' ) );
112	+ self::add_action( 'render_new_row', 'FLBuilderAJAXLayout::render_new_row', array( 'cols', 'position', 'module' ) );
113	+ self::add_action( 'render_new_row_template', 'FLBuilderAJAXLayout::render_new_row_template', array( 'position', 'template_id', 'template_type' ) );
114	self::add_action( 'copy_row', 'FLBuilderAJAXLayout::copy_row', array( 'node_id', 'settings', 'settings_id' ) );
115	+ self::add_action( 'render_new_column_group', 'FLBuilderAJAXLayout::render_new_column_group', array( 'node_id', 'cols', 'position', 'module' ) );
116	+ self::add_action( 'render_new_columns', 'FLBuilderAJAXLayout::render_new_columns', array( 'node_id', 'insert', 'type', 'nested', 'module' ) );
117	self::add_action( 'render_new_col_template', 'FLBuilderAJAXLayout::render_new_col_template', array( 'template_id', 'parent_id', 'position', 'template_type' ) );
118	self::add_action( 'copy_col', 'FLBuilderAJAXLayout::copy_col', array( 'node_id', 'settings', 'settings_id' ) );
119	self::add_action( 'render_new_module', 'FLBuilderAJAXLayout::render_new_module', array( 'parent_id', 'position', 'type', 'alias', 'template_id', 'template_type' ) );

classes/class-fl-builder-art.php ADDED Viewed

	@@ -0,0 +1,798 @@


1	+ <?php
2	+ /**
3	+ * Handle SVG Artwork for the system.
4	+ */
5	+ class FLBuilderArt {
6	+
7	+ /**
8	+ * All registered shapes
9	+ */
10	+ static private $artwork = array();
11	+
12	+ /**
13	+ * Which node types support layers
14	+ */
15	+ static private $supported_node_types = array( 'row' );
16	+
17	+ /**
18	+ * Initialize the artwork handling
19	+ *
20	+ * @return void
21	+ */
22	+ static public function init() {
23	+
24	+ // Render layer(s) output into node output
25	+ add_action( 'fl_builder_render_node_layers', 'FLBuilderArt::render_node_layers' );
26	+
27	+ // Setup Shapes and Preset definitions
28	+ add_action( 'fl_register_presets', 'FLBuilderArt::register_shapes' );
29	+
30	+ // Add special <option> sets for js output
31	+ add_filter( 'fl_builder_shared_option_sets', 'FLBuilderArt::filter_shared_option_sets' );
32	+ }
33	+
34	+ /**
35	+ * Register the system art and presets. Called by the fl_register_presets action (see FLBuilderSettingsPresets )
36	+ *
37	+ * @return void
38	+ */
39	+ static public function register_shapes() {
40	+
41	+ $art_dir = FL_BUILDER_DIR . 'includes/shapes/';
42	+
43	+ self::register_shape(array(
44	+ 'label' => __( 'Slanted Edge', 'fl-builder' ),
45	+ 'name' => 'edge-slant',
46	+ 'width' => 422,
47	+ 'height' => 33.98,
48	+ 'render' => $art_dir . 'edge-slant.svg.php',
49	+ ));
50	+
51	+ self::register_shape(array(
52	+ 'label' => __( 'Waves', 'fl-builder' ),
53	+ 'name' => 'wavy',
54	+ 'width' => 800,
55	+ 'height' => 102,
56	+ 'render' => $art_dir . 'wavy.svg.php',
57	+ ));
58	+
59	+ self::register_shape( array(
60	+ 'label' => __( 'Midpoint', 'fl-builder' ),
61	+ 'name' => 'midpoint',
62	+ 'width' => 800,
63	+ 'height' => 50,
64	+ 'render' => $art_dir . 'midpoint.svg.php',
65	+ ));
66	+
67	+ self::register_shape( array(
68	+ 'label' => __( 'Triangle', 'fl-builder' ),
69	+ 'name' => 'triangle',
70	+ 'width' => 50,
71	+ 'height' => 34,
72	+ 'render' => $art_dir . 'triangle.svg.php',
73	+ ));
74	+ self::register_shape( array(
75	+ 'label' => __( 'Circle', 'fl-builder' ),
76	+ 'name' => 'circle',
77	+ 'width' => 100,
78	+ 'height' => 100,
79	+ 'render' => $art_dir . 'circle.svg.php',
80	+ ));
81	+ self::register_shape( array(
82	+ 'label' => __( 'Concave', 'fl-builder' ),
83	+ 'name' => 'concave',
84	+ 'width' => 800,
85	+ 'height' => 50,
86	+ 'render' => $art_dir . 'concave.svg.php',
87	+ ));
88	+ self::register_shape( array(
89	+ 'label' => __( 'Spots', 'fl-builder' ),
90	+ 'name' => 'dot-cluster',
91	+ 'width' => 800,
92	+ 'height' => 315,
93	+ 'render' => $art_dir . 'dot-cluster.svg.php',
94	+ ));
95	+ self::register_shape( array(
96	+ 'label' => __( 'Topography', 'fl-builder' ),
97	+ 'name' => 'topography',
98	+ 'width' => 600,
99	+ 'height' => 600,
100	+ 'render' => $art_dir . 'topography.svg.php',
101	+ ));
102	+ self::register_shape( array(
103	+ 'label' => __( 'Rectangle', 'fl-builder' ),
104	+ 'name' => 'rect',
105	+ 'width' => 800,
106	+ 'height' => 450,
107	+ 'render' => $art_dir . 'rect.svg.php',
108	+ ));
109	+
110	+ // Trigger registration process for external shapes
111	+ do_action( 'fl_register_art' );
112	+ }
113	+
114	+ /**
115	+ * Register a new piece of SVG art into the system
116	+ *
117	+ * @param Array $args - the metadata for a piece of art
118	+ * @return void
119	+ */
120	+ static public function register_shape( $args = array() ) {
121	+ $defaults = array(
122	+ 'label' => __( 'Untitled Shape', 'fl-builder' ),
123	+ 'name' => 'untitled-shape',
124	+ 'x' => 0,
125	+ 'y' => 0,
126	+ 'width' => 0,
127	+ 'height' => 0,
128	+ 'preserve_aspect_ratio' => 'none',
129	+ 'render' => '',
130	+ 'preset_settings' => array(),
131	+ );
132	+
133	+ $args = wp_parse_args( $args, $defaults );
134	+ $key = $args['name'];
135	+
136	+ /**
137	+ * Setup a preset to reference the shape's initial configuration later
138	+ * This is so when you choose a shape, we can also setup other fields for the optimal inital appearance.
139	+ */
140	+ FLBuilderSettingsPresets::register( 'shape', array(
141	+ 'name' => $args['name'],
142	+ 'label' => $args['label'],
143	+ 'settings' => $args['preset_settings'],
144	+ 'data' => array(
145	+ 'viewBox' => array(
146	+ 'x' => $args['x'],
147	+ 'y' => $args['y'],
148	+ 'width' => $args['width'],
149	+ 'height' => $args['height'],
150	+ ),
151	+ ),
152	+ ));
153	+
154	+ self::$artwork[ $key ] = $args;
155	+ }
156	+
157	+ /**
158	+ * Return the array of registered artwork
159	+ *
160	+ * @param String $key - index key in the artwork array
161	+ * @return Array
162	+ */
163	+ static public function get_art( $key = null ) {
164	+ $art = apply_filters( 'fl_shape_artwork', self::$artwork );
165	+
166	+ if ( $key && isset( $art[ $key ] ) ) {
167	+ return $art[ $key ];
168	+ }
169	+
170	+ return $art;
171	+ }
172	+
173	+ /**
174	+ * Create option sets for each preset type and add to FLBuilderConfig.optionSets
175	+ *
176	+ * @param Array $option_sets - previously set option sets
177	+ * @return Array
178	+ */
179	+ static public function filter_shared_option_sets( $option_sets ) {
180	+ $art = self::get_art();
181	+
182	+ $option_sets['shapes'] = array(
183	+ '' => __( 'None', 'fl-builder' ),
184	+ );
185	+
186	+ foreach ( $art as $handle => $shape ) {
187	+ $option_sets['shapes'][ $handle ] = $shape['label'];
188	+ }
189	+
190	+ return $option_sets;
191	+ }
192	+
193	+ /**
194	+ * Render the shape artwork with the current settings.
195	+ *
196	+ * @param Array $shape - the registered metadata for the current shape
197	+ * @param Object $settings - the current node's settings object
198	+ * @return String - the rendered string
199	+ */
200	+ static public function render_art( $shape, $settings ) {
201	+
202	+ // Render artwork into a buffer
203	+ if ( $shape ) {
204	+ ob_start();
205	+ $render = $shape['render'];
206	+
207	+ if ( is_string( $render ) && file_exists( $render ) ) {
208	+ include $render;
209	+ }
210	+ $output = ob_get_clean();
211	+ }
212	+ return $output;
213	+ }
214	+
215	+ /**
216	+ * Get the node types that support layers
217	+ *
218	+ * @return Array
219	+ */
220	+ static public function get_supported_node_types() {
221	+ return self::$supported_node_types;
222	+ }
223	+
224	+ /**
225	+ * Get any layers added to a node
226	+ *
227	+ * @param Object $node being rendered
228	+ * @return Array of layer descriptions
229	+ */
230	+ static public function get_node_layers( $node ) {
231	+ $layers = array();
232	+
233	+ if ( in_array( $node->type, self::get_supported_node_types() ) ) {
234	+
235	+ $settings = $node->settings;
236	+
237	+ if ( ! empty( $settings->{'top_edge_shape'} ) ) {
238	+ $layers['top'] = array(
239	+ 'label' => __( 'Top Shape Layer', 'fl-builder' ),
240	+ 'type' => 'shape',
241	+ 'prefix' => 'top_edge_',
242	+ 'position' => 'top',
243	+ );
244	+ }
245	+ if ( ! empty( $settings->{'bottom_edge_shape'} ) ) {
246	+ $layers['bottom'] = array(
247	+ 'label' => __( 'Bottom Shape Layer', 'fl-builder' ),
248	+ 'type' => 'shape',
249	+ 'prefix' => 'bottom_edge_',
250	+ 'position' => 'bottom',
251	+ );
252	+ }
253	+ }
254	+
255	+ return $layers;
256	+ }
257	+
258	+ /**
259	+ * Render any layers a node has
260	+ *
261	+ * @param Object $node
262	+ * @return void
263	+ */
264	+ static public function render_node_layers( $node ) {
265	+ $layers = self::get_node_layers( $node );
266	+
267	+ if ( ! empty( $layers ) ) {
268	+ foreach ( $layers as $key => $layer ) {
269	+ self::render_node_layer( $layer, $node );
270	+ }
271	+ }
272	+ }
273	+
274	+ /**
275	+ * Render a single layer into a node
276	+ *
277	+ * @param Array $layer meta
278	+ * @param Object $node
279	+ * @return void
280	+ */
281	+ static public function render_node_layer( $layer, $node ) {
282	+ if ( 'shape' === $layer['type'] ) {
283	+ self::render_node_shape_layer( $layer, $node );
284	+ return;
285	+ }
286	+ }
287	+
288	+ /**
289	+ * Render a shape layer into a node
290	+ *
291	+ * @param Array $layer meta
292	+ * @param Object $node
293	+ * @return void
294	+ */
295	+ static public function render_node_shape_layer( $layer, $node ) {
296	+
297	+ $settings = $node->settings;
298	+ $id = $node->node;
299	+ $position = $layer['position'];
300	+ $prefix = $layer['prefix'];
301	+ $shape_name = $settings->{ $prefix . 'shape' };
302	+ $shape_args = self::get_art( $shape_name );
303	+ $content = self::render_art( $shape_args, $settings );
304	+
305	+ $x = $shape_args['x'];
306	+ $y = $shape_args['y'];
307	+ $width = $shape_args['width'];
308	+ $height = $shape_args['height'];
309	+ $view_box = "$x $y $width $height";
310	+ $preserve_aspect_ratio = $shape_args['preserve_aspect_ratio'];
311	+
312	+ $align = $settings->{ $prefix . 'align' };
313	+ $ending = str_replace( ' ', '-', $align );
314	+ $svg_class = 'fl-builder-layer-align-' . $ending;
315	+ include FL_BUILDER_DIR . 'includes/shape-layer.php';
316	+ }
317	+
318	+
319	+ /**
320	+ * Get the settings form for shapes
321	+ *
322	+ * @return void
323	+ */
324	+ static public function get_shape_settings_sections() {
325	+ $sections = array();
326	+ $layers = array(
327	+ 'top' => __( 'Top', 'fl-builder' ),
328	+ 'bottom' => __( 'Bottom', 'fl-builder' ),
329	+ );
330	+
331	+ foreach ( $layers as $position => $position_label ) {
332	+ $prefix = $position . '_edge_';
333	+
334	+ // Preset & Shape Section
335	+ $sections[ $prefix . 'shape' ] = array(
336	+ 'title' => sprintf( __( '%s Shape', 'fl-builder' ), $position_label ),
337	+ 'fields' => array(
338	+ $prefix . 'shape' => array(
339	+ 'type' => 'select',
340	+ 'label' => __( 'Shape', 'fl-builder' ),
341	+ 'options' => 'shapes',
342	+ 'hide' => array(
343	+ '' => array(
344	+ 'sections' => array(
345	+ $prefix . 'style',
346	+ ),
347	+ 'fields' => array(
348	+ $prefix . 'size',
349	+ $prefix . 'align',
350	+ $prefix . 'z_pos',
351	+ ),
352	+ ),
353	+ ),
354	+ 'preview' => array(
355	+ 'type' => 'callback',
356	+ 'callback' => 'previewShape',
357	+ 'prefix' => $prefix,
358	+ 'position' => $position,
359	+ ),
360	+ ),
361	+ $prefix . 'size' => array(
362	+ 'type' => 'dimension',
363	+ 'label' => __( 'Size', 'fl-builder' ),
364	+ 'units' => array( 'px', 'vw', 'vh', '%' ),
365	+ 'slider' => array(
366	+ 'width' => array(
367	+ 'px' => array(
368	+ 'min' => 0,
369	+ 'max' => 5000,
370	+ 'step' => 10,
371	+ ),
372	+ 'vw' => array(
373	+ 'min' => 0,
374	+ 'max' => 500,
375	+ ),
376	+ 'vh' => array(
377	+ 'min' => 0,
378	+ 'max' => 500,
379	+ ),
380	+ '%' => array(
381	+ 'min' => 0,
382	+ 'max' => 300,
383	+ ),
384	+ ),
385	+ 'height' => array(
386	+ 'px' => array(
387	+ 'min' => 0,
388	+ 'max' => 2000,
389	+ 'step' => 10,
390	+ ),
391	+ 'vw' => array(
392	+ 'min' => 0,
393	+ 'max' => 200,
394	+ ),
395	+ 'vh' => array(
396	+ 'min' => 0,
397	+ 'max' => 200,
398	+ ),
399	+ '%' => array(
400	+ 'min' => 0,
401	+ 'max' => 100,
402	+ ),
403	+ ),
404	+ 'top' => array(
405	+ 'px' => array(
406	+ 'min' => -500,
407	+ 'max' => 500,
408	+ ),
409	+ 'vw' => array(
410	+ 'min' => -20,
411	+ 'max' => 20,
412	+ ),
413	+ 'vh' => array(
414	+ 'min' => -20,
415	+ 'max' => 20,
416	+ ),
417	+ '%' => array(
418	+ 'min' => 0,
419	+ 'max' => 100,
420	+ ),
421	+ ),
422	+ ),
423	+ 'keys' => array(
424	+ 'width' => __( 'Width', 'fl-builder' ),
425	+ 'height' => __( 'Height', 'fl-builder' ),
426	+ 'top' => __( 'Y Offset', 'fl-builder' ),
427	+ ),
428	+ 'preview' => array(
429	+ 'type' => 'callback',
430	+ 'callback' => 'previewShapeLayerSize',
431	+ 'prefix' => $prefix,
432	+ 'position' => $position,
433	+ ),
434	+ ),
435	+ $prefix . 'align' => array(
436	+ 'type' => 'select',
437	+ 'label' => __( 'Align', 'fl-builder' ),
438	+ 'default' => $position . ' center',
439	+ 'options' => array(
440	+ 'top left' => __( 'Top Left', 'fl-builder' ),
441	+ 'top center' => __( 'Top Center', 'fl-builder' ),
442	+ 'top right' => __( 'Top Right', 'fl-builder' ),
443	+ 'center left' => __( 'Center Left', 'fl-builder' ),
444	+ 'center center' => __( 'Center', 'fl-builder' ),
445	+ 'center right' => __( 'Center Right', 'fl-builder' ),
446	+ 'bottom left' => __( 'Bottom Left', 'fl-builder' ),
447	+ 'bottom center' => __( 'Bottom Center', 'fl-builder' ),
448	+ 'bottom right' => __( 'Bottom Right', 'fl-builder' ),
449	+ ),
450	+ 'preview' => array(
451	+ 'type' => 'callback',
452	+ 'callback' => 'previewShapeAlign',
453	+ 'prefix' => $prefix,
454	+ 'selector' => ".fl-builder-$position-edge-layer > *",
455	+ ),
456	+ ),
457	+ ),
458	+ );
459	+
460	+ // Shape Styles
461	+ $sections[ $prefix . 'style' ] = array(
462	+ 'title' => sprintf( __( '%s Shape Style', 'fl-builder' ), $position_label ),
463	+ 'fields' => array(
464	+ $prefix . 'fill_style' => array(
465	+ 'type' => 'button-group',
466	+ 'options' => array(
467	+ 'color' => __( 'Color Fill', 'fl-builder' ),
468	+ 'gradient' => __( 'Gradient Fill', 'fl-builder' ),
469	+ ),
470	+ 'default' => 'color',
471	+ 'preview' => array(
472	+ 'type' => 'callback',
473	+ 'callback' => 'previewShapeFillStyle',
474	+ 'position' => $position,
475	+ 'prefix' => $prefix,
476	+ 'selector' => ".fl-builder-$position-edge-layer .fl-shape-content .fl-shape",
477	+ ),
478	+ 'toggle' => array(
479	+ 'color' => array(
480	+ 'fields' => array(
481	+ $prefix . 'fill_color'
482	+ ),
483	+ ),
484	+ 'gradient' => array(
485	+ 'fields' => array(
486	+ $prefix . 'fill_gradient'
487	+ ),
488	+ ),
489	+ ),
490	+ ),
491	+ $prefix . 'fill_color' => array(
492	+ 'type' => 'color',
493	+ 'connections' => array( 'color' ),
494	+ 'label' => __( 'Color', 'fl-builder' ),
495	+ 'show_reset' => true,
496	+ 'show_alpha' => true,
497	+ 'responsive' => true,
498	+ 'default' => 'aaa',
499	+ 'preview' => array(
500	+ 'type' => 'css',
501	+ 'selector' => ".fl-builder-$position-edge-layer .fl-shape-content .fl-shape",
502	+ 'property' => 'fill',
503	+ ),
504	+ ),
505	+ $prefix . 'fill_gradient' => array(
506	+ 'type' => 'gradient',
507	+ 'label' => __( 'Gradient', 'fl-builder' ),
508	+ 'default' => '',
509	+ 'preview' => array(
510	+ 'type' => 'callback',
511	+ 'callback' => 'previewShapeGradientFill',
512	+ 'position' => $position,
513	+ 'prefix' => $prefix,
514	+ ),
515	+ ),
516	+
517	+ $prefix . 'transform' => array(
518	+ 'type' => 'shape-transform',
519	+ 'label' => __( 'Transform', 'fl-builder' ),
520	+ 'preview' => array(
521	+ 'type' => 'callback',
522	+ 'callback' => 'previewShapeTransform',
523	+ 'selector' => ".fl-builder-$position-edge-layer",
524	+ 'position' => $position,
525	+ ),
526	+ ),
527	+ ),
528	+ );
529	+ }
530	+
531	+ $sections['shapes_container'] = array(
532	+ 'title' => __( 'Shape Container', 'fl-builder' ),
533	+ 'fields' => array(
534	+ 'container_overflow' => array(
535	+ 'type' => 'select',
536	+ 'label' => __( 'Clip Within Container', 'fl-builder' ),
537	+ 'options' => array(
538	+ '' => __( 'No Clip', 'fl-builder' ),
539	+ 'hidden' => __( 'Clip Contents', 'fl-builder' ),
540	+ ),
541	+ 'preview' => array(
542	+ 'type' => 'css',
543	+ 'selector' => '.fl-row-content-wrap',
544	+ 'property' => 'overflow',
545	+ ),
546	+ ),
547	+ ),
548	+ );
549	+ return $sections;
550	+ }
551	+
552	+ /**
553	+ * Render the CSS for any shape layers set on a given node
554	+ *
555	+ * @param Object $node - the current node
556	+ * @return void
557	+ */
558	+ static public function render_shape_layers_css( $node ) {
559	+ $settings = $node->settings;
560	+ $id = $node->node;
561	+
562	+ $layers = array( 'top', 'bottom' );
563	+
564	+ foreach ( $layers as $position ) {
565	+ $prefix = $position . '_edge_';
566	+
567	+ if ( ! empty( $settings->{ $prefix . 'shape' } ) ) {
568	+
569	+ $shape_name = $settings->{ $prefix . 'shape' };
570	+ $presets = FLBuilderSettingsPresets::get_presets();
571	+ $preset = $presets['shape'][ $shape_name ];
572	+
573	+ FLBuilderCSS::rule( array(
574	+ 'selector' => ".fl-node-$id .fl-builder-$position-edge-layer",
575	+ 'enabled' => $settings->{ $prefix . 'size_top'} && $settings->{ $prefix . 'size_unit' },
576	+ 'props' => array(
577	+ $position => $settings->{ $prefix . 'size_top'} . $settings->{ $prefix . 'size_unit' },
578	+ ),
579	+ ) );
580	+
581	+ // Width, Height & Align
582	+ $shape_selector = ".fl-node-$id .fl-builder-$position-edge-layer > *";
583	+ $shape_align = explode( ' ', $settings->{ $prefix . 'align' } );
584	+ $align_y = $shape_align[0];
585	+ $align_x = $shape_align[1];
586	+ $width = $settings->{ $prefix . 'size_width'};
587	+ $height = $settings->{ $prefix . 'size_height' };
588	+ $size_unit = $settings->{ $prefix . 'size_unit' };
589	+
590	+ // Defaults
591	+ $shape_size_rule = array(
592	+ 'selector' => $shape_selector,
593	+ 'enabled' => true,
594	+ 'props' => array(),
595	+ );
596	+ $size_props = array(
597	+ 'width' => '100%',
598	+ 'left' => 'auto',
599	+ 'right' => 'auto',
600	+ 'height' => 'auto',
601	+ 'top' => 'auto',
602	+ 'bottom' => 'auto',
603	+ );
604	+
605	+ if ( ! empty( $width ) ) {
606	+ $size_props['width'] = $width . $size_unit;
607	+ $width_offset = ( $width / 2 ) . $size_unit;
608	+
609	+ switch ( $align_x ) {
610	+ case 'left':
611	+ $size_props['left'] = '0';
612	+ break;
613	+ case 'right':
614	+ $size_props['right'] = '0';
615	+ break;
616	+ case 'center':
617	+ $size_props['left'] = "calc( 50% - $width_offset )";
618	+ break;
619	+ }
620	+ }
621	+
622	+ $height_offset = '';
623	+ if ( ! empty( $height ) ) {
624	+ $height_offset = ( $height / 2 ) . $size_unit;
625	+ $size_props['height'] = $height . $size_unit;
626	+ } elseif ( $width ) {
627	+ $view_box_height = $preset['data']['viewBox']['width'];
628	+ $implied_height = ( $width / $view_box_height ) * 100;
629	+ $height_offset = ( $implied_height / 2 ) . $size_unit;
630	+ }
631	+
632	+ switch ( $align_y ) {
633	+ case 'top':
634	+ $size_props['top'] = '0';
635	+ break;
636	+ case 'bottom':
637	+ $size_props['bottom'] = '0';
638	+ $size_props['top'] = 'auto';
639	+ break;
640	+ case 'center':
641	+ $size_props['top'] = "calc( 50% - $height_offset )";
642	+ break;
643	+ }
644	+
645	+ $shape_size_rule['props'] = $size_props;
646	+ FLBuilderCSS::rule( $shape_size_rule );
647	+
648	+ // Shape Transforms
649	+
650	+ $transforms = $settings->{ $prefix . 'transform' };
651	+ $layer_transforms = array();
652	+ $shape_transforms = array();
653	+ $sign = '';
654	+ if ( ! empty( $transforms ) ) {
655	+
656	+ foreach ( $transforms as $prop => $value ) {
657	+ switch ( $prop ) {
658	+ case 'scaleXSign':
659	+ case 'scaleYSign':
660	+ break;
661	+
662	+ case 'scaleX':
663	+ case 'scaleY':
664	+ if ( empty( $value ) ) {
665	+ $value = 1;
666	+ }
667	+
668	+ // Positive or negative?
669	+ if ( 'scaleX' === $prop ) {
670	+ if ( isset( $transforms['scaleXSign'] ) ) {
671	+ $sign = $transforms['scaleXSign'];
672	+ }
673	+ } else {
674	+ if ( isset( $transforms['scaleYSign'] ) ) {
675	+ $sign = $transforms['scaleYSign'];
676	+ }
677	+ }
678	+ if ( 'invert' === $sign ) {
679	+ $value = -abs( $value );
680	+ } else {
681	+ $value = abs( $value );
682	+ }
683	+
684	+ $value = $prop . '(' . $value . ')';
685	+ $shape_transforms[] = $value;
686	+ break;
687	+
688	+ case 'translateX':
689	+ case 'translateY':
690	+ if ( ! empty( $value ) ) {
691	+ $value = $prop . '(' . $value . 'px)';
692	+ $shape_transforms[] = $value;
693	+ }
694	+ break;
695	+
696	+ case 'skewX':
697	+ case 'skewY':
698	+ if ( ! empty( $value ) ) {
699	+ $shape_transforms[] = $prop . '(' . $value . 'deg)';
700	+ }
701	+ break;
702	+
703	+ case 'rotate':
704	+ if ( ! empty( $value ) ) {
705	+ $shape_transforms[] = 'rotate(' . $value . 'deg)';
706	+ }
707	+ break;
708	+ }
709	+ }
710	+ // Shape Transforms
711	+ FLBuilderCSS::rule( array(
712	+ 'settings' => $settings,
713	+ 'enabled' => ! empty( $shape_transforms ),
714	+ 'selector' => ".fl-node-$id .fl-builder-$position-edge-layer > *",
715	+ 'props' => array(
716	+ 'transform' => implode( ' ', $shape_transforms ),
717	+ ),
718	+ ) );
719	+ }
720	+
721	+ // Shape Fill
722	+ if ( ! empty( $settings->{ $prefix . 'fill_style' } ) ) {
723	+ switch ( $settings->{ $prefix . 'fill_style' } ) {
724	+
725	+ case 'color':
726	+ FLBuilderCSS::responsive_rule( array(
727	+ 'settings' => $settings,
728	+ 'setting_name' => $prefix . 'fill_color',
729	+ 'selector' => ".fl-node-$id .fl-builder-$position-edge-layer .fl-shape-content .fl-shape",
730	+ 'prop' => 'fill',
731	+ ) );
732	+ break;
733	+
734	+ case 'gradient':
735	+ $gradient_type = $settings->{ $prefix . 'fill_gradient' }['type'];
736	+ $gradient_id = "fl-row-$id-$prefix-$gradient_type-gradient";
737	+ FLBuilderCSS::rule( array(
738	+ 'selector' => ".fl-node-$id .fl-builder-$position-edge-layer .fl-shape",
739	+ 'enabled' => $settings->{ $prefix . 'fill_gradient' },
740	+ 'props' => array(
741	+ 'fill' => 'url(#' . $gradient_id . ')',
742	+ ),
743	+ ) );
744	+ break;
745	+ case 'pattern':
746	+ $pattern_id = "fl-row-$id-$prefix-pattern";
747	+ FLBuilderCSS::rule( array(
748	+ 'selector' => ".fl-node-$id .fl-builder-$position-edge-layer .fl-shape-content .fl-shape",
749	+ 'enabled' => true,
750	+ 'props' => array(
751	+ 'fill' => 'url(#' . $pattern_id . ')',
752	+ ),
753	+ ) );
754	+ FLBuilderCSS::rule( array(
755	+ 'selector' => ".fl-node-$id .fl-builder-$position-edge-layer pattern .fl-shape",
756	+ 'enabled' => true,
757	+ 'props' => array(
758	+ 'fill' => $settings->{ $prefix . 'fill_pattern_shape_color' },
759	+ ),
760	+ ) );
761	+ break;
762	+ }
763	+ }
764	+ }
765	+ }
766	+
767	+ // Shared styles
768	+ FLBuilderCSS::responsive_rule( array(
769	+ 'settings' => $settings,
770	+ 'setting_name' => 'container_overflow',
771	+ 'selector' => ".fl-node-$id .fl-row-content-wrap",
772	+ 'prop' => 'overflow',
773	+ ) );
774	+ }
775	+
776	+ /**
777	+ * Convert a position keyword ( left, right, center, ... ) to a position integer ( 0.0 - 1.0 )
778	+ *
779	+ * @param String $position
780	+ * @return Int \| Null
781	+ */
782	+ static public function get_int_for_position_name( $position = '' ) {
783	+
784	+ switch ( $position ) {
785	+ case 'left':
786	+ case 'top':
787	+ return 0;
788	+ case 'center':
789	+ return .5;
790	+ case 'right':
791	+ case 'bottom':
792	+ return 1;
793	+ default:
794	+ return null;
795	+ }
796	+ }
797	+ }
798	+ FLBuilderArt::init();

classes/class-fl-builder-color.php CHANGED Viewed

@@ -11,33 +11,68 @@ final class FLBuilderColor {
             	 * Converts a hex string into an array of RGB values.
+            	 *
             	 * @since 1.0
             	 * @param string $hex A hex color value without the # sign.
             	 * @return array An array of RGB values.
             	 */
             	static public function hex_to_rgb( $hex ) {
             		return array(
-            -
            			'r' => hexdec( substr( $hex,0,2 ) ),
-            -
            			'g' => hexdec( substr( $hex,2,2 ) ),
-            -
            			'b' => hexdec( substr( $hex,4,2 ) ),
             		);
+            	}
             	/**
-            -
            	 * Adjusts the brightness of a hex color value based on
             	 * the number of steps provided.
+            	 *
             	 * @since 1.0
-            -
            	 * @param string $hex A hex color value without the # sign.
             	 * @param int $steps The number of steps to adjust the color.
             	 * @param string $type The type of adjustment to make. Either lighten, darken or reverse.
-            -
            	 * @return string The adjusted hex string.
             	 */
-            -
            	static public function adjust_brightness( $hex, $steps, $type ) {
             		// Get rgb vars.
-            -
            		$rgb = self::hex_to_rgb( $hex );
-            -
            		$r = $rgb['r'];
-            -
            		$g = $rgb['g'];
-            -
            		$b = $rgb['b'];
             		// Should we darken the color?
             		if ( 'reverse' == $type && $r + $g + $b > 382 ) {
@@ -46,28 +81,147 @@ final class FLBuilderColor {
             			$steps = -$steps;
+            		}
-            -
            		// Build the new color.
             		$steps = max( -255, min( 255, $steps ) );
-            -
            		$r = max( 0,min( 255,$r + $steps ) );
-            -
            		$g = max( 0,min( 255,$g + $steps ) );
-            -
            		$b = max( 0,min( 255,$b + $steps ) );
-            -
            		$r_hex = str_pad( dechex( $r ), 2, '0', STR_PAD_LEFT );
-            -
            		$g_hex = str_pad( dechex( $g ), 2, '0', STR_PAD_LEFT );
-            -
            		$b_hex = str_pad( dechex( $b ), 2, '0', STR_PAD_LEFT );
-            -
            		return $r_hex . $g_hex . $b_hex;
+            	}
             	/**
-            -
            	 * Returns RGB or hex color value.
+            	 *
-            -
            	 * @since 1.10.8
-            -
            	 * @param string $color A color to check.
             	 * @return string
             	 */
-            -
            	static public function hex_or_rgb( $color ) {
-            -
            		return strpos( $color, 'rgb' ) !== false ? $color : '#' . $color;
+            	}
+            }


11	* Converts a hex string into an array of RGB values.
12	*
13	* @since 1.0
14	+ * @since 2.2 Added support for rgba values.
15	* @param string $hex A hex color value without the # sign.
16	* @return array An array of RGB values.
17	*/
18	static public function hex_to_rgb( $hex ) {
19	+ if ( strstr( $hex, 'rgb' ) ) {
20	+ $rgb = explode( ',', preg_replace( '/[a-z]/', '', $hex ) );
21	+ return array(
22	+ 'r' => $rgb[0],
23	+ 'g' => $rgb[1],
24	+ 'b' => $rgb[2],
25	+ );
26	+ }
27	return array(
28	+ 'r' => hexdec( substr( $hex, 0, 2 ) ),
29	+ 'g' => hexdec( substr( $hex, 2, 2 ) ),
30	+ 'b' => hexdec( substr( $hex, 4, 2 ) ),
31	);
32	}
33
34	/**
35	+ * Returns RGB or hex color value.
36	+ *
37	+ * @since 1.10.8
38	+ * @param string $color A color to check.
39	+ * @return string
40	+ */
41	+ static public function hex_or_rgb( $color ) {
42	+ if ( ! empty( $color ) && ! stristr( $color, 'rgb' ) && ! stristr( $color, '#' ) ) {
43	+ $color = '#' . $color;
44	+ }
45	+
46	+ return $color;
47	+ }
48	+
49	+ /**
50	+ * Adjusts the brightness of a hex or rgba color value based on
51	* the number of steps provided.
52	*
53	* @since 1.0
54	+ * @since 2.2 Added support for rgba values.
55	+ * @param string $value A hex or rgba color value.
56	* @param int $steps The number of steps to adjust the color.
57	* @param string $type The type of adjustment to make. Either lighten, darken or reverse.
58	+ * @return string The adjusted value string.
59	*/
60	+ static public function adjust_brightness( $value, $steps, $type ) {
61	+ $is_rgb = strstr( $value, 'rgb' );
62	+
63	// Get rgb vars.
64	+ if ( $is_rgb ) {
65	+ $rgb = explode( ',', preg_replace( '/[a-z]/', '', $value ) );
66	+ $r = $rgb[0];
67	+ $g = $rgb[1];
68	+ $b = $rgb[2];
69	+ $a = count( $rgb ) > 3 ? $rgb[3] : false;
70	+ } else {
71	+ $rgb = self::hex_to_rgb( $value );
72	+ $r = $rgb['r'];
73	+ $g = $rgb['g'];
74	+ $b = $rgb['b'];
75	+ }
76
77	// Should we darken the color?
78	if ( 'reverse' == $type && $r + $g + $b > 382 ) {

81	$steps = -$steps;
82	}
83
84	+ // Adjustr the rgb values.
85	$steps = max( -255, min( 255, $steps ) );
86	+ $r = max( 0, min( 255, $r + $steps ) );
87	+ $g = max( 0, min( 255, $g + $steps ) );
88	+ $b = max( 0, min( 255, $b + $steps ) );
89	+
90	+ // Return the adjusted color value.
91	+ if ( $is_rgb ) {
92	+ $value = false === $a ? "rgb($r,$g,$b)" : "rgba($r,$g,$b,$a)";
93	+ } else {
94	+ $r_hex = str_pad( dechex( $r ), 2, '0', STR_PAD_LEFT );
95	+ $g_hex = str_pad( dechex( $g ), 2, '0', STR_PAD_LEFT );
96	+ $b_hex = str_pad( dechex( $b ), 2, '0', STR_PAD_LEFT );
97	+ $value = $r_hex . $g_hex . $b_hex;
98	+ }
99	+
100	+ return $value;
101	+ }
102	+
103	+ /**
104	+ * Returns a gradient value string. Must be passed a
105	+ * gradient setting array from a gradient field.
106	+ *
107	+ * @since 2.2
108	+ * @param array $setting
109	+ * @return string
110	+ */
111	+ static public function gradient( $setting ) {
112	+ $gradient = '';
113	+ $values = array();
114	+
115	+ if ( ! is_array( $setting ) ) {
116	+ return $gradient;
117	+ }
118
119	+ foreach ( $setting['colors'] as $i => $color ) {
120	+ $stop = $setting['stops'][ $i ];

121
122	+ if ( empty( $color ) ) {
123	+ $color = 'rgba(255,255,255,0)';
124	+ }
125	+ if ( ! strstr( $color, 'rgb' ) ) {
126	+ $color = '#' . $color;
127	+ }
128	+ if ( ! is_numeric( $stop ) ) {
129	+ $stop = 0;
130	+ }
131
132	+ $values[] = $color . ' ' . $stop . '%';
133	+ }
134	+
135	+ $values = implode( ', ', $values );
136	+
137	+ if ( 'linear' === $setting['type'] ) {
138	+ if ( ! is_numeric( $setting['angle'] ) ) {
139	+ $setting['angle'] = 0;
140	+ }
141	+ $gradient = 'linear-gradient(' . $setting['angle'] . 'deg, ' . $values . ')';
142	+ } else {
143	+ $gradient = 'radial-gradient(at ' . $setting['position'] . ', ' . $values . ')';
144	+ }
145	+
146	+ return $gradient;
147	}
148
149	/**
150	+ * Returns a shadow value string. Must be passed a
151	+ * shadow setting array from a shadow field.
152	*
153	+ * @since 2.2
154	+ * @param array $setting
155	* @return string
156	*/
157	+ static public function shadow( $setting ) {
158	+ $shadow = '';
159	+
160	+ if ( isset( $setting['color'] ) && '' !== $setting['color'] ) {
161	+
162	+ if ( '' === $setting['horizontal'] ) {
163	+ $setting['horizontal'] = 0;
164	+ }
165	+ if ( '' === $setting['vertical'] ) {
166	+ $setting['vertical'] = 0;
167	+ }
168	+ if ( '' === $setting['blur'] ) {
169	+ $setting['blur'] = 0;
170	+ }
171	+ if ( isset( $setting['spread'] ) && '' === $setting['spread'] ) {
172	+ $setting['spread'] = 0;
173	+ }
174	+ if ( ! strstr( $setting['color'], 'rgb' ) ) {
175	+ $setting['color'] = '#' . $setting['color'];
176	+ }
177	+
178	+ $shadow = $setting['horizontal'] . 'px ';
179	+ $shadow .= $setting['vertical'] . 'px ';
180	+ $shadow .= $setting['blur'] . 'px ';
181	+
182	+ if ( isset( $setting['spread'] ) ) {
183	+ $shadow .= $setting['spread'] . 'px ';
184	+ }
185	+
186	+ $shadow .= $setting['color'];
187	+ }
188	+
189	+ return $shadow;
190	+ }
191	+
192	+ /**
193	+ * Get the raw rgba values for a color value
194	+ *
195	+ * @since 2.2
196	+ * @param String $color - hex or rgb value
197	+ * @return Array
198	+ */
199	+ static public function rgba_values_for_color( $value = '' ) {
200	+ $is_rgb = strstr( $value, 'rgb' );
201	+
202	+ // Get rgb vars.
203	+ if ( $is_rgb ) {
204	+ $rgb = explode( ',', preg_replace( '/[a-z]/', '', $value ) );
205	+ $r = $rgb[0];
206	+ $g = $rgb[1];
207	+ $b = $rgb[2];
208	+ $a = count( $rgb ) > 3 ? $rgb[3] : false;
209	+ } else {
210	+ $rgb = self::hex_to_rgb( $value );
211	+ $r = $rgb['r'];
212	+ $g = $rgb['g'];
213	+ $b = $rgb['b'];
214	+ $a = 1;
215	+ }
216	+ if ( count( $rgb ) === 4 ) {
217	+ $rgb = array_slice( $rgb, 0, 3 );
218	+ }
219	+ return array(
220	+ 'r' => $r,
221	+ 'g' => $g,
222	+ 'b' => $b,
223	+ 'a' => $a,
224	+ 'rgb' => 'rgb(' . implode( ',', $rgb ) . ')',
225	+ );
226	}
227	}

classes/class-fl-builder-css.php ADDED Viewed

	@@ -0,0 +1,530 @@


1	+ <?php
2	+
3	+ /**
4	+ * Helper class for outputting CSS.
5	+ *
6	+ * @since 2.2
7	+ */
8	+ final class FLBuilderCSS {
9	+
10	+ /**
11	+ * An array of rule arg arrays that is used
12	+ * and cleared when the render method is called.
13	+ *
14	+ * @since 2.2
15	+ * @var array $rules
16	+ */
17	+ static protected $rules = array();
18	+
19	+ /**
20	+ * Adds a rule config array.
21	+ *
22	+ * @since 2.2
23	+ * @param array $rules
24	+ * @return void
25	+ */
26	+ static public function rule( $args = array() ) {
27	+ self::$rules[] = $args;
28	+ }
29	+
30	+ /**
31	+ * Adds rule config arrays for responsive settings.
32	+ *
33	+ * @since 2.2
34	+ * @param array $args
35	+ * @return void
36	+ */
37	+ static public function responsive_rule( $args = array() ) {
38	+ $global_settings = FLBuilderModel::get_global_settings();
39	+ $default_args = array(
40	+ 'settings' => null,
41	+ 'setting_name' => '',
42	+ 'setting_base_name' => '',
43	+ 'selector' => '',
44	+ 'prop' => '',
45	+ 'props' => array(),
46	+ 'unit' => '',
47	+ 'enabled' => true,
48	+ 'ignore' => array(),
49	+ );
50	+ $args = wp_parse_args( $args, $default_args );
51	+ $settings = $args['settings'];
52	+ $setting_name = $args['setting_name'];
53	+ $setting_base_name = $args['setting_base_name'];
54	+ $selector = $args['selector'];
55	+ $prop = $args['prop'];
56	+ $props = $args['props'];
57	+ $default_unit = $args['unit'];
58	+ $enabled = $args['enabled'];
59	+ $breakpoints = array( '', 'medium', 'responsive' );
60	+ $ignore = $args['ignore'];
61	+
62	+ if ( ! $settings \|\| empty( $setting_name ) \|\| empty( $selector ) ) {
63	+ return;
64	+ }
65	+
66	+ foreach ( $breakpoints as $breakpoint ) {
67	+
68	+ if ( ! empty( $breakpoint ) && ! $global_settings->responsive_enabled ) {
69	+ continue;
70	+ }
71	+
72	+ $suffix = empty( $breakpoint ) ? '' : "_{$breakpoint}";
73	+ $name = $setting_name . $suffix;
74	+ $base_name = empty( $setting_base_name ) ? $name : $setting_base_name . $suffix;
75	+ $setting = isset( $settings->{$name} ) ? $settings->{$name} : null;
76	+
77	+ if ( null === $setting ) {
78	+ continue;
79	+ }
80	+
81	+ if ( $enabled && ! in_array( $setting, $ignore ) ) {
82	+
83	+ if ( ! empty( $prop ) ) {
84	+ $props[ $prop ] = array(
85	+ 'value' => $setting,
86	+ 'unit' => FLBuilderCSS::get_unit( $base_name, $settings, $default_unit ),
87	+ );
88	+ }
89	+
90	+ self::$rules[] = array(
91	+ 'media' => $breakpoint,
92	+ 'selector' => $selector,
93	+ 'props' => $props,
94	+ );
95	+ }
96	+ }
97	+ }
98	+
99	+ /**
100	+ * Adds a responsive rule config array for a dimension field.
101	+ *
102	+ * @since 2.2
103	+ * @param array $args
104	+ * @return void
105	+ */
106	+ static public function dimension_field_rule( $args = array() ) {
107	+ $args = wp_parse_args( $args, array(
108	+ 'settings' => null,
109	+ 'setting_name' => '',
110	+ 'selector' => '',
111	+ 'props' => array(),
112	+ 'unit' => '',
113	+ ) );
114	+ $settings = $args['settings'];
115	+ $setting_base_name = $args['setting_name'];
116	+ $selector = $args['selector'];
117	+ $props = $args['props'];
118	+ $unit = $args['unit'];
119	+
120	+ if ( ! $settings \|\| empty( $setting_base_name ) \|\| empty( $selector ) ) {
121	+ return;
122	+ }
123	+
124	+ foreach ( $props as $prop => $settings_name ) {
125	+ $rules = self::responsive_rule( array(
126	+ 'settings' => $settings,
127	+ 'setting_name' => $settings_name,
128	+ 'setting_base_name' => $setting_base_name,
129	+ 'selector' => $selector,
130	+ 'prop' => $prop,
131	+ 'unit' => $unit,
132	+ ) );
133	+
134	+ if ( ! empty( $rules ) ) {
135	+ self::$rules = array_merge( self::$rules, $rules );
136	+ }
137	+ }
138	+ }
139	+
140	+ /**
141	+ * Adds a responsive rule config array for a compound field.
142	+ *
143	+ * @since 2.2
144	+ * @param array $args
145	+ * @return void
146	+ */
147	+ static public function compound_field_rule( $args = array() ) {
148	+ $global_settings = FLBuilderModel::get_global_settings();
149	+ $args = wp_parse_args( $args, array(
150	+ 'type' => '',
151	+ 'selector' => '',
152	+ 'settings' => null,
153	+ 'setting_name' => '',
154	+ ) );
155	+ $type = $args['type'];
156	+ $selector = $args['selector'];
157	+ $settings = $args['settings'];
158	+ $setting_name = $args['setting_name'];
159	+ $breakpoints = array( '', 'medium', 'responsive' );
160	+
161	+ if ( empty( $type ) \|\| empty( $selector ) \|\| ! $settings \|\| empty( $setting_name ) ) {
162	+ return;
163	+ }
164	+
165	+ foreach ( $breakpoints as $breakpoint ) {
166	+
167	+ if ( ! empty( $breakpoint ) && ! $global_settings->responsive_enabled ) {
168	+ continue;
169	+ }
170	+
171	+ $name = empty( $breakpoint ) ? $setting_name : "{$setting_name}_{$breakpoint}";
172	+ $setting = isset( $settings->{$name} ) ? $settings->{$name} : null;
173	+ $callback = "{$type}_field_props";
174	+ $props = array();
175	+
176	+ // Settings must be an array. Settings in nested forms can become objects when encoded.
177	+ if ( is_object( $setting ) ) {
178	+ $setting = (array) $setting;
179	+ foreach ( $setting as $key => $value ) {
180	+ if ( is_object( $value ) ) {
181	+ $setting[ $key ] = (array) $value;
182	+ }
183	+ }
184	+ }
185	+
186	+ if ( ! is_array( $setting ) ) {
187	+ continue;
188	+ }
189	+ if ( method_exists( __CLASS__, $callback ) ) {
190	+ $props = call_user_func( array( __CLASS__, $callback ), $setting );
191	+ }
192	+
193	+ self::$rules[] = array(
194	+ 'media' => $breakpoint,
195	+ 'selector' => $selector,
196	+ 'props' => $props,
197	+ );
198	+ }
199	+ }
200	+
201	+ /**
202	+ * Adds a responsive rule config array for a border field.
203	+ *
204	+ * @since 2.2
205	+ * @param array $args
206	+ * @return void
207	+ */
208	+ static public function border_field_rule( $args = array() ) {
209	+ $args['type'] = 'border';
210	+ self::compound_field_rule( $args );
211	+ }
212	+
213	+ /**
214	+ * Returns a property config array for a border field.
215	+ *
216	+ * @since 2.2
217	+ * @param array $setting
218	+ * @return array
219	+ */
220	+ static public function border_field_props( $setting = array() ) {
221	+ $props = array();
222	+
223	+ if ( isset( $setting['style'] ) && ! empty( $setting['style'] ) ) {
224	+ $props['border-style'] = $setting['style'];
225	+ $props['border-width'] = '0'; // Default to zero.
226	+ $props['background-clip'] = 'padding-box';
227	+ }
228	+ if ( isset( $setting['color'] ) && ! empty( $setting['color'] ) ) {
229	+ $props['border-color'] = $setting['color'];
230	+ }
231	+ if ( isset( $setting['width'] ) && is_array( $setting['width'] ) ) {
232	+ if ( '' !== $setting['width']['top'] ) {
233	+ $props['border-top-width'] = $setting['width']['top'] . 'px';
234	+ }
235	+ if ( '' !== $setting['width']['right'] ) {
236	+ $props['border-right-width'] = $setting['width']['right'] . 'px';
237	+ }
238	+ if ( '' !== $setting['width']['bottom'] ) {
239	+ $props['border-bottom-width'] = $setting['width']['bottom'] . 'px';
240	+ }
241	+ if ( '' !== $setting['width']['left'] ) {
242	+ $props['border-left-width'] = $setting['width']['left'] . 'px';
243	+ }
244	+ }
245	+ if ( isset( $setting['radius'] ) && is_array( $setting['radius'] ) ) {
246	+ if ( '' !== $setting['radius']['top_left'] ) {
247	+ $props['border-top-left-radius'] = $setting['radius']['top_left'] . 'px';
248	+ }
249	+ if ( '' !== $setting['radius']['top_right'] ) {
250	+ $props['border-top-right-radius'] = $setting['radius']['top_right'] . 'px';
251	+ }
252	+ if ( '' !== $setting['radius']['bottom_left'] ) {
253	+ $props['border-bottom-left-radius'] = $setting['radius']['bottom_left'] . 'px';
254	+ }
255	+ if ( '' !== $setting['radius']['bottom_right'] ) {
256	+ $props['border-bottom-right-radius'] = $setting['radius']['bottom_right'] . 'px';
257	+ }
258	+ }
259	+ if ( isset( $setting['shadow'] ) && is_array( $setting['shadow'] ) ) {
260	+ $props['box-shadow'] = FLBuilderColor::shadow( $setting['shadow'] );
261	+ }
262	+
263	+ return $props;
264	+ }
265	+
266	+ /**
267	+ * Adds a responsive rule config array for a typography field.
268	+ *
269	+ * @since 2.2
270	+ * @param array $args
271	+ * @return void
272	+ */
273	+ static public function typography_field_rule( $args = array() ) {
274	+ $args['type'] = 'typography';
275	+ self::compound_field_rule( $args );
276	+ }
277	+
278	+ /**
279	+ * Returns a property config array for a typography field.
280	+ *
281	+ * @since 2.2
282	+ * @param array $setting
283	+ * @return array
284	+ */
285	+ static public function typography_field_props( $setting = array() ) {
286	+ $props = array();
287	+
288	+ if ( isset( $setting['font_family'] ) && 'Default' !== $setting['font_family'] ) {
289	+ $fallback = FLBuilderFonts::get_font_fallback( $setting['font_family'] );
290	+ $props['font-family'] = sprintf( '%s, %s', $setting['font_family'], $fallback );
291	+ }
292	+ if ( isset( $setting['font_weight'] ) && 'i' == substr( $setting['font_weight'], -1 ) ) {
293	+ $props['font-weight'] = substr( $setting['font_weight'], 0, -1 );
294	+ $props['font-style'] = 'italic';
295	+ }
296	+ if ( isset( $setting['font_weight'] ) && 'default' !== $setting['font_weight'] && 'italic' !== $setting['font_weight'] ) {
297	+ $props['font-weight'] = $setting['font_weight'];
298	+ }
299	+ if ( isset( $setting['font_size'] ) && ! empty( $setting['font_size']['length'] ) ) {
300	+ $props['font-size'] = $setting['font_size']['length'] . $setting['font_size']['unit'];
301	+ }
302	+ if ( isset( $setting['line_height'] ) && ! empty( $setting['line_height']['length'] ) ) {
303	+ $props['line-height'] = $setting['line_height']['length'] . $setting['line_height']['unit'];
304	+ }
305	+ if ( isset( $setting['letter_spacing'] ) && ! empty( $setting['letter_spacing']['length'] ) ) {
306	+ $props['letter-spacing'] = $setting['letter_spacing']['length'] . 'px';
307	+ }
308	+ if ( isset( $setting['text_align'] ) ) {
309	+ $props['text-align'] = $setting['text_align'];
310	+ }
311	+ if ( isset( $setting['text_transform'] ) ) {
312	+ $props['text-transform'] = $setting['text_transform'];
313	+ }
314	+ if ( isset( $setting['text_decoration'] ) ) {
315	+ $props['text-decoration'] = $setting['text_decoration'];
316	+ }
317	+ if ( isset( $setting['font_style'] ) ) {
318	+ $props['font-style'] = $setting['font_style'];
319	+ }
320	+ if ( isset( $setting['font_variant'] ) ) {
321	+ $props['font-variant'] = $setting['font_variant'];
322	+ }
323	+ if ( isset( $setting['text_shadow'] ) ) {
324	+ $props['text-shadow'] = FLBuilderColor::shadow( $setting['text_shadow'] );
325	+ }
326	+
327	+ return $props;
328	+ }
329	+
330	+ /**
331	+ * Renders the CSS for all of the rules that have
332	+ * been added and resets the $rules array.
333	+ *
334	+ * @since 2.2
335	+ * @return void
336	+ */
337	+ static public function render() {
338	+ $rendered = array();
339	+ $css = '';
340	+
341	+ foreach ( self::$rules as $args ) {
342	+ $defaults = array(
343	+ 'media' => '',
344	+ 'selector' => '',
345	+ 'enabled' => true,
346	+ 'props' => array(),
347	+ );
348	+
349	+ $args = array_merge( $defaults, $args );
350	+ $media = self::media_value( $args['media'] );
351	+ $selector = $args['selector'];
352	+ $props = self::properties( $args['props'] );
353	+
354	+ if ( ! $args['enabled'] \|\| empty( $selector ) \|\| empty( $props ) ) {
355	+ continue;
356	+ }
357	+
358	+ if ( ! isset( $rendered[ $media ] ) ) {
359	+ $rendered[ $media ] = array();
360	+ }
361	+
362	+ if ( ! isset( $rendered[ $media ][ $selector ] ) ) {
363	+ $rendered[ $media ][ $selector ] = array();
364	+ }
365	+
366	+ $rendered[ $media ][ $selector ][] = $props;
367	+ }
368	+
369	+ foreach ( $rendered as $media => $selectors ) {
370	+
371	+ if ( ! empty( $media ) ) {
372	+ $css .= "@media($media) {\n";
373	+ $tab = "\t";
374	+ } else {
375	+ $tab = '';
376	+ }
377	+
378	+ foreach ( $selectors as $selector => $group ) {
379	+ $css .= "$tab$selector {\n";
380	+ foreach ( $group as $props ) {
381	+ $css .= str_replace( "\t", "$tab\t", $props );
382	+ }
383	+ $css .= "$tab}\n";
384	+ }
385	+
386	+ if ( ! empty( $media ) ) {
387	+ $css .= "}\n";
388	+ }
389	+ }
390	+
391	+ self::$rules = array();
392	+
393	+ echo $css;
394	+ }
395	+
396	+ /**
397	+ * Returns the property string for a rule block.
398	+ *
399	+ * @since 2.2
400	+ * @param array $props
401	+ * @return string
402	+ */
403	+ static public function properties( $props ) {
404	+ $css = '';
405	+ $defaults = array(
406	+ 'value' => '',
407	+ 'unit' => '',
408	+ 'enabled' => true,
409	+ );
410	+
411	+ foreach ( $props as $name => $args ) {
412	+
413	+ if ( ! is_array( $args ) ) {
414	+ $args = array(
415	+ 'value' => $args,
416	+ );
417	+ }
418	+
419	+ $args = array_merge( $defaults, $args );
420	+ $value = $args['value'];
421	+ $type = self::property_type( $name );
422	+
423	+ if ( '' === $value \|\| ! $args['enabled'] ) {
424	+ continue;
425	+ }
426	+
427	+ switch ( $type ) {
428	+
429	+ case 'color':
430	+ if ( strstr( $value, 'rgb' ) \|\| strstr( $value, 'url' ) ) {
431	+ $css .= "\t$name: $value;\n";
432	+ } else {
433	+ $css .= "\t$name: #$value;\n";
434	+ if ( isset( $args['opacity'] ) && '' !== $args['opacity'] ) {
435	+ $rgb = implode( ',', FLBuilderColor::hex_to_rgb( $value ) );
436	+ $a = $args['opacity'] / 100;
437	+ $css .= "\t$name: rgba($rgb,$a);\n";
438	+ }
439	+ }
440	+ break;
441	+
442	+ case 'image':
443	+ if ( stristr( $value, 'gradient(' ) ) {
444	+ $css .= "\t$name: $value;\n";
445	+ } else {
446	+ $css .= "\t$name: url($value);\n";
447	+ }
448	+ break;
449	+
450	+ default:
451	+ $css .= "\t$name: $value";
452	+ if ( isset( $args['unit'] ) && '' !== $args['unit'] ) {
453	+ $css .= $args['unit'];
454	+ }
455	+ $css .= ";\n";
456	+ }
457	+ }
458	+
459	+ return $css;
460	+ }
461	+
462	+ /**
463	+ * Returns the type for a single property.
464	+ *
465	+ * @since 2.2
466	+ * @param string $name
467	+ * @return string\|bool
468	+ */
469	+ static public function property_type( $name ) {
470	+ if ( strstr( $name, 'image' ) ) {
471	+ return 'image';
472	+ } elseif ( strstr( $name, 'color' ) ) {
473	+ return 'color';
474	+ }
475	+ // Support SVG color properties
476	+ if ( 'fill' === $name \|\| 'stroke' === $name ) {
477	+ return 'color';
478	+ }
479	+ return false;
480	+ }
481	+
482	+ /**
483	+ * Returns the value for a media declaration.
484	+ *
485	+ * @since 2.2
486	+ * @param string $media
487	+ * @return string
488	+ */
489	+ static public function media_value( $media ) {
490	+ $settings = FLBuilderModel::get_global_settings();
491	+
492	+ if ( 'default' === $media ) {
493	+ $media = '';
494	+ } elseif ( 'medium' === $media ) {
495	+ $media = "max-width: {$settings->medium_breakpoint}px";
496	+ } elseif ( 'responsive' === $media ) {
497	+ $media = "max-width: {$settings->responsive_breakpoint}px";
498	+ }
499	+
500	+ return $media;
501	+ }
502	+
503	+ /**
504	+ * Checks is unit field value is actually empty or not.
505	+ *
506	+ * @since 2.2
507	+ * @param string $value
508	+ * @return bool
509	+ */
510	+ static public function is_empty( $value = '' ) {
511	+ return empty( $value ) && '0' !== $value;
512	+ }
513	+
514	+ /**
515	+ * Get the unit for a given setting. If no default unit is passed, it looks for a _unit setting.
516	+ *
517	+ * @since 2.2
518	+ * @param string $name
519	+ * @param object $settings
520	+ * @param string $default_unit
521	+ * @return string
522	+ */
523	+ static public function get_unit( $setting_name, $settings, $default_unit = '' ) {
524	+ $unit = $default_unit;
525	+ if ( '' === $unit && property_exists( $settings, $setting_name . '_unit' ) ) {
526	+ $unit = $settings->{$setting_name . '_unit'};
527	+ }
528	+ return $unit;
529	+ }
530	+ }

classes/class-fl-builder-debug.php CHANGED Viewed

	@@ -90,7 +90,7 @@ final class FL_Debug {
90
91	private static function prepare_tests() {
92
93	- global $wpdb, $wp_version;
94
95	$args = array(
96	'name' => 'WordPress',
	@@ -222,6 +222,12 @@ final class FL_Debug {
222	);
223	self::register( 'php_sapi', $args );
224






225	$args = array(
226	'name' => 'PHP Memory Limit',
227	'data' => self::safe_ini_get( 'memory_limit' ),


90
91	private static function prepare_tests() {
92
93	+ global $wpdb, $wp_version, $wp_json;
94
95	$args = array(
96	'name' => 'WordPress',

222	);
223	self::register( 'php_sapi', $args );
224
225	+ $args = array(
226	+ 'name' => 'PHP JSON Support',
227	+ 'data' => ( $wp_json instanceof Services_JSON ) ? '* NO JSON MODULE *' : 'yes',
228	+ );
229	+ self::register( 'php_json', $args );
230	+
231	$args = array(
232	'name' => 'PHP Memory Limit',
233	'data' => self::safe_ini_get( 'memory_limit' ),

classes/class-fl-builder-fonts.php CHANGED Viewed

@@ -35,11 +35,22 @@ final class FLBuilderFonts {
             	static public function js() {
             		$default = json_encode( apply_filters( 'fl_builder_font_families_default', FLBuilderFontFamilies::$default ) );
             		$system  = json_encode( apply_filters( 'fl_builder_font_families_system', FLBuilderFontFamilies::$system ) );
-            -
            		$google  = json_encode( apply_filters( 'fl_builder_font_families_google', FLBuilderFontFamilies::google() ) );
             		echo 'var FLBuilderFontFamilies = { default: ' . $default . ', system: ' . $system . ', google: ' . $google . ' };';
+            	}
             	/**
             	 * Renders a list of all available fonts.
+            	 *
@@ -195,9 +206,33 @@ final class FLBuilderFonts {
             	static public function add_fonts_for_module( $module ) {
             		$fields = FLBuilderModel::get_settings_form_fields( $module->form );
             		foreach ( $fields as $name => $field ) {
             			if ( 'font' == $field['type'] && isset( $module->settings->$name ) ) {
             				self::add_font( $module->settings->$name );
             			} elseif ( isset( $field['form'] ) ) {
             				$form = FLBuilderModel::$settings_forms[ $field['form'] ];
             				self::add_fonts_for_nested_module_form( $module, $form['tabs'], $name );
@@ -420,6 +455,33 @@ final class FLBuilderFonts {
             		return $urls;
+            	}
+            }
             FLBuilderFonts::init();
@@ -437,9 +499,77 @@ final class FLBuilderFontFamilies {
             	 */
             	static private $_google_json = array();
             	static public $default = array(
             		'Default' => array(
             			'default',
             		),
             	);
@@ -479,6 +609,7 @@ final class FLBuilderFontFamilies {
             			$json = self::$_google_json;
             		} else {
             			$json = (array) json_decode( file_get_contents( trailingslashit( FL_BUILDER_DIR ) . 'json/fonts.json' ), true );
+            		}
             		/**
             		 * Filter raw google json data
@@ -501,60 +632,4 @@ final class FLBuilderFontFamilies {
+            		}
             		return false;
+            	}
-            -
-            -
-            -
            	/**
-            -
            	 * Array with a list of system fonts.
-            -
            	 * @var array
-            -
            	 */
-            -
            	static public $system = array(
-            -
            		'Helvetica' => array(
-            -
            			'fallback' => 'Verdana, Arial, sans-serif',
-            -
            			'weights'  => array(
-            -
            				'300',
-            -
            				'400',
-            -
            				'700',
-            -
            			),
-            -
            		),
-            -
            		'Verdana'   => array(
-            -
            			'fallback' => 'Helvetica, Arial, sans-serif',
-            -
            			'weights'  => array(
-            -
            				'300',
-            -
            				'400',
-            -
            				'700',
-            -
            			),
-            -
            		),
-            -
            		'Arial'     => array(
-            -
            			'fallback' => 'Helvetica, Verdana, sans-serif',
-            -
            			'weights'  => array(
-            -
            				'300',
-            -
            				'400',
-            -
            				'700',
-            -
            			),
-            -
            		),
-            -
            		'Times'     => array(
-            -
            			'fallback' => 'Georgia, serif',
-            -
            			'weights'  => array(
-            -
            				'300',
-            -
            				'400',
-            -
            				'700',
-            -
            			),
-            -
            		),
-            -
            		'Georgia'   => array(
-            -
            			'fallback' => 'Times, serif',
-            -
            			'weights'  => array(
-            -
            				'300',
-            -
            				'400',
-            -
            				'700',
-            -
            			),
-            -
            		),
-            -
            		'Courier'   => array(
-            -
            			'fallback' => 'monospace',
-            -
            			'weights'  => array(
-            -
            				'300',
-            -
            				'400',
-            -
            				'700',
-            -
            			),
-            -
            		),
-            -
            	);
+            }


35	static public function js() {
36	$default = json_encode( apply_filters( 'fl_builder_font_families_default', FLBuilderFontFamilies::$default ) );
37	$system = json_encode( apply_filters( 'fl_builder_font_families_system', FLBuilderFontFamilies::$system ) );
38	+ $google = json_encode( apply_filters( 'fl_builder_font_families_google', self::prepare_google_fonts( FLBuilderFontFamilies::google() ) ) );
39
40	echo 'var FLBuilderFontFamilies = { default: ' . $default . ', system: ' . $system . ', google: ' . $google . ' };';
41	}
42
43	+ static public function prepare_google_fonts( $fonts ) {
44	+ foreach ( $fonts as $family => $variants ) {
45	+ foreach ( $variants as $k => $variant ) {
46	+ if ( 'italic' == $variant \|\| 'i' == substr( $variant, -1 ) ) {
47	+ unset( $fonts[ $family ][ $k ] );
48	+ }
49	+ }
50	+ }
51	+ return $fonts;
52	+ }
53	+
54	/**
55	* Renders a list of all available fonts.
56	*

206	static public function add_fonts_for_module( $module ) {
207	$fields = FLBuilderModel::get_settings_form_fields( $module->form );
208
209	+ // needed for italics.
210	+ $google = FLBuilderFontFamilies::google();
211	+
212	foreach ( $fields as $name => $field ) {
213	if ( 'font' == $field['type'] && isset( $module->settings->$name ) ) {
214	self::add_font( $module->settings->$name );
215	+ } elseif ( 'typography' == $field['type'] && ! empty( $module->settings->$name ) && isset( $module->settings->{ $name }['font_family'] ) ) {
216	+ $fname = $module->settings->{ $name }['font_family'];
217	+ $weight = $module->settings->{ $name }['font_weight'];
218	+
219	+ // handle google italics.
220	+ if ( isset( $google[ $fname ] ) ) {
221	+ $selected_weight = $module->settings->{ $name }['font_weight'];
222	+ $italic = ( isset( $module->settings->{ $name }['font_style'] ) ) ? $module->settings->{ $name }['font_style'] : '';
223	+
224	+ if ( in_array( $selected_weight . 'i', $google[ $fname ] ) && 'italic' == $italic ) {
225	+ $weight = $selected_weight . 'i';
226	+ }
227	+ if ( ( '400' == $selected_weight \|\| 'regular' == $selected_weight ) && 'italic' == $italic && in_array( 'italic', $google[ $fname ] ) ) {
228	+ $weight = '400i';
229	+ }
230	+ }
231	+
232	+ self::add_font( array(
233	+ 'family' => $module->settings->{ $name }['font_family'],
234	+ 'weight' => $weight,
235	+ ) );
236	} elseif ( isset( $field['form'] ) ) {
237	$form = FLBuilderModel::$settings_forms[ $field['form'] ];
238	self::add_fonts_for_nested_module_form( $module, $form['tabs'], $name );

455	return $urls;
456	}
457
458	+ /**
459	+ * Find font fallback, used by FLBuilderCSS
460	+ * @since 2.2
461	+ */
462	+ static public function get_font_fallback( $font_family ) {
463	+ $fallback = 'sans-serif';
464	+ $default = apply_filters( 'fl_builder_font_families_default', FLBuilderFontFamilies::$default );
465	+ $system = apply_filters( 'fl_builder_font_families_system', FLBuilderFontFamilies::$system );
466	+ $google = apply_filters( 'fl_builder_font_families_google', FLBuilderFontFamilies::google() );
467	+ foreach ( $default as $font => $data ) {
468	+ if ( $font_family == $font && isset( $data['fallback'] ) ) {
469	+ $fallback = $data['fallback'];
470	+ }
471	+ }
472	+ foreach ( $system as $font => $data ) {
473	+ if ( $font_family == $font && isset( $data['fallback'] ) ) {
474	+ $fallback = $data['fallback'];
475	+ }
476	+ }
477	+ foreach ( $google as $font => $data ) {
478	+ if ( $font_family == $font ) {
479	+ $fallback = FLBuilderFontFamilies::get_google_fallback( $font );
480	+ }
481	+ }
482	+ return $fallback;
483	+ }
484	+
485	}
486
487	FLBuilderFonts::init();

499	*/
500	static private $_google_json = array();
501
502	+ /**
503	+ * Array with a list of default font weights.
504	+ * @var array
505	+ */
506	static public $default = array(
507	'Default' => array(
508	'default',
509	+ '100',
510	+ '200',
511	+ '300',
512	+ '400',
513	+ '500',
514	+ '600',
515	+ '700',
516	+ '800',
517	+ '900',
518	+ ),
519	+ );
520	+
521	+ /**
522	+ * Array with a list of system fonts.
523	+ * @var array
524	+ */
525	+ static public $system = array(
526	+ 'Helvetica' => array(
527	+ 'fallback' => 'Verdana, Arial, sans-serif',
528	+ 'weights' => array(
529	+ '300',
530	+ '400',
531	+ '700',
532	+ ),
533	+ ),
534	+ 'Verdana' => array(
535	+ 'fallback' => 'Helvetica, Arial, sans-serif',
536	+ 'weights' => array(
537	+ '300',
538	+ '400',
539	+ '700',
540	+ ),
541	+ ),
542	+ 'Arial' => array(
543	+ 'fallback' => 'Helvetica, Verdana, sans-serif',
544	+ 'weights' => array(
545	+ '300',
546	+ '400',
547	+ '700',
548	+ ),
549	+ ),
550	+ 'Times' => array(
551	+ 'fallback' => 'Georgia, serif',
552	+ 'weights' => array(
553	+ '300',
554	+ '400',
555	+ '700',
556	+ ),
557	+ ),
558	+ 'Georgia' => array(
559	+ 'fallback' => 'Times, serif',
560	+ 'weights' => array(
561	+ '300',
562	+ '400',
563	+ '700',
564	+ ),
565	+ ),
566	+ 'Courier' => array(
567	+ 'fallback' => 'monospace',
568	+ 'weights' => array(
569	+ '300',
570	+ '400',
571	+ '700',
572	+ ),
573	),
574	);
575

609	$json = self::$_google_json;
610	} else {
611	$json = (array) json_decode( file_get_contents( trailingslashit( FL_BUILDER_DIR ) . 'json/fonts.json' ), true );
612	+ self::$_google_json = $json;
613	}
614	/**
615	* Filter raw google json data

632	}
633	return false;
634	}
























































635	}

classes/class-fl-builder-loader.php CHANGED Viewed

	@@ -46,7 +46,7 @@ if ( ! class_exists( 'FLBuilderLoader' ) ) {
46	* @return void
47	*/
48	static private function define_constants() {
49	- define( 'FL_BUILDER_VERSION', '2.1.7.2' );
50	define( 'FL_BUILDER_FILE', trailingslashit( dirname( dirname( __FILE__ ) ) ) . 'fl-builder.php' );
51	define( 'FL_BUILDER_DIR', plugin_dir_path( FL_BUILDER_FILE ) );
52	define( 'FL_BUILDER_URL', plugins_url( '/', FL_BUILDER_FILE ) );
	@@ -76,8 +76,10 @@ if ( ! class_exists( 'FLBuilderLoader' ) ) {
76	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-admin-settings.php';
77	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-ajax.php';
78	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-ajax-layout.php';

79	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-auto-suggest.php';
80	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-color.php';

81	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-export.php';
82	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-extensions.php';
83	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-fonts.php';
	@@ -92,6 +94,7 @@ if ( ! class_exists( 'FLBuilderLoader' ) ) {
92	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-photo.php';
93	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-revisions.php';
94	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-services.php';

95	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-shortcodes.php';
96	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-timezones.php';
97	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-ui-content-panel.php';
	@@ -103,6 +106,7 @@ if ( ! class_exists( 'FLBuilderLoader' ) ) {
103	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-utils.php';
104	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-wpml.php';
105	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-privacy.php';

106
107	/* WP CLI Commands */
108	if ( defined( 'WP_CLI' ) ) {


46	* @return void
47	*/
48	static private function define_constants() {
49	+ define( 'FL_BUILDER_VERSION', '2.2.0.6' );
50	define( 'FL_BUILDER_FILE', trailingslashit( dirname( dirname( __FILE__ ) ) ) . 'fl-builder.php' );
51	define( 'FL_BUILDER_DIR', plugin_dir_path( FL_BUILDER_FILE ) );
52	define( 'FL_BUILDER_URL', plugins_url( '/', FL_BUILDER_FILE ) );

76	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-admin-settings.php';
77	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-ajax.php';
78	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-ajax-layout.php';
79	+ require_once FL_BUILDER_DIR . 'classes/class-fl-builder-art.php';
80	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-auto-suggest.php';
81	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-color.php';
82	+ require_once FL_BUILDER_DIR . 'classes/class-fl-builder-css.php';
83	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-export.php';
84	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-extensions.php';
85	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-fonts.php';

94	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-photo.php';
95	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-revisions.php';
96	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-services.php';
97	+ require_once FL_BUILDER_DIR . 'classes/class-fl-builder-settings-compat.php';
98	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-shortcodes.php';
99	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-timezones.php';
100	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-ui-content-panel.php';

106	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-utils.php';
107	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-wpml.php';
108	require_once FL_BUILDER_DIR . 'classes/class-fl-builder-privacy.php';
109	+ require_once FL_BUILDER_DIR . 'classes/class-fl-builder-settings-presets.php';
110
111	/* WP CLI Commands */
112	if ( defined( 'WP_CLI' ) ) {

classes/class-fl-builder-model.php CHANGED Viewed

	@@ -1375,21 +1375,46 @@ final class FLBuilderModel {
1375	$settings = $post_data['node_preview_processed_settings'];
1376	}
1377	} else {
1378	- $~~defaults~~ = self::~~get_node_defaults~~( $node );
1379	- $settings = (object) array_merge( (array) $defaults, (array) $node->settings );
1380	-
1381	- if ( 'module' == $node->type ) {
1382	- $settings = self::merge_nested_module_defaults( $node->settings->type, $settings );
1383	- } elseif ( 'column' == $node->type ) {
1384	- $settings = self::merge_nested_form_defaults( 'general', 'col', $settings );
1385	- } elseif ( 'row' == $node->type ) {
1386	- $settings = self::merge_nested_form_defaults( 'general', 'row', $settings );
1387	- }
1388	}
1389
1390	return ! $filter ? $settings : apply_filters( 'fl_builder_node_settings', $settings, $node );
1391	}
1392


































1393	/**
1394	* Returns node settings that have been processed with
1395	* specific logic based on the type of node.
	@@ -1652,9 +1677,10 @@ final class FLBuilderModel {
1652	* @since 1.0
1653	* @param string $cols The type of column layout to use.
1654	* @param int $position The position of the new row.

1655	* @return object The new row object.
1656	*/
1657	- static public function add_row( $cols = '1-col', $position = false ) {
1658	$data = self::get_layout_data();
1659	$settings = self::get_row_defaults();
1660	$row_node_id = self::generate_node_id();
	@@ -1676,7 +1702,14 @@ final class FLBuilderModel {
1676	}
1677
1678	// Add a column group.
1679	- self::add_col_group( $row_node_id, $cols, 0 );







1680
1681	// Return the updated row.
1682	return self::get_node( $row_node_id );
	@@ -1809,49 +1842,6 @@ final class FLBuilderModel {
1809	return $settings;
1810	}
1811
1812	- /**
1813	- * Returns an array of spacing placeholders for row
1814	- * margins and padding.
1815	- *
1816	- * @since 1.9
1817	- * @return array
1818	- */
1819	- static public function get_row_spacing_placeholders() {
1820	- $settings = FLBuilderModel::get_global_settings();
1821	- $placeholders = array();
1822	-
1823	- // Default.
1824	- $placeholders['row_margins'] = $settings->row_margins;
1825	- $placeholders['row_padding'] = $settings->row_padding;
1826	-
1827	- // Medium.
1828	- $placeholders['row_margins_medium'] = ( '' != $settings->row_margins_medium ) ? $settings->row_margins_medium : $settings->row_margins;
1829	- $placeholders['row_padding_medium'] = ( '' != $settings->row_padding_medium ) ? $settings->row_padding_medium : $settings->row_padding;
1830	-
1831	- // Responsive row margins.
1832	- if ( '' != $settings->row_margins_responsive ) {
1833	- $placeholders['row_margins_responsive'] = $settings->row_margins_responsive;
1834	- } elseif ( $settings->auto_spacing ) {
1835	- $placeholders['row_margins_responsive'] = 0;
1836	- } else {
1837	- $placeholders['row_margins_responsive'] = $placeholders['row_margins_medium'];
1838	- }
1839	-
1840	- // Responsive row padding.
1841	- if ( '' != $settings->row_padding_responsive ) {
1842	- $placeholders['row_padding_tb_responsive'] = $settings->row_padding_responsive;
1843	- $placeholders['row_padding_lr_responsive'] = $settings->row_padding_responsive;
1844	- } elseif ( $settings->auto_spacing ) {
1845	- $placeholders['row_padding_tb_responsive'] = $placeholders['row_padding_medium'];
1846	- $placeholders['row_padding_lr_responsive'] = 0;
1847	- } else {
1848	- $placeholders['row_padding_tb_responsive'] = $placeholders['row_padding_medium'];
1849	- $placeholders['row_padding_lr_responsive'] = $placeholders['row_padding_medium'];
1850	- }
1851	-
1852	- return $placeholders;
1853	- }
1854	-
1855	/**
1856	* Runs row specific logic on new row settings.
1857	*
	@@ -1998,9 +1988,10 @@ final class FLBuilderModel {
1998	* @param string $node_id A row node ID.
1999	* @param string $cols The type of column group layout or the ID of an existing column to add.
2000	* @param int $position The position of the new column group.

2001	* @return object The new column group object.
2002	*/
2003	- static public function add_col_group( $node_id = null, $cols = '1-col', $position = false ) {
2004	$data = self::get_layout_data();
2005	$group_node_id = self::generate_node_id();
2006	$parent = self::get_node( $node_id );
	@@ -2082,6 +2073,13 @@ final class FLBuilderModel {
2082	self::reorder_node( $group_node_id, $position );
2083	}
2084







2085	// Return the column group.
2086	return self::get_node( $group_node_id );
2087	}
	@@ -2404,9 +2402,10 @@ final class FLBuilderModel {
2404	* @param string $insert Either before or after.
2405	* @param string $type The type of column(s) to insert.
2406	* @param boolean $nested Whether these columns are nested or not.

2407	* @return object
2408	*/
2409	- static public function add_cols( $col_id, $insert = 'before', $type = '1-col', $nested = false ) {
2410	$data = self::get_layout_data();
2411	$col = self::get_node( $col_id );
2412	$parent = self::get_node( $col->parent );
	@@ -2488,6 +2487,11 @@ final class FLBuilderModel {
2488	// Update the layout data.
2489	self::update_layout_data( $data );
2490





2491	// Return the column group.
2492	return $parent;
2493	}
	@@ -2908,6 +2912,8 @@ final class FLBuilderModel {
2908	}
2909	}
2910


2911	return $groups;
2912	}
2913
	@@ -3674,6 +3680,9 @@ final class FLBuilderModel {
3674	foreach ( $tab['sections'] as $section ) {
3675	if ( isset( $section['fields'] ) ) {
3676	foreach ( $section['fields'] as $name => $field ) {



3677	$fields[ $name ] = $field;
3678	}
3679	}
	@@ -3714,12 +3723,24 @@ final class FLBuilderModel {
3714	// Get the fields.
3715	$fields = self::get_settings_form_fields( $tabs );
3716
3717	- // Handle ~~dimension~~ ~~fields.~~ We ~~have~~ to do it ~~this way for backwards compat~~
3718	- // with old margin, padding, and border fields as the settings expect margin_top
3719	- // or margin_bottom to exist instead of just the margin key.
3720	foreach ( $fields as $name => $field ) {









3721	if ( 'dimension' == $field['type'] ) {
3722	- ~~foreach~~ ( ~~array~~( '~~top~~', ~~'right', 'bottom', 'left'~~ ) ~~as $position~~ ) {





3723	$fields[ $name . '_' . $position ] = $field;
3724	}
3725	unset( $fields[ $name ] );
	@@ -3733,16 +3754,30 @@ final class FLBuilderModel {
3733	$is_multiple = isset( $field['multiple'] ) && true === $field['multiple'];
3734	$supports_multiple = 'editor' != $field['type'] && 'service' != $field['type'];
3735	$responsive = isset( $field['responsive'] ) && $field['responsive'] ? $field['responsive'] : false;
3736	- $responsive_name = '';
3737








3738	if ( $is_multiple && $supports_multiple ) {
3739	$defaults->$name = is_array( $default ) ? $default : array( $default );
3740	- } ~~elseif~~ ~~( $responsive )~~ {
3741
3742	foreach ( array( 'default', 'medium', 'responsive' ) as $device ) {
3743
3744	- ~~$responsive_name~~ ~~= $name .~~ ( ~~'default'~~ == $~~device~~ ? '' : ~~'_' .~~ $device );


3745





3746	if ( is_array( $responsive ) && isset( $responsive['default'] ) && isset( $responsive['default'][ $device ] ) ) {
3747	$defaults->{ $responsive_name } = $responsive['default'][ $device ];
3748	} elseif ( 'default' == $device ) {
	@@ -3750,9 +3785,31 @@ final class FLBuilderModel {
3750	} else {
3751	$defaults->{ $responsive_name } = '';
3752	}
























3753	}
3754	- } else {
3755	- $defaults->$name = $default;
3756	}
3757	}
3758
	@@ -4194,13 +4251,14 @@ final class FLBuilderModel {
4194	$post_id = ! $post_id ? self::get_post_id() : $post_id;
4195	$status = ! $status ? self::get_node_status() : $status;
4196
4197	- // Get ~~published~~ ~~data?~~
4198	if ( 'published' == $status \|\| 'revision' == get_post_type( $post_id ) ) {
4199	if ( isset( self::$published_layout_data[ $post_id ] ) ) {
4200	$data = self::$published_layout_data[ $post_id ];
4201	} else {
4202	$data = get_metadata( 'post', $post_id, '_fl_builder_data', true );
4203	$data = self::clean_layout_data( $data );

4204	self::$published_layout_data[ $post_id ] = apply_filters( 'fl_builder_get_layout_metadata', $data, $status, $post_id );
4205	}
4206	} elseif ( 'draft' == $status ) {
	@@ -4209,6 +4267,7 @@ final class FLBuilderModel {
4209	} else {
4210	$data = get_metadata( 'post', $post_id, '_fl_builder_draft', true );
4211	$data = self::clean_layout_data( $data );

4212	self::$draft_layout_data[ $post_id ] = apply_filters( 'fl_builder_get_layout_metadata', $data, $status, $post_id );
4213	}
4214	}
	@@ -5784,6 +5843,9 @@ final class FLBuilderModel {
5784	// Get new ids for the template nodes.
5785	$template->nodes = self::generate_new_node_ids( $template->nodes );
5786



5787	// Get the existing layout data and settings.
5788	$layout_data = self::get_layout_data();
5789	$layout_settings = self::get_layout_settings();
	@@ -5886,7 +5948,9 @@ final class FLBuilderModel {
5886	foreach ( $template_data as $key => $template ) {
5887
5888	// Add the main group to each template.
5889	- $template_data[ $key ]->group = ~~$args['group'];~~


5890
5891	// Reserialize the node data as it's expensive to store in memory.
5892	if ( isset( $template->nodes ) ) {
	@@ -5928,12 +5992,14 @@ final class FLBuilderModel {
5928	$type = apply_filters( 'fl_builder_template_selector_data_type', $type );
5929	$categorized = array();
5930	$templates = array();



5931	$core_categories = array(
5932	'general' => __( 'General', 'fl-builder' ),
5933	'landing' => __( 'Landing Pages', 'fl-builder' ),
5934	'company' => __( 'Content Pages', 'fl-builder' ),
5935	);
5936	- $groups = array();
5937
5938	// Build the the templates array.
5939	foreach ( self::get_templates( $type ) as $key => $template ) {
	@@ -6020,6 +6086,7 @@ final class FLBuilderModel {
6020	);
6021	}
6022	}

6023	$template['group'][] = $group_key;
6024	}
6025


1375	$settings = $post_data['node_preview_processed_settings'];
1376	}
1377	} else {
1378	+ $settings = self::get_node_settings_with_defaults_merged( $node->type, $node->settings );









1379	}
1380
1381	return ! $filter ? $settings : apply_filters( 'fl_builder_node_settings', $settings, $node );
1382	}
1383
1384	+ /**
1385	+ * Returns node settings that are merged with the defaults. In general,
1386	+ * you should use get_node_settings instead of this method unless you
1387	+ * don't want any of the other logic that it applies.
1388	+ *
1389	+ * @since 2.2
1390	+ * @param string $type A node type.
1391	+ * @param object $settings A node settings object.
1392	+ * @return object
1393	+ */
1394	+ static public function get_node_settings_with_defaults_merged( $type, $settings ) {
1395	+ $defaults = array();
1396	+
1397	+ if ( 'row' == $type ) {
1398	+ $defaults = FLBuilderModel::get_row_defaults();
1399	+ } elseif ( 'column' == $type ) {
1400	+ $defaults = FLBuilderModel::get_col_defaults();
1401	+ } elseif ( 'module' == $type ) {
1402	+ $defaults = FLBuilderModel::get_module_defaults( $settings->type );
1403	+ }
1404	+
1405	+ $settings = (object) array_merge( (array) $defaults, (array) $settings );
1406	+
1407	+ if ( 'row' == $type ) {
1408	+ $settings = FLBuilderModel::merge_nested_form_defaults( 'general', 'row', $settings );
1409	+ } elseif ( 'column' == $type ) {
1410	+ $settings = FLBuilderModel::merge_nested_form_defaults( 'general', 'col', $settings );
1411	+ } elseif ( 'module' == $type ) {
1412	+ $settings = FLBuilderModel::merge_nested_module_defaults( $settings->type, $settings );
1413	+ }
1414	+
1415	+ return $settings;
1416	+ }
1417	+
1418	/**
1419	* Returns node settings that have been processed with
1420	* specific logic based on the type of node.

1677	* @since 1.0
1678	* @param string $cols The type of column layout to use.
1679	* @param int $position The position of the new row.
1680	+ * @param string $module Optional. The node ID of an existing module to move to this row.
1681	* @return object The new row object.
1682	*/
1683	+ static public function add_row( $cols = '1-col', $position = false, $module = null ) {
1684	$data = self::get_layout_data();
1685	$settings = self::get_row_defaults();
1686	$row_node_id = self::generate_node_id();

1702	}
1703
1704	// Add a column group.
1705	+ $group = self::add_col_group( $row_node_id, $cols, 0 );
1706	+
1707	+ // Move an existing module to the row.
1708	+ if ( $module ) {
1709	+ $cols = self::get_nodes( 'column', $group->node );
1710	+ $col = array_shift( $cols );
1711	+ self::move_node( $module, $col->node, 0 );
1712	+ }
1713
1714	// Return the updated row.
1715	return self::get_node( $row_node_id );

1842	return $settings;
1843	}
1844











































1845	/**
1846	* Runs row specific logic on new row settings.
1847	*

1988	* @param string $node_id A row node ID.
1989	* @param string $cols The type of column group layout or the ID of an existing column to add.
1990	* @param int $position The position of the new column group.
1991	+ * @param string $module Optional. The node ID of an existing module to move to this group.
1992	* @return object The new column group object.
1993	*/
1994	+ static public function add_col_group( $node_id = null, $cols = '1-col', $position = false, $module = null ) {
1995	$data = self::get_layout_data();
1996	$group_node_id = self::generate_node_id();
1997	$parent = self::get_node( $node_id );

2073	self::reorder_node( $group_node_id, $position );
2074	}
2075
2076	+ // Move an existing module to the group.
2077	+ if ( $module ) {
2078	+ $cols = self::get_nodes( 'column', $group_node_id );
2079	+ $col = array_shift( $cols );
2080	+ self::move_node( $module, $col->node, 0 );
2081	+ }
2082	+
2083	// Return the column group.
2084	return self::get_node( $group_node_id );
2085	}

2402	* @param string $insert Either before or after.
2403	* @param string $type The type of column(s) to insert.
2404	* @param boolean $nested Whether these columns are nested or not.
2405	+ * @param string $module Optional. The node ID of an existing module to move to this group.
2406	* @return object
2407	*/
2408	+ static public function add_cols( $col_id, $insert = 'before', $type = '1-col', $nested = false, $module = null ) {
2409	$data = self::get_layout_data();
2410	$col = self::get_node( $col_id );
2411	$parent = self::get_node( $col->parent );

2487	// Update the layout data.
2488	self::update_layout_data( $data );
2489
2490	+ // Move an existing module to the group.
2491	+ if ( $module ) {
2492	+ self::move_node( $module, $new_col_id, 0 );
2493	+ }
2494	+
2495	// Return the column group.
2496	return $parent;
2497	}

2912	}
2913	}
2914
2915	+ ksort( $groups );
2916	+
2917	return $groups;
2918	}
2919

3680	foreach ( $tab['sections'] as $section ) {
3681	if ( isset( $section['fields'] ) ) {
3682	foreach ( $section['fields'] as $name => $field ) {
3683	+ if ( ! isset( $field['type'] ) ) {
3684	+ continue;
3685	+ }
3686	$fields[ $name ] = $field;
3687	}
3688	}

3723	// Get the fields.
3724	$fields = self::get_settings_form_fields( $tabs );
3725
3726	+ // Handle a few special cases before getting the defaults.


3727	foreach ( $fields as $name => $field ) {
3728	+
3729	+ // Add the root name if needed later for synthetic fields like
3730	+ // the dimension fields being synthesized below.
3731	+ $fields[ $name ]['root_name'] = $name;
3732	+ $field['root_name'] = $name;
3733	+
3734	+ // Handle dimension fields. We have to do it this way for backwards compat
3735	+ // with old margin, padding, and border fields as the settings expect margin_top
3736	+ // or margin_bottom to exist instead of just the margin key.
3737	if ( 'dimension' == $field['type'] ) {
3738	+ if ( isset( $field['keys'] ) ) {
3739	+ $keys = array_keys( $field['keys'] );
3740	+ } else {
3741	+ $keys = array( 'top', 'right', 'bottom', 'left' );
3742	+ }
3743	+ foreach ( $keys as $position ) {
3744	$fields[ $name . '_' . $position ] = $field;
3745	}
3746	unset( $fields[ $name ] );

3754	$is_multiple = isset( $field['multiple'] ) && true === $field['multiple'];
3755	$supports_multiple = 'editor' != $field['type'] && 'service' != $field['type'];
3756	$responsive = isset( $field['responsive'] ) && $field['responsive'] ? $field['responsive'] : false;

3757
3758	+ // Get the default unit if this field has more than one unit.
3759	+ if ( isset( $field['units'] ) && count( $field['units'] ) > 1 ) {
3760	+ $default_unit = isset( $field['default_unit'] ) ? $field['default_unit'] : $field['units'][0];
3761	+ } else {
3762	+ $default_unit = null;
3763	+ }
3764	+
3765	+ // Set the default.
3766	if ( $is_multiple && $supports_multiple ) {
3767	$defaults->$name = is_array( $default ) ? $default : array( $default );
3768	+ } else {
3769
3770	foreach ( array( 'default', 'medium', 'responsive' ) as $device ) {
3771
3772	+ if ( ! $responsive && 'default' !== $device ) {
3773	+ continue;
3774	+ }
3775
3776	+ $response_suffix = ( 'default' == $device ? '' : '_' . $device );
3777	+ $responsive_name = $name . $response_suffix;
3778	+ $unit_name = $field['root_name'] . $response_suffix . '_unit';
3779	+
3780	+ // Add the default value.
3781	if ( is_array( $responsive ) && isset( $responsive['default'] ) && isset( $responsive['default'][ $device ] ) ) {
3782	$defaults->{ $responsive_name } = $responsive['default'][ $device ];
3783	} elseif ( 'default' == $device ) {

3785	} else {
3786	$defaults->{ $responsive_name } = '';
3787	}
3788	+
3789	+ // Add the unit default value.
3790	+ if ( null !== $default_unit ) {
3791	+ if ( is_array( $responsive ) && isset( $responsive['default_unit'] ) && isset( $responsive['default_unit'][ $device ] ) ) {
3792	+ $defaults->{ $unit_name } = $responsive['default_unit'][ $device ];
3793	+ } else {
3794	+ $defaults->{ $unit_name } = $default_unit;
3795	+ }
3796	+ }
3797	+
3798	+ // Add the photo source default value.
3799	+ if ( 'photo' === $field['type'] ) {
3800	+ $defaults->{ $name . $response_suffix . '_src' } = '';
3801	+ }
3802	+
3803	+ // Add the link target and nofollow default values.
3804	+ if ( 'link' === $field['type'] ) {
3805	+ if ( isset( $field['show_target'] ) && $field['show_target'] ) {
3806	+ $defaults->{ $name . '_target' } = '_self';
3807	+ }
3808	+ if ( isset( $field['show_nofollow'] ) && $field['show_nofollow'] ) {
3809	+ $defaults->{ $name . '_nofollow' } = 'no';
3810	+ }
3811	+ }
3812	}


3813	}
3814	}
3815

4251	$post_id = ! $post_id ? self::get_post_id() : $post_id;
4252	$status = ! $status ? self::get_node_status() : $status;
4253
4254	+ // Get layout metadata.
4255	if ( 'published' == $status \|\| 'revision' == get_post_type( $post_id ) ) {
4256	if ( isset( self::$published_layout_data[ $post_id ] ) ) {
4257	$data = self::$published_layout_data[ $post_id ];
4258	} else {
4259	$data = get_metadata( 'post', $post_id, '_fl_builder_data', true );
4260	$data = self::clean_layout_data( $data );
4261	+ $data = FLBuilderSettingsCompat::filter_layout_data( $data );
4262	self::$published_layout_data[ $post_id ] = apply_filters( 'fl_builder_get_layout_metadata', $data, $status, $post_id );
4263	}
4264	} elseif ( 'draft' == $status ) {

4267	} else {
4268	$data = get_metadata( 'post', $post_id, '_fl_builder_draft', true );
4269	$data = self::clean_layout_data( $data );
4270	+ $data = FLBuilderSettingsCompat::filter_layout_data( $data );
4271	self::$draft_layout_data[ $post_id ] = apply_filters( 'fl_builder_get_layout_metadata', $data, $status, $post_id );
4272	}
4273	}

5843	// Get new ids for the template nodes.
5844	$template->nodes = self::generate_new_node_ids( $template->nodes );
5845
5846	+ // Filter the nodes for backwards compatibility with old settings.
5847	+ $template->nodes = FLBuilderSettingsCompat::filter_layout_data( $template->nodes );
5848	+
5849	// Get the existing layout data and settings.
5850	$layout_data = self::get_layout_data();
5851	$layout_settings = self::get_layout_settings();

5948	foreach ( $template_data as $key => $template ) {
5949
5950	// Add the main group to each template.
5951	+ if ( ! isset( $template_data[ $key ]->group ) ) {
5952	+ $template_data[ $key ]->group = $args['group'];
5953	+ }
5954
5955	// Reserialize the node data as it's expensive to store in memory.
5956	if ( isset( $template->nodes ) ) {

5992	$type = apply_filters( 'fl_builder_template_selector_data_type', $type );
5993	$categorized = array();
5994	$templates = array();
5995	+ $groups = array();
5996	+
5997	+ // This is needed for backwards compat with the old core templates category.
5998	$core_categories = array(
5999	'general' => __( 'General', 'fl-builder' ),
6000	'landing' => __( 'Landing Pages', 'fl-builder' ),
6001	'company' => __( 'Content Pages', 'fl-builder' ),
6002	);

6003
6004	// Build the the templates array.
6005	foreach ( self::get_templates( $type ) as $key => $template ) {

6086	);
6087	}
6088	}
6089	+ ksort( $groups[ $group_key ]['categories'] );
6090	$template['group'][] = $group_key;
6091	}
6092

classes/class-fl-builder-module.php CHANGED Viewed

	@@ -274,16 +274,29 @@ class FLBuilderModule {
274
275	/**
276	* Should be overridden by subclasses to
277	- * work with settings data ~~before~~ it is ~~saved~~.
278	*
279	* @since 1.0
280	- * @param object A settings object that is going to be saved.
281	* @return object
282	*/
283	public function update( $settings ) {
284	return $settings;
285	}
286













287	/**
288	* Should be overridden by subclasses to work with a module before
289	* it is deleted. Please note, this method is called when a module


274
275	/**
276	* Should be overridden by subclasses to
277	+ * work with settings data _before it is saved_.
278	*
279	* @since 1.0
280	+ * @param object $settings A settings object that is going to be saved.
281	* @return object
282	*/
283	public function update( $settings ) {
284	return $settings;
285	}
286
287	+ /**
288	+ * Should be overridden by subclasses to
289	+ * work with settings data _before it is used to display a module_.
290	+ *
291	+ * @since 2.0.3
292	+ * @param object $settings A settings object.
293	+ * @param object $helper A settings compatibility helper.
294	+ * @return object
295	+ */
296	+ public function filter_settings( $settings, $helper ) {
297	+ return $settings;
298	+ }
299	+
300	/**
301	* Should be overridden by subclasses to work with a module before
302	* it is deleted. Please note, this method is called when a module

classes/class-fl-builder-settings-compat-column.php ADDED Viewed

	@@ -0,0 +1,46 @@


1	+ <?php
2	+
3	+ /**
4	+ * Settings compatibility helper for column nodes.
5	+ *
6	+ * @since 2.2
7	+ */
8	+ class FLBuilderSettingsCompatColumn extends FLBuilderSettingsCompatHelper {
9	+
10	+ /**
11	+ * Filter settings for columns.
12	+ *
13	+ * @since 2.2
14	+ * @param object $settings
15	+ * @return object
16	+ */
17	+ public function filter_settings( $settings ) {
18	+ $this->handle_opacity_inputs( $settings, 'bg_opacity', 'bg_color' );
19	+ $this->handle_opacity_inputs( $settings, 'bg_overlay_opacity', 'bg_overlay_color' );
20	+ $this->handle_opacity_inputs( $settings, 'border_opacity', 'border_color' );
21	+ $this->handle_border_inputs( $settings );
22	+ $this->handle_responsive_widths( $settings );
23	+ return $settings;
24	+ }
25	+
26	+ /**
27	+ * Updates old responsive width settings to the new
28	+ * responsive width settings with live preview.
29	+ *
30	+ * @since 2.2
31	+ * @param object $settings
32	+ * @return object
33	+ */
34	+ public function handle_responsive_widths( &$settings ) {
35	+ if ( isset( $settings->medium_size ) && 'custom' === $settings->medium_size ) {
36	+ $settings->size_medium = $settings->custom_medium_size;
37	+ unset( $settings->medium_size );
38	+ unset( $settings->custom_medium_size );
39	+ }
40	+ if ( isset( $settings->responsive_size ) && 'custom' === $settings->responsive_size ) {
41	+ $settings->size_responsive = $settings->custom_responsive_size;
42	+ unset( $settings->responsive_size );
43	+ unset( $settings->custom_responsive_size );
44	+ }
45	+ }
46	+ }

classes/class-fl-builder-settings-compat-generic.php ADDED Viewed

	@@ -0,0 +1,20 @@


1	+ <?php
2	+
3	+ /**
4	+ * Generic settings compatibility helper for all node types.
5	+ *
6	+ * @since 2.2
7	+ */
8	+ class FLBuilderSettingsCompatGeneric extends FLBuilderSettingsCompatHelper {
9	+
10	+ /**
11	+ * Filter settings for all node types.
12	+ *
13	+ * @since 2.2
14	+ * @param object $settings
15	+ * @return object
16	+ */
17	+ public function filter_settings( $settings ) {
18	+ return $settings;
19	+ }
20	+ }

classes/class-fl-builder-settings-compat-helper.php ADDED Viewed

	@@ -0,0 +1,164 @@


1	+ <?php
2	+
3	+ /**
4	+ * Base class that settings compatibility helpers
5	+ * should extend.
6	+ *
7	+ * @since 2.2
8	+ */
9	+ class FLBuilderSettingsCompatHelper {
10	+
11	+ /**
12	+ * Filter a node's settings object.
13	+ *
14	+ * @since 2.2
15	+ * @param object $settings
16	+ * @return object
17	+ */
18	+ public function filter_settings( $settings ) {
19	+ return $settings;
20	+ }
21	+
22	+ /**
23	+ * Filters the settings for a module that is rendered within another
24	+ * module. An example of this would be the button module within the
25	+ * callout module. This is done so the filtering logic for the button
26	+ * module doesn't need to be duplicated in the callout module.
27	+ *
28	+ * @since 2.2
29	+ * @param object $slug The child module's slug.
30	+ * @param object $settings The parent module's settings object.
31	+ * @param array $key_map An array matching the parent setting keys to the child setting keys.
32	+ * @return void
33	+ */
34	+ public function filter_child_module_settings( $slug, &$settings, $key_map ) {
35	+
36	+ // Get a generic instance of the child module.
37	+ if ( isset( FLBuilderModel::$modules[ $slug ] ) ) {
38	+ $module = FLBuilderModel::$modules[ $slug ];
39	+ } else {
40	+ return;
41	+ }
42	+
43	+ // Make sure the child module has a settings filter method.
44	+ if ( ! method_exists( $module, 'filter_settings' ) ) {
45	+ return;
46	+ }
47	+
48	+ // Build the child settings object from the parent settings and key map.
49	+ $child_settings = new stdClass;
50	+
51	+ foreach ( $key_map as $parent_key => $child_key ) {
52	+ if ( isset( $settings->{ $parent_key } ) ) {
53	+ $child_settings->{ $child_key } = $settings->{ $parent_key };
54	+ unset( $settings->{ $parent_key } );
55	+ }
56	+ }
57	+
58	+ // Filter the child settings.
59	+ $child_settings = $module->filter_settings( $child_settings, $this );
60	+
61	+ // Add the child settings back to the parent settings using the key map.
62	+ foreach ( $key_map as $parent_key => $child_key ) {
63	+ if ( isset( $child_settings->{ $child_key } ) ) {
64	+ $settings->{ $parent_key } = $child_settings->{ $child_key };
65	+ }
66	+ }
67	+ }
68	+
69	+ /**
70	+ * Handle old animation inputs that were removed in favor of
71	+ * a single animation field.
72	+ *
73	+ * @since 2.2
74	+ * @param object $settings
75	+ * @return void
76	+ */
77	+ public function handle_animation_inputs( &$settings ) {
78	+
79	+ if ( ! isset( $settings->animation ) \|\| is_array( $settings->animation ) \|\| ! isset( $settings->animation_delay ) ) {
80	+ return;
81	+ }
82	+
83	+ $keys = array(
84	+ 'slide-left' => 'fade-right',
85	+ 'slide-right' => 'fade-left',
86	+ 'slide-up' => 'fade-up',
87	+ 'slide-down' => 'fade-down',
88	+ );
89	+
90	+ if ( isset( $keys[ $settings->animation ] ) ) {
91	+ $settings->animation = $keys[ $settings->animation ];
92	+ }
93	+
94	+ $settings->animation = array(
95	+ 'style' => $settings->animation,
96	+ 'delay' => $settings->animation_delay,
97	+ );
98	+
99	+ unset( $settings->animation_delay );
100	+ }
101	+
102	+ /**
103	+ * Handle old opacity inputs that were removed in favor of
104	+ * the alpha slider in the color picker.
105	+ *
106	+ * @since 2.2
107	+ * @param object $settings
108	+ * @return void
109	+ */
110	+ public function handle_opacity_inputs( &$settings, $opacity_key, $color_key ) {
111	+
112	+ if ( ! isset( $settings->$opacity_key ) \|\| ! is_numeric( $settings->$opacity_key ) \|\| empty( $settings->$color_key ) ) {
113	+ return;
114	+ }
115	+
116	+ if ( (int) $settings->$opacity_key < 100 && ! stristr( $settings->$color_key, 'rgb' ) ) {
117	+ $settings->$color_key = 'rgba(' . implode( ',', FLBuilderColor::hex_to_rgb( $settings->$color_key ) ) . ',' . $settings->$opacity_key / 100 . ')';
118	+ }
119	+
120	+ unset( $settings->$opacity_key );
121	+ }
122	+
123	+ /**
124	+ * Handle old border inputs that were removed in favor of
125	+ * the new border setting.
126	+ *
127	+ * @since 2.2
128	+ * @param object $settings
129	+ * @return void
130	+ */
131	+ public function handle_border_inputs( &$settings ) {
132	+
133	+ if ( isset( $settings->border ) && is_array( $settings->border ) ) {
134	+ return;
135	+ }
136	+ if ( ! isset( $settings->border_type ) ) {
137	+ return;
138	+ }
139	+
140	+ foreach ( array( '', '_medium', '_responsive' ) as $breakpoint ) {
141	+
142	+ if ( isset( $settings->{ "border_top$breakpoint" } ) ) {
143	+
144	+ $settings->{ "border$breakpoint" } = array(
145	+ 'style' => isset( $settings->{ "border_type$breakpoint" } ) ? $settings->{ "border_type$breakpoint" } : '',
146	+ 'color' => isset( $settings->{ "border_color$breakpoint" } ) ? $settings->{ "border_color$breakpoint" } : '',
147	+ 'width' => array(
148	+ 'top' => $settings->{ "border_top$breakpoint" },
149	+ 'right' => $settings->{ "border_right$breakpoint" },
150	+ 'bottom' => $settings->{ "border_bottom$breakpoint" },
151	+ 'left' => $settings->{ "border_left$breakpoint" },
152	+ ),
153	+ );
154	+
155	+ unset( $settings->{ "border_type$breakpoint" } );
156	+ unset( $settings->{ "border_color$breakpoint" } );
157	+ unset( $settings->{ "border_top$breakpoint" } );
158	+ unset( $settings->{ "border_right$breakpoint" } );
159	+ unset( $settings->{ "border_bottom$breakpoint" } );
160	+ unset( $settings->{ "border_left$breakpoint" } );
161	+ }
162	+ }
163	+ }
164	+ }

classes/class-fl-builder-settings-compat-module.php ADDED Viewed

	@@ -0,0 +1,21 @@


1	+ <?php
2	+
3	+ /**
4	+ * Settings compatibility helper for all module nodes.
5	+ *
6	+ * @since 2.2
7	+ */
8	+ class FLBuilderSettingsCompatModule extends FLBuilderSettingsCompatHelper {
9	+
10	+ /**
11	+ * Filter settings for modules.
12	+ *
13	+ * @since 2.2
14	+ * @param object $settings
15	+ * @return object
16	+ */
17	+ public function filter_settings( $settings ) {
18	+ $this->handle_animation_inputs( $settings );
19	+ return $settings;
20	+ }
21	+ }

classes/class-fl-builder-settings-compat-row.php ADDED Viewed

	@@ -0,0 +1,24 @@


1	+ <?php
2	+
3	+ /**
4	+ * Settings compatibility helper for row nodes.
5	+ *
6	+ * @since 2.2
7	+ */
8	+ class FLBuilderSettingsCompatRow extends FLBuilderSettingsCompatHelper {
9	+
10	+ /**
11	+ * Filter settings for rows.
12	+ *
13	+ * @since 2.2
14	+ * @param object $settings
15	+ * @return object
16	+ */
17	+ public function filter_settings( $settings ) {
18	+ $this->handle_opacity_inputs( $settings, 'bg_opacity', 'bg_color' );
19	+ $this->handle_opacity_inputs( $settings, 'bg_overlay_opacity', 'bg_overlay_color' );
20	+ $this->handle_opacity_inputs( $settings, 'border_opacity', 'border_color' );
21	+ $this->handle_border_inputs( $settings );
22	+ return $settings;
23	+ }
24	+ }

classes/class-fl-builder-settings-compat.php ADDED Viewed

	@@ -0,0 +1,101 @@


1	+ <?php
2	+
3	+ /**
4	+ * Manages settings compatibility helpers. Those allow us to make
5	+ * changes to node settings without breaking compatibility with
6	+ * existing nodes that have already been saved to the database.
7	+ *
8	+ * @since 2.2
9	+ */
10	+ final class FLBuilderSettingsCompat {
11	+
12	+ /**
13	+ * An array of registered compatibility helpers.
14	+ *
15	+ * @since 2.2
16	+ * @var array $helpers
17	+ */
18	+ static private $helpers = array();
19	+
20	+ /**
21	+ * Initialize.
22	+ *
23	+ * @since 2.2
24	+ * @return void
25	+ */
26	+ static public function init() {
27	+ require_once FL_BUILDER_DIR . 'classes/class-fl-builder-settings-compat-helper.php';
28	+ require_once FL_BUILDER_DIR . 'classes/class-fl-builder-settings-compat-generic.php';
29	+ require_once FL_BUILDER_DIR . 'classes/class-fl-builder-settings-compat-row.php';
30	+ require_once FL_BUILDER_DIR . 'classes/class-fl-builder-settings-compat-column.php';
31	+ require_once FL_BUILDER_DIR . 'classes/class-fl-builder-settings-compat-module.php';
32	+
33	+ self::register_helper( 'generic', 'FLBuilderSettingsCompatGeneric' );
34	+ self::register_helper( 'row', 'FLBuilderSettingsCompatRow' );
35	+ self::register_helper( 'column', 'FLBuilderSettingsCompatColumn' );
36	+ self::register_helper( 'module', 'FLBuilderSettingsCompatModule' );
37	+ }
38	+
39	+ /**
40	+ * Registers a compatibility helper for a node.
41	+ *
42	+ * @since 2.2
43	+ * @param string $type
44	+ * @param string $class
45	+ * @return void
46	+ */
47	+ static public function register_helper( $type, $class ) {
48	+ self::$helpers[ $type ] = new $class;
49	+ }
50	+
51	+ /**
52	+ * Loops through layout data and ensures node settings
53	+ * are backwards compatible.
54	+ *
55	+ * @since 2.2
56	+ * @param object data
57	+ * @return object
58	+ */
59	+ static public function filter_layout_data( $data ) {
60	+ foreach ( $data as $node_id => $node ) {
61	+ if ( isset( $node->settings ) && is_object( $node->settings ) ) {
62	+ $data[ $node_id ]->settings = self::filter_node_settings( $node->type, $node->settings );
63	+ }
64	+ }
65	+ return $data;
66	+ }
67	+
68	+ /**
69	+ * Ensures settings are backwards compatible for a single node.
70	+ *
71	+ * @since 2.2
72	+ * @param string $type
73	+ * @param object $settings
74	+ * @return object
75	+ */
76	+ static public function filter_node_settings( $type, $settings ) {
77	+
78	+ // Make sure the defaults are merged.
79	+ $settings = FLBuilderModel::get_node_settings_with_defaults_merged( $type, $settings );
80	+
81	+ // Filter with the generic helper for all node types.
82	+ $settings = self::$helpers['generic']->filter_settings( $settings );
83	+
84	+ // Filter with a node specific helper if one is available.
85	+ $helper = isset( self::$helpers[ $type ] ) ? self::$helpers[ $type ] : null;
86	+
87	+ if ( $helper ) {
88	+ $settings = $helper->filter_settings( $settings );
89	+ }
90	+
91	+ // Filter with a module specific helper if one is available.
92	+ if ( 'module' === $type && isset( FLBuilderModel::$modules[ $settings->type ] ) ) {
93	+ $module = FLBuilderModel::$modules[ $settings->type ];
94	+ $settings = $module->filter_settings( $settings, self::$helpers['module'] );
95	+ }
96	+
97	+ return $settings;
98	+ }
99	+ }
100	+
101	+ FLBuilderSettingsCompat::init();

classes/class-fl-builder-settings-presets.php ADDED Viewed

	@@ -0,0 +1,104 @@


1	+ <?php
2	+ class FLBuilderSettingsPresets {
3	+
4	+ static private $presets = array();
5	+
6	+ static public function init() {
7	+
8	+ add_filter( 'fl_builder_shared_option_sets', 'FLBuilderSettingsPresets::filter_shared_option_sets' );
9	+ add_filter( 'fl_builder_register_settings_form', 'FLBuilderSettingsPresets::filter_settings_form' );
10	+
11	+ do_action( 'fl_register_presets' );
12	+ }
13	+
14	+ /**
15	+ * Register a new preset for a given type string
16	+ *
17	+ * @param String $type - A string identifier of what kind of preset this will be.
18	+ * @param Array $args - The meta and settings for the preset.
19	+ * @return void
20	+ */
21	+ static public function register( $type = '', $args = array() ) {
22	+ $defaults = array(
23	+ 'name' => '',
24	+ 'label' => __( 'Untitled Preset', 'fl-builder' ),
25	+ 'type' => $type,
26	+ 'settings' => array(), /* the settings to set when preset is selected */
27	+ 'data' => array(), /* arbitrary data to pass along to the frontend */
28	+ );
29	+ $args = wp_parse_args( $args, $defaults );
30	+ $name = $args['name'];
31	+ self::$presets[ $type ][ $name ] = $args;
32	+ }
33	+
34	+ /**
35	+ * Getter method for self::$presets;
36	+ *
37	+ * @return Array
38	+ */
39	+ static public function get_presets() {
40	+ return self::$presets;
41	+ }
42	+
43	+ /**
44	+ * Create option sets for a specified preview $type
45	+ *
46	+ * @param String $type
47	+ * @return Array
48	+ */
49	+ static public function get_preset_options( $type ) {
50	+ $options = array(
51	+ '' => __( 'Select A Preset', 'fl-builder' ),
52	+ );
53	+ if ( $type ) {
54	+ $presets = self::$presets[ $type ];
55	+ foreach ( $presets as $preset ) {
56	+ $handle = $preset['name'];
57	+ $label = $preset['label'];
58	+ $options[ $handle ] = $label;
59	+ }
60	+ }
61	+ return $options;
62	+ }
63	+
64	+ /**
65	+ * Create option sets for each preset type and add to FLBuilderConfig.optionSets
66	+ *
67	+ * @param Array $option_sets - previously set option sets
68	+ * @return Array
69	+ */
70	+ static public function filter_shared_option_sets( $option_sets ) {
71	+ foreach ( self::$presets as $type => $set ) {
72	+ $option_sets[ $type . '-presets' ] = self::get_preset_options( $type );
73	+ }
74	+
75	+ return $option_sets;
76	+ }
77	+
78	+ /**
79	+ * Filter settings forms and set the refresh type for preset fields to 'none'
80	+ *
81	+ * @param Array $form
82	+ * @return Array
83	+ */
84	+ static public function filter_settings_form( $form ) {
85	+
86	+ if ( isset( $form['tabs'] ) ) {
87	+ foreach ( $form['tabs'] as $i => $tab ) {
88	+
89	+ foreach ( $tab['sections'] as $j => $section ) {
90	+ foreach ( $section['fields'] as $k => $field ) {
91	+
92	+ if ( 'preset' === $field['type'] ) {
93	+ $form['tabs'][ $i ]['sections'][ $j ]['fields'][ $k ]['preview'] = array(
94	+ 'type' => 'none',
95	+ );
96	+ }
97	+ }
98	+ }
99	+ }
100	+ }
101	+ return $form;
102	+ }
103	+ }
104	+ FLBuilderSettingsPresets::init();

classes/class-fl-builder-ui-content-panel.php CHANGED Viewed

	@@ -159,6 +159,7 @@ class FLBuilderUIContentPanel {
159	$data['views'][] = array(
160	'handle' => $slug,
161	'name' => $group['name'],

162	'query' => array(
163	'kind' => 'template',
164	'type' => 'core',
	@@ -177,6 +178,7 @@ class FLBuilderUIContentPanel {
177	'handle' => $cat_slug,
178	'name' => $category['name'],
179	'isSubItem' => true,

180	'query' => array(
181	'kind' => 'template',
182	'type' => 'core',
	@@ -230,6 +232,7 @@ class FLBuilderUIContentPanel {
230	$data['views'][] = array(
231	'handle' => $slug,
232	'name' => $group['name'],

233	'query' => array(
234	'kind' => 'template',
235	'type' => 'core',
	@@ -248,6 +251,7 @@ class FLBuilderUIContentPanel {
248	'handle' => $cat_slug,
249	'name' => $category['name'],
250	'isSubItem' => true,

251	'query' => array(
252	'kind' => 'template',
253	'type' => 'core',


159	$data['views'][] = array(
160	'handle' => $slug,
161	'name' => $group['name'],
162	+ 'hasChildren' => count( $group['categories'] ) > 1,
163	'query' => array(
164	'kind' => 'template',
165	'type' => 'core',

178	'handle' => $cat_slug,
179	'name' => $category['name'],
180	'isSubItem' => true,
181	+ 'parent' => $slug,
182	'query' => array(
183	'kind' => 'template',
184	'type' => 'core',

232	$data['views'][] = array(
233	'handle' => $slug,
234	'name' => $group['name'],
235	+ 'hasChildren' => count( $group['categories'] ) > 1,
236	'query' => array(
237	'kind' => 'template',
238	'type' => 'core',

251	'handle' => $cat_slug,
252	'name' => $category['name'],
253	'isSubItem' => true,
254	+ 'parent' => $slug,
255	'query' => array(
256	'kind' => 'template',
257	'type' => 'core',

classes/class-fl-builder-ui-settings-forms.php CHANGED Viewed

	@@ -263,6 +263,11 @@ class FLBuilderUISettingsForms {
263	*/
264	$field = apply_filters( 'fl_builder_field_js_config', $field, $field_key, $form_key );
265





266	// Convert class to className for JS compat.
267	if ( isset( $field['class'] ) ) {
268	$field['className'] = $field['class'];
	@@ -348,6 +353,10 @@ class FLBuilderUISettingsForms {
348	continue;
349	}
350




351	if ( ! isset( $editables[ $module->slug ] ) ) {
352	$editables[ $module->slug ] = array();
353	}
	@@ -357,6 +366,7 @@ class FLBuilderUISettingsForms {
357	'field' => array(
358	'name' => $key,
359	'type' => $field['type'],

360	),
361	);
362	}
	@@ -477,6 +487,7 @@ class FLBuilderUISettingsForms {
477	return false;
478	}
479

480	$filename = wp_basename( $url );
481	$base_url = str_replace( $filename, '', $url );
482	$meta = wp_get_attachment_metadata( $id );
	@@ -515,6 +526,7 @@ class FLBuilderUISettingsForms {
515	'id' => $id,
516	'url' => $url,
517	'filename' => $filename,

518	'sizes' => apply_filters( 'fl_builder_photo_sizes_select', $sizes ),
519	);
520	}
	@@ -654,6 +666,9 @@ class FLBuilderUISettingsForms {
654	// Render legacy custom fields.
655	if ( isset( $data['fields'] ) ) {
656	foreach ( $data['fields'] as $name ) {



657	ob_start();
658	self::render_settings_field( $name, (array) $fields[ $name ], $settings );
659	$response['fields'][ $name ] = ob_get_clean();
	@@ -836,6 +851,11 @@ class FLBuilderUISettingsForms {
836	* @since 2.0
837	*/
838	$field = apply_filters( 'fl_builder_render_settings_field', $field, $name, $settings ); // Allow field settings filtering first





839	$i = null;
840	$is_multiple = isset( $field['multiple'] ) && true === (bool) $field['multiple'];
841	$supports_multiple = 'editor' != $field['type'] && 'service' != $field['type'];


263	*/
264	$field = apply_filters( 'fl_builder_field_js_config', $field, $field_key, $form_key );
265
266	+ // Bail if the field has no type.
267	+ if ( ! isset( $field['type'] ) ) {
268	+ return;
269	+ }
270	+
271	// Convert class to className for JS compat.
272	if ( isset( $field['class'] ) ) {
273	$field['className'] = $field['class'];

353	continue;
354	}
355
356	+ if ( isset( $field['inline_editor'] ) && ! $field['inline_editor'] ) {
357	+ continue;
358	+ }
359	+
360	if ( ! isset( $editables[ $module->slug ] ) ) {
361	$editables[ $module->slug ] = array();
362	}

366	'field' => array(
367	'name' => $key,
368	'type' => $field['type'],
369	+ 'toolbar' => isset( $field['inline_editor'] ) ? $field['inline_editor'] : null,
370	),
371	);
372	}

487	return false;
488	}
489
490	+ $post = get_post( $id );
491	$filename = wp_basename( $url );
492	$base_url = str_replace( $filename, '', $url );
493	$meta = wp_get_attachment_metadata( $id );

526	'id' => $id,
527	'url' => $url,
528	'filename' => $filename,
529	+ 'caption' => $post->post_excerpt,
530	'sizes' => apply_filters( 'fl_builder_photo_sizes_select', $sizes ),
531	);
532	}

666	// Render legacy custom fields.
667	if ( isset( $data['fields'] ) ) {
668	foreach ( $data['fields'] as $name ) {
669	+ if ( ! isset( $fields[ $name ] ) ) {
670	+ continue;
671	+ }
672	ob_start();
673	self::render_settings_field( $name, (array) $fields[ $name ], $settings );
674	$response['fields'][ $name ] = ob_get_clean();

851	* @since 2.0
852	*/
853	$field = apply_filters( 'fl_builder_render_settings_field', $field, $name, $settings ); // Allow field settings filtering first
854	+
855	+ if ( ! isset( $field['type'] ) ) {
856	+ return;
857	+ }
858	+
859	$i = null;
860	$is_multiple = isset( $field['multiple'] ) && true === (bool) $field['multiple'];
861	$supports_multiple = 'editor' != $field['type'] && 'service' != $field['type'];

classes/class-fl-builder-wp-blocks-layout.php CHANGED Viewed

	@@ -14,10 +14,10 @@ final class FLBuilderWPBlocksLayout {
14	static public function init() {
15	// Actions
16	add_action( 'current_screen', __CLASS__ . '::init_template' );
17	- add_action( 'admin_enqueue_scripts', __CLASS__ . '::update_legacy_post', 1 );
18	add_action( 'pre_post_update', __CLASS__ . '::disable_builder_on_post_update', 10, 2 );
19
20	// Filters

21	add_filter( 'fl_builder_editor_content', __CLASS__ . '::filter_editor_content' );
22	add_filter( 'fl_builder_migrated_post_content', __CLASS__ . '::filter_migrated_post_content' );
23	}
	@@ -61,15 +61,17 @@ final class FLBuilderWPBlocksLayout {
61	* Updates posts being edited in the admin that we're built
62	* using Beaver Builder before WordPress blocks existed.
63	*




64	* @since 2.1
65	- * @~~return~~ ~~void~~


66	*/
67	- static public function update_legacy_post() {
68	- ~~global~~ ~~$pagenow,~~ $post;
69	-
70	- if ( 'post.php' !== $pagenow \|\| ! is_object( $post ) ) {
71	- return;
72	- } else {
73	$enabled = FLBuilderModel::is_builder_enabled( $post->ID );
74	$blocks = preg_match( '/<!-- wp:(.*) \/?-->/', $post->post_content );
75
	@@ -86,6 +88,8 @@ final class FLBuilderWPBlocksLayout {
86	) );
87	}
88	}


89	}
90
91	/**


14	static public function init() {
15	// Actions
16	add_action( 'current_screen', __CLASS__ . '::init_template' );

17	add_action( 'pre_post_update', __CLASS__ . '::disable_builder_on_post_update', 10, 2 );
18
19	// Filters
20	+ add_action( 'block_editor_preload_paths', __CLASS__ . '::update_legacy_post', 10, 2 );
21	add_filter( 'fl_builder_editor_content', __CLASS__ . '::filter_editor_content' );
22	add_filter( 'fl_builder_migrated_post_content', __CLASS__ . '::filter_migrated_post_content' );
23	}

61	* Updates posts being edited in the admin that we're built
62	* using Beaver Builder before WordPress blocks existed.
63	*
64	+ * We do this on the `block_editor_preload_paths` filter because
65	+ * that is the earliest we can hook into updating the post before
66	+ * it is preloaded by the REST API.
67	+ *
68	* @since 2.1
69	+ * @param array $paths
70	+ * @param object $post
71	+ * @return array
72	*/
73	+ static public function update_legacy_post( $paths, $post ) {
74	+ if ( is_object( $post ) ) {




75	$enabled = FLBuilderModel::is_builder_enabled( $post->ID );
76	$blocks = preg_match( '/<!-- wp:(.*) \/?-->/', $post->post_content );
77

88	) );
89	}
90	}
91	+
92	+ return $paths;
93	}
94
95	/**

classes/class-fl-builder.php CHANGED Viewed

	@@ -68,7 +68,7 @@ final class FLBuilder {
68	* @since 2.1
69	*/
70	static public $fa4_url = 'https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css';
71	- static public $fa5_pro_url = 'https://pro.fontawesome.com/releases/v5.6.1/css/all.css';
72
73	/**
74	* Initializes hooks.
	@@ -87,7 +87,6 @@ final class FLBuilder {
87	add_action( 'wp_enqueue_scripts', __CLASS__ . '::enqueue_all_layouts_styles_scripts' );
88	add_action( 'wp_head', __CLASS__ . '::render_custom_css_for_editing', 999 );
89	add_action( 'admin_bar_menu', __CLASS__ . '::admin_bar_menu', 999 );
90	- add_action( 'wp_footer', __CLASS__ . '::include_jquery' );
91	add_action( 'wp_footer', __CLASS__ . '::render_ui' );
92
93	/* Filters */
	@@ -485,6 +484,16 @@ final class FLBuilder {
485	}
486	}
487	}










488	}
489
490	// Enqueue required module CSS and JS
	@@ -500,7 +509,7 @@ final class FLBuilder {
500	foreach ( $module->js as $handle => $props ) {
501	wp_enqueue_script( $handle, $props[0], $props[1], $props[2], $props[3] );
502	}
503	- if ( ! empty( $module->settings->animation ) ) {
504	wp_enqueue_script( 'jquery-waypoints' );
505	}
506	}
	@@ -763,19 +772,6 @@ final class FLBuilder {
763	wp_add_inline_style( 'admin-bar', '#wp-admin-bar-fl-builder-frontend-edit-link .ab-icon:before { content: "\f116" !important; top: 2px; margin-right: 3px; }' );
764	}
765
766	- /**
767	- * Include a jQuery fallback script when the builder is
768	- * enabled for a page.
769	- *
770	- * @since 1.0
771	- * @return void
772	- */
773	- static public function include_jquery() {
774	- if ( FLBuilderModel::is_builder_enabled() ) {
775	- include FL_BUILDER_DIR . 'includes/jquery.php';
776	- }
777	- }
778	-
779	/**
780	* Adds builder classes to the body class.
781	*
	@@ -975,6 +971,17 @@ final class FLBuilder {
975	'items' => array(),
976	);
977











978	if ( ! $is_lite && ! $is_user_template && ( 'enabled' == $enabled_templates \|\| 'user' == $enabled_templates ) ) {
979	$tools_view['items'][10] = array(
980	'label' => __( 'Save Template', 'fl-builder' ),
	@@ -997,6 +1004,13 @@ final class FLBuilder {
997	'accessory' => $key_shortcuts['previewLayout']['keyLabel'],
998	);
999







1000	$tools_view['items'][40] = array(
1001	'type' => 'separator',
1002	);
	@@ -1193,6 +1207,10 @@ final class FLBuilder {
1193	'label' => _x( 'Toggle Preview Mode', 'Keyboard action to toggle preview mode', 'fl-builder' ),
1194	'keyCode' => 'p',
1195	),




1196	'showGlobalSettings' => array(
1197	'label' => _x( 'Open Global Settings', 'Keyboard action to open the global settings panel', 'fl-builder' ),
1198	'keyCode' => 'mod+u',
	@@ -1317,15 +1335,35 @@ final class FLBuilder {
1317	* @return void
1318	*/
1319	static public function render_ui_bar_buttons() {
1320	- $help_button = FLBuilderModel::get_help_button_settings();
1321	- $simple_ui = ! FLBuilderUserAccess::current_user_can( 'unrestricted_editing' );
1322	$should_display_search = ! FLBuilderModel::is_post_user_template( 'module' ) && ! $simple_ui;
1323	-
1324	$add_btn_svg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="24" height="24"><rect x="0" fill="none" width="24" height="24" /><g><path d="M17 9v2h-6v6H9v-6H3V9h6V3h2v6h6z"/></g></svg>';
1325	-
1326	$notifications = FLBuilderNotifications::get_notifications();












1327
1328	$buttons = apply_filters( 'fl_builder_ui_bar_buttons', array(










1329	'upgrade' => array(
1330	'label' => __( 'Upgrade Today', 'fl-builder' ) . ' <i class="fas fa-external-link-alt"></i>',
1331	'show' => true === FL_BUILDER_LITE,
	@@ -1367,7 +1405,17 @@ final class FLBuilder {
1367	echo ' ' . $button['class'];
1368	}
1369
1370	- echo '">' ~~. $button['label'] . '</button>'~~;










1371
1372	$i++;
1373	}
	@@ -1380,6 +1428,7 @@ final class FLBuilder {
1380	include FL_BUILDER_DIR . 'img/svg/bell-active.svg';
1381	echo '</button>';
1382	}

1383	echo '</div>';
1384	}
1385
	@@ -1423,7 +1472,7 @@ final class FLBuilder {
1423	self::enqueue_layout_styles_scripts_by_id( $query_post->ID );
1424
1425	// Print the styles if we are outside of the head tag.
1426	- if ( ~~! doing_action~~( 'wp_enqueue_scripts' ) ) {
1427	wp_print_styles();
1428	}
1429
	@@ -1870,12 +1919,31 @@ final class FLBuilder {
1870	$attrs['class'][] = 'fl-row-align-' . $row->settings->content_alignment;
1871	}
1872	}
1873	- if ( ~~in_array~~( $row->settings->~~bg_type,~~ ~~$overlay_bgs~~ ) && ! ~~empty(~~ $row->settings->~~bg_overlay_color~~ ) ) {
1874	- ~~$attrs['class'][] = 'fl-row-bg-overlay';~~












1875	}
1876	if ( ! empty( $row->settings->responsive_display ) ) {
1877	$attrs['class'][] = 'fl-visible-' . $row->settings->responsive_display;
1878	}







1879	if ( ! empty( $custom_class ) ) {
1880	$attrs['class'][] = trim( esc_attr( $custom_class ) );
1881	}
	@@ -1885,6 +1953,9 @@ final class FLBuilder {
1885	if ( $active && $has_rules ) {
1886	$attrs['class'][] = 'fl-node-has-rules';
1887	}



1888
1889	// Data
1890	if ( 'parallax' == $row->settings->bg_type && ! empty( $row->settings->bg_parallax_image_src ) ) {
	@@ -1997,7 +2068,7 @@ final class FLBuilder {
1997	}
1998	}
1999	}
2000	- if ( isset( $col->settings->~~responsive_size~~ ) && ~~'custom'~~ == $col->settings->~~responsive_size~~ ) {
2001	if ( ! in_array( 'fl-col-group-custom-width', $attrs['class'] ) ) {
2002	$attrs['class'][] = 'fl-col-group-custom-width';
2003	}
	@@ -2068,12 +2139,23 @@ final class FLBuilder {
2068	if ( count( $nested ) > 0 ) {
2069	$attrs['class'][] = 'fl-col-has-cols';
2070	}
2071	- if ( in_array( $col->settings->bg_type, $overlay_bgs ) ~~&& ! empty( $col->settings->bg_overlay_color~~ ) ) {
2072	- ~~$attrs[~~'~~class~~'~~][]~~ = ~~'fl-~~col~~-bg-overlay';~~




2073	}
2074	if ( ! empty( $col->settings->responsive_display ) ) {
2075	$attrs['class'][] = 'fl-visible-' . $col->settings->responsive_display;
2076	}







2077	if ( ! empty( $custom_class ) ) {
2078	$attrs['class'][] = trim( esc_attr( $custom_class ) );
2079	}
	@@ -2170,7 +2252,7 @@ final class FLBuilder {
2170	// Module
2171	$class = get_class( FLBuilderModel::$modules[ $type ] );
2172	$module = new $class();
2173	- $module->settings = $settings;
2174
2175	// Shorthand reference to the module's id.
2176	$id = $module->node;
	@@ -2219,9 +2301,12 @@ final class FLBuilder {
2219	if ( ! empty( $module->settings->responsive_display ) ) {
2220	$attrs['class'][] = 'fl-visible-' . $module->settings->responsive_display;
2221	}
2222	- if ( ~~! empty~~( $module->settings->animation ) && ~~is_string~~( $module->settings->animation ) ) {
2223	- $attrs['class'][] = 'fl-animation fl-' . $module->settings->animation;
2224	- $attrs['data-animation-delay'][] = $module->settings->~~animation_delay~~;



2225	}
2226	if ( ! empty( $custom_class ) ) {
2227	$attrs['class'][] = trim( esc_attr( $custom_class ) );
	@@ -2269,11 +2354,12 @@ final class FLBuilder {
2269	// Module
2270	$class = get_class( FLBuilderModel::$modules[ $type ] );
2271	$module = new $class();
2272	- $module->settings = $settings;
2273
2274	// CSS
2275	ob_start();
2276	include $module->dir . 'includes/frontend.css.php';

2277	$css = ob_get_clean();
2278
2279	echo apply_filters( 'fl_builder_render_module_css', $css, $module, $id );
	@@ -2317,8 +2403,9 @@ final class FLBuilder {
2317	* @param bool $include_global
2318	* @return string
2319	*/

2320	static public function render_css( $include_global = true ) {
2321	- // ~~Get info on the new file.~~
2322	$nodes = FLBuilderModel::get_categorized_nodes();
2323	$node_status = FLBuilderModel::get_node_status();
2324	$global_settings = FLBuilderModel::get_global_settings();
	@@ -2338,8 +2425,11 @@ final class FLBuilder {
2338	foreach ( $nodes['rows'] as $row ) {
2339
2340	// Instance row css


2341	ob_start();
2342	include FL_BUILDER_DIR . 'includes/row-css.php';

2343	$css .= ob_get_clean();
2344
2345	// Instance row margins
	@@ -2348,16 +2438,19 @@ final class FLBuilder {
2348	// Instance row padding
2349	$css .= self::render_row_padding( $row );
2350
2351	- // Instance row ~~border~~
2352	- $css .= self::~~render_row_border~~( $row );
2353	}
2354
2355	// Loop through the columns.
2356	foreach ( $nodes['columns'] as $col ) {
2357
2358	// Instance column css


2359	ob_start();
2360	include FL_BUILDER_DIR . 'includes/column-css.php';

2361	$css .= ob_get_clean();
2362
2363	// Instance column margins
	@@ -2366,11 +2459,8 @@ final class FLBuilder {
2366	// Instance column padding
2367	$css .= self::render_column_padding( $col );
2368
2369	- // Instance column ~~border~~
2370	- $css .= self::~~render_column_border~~( $col );
2371	-
2372	- // Get the modules in this column.
2373	- $modules = FLBuilderModel::get_modules( $col );
2374	}
2375
2376	// Loop through the modules.
	@@ -2408,6 +2498,7 @@ final class FLBuilder {
2408	self::$enqueued_module_css_assets[] = $id;
2409	ob_start();
2410	include $file;

2411	$css .= ob_get_clean();
2412	}
2413
	@@ -2417,6 +2508,14 @@ final class FLBuilder {
2417	if ( ! isset( $global_settings->auto_spacing ) \|\| $global_settings->auto_spacing ) {
2418	$css .= self::render_responsive_module_margins( $module );
2419	}








2420	}
2421
2422	// Custom Global CSS (included here for proper specificity)
	@@ -2483,12 +2582,14 @@ final class FLBuilder {
2483	array( 'row_margins', '.fl-row-content-wrap { margin: ' ),
2484	array( 'row_padding', '.fl-row-content-wrap { padding: ' ),
2485	array( 'row_width', '.fl-row-fixed-width { max-width: ' ),


2486	array( 'module_margins', '.fl-module-content { margin: ' ),
2487	) as $data ) {
2488	if ( '' !== $global_settings->{ $data[0] } ) {
2489	$value = preg_replace( self::regex( 'css_unit' ), '', strtolower( $global_settings->{ $data[0] } ) );
2490	$css .= $data[1] . esc_attr( $value );
2491	- $css .= ( is_numeric( $value ) ) ? ( 'px; }' ) : ( '; }' );
2492	}
2493	}
2494
	@@ -2498,19 +2599,21 @@ final class FLBuilder {
2498	// Medium devices
2499	$css .= '@media (max-width: ' . $global_settings->medium_breakpoint . 'px) { ';
2500
2501	- // Core medium layout css
2502	- $css .= fl_builder_filesystem()->file_get_contents( FL_BUILDER_DIR . '/css/fl-builder-layout-medium.css' );
2503
2504	- // Global node medium css
2505	foreach ( array(
2506	array( 'row_margins_medium', '.fl-row[data-node] > .fl-row-content-wrap { margin: ' ),
2507	array( 'row_padding_medium', '.fl-row[data-node] > .fl-row-content-wrap { padding: ' ),


2508	array( 'module_margins_medium', '.fl-module[data-node] > .fl-module-content { margin: ' ),
2509	) as $data ) {
2510	if ( '' !== $global_settings->{ $data[0] } ) {
2511	$value = preg_replace( self::regex( 'css_unit' ), '', strtolower( $global_settings->{ $data[0] } ) );
2512	$css .= $data[1] . esc_attr( $value );
2513	- $css .= ( is_numeric( $value ) ) ? ( 'px; }' ) : ( '; }' );
2514	}
2515	}
2516
	@@ -2519,24 +2622,26 @@ final class FLBuilder {
2519	// Responsive devices
2520	$css .= '@media (max-width: ' . $global_settings->responsive_breakpoint . 'px) { ';
2521
2522	- // Core responsive layout css
2523	- $css .= fl_builder_filesystem()->file_get_contents( FL_BUILDER_DIR . '/css/fl-builder-layout-responsive.css' );
2524
2525	- // Auto spacing
2526	if ( ! isset( $global_settings->auto_spacing ) \|\| $global_settings->auto_spacing ) {
2527	$css .= fl_builder_filesystem()->file_get_contents( FL_BUILDER_DIR . '/css/fl-builder-layout-auto-spacing.css' );
2528	}
2529
2530	- // Global node responsive css
2531	foreach ( array(
2532	array( 'row_margins_responsive', '.fl-row[data-node] > .fl-row-content-wrap { margin: ' ),
2533	array( 'row_padding_responsive', '.fl-row[data-node] > .fl-row-content-wrap { padding: ' ),


2534	array( 'module_margins_responsive', '.fl-module[data-node] > .fl-module-content { margin: ' ),
2535	) as $data ) {
2536	if ( '' !== $global_settings->{ $data[0] } ) {
2537	$value = preg_replace( self::regex( 'css_unit' ), '', strtolower( $global_settings->{ $data[0] } ) );
2538	$css .= $data[1] . esc_attr( $value );
2539	- $css .= ( is_numeric( $value ) ) ? ( 'px; }' ) : ( '; }' );
2540	}
2541	}
2542
	@@ -2640,14 +2745,16 @@ final class FLBuilder {
2640
2641	// Iterate over each direction
2642	foreach ( array( 'top', 'right', 'bottom', 'left' ) as $dir ) {
2643	- $~~setting~~ = $prop_type . '_' . $dir . $setting_suffix;


2644
2645	- if ( ! isset( $settings->{ $~~setting~~ } ) ) {
2646	continue;
2647	}
2648
2649	$prop = $prop_type . '-' . $dir;
2650	- $value = preg_replace( self::regex( 'css_unit' ), '', strtolower( $settings->{ $~~setting~~ } ) );
2651
2652	if ( 'border' === $prop_type ) {
2653
	@@ -2661,7 +2768,7 @@ final class FLBuilder {
2661	if ( '' !== $value ) {
2662	$breakpoint_css .= "\t";
2663	$breakpoint_css .= $prop . ':' . esc_attr( $value );
2664	- $breakpoint_css .= ( is_numeric( trim( $value ) ) ) ? ( 'px;' ) : ( ';' );
2665	$breakpoint_css .= "\r\n";
2666	}
2667	}
	@@ -2712,17 +2819,6 @@ final class FLBuilder {
2712	return self::render_node_spacing( $row, 'padding' );
2713	}
2714
2715	- /**
2716	- * Renders the CSS border widths for a row.
2717	- *
2718	- * @since 1.9
2719	- * @param object $row A row node object.
2720	- * @return string The row CSS border-width string.
2721	- */
2722	- static public function render_row_border( $row ) {
2723	- return self::render_node_spacing( $row, 'border' );
2724	- }
2725	-
2726	/**
2727	* Renders the CSS margins for a column.
2728	*
	@@ -2745,17 +2841,6 @@ final class FLBuilder {
2745	return self::render_node_spacing( $col, 'padding' );
2746	}
2747
2748	- /**
2749	- * Renders the CSS border widths for a column.
2750	- *
2751	- * @since 1.9
2752	- * @param object $col A column node object.
2753	- * @return string The column CSS border-width string.
2754	- */
2755	- static public function render_column_border( $col ) {
2756	- return self::render_node_spacing( $col, 'border', '.fl-builder-content' );
2757	- }
2758	-
2759	/**
2760	* Renders the CSS margins for a module.
2761	*
	@@ -2819,6 +2904,60 @@ final class FLBuilder {
2819	return $css;
2820	}
2821






















































2822	/**
2823	* Renders and caches the JavaScript for a builder layout.
2824	*
	@@ -2977,6 +3116,33 @@ final class FLBuilder {
2977	return $js;
2978	}
2979



























2980	/**
2981	* Renders the JavaScript for all modules in a single column.
2982	*
	@@ -3076,6 +3242,17 @@ final class FLBuilder {
3076	return apply_filters( 'fl_builder_should_refresh_on_publish', $refresh );
3077	}
3078











3079	/**
3080	* Custom logging function that handles objects and arrays.
3081	*
	@@ -3309,6 +3486,30 @@ final class FLBuilder {
3309
3310	FLBuilderUISettingsForms::render_settings_config();
3311	}
























3312	}
3313
3314	FLBuilder::init();


68	* @since 2.1
69	*/
70	static public $fa4_url = 'https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css';
71	+ static public $fa5_pro_url = 'https://pro.fontawesome.com/releases/v5.6.3/css/all.css';
72
73	/**
74	* Initializes hooks.

87	add_action( 'wp_enqueue_scripts', __CLASS__ . '::enqueue_all_layouts_styles_scripts' );
88	add_action( 'wp_head', __CLASS__ . '::render_custom_css_for_editing', 999 );
89	add_action( 'admin_bar_menu', __CLASS__ . '::admin_bar_menu', 999 );

90	add_action( 'wp_footer', __CLASS__ . '::render_ui' );
91
92	/* Filters */

484	}
485	}
486	}
487	+ if ( is_array( $row->settings->animation ) && ! empty( $row->settings->animation['style'] ) ) {
488	+ wp_enqueue_script( 'jquery-waypoints' );
489	+ }
490	+ }
491	+
492	+ // Enqueue required column CSS and JS
493	+ foreach ( $nodes['columns'] as $col ) {
494	+ if ( is_array( $col->settings->animation ) && ! empty( $col->settings->animation['style'] ) ) {
495	+ wp_enqueue_script( 'jquery-waypoints' );
496	+ }
497	}
498
499	// Enqueue required module CSS and JS

509	foreach ( $module->js as $handle => $props ) {
510	wp_enqueue_script( $handle, $props[0], $props[1], $props[2], $props[3] );
511	}
512	+ if ( is_array( $module->settings->animation ) && ! empty( $module->settings->animation['style'] ) ) {
513	wp_enqueue_script( 'jquery-waypoints' );
514	}
515	}

772	wp_add_inline_style( 'admin-bar', '#wp-admin-bar-fl-builder-frontend-edit-link .ab-icon:before { content: "\f116" !important; top: 2px; margin-right: 3px; }' );
773	}
774













775	/**
776	* Adds builder classes to the body class.
777	*

971	'items' => array(),
972	);
973
974	+ $tools_view['items'][04] = array(
975	+ 'label' => __( 'Publish Layout', 'fl-builder' ),
976	+ 'type' => 'event',
977	+ 'eventName' => 'publishAndRemain',
978	+ 'accessory' => $key_shortcuts['publishAndRemain']['keyLabel'],
979	+ );
980	+
981	+ $tools_view['items'][05] = array(
982	+ 'type' => 'separator',
983	+ );
984	+
985	if ( ! $is_lite && ! $is_user_template && ( 'enabled' == $enabled_templates \|\| 'user' == $enabled_templates ) ) {
986	$tools_view['items'][10] = array(
987	'label' => __( 'Save Template', 'fl-builder' ),

1004	'accessory' => $key_shortcuts['previewLayout']['keyLabel'],
1005	);
1006
1007	+ $tools_view['items'][31] = array(
1008	+ 'label' => __( 'Responsive Editing', 'fl-builder' ),
1009	+ 'type' => 'event',
1010	+ 'eventName' => 'responsiveEditing',
1011	+ 'accessory' => $key_shortcuts['responsiveEditing']['keyLabel'],
1012	+ );
1013	+
1014	$tools_view['items'][40] = array(
1015	'type' => 'separator',
1016	);

1207	'label' => _x( 'Toggle Preview Mode', 'Keyboard action to toggle preview mode', 'fl-builder' ),
1208	'keyCode' => 'p',
1209	),
1210	+ 'responsiveEditing' => array(
1211	+ 'label' => _x( 'Toggle Responsive Editing Mode', 'Keyboard action to toggle responsive editing', 'fl-builder' ),
1212	+ 'keyCode' => 'r',
1213	+ ),
1214	'showGlobalSettings' => array(
1215	'label' => _x( 'Open Global Settings', 'Keyboard action to open the global settings panel', 'fl-builder' ),
1216	'keyCode' => 'mod+u',

1335	* @return void
1336	*/
1337	static public function render_ui_bar_buttons() {
1338	+ $help_button = FLBuilderModel::get_help_button_settings();
1339	+ $simple_ui = ! FLBuilderUserAccess::current_user_can( 'unrestricted_editing' );
1340	$should_display_search = ! FLBuilderModel::is_post_user_template( 'module' ) && ! $simple_ui;

1341	$add_btn_svg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="24" height="24"><rect x="0" fill="none" width="24" height="24" /><g><path d="M17 9v2h-6v6H9v-6H3V9h6V3h2v6h6z"/></g></svg>';

1342	$notifications = FLBuilderNotifications::get_notifications();
1343	+ $feedback_label = __( 'Dev Feedback', 'fl-builder' );
1344	+ $show_feedback = '{FL_BUILDER_VERSION}' === FL_BUILDER_VERSION;
1345	+
1346	+ if ( strstr( FL_BUILDER_VERSION, '-dev' ) ) {
1347	+ $show_feedback = true;
1348	+ } elseif ( strstr( FL_BUILDER_VERSION, '-alpha' ) ) {
1349	+ $feedback_label = __( 'Alpha Feedback', 'fl-builder' );
1350	+ $show_feedback = true;
1351	+ } elseif ( strstr( FL_BUILDER_VERSION, '-beta' ) ) {
1352	+ $feedback_label = __( 'Beta Feedback', 'fl-builder' );
1353	+ $show_feedback = true;
1354	+ }
1355
1356	$buttons = apply_filters( 'fl_builder_ui_bar_buttons', array(
1357	+ 'feedback' => array(
1358	+ 'label' => $feedback_label . ' <i class="fas fa-external-link-alt"></i>',
1359	+ 'show' => $show_feedback,
1360	+ 'onclick' => "window.open('" . FLBuilderModel::get_store_url( 'contact', array(
1361	+ 'topic' => 'Pre-Release Feedback',
1362	+ 'utm_medium' => true === FL_BUILDER_LITE ? 'bb-lite' : 'bb-pro',
1363	+ 'utm_source' => 'builder-ui',
1364	+ 'utm_campaign' => 'feedback-cta',
1365	+ ) ) . "');",
1366	+ ),
1367	'upgrade' => array(
1368	'label' => __( 'Upgrade Today', 'fl-builder' ) . ' <i class="fas fa-external-link-alt"></i>',
1369	'show' => true === FL_BUILDER_LITE,

1405	echo ' ' . $button['class'];
1406	}
1407
1408	+ echo '"';
1409	+
1410	+ if ( isset( $button['title'] ) ) {
1411	+ echo ' title="' . $button['title'] . '"';
1412	+ }
1413	+
1414	+ if ( isset( $button['onclick'] ) ) {
1415	+ echo ' onclick="' . $button['onclick'] . '"';
1416	+ }
1417	+
1418	+ echo '>' . $button['label'] . '</button>';
1419
1420	$i++;
1421	}

1428	include FL_BUILDER_DIR . 'img/svg/bell-active.svg';
1429	echo '</button>';
1430	}
1431	+
1432	echo '</div>';
1433	}
1434

1472	self::enqueue_layout_styles_scripts_by_id( $query_post->ID );
1473
1474	// Print the styles if we are outside of the head tag.
1475	+ if ( did_action( 'wp_enqueue_scripts' ) && 'wp_enqueue_scripts' !== current_filter() ) {
1476	wp_print_styles();
1477	}
1478

1919	$attrs['class'][] = 'fl-row-align-' . $row->settings->content_alignment;
1920	}
1921	}
1922	+ if ( ! empty( $row->settings->full_height ) && 'custom' == $row->settings->full_height ) {
1923	+
1924	+ $attrs['class'][] = 'fl-row-custom-height';
1925	+
1926	+ if ( isset( $row->settings->content_alignment ) ) {
1927	+ $attrs['class'][] = 'fl-row-align-' . $row->settings->content_alignment;
1928	+ }
1929	+ }
1930	+ if ( in_array( $row->settings->bg_type, $overlay_bgs ) ) {
1931	+ if ( 'color' === $row->settings->bg_overlay_type && ! empty( $row->settings->bg_overlay_color ) ) {
1932	+ $attrs['class'][] = 'fl-row-bg-overlay';
1933	+ } elseif ( 'gradient' === $row->settings->bg_overlay_type ) {
1934	+ $attrs['class'][] = 'fl-row-bg-overlay';
1935	+ }
1936	}
1937	if ( ! empty( $row->settings->responsive_display ) ) {
1938	$attrs['class'][] = 'fl-visible-' . $row->settings->responsive_display;
1939	}
1940	+ if ( is_array( $row->settings->animation ) && ! empty( $row->settings->animation['style'] ) ) {
1941	+ $attrs['class'][] = 'fl-animation fl-' . $row->settings->animation['style'];
1942	+ $attrs['data-animation-delay'][] = $row->settings->animation['delay'];
1943	+ if ( isset( $row->settings->animation['duration'] ) ) {
1944	+ $attrs['data-animation-duration'][] = $row->settings->animation['duration'];
1945	+ }
1946	+ }
1947	if ( ! empty( $custom_class ) ) {
1948	$attrs['class'][] = trim( esc_attr( $custom_class ) );
1949	}

1953	if ( $active && $has_rules ) {
1954	$attrs['class'][] = 'fl-node-has-rules';
1955	}
1956	+ if ( ! empty( $row->settings->top_edge_shape ) \|\| ! empty( $row->settings->bottom_edge_shape ) ) {
1957	+ $attrs['class'][] = 'fl-row-has-layers';
1958	+ }
1959
1960	// Data
1961	if ( 'parallax' == $row->settings->bg_type && ! empty( $row->settings->bg_parallax_image_src ) ) {

2068	}
2069	}
2070	}
2071	+ if ( isset( $col->settings->size_responsive ) && ! empty( $col->settings->size_responsive ) ) {
2072	if ( ! in_array( 'fl-col-group-custom-width', $attrs['class'] ) ) {
2073	$attrs['class'][] = 'fl-col-group-custom-width';
2074	}

2139	if ( count( $nested ) > 0 ) {
2140	$attrs['class'][] = 'fl-col-has-cols';
2141	}
2142	+ if ( in_array( $col->settings->bg_type, $overlay_bgs ) ) {
2143	+ if ( 'color' === $col->settings->bg_overlay_type && ! empty( $col->settings->bg_overlay_color ) ) {
2144	+ $attrs['class'][] = 'fl-col-bg-overlay';
2145	+ } elseif ( 'gradient' === $col->settings->bg_overlay_type ) {
2146	+ $attrs['class'][] = 'fl-col-bg-overlay';
2147	+ }
2148	}
2149	if ( ! empty( $col->settings->responsive_display ) ) {
2150	$attrs['class'][] = 'fl-visible-' . $col->settings->responsive_display;
2151	}
2152	+ if ( is_array( $col->settings->animation ) && ! empty( $col->settings->animation['style'] ) ) {
2153	+ $attrs['class'][] = 'fl-animation fl-' . $col->settings->animation['style'];
2154	+ $attrs['data-animation-delay'][] = $col->settings->animation['delay'];
2155	+ if ( isset( $col->settings->animation['duration'] ) ) {
2156	+ $attrs['data-animation-duration'][] = $col->settings->animation['duration'];
2157	+ }
2158	+ }
2159	if ( ! empty( $custom_class ) ) {
2160	$attrs['class'][] = trim( esc_attr( $custom_class ) );
2161	}

2252	// Module
2253	$class = get_class( FLBuilderModel::$modules[ $type ] );
2254	$module = new $class();
2255	+ $module->settings = FLBuilderSettingsCompat::filter_node_settings( 'module', $settings );
2256
2257	// Shorthand reference to the module's id.
2258	$id = $module->node;

2301	if ( ! empty( $module->settings->responsive_display ) ) {
2302	$attrs['class'][] = 'fl-visible-' . $module->settings->responsive_display;
2303	}
2304	+ if ( is_array( $module->settings->animation ) && ! empty( $module->settings->animation['style'] ) ) {
2305	+ $attrs['class'][] = 'fl-animation fl-' . $module->settings->animation['style'];
2306	+ $attrs['data-animation-delay'][] = $module->settings->animation['delay'];
2307	+ if ( isset( $module->settings->animation['duration'] ) ) {
2308	+ $attrs['data-animation-duration'][] = $module->settings->animation['duration'];
2309	+ }
2310	}
2311	if ( ! empty( $custom_class ) ) {
2312	$attrs['class'][] = trim( esc_attr( $custom_class ) );

2354	// Module
2355	$class = get_class( FLBuilderModel::$modules[ $type ] );
2356	$module = new $class();
2357	+ $module->settings = FLBuilderSettingsCompat::filter_node_settings( 'module', $settings );
2358
2359	// CSS
2360	ob_start();
2361	include $module->dir . 'includes/frontend.css.php';
2362	+ FLBuilderCSS::render();
2363	$css = ob_get_clean();
2364
2365	echo apply_filters( 'fl_builder_render_module_css', $css, $module, $id );

2403	* @param bool $include_global
2404	* @return string
2405	*/
2406	+
2407	static public function render_css( $include_global = true ) {
2408	+ $active = FLBuilderModel::is_builder_active();
2409	$nodes = FLBuilderModel::get_categorized_nodes();
2410	$node_status = FLBuilderModel::get_node_status();
2411	$global_settings = FLBuilderModel::get_global_settings();

2425	foreach ( $nodes['rows'] as $row ) {
2426
2427	// Instance row css
2428	+ $settings = $row->settings;
2429	+ $id = $row->node;
2430	ob_start();
2431	include FL_BUILDER_DIR . 'includes/row-css.php';
2432	+ FLBuilderCSS::render();
2433	$css .= ob_get_clean();
2434
2435	// Instance row margins

2438	// Instance row padding
2439	$css .= self::render_row_padding( $row );
2440
2441	+ // Instance row animation
2442	+ $css .= self::render_node_animation_css( $row->settings );
2443	}
2444
2445	// Loop through the columns.
2446	foreach ( $nodes['columns'] as $col ) {
2447
2448	// Instance column css
2449	+ $settings = $col->settings;
2450	+ $id = $col->node;
2451	ob_start();
2452	include FL_BUILDER_DIR . 'includes/column-css.php';
2453	+ FLBuilderCSS::render();
2454	$css .= ob_get_clean();
2455
2456	// Instance column margins

2459	// Instance column padding
2460	$css .= self::render_column_padding( $col );
2461
2462	+ // Instance column animation
2463	+ $css .= self::render_node_animation_css( $col->settings );



2464	}
2465
2466	// Loop through the modules.

2498	self::$enqueued_module_css_assets[] = $id;
2499	ob_start();
2500	include $file;
2501	+ FLBuilderCSS::render();
2502	$css .= ob_get_clean();
2503	}
2504

2508	if ( ! isset( $global_settings->auto_spacing ) \|\| $global_settings->auto_spacing ) {
2509	$css .= self::render_responsive_module_margins( $module );
2510	}
2511	+
2512	+ // Instance module animation
2513	+ $css .= self::render_node_animation_css( $module->settings );
2514	+ }
2515	+
2516	+ // Render all animation CSS when the builder is active.
2517	+ if ( $active ) {
2518	+ $css .= self::render_all_animation_css();
2519	}
2520
2521	// Custom Global CSS (included here for proper specificity)

2582	array( 'row_margins', '.fl-row-content-wrap { margin: ' ),
2583	array( 'row_padding', '.fl-row-content-wrap { padding: ' ),
2584	array( 'row_width', '.fl-row-fixed-width { max-width: ' ),
2585	+ array( 'column_margins', '.fl-col-content { margin: ' ),
2586	+ array( 'column_padding', '.fl-col-content { padding: ' ),
2587	array( 'module_margins', '.fl-module-content { margin: ' ),
2588	) as $data ) {
2589	if ( '' !== $global_settings->{ $data[0] } ) {
2590	$value = preg_replace( self::regex( 'css_unit' ), '', strtolower( $global_settings->{ $data[0] } ) );
2591	$css .= $data[1] . esc_attr( $value );
2592	+ $css .= ( is_numeric( $value ) ) ? ( $global_settings->{ $data[0] . '_unit' } . '; }' ) : ( '; }' );
2593	}
2594	}
2595

2599	// Medium devices
2600	$css .= '@media (max-width: ' . $global_settings->medium_breakpoint . 'px) { ';
2601
2602	+ // Core medium layout css
2603	+ $css .= fl_builder_filesystem()->file_get_contents( FL_BUILDER_DIR . '/css/fl-builder-layout-medium.css' );
2604
2605	+ // Global node medium css
2606	foreach ( array(
2607	array( 'row_margins_medium', '.fl-row[data-node] > .fl-row-content-wrap { margin: ' ),
2608	array( 'row_padding_medium', '.fl-row[data-node] > .fl-row-content-wrap { padding: ' ),
2609	+ array( 'column_margins_medium', '.fl-col[data-node] > .fl-col-content { margin: ' ),
2610	+ array( 'column_padding_medium', '.fl-col[data-node] > .fl-col-content { padding: ' ),
2611	array( 'module_margins_medium', '.fl-module[data-node] > .fl-module-content { margin: ' ),
2612	) as $data ) {
2613	if ( '' !== $global_settings->{ $data[0] } ) {
2614	$value = preg_replace( self::regex( 'css_unit' ), '', strtolower( $global_settings->{ $data[0] } ) );
2615	$css .= $data[1] . esc_attr( $value );
2616	+ $css .= ( is_numeric( $value ) ) ? ( $global_settings->{ $data[0] . '_unit' } . '; }' ) : ( '; }' );
2617	}
2618	}
2619

2622	// Responsive devices
2623	$css .= '@media (max-width: ' . $global_settings->responsive_breakpoint . 'px) { ';
2624
2625	+ // Core responsive layout css
2626	+ $css .= fl_builder_filesystem()->file_get_contents( FL_BUILDER_DIR . '/css/fl-builder-layout-responsive.css' );
2627
2628	+ // Auto spacing
2629	if ( ! isset( $global_settings->auto_spacing ) \|\| $global_settings->auto_spacing ) {
2630	$css .= fl_builder_filesystem()->file_get_contents( FL_BUILDER_DIR . '/css/fl-builder-layout-auto-spacing.css' );
2631	}
2632
2633	+ // Global node responsive css
2634	foreach ( array(
2635	array( 'row_margins_responsive', '.fl-row[data-node] > .fl-row-content-wrap { margin: ' ),
2636	array( 'row_padding_responsive', '.fl-row[data-node] > .fl-row-content-wrap { padding: ' ),
2637	+ array( 'column_margins_responsive', '.fl-col[data-node] > .fl-col-content { margin: ' ),
2638	+ array( 'column_padding_responsive', '.fl-col[data-node] > .fl-col-content { padding: ' ),
2639	array( 'module_margins_responsive', '.fl-module[data-node] > .fl-module-content { margin: ' ),
2640	) as $data ) {
2641	if ( '' !== $global_settings->{ $data[0] } ) {
2642	$value = preg_replace( self::regex( 'css_unit' ), '', strtolower( $global_settings->{ $data[0] } ) );
2643	$css .= $data[1] . esc_attr( $value );
2644	+ $css .= ( is_numeric( $value ) ) ? ( $global_settings->{ $data[0] . '_unit' } . '; }' ) : ( '; }' );
2645	}
2646	}
2647

2745
2746	// Iterate over each direction
2747	foreach ( array( 'top', 'right', 'bottom', 'left' ) as $dir ) {
2748	+ $setting_key = $prop_type . '_' . $dir . $setting_suffix;
2749	+ $unit_key = $prop_type . $setting_suffix . '_unit';
2750	+ $unit = isset( $settings->{ $unit_key } ) ? $settings->{ $unit_key } : 'px';
2751
2752	+ if ( ! isset( $settings->{ $setting_key } ) ) {
2753	continue;
2754	}
2755
2756	$prop = $prop_type . '-' . $dir;
2757	+ $value = preg_replace( self::regex( 'css_unit' ), '', strtolower( $settings->{ $setting_key } ) );
2758
2759	if ( 'border' === $prop_type ) {
2760

2768	if ( '' !== $value ) {
2769	$breakpoint_css .= "\t";
2770	$breakpoint_css .= $prop . ':' . esc_attr( $value );
2771	+ $breakpoint_css .= ( is_numeric( trim( $value ) ) ) ? ( $unit . ';' ) : ( ';' );
2772	$breakpoint_css .= "\r\n";
2773	}
2774	}

2819	return self::render_node_spacing( $row, 'padding' );
2820	}
2821











2822	/**
2823	* Renders the CSS margins for a column.
2824	*

2841	return self::render_node_spacing( $col, 'padding' );
2842	}
2843











2844	/**
2845	* Renders the CSS margins for a module.
2846	*

2904	return $css;
2905	}
2906
2907	+ /**
2908	+ * Renders the animation CSS for a node if it has an animation.
2909	+ *
2910	+ * @since 2.2
2911	+ * @param object $settings A node settings object.
2912	+ * @return string A CSS string.
2913	+ */
2914	+ static public function render_node_animation_css( $settings ) {
2915	+ $css = '';
2916	+
2917	+ if ( ! is_array( $settings->animation ) \|\| empty( $settings->animation ) ) {
2918	+ return $css;
2919	+ } elseif ( in_array( 'animation-' . $settings->animation['style'], self::$enqueued_global_assets ) ) {
2920	+ return $css;
2921	+ }
2922	+
2923	+ self::$enqueued_global_assets[] = 'animation-' . $settings->animation['style'];
2924	+ $path = FL_BUILDER_DIR . 'css/animations/' . $settings->animation['style'] . '.css';
2925	+
2926	+ if ( file_exists( $path ) ) {
2927	+ $css = file_get_contents( $path );
2928	+ }
2929	+
2930	+ return $css;
2931	+ }
2932	+
2933	+ /**
2934	+ * Renders all animation CSS for use in the builder UI.
2935	+ *
2936	+ * @since 2.2
2937	+ * @return string A CSS string.
2938	+ */
2939	+ static public function render_all_animation_css() {
2940	+ $css = '';
2941	+ $animations = glob( FL_BUILDER_DIR . 'css/animations/*.css' );
2942	+
2943	+ if ( ! is_array( $animations ) ) {
2944	+ return $css;
2945	+ }
2946	+
2947	+ foreach ( $animations as $path ) {
2948	+ $key = basename( $path, '.css' );
2949	+
2950	+ if ( in_array( 'animation-' . $key, self::$enqueued_global_assets ) ) {
2951	+ continue;
2952	+ }
2953	+
2954	+ self::$enqueued_global_assets[] = 'animation-' . $key;
2955	+ $css .= file_get_contents( $path );
2956	+ }
2957	+
2958	+ return $css;
2959	+ }
2960	+
2961	/**
2962	* Renders and caches the JavaScript for a builder layout.
2963	*

3116	return $js;
3117	}
3118
3119	+ /**
3120	+ * Renders the JavaScript for all modules in a single column group.
3121	+ *
3122	+ * @since 2.2
3123	+ * @param string\|object $group_id A row ID or object.
3124	+ * @return string
3125	+ */
3126	+ static public function render_column_group_modules_js( $group_id ) {
3127	+ $group = is_object( $group_id ) ? $group_id : FLBuilderModel::get_node( $group_id );
3128	+ $nodes = FLBuilderModel::get_categorized_nodes();
3129	+ $js = '';
3130	+
3131	+ // Render the JS.
3132	+ foreach ( $nodes['columns'] as $column ) {
3133	+ if ( $group->node == $column->parent ) {
3134	+ foreach ( $nodes['modules'] as $module ) {
3135	+ if ( $column->node == $module->parent ) {
3136	+ $js .= self::render_module_js( $module );
3137	+ }
3138	+ }
3139	+ }
3140	+ }
3141	+
3142	+ // Return the JS.
3143	+ return $js;
3144	+ }
3145	+
3146	/**
3147	* Renders the JavaScript for all modules in a single column.
3148	*

3242	return apply_filters( 'fl_builder_should_refresh_on_publish', $refresh );
3243	}
3244
3245	+ /**
3246	+ * Register svg shape art to be used in a shape layer
3247	+ *
3248	+ * @since 2.2
3249	+ * @param Array $args
3250	+ * @return void
3251	+ */
3252	+ static public function register_shape( $args = array() ) {
3253	+ FLBuilderArt::register_shape( $args );
3254	+ }
3255	+
3256	/**
3257	* Custom logging function that handles objects and arrays.
3258	*

3486
3487	FLBuilderUISettingsForms::render_settings_config();
3488	}
3489	+
3490	+ /**
3491	+ * @since 1.9
3492	+ * @deprecated 2.2
3493	+ */
3494	+ static public function render_row_border( $row ) {
3495	+ _deprecated_function( __METHOD__, '2.2', 'FLBuilderCSS::responsive_rule()' );
3496	+ }
3497	+
3498	+ /**
3499	+ * @since 1.9
3500	+ * @deprecated 2.2
3501	+ */
3502	+ static public function render_column_border( $col ) {
3503	+ _deprecated_function( __METHOD__, '2.2', 'FLBuilderCSS::responsive_rule()' );
3504	+ }
3505	+
3506	+ /**
3507	+ * @since 1.0
3508	+ * @deprecated 2.2
3509	+ */
3510	+ static public function include_jquery() {
3511	+ _deprecated_function( __METHOD__, '2.2' );
3512	+ }
3513	}
3514
3515	FLBuilder::init();

css/animations/bounce-down.css ADDED Viewed

	@@ -0,0 +1,68 @@


1	+ .fl-animated.fl-bounce-down {
2	+ animation: fl-bounce-down 1s ease;
3	+ -webkit-animation: fl-bounce-down 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-bounce-down {
6	+ from,
7	+ 60%,
8	+ 75%,
9	+ 90%,
10	+ to {
11	+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
12	+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
13	+ }
14	+ 0% {
15	+ opacity: 0;
16	+ -webkit-transform: translate3d(0, -3000px, 0);
17	+ transform: translate3d(0, -3000px, 0);
18	+ }
19	+ 60% {
20	+ opacity: 1;
21	+ -webkit-transform: translate3d(0, 25px, 0);
22	+ transform: translate3d(0, 25px, 0);
23	+ }
24	+ 75% {
25	+ -webkit-transform: translate3d(0, -10px, 0);
26	+ transform: translate3d(0, -10px, 0);
27	+ }
28	+ 90% {
29	+ -webkit-transform: translate3d(0, 5px, 0);
30	+ transform: translate3d(0, 5px, 0);
31	+ }
32	+ to {
33	+ -webkit-transform: translate3d(0, 0, 0);
34	+ transform: translate3d(0, 0, 0);
35	+ }
36	+ }
37	+ @keyframes fl-bounce-down {
38	+ from,
39	+ 60%,
40	+ 75%,
41	+ 90%,
42	+ to {
43	+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
44	+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
45	+ }
46	+ 0% {
47	+ opacity: 0;
48	+ -webkit-transform: translate3d(0, -3000px, 0);
49	+ transform: translate3d(0, -3000px, 0);
50	+ }
51	+ 60% {
52	+ opacity: 1;
53	+ -webkit-transform: translate3d(0, 25px, 0);
54	+ transform: translate3d(0, 25px, 0);
55	+ }
56	+ 75% {
57	+ -webkit-transform: translate3d(0, -10px, 0);
58	+ transform: translate3d(0, -10px, 0);
59	+ }
60	+ 90% {
61	+ -webkit-transform: translate3d(0, 5px, 0);
62	+ transform: translate3d(0, 5px, 0);
63	+ }
64	+ to {
65	+ -webkit-transform: translate3d(0, 0, 0);
66	+ transform: translate3d(0, 0, 0);
67	+ }
68	+ }

css/animations/bounce-in.css ADDED Viewed

	@@ -0,0 +1,80 @@


1	+ .fl-animated.fl-bounce-in {
2	+ animation: fl-bounce-in 0.75s ease;
3	+ -webkit-animation: fl-bounce-in 0.75s ease;
4	+ }
5	+ @-webkit-keyframes fl-bounce-in {
6	+ from,
7	+ 20%,
8	+ 40%,
9	+ 60%,
10	+ 80%,
11	+ to {
12	+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
13	+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
14	+ }
15	+ 0% {
16	+ opacity: 0;
17	+ -webkit-transform: scale3d(0.3, 0.3, 0.3);
18	+ transform: scale3d(0.3, 0.3, 0.3);
19	+ }
20	+ 20% {
21	+ -webkit-transform: scale3d(1.1, 1.1, 1.1);
22	+ transform: scale3d(1.1, 1.1, 1.1);
23	+ }
24	+ 40% {
25	+ -webkit-transform: scale3d(0.9, 0.9, 0.9);
26	+ transform: scale3d(0.9, 0.9, 0.9);
27	+ }
28	+ 60% {
29	+ opacity: 1;
30	+ -webkit-transform: scale3d(1.03, 1.03, 1.03);
31	+ transform: scale3d(1.03, 1.03, 1.03);
32	+ }
33	+ 80% {
34	+ -webkit-transform: scale3d(0.97, 0.97, 0.97);
35	+ transform: scale3d(0.97, 0.97, 0.97);
36	+ }
37	+ to {
38	+ opacity: 1;
39	+ -webkit-transform: scale3d(1, 1, 1);
40	+ transform: scale3d(1, 1, 1);
41	+ }
42	+ }
43	+ @keyframes fl-bounce-in {
44	+ from,
45	+ 20%,
46	+ 40%,
47	+ 60%,
48	+ 80%,
49	+ to {
50	+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
51	+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
52	+ }
53	+ 0% {
54	+ opacity: 0;
55	+ -webkit-transform: scale3d(0.3, 0.3, 0.3);
56	+ transform: scale3d(0.3, 0.3, 0.3);
57	+ }
58	+ 20% {
59	+ -webkit-transform: scale3d(1.1, 1.1, 1.1);
60	+ transform: scale3d(1.1, 1.1, 1.1);
61	+ }
62	+ 40% {
63	+ -webkit-transform: scale3d(0.9, 0.9, 0.9);
64	+ transform: scale3d(0.9, 0.9, 0.9);
65	+ }
66	+ 60% {
67	+ opacity: 1;
68	+ -webkit-transform: scale3d(1.03, 1.03, 1.03);
69	+ transform: scale3d(1.03, 1.03, 1.03);
70	+ }
71	+ 80% {
72	+ -webkit-transform: scale3d(0.97, 0.97, 0.97);
73	+ transform: scale3d(0.97, 0.97, 0.97);
74	+ }
75	+ to {
76	+ opacity: 1;
77	+ -webkit-transform: scale3d(1, 1, 1);
78	+ transform: scale3d(1, 1, 1);
79	+ }
80	+ }

css/animations/bounce-left.css ADDED Viewed

	@@ -0,0 +1,68 @@


1	+ .fl-animated.fl-bounce-left {
2	+ animation: fl-bounce-left 1s ease;
3	+ -webkit-animation: fl-bounce-left 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-bounce-left {
6	+ from,
7	+ 60%,
8	+ 75%,
9	+ 90%,
10	+ to {
11	+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
12	+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
13	+ }
14	+ 0% {
15	+ opacity: 0;
16	+ -webkit-transform: translate3d(-3000px, 0, 0);
17	+ transform: translate3d(-3000px, 0, 0);
18	+ }
19	+ 60% {
20	+ opacity: 1;
21	+ -webkit-transform: translate3d(25px, 0, 0);
22	+ transform: translate3d(25px, 0, 0);
23	+ }
24	+ 75% {
25	+ -webkit-transform: translate3d(-10px, 0, 0);
26	+ transform: translate3d(-10px, 0, 0);
27	+ }
28	+ 90% {
29	+ -webkit-transform: translate3d(5px, 0, 0);
30	+ transform: translate3d(5px, 0, 0);
31	+ }
32	+ to {
33	+ -webkit-transform: translate3d(0, 0, 0);
34	+ transform: translate3d(0, 0, 0);
35	+ }
36	+ }
37	+ @keyframes fl-bounce-left {
38	+ from,
39	+ 60%,
40	+ 75%,
41	+ 90%,
42	+ to {
43	+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
44	+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
45	+ }
46	+ 0% {
47	+ opacity: 0;
48	+ -webkit-transform: translate3d(-3000px, 0, 0);
49	+ transform: translate3d(-3000px, 0, 0);
50	+ }
51	+ 60% {
52	+ opacity: 1;
53	+ -webkit-transform: translate3d(25px, 0, 0);
54	+ transform: translate3d(25px, 0, 0);
55	+ }
56	+ 75% {
57	+ -webkit-transform: translate3d(-10px, 0, 0);
58	+ transform: translate3d(-10px, 0, 0);
59	+ }
60	+ 90% {
61	+ -webkit-transform: translate3d(5px, 0, 0);
62	+ transform: translate3d(5px, 0, 0);
63	+ }
64	+ to {
65	+ -webkit-transform: translate3d(0, 0, 0);
66	+ transform: translate3d(0, 0, 0);
67	+ }
68	+ }

css/animations/bounce-right.css ADDED Viewed

	@@ -0,0 +1,68 @@


1	+ .fl-animated.fl-bounce-right {
2	+ animation: fl-bounce-right 1s ease;
3	+ -webkit-animation: fl-bounce-right 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-bounce-right {
6	+ from,
7	+ 60%,
8	+ 75%,
9	+ 90%,
10	+ to {
11	+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
12	+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
13	+ }
14	+ from {
15	+ opacity: 0;
16	+ -webkit-transform: translate3d(3000px, 0, 0);
17	+ transform: translate3d(3000px, 0, 0);
18	+ }
19	+ 60% {
20	+ opacity: 1;
21	+ -webkit-transform: translate3d(-25px, 0, 0);
22	+ transform: translate3d(-25px, 0, 0);
23	+ }
24	+ 75% {
25	+ -webkit-transform: translate3d(10px, 0, 0);
26	+ transform: translate3d(10px, 0, 0);
27	+ }
28	+ 90% {
29	+ -webkit-transform: translate3d(-5px, 0, 0);
30	+ transform: translate3d(-5px, 0, 0);
31	+ }
32	+ to {
33	+ -webkit-transform: translate3d(0, 0, 0);
34	+ transform: translate3d(0, 0, 0);
35	+ }
36	+ }
37	+ @keyframes fl-bounce-right {
38	+ from,
39	+ 60%,
40	+ 75%,
41	+ 90%,
42	+ to {
43	+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
44	+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
45	+ }
46	+ from {
47	+ opacity: 0;
48	+ -webkit-transform: translate3d(3000px, 0, 0);
49	+ transform: translate3d(3000px, 0, 0);
50	+ }
51	+ 60% {
52	+ opacity: 1;
53	+ -webkit-transform: translate3d(-25px, 0, 0);
54	+ transform: translate3d(-25px, 0, 0);
55	+ }
56	+ 75% {
57	+ -webkit-transform: translate3d(10px, 0, 0);
58	+ transform: translate3d(10px, 0, 0);
59	+ }
60	+ 90% {
61	+ -webkit-transform: translate3d(-5px, 0, 0);
62	+ transform: translate3d(-5px, 0, 0);
63	+ }
64	+ to {
65	+ -webkit-transform: translate3d(0, 0, 0);
66	+ transform: translate3d(0, 0, 0);
67	+ }
68	+ }

css/animations/bounce-up.css ADDED Viewed

	@@ -0,0 +1,68 @@


1	+ .fl-animated.fl-bounce-up {
2	+ animation: fl-bounce-up 1s ease;
3	+ -webkit-animation: fl-bounce-up 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-bounce-up {
6	+ from,
7	+ 60%,
8	+ 75%,
9	+ 90%,
10	+ to {
11	+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
12	+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
13	+ }
14	+ from {
15	+ opacity: 0;
16	+ -webkit-transform: translate3d(0, 3000px, 0);
17	+ transform: translate3d(0, 3000px, 0);
18	+ }
19	+ 60% {
20	+ opacity: 1;
21	+ -webkit-transform: translate3d(0, -20px, 0);
22	+ transform: translate3d(0, -20px, 0);
23	+ }
24	+ 75% {
25	+ -webkit-transform: translate3d(0, 10px, 0);
26	+ transform: translate3d(0, 10px, 0);
27	+ }
28	+ 90% {
29	+ -webkit-transform: translate3d(0, -5px, 0);
30	+ transform: translate3d(0, -5px, 0);
31	+ }
32	+ to {
33	+ -webkit-transform: translate3d(0, 0, 0);
34	+ transform: translate3d(0, 0, 0);
35	+ }
36	+ }
37	+ @keyframes fl-bounce-up {
38	+ from,
39	+ 60%,
40	+ 75%,
41	+ 90%,
42	+ to {
43	+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
44	+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
45	+ }
46	+ from {
47	+ opacity: 0;
48	+ -webkit-transform: translate3d(0, 3000px, 0);
49	+ transform: translate3d(0, 3000px, 0);
50	+ }
51	+ 60% {
52	+ opacity: 1;
53	+ -webkit-transform: translate3d(0, -20px, 0);
54	+ transform: translate3d(0, -20px, 0);
55	+ }
56	+ 75% {
57	+ -webkit-transform: translate3d(0, 10px, 0);
58	+ transform: translate3d(0, 10px, 0);
59	+ }
60	+ 90% {
61	+ -webkit-transform: translate3d(0, -5px, 0);
62	+ transform: translate3d(0, -5px, 0);
63	+ }
64	+ to {
65	+ -webkit-transform: translate3d(0, 0, 0);
66	+ transform: translate3d(0, 0, 0);
67	+ }
68	+ }

css/animations/bounce.css ADDED Viewed

	@@ -0,0 +1,64 @@


1	+ .fl-animated.fl-bounce {
2	+ animation: fl-bounce 1s ease;
3	+ -webkit-animation: fl-bounce 1s ease;
4	+ transform-origin: center bottom;
5	+ -webkit-transform-origin: center bottom;
6	+ }
7	+ @-webkit-keyframes fl-bounce {
8	+ from,
9	+ 20%,
10	+ 53%,
11	+ 80%,
12	+ to {
13	+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
14	+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
15	+ -webkit-transform: translate3d(0, 0, 0);
16	+ transform: translate3d(0, 0, 0);
17	+ }
18	+ 40%,
19	+ 43% {
20	+ -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
21	+ animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
22	+ -webkit-transform: translate3d(0, -30px, 0);
23	+ transform: translate3d(0, -30px, 0);
24	+ }
25	+ 70% {
26	+ -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
27	+ animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
28	+ -webkit-transform: translate3d(0, -15px, 0);
29	+ transform: translate3d(0, -15px, 0);
30	+ }
31	+ 90% {
32	+ -webkit-transform: translate3d(0, -4px, 0);
33	+ transform: translate3d(0, -4px, 0);
34	+ }
35	+ }
36	+ @keyframes fl-bounce {
37	+ from,
38	+ 20%,
39	+ 53%,
40	+ 80%,
41	+ to {
42	+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
43	+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
44	+ -webkit-transform: translate3d(0, 0, 0);
45	+ transform: translate3d(0, 0, 0);
46	+ }
47	+ 40%,
48	+ 43% {
49	+ -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
50	+ animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
51	+ -webkit-transform: translate3d(0, -30px, 0);
52	+ transform: translate3d(0, -30px, 0);
53	+ }
54	+ 70% {
55	+ -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
56	+ animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
57	+ -webkit-transform: translate3d(0, -15px, 0);
58	+ transform: translate3d(0, -15px, 0);
59	+ }
60	+ 90% {
61	+ -webkit-transform: translate3d(0, -4px, 0);
62	+ transform: translate3d(0, -4px, 0);
63	+ }
64	+ }

css/animations/fade-down.css ADDED Viewed

	@@ -0,0 +1,28 @@


1	+ .fl-animated.fl-fade-down {
2	+ animation: fl-fade-down 1s ease;
3	+ -webkit-animation: fl-fade-down 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-fade-down {
6	+ from {
7	+ opacity: 0;
8	+ -webkit-transform: translate3d(0, -50%, 0);
9	+ transform: translate3d(0, -50%, 0);
10	+ }
11	+ to {
12	+ opacity: 1;
13	+ -webkit-transform: translate3d(0, 0, 0);
14	+ transform: translate3d(0, 0, 0);
15	+ }
16	+ }
17	+ @keyframes fl-fade-down {
18	+ from {
19	+ opacity: 0;
20	+ -webkit-transform: translate3d(0, -50%, 0);
21	+ transform: translate3d(0, -50%, 0);
22	+ }
23	+ to {
24	+ opacity: 1;
25	+ -webkit-transform: translate3d(0, 0, 0);
26	+ transform: translate3d(0, 0, 0);
27	+ }
28	+ }

css/animations/fade-in.css ADDED Viewed

	@@ -0,0 +1,20 @@


1	+ .fl-animated.fl-fade-in {
2	+ animation: fl-fade-in 1s ease;
3	+ -webkit-animation: fl-fade-in 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-fade-in {
6	+ from {
7	+ opacity: 0;
8	+ }
9	+ to {
10	+ opacity: 1;
11	+ }
12	+ }
13	+ @keyframes fl-fade-in {
14	+ from {
15	+ opacity: 0;
16	+ }
17	+ to {
18	+ opacity: 1;
19	+ }
20	+ }

css/animations/fade-left.css ADDED Viewed

	@@ -0,0 +1,28 @@


1	+ .fl-animated.fl-fade-left {
2	+ animation: fl-fade-left 1s ease;
3	+ -webkit-animation: fl-fade-left 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-fade-left {
6	+ from {
7	+ opacity: 0;
8	+ -webkit-transform: translate3d(-50%, 0, 0);
9	+ transform: translate3d(-50%, 0, 0);
10	+ }
11	+ to {
12	+ opacity: 1;
13	+ -webkit-transform: translate3d(0, 0, 0);
14	+ transform: translate3d(0, 0, 0);
15	+ }
16	+ }
17	+ @keyframes fl-fade-left {
18	+ from {
19	+ opacity: 0;
20	+ -webkit-transform: translate3d(-50%, 0, 0);
21	+ transform: translate3d(-50%, 0, 0);
22	+ }
23	+ to {
24	+ opacity: 1;
25	+ -webkit-transform: translate3d(0, 0, 0);
26	+ transform: translate3d(0, 0, 0);
27	+ }
28	+ }

css/animations/fade-right.css ADDED Viewed

	@@ -0,0 +1,28 @@


1	+ .fl-animated.fl-fade-right {
2	+ animation: fl-fade-right 1s ease;
3	+ -webkit-animation: fl-fade-right 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-fade-right {
6	+ from {
7	+ opacity: 0;
8	+ -webkit-transform: translate3d(50%, 0, 0);
9	+ transform: translate3d(50%, 0, 0);
10	+ }
11	+ to {
12	+ opacity: 1;
13	+ -webkit-transform: translate3d(0, 0, 0);
14	+ transform: translate3d(0, 0, 0);
15	+ }
16	+ }
17	+ @keyframes fl-fade-right {
18	+ from {
19	+ opacity: 0;
20	+ -webkit-transform: translate3d(50%, 0, 0);
21	+ transform: translate3d(50%, 0, 0);
22	+ }
23	+ to {
24	+ opacity: 1;
25	+ -webkit-transform: translate3d(0, 0, 0);
26	+ transform: translate3d(0, 0, 0);
27	+ }
28	+ }

css/animations/fade-up.css ADDED Viewed

	@@ -0,0 +1,28 @@


1	+ .fl-animated.fl-fade-up {
2	+ animation: fl-fade-up 1s ease;
3	+ -webkit-animation: fl-fade-up 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-fade-up {
6	+ from {
7	+ opacity: 0;
8	+ -webkit-transform: translate3d(0, 50%, 0);
9	+ transform: translate3d(0, 50%, 0);
10	+ }
11	+ to {
12	+ opacity: 1;
13	+ -webkit-transform: translate3d(0, 0, 0);
14	+ transform: translate3d(0, 0, 0);
15	+ }
16	+ }
17	+ @keyframes fl-fade-up {
18	+ from {
19	+ opacity: 0;
20	+ -webkit-transform: translate3d(0, 50%, 0);
21	+ transform: translate3d(0, 50%, 0);
22	+ }
23	+ to {
24	+ opacity: 1;
25	+ -webkit-transform: translate3d(0, 0, 0);
26	+ transform: translate3d(0, 0, 0);
27	+ }
28	+ }

css/animations/fancy-flash.css ADDED Viewed

	@@ -0,0 +1,26 @@


1	+ .fl-animated.fl-fancy-flash {
2	+ animation: fl-fancy-flash 1s ease;
3	+ -webkit-animation: fl-fancy-flash 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-fancy-flash {
6	+ from,
7	+ 50%,
8	+ to {
9	+ opacity: 1;
10	+ }
11	+ 25%,
12	+ 75% {
13	+ opacity: 0;
14	+ }
15	+ }
16	+ @keyframes fl-fancy-flash {
17	+ from,
18	+ 50%,
19	+ to {
20	+ opacity: 1;
21	+ }
22	+ 25%,
23	+ 75% {
24	+ opacity: 0;
25	+ }
26	+ }

css/animations/fancy-jack-box.css ADDED Viewed

	@@ -0,0 +1,48 @@


1	+ .fl-animated.fl-fancy-jack-box {
2	+ animation: fl-fancy-jack-box 1s ease;
3	+ -webkit-animation: fl-fancy-jack-box 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-fancy-jack-box {
6	+ from {
7	+ opacity: 0;
8	+ -webkit-transform: scale(0.1) rotate(30deg);
9	+ transform: scale(0.1) rotate(30deg);
10	+ -webkit-transform-origin: center bottom;
11	+ transform-origin: center bottom;
12	+ }
13	+ 50% {
14	+ -webkit-transform: rotate(-10deg);
15	+ transform: rotate(-10deg);
16	+ }
17	+ 70% {
18	+ -webkit-transform: rotate(3deg);
19	+ transform: rotate(3deg);
20	+ }
21	+ to {
22	+ opacity: 1;
23	+ -webkit-transform: scale(1);
24	+ transform: scale(1);
25	+ }
26	+ }
27	+ @keyframes fl-fancy-jack-box {
28	+ from {
29	+ opacity: 0;
30	+ -webkit-transform: scale(0.1) rotate(30deg);
31	+ transform: scale(0.1) rotate(30deg);
32	+ -webkit-transform-origin: center bottom;
33	+ transform-origin: center bottom;
34	+ }
35	+ 50% {
36	+ -webkit-transform: rotate(-10deg);
37	+ transform: rotate(-10deg);
38	+ }
39	+ 70% {
40	+ -webkit-transform: rotate(3deg);
41	+ transform: rotate(3deg);
42	+ }
43	+ to {
44	+ opacity: 1;
45	+ -webkit-transform: scale(1);
46	+ transform: scale(1);
47	+ }
48	+ }

css/animations/fancy-jello.css ADDED Viewed

	@@ -0,0 +1,78 @@


1	+ .fl-animated.fl-fancy-jello {
2	+ animation: fl-fancy-jello 1s ease;
3	+ -webkit-animation: fl-fancy-jello 1s ease;
4	+ transform-origin: center;
5	+ -webkit-transform-origin: center;
6	+ }
7	+ @-webkit-keyframes fl-fancy-jello {
8	+ from,
9	+ 11.1%,
10	+ to {
11	+ -webkit-transform: translate3d(0, 0, 0);
12	+ transform: translate3d(0, 0, 0);
13	+ }
14	+ 22.2% {
15	+ -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
16	+ transform: skewX(-12.5deg) skewY(-12.5deg);
17	+ }
18	+ 33.3% {
19	+ -webkit-transform: skewX(6.25deg) skewY(6.25deg);
20	+ transform: skewX(6.25deg) skewY(6.25deg);
21	+ }
22	+ 44.4% {
23	+ -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
24	+ transform: skewX(-3.125deg) skewY(-3.125deg);
25	+ }
26	+ 55.5% {
27	+ -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
28	+ transform: skewX(1.5625deg) skewY(1.5625deg);
29	+ }
30	+ 66.6% {
31	+ -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
32	+ transform: skewX(-0.78125deg) skewY(-0.78125deg);
33	+ }
34	+ 77.7% {
35	+ -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
36	+ transform: skewX(0.390625deg) skewY(0.390625deg);
37	+ }
38	+ 88.8% {
39	+ -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
40	+ transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
41	+ }
42	+ }
43	+ @keyframes fl-fancy-jello {
44	+ from,
45	+ 11.1%,
46	+ to {
47	+ -webkit-transform: translate3d(0, 0, 0);
48	+ transform: translate3d(0, 0, 0);
49	+ }
50	+ 22.2% {
51	+ -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
52	+ transform: skewX(-12.5deg) skewY(-12.5deg);
53	+ }
54	+ 33.3% {
55	+ -webkit-transform: skewX(6.25deg) skewY(6.25deg);
56	+ transform: skewX(6.25deg) skewY(6.25deg);
57	+ }
58	+ 44.4% {
59	+ -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
60	+ transform: skewX(-3.125deg) skewY(-3.125deg);
61	+ }
62	+ 55.5% {
63	+ -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
64	+ transform: skewX(1.5625deg) skewY(1.5625deg);
65	+ }
66	+ 66.6% {
67	+ -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
68	+ transform: skewX(-0.78125deg) skewY(-0.78125deg);
69	+ }
70	+ 77.7% {
71	+ -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
72	+ transform: skewX(0.390625deg) skewY(0.390625deg);
73	+ }
74	+ 88.8% {
75	+ -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
76	+ transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
77	+ }
78	+ }

css/animations/fancy-light-speed.css ADDED Viewed

	@@ -0,0 +1,48 @@


1	+ .fl-animated.fl-fancy-light-speed {
2	+ animation: fl-fancy-light-speed 1s ease-out;
3	+ -webkit-animation: fl-fancy-light-speed 1s ease-out;
4	+ }
5	+ @-webkit-keyframes fl-fancy-light-speed {
6	+ from {
7	+ -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
8	+ transform: translate3d(100%, 0, 0) skewX(-30deg);
9	+ opacity: 0;
10	+ }
11	+ 60% {
12	+ -webkit-transform: skewX(20deg);
13	+ transform: skewX(20deg);
14	+ opacity: 1;
15	+ }
16	+ 80% {
17	+ -webkit-transform: skewX(-5deg);
18	+ transform: skewX(-5deg);
19	+ opacity: 1;
20	+ }
21	+ to {
22	+ -webkit-transform: translate3d(0, 0, 0);
23	+ transform: translate3d(0, 0, 0);
24	+ opacity: 1;
25	+ }
26	+ }
27	+ @keyframes fl-fancy-light-speed {
28	+ from {
29	+ -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
30	+ transform: translate3d(100%, 0, 0) skewX(-30deg);
31	+ opacity: 0;
32	+ }
33	+ 60% {
34	+ -webkit-transform: skewX(20deg);
35	+ transform: skewX(20deg);
36	+ opacity: 1;
37	+ }
38	+ 80% {
39	+ -webkit-transform: skewX(-5deg);
40	+ transform: skewX(-5deg);
41	+ opacity: 1;
42	+ }
43	+ to {
44	+ -webkit-transform: translate3d(0, 0, 0);
45	+ transform: translate3d(0, 0, 0);
46	+ opacity: 1;
47	+ }
48	+ }

css/animations/fancy-pulse.css ADDED Viewed

	@@ -0,0 +1,32 @@


1	+ .fl-animated.fl-fancy-pulse {
2	+ animation: fl-fancy-pulse 1s ease;
3	+ -webkit-animation: fl-fancy-pulse 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-fancy-pulse {
6	+ from {
7	+ -webkit-transform: scale3d(1, 1, 1);
8	+ transform: scale3d(1, 1, 1);
9	+ }
10	+ 50% {
11	+ -webkit-transform: scale3d(1.05, 1.05, 1.05);
12	+ transform: scale3d(1.05, 1.05, 1.05);
13	+ }
14	+ to {
15	+ -webkit-transform: scale3d(1, 1, 1);
16	+ transform: scale3d(1, 1, 1);
17	+ }
18	+ }
19	+ @keyframes fl-fancy-pulse {
20	+ from {
21	+ -webkit-transform: scale3d(1, 1, 1);
22	+ transform: scale3d(1, 1, 1);
23	+ }
24	+ 50% {
25	+ -webkit-transform: scale3d(1.05, 1.05, 1.05);
26	+ transform: scale3d(1.05, 1.05, 1.05);
27	+ }
28	+ to {
29	+ -webkit-transform: scale3d(1, 1, 1);
30	+ transform: scale3d(1, 1, 1);
31	+ }
32	+ }

css/animations/fancy-roll-in.css ADDED Viewed

	@@ -0,0 +1,28 @@


1	+ .fl-animated.fl-fancy-roll-in {
2	+ animation: fl-fancy-roll-in 1s ease;
3	+ -webkit-animation: fl-fancy-roll-in 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-fancy-roll-in {
6	+ from {
7	+ opacity: 0;
8	+ -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
9	+ transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
10	+ }
11	+ to {
12	+ opacity: 1;
13	+ -webkit-transform: translate3d(0, 0, 0);
14	+ transform: translate3d(0, 0, 0);
15	+ }
16	+ }
17	+ @keyframes fl-fancy-roll-in {
18	+ from {
19	+ opacity: 0;
20	+ -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
21	+ transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
22	+ }
23	+ to {
24	+ opacity: 1;
25	+ -webkit-transform: translate3d(0, 0, 0);
26	+ transform: translate3d(0, 0, 0);
27	+ }
28	+ }

css/animations/fancy-rubber-band.css ADDED Viewed

	@@ -0,0 +1,64 @@


1	+ .fl-animated.fl-fancy-rubber-band {
2	+ animation: fl-fancy-rubber-band 1s ease;
3	+ -webkit-animation: fl-fancy-rubber-band 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-fancy-rubber-band {
6	+ from {
7	+ -webkit-transform: scale3d(1, 1, 1);
8	+ transform: scale3d(1, 1, 1);
9	+ }
10	+ 30% {
11	+ -webkit-transform: scale3d(1.25, 0.75, 1);
12	+ transform: scale3d(1.25, 0.75, 1);
13	+ }
14	+ 40% {
15	+ -webkit-transform: scale3d(0.75, 1.25, 1);
16	+ transform: scale3d(0.75, 1.25, 1);
17	+ }
18	+ 50% {
19	+ -webkit-transform: scale3d(1.15, 0.85, 1);
20	+ transform: scale3d(1.15, 0.85, 1);
21	+ }
22	+ 65% {
23	+ -webkit-transform: scale3d(0.95, 1.05, 1);
24	+ transform: scale3d(0.95, 1.05, 1);
25	+ }
26	+ 75% {
27	+ -webkit-transform: scale3d(1.05, 0.95, 1);
28	+ transform: scale3d(1.05, 0.95, 1);
29	+ }
30	+ to {
31	+ -webkit-transform: scale3d(1, 1, 1);
32	+ transform: scale3d(1, 1, 1);
33	+ }
34	+ }
35	+ @keyframes fl-fancy-rubber-band {
36	+ from {
37	+ -webkit-transform: scale3d(1, 1, 1);
38	+ transform: scale3d(1, 1, 1);
39	+ }
40	+ 30% {
41	+ -webkit-transform: scale3d(1.25, 0.75, 1);
42	+ transform: scale3d(1.25, 0.75, 1);
43	+ }
44	+ 40% {
45	+ -webkit-transform: scale3d(0.75, 1.25, 1);
46	+ transform: scale3d(0.75, 1.25, 1);
47	+ }
48	+ 50% {
49	+ -webkit-transform: scale3d(1.15, 0.85, 1);
50	+ transform: scale3d(1.15, 0.85, 1);
51	+ }
52	+ 65% {
53	+ -webkit-transform: scale3d(0.95, 1.05, 1);
54	+ transform: scale3d(0.95, 1.05, 1);
55	+ }
56	+ 75% {
57	+ -webkit-transform: scale3d(1.05, 0.95, 1);
58	+ transform: scale3d(1.05, 0.95, 1);
59	+ }
60	+ to {
61	+ -webkit-transform: scale3d(1, 1, 1);
62	+ transform: scale3d(1, 1, 1);
63	+ }
64	+ }

css/animations/fancy-shake.css ADDED Viewed

	@@ -0,0 +1,48 @@


1	+ .fl-animated.fl-fancy-shake {
2	+ animation: fl-fancy-shake 1s ease;
3	+ -webkit-animation: fl-fancy-shake 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-fancy-shake {
6	+ from,
7	+ to {
8	+ -webkit-transform: translate3d(0, 0, 0);
9	+ transform: translate3d(0, 0, 0);
10	+ }
11	+ 10%,
12	+ 30%,
13	+ 50%,
14	+ 70%,
15	+ 90% {
16	+ -webkit-transform: translate3d(-10px, 0, 0);
17	+ transform: translate3d(-10px, 0, 0);
18	+ }
19	+ 20%,
20	+ 40%,
21	+ 60%,
22	+ 80% {
23	+ -webkit-transform: translate3d(10px, 0, 0);
24	+ transform: translate3d(10px, 0, 0);
25	+ }
26	+ }
27	+ @keyframes fl-fancy-shake {
28	+ from,
29	+ to {
30	+ -webkit-transform: translate3d(0, 0, 0);
31	+ transform: translate3d(0, 0, 0);
32	+ }
33	+ 10%,
34	+ 30%,
35	+ 50%,
36	+ 70%,
37	+ 90% {
38	+ -webkit-transform: translate3d(-10px, 0, 0);
39	+ transform: translate3d(-10px, 0, 0);
40	+ }
41	+ 20%,
42	+ 40%,
43	+ 60%,
44	+ 80% {
45	+ -webkit-transform: translate3d(10px, 0, 0);
46	+ transform: translate3d(10px, 0, 0);
47	+ }
48	+ }

css/animations/fancy-swing.css ADDED Viewed

	@@ -0,0 +1,50 @@


1	+ .fl-animated.fl-fancy-swing {
2	+ animation: fl-fancy-swing 1s ease;
3	+ -webkit-animation: fl-fancy-swing 1s ease;
4	+ transform-origin: top center;
5	+ -webkit-transform-origin: top center;
6	+ }
7	+ @-webkit-keyframes fl-fancy-swing {
8	+ 20% {
9	+ -webkit-transform: rotate3d(0, 0, 1, 15deg);
10	+ transform: rotate3d(0, 0, 1, 15deg);
11	+ }
12	+ 40% {
13	+ -webkit-transform: rotate3d(0, 0, 1, -10deg);
14	+ transform: rotate3d(0, 0, 1, -10deg);
15	+ }
16	+ 60% {
17	+ -webkit-transform: rotate3d(0, 0, 1, 5deg);
18	+ transform: rotate3d(0, 0, 1, 5deg);
19	+ }
20	+ 80% {
21	+ -webkit-transform: rotate3d(0, 0, 1, -5deg);
22	+ transform: rotate3d(0, 0, 1, -5deg);
23	+ }
24	+ to {
25	+ -webkit-transform: rotate3d(0, 0, 1, 0deg);
26	+ transform: rotate3d(0, 0, 1, 0deg);
27	+ }
28	+ }
29	+ @keyframes fl-fancy-swing {
30	+ 20% {
31	+ -webkit-transform: rotate3d(0, 0, 1, 15deg);
32	+ transform: rotate3d(0, 0, 1, 15deg);
33	+ }
34	+ 40% {
35	+ -webkit-transform: rotate3d(0, 0, 1, -10deg);
36	+ transform: rotate3d(0, 0, 1, -10deg);
37	+ }
38	+ 60% {
39	+ -webkit-transform: rotate3d(0, 0, 1, 5deg);
40	+ transform: rotate3d(0, 0, 1, 5deg);
41	+ }
42	+ 80% {
43	+ -webkit-transform: rotate3d(0, 0, 1, -5deg);
44	+ transform: rotate3d(0, 0, 1, -5deg);
45	+ }
46	+ to {
47	+ -webkit-transform: rotate3d(0, 0, 1, 0deg);
48	+ transform: rotate3d(0, 0, 1, 0deg);
49	+ }
50	+ }

css/animations/fancy-tada.css ADDED Viewed

	@@ -0,0 +1,60 @@


1	+ .fl-animated.fl-fancy-tada {
2	+ animation: fl-fancy-tada 1s ease;
3	+ -webkit-animation: fl-fancy-tada 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-fancy-tada {
6	+ from {
7	+ -webkit-transform: scale3d(1, 1, 1);
8	+ transform: scale3d(1, 1, 1);
9	+ }
10	+ 10%,
11	+ 20% {
12	+ -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
13	+ transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
14	+ }
15	+ 30%,
16	+ 50%,
17	+ 70%,
18	+ 90% {
19	+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
20	+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
21	+ }
22	+ 40%,
23	+ 60%,
24	+ 80% {
25	+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
26	+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
27	+ }
28	+ to {
29	+ -webkit-transform: scale3d(1, 1, 1);
30	+ transform: scale3d(1, 1, 1);
31	+ }
32	+ }
33	+ @keyframes fl-fancy-tada {
34	+ from {
35	+ -webkit-transform: scale3d(1, 1, 1);
36	+ transform: scale3d(1, 1, 1);
37	+ }
38	+ 10%,
39	+ 20% {
40	+ -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
41	+ transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
42	+ }
43	+ 30%,
44	+ 50%,
45	+ 70%,
46	+ 90% {
47	+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
48	+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
49	+ }
50	+ 40%,
51	+ 60%,
52	+ 80% {
53	+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
54	+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
55	+ }
56	+ to {
57	+ -webkit-transform: scale3d(1, 1, 1);
58	+ transform: scale3d(1, 1, 1);
59	+ }
60	+ }

css/animations/fancy-wobble.css ADDED Viewed

	@@ -0,0 +1,64 @@


1	+ .fl-animated.fl-fancy-wobble {
2	+ animation: fl-fancy-wobble 1s ease;
3	+ -webkit-animation: fl-fancy-wobble 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-fancy-wobble {
6	+ from {
7	+ -webkit-transform: translate3d(0, 0, 0);
8	+ transform: translate3d(0, 0, 0);
9	+ }
10	+ 15% {
11	+ -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
12	+ transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
13	+ }
14	+ 30% {
15	+ -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
16	+ transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
17	+ }
18	+ 45% {
19	+ -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
20	+ transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
21	+ }
22	+ 60% {
23	+ -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
24	+ transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
25	+ }
26	+ 75% {
27	+ -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
28	+ transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
29	+ }
30	+ to {
31	+ -webkit-transform: translate3d(0, 0, 0);
32	+ transform: translate3d(0, 0, 0);
33	+ }
34	+ }
35	+ @keyframes fl-fancy-wobble {
36	+ from {
37	+ -webkit-transform: translate3d(0, 0, 0);
38	+ transform: translate3d(0, 0, 0);
39	+ }
40	+ 15% {
41	+ -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
42	+ transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
43	+ }
44	+ 30% {
45	+ -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
46	+ transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
47	+ }
48	+ 45% {
49	+ -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
50	+ transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
51	+ }
52	+ 60% {
53	+ -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
54	+ transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
55	+ }
56	+ 75% {
57	+ -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
58	+ transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
59	+ }
60	+ to {
61	+ -webkit-transform: translate3d(0, 0, 0);
62	+ transform: translate3d(0, 0, 0);
63	+ }
64	+ }

css/animations/flip-horizontal.css ADDED Viewed

	@@ -0,0 +1,62 @@


1	+ .fl-animated.fl-flip-horizontal {
2	+ animation: fl-flip-horizontal 1s ease;
3	+ -webkit-animation: fl-flip-horizontal 1s ease;
4	+ backface-visibility: visible !important;
5	+ -webkit-backface-visibility: visible !important;
6	+ }
7	+ @-webkit-keyframes fl-flip-horizontal {
8	+ from {
9	+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
10	+ transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
11	+ -webkit-animation-timing-function: ease-in;
12	+ animation-timing-function: ease-in;
13	+ opacity: 0;
14	+ }
15	+ 40% {
16	+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
17	+ transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
18	+ -webkit-animation-timing-function: ease-in;
19	+ animation-timing-function: ease-in;
20	+ }
21	+ 60% {
22	+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
23	+ transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
24	+ opacity: 1;
25	+ }
26	+ 80% {
27	+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
28	+ transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
29	+ }
30	+ to {
31	+ -webkit-transform: perspective(400px);
32	+ transform: perspective(400px);
33	+ }
34	+ }
35	+ @keyframes fl-flip-horizontal {
36	+ from {
37	+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
38	+ transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
39	+ -webkit-animation-timing-function: ease-in;
40	+ animation-timing-function: ease-in;
41	+ opacity: 0;
42	+ }
43	+ 40% {
44	+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
45	+ transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
46	+ -webkit-animation-timing-function: ease-in;
47	+ animation-timing-function: ease-in;
48	+ }
49	+ 60% {
50	+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
51	+ transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
52	+ opacity: 1;
53	+ }
54	+ 80% {
55	+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
56	+ transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
57	+ }
58	+ to {
59	+ -webkit-transform: perspective(400px);
60	+ transform: perspective(400px);
61	+ }
62	+ }

css/animations/flip-vertical.css ADDED Viewed

	@@ -0,0 +1,62 @@


1	+ .fl-animated.fl-flip-vertical {
2	+ animation: fl-flip-vertical 1s ease;
3	+ -webkit-animation: fl-flip-vertical 1s ease;
4	+ backface-visibility: visible !important;
5	+ -webkit-backface-visibility: visible !important;
6	+ }
7	+ @-webkit-keyframes fl-flip-vertical {
8	+ from {
9	+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
10	+ transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
11	+ -webkit-animation-timing-function: ease-in;
12	+ animation-timing-function: ease-in;
13	+ opacity: 0;
14	+ }
15	+ 40% {
16	+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
17	+ transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
18	+ -webkit-animation-timing-function: ease-in;
19	+ animation-timing-function: ease-in;
20	+ }
21	+ 60% {
22	+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
23	+ transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
24	+ opacity: 1;
25	+ }
26	+ 80% {
27	+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
28	+ transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
29	+ }
30	+ to {
31	+ -webkit-transform: perspective(400px);
32	+ transform: perspective(400px);
33	+ }
34	+ }
35	+ @keyframes fl-flip-vertical {
36	+ from {
37	+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
38	+ transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
39	+ -webkit-animation-timing-function: ease-in;
40	+ animation-timing-function: ease-in;
41	+ opacity: 0;
42	+ }
43	+ 40% {
44	+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
45	+ transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
46	+ -webkit-animation-timing-function: ease-in;
47	+ animation-timing-function: ease-in;
48	+ }
49	+ 60% {
50	+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
51	+ transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
52	+ opacity: 1;
53	+ }
54	+ 80% {
55	+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
56	+ transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
57	+ }
58	+ to {
59	+ -webkit-transform: perspective(400px);
60	+ transform: perspective(400px);
61	+ }
62	+ }

css/animations/rotate-down-left.css ADDED Viewed

	@@ -0,0 +1,36 @@


1	+ .fl-animated.fl-rotate-down-left {
2	+ animation: fl-rotate-down-left 1s ease;
3	+ -webkit-animation: fl-rotate-down-left 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-rotate-down-left {
6	+ from {
7	+ -webkit-transform-origin: left bottom;
8	+ transform-origin: left bottom;
9	+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
10	+ transform: rotate3d(0, 0, 1, -45deg);
11	+ opacity: 0;
12	+ }
13	+ to {
14	+ -webkit-transform-origin: left bottom;
15	+ transform-origin: left bottom;
16	+ -webkit-transform: translate3d(0, 0, 0);
17	+ transform: translate3d(0, 0, 0);
18	+ opacity: 1;
19	+ }
20	+ }
21	+ @keyframes fl-rotate-down-left {
22	+ from {
23	+ -webkit-transform-origin: left bottom;
24	+ transform-origin: left bottom;
25	+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
26	+ transform: rotate3d(0, 0, 1, -45deg);
27	+ opacity: 0;
28	+ }
29	+ to {
30	+ -webkit-transform-origin: left bottom;
31	+ transform-origin: left bottom;
32	+ -webkit-transform: translate3d(0, 0, 0);
33	+ transform: translate3d(0, 0, 0);
34	+ opacity: 1;
35	+ }
36	+ }

css/animations/rotate-down-right.css ADDED Viewed

	@@ -0,0 +1,36 @@


1	+ .fl-animated.fl-rotate-down-right {
2	+ animation: fl-rotate-down-right 1s ease;
3	+ -webkit-animation: fl-rotate-down-right 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-rotate-down-right {
6	+ from {
7	+ -webkit-transform-origin: right bottom;
8	+ transform-origin: right bottom;
9	+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
10	+ transform: rotate3d(0, 0, 1, 45deg);
11	+ opacity: 0;
12	+ }
13	+ to {
14	+ -webkit-transform-origin: right bottom;
15	+ transform-origin: right bottom;
16	+ -webkit-transform: translate3d(0, 0, 0);
17	+ transform: translate3d(0, 0, 0);
18	+ opacity: 1;
19	+ }
20	+ }
21	+ @keyframes fl-rotate-down-right {
22	+ from {
23	+ -webkit-transform-origin: right bottom;
24	+ transform-origin: right bottom;
25	+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
26	+ transform: rotate3d(0, 0, 1, 45deg);
27	+ opacity: 0;
28	+ }
29	+ to {
30	+ -webkit-transform-origin: right bottom;
31	+ transform-origin: right bottom;
32	+ -webkit-transform: translate3d(0, 0, 0);
33	+ transform: translate3d(0, 0, 0);
34	+ opacity: 1;
35	+ }
36	+ }

css/animations/rotate-in.css ADDED Viewed

	@@ -0,0 +1,36 @@


1	+ .fl-animated.fl-rotate-in {
2	+ animation: fl-rotate-in 1s ease;
3	+ -webkit-animation: fl-rotate-in 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-rotate-in {
6	+ from {
7	+ -webkit-transform-origin: center;
8	+ transform-origin: center;
9	+ -webkit-transform: rotate3d(0, 0, 1, -200deg);
10	+ transform: rotate3d(0, 0, 1, -200deg);
11	+ opacity: 0;
12	+ }
13	+ to {
14	+ -webkit-transform-origin: center;
15	+ transform-origin: center;
16	+ -webkit-transform: translate3d(0, 0, 0);
17	+ transform: translate3d(0, 0, 0);
18	+ opacity: 1;
19	+ }
20	+ }
21	+ @keyframes fl-rotate-in {
22	+ from {
23	+ -webkit-transform-origin: center;
24	+ transform-origin: center;
25	+ -webkit-transform: rotate3d(0, 0, 1, -200deg);
26	+ transform: rotate3d(0, 0, 1, -200deg);
27	+ opacity: 0;
28	+ }
29	+ to {
30	+ -webkit-transform-origin: center;
31	+ transform-origin: center;
32	+ -webkit-transform: translate3d(0, 0, 0);
33	+ transform: translate3d(0, 0, 0);
34	+ opacity: 1;
35	+ }
36	+ }

css/animations/rotate-up-left.css ADDED Viewed

	@@ -0,0 +1,36 @@


1	+ .fl-animated.fl-rotate-up-left {
2	+ animation: fl-rotate-up-left 1s ease;
3	+ -webkit-animation: fl-rotate-up-left 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-rotate-up-left {
6	+ from {
7	+ -webkit-transform-origin: left bottom;
8	+ transform-origin: left bottom;
9	+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
10	+ transform: rotate3d(0, 0, 1, 45deg);
11	+ opacity: 0;
12	+ }
13	+ to {
14	+ -webkit-transform-origin: left bottom;
15	+ transform-origin: left bottom;
16	+ -webkit-transform: translate3d(0, 0, 0);
17	+ transform: translate3d(0, 0, 0);
18	+ opacity: 1;
19	+ }
20	+ }
21	+ @keyframes fl-rotate-up-left {
22	+ from {
23	+ -webkit-transform-origin: left bottom;
24	+ transform-origin: left bottom;
25	+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
26	+ transform: rotate3d(0, 0, 1, 45deg);
27	+ opacity: 0;
28	+ }
29	+ to {
30	+ -webkit-transform-origin: left bottom;
31	+ transform-origin: left bottom;
32	+ -webkit-transform: translate3d(0, 0, 0);
33	+ transform: translate3d(0, 0, 0);
34	+ opacity: 1;
35	+ }
36	+ }

css/animations/rotate-up-right.css ADDED Viewed

	@@ -0,0 +1,36 @@


1	+ .fl-animated.fl-rotate-up-right {
2	+ animation: fl-rotate-up-right 1s ease;
3	+ -webkit-animation: fl-rotate-up-right 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-rotate-up-right {
6	+ from {
7	+ -webkit-transform-origin: right bottom;
8	+ transform-origin: right bottom;
9	+ -webkit-transform: rotate3d(0, 0, 1, -90deg);
10	+ transform: rotate3d(0, 0, 1, -90deg);
11	+ opacity: 0;
12	+ }
13	+ to {
14	+ -webkit-transform-origin: right bottom;
15	+ transform-origin: right bottom;
16	+ -webkit-transform: translate3d(0, 0, 0);
17	+ transform: translate3d(0, 0, 0);
18	+ opacity: 1;
19	+ }
20	+ }
21	+ @keyframes fl-rotate-up-right {
22	+ from {
23	+ -webkit-transform-origin: right bottom;
24	+ transform-origin: right bottom;
25	+ -webkit-transform: rotate3d(0, 0, 1, -90deg);
26	+ transform: rotate3d(0, 0, 1, -90deg);
27	+ opacity: 0;
28	+ }
29	+ to {
30	+ -webkit-transform-origin: right bottom;
31	+ transform-origin: right bottom;
32	+ -webkit-transform: translate3d(0, 0, 0);
33	+ transform: translate3d(0, 0, 0);
34	+ opacity: 1;
35	+ }
36	+ }

css/animations/slide-in-down.css ADDED Viewed

	@@ -0,0 +1,26 @@


1	+ .fl-animated.fl-slide-in-down {
2	+ animation: fl-slide-in-down 1s ease;
3	+ -webkit-animation: fl-slide-in-down 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-slide-in-down {
6	+ from {
7	+ -webkit-transform: translate3d(0, -50%, 0);
8	+ transform: translate3d(0, -50%, 0);
9	+ visibility: visible;
10	+ }
11	+ to {
12	+ -webkit-transform: translate3d(0, 0, 0);
13	+ transform: translate3d(0, 0, 0);
14	+ }
15	+ }
16	+ @keyframes fl-slide-in-down {
17	+ from {
18	+ -webkit-transform: translate3d(0, -50%, 0);
19	+ transform: translate3d(0, -50%, 0);
20	+ visibility: visible;
21	+ }
22	+ to {
23	+ -webkit-transform: translate3d(0, 0, 0);
24	+ transform: translate3d(0, 0, 0);
25	+ }
26	+ }

css/animations/slide-in-left.css ADDED Viewed

	@@ -0,0 +1,26 @@


1	+ .fl-animated.fl-slide-in-left {
2	+ animation: fl-slide-in-left 1s ease;
3	+ -webkit-animation: fl-slide-in-left 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-slide-in-left {
6	+ from {
7	+ -webkit-transform: translate3d(-50%, 0, 0);
8	+ transform: translate3d(-50%, 0, 0);
9	+ visibility: visible;
10	+ }
11	+ to {
12	+ -webkit-transform: translate3d(0, 0, 0);
13	+ transform: translate3d(0, 0, 0);
14	+ }
15	+ }
16	+ @keyframes fl-slide-in-left {
17	+ from {
18	+ -webkit-transform: translate3d(-50%, 0, 0);
19	+ transform: translate3d(-50%, 0, 0);
20	+ visibility: visible;
21	+ }
22	+ to {
23	+ -webkit-transform: translate3d(0, 0, 0);
24	+ transform: translate3d(0, 0, 0);
25	+ }
26	+ }

css/animations/slide-in-right.css ADDED Viewed

	@@ -0,0 +1,26 @@


1	+ .fl-animated.fl-slide-in-right {
2	+ animation: fl-slide-in-right 1s ease;
3	+ -webkit-animation: fl-slide-in-right 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-slide-in-right {
6	+ from {
7	+ -webkit-transform: translate3d(50%, 0, 0);
8	+ transform: translate3d(50%, 0, 0);
9	+ visibility: visible;
10	+ }
11	+ to {
12	+ -webkit-transform: translate3d(0, 0, 0);
13	+ transform: translate3d(0, 0, 0);
14	+ }
15	+ }
16	+ @keyframes fl-slide-in-right {
17	+ from {
18	+ -webkit-transform: translate3d(50%, 0, 0);
19	+ transform: translate3d(50%, 0, 0);
20	+ visibility: visible;
21	+ }
22	+ to {
23	+ -webkit-transform: translate3d(0, 0, 0);
24	+ transform: translate3d(0, 0, 0);
25	+ }
26	+ }

css/animations/slide-in-up.css ADDED Viewed

	@@ -0,0 +1,26 @@


1	+ .fl-animated.fl-slide-in-up {
2	+ animation: fl-slide-in-up 1s ease;
3	+ -webkit-animation: fl-slide-in-up 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-slide-in-up {
6	+ from {
7	+ -webkit-transform: translate3d(0, 50%, 0);
8	+ transform: translate3d(0, 50%, 0);
9	+ visibility: visible;
10	+ }
11	+ to {
12	+ -webkit-transform: translate3d(0, 0, 0);
13	+ transform: translate3d(0, 0, 0);
14	+ }
15	+ }
16	+ @keyframes fl-slide-in-up {
17	+ from {
18	+ -webkit-transform: translate3d(0, 50%, 0);
19	+ transform: translate3d(0, 50%, 0);
20	+ visibility: visible;
21	+ }
22	+ to {
23	+ -webkit-transform: translate3d(0, 0, 0);
24	+ transform: translate3d(0, 0, 0);
25	+ }
26	+ }

css/animations/zoom-down.css ADDED Viewed

	@@ -0,0 +1,36 @@


1	+ .fl-animated.fl-zoom-down {
2	+ animation: fl-zoom-down 1s ease;
3	+ -webkit-animation: fl-zoom-down 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-zoom-down {
6	+ from {
7	+ opacity: 0;
8	+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
9	+ transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
10	+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
11	+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
12	+ }
13	+ 60% {
14	+ opacity: 1;
15	+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
16	+ transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
17	+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
18	+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
19	+ }
20	+ }
21	+ @keyframes fl-zoom-down {
22	+ from {
23	+ opacity: 0;
24	+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
25	+ transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
26	+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
27	+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
28	+ }
29	+ 60% {
30	+ opacity: 1;
31	+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
32	+ transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
33	+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
34	+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
35	+ }
36	+ }

css/animations/zoom-in.css ADDED Viewed

	@@ -0,0 +1,24 @@


1	+ .fl-animated.fl-zoom-in {
2	+ animation: fl-zoom-in 1s ease;
3	+ -webkit-animation: fl-zoom-in 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-zoom-in {
6	+ from {
7	+ opacity: 0;
8	+ -webkit-transform: scale3d(0.3, 0.3, 0.3);
9	+ transform: scale3d(0.3, 0.3, 0.3);
10	+ }
11	+ 50% {
12	+ opacity: 1;
13	+ }
14	+ }
15	+ @keyframes fl-zoom-in {
16	+ from {
17	+ opacity: 0;
18	+ -webkit-transform: scale3d(0.3, 0.3, 0.3);
19	+ transform: scale3d(0.3, 0.3, 0.3);
20	+ }
21	+ 50% {
22	+ opacity: 1;
23	+ }
24	+ }

css/animations/zoom-left.css ADDED Viewed

	@@ -0,0 +1,36 @@


1	+ .fl-animated.fl-zoom-left {
2	+ animation: fl-zoom-left 1s ease;
3	+ -webkit-animation: fl-zoom-left 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-zoom-left {
6	+ from {
7	+ opacity: 0;
8	+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
9	+ transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
10	+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
11	+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
12	+ }
13	+ 60% {
14	+ opacity: 1;
15	+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
16	+ transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
17	+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
18	+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
19	+ }
20	+ }
21	+ @keyframes fl-zoom-left {
22	+ from {
23	+ opacity: 0;
24	+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
25	+ transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
26	+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
27	+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
28	+ }
29	+ 60% {
30	+ opacity: 1;
31	+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
32	+ transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
33	+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
34	+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
35	+ }
36	+ }

css/animations/zoom-right.css ADDED Viewed

	@@ -0,0 +1,36 @@


1	+ .fl-animated.fl-zoom-right {
2	+ animation: fl-zoom-right 1s ease;
3	+ -webkit-animation: fl-zoom-right 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-zoom-right {
6	+ from {
7	+ opacity: 0;
8	+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
9	+ transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
10	+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
11	+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
12	+ }
13	+ 60% {
14	+ opacity: 1;
15	+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
16	+ transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
17	+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
18	+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
19	+ }
20	+ }
21	+ @keyframes fl-zoom-right {
22	+ from {
23	+ opacity: 0;
24	+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
25	+ transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
26	+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
27	+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
28	+ }
29	+ 60% {
30	+ opacity: 1;
31	+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
32	+ transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
33	+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
34	+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
35	+ }
36	+ }

css/animations/zoom-up.css ADDED Viewed

	@@ -0,0 +1,36 @@


1	+ .fl-animated.fl-zoom-up {
2	+ animation: fl-zoom-up 1s ease;
3	+ -webkit-animation: fl-zoom-up 1s ease;
4	+ }
5	+ @-webkit-keyframes fl-zoom-up {
6	+ from {
7	+ opacity: 0;
8	+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
9	+ transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
10	+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
11	+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
12	+ }
13	+ 60% {
14	+ opacity: 1;
15	+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
16	+ transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
17	+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
18	+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
19	+ }
20	+ }
21	+ @keyframes fl-zoom-up {
22	+ from {
23	+ opacity: 0;
24	+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
25	+ transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
26	+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
27	+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
28	+ }
29	+ 60% {
30	+ opacity: 1;
31	+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
32	+ transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
33	+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
34	+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
35	+ }
36	+ }

css/build/builder.bundle.css CHANGED Viewed

	@@ -84,7 +84,9 @@
84	border-color: rgba(255, 255, 255, 0.4);
85	box-shadow: none; }
86	.fl-inline-editor .mce-toolbar .mce-btn button {
87	- padding: 1px; }


88	.fl-inline-editor .mce-toolbar .mce-btn .mce-ico {
89	color: rgba(255, 255, 255, 0.8) !important; }
90	.fl-inline-editor .mce-toolbar .mce-btn:hover .mce-ico {
	@@ -104,13 +106,14 @@
104	display: none !important; }
105	.fl-notifications-panel {
106	position: fixed;
107	- top: ~~48px~~;

108	left: 0;
109	bottom: 0;
110	width: 380px;
111	background: #F5F7F9;
112	color: #555555;
113	- border-right: ~~2px~~ solid #d5dadd;
114	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
115	font-size: 14px;
116	z-index: 999999;
	@@ -163,6 +166,11 @@
163
164	.fl-builder-has-new-notifications #bell-active-dot {
165	visibility: visible; }





166	/**
167	* This file is just here for demonstration purposes while we get
168	* our Webpack workflow going. In the future styles should probably


84	border-color: rgba(255, 255, 255, 0.4);
85	box-shadow: none; }
86	.fl-inline-editor .mce-toolbar .mce-btn button {
87	+ padding: 1px;
88	+ background: transparent;
89	+ border: none; }
90	.fl-inline-editor .mce-toolbar .mce-btn .mce-ico {
91	color: rgba(255, 255, 255, 0.8) !important; }
92	.fl-inline-editor .mce-toolbar .mce-btn:hover .mce-ico {

106	display: none !important; }
107	.fl-notifications-panel {
108	position: fixed;
109	+ top: calc( 44px + 1px);
110	+ /* top bar plus border */
111	left: 0;
112	bottom: 0;
113	width: 380px;
114	background: #F5F7F9;
115	color: #555555;
116	+ border-right: 1px solid #d5dadd;
117	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
118	font-size: 14px;
119	z-index: 999999;

166
167	.fl-builder-has-new-notifications #bell-active-dot {
168	visibility: visible; }
169	+ svg.fl-symbol {
170	+ flex: 0 0 auto; }
171	+
172	+ svg#fl-symbol-container {
173	+ display: none; }
174	/**
175	* This file is just here for demonstration purposes while we get
176	* our Webpack workflow going. In the future styles should probably

css/build/builder.bundle.min.css CHANGED Viewed

@@ -1 +1 @@

- .fl-editable{position:relative;-webkit-user-select:text}.fl-editable .mce-content-body,.fl-editable .mce-content-body *{cursor:text}.fl-editable .mce-content-body:not(.mce-edit-focus):empty{height:0}.fl-editable .mce-content-body:not(.mce-edit-focus) [data-mce-selected]{background:none}.fl-editable .mce-content-body,.fl-editable .mce-content-body:focus,.fl-editable .mce-edit-focus{outline:none!important}.fl-editable-focused.fl-module{cursor:pointer}.fl-editable-focused .fl-block-overlay{pointer-events:none}.fl-editable-focused .fl-block-col-resize,.fl-editable-focused .fl-block-overlay-actions{pointer-events:auto}.fl-inline-editor{border:2px solid #00a0d2;border-radius:4px;display:none;overflow:hidden;pointer-events:none;position:absolute;top:-32px;right:4px;bottom:4px;left:4px;z-index:100008}.fl-inline-editor.fl-inline-editor-no-toolbar{top:4px}.fl-inline-editor.fl-inline-editor-no-toolbar>.mce-tinymce{display:none}.fl-inline-editor>.mce-tinymce.fl-inline-editor-active-toolbar{display:block!important}.fl-inline-editor>.mce-tinymce{background:transparent;border:none!important;overflow:hidden;pointer-events:auto;position:absolute;top:-2px!important;right:-2px!important;left:-2px!important;width:auto!important}.fl-inline-editor .mce-container-body,.fl-inline-editor .mce-tinymce,.fl-inline-editor .mce-toolbar-grp{height:32px!important;width:auto!important}.fl-inline-editor .mce-container-body{padding:0}.fl-inline-editor .mce-toolbar-grp{background:#00a0d2;border:none;border-top-left-radius:4px;border-bottom-right-radius:4px;width:auto!important;display:inline-block}.fl-inline-editor .mce-tinymce-inline .mce-flow-layout{white-space:normal}.fl-inline-editor .mce-btn-group{padding:0 3px}.fl-inline-editor .mce-btn-group:not(:first-child){border-color:hsla(0,0%,100%,.3)}.fl-inline-editor .mce-toolbar .mce-btn-group .mce-btn.mce-active,.fl-inline-editor .mce-toolbar .mce-btn-group .mce-btn.mce-active:focus,.fl-inline-editor .mce-toolbar .mce-btn-group .mce-btn.mce-active:hover,.fl-inline-editor .mce-toolbar .mce-btn-group .mce-btn:active,.fl-inline-editor .mce-toolbar .mce-btn-group .mce-btn:focus,.fl-inline-editor .mce-toolbar .mce-btn-group .mce-btn:hover{background:hsla(0,0%,100%,.2);border-color:hsla(0,0%,100%,.4);box-shadow:none}.fl-inline-editor .mce-toolbar .mce-btn button{padding:1px}.fl-inline-editor .mce-toolbar .mce-btn .mce-ico{color:hsla(0,0%,100%,.8)!important}.fl-inline-editor .mce-toolbar .mce-btn:hover .mce-ico{color:#fff!important}.fl-inline-editor .mce-panel .mce-btn i.mce-caret{border-top-color:hsla(0,0%,100%,.8)!important;border-bottom-color:hsla(0,0%,100%,.8)!important}.fl-inline-editor .mce-panel .mce-btn:hover i.mce-caret{border-top-color:#fff!important}.fl-heading-text.mce-content-body{display:block}.mce-tooltip{display:none!important}.fl-notifications-panel{position:fixed;top:~~48px~~;left:0;bottom:0;width:380px;background:#f5f7f9;color:#555;border-right:~~2px~~ solid #d5dadd;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif!important;font-size:14px;z-index:999999;display:flex;flex-direction:column}.fl-notifications-panel .fl-nanoscroller .fl-nanoscroller-content{padding:0 15px}.fl-notifications-panel .fl-panel-title{flex:0 0 auto;padding:15px 30px;font-size:18px}.fl-notifications-panel .fl-builder-ui-post{flex:0 0 auto;display:flex;display:block;padding:15px;margin:15px 0;border-radius:4px;text-decoration:none;color:inherit}.fl-notifications-panel .fl-builder-ui-post:first-child{margin-top:0}.fl-notifications-panel .fl-builder-ui-post:hover{text-decoration:none;background:#fff;color:#000}.fl-notifications-panel .fl-builder-ui-post .fl-builder-ui-post-title{font-size:17px;line-height:1.4;margin-bottom:10px;color:#0089b4}.fl-notifications-panel .fl-builder-ui-post .fl-builder-ui-post-date{text-transform:uppercase;font-size:12px;font-weight:700;margin-bottom:10px}.fl-notifications-panel .fl-panel-loading-message{padding:0 15px;align-items:center;justify-content:center;display:flex;height:100%}.fl-builder-bar-spacer{flex:1 1 100%}#bell-active-dot{visibility:hidden}.fl-builder-has-new-notifications #bell-active-dot{visibility:visible}

+ .fl-editable{position:relative;-webkit-user-select:text}.fl-editable .mce-content-body,.fl-editable .mce-content-body *{cursor:text}.fl-editable .mce-content-body:not(.mce-edit-focus):empty{height:0}.fl-editable .mce-content-body:not(.mce-edit-focus) [data-mce-selected]{background:none}.fl-editable .mce-content-body,.fl-editable .mce-content-body:focus,.fl-editable .mce-edit-focus{outline:none!important}.fl-editable-focused.fl-module{cursor:pointer}.fl-editable-focused .fl-block-overlay{pointer-events:none}.fl-editable-focused .fl-block-col-resize,.fl-editable-focused .fl-block-overlay-actions{pointer-events:auto}.fl-inline-editor{border:2px solid #00a0d2;border-radius:4px;display:none;overflow:hidden;pointer-events:none;position:absolute;top:-32px;right:4px;bottom:4px;left:4px;z-index:100008}.fl-inline-editor.fl-inline-editor-no-toolbar{top:4px}.fl-inline-editor.fl-inline-editor-no-toolbar>.mce-tinymce{display:none}.fl-inline-editor>.mce-tinymce.fl-inline-editor-active-toolbar{display:block!important}.fl-inline-editor>.mce-tinymce{background:transparent;border:none!important;overflow:hidden;pointer-events:auto;position:absolute;top:-2px!important;right:-2px!important;left:-2px!important;width:auto!important}.fl-inline-editor .mce-container-body,.fl-inline-editor .mce-tinymce,.fl-inline-editor .mce-toolbar-grp{height:32px!important;width:auto!important}.fl-inline-editor .mce-container-body{padding:0}.fl-inline-editor .mce-toolbar-grp{background:#00a0d2;border:none;border-top-left-radius:4px;border-bottom-right-radius:4px;width:auto!important;display:inline-block}.fl-inline-editor .mce-tinymce-inline .mce-flow-layout{white-space:normal}.fl-inline-editor .mce-btn-group{padding:0 3px}.fl-inline-editor .mce-btn-group:not(:first-child){border-color:hsla(0,0%,100%,.3)}.fl-inline-editor .mce-toolbar .mce-btn-group .mce-btn.mce-active,.fl-inline-editor .mce-toolbar .mce-btn-group .mce-btn.mce-active:focus,.fl-inline-editor .mce-toolbar .mce-btn-group .mce-btn.mce-active:hover,.fl-inline-editor .mce-toolbar .mce-btn-group .mce-btn:active,.fl-inline-editor .mce-toolbar .mce-btn-group .mce-btn:focus,.fl-inline-editor .mce-toolbar .mce-btn-group .mce-btn:hover{background:hsla(0,0%,100%,.2);border-color:hsla(0,0%,100%,.4);box-shadow:none}.fl-inline-editor .mce-toolbar .mce-btn button{padding:1px;background:transparent;border:none}.fl-inline-editor .mce-toolbar .mce-btn .mce-ico{color:hsla(0,0%,100%,.8)!important}.fl-inline-editor .mce-toolbar .mce-btn:hover .mce-ico{color:#fff!important}.fl-inline-editor .mce-panel .mce-btn i.mce-caret{border-top-color:hsla(0,0%,100%,.8)!important;border-bottom-color:hsla(0,0%,100%,.8)!important}.fl-inline-editor .mce-panel .mce-btn:hover i.mce-caret{border-top-color:#fff!important}.fl-heading-text.mce-content-body{display:block}.mce-tooltip{display:none!important}.fl-notifications-panel{position:fixed;top:45px;left:0;bottom:0;width:380px;background:#f5f7f9;color:#555;border-right:1px solid #d5dadd;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif!important;font-size:14px;z-index:999999;display:flex;flex-direction:column}.fl-notifications-panel .fl-nanoscroller .fl-nanoscroller-content{padding:0 15px}.fl-notifications-panel .fl-panel-title{flex:0 0 auto;padding:15px 30px;font-size:18px}.fl-notifications-panel .fl-builder-ui-post{flex:0 0 auto;display:flex;display:block;padding:15px;margin:15px 0;border-radius:4px;text-decoration:none;color:inherit}.fl-notifications-panel .fl-builder-ui-post:first-child{margin-top:0}.fl-notifications-panel .fl-builder-ui-post:hover{text-decoration:none;background:#fff;color:#000}.fl-notifications-panel .fl-builder-ui-post .fl-builder-ui-post-title{font-size:17px;line-height:1.4;margin-bottom:10px;color:#0089b4}.fl-notifications-panel .fl-builder-ui-post .fl-builder-ui-post-date{text-transform:uppercase;font-size:12px;font-weight:700;margin-bottom:10px}.fl-notifications-panel .fl-panel-loading-message{padding:0 15px;align-items:center;justify-content:center;display:flex;height:100%}.fl-builder-bar-spacer{flex:1 1 100%}#bell-active-dot{visibility:hidden}.fl-builder-has-new-notifications #bell-active-dot{visibility:visible}svg.fl-symbol{flex:0 0 auto}svg#fl-symbol-container{display:none}

css/editor.css CHANGED Viewed

@@ -1,3 +1,8 @@
             * {
             	line-height: 1.3em;
-            -
            }


1	* {
2	line-height: 1.3em;
3	+ }
4	+ body {
5	+ margin: 16px 20px;
6	+ margin-right: 30px; /* dodge field connections toggle */
7	+ font-family: system-ui, ---apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
8	+ }

css/fl-builder-layout.css CHANGED Viewed

@@ -158,6 +158,7 @@
             /* Row Bg Overlay */
             .fl-row-bg-overlay .fl-row-content-wrap:after {
             	content: '';
             	display: block;
             	position: absolute;
@@ -173,7 +174,8 @@
+            }
             /* Full Height Rows */
-            -
            .fl-row-full-height .fl-row-content-wrap {
             	display: -webkit-box;
             	display: -webkit-flex;
             	display: -ms-flexbox;
@@ -181,45 +183,56 @@
             	min-height: 100vh;
+            }
             .fl-builder-edit .fl-row-full-height .fl-row-content-wrap {
             	min-height: calc( 100vh - 48px );
+            }
-            -
            .fl-row-full-height .fl-row-content {
               -webkit-box-flex: 1 1 auto;
               	 -moz-box-flex: 1 1 auto;
               	  -webkit-flex: 1 1 auto;
               		  -ms-flex: 1 1 auto;
               			  flex: 1 1 auto;
+            }
-            -
            .fl-row-full-height .fl-row-full-width.fl-row-content {
             	max-width: 100%;
             	width: 100%;
+            }
             /* IE 11 - Row full height - vertical alignment center/bottom fix */
-            -
            .fl-builder-ie-11 .fl-row.fl-row-full-height:not(.fl-visible-medium):not(.fl-visible-medium-mobile):not(.fl-visible-mobile) {
             	display: flex;
             	flex-direction: column;
             	height: 100%;
+            }
             /* Stupid IE Full Height Row Fixes */
-            -
            .fl-builder-ie-11 .fl-row-full-height .fl-row-content-wrap {
             	height: auto;
+            }
-            -
            .fl-builder-ie-11 .fl-row-full-height .fl-row-content {
             	flex: 0 0 auto;
             	flex-basis: 100%;
             	margin: 0;
+            }
             .fl-builder-ie-11 .fl-row-full-height.fl-row-align-top .fl-row-content,
-            -
            .fl-builder-ie-11 .fl-row-full-height.fl-row-align-bottom .fl-row-content {
                 margin: 0 auto;
+            }
-            -
            .fl-builder-ie-11 .fl-row-full-height.fl-row-align-center .fl-col-group:not(.fl-col-group-equal-height) {
             	display: flex;
             	align-items: center;
             	justify-content: center;
@@ -232,7 +245,8 @@
+            }
             /* Full height align center */
-            -
            .fl-row-full-height.fl-row-align-center .fl-row-content-wrap {
             	align-items: center;
             	justify-content: center;
             	-webkit-align-items: center;
@@ -244,7 +258,8 @@
+            }
             /* Full height align bottom */
-            -
            .fl-row-full-height.fl-row-align-bottom .fl-row-content-wrap {
             	align-items: flex-end;
             	justify-content: flex-end;
             	-webkit-align-items: flex-end;
@@ -256,7 +271,8 @@
+            }
             /* IE 11 - height bottom > row align bottom - center fix */
-            -
            .fl-builder-ie-11 .fl-row-full-height.fl-row-align-bottom .fl-row-content-wrap {
             	justify-content: flex-start;
             	-webkit-justify-content: flex-start;
+            }
@@ -379,6 +395,7 @@
             	position: relative;
+            }
             .fl-col-bg-overlay .fl-col-content:after {
             	content: '';
             	display: block;
             	position: absolute;
@@ -480,9 +497,13 @@
+            }
             .fl-icon i {
             	float: left;
+            }
             .fl-icon i:before {
             	border: none !important;
+            }
             .fl-icon-text {
             	display: table-cell;
@@ -490,6 +511,9 @@
             	padding-left: 15px;
             	vertical-align: middle;
+            }
             .fl-icon-text *:last-child {
             	margin: 0 !important;
             	padding: 0 !important;
@@ -497,6 +521,12 @@
             .fl-icon-text a {
             	text-decoration: none;
+            }
             /* Photos
             ------------------------------------------------------ */
@@ -700,106 +730,14 @@ img.mfp-img {
             .fl-animation {
             	opacity: 0;
+            }
-            -
            .fl-builder-mobile .fl-animation,
-            -
            .fl-builder-edit .fl-animation,
             .fl-builder-preview .fl-animation,
             .fl-animated {
             	opacity: 1;
+            }
-            -
-            -
            /* Fade In */
-            -
            .fl-animated.fl-fade-in {
-            -
            	animation: fl-fade-in 1s ease-out;
-            -
            	-webkit-animation: fl-fade-in 1s ease-out;
-            -
            	-moz-animation: fl-fade-in 1s ease-out;
-            -
            }
-            -
            @keyframes fl-fade-in {
-            -
            	0% { opacity: 0; }
-            -
            	100% { opacity: 1; }
-            -
            }
-            -
            @-webkit-keyframes fl-fade-in {
-            -
            	0% { opacity: 0; }
-            -
            	100% { opacity: 1; }
-            -
            }
-            -
            @-moz-keyframes fl-fade-in {
-            -
            	0% { opacity: 0; }
-            -
            	100% { opacity: 1; }
-            -
            }
-            -
-            -
            /* Slide Left */
-            -
            .fl-animated.fl-slide-left {
-            -
            	animation: fl-slide-left 1s ease-out;
-            -
            	-webkit-animation: fl-slide-left 1s ease-out;
-            -
            	-moz-animation: fl-slide-left 1s ease-out;
-            -
            }
-            -
            @keyframes fl-slide-left {
-            -
            	0% { opacity: 0; transform: translateX(10%); }
-            -
            	100% { opacity: 1; transform: translateX(0%); }
-            -
            }
-            -
            @-webkit-keyframes fl-slide-left {
-            -
            	0% { opacity: 0; -webkit-transform: translateX(10%); }
-            -
            	100% { opacity: 1; -webkit-transform: translateX(0%); }
-            -
            }
-            -
            @-moz-keyframes fl-slide-left {
-            -
            	0% { opacity: 0; -moz-transform: translateX(10%); }
-            -
            	100% { opacity: 1; -moz-transform: translateX(0%); }
-            -
            }
-            -
-            -
            /* Slide Right */
-            -
            .fl-animated.fl-slide-right {
-            -
            	animation: fl-slide-right 1s ease-out;
-            -
            	-webkit-animation: fl-slide-right 1s ease-out;
-            -
            	-moz-animation: fl-slide-right 1s ease-out;
-            -
            }
-            -
            @keyframes fl-slide-right {
-            -
            	0% { opacity: 0; transform: translateX(-10%); }
-            -
            	100% { opacity: 1; transform: translateX(0%); }
-            -
            }
-            -
            @-webkit-keyframes fl-slide-right {
-            -
            	0% { opacity: 0; -webkit-transform: translateX(-10%); }
-            -
            	100% { opacity: 1; -webkit-transform: translateX(0%); }
-            -
            }
-            -
            @-moz-keyframes fl-slide-right {
-            -
            	0% { opacity: 0; -moz-transform: translateX(-10%); }
-            -
            	100% { opacity: 1; -moz-transform: translateX(0%); }
-            -
            }
-            -
-            -
            /* Slide Up */
-            -
            .fl-animated.fl-slide-up {
-            -
            	animation: fl-slide-up 1s ease-out;
-            -
            	-webkit-animation: fl-slide-up 1s ease-out;
-            -
            	-moz-animation: fl-slide-up 1s ease-out;
-            -
            }
-            -
            @keyframes fl-slide-up {
-            -
            	0% { opacity: 0; transform: translateY(10%); }
-            -
            	100% { opacity: 1; transform: translateY(0%); }
-            -
            }
-            -
            @-webkit-keyframes fl-slide-up {
-            -
            	0% { opacity: 0; -webkit-transform: translateY(10%); }
-            -
            	100% { opacity: 1; -webkit-transform: translateY(0%); }
-            -
            }
-            -
            @-moz-keyframes fl-slide-up {
-            -
            	0% { opacity: 0; -moz-transform: translateY(10%); }
-            -
            	100% { opacity: 1; -moz-transform: translateY(0%); }
-            -
            }
-            -
-            -
            /* Slide Down */
-            -
            .fl-animated.fl-slide-down {
-            -
            	animation: fl-slide-down 1s ease-out;
-            -
            	-webkit-animation: fl-slide-down 1s ease-out;
-            -
            	-moz-animation: fl-slide-down 1s ease-out;
-            -
            }
-            -
            @keyframes fl-slide-down {
-            -
            	0% { opacity: 0; transform: translateY(-10%); }
-            -
            	100% { opacity: 1; transform: translateY(0%); }
-            -
            }
-            -
            @-webkit-keyframes fl-slide-down {
-            -
            	0% { opacity: 0; -webkit-transform: translateY(-10%); }
-            -
            	100% { opacity: 1; -webkit-transform: translateY(0%); }
-            -
            }
-            -
            @-moz-keyframes fl-slide-down {
-            -
            	0% { opacity: 0; -moz-transform: translateY(-10%); }
-            -
            	100% { opacity: 1; -moz-transform: translateY(0%); }
+            }
             /* Button Icon Animation */
@@ -834,3 +772,51 @@ img.mfp-img {
             .single:not(.woocommerce).single-fl-builder-template .fl-content {
             	width: 100%;
+            }


158
159	/* Row Bg Overlay */
160	.fl-row-bg-overlay .fl-row-content-wrap:after {
161	+ border-radius: inherit;
162	content: '';
163	display: block;
164	position: absolute;

174	}
175
176	/* Full Height Rows */
177	+ .fl-row-full-height .fl-row-content-wrap,
178	+ .fl-row-custom-height .fl-row-content-wrap {
179	display: -webkit-box;
180	display: -webkit-flex;
181	display: -ms-flexbox;

183	min-height: 100vh;
184
185	}
186	+ .fl-row-custom-height .fl-row-content-wrap {
187	+ min-height: 0;
188	+ }
189	.fl-builder-edit .fl-row-full-height .fl-row-content-wrap {
190	min-height: calc( 100vh - 48px );
191	}
192	+ .fl-row-full-height .fl-row-content,
193	+ .fl-row-custom-height .fl-row-content {
194	-webkit-box-flex: 1 1 auto;
195	-moz-box-flex: 1 1 auto;
196	-webkit-flex: 1 1 auto;
197	-ms-flex: 1 1 auto;
198	flex: 1 1 auto;
199	}
200	+ .fl-row-full-height .fl-row-full-width.fl-row-content,
201	+ .fl-row-custom-height .fl-row-full-width.fl-row-content {
202	max-width: 100%;
203	width: 100%;
204	}
205
206	/* IE 11 - Row full height - vertical alignment center/bottom fix */
207	+ .fl-builder-ie-11 .fl-row.fl-row-full-height:not(.fl-visible-medium):not(.fl-visible-medium-mobile):not(.fl-visible-mobile),
208	+ .fl-builder-ie-11 .fl-row.fl-row-custom-height:not(.fl-visible-medium):not(.fl-visible-medium-mobile):not(.fl-visible-mobile) {
209	display: flex;
210	flex-direction: column;
211	height: 100%;
212	}
213
214	/* Stupid IE Full Height Row Fixes */
215	+ .fl-builder-ie-11 .fl-row-full-height .fl-row-content-wrap,
216	+ .fl-builder-ie-11 .fl-row-custom-height .fl-row-content-wrap {
217	height: auto;
218	}
219
220	+ .fl-builder-ie-11 .fl-row-full-height .fl-row-content,
221	+ .fl-builder-ie-11 .fl-row-custom-height .fl-row-content {
222	flex: 0 0 auto;
223	flex-basis: 100%;
224	margin: 0;
225	}
226
227	.fl-builder-ie-11 .fl-row-full-height.fl-row-align-top .fl-row-content,
228	+ .fl-builder-ie-11 .fl-row-full-height.fl-row-align-bottom .fl-row-content,
229	+ .fl-builder-ie-11 .fl-row-custom-height.fl-row-align-top .fl-row-content,
230	+ .fl-builder-ie-11 .fl-row-custom-height.fl-row-align-bottom .fl-row-content, {
231	margin: 0 auto;
232	}
233
234	+ .fl-builder-ie-11 .fl-row-full-height.fl-row-align-center .fl-col-group:not(.fl-col-group-equal-height),
235	+ .fl-builder-ie-11 .fl-row-custom-height.fl-row-align-center .fl-col-group:not(.fl-col-group-equal-height) {
236	display: flex;
237	align-items: center;
238	justify-content: center;

245	}
246
247	/* Full height align center */
248	+ .fl-row-full-height.fl-row-align-center .fl-row-content-wrap,
249	+ .fl-row-custom-height.fl-row-align-center .fl-row-content-wrap {
250	align-items: center;
251	justify-content: center;
252	-webkit-align-items: center;

258	}
259
260	/* Full height align bottom */
261	+ .fl-row-full-height.fl-row-align-bottom .fl-row-content-wrap,
262	+ .fl-row-custom-height.fl-row-align-bottom .fl-row-content-wrap {
263	align-items: flex-end;
264	justify-content: flex-end;
265	-webkit-align-items: flex-end;

271	}
272
273	/* IE 11 - height bottom > row align bottom - center fix */
274	+ .fl-builder-ie-11 .fl-row-full-height.fl-row-align-bottom .fl-row-content-wrap,
275	+ .fl-builder-ie-11 .fl-row-custom-height.fl-row-align-bottom .fl-row-content-wrap {
276	justify-content: flex-start;
277	-webkit-justify-content: flex-start;
278	}

395	position: relative;
396	}
397	.fl-col-bg-overlay .fl-col-content:after {
398	+ border-radius: inherit;
399	content: '';
400	display: block;
401	position: absolute;

497	}
498	.fl-icon i {
499	float: left;
500	+ height: auto;
501	+ width: auto;
502	}
503	.fl-icon i:before {
504	border: none !important;
505	+ height: auto;
506	+ width: auto;
507	}
508	.fl-icon-text {
509	display: table-cell;

511	padding-left: 15px;
512	vertical-align: middle;
513	}
514	+ .fl-icon-text-empty {
515	+ display: none;
516	+ }
517	.fl-icon-text *:last-child {
518	margin: 0 !important;
519	padding: 0 !important;

521	.fl-icon-text a {
522	text-decoration: none;
523	}
524	+ .fl-icon-text span {
525	+ display: block;
526	+ }
527	+ .fl-icon-text span.mce-edit-focus {
528	+ min-width: 1px;
529	+ }
530
531	/* Photos
532	------------------------------------------------------ */

730	.fl-animation {
731	opacity: 0;
732	}


733	.fl-builder-preview .fl-animation,
734	+ .fl-builder-edit .fl-animation,
735	.fl-animated {
736	opacity: 1;
737	}
738	+ .fl-animated {
739	+ animation-fill-mode: both;
740	+ -webkit-animation-fill-mode: both;



























































































741	}
742
743	/* Button Icon Animation */

772	.single:not(.woocommerce).single-fl-builder-template .fl-content {
773	width: 100%;
774	}
775	+
776	+ /* Shapes & Patterns
777	+ ------------------------------------------------------- */
778	+ .fl-builder-layer {
779	+ position: absolute;
780	+ top:0;
781	+ left:0;
782	+ right: 0;
783	+ bottom: 0;
784	+ z-index: 0;
785	+ pointer-events: none;
786	+ overflow: hidden;
787	+ }
788	+ .fl-builder-shape-layer {
789	+ z-index: 0;
790	+ }
791	+ .fl-builder-shape-layer.fl-builder-bottom-edge-layer {
792	+ z-index: 1;
793	+ }
794	+ .fl-row-bg-overlay .fl-builder-shape-layer {
795	+ z-index: 1;
796	+ }
797	+ .fl-row-bg-overlay .fl-builder-shape-layer.fl-builder-bottom-edge-layer {
798	+ z-index: 2;
799	+ }
800	+ .fl-row-has-layers .fl-row-content {
801	+ z-index: 1;
802	+ }
803	+ .fl-row-bg-overlay .fl-row-content {
804	+ z-index: 2;
805	+ }
806	+
807	+ .fl-builder-layer > * {
808	+ display: block;
809	+ position: absolute;
810	+ top:0;
811	+ left:0;
812	+ width: 100%;
813	+ }
814	+ .fl-builder-layer + .fl-row-content {
815	+ position: relative;
816	+ }
817	+ .fl-builder-layer .fl-shape {
818	+ fill: #aaa;
819	+ stroke: none;
820	+ stroke-width: 0;
821	+ width:100%;
822	+ }

css/fl-builder-rtl.css CHANGED Viewed

@@ -23,6 +23,17 @@
             	right: auto;
+            }
             /* Settings Forms
             ------------------------------------------------------ */
@@ -33,23 +44,8 @@
             .fl-form-table th {
             	text-align: right !important;
+            }
-            -
-            -
            /* Icon Fields
-            -
            ------------------------------------------------------ */
-            -
-            -
            .fl-icon-field .fl-icon-preview i {
-            -
            	margin: 10px 2px 9px 10px;
-            -
            }
-            -
-            -
            /* Icon Selector
-            -
            ------------------------------------------------------ */
-            -
-            -
            .fl-icons-filter {
-            -
            	left: 10px;
-            -
            	right: auto;
-            -
            }
-            -
            .fl-icons-section h2 {
-            -
            	text-align: right;
+            }
             /* Tooltips
@@ -57,7 +53,7 @@
             .fl-help-tooltip-text {
             	left: auto;
-            -
            	right: 23px;
+            }
             /* Tour
@@ -85,17 +81,47 @@
             	left: 10px;
+            }
-            -
            /* Nano Scroller
             ------------------------------------------------------ */
-            -
            .fl-nanoscroller > .fl-nanoscroller-pane {
-            -
                right: auto;
-            -
                left: 2px;
+            }
-            -
            /* Color Picker
             ------------------------------------------------------ */
             .fl-color-picker-preset-add {
                 right: auto;
                 left: 8px;
@@ -138,7 +164,105 @@ ul.as-selections li {
                 float: right;
+            }
-            -
            /* 2.0 RTL Updates ----------------------------- */
             .fl-builder-panel-drag-handle {
             	right: 10px;
             	left: auto;
@@ -183,10 +307,6 @@ ul.as-selections li {
             	padding-top: 6px;
+            }
-            -
            .fl-nanoscroller-content {
-            -
            	right: 17px !important;
-            -
            }
-            -
             .fl-builder-block-visual.fl-cols-visual .fl-cols-visual-col:first-child {
             	margin-right: 0!important;
             	margin-left: 2px!important;
@@ -281,11 +401,6 @@ ul.as-selections li {
             	float: right;
+            }
-            -
            .fl-nanoscroller > .fl-nanoscroller-pane {
-            -
            	right: 2px;
-            -
            	left: auto;
-            -
            }
-            -
             .fl-builder-bar-title {
             	border-right: none;
             	border-left: 2px solid #D5DADD;
@@ -345,6 +460,9 @@ ul.as-selections li {
             	padding-right: 10px;
             	padding-left: 15px;
+            }
             .fl-photo-field .fl-photo-preview select {
             	margin: 8px 10px 8px 0;
+            }


23	right: auto;
24	}
25
26	+ /* Preview Iframe
27	+ ------------------------------------------------------ */
28	+
29	+ #fl-builder-preview-frame {
30	+ left: 0;
31	+ right: 50%;
32	+ transform: translateX(50%);
33	+ -moz-transform: translateX(50%);
34	+ -webkit-transform: translateX(50%);
35	+ }
36	+
37	/* Settings Forms
38	------------------------------------------------------ */
39

44	.fl-form-table th {
45	text-align: right !important;
46	}
47	+ .fl-lightbox-width-slim .fl-form-table {
48	+ margin-right: auto !important;















49	}
50
51	/* Tooltips

53
54	.fl-help-tooltip-text {
55	left: auto;
56	+ right: 0;
57	}
58
59	/* Tour

81	left: 10px;
82	}
83
84	+ /* Field Action Icons
85	------------------------------------------------------ */
86
87	+ .fl-field-control-wrapper i.fl-field-responsive-toggle {
88	+ left: auto;
89	+ right: -25px;
90	+ }
91	+ .fl-field-control-wrapper .fl-dimension-field-link {
92	+ left: auto;
93	+ right: -50px;
94	}
95
96	+ /* Color Picker Fields
97	------------------------------------------------------ */
98
99	+ .fl-color-picker.fl-color-picker-has-reset .fl-color-picker-color:not(.fl-color-picker-empty) {
100	+ border-top-right-radius: 4px;
101	+ border-bottom-right-radius: 4px;
102	+ border-top-left-radius: 0px;
103	+ border-bottom-left-radius: 0px;
104	+ }
105	+ .fl-color-picker-clear {
106	+ border-top-right-radius: 0px;
107	+ border-bottom-right-radius: 0px;
108	+ border-top-left-radius: 4px;
109	+ border-bottom-left-radius: 4px;
110	+ }
111	+
112	+ .fl-color-picker-ui .iris-picker .iris-square {
113	+ margin: 0 auto 0 0;
114	+ }
115	+ .fl-color-picker-ui .iris-picker .iris-strip {
116	+ margin: 5px auto 6px 6px;
117	+ }
118	+ .fl-color-picker-ui .fl-alpha-slider {
119	+ left: 7px;
120	+ }
121	+ .fl-color-picker-ui .fl-alpha-text {
122	+ left: 5px;
123	+ }
124	+
125	.fl-color-picker-preset-add {
126	right: auto;
127	left: 8px;

164	float: right;
165	}
166
167	+ /* Icon Fields
168	+ ------------------------------------------------------ */
169	+
170	+ .fl-icon-field .fl-icon-preview i {
171	+ margin: 10px 2px 9px 10px;
172	+ }
173	+
174	+ /* Icon Selector
175	+ ------------------------------------------------------ */
176	+
177	+ .fl-icons-filter {
178	+ left: 10px;
179	+ right: auto;
180	+ }
181	+ .fl-icons-section h2 {
182	+ text-align: right;
183	+ }
184	+
185	+ /* Font Fields
186	+ ------------------------------------------------------ */
187	+
188	+ .fl-font-field .fl-font-field-font-wrapper {
189	+ margin-right: 0 !important;
190	+ margin-left: 8px !important;
191	+ }
192	+
193	+ /* Button Group Fields
194	+ ------------------------------------------------------ */
195	+
196	+ .fl-button-group-field-options {
197	+ float: right;
198	+ }
199	+
200	+ /* Compound Fields
201	+ ------------------------------------------------------ */
202	+
203	+ .fl-compound-field-section-toggle .dashicons {
204	+ margin-right: 0;
205	+ margin-left: 5px;
206	+ }
207	+ .fl-compound-field-setting:last-child {
208	+ padding-right: 8px;
209	+ }
210	+ .fl-compound-field-setting:first-child {
211	+ padding-right: 0px;
212	+ }
213	+ .fl-compound-field-setting .fl-unit-field-input select.fl-field-unit-select {
214	+ background-position: center left 4px !important;
215	+ }
216	+
217	+ /* Typography Fields
218	+ ------------------------------------------------------ */
219	+
220	+ .fl-typography-field .fl-shadow-field .fl-color-picker {
221	+ margin: 0 0 0 8px;
222	+ }
223	+
224	+ /* Unit Fields
225	+ ------------------------------------------------------ */
226	+
227	+ .fl-unit-field-inputs input[type],
228	+ .fl-unit-field-inputs .fl-field-unit-select {
229	+ border-top-right-radius: 4px !important;
230	+ border-bottom-right-radius: 4px !important;
231	+ border-top-left-radius: 0px !important;
232	+ border-bottom-left-radius: 0px !important;
233	+ }
234	+ body .fl-unit-field-input:last-child > * {
235	+ border-top-right-radius: 0px !important;
236	+ border-bottom-right-radius: 0px !important;
237	+ border-top-left-radius: 4px !important;
238	+ border-bottom-left-radius: 4px !important;
239	+ }
240	+ body select.fl-field-unit-select {
241	+ background-color: #E7EBEF !important;
242	+ }
243	+
244	+ /* Dimension Fields
245	+ ------------------------------------------------------ */
246	+
247	+ .fl-field[data-type="dimension"] .fl-field-label label {
248	+ padding-left: 35px;
249	+ padding-right: 0;
250	+ }
251	+ body .fl-dimension-field-units > *:first-child > input[type] {
252	+ border-top-right-radius: 4px !important;
253	+ border-bottom-right-radius: 4px !important;
254	+ border-top-left-radius: 0px !important;
255	+ border-bottom-left-radius: 0px !important;
256	+ }
257	+ body .fl-dimension-field-units > :last-child > {
258	+ border-top-right-radius: 0px !important;
259	+ border-bottom-right-radius: 0px !important;
260	+ border-top-left-radius: 4px !important;
261	+ border-bottom-left-radius: 4px !important;
262	+ }
263	+
264	+ /* 2.0 RTL Updates
265	+ ------------------------------------------------------ */
266	.fl-builder-panel-drag-handle {
267	right: 10px;
268	left: auto;

307	padding-top: 6px;
308	}
309




310	.fl-builder-block-visual.fl-cols-visual .fl-cols-visual-col:first-child {
311	margin-right: 0!important;
312	margin-left: 2px!important;

401	float: right;
402	}
403





404	.fl-builder-bar-title {
405	border-right: none;
406	border-left: 2px solid #D5DADD;

460	padding-right: 10px;
461	padding-left: 15px;
462	}
463	+ .fl-builder-settings-fields .fl-builder-settings-title > svg {
464	+ margin: 0 0 0 7px;
465	+ }
466	.fl-photo-field .fl-photo-preview select {
467	margin: 8px 10px 8px 0;
468	}

css/fl-builder-ui-skin-dark.css CHANGED Viewed

	@@ -9,7 +9,6 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
9	border-color: #1d1d1d;
10	}
11	.fl-builder-ui-skin--dark .fl-builder--panel-header {
12	- background:#1d2227;
13	color:#b4b9be;
14	border-bottom-color: #1d1d1d;
15	border-top-color: #1d1d1d;
	@@ -25,7 +24,7 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
25	fill: #1d1d1d;
26	}
27	.fl-builder-ui-skin--dark .fl-builder-panel-search .fl-builder-panel-search-input {
28	- background: #~~1e2228~~;
29	}
30	.fl-builder-ui-skin--dark .fl-responsive-preview-content {
31	background:#131619;
	@@ -36,7 +35,7 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
36	}
37	.fl-builder-ui-skin--dark .fl-builder-button,
38	.fl-builder-ui-skin--dark .fl-builder--preview-actions .device-icons {
39	- background: #~~383f46~~;
40	}
41	.fl-builder-ui-skin--dark .fl-builder-button:focus {
42	background: #131a22;
	@@ -46,6 +45,12 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
46	fill: white !important;
47	background: #00A0D2;
48	}






49	.fl-builder-ui-skin--dark .fl-builder-button.fl-builder-button-silent:focus {
50	border: 2px solid #00a0d2 !important;
51	}
	@@ -101,18 +106,18 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
101	.fl-builder-ui-skin--dark .fl-builder--tabs {
102	border-color: #383f46 !important;
103	}
104	- .fl-builder-ui-skin--dark .fl-builder--tabs > *.is-showing,
105	.fl-builder-ui-skin--dark .fl-builder-settings-tabs a.fl-active,
106	.fl-builder-ui-skin--dark .fl-builder-settings-tabs-more.fl-contains-active {
107	color: #ffffff !important;
108	fill: #ffffff !important;
109	- background: #~~383f46~~;
110	}
111	- .fl-builder-ui-skin--dark .fl-builder--tabs > *:focus {
112	background-color: #101215 !important;
113	color: #ffffff !important;
114	}
115	- .fl-builder-ui-skin--dark .fl-builder--tabs > *.is-showing:focus {
116	color: #00a0d2 !important;
117	}
118
	@@ -126,17 +131,16 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
126	.fl-builder-ui-skin--dark .fl-builder-blocks-section-group-name {
127	color: #7d8690;
128	}
129	- .fl-builder-ui-skin--dark .fl-builder--category-select{
130	- background: #171b1f;
131	- }
132	.fl-builder-ui-skin--dark .fl-builder--selector-display {
133	color: #c6cdd6;
134	- background: #~~171b1f~~ url(../img/svg/select-arrow-down-alt2-light.svg) no-repeat center right 10px !important



135	}
136	- .fl-builder-ui-skin--dark .fl-builder--selector-display-label,
137	.fl-builder-ui-skin--dark .fl-builder-panel-search-input input {
138	border-color: #5b656f;
139	- color: #~~b5becb~~;
140	}
141	.fl-builder-ui-skin--dark .fl-builder-panel-search-input input {
142	background: #171b1f !important;
	@@ -146,8 +150,8 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
146	border-color: #00a0d2;
147	}
148	.fl-builder-ui-skin--dark .fl-builder--group-label {
149	- color: #~~171b1f~~ !important;
150	- background: #~~5b656f~~;
151	}
152	.fl-builder-ui-skin--dark .fl-builder--category-select .fl-builder--selector-menu {
153	border-color: #101215 !important;
	@@ -175,11 +179,23 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
175	fill: #5b656f;
176	}
177







178	.fl-builder-ui-skin--dark .fl-builder-blocks-section .fl-builder-blocks-section-title,
179	.fl-builder-ui-skin--dark .fl-builder--template-collection-section-name,
180	.fl-builder-ui-skin--dark .fl-builder--user-templates-section-name {
181	- color: #~~969ea7~~;
182	- ~~background~~: #~~171b1f~~;





183	}
184
185	.fl-builder-ui-skin--dark .fl-builder-blocks-section-content .fl-builder-block,
	@@ -208,11 +224,6 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
208	.fl-builder-ui-skin--dark .fl-builder-block:hover .fl-builder-block-visual.fl-cols-visual .fl-cols-visual-col {
209	background: #7d8690;
210	}
211	-
212	- .fl-builder-ui-skin--dark .fl-builder-settings-section,
213	- .fl-builder-ui-skin--dark .fl-builder-blocks-section {
214	- border-top: 2px solid #171b1f;
215	- }
216	.fl-builder-ui-skin--dark .fl-user-templates {
217	border-color: #101215;
218	}
	@@ -222,10 +233,6 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
222	.fl-builder-ui-skin--dark .fl-builder--menu a.fl-template-collection {
223	color: #a8b3bf;
224	}
225	- .fl-builder-ui-skin--dark .fl-lightbox-header-wrap {
226	- background: #1d2227;
227	- border-bottom-color: #131a22;
228	- }
229	.fl-builder-ui-skin--dark .fl-lightbox .fl-lightbox-header h1 {
230	color: white !important
231	}
	@@ -233,17 +240,17 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
233	color: #a8b3bf !important;
234	}
235	.fl-builder-ui-skin--dark .fl-builder-settings-tabs {
236	- ~~border~~-color: #~~383f46~~ !important;
237	}
238	.fl-builder-ui-skin--dark .fl-builder-settings-fields h3.fl-builder-settings-title {
239	- background: #~~1b2025~~;
240	}
241	.fl-builder-ui-skin--dark h3.fl-builder-settings-title .fl-builder-settings-title-text-wrap {
242	color: #a8b3bf;
243	background-color: #1b2025;
244	}
245	.fl-builder-ui-skin--dark .fl-lightbox *:not(i) {
246	- color: #~~7d8690~~ !important;
247	}
248	.fl-builder-ui-skin--dark .fl-builder-button {
249	color: #c6cdd6 !important;
	@@ -257,14 +264,14 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
257	.fl-builder-ui-skin--dark .fl-lightbox .fl-builder-button.fl-builder-button-primary {
258	color: #ffffff !important;
259	}
260	- .fl-builder-ui-skin--dark .fl-color-picker {
261	- background: #~~131a22~~;
262	}
263	.fl-color-picker-color.fl-color-picker-empty .fl-color-picker-icon {
264	fill:#6f7881;
265	}
266	.fl-builder-ui-skin--dark .fl-color-picker-clear {
267	- background-color: #~~191d21~~;
268	}
269	.fl-builder-ui-skin--dark .fl-color-picker-clear:hover {
270	background-color: #373f46;
	@@ -291,7 +298,7 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
291	.fl-builder-ui-skin--dark .fl-builder-settings-fields input[type=url],
292	.fl-builder-ui-skin--dark .fl-builder-settings-fields select,
293	.fl-builder-ui-skin--dark .fl-builder-custom-field {
294	- background-color: #~~131a22~~ !important;
295	}
296
297	.fl-builder-ui-skin--dark .fl-builder-settings-fields textarea:focus,
	@@ -382,11 +389,96 @@ body.fl-builder-ui-skin--dark .fl-builder-bar .fl-builder-bar-content,
382	border-top: 2px solid #1b2026 !important;
383	}
384
385	- /* ~~Powerpack~~ ~~fix */~~
386	- ~~.fl~~-~~builder-ui-skin--dark~~ ~~.pp-preview-button~~ {








































































387	background: #23282d;
388	- border: 2px solid #101215;
389	}
390	- .fl-builder-ui-skin--dark .pp-~~preview-button~~ .pp-~~preview-button-wrap~~ .~~fa {~~
391	- ~~color:~~ ~~#b8bfc7;~~














392	}


9	border-color: #1d1d1d;
10	}
11	.fl-builder-ui-skin--dark .fl-builder--panel-header {

12	color:#b4b9be;
13	border-bottom-color: #1d1d1d;
14	border-top-color: #1d1d1d;

24	fill: #1d1d1d;
25	}
26	.fl-builder-ui-skin--dark .fl-builder-panel-search .fl-builder-panel-search-input {
27	+ background: #24282e;
28	}
29	.fl-builder-ui-skin--dark .fl-responsive-preview-content {
30	background:#131619;

35	}
36	.fl-builder-ui-skin--dark .fl-builder-button,
37	.fl-builder-ui-skin--dark .fl-builder--preview-actions .device-icons {
38	+ background: #2c333a;
39	}
40	.fl-builder-ui-skin--dark .fl-builder-button:focus {
41	background: #131a22;

45	fill: white !important;
46	background: #00A0D2;
47	}
48	+ .fl-builder-ui-skin--dark .fl-builder-button.fl-builder-feedback-button,
49	+ .fl-builder-ui-skin--dark .fl-builder-button.fl-builder-buy-button,
50	+ .fl-builder-ui-skin--dark .fl-builder-button.fl-builder-upgrade-button {
51	+ background-color: #F7A407;
52	+ color:white !important;
53	+ }
54	.fl-builder-ui-skin--dark .fl-builder-button.fl-builder-button-silent:focus {
55	border: 2px solid #00a0d2 !important;
56	}

106	.fl-builder-ui-skin--dark .fl-builder--tabs {
107	border-color: #383f46 !important;
108	}
109	+ .fl-builder-ui-skin--dark .fl-builder--tabs *.is-showing,
110	.fl-builder-ui-skin--dark .fl-builder-settings-tabs a.fl-active,
111	.fl-builder-ui-skin--dark .fl-builder-settings-tabs-more.fl-contains-active {
112	color: #ffffff !important;
113	fill: #ffffff !important;
114	+ background: #181b20 !important;
115	}
116	+ .fl-builder-ui-skin--dark .fl-builder--tabs *:focus {
117	background-color: #101215 !important;
118	color: #ffffff !important;
119	}
120	+ .fl-builder-ui-skin--dark .fl-builder--tabs *.is-showing:focus {
121	color: #00a0d2 !important;
122	}
123

131	.fl-builder-ui-skin--dark .fl-builder-blocks-section-group-name {
132	color: #7d8690;
133	}



134	.fl-builder-ui-skin--dark .fl-builder--selector-display {
135	color: #c6cdd6;
136	+ background: #1a1b22 url(../img/svg/select-arrow-down-alt2-light.svg) no-repeat center right 10px !important
137	+ }
138	+ .fl-builder-ui-skin--dark .fl-builder--selector-display-label {
139	+ color: #b5becb;
140	}

141	.fl-builder-ui-skin--dark .fl-builder-panel-search-input input {
142	border-color: #5b656f;
143	+ color: #b8c2ce;
144	}
145	.fl-builder-ui-skin--dark .fl-builder-panel-search-input input {
146	background: #171b1f !important;

150	border-color: #00a0d2;
151	}
152	.fl-builder-ui-skin--dark .fl-builder--group-label {
153	+ color: #aaafb5 !important;
154	+ background: #24282e;
155	}
156	.fl-builder-ui-skin--dark .fl-builder--category-select .fl-builder--selector-menu {
157	border-color: #101215 !important;

179	fill: #5b656f;
180	}
181
182	+ .fl-builder-ui-skin--dark .fl-builder-blocks-section .fl-builder-blocks-section-header,
183	+ .fl-builder-ui-skin--dark .fl-builder--template-collection-section-header,
184	+ .fl-builder-ui-skin--dark .fl-builder-settings-section-header {
185	+ background-color: #191b21;
186	+ border-color: #191b21;
187	+ }
188	+ .fl-builder-ui-skin--dark .fl-builder-settings-fields .fl-builder-settings-title,
189	.fl-builder-ui-skin--dark .fl-builder-blocks-section .fl-builder-blocks-section-title,
190	.fl-builder-ui-skin--dark .fl-builder--template-collection-section-name,
191	.fl-builder-ui-skin--dark .fl-builder--user-templates-section-name {
192	+ color: #7d8690 !important;
193	+ fill: #7d8690;
194	+ background: #24282e;
195	+ }
196	+
197	+ .fl-builder-ui-skin--dark .fl-builder-settings-fields .fl-builder-settings-title:focus {
198	+ border-color:#7d8690;
199	}
200
201	.fl-builder-ui-skin--dark .fl-builder-blocks-section-content .fl-builder-block,

224	.fl-builder-ui-skin--dark .fl-builder-block:hover .fl-builder-block-visual.fl-cols-visual .fl-cols-visual-col {
225	background: #7d8690;
226	}





227	.fl-builder-ui-skin--dark .fl-user-templates {
228	border-color: #101215;
229	}

233	.fl-builder-ui-skin--dark .fl-builder--menu a.fl-template-collection {
234	color: #a8b3bf;
235	}




236	.fl-builder-ui-skin--dark .fl-lightbox .fl-lightbox-header h1 {
237	color: white !important
238	}

240	color: #a8b3bf !important;
241	}
242	.fl-builder-ui-skin--dark .fl-builder-settings-tabs {
243	+ background-color: #2c333a !important;
244	}
245	.fl-builder-ui-skin--dark .fl-builder-settings-fields h3.fl-builder-settings-title {
246	+ background: #24282e;
247	}
248	.fl-builder-ui-skin--dark h3.fl-builder-settings-title .fl-builder-settings-title-text-wrap {
249	color: #a8b3bf;
250	background-color: #1b2025;
251	}
252	.fl-builder-ui-skin--dark .fl-lightbox *:not(i) {
253	+ color: #a7b1bb !important;
254	}
255	.fl-builder-ui-skin--dark .fl-builder-button {
256	color: #c6cdd6 !important;

264	.fl-builder-ui-skin--dark .fl-lightbox .fl-builder-button.fl-builder-button-primary {
265	color: #ffffff !important;
266	}
267	+ .fl-builder-ui-skin--dark .fl-color-picker-color.fl-color-picker-empty {
268	+ background: #1a1b22;
269	}
270	.fl-color-picker-color.fl-color-picker-empty .fl-color-picker-icon {
271	fill:#6f7881;
272	}
273	.fl-builder-ui-skin--dark .fl-color-picker-clear {
274	+ background-color: #121a23;
275	}
276	.fl-builder-ui-skin--dark .fl-color-picker-clear:hover {
277	background-color: #373f46;

298	.fl-builder-ui-skin--dark .fl-builder-settings-fields input[type=url],
299	.fl-builder-ui-skin--dark .fl-builder-settings-fields select,
300	.fl-builder-ui-skin--dark .fl-builder-custom-field {
301	+ background-color: #181b20 !important;
302	}
303
304	.fl-builder-ui-skin--dark .fl-builder-settings-fields textarea:focus,

389	border-top: 2px solid #1b2026 !important;
390	}
391
392	+ .fl-builder-ui-skin--dark div.fl-field-unit-select {
393	+ background-color: #181b20 !important;
394	+ }
395	+ .fl-builder-ui-skin--dark .fl-dimension-field-units > * {
396	+ border-right: 1px solid #383f46;
397	+ }
398	+ .fl-builder-ui-skin--dark .fl-field-popup-slider,
399	+ .fl-builder-ui-skin--dark .fl-field-popup-slider-input .ui-slider-handle {
400	+ background: #383f46;
401	+ }
402	+ .fl-builder-ui-skin--dark .fl-field-popup-slider-arrow:after {
403	+ border-bottom-color: #383f46;
404	+ }
405	+ .fl-builder-ui-skin--dark .fl-field-popup-slider-input {
406	+ background-color: #121a23;
407	+ }
408	+ .fl-builder-ui-skin--dark .fl-unit-field-input {
409	+ border-right: 1px solid #383f46 !important;
410	+ }
411	+
412	+ .fl-builder-ui-skin--dark .fl-button-group-field-option[data-selected="1"] {
413	+ background-color: #383f46;
414	+ color:white;
415	+ }
416	+ .fl-builder-ui-skin--dark .fl-button-group-field-option[data-selected="1"] i {
417	+ color:white !important;
418	+ }
419	+ .fl-builder-ui-skin--dark .fl-button-group-field-options {
420	+ background: #181b20;
421	+ }
422	+
423	+ .fl-builder-ui-skin--dark .fl-compound-field-section-toggle {
424	+ background-color: #181b20;
425	+ }
426	+ .fl-builder-ui-skin--dark .fl-compound-field-section-toggle:hover {
427	+ background-color: #383f46;
428	+ }
429	+ .fl-builder-ui-skin--dark .fl-compound-field-section-visible .fl-compound-field-section-toggle {
430	+ border-top-color: #121a23 !important;
431	+ background-color:transparent;
432	+ }
433	+
434	+ .fl-builder-ui-skin--dark .fl-field-connections-toggle i {
435	+ color: #7c8590;
436	+ }
437	+ .fl-builder-ui-skin--dark .fl-lightbox .fl-field-connection-content {
438	+ background-color: #191b20 !important;
439	+ }
440	+
441	+ .fl-builder-ui-skin--dark .fl-nanoscroller > .fl-nanoscroller-pane > .fl-nanoscroller-slider {
442	+ background-color: #181b20;
443	+ }
444	+ .fl-builder-ui-skin--dark .fl-nanoscroller > .fl-nanoscroller-pane:hover > .fl-nanoscroller-slider {
445	+ background-color: #5a646f;
446	+ }
447	+ .fl-builder-ui-skin--dark .fl-nanoscroller > .fl-nanoscroller-pane.active > .fl-nanoscroller-slider {
448	+ background-color: #00A0D2;
449	+ }
450	+
451	+ /* MCE */
452	+ .fl-builder-ui-skin--dark .fl-lightbox div.mce-panel {
453	+ background: #383f46;
454	+ }
455	+ .fl-builder-ui-skin--dark .fl-lightbox .mce-toolbar .mce-ico {
456	+ color: #a7b1bb;
457	+ }
458	+
459	+ .fl-builder-ui-skin--dark .fl-lightbox .wp-core-ui .button,
460	+ .fl-builder-ui-skin--dark .fl-lightbox .wp-core-ui .button-secondary {
461	+ background: #383f46;
462	+ border:none;
463	+ box-shadow:none;
464	+ }
465	+ .fl-builder-ui-skin--dark .fl-lightbox .fl-builder-settings .wp-switch-editor {
466	background: #23282d;

467	}
468	+ .fl-builder-ui-skin--dark .fl-lightbox .html-active .switch-html,
469	+ .fl-builder-ui-skin--dark .fl-lightbox .tmce-active .switch-tmce,
470	+ .fl-builder-ui-skin--dark .fl-lightbox .quicktags-toolbar {
471	+ background: #383f46;
472	+ }
473	+ .fl-builder-ui-skin--dark .fl-lightbox textarea.wp-editor-area {
474	+ background: transparent !important;
475	+ }
476	+
477	+ .fl-builder-ui-skin--dark .fl-lightbox .wp-core-ui .button-secondary:focus,
478	+ .fl-builder-ui-skin--dark .fl-lightbox .wp-core-ui .button-secondary:hover,
479	+ .fl-builder-ui-skin--dark .fl-lightbox .wp-core-ui .button.focus,
480	+ .fl-builder-ui-skin--dark .fl-lightbox .wp-core-ui .button.hover,
481	+ .fl-builder-ui-skin--dark .fl-lightbox .wp-core-ui .button:focus,
482	+ .fl-builder-ui-skin--dark .fl-lightbox .wp-core-ui .button:hover {
483	+ background: #191b20;
484	}

css/fl-builder.css CHANGED Viewed

	@@ -6,7 +6,7 @@ html {
6	transition-duration: .35s;
7	}
8	html.fl-builder-is-showing-toolbar {
9	- margin-top: ~~46px~~ !important;
10	}
11	.fl-builder-edit body {
12	position: static !important;
	@@ -90,7 +90,7 @@ html.fl-builder-show-admin-bar #wpadminbar {
90	font-style: italic;
91	}
92	.fl-builder-node-loading {
93	- opacity: 0.35;
94	}
95	.fl-builder-node-loading-placeholder {
96	background: url(../img/ajax-loader.svg) center center no-repeat;
	@@ -128,11 +128,21 @@ html:not(.fl-responsive-preview-enabled) .fl-builder-content-editing .fl-visible
128	html:not(.fl-responsive-preview-enabled) .fl-builder-content-editing .fl-visible-mobile {
129	display: block !important;
130	}







131	/* @endgroup Responsive Utilities */
132
133	/* @group Responsive Editing
134	------------------------------------------------------ */
135



136	.fl-responsive-preview-mask {
137	background: #F7F7F7;
138	bottom: 0;
	@@ -145,7 +155,7 @@ html:not(.fl-responsive-preview-enabled) .fl-builder-content-editing .fl-visible
145	.fl-responsive-preview {
146	bottom: 0;
147	left: 0;
148	- position: ~~absolute~~;
149	right: 0;
150	top: 0;
151	margin-top: 50px;
	@@ -157,24 +167,54 @@ html:not(.fl-responsive-preview-enabled) .fl-builder-content-editing .fl-visible
157	.fl-responsive-preview-content {
158	background: #F5F7F9;
159	padding: 20px 20px 45px;









160	}
161	.fl-responsive-preview-message {

162	color: #b3b3b3;
163	- font-family: ~~Helvetica~~, ~~Arial~~, ~~Verdana~~, sans-serif;
164	font-size: 14px;
165	font-weight: normal;
166	- padding: ~~0 20px 20px~~;
167	text-align: center;





168	}
169	- .fl-responsive-preview-message i {
170	- ~~cursor~~: ~~pointer~~;
171	- margin-~~left~~: ~~3px~~;










172	}
173	.fl-responsive-preview .fl-builder-content {
174	box-shadow: 0 0 8px rgba(0,0,0,0.2);
175	margin-left: auto;
176	margin-right: auto;
177	max-width: 100%;





178	}
179	/* @endgroup Responsive Editing */
180
	@@ -190,7 +230,7 @@ html:not(.fl-responsive-preview-enabled) .fl-builder-content-editing .fl-visible
190	right: 0;
191	top: 0;
192	width: 100%;
193	- z-index: ~~99999~~;
194	}
195	#fl-builder-preview-frame {
196	bottom: 0;
	@@ -203,39 +243,54 @@ html:not(.fl-responsive-preview-enabled) .fl-builder-content-editing .fl-visible
203	-moz-transform: translateX(-50%);
204	-webkit-transform: translateX(-50%);
205	width: 100%;
206	- z-index: ~~100000~~;
207	}
208	/* @endgroup Responsive Iframe Preview */
209
210	/* @group Buttons
211	------------------------------------------------------ */
212













213	.fl-builder-button {
214	- ~~color~~: ~~#676F7A !important~~;
215	- fill: #676F7A !important;
216	- background: #E4E7EA;
217	align-items: center;









218	display: flex;
219	- ~~text-decoration~~: ~~none~~;

220	font-size: 14px !important;

221	font-weight: 500 !important;
222	- line-height: 1 !important;
223	height: 33px;


224	margin: 0;
225	padding: 0px 12px;
226	- ~~cursor~~: ~~pointer~~;
227	- -webkit-border-radius: 3px;
228	- -webkit-appearance: none;
229	- border:2px solid transparent;
230	- border-radius: 3px;
231	- letter-spacing: normal !important;
232	- white-space: nowrap;
233	- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
234	- -webkit-box-sizing: border-box !important;
235	- -moz-box-sizing: border-box !important;
236	- box-sizing: border-box !important;
237	transition-property: background-color, width;
238	transition-duration: .2s;


239
240	/* Prevent select */
241	-webkit-touch-callout: none; /* iOS Safari */
	@@ -407,11 +462,11 @@ body .fl-builder-bar .fl-builder-bar-content {
407	display: flex;
408	box-sizing: border-box;
409	background: #ffffff;
410	- border-bottom: ~~2px~~ solid #~~D5DADD~~;
411	color: #999999;
412	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
413	font-size: 14px !important;
414	- height: ~~48px~~; /* include ~~2px~~ border */
415	transition-property: background-color, opacity, transform;
416	transition-duration: .35s;
417	pointer-events: auto;
	@@ -430,7 +485,7 @@ body .fl-builder-bar .fl-builder-bar-content.is-muted > *:not(.fl-builder-publis
430	display: flex;
431	flex: 0 0 380px;
432	max-width: 380px; /* required */
433	- border-right: ~~2px~~ solid #~~D5DADD~~;
434	cursor: pointer;
435	}
436	.fl-builder-bar-title:hover {
	@@ -446,13 +501,6 @@ body .fl-builder-bar .fl-builder-bar-content.is-muted > *:not(.fl-builder-publis
446	cursor: auto;
447	background: none;
448	}
449	- .fl-builder-bar-title img {
450	- /*
451	- height: 33px !important;
452	- margin: 2px 10px 0 0 !important;
453	- vertical-align: middle !important;
454	- */
455	- }
456	.fl-builder-bar-title span {
457	vertical-align: middle;
458	}
	@@ -481,8 +529,8 @@ body .fl-builder-bar .fl-builder-bar-content.is-muted > *:not(.fl-builder-publis
481	}
482	.fl-builder-layout-title,
483	.fl-theme-builder-preview-select .fl-theme-builder-preview-select-title span {
484	- font-size: ~~17px~~;
485	- font-weight: 400;
486	line-height: 1.3;
487	color: #161B20;
488	white-space: nowrap;
	@@ -496,6 +544,7 @@ body .fl-builder-bar .fl-builder-bar-content.is-muted > *:not(.fl-builder-publis
496	font-weight: 500;
497	line-height: 1.3;
498	color: #656d77;

499	white-space: nowrap;
500	text-overflow: ellipsis;
501	overflow: hidden;
	@@ -577,7 +626,8 @@ body .fl-builder-bar .fl-builder-bar-content.is-muted > *:not(.fl-builder-publis
577	padding: 4px 0 !important;
578	border-bottom: none !important;
579	display: flex;
580	- flex-direction: column;

581	}
582	.fl-theme-builder-preview-select-item:hover {
583	text-decoration: none;
	@@ -653,8 +703,8 @@ body .fl-theme-builder-preview-select-item-child:hover {
653	cursor: pointer;
654	display: flex;
655	align-self: center;
656	- padding: 0 ~~16px~~;
657	- font-size: ~~1em~~;
658	font-style:italic;
659	color: #676f7a;
660	align-items: center;
	@@ -667,23 +717,26 @@ body .fl-theme-builder-preview-select-item-child:hover {
667	}
668	.fl-builder--saving-indicator .fa-question-circle {
669	font-size: 13px;
670	- margin: 3px 0 3px ~~8px~~;
671	}
672
673	/* Buy/Upgrade button */
674	.fl-builder-buy-button,
675	- .fl-builder-upgrade-button {

676	background: #F7A407;
677	color: #fff !important;
678	text-decoration: none;
679	}
680	.fl-builder-buy-button i.fa-external-link-alt,
681	- .fl-builder-upgrade-button i.fa-external-link-alt {

682	color: #FFC733;
683	margin: 0 0 0 6px;
684	}
685	.fl-builder-buy-button:hover,
686	- .fl-builder-upgrade-button:hover {

687	background: #EE8E0D;
688	color: #fff !important;
689	}
	@@ -728,11 +781,23 @@ body .fl-theme-builder-preview-select-item-child:hover {
728	display:none;
729	}
730	.fl-builder-bar-title {
731	- flex: 0 0 ~~100px~~ !important;
732	}
733	.fl-builder-bar-title-area {
734	display:none;
735	}












736	.fl-builder--main-menu-panel:before {
737	display:none;
738	}
	@@ -751,6 +816,7 @@ body .fl-theme-builder-preview-select-item-child:hover {
751	}
752	.fl-builder-publish-actions {
753	width:100% !important;

754	}
755	.fl-builder-bar-actions .fl-builder-button {
756	padding: 0 8px !important;
	@@ -762,7 +828,7 @@ body .fl-theme-builder-preview-select-item-child:hover {
762	position: fixed;
763	top: 4px;
764	left: 4px;
765	- z-index: ~~100008~~;
766	padding: 4px;
767	justify-content: center;
768	background:white;
	@@ -862,7 +928,7 @@ body .fl-theme-builder-preview-select-item-child:hover {
862	display: none;
863	}
864	.fl-builder-panel.fl-builder-ui-pinned {
865	- top: ~~48px~~ !important;
866	bottom: 0 !important;
867	height: auto !important;
868	border-radius: 0;
	@@ -877,12 +943,12 @@ body .fl-theme-builder-preview-select-item-child:hover {
877	.fl-builder-panel.fl-builder-ui-pinned-right {
878	left: auto !important;
879	right: 0;
880	- border-left: ~~2px~~ solid #~~d5dadd~~;
881	}
882	.fl-builder-panel.fl-builder-ui-pinned-left {
883	left: 0;
884	right: auto;
885	- border-right: ~~2px~~ solid #~~d5dadd~~;
886	}
887	.fl-builder-panel.fl-builder-ui-pinned .fl-builder--panel-header {
888	border-radius: 0 !important;
	@@ -1048,7 +1114,7 @@ body .fl-theme-builder-preview-select-item-child:hover {
1048	box-sizing: border-box;
1049	position: fixed !important;
1050	right: 20px;
1051	- top: calc(~~48px~~ + 10px);
1052	width: 380px;
1053	bottom: 20px;
1054	background: #F5F7F9;
	@@ -1059,7 +1125,6 @@ body .fl-theme-builder-preview-select-item-child:hover {
1059	box-shadow: 0px 8px 40px 4px rgba(0, 0, 0, 0.3);
1060	z-index: 10000007;
1061	will-change: transform;
1062	- display:none;
1063	-webkit-touch-callout: none;
1064	-webkit-user-select: none;
1065	-khtml-user-select: none;
	@@ -1072,8 +1137,10 @@ body .fl-theme-builder-preview-select-item-child:hover {
1072	animation-name: fl-builder-show-panel;
1073	animation-duration: .15s;
1074	animation-fill-mode: both;

1075	}
1076	.fl-builder--search-results-panel {

1077	position: absolute;
1078	right: 0;
1079	top: 93px;
	@@ -1088,12 +1155,13 @@ body .fl-theme-builder-preview-select-item-child:hover {
1088	overflow:auto;
1089	z-index:1;
1090	}



1091	.fl-builder-content-panel-is-showing .fl-builder-panel,
1092	.fl-builder-search-results-panel-is-showing .fl-builder--search-results-panel {
1093	- display:~~block~~;
1094	- }
1095	- .fl-builder-content-panel-is-showing .fl-builder-panel.fl-builder--current-view-templates {
1096	- width: 520px;
1097	}
1098	.fl-builder--search-results-panel .fl-builder--no-results {
1099	text-align: center;
	@@ -1117,14 +1185,12 @@ body.fl-builder-draggable-is-dragging .fl-builder--panel-arrow {
1117	------------------------------------------------------ */
1118
1119	.fl-builder--panel-header {
1120	- background:white;
1121	border-top: 3px solid #00a0d2;
1122	- border-bottom: 2px solid #e6eaed;
1123	border-top-right-radius: 4px;
1124	border-top-left-radius: 4px;
1125	}
1126	.fl-builder-ui-is-pinned .fl-builder--panel-header {
1127	- border-top~~-color~~: ~~transparent~~;
1128	}
1129	.fl-builder-panel-drag-handle {
1130	position: absolute;
	@@ -1156,11 +1222,16 @@ body.fl-builder-draggable-is-dragging .fl-builder--panel-arrow {
1156	margin-left: -4px; /* compensate for group select padding */
1157	}
1158	.fl-builder--panel-controls .fl-builder-panel-search button {
1159	- ~~width~~: ~~38px~~;




1160	background: transparent !important;
1161	border: 2px solid transparent !important;
1162	font-size: inherit;
1163	- height: ~~38px~~;

1164	padding:0;
1165	}
1166	.fl-builder--panel-controls .fl-builder-panel-search button:focus,
	@@ -1189,7 +1260,7 @@ body.fl-builder-draggable-is-dragging .fl-builder--panel-arrow {
1189	left:0;
1190	right:0;
1191	bottom:0;
1192	- background~~:white~~;
1193	}
1194	.fl-builder-panel-search.is-showing-input .fl-builder-panel-search-input {
1195	display: flex;
	@@ -1201,7 +1272,7 @@ body.fl-builder-draggable-is-dragging .fl-builder--panel-arrow {
1201	border: 2px solid #e6eaed;
1202	background:white;
1203	border-radius: 4px;
1204	- margin~~-right~~: 4px;
1205	padding: 10px;
1206	color: #333;
1207	}
	@@ -1209,9 +1280,6 @@ body.fl-builder-draggable-is-dragging .fl-builder--panel-arrow {
1209	border-color: #0197C6;
1210	outline: none;
1211	}
1212	- .fl-builder-panel-search-input button {
1213	- flex: 0 0 38px;
1214	- }
1215
1216	/* Builder Panel Content
1217	------------------------------------------------------ */
	@@ -1228,9 +1296,6 @@ body.fl-builder-draggable-is-dragging .fl-builder--panel-arrow {
1228	.fl-builder-panel-content {
1229	padding-bottom: 60px;
1230	}
1231	- .fl-builder-blocks-section {
1232	- border-top: 2px solid #e6eaed;
1233	- }
1234	.fl-builder--panel-view .fl-builder-blocks-section:first-child {
1235	border-top:none;
1236	}
	@@ -1245,28 +1310,31 @@ body.fl-builder-draggable-is-dragging .fl-builder--panel-arrow {
1245	font-weight: 600;
1246	line-height: 1.4;
1247	}
1248	- ~~.fl-builder-blocks-section .fl-builder-blocks-section-title,~~
1249	.fl-builder-blocks-section .fl-builder-block {
1250	display: block;
1251	line-height: 1.1;
1252	padding: 15px 20px;
1253	}
1254	- .fl-builder-blocks-section .fl-builder-blocks-section-~~title~~,
1255	- .fl-builder--template-collection-section-~~name~~ {
1256	- display: inline-block;
1257	- font-weight: 700;
1258	- font-size: 12px;
1259	line-height: 1.2;
1260	- text-transform: uppercase;
1261	- padding-top: 30px;
1262	color: #333333;
1263	- padding: 4px 10px;
1264	- padding-left: 15px;
1265	margin:0 !important;
1266	- background: #e6eaed;
1267	- border-bottom-right-radius: 4px;
1268	user-select: none;
1269	- ~~vertical-align: top;~~












1270	}
1271	.fl-builder-blocks-section .fl-builder-blocks-section-title i {
1272	color: #bfbfbf;
	@@ -1276,6 +1344,10 @@ body.fl-builder-draggable-is-dragging .fl-builder--panel-arrow {
1276	overflow: auto;
1277	padding: 10px 10px 20px;
1278	}




1279	.fl-builder-blocks-section-content:after {
1280	float:none;
1281	clear:both;
	@@ -1286,6 +1358,22 @@ body.fl-builder-draggable-is-dragging .fl-builder--panel-arrow {
1286	display: flex;
1287	flex-wrap: wrap;
1288	}
















1289	.fl-builder-blocks-section-content .fl-builder-block-module,
1290	.fl-builder-blocks-section-content .fl-builder-block-row {
1291	flex: 1 1 50%;
	@@ -1305,10 +1393,10 @@ body.fl-builder-draggable-is-dragging .fl-builder--panel-arrow {
1305	text-overflow: ellipsis;
1306	white-space: nowrap;
1307	border-radius: 4px;
1308	- font-size: ~~14px~~;
1309	line-height: 1.1;
1310	- font-weight: ~~500~~;
1311	- color: #~~727272~~;
1312	}
1313	.fl-builder-block {
1314	position: relative;
	@@ -1595,6 +1683,9 @@ body.fl-builder-draggable-is-dragging .fl-builder--panel-arrow {
1595	padding-bottom: 10px;
1596	border-bottom: 1px solid #dfdfdf;
1597	}



1598	.fl-builder--template-collection-section:after,
1599	.fl-builder--template-collection-section:before {
1600	content: "";
	@@ -1604,12 +1695,6 @@ body.fl-builder-draggable-is-dragging .fl-builder--panel-arrow {
1604	.fl-builder--template-collection-section-name {
1605	padding: 15px 10px 10px;
1606	}
1607	- .fl-builder--template-collection-section-name:before,
1608	- .fl-builder--template-collection-section-name:after,
1609	- .fl-builder--template-collection-section-content:before,
1610	- .fl-builder--template-collection-section-content:after {
1611	-
1612	- }
1613
1614	/* Builder Panel Node Templates
1615	------------------------------------------------------ */
	@@ -1675,16 +1760,10 @@ span.fl-builder-block-no-node-templates:hover {
1675	}
1676	.fl-builder-panel .fl-builder--panel-header {
1677	cursor:move;
1678	- position: absolute;
1679	- top: 0;
1680	- left: 0;
1681	- right: 0;
1682	- z-index: 9;
1683	}
1684	.fl-builder-panel .fl-builder--tabs {
1685	justify-content: space-around;
1686	- padding: 0 24px;
1687	- min-height: 46px;
1688	cursor: pointer;
1689	}
1690	.fl-builder--tab-wrap {
	@@ -1693,6 +1772,8 @@ span.fl-builder-block-no-node-templates:hover {
1693	flex-direction: row;
1694	align-items: stretch;
1695	justify-content: space-between;


1696	}
1697	.fl-builder--tabs button,
1698	.fl-builder--tabs button:hover,
	@@ -1701,19 +1782,21 @@ span.fl-builder-block-no-node-templates:hover {
1701	flex:1 1 100%;
1702	display: inline-block;
1703	text-decoration: none;

1704	color:inherit;
1705	text-align: center;
1706	letter-spacing: normal !important;

1707	padding:5px;
1708	cursor: pointer;
1709	- font-size: ~~14px~~ !important;
1710	- font-weight: ~~600~~ !important;
1711	- line-height: 1.4 !important;
1712	background: transparent !important;
1713	outline: none !important;
1714	border: 2px solid transparent;
1715	border-radius: 4px;
1716	- ~~margin~~: ~~7px 0px~~;
1717	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
1718	top:0; /* fix default button active */
1719	transition-property: background, color;
	@@ -1725,6 +1808,9 @@ span.fl-builder-block-no-node-templates:hover {
1725	.fl-builder--tabs button.is-showing { /* active tab */
1726	color: #0086b0;
1727	}



1728	.fl-builder--panel-view {
1729	display: none;
1730	overflow: hidden;
	@@ -1732,18 +1818,6 @@ span.fl-builder-block-no-node-templates:hover {
1732	.fl-builder--panel-view.is-showing {
1733	display: block;
1734	}
1735	- .fl-builder--content-library-panel .fl-builder--panel-view.is-showing {
1736	- position: absolute;
1737	- top: 96px;
1738	- bottom:0;
1739	- left:0;
1740	- right:0;
1741	- width: auto;
1742	- height: auto;
1743	- }
1744	- .fl-builder--content-library-panel.single-view .fl-builder--panel-view.is-showing {
1745	- top: 52px;
1746	- }
1747
1748	.fl-builder--content-library-panel.ui-draggable-dragging {
1749	height: 500px !important;
	@@ -1775,21 +1849,32 @@ span.fl-builder-block-no-node-templates:hover {
1775	font-weight: 700;
1776	line-height: 16px;
1777	border-radius: 4px;

1778	}
1779	.fl-builder--selector-display-label {
1780	display: flex;
1781	flex-direction: row;

1782	font-size: inherit;
1783	line-height: inherit;
1784	width: 100%;

1785	padding:0 !important;
1786	color: #6D6D6D;
1787	background: none;
1788	- border: 2px solid ~~#e4e7ea~~;

1789	border-radius: 4px;
1790	font-family: inherit;








1791	}
1792	- .fl-builder--selector-display-label:hover,
1793	.fl-builder--selector-display-label:active {
1794	top:0;
1795	color: inherit;
	@@ -1807,11 +1892,13 @@ span.fl-builder-block-no-node-templates:hover {
1807	.fl-builder--group-label {
1808	color: inherit;
1809	flex: 0 0 0%;
1810	- padding: ~~9px~~ 10px;
1811	padding-right: 12px;
1812	- background: #~~e6eaed~~;
1813	- border-~~top-left-~~radius: ~~2px~~;
1814	- ~~border-bottom-left-radius~~: ~~2px~~;


1815	}
1816	.fl-builder--current-view-name {
1817	flex: 1 1 100%;
	@@ -1820,7 +1907,7 @@ span.fl-builder-block-no-node-templates:hover {
1820	text-overflow: ellipsis;
1821	white-space: nowrap;
1822	font-weight: 600;
1823	- padding: ~~9px~~ 10px;
1824	text-align: left;
1825	}
1826	.fl-builder--selector-menu {
	@@ -1835,6 +1922,7 @@ span.fl-builder-block-no-node-templates:hover {
1835	border-radius: 4px;
1836	box-shadow: 0px 0px 20px 2px rgba(0, 0, 0, 0.2);
1837	overflow: visible;

1838	}
1839	.fl-builder--selector-menu:before {
1840	bottom: 100%;
	@@ -1904,7 +1992,21 @@ button.fl-builder-button.fl-builder-bar-title-caret:focus {
1904	border: 2px solid transparent !important;
1905	text-decoration: none;
1906	}













1907	.fl-builder--menu .fl-inset {

1908	padding-left:35px;
1909	font-size: 14px;
1910	line-height: 1.25;
	@@ -1946,8 +2048,9 @@ button.fl-builder-button.fl-builder-bar-title-caret:focus {
1946	right:0;
1947	width: 380px;
1948	max-width: 100%;
1949	- height:~~46px~~;
1950	padding: 4px;

1951	flex-direction: row;
1952	justify-content: flex-end;
1953	opacity:1;
	@@ -2156,7 +2259,6 @@ button.fl-builder-button.fl-builder-bar-title-caret:focus {
2156	border-radius: 4px;
2157	min-height: 100px;
2158	overflow-x: hidden;
2159	- width: 100%;
2160	}
2161	.fl-col-has-cols.fl-col-highlight > .fl-col-content {
2162	padding: 8px;
	@@ -2324,6 +2426,8 @@ button.fl-builder-button.fl-builder-bar-title-caret:focus {
2324	.fl-block-overlay * {
2325	text-shadow: none;
2326	-webkit-touch-callout: none;


2327	}
2328	.fl-block-overlay-active {
2329	position: relative;
	@@ -2337,6 +2441,8 @@ button.fl-builder-button.fl-builder-bar-title-caret:focus {
2337	text-shadow: none;
2338	border-bottom-right-radius: 5px;
2339	border-top-left-radius: 3px;


2340	}
2341	.fl-row-overlay-header-bottom .fl-block-overlay-actions {
2342	border-radius: 0;
	@@ -2482,6 +2588,9 @@ button.fl-builder-button.fl-builder-bar-title-caret:focus {
2482	padding-bottom: 15px;
2483	padding-top: 15px;
2484	}



2485
2486	/* Global Overlays */
2487	.fl-block-overlay-global {
	@@ -3082,8 +3191,8 @@ form.fl-builder-settings {
3082	------------------------------------------------------ */
3083
3084	.fl-lightbox-width-slim .fl-form-table {
3085	- margin: ~~20px~~ ~~25px~~ 10px ~~15px~~ !important;
3086	- width: calc(100% - ~~60px~~);
3087	}
3088	.fl-lightbox-width-slim .fl-form-table th {
3089	display: block;
	@@ -3095,7 +3204,7 @@ form.fl-builder-settings {
3095	display: block;
3096	}
3097	.fl-lightbox-width-slim .fl-form-table td:first-child {
3098	- padding-left: ~~10px~~ !important;
3099	}
3100	.fl-lightbox-width-slim .fl-form-table .fl-field[data-type="editor"] td:first-child {
3101	padding-left: 0px !important;
	@@ -3112,24 +3221,66 @@ form.fl-builder-settings {
3112	padding: 0 5px !important;
3113	}
3114







3115	/* Slim - Selects */
3116	.fl-lightbox-width-slim .fl-builder-settings-fields select {
3117	width: 100%;
3118	}
3119





3120	/* Slim - Color Picker */
3121	.fl-lightbox-width-slim .fl-color-picker {
3122	display: flex;
3123	width:auto;
3124	}
3125	.fl-lightbox-width-slim .fl-color-picker-clear {
3126	- flex: 0 0 ~~50px~~;



























3127	}
3128
3129	/* Slim - TinyMCE */
3130	.fl-lightbox-width-slim .mce-menubtn.mce-fixed-width button {
3131	width: 72px !important;
3132	}



3133	.fl-lightbox-width-micro .mce-menubtn.mce-fixed-width button {
3134	width: 38px !important;
3135	}
	@@ -3137,6 +3288,72 @@ form.fl-builder-settings {
3137	.fl-lightbox-width-micro .mce-btn[aria-label="Blockquote"] {
3138	display: none;
3139	}


































































3140
3141	/* Slim - Repeaters */
3142	.fl-lightbox-width-slim .fl-builder-field-multiple {
	@@ -3150,11 +3367,19 @@ form.fl-builder-settings {
3150	.fl-lightbox-width-slim .fl-builder-field-multiple .fl-field-control {
3151	width: 100% !important;
3152	}



3153	.fl-lightbox-width-slim .fl-builder-field-multiple .fl-builder-field-actions {
3154	position: absolute !important;
3155	top:0;
3156	right:0;
3157	width: 70px;





3158	}
3159
3160	/* Slim - Time */
	@@ -3166,12 +3391,12 @@ form.fl-builder-settings {
3166	------------------------------------------------------ */
3167
3168	.fl-builder-settings-tabs {
3169	- margin: 6px 6px 6px;
3170	- border: 2px solid #e6eaed;
3171	- border-radius: 4px;
3172	display: flex;
3173	flex-direction: row;

3174	overflow: hidden;


3175	}
3176
3177	.fl-builder-content-group-select {
	@@ -3185,7 +3410,6 @@ form.fl-builder-settings {
3185	width: 100%;
3186	-webkit-appearance: none;
3187	-moz-appearance: none;
3188	- appearance: none;
3189	box-sizing: border-box;
3190	padding: 8px 10px;
3191	background: white url(../img/svg/select-arrow-down-alt2.svg) no-repeat center right 10px !important;
	@@ -3213,31 +3437,22 @@ body .fl-builder-settings-tabs > * {
3213	background: transparent;
3214	border: 2px solid transparent;
3215	border-radius:0;
3216	- display: inline-block;
3217	margin: 0;
3218	outline: none;
3219	- padding: ~~6px~~ ~~15px~~;
3220	text-decoration: none !important;
3221	- font-size: ~~14px~~;
3222	font-weight: normal !important;
3223	flex: 0 0 auto;
3224	white-space: nowrap;
3225	overflow: hidden;
3226	text-overflow: ellipsis;
3227	- display:~~block~~;
3228	- ~~text~~-~~align~~: center;
3229	- }
3230	- body .fl-builder-settings-tabs > *:first-child {
3231	- border-top-left-radius: 3px;
3232	- border-bottom-left-radius: 3px;
3233	- }
3234	- body .fl-builder-settings-tabs > *:last-child {
3235	- border-top-right-radius: 3px;
3236	- border-bottom-right-radius: 3px;
3237	}
3238	body .fl-lightbox-width-slim .fl-builder-settings-tabs > * {
3239	flex: 1 1 auto;
3240	- padding: 6px 8px;
3241	}
3242	body .fl-builder-settings-tabs > .fl-builder-settings-tabs-more {
3243	flex: 0 0 60px;
	@@ -3280,7 +3495,7 @@ body .fl-lightbox-has-tab-overflow .fl-builder-settings-tabs-more {
3280	color: #0086b0 !important;
3281	fill: #0086b0 !important;
3282	position: relative;
3283	- background: #~~e6eaed~~;
3284	}
3285	.fl-builder-settings-tabs .fl-overflowed,
3286	.fl-builder-settings-tabs .fl-active.fl-overflowed {
	@@ -3393,7 +3608,7 @@ body .fl-lightbox-has-tab-overflow .fl-builder-settings-tabs-more {
3393	.fl-form-table th {
3394	border: none !important;
3395	font-weight: normal !important;
3396	- padding: 10px !important;
3397	padding-left:30px !important;
3398	text-align: left !important;
3399	vertical-align: top !important;
	@@ -3408,6 +3623,12 @@ body .fl-lightbox-has-tab-overflow .fl-builder-settings-tabs-more {
3408	width: auto;
3409	max-width: 100%;
3410	}






3411	.fl-form-table td {
3412	background: transparent !important;
3413	border: none !important;
	@@ -3416,7 +3637,7 @@ body .fl-lightbox-has-tab-overflow .fl-builder-settings-tabs-more {
3416	text-align: left !important;
3417	}
3418	.fl-lightbox-width-slim .fl-form-table td {
3419	- padding: 4px 0 ~~10px~~;
3420	}
3421
3422	/* Settings Fields
	@@ -3438,6 +3659,7 @@ body .fl-lightbox-has-tab-overflow .fl-builder-settings-tabs-more {
3438	}
3439	.fl-builder-settings-fields .fl-nanoscroller-content {
3440	padding: 0;

3441	}
3442	.fl-builder-settings-fields .fl-field-control-wrapper {
3443	position: relative;
	@@ -3455,6 +3677,7 @@ body .fl-lightbox-has-tab-overflow .fl-builder-settings-tabs-more {
3455	.fl-builder-settings-fields input[type=search],
3456	.fl-builder-settings-fields input[type=tel],
3457	.fl-builder-settings-fields input[type=url],

3458	.fl-builder-settings-fields select {
3459	background: #fff !important;
3460	border-color: transparent !important;
	@@ -3469,7 +3692,7 @@ body .fl-lightbox-has-tab-overflow .fl-builder-settings-tabs-more {
3469	line-height: 15px;
3470	margin: 1px;
3471	outline: none;
3472	- padding: 3px ~~9px~~;
3473	width: auto;
3474	box-sizing: border-box;
3475	}
	@@ -3481,6 +3704,7 @@ body .fl-lightbox-has-tab-overflow .fl-builder-settings-tabs-more {
3481	.fl-builder-settings-fields input[type=search],
3482	.fl-builder-settings-fields input[type=tel],
3483	.fl-builder-settings-fields input[type=url],

3484	.fl-builder-settings-fields select:not(multiple) {
3485	height: 36px !important;
3486	}
	@@ -3500,6 +3724,7 @@ body .fl-lightbox-has-tab-overflow .fl-builder-settings-tabs-more {
3500	.fl-builder-lightbox .fl-builder-settings-fields input[type=search]:focus,
3501	.fl-builder-lightbox .fl-builder-settings-fields input[type=tel]:focus,
3502	.fl-builder-lightbox .fl-builder-settings-fields input[type=url]:focus,

3503	.fl-builder-lightbox .fl-builder-settings-fields select:focus {
3504	border-width: 2px !important;
3505	border-style: solid !important;
	@@ -3527,11 +3752,11 @@ body .fl-lightbox-has-tab-overflow .fl-builder-settings-tabs-more {
3527	font-weight: normal;
3528	user-select: none;
3529	margin-bottom:3px;

3530	}
3531	.fl-builder-settings-fields select {
3532	-webkit-appearance: none;
3533	-moz-appearance: none;
3534	- appearance: none;
3535	box-sizing: border-box;
3536	color: #000;
3537	margin: 0;
	@@ -3547,75 +3772,21 @@ body .fl-lightbox-has-tab-overflow .fl-builder-settings-tabs-more {
3547	.fl-photo-field select,
3548	.fl-builder-custom-field select {
3549	-webkit-box-shadow: none;

3550	border-color: #e6eaed !important;
3551	}
3552	- .fl-font-field .fl-font-field-font {
3553	- margin-bottom:4px;
3554	- width: calc( 70% - 5px ) !important;
3555	- }
3556	- .fl-font-field .fl-font-field-weight {
3557	- width:30% !important;
3558	- }
3559	-
3560	- /* Add predefined value dropdown for text field */
3561	- .fl-builder-settings-fields .fl-text-field-add-value {
3562	- min-width: 50%;
3563	- margin-top: .62em;
3564	- }
3565	-
3566	- .fl-lightbox-width-slim input.text-full + .fl-field-description,
3567	- .fl-lightbox-width-slim select + .fl-field-description {
3568	- display: block;
3569	- padding: 8px 10px;
3570	- margin: 0;
3571	- }
3572	-
3573	- /* Dimension Field */
3574	- .fl-field[data-type="dimension"] .fl-field-control-wrapper {
3575	- display: flex;
3576	- }
3577	- .fl-field[data-type="dimension"] .fl-field-description {
3578	- padding-top: 9px;
3579	- }
3580	- .fl-field[data-type="dimension"] .fl-field-responsive-toggle {
3581	- padding: 9px 9px 0 0;
3582	- }
3583	- .fl-dimension-field-units {
3584	- display: flex;
3585	- }
3586	- .fl-dimension-field-unit {
3587	- padding-right: 5px;
3588	- }
3589	- .fl-dimension-field-unit input {
3590	- max-width: 60px;

WordPress Page Builder – Beaver Builder - Version 2.2.0.6

Version Description

Release Info

Code changes from version 2.1.7.2 to 2.2.0.6