Instagram Feed - Version 6.0.1

Version Description

  • Fix: Custom HTML templates were not applying to new feeds.
  • Fix: Some custom tables were not being created for specific versions of MySQL.
  • Fix: The shortcode setting "showfollow=false" was not working for legacy feeds.
  • Fix: The shortcode settings "showheader" and "showbio" were applying for non-legacy feeds causing confusion when trying to change these settings in the customizer.
  • Fix: The customizer would not resize images causing blank images to show when GDPR features were enabled.
  • Fix: Fixed PHP warning "Undefined array key tagged".
Download this release

Release Info

Developer Craig at Smash Balloon
Plugin Icon 128x128 Instagram Feed
Version 6.0.1
Comparing to
See all releases

Code changes from version 6.0 to 6.0.1

Files changed (61) hide show
  1. README.txt +860 -852
  2. admin/SBI_About_Us.php +326 -326
  3. admin/SBI_Admin_Notices.php +292 -292
  4. admin/SBI_Global_Settings.php +1208 -1208
  5. admin/SBI_HTTP_Request.php +100 -100
  6. admin/SBI_Response.php +25 -25
  7. admin/SBI_Support.php +800 -800
  8. admin/SBI_Upgrader.php +384 -384
  9. admin/SBI_View.php +40 -40
  10. admin/SBI_oEmbeds.php +433 -433
  11. admin/Traits/SBI_Settings.php +203 -203
  12. admin/assets/css/about.css +785 -785
  13. admin/assets/css/admin-notifications.css +224 -224
  14. admin/assets/css/oembeds.css +799 -799
  15. admin/assets/css/settings.css +1861 -1861
  16. admin/assets/css/support.css +1033 -1033
  17. admin/assets/img/about/api-error.png +0 -0
  18. admin/assets/img/about/icon-full.svg +0 -0
  19. admin/assets/img/about/icon-none.svg +0 -0
  20. admin/assets/img/about/icon-partial.svg +0 -0
  21. admin/assets/img/about/plugin-if.png +0 -0
  22. admin/assets/img/about/plugin-mi.png +0 -0
  23. admin/assets/img/about/plugin-om.png +0 -0
  24. admin/assets/img/about/plugin-rp.png +0 -0
  25. admin/assets/img/about/plugin-seo.png +0 -0
  26. admin/assets/img/about/plugin-smtp.png +0 -0
  27. admin/assets/img/about/plugin-tw.jpg +0 -0
  28. admin/assets/img/about/plugin-wpforms.png +0 -0
  29. admin/assets/img/about/plugin-yt.png +0 -0
  30. admin/assets/img/balloon-120.png +0 -0
  31. admin/assets/img/balloon.png +0 -0
  32. admin/assets/img/book-icon.png +0 -0
  33. admin/assets/img/cff-icon.png +0 -0
  34. admin/assets/img/cff-sprite.png +0 -0
  35. admin/assets/img/fb-icon.png +0 -0
  36. admin/assets/img/fb-icon.svg +16 -16
  37. admin/assets/img/fb-icon2.png +0 -0
  38. admin/assets/img/fb-icon3.png +0 -0
  39. admin/assets/img/group-app.png +0 -0
  40. admin/assets/img/insta-icon.svg +23 -23
  41. admin/assets/img/instagram-color-icon.svg +17 -17
  42. admin/assets/img/instagram-icon.png +0 -0
  43. admin/assets/img/oembeds-image-1@2x.png +0 -0
  44. admin/assets/img/oembeds-image-2@2x.png +0 -0
  45. admin/assets/img/oembeds-image-3@2x.png +0 -0
  46. admin/assets/img/oembeds-image-4@2x.png +0 -0
  47. admin/assets/img/rocket-icon.png +0 -0
  48. admin/assets/img/save-plus-icon.png +0 -0
  49. admin/assets/img/sbi-icon.png +0 -0
  50. admin/assets/img/social-wall-graphic.png +0 -0
  51. admin/assets/img/social-wall-graphic2.png +0 -0
  52. admin/assets/img/support-members.png +0 -0
  53. admin/assets/img/team-avatar.png +0 -0
  54. admin/assets/img/twitter-icon.svg +16 -16
  55. admin/assets/img/youtube-icon.svg +16 -16
  56. admin/assets/js/about.js +145 -145
  57. admin/assets/js/admin-notifications.js +208 -208
  58. admin/assets/js/oembeds.js +176 -176
  59. admin/assets/js/settings.js +1059 -1059
  60. admin/assets/js/support.js +122 -122
  61. admin/builder/assets/css/builder.css +3641 -5081
README.txt CHANGED
@@ -1,852 +1,860 @@
1
- === Smash Balloon Social Photo Feed ===
2
- Contributors: smashballoon, craig-at-smash-balloon
3
- Tags: Instagram, Instagram feed, Instagram photos, Instagram widget, Instagram gallery
4
- Requires at least: 4.1
5
- Tested up to: 5.9
6
- Stable tag: 6.0
7
- License: GPLv2 or later
8
- License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
-
10
- Formerly "Instagram Feed". Display clean, customizable, and responsive Instagram feeds from multiple accounts. Supports Instagram oEmbeds.
11
-
12
- == Description ==
13
-
14
- Display Instagram posts from your Instagram accounts, either in the same single feed or in multiple different ones.
15
-
16
- = Features =
17
- * **New:** Now automatically powers your **Instagram oEmbeds**
18
- * Super **simple to set up**
19
- * Display photos from **multiple Instagram accounts** in the same feed or in separate feeds
20
- * Completely **responsive** and mobile ready - layout looks great on any screen size and in any container width
21
- * **Completely customizable** - Customize the width, height, number of photos, number of columns, image size, background color, image spacing and more!
22
- * Display **multiple Instagram feeds** on the same page or on different pages throughout your site
23
- * **GDPR Compliance** - automatically integrates with many of the popular GDPR cookie consent plugins and includes a 1-click easy GDPR setting.
24
- * Use the built-in **shortcode options** to completely customize each of your Instagram feeds
25
- * Display thumbnail, medium or **full-size photos** from your Instagram feed
26
- * **Infinitely load more** of your Instagram photos with the 'Load More' button
27
- * Includes a **Follow on Instagram button** at the bottom of your feed
28
- * Display a **beautiful header** at the top of your feed
29
- * Display your Instagram photos chronologically or in random order
30
- * Add your own Custom CSS and JavaScript for even deeper customizations
31
- * Handy block for easily adding your feed to posts and pages using the block editor
32
-
33
- = Benefits =
34
- * **Increase Social Engagement** - Increase engagement between you and your Instagram followers. Increase your number of followers by displaying your Instagram content directly on your site.
35
- * **Save Time** - Don't have time to update your photos on your site? Save time and increase efficiency by only posting your photos to Instagram and automatically displaying them on your website
36
- * **Display Your Content Your Way** - Customize your Instagram feeds to look exactly the way you want, so that they blend seemlessly into your site or pop out at your visitors!
37
- * **Keep Your Site Looking Fresh** - Automatically push your new Instagram content straight to your site to keep it looking fresh and keeping your audience engaged.
38
- * **Super simple to set up** - Once installed, you can be displaying your Instagram photos within 30 seconds! No confusing steps or Instagram Developer account needed.
39
- * **Powers all Instagram oEmbeds on your site** - With WordPress removing support for Instagram oEmbeds, the plugin will now power all Instagram embeds on your site, old and new, to allow them to continue working.
40
-
41
- = Pro Version =
42
- In order to maintain the free version of the plugin on an ongoing basis, and to provide quick and effective support for free, we offer a Pro version of the plugin. The Pro version allows you to:
43
- * Display Hashtag feeds
44
- * View photos and videos in a popup lightbox directly on your site
45
- * View post comments for user feeds
46
- * Display the number of like and comments for each post
47
- * Create carousels from your posts
48
- * Use "Masonry" or "Highlight" layouts for your feeds
49
- * Display captions for photos and videos
50
- * Filter posts based on hashtag/word
51
- * Advanced moderation system for hiding/showing certain posts
52
- * Block posts by specific users
53
- * Create "shoppable" Instagram feeds, and more.
54
-
55
- [Find out more about the Pro version](https://smashballoon.com/instagram-feed/?utm_campaign=instagram-free-readme&utm_source=proversion&utm_medium=profindout "Instagram Feed Pro") or [try out the Pro demo](https://smashballoon.com/instagram-feed/demo/?utm_campaign=instagram-free-readme&utm_source=proversion&utm_medium=readmedemo "Instagram Feed Pro Demo").
56
-
57
- = Featured Reviews =
58
- "**Simple and concise** - Excellent plugin. Simple and non-bloated. I had a couple small issues with the plugin when I first started using it, but a quick comment on the support forums got a new version pushed out the next day with the fix. Awesome support!" - [Josh Jones](https://wordpress.org/support/topic/simple-and-concise-3 'Simple and concise Instagram plugin')
59
-
60
- "**Great plugin, greater support!** - I've definitely noticed an increase in followers on Instagram since I added this plugin to my sidebar. Thanks for the help in making some adjustments...looks and works great!" - [BNOTP](https://wordpress.org/support/topic/thanks-for-a-great-plugin-6 'Great plugin, greater Support!')
61
-
62
- = Feedback or Support =
63
- We're dedicated to providing the most customizable, robust and well supported Instagram feed plugin in the world, so if you have an issue or have any feedback on how to improve the plugin then please open a ticket in the [Support forum](http://wordpress.org/support/plugin/instagram-feed 'Instagram Feed Support Forum').
64
-
65
- For a pop-up photo **lightbox**, to display posts by **hashtag**, show photo **captions**, **video** support + more, check out the [Pro version](http://smashballoon.com/instagram-feed/?utm_campaign=instagram-free-readme&utm_source=feedbacj&utm_medium=support 'Instagram Feed Pro').
66
-
67
- == Installation ==
68
-
69
- 1. Install the Instagram Feed plugin either via the WordPress plugin directory, or by uploading the files to your web server (in the `/wp-content/plugins/` directory).
70
- 2. Activate the Instagram Feed plugin through the 'Plugins' menu in WordPress.
71
- 3. Navigate to the 'Instagram Feed' settings page to connect your Instagram account.
72
- 4. Use the shortcode `[instagram-feed]` in your page, post or widget to display your Instagram photos.
73
- 5. You can display multiple Instagram feeds by using shortcode options, for example: `[instagram-feed num=6 cols=3]`
74
-
75
- For simple step-by-step directions on how to set up the Instagram Feed plugin please refer to our [setup guide](http://smashballoon.com/instagram-feed/free/?utm_campaign=instagram-free-readme&utm_source=installation&utm_medium=setup 'Instagram Feed setup guide').
76
-
77
- = Display your Feed =
78
-
79
- **Single Instagram Feed**
80
-
81
- Copy and paste the following shortcode directly into the page, post or widget where you'd like the Instagram feed to show up: `[instagram-feed]`
82
-
83
- **Multiple Instagram Feeds**
84
-
85
- If you'd like to display multiple Instagram feeds then you can set different settings directly in the shortcode like so: `[instagram-feed num=9 cols=3]`
86
-
87
- If you'd like to display feed from more than one account, connect multiple accounts on the "Configure" tab and then add the user name in the shortcode: `[instagram-feed user="ANOTHER_USER_NAME"]`
88
-
89
- You can display as many different Instagram feeds as you like, on either the same page or on different pages, by just using the shortcode options below. For example:
90
- `[instagram-feed]`
91
- `[instagram-feed user="ANOTHER_USER_NAME"]`
92
- `[instagram-feed user="ANOTHER_USER_NAME, YET_ANOTHER_USER_NAME" num=4 cols=4 showfollow=false]`
93
-
94
- See the table below for a full list of available shortcode options:
95
-
96
- = Shortcode Options =
97
- * **General Options**
98
- * **user** - An Instagram User Name (must have account connected) - Example: `[instagram-feed user=AN_INSTAGRAM_USER_NAME]`
99
- * **width** - The width of your Instagram feed. Any number - Example: `[instagram-feed width=50]`
100
- * **widthunit** - The unit of the width of your Instagram feed. 'px' or '%' - Example: `[instagram-feed widthunit=%]`
101
- * **height** - The height of your Instagram feed. Any number - Example: `[instagram-feed height=250]`
102
- * **heightunit** - The unit of the height of your Instagram feed. 'px' or '%' - Example: `[instagram-feed heightunit=px]`
103
- * **background** - The background color of the Instagram feed. Any hex color code - Example: `[instagram-feed background=#ffff00]`
104
- * **class** - Add a CSS class to the Instagram feed container - Example: `[instagram-feed class=feedOne]`
105
- *
106
- * **Photo Options**
107
- * **sortby** - Sort the Instagram posts by Newest to Oldest (none) or Random (random) - Example: `[instagram-feed sortby=random]`
108
- * **num** - The number of Instagram posts to display initially. Maximum is 33 - Example: `[instagram-feed num=10]`
109
-
110
- * **cols** - The number of columns in your Instagram feed. 1 - 10 - Example: `[instagram-feed cols=5]`
111
- * **imageres** - The resolution/size of the Instagram photos. 'auto', full', 'medium' or 'thumb' - Example: `[instagram-feed imageres=full]`
112
- * **imagepadding** - The spacing around your Instagram photos - Example: `[instagram-feed imagepadding=10]`
113
- * **imagepaddingunit** - The unit of the padding in your Instagram feed. 'px' or '%' - Example: `[instagram-feed imagepaddingunit=px]`
114
- * **disablemobile** - Disable the mobile layout for your Instagram feed. 'true' or 'false' - Example: `[instagram-feed disablemobile=true]`
115
- *
116
- * **Header Options**
117
- * **showheader** - Whether to show the Instagram feed Header. 'true' or 'false' - Example: `[instagram-feed showheader=false]`
118
- * **showbio** - Whether to show the account's bio in the Instagram feed Header. 'true' or 'false' - Example: `[instagram-feed showbio=false]`
119
- * **custombio** - Custom Bio text for the Instagram feed Header - Example: `[instagram-feed custombio="My custom bio."]`
120
- * **customavatar** - URL of a custom Avatar for the header. Example: `[instagram-feed customavatar="https://my-site.com/avatar.jpg"]`
121
-
122
- * **headercolor** - The color of the Instagram feed Header text. Any hex color code - Example: `[instagram-feed headercolor=#333]`
123
- *
124
- * **'Load More' Button Options**
125
- * **showbutton** - Whether to show the 'Load More' button. 'true' or 'false' - Example: `[instagram-feed showbutton='false']`
126
- * **buttoncolor** - The background color of the button. Any hex color code - Example: `[instagram-feed buttoncolor=#000]`
127
- * **buttontextcolor** - The text color of the button. Any hex color code - Example: `[instagram-feed buttontextcolor=#fff]`
128
- * **buttontext** - The text used for the button - Example: `[instagram-feed buttontext="Load More Photos"]`
129
- *
130
- * **'Follow on Instagram' Button Options**
131
- * **showfollow** - Whether to show the 'Follow on Instagram' button. 'true' or 'false' - Example: `[instagram-feed showfollow=true]`
132
- * **followcolor** - The background color of the 'Follow on Instagram' button. Any hex color code - Example: `[instagram-feed followcolor=#ff0000]`
133
- * **followtextcolor** - The text color of the 'Follow on Instagram' button. Any hex color code - Example: `[instagram-feed followtextcolor=#fff]`
134
- * **followtext** - The text used for the 'Follow on Instagram' button - Example: `[instagram-feed followtext="Follow me"]`
135
-
136
- For more shortcode options, check out the [Pro version](http://smashballoon.com/instagram-feed/?utm_campaign=instagram-free-readme&utm_source=shortcode&utm_medium=shortcodepro 'Instagram Feed Pro').
137
-
138
- = Setting up the Free Instagram Feed WordPress Plugin =
139
-
140
- 1) Once you've installed the Instagram Feed plugin click on the Instagram Feed item in your WordPress menu
141
-
142
- 2) Click on the large blue Instagram button to log into your Instagram account and connect your Instagram account. If you're having trouble retrieving your Instagram information from Instagram then try using the Instagram button on [this page](https://smashballoon.com/instagram-feed/token/?utm_campaign=instagram-free-readme&utm_source=settingup&utm_medium=connectionproblem) instead.
143
-
144
- You can also display photos from other Instagram accounts by connecting additional Instagram accounts and adding the user name in the shortcode.
145
-
146
- 3) Navigate to the Instagram Feed customize page to customize your Instagram feed.
147
-
148
- 4) Once you've customized your Instagram feed, click on the Display Your Feed tab to grab the [instagram-feed] shortcode.
149
-
150
- 5) Copy the Instagram Feed shortcode and paste it into any page, post or widget where you want the Instagram feed to appear.
151
-
152
- 6) You can paste the Instagram Feed shortcode directly into your page editor.
153
-
154
- 7) You can use the default WordPress 'Text' widget to display your Instagram Feed in a sidebar or other widget area.
155
-
156
- == Frequently Asked Questions ==
157
-
158
- = Can I display multiple Instagram feeds on my site or on the same page? =
159
-
160
- Yep. You can display multiple Instagram feeds by using our built-in shortcode options, for example: `[instagram-feed user="smashballoon" cols=3]`. Be sure to connect the related Instagram account on the "Configure" tab.
161
-
162
- = Can I display photos from more than one Instagram account in one single feed? =
163
-
164
- Yep. You can add multiple user names from the connected accounts on the plugin's Settings page, or directly in the shortcode, separated by commas, like so: `[instagram-feed user="smashballoon, instagramfeed"]`.
165
-
166
- = Does the plugin work with Instagram oEmbeds? =
167
-
168
- In version 2.5, support was added to allow the plugin to power your Instagram oEmbeds as official support for these is no longer available in WordPress core. Just connect your account on the oEmbeds settings page inside the plugin and we'll do the rest. No developer app or account required.
169
-
170
- = How do I find my Instagram Access Token and Instagram User ID =
171
-
172
- We've made it super easy. Simply click on the big blue button on the Instagram Feed Settings page and log into your Instagram account. The plugin will then ask if you'd like to connect the account and start using it in a feed.
173
-
174
- = My Instagram feed isn't displaying. Why not!? =
175
-
176
- There are a few common reasons for this:
177
-
178
- * **Your Access Token may not be valid.** Try clicking on the blue Instagram login button on the plugin's Settings page again and copy and paste the Instagram token it gives you into the plugin's Access Token field.
179
- * **The plugin's JavaScript file isn't being included in your page.** This is most likely because your WordPress theme is missing the WordPress [wp_footer](http://codex.wordpress.org/Function_Reference/wp_footer) function which is required for plugins to be able to add their JavaScript files to your page. You can fix this by opening your theme's **footer.php** file and adding the following directly before the closing </body> tag: `<?php wp_footer(); ?>`
180
- * **Your website may contain a JavaScript error which is preventing JavaScript from running.** The plugin uses JavaScript to load the Instagram photos into your page and so needs JavaScript to be running in order to work. You would need to remove any existing JavaScript errors on your website for the plugin to be able to load in your feed.
181
-
182
- If you're still having an issue displaying your feed then please open a ticket in the [Support forum](http://wordpress.org/support/plugin/instagram-feed 'Instagram Feed Support Forum') with a link to the page where you're trying to display the Instagram feed and, if possible, a link to your Instagram account.
183
-
184
- = Are there any security issues with using an Access Token on my site? =
185
-
186
- Nope. The Access Token used in the plugin is a "read only" token, which means that it could never be used maliciously to manipulate your Instagram account.
187
-
188
- = Can I view the full-size photos or play Instagram videos directly on my website? =
189
-
190
- This is a feature of the [Pro version](http://smashballoon.com/instagram-feed/?utm_campaign=instagram-free-readme&utm_source=faqs&utm_medium=fullsize 'Instagram Feed Pro') of the plugin, which allows you to view the photos in a pop-up lightbox, support videos, display captions, display photos by hashtag + more!
191
-
192
- = How do I embed my Instagram Feed directly into a WordPress page template? =
193
-
194
- You can embed your Instagram feed directly into a template file by using the WordPress [do_shortcode](http://codex.wordpress.org/Function_Reference/do_shortcode) function: `<?php echo do_shortcode('[instagram-feed]'); ?>`.
195
-
196
- = My Feed Stopped Working – All I see is a Loading Symbol =
197
-
198
- If your Instagram photos aren't loading and all your see is a loading symbol then there are a few common reasons:
199
-
200
- 1) There's an issue with the Instagram Access Token that you are using
201
-
202
- You can obtain a new Instagram Access Token on the Instagram Feed Settings page by clicking the blue Instagram login button and then copy and pasting it into the plugin's 'Access Token' field.
203
-
204
- Occasionally the blue Instagram login button does not produce a working access token. You can try [this link](https://smashballoon.com/instagram-feed/token/?utm_campaign=instagram-free-readme&utm_source=faqs&utm_medium=faqconnectionissue) as well.
205
-
206
- 2) The plugin's JavaScript file isn't being included in your page
207
-
208
- This is most likely because your WordPress theme is missing the WordPress wp_footer function which is required for plugins to be able to add their JavaScript files to your page. You can fix this by opening your theme's footer.php file and adding the following directly before the closing </body> tag:
209
-
210
- <?php wp_footer(); ?>
211
-
212
- 3) There's a JavaScript error on your site which is preventing the plugin's JavaScript file from running
213
-
214
- You find find out whether this is the case by right clicking on your page, selecting 'Inspect Element', and then clicking on the 'Console' tab, or by selecting the 'JavaScript Console' option from your browser's Developer Tools.
215
-
216
- If a JavaScript error is occurring on your site then you'll see it listed in red along with the JavaScript file which is causing it.
217
-
218
- 4) The feed you are trying to display has no Instagram posts
219
-
220
- If you are trying to display an Instagram feed that has no posts made to it, a loading symbol may be all that shows for the Instagram feed or nothing at all. Once you add an Instagram post the Instagram feed should display normally
221
-
222
- 5) The shortcode you are using is incorrect
223
-
224
- You may have an error in the Instagram Feed shortcode you are using or are missing a necessary argument.
225
-
226
- = What are the available shortcode options that I can use to customize my Instagram feed? =
227
-
228
- The below options are available on the Instagram Feed Settings page but can also be used directly in the `[instagram-feed]` shortcode to customize individual Instagram feeds on a feed-by-feed basis.
229
-
230
- * **General Options**
231
- * **user** - An Instagram User Name (must have account connected) - Example: `[instagram-feed user=AN_INSTAGRAM_USER_NAME]`
232
- * **width** - The width of your Instagram feed. Any number - Example: `[instagram-feed width=50]`
233
- * **widthunit** - The unit of the width of your Instagram feed. 'px' or '%' - Example: `[instagram-feed widthunit=%]`
234
- * **height** - The height of your Instagram feed. Any number - Example: `[instagram-feed height=250]`
235
- * **heightunit** - The unit of the height of your Instagram feed. 'px' or '%' - Example: `[instagram-feed heightunit=px]`
236
- * **background** - The background color of the Instagram feed. Any hex color code - Example: `[instagram-feed background=#ffff00]`
237
- * **class** - Add a CSS class to the Instagram feed container - Example: `[instagram-feed class=feedOne]`
238
- *
239
- * **Photo Options**
240
- * **sortby** - Sort the Instagram posts by Newest to Oldest (none) or Random (random) - Example: `[instagram-feed sortby=random]`
241
- * **num** - The number of Instagram posts to display initially. Maximum is 33 - Example: `[instagram-feed num=10]`
242
-
243
- * **cols** - The number of columns in your Instagram feed. 1 - 10 - Example: `[instagram-feed cols=5]`
244
- * **imageres** - The resolution/size of the Instagram photos. 'auto', full', 'medium' or 'thumb' - Example: `[instagram-feed imageres=full]`
245
- * **imagepadding** - The spacing around your Instagram photos - Example: `[instagram-feed imagepadding=10]`
246
- * **imagepaddingunit** - The unit of the padding in your Instagram feed. 'px' or '%' - Example: `[instagram-feed imagepaddingunit=px]`
247
- * **disablemobile** - Disable the mobile layout for your Instagram feed. 'true' or 'false' - Example: `[instagram-feed disablemobile=true]`
248
- *
249
- * **Header Options**
250
- * **showheader** - Whether to show the Instagram feed Header. 'true' or 'false' - Example: `[instagram-feed showheader=false]`
251
- * **showbio** - Whether to show the account's bio in the Instagram feed Header. 'true' or 'false' - Example: `[instagram-feed showbio=false]`
252
- * **custombio** - Custom Bio text for the Instagram feed Header - Example: `[instagram-feed custombio="My custom bio."]`
253
- * **customavatar** - URL of a custom Avatar for the header. Example: `[instagram-feed customavatar="https://my-site.com/avatar.jpg"]`
254
-
255
- * **headercolor** - The color of the Instagram feed Header text. Any hex color code - Example: `[instagram-feed headercolor=#333]`
256
- *
257
- * **'Load More' Button Options**
258
- * **showbutton** - Whether to show the 'Load More' button. 'true' or 'false' - Example: `[instagram-feed showbutton='false']`
259
- * **buttoncolor** - The background color of the button. Any hex color code - Example: `[instagram-feed buttoncolor=#000]`
260
- * **buttontextcolor** - The text color of the button. Any hex color code - Example: `[instagram-feed buttontextcolor=#fff]`
261
- * **buttontext** - The text used for the button - Example: `[instagram-feed buttontext="Load More Photos"]`
262
- *
263
- * **'Follow on Instagram' Button Options**
264
- * **showfollow** - Whether to show the 'Follow on Instagram' button. 'true' or 'false' - Example: `[instagram-feed showfollow=true]`
265
- * **followcolor** - The background color of the 'Follow on Instagram' button. Any hex color code - Example: `[instagram-feed followcolor=#ff0000]`
266
- * **followtextcolor** - The text color of the 'Follow on Instagram' button. Any hex color code - Example: `[instagram-feed followtextcolor=#fff]`
267
- * **followtext** - The text used for the 'Follow on Instagram' button - Example: `[instagram-feed followtext="Follow me"]`
268
-
269
- For more shortcode options, check out the [Pro version](http://smashballoon.com/instagram-feed/?utm_campaign=instagram-free-readme&utm_source=whatare&utm_medium=proshortcode 'Instagram Feed Pro').
270
-
271
- For more FAQs related to the Instagram Feed plugin please visit the [FAQ section](https://smashballoon.com/instagram-feed/support/faq/?utm_campaign=instagram-free-readme&utm_source=whatare&utm_medium=faqs 'Instagram Feed plugin FAQs') on our website.
272
-
273
- == Screenshots ==
274
-
275
- 1. Easily display feeds from any of your Instagram accounts
276
- 2. Your Instagram Feed is completely customizable and responsive
277
- 3. Combine multiple accounts into a single feed
278
- 5. Super quick and easy to get started. Just click the button to connect an Instagram account.
279
- 5. Customize layouts, styles, colors, and more
280
- 6. Just copy and paste the shortcode into any page, post or widget on your site
281
-
282
- == Other Notes ==
283
-
284
- Add beautifully clean, customizable, and responsive Instagram feeds to your website. Super simple to set up and tons of customization options to seamlessly match the look and feel of your site.
285
-
286
- = Why do I need this? =
287
-
288
- **Increase Social Engagement**
289
- Increase engagement between you and your Instagram followers. Increase your number of Instagram followers by displaying your Instagram content directly on your site.
290
-
291
- **Save Time**
292
- Don't have time to update your photos on your site? Save time and increase efficiency by only posting your photos to Instagram and automatically displaying them on your website.
293
-
294
- **Display Your Content Your Way**
295
- Customize your Instagram feeds to look exactly the way you want, so that they blend seemlessly into your site or pop out at your visitors!
296
-
297
- **Keep Your Site Looking Fresh**
298
- Automatically push your new Instagram content straight to your site to keep it looking fresh and keeping your audience engaged.
299
-
300
- **No Coding Required**
301
- Choose from tons of built-in Instagram Feed customization options to create a truly unique feed of your Instagram content.
302
-
303
- **Super simple to set up**
304
- Once installed, you can be displaying your Instagram photos within 30 seconds! No confusing steps or Instagram Developer account needed.
305
-
306
- **Mind-blowing Customer Support**
307
- We understand that sometimes you need help, have issues or just have questions. We love our users and strive to provide the best support experience in the business. We're experts in the Instagram API and can provide unparalleled service and expertise. If you need support then just let us know and we'll get back to you right away.
308
-
309
- = What can it do? =
310
-
311
- * Display Instagram photos from any Instagram account you own.
312
- * Completely responsive and mobile ready –your Instagram feed layout looks great on any screen size and in any container width
313
- * Display multiple Instagram feeds on the same page or on different pages throughout your site by using our powerful Instagram Feed shortcode options
314
- * Display posts from multiple Instagram User IDs
315
- * Use the built-in shortcode options to completely customize each of your Instagram feeds
316
- * Infinitely load more of your Instagram photos with the 'Load More' button
317
- * Plus more features added all the time!
318
-
319
- = Completely Customizable =
320
-
321
- * By default the Instagram feed will adopt the style of your website, but can be completely customized to look however you like!
322
- * Set the number of Instagram photos you want to display
323
- * Choose how many columns to display your Instagram photos in and the size of the Instagram photos
324
- * Choose to show or hide certain parts of the Instagram feed, such as the header, 'Load More', and 'Follow' buttons
325
- * Control the width, height and background color of your Instagram feed
326
- * Set the spacing/padding between the Instagram photos
327
- * Display Instagram photos in chronological or random order
328
- * Use your own custom text and colors for the 'Load More' and 'Follow' buttons
329
- * Enter your own custom CSS or JavaScript for even deeper customization
330
- * Use the shortcode options to style multiple Instagram feeds in completely different ways
331
- * Plus more customization options added all the time!
332
-
333
- == Changelog ==
334
- = 6.0 =
335
- * Important: Minimum supported WordPress version has been raised from 3.5 to 4.1.
336
- * New: Our biggest update ever! We've completely redesigned the plugin settings from head to toe to make it easier to create, manage, and customize your Instagram feeds.
337
- * New: All your feeds are now displayed in one place on the "All Feeds" page. This shows a list of any existing (legacy) feeds and any new ones that you create. Note: If you updated from a version prior to v2.8 then you may need to view your feeds on your webpage so that the plugin can locate them and list them here.
338
- * New: Easily edit individual feed settings for new feeds instead of cumbersome shortcode options.
339
- * New: It's now much easier to create feeds. Just click "Add New", select your feed type, connect your account, and you're done!
340
- * New: Brand new feed customizer. We've completely redesigned feed customization from the ground up, reorganizing the settings to make them easier to find.
341
- * New: Live Feed Preview. You can now see changes you make to your feeds in real time, right in the settings page. Easily preview them on desktop, tablet, and mobile sizes.
342
- * New: Color Scheme option. It's now easier than ever to change colors across your feed without needing to adjust individual color settings. Just set a color scheme to effortlessly change colors across your entire feed.
343
- * New: You can now change the number of columns in your feed across desktop, tablet, and mobile.
344
- * New: Easily import and export feed settings to make it simple to move feeds across sites.
345
-
346
- = 2.9.5 =
347
- * Fix: Fixed an issue when reconnecting a personal account.
348
- * Fix: Using showheader="true" in the shortcode would not work if the related setting was disabled on the settings page.
349
- * Fix: Added additional plugin hardening.
350
-
351
- = 2.9.4 =
352
- * Tweak: All Instagram data is now encrypted in your WordPress database.
353
- * Tweak: Access Tokens are no longer able to be viewed on the settings page.
354
- * Tweak: Added a maximum caching time of 24 hours.
355
- * Tweak: Added an expiration time to backup caches.
356
- * Tweak: Deauthorizing our app inside your Instagram or Facebook account will now delete all data for that feed on your site.
357
-
358
- = 2.9.3.1 =
359
- * Fix: Fixed a problem with the image resizing table check that would cause blank images or non-optimized images to show in the feed.
360
-
361
- = 2.9.3 =
362
- * Fix: Fixed duplicate MySQL queries issue when checking for the resized images table.
363
- * Fix: Fixed an issue with the integration with the GDPR Cookie Consent plugin by WebToffee.
364
- * Fix: Removed max-height rule for the sbi_item elements to improve performance.
365
- * Tweak: Improved the reliability of the Instagram account connection process.
366
-
367
- = 2.9.2 =
368
- * Tested with WordPress 5.8 update.
369
- * Fix: PHP error "Uncaught Error: array_merge() does not accept unknown named parameters" when visiting the "About" page using PHP 8+.
370
- * Fix: About page was not recognizing that YouTube Feeds Pro was installed and active when prompting the user to activate a YouTube Feed plugin.
371
- * Fix: Fixed an issue with GDPR Cookie Consent by Web Toffee integration.
372
-
373
- = 2.9.1 =
374
- * Fix: Fixed several issues with GDPR Cookie Consent by Web Toffee integration.
375
- * Tweak: Changed how connected accounts errors display to prevent temporary, non-actionable errors from triggering a notice.
376
-
377
- = 2.9 =
378
- * New: Added support for IGTV posts. When creating an IGTV post, keep the "Post a Preview" setting enabled and the IGTV post will appear in your feed. IGTV posts are only available for connected Instagram business profiles and aren't available if you're using a personal Instagram profile in the plugin.
379
- * Fix: Fixed a PHP error when the HTTP request to refresh an access token resulted in an error.
380
-
381
- = 2.8.2 =
382
- * Fix: Changed how access tokens are retrieved to prevent conflict with the "Rank Math SEO" plugin when connecting an account.
383
- * Fix: Updated jQuery methods for compatibility with WordPress 5.7.
384
-
385
- = 2.8.1 =
386
- * Fix: Fixed a PHP warning which would display in some situations: "array_diff(): Expected parameter 1 to be an array, string given".
387
- * Fix: Fixed PHP warning "Undefined index: accesstoken" which would display when no primary account was selected.
388
- * Fix: Fixed issue where account errors were not being removed after an account was deleted or reconnected.
389
-
390
- = 2.8 =
391
- * New: The locations of the Instagram feeds on your site will now be logged and listed on a single page for easier management. After this feature has been active for awhile, a "Feed Finder" link will appear next to the Feed Type setting on the plugin Settings page which allows you to see a list of all feeds on your site along with their locations.
392
- * New: Local resized images will now include a 150x150 resolution version for each post.
393
- * Tweak: Locally saved image quality set to 80% to increase feed performance without a noticeable visual difference.
394
- * Tweak: Improved how posts are sorted by date when there are more than one user accounts in a feed.
395
- * Fix: Old accounts from Instagram's deprecated, non-functioning API are ignored if still connected.
396
-
397
- = 2.7 =
398
- * Tweak: Several performance improvements have been made in this update such as improved caching and fewer database queries when displaying feeds.
399
- * Tweak: The limit of resized, local images created and stored were raised for the overall number and the rate at which they could be created.
400
- * Tweak: Improved how feed errors are handled and reported. API request delays will only apply to feeds encountering errors and will not affect other feeds.
401
- * Tweak: Added a hook for disabling image resizing dynamically with PHP.
402
- * Fix: PHP Warning "required parameter follows optional parameter" that would display when using PHP 8+.
403
- * Fix: The GDPR feature would sometimes report errors when the feature was working fine.
404
-
405
- = 2.6.2 =
406
- * Tweak: If the image resizing feature isn't able to work successfully due to an issue, then the GDPR setting will be disabled unless manually enabled to prevent blank images in the feed.
407
- * Fix: In some situations the GDPR setting was incorrectly reporting an error with image resizing.
408
-
409
- = 2.6.1 =
410
- * Fix: Fixed PHP error related to a missing file.
411
-
412
- = 2.6 =
413
- * New: Integrations with popular GDPR cookie consent solutions added: Cookie Notice by dFactory, GDPR Cookie Consent by WebToffee, Cookiebot by Cybot A/S, Complianz by Really Simple Plugins, and Borlabs Cookie by Borlabs. Visit the Instagram Feed settings page, Customize tab, GDPR section for more information.
414
- * Fix: API error notices would not be removed from the WordPress dashboard after successfully reconnecting an account when the problem was resolved.
415
- * Fix: Fixed PHP Error that would occur when connecting a personal account that would result in an HTTP error.
416
- * Fix: oEmbeds were not always working in much older versions of WordPress.
417
- * Fix: Play and carousel icons would appear very large for small images when the the mobile layout was disabled.
418
-
419
- = 2.5.4 =
420
- * Fix: Added more debugging info to the System Info for oEmbeds.
421
- * Fix: Added a workaround for a rare issue where oEmbed access tokens wouldn't save.
422
- * Fix: Carousel posts would not show images when using the "Disable JS Image Loading" setting and image resizing was disabled.
423
-
424
- = 2.5.3 =
425
- * Fix: Fixed an issue caused by an unannounced Instagram API change affecting thumbnails in certain video posts which don't have image data available in the API.
426
- * Fix: Added oEmbed account info to the plugin "System Info" to make debugging easier.
427
-
428
- = 2.5.2 =
429
- * Fix: Fixed an issue with an Instagram API change causing some images not to display if the image resizing feature was disabled.
430
-
431
- = 2.5.1 =
432
- * Tweak: Minor update to footer.php template.
433
- * Tweak: Added support for improved notices on the plugin settings page.
434
- * Fix: Added aria-hidden="true" attribute to loader icon for better accessibility.
435
-
436
- = 2.5 =
437
- * New: Added support for Instagram oEmbeds. When you share a link to a Instagram post, WordPress automatically converts it into an embedded Instagram post for you (an "oEmbed"). However, on October 24, 2020, WordPress is discontinuing support for Instagram oEmbeds and so any existing or new embeds will no longer work. Don't worry though, we have your back! This update adds support for Instagram oEmbeds and so, after updating, the Instagram Feed plugin will automatically keep your oEmbeds working. It will also power any new oEmbeds you post going forward.
438
- * New: Install our other free social media plugins right from the Instagram Feed settings menu. Use our Facebook, YouTube, and Twitter plugins to add even more social content to your website and help further engage your viewers and increase your followers.
439
- * Tweak: Changed the names of the CSS and JavaScript files to prevent certain ad blockers from hiding the feed. Original files with original names still included in this update.
440
- * Tweak: Background caching and favoring local images are now the default settings for new installs.
441
- * Fix: Fixed PHP warning too few arguments when using Spanish translation files.
442
-
443
- = 2.4.7 =
444
- * Important: Due to recent Instagram changes, private accounts will need to be manually refreshed every 60 days. If you have a private Instagram account, consider making it public to avoid needing to manually reconnect your account.
445
- * New: Added a notice for accounts that are private which lets you know how long until the account needs to be refreshed. You will also be alerted using our admin notice and email notification system if a private account will soon need to be refreshed.
446
-
447
- = 2.4.6 =
448
- * New: Added a PHP hook "sbi_clear_page_caches" which allows you to dynamically disable the Instagram Feed code that clears caches created by common page caching plugins.
449
- * New: Added a PHP hook "sbi_resize_url" which allows you to change the default URL of locally stored images. This can be helpful for sites using CDNs.
450
- * Tweak: Added a workaround for the wp_json_encode function used in older versions of WordPress.
451
- * Fix: Compatibility updates for the upcoming WordPress version 5.5 release.
452
-
453
- = 2.4.5 =
454
- * Fix: Accounts can be connected without the use of JavaScript.
455
- * Fix: Default URL for connecting an account changed to prevent "Invalid Scope" connection issue.
456
-
457
- = 2.4.4 =
458
- * Fix: Workaround added for PHP warning related to an undefined media_url index.
459
- * Fix: Connecting a business account on a mobile device when more than 2 pages where returned was not possible.
460
- * Fix: After connecting an account, the warning that there were no connected accounts would still be visible.
461
- * Fix: URL for retrieving image files from Instagram using a redirect method was changed to prevent an extra, unnecessary redirect.
462
-
463
- = 2.4.3 =
464
- * Fix: The opt-in notice to help improve the plugin was not dismissing as expected for some sites due to the admin JavaScript file being cached by the browser.
465
- * Fix: Disabled the "About Us" page plugin installation if using a version of WordPress earlier than 4.6.
466
-
467
- = 2.4.2 =
468
- * New: To help us improve the plugin we've added the ability to opt-in to usage tracking so that we can understand what features and settings are being used, and which features matter to you the most. This is disabled by default and will only be enabled if you explictly choose to opt in. If opted in, the plugin will send a report in the background once per week with your plugin settings and basic information about your website environment. No personal or sensitive data is collected (such as email addresses, Instagram account information, license keys, etc). To enable or disable usage tracking at a later date use the setting at: Instagram Feed > Customize > Advanced > Misc > Enable Usage Tracking. See [here](https://smashballoon.com/instagram-feed/usage-tracking/) for more information.
469
- * Tweak: Added additional checks to make sure the HTTP protocol matches when using resized image URLs from the uploads folder.
470
- * Tweak: More information is given when there is an account connection error when connecting an account on the "Configure" page.
471
- * Tweak: Connecting a business account will permanently remove any accounts from the same user that are from the legacy Instagram API that is expiring in June.
472
- * Fix: Added a workaround for sanitize_textarea_field for users using an older version of WordPress.
473
- * Fix: Fixed HTML error causing the manually connect an account feature to not work.
474
- * Fix: Access token and account ID are validated and formatted before trying to manually connect an account to prevent errors.
475
-
476
- = 2.4.1 =
477
- * Tweak: User feeds that do not have a user name or ID assigned to them will automatically use the first connected account for the feed.
478
- * Tweak: rel="nofollow" added to all external Instagram Feed links found in the source of the page.
479
- * Fix: API Error #2 was not clearing properly in error reports.
480
-
481
- = 2.4 =
482
- * New: Email alerts for critical issues. If there's an issue with an Instagram feed on your website which hasn't been resolved yet then you'll receive an email notification to let you know. This is sent once per week until the issue is resolved. These emails can be disabled by using the following setting: Instagram Feed > Customize > Advanced > Misc > Feed Issue Email Report.
483
- * New: Admin notifications for critical issues. If there is an error with the feed, admins will see notices in the dashboard and on the front-end of the site along with instructions on how to resolve the issue. Front-end admin notifications can be disabled by using the following setting: Instagram Feed > Customize > Advanced > Misc > Disable Admin Error Notice.
484
- * New: Added a WordPress 'Site Health' integration. If there is a critical error with your feeds, it will now be flagged in the site health page.
485
- * New: Added "About Us" page for those who would like to learn more about Smash Balloon and our other products. Go to Instagram Feed -> About Us in the dashboard.
486
- * New: Added support for an Instagram Feed widget. When on the widgets menu, look for the widget "Instagram Feed" to add your feed to a widget area.
487
-
488
- = 2.3.1 =
489
- * Fix: Added workaround for personal account connection error and header display issue due to an Instagram API bug. After updating, click "Save Changes" on the Instagram Feed settings page, "Configure" tab to clear your cache.
490
-
491
- = 2.3 =
492
- * New: Added an "Instagram Feed" Gutenberg block to use in the block editor, allowing you to easily add a feed to posts and pages.
493
-
494
- = 2.2.2 =
495
- * Tested with upcoming WordPress 5.4 update.
496
- * Tweak: Language files updated to account for all new strings.
497
-
498
- = 2.2.1 =
499
- * Important: March 2 deadline for migrating to the new Instagram API pushed back to March 31.
500
- * Fix: Some links to Instagram were missing a backslash at the end of the URL causing a 301 redirect.
501
- * Fix: Error saving updated account information caused by emoji in account bio or in account names and MySQL tables that didn't have a UTF8mb4 character set.
502
-
503
- = 2.2 =
504
- * Important: On March 31, Instagram will stop supporting its old API which will disrupt feeds created from personal connected accounts. If you are using a personal account, you will need to reconnect the account on the Instagram Feed Settings page. Please [see here](https://smashballoon.com/instagram-api-changes-march-2-2020/) for more information.
505
- * New: Support added for the new Instagram Basic Display API.
506
- * New: Added PHP hooks 'sbi_before_feed' and 'sbi_after_feed' for displaying HTML before and after the main Instagram feed HTML.
507
- * New: Added settings for adding a custom header avatar and custom header bio text. Go to the "Customize" tab "Header" area to set these or use customavatar="AVATAR URL" or custombio="BIO TEXT" in the shortcode.
508
- * Tweak: Warnings and messages displaying on the front end of sites now display at the top of the feed.
509
- * Tweak: Header template changed to accommodate missing data if connected as a personal account to the new API.
510
- * Tweak: Changes to feed.php, header.php, and item.php templates.
511
- * Tweak: Added CSS to prevent some themes from adding box shadows and bottom border when hovering over the header.
512
- * Tweak: Added code to clear page caching from Litespeed cache when clearing page caches with the plugin.
513
- * Tweak: Header and follow button will still be displayed when number of posts is set to 0.
514
- * Fix: Emoji in the first few characters of a caption would cause the main post image to switch to an emoji when loading more.
515
- * Fix: Pagination for "tagged" feeds not working for certain accounts.
516
-
517
- = 2.1.5 =
518
- * New: Added aria-label attributes to SVGs for improved accessibility.
519
- * Tweak: Changed screen reader and alt text to be more SEO friendly (change made to item.php template).
520
- * Tweak: Added PHP hooks to use custom alt and screen reader text.
521
- * Fix: Image resolution setting option "Medium" dimensions changed from 306x306 to 320x320.
522
- * Fix: Screen reader text would be visible if text was right aligned.
523
- * Fix: Incorrect image resolution would be used when setting the image resolution to something other than auto.
524
-
525
- = 2.1.4 =
526
- * Tweak: If sb_instagram_js_options is not defined, a default object is set.
527
- * Tweak: Added a text link in the settings page footer to our new free [YouTube plugin](https://wordpress.org/plugins/feeds-for-youtube/)
528
- * Fix: Local images not being used when available in certain circumstances.
529
-
530
- = 2.1.3 =
531
- * New: Added filter "sbi_settings_pages_capability" to change what permission is needed to access settings pages.
532
- * Tweak: Updated language files for version 2.0+.
533
- * Tweak: Better error messages for no posts being found and API request delays.
534
- * Tweak: If "Favor Local Images" setting is in use, a 640px resolution image will be created for images coming from a personal account.
535
- * Tweak: Better error recovery when image file not found when viewing the feed.
536
- * Tweak: Button and input field styling updated to look better with WordPress 5.3.
537
- * Fix: Accounts that were connected prior to version 1.12 would not show the follow button if the header was not also displayed. Visit the "Configure" tab to have the account automatically updated.
538
- * Fix: MySQL error when retrieving resized images. Thanks [the-louie](https://github.com/the-louie)!
539
- * Fix: When using the new Twenty Twenty theme, Instagram icon in "follow" button displaying as block and causing the button text to appear on a new line.
540
-
541
- = 2.1.2 =
542
- * New: Added setting "API request size" on the "Customize" tab to allow requesting of more posts than are in the feed. Setting this to a high number will prevent no posts being found if you often post IG TV posts and use a personal account.
543
- * Tweak: Removed width and height attributes from the image element in the feed to prevent notices about serving scaled images in optimization tools.
544
-
545
- = 2.1.1 =
546
- * New: Added ability to enqueue the CSS file through the shortcode. This loads the file in the footer of the site, and only on pages that include a feed. Enable on the "Customize" tab.
547
- * Tweak: Resized images can be used in the page source code when "Disable js image loading" setting is enabled.
548
- * Fix: HTML for header would still be visible in the source of the page when removing the header using showheader=false in the shortcode.
549
-
550
- = 2.1 =
551
- * New: Added the ability to overwrite default templates in your theme. View [this article](https://smashballoon.com/guide-to-creating-custom-templates/) for more information.
552
- * New: Added several PHP hooks for modifying feeds settings and functionality.
553
- * Fix: Using the "Load Initial Posts with AJAX" setting would cause images to not resize with the browser window.
554
- * Fix: Added back language files for translations.
555
- * Fix: Changing the image resolution setting would not change the image size.
556
- * Fix: Follow button would not show if there was no connected account.
557
- * Fix: Deleting any connected account will delete any connected accounts that have errors in the data that was saved for them.
558
-
559
- = 2.0.2 =
560
- * Fix: HTML for header would still be visible in the source of the page when removing the header using showheader=false in the shortcode
561
- * Fix: CSS added to prevent layout issues when adding the feed to a "text" widget for certain themes
562
-
563
- = 2.0.1 =
564
- * Tweak: Force cache of major caching plugins to clear when updating plugin to avoid issues with previous CSS/JavaScript files being cached
565
- * Tweak: Added version number to the end of JavaScript and CSS files to clear browser caches that are causing errors
566
- * Fix: Added back filter to allow using shortcode in a custom HTML widget
567
- * Fix: Added back settings to display bio information in header and change header size which were mistakenly removed in the last update
568
- * Fix: Fixed a PHP notice which might display under certain circumstances
569
-
570
- = 2.0 =
571
- * **MAJOR UDPATE**
572
- * New: We've rebuilt the plugin from the ground up with a focus on performance and reliability. Your feeds are now loaded from the server using PHP removing the reliance on AJAX.
573
- * New: Local copies of images are now automatically stored on your server and used in your feed. You can disable this feature in the "Advanced" section of the "Customize" tab. Use the "Favor Local Images" setting on the "Customize" tab, "Advanced" sub-tab to have the plugin use local images whenever available, thus removing reliance on the Instagram CDN.
574
- * New: You can now set the plugin to check for new Instagram posts in the background rather than when the page loads by using the new "Background caching" option which utilizes the WordPress "cron" feature. Enable this using the "Check for new posts" setting on the "Configure" tab.
575
- * New: If you have a business account for Instagram, you can now connect to the new Instagram API. You can continue to use your connected personal account and do not need to connect a business account.
576
-
577
- = 1.12.2 =
578
- * Fix: Fixed error from Instagram when connecting a personal account.
579
-
580
- = 1.12.1 =
581
- * Tweak: If an image in a post fails to load then the plugin attempts to load it from another image source
582
-
583
- = 1.12 =
584
- * Fix: Includes fixes for some security vulnerabilities. Thanks to Julio Potier of [SecuPress](https://secupress.me/) for reporting the issues.
585
- * Fix: Fixed an issue caused by a bug in the Instagram API which was preventing some Instagram accounts from being able to be connected. If you experienced an issue connecting an Instagram account then please try again after updating.
586
- * Fix: Quotes represented by "%20" in Instagram data were causing a JSON parsing error.
587
- * Tweak: Data for the feed is now cached outside of the admin-ajax.php calls.
588
-
589
- = 1.11.3 =
590
- * Fix: Escaped single quotes causing a JSON parse error under certain circumstances.
591
- * Fix: Translatable code errors in the admin area causing some text to not be translatable.
592
-
593
- = 1.11.2 =
594
- * Fix: Unable to connect new accounts due to changes with Instagram's API. Remote requests to connect accounts are now made server-side.
595
-
596
- = 1.11.1 =
597
- * Fix: Feed would not load from a cache created with an older version of the plugin
598
- * Fix: Fixed PHP warning trying to count string length of an array
599
-
600
- = 1.11 =
601
- * New: Added capability "manage_instagram_feed_options" to support customizations that will allow users/roles other than the administrator to access Instagram Feed settings pages.
602
- * Fix: rel="noopener" added to all links that contain target="blank"
603
- * Fix: HTTPS used in xlmns attribute for SVGs
604
- * Fix: Fixed issues with strings in the admin area being translatable
605
- * Fix: Fixed a potential security vulnerability. Thanks to [Martin Verreault](https://egyde.ca/) for reporting the issue.
606
-
607
- = 1.10.2 =
608
- * Confirmed compatibility with the upcoming WordPress 5.0 "Gutenberg" update
609
- * Fix: Fixed an issue caused by some themes which affected the formatting of the 'Load More' and 'Follow' buttons
610
- * Fix: Fixed an occasional formatting issue with error messages due to no line-height being set
611
- * Fix: Minor admin UI fixes
612
- * Tweak: Removed mention of some Pro features which will be deprecated due to upcoming Instagram API changes
613
-
614
- = 1.10.1 =
615
- * Tweak: Automatic image resolution detection setting now works better with wide images. Resizing the browser will now automatically raise the image resolution if needed.
616
- * Fix: Fixed an issue where the Load More button would disappear if all posts for a feed were cached.
617
-
618
- = 1.10 =
619
- * New: We've made improvements to the way photos are loaded into the feed, adding a smooth transition to display photos subtly rather than suddenly.
620
- * New: More header sizes; you can now choose from three sizes: small, medium, and large. Change this on the "Customize" tab.
621
- * Fix: Using a percent for the image padding was causing the height of images to be too tall
622
- * Fix: Removed a PHP notice when the Instagram API was blocked by the web host
623
-
624
- = 1.9.1 =
625
- * Fix: Captions missing as "alt" text for Instagram images.
626
- * Fix: System information was not formatting connected Instagram accounts and user ids correctly
627
- * Fix: "Unauthorized redirect URL" error occurring while trying to connect a new Instagram account due to recent changes from Instagram
628
- * Fix: Using a percent for the image padding was causing the height of Instagram images to be to tall
629
-
630
- = 1.9 =
631
- * New: Retrieving Access Tokens and connecting multiple Instagram accounts is now easier using our improved interface for managing account information. While on the Configure tab, click on the big blue button to connect an account, or use the "Manually Connect an Account" option to connect one using an existing Access Token. Once an account is connected, you can use the associated buttons to either add it to your primary Instagram User feed or to a different Instagram feed on your site using the `user` shortcode option, eg: `user=smashballoon`.
632
- * Tweak: Disabled auto load in the database for backup caches
633
- * Fix: Fixed an occasional issue with the Instagram login flow which would result in an "Unauthorized redirect URL" error
634
-
635
- = 1.8.3 =
636
- * Fix: SVG icons caused some display problems in IE 11
637
- * Fix: Removed support for using usernames in the Instagram User ID setting due to recent API changes. Will now default to the Instagram User ID attached to the Access Token.
638
- * Fix: Backup feed not always being used when Access Tokens expire
639
- * Fix: Instagram Access Tokens may have been incorrectly saved as invalid under certain circumstances
640
-
641
- = 1.8.2 =
642
- * Tweak: Setting "Cache Error API Recheck" enabled by default for new Instagram Feed installs
643
- * Fix: Page caches created with the WP Rocket plugin will be cleared when the Instagram Feed settings are updated or the cache is forced to clear
644
- * Fix: Fixed a rare issue where feeds were displaying "Looking for cache that doesn't exist" when page caching was not being used
645
-
646
- = 1.8.1 =
647
- * Fix: Fixed issue where Instagram feeds were displaying "Looking for cache that doesn't exist" when page caching was not being used
648
- * Fix: Font method setting not working when "Are you using an ajax theme?" setting is enabled
649
-
650
- = 1.8 =
651
- * Important: Due to [recent changes](https://smashballoon.com/instagram-api-changes-april-4-2018/?utm_campaign=instagram-free-readme&utm_source=changelog&utm_medium=apichanges) in the Instagram API it is no longer possible to display photos from other Instagram accounts which are not your own. You can only display the user feed of the account which is associated with your Access Token.
652
- * New: Added an Access Token shortcode option and support for multiple Instagram Access Tokens. If you own multiple Instagram accounts then you can now use multiple Access Tokens in order to display user feeds from each Instagram account, either in separate feeds, or in the same feed. Just use the `accesstoken` shortcode option. See [this FAQ](https://smashballoon.com/display-multiple-instagram-feeds/#multiple-user-feeds) for more information on displaying multiple User feeds.
653
-
654
- = 1.7 =
655
- * New: Added feed caching to limit the number of Instagram API requests. Use the setting on the "Configure" tab "Check for new posts every" to set how long feed data will be cached before refreshing.
656
- * New: Added backup caching for all feeds. If the Instagram feed is unable to display then a backup feed will be shown to visitors if one is available. The backup cache can be disabled or cleared by using the following setting: `Customize > Misc > Enable Backup Caching`.
657
- * New: Icons are now generated as SVGs for a sharper look and more semantic markup
658
- * New: Instagram carousel posts include an icon to indicate that they are carousel posts
659
- * Tweak: Using the "sort posts by random" feature will include the most recent 33 posts instead of just the posts shown in the Instagram feed
660
- * Fix: links back to instagram.com will use the "www" prefix
661
-
662
- = 1.6.2 =
663
- * Fix: Fixed a rare issue where the Load More button wouldn't be displayed after the last update if the Instagram account didn't have many posts
664
-
665
- = 1.6.1 =
666
- * Fix: Fixed Font Awesome 5.0 causing Instagram icon to appear as a question mark with a circle
667
- * Fix: Fixed inline padding style for sbi_images element causing validation error when set to "0" or blank space
668
- * Fix: Added a workaround for an Instagram API bug which caused some feeds to show fewer posts than expected
669
-
670
- = 1.6 =
671
- * New: Loading icon appears when waiting for new posts after clicking the "Load More..." button
672
- * New: Added translation files for Dutch (nl_NL)
673
- * Fix: Fixed a potential security vulnerability. Thanks to [Magnus Stubman](http://dumpco.re/) for reporting the issue.
674
-
675
- = 1.5.1 =
676
- * New: The plugin is now compatible with the [WPML plugin](https://wpml.org/) allowing you to use multiple translations for your feeds on your multi-language sites
677
- * New: Added translation files for Danish (da_DK), Finnish (fi_FL), Japanese (ja_JP), Norwegian (nn_NO), Portuguese (pt_PT), and Swedish (sv_SE) to translate the "Load More" and "Follow on Instagram" text
678
-
679
- = 1.5 =
680
- * New: Improved tool for retrieving Instagram Access Tokens
681
- * New: Added an option to show/hide Instagram bio text in feed header
682
- * New: Feeds that include IDs from "private" Instagram accounts will now ignore the private data and display a message to logged-in site admins which indicates that one of the Instagram accounts is private
683
- * New: Feeds without any Instagram posts yet will display a message informing logged-in admins to make a post on Instagram in order to view the feed
684
- * New: Added translation files for French (fr_FR), German (de_DE), English (en_EN), Spanish (es_ES), Italian (it_IT), and Russian (ru_RU) to translate "Load More..." and "Follow on Instagram"
685
- * Tweak: Optimized several images used in the Instagram feed including loader.png
686
- * Tweak: Font Awesome stylesheet handle has been renamed so it will only be loaded once if our Custom Facebook Feed plugin is also active
687
- * Fix: Updated the Font Awesome icon font to the latest version: 4.7.0
688
- * Fix: Padding removed from "Load More" button if no buttons are being used in the Instagram feed
689
- * Fix: All links in the feed are now https
690
- * Fix: Fixed JavaScript errors which were being caused if the Instagram Access Token had expired or the user ID was incorrect, private, or had no Instagram posts
691
-
692
- = 1.4.9 =
693
- * Compatible with WordPress 4.8
694
-
695
- = 1.4.8 =
696
- * Tweak: Updated plugin links for new WordPress.org repo
697
- * Fix: Minor bug fixes
698
-
699
- = 1.4.7 =
700
- * Fix: Fixed a security vulnerabiliy
701
- * Tested with upcoming WordPress 4.6 update
702
-
703
- = 1.4.6.2 =
704
- * Fix: Removed a comment from the plugin's JavaScript file which was causing an issue with some optimization plugins, such as Autoptimize.
705
-
706
- = 1.4.6.1 =
707
- * Fix: Fixed an issue with the Instagram image URLs which was resulting in inconsistent url references in some feeds
708
-
709
- = 1.4.6 =
710
- * **IMPORTANT: Due to the recent Instagram API changes, in order for the Instagram Feed plugin to continue working after June 1st you must obtain a new Access Token by using the Instagram button on the plugin's Settings page.** This is true even if you recently already obtained a new token. Apologies for any inconvenience.
711
-
712
- = 1.4.5 =
713
- * New: When you click on the name of a setting on the plugin's Settings pages it now displays the shortcode option for that setting, making it easier to find the option that you need
714
- * New: Added a setting to disable the Font Awesome icon font if needed. This can be found under the Misc tab at the bottom of the Customize page.
715
- * Tweak: Updated the Instagram icon to match their new branding
716
- * Tweak: Added a help link next to the Instagram login button in case there's an issue using it
717
- * Fix: Updated the Font Awesome icon font to the latest version: 4.6.3
718
-
719
- = 1.4.4 =
720
- * Fix: Fixed an issue caused by a specific type of emoji which would cause the feed to break when used in a post
721
- * Tweak: Added links to our other **free** plugins to the bottom of the admin pages: [The Custom Facebook Feed](https://wordpress.org/plugins/custom-facebook-feed/) and [Custom Twitter Feeds](https://wordpress.org/plugins/custom-twitter-feeds/)
722
-
723
- = 1.4.3 =
724
- * Fix: Important notice added in the last update is now only visible to admins
725
-
726
- = 1.4.2 =
727
- * New: Compatible with Instagram's new API changes effective June 1st
728
- * New: Added video icons to Instagram posts in the feed which contain videos
729
- * New: Added a setting to allow you to use a fixed pixel width for the feed on desktop but switch to a 100% width responsive layout on mobile
730
- * Tweak: Added a width and height attribute to the images to help improve Google PageSpeed score
731
- * Tweak: A few minor UI tweaks on the settings pages
732
- * Fix: Minified CSS and JS files
733
-
734
- = 1.3.11 =
735
- * Fix: Fixed a bug which was causing the height of the Instagram photos to be shorter than they should have been in some themes
736
- * Fix: Fixed an issue where when an Instagram feed was initially hidden (in a tab, for example) then the Instagram photo resolution was defaulting to 'thumbnail'
737
-
738
- = 1.3.10 =
739
- * Fix: Fixed an issue which was setting the visibility of some Instagram photos to be hidden in certain browsers
740
- * Fix: The new square photo cropping is no longer being applied to Instagram feeds displaying images at less than 150px wide as the images from Instagram at this size are already square cropped
741
- * Fix: Fixed a JavaScript error in Internet Explorer 8 caused by the 'addEventListener' function not being supported
742
-
743
- = 1.3.9 =
744
- * Fix: Fixed an issue where Instagram photos wouldn't appear in the Instagram feed if it was initially being hidden inside of a tab or some other element
745
- * Fix: Fixed an issue where the new Instagram image cropping fuction was failing to run on some sites and causing the Instagram images to appear as blank
746
-
747
- = 1.3.8 =
748
- * Fix: If you have uploaded an Instagram photo in portrait or landscape then the plugin will now display the square cropped version of the photo in your Instagram feed
749
-
750
- = 1.3.7 =
751
- * Fix: Fixed an issue with double quotes in photo captions (used in the Instagram photo alt tags) which caused a formatting issue
752
-
753
- = 1.3.6 =
754
- * Fix: Fixed an issue introduced in version 1.3.4 which was causing theme settings to not be applied in some themes
755
-
756
- = 1.3.5 =
757
- * Fix: Reverted the 'prop' function introduced in the last update back to 'attr' as prop isn't supported in older versions of jQuery
758
- * Fix: Removed the image load function as it was causing Instagram images not to be displayed for some users
759
-
760
- = 1.3.4 =
761
- * Fix: Used the Instagram photo caption to add a more descriptive alt tag to the Instagram photos
762
- * Fix: Instagram photos are now only displayed once they're fully loaded
763
- * Fix: Added a stricter CSS implementation for some elements to prevent styles being overridden by themes
764
- * Fix: Added CSS opacity property to Instagram images to prevent issues with lazy loading in some themes
765
- * Fix: Removed a line of code which was disabling WordPress Debug/Error Reporting. If needed, this can be disabled again by using the setting at the bottom of the plugin's 'Customize' settings page.
766
- * Fix: Made some JavaScript improvements to the core Instagram Feed plugin code
767
-
768
- = 1.3.3 =
769
- * Fix: Fixed an issue with the 'Load more' button not always showing when displaying Instagram photos from multiple Instagram User IDs
770
- * Fix: Moved the initiating sbi_init function outside of the jQuery ready function so that it can be called externally if needed by Ajax powered themes/plugins
771
-
772
- = 1.3.2 =
773
- * New: Added an option to disable the Instagram Feed mobile layout
774
- * New: Added an setting which allows you to use the Instagram Feed plugin with an Ajax powered theme
775
- * New: Added a 'class' shortcode option which allows you to add a CSS to class to each individual Instagram feed: `[instagram-feed class=feedOne]`
776
- * New: Added a Support tab which contains System Info to help with troubleshooting
777
- * New: Added friendly error messages which display only to WordPress admins
778
- * New: Added validation to the Instagram User ID field to prevent usernames being entered instead of IDs
779
- * Tweak: Made the Instagram Access Token field slightly wider to prevent tokens being copy and pasted incorrectly
780
- * Fix: Fixed a JavaScript bug which caused the feed not to load photos correctly in IE8
781
-
782
- = 1.3.1 =
783
- * Fix: Fixed an issue with the Instagram icon not appearing in the 'Follow on Instagram' button or in the Instagram Feed header
784
- * Fix: Addressed a few CSS issues which were causing some minor formatting issues in the Instagram Feed on certain themes
785
-
786
- = 1.3 =
787
- * New: You can now display Instagram photos from multiple Instagram User IDs. Simply separate your Instagram IDs by commas.
788
- * New: Added an optional header to the Instagram feed which contains your Instagram profile picture, Instagram username and Instagram bio. You can activate this on the Instagram Feed Customize page.
789
- * New: The Instagram Feed plugin now includes an 'Auto-detect' option for the Instagram Image Resolution setting which will automatically set the correct Instagram image resolution based on the size of your Instagram feed.
790
- * New: Added an optional 'Follow on Instagram' button which can be displayed at the bottom of your Instagram feed. You can activate this on the Instagram Feed Customize page.
791
- * New: Added the ability to use your own custom text for the 'Load More' button
792
- * New: Added a loader icon to indicate that the Instagram photos are loading
793
- * New: Added a unique ID to each Instagram photo so that they can be targeted individually via CSS
794
- * Tweak: Added a subtle fade effect to the Instagram photos when hovering over them
795
- * Tweak: Improved the responsive layout behavior of the Instagram feed
796
- * Tweak: Improved the documentation within the Instagram Feed plugin settings pages
797
- * Tweak: Included a link to [step-by-step setup directions](http//:smashballoon.com/instagram-feed/free/?utm_campaign=instagram-free-readme&utm_source=changelog&utm_medium=changelog 'Instagram feed setup directions') for the plugin
798
- * Fix: Fixed an issue with the feed not clearing other widgets correctly
799
-
800
- = 1.2.3 =
801
- * Fix: Replaced the 'on' function with the 'click' function to increase compatibility with themes using older versions of jQuery
802
-
803
- = 1.2.2 =
804
- * Tweak: Added an initialize function to the Instagram Feed plugin
805
- * Fix: Fixed an occasional issue with the 'Sort Photos By' option being undefined
806
-
807
- = 1.2.1 =
808
- * Fix: Fixed a minor issue with the Custom JavaScript being run before the Instagram photos are loaded
809
- * Fix: Removed stray PHP notices
810
- * Fix: Changed the double quotes to single quotes on the 'data-options' attribute
811
-
812
- = 1.2 =
813
- * New: Added Custom CSS and Custom JavaScript sections which allow you to add your own custom CSS and JavaScript to the Instagram Feed plugin
814
- * New: Added an option to display your Instagram photos in random order
815
- * New: A new tabbed layout has been implemented on the Instagram Feed plugin's settings pages
816
- * New: Added an option to preserve your Instagram Feed settings when uninstalling the plugin
817
- * New: Added a [Pro version](http://smashballoon.com/instagram-feed/?utm_campaign=instagram-free-readme&utm_source=changelog&utm_medium=changelog 'Instagram Feed Pro') of the Instagram Feed plugin which allows you to display Instagram photos by hashtag, display Instagram captions, view Instagram photos in a pop-up lightbox, show the number of Instagram likes & comments and more
818
- * Tweak: The 'Load More' button now automatically hides if there are no more Instagram photos to load
819
- * Tweak: Added a small gap to the top of the 'Load More' button
820
- * Tweak: Added a icon to the Instagram Feed menu item
821
-
822
- = 1.1.6 =
823
- * Fix: A maximum width is now only applied to the Instagram feed when the Instagram photos are displayed in one column
824
-
825
- = 1.1.5 =
826
- * Fix: Added a line of code which enables shortcodes to be used in widgets for themes which don't have it enabled
827
-
828
- = 1.1.4 =
829
- * Fix: Fixed an issue with the Instagram Access Token and Instagram User ID retrieval functionality in certain web browsers
830
-
831
- = 1.1.3 =
832
- * Fix: Fixed an issue with the maximum Instagram image width
833
- * Fix: Corrected a typo in the Instagram Feed Shortcode Options table
834
-
835
- = 1.1.1 =
836
- * Pre-tested for the upcoming WordPress 4.0 update
837
- * Fix: Fixed an uncommon issue related to the output of the Instagram content
838
-
839
- = 1.1 =
840
- * New: Added an option to set the number of Instagram photos to be initially displayed
841
- * New: Added an option to show or hide the 'Load More' button
842
- * New: Added 'Step 3' to the Instagram Feed Settings page explaining how to display your feed using the [instagram-feed] shortcode
843
- * New: Added a full list of all available Instagram Feed shortcode options to help you if customizing multiple Instagram feeds
844
-
845
- = 1.0.2 =
846
- * Fix: Fixed an issue with the Instagram login URL on the plugin's Instagram Feed Settings page
847
-
848
- = 1.0.1 =
849
- * Fix: Fixed an issue with the Instagram Feed 'Load More' button opening an empty browser window in Firefox
850
-
851
- = 1.0 =
852
- * Launched the Instagram Feed plugin!
 
 
 
 
 
 
 
 
1
+ === Smash Balloon Social Photo Feed ===
2
+ Contributors: smashballoon, craig-at-smash-balloon
3
+ Tags: Instagram, Instagram feed, Instagram photos, Instagram widget, Instagram gallery
4
+ Requires at least: 4.1
5
+ Tested up to: 5.9
6
+ Stable tag: 6.0.1
7
+ License: GPLv2 or later
8
+ License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
+
10
+ Formerly "Instagram Feed". Display clean, customizable, and responsive Instagram feeds from multiple accounts. Supports Instagram oEmbeds.
11
+
12
+ == Description ==
13
+
14
+ Display Instagram posts from your Instagram accounts, either in the same single feed or in multiple different ones.
15
+
16
+ = Features =
17
+ * **New:** Now automatically powers your **Instagram oEmbeds**
18
+ * Super **simple to set up**
19
+ * Display photos from **multiple Instagram accounts** in the same feed or in separate feeds
20
+ * Completely **responsive** and mobile ready - layout looks great on any screen size and in any container width
21
+ * **Completely customizable** - Customize the width, height, number of photos, number of columns, image size, background color, image spacing and more!
22
+ * Display **multiple Instagram feeds** on the same page or on different pages throughout your site
23
+ * **GDPR Compliance** - automatically integrates with many of the popular GDPR cookie consent plugins and includes a 1-click easy GDPR setting.
24
+ * Use the built-in **shortcode options** to completely customize each of your Instagram feeds
25
+ * Display thumbnail, medium or **full-size photos** from your Instagram feed
26
+ * **Infinitely load more** of your Instagram photos with the 'Load More' button
27
+ * Includes a **Follow on Instagram button** at the bottom of your feed
28
+ * Display a **beautiful header** at the top of your feed
29
+ * Display your Instagram photos chronologically or in random order
30
+ * Add your own Custom CSS and JavaScript for even deeper customizations
31
+ * Handy block for easily adding your feed to posts and pages using the block editor
32
+
33
+ = Benefits =
34
+ * **Increase Social Engagement** - Increase engagement between you and your Instagram followers. Increase your number of followers by displaying your Instagram content directly on your site.
35
+ * **Save Time** - Don't have time to update your photos on your site? Save time and increase efficiency by only posting your photos to Instagram and automatically displaying them on your website
36
+ * **Display Your Content Your Way** - Customize your Instagram feeds to look exactly the way you want, so that they blend seemlessly into your site or pop out at your visitors!
37
+ * **Keep Your Site Looking Fresh** - Automatically push your new Instagram content straight to your site to keep it looking fresh and keeping your audience engaged.
38
+ * **Super simple to set up** - Once installed, you can be displaying your Instagram photos within 30 seconds! No confusing steps or Instagram Developer account needed.
39
+ * **Powers all Instagram oEmbeds on your site** - With WordPress removing support for Instagram oEmbeds, the plugin will now power all Instagram embeds on your site, old and new, to allow them to continue working.
40
+
41
+ = Pro Version =
42
+ In order to maintain the free version of the plugin on an ongoing basis, and to provide quick and effective support for free, we offer a Pro version of the plugin. The Pro version allows you to:
43
+ * Display Hashtag feeds
44
+ * View photos and videos in a popup lightbox directly on your site
45
+ * View post comments for user feeds
46
+ * Display the number of like and comments for each post
47
+ * Create carousels from your posts
48
+ * Use "Masonry" or "Highlight" layouts for your feeds
49
+ * Display captions for photos and videos
50
+ * Filter posts based on hashtag/word
51
+ * Advanced moderation system for hiding/showing certain posts
52
+ * Block posts by specific users
53
+ * Create "shoppable" Instagram feeds, and more.
54
+
55
+ [Find out more about the Pro version](https://smashballoon.com/instagram-feed/?utm_campaign=instagram-free-readme&utm_source=proversion&utm_medium=profindout "Instagram Feed Pro") or [try out the Pro demo](https://smashballoon.com/instagram-feed/demo/?utm_campaign=instagram-free-readme&utm_source=proversion&utm_medium=readmedemo "Instagram Feed Pro Demo").
56
+
57
+ = Featured Reviews =
58
+ "**Simple and concise** - Excellent plugin. Simple and non-bloated. I had a couple small issues with the plugin when I first started using it, but a quick comment on the support forums got a new version pushed out the next day with the fix. Awesome support!" - [Josh Jones](https://wordpress.org/support/topic/simple-and-concise-3 'Simple and concise Instagram plugin')
59
+
60
+ "**Great plugin, greater support!** - I've definitely noticed an increase in followers on Instagram since I added this plugin to my sidebar. Thanks for the help in making some adjustments...looks and works great!" - [BNOTP](https://wordpress.org/support/topic/thanks-for-a-great-plugin-6 'Great plugin, greater Support!')
61
+
62
+ = Feedback or Support =
63
+ We're dedicated to providing the most customizable, robust and well supported Instagram feed plugin in the world, so if you have an issue or have any feedback on how to improve the plugin then please open a ticket in the [Support forum](http://wordpress.org/support/plugin/instagram-feed 'Instagram Feed Support Forum').
64
+
65
+ For a pop-up photo **lightbox**, to display posts by **hashtag**, show photo **captions**, **video** support + more, check out the [Pro version](http://smashballoon.com/instagram-feed/?utm_campaign=instagram-free-readme&utm_source=feedbacj&utm_medium=support 'Instagram Feed Pro').
66
+
67
+ == Installation ==
68
+
69
+ 1. Install the Instagram Feed plugin either via the WordPress plugin directory, or by uploading the files to your web server (in the `/wp-content/plugins/` directory).
70
+ 2. Activate the Instagram Feed plugin through the 'Plugins' menu in WordPress.
71
+ 3. Navigate to the 'Instagram Feed' settings page to connect your Instagram account.
72
+ 4. Use the shortcode `[instagram-feed]` in your page, post or widget to display your Instagram photos.
73
+ 5. You can display multiple Instagram feeds by using shortcode options, for example: `[instagram-feed num=6 cols=3]`
74
+
75
+ For simple step-by-step directions on how to set up the Instagram Feed plugin please refer to our [setup guide](http://smashballoon.com/instagram-feed/free/?utm_campaign=instagram-free-readme&utm_source=installation&utm_medium=setup 'Instagram Feed setup guide').
76
+
77
+ = Display your Feed =
78
+
79
+ **Single Instagram Feed**
80
+
81
+ Copy and paste the following shortcode directly into the page, post or widget where you'd like the Instagram feed to show up: `[instagram-feed]`
82
+
83
+ **Multiple Instagram Feeds**
84
+
85
+ If you'd like to display multiple Instagram feeds then you can set different settings directly in the shortcode like so: `[instagram-feed num=9 cols=3]`
86
+
87
+ If you'd like to display feed from more than one account, connect multiple accounts on the "Configure" tab and then add the user name in the shortcode: `[instagram-feed user="ANOTHER_USER_NAME"]`
88
+
89
+ You can display as many different Instagram feeds as you like, on either the same page or on different pages, by just using the shortcode options below. For example:
90
+ `[instagram-feed]`
91
+ `[instagram-feed user="ANOTHER_USER_NAME"]`
92
+ `[instagram-feed user="ANOTHER_USER_NAME, YET_ANOTHER_USER_NAME" num=4 cols=4 showfollow=false]`
93
+
94
+ See the table below for a full list of available shortcode options:
95
+
96
+ = Shortcode Options =
97
+ * **General Options**
98
+ * **user** - An Instagram User Name (must have account connected) - Example: `[instagram-feed user=AN_INSTAGRAM_USER_NAME]`
99
+ * **width** - The width of your Instagram feed. Any number - Example: `[instagram-feed width=50]`
100
+ * **widthunit** - The unit of the width of your Instagram feed. 'px' or '%' - Example: `[instagram-feed widthunit=%]`
101
+ * **height** - The height of your Instagram feed. Any number - Example: `[instagram-feed height=250]`
102
+ * **heightunit** - The unit of the height of your Instagram feed. 'px' or '%' - Example: `[instagram-feed heightunit=px]`
103
+ * **background** - The background color of the Instagram feed. Any hex color code - Example: `[instagram-feed background=#ffff00]`
104
+ * **class** - Add a CSS class to the Instagram feed container - Example: `[instagram-feed class=feedOne]`
105
+ *
106
+ * **Photo Options**
107
+ * **sortby** - Sort the Instagram posts by Newest to Oldest (none) or Random (random) - Example: `[instagram-feed sortby=random]`
108
+ * **num** - The number of Instagram posts to display initially. Maximum is 33 - Example: `[instagram-feed num=10]`
109
+
110
+ * **cols** - The number of columns in your Instagram feed. 1 - 10 - Example: `[instagram-feed cols=5]`
111
+ * **imageres** - The resolution/size of the Instagram photos. 'auto', full', 'medium' or 'thumb' - Example: `[instagram-feed imageres=full]`
112
+ * **imagepadding** - The spacing around your Instagram photos - Example: `[instagram-feed imagepadding=10]`
113
+ * **imagepaddingunit** - The unit of the padding in your Instagram feed. 'px' or '%' - Example: `[instagram-feed imagepaddingunit=px]`
114
+ * **disablemobile** - Disable the mobile layout for your Instagram feed. 'true' or 'false' - Example: `[instagram-feed disablemobile=true]`
115
+ *
116
+ * **Header Options**
117
+ * **showheader** - Whether to show the Instagram feed Header. 'true' or 'false' - Example: `[instagram-feed showheader=false]`
118
+ * **showbio** - Whether to show the account's bio in the Instagram feed Header. 'true' or 'false' - Example: `[instagram-feed showbio=false]`
119
+ * **custombio** - Custom Bio text for the Instagram feed Header - Example: `[instagram-feed custombio="My custom bio."]`
120
+ * **customavatar** - URL of a custom Avatar for the header. Example: `[instagram-feed customavatar="https://my-site.com/avatar.jpg"]`
121
+
122
+ * **headercolor** - The color of the Instagram feed Header text. Any hex color code - Example: `[instagram-feed headercolor=#333]`
123
+ *
124
+ * **'Load More' Button Options**
125
+ * **showbutton** - Whether to show the 'Load More' button. 'true' or 'false' - Example: `[instagram-feed showbutton='false']`
126
+ * **buttoncolor** - The background color of the button. Any hex color code - Example: `[instagram-feed buttoncolor=#000]`
127
+ * **buttontextcolor** - The text color of the button. Any hex color code - Example: `[instagram-feed buttontextcolor=#fff]`
128
+ * **buttontext** - The text used for the button - Example: `[instagram-feed buttontext="Load More Photos"]`
129
+ *
130
+ * **'Follow on Instagram' Button Options**
131
+ * **showfollow** - Whether to show the 'Follow on Instagram' button. 'true' or 'false' - Example: `[instagram-feed showfollow=true]`
132
+ * **followcolor** - The background color of the 'Follow on Instagram' button. Any hex color code - Example: `[instagram-feed followcolor=#ff0000]`
133
+ * **followtextcolor** - The text color of the 'Follow on Instagram' button. Any hex color code - Example: `[instagram-feed followtextcolor=#fff]`
134
+ * **followtext** - The text used for the 'Follow on Instagram' button - Example: `[instagram-feed followtext="Follow me"]`
135
+
136
+ For more shortcode options, check out the [Pro version](http://smashballoon.com/instagram-feed/?utm_campaign=instagram-free-readme&utm_source=shortcode&utm_medium=shortcodepro 'Instagram Feed Pro').
137
+
138
+ = Setting up the Free Instagram Feed WordPress Plugin =
139
+
140
+ 1) Once you've installed the Instagram Feed plugin click on the Instagram Feed item in your WordPress menu
141
+
142
+ 2) Click on the large blue Instagram button to log into your Instagram account and connect your Instagram account. If you're having trouble retrieving your Instagram information from Instagram then try using the Instagram button on [this page](https://smashballoon.com/instagram-feed/token/?utm_campaign=instagram-free-readme&utm_source=settingup&utm_medium=connectionproblem) instead.
143
+
144
+ You can also display photos from other Instagram accounts by connecting additional Instagram accounts and adding the user name in the shortcode.
145
+
146
+ 3) Navigate to the Instagram Feed customize page to customize your Instagram feed.
147
+
148
+ 4) Once you've customized your Instagram feed, click on the Display Your Feed tab to grab the [instagram-feed] shortcode.
149
+
150
+ 5) Copy the Instagram Feed shortcode and paste it into any page, post or widget where you want the Instagram feed to appear.
151
+
152
+ 6) You can paste the Instagram Feed shortcode directly into your page editor.
153
+
154
+ 7) You can use the default WordPress 'Text' widget to display your Instagram Feed in a sidebar or other widget area.
155
+
156
+ == Frequently Asked Questions ==
157
+
158
+ = Can I display multiple Instagram feeds on my site or on the same page? =
159
+
160
+ Yep. You can display multiple Instagram feeds by using our built-in shortcode options, for example: `[instagram-feed user="smashballoon" cols=3]`. Be sure to connect the related Instagram account on the "Configure" tab.
161
+
162
+ = Can I display photos from more than one Instagram account in one single feed? =
163
+
164
+ Yep. You can add multiple user names from the connected accounts on the plugin's Settings page, or directly in the shortcode, separated by commas, like so: `[instagram-feed user="smashballoon, instagramfeed"]`.
165
+
166
+ = Does the plugin work with Instagram oEmbeds? =
167
+
168
+ In version 2.5, support was added to allow the plugin to power your Instagram oEmbeds as official support for these is no longer available in WordPress core. Just connect your account on the oEmbeds settings page inside the plugin and we'll do the rest. No developer app or account required.
169
+
170
+ = How do I find my Instagram Access Token and Instagram User ID =
171
+
172
+ We've made it super easy. Simply click on the big blue button on the Instagram Feed Settings page and log into your Instagram account. The plugin will then ask if you'd like to connect the account and start using it in a feed.
173
+
174
+ = My Instagram feed isn't displaying. Why not!? =
175
+
176
+ There are a few common reasons for this:
177
+
178
+ * **Your Access Token may not be valid.** Try clicking on the blue Instagram login button on the plugin's Settings page again and copy and paste the Instagram token it gives you into the plugin's Access Token field.
179
+ * **The plugin's JavaScript file isn't being included in your page.** This is most likely because your WordPress theme is missing the WordPress [wp_footer](http://codex.wordpress.org/Function_Reference/wp_footer) function which is required for plugins to be able to add their JavaScript files to your page. You can fix this by opening your theme's **footer.php** file and adding the following directly before the closing </body> tag: `<?php wp_footer(); ?>`
180
+ * **Your website may contain a JavaScript error which is preventing JavaScript from running.** The plugin uses JavaScript to load the Instagram photos into your page and so needs JavaScript to be running in order to work. You would need to remove any existing JavaScript errors on your website for the plugin to be able to load in your feed.
181
+
182
+ If you're still having an issue displaying your feed then please open a ticket in the [Support forum](http://wordpress.org/support/plugin/instagram-feed 'Instagram Feed Support Forum') with a link to the page where you're trying to display the Instagram feed and, if possible, a link to your Instagram account.
183
+
184
+ = Are there any security issues with using an Access Token on my site? =
185
+
186
+ Nope. The Access Token used in the plugin is a "read only" token, which means that it could never be used maliciously to manipulate your Instagram account.
187
+
188
+ = Can I view the full-size photos or play Instagram videos directly on my website? =
189
+
190
+ This is a feature of the [Pro version](http://smashballoon.com/instagram-feed/?utm_campaign=instagram-free-readme&utm_source=faqs&utm_medium=fullsize 'Instagram Feed Pro') of the plugin, which allows you to view the photos in a pop-up lightbox, support videos, display captions, display photos by hashtag + more!
191
+
192
+ = How do I embed my Instagram Feed directly into a WordPress page template? =
193
+
194
+ You can embed your Instagram feed directly into a template file by using the WordPress [do_shortcode](http://codex.wordpress.org/Function_Reference/do_shortcode) function: `<?php echo do_shortcode('[instagram-feed]'); ?>`.
195
+
196
+ = My Feed Stopped Working – All I see is a Loading Symbol =
197
+
198
+ If your Instagram photos aren't loading and all your see is a loading symbol then there are a few common reasons:
199
+
200
+ 1) There's an issue with the Instagram Access Token that you are using
201
+
202
+ You can obtain a new Instagram Access Token on the Instagram Feed Settings page by clicking the blue Instagram login button and then copy and pasting it into the plugin's 'Access Token' field.
203
+
204
+ Occasionally the blue Instagram login button does not produce a working access token. You can try [this link](https://smashballoon.com/instagram-feed/token/?utm_campaign=instagram-free-readme&utm_source=faqs&utm_medium=faqconnectionissue) as well.
205
+
206
+ 2) The plugin's JavaScript file isn't being included in your page
207
+
208
+ This is most likely because your WordPress theme is missing the WordPress wp_footer function which is required for plugins to be able to add their JavaScript files to your page. You can fix this by opening your theme's footer.php file and adding the following directly before the closing </body> tag:
209
+
210
+ <?php wp_footer(); ?>
211
+
212
+ 3) There's a JavaScript error on your site which is preventing the plugin's JavaScript file from running
213
+
214
+ You find find out whether this is the case by right clicking on your page, selecting 'Inspect Element', and then clicking on the 'Console' tab, or by selecting the 'JavaScript Console' option from your browser's Developer Tools.
215
+
216
+ If a JavaScript error is occurring on your site then you'll see it listed in red along with the JavaScript file which is causing it.
217
+
218
+ 4) The feed you are trying to display has no Instagram posts
219
+
220
+ If you are trying to display an Instagram feed that has no posts made to it, a loading symbol may be all that shows for the Instagram feed or nothing at all. Once you add an Instagram post the Instagram feed should display normally
221
+
222
+ 5) The shortcode you are using is incorrect
223
+
224
+ You may have an error in the Instagram Feed shortcode you are using or are missing a necessary argument.
225
+
226
+ = What are the available shortcode options that I can use to customize my Instagram feed? =
227
+
228
+ The below options are available on the Instagram Feed Settings page but can also be used directly in the `[instagram-feed]` shortcode to customize individual Instagram feeds on a feed-by-feed basis.
229
+
230
+ * **General Options**
231
+ * **user** - An Instagram User Name (must have account connected) - Example: `[instagram-feed user=AN_INSTAGRAM_USER_NAME]`
232
+ * **width** - The width of your Instagram feed. Any number - Example: `[instagram-feed width=50]`
233
+ * **widthunit** - The unit of the width of your Instagram feed. 'px' or '%' - Example: `[instagram-feed widthunit=%]`
234
+ * **height** - The height of your Instagram feed. Any number - Example: `[instagram-feed height=250]`
235
+ * **heightunit** - The unit of the height of your Instagram feed. 'px' or '%' - Example: `[instagram-feed heightunit=px]`
236
+ * **background** - The background color of the Instagram feed. Any hex color code - Example: `[instagram-feed background=#ffff00]`
237
+ * **class** - Add a CSS class to the Instagram feed container - Example: `[instagram-feed class=feedOne]`
238
+ *
239
+ * **Photo Options**
240
+ * **sortby** - Sort the Instagram posts by Newest to Oldest (none) or Random (random) - Example: `[instagram-feed sortby=random]`
241
+ * **num** - The number of Instagram posts to display initially. Maximum is 33 - Example: `[instagram-feed num=10]`
242
+
243
+ * **cols** - The number of columns in your Instagram feed. 1 - 10 - Example: `[instagram-feed cols=5]`
244
+ * **imageres** - The resolution/size of the Instagram photos. 'auto', full', 'medium' or 'thumb' - Example: `[instagram-feed imageres=full]`
245
+ * **imagepadding** - The spacing around your Instagram photos - Example: `[instagram-feed imagepadding=10]`
246
+ * **imagepaddingunit** - The unit of the padding in your Instagram feed. 'px' or '%' - Example: `[instagram-feed imagepaddingunit=px]`
247
+ * **disablemobile** - Disable the mobile layout for your Instagram feed. 'true' or 'false' - Example: `[instagram-feed disablemobile=true]`
248
+ *
249
+ * **Header Options**
250
+ * **showheader** - Whether to show the Instagram feed Header. 'true' or 'false' - Example: `[instagram-feed showheader=false]`
251
+ * **showbio** - Whether to show the account's bio in the Instagram feed Header. 'true' or 'false' - Example: `[instagram-feed showbio=false]`
252
+ * **custombio** - Custom Bio text for the Instagram feed Header - Example: `[instagram-feed custombio="My custom bio."]`
253
+ * **customavatar** - URL of a custom Avatar for the header. Example: `[instagram-feed customavatar="https://my-site.com/avatar.jpg"]`
254
+
255
+ * **headercolor** - The color of the Instagram feed Header text. Any hex color code - Example: `[instagram-feed headercolor=#333]`
256
+ *
257
+ * **'Load More' Button Options**
258
+ * **showbutton** - Whether to show the 'Load More' button. 'true' or 'false' - Example: `[instagram-feed showbutton='false']`
259
+ * **buttoncolor** - The background color of the button. Any hex color code - Example: `[instagram-feed buttoncolor=#000]`
260
+ * **buttontextcolor** - The text color of the button. Any hex color code - Example: `[instagram-feed buttontextcolor=#fff]`
261
+ * **buttontext** - The text used for the button - Example: `[instagram-feed buttontext="Load More Photos"]`
262
+ *
263
+ * **'Follow on Instagram' Button Options**
264
+ * **showfollow** - Whether to show the 'Follow on Instagram' button. 'true' or 'false' - Example: `[instagram-feed showfollow=true]`
265
+ * **followcolor** - The background color of the 'Follow on Instagram' button. Any hex color code - Example: `[instagram-feed followcolor=#ff0000]`
266
+ * **followtextcolor** - The text color of the 'Follow on Instagram' button. Any hex color code - Example: `[instagram-feed followtextcolor=#fff]`
267
+ * **followtext** - The text used for the 'Follow on Instagram' button - Example: `[instagram-feed followtext="Follow me"]`
268
+
269
+ For more shortcode options, check out the [Pro version](http://smashballoon.com/instagram-feed/?utm_campaign=instagram-free-readme&utm_source=whatare&utm_medium=proshortcode 'Instagram Feed Pro').
270
+
271
+ For more FAQs related to the Instagram Feed plugin please visit the [FAQ section](https://smashballoon.com/instagram-feed/support/faq/?utm_campaign=instagram-free-readme&utm_source=whatare&utm_medium=faqs 'Instagram Feed plugin FAQs') on our website.
272
+
273
+ == Screenshots ==
274
+
275
+ 1. Easily display feeds from any of your Instagram accounts
276
+ 2. Your Instagram Feed is completely customizable and responsive
277
+ 3. Combine multiple accounts into a single feed
278
+ 5. Super quick and easy to get started. Just click the button to connect an Instagram account.
279
+ 5. Customize layouts, styles, colors, and more
280
+ 6. Just copy and paste the shortcode into any page, post or widget on your site
281
+
282
+ == Other Notes ==
283
+
284
+ Add beautifully clean, customizable, and responsive Instagram feeds to your website. Super simple to set up and tons of customization options to seamlessly match the look and feel of your site.
285
+
286
+ = Why do I need this? =
287
+
288
+ **Increase Social Engagement**
289
+ Increase engagement between you and your Instagram followers. Increase your number of Instagram followers by displaying your Instagram content directly on your site.
290
+
291
+ **Save Time**
292
+ Don't have time to update your photos on your site? Save time and increase efficiency by only posting your photos to Instagram and automatically displaying them on your website.
293
+
294
+ **Display Your Content Your Way**
295
+ Customize your Instagram feeds to look exactly the way you want, so that they blend seemlessly into your site or pop out at your visitors!
296
+
297
+ **Keep Your Site Looking Fresh**
298
+ Automatically push your new Instagram content straight to your site to keep it looking fresh and keeping your audience engaged.
299
+
300
+ **No Coding Required**
301
+ Choose from tons of built-in Instagram Feed customization options to create a truly unique feed of your Instagram content.
302
+
303
+ **Super simple to set up**
304
+ Once installed, you can be displaying your Instagram photos within 30 seconds! No confusing steps or Instagram Developer account needed.
305
+
306
+ **Mind-blowing Customer Support**
307
+ We understand that sometimes you need help, have issues or just have questions. We love our users and strive to provide the best support experience in the business. We're experts in the Instagram API and can provide unparalleled service and expertise. If you need support then just let us know and we'll get back to you right away.
308
+
309
+ = What can it do? =
310
+
311
+ * Display Instagram photos from any Instagram account you own.
312
+ * Completely responsive and mobile ready –your Instagram feed layout looks great on any screen size and in any container width
313
+ * Display multiple Instagram feeds on the same page or on different pages throughout your site by using our powerful Instagram Feed shortcode options
314
+ * Display posts from multiple Instagram User IDs
315
+ * Use the built-in shortcode options to completely customize each of your Instagram feeds
316
+ * Infinitely load more of your Instagram photos with the 'Load More' button
317
+ * Plus more features added all the time!
318
+
319
+ = Completely Customizable =
320
+
321
+ * By default the Instagram feed will adopt the style of your website, but can be completely customized to look however you like!
322
+ * Set the number of Instagram photos you want to display
323
+ * Choose how many columns to display your Instagram photos in and the size of the Instagram photos
324
+ * Choose to show or hide certain parts of the Instagram feed, such as the header, 'Load More', and 'Follow' buttons
325
+ * Control the width, height and background color of your Instagram feed
326
+ * Set the spacing/padding between the Instagram photos
327
+ * Display Instagram photos in chronological or random order
328
+ * Use your own custom text and colors for the 'Load More' and 'Follow' buttons
329
+ * Enter your own custom CSS or JavaScript for even deeper customization
330
+ * Use the shortcode options to style multiple Instagram feeds in completely different ways
331
+ * Plus more customization options added all the time!
332
+
333
+ == Changelog ==
334
+ = 6.0.1 =
335
+ * Fix: Custom HTML templates were not applying to new feeds.
336
+ * Fix: Some custom tables were not being created for specific versions of MySQL.
337
+ * Fix: The shortcode setting "showfollow=false" was not working for legacy feeds.
338
+ * Fix: The shortcode settings "showheader" and "showbio" were applying for non-legacy feeds causing confusion when trying to change these settings in the customizer.
339
+ * Fix: The customizer would not resize images causing blank images to show when GDPR features were enabled.
340
+ * Fix: Fixed PHP warning "Undefined array key tagged".
341
+
342
+ = 6.0 =
343
+ * Important: Minimum supported WordPress version has been raised from 3.5 to 4.1.
344
+ * New: Our biggest update ever! We've completely redesigned the plugin settings from head to toe to make it easier to create, manage, and customize your Instagram feeds.
345
+ * New: All your feeds are now displayed in one place on the "All Feeds" page. This shows a list of any existing (legacy) feeds and any new ones that you create. Note: If you updated from a version prior to v2.8 then you may need to view your feeds on your webpage so that the plugin can locate them and list them here.
346
+ * New: Easily edit individual feed settings for new feeds instead of cumbersome shortcode options.
347
+ * New: It's now much easier to create feeds. Just click "Add New", select your feed type, connect your account, and you're done!
348
+ * New: Brand new feed customizer. We've completely redesigned feed customization from the ground up, reorganizing the settings to make them easier to find.
349
+ * New: Live Feed Preview. You can now see changes you make to your feeds in real time, right in the settings page. Easily preview them on desktop, tablet, and mobile sizes.
350
+ * New: Color Scheme option. It's now easier than ever to change colors across your feed without needing to adjust individual color settings. Just set a color scheme to effortlessly change colors across your entire feed.
351
+ * New: You can now change the number of columns in your feed across desktop, tablet, and mobile.
352
+ * New: Easily import and export feed settings to make it simple to move feeds across sites.
353
+
354
+ = 2.9.5 =
355
+ * Fix: Fixed an issue when reconnecting a personal account.
356
+ * Fix: Using showheader="true" in the shortcode would not work if the related setting was disabled on the settings page.
357
+ * Fix: Added additional plugin hardening.
358
+
359
+ = 2.9.4 =
360
+ * Tweak: All Instagram data is now encrypted in your WordPress database.
361
+ * Tweak: Access Tokens are no longer able to be viewed on the settings page.
362
+ * Tweak: Added a maximum caching time of 24 hours.
363
+ * Tweak: Added an expiration time to backup caches.
364
+ * Tweak: Deauthorizing our app inside your Instagram or Facebook account will now delete all data for that feed on your site.
365
+
366
+ = 2.9.3.1 =
367
+ * Fix: Fixed a problem with the image resizing table check that would cause blank images or non-optimized images to show in the feed.
368
+
369
+ = 2.9.3 =
370
+ * Fix: Fixed duplicate MySQL queries issue when checking for the resized images table.
371
+ * Fix: Fixed an issue with the integration with the GDPR Cookie Consent plugin by WebToffee.
372
+ * Fix: Removed max-height rule for the sbi_item elements to improve performance.
373
+ * Tweak: Improved the reliability of the Instagram account connection process.
374
+
375
+ = 2.9.2 =
376
+ * Tested with WordPress 5.8 update.
377
+ * Fix: PHP error "Uncaught Error: array_merge() does not accept unknown named parameters" when visiting the "About" page using PHP 8+.
378
+ * Fix: About page was not recognizing that YouTube Feeds Pro was installed and active when prompting the user to activate a YouTube Feed plugin.
379
+ * Fix: Fixed an issue with GDPR Cookie Consent by Web Toffee integration.
380
+
381
+ = 2.9.1 =
382
+ * Fix: Fixed several issues with GDPR Cookie Consent by Web Toffee integration.
383
+ * Tweak: Changed how connected accounts errors display to prevent temporary, non-actionable errors from triggering a notice.
384
+
385
+ = 2.9 =
386
+ * New: Added support for IGTV posts. When creating an IGTV post, keep the "Post a Preview" setting enabled and the IGTV post will appear in your feed. IGTV posts are only available for connected Instagram business profiles and aren't available if you're using a personal Instagram profile in the plugin.
387
+ * Fix: Fixed a PHP error when the HTTP request to refresh an access token resulted in an error.
388
+
389
+ = 2.8.2 =
390
+ * Fix: Changed how access tokens are retrieved to prevent conflict with the "Rank Math SEO" plugin when connecting an account.
391
+ * Fix: Updated jQuery methods for compatibility with WordPress 5.7.
392
+
393
+ = 2.8.1 =
394
+ * Fix: Fixed a PHP warning which would display in some situations: "array_diff(): Expected parameter 1 to be an array, string given".
395
+ * Fix: Fixed PHP warning "Undefined index: accesstoken" which would display when no primary account was selected.
396
+ * Fix: Fixed issue where account errors were not being removed after an account was deleted or reconnected.
397
+
398
+ = 2.8 =
399
+ * New: The locations of the Instagram feeds on your site will now be logged and listed on a single page for easier management. After this feature has been active for awhile, a "Feed Finder" link will appear next to the Feed Type setting on the plugin Settings page which allows you to see a list of all feeds on your site along with their locations.
400
+ * New: Local resized images will now include a 150x150 resolution version for each post.
401
+ * Tweak: Locally saved image quality set to 80% to increase feed performance without a noticeable visual difference.
402
+ * Tweak: Improved how posts are sorted by date when there are more than one user accounts in a feed.
403
+ * Fix: Old accounts from Instagram's deprecated, non-functioning API are ignored if still connected.
404
+
405
+ = 2.7 =
406
+ * Tweak: Several performance improvements have been made in this update such as improved caching and fewer database queries when displaying feeds.
407
+ * Tweak: The limit of resized, local images created and stored were raised for the overall number and the rate at which they could be created.
408
+ * Tweak: Improved how feed errors are handled and reported. API request delays will only apply to feeds encountering errors and will not affect other feeds.
409
+ * Tweak: Added a hook for disabling image resizing dynamically with PHP.
410
+ * Fix: PHP Warning "required parameter follows optional parameter" that would display when using PHP 8+.
411
+ * Fix: The GDPR feature would sometimes report errors when the feature was working fine.
412
+
413
+ = 2.6.2 =
414
+ * Tweak: If the image resizing feature isn't able to work successfully due to an issue, then the GDPR setting will be disabled unless manually enabled to prevent blank images in the feed.
415
+ * Fix: In some situations the GDPR setting was incorrectly reporting an error with image resizing.
416
+
417
+ = 2.6.1 =
418
+ * Fix: Fixed PHP error related to a missing file.
419
+
420
+ = 2.6 =
421
+ * New: Integrations with popular GDPR cookie consent solutions added: Cookie Notice by dFactory, GDPR Cookie Consent by WebToffee, Cookiebot by Cybot A/S, Complianz by Really Simple Plugins, and Borlabs Cookie by Borlabs. Visit the Instagram Feed settings page, Customize tab, GDPR section for more information.
422
+ * Fix: API error notices would not be removed from the WordPress dashboard after successfully reconnecting an account when the problem was resolved.
423
+ * Fix: Fixed PHP Error that would occur when connecting a personal account that would result in an HTTP error.
424
+ * Fix: oEmbeds were not always working in much older versions of WordPress.
425
+ * Fix: Play and carousel icons would appear very large for small images when the the mobile layout was disabled.
426
+
427
+ = 2.5.4 =
428
+ * Fix: Added more debugging info to the System Info for oEmbeds.
429
+ * Fix: Added a workaround for a rare issue where oEmbed access tokens wouldn't save.
430
+ * Fix: Carousel posts would not show images when using the "Disable JS Image Loading" setting and image resizing was disabled.
431
+
432
+ = 2.5.3 =
433
+ * Fix: Fixed an issue caused by an unannounced Instagram API change affecting thumbnails in certain video posts which don't have image data available in the API.
434
+ * Fix: Added oEmbed account info to the plugin "System Info" to make debugging easier.
435
+
436
+ = 2.5.2 =
437
+ * Fix: Fixed an issue with an Instagram API change causing some images not to display if the image resizing feature was disabled.
438
+
439
+ = 2.5.1 =
440
+ * Tweak: Minor update to footer.php template.
441
+ * Tweak: Added support for improved notices on the plugin settings page.
442
+ * Fix: Added aria-hidden="true" attribute to loader icon for better accessibility.
443
+
444
+ = 2.5 =
445
+ * New: Added support for Instagram oEmbeds. When you share a link to a Instagram post, WordPress automatically converts it into an embedded Instagram post for you (an "oEmbed"). However, on October 24, 2020, WordPress is discontinuing support for Instagram oEmbeds and so any existing or new embeds will no longer work. Don't worry though, we have your back! This update adds support for Instagram oEmbeds and so, after updating, the Instagram Feed plugin will automatically keep your oEmbeds working. It will also power any new oEmbeds you post going forward.
446
+ * New: Install our other free social media plugins right from the Instagram Feed settings menu. Use our Facebook, YouTube, and Twitter plugins to add even more social content to your website and help further engage your viewers and increase your followers.
447
+ * Tweak: Changed the names of the CSS and JavaScript files to prevent certain ad blockers from hiding the feed. Original files with original names still included in this update.
448
+ * Tweak: Background caching and favoring local images are now the default settings for new installs.
449
+ * Fix: Fixed PHP warning too few arguments when using Spanish translation files.
450
+
451
+ = 2.4.7 =
452
+ * Important: Due to recent Instagram changes, private accounts will need to be manually refreshed every 60 days. If you have a private Instagram account, consider making it public to avoid needing to manually reconnect your account.
453
+ * New: Added a notice for accounts that are private which lets you know how long until the account needs to be refreshed. You will also be alerted using our admin notice and email notification system if a private account will soon need to be refreshed.
454
+
455
+ = 2.4.6 =
456
+ * New: Added a PHP hook "sbi_clear_page_caches" which allows you to dynamically disable the Instagram Feed code that clears caches created by common page caching plugins.
457
+ * New: Added a PHP hook "sbi_resize_url" which allows you to change the default URL of locally stored images. This can be helpful for sites using CDNs.
458
+ * Tweak: Added a workaround for the wp_json_encode function used in older versions of WordPress.
459
+ * Fix: Compatibility updates for the upcoming WordPress version 5.5 release.
460
+
461
+ = 2.4.5 =
462
+ * Fix: Accounts can be connected without the use of JavaScript.
463
+ * Fix: Default URL for connecting an account changed to prevent "Invalid Scope" connection issue.
464
+
465
+ = 2.4.4 =
466
+ * Fix: Workaround added for PHP warning related to an undefined media_url index.
467
+ * Fix: Connecting a business account on a mobile device when more than 2 pages where returned was not possible.
468
+ * Fix: After connecting an account, the warning that there were no connected accounts would still be visible.
469
+ * Fix: URL for retrieving image files from Instagram using a redirect method was changed to prevent an extra, unnecessary redirect.
470
+
471
+ = 2.4.3 =
472
+ * Fix: The opt-in notice to help improve the plugin was not dismissing as expected for some sites due to the admin JavaScript file being cached by the browser.
473
+ * Fix: Disabled the "About Us" page plugin installation if using a version of WordPress earlier than 4.6.
474
+
475
+ = 2.4.2 =
476
+ * New: To help us improve the plugin we've added the ability to opt-in to usage tracking so that we can understand what features and settings are being used, and which features matter to you the most. This is disabled by default and will only be enabled if you explictly choose to opt in. If opted in, the plugin will send a report in the background once per week with your plugin settings and basic information about your website environment. No personal or sensitive data is collected (such as email addresses, Instagram account information, license keys, etc). To enable or disable usage tracking at a later date use the setting at: Instagram Feed > Customize > Advanced > Misc > Enable Usage Tracking. See [here](https://smashballoon.com/instagram-feed/usage-tracking/) for more information.
477
+ * Tweak: Added additional checks to make sure the HTTP protocol matches when using resized image URLs from the uploads folder.
478
+ * Tweak: More information is given when there is an account connection error when connecting an account on the "Configure" page.
479
+ * Tweak: Connecting a business account will permanently remove any accounts from the same user that are from the legacy Instagram API that is expiring in June.
480
+ * Fix: Added a workaround for sanitize_textarea_field for users using an older version of WordPress.
481
+ * Fix: Fixed HTML error causing the manually connect an account feature to not work.
482
+ * Fix: Access token and account ID are validated and formatted before trying to manually connect an account to prevent errors.
483
+
484
+ = 2.4.1 =
485
+ * Tweak: User feeds that do not have a user name or ID assigned to them will automatically use the first connected account for the feed.
486
+ * Tweak: rel="nofollow" added to all external Instagram Feed links found in the source of the page.
487
+ * Fix: API Error #2 was not clearing properly in error reports.
488
+
489
+ = 2.4 =
490
+ * New: Email alerts for critical issues. If there's an issue with an Instagram feed on your website which hasn't been resolved yet then you'll receive an email notification to let you know. This is sent once per week until the issue is resolved. These emails can be disabled by using the following setting: Instagram Feed > Customize > Advanced > Misc > Feed Issue Email Report.
491
+ * New: Admin notifications for critical issues. If there is an error with the feed, admins will see notices in the dashboard and on the front-end of the site along with instructions on how to resolve the issue. Front-end admin notifications can be disabled by using the following setting: Instagram Feed > Customize > Advanced > Misc > Disable Admin Error Notice.
492
+ * New: Added a WordPress 'Site Health' integration. If there is a critical error with your feeds, it will now be flagged in the site health page.
493
+ * New: Added "About Us" page for those who would like to learn more about Smash Balloon and our other products. Go to Instagram Feed -> About Us in the dashboard.
494
+ * New: Added support for an Instagram Feed widget. When on the widgets menu, look for the widget "Instagram Feed" to add your feed to a widget area.
495
+
496
+ = 2.3.1 =
497
+ * Fix: Added workaround for personal account connection error and header display issue due to an Instagram API bug. After updating, click "Save Changes" on the Instagram Feed settings page, "Configure" tab to clear your cache.
498
+
499
+ = 2.3 =
500
+ * New: Added an "Instagram Feed" Gutenberg block to use in the block editor, allowing you to easily add a feed to posts and pages.
501
+
502
+ = 2.2.2 =
503
+ * Tested with upcoming WordPress 5.4 update.
504
+ * Tweak: Language files updated to account for all new strings.
505
+
506
+ = 2.2.1 =
507
+ * Important: March 2 deadline for migrating to the new Instagram API pushed back to March 31.
508
+ * Fix: Some links to Instagram were missing a backslash at the end of the URL causing a 301 redirect.
509
+ * Fix: Error saving updated account information caused by emoji in account bio or in account names and MySQL tables that didn't have a UTF8mb4 character set.
510
+
511
+ = 2.2 =
512
+ * Important: On March 31, Instagram will stop supporting its old API which will disrupt feeds created from personal connected accounts. If you are using a personal account, you will need to reconnect the account on the Instagram Feed Settings page. Please [see here](https://smashballoon.com/instagram-api-changes-march-2-2020/) for more information.
513
+ * New: Support added for the new Instagram Basic Display API.
514
+ * New: Added PHP hooks 'sbi_before_feed' and 'sbi_after_feed' for displaying HTML before and after the main Instagram feed HTML.
515
+ * New: Added settings for adding a custom header avatar and custom header bio text. Go to the "Customize" tab "Header" area to set these or use customavatar="AVATAR URL" or custombio="BIO TEXT" in the shortcode.
516
+ * Tweak: Warnings and messages displaying on the front end of sites now display at the top of the feed.
517
+ * Tweak: Header template changed to accommodate missing data if connected as a personal account to the new API.
518
+ * Tweak: Changes to feed.php, header.php, and item.php templates.
519
+ * Tweak: Added CSS to prevent some themes from adding box shadows and bottom border when hovering over the header.
520
+ * Tweak: Added code to clear page caching from Litespeed cache when clearing page caches with the plugin.
521
+ * Tweak: Header and follow button will still be displayed when number of posts is set to 0.
522
+ * Fix: Emoji in the first few characters of a caption would cause the main post image to switch to an emoji when loading more.
523
+ * Fix: Pagination for "tagged" feeds not working for certain accounts.
524
+
525
+ = 2.1.5 =
526
+ * New: Added aria-label attributes to SVGs for improved accessibility.
527
+ * Tweak: Changed screen reader and alt text to be more SEO friendly (change made to item.php template).
528
+ * Tweak: Added PHP hooks to use custom alt and screen reader text.
529
+ * Fix: Image resolution setting option "Medium" dimensions changed from 306x306 to 320x320.
530
+ * Fix: Screen reader text would be visible if text was right aligned.
531
+ * Fix: Incorrect image resolution would be used when setting the image resolution to something other than auto.
532
+
533
+ = 2.1.4 =
534
+ * Tweak: If sb_instagram_js_options is not defined, a default object is set.
535
+ * Tweak: Added a text link in the settings page footer to our new free [YouTube plugin](https://wordpress.org/plugins/feeds-for-youtube/)
536
+ * Fix: Local images not being used when available in certain circumstances.
537
+
538
+ = 2.1.3 =
539
+ * New: Added filter "sbi_settings_pages_capability" to change what permission is needed to access settings pages.
540
+ * Tweak: Updated language files for version 2.0+.
541
+ * Tweak: Better error messages for no posts being found and API request delays.
542
+ * Tweak: If "Favor Local Images" setting is in use, a 640px resolution image will be created for images coming from a personal account.
543
+ * Tweak: Better error recovery when image file not found when viewing the feed.
544
+ * Tweak: Button and input field styling updated to look better with WordPress 5.3.
545
+ * Fix: Accounts that were connected prior to version 1.12 would not show the follow button if the header was not also displayed. Visit the "Configure" tab to have the account automatically updated.
546
+ * Fix: MySQL error when retrieving resized images. Thanks [the-louie](https://github.com/the-louie)!
547
+ * Fix: When using the new Twenty Twenty theme, Instagram icon in "follow" button displaying as block and causing the button text to appear on a new line.
548
+
549
+ = 2.1.2 =
550
+ * New: Added setting "API request size" on the "Customize" tab to allow requesting of more posts than are in the feed. Setting this to a high number will prevent no posts being found if you often post IG TV posts and use a personal account.
551
+ * Tweak: Removed width and height attributes from the image element in the feed to prevent notices about serving scaled images in optimization tools.
552
+
553
+ = 2.1.1 =
554
+ * New: Added ability to enqueue the CSS file through the shortcode. This loads the file in the footer of the site, and only on pages that include a feed. Enable on the "Customize" tab.
555
+ * Tweak: Resized images can be used in the page source code when "Disable js image loading" setting is enabled.
556
+ * Fix: HTML for header would still be visible in the source of the page when removing the header using showheader=false in the shortcode.
557
+
558
+ = 2.1 =
559
+ * New: Added the ability to overwrite default templates in your theme. View [this article](https://smashballoon.com/guide-to-creating-custom-templates/) for more information.
560
+ * New: Added several PHP hooks for modifying feeds settings and functionality.
561
+ * Fix: Using the "Load Initial Posts with AJAX" setting would cause images to not resize with the browser window.
562
+ * Fix: Added back language files for translations.
563
+ * Fix: Changing the image resolution setting would not change the image size.
564
+ * Fix: Follow button would not show if there was no connected account.
565
+ * Fix: Deleting any connected account will delete any connected accounts that have errors in the data that was saved for them.
566
+
567
+ = 2.0.2 =
568
+ * Fix: HTML for header would still be visible in the source of the page when removing the header using showheader=false in the shortcode
569
+ * Fix: CSS added to prevent layout issues when adding the feed to a "text" widget for certain themes
570
+
571
+ = 2.0.1 =
572
+ * Tweak: Force cache of major caching plugins to clear when updating plugin to avoid issues with previous CSS/JavaScript files being cached
573
+ * Tweak: Added version number to the end of JavaScript and CSS files to clear browser caches that are causing errors
574
+ * Fix: Added back filter to allow using shortcode in a custom HTML widget
575
+ * Fix: Added back settings to display bio information in header and change header size which were mistakenly removed in the last update
576
+ * Fix: Fixed a PHP notice which might display under certain circumstances
577
+
578
+ = 2.0 =
579
+ * **MAJOR UDPATE**
580
+ * New: We've rebuilt the plugin from the ground up with a focus on performance and reliability. Your feeds are now loaded from the server using PHP removing the reliance on AJAX.
581
+ * New: Local copies of images are now automatically stored on your server and used in your feed. You can disable this feature in the "Advanced" section of the "Customize" tab. Use the "Favor Local Images" setting on the "Customize" tab, "Advanced" sub-tab to have the plugin use local images whenever available, thus removing reliance on the Instagram CDN.
582
+ * New: You can now set the plugin to check for new Instagram posts in the background rather than when the page loads by using the new "Background caching" option which utilizes the WordPress "cron" feature. Enable this using the "Check for new posts" setting on the "Configure" tab.
583
+ * New: If you have a business account for Instagram, you can now connect to the new Instagram API. You can continue to use your connected personal account and do not need to connect a business account.
584
+
585
+ = 1.12.2 =
586
+ * Fix: Fixed error from Instagram when connecting a personal account.
587
+
588
+ = 1.12.1 =
589
+ * Tweak: If an image in a post fails to load then the plugin attempts to load it from another image source
590
+
591
+ = 1.12 =
592
+ * Fix: Includes fixes for some security vulnerabilities. Thanks to Julio Potier of [SecuPress](https://secupress.me/) for reporting the issues.
593
+ * Fix: Fixed an issue caused by a bug in the Instagram API which was preventing some Instagram accounts from being able to be connected. If you experienced an issue connecting an Instagram account then please try again after updating.
594
+ * Fix: Quotes represented by "%20" in Instagram data were causing a JSON parsing error.
595
+ * Tweak: Data for the feed is now cached outside of the admin-ajax.php calls.
596
+
597
+ = 1.11.3 =
598
+ * Fix: Escaped single quotes causing a JSON parse error under certain circumstances.
599
+ * Fix: Translatable code errors in the admin area causing some text to not be translatable.
600
+
601
+ = 1.11.2 =
602
+ * Fix: Unable to connect new accounts due to changes with Instagram's API. Remote requests to connect accounts are now made server-side.
603
+
604
+ = 1.11.1 =
605
+ * Fix: Feed would not load from a cache created with an older version of the plugin
606
+ * Fix: Fixed PHP warning trying to count string length of an array
607
+
608
+ = 1.11 =
609
+ * New: Added capability "manage_instagram_feed_options" to support customizations that will allow users/roles other than the administrator to access Instagram Feed settings pages.
610
+ * Fix: rel="noopener" added to all links that contain target="blank"
611
+ * Fix: HTTPS used in xlmns attribute for SVGs
612
+ * Fix: Fixed issues with strings in the admin area being translatable
613
+ * Fix: Fixed a potential security vulnerability. Thanks to [Martin Verreault](https://egyde.ca/) for reporting the issue.
614
+
615
+ = 1.10.2 =
616
+ * Confirmed compatibility with the upcoming WordPress 5.0 "Gutenberg" update
617
+ * Fix: Fixed an issue caused by some themes which affected the formatting of the 'Load More' and 'Follow' buttons
618
+ * Fix: Fixed an occasional formatting issue with error messages due to no line-height being set
619
+ * Fix: Minor admin UI fixes
620
+ * Tweak: Removed mention of some Pro features which will be deprecated due to upcoming Instagram API changes
621
+
622
+ = 1.10.1 =
623
+ * Tweak: Automatic image resolution detection setting now works better with wide images. Resizing the browser will now automatically raise the image resolution if needed.
624
+ * Fix: Fixed an issue where the Load More button would disappear if all posts for a feed were cached.
625
+
626
+ = 1.10 =
627
+ * New: We've made improvements to the way photos are loaded into the feed, adding a smooth transition to display photos subtly rather than suddenly.
628
+ * New: More header sizes; you can now choose from three sizes: small, medium, and large. Change this on the "Customize" tab.
629
+ * Fix: Using a percent for the image padding was causing the height of images to be too tall
630
+ * Fix: Removed a PHP notice when the Instagram API was blocked by the web host
631
+
632
+ = 1.9.1 =
633
+ * Fix: Captions missing as "alt" text for Instagram images.
634
+ * Fix: System information was not formatting connected Instagram accounts and user ids correctly
635
+ * Fix: "Unauthorized redirect URL" error occurring while trying to connect a new Instagram account due to recent changes from Instagram
636
+ * Fix: Using a percent for the image padding was causing the height of Instagram images to be to tall
637
+
638
+ = 1.9 =
639
+ * New: Retrieving Access Tokens and connecting multiple Instagram accounts is now easier using our improved interface for managing account information. While on the Configure tab, click on the big blue button to connect an account, or use the "Manually Connect an Account" option to connect one using an existing Access Token. Once an account is connected, you can use the associated buttons to either add it to your primary Instagram User feed or to a different Instagram feed on your site using the `user` shortcode option, eg: `user=smashballoon`.
640
+ * Tweak: Disabled auto load in the database for backup caches
641
+ * Fix: Fixed an occasional issue with the Instagram login flow which would result in an "Unauthorized redirect URL" error
642
+
643
+ = 1.8.3 =
644
+ * Fix: SVG icons caused some display problems in IE 11
645
+ * Fix: Removed support for using usernames in the Instagram User ID setting due to recent API changes. Will now default to the Instagram User ID attached to the Access Token.
646
+ * Fix: Backup feed not always being used when Access Tokens expire
647
+ * Fix: Instagram Access Tokens may have been incorrectly saved as invalid under certain circumstances
648
+
649
+ = 1.8.2 =
650
+ * Tweak: Setting "Cache Error API Recheck" enabled by default for new Instagram Feed installs
651
+ * Fix: Page caches created with the WP Rocket plugin will be cleared when the Instagram Feed settings are updated or the cache is forced to clear
652
+ * Fix: Fixed a rare issue where feeds were displaying "Looking for cache that doesn't exist" when page caching was not being used
653
+
654
+ = 1.8.1 =
655
+ * Fix: Fixed issue where Instagram feeds were displaying "Looking for cache that doesn't exist" when page caching was not being used
656
+ * Fix: Font method setting not working when "Are you using an ajax theme?" setting is enabled
657
+
658
+ = 1.8 =
659
+ * Important: Due to [recent changes](https://smashballoon.com/instagram-api-changes-april-4-2018/?utm_campaign=instagram-free-readme&utm_source=changelog&utm_medium=apichanges) in the Instagram API it is no longer possible to display photos from other Instagram accounts which are not your own. You can only display the user feed of the account which is associated with your Access Token.
660
+ * New: Added an Access Token shortcode option and support for multiple Instagram Access Tokens. If you own multiple Instagram accounts then you can now use multiple Access Tokens in order to display user feeds from each Instagram account, either in separate feeds, or in the same feed. Just use the `accesstoken` shortcode option. See [this FAQ](https://smashballoon.com/display-multiple-instagram-feeds/#multiple-user-feeds) for more information on displaying multiple User feeds.
661
+
662
+ = 1.7 =
663
+ * New: Added feed caching to limit the number of Instagram API requests. Use the setting on the "Configure" tab "Check for new posts every" to set how long feed data will be cached before refreshing.
664
+ * New: Added backup caching for all feeds. If the Instagram feed is unable to display then a backup feed will be shown to visitors if one is available. The backup cache can be disabled or cleared by using the following setting: `Customize > Misc > Enable Backup Caching`.
665
+ * New: Icons are now generated as SVGs for a sharper look and more semantic markup
666
+ * New: Instagram carousel posts include an icon to indicate that they are carousel posts
667
+ * Tweak: Using the "sort posts by random" feature will include the most recent 33 posts instead of just the posts shown in the Instagram feed
668
+ * Fix: links back to instagram.com will use the "www" prefix
669
+
670
+ = 1.6.2 =
671
+ * Fix: Fixed a rare issue where the Load More button wouldn't be displayed after the last update if the Instagram account didn't have many posts
672
+
673
+ = 1.6.1 =
674
+ * Fix: Fixed Font Awesome 5.0 causing Instagram icon to appear as a question mark with a circle
675
+ * Fix: Fixed inline padding style for sbi_images element causing validation error when set to "0" or blank space
676
+ * Fix: Added a workaround for an Instagram API bug which caused some feeds to show fewer posts than expected
677
+
678
+ = 1.6 =
679
+ * New: Loading icon appears when waiting for new posts after clicking the "Load More..." button
680
+ * New: Added translation files for Dutch (nl_NL)
681
+ * Fix: Fixed a potential security vulnerability. Thanks to [Magnus Stubman](http://dumpco.re/) for reporting the issue.
682
+
683
+ = 1.5.1 =
684
+ * New: The plugin is now compatible with the [WPML plugin](https://wpml.org/) allowing you to use multiple translations for your feeds on your multi-language sites
685
+ * New: Added translation files for Danish (da_DK), Finnish (fi_FL), Japanese (ja_JP), Norwegian (nn_NO), Portuguese (pt_PT), and Swedish (sv_SE) to translate the "Load More" and "Follow on Instagram" text
686
+
687
+ = 1.5 =
688
+ * New: Improved tool for retrieving Instagram Access Tokens
689
+ * New: Added an option to show/hide Instagram bio text in feed header
690
+ * New: Feeds that include IDs from "private" Instagram accounts will now ignore the private data and display a message to logged-in site admins which indicates that one of the Instagram accounts is private
691
+ * New: Feeds without any Instagram posts yet will display a message informing logged-in admins to make a post on Instagram in order to view the feed
692
+ * New: Added translation files for French (fr_FR), German (de_DE), English (en_EN), Spanish (es_ES), Italian (it_IT), and Russian (ru_RU) to translate "Load More..." and "Follow on Instagram"
693
+ * Tweak: Optimized several images used in the Instagram feed including loader.png
694
+ * Tweak: Font Awesome stylesheet handle has been renamed so it will only be loaded once if our Custom Facebook Feed plugin is also active
695
+ * Fix: Updated the Font Awesome icon font to the latest version: 4.7.0
696
+ * Fix: Padding removed from "Load More" button if no buttons are being used in the Instagram feed
697
+ * Fix: All links in the feed are now https
698
+ * Fix: Fixed JavaScript errors which were being caused if the Instagram Access Token had expired or the user ID was incorrect, private, or had no Instagram posts
699
+
700
+ = 1.4.9 =
701
+ * Compatible with WordPress 4.8
702
+
703
+ = 1.4.8 =
704
+ * Tweak: Updated plugin links for new WordPress.org repo
705
+ * Fix: Minor bug fixes
706
+
707
+ = 1.4.7 =
708
+ * Fix: Fixed a security vulnerabiliy
709
+ * Tested with upcoming WordPress 4.6 update
710
+
711
+ = 1.4.6.2 =
712
+ * Fix: Removed a comment from the plugin's JavaScript file which was causing an issue with some optimization plugins, such as Autoptimize.
713
+
714
+ = 1.4.6.1 =
715
+ * Fix: Fixed an issue with the Instagram image URLs which was resulting in inconsistent url references in some feeds
716
+
717
+ = 1.4.6 =
718
+ * **IMPORTANT: Due to the recent Instagram API changes, in order for the Instagram Feed plugin to continue working after June 1st you must obtain a new Access Token by using the Instagram button on the plugin's Settings page.** This is true even if you recently already obtained a new token. Apologies for any inconvenience.
719
+
720
+ = 1.4.5 =
721
+ * New: When you click on the name of a setting on the plugin's Settings pages it now displays the shortcode option for that setting, making it easier to find the option that you need
722
+ * New: Added a setting to disable the Font Awesome icon font if needed. This can be found under the Misc tab at the bottom of the Customize page.
723
+ * Tweak: Updated the Instagram icon to match their new branding
724
+ * Tweak: Added a help link next to the Instagram login button in case there's an issue using it
725
+ * Fix: Updated the Font Awesome icon font to the latest version: 4.6.3
726
+
727
+ = 1.4.4 =
728
+ * Fix: Fixed an issue caused by a specific type of emoji which would cause the feed to break when used in a post
729
+ * Tweak: Added links to our other **free** plugins to the bottom of the admin pages: [The Custom Facebook Feed](https://wordpress.org/plugins/custom-facebook-feed/) and [Custom Twitter Feeds](https://wordpress.org/plugins/custom-twitter-feeds/)
730
+
731
+ = 1.4.3 =
732
+ * Fix: Important notice added in the last update is now only visible to admins
733
+
734
+ = 1.4.2 =
735
+ * New: Compatible with Instagram's new API changes effective June 1st
736
+ * New: Added video icons to Instagram posts in the feed which contain videos
737
+ * New: Added a setting to allow you to use a fixed pixel width for the feed on desktop but switch to a 100% width responsive layout on mobile
738
+ * Tweak: Added a width and height attribute to the images to help improve Google PageSpeed score
739
+ * Tweak: A few minor UI tweaks on the settings pages
740
+ * Fix: Minified CSS and JS files
741
+
742
+ = 1.3.11 =
743
+ * Fix: Fixed a bug which was causing the height of the Instagram photos to be shorter than they should have been in some themes
744
+ * Fix: Fixed an issue where when an Instagram feed was initially hidden (in a tab, for example) then the Instagram photo resolution was defaulting to 'thumbnail'
745
+
746
+ = 1.3.10 =
747
+ * Fix: Fixed an issue which was setting the visibility of some Instagram photos to be hidden in certain browsers
748
+ * Fix: The new square photo cropping is no longer being applied to Instagram feeds displaying images at less than 150px wide as the images from Instagram at this size are already square cropped
749
+ * Fix: Fixed a JavaScript error in Internet Explorer 8 caused by the 'addEventListener' function not being supported
750
+
751
+ = 1.3.9 =
752
+ * Fix: Fixed an issue where Instagram photos wouldn't appear in the Instagram feed if it was initially being hidden inside of a tab or some other element
753
+ * Fix: Fixed an issue where the new Instagram image cropping fuction was failing to run on some sites and causing the Instagram images to appear as blank
754
+
755
+ = 1.3.8 =
756
+ * Fix: If you have uploaded an Instagram photo in portrait or landscape then the plugin will now display the square cropped version of the photo in your Instagram feed
757
+
758
+ = 1.3.7 =
759
+ * Fix: Fixed an issue with double quotes in photo captions (used in the Instagram photo alt tags) which caused a formatting issue
760
+
761
+ = 1.3.6 =
762
+ * Fix: Fixed an issue introduced in version 1.3.4 which was causing theme settings to not be applied in some themes
763
+
764
+ = 1.3.5 =
765
+ * Fix: Reverted the 'prop' function introduced in the last update back to 'attr' as prop isn't supported in older versions of jQuery
766
+ * Fix: Removed the image load function as it was causing Instagram images not to be displayed for some users
767
+
768
+ = 1.3.4 =
769
+ * Fix: Used the Instagram photo caption to add a more descriptive alt tag to the Instagram photos
770
+ * Fix: Instagram photos are now only displayed once they're fully loaded
771
+ * Fix: Added a stricter CSS implementation for some elements to prevent styles being overridden by themes
772
+ * Fix: Added CSS opacity property to Instagram images to prevent issues with lazy loading in some themes
773
+ * Fix: Removed a line of code which was disabling WordPress Debug/Error Reporting. If needed, this can be disabled again by using the setting at the bottom of the plugin's 'Customize' settings page.
774
+ * Fix: Made some JavaScript improvements to the core Instagram Feed plugin code
775
+
776
+ = 1.3.3 =
777
+ * Fix: Fixed an issue with the 'Load more' button not always showing when displaying Instagram photos from multiple Instagram User IDs
778
+ * Fix: Moved the initiating sbi_init function outside of the jQuery ready function so that it can be called externally if needed by Ajax powered themes/plugins
779
+
780
+ = 1.3.2 =
781
+ * New: Added an option to disable the Instagram Feed mobile layout
782
+ * New: Added an setting which allows you to use the Instagram Feed plugin with an Ajax powered theme
783
+ * New: Added a 'class' shortcode option which allows you to add a CSS to class to each individual Instagram feed: `[instagram-feed class=feedOne]`
784
+ * New: Added a Support tab which contains System Info to help with troubleshooting
785
+ * New: Added friendly error messages which display only to WordPress admins
786
+ * New: Added validation to the Instagram User ID field to prevent usernames being entered instead of IDs
787
+ * Tweak: Made the Instagram Access Token field slightly wider to prevent tokens being copy and pasted incorrectly
788
+ * Fix: Fixed a JavaScript bug which caused the feed not to load photos correctly in IE8
789
+
790
+ = 1.3.1 =
791
+ * Fix: Fixed an issue with the Instagram icon not appearing in the 'Follow on Instagram' button or in the Instagram Feed header
792
+ * Fix: Addressed a few CSS issues which were causing some minor formatting issues in the Instagram Feed on certain themes
793
+
794
+ = 1.3 =
795
+ * New: You can now display Instagram photos from multiple Instagram User IDs. Simply separate your Instagram IDs by commas.
796
+ * New: Added an optional header to the Instagram feed which contains your Instagram profile picture, Instagram username and Instagram bio. You can activate this on the Instagram Feed Customize page.
797
+ * New: The Instagram Feed plugin now includes an 'Auto-detect' option for the Instagram Image Resolution setting which will automatically set the correct Instagram image resolution based on the size of your Instagram feed.
798
+ * New: Added an optional 'Follow on Instagram' button which can be displayed at the bottom of your Instagram feed. You can activate this on the Instagram Feed Customize page.
799
+ * New: Added the ability to use your own custom text for the 'Load More' button
800
+ * New: Added a loader icon to indicate that the Instagram photos are loading
801
+ * New: Added a unique ID to each Instagram photo so that they can be targeted individually via CSS
802
+ * Tweak: Added a subtle fade effect to the Instagram photos when hovering over them
803
+ * Tweak: Improved the responsive layout behavior of the Instagram feed
804
+ * Tweak: Improved the documentation within the Instagram Feed plugin settings pages
805
+ * Tweak: Included a link to [step-by-step setup directions](http//:smashballoon.com/instagram-feed/free/?utm_campaign=instagram-free-readme&utm_source=changelog&utm_medium=changelog 'Instagram feed setup directions') for the plugin
806
+ * Fix: Fixed an issue with the feed not clearing other widgets correctly
807
+
808
+ = 1.2.3 =
809
+ * Fix: Replaced the 'on' function with the 'click' function to increase compatibility with themes using older versions of jQuery
810
+
811
+ = 1.2.2 =
812
+ * Tweak: Added an initialize function to the Instagram Feed plugin
813
+ * Fix: Fixed an occasional issue with the 'Sort Photos By' option being undefined
814
+
815
+ = 1.2.1 =
816
+ * Fix: Fixed a minor issue with the Custom JavaScript being run before the Instagram photos are loaded
817
+ * Fix: Removed stray PHP notices
818
+ * Fix: Changed the double quotes to single quotes on the 'data-options' attribute
819
+
820
+ = 1.2 =
821
+ * New: Added Custom CSS and Custom JavaScript sections which allow you to add your own custom CSS and JavaScript to the Instagram Feed plugin
822
+ * New: Added an option to display your Instagram photos in random order
823
+ * New: A new tabbed layout has been implemented on the Instagram Feed plugin's settings pages
824
+ * New: Added an option to preserve your Instagram Feed settings when uninstalling the plugin
825
+ * New: Added a [Pro version](http://smashballoon.com/instagram-feed/?utm_campaign=instagram-free-readme&utm_source=changelog&utm_medium=changelog 'Instagram Feed Pro') of the Instagram Feed plugin which allows you to display Instagram photos by hashtag, display Instagram captions, view Instagram photos in a pop-up lightbox, show the number of Instagram likes & comments and more
826
+ * Tweak: The 'Load More' button now automatically hides if there are no more Instagram photos to load
827
+ * Tweak: Added a small gap to the top of the 'Load More' button
828
+ * Tweak: Added a icon to the Instagram Feed menu item
829
+
830
+ = 1.1.6 =
831
+ * Fix: A maximum width is now only applied to the Instagram feed when the Instagram photos are displayed in one column
832
+
833
+ = 1.1.5 =
834
+ * Fix: Added a line of code which enables shortcodes to be used in widgets for themes which don't have it enabled
835
+
836
+ = 1.1.4 =
837
+ * Fix: Fixed an issue with the Instagram Access Token and Instagram User ID retrieval functionality in certain web browsers
838
+
839
+ = 1.1.3 =
840
+ * Fix: Fixed an issue with the maximum Instagram image width
841
+ * Fix: Corrected a typo in the Instagram Feed Shortcode Options table
842
+
843
+ = 1.1.1 =
844
+ * Pre-tested for the upcoming WordPress 4.0 update
845
+ * Fix: Fixed an uncommon issue related to the output of the Instagram content
846
+
847
+ = 1.1 =
848
+ * New: Added an option to set the number of Instagram photos to be initially displayed
849
+ * New: Added an option to show or hide the 'Load More' button
850
+ * New: Added 'Step 3' to the Instagram Feed Settings page explaining how to display your feed using the [instagram-feed] shortcode
851
+ * New: Added a full list of all available Instagram Feed shortcode options to help you if customizing multiple Instagram feeds
852
+
853
+ = 1.0.2 =
854
+ * Fix: Fixed an issue with the Instagram login URL on the plugin's Instagram Feed Settings page
855
+
856
+ = 1.0.1 =
857
+ * Fix: Fixed an issue with the Instagram Feed 'Load More' button opening an empty browser window in Firefox
858
+
859
+ = 1.0 =
860
+ * Launched the Instagram Feed plugin!
admin/SBI_About_Us.php CHANGED
@@ -1,326 +1,326 @@
1
- <?php
2
-
3
- /**
4
- * The About Page
5
- *
6
- * @since 4.0
7
- */
8
-
9
- namespace InstagramFeed\Admin;
10
- if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
11
-
12
- use InstagramFeed\SBI_View;
13
- use InstagramFeed\SBI_Response;
14
-
15
- class SBI_About_Us {
16
- /**
17
- * Admin menu page slug.
18
- *
19
- * @since 4.0
20
- *
21
- * @var string
22
- */
23
- const SLUG = 'sbi-about-us';
24
-
25
- /**
26
- * Initializing the class
27
- *
28
- * @since 4.0
29
- */
30
- function __construct(){
31
- $this->init();
32
- }
33
-
34
- /**
35
- * Determining if the user is viewing the our page, if so, party on.
36
- *
37
- * @since 4.0
38
- */
39
- public function init() {
40
- if ( ! is_admin() ) {
41
- return;
42
- }
43
-
44
- add_action( 'admin_menu', [ $this, 'register_menu' ] );
45
- }
46
-
47
- /**
48
- * Register Menu.
49
- *
50
- * @since 4.0
51
- */
52
- function register_menu() {
53
- $cap = current_user_can( 'manage_instagram_feed_options' ) ? 'manage_instagram_feed_options' : 'manage_options';
54
- $cap = apply_filters( 'sbi_settings_pages_capability', $cap );
55
-
56
- $about_us = add_submenu_page(
57
- 'sb-instagram-feed',
58
- __( 'About Us', 'instagram-feed' ),
59
- __( 'About Us', 'instagram-feed' ),
60
- $cap,
61
- self::SLUG,
62
- [$this, 'about_us'],
63
- 4
64
- );
65
- add_action( 'load-' . $about_us, [$this,'about_us_enqueue_assets']);
66
- }
67
-
68
- /**
69
- * Enqueue About Us Page CSS & Script.
70
- *
71
- * Loads only for About Us page
72
- *
73
- * @since 4.0
74
- */
75
- public function about_us_enqueue_assets(){
76
- if( ! get_current_screen() ) {
77
- return;
78
- }
79
- $screen = get_current_screen();
80
- if ( ! 'instagram-feed_page_sbi-about-us' === $screen->id ) {
81
- return;
82
- }
83
-
84
- wp_enqueue_style(
85
- 'about-style',
86
- SBI_PLUGIN_URL . 'admin/assets/css/about.css',
87
- false,
88
- SBIVER
89
- );
90
-
91
- wp_enqueue_script(
92
- 'vue-main',
93
- 'https://cdn.jsdelivr.net/npm/vue@2.6.12',
94
- null,
95
- '2.6.12',
96
- true
97
- );
98
-
99
- wp_enqueue_script(
100
- 'about-app',
101
- SBI_PLUGIN_URL.'admin/assets/js/about.js',
102
- null,
103
- SBIVER,
104
- true
105
- );
106
-
107
- $sbi_about = $this->page_data();
108
-
109
- wp_localize_script(
110
- 'about-app',
111
- 'sbi_about',
112
- $sbi_about
113
- );
114
- }
115
-
116
- /**
117
- * Page Data to use in front end
118
- *
119
- * @since 4.0
120
- *
121
- * @return array
122
- */
123
- public function page_data() {
124
- // get the WordPress's core list of installed plugins
125
- if ( ! function_exists( 'get_plugins' ) ) {
126
- require_once ABSPATH . 'wp-admin/includes/plugin.php';
127
- }
128
- $license_key = null;
129
- if ( get_option('sbi_license_key') ) {
130
- $license_key = get_option('sbi_license_key');
131
- }
132
-
133
- $installed_plugins = get_plugins();
134
-
135
- $images_url = SBI_PLUGIN_URL . 'admin/assets/img/about/';
136
-
137
- // check whether the pro or free plugins are installed
138
- $is_facebook_installed = false;
139
- $facebook_plugin = 'custom-facebook-feed/custom-facebook-feed.php';
140
- if ( isset( $installed_plugins['custom-facebook-feed-pro/custom-facebook-feed.php'] ) ) {
141
- $is_facebook_installed = true;
142
- $facebook_plugin = 'custom-facebook-feed-pro/custom-facebook-feed.php';
143
- } else if ( isset( $installed_plugins['custom-facebook-feed/custom-facebook-feed.php'] ) ) {
144
- $is_facebook_installed = true;
145
- }
146
-
147
- $is_instagram_installed = false;
148
- $instagram_plugin = 'instagram-feed/instagram-feed.php';
149
- if ( isset( $installed_plugins['instagram-feed-pro/instagram-feed.php'] ) ) {
150
- $is_instagram_installed = true;
151
- $instagram_plugin = 'instagram-feed-pro/instagram-feed.php';
152
- } else if ( isset( $installed_plugins['instagram-feed/instagram-feed.php'] ) ) {
153
- $is_instagram_installed = true;
154
- }
155
-
156
- $is_twitter_installed = false;
157
- $twitter_plugin = 'custom-twitter-feeds/custom-twitter-feed.php';
158
- if ( isset( $installed_plugins['custom-twitter-feeds-pro/custom-twitter-feed.php'] ) ) {
159
- $is_twitter_installed = true;
160
- $twitter_plugin = 'custom-twitter-feeds-pro/custom-twitter-feed.php';
161
- } else if ( isset( $installed_plugins['custom-twitter-feeds/custom-twitter-feed.php'] ) ) {
162
- $is_twitter_installed = true;
163
- }
164
-
165
- $is_youtube_installed = false;
166
- $youtube_plugin = 'feeds-for-youtube/youtube-feed.php';
167
- if ( isset( $installed_plugins['youtube-feed-pro/youtube-feed.php'] ) ) {
168
- $is_youtube_installed = true;
169
- $youtube_plugin = 'youtube-feed-pro/youtube-feed.php';
170
- } else if ( isset( $installed_plugins['feeds-for-youtube/youtube-feed.php'] ) ) {
171
- $is_youtube_installed = true;
172
- }
173
-
174
- $return = array(
175
- 'admin_url' => admin_url(),
176
- 'supportPageUrl' => admin_url( 'admin.php?page=sbi-support' ),
177
- 'ajax_handler' => admin_url( 'admin-ajax.php' ),
178
- 'links' => \InstagramFeed\Builder\SBI_Feed_Builder::get_links_with_utm(),
179
- 'nonce' => wp_create_nonce( 'sbi-admin' ),
180
- 'socialWallLinks' => \InstagramFeed\Builder\SBI_Feed_Builder::get_social_wall_links(),
181
- 'socialWallActivated' => is_plugin_active( 'social-wall/social-wall.php' ),
182
- 'genericText' => array(
183
- 'help' => __( 'Help', 'instagram-feed' ),
184
- 'title' => __( 'About Us', 'instagram-feed' ),
185
- 'title2' => __( 'Our Other Social Media Feed Plugins', 'instagram-feed' ),
186
- 'title3' => __( 'Plugins we recommend', 'instagram-feed' ),
187
- 'description2' => __( 'We’re more than just an Instagram plugin! Check out our other plugins and add more content to your site.', 'instagram-feed' ),
188
- ),
189
- 'aboutBox' => array(
190
- 'atSmashBalloon' => __( 'At Smash Balloon, we build software that helps you create beautiful responsive social media feeds for your website in minutes.', 'instagram-feed' ),
191
- 'weAreOn' => __( 'We\'re on a mission to make it super simple to add social media feeds in WordPress. No more complicated setup steps, ugly iframe widgets, or negative page speed scores.', 'instagram-feed' ),
192
- 'ourPlugins' => __( 'Our plugins aren\'t just easy to use, but completely customizable, reliable, and fast! Which is why over 1.6 million awesome users, just like you, choose to use them on their site.', 'instagram-feed' ),
193
- 'teamAvatar' => SBI_PLUGIN_URL . 'admin/assets/img/team-avatar.png',
194
- 'teamImgAlt' => __( 'Smash Balloon Team', 'instagram-feed' ),
195
- ),
196
- 'pluginsInfo' => array(
197
- 'instagram' => array(
198
- 'plugin' => $instagram_plugin,
199
- 'download_plugin' => 'https://downloads.wordpress.org/plugin/instagram-feed.zip',
200
- 'title' => __( 'Instagram Feed', 'instagram-feed' ),
201
- 'description' => __( 'A quick and elegant way to add your Instagram posts to your website. ', 'instagram-feed' ),
202
- 'icon' => SBI_PLUGIN_URL . 'admin/assets/img/insta-icon.svg',
203
- 'installed' => $is_instagram_installed,
204
- 'activated' => is_plugin_active( $instagram_plugin ),
205
- ),
206
- 'facebook' => array(
207
- 'plugin' => $facebook_plugin,
208
- 'title' => __( 'Custom Facebook Feed', 'instagram-feed' ),
209
- 'description' => __( 'Add Facebook posts from your timeline, albums and much more.', 'instagram-feed' ),
210
- 'icon' => SBI_PLUGIN_URL . 'admin/assets/img/fb-icon.svg',
211
- 'installed' => $is_facebook_installed,
212
- 'activated' => is_plugin_active( $facebook_plugin ),
213
- ),
214
- 'twitter' => array(
215
- 'plugin' => $twitter_plugin,
216
- 'download_plugin' => 'https://downloads.wordpress.org/plugin/custom-twitter-feeds.zip',
217
- 'title' => __( 'Custom Twitter Feeds', 'instagram-feed' ),
218
- 'description' => __( 'A customizable way to display tweets from your Twitter account. ', 'instagram-feed' ),
219
- 'icon' => SBI_PLUGIN_URL . 'admin/assets/img/twitter-icon.svg',
220
- 'installed' => $is_twitter_installed,
221
- 'activated' => is_plugin_active( $twitter_plugin ),
222
- ),
223
- 'youtube' => array(
224
- 'plugin' => $youtube_plugin,
225
- 'download_plugin' => 'https://downloads.wordpress.org/plugin/feeds-for-youtube.zip',
226
- 'title' => __( 'Feeds for YouTube', 'instagram-feed' ),
227
- 'description' => __( 'A simple yet powerful way to display videos from YouTube. ', 'instagram-feed' ),
228
- 'icon' => SBI_PLUGIN_URL . 'admin/assets/img/youtube-icon.svg',
229
- 'installed' => $is_youtube_installed,
230
- 'activated' => is_plugin_active( $youtube_plugin ),
231
- )
232
- ),
233
- 'social_wall' => array(
234
- 'plugin' => 'social-wall/social-wall.php',
235
- 'title' => __( 'Social Wall', 'instagram-feed' ),
236
- 'description' => __( 'Combine feeds from all of our plugins into a single wall', 'instagram-feed' ),
237
- 'graphic' => SBI_PLUGIN_URL . 'admin/assets/img/social-wall-graphic.png',
238
- 'permalink' => sprintf('https://smashballoon.com/social-wall/demo?license_key=%s&upgrade=true&utm_campaign=instagram-free&utm_source=about&utm_medium=social-wall', $license_key),
239
- 'installed' => isset( $installed_plugins['social-wall/social-wall.php'] ) ? true : false,
240
- 'activated' => is_plugin_active('social-wall/social-wall.php'),
241
- ),
242
- 'recommendedPlugins' => array(
243
- 'wpforms' => array(
244
- 'plugin' => 'wpforms-lite/wpforms.php',
245
- 'download_plugin' => 'https://downloads.wordpress.org/plugin/wpforms-lite.zip',
246
- 'title' => __( 'WPForms', 'instagram-feed' ),
247
- 'description' => __( 'The most beginner friendly drag & drop WordPress forms plugin allowing you to create beautiful contact forms, subscription forms, payment forms, and more in minutes, not hours!', 'instagram-feed' ),
248
- 'icon' => $images_url . 'plugin-wpforms.png',
249
- 'installed' => isset( $installed_plugins['wpforms-lite/wpforms.php'] ) ? true : false,
250
- 'activated' => is_plugin_active('wpforms-lite/wpforms.php'),
251
- ),
252
- 'monsterinsights' => array(
253
- 'plugin' => 'google-analytics-for-wordpress/googleanalytics.php',
254
- 'download_plugin' => 'https://downloads.wordpress.org/plugin/google-analytics-for-wordpress.zip',
255
- 'title' => __( 'MonsterInsights', 'instagram-feed' ),
256
- 'description' => __( 'MonsterInsights makes it “effortless” to properly connect your WordPress site with Google Analytics, so you can start making data-driven decisions to grow your business.', 'instagram-feed' ),
257
- 'icon' => $images_url . 'plugin-mi.png',
258
- 'installed' => isset( $installed_plugins['google-analytics-for-wordpress/googleanalytics.php'] ) ? true : false,
259
- 'activated' => is_plugin_active('google-analytics-for-wordpress/googleanalytics.php'),
260
- ),
261
- 'optinmonster' => array(
262
- 'plugin' => 'optinmonster/optin-monster-wp-api.php',
263
- 'download_plugin' => 'https://downloads.wordpress.org/plugin/optinmonster.zip',
264
- 'title' => __( 'OptinMonster', 'instagram-feed' ),
265
- 'description' => __( 'Our high-converting optin forms like Exit-Intent® popups, Fullscreen Welcome Mats, and Scroll boxes help you dramatically boost conversions and get more email subscribers.', 'instagram-feed' ),
266
- 'icon' => $images_url . 'plugin-om.png',
267
- 'installed' => isset( $installed_plugins['optinmonster/optin-monster-wp-api.php'] ) ? true : false,
268
- 'activated' => is_plugin_active('optinmonster/optin-monster-wp-api.php'),
269
- ),
270
- 'wp_mail_smtp' => array(
271
- 'plugin' => 'wp-mail-smtp/wp_mail_smtp.php',
272
- 'download_plugin' => 'https://downloads.wordpress.org/plugin/wp-mail-smtp.zip',
273
- 'title' => __( 'WP Mail SMTP', 'instagram-feed' ),
274
- 'description' => __( 'Make sure your website\'s emails reach the inbox. Our goal is to make email deliverability easy and reliable. Trusted by over 1 million websites.', 'instagram-feed' ),
275
- 'icon' => $images_url . 'plugin-smtp.png',
276
- 'installed' => isset( $installed_plugins['wp-mail-smtp/wp_mail_smtp.php'] ) ? true : false,
277
- 'activated' => is_plugin_active('wp-mail-smtp/wp_mail_smtp.php'),
278
- ),
279
- 'rafflepress' => array(
280
- 'plugin' => 'rafflepress/rafflepress.php',
281
- 'download_plugin' => 'https://downloads.wordpress.org/plugin/rafflepress.zip',
282
- 'title' => __( 'RafflePress', 'instagram-feed' ),
283
- 'description' => __( 'Turn your visitors into brand ambassadors! Easily grow your email list, website traffic, and social media followers with powerful viral giveaways & contests.', 'instagram-feed' ),
284
- 'icon' => $images_url . 'plugin-rp.png',
285
- 'installed' => isset( $installed_plugins['rafflepress/rafflepress.php'] ) ? true : false,
286
- 'activated' => is_plugin_active('rafflepress/rafflepress.php'),
287
- ),
288
- 'aioseo' => array(
289
- 'plugin' => 'all-in-one-seo-pack/all_in_one_seo_pack.php',
290
- 'download_plugin' => 'https://downloads.wordpress.org/plugin/all-in-one-seo-pack.zip',
291
- 'title' => __( 'All in One SEO Pack', 'instagram-feed' ),
292
- 'description' => __( 'Out-of-the-box SEO for WordPress. Features like XML Sitemaps, SEO for custom post types, SEO for blogs, business sites, or ecommerce sites, and much more.', 'instagram-feed' ),
293
- 'icon' => $images_url . 'plugin-seo.png',
294
- 'installed' => isset( $installed_plugins['all-in-one-seo-pack/all_in_one_seo_pack.php'] ) ? true : false,
295
- 'activated' => is_plugin_active('all-in-one-seo-pack/all_in_one_seo_pack.php'),
296
- )
297
- ),
298
- 'buttons' => array(
299
- 'add' => __( 'Add', 'instagram-feed' ),
300
- 'viewDemo' => __( 'View Demo', 'instagram-feed' ),
301
- 'install' => __( 'Install', 'instagram-feed' ),
302
- 'installed' => __( 'Installed', 'instagram-feed' ),
303
- 'activate' => __( 'Activate', 'instagram-feed' ),
304
- 'deactivate' => __( 'Deactivate', 'instagram-feed' ),
305
- 'open' => __( 'Open', 'instagram-feed' ),
306
- ),
307
- 'icons' => array(
308
- 'plusIcon' => '<svg width="13" height="12" viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.0832 6.83317H7.08317V11.8332H5.4165V6.83317H0.416504V5.1665H5.4165V0.166504H7.08317V5.1665H12.0832V6.83317Z" fill="white"/></svg>',
309
- 'loaderSVG' => '<svg version="1.1" id="loader-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="20px" height="20px" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve"><path fill="#fff" d="M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z"><animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="0.6s" repeatCount="indefinite"/></path></svg>',
310
- 'checkmarkSVG' => '<svg width="13" height="10" viewBox="0 0 13 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.13112 6.88917L11.4951 0.525204L12.9093 1.93942L5.13112 9.71759L0.888482 5.47495L2.3027 4.06074L5.13112 6.88917Z" fill="#8C8F9A"/></svg>',
311
- 'link' => '<svg width="10" height="11" viewBox="0 0 10 11" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.333374 9.22668L7.39338 2.16668H3.00004V0.833344H9.66671V7.50001H8.33338V3.10668L1.27337 10.1667L0.333374 9.22668Z" fill="#141B38"/></svg>'
312
- ),
313
- );
314
-
315
- return $return;
316
- }
317
-
318
- /**
319
- * About Us Page View Template
320
- *
321
- * @since 4.0
322
- */
323
- public function about_us(){
324
- return SBI_View::render( 'about.index' );
325
- }
326
- }
1
+ <?php
2
+
3
+ /**
4
+ * The About Page
5
+ *
6
+ * @since 4.0
7
+ */
8
+
9
+ namespace InstagramFeed\Admin;
10
+ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
11
+
12
+ use InstagramFeed\SBI_View;
13
+ use InstagramFeed\SBI_Response;
14
+
15
+ class SBI_About_Us {
16
+ /**
17
+ * Admin menu page slug.
18
+ *
19
+ * @since 4.0
20
+ *
21
+ * @var string
22
+ */
23
+ const SLUG = 'sbi-about-us';
24
+
25
+ /**
26
+ * Initializing the class
27
+ *
28
+ * @since 4.0
29
+ */
30
+ function __construct(){
31
+ $this->init();
32
+ }
33
+
34
+ /**
35
+ * Determining if the user is viewing the our page, if so, party on.
36
+ *
37
+ * @since 4.0
38
+ */
39
+ public function init() {
40
+ if ( ! is_admin() ) {
41
+ return;
42
+ }
43
+
44
+ add_action( 'admin_menu', [ $this, 'register_menu' ] );
45
+ }
46
+
47
+ /**
48
+ * Register Menu.
49
+ *
50
+ * @since 4.0
51
+ */
52
+ function register_menu() {
53
+ $cap = current_user_can( 'manage_instagram_feed_options' ) ? 'manage_instagram_feed_options' : 'manage_options';
54
+ $cap = apply_filters( 'sbi_settings_pages_capability', $cap );
55
+
56
+ $about_us = add_submenu_page(
57
+ 'sb-instagram-feed',
58
+ __( 'About Us', 'instagram-feed' ),
59
+ __( 'About Us', 'instagram-feed' ),
60
+ $cap,
61
+ self::SLUG,
62
+ [$this, 'about_us'],
63
+ 4
64
+ );
65
+ add_action( 'load-' . $about_us, [$this,'about_us_enqueue_assets']);
66
+ }
67
+
68
+ /**
69
+ * Enqueue About Us Page CSS & Script.
70
+ *
71
+ * Loads only for About Us page
72
+ *
73
+ * @since 4.0
74
+ */
75
+ public function about_us_enqueue_assets(){
76
+ if( ! get_current_screen() ) {
77
+ return;
78
+ }
79
+ $screen = get_current_screen();
80
+ if ( ! 'instagram-feed_page_sbi-about-us' === $screen->id ) {
81
+ return;
82
+ }
83
+
84
+ wp_enqueue_style(
85
+ 'about-style',
86
+ SBI_PLUGIN_URL . 'admin/assets/css/about.css',
87
+ false,
88
+ SBIVER
89
+ );
90
+
91
+ wp_enqueue_script(
92
+ 'vue-main',
93
+ 'https://cdn.jsdelivr.net/npm/vue@2.6.12',
94
+ null,
95
+ '2.6.12',
96
+ true
97
+ );
98
+
99
+ wp_enqueue_script(
100
+ 'about-app',
101
+ SBI_PLUGIN_URL.'admin/assets/js/about.js',
102
+ null,
103
+ SBIVER,
104
+ true
105
+ );
106
+
107
+ $sbi_about = $this->page_data();
108
+
109
+ wp_localize_script(
110
+ 'about-app',
111
+ 'sbi_about',
112
+ $sbi_about
113
+ );
114
+ }
115
+
116
+ /**
117
+ * Page Data to use in front end
118
+ *
119
+ * @since 4.0
120
+ *
121
+ * @return array
122
+ */
123
+ public function page_data() {
124
+ // get the WordPress's core list of installed plugins
125
+ if ( ! function_exists( 'get_plugins' ) ) {
126
+ require_once ABSPATH . 'wp-admin/includes/plugin.php';
127
+ }
128
+ $license_key = null;
129
+ if ( get_option('sbi_license_key') ) {
130
+ $license_key = get_option('sbi_license_key');
131
+ }
132
+
133
+ $installed_plugins = get_plugins();
134
+
135
+ $images_url = SBI_PLUGIN_URL . 'admin/assets/img/about/';
136
+
137
+ // check whether the pro or free plugins are installed
138
+ $is_facebook_installed = false;
139
+ $facebook_plugin = 'custom-facebook-feed/custom-facebook-feed.php';
140
+ if ( isset( $installed_plugins['custom-facebook-feed-pro/custom-facebook-feed.php'] ) ) {
141
+ $is_facebook_installed = true;
142
+ $facebook_plugin = 'custom-facebook-feed-pro/custom-facebook-feed.php';
143
+ } else if ( isset( $installed_plugins['custom-facebook-feed/custom-facebook-feed.php'] ) ) {
144
+ $is_facebook_installed = true;
145
+ }
146
+
147
+ $is_instagram_installed = false;
148
+ $instagram_plugin = 'instagram-feed/instagram-feed.php';
149
+ if ( isset( $installed_plugins['instagram-feed-pro/instagram-feed.php'] ) ) {
150
+ $is_instagram_installed = true;
151
+ $instagram_plugin = 'instagram-feed-pro/instagram-feed.php';
152
+ } else if ( isset( $installed_plugins['instagram-feed/instagram-feed.php'] ) ) {
153
+ $is_instagram_installed = true;
154
+ }
155
+
156
+ $is_twitter_installed = false;
157
+ $twitter_plugin = 'custom-twitter-feeds/custom-twitter-feed.php';
158
+ if ( isset( $installed_plugins['custom-twitter-feeds-pro/custom-twitter-feed.php'] ) ) {
159
+ $is_twitter_installed = true;
160
+ $twitter_plugin = 'custom-twitter-feeds-pro/custom-twitter-feed.php';
161
+ } else if ( isset( $installed_plugins['custom-twitter-feeds/custom-twitter-feed.php'] ) ) {
162
+ $is_twitter_installed = true;
163
+ }
164
+
165
+ $is_youtube_installed = false;
166
+ $youtube_plugin = 'feeds-for-youtube/youtube-feed.php';
167
+ if ( isset( $installed_plugins['youtube-feed-pro/youtube-feed.php'] ) ) {
168
+ $is_youtube_installed = true;
169
+ $youtube_plugin = 'youtube-feed-pro/youtube-feed.php';
170
+ } else if ( isset( $installed_plugins['feeds-for-youtube/youtube-feed.php'] ) ) {
171
+ $is_youtube_installed = true;
172
+ }
173
+
174
+ $return = array(
175
+ 'admin_url' => admin_url(),
176
+ 'supportPageUrl' => admin_url( 'admin.php?page=sbi-support' ),
177
+ 'ajax_handler' => admin_url( 'admin-ajax.php' ),
178
+ 'links' => \InstagramFeed\Builder\SBI_Feed_Builder::get_links_with_utm(),
179
+ 'nonce' => wp_create_nonce( 'sbi-admin' ),
180
+ 'socialWallLinks' => \InstagramFeed\Builder\SBI_Feed_Builder::get_social_wall_links(),
181
+ 'socialWallActivated' => is_plugin_active( 'social-wall/social-wall.php' ),
182
+ 'genericText' => array(
183
+ 'help' => __( 'Help', 'instagram-feed' ),
184
+ 'title' => __( 'About Us', 'instagram-feed' ),
185
+ 'title2' => __( 'Our Other Social Media Feed Plugins', 'instagram-feed' ),
186
+ 'title3' => __( 'Plugins we recommend', 'instagram-feed' ),
187
+ 'description2' => __( 'We’re more than just an Instagram plugin! Check out our other plugins and add more content to your site.', 'instagram-feed' ),
188
+ ),
189
+ 'aboutBox' => array(
190
+ 'atSmashBalloon' => __( 'At Smash Balloon, we build software that helps you create beautiful responsive social media feeds for your website in minutes.', 'instagram-feed' ),
191
+ 'weAreOn' => __( 'We\'re on a mission to make it super simple to add social media feeds in WordPress. No more complicated setup steps, ugly iframe widgets, or negative page speed scores.', 'instagram-feed' ),
192
+ 'ourPlugins' => __( 'Our plugins aren\'t just easy to use, but completely customizable, reliable, and fast! Which is why over 1.6 million awesome users, just like you, choose to use them on their site.', 'instagram-feed' ),
193
+ 'teamAvatar' => SBI_PLUGIN_URL . 'admin/assets/img/team-avatar.png',
194
+ 'teamImgAlt' => __( 'Smash Balloon Team', 'instagram-feed' ),
195
+ ),
196
+ 'pluginsInfo' => array(
197
+ 'instagram' => array(
198
+ 'plugin' => $instagram_plugin,
199
+ 'download_plugin' => 'https://downloads.wordpress.org/plugin/instagram-feed.zip',
200
+ 'title' => __( 'Instagram Feed', 'instagram-feed' ),
201
+ 'description' => __( 'A quick and elegant way to add your Instagram posts to your website. ', 'instagram-feed' ),
202
+ 'icon' => SBI_PLUGIN_URL . 'admin/assets/img/insta-icon.svg',
203
+ 'installed' => $is_instagram_installed,
204
+ 'activated' => is_plugin_active( $instagram_plugin ),
205
+ ),
206
+ 'facebook' => array(
207
+ 'plugin' => $facebook_plugin,
208
+ 'title' => __( 'Custom Facebook Feed', 'instagram-feed' ),
209
+ 'description' => __( 'Add Facebook posts from your timeline, albums and much more.', 'instagram-feed' ),
210
+ 'icon' => SBI_PLUGIN_URL . 'admin/assets/img/fb-icon.svg',
211
+ 'installed' => $is_facebook_installed,
212
+ 'activated' => is_plugin_active( $facebook_plugin ),
213
+ ),
214
+ 'twitter' => array(
215
+ 'plugin' => $twitter_plugin,
216
+ 'download_plugin' => 'https://downloads.wordpress.org/plugin/custom-twitter-feeds.zip',
217
+ 'title' => __( 'Custom Twitter Feeds', 'instagram-feed' ),
218
+ 'description' => __( 'A customizable way to display tweets from your Twitter account. ', 'instagram-feed' ),
219
+ 'icon' => SBI_PLUGIN_URL . 'admin/assets/img/twitter-icon.svg',
220
+ 'installed' => $is_twitter_installed,
221
+ 'activated' => is_plugin_active( $twitter_plugin ),
222
+ ),
223
+ 'youtube' => array(
224
+ 'plugin' => $youtube_plugin,
225
+ 'download_plugin' => 'https://downloads.wordpress.org/plugin/feeds-for-youtube.zip',
226
+ 'title' => __( 'Feeds for YouTube', 'instagram-feed' ),
227
+ 'description' => __( 'A simple yet powerful way to display videos from YouTube. ', 'instagram-feed' ),
228
+ 'icon' => SBI_PLUGIN_URL . 'admin/assets/img/youtube-icon.svg',
229
+ 'installed' => $is_youtube_installed,
230
+ 'activated' => is_plugin_active( $youtube_plugin ),
231
+ )
232
+ ),
233
+ 'social_wall' => array(
234
+ 'plugin' => 'social-wall/social-wall.php',
235
+ 'title' => __( 'Social Wall', 'instagram-feed' ),
236
+ 'description' => __( 'Combine feeds from all of our plugins into a single wall', 'instagram-feed' ),
237
+ 'graphic' => SBI_PLUGIN_URL . 'admin/assets/img/social-wall-graphic.png',
238
+ 'permalink' => sprintf('https://smashballoon.com/social-wall/demo?license_key=%s&upgrade=true&utm_campaign=instagram-free&utm_source=about&utm_medium=social-wall', $license_key),
239
+ 'installed' => isset( $installed_plugins['social-wall/social-wall.php'] ) ? true : false,
240
+ 'activated' => is_plugin_active('social-wall/social-wall.php'),
241
+ ),
242
+ 'recommendedPlugins' => array(
243
+ 'wpforms' => array(
244
+ 'plugin' => 'wpforms-lite/wpforms.php',
245
+ 'download_plugin' => 'https://downloads.wordpress.org/plugin/wpforms-lite.zip',
246
+ 'title' => __( 'WPForms', 'instagram-feed' ),
247
+ 'description' => __( 'The most beginner friendly drag & drop WordPress forms plugin allowing you to create beautiful contact forms, subscription forms, payment forms, and more in minutes, not hours!', 'instagram-feed' ),
248
+ 'icon' => $images_url . 'plugin-wpforms.png',
249
+ 'installed' => isset( $installed_plugins['wpforms-lite/wpforms.php'] ) ? true : false,
250
+ 'activated' => is_plugin_active('wpforms-lite/wpforms.php'),
251
+ ),
252
+ 'monsterinsights' => array(
253
+ 'plugin' => 'google-analytics-for-wordpress/googleanalytics.php',
254
+ 'download_plugin' => 'https://downloads.wordpress.org/plugin/google-analytics-for-wordpress.zip',
255
+ 'title' => __( 'MonsterInsights', 'instagram-feed' ),
256
+ 'description' => __( 'MonsterInsights makes it “effortless” to properly connect your WordPress site with Google Analytics, so you can start making data-driven decisions to grow your business.', 'instagram-feed' ),
257
+ 'icon' => $images_url . 'plugin-mi.png',
258
+ 'installed' => isset( $installed_plugins['google-analytics-for-wordpress/googleanalytics.php'] ) ? true : false,
259
+ 'activated' => is_plugin_active('google-analytics-for-wordpress/googleanalytics.php'),
260
+ ),
261
+ 'optinmonster' => array(
262
+ 'plugin' => 'optinmonster/optin-monster-wp-api.php',
263
+ 'download_plugin' => 'https://downloads.wordpress.org/plugin/optinmonster.zip',
264
+ 'title' => __( 'OptinMonster', 'instagram-feed' ),
265
+ 'description' => __( 'Our high-converting optin forms like Exit-Intent® popups, Fullscreen Welcome Mats, and Scroll boxes help you dramatically boost conversions and get more email subscribers.', 'instagram-feed' ),
266
+ 'icon' => $images_url . 'plugin-om.png',
267
+ 'installed' => isset( $installed_plugins['optinmonster/optin-monster-wp-api.php'] ) ? true : false,
268
+ 'activated' => is_plugin_active('optinmonster/optin-monster-wp-api.php'),
269
+ ),
270
+ 'wp_mail_smtp' => array(
271
+ 'plugin' => 'wp-mail-smtp/wp_mail_smtp.php',
272
+ 'download_plugin' => 'https://downloads.wordpress.org/plugin/wp-mail-smtp.zip',
273
+ 'title' => __( 'WP Mail SMTP', 'instagram-feed' ),
274
+ 'description' => __( 'Make sure your website\'s emails reach the inbox. Our goal is to make email deliverability easy and reliable. Trusted by over 1 million websites.', 'instagram-feed' ),
275
+ 'icon' => $images_url . 'plugin-smtp.png',
276
+ 'installed' => isset( $installed_plugins['wp-mail-smtp/wp_mail_smtp.php'] ) ? true : false,
277
+ 'activated' => is_plugin_active('wp-mail-smtp/wp_mail_smtp.php'),
278
+ ),
279
+ 'rafflepress' => array(
280
+ 'plugin' => 'rafflepress/rafflepress.php',
281
+ 'download_plugin' => 'https://downloads.wordpress.org/plugin/rafflepress.zip',
282
+ 'title' => __( 'RafflePress', 'instagram-feed' ),
283
+ 'description' => __( 'Turn your visitors into brand ambassadors! Easily grow your email list, website traffic, and social media followers with powerful viral giveaways & contests.', 'instagram-feed' ),
284
+ 'icon' => $images_url . 'plugin-rp.png',
285
+ 'installed' => isset( $installed_plugins['rafflepress/rafflepress.php'] ) ? true : false,
286
+ 'activated' => is_plugin_active('rafflepress/rafflepress.php'),
287
+ ),
288
+ 'aioseo' => array(
289
+ 'plugin' => 'all-in-one-seo-pack/all_in_one_seo_pack.php',
290
+ 'download_plugin' => 'https://downloads.wordpress.org/plugin/all-in-one-seo-pack.zip',
291
+ 'title' => __( 'All in One SEO Pack', 'instagram-feed' ),
292
+ 'description' => __( 'Out-of-the-box SEO for WordPress. Features like XML Sitemaps, SEO for custom post types, SEO for blogs, business sites, or ecommerce sites, and much more.', 'instagram-feed' ),
293
+ 'icon' => $images_url . 'plugin-seo.png',
294
+ 'installed' => isset( $installed_plugins['all-in-one-seo-pack/all_in_one_seo_pack.php'] ) ? true : false,
295
+ 'activated' => is_plugin_active('all-in-one-seo-pack/all_in_one_seo_pack.php'),
296
+ )
297
+ ),
298
+ 'buttons' => array(
299
+ 'add' => __( 'Add', 'instagram-feed' ),
300
+ 'viewDemo' => __( 'View Demo', 'instagram-feed' ),
301
+ 'install' => __( 'Install', 'instagram-feed' ),
302
+ 'installed' => __( 'Installed', 'instagram-feed' ),
303
+ 'activate' => __( 'Activate', 'instagram-feed' ),
304
+ 'deactivate' => __( 'Deactivate', 'instagram-feed' ),
305
+ 'open' => __( 'Open', 'instagram-feed' ),
306
+ ),
307
+ 'icons' => array(
308
+ 'plusIcon' => '<svg width="13" height="12" viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.0832 6.83317H7.08317V11.8332H5.4165V6.83317H0.416504V5.1665H5.4165V0.166504H7.08317V5.1665H12.0832V6.83317Z" fill="white"/></svg>',
309
+ 'loaderSVG' => '<svg version="1.1" id="loader-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="20px" height="20px" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve"><path fill="#fff" d="M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z"><animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="0.6s" repeatCount="indefinite"/></path></svg>',
310
+ 'checkmarkSVG' => '<svg width="13" height="10" viewBox="0 0 13 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.13112 6.88917L11.4951 0.525204L12.9093 1.93942L5.13112 9.71759L0.888482 5.47495L2.3027 4.06074L5.13112 6.88917Z" fill="#8C8F9A"/></svg>',
311
+ 'link' => '<svg width="10" height="11" viewBox="0 0 10 11" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.333374 9.22668L7.39338 2.16668H3.00004V0.833344H9.66671V7.50001H8.33338V3.10668L1.27337 10.1667L0.333374 9.22668Z" fill="#141B38"/></svg>'
312
+ ),
313
+ );
314
+
315
+ return $return;
316
+ }
317
+
318
+ /**
319
+ * About Us Page View Template
320
+ *
321
+ * @since 4.0
322
+ */
323
+ public function about_us(){
324
+ return SBI_View::render( 'about.index' );
325
+ }
326
+ }
admin/SBI_Admin_Notices.php CHANGED
@@ -1,292 +1,292 @@
1
- <?php
2
- /**
3
- * SBI Admin Notices.
4
- *
5
- * @since 6.0
6
- */
7
- namespace InstagramFeed\Admin;
8
- if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
9
-
10
- use InstagramFeed\SBI_Response;
11
- use InstagramFeed\SBI_HTTP_Request;
12
-
13
- class SBI_Admin_Notices
14
- {
15
-
16
- /**
17
- * CFF License Key
18
- */
19
- public $sbi_license;
20
-
21
- function __construct() {
22
- $this->init();
23
- }
24
-
25
- /**
26
- * Determining if the user is viewing the our page, if so, party on.
27
- *
28
- * @since 4.0
29
- */
30
- public function init() {
31
- if ( ! is_admin() ) {
32
- return;
33
- }
34
- add_action( 'in_admin_header', [ $this, 'remove_admin_notices' ] );
35
- add_action( 'wp_ajax_sbi_check_license', [ $this, 'sbi_check_license' ] );
36
-
37
- add_action( 'sbi_header_notices', array( $this, 'header_notices' ) );
38
- add_action( 'wp_ajax_sbi_dismiss_upgrade_notice', array( $this, 'dismiss_upgrade_notice' ) );
39
- }
40
-
41
- /**
42
- * Header Notices
43
- *
44
- * @since 6.0
45
- */
46
- public function header_notices() {
47
- $lite_notice_dismissed = get_transient( 'instagram_feed_dismiss_lite' );
48
- if ( $lite_notice_dismissed ) {
49
- return;
50
- }
51
-
52
- $output = '';
53
-
54
- $upgrade_url = 'https://smashballoon.com/instagram-feed/?utm_campaign=instagram-free&utm_source=lite-upgrade-bar';
55
- $output .= '<div id="sbi-notice-bar" class="sbi-header-notice">';
56
- $output .= sprintf(
57
- '<span class="sbi-notice-bar-message">%s <a href="%s" target="_blank" rel="noopener noreferrer">%s</a></span>',
58
- __('You\'re using Instagram Feed Lite. To unlock more features consider', 'instagram-feed'),
59
- $upgrade_url,
60
- __('upgrading to Pro', 'instagram-feed')
61
- );
62
-
63
- $output .= sprintf(
64
- '<button type="button" class="sbi-dismiss" id="sbi-dismiss-header-notice" title="%s" data-page="overview">%s</button>',
65
- __('Dismiss this message', 'instagram-feed'),
66
- '<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.8327 5.34175L14.6577 4.16675L9.99935 8.82508L5.34102 4.16675L4.16602 5.34175L8.82435 10.0001L4.16602 14.6584L5.34102 15.8334L9.99935 11.1751L14.6577 15.8334L15.8327 14.6584L11.1744 10.0001L15.8327 5.34175Z" fill="white"/></svg>'
67
- );
68
-
69
- $output .= '</div>';
70
-
71
- echo $output;
72
- }
73
-
74
- /**
75
- * Dismiss Upgrade Notice
76
- *
77
- * @since 6.0
78
- *
79
- * @return SBI_Response
80
- */
81
- public function dismiss_upgrade_notice() {
82
- // Run a security check.
83
- check_ajax_referer( 'sbi_nonce' , 'sbi_nonce');
84
-
85
- $cap = current_user_can( 'manage_instagram_feed_options' ) ? 'manage_instagram_feed_options' : 'manage_options';
86
- $cap = apply_filters( 'sbi_settings_pages_capability', $cap );
87
- if ( ! current_user_can( $cap ) ) {
88
- wp_send_json_error(); // This auto-dies.
89
- }
90
- // set the transient so it will hide for next 7 days
91
- set_transient( 'instagram_feed_dismiss_lite', 'dismiss', 1 * WEEK_IN_SECONDS );
92
-
93
- new SBI_Response( true, array() );
94
- }
95
-
96
- /**
97
- * Remove admin notices from inside our plugin screens so we can show our customized notices
98
- *
99
- * @since 4.0
100
- */
101
- public function remove_admin_notices() {
102
- $current_screen = get_current_screen();
103
- $not_allowed_screens = array(
104
- 'instagram-feed_page_sbi-feed-builder',
105
- 'instagram-feed_page_sbi-settings',
106
- 'instagram-feed_page_sbi-oembeds-manager',
107
- 'instagram-feed_page_sbi-extensions-manager',
108
- 'instagram-feed_page_sbi-about-us',
109
- 'instagram-feed_page_sbi-support',
110
- );
111
-
112
- if ( in_array( $current_screen->base, $not_allowed_screens ) ) {
113
- remove_all_actions('admin_notices');
114
- remove_all_actions('all_admin_notices');
115
- }
116
- }
117
-
118
- /**
119
- * CFF Get Renew License URL
120
- *
121
- * @since 4.0
122
- *
123
- * @return string $url
124
- */
125
- public function get_renew_url() {
126
- global $sbi_download_id;
127
-
128
- $license_key = get_option( 'sbi_license_key' ) ? get_option( 'sbi_license_key' ) : null;
129
-
130
- $url = sprintf(
131
- 'https://smashballoon.com/checkout/?edd_license_key=%s&download_id=%s&utm_campaign=instagram-free&utm_source=expired-notice&utm_medium=renew-license',
132
- $license_key,
133
- $sbi_download_id
134
- );
135
-
136
- return $url;
137
- }
138
-
139
- /**
140
- * CFF Check License
141
- *
142
- * @since 4.0
143
- *
144
- * @return SBI_Response
145
- */
146
- public function sbi_check_license() {
147
- // Run a security check.
148
- check_ajax_referer( 'sbi_nonce' , 'sbi_nonce');
149
-
150
- $cap = current_user_can( 'manage_instagram_feed_options' ) ? 'manage_instagram_feed_options' : 'manage_options';
151
- $cap = apply_filters( 'sbi_settings_pages_capability', $cap );
152
- if ( ! current_user_can( $cap ) ) {
153
- wp_send_json_error(); // This auto-dies.
154
- }
155
-
156
- $sbi_license = trim( get_option( 'sbi_license_key' ) );
157
-
158
- // Check the API
159
- $sbi_api_params = array(
160
- 'edd_action'=> 'check_license',
161
- 'license' => $sbi_license,
162
- 'item_name' => urlencode( SBI_PLUGIN_NAME ) // the name of our product in EDD
163
- );
164
- $sbi_response = wp_remote_get( add_query_arg( $sbi_api_params, SBI_STORE_URL ), array( 'timeout' => 60 ) );
165
- $sbi_license_data = (array) json_decode( wp_remote_retrieve_body( $sbi_response ) );
166
- // Update the updated license data
167
- update_option( 'sbi_license_data', $sbi_license_data );
168
-
169
- $sbi_todays_date = date('Y-m-d');
170
- // Check whether it's active
171
- if( $sbi_license_data['license'] !== 'expired' && ( strtotime( $sbi_license_data['expires'] ) > strtotime($sbi_todays_date) ) ) {
172
- // if the license is active then lets remove the ignore check for dashboard so next time it will show the expired notice in dashboard screen
173
- update_user_meta( get_current_user_id(), 'sbi_ignore_dashboard_license_notice', false );
174
-
175
- new SBI_Response( true, array(
176
- 'msg' => 'License Active',
177
- 'content' => $this->get_renewed_license_notice_content()
178
- ) );
179
- } else {
180
- $content = 'Your Instagram Feed Pro license key has expired';
181
- new SBI_Response( false, array(
182
- 'msg' => 'License Not Renewed',
183
- 'content' => $content
184
- ) );
185
- }
186
- }
187
-
188
- /**
189
- * Get content for successfully renewed license notice
190
- *
191
- * @since 4.0
192
- *
193
- * @return string $output
194
- */
195
- public function get_renewed_license_notice_content() {
196
- $output = '<span class="sb-notice-icon sb-error-icon">
197
- <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
198
- <path d="M12 2C6.5 2 2 6.5 2 12C2 17.5 6.5 22 12 22C17.5 22 22 17.5 22 12C22 6.5 17.5 2 12 2ZM10 17L5 12L6.41 10.59L10 14.17L17.59 6.58L19 8L10 17Z" fill="#59AB46"/>
199
- </svg>
200
- </span>
201
- <div class="sb-notice-body">
202
- <h3 class="sb-notice-title">Thanks! Your license key is valid.</h3>
203
- <p>You can safely dismiss this modal.</p>
204
- <div class="license-action-btns">
205
- <a target="_blank" class="sbi-license-btn sbi-btn-blue sbi-notice-btn" id="sbi-hide-notice">
206
- <svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
207
- <path d="M9.66659 1.27325L8.72659 0.333252L4.99992 4.05992L1.27325 0.333252L0.333252 1.27325L4.05992 4.99992L0.333252 8.72659L1.27325 9.66659L4.99992 5.93992L8.72659 9.66659L9.66659 8.72659L5.93992 4.99992L9.66659 1.27325Z" fill="white"/>
208
- </svg>
209
- Dismiss
210
- </a>
211
- </div>
212
- </div>';
213
-
214
- return $output;
215
- }
216
-
217
- /**
218
- * Get modal content that will trigger by "Why Renew" button
219
- *
220
- * @since 4.0
221
- *
222
- * @return string $output
223
- */
224
- public function get_modal_content() {
225
- $output = '<div class="sbi-sb-modal license-details-modal">
226
- <div class="sbi-modal-content">
227
- <button type="button" class="cancel-btn sbi-btn" id="sbi-sb-close-modal">
228
- <svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
229
- <path d="M14.2084 2.14275L12.8572 0.791504L7.50008 6.14859L2.143 0.791504L0.791748 2.14275L6.14883 7.49984L0.791748 12.8569L2.143 14.2082L7.50008 8.85109L12.8572 14.2082L14.2084 12.8569L8.85133 7.49984L14.2084 2.14275Z" fill="#141B38">
230
- </path>
231
- </svg>
232
- </button>
233
- <div class="sbi-sb-modal-body">
234
- <h2 class="sb-modal-title">Why Renew?</h2>
235
- <p class="sb-modal-description">See below for why it\'s so important to keep an active plugin license.</p>
236
- <div class="sb-why-renew-list-parent">
237
- <div class="sb-why-renew-list">
238
- <div class="sb-icon">
239
- <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
240
- <path d="M16 1.33325L4 6.66659V14.6666C4 22.0666 9.12 28.9866 16 30.6666C22.88 28.9866 28 22.0666 28 14.6666V6.66659L16 1.33325Z" fill="#59AB46"/>
241
- <path d="M10.3433 16.5525L14.1145 20.3237L21.657 12.7813" stroke="white" stroke-width="2.66667"/>
242
- </svg>
243
- </div>
244
- <div class="sb-list-item">
245
- <h4>Protected Against All Upcoming Instagram Platform Updates and API Changes</h4>
246
- <p>Don\'t worry about your Instagram feeds breaking due to constant changes in the Instagram platform. Stay protected with access to continual plugin updates, giving you peace of mind that the software will always be up to date.</p>
247
- </div>
248
- </div>
249
- <div class="sb-why-renew-list">
250
- <div class="sb-icon">
251
- <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
252
- <path d="M15.9998 2.66675C8.63984 2.66675 2.6665 8.64008 2.6665 16.0001C2.6665 23.3601 8.63984 29.3334 15.9998 29.3334C23.3598 29.3334 29.3332 23.3601 29.3332 16.0001C29.3332 8.64008 23.3598 2.66675 15.9998 2.66675ZM25.9465 12.1601L22.2398 13.6934C21.9059 12.7949 21.3814 11.9793 20.7025 11.3027C20.0235 10.626 19.2061 10.1043 18.3065 9.77341L19.8398 6.06675C22.6398 7.13341 24.8665 9.36008 25.9465 12.1601ZM15.9998 20.0001C13.7865 20.0001 11.9998 18.2134 11.9998 16.0001C11.9998 13.7867 13.7865 12.0001 15.9998 12.0001C18.2132 12.0001 19.9998 13.7867 19.9998 16.0001C19.9998 18.2134 18.2132 20.0001 15.9998 20.0001ZM12.1732 6.05341L13.7332 9.76008C12.8229 10.0918 11.9959 10.6179 11.3097 11.3018C10.6235 11.9857 10.0946 12.811 9.75984 13.7201L6.05317 12.1734C6.58782 10.7816 7.40887 9.51764 8.46313 8.46338C9.5174 7.40911 10.7814 6.58806 12.1732 6.05341ZM6.05317 19.8267L9.75984 18.2934C10.0923 19.2002 10.619 20.0233 11.303 20.705C11.9871 21.3868 12.812 21.9107 13.7198 22.2401L12.1598 25.9467C10.771 25.4097 9.51009 24.5876 8.45831 23.5335C7.40653 22.4795 6.58722 21.2167 6.05317 19.8267ZM19.8398 25.9467L18.3065 22.2401C19.2103 21.9052 20.0304 21.3775 20.7097 20.6936C21.3889 20.0098 21.9111 19.1862 22.2398 18.2801L25.9465 19.8401C25.4101 21.2272 24.5898 22.4869 23.5382 23.5385C22.4866 24.59 21.2269 25.4103 19.8398 25.9467Z" fill="#59AB46"/>
253
- </svg>
254
- </div>
255
- <div class="sb-list-item">
256
- <h4>Expert Technical Support</h4>
257
- <p>Without a valid license key you will no longer be able to receive updates or support for the Instagram Feed plugin. A renewed license key grants you access to our top-notch, quick and effective support for another full year.</p>
258
- </div>
259
- </div>
260
- <div class="sb-why-renew-list">
261
- <div class="sb-icon">
262
- <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
263
- <path fill-rule="evenodd" clip-rule="evenodd" d="M16 0C7.16343 0 0 7.16342 0 16C0 24.8365 7.16343 32 16 32C24.8366 32 32 24.8365 32 16C32 7.16342 24.8366 0 16 0ZM16 0.96C18.0308 0.96 20.0004 1.35753 21.8539 2.14152C22.7449 2.51837 23.6044 2.98488 24.4084 3.528C25.205 4.06617 25.9541 4.68427 26.6349 5.3651C27.3157 6.04593 27.9338 6.79507 28.472 7.59163C29.0152 8.39563 29.4816 9.25507 29.8585 10.146C30.6425 11.9996 31.04 13.9692 31.04 16C31.04 18.0308 30.6425 20.0003 29.8585 21.8539C29.4816 22.7449 29.0152 23.6043 28.472 24.4083C27.9338 25.2049 27.3157 25.954 26.6349 26.6349C25.9541 27.3157 25.205 27.9338 24.4084 28.472C23.6044 29.0151 22.7449 29.4816 21.8539 29.8584C20.0004 30.6425 18.0308 31.04 16 31.04C13.9692 31.04 11.9996 30.6425 10.1461 29.8584C9.25508 29.4816 8.39564 29.0151 7.59164 28.472C6.79508 27.9338 6.04594 27.3157 5.36511 26.6349C4.68428 25.954 4.06618 25.2049 3.528 24.4083C2.98488 23.6043 2.51837 22.7449 2.14152 21.8539C1.35754 20.0003 0.960001 18.0308 0.960001 16C0.960001 13.9692 1.35754 11.9996 2.14152 10.146C2.51837 9.25507 2.98488 8.39563 3.528 7.59163C4.06618 6.79507 4.68428 6.04593 5.36511 5.3651C6.04594 4.68427 6.79508 4.06617 7.59164 3.528C8.39564 2.98488 9.25508 2.51837 10.1461 2.14152C11.9996 1.35753 13.9692 0.96 16 0.96Z" fill="#0068A0"/>
264
- <path fill-rule="evenodd" clip-rule="evenodd" d="M27.7008 9.60322C27.7581 10.0278 27.7904 10.4834 27.7904 10.9742C27.7904 12.3266 27.537 13.8476 26.7762 15.7497L22.7039 27.5239C26.6679 25.2129 29.3337 20.9184 29.3337 15.9996C29.3337 13.6814 28.7413 11.5022 27.7008 9.60322ZM16.2346 17.1658L12.2335 28.7901C13.4284 29.1417 14.6917 29.3334 16.0004 29.3334C17.553 29.3334 19.0425 29.0654 20.4283 28.5774C20.3926 28.5204 20.3598 28.4598 20.3326 28.3937L16.2346 17.1658ZM25.0015 15.3271C25.0015 13.6788 24.4094 12.5379 23.9023 11.6501C23.2264 10.5513 22.5925 9.62166 22.5925 8.52289C22.5925 7.29745 23.5219 6.15659 24.8316 6.15659C24.8908 6.15659 24.9468 6.16369 25.0042 6.16734C22.632 3.9938 19.4715 2.66675 16.0004 2.66675C11.342 2.66675 7.24413 5.05691 4.85997 8.6762C5.17303 8.68614 5.46799 8.69238 5.71807 8.69238C7.11237 8.69238 9.27175 8.52289 9.27175 8.52289C9.99012 8.48079 10.075 9.53674 9.357 9.62166C9.357 9.62166 8.63445 9.70628 7.83113 9.74833L12.6863 24.1908L15.6046 15.4399L13.5274 9.74833C12.809 9.70628 12.129 9.62166 12.129 9.62166C11.4102 9.57922 11.4944 8.48079 12.2135 8.52289C12.2135 8.52289 14.415 8.69238 15.725 8.69238C17.1193 8.69238 19.279 8.52289 19.279 8.52289C19.9978 8.48079 20.0824 9.53674 19.364 9.62166C19.364 9.62166 18.6407 9.70628 17.8381 9.74833L22.6566 24.0807L24.0321 19.7223C24.6432 17.8175 25.0015 16.468 25.0015 15.3271ZM2.66699 15.9996C2.66699 21.2769 5.73372 25.838 10.1819 27.999L3.82154 10.5734C3.08171 12.2315 2.66699 14.0665 2.66699 15.9996Z" fill="#0068A0"/>
265
- </svg>
266
- </div>
267
- <div class="sb-list-item">
268
- <h4>WordPress Compatibility Updates</h4>
269
- <p>With WordPress updates being released continually, we make sure the plugin is always compatible with the latest version so you can update WordPress without needing to worry.</p>
270
- </div>
271
- </div>
272
- <div class="sb-why-renew-list">
273
- <div class="sb-icon">
274
- <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
275
- <path fill-rule="evenodd" clip-rule="evenodd" d="M15.1583 8.40195C12.8183 7.39434 10.3809 5.88954 8.10558 5.18909C8.91398 7.03648 9.59628 9.00467 10.3023 10.9501C8.89406 11.9642 7.2491 12.7514 5.67754 13.6091C7.0149 14.8758 8.9089 15.609 10.418 16.7112C9.20919 18.1404 6.83433 19.6258 6.25565 20.9211C8.758 20.6207 11.6739 20.1336 14.0021 20.0348C14.5137 22.4989 14.7776 25.2005 15.5052 27.4577C16.5887 24.4706 17.5684 21.384 18.8581 18.5945C20.8485 19.3834 23.2742 20.3453 25.2172 20.8103C23.8539 18.9776 22.6098 17.0307 21.4018 15.0493C23.1895 13.8079 24.9976 12.5862 26.7202 11.2824C24.2854 11.0675 21.7627 10.9367 19.205 10.8394C18.7985 8.31133 18.9053 5.29159 18.28 2.97334C17.3339 4.87343 16.2174 6.61017 15.1583 8.40195ZM16.3145 29.3411C15.993 30.6598 17.0524 31.2007 16.8926 32C15.8465 31.6546 15.0596 31.4771 13.6553 31.6676C13.6992 30.6387 14.6649 30.4932 14.4646 29.2303C-0.500692 27.5999 -0.530751 1.68764 14.349 0.0928438C32.9539 -1.90125 33.5377 28.8829 16.3145 29.3411Z" fill="#E34F0E"/>
276
- <path fill-rule="evenodd" clip-rule="evenodd" d="M18.2802 2.97314C18.9055 5.2914 18.7987 8.31114 19.2052 10.8391C21.7629 10.9365 24.2856 11.0672 26.7204 11.2823C24.9978 12.586 23.1896 13.8077 21.4019 15.0491C22.61 17.0305 23.8541 18.9774 25.2174 20.8101C23.2744 20.3451 20.8487 19.3832 18.8583 18.5943C17.5686 21.3838 16.5889 24.4704 15.5054 27.4575C14.7778 25.2003 14.5139 22.4987 14.0023 20.0346C11.6741 20.1334 8.7582 20.6205 6.25584 20.9209C6.83452 19.6256 9.20937 18.1402 10.4181 16.7109C8.90907 15.6088 7.01509 14.8756 5.67773 13.6089C7.24929 12.7512 8.89422 11.964 10.3025 10.9499C9.59646 9.00448 8.91419 7.03628 8.10578 5.18889C10.381 5.88935 12.8185 7.39414 15.1585 8.40176C16.2176 6.60997 17.3341 4.87324 18.2802 2.97314Z" fill="white"/>
277
- </svg>
278
- </div>
279
- <div class="sb-list-item">
280
- <h4>All Pro Instagram Feed Features</h4>
281
- <p>Photos & Albums, Videos (HD, 360, Live), Instagram Events, Popup Lightbox, Likes, Shares, & Reactions, Comments and Replies, Filter Posts, Post Layouts, Load More Posts, Multi-column Grid Layout, Background Caching, and more!</p>
282
- </div>
283
- </div>
284
- </div>
285
- </div>
286
- </div>
287
- </div>';
288
-
289
- return $output;
290
- }
291
-
292
- }
1
+ <?php
2
+ /**
3
+ * SBI Admin Notices.
4
+ *
5
+ * @since 6.0
6
+ */
7
+ namespace InstagramFeed\Admin;
8
+ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
9
+
10
+ use InstagramFeed\SBI_Response;
11
+ use InstagramFeed\SBI_HTTP_Request;
12
+
13
+ class SBI_Admin_Notices
14
+ {
15
+
16
+ /**
17
+ * CFF License Key
18
+ */
19
+ public $sbi_license;
20
+
21
+ function __construct() {
22
+ $this->init();
23
+ }
24
+
25
+ /**
26
+ * Determining if the user is viewing the our page, if so, party on.
27
+ *
28
+ * @since 4.0
29
+ */
30
+ public function init() {
31
+ if ( ! is_admin() ) {
32
+ return;
33
+ }
34
+ add_action( 'in_admin_header', [ $this, 'remove_admin_notices' ] );
35
+ add_action( 'wp_ajax_sbi_check_license', [ $this, 'sbi_check_license' ] );
36
+
37
+ add_action( 'sbi_header_notices', array( $this, 'header_notices' ) );
38
+ add_action( 'wp_ajax_sbi_dismiss_upgrade_notice', array( $this, 'dismiss_upgrade_notice' ) );
39
+ }
40
+
41
+ /**
42
+ * Header Notices
43
+ *
44
+ * @since 6.0
45
+ */
46
+ public function header_notices() {
47
+ $lite_notice_dismissed = get_transient( 'instagram_feed_dismiss_lite' );
48
+ if ( $lite_notice_dismissed ) {
49
+ return;
50
+ }
51
+
52
+ $output = '';
53
+
54
+ $upgrade_url = 'https://smashballoon.com/instagram-feed/?utm_campaign=instagram-free&utm_source=lite-upgrade-bar';
55
+ $output .= '<div id="sbi-notice-bar" class="sbi-header-notice">';
56
+ $output .= sprintf(
57
+ '<span class="sbi-notice-bar-message">%s <a href="%s" target="_blank" rel="noopener noreferrer">%s</a></span>',
58
+ __('You\'re using Instagram Feed Lite. To unlock more features consider', 'instagram-feed'),
59
+ $upgrade_url,
60
+ __('upgrading to Pro', 'instagram-feed')
61
+ );
62
+
63
+ $output .= sprintf(
64
+ '<button type="button" class="sbi-dismiss" id="sbi-dismiss-header-notice" title="%s" data-page="overview">%s</button>',
65
+ __('Dismiss this message', 'instagram-feed'),
66
+ '<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.8327 5.34175L14.6577 4.16675L9.99935 8.82508L5.34102 4.16675L4.16602 5.34175L8.82435 10.0001L4.16602 14.6584L5.34102 15.8334L9.99935 11.1751L14.6577 15.8334L15.8327 14.6584L11.1744 10.0001L15.8327 5.34175Z" fill="white"/></svg>'
67
+ );
68
+
69
+ $output .= '</div>';
70
+
71
+ echo $output;
72
+ }
73
+
74
+ /**
75
+ * Dismiss Upgrade Notice
76
+ *
77
+ * @since 6.0
78
+ *
79
+ * @return SBI_Response
80
+ */
81
+ public function dismiss_upgrade_notice() {
82
+ // Run a security check.
83
+ check_ajax_referer( 'sbi_nonce' , 'sbi_nonce');
84
+
85
+ $cap = current_user_can( 'manage_instagram_feed_options' ) ? 'manage_instagram_feed_options' : 'manage_options';
86
+ $cap = apply_filters( 'sbi_settings_pages_capability', $cap );
87
+ if ( ! current_user_can( $cap ) ) {
88
+ wp_send_json_error(); // This auto-dies.
89
+ }
90
+ // set the transient so it will hide for next 7 days
91
+ set_transient( 'instagram_feed_dismiss_lite', 'dismiss', 1 * WEEK_IN_SECONDS );
92
+
93
+ new SBI_Response( true, array() );
94
+ }
95
+
96
+ /**
97
+ * Remove admin notices from inside our plugin screens so we can show our customized notices
98
+ *
99
+ * @since 4.0
100
+ */
101
+ public function remove_admin_notices() {
102
+ $current_screen = get_current_screen();
103
+ $not_allowed_screens = array(
104
+ 'instagram-feed_page_sbi-feed-builder',
105
+ 'instagram-feed_page_sbi-settings',
106
+ 'instagram-feed_page_sbi-oembeds-manager',
107
+ 'instagram-feed_page_sbi-extensions-manager',
108
+ 'instagram-feed_page_sbi-about-us',
109
+ 'instagram-feed_page_sbi-support',
110
+ );
111
+
112
+ if ( in_array( $current_screen->base, $not_allowed_screens ) ) {
113
+ remove_all_actions('admin_notices');
114
+ remove_all_actions('all_admin_notices');
115
+ }
116
+ }
117
+
118
+ /**
119
+ * CFF Get Renew License URL
120
+ *
121
+ * @since 4.0
122
+ *
123
+ * @return string $url
124
+ */
125
+ public function get_renew_url() {
126
+ global $sbi_download_id;
127
+
128
+ $license_key = get_option( 'sbi_license_key' ) ? get_option( 'sbi_license_key' ) : null;
129
+
130
+ $url = sprintf(
131
+ 'https://smashballoon.com/checkout/?edd_license_key=%s&download_id=%s&utm_campaign=instagram-free&utm_source=expired-notice&utm_medium=renew-license',
132
+ $license_key,
133
+ $sbi_download_id
134
+ );
135
+
136
+ return $url;
137
+ }
138
+
139
+ /**
140
+ * CFF Check License
141
+ *
142
+ * @since 4.0
143
+ *
144
+ * @return SBI_Response
145
+ */
146
+ public function sbi_check_license() {
147
+ // Run a security check.
148
+ check_ajax_referer( 'sbi_nonce' , 'sbi_nonce');
149
+
150
+ $cap = current_user_can( 'manage_instagram_feed_options' ) ? 'manage_instagram_feed_options' : 'manage_options';
151
+ $cap = apply_filters( 'sbi_settings_pages_capability', $cap );
152
+ if ( ! current_user_can( $cap ) ) {
153
+ wp_send_json_error(); // This auto-dies.
154
+ }
155
+
156
+ $sbi_license = trim( get_option( 'sbi_license_key' ) );
157
+
158
+ // Check the API
159
+ $sbi_api_params = array(
160
+ 'edd_action'=> 'check_license',
161
+ 'license' => $sbi_license,
162
+ 'item_name' => urlencode( SBI_PLUGIN_NAME ) // the name of our product in EDD
163
+ );
164
+ $sbi_response = wp_remote_get( add_query_arg( $sbi_api_params, SBI_STORE_URL ), array( 'timeout' => 60 ) );
165
+ $sbi_license_data = (array) json_decode( wp_remote_retrieve_body( $sbi_response ) );
166
+ // Update the updated license data
167
+ update_option( 'sbi_license_data', $sbi_license_data );
168
+
169
+ $sbi_todays_date = date('Y-m-d');
170
+ // Check whether it's active
171
+ if( $sbi_license_data['license'] !== 'expired' && ( strtotime( $sbi_license_data['expires'] ) > strtotime($sbi_todays_date) ) ) {
172
+ // if the license is active then lets remove the ignore check for dashboard so next time it will show the expired notice in dashboard screen
173
+ update_user_meta( get_current_user_id(), 'sbi_ignore_dashboard_license_notice', false );
174
+
175
+ new SBI_Response( true, array(
176
+ 'msg' => 'License Active',
177
+ 'content' => $this->get_renewed_license_notice_content()
178
+ ) );
179
+ } else {
180
+ $content = 'Your Instagram Feed Pro license key has expired';
181
+ new SBI_Response( false, array(
182
+ 'msg' => 'License Not Renewed',
183
+ 'content' => $content
184
+ ) );
185
+ }
186
+ }
187
+
188
+ /**
189
+ * Get content for successfully renewed license notice
190
+ *
191
+ * @since 4.0
192
+ *
193
+ * @return string $output
194
+ */
195
+ public function get_renewed_license_notice_content() {
196
+ $output = '<span class="sb-notice-icon sb-error-icon">
197
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
198
+ <path d="M12 2C6.5 2 2 6.5 2 12C2 17.5 6.5 22 12 22C17.5 22 22 17.5 22 12C22 6.5 17.5 2 12 2ZM10 17L5 12L6.41 10.59L10 14.17L17.59 6.58L19 8L10 17Z" fill="#59AB46"/>
199
+ </svg>
200
+ </span>
201
+ <div class="sb-notice-body">
202
+ <h3 class="sb-notice-title">Thanks! Your license key is valid.</h3>
203
+ <p>You can safely dismiss this modal.</p>
204
+ <div class="license-action-btns">
205
+ <a target="_blank" class="sbi-license-btn sbi-btn-blue sbi-notice-btn" id="sbi-hide-notice">
206
+ <svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
207
+ <path d="M9.66659 1.27325L8.72659 0.333252L4.99992 4.05992L1.27325 0.333252L0.333252 1.27325L4.05992 4.99992L0.333252 8.72659L1.27325 9.66659L4.99992 5.93992L8.72659 9.66659L9.66659 8.72659L5.93992 4.99992L9.66659 1.27325Z" fill="white"/>
208
+ </svg>
209
+ Dismiss
210
+ </a>
211
+ </div>
212
+ </div>';
213
+
214
+ return $output;
215
+ }
216
+
217
+ /**
218
+ * Get modal content that will trigger by "Why Renew" button
219
+ *
220
+ * @since 4.0
221
+ *
222
+ * @return string $output
223
+ */
224
+ public function get_modal_content() {
225
+ $output = '<div class="sbi-sb-modal license-details-modal">
226
+ <div class="sbi-modal-content">
227
+ <button type="button" class="cancel-btn sbi-btn" id="sbi-sb-close-modal">
228
+ <svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
229
+ <path d="M14.2084 2.14275L12.8572 0.791504L7.50008 6.14859L2.143 0.791504L0.791748 2.14275L6.14883 7.49984L0.791748 12.8569L2.143 14.2082L7.50008 8.85109L12.8572 14.2082L14.2084 12.8569L8.85133 7.49984L14.2084 2.14275Z" fill="#141B38">
230
+ </path>
231
+ </svg>
232
+ </button>
233
+ <div class="sbi-sb-modal-body">
234
+ <h2 class="sb-modal-title">Why Renew?</h2>
235
+ <p class="sb-modal-description">See below for why it\'s so important to keep an active plugin license.</p>
236
+ <div class="sb-why-renew-list-parent">
237
+ <div class="sb-why-renew-list">
238
+ <div class="sb-icon">
239
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
240
+ <path d="M16 1.33325L4 6.66659V14.6666C4 22.0666 9.12 28.9866 16 30.6666C22.88 28.9866 28 22.0666 28 14.6666V6.66659L16 1.33325Z" fill="#59AB46"/>
241
+ <path d="M10.3433 16.5525L14.1145 20.3237L21.657 12.7813" stroke="white" stroke-width="2.66667"/>
242
+ </svg>
243
+ </div>
244
+ <div class="sb-list-item">
245
+ <h4>Protected Against All Upcoming Instagram Platform Updates and API Changes</h4>
246
+ <p>Don\'t worry about your Instagram feeds breaking due to constant changes in the Instagram platform. Stay protected with access to continual plugin updates, giving you peace of mind that the software will always be up to date.</p>
247
+ </div>
248
+ </div>
249
+ <div class="sb-why-renew-list">
250
+ <div class="sb-icon">
251
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
252
+ <path d="M15.9998 2.66675C8.63984 2.66675 2.6665 8.64008 2.6665 16.0001C2.6665 23.3601 8.63984 29.3334 15.9998 29.3334C23.3598 29.3334 29.3332 23.3601 29.3332 16.0001C29.3332 8.64008 23.3598 2.66675 15.9998 2.66675ZM25.9465 12.1601L22.2398 13.6934C21.9059 12.7949 21.3814 11.9793 20.7025 11.3027C20.0235 10.626 19.2061 10.1043 18.3065 9.77341L19.8398 6.06675C22.6398 7.13341 24.8665 9.36008 25.9465 12.1601ZM15.9998 20.0001C13.7865 20.0001 11.9998 18.2134 11.9998 16.0001C11.9998 13.7867 13.7865 12.0001 15.9998 12.0001C18.2132 12.0001 19.9998 13.7867 19.9998 16.0001C19.9998 18.2134 18.2132 20.0001 15.9998 20.0001ZM12.1732 6.05341L13.7332 9.76008C12.8229 10.0918 11.9959 10.6179 11.3097 11.3018C10.6235 11.9857 10.0946 12.811 9.75984 13.7201L6.05317 12.1734C6.58782 10.7816 7.40887 9.51764 8.46313 8.46338C9.5174 7.40911 10.7814 6.58806 12.1732 6.05341ZM6.05317 19.8267L9.75984 18.2934C10.0923 19.2002 10.619 20.0233 11.303 20.705C11.9871 21.3868 12.812 21.9107 13.7198 22.2401L12.1598 25.9467C10.771 25.4097 9.51009 24.5876 8.45831 23.5335C7.40653 22.4795 6.58722 21.2167 6.05317 19.8267ZM19.8398 25.9467L18.3065 22.2401C19.2103 21.9052 20.0304 21.3775 20.7097 20.6936C21.3889 20.0098 21.9111 19.1862 22.2398 18.2801L25.9465 19.8401C25.4101 21.2272 24.5898 22.4869 23.5382 23.5385C22.4866 24.59 21.2269 25.4103 19.8398 25.9467Z" fill="#59AB46"/>
253
+ </svg>
254
+ </div>
255
+ <div class="sb-list-item">
256
+ <h4>Expert Technical Support</h4>
257
+ <p>Without a valid license key you will no longer be able to receive updates or support for the Instagram Feed plugin. A renewed license key grants you access to our top-notch, quick and effective support for another full year.</p>
258
+ </div>
259
+ </div>
260
+ <div class="sb-why-renew-list">
261
+ <div class="sb-icon">
262
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
263
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M16 0C7.16343 0 0 7.16342 0 16C0 24.8365 7.16343 32 16 32C24.8366 32 32 24.8365 32 16C32 7.16342 24.8366 0 16 0ZM16 0.96C18.0308 0.96 20.0004 1.35753 21.8539 2.14152C22.7449 2.51837 23.6044 2.98488 24.4084 3.528C25.205 4.06617 25.9541 4.68427 26.6349 5.3651C27.3157 6.04593 27.9338 6.79507 28.472 7.59163C29.0152 8.39563 29.4816 9.25507 29.8585 10.146C30.6425 11.9996 31.04 13.9692 31.04 16C31.04 18.0308 30.6425 20.0003 29.8585 21.8539C29.4816 22.7449 29.0152 23.6043 28.472 24.4083C27.9338 25.2049 27.3157 25.954 26.6349 26.6349C25.9541 27.3157 25.205 27.9338 24.4084 28.472C23.6044 29.0151 22.7449 29.4816 21.8539 29.8584C20.0004 30.6425 18.0308 31.04 16 31.04C13.9692 31.04 11.9996 30.6425 10.1461 29.8584C9.25508 29.4816 8.39564 29.0151 7.59164 28.472C6.79508 27.9338 6.04594 27.3157 5.36511 26.6349C4.68428 25.954 4.06618 25.2049 3.528 24.4083C2.98488 23.6043 2.51837 22.7449 2.14152 21.8539C1.35754 20.0003 0.960001 18.0308 0.960001 16C0.960001 13.9692 1.35754 11.9996 2.14152 10.146C2.51837 9.25507 2.98488 8.39563 3.528 7.59163C4.06618 6.79507 4.68428 6.04593 5.36511 5.3651C6.04594 4.68427 6.79508 4.06617 7.59164 3.528C8.39564 2.98488 9.25508 2.51837 10.1461 2.14152C11.9996 1.35753 13.9692 0.96 16 0.96Z" fill="#0068A0"/>
264
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M27.7008 9.60322C27.7581 10.0278 27.7904 10.4834 27.7904 10.9742C27.7904 12.3266 27.537 13.8476 26.7762 15.7497L22.7039 27.5239C26.6679 25.2129 29.3337 20.9184 29.3337 15.9996C29.3337 13.6814 28.7413 11.5022 27.7008 9.60322ZM16.2346 17.1658L12.2335 28.7901C13.4284 29.1417 14.6917 29.3334 16.0004 29.3334C17.553 29.3334 19.0425 29.0654 20.4283 28.5774C20.3926 28.5204 20.3598 28.4598 20.3326 28.3937L16.2346 17.1658ZM25.0015 15.3271C25.0015 13.6788 24.4094 12.5379 23.9023 11.6501C23.2264 10.5513 22.5925 9.62166 22.5925 8.52289C22.5925 7.29745 23.5219 6.15659 24.8316 6.15659C24.8908 6.15659 24.9468 6.16369 25.0042 6.16734C22.632 3.9938 19.4715 2.66675 16.0004 2.66675C11.342 2.66675 7.24413 5.05691 4.85997 8.6762C5.17303 8.68614 5.46799 8.69238 5.71807 8.69238C7.11237 8.69238 9.27175 8.52289 9.27175 8.52289C9.99012 8.48079 10.075 9.53674 9.357 9.62166C9.357 9.62166 8.63445 9.70628 7.83113 9.74833L12.6863 24.1908L15.6046 15.4399L13.5274 9.74833C12.809 9.70628 12.129 9.62166 12.129 9.62166C11.4102 9.57922 11.4944 8.48079 12.2135 8.52289C12.2135 8.52289 14.415 8.69238 15.725 8.69238C17.1193 8.69238 19.279 8.52289 19.279 8.52289C19.9978 8.48079 20.0824 9.53674 19.364 9.62166C19.364 9.62166 18.6407 9.70628 17.8381 9.74833L22.6566 24.0807L24.0321 19.7223C24.6432 17.8175 25.0015 16.468 25.0015 15.3271ZM2.66699 15.9996C2.66699 21.2769 5.73372 25.838 10.1819 27.999L3.82154 10.5734C3.08171 12.2315 2.66699 14.0665 2.66699 15.9996Z" fill="#0068A0"/>
265
+ </svg>
266
+ </div>
267
+ <div class="sb-list-item">
268
+ <h4>WordPress Compatibility Updates</h4>
269
+ <p>With WordPress updates being released continually, we make sure the plugin is always compatible with the latest version so you can update WordPress without needing to worry.</p>
270
+ </div>
271
+ </div>
272
+ <div class="sb-why-renew-list">
273
+ <div class="sb-icon">
274
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
275
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M15.1583 8.40195C12.8183 7.39434 10.3809 5.88954 8.10558 5.18909C8.91398 7.03648 9.59628 9.00467 10.3023 10.9501C8.89406 11.9642 7.2491 12.7514 5.67754 13.6091C7.0149 14.8758 8.9089 15.609 10.418 16.7112C9.20919 18.1404 6.83433 19.6258 6.25565 20.9211C8.758 20.6207 11.6739 20.1336 14.0021 20.0348C14.5137 22.4989 14.7776 25.2005 15.5052 27.4577C16.5887 24.4706 17.5684 21.384 18.8581 18.5945C20.8485 19.3834 23.2742 20.3453 25.2172 20.8103C23.8539 18.9776 22.6098 17.0307 21.4018 15.0493C23.1895 13.8079 24.9976 12.5862 26.7202 11.2824C24.2854 11.0675 21.7627 10.9367 19.205 10.8394C18.7985 8.31133 18.9053 5.29159 18.28 2.97334C17.3339 4.87343 16.2174 6.61017 15.1583 8.40195ZM16.3145 29.3411C15.993 30.6598 17.0524 31.2007 16.8926 32C15.8465 31.6546 15.0596 31.4771 13.6553 31.6676C13.6992 30.6387 14.6649 30.4932 14.4646 29.2303C-0.500692 27.5999 -0.530751 1.68764 14.349 0.0928438C32.9539 -1.90125 33.5377 28.8829 16.3145 29.3411Z" fill="#E34F0E"/>
276
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M18.2802 2.97314C18.9055 5.2914 18.7987 8.31114 19.2052 10.8391C21.7629 10.9365 24.2856 11.0672 26.7204 11.2823C24.9978 12.586 23.1896 13.8077 21.4019 15.0491C22.61 17.0305 23.8541 18.9774 25.2174 20.8101C23.2744 20.3451 20.8487 19.3832 18.8583 18.5943C17.5686 21.3838 16.5889 24.4704 15.5054 27.4575C14.7778 25.2003 14.5139 22.4987 14.0023 20.0346C11.6741 20.1334 8.7582 20.6205 6.25584 20.9209C6.83452 19.6256 9.20937 18.1402 10.4181 16.7109C8.90907 15.6088 7.01509 14.8756 5.67773 13.6089C7.24929 12.7512 8.89422 11.964 10.3025 10.9499C9.59646 9.00448 8.91419 7.03628 8.10578 5.18889C10.381 5.88935 12.8185 7.39414 15.1585 8.40176C16.2176 6.60997 17.3341 4.87324 18.2802 2.97314Z" fill="white"/>
277
+ </svg>
278
+ </div>
279
+ <div class="sb-list-item">
280
+ <h4>All Pro Instagram Feed Features</h4>
281
+ <p>Photos & Albums, Videos (HD, 360, Live), Instagram Events, Popup Lightbox, Likes, Shares, & Reactions, Comments and Replies, Filter Posts, Post Layouts, Load More Posts, Multi-column Grid Layout, Background Caching, and more!</p>
282
+ </div>
283
+ </div>
284
+ </div>
285
+ </div>
286
+ </div>
287
+ </div>';
288
+
289
+ return $output;
290
+ }
291
+
292
+ }
admin/SBI_Global_Settings.php CHANGED
@@ -1,1208 +1,1208 @@
1
- <?php
2
-
3
- /**
4
- * The Settings Page
5
- *
6
- * @since 6.0
7
- */
8
-
9
- namespace InstagramFeed\Admin;
10
- if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
11
- use InstagramFeed\SBI_Response;
12
-
13
- class SBI_Global_Settings {
14
- //use SBI_Settings;
15
- /**
16
- * Admin menu page slug.
17
- *
18
- * @since 6.0
19
- *
20
- * @var string
21
- */
22
- const SLUG = 'sbi-settings';
23
-
24
- /**
25
- * Initializing the class
26
- *
27
- * @since 6.0
28
- */
29
- function __construct(){
30
- $this->init();
31
- }
32
-
33
- /**
34
- * Determining if the user is viewing the our page, if so, party on.
35
- *
36
- * @since 6.0
37
- */
38
- public function init() {
39
- if ( ! is_admin() ) {
40
- return;
41
- }
42
-
43
- add_action('admin_menu', [$this, 'register_menu']);
44
- add_filter( 'admin_footer_text', [$this, 'remove_admin_footer_text'] );
45
-
46
- add_action( 'wp_ajax_sbi_save_settings', [$this, 'sbi_save_settings'] );
47
- add_action( 'wp_ajax_sbi_activate_license', [$this, 'sbi_activate_license'] );
48
- add_action( 'wp_ajax_sbi_deactivate_license', [$this, 'sbi_deactivate_license'] );
49
- add_action( 'wp_ajax_sbi_test_connection', [$this, 'sbi_test_connection'] );
50
- add_action( 'wp_ajax_sbi_recheck_connection', [$this, 'sbi_recheck_connection'] );
51
- add_action( 'wp_ajax_sbi_import_settings_json', [$this, 'sbi_import_settings_json'] );
52
- add_action( 'wp_ajax_sbi_export_settings_json', [$this, 'sbi_export_settings_json'] );
53
- add_action( 'wp_ajax_sbi_clear_cache', [$this, 'sbi_clear_cache'] );
54
- add_action( 'wp_ajax_sbi_clear_image_resize_cache', [$this, 'sbi_clear_image_resize_cache'] );
55
- add_action( 'wp_ajax_sbi_clear_error_log', [$this, 'sbi_clear_error_log'] );
56
- add_action( 'wp_ajax_sbi_dpa_reset', [$this, 'sbi_dpa_reset'] );
57
- }
58
-
59
- /**
60
- * SBI Save Settings
61
- *
62
- * This will save the data fron the settings page
63
- *
64
- * @since 6.0
65
- *
66
- * @return SBI_Response
67
- */
68
- public function sbi_save_settings() {
69
- check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
70
-
71
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
72
- wp_send_json_error();
73
- }
74
- $data = $_POST;
75
- $model = isset( $data[ 'model' ] ) ? $data['model'] : null;
76
-
77
- // return if the model is null
78
- if ( null === $model ) {
79
- return;
80
- }
81
-
82
- // get the sbi license key and extensions license key
83
- $sbi_license_key = sanitize_text_field( $_POST['sbi_license_key'] );
84
-
85
- // Only update the sbi_license_key value when it's inactive
86
- if ( get_option( 'sbi_license_status') == 'inactive' ) {
87
- if ( empty( $sbi_license_key ) || strlen( $sbi_license_key ) < 1 ) {
88
- delete_option( 'sbi_license_key' );
89
- delete_option( 'sbi_license_data' );
90
- delete_option( 'sbi_license_status' );
91
- } else {
92
- update_option( 'sbi_license_key', $sbi_license_key );
93
- }
94
- } else {
95
- $license_key = trim( get_option( 'sbi_license_key' ) );
96
-
97
- if ( empty( $sbi_license_key ) && ! empty( $license_key ) ) {
98
- $sbi_license_data = $this->get_license_data( $license_key, 'deactivate_license', SBI_PLUGIN_NAME );
99
-
100
- delete_option( 'sbi_license_key' );
101
- delete_option( 'sbi_license_data' );
102
- delete_option( 'sbi_license_status' );
103
- }
104
- }
105
-
106
- $model = (array) \json_decode( \stripslashes( $model ) );
107
-
108
- $general = (array) $model['general'];
109
- $feeds = (array) $model['feeds'];
110
- $advanced = (array) $model['advanced'];
111
-
112
- // Get the values and sanitize
113
- $sbi_settings = get_option( 'sb_instagram_settings', array() );
114
-
115
- /**
116
- * General Tab
117
- */
118
- $sbi_settings['sb_instagram_preserve_settings'] = $general['preserveSettings'];
119
-
120
- /**
121
- * Feeds Tab
122
- */
123
- $sbi_settings['sb_instagram_custom_css'] = $feeds['customCSS'];
124
- $sbi_settings['sb_instagram_custom_js'] = $feeds['customJS'];
125
- $sbi_settings['gdpr'] = sanitize_text_field( $feeds['gdpr'] );
126
- $sbi_settings['sbi_cache_cron_interval'] = sanitize_text_field( $feeds['cronInterval'] );
127
- $sbi_settings['sbi_cache_cron_time'] = sanitize_text_field( $feeds['cronTime'] );
128
- $sbi_settings['sbi_cache_cron_am_pm'] = sanitize_text_field( $feeds['cronAmPm'] );
129
-
130
- /**
131
- * Advanced Tab
132
- */
133
- $sbi_settings['sb_instagram_ajax_theme'] = sanitize_text_field( $advanced['sbi_ajax'] );
134
- $sbi_settings['sb_instagram_disable_resize'] = !(bool)$advanced['sbi_enable_resize'];
135
- $sbi_settings['sb_ajax_initial'] = (bool)$advanced['sb_ajax_initial'];
136
- $sbi_settings['enqueue_js_in_head'] = (bool)$advanced['sbi_enqueue_js_in_head'];
137
- $sbi_settings['enqueue_css_in_shortcode'] = (bool)$advanced['sbi_enqueue_css_in_shortcode'];
138
- $sbi_settings['disable_js_image_loading'] = !(bool)$advanced['sbi_enable_js_image_loading'];
139
- $sbi_settings['disable_admin_notice'] = !(bool)$advanced['enable_admin_notice'];
140
- $sbi_settings['enable_email_report'] = (bool)$advanced['enable_email_report'];
141
-
142
- $sbi_settings['email_notification'] = sanitize_text_field( $advanced['email_notification'] );
143
- $sbi_settings['email_notification_addresses'] = sanitize_text_field( $advanced['email_notification_addresses'] );
144
-
145
- $usage_tracking = get_option( 'sbi_usage_tracking', array( 'last_send' => 0, 'enabled' => sbi_is_pro_version() ) );
146
- if ( isset( $advanced['email_notification_addresses'] ) ) {
147
- $usage_tracking['enabled'] = false;
148
- if ( isset( $advanced['usage_tracking'] ) ) {
149
- if ( ! is_array( $usage_tracking ) ) {
150
- $usage_tracking = array(
151
- 'enabled' => $advanced['usage_tracking'],
152
- 'last_send' => 0,
153
- );
154
- } else {
155
- $usage_tracking['enabled'] = $advanced['usage_tracking'];
156
- }
157
- }
158
- update_option( 'sbi_usage_tracking', $usage_tracking, false );
159
- }
160
-
161
- // Update the sbi_style_settings option that contains data for translation and advanced tabs
162
- update_option( 'sb_instagram_settings', $sbi_settings );
163
-
164
- // clear cron caches
165
- $this->sbi_clear_cache();
166
-
167
- new SBI_Response( true, array(
168
- 'cronNextCheck' => $this->get_cron_next_check()
169
- ) );
170
- }
171
-
172
- /**
173
- * SBI Activate License Key
174
- *
175
- * @since 6.0
176
- *
177
- * @return SBI_Response
178
- */
179
- public function sbi_activate_license() {
180
- check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
181
-
182
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
183
- wp_send_json_error();
184
- }
185
- // do the form validation to check if license_key is not empty
186
- if ( empty( $_POST[ 'license_key' ] ) ) {
187
- new \InstagramFeed\SBI_Response( false, array(
188
- 'message' => __( 'License key required!', 'instagram-feed' ),
189
- ) );
190
- }
191
- $license_key = sanitize_key( $_POST[ 'license_key' ] );
192
- // make the remote api call and get license data
193
- $sbi_license_data = $this->get_license_data( $license_key, 'activate_license', SBI_PLUGIN_NAME );
194
-
195
- // update the license data
196
- if( !empty( $sbi_license_data ) ) {
197
- update_option( 'sbi_license_data', $sbi_license_data );
198
- }
199
- // update the licnese key only when the license status is activated
200
- update_option( 'sbi_license_key', $license_key );
201
- // update the license status
202
- update_option( 'sbi_license_status', $sbi_license_data['license'] );
203
-
204
- // Check if there is any error in the license key then handle it
205
- $sbi_license_data = $this->get_license_error_message( $sbi_license_data );
206
-
207
- // Send ajax response back to client end
208
- $data = array(
209
- 'licenseStatus' => $sbi_license_data['license'],
210
- 'licenseData' => $sbi_license_data
211
- );
212
- new SBI_Response( true, $data );
213
- }
214
-
215
- /**
216
- * SBI Deactivate License Key
217
- *
218
- * @since 6.0
219
- *
220
- * @return SBI_Response
221
- */
222
- public function sbi_deactivate_license() {
223
- check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
224
-
225
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
226
- wp_send_json_error();
227
- }
228
- $license_key = trim( get_option( 'sbi_license_key' ) );
229
- $sbi_license_data = $this->get_license_data( $license_key, 'deactivate_license', SBI_PLUGIN_NAME );
230
- // update the license data
231
- if( !empty( $sbi_license_data ) ) {
232
- update_option( 'sbi_license_data', $sbi_license_data );
233
- }
234
- if ( ! $sbi_license_data['success'] ) {
235
- new SBI_Response( false, array() );
236
- }
237
- // remove the license keys and update license key status
238
- if( $sbi_license_data['license'] == 'deactivated' ) {
239
- update_option( 'sbi_license_status', 'inactive' );
240
- $data = array(
241
- 'licenseStatus' => 'inactive'
242
- );
243
- new SBI_Response( true, $data );
244
- }
245
- }
246
-
247
- /**
248
- * SBI Test Connection
249
- *
250
- * @since 6.0
251
- *
252
- * @return SBI_Response
253
- */
254
- public function sbi_test_connection() {
255
- check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
256
-
257
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
258
- wp_send_json_error();
259
- }
260
- $license_key = get_option( 'sbi_license_key' );
261
- $sbi_api_params = array(
262
- 'edd_action'=> 'check_license',
263
- 'license' => $license_key,
264
- 'item_name' => urlencode( SBI_PLUGIN_NAME ) // the name of our product in EDD
265
- );
266
- $url = add_query_arg( $sbi_api_params, SBI_STORE_URL );
267
- $args = array(
268
- 'timeout' => 60,
269
- 'sslverify' => false
270
- );
271
- // Make the remote API request
272
- $request = \InstagramFeed\SBI_HTTP_Request::request( 'GET', $url, $args );
273
- if ( \InstagramFeed\SBI_HTTP_Request::is_error( $request ) ) {
274
-
275
- $message = '';
276
- foreach ( $request->errors as $key => $error ) {
277
- $message .= esc_html( $key ) . ' - ' . esc_html( $error[0] );
278
- }
279
- new SBI_Response( false, array(
280
- 'hasError' => true,
281
- 'error' => $message
282
- ) );
283
- }
284
-
285
- new SBI_Response( true, array(
286
- 'hasError' => false
287
- ) );
288
- }
289
-
290
- /**
291
- * SBI Re-Check License
292
- *
293
- * @since 6.0
294
- *
295
- * @return SBI_Response
296
- */
297
- public function sbi_recheck_connection() {
298
- check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
299
-
300
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
301
- wp_send_json_error();
302
- }
303
- // Do the form validation
304
- $license_key = isset( $_POST['license_key'] ) ? sanitize_text_field( $_POST['license_key'] ) : '';
305
- $item_name = isset( $_POST['item_name'] ) ? sanitize_text_field( $_POST['item_name'] ) : '';
306
- $option_name = isset( $_POST['option_name'] ) ? sanitize_text_field( $_POST['option_name'] ) : '';
307
- if ( empty( $license_key ) || empty( $item_name ) ) {
308
- new SBI_Response( false, array() );
309
- }
310
-
311
- // make the remote license check API call
312
- $sbi_license_data = $this->get_license_data( $license_key, 'check_license', $item_name );
313
-
314
- // update options data
315
- $license_changed = $this->update_recheck_license_data( $sbi_license_data, $item_name, $option_name );
316
-
317
- // send AJAX response back
318
- new SBI_Response( true, array(
319
- 'license' => $sbi_license_data['license'],
320
- 'licenseChanged' => $license_changed
321
- ) );
322
- }
323
-
324
- /**
325
- * Update License Data
326
- *
327
- * @since 6.0
328
- *
329
- * @param array $license_data
330
- * @param string $item_name
331
- * @param string $option_name
332
- *
333
- * @return bool $license_changed
334
- */
335
- public function update_recheck_license_data( $license_data, $item_name, $option_name ) {
336
- $license_changed = false;
337
- // if we are updating plugin's license data
338
- if ( SBI_PLUGIN_NAME == $item_name ) {
339
- // compare the old stored license status with new license status
340
- if ( get_option( 'sbi_license_status' ) != $license_data['license'] ) {
341
- $license_changed = true;
342
- }
343
- update_option( 'sbi_license_data', $license_data );
344
- update_option( 'sbi_license_status', $license_data['license'] );
345
- }
346
-
347
- // If we are updating extensions license data
348
- if ( SBI_PLUGIN_NAME != $item_name ) {
349
- // compare the old stored license status with new license status
350
- if ( get_option( 'sbi_license_status_' . $option_name ) != $license_data['license'] ) {
351
- $license_changed = true;
352
- }
353
- update_option( 'sbi_license_status_' . $option_name, $license_data['license'] );
354
- }
355
- // if we are updating extensions license data and it's not valid
356
- // then remote the extensions license status
357
- if ( SBI_PLUGIN_NAME != $item_name && 'valid' != $license_data['license'] ) {
358
- delete_option( 'sbi_license_status_' . $option_name );
359
- }
360
-
361
- return $license_changed;
362
- }
363
-
364
- /**
365
- * SBI Import Feed Settings JSON
366
- *
367
- * @since 6.0
368
- *
369
- * @return SBI_Response
370
- */
371
- public function sbi_import_settings_json() {
372
- check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
373
-
374
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
375
- wp_send_json_error();
376
- } $filename = $_FILES['file']['name'];
377
- $ext = pathinfo($filename, PATHINFO_EXTENSION);
378
- if ( 'json' !== $ext ) {
379
- new SBI_Response( false, [] );
380
- }
381
- $imported_settings = file_get_contents( $_FILES["file"]["tmp_name"] );
382
- // check if the file is empty
383
- if ( empty( $imported_settings ) ) {
384
- new SBI_Response( false, [] );
385
- }
386
- $feed_return = \InstagramFeed\Builder\SBI_Feed_Saver_Manager::import_feed( $imported_settings );
387
- // check if there's error while importing
388
- if ( ! $feed_return['success'] ) {
389
- new SBI_Response( false, [] );
390
- }
391
- // Once new feed has imported lets export all the feeds to update in front end
392
- $exported_feeds = \InstagramFeed\Builder\SBI_Db::feeds_query();
393
- $feeds = array();
394
- foreach( $exported_feeds as $feed_id => $feed ) {
395
- $feeds[] = array(
396
- 'id' => $feed['id'],
397
- 'name' => $feed['feed_name']
398
- );
399
- }
400
-
401
- new SBI_Response( true, array(
402
- 'feeds' => $feeds
403
- ) );
404
- }
405
-
406
- /**
407
- * SBI Export Feed Settings JSON
408
- *
409
- * @since 6.0
410
- *
411
- * @return SBI_Response
412
- */
413
- public function sbi_export_settings_json() {
414
- if ( ! check_ajax_referer( 'sbi_admin_nonce', 'nonce', false ) && ! check_ajax_referer( 'sbi-admin', 'nonce', false ) ) {
415
- wp_send_json_error();
416
- }
417
-
418
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
419
- wp_send_json_error(); // This auto-dies.
420
- }
421
-
422
- if ( ! isset( $_GET['feed_id'] ) ) {
423
- return;
424
- }
425
- $feed_id = filter_var( $_GET['feed_id'], FILTER_SANITIZE_NUMBER_INT );
426
- $feed = \InstagramFeed\Builder\SBI_Feed_Saver_Manager::get_export_json( $feed_id );
427
- $feed_info = \InstagramFeed\Builder\SBI_Db::feeds_query( array('id' => $feed_id) );
428
- $feed_name = strtolower( $feed_info[0]['feed_name'] );
429
- $filename = 'sbi-feed-' . $feed_name . '.json';
430
- // create a new empty file in the php memory
431
- $file = fopen( 'php://memory', 'w' );
432
- fwrite( $file, $feed );
433
- fseek( $file, 0 );
434
- header( 'Content-type: application/json' );
435
- header( 'Content-disposition: attachment; filename = "' . $filename . '";' );
436
- fpassthru( $file );
437
- exit;
438
- }
439
-
440
- /**
441
- * SBI Clear Cache
442
- *
443
- * @since 6.0
444
- */
445
- public function sbi_clear_cache() {
446
- check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
447
-
448
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
449
- wp_send_json_error();
450
- }
451
-
452
- // Get the updated cron schedule interval and time settings from user input and update the database
453
- $model = isset( $_POST[ 'model' ] ) ? sanitize_text_field( $_POST['model'] ) : null;
454
- if ( $model !== null ) {
455
- $model = (array) \json_decode( \stripslashes( $model ) );
456
- $feeds = (array) $model['feeds'];
457
-
458
- }
459
-
460
- // Now get the updated cron schedule interval and time values
461
- $sbi_settings = get_option( 'sb_instagram_settings', array() );
462
-
463
- $sbi_cache_cron_interval = $sbi_settings['sbi_cache_cron_interval'];
464
- $sbi_cache_cron_time = $sbi_settings['sbi_cache_cron_time'];
465
- $sbi_cache_cron_am_pm = $sbi_settings[ 'sbi_cache_cron_am_pm' ];
466
-
467
- // Clear the stored caches in the database
468
- $this->clear_stored_caches();
469
-
470
- delete_option( 'sbi_cron_report' );
471
- \SB_Instagram_Cron_Updater::start_cron_job( $sbi_cache_cron_interval, $sbi_cache_cron_time, $sbi_cache_cron_am_pm );
472
-
473
- global $sb_instagram_posts_manager;
474
- $sb_instagram_posts_manager->add_action_log( 'Saved settings on the configure tab.' );
475
- $sb_instagram_posts_manager->clear_api_request_delays();
476
-
477
- new SBI_Response( true, array(
478
- 'cronNextCheck' => $this->get_cron_next_check()
479
- ) );
480
- }
481
-
482
- /**
483
- * Clear the stored caches from the database and from other caching plugins
484
- *
485
- * @since 6.0
486
- */
487
- public function clear_stored_caches() {
488
-
489
- global $wpdb;
490
-
491
- $cache_table_name = $wpdb->prefix . 'sbi_feed_caches';
492
-
493
- $sql = "
494
- UPDATE $cache_table_name
495
- SET cache_value = ''
496
- WHERE cache_key NOT IN ( 'posts_backup', 'header_backup' );";
497
- $wpdb->query( $sql );
498
-
499
- //Delete all SBI transients
500
- $table_name = $wpdb->prefix . "options";
501
- $wpdb->query( "
502
- DELETE
503
- FROM $table_name
504
- WHERE `option_name` LIKE ('%\_transient\_sbi\_%')
505
- " );
506
- $wpdb->query( "
507
- DELETE
508
- FROM $table_name
509
- WHERE `option_name` LIKE ('%\_transient\_timeout\_sbi\_%')
510
- " );
511
- $wpdb->query( "
512
- DELETE
513
- FROM $table_name
514
- WHERE `option_name` LIKE ('%\_transient\_&sbi\_%')
515
- " );
516
- $wpdb->query( "
517
- DELETE
518
- FROM $table_name
519
- WHERE `option_name` LIKE ('%\_transient\_timeout\_&sbi\_%')
520
- " );
521
- $wpdb->query( "
522
- DELETE
523
- FROM $table_name
524
- WHERE `option_name` LIKE ('%\_transient\_\$sbi\_%')
525
- " );
526
- $wpdb->query( "
527
- DELETE
528
- FROM $table_name
529
- WHERE `option_name` LIKE ('%\_transient\_timeout\_\$sbi\_%')
530
- " );
531
-
532
- \SB_Instagram_Cache::clear_legacy( true );
533
-
534
- sb_instagram_clear_page_caches();
535
- }
536
-
537
- /**
538
- * SBI Clear Image Resize Cache
539
- *
540
- * @since 6.0
541
- */
542
- public function sbi_clear_image_resize_cache() {
543
- check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
544
-
545
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
546
- wp_send_json_error();
547
- }
548
-
549
- global $sb_instagram_posts_manager;
550
- $sb_instagram_posts_manager->delete_all_sbi_instagram_posts();
551
- delete_option( 'sbi_top_api_calls' );
552
-
553
- $sb_instagram_posts_manager->add_action_log( 'Reset resizing tables.' );
554
- $this->clear_stored_caches();
555
-
556
- new SBI_Response( true, [] );
557
- }
558
-
559
- /**
560
- * SBI CLear Error Log
561
- *
562
- * @since 6.0
563
- */
564
- public function sbi_clear_error_log() {
565
- //Security Checks
566
- check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
567
-
568
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
569
- wp_send_json_error();
570
- }
571
-
572
- global $sb_instagram_posts_manager;
573
-
574
- $sb_instagram_posts_manager->remove_all_errors();
575
-
576
- wp_send_json_success();
577
- }
578
-
579
- /**
580
- * SBI Clear Image Resize Cache
581
- *
582
- * @since 6.0
583
- */
584
- public function sbi_dpa_reset() {
585
- check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
586
-
587
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
588
- wp_send_json_error();
589
- }
590
-
591
- sbi_delete_all_platform_data();
592
-
593
- $this->clear_stored_caches();
594
-
595
- new SBI_Response( true, [] );
596
- }
597
-
598
- /**
599
- * SBI Get License Data from our license API
600
- *
601
- * @since 6.0
602
- *
603
- * @param string $license_key
604
- * @param string $license_action
605
- *
606
- * @return void|array $sbi_license_data
607
- */
608
- public function get_license_data( $license_key, $license_action = 'check_license', $item_name = SBI_PLUGIN_NAME ) {
609
- $sbi_api_params = array(
610
- 'edd_action'=> $license_action,
611
- 'license' => $license_key,
612
- 'item_name' => urlencode( $item_name ) // the name of our product in EDD
613
- );
614
- $url = add_query_arg( $sbi_api_params, SBI_STORE_URL );
615
- $args = array(
616
- 'timeout' => 60,
617
- 'sslverify' => false
618
- );
619
- // Make the remote API request
620
- $request = \InstagramFeed\SBI_HTTP_Request::request( 'GET', $url, $args );
621
- if ( \InstagramFeed\SBI_HTTP_Request::is_error( $request ) ) {
622
- return;
623
- }
624
- $sbi_license_data = (array) \InstagramFeed\SBI_HTTP_Request::data( $request );
625
- return $sbi_license_data;
626
- }
627
-
628
- /**
629
- * Get license error message depending on license status
630
- *
631
- * @since 6.0
632
- *
633
- * @param array $sbi_license_data
634
- *
635
- * @return array $sbi_license_data
636
- */
637
- public function get_license_error_message( $sbi_license_data ) {
638
- global $sbi_download_id;
639
-
640
- $license_key = null;
641
- if ( get_option('sbi_license_key') ) {
642
- $license_key = get_option('sbi_license_key');
643
- }
644
-
645
- $upgrade_url = sprintf('https://smashballoon.com/instagram-feed/pricing/?license_key=%s&upgrade=true&utm_campaign=instagram-free&utm_source=settings&utm_medium=upgrade-license', $license_key);
646
- $renew_url = sprintf('https://smashballoon.com/checkout/?license_key=%s&download_id=%s&utm_campaign=instagram-free&utm_source=settings&utm_medium=upgrade-license&utm_content=renew-license', $license_key, $sbi_download_id);
647
- $learn_more_url = 'https://smashballoon.com/doc/my-license-key-wont-activate/?utm_campaign=instagram-free&utm_source=settings&utm_medium=license&utm_content=learn-more';
648
-
649
- // Check if the license key reached max site installations
650
- if ( isset( $sbi_license_data['error'] ) && 'no_activations_left' === $sbi_license_data['error'] ) {
651
- $sbi_license_data['errorMsg'] = sprintf(
652
- '%s (%s/%s). %s <a href="%s" target="_blank">%s</a> %s <a href="%s" target="_blank">%s</a>',
653
- __( 'You have reached the maximum number of sites available in your plan', 'instagram-feed' ),
654
- $sbi_license_data['site_count'],
655
- $sbi_license_data['max_sites'],
656
- __( 'Learn more about it', 'instagram-feed' ),
657
- $learn_more_url,
658
- 'here',
659
- __( 'or upgrade your plan.', 'instagram-feed' ),
660
- $upgrade_url,
661
- __( 'Upgrade', 'instagram-feed' )
662
- );
663
- }
664
- // Check if the license key has expired
665
- if (
666
- ( isset( $sbi_license_data['license'] ) && 'expired' === $sbi_license_data['license'] ) ||
667
- ( isset( $sbi_license_data['error'] ) && 'expired' === $sbi_license_data['error'] )
668
- ) {
669
- $sbi_license_data['error'] = true;
670
- $expired_date = new \DateTime( $sbi_license_data['expires'] );
671
- $expired_date = $expired_date->format('F d, Y');
672
- $sbi_license_data['errorMsg'] = sprintf(
673
- '%s %s. %s <a href="%s" target="_blank">%s</a>',
674
- __( 'The license expired on ', 'instagram-feed' ),
675
- $expired_date,
676
- __( 'Please renew it and try again.', 'instagram-feed' ),
677
- $renew_url,
678
- __( 'Renew', 'instagram-feed' )
679
- );
680
- }
681
- return $sbi_license_data;
682
- }
683
-
684
- /**
685
- * Remove admin footer message
686
- *
687
- * @since 6.0
688
- *
689
- * @return void
690
- */
691
- public function remove_admin_footer_text() {
692
- return;
693
- }
694
-
695
- /**
696
- * Register Menu.
697
- *
698
- * @since 6.0
699
- */
700
- function register_menu() {
701
- // remove admin page update footer
702
- add_filter( 'update_footer', [$this, 'remove_admin_footer_text'] );
703
-
704
- $cap = current_user_can( 'manage_custom_instagram_feed_options' ) ? 'manage_custom_instagram_feed_options' : 'manage_options';
705
- $cap = apply_filters( 'sbi_settings_pages_capability', $cap );
706
-
707
- global $sb_instagram_posts_manager;
708
- $notice = '';
709
- if ( $sb_instagram_posts_manager->are_critical_errors() ) {
710
- $notice = ' <span class="update-plugins sbi-error-alert sbi-notice-alert"><span>!</span></span>';
711
- }
712
-
713
- $global_settings = add_submenu_page(
714
- 'sb-instagram-feed',
715
- __( 'Settings', 'instagram-feed' ),
716
- __( 'Settings ' . $notice , 'instagram-feed' ),
717
- $cap,
718
- 'sbi-settings',
719
- [$this, 'global_settings'],
720
- 1
721
- );
722
- add_action( 'load-' . $global_settings, [$this,'builder_enqueue_admin_scripts']);
723
- }
724
-
725
- /**
726
- * Enqueue Builder CSS & Script.
727
- *
728
- * Loads only for builder pages
729
- *
730
- * @since 6.0
731
- */
732
- public function builder_enqueue_admin_scripts(){
733
- if( ! get_current_screen() ) {
734
- return;
735
- }
736
- $screen = get_current_screen();
737
- if ( ! 'instagram-feed_page_sbi-settings' === $screen->id ) {
738
- return;
739
- }
740
- $sbi_status = 'inactive';
741
- $model = $this->get_settings_data();
742
- $exported_feeds = \InstagramFeed\Builder\SBI_Db::feeds_query();
743
- $feeds = array();
744
- foreach( $exported_feeds as $feed_id => $feed ) {
745
- $feeds[] = array(
746
- 'id' => $feed['id'],
747
- 'name' => $feed['feed_name']
748
- );
749
- }
750
- $licenseErrorMsg = null;
751
- $license_key = trim( get_option( 'sbi_license_key' ) );
752
- if ( $license_key ) {
753
- $license_last_check = get_option( 'sbi_license_last_check_timestamp' );
754
- $date = time() - (DAY_IN_SECONDS * 90);
755
- if ( $date > $license_last_check ) {
756
- // make the remote api call and get license data
757
- $sbi_license_data = $this->get_license_data( $license_key );
758
- if( !empty($sbi_license_data) ) update_option( 'sbi_license_data', $sbi_license_data );
759
- update_option( 'sbi_license_last_check_timestamp', time() );
760
- } else {
761
- $sbi_license_data = get_option( 'sbi_license_data' );
762
- }
763
- // update the license data with proper error messages when necessary
764
- $sbi_license_data = $this->get_license_error_message( $sbi_license_data );
765
- $sbi_status = ! empty( $sbi_license_data['license'] ) ? $sbi_license_data['license'] : false;
766
- $licenseErrorMsg = ( isset( $sbi_license_data['error'] ) && isset( $sbi_license_data['errorMsg'] ) ) ? $sbi_license_data['errorMsg'] : null;
767
- }
768
-
769
- wp_enqueue_style(
770
- 'settings-style',
771
- SBI_PLUGIN_URL . 'admin/assets/css/settings.css',
772
- false,
773
- SBIVER
774
- );
775
-
776
- \InstagramFeed\Builder\SBI_Feed_Builder::global_enqueue_ressources_scripts(true);
777
-
778
-
779
- wp_enqueue_script(
780
- 'settings-app',
781
- SBI_PLUGIN_URL.'admin/assets/js/settings.js',
782
- null,
783
- SBIVER,
784
- true
785
- );
786
-
787
- $license_key = null;
788
- if ( get_option('sbi_license_key') ) {
789
- $license_key = get_option('sbi_license_key');
790
- }
791
-
792
- $has_license_error = false;
793
- if (
794
- ( isset( $sbi_license_data['license'] ) && 'expired' === $sbi_license_data['license'] ) ||
795
- ( isset( $sbi_license_data['error'] ) && ( $sbi_license_data['error'] || 'expired' == $sbi_license_data['error'] ) )
796
- ) {
797
- $has_license_error = true;
798
- }
799
-
800
- $upgrade_url = sprintf('https://smashballoon.com/instagram-feed/pricing/?license_key=%s&upgrade=true&utm_campaign=instagram-free&utm_source=settings&utm_medium=upgrade-license', $license_key);
801
- $footer_upgrade_url = 'https://smashballoon.com/instagram-feed/demo?utm_campaign=instagram-free&utm_source=settings&utm_medium=footer-banner&utm_content=Try Demo';
802
- $usage_tracking_url = 'https://smashballoon.com/instagram-feed/usage-tracking/';
803
- $feed_issue_email_url = 'https://smashballoon.com/doc/email-report-is-not-in-my-inbox/?instagram';
804
-
805
- $sources_list = \InstagramFeed\Builder\SBI_Feed_Builder::get_source_list();
806
-
807
- // Extract only license keys and build array for extensions license keys
808
-
809
- $sbi_settings = array(
810
- 'admin_url' => admin_url(),
811
- 'ajax_handler' => admin_url( 'admin-ajax.php' ),
812
- 'nonce' => wp_create_nonce( 'sbi_admin_nonce' ),
813
- 'supportPageUrl' => admin_url( 'admin.php?page=sbi-support' ),
814
- 'builderUrl' => admin_url( 'admin.php?page=sbi-feed-builder' ),
815
- 'links' => $this->get_links_with_utm(),
816
- 'pluginItemName' => SBI_PLUGIN_NAME,
817
- 'licenseType' => 'free',
818
- 'licenseKey' => $license_key,
819
- 'licenseStatus' => $sbi_status,
820
- 'licenseErrorMsg' => $licenseErrorMsg,
821
- 'extensionsLicense' => array(),
822
- 'extensionsLicenseKey' => array(),
823
- 'hasError' => $has_license_error,
824
- 'upgradeUrl' => $upgrade_url,
825
- 'footerUpgradeUrl' => $footer_upgrade_url,
826
- 'isDevSite' => SBI_Upgrader::is_dev_url( home_url() ),
827
- 'model' => $model,
828
- 'feeds' => $feeds,
829
- 'sources' => $sources_list,
830
- //'locales' => SBI_Settings::locales(),
831
- //'timezones' => SBI_Settings::timezones(),
832
- //'socialWallLinks' => \InstagramFeed\Builder\SBI_Feed_Builder::get_social_wall_links(),
833
- 'socialWallLinks' => \InstagramFeed\Builder\SBI_Feed_Builder::get_social_wall_links(),
834
- 'socialWallActivated' => is_plugin_active( 'social-wall/social-wall.php' ),
835
- 'genericText' => \InstagramFeed\Builder\SBI_Feed_Builder::get_generic_text(),
836
- 'generalTab' => array(
837
- 'licenseBox' => array(
838
- 'title' => __( 'License Key', 'instagram-feed' ),
839
- 'description' => __( 'Your license key provides access to updates and support', 'instagram-feed' ),
840
- 'activeText' => __( 'Your <b>Instagram Feed Pro</b> license is Active!', 'instagram-feed' ),
841
- 'inactiveText' => __( 'Your <b>Instagram Feed Pro</b> license is Inactive!', 'instagram-feed' ),
842
- 'freeText' => __( 'Already purchased? Simply enter your license key below to activate Instagram Feed Pro.', 'instagram-feed'),
843
- 'inactiveFieldPlaceholder' => __( 'Paste license key here', 'instagram-feed' ),
844
- 'upgradeText1' => __( 'You are using the Lite version of the plugin–no license needed. Enjoy! 🙂 To unlock more features, consider <a href="'. $upgrade_url .'">Upgrading to Pro</a>.', 'instagram-feed' ),
845
- 'upgradeText2' => __( 'As a valued user of our Lite plugin, you receive 50% OFF - automatically applied at checkout!', 'instagram-feed' ),
846
- 'manageLicense' => __( 'Manage License', 'instagram-feed' ),
847
- 'test' => __( 'Test Connection', 'instagram-feed' ),
848
- 'recheckLicense' => __( 'Recheck license', 'instagram-feed' ),
849
- 'licenseValid' => __( 'License valid', 'instagram-feed' ),
850
- 'licenseExpired' => __( 'License expired', 'instagram-feed' ),
851
- 'connectionSuccessful' => __( 'Connection successful', 'instagram-feed' ),
852
- 'connectionFailed' => __( 'Connection failed', 'instagram-feed' ),
853
- 'viewError' => __( 'View error', 'instagram-feed' ),
854
- 'upgrade' => __( 'Upgrade', 'instagram-feed' ),
855
- 'deactivate' => __( 'Deactivate', 'instagram-feed' ),
856
- 'activate' => __( 'Activate', 'instagram-feed' ),
857
- ),
858
- 'manageSource' => array(
859
- 'title' => __( 'Manage Sources', 'instagram-feed' ),
860
- 'description' => __( 'Add or remove connected Instagram accounts', 'instagram-feed' ),
861
- ),
862
- 'preserveBox' => array(
863
- 'title' => __( 'Preserve settings if plugin is removed', 'instagram-feed' ),
864
- 'description' => __( 'This will make sure that all of your feeds and settings are still saved even if the plugin is uninstalled', 'instagram-feed' ),
865
- ),
866
- 'importBox' => array(
867
- 'title' => __( 'Import Feed Settings', 'instagram-feed' ),
868
- 'description' => __( 'You will need a JSON file previously exported from the Instagram Feed Plugin', 'instagram-feed' ),
869
- 'button' => __( 'Import', 'instagram-feed' ),
870
- ),
871
- 'exportBox' => array(
872
- 'title' => __( 'Export Feed Settings', 'instagram-feed' ),
873
- 'description' => __( 'Export settings for one or more of your feeds', 'instagram-feed' ),
874
- 'button' => __( 'Export', 'instagram-feed' ),
875
- )
876
- ),
877
- 'feedsTab' => array(
878
- 'localizationBox' => array(
879
- 'title' => __( 'Localization', 'instagram-feed' ),
880
- 'tooltip' => '<p>This controls the language of any predefined text strings provided by Instagram. For example, the descriptive text that accompanies some timeline posts (eg: Smash Balloon created an event) and the text in the \'Like Box\' widget. To find out how to translate the other text in the plugin see <a href="https://smashballoon.com/sbi-how-does-the-plugin-handle-text-and-language-translation/">this FAQ</a>.</p>'
881
- ),
882
- 'timezoneBox' => array(
883
- 'title' => __( 'Timezone', 'instagram-feed' )
884
- ),
885
- 'cachingBox' => array(
886
- 'title' => __( 'Caching', 'instagram-feed' ),
887
- 'pageLoads' => __( 'When the Page loads', 'instagram-feed' ),
888
- 'inTheBackground' => __( 'In the Background', 'instagram-feed' ),
889
- 'inTheBackgroundOptions' => array(
890
- '30mins' => __( 'Every 30 minutes', 'instagram-feed' ),
891
- '1hour' => __( 'Every hour', 'instagram-feed' ),
892
- '12hours' => __( 'Every 12 hours', 'instagram-feed' ),
893
- '24hours' => __( 'Every 24 hours', 'instagram-feed' ),
894
- ),
895
- 'am' => __( 'AM', 'instagram-feed' ),
896
- 'pm' => __( 'PM', 'instagram-feed' ),
897
- 'clearCache' => __( 'Clear All Caches', 'instagram-feed' )
898
- ),
899
- 'gdprBox' => array(
900
- 'title' => __( 'GDPR', 'instagram-feed' ),
901
- 'automatic' => __( 'Automatic', 'instagram-feed' ),
902
- 'yes' => __( 'Yes', 'instagram-feed' ),
903
- 'no' => __( 'No', 'instagram-feed' ),
904
- 'infoAuto' => $this->get_gdpr_auto_info(),
905
- 'infoYes' => __( 'No requests will be made to third-party websites. To accommodate this, some features of the plugin will be limited.', 'instagram-feed' ),
906
- 'infoNo' => __( 'The plugin will function as normal and load images and videos directly from Instagram', 'instagram-feed' ),
907
- 'someInstagram' => __( 'Some Instagram Feed features will be limited for visitors to ensure GDPR compliance, until they give consent.', 'instagram-feed'),
908
- 'whatLimited' => __( 'What will be limited?', 'instagram-feed'),
909
- 'tooltip' => '<p><b>If set to “Yes”,</b> it prevents all images and videos from being loaded directly from Instagram’s servers (CDN) to prevent any requests to external websites in your browser. To accommodate this, some features of your plugin will be disabled or limited. </p>
910
- <p><b>If set to “No”,</b> the plugin will still make some requests to load and display images and videos directly from Instagram.</p>
911
- <p><b>If set to “Automatic”,</b> it will only load images and videos directly from Instagram if consent has been given by one of these integrated GDPR cookie Plugins.</p>
912
- <p><a href="https://smashballoon.com/doc/instagram-feed-gdpr-compliance/?instagram" target="_blank" rel="noopener">Learn More</a></p>',
913
- 'gdprTooltipFeatureInfo' => array(
914
- 'headline' => __( 'Features that would be disabled or limited include: ', 'instagram-feed'),
915
- 'features' => array(
916
- __( 'Only local images (not from Instagram\'s CDN) will be displayed in the feed.', 'instagram-feed'),
917
- __( 'Placeholder blank images will be displayed until images are available.', 'instagram-feed'),
918
- __( 'To view videos, visitors will click a link to view the video on Instagram.', 'instagram-feed'),
919
- __( 'Carousel posts will only show the first image in the lightbox.', 'instagram-feed'),
920
- __( 'The maximum image resolution will be 640 pixels wide in the lightbox.', 'instagram-feed'),
921
- )
922
- )
923
- ),
924
- 'customCSSBox' => array(
925
- 'title' => __( 'Custom CSS', 'instagram-feed' ),
926
- 'placeholder' => __( 'Enter any custom CSS here', 'instagram-feed' ),
927
- ),
928
- 'customJSBox' => array(
929
- 'title' => __( 'Custom JS', 'instagram-feed' ),
930
- 'placeholder' => __( 'Enter any custom JS here', 'instagram-feed' ),
931
- )
932
- ),
933
- 'advancedTab' => array(
934
- 'optimizeBox' => array(
935
- 'title' => __( 'Optimize Images', 'instagram-feed' ),
936
- 'helpText' => __( 'This will create multiple local copies of images in different sizes. The plugin then displays the smallest version based on the size of the feed.', 'instagram-feed' ),
937
- 'reset' => __( 'Reset', 'instagram-feed' ),
938
- ),
939
- 'usageBox' => array(
940
- 'title' => __( 'Usage Tracking', 'instagram-feed' ),
941
- 'helpText' => __( 'This helps to prevent plugin and theme conflicts by sending a report in the background once per week about your settings and relevant site stats. It does not send sensitive information like access tokens, email addresses, or user info. This will also not affect your site performance. <a href="'. $usage_tracking_url .'" target="_blank">Learn More</a>', 'instagram-feed' ),
942
- ),
943
- 'resetErrorBox' => array(
944
- 'title' => __( 'Reset Error Log', 'instagram-feed' ),
945
- 'helpText' => __( 'Clear all errors stored in the error log.', 'instagram-feed' ),
946
- 'reset' => __( 'Reset', 'instagram-feed' ),
947
- ),
948
- 'ajaxBox' => array(
949
- 'title' => __( 'AJAX theme loading fix', 'instagram-feed' ),
950
- 'helpText' => __( 'Fixes issues caused by Ajax loading themes. It can also be used to workaround JavaScript errors on the page.', 'instagram-feed' ),
951
- ),
952
- 'ajaxInitial' => array(
953
- 'title' => __( 'Load Initial Posts with AJAX', 'instagram-feed' ),
954
- 'helpText' => __( 'Initial posts will be loaded using AJAX instead of added to the page directly. If you use page caching, this will allow the feed to update according to the "Check for new posts every" setting on the "Configure" tab.', 'instagram-feed' ),
955
- ),
956
- 'enqueueHead' => array(
957
- 'title' => __( 'Enqueue JavaScript in head', 'instagram-feed' ),
958
- 'helpText' => __( 'Add the JavaScript file for the plugin in the HTML "head" instead of the footer.', 'instagram-feed' ),
959
- ),
960
- 'enqueueShortcode' => array(
961
- 'title' => __( 'Enqueue CSS only on pages with the Feed', 'instagram-feed' ),
962
- 'helpText' => '',
963
- ),
964
- 'jsImages' => array(
965
- 'title' => __( 'JavaScript Image Loading', 'instagram-feed' ),
966
- 'helpText' => __( 'Load images on the client side with JS, instead of server side.', 'instagram-feed' ),
967
- ),
968
- 'loadAjax' => array(
969
- 'title' => __( 'Fix a text shortening issue caused by some themes', 'instagram-feed' ),
970
- 'helpText' => __( 'Initial posts will be loaded using AJAX instead of added to the page directly. If you use page caching, this will allow the feed to update according to the "Check for new posts every" setting on the "Configure" tab.', 'instagram-feed' ),
971
- ),
972
- 'adminErrorBox' => array(
973
- 'title' => __( 'Admin Error Notice', 'instagram-feed' ),
974
- 'helpText' => __( 'This will disable or enable the feed error notice that displays in the bottom right corner of your site for logged-in admins.', 'instagram-feed' ),
975
- ),
976
- 'feedIssueBox' => array(
977
- 'title' => __( 'Feed Issue Email Reports', 'instagram-feed' ),
978
- 'helpText' => __( 'If the feed is down due to a critical issue, we will switch to a cached version and notify you based on these settings. <a href="'. $feed_issue_email_url .'" target="_blank">View Documentation</a>', 'instagram-feed' ),
979
- 'sendReport' => __( 'Send a report every', 'instagram-feed' ),
980
- 'to' => __( 'to', 'instagram-feed' ),
981
- 'placeholder' => __( 'Enter one or more email address separated by comma', 'instagram-feed' ),
982
- 'weekDays' => array(
983
- array(
984
- 'val' => 'monday',
985
- 'label' => __( 'Monday', 'instagram-feed' )
986
- ),
987
- array(
988
- 'val' => 'tuesday',
989
- 'label' => __( 'Tuesday', 'instagram-feed' )
990
- ),
991
- array(
992
- 'val' => 'wednesday',
993
- 'label' => __( 'Wednesday', 'instagram-feed' )
994
- ),
995
- array(
996
- 'val' => 'thursday',
997
- 'label' => __( 'Thursday', 'instagram-feed' )
998
- ),
999
- array(
1000
- 'val' => 'friday',
1001
- 'label' => __( 'Friday', 'instagram-feed' )
1002
- ),
1003
- array(
1004
- 'val' => 'saturday',
1005
- 'label' => __( 'Saturday', 'instagram-feed' )
1006
- ),
1007
- array(
1008
- 'val' => 'sunday',
1009
- 'label' => __( 'Sunday', 'instagram-feed' )
1010
- ),
1011
- )
1012
- ),
1013
- 'dpaClear' => array(
1014
- 'title' => __( 'Manage Data', 'instagram-feed' ),
1015
- 'helpText' => __( 'Warning: Clicking this button will permanently delete all Instagram data, including all connected accounts, cached posts, and stored images.', 'instagram-feed' ),
1016
- 'clear' => __( 'Delete all Platform Data', 'instagram-feed' ),
1017
- ),
1018
- ),
1019
- 'dialogBoxPopupScreen' => array(
1020
- 'deleteSource' => array(
1021
- 'heading' => __( 'Delete "#"?', 'instagram-feed' ),
1022
- 'description' => __( 'This source is being used in a feed on your site. If you delete this source then new posts can no longer be retrieved for these feeds.', 'instagram-feed' ),
1023
- ),
1024
- ),
1025
-
1026
- 'selectSourceScreen' => \InstagramFeed\Builder\SBI_Feed_Builder::select_source_screen_text(),
1027
-
1028
- 'nextCheck' => $this->get_cron_next_check(),
1029
- 'loaderSVG' => '<svg version="1.1" id="loader-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="20px" height="20px" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve"><path fill="#fff" d="M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h6.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z"><animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="0.6s" repeatCount="indefinite"/></path></svg>',
1030
- 'checkmarkSVG' => '<svg class="checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"><path class="checkmark__check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8"/></svg>',
1031
- 'uploadSVG' => '<svg class="btn-icon" width="12" height="15" viewBox="0 0 12 15" fill="none" xmlns="http://www.w3.org/2000/svg">
1032
- <path d="M0.166748 14.6667H11.8334V13H0.166748V14.6667ZM0.166748 6.33333H3.50008V11.3333H8.50008V6.33333H11.8334L6.00008 0.5L0.166748 6.33333Z" fill="#141B38"/></svg>',
1033
- 'exportSVG' => '<svg class="btn-icon" width="12" height="15" viewBox="0 0 12 15" fill="none" xmlns="http://www.w3.org/2000/svg">
1034
- <path d="M0.166748 14.6667H11.8334V13H0.166748V14.6667ZM11.8334 5.5H8.50008V0.5H3.50008V5.5H0.166748L6.00008 11.3333L11.8334 5.5Z" fill="#141B38"/></svg>',
1035
- 'reloadSVG' => '<svg width="20" height="14" viewBox="0 0 20 14" fill="none" xmlns="http://www.w3.org/2000/svg">
1036
- <path d="M15.8335 3.66667L12.5002 7H15.0002C15.0002 8.32608 14.4734 9.59785 13.5357 10.5355C12.598 11.4732 11.3262 12 10.0002 12C9.16683 12 8.3585 11.7917 7.66683 11.4167L6.45016 12.6333C7.51107 13.3085 8.74261 13.667 10.0002 13.6667C11.7683 13.6667 13.464 12.9643 14.7142 11.714C15.9644 10.4638 16.6668 8.76811 16.6668 7H19.1668L15.8335 3.66667ZM5.00016 7C5.00016 5.67392 5.52695 4.40215 6.46463 3.46447C7.40231 2.52678 8.67408 2 10.0002 2C10.8335 2 11.6418 2.20833 12.3335 2.58333L13.5502 1.36667C12.4893 0.691461 11.2577 0.332984 10.0002 0.333334C8.23205 0.333334 6.53636 1.03571 5.28612 2.28596C6.03587 3.5362 3.3335 5.23189 3.3335 7H0.833496L4.16683 10.3333L7.50016 7" fill="#141B38"/></svg>',
1037
- 'tooltipHelpSvg' => '<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.1665 8H10.8332V6.33333H9.1665V8ZM9.99984 17.1667C6.32484 17.1667 3.33317 14.175 3.33317 10.5C3.33317 6.825 6.32484 3.83333 9.99984 3.83333C13.6748 3.83333 16.6665 6.825 16.6665 10.5C16.6665 14.175 13.6748 17.1667 9.99984 17.1667ZM9.99984 2.16666C8.90549 2.16666 7.82186 2.38221 6.81081 2.801C5.79976 3.21979 4.8811 3.83362 4.10728 4.60744C2.54448 6.17024 1.6665 8.28986 1.6665 10.5C1.6665 12.7101 2.54448 14.8298 4.10728 16.3926C4.8811 17.1664 5.79976 17.7802 6.81081 18.199C7.82186 18.6178 8.90549 18.8333 9.99984 18.8333C12.21 18.8333 14.3296 17.9554 15.8924 16.3926C17.4552 14.8298 18.3332 12.7101 18.3332 10.5C18.3332 9.40565 18.1176 8.32202 17.6988 7.31097C17.28 6.29992 16.6662 5.38126 15.8924 4.60744C15.1186 3.83362 14.1999 3.21979 13.1889 2.801C12.1778 2.38221 11.0942 2.16666 9.99984 2.16666ZM9.1665 14.6667H10.8332V9.66666H9.1665V14.6667Z" fill="#434960"/></svg>',
1038
- 'svgIcons' => \InstagramFeed\Builder\SBI_Feed_Builder::builder_svg_icons()
1039
- );
1040
-
1041
- $newly_retrieved_source_connection_data = \InstagramFeed\Builder\SBI_Source::maybe_source_connection_data();
1042
- if ( $newly_retrieved_source_connection_data ) {
1043
- $sbi_settings['newSourceData'] = $newly_retrieved_source_connection_data;
1044
- }
1045
-
1046
- if ( isset( $_GET['manualsource'] ) && $_GET['manualsource'] == true ) {
1047
- $sbi_settings['manualSourcePopupInit'] = true;
1048
- }
1049
-
1050
- wp_localize_script(
1051
- 'settings-app',
1052
- 'sbi_settings',
1053
- $sbi_settings
1054
- );
1055
- }
1056
-
1057
- /**
1058
- * Get Extensions License Information
1059
- *
1060
- * @since 6.0
1061
- *
1062
- * @return array
1063
- */
1064
- public function get_extensions_license() {
1065
- return;
1066
-
1067
- }
1068
-
1069
- /**
1070
- * Get Links with UTM
1071
- *
1072
- * @return array
1073
- *
1074
- * @since 6.0
1075
- */
1076
- public static function get_links_with_utm() {
1077
- $license_key = null;
1078
- if ( get_option('sbi_license_key') ) {
1079
- $license_key = get_option('sbi_license_key');
1080
- }
1081
- $all_access_bundle_popup = sprintf('https://smashballoon.com/all-access/?license_key=%s&upgrade=true&utm_campaign=instagram-free&utm_source=balloon&utm_medium=all-access', $license_key);
1082
-
1083
- return array(
1084
- 'manageLicense' => 'https://smashballoon.com/account/downloads/?utm_campaign=instagram-free&utm_source=settings&utm_medium=manage-license',
1085
- 'popup' => array(
1086
- 'allAccessBundle' => $all_access_bundle_popup,
1087
- 'fbProfile' => 'https://www.instagram.com/SmashBalloon/',
1088
- 'twitterProfile' => 'https://twitter.com/smashballoon',
1089
- ),
1090
- );
1091
- }
1092
-
1093
- /**
1094
- * The Settings Data
1095
- *
1096
- * @since 6.0
1097
- *
1098
- * @return array
1099
- */
1100
- public function get_settings_data() {
1101
- $sbi_settings = wp_parse_args( get_option( 'sb_instagram_settings' ), $this->default_settings_options() );
1102
- $sbi_cache_cron_interval = $sbi_settings['sbi_cache_cron_interval'] ;
1103
- $sbi_cache_cron_time = $sbi_settings['sbi_cache_cron_time'];
1104
- $sbi_cache_cron_am_pm = $sbi_settings['sbi_cache_cron_am_pm'];
1105
- $usage_tracking = get_option( 'sbi_usage_tracking', array( 'last_send' => 0, 'enabled' => \sbi_is_pro_version() ) );
1106
- $sbi_ajax = $sbi_settings['sb_instagram_ajax_theme'];
1107
- $active_gdpr_plugin = \SB_Instagram_GDPR_Integrations::gdpr_plugins_active();
1108
- $sbi_preserve_setitngs = $sbi_settings['sb_instagram_preserve_settings'];
1109
-
1110
- return array(
1111
- 'general' => array(
1112
- 'preserveSettings' => $sbi_preserve_setitngs
1113
- ),
1114
- 'feeds' => array(
1115
- 'cachingType' => 'background',
1116
- 'cronInterval' => $sbi_cache_cron_interval,
1117
- 'cronTime' => $sbi_cache_cron_time,
1118
- 'cronAmPm' => $sbi_cache_cron_am_pm,
1119
- 'gdpr' => $sbi_settings['gdpr'],
1120
- 'gdprPlugin' => $active_gdpr_plugin,
1121
- 'customCSS' => isset( $sbi_settings['sb_instagram_custom_css'] ) ? stripslashes( $sbi_settings['sb_instagram_custom_css'] ) : '',
1122
- 'customJS' => isset( $sbi_settings['sb_instagram_custom_js'] ) ? stripslashes( $sbi_settings['sb_instagram_custom_js'] ) : '',
1123
- ),
1124
- 'advanced' => array(
1125
- 'sbi_enable_resize' => !$sbi_settings['sb_instagram_disable_resize'],
1126
- 'usage_tracking' => $usage_tracking['enabled'],
1127
- 'sbi_ajax' => $sbi_ajax,
1128
- 'sb_ajax_initial' => $sbi_settings['sb_ajax_initial'],
1129
- 'sbi_enqueue_js_in_head' => $sbi_settings['enqueue_js_in_head'],
1130
- 'sbi_enqueue_css_in_shortcode' => $sbi_settings['enqueue_css_in_shortcode'],
1131
- 'sbi_enable_js_image_loading' => !$sbi_settings['disable_js_image_loading'],
1132
-
1133
- 'enable_admin_notice' => !$sbi_settings['disable_admin_notice'],
1134
- 'enable_email_report' => $sbi_settings['enable_email_report'],
1135
- 'email_notification' => $sbi_settings['email_notification'],
1136
- 'email_notification_addresses' => $sbi_settings['email_notification_addresses'],
1137
- )
1138
- );
1139
- }
1140
-
1141
- /**
1142
- * Return the default settings options for sbi_style_settings option
1143
- *
1144
- * @since 6.0
1145
- *
1146
- * @return array
1147
- */
1148
- public function default_settings_options() {
1149
- return sbi_defaults();
1150
- }
1151
-
1152
- /**
1153
- * Get GDPR Automatic state information
1154
- *
1155
- * @since 6.0
1156
- *
1157
- * @return string $output
1158
- */
1159
- public function get_gdpr_auto_info() {
1160
- $gdpr_doc_url = 'https://smashballoon.com/doc/instagram-feed-gdpr-compliance/?instagram';
1161
- $output = '';
1162
- $active_gdpr_plugin = \SB_Instagram_GDPR_Integrations::gdpr_plugins_active();
1163
- if ( $active_gdpr_plugin ) {
1164
- $output = $active_gdpr_plugin;
1165
- } else {
1166
- $output = __( 'No GDPR consent plugin detected. Install a compatible <a href="'. $gdpr_doc_url .'" target="_blank">GDPR consent plugin</a>, or manually enable the setting to display a GDPR compliant version of the feed to all visitors.', 'instagram-feed' );
1167
- }
1168
- return $output;
1169
- }
1170
-
1171
- /**
1172
- * SBI Get cron next check time
1173
- *
1174
- * @since 6.0
1175
- *
1176
- * @return string $output
1177
- */
1178
- public function get_cron_next_check() {
1179
- $output = '';
1180
-
1181
- if ( wp_next_scheduled( 'sbi_feed_update' ) ) {
1182
- $time_format = get_option( 'time_format' );
1183
- if ( ! $time_format ) {
1184
- $time_format = 'g:i a';
1185
- }
1186
- //
1187
- $schedule = wp_get_schedule( 'sbi_feed_update' );
1188
- if ( $schedule == '30mins' ) $schedule = __( 'every 30 minutes', 'instagram-feed' );
1189
- if ( $schedule == 'twicedaily' ) $schedule = __( 'every 12 hours', 'instagram-feed' );
1190
- $sbi_next_cron_event = wp_next_scheduled( 'sbi_feed_update' );
1191
- $output = '<b>' . __( 'Next check', 'instagram-feed' ) . ': ' . date( $time_format, $sbi_next_cron_event + sbi_get_utc_offset() ) . ' (' . $schedule . ')</b> - ' . __( 'Note: Clicking "Clear All Caches" will reset this schedule.', 'instagram-feed' );
1192
- } else {
1193
- $output = __( 'Nothing currently scheduled', 'instagram-feed' );
1194
- }
1195
-
1196
- return $output;
1197
- }
1198
-
1199
- /**
1200
- * Settings Page View Template
1201
- *
1202
- * @since 6.0
1203
- */
1204
- public function global_settings(){
1205
- return \InstagramFeed\SBI_View::render( 'settings.index' );
1206
- }
1207
-
1208
- }
1
+ <?php
2
+
3
+ /**
4
+ * The Settings Page
5
+ *
6
+ * @since 6.0
7
+ */
8
+
9
+ namespace InstagramFeed\Admin;
10
+ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
11
+ use InstagramFeed\SBI_Response;
12
+
13
+ class SBI_Global_Settings {
14
+ //use SBI_Settings;
15
+ /**
16
+ * Admin menu page slug.
17
+ *
18
+ * @since 6.0
19
+ *
20
+ * @var string
21
+ */
22
+ const SLUG = 'sbi-settings';
23
+
24
+ /**
25
+ * Initializing the class
26
+ *
27
+ * @since 6.0
28
+ */
29
+ function __construct(){
30
+ $this->init();
31
+ }
32
+
33
+ /**
34
+ * Determining if the user is viewing the our page, if so, party on.
35
+ *
36
+ * @since 6.0
37
+ */
38
+ public function init() {
39
+ if ( ! is_admin() ) {
40
+ return;
41
+ }
42
+
43
+ add_action('admin_menu', [$this, 'register_menu']);
44
+ add_filter( 'admin_footer_text', [$this, 'remove_admin_footer_text'] );
45
+
46
+ add_action( 'wp_ajax_sbi_save_settings', [$this, 'sbi_save_settings'] );
47
+ add_action( 'wp_ajax_sbi_activate_license', [$this, 'sbi_activate_license'] );
48
+ add_action( 'wp_ajax_sbi_deactivate_license', [$this, 'sbi_deactivate_license'] );
49
+ add_action( 'wp_ajax_sbi_test_connection', [$this, 'sbi_test_connection'] );
50
+ add_action( 'wp_ajax_sbi_recheck_connection', [$this, 'sbi_recheck_connection'] );
51
+ add_action( 'wp_ajax_sbi_import_settings_json', [$this, 'sbi_import_settings_json'] );
52
+ add_action( 'wp_ajax_sbi_export_settings_json', [$this, 'sbi_export_settings_json'] );
53
+ add_action( 'wp_ajax_sbi_clear_cache', [$this, 'sbi_clear_cache'] );
54
+ add_action( 'wp_ajax_sbi_clear_image_resize_cache', [$this, 'sbi_clear_image_resize_cache'] );
55
+ add_action( 'wp_ajax_sbi_clear_error_log', [$this, 'sbi_clear_error_log'] );
56
+ add_action( 'wp_ajax_sbi_dpa_reset', [$this, 'sbi_dpa_reset'] );
57
+ }
58
+
59
+ /**
60
+ * SBI Save Settings
61
+ *
62
+ * This will save the data fron the settings page
63
+ *
64
+ * @since 6.0
65
+ *
66
+ * @return SBI_Response
67
+ */
68
+ public function sbi_save_settings() {
69
+ check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
70
+
71
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
72
+ wp_send_json_error();
73
+ }
74
+ $data = $_POST;
75
+ $model = isset( $data[ 'model' ] ) ? $data['model'] : null;
76
+
77
+ // return if the model is null
78
+ if ( null === $model ) {
79
+ return;
80
+ }
81
+
82
+ // get the sbi license key and extensions license key
83
+ $sbi_license_key = sanitize_text_field( $_POST['sbi_license_key'] );
84
+
85
+ // Only update the sbi_license_key value when it's inactive
86
+ if ( get_option( 'sbi_license_status') == 'inactive' ) {
87
+ if ( empty( $sbi_license_key ) || strlen( $sbi_license_key ) < 1 ) {
88
+ delete_option( 'sbi_license_key' );
89
+ delete_option( 'sbi_license_data' );
90
+ delete_option( 'sbi_license_status' );
91
+ } else {
92
+ update_option( 'sbi_license_key', $sbi_license_key );
93
+ }
94
+ } else {
95
+ $license_key = trim( get_option( 'sbi_license_key' ) );
96
+
97
+ if ( empty( $sbi_license_key ) && ! empty( $license_key ) ) {
98
+ $sbi_license_data = $this->get_license_data( $license_key, 'deactivate_license', SBI_PLUGIN_NAME );
99
+
100
+ delete_option( 'sbi_license_key' );
101
+ delete_option( 'sbi_license_data' );
102
+ delete_option( 'sbi_license_status' );
103
+ }
104
+ }
105
+
106
+ $model = (array) \json_decode( \stripslashes( $model ) );
107
+
108
+ $general = (array) $model['general'];
109
+ $feeds = (array) $model['feeds'];
110
+ $advanced = (array) $model['advanced'];
111
+
112
+ // Get the values and sanitize
113
+ $sbi_settings = get_option( 'sb_instagram_settings', array() );
114
+
115
+ /**
116
+ * General Tab
117
+ */
118
+ $sbi_settings['sb_instagram_preserve_settings'] = $general['preserveSettings'];
119
+
120
+ /**
121
+ * Feeds Tab
122
+ */
123
+ $sbi_settings['sb_instagram_custom_css'] = $feeds['customCSS'];
124
+ $sbi_settings['sb_instagram_custom_js'] = $feeds['customJS'];
125
+ $sbi_settings['gdpr'] = sanitize_text_field( $feeds['gdpr'] );
126
+ $sbi_settings['sbi_cache_cron_interval'] = sanitize_text_field( $feeds['cronInterval'] );
127
+ $sbi_settings['sbi_cache_cron_time'] = sanitize_text_field( $feeds['cronTime'] );
128
+ $sbi_settings['sbi_cache_cron_am_pm'] = sanitize_text_field( $feeds['cronAmPm'] );
129
+
130
+ /**
131
+ * Advanced Tab
132
+ */
133
+ $sbi_settings['sb_instagram_ajax_theme'] = sanitize_text_field( $advanced['sbi_ajax'] );
134
+ $sbi_settings['sb_instagram_disable_resize'] = !(bool)$advanced['sbi_enable_resize'];
135
+ $sbi_settings['sb_ajax_initial'] = (bool)$advanced['sb_ajax_initial'];
136
+ $sbi_settings['enqueue_js_in_head'] = (bool)$advanced['sbi_enqueue_js_in_head'];
137
+ $sbi_settings['enqueue_css_in_shortcode'] = (bool)$advanced['sbi_enqueue_css_in_shortcode'];
138
+ $sbi_settings['disable_js_image_loading'] = !(bool)$advanced['sbi_enable_js_image_loading'];
139
+ $sbi_settings['disable_admin_notice'] = !(bool)$advanced['enable_admin_notice'];
140
+ $sbi_settings['enable_email_report'] = (bool)$advanced['enable_email_report'];
141
+
142
+ $sbi_settings['email_notification'] = sanitize_text_field( $advanced['email_notification'] );
143
+ $sbi_settings['email_notification_addresses'] = sanitize_text_field( $advanced['email_notification_addresses'] );
144
+
145
+ $usage_tracking = get_option( 'sbi_usage_tracking', array( 'last_send' => 0, 'enabled' => sbi_is_pro_version() ) );
146
+ if ( isset( $advanced['email_notification_addresses'] ) ) {
147
+ $usage_tracking['enabled'] = false;
148
+ if ( isset( $advanced['usage_tracking'] ) ) {
149
+ if ( ! is_array( $usage_tracking ) ) {
150
+ $usage_tracking = array(
151
+ 'enabled' => $advanced['usage_tracking'],
152
+ 'last_send' => 0,
153
+ );
154
+ } else {
155
+ $usage_tracking['enabled'] = $advanced['usage_tracking'];
156
+ }
157
+ }
158
+ update_option( 'sbi_usage_tracking', $usage_tracking, false );
159
+ }
160
+
161
+ // Update the sbi_style_settings option that contains data for translation and advanced tabs
162
+ update_option( 'sb_instagram_settings', $sbi_settings );
163
+
164
+ // clear cron caches
165
+ $this->sbi_clear_cache();
166
+
167
+ new SBI_Response( true, array(
168
+ 'cronNextCheck' => $this->get_cron_next_check()
169
+ ) );
170
+ }
171
+
172
+ /**
173
+ * SBI Activate License Key
174
+ *
175
+ * @since 6.0
176
+ *
177
+ * @return SBI_Response
178
+ */
179
+ public function sbi_activate_license() {
180
+ check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
181
+
182
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
183
+ wp_send_json_error();
184
+ }
185
+ // do the form validation to check if license_key is not empty
186
+ if ( empty( $_POST[ 'license_key' ] ) ) {
187
+ new \InstagramFeed\SBI_Response( false, array(
188
+ 'message' => __( 'License key required!', 'instagram-feed' ),
189
+ ) );
190
+ }
191
+ $license_key = sanitize_key( $_POST[ 'license_key' ] );
192
+ // make the remote api call and get license data
193
+ $sbi_license_data = $this->get_license_data( $license_key, 'activate_license', SBI_PLUGIN_NAME );
194
+
195
+ // update the license data
196
+ if( !empty( $sbi_license_data ) ) {
197
+ update_option( 'sbi_license_data', $sbi_license_data );
198
+ }
199
+ // update the licnese key only when the license status is activated
200
+ update_option( 'sbi_license_key', $license_key );
201
+ // update the license status
202
+ update_option( 'sbi_license_status', $sbi_license_data['license'] );
203
+
204
+ // Check if there is any error in the license key then handle it
205
+ $sbi_license_data = $this->get_license_error_message( $sbi_license_data );
206
+
207
+ // Send ajax response back to client end
208
+ $data = array(
209
+ 'licenseStatus' => $sbi_license_data['license'],
210
+ 'licenseData' => $sbi_license_data
211
+ );
212
+ new SBI_Response( true, $data );
213
+ }
214
+
215
+ /**
216
+ * SBI Deactivate License Key
217
+ *
218
+ * @since 6.0
219
+ *
220
+ * @return SBI_Response
221
+ */
222
+ public function sbi_deactivate_license() {
223
+ check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
224
+
225
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
226
+ wp_send_json_error();
227
+ }
228
+ $license_key = trim( get_option( 'sbi_license_key' ) );
229
+ $sbi_license_data = $this->get_license_data( $license_key, 'deactivate_license', SBI_PLUGIN_NAME );
230
+ // update the license data
231
+ if( !empty( $sbi_license_data ) ) {
232
+ update_option( 'sbi_license_data', $sbi_license_data );
233
+ }
234
+ if ( ! $sbi_license_data['success'] ) {
235
+ new SBI_Response( false, array() );
236
+ }
237
+ // remove the license keys and update license key status
238
+ if( $sbi_license_data['license'] == 'deactivated' ) {
239
+ update_option( 'sbi_license_status', 'inactive' );
240
+ $data = array(
241
+ 'licenseStatus' => 'inactive'
242
+ );
243
+ new SBI_Response( true, $data );
244
+ }
245
+ }
246
+
247
+ /**
248
+ * SBI Test Connection
249
+ *
250
+ * @since 6.0
251
+ *
252
+ * @return SBI_Response
253
+ */
254
+ public function sbi_test_connection() {
255
+ check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
256
+
257
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
258
+ wp_send_json_error();
259
+ }
260
+ $license_key = get_option( 'sbi_license_key' );
261
+ $sbi_api_params = array(
262
+ 'edd_action'=> 'check_license',
263
+ 'license' => $license_key,
264
+ 'item_name' => urlencode( SBI_PLUGIN_NAME ) // the name of our product in EDD
265
+ );
266
+ $url = add_query_arg( $sbi_api_params, SBI_STORE_URL );
267
+ $args = array(
268
+ 'timeout' => 60,
269
+ 'sslverify' => false
270
+ );
271
+ // Make the remote API request
272
+ $request = \InstagramFeed\SBI_HTTP_Request::request( 'GET', $url, $args );
273
+ if ( \InstagramFeed\SBI_HTTP_Request::is_error( $request ) ) {
274
+
275
+ $message = '';
276
+ foreach ( $request->errors as $key => $error ) {
277
+ $message .= esc_html( $key ) . ' - ' . esc_html( $error[0] );
278
+ }
279
+ new SBI_Response( false, array(
280
+ 'hasError' => true,
281
+ 'error' => $message
282
+ ) );
283
+ }
284
+
285
+ new SBI_Response( true, array(
286
+ 'hasError' => false
287
+ ) );
288
+ }
289
+
290
+ /**
291
+ * SBI Re-Check License
292
+ *
293
+ * @since 6.0
294
+ *
295
+ * @return SBI_Response
296
+ */
297
+ public function sbi_recheck_connection() {
298
+ check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
299
+
300
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
301
+ wp_send_json_error();
302
+ }
303
+ // Do the form validation
304
+ $license_key = isset( $_POST['license_key'] ) ? sanitize_text_field( $_POST['license_key'] ) : '';
305
+ $item_name = isset( $_POST['item_name'] ) ? sanitize_text_field( $_POST['item_name'] ) : '';
306
+ $option_name = isset( $_POST['option_name'] ) ? sanitize_text_field( $_POST['option_name'] ) : '';
307
+ if ( empty( $license_key ) || empty( $item_name ) ) {
308
+ new SBI_Response( false, array() );
309
+ }
310
+
311
+ // make the remote license check API call
312
+ $sbi_license_data = $this->get_license_data( $license_key, 'check_license', $item_name );
313
+
314
+ // update options data
315
+ $license_changed = $this->update_recheck_license_data( $sbi_license_data, $item_name, $option_name );
316
+
317
+ // send AJAX response back
318
+ new SBI_Response( true, array(
319
+ 'license' => $sbi_license_data['license'],
320
+ 'licenseChanged' => $license_changed
321
+ ) );
322
+ }
323
+
324
+ /**
325
+ * Update License Data
326
+ *
327
+ * @since 6.0
328
+ *
329
+ * @param array $license_data
330
+ * @param string $item_name
331
+ * @param string $option_name
332
+ *
333
+ * @return bool $license_changed
334
+ */
335
+ public function update_recheck_license_data( $license_data, $item_name, $option_name ) {
336
+ $license_changed = false;
337
+ // if we are updating plugin's license data
338
+ if ( SBI_PLUGIN_NAME == $item_name ) {
339
+ // compare the old stored license status with new license status
340
+ if ( get_option( 'sbi_license_status' ) != $license_data['license'] ) {
341
+ $license_changed = true;
342
+ }
343
+ update_option( 'sbi_license_data', $license_data );
344
+ update_option( 'sbi_license_status', $license_data['license'] );
345
+ }
346
+
347
+ // If we are updating extensions license data
348
+ if ( SBI_PLUGIN_NAME != $item_name ) {
349
+ // compare the old stored license status with new license status
350
+ if ( get_option( 'sbi_license_status_' . $option_name ) != $license_data['license'] ) {
351
+ $license_changed = true;
352
+ }
353
+ update_option( 'sbi_license_status_' . $option_name, $license_data['license'] );
354
+ }
355
+ // if we are updating extensions license data and it's not valid
356
+ // then remote the extensions license status
357
+ if ( SBI_PLUGIN_NAME != $item_name && 'valid' != $license_data['license'] ) {
358
+ delete_option( 'sbi_license_status_' . $option_name );
359
+ }
360
+
361
+ return $license_changed;
362
+ }
363
+
364
+ /**
365
+ * SBI Import Feed Settings JSON
366
+ *
367
+ * @since 6.0
368
+ *
369
+ * @return SBI_Response
370
+ */
371
+ public function sbi_import_settings_json() {
372
+ check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
373
+
374
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
375
+ wp_send_json_error();
376
+ } $filename = $_FILES['file']['name'];
377
+ $ext = pathinfo($filename, PATHINFO_EXTENSION);
378
+ if ( 'json' !== $ext ) {
379
+ new SBI_Response( false, [] );
380
+ }
381
+ $imported_settings = file_get_contents( $_FILES["file"]["tmp_name"] );
382
+ // check if the file is empty
383
+ if ( empty( $imported_settings ) ) {
384
+ new SBI_Response( false, [] );
385
+ }
386
+ $feed_return = \InstagramFeed\Builder\SBI_Feed_Saver_Manager::import_feed( $imported_settings );
387
+ // check if there's error while importing
388
+ if ( ! $feed_return['success'] ) {
389
+ new SBI_Response( false, [] );
390
+ }
391
+ // Once new feed has imported lets export all the feeds to update in front end
392
+ $exported_feeds = \InstagramFeed\Builder\SBI_Db::feeds_query();
393
+ $feeds = array();
394
+ foreach( $exported_feeds as $feed_id => $feed ) {
395
+ $feeds[] = array(
396
+ 'id' => $feed['id'],
397
+ 'name' => $feed['feed_name']
398
+ );
399
+ }
400
+
401
+ new SBI_Response( true, array(
402
+ 'feeds' => $feeds
403
+ ) );
404
+ }
405
+
406
+ /**
407
+ * SBI Export Feed Settings JSON
408
+ *
409
+ * @since 6.0
410
+ *
411
+ * @return SBI_Response
412
+ */
413
+ public function sbi_export_settings_json() {
414
+ if ( ! check_ajax_referer( 'sbi_admin_nonce', 'nonce', false ) && ! check_ajax_referer( 'sbi-admin', 'nonce', false ) ) {
415
+ wp_send_json_error();
416
+ }
417
+
418
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
419
+ wp_send_json_error(); // This auto-dies.
420
+ }
421
+
422
+ if ( ! isset( $_GET['feed_id'] ) ) {
423
+ return;
424
+ }
425
+ $feed_id = filter_var( $_GET['feed_id'], FILTER_SANITIZE_NUMBER_INT );
426
+ $feed = \InstagramFeed\Builder\SBI_Feed_Saver_Manager::get_export_json( $feed_id );
427
+ $feed_info = \InstagramFeed\Builder\SBI_Db::feeds_query( array('id' => $feed_id) );
428
+ $feed_name = strtolower( $feed_info[0]['feed_name'] );
429
+ $filename = 'sbi-feed-' . $feed_name . '.json';
430
+ // create a new empty file in the php memory
431
+ $file = fopen( 'php://memory', 'w' );
432
+ fwrite( $file, $feed );
433
+ fseek( $file, 0 );
434
+ header( 'Content-type: application/json' );
435
+ header( 'Content-disposition: attachment; filename = "' . $filename . '";' );
436
+ fpassthru( $file );
437
+ exit;
438
+ }
439
+
440
+ /**
441
+ * SBI Clear Cache
442
+ *
443
+ * @since 6.0
444
+ */
445
+ public function sbi_clear_cache() {
446
+ check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
447
+
448
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
449
+ wp_send_json_error();
450
+ }
451
+
452
+ // Get the updated cron schedule interval and time settings from user input and update the database
453
+ $model = isset( $_POST[ 'model' ] ) ? sanitize_text_field( $_POST['model'] ) : null;
454
+ if ( $model !== null ) {
455
+ $model = (array) \json_decode( \stripslashes( $model ) );
456
+ $feeds = (array) $model['feeds'];
457
+
458
+ }
459
+
460
+ // Now get the updated cron schedule interval and time values
461
+ $sbi_settings = get_option( 'sb_instagram_settings', array() );
462
+
463
+ $sbi_cache_cron_interval = $sbi_settings['sbi_cache_cron_interval'];
464
+ $sbi_cache_cron_time = $sbi_settings['sbi_cache_cron_time'];
465
+ $sbi_cache_cron_am_pm = $sbi_settings[ 'sbi_cache_cron_am_pm' ];
466
+
467
+ // Clear the stored caches in the database
468
+ $this->clear_stored_caches();
469
+
470
+ delete_option( 'sbi_cron_report' );
471
+ \SB_Instagram_Cron_Updater::start_cron_job( $sbi_cache_cron_interval, $sbi_cache_cron_time, $sbi_cache_cron_am_pm );
472
+
473
+ global $sb_instagram_posts_manager;
474
+ $sb_instagram_posts_manager->add_action_log( 'Saved settings on the configure tab.' );
475
+ $sb_instagram_posts_manager->clear_api_request_delays();
476
+
477
+ new SBI_Response( true, array(
478
+ 'cronNextCheck' => $this->get_cron_next_check()
479
+ ) );
480
+ }
481
+
482
+ /**
483
+ * Clear the stored caches from the database and from other caching plugins
484
+ *
485
+ * @since 6.0
486
+ */
487
+ public function clear_stored_caches() {
488
+
489
+ global $wpdb;
490
+
491
+ $cache_table_name = $wpdb->prefix . 'sbi_feed_caches';
492
+
493
+ $sql = "
494
+ UPDATE $cache_table_name
495
+ SET cache_value = ''
496
+ WHERE cache_key NOT IN ( 'posts_backup', 'header_backup' );";
497
+ $wpdb->query( $sql );
498
+
499
+ //Delete all SBI transients
500
+ $table_name = $wpdb->prefix . "options";
501
+ $wpdb->query( "
502
+ DELETE
503
+ FROM $table_name
504
+ WHERE `option_name` LIKE ('%\_transient\_sbi\_%')
505
+ " );
506
+ $wpdb->query( "
507
+ DELETE
508
+ FROM $table_name
509
+ WHERE `option_name` LIKE ('%\_transient\_timeout\_sbi\_%')
510
+ " );
511
+ $wpdb->query( "
512
+ DELETE
513
+ FROM $table_name
514
+ WHERE `option_name` LIKE ('%\_transient\_&sbi\_%')
515
+ " );
516
+ $wpdb->query( "
517
+ DELETE
518
+ FROM $table_name
519
+ WHERE `option_name` LIKE ('%\_transient\_timeout\_&sbi\_%')
520
+ " );
521
+ $wpdb->query( "
522
+ DELETE
523
+ FROM $table_name
524
+ WHERE `option_name` LIKE ('%\_transient\_\$sbi\_%')
525
+ " );
526
+ $wpdb->query( "
527
+ DELETE
528
+ FROM $table_name
529
+ WHERE `option_name` LIKE ('%\_transient\_timeout\_\$sbi\_%')
530
+ " );
531
+
532
+ \SB_Instagram_Cache::clear_legacy( true );
533
+
534
+ sb_instagram_clear_page_caches();
535
+ }
536
+
537
+ /**
538
+ * SBI Clear Image Resize Cache
539
+ *
540
+ * @since 6.0
541
+ */
542
+ public function sbi_clear_image_resize_cache() {
543
+ check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
544
+
545
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
546
+ wp_send_json_error();
547
+ }
548
+
549
+ global $sb_instagram_posts_manager;
550
+ $sb_instagram_posts_manager->delete_all_sbi_instagram_posts();
551
+ delete_option( 'sbi_top_api_calls' );
552
+
553
+ $sb_instagram_posts_manager->add_action_log( 'Reset resizing tables.' );
554
+ $this->clear_stored_caches();
555
+
556
+ new SBI_Response( true, [] );
557
+ }
558
+
559
+ /**
560
+ * SBI CLear Error Log
561
+ *
562
+ * @since 6.0
563
+ */
564
+ public function sbi_clear_error_log() {
565
+ //Security Checks
566
+ check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
567
+
568
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
569
+ wp_send_json_error();
570
+ }
571
+
572
+ global $sb_instagram_posts_manager;
573
+
574
+ $sb_instagram_posts_manager->remove_all_errors();
575
+
576
+ wp_send_json_success();
577
+ }
578
+
579
+ /**
580
+ * SBI Clear Image Resize Cache
581
+ *
582
+ * @since 6.0
583
+ */
584
+ public function sbi_dpa_reset() {
585
+ check_ajax_referer( 'sbi_admin_nonce', 'nonce' );
586
+
587
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
588
+ wp_send_json_error();
589
+ }
590
+
591
+ sbi_delete_all_platform_data();
592
+
593
+ $this->clear_stored_caches();
594
+
595
+ new SBI_Response( true, [] );
596
+ }
597
+
598
+ /**
599
+ * SBI Get License Data from our license API
600
+ *
601
+ * @since 6.0
602
+ *
603
+ * @param string $license_key
604
+ * @param string $license_action
605
+ *
606
+ * @return void|array $sbi_license_data
607
+ */
608
+ public function get_license_data( $license_key, $license_action = 'check_license', $item_name = SBI_PLUGIN_NAME ) {
609
+ $sbi_api_params = array(
610
+ 'edd_action'=> $license_action,
611
+ 'license' => $license_key,
612
+ 'item_name' => urlencode( $item_name ) // the name of our product in EDD
613
+ );
614
+ $url = add_query_arg( $sbi_api_params, SBI_STORE_URL );
615
+ $args = array(
616
+ 'timeout' => 60,
617
+ 'sslverify' => false
618
+ );
619
+ // Make the remote API request
620
+ $request = \InstagramFeed\SBI_HTTP_Request::request( 'GET', $url, $args );
621
+ if ( \InstagramFeed\SBI_HTTP_Request::is_error( $request ) ) {
622
+ return;
623
+ }
624
+ $sbi_license_data = (array) \InstagramFeed\SBI_HTTP_Request::data( $request );
625
+ return $sbi_license_data;
626
+ }
627
+
628
+ /**
629
+ * Get license error message depending on license status
630
+ *
631
+ * @since 6.0
632
+ *
633
+ * @param array $sbi_license_data
634
+ *
635
+ * @return array $sbi_license_data
636
+ */
637
+ public function get_license_error_message( $sbi_license_data ) {
638
+ global $sbi_download_id;
639
+
640
+ $license_key = null;
641
+ if ( get_option('sbi_license_key') ) {
642
+ $license_key = get_option('sbi_license_key');
643
+ }
644
+
645
+ $upgrade_url = sprintf('https://smashballoon.com/instagram-feed/pricing/?license_key=%s&upgrade=true&utm_campaign=instagram-free&utm_source=settings&utm_medium=upgrade-license', $license_key);
646
+ $renew_url = sprintf('https://smashballoon.com/checkout/?license_key=%s&download_id=%s&utm_campaign=instagram-free&utm_source=settings&utm_medium=upgrade-license&utm_content=renew-license', $license_key, $sbi_download_id);
647
+ $learn_more_url = 'https://smashballoon.com/doc/my-license-key-wont-activate/?utm_campaign=instagram-free&utm_source=settings&utm_medium=license&utm_content=learn-more';
648
+
649
+ // Check if the license key reached max site installations
650
+ if ( isset( $sbi_license_data['error'] ) && 'no_activations_left' === $sbi_license_data['error'] ) {
651
+ $sbi_license_data['errorMsg'] = sprintf(
652
+ '%s (%s/%s). %s <a href="%s" target="_blank">%s</a> %s <a href="%s" target="_blank">%s</a>',
653
+ __( 'You have reached the maximum number of sites available in your plan', 'instagram-feed' ),
654
+ $sbi_license_data['site_count'],
655
+ $sbi_license_data['max_sites'],
656
+ __( 'Learn more about it', 'instagram-feed' ),
657
+ $learn_more_url,
658
+ 'here',
659
+ __( 'or upgrade your plan.', 'instagram-feed' ),
660
+ $upgrade_url,
661
+ __( 'Upgrade', 'instagram-feed' )
662
+ );
663
+ }
664
+ // Check if the license key has expired
665
+ if (
666
+ ( isset( $sbi_license_data['license'] ) && 'expired' === $sbi_license_data['license'] ) ||
667
+ ( isset( $sbi_license_data['error'] ) && 'expired' === $sbi_license_data['error'] )
668
+ ) {
669
+ $sbi_license_data['error'] = true;
670
+ $expired_date = new \DateTime( $sbi_license_data['expires'] );
671
+ $expired_date = $expired_date->format('F d, Y');
672
+ $sbi_license_data['errorMsg'] = sprintf(
673
+ '%s %s. %s <a href="%s" target="_blank">%s</a>',
674
+ __( 'The license expired on ', 'instagram-feed' ),
675
+ $expired_date,
676
+ __( 'Please renew it and try again.', 'instagram-feed' ),
677
+ $renew_url,
678
+ __( 'Renew', 'instagram-feed' )
679
+ );
680
+ }
681
+ return $sbi_license_data;
682
+ }
683
+
684
+ /**
685
+ * Remove admin footer message
686
+ *
687
+ * @since 6.0
688
+ *
689
+ * @return void
690
+ */
691
+ public function remove_admin_footer_text() {
692
+ return;
693
+ }
694
+
695
+ /**
696
+ * Register Menu.
697
+ *
698
+ * @since 6.0
699
+ */
700
+ function register_menu() {
701
+ // remove admin page update footer
702
+ add_filter( 'update_footer', [$this, 'remove_admin_footer_text'] );
703
+
704
+ $cap = current_user_can( 'manage_custom_instagram_feed_options' ) ? 'manage_custom_instagram_feed_options' : 'manage_options';
705
+ $cap = apply_filters( 'sbi_settings_pages_capability', $cap );
706
+
707
+ global $sb_instagram_posts_manager;
708
+ $notice = '';
709
+ if ( $sb_instagram_posts_manager->are_critical_errors() ) {
710
+ $notice = ' <span class="update-plugins sbi-error-alert sbi-notice-alert"><span>!</span></span>';
711
+ }
712
+
713
+ $global_settings = add_submenu_page(
714
+ 'sb-instagram-feed',
715
+ __( 'Settings', 'instagram-feed' ),
716
+ __( 'Settings ' . $notice , 'instagram-feed' ),
717
+ $cap,
718
+ 'sbi-settings',
719
+ [$this, 'global_settings'],
720
+ 1
721
+ );
722
+ add_action( 'load-' . $global_settings, [$this,'builder_enqueue_admin_scripts']);
723
+ }
724
+
725
+ /**
726
+ * Enqueue Builder CSS & Script.
727
+ *
728
+ * Loads only for builder pages
729
+ *
730
+ * @since 6.0
731
+ */
732
+ public function builder_enqueue_admin_scripts(){
733
+ if( ! get_current_screen() ) {
734
+ return;
735
+ }
736
+ $screen = get_current_screen();
737
+ if ( ! 'instagram-feed_page_sbi-settings' === $screen->id ) {
738
+ return;
739
+ }
740
+ $sbi_status = 'inactive';
741
+ $model = $this->get_settings_data();
742
+ $exported_feeds = \InstagramFeed\Builder\SBI_Db::feeds_query();
743
+ $feeds = array();
744
+ foreach( $exported_feeds as $feed_id => $feed ) {
745
+ $feeds[] = array(
746
+ 'id' => $feed['id'],
747
+ 'name' => $feed['feed_name']
748
+ );
749
+ }
750
+ $licenseErrorMsg = null;
751
+ $license_key = trim( get_option( 'sbi_license_key' ) );
752
+ if ( $license_key ) {
753
+ $license_last_check = get_option( 'sbi_license_last_check_timestamp' );
754
+ $date = time() - (DAY_IN_SECONDS * 90);
755
+ if ( $date > $license_last_check ) {
756
+ // make the remote api call and get license data
757
+ $sbi_license_data = $this->get_license_data( $license_key );
758
+ if( !empty($sbi_license_data) ) update_option( 'sbi_license_data', $sbi_license_data );
759
+ update_option( 'sbi_license_last_check_timestamp', time() );
760
+ } else {
761
+ $sbi_license_data = get_option( 'sbi_license_data' );
762
+ }
763
+ // update the license data with proper error messages when necessary
764
+ $sbi_license_data = $this->get_license_error_message( $sbi_license_data );
765
+ $sbi_status = ! empty( $sbi_license_data['license'] ) ? $sbi_license_data['license'] : false;
766
+ $licenseErrorMsg = ( isset( $sbi_license_data['error'] ) && isset( $sbi_license_data['errorMsg'] ) ) ? $sbi_license_data['errorMsg'] : null;
767
+ }
768
+
769
+ wp_enqueue_style(
770
+ 'settings-style',
771
+ SBI_PLUGIN_URL . 'admin/assets/css/settings.css',
772
+ false,
773
+ SBIVER
774
+ );
775
+
776
+ \InstagramFeed\Builder\SBI_Feed_Builder::global_enqueue_ressources_scripts(true);
777
+
778
+
779
+ wp_enqueue_script(
780
+ 'settings-app',
781
+ SBI_PLUGIN_URL.'admin/assets/js/settings.js',
782
+ null,
783
+ SBIVER,
784
+ true
785
+ );
786
+
787
+ $license_key = null;
788
+ if ( get_option('sbi_license_key') ) {
789
+ $license_key = get_option('sbi_license_key');
790
+ }
791
+
792
+ $has_license_error = false;
793
+ if (
794
+ ( isset( $sbi_license_data['license'] ) && 'expired' === $sbi_license_data['license'] ) ||
795
+ ( isset( $sbi_license_data['error'] ) && ( $sbi_license_data['error'] || 'expired' == $sbi_license_data['error'] ) )
796
+ ) {
797
+ $has_license_error = true;
798
+ }
799
+
800
+ $upgrade_url = sprintf('https://smashballoon.com/instagram-feed/pricing/?license_key=%s&upgrade=true&utm_campaign=instagram-free&utm_source=settings&utm_medium=upgrade-license', $license_key);
801
+ $footer_upgrade_url = 'https://smashballoon.com/instagram-feed/demo?utm_campaign=instagram-free&utm_source=settings&utm_medium=footer-banner&utm_content=Try Demo';
802
+ $usage_tracking_url = 'https://smashballoon.com/instagram-feed/usage-tracking/';
803
+ $feed_issue_email_url = 'https://smashballoon.com/doc/email-report-is-not-in-my-inbox/?instagram';
804
+
805
+ $sources_list = \InstagramFeed\Builder\SBI_Feed_Builder::get_source_list();
806
+
807
+ // Extract only license keys and build array for extensions license keys
808
+
809
+ $sbi_settings = array(
810
+ 'admin_url' => admin_url(),
811
+ 'ajax_handler' => admin_url( 'admin-ajax.php' ),
812
+ 'nonce' => wp_create_nonce( 'sbi_admin_nonce' ),
813
+ 'supportPageUrl' => admin_url( 'admin.php?page=sbi-support' ),
814
+ 'builderUrl' => admin_url( 'admin.php?page=sbi-feed-builder' ),
815
+ 'links' => $this->get_links_with_utm(),
816
+ 'pluginItemName' => SBI_PLUGIN_NAME,
817
+ 'licenseType' => 'free',
818
+ 'licenseKey' => $license_key,
819
+ 'licenseStatus' => $sbi_status,
820
+ 'licenseErrorMsg' => $licenseErrorMsg,
821
+ 'extensionsLicense' => array(),
822
+ 'extensionsLicenseKey' => array(),
823
+ 'hasError' => $has_license_error,
824
+ 'upgradeUrl' => $upgrade_url,
825
+ 'footerUpgradeUrl' => $footer_upgrade_url,
826
+ 'isDevSite' => SBI_Upgrader::is_dev_url( home_url() ),
827
+ 'model' => $model,
828
+ 'feeds' => $feeds,
829
+ 'sources' => $sources_list,
830
+ //'locales' => SBI_Settings::locales(),
831
+ //'timezones' => SBI_Settings::timezones(),
832
+ //'socialWallLinks' => \InstagramFeed\Builder\SBI_Feed_Builder::get_social_wall_links(),
833
+ 'socialWallLinks' => \InstagramFeed\Builder\SBI_Feed_Builder::get_social_wall_links(),
834
+ 'socialWallActivated' => is_plugin_active( 'social-wall/social-wall.php' ),
835
+ 'genericText' => \InstagramFeed\Builder\SBI_Feed_Builder::get_generic_text(),
836
+ 'generalTab' => array(
837
+ 'licenseBox' => array(
838
+ 'title' => __( 'License Key', 'instagram-feed' ),
839
+ 'description' => __( 'Your license key provides access to updates and support', 'instagram-feed' ),
840
+ 'activeText' => __( 'Your <b>Instagram Feed Pro</b> license is Active!', 'instagram-feed' ),
841
+ 'inactiveText' => __( 'Your <b>Instagram Feed Pro</b> license is Inactive!', 'instagram-feed' ),
842
+ 'freeText' => __( 'Already purchased? Simply enter your license key below to activate Instagram Feed Pro.', 'instagram-feed'),
843
+ 'inactiveFieldPlaceholder' => __( 'Paste license key here', 'instagram-feed' ),
844
+ 'upgradeText1' => __( 'You are using the Lite version of the plugin–no license needed. Enjoy! 🙂 To unlock more features, consider <a href="'. $upgrade_url .'">Upgrading to Pro</a>.', 'instagram-feed' ),
845
+ 'upgradeText2' => __( 'As a valued user of our Lite plugin, you receive 50% OFF - automatically applied at checkout!', 'instagram-feed' ),
846
+ 'manageLicense' => __( 'Manage License', 'instagram-feed' ),
847
+ 'test' => __( 'Test Connection', 'instagram-feed' ),
848
+ 'recheckLicense' => __( 'Recheck license', 'instagram-feed' ),
849
+ 'licenseValid' => __( 'License valid', 'instagram-feed' ),
850
+ 'licenseExpired' => __( 'License expired', 'instagram-feed' ),
851
+ 'connectionSuccessful' => __( 'Connection successful', 'instagram-feed' ),
852
+ 'connectionFailed' => __( 'Connection failed', 'instagram-feed' ),
853
+ 'viewError' => __( 'View error', 'instagram-feed' ),
854
+ 'upgrade' => __( 'Upgrade', 'instagram-feed' ),
855
+ 'deactivate' => __( 'Deactivate', 'instagram-feed' ),
856
+ 'activate' => __( 'Activate', 'instagram-feed' ),
857
+ ),
858
+ 'manageSource' => array(
859
+ 'title' => __( 'Manage Sources', 'instagram-feed' ),
860
+ 'description' => __( 'Add or remove connected Instagram accounts', 'instagram-feed' ),
861
+ ),
862
+ 'preserveBox' => array(
863
+ 'title' => __( 'Preserve settings if plugin is removed', 'instagram-feed' ),
864
+ 'description' => __( 'This will make sure that all of your feeds and settings are still saved even if the plugin is uninstalled', 'instagram-feed' ),
865
+ ),
866
+ 'importBox' => array(
867
+ 'title' => __( 'Import Feed Settings', 'instagram-feed' ),
868
+ 'description' => __( 'You will need a JSON file previously exported from the Instagram Feed Plugin', 'instagram-feed' ),
869
+ 'button' => __( 'Import', 'instagram-feed' ),
870
+ ),
871
+ 'exportBox' => array(
872
+ 'title' => __( 'Export Feed Settings', 'instagram-feed' ),
873
+ 'description' => __( 'Export settings for one or more of your feeds', 'instagram-feed' ),
874
+ 'button' => __( 'Export', 'instagram-feed' ),
875
+ )
876
+ ),
877
+ 'feedsTab' => array(
878
+ 'localizationBox' => array(
879
+ 'title' => __( 'Localization', 'instagram-feed' ),
880
+ 'tooltip' => '<p>This controls the language of any predefined text strings provided by Instagram. For example, the descriptive text that accompanies some timeline posts (eg: Smash Balloon created an event) and the text in the \'Like Box\' widget. To find out how to translate the other text in the plugin see <a href="https://smashballoon.com/sbi-how-does-the-plugin-handle-text-and-language-translation/">this FAQ</a>.</p>'
881
+ ),
882
+ 'timezoneBox' => array(
883
+ 'title' => __( 'Timezone', 'instagram-feed' )
884
+ ),
885
+ 'cachingBox' => array(
886
+ 'title' => __( 'Caching', 'instagram-feed' ),
887
+ 'pageLoads' => __( 'When the Page loads', 'instagram-feed' ),
888
+ 'inTheBackground' => __( 'In the Background', 'instagram-feed' ),
889
+ 'inTheBackgroundOptions' => array(
890
+ '30mins' => __( 'Every 30 minutes', 'instagram-feed' ),
891
+ '1hour' => __( 'Every hour', 'instagram-feed' ),
892
+ '12hours' => __( 'Every 12 hours', 'instagram-feed' ),
893
+ '24hours' => __( 'Every 24 hours', 'instagram-feed' ),
894
+ ),
895
+ 'am' => __( 'AM', 'instagram-feed' ),
896
+ 'pm' => __( 'PM', 'instagram-feed' ),
897
+ 'clearCache' => __( 'Clear All Caches', 'instagram-feed' )
898
+ ),
899
+ 'gdprBox' => array(
900
+ 'title' => __( 'GDPR', 'instagram-feed' ),
901
+ 'automatic' => __( 'Automatic', 'instagram-feed' ),
902
+ 'yes' => __( 'Yes', 'instagram-feed' ),
903
+ 'no' => __( 'No', 'instagram-feed' ),
904
+ 'infoAuto' => $this->get_gdpr_auto_info(),
905
+ 'infoYes' => __( 'No requests will be made to third-party websites. To accommodate this, some features of the plugin will be limited.', 'instagram-feed' ),
906
+ 'infoNo' => __( 'The plugin will function as normal and load images and videos directly from Instagram', 'instagram-feed' ),
907
+ 'someInstagram' => __( 'Some Instagram Feed features will be limited for visitors to ensure GDPR compliance, until they give consent.', 'instagram-feed'),
908
+ 'whatLimited' => __( 'What will be limited?', 'instagram-feed'),
909
+ 'tooltip' => '<p><b>If set to “Yes”,</b> it prevents all images and videos from being loaded directly from Instagram’s servers (CDN) to prevent any requests to external websites in your browser. To accommodate this, some features of your plugin will be disabled or limited. </p>
910
+ <p><b>If set to “No”,</b> the plugin will still make some requests to load and display images and videos directly from Instagram.</p>
911
+ <p><b>If set to “Automatic”,</b> it will only load images and videos directly from Instagram if consent has been given by one of these integrated GDPR cookie Plugins.</p>
912
+ <p><a href="https://smashballoon.com/doc/instagram-feed-gdpr-compliance/?instagram" target="_blank" rel="noopener">Learn More</a></p>',
913
+ 'gdprTooltipFeatureInfo' => array(
914
+ 'headline' => __( 'Features that would be disabled or limited include: ', 'instagram-feed'),
915
+ 'features' => array(
916
+ __( 'Only local images (not from Instagram\'s CDN) will be displayed in the feed.', 'instagram-feed'),
917
+ __( 'Placeholder blank images will be displayed until images are available.', 'instagram-feed'),
918
+ __( 'To view videos, visitors will click a link to view the video on Instagram.', 'instagram-feed'),
919
+ __( 'Carousel posts will only show the first image in the lightbox.', 'instagram-feed'),
920
+ __( 'The maximum image resolution will be 640 pixels wide in the lightbox.', 'instagram-feed'),
921
+ )
922
+ )
923
+ ),
924
+ 'customCSSBox' => array(
925
+ 'title' => __( 'Custom CSS', 'instagram-feed' ),
926
+ 'placeholder' => __( 'Enter any custom CSS here', 'instagram-feed' ),
927
+ ),
928
+ 'customJSBox' => array(
929
+ 'title' => __( 'Custom JS', 'instagram-feed' ),
930
+ 'placeholder' => __( 'Enter any custom JS here', 'instagram-feed' ),
931
+ )
932
+ ),
933
+ 'advancedTab' => array(
934
+ 'optimizeBox' => array(
935
+ 'title' => __( 'Optimize Images', 'instagram-feed' ),
936
+ 'helpText' => __( 'This will create multiple local copies of images in different sizes. The plugin then displays the smallest version based on the size of the feed.', 'instagram-feed' ),
937
+ 'reset' => __( 'Reset', 'instagram-feed' ),
938
+ ),
939
+ 'usageBox' => array(
940
+ 'title' => __( 'Usage Tracking', 'instagram-feed' ),
941
+ 'helpText' => __( 'This helps to prevent plugin and theme conflicts by sending a report in the background once per week about your settings and relevant site stats. It does not send sensitive information like access tokens, email addresses, or user info. This will also not affect your site performance. <a href="'. $usage_tracking_url .'" target="_blank">Learn More</a>', 'instagram-feed' ),
942
+ ),
943
+ 'resetErrorBox' => array(
944
+ 'title' => __( 'Reset Error Log', 'instagram-feed' ),
945
+ 'helpText' => __( 'Clear all errors stored in the error log.', 'instagram-feed' ),
946
+ 'reset' => __( 'Reset', 'instagram-feed' ),
947
+ ),
948
+ 'ajaxBox' => array(
949
+ 'title' => __( 'AJAX theme loading fix', 'instagram-feed' ),
950
+ 'helpText' => __( 'Fixes issues caused by Ajax loading themes. It can also be used to workaround JavaScript errors on the page.', 'instagram-feed' ),
951
+ ),
952
+ 'ajaxInitial' => array(
953
+ 'title' => __( 'Load Initial Posts with AJAX', 'instagram-feed' ),
954
+ 'helpText' => __( 'Initial posts will be loaded using AJAX instead of added to the page directly. If you use page caching, this will allow the feed to update according to the "Check for new posts every" setting on the "Configure" tab.', 'instagram-feed' ),
955
+ ),
956
+ 'enqueueHead' => array(
957
+ 'title' => __( 'Enqueue JavaScript in head', 'instagram-feed' ),
958
+ 'helpText' => __( 'Add the JavaScript file for the plugin in the HTML "head" instead of the footer.', 'instagram-feed' ),
959
+ ),
960
+ 'enqueueShortcode' => array(
961
+ 'title' => __( 'Enqueue CSS only on pages with the Feed', 'instagram-feed' ),
962
+ 'helpText' => '',
963
+ ),
964
+ 'jsImages' => array(
965
+ 'title' => __( 'JavaScript Image Loading', 'instagram-feed' ),
966
+ 'helpText' => __( 'Load images on the client side with JS, instead of server side.', 'instagram-feed' ),
967
+ ),
968
+ 'loadAjax' => array(
969
+ 'title' => __( 'Fix a text shortening issue caused by some themes', 'instagram-feed' ),
970
+ 'helpText' => __( 'Initial posts will be loaded using AJAX instead of added to the page directly. If you use page caching, this will allow the feed to update according to the "Check for new posts every" setting on the "Configure" tab.', 'instagram-feed' ),
971
+ ),
972
+ 'adminErrorBox' => array(
973
+ 'title' => __( 'Admin Error Notice', 'instagram-feed' ),
974
+ 'helpText' => __( 'This will disable or enable the feed error notice that displays in the bottom right corner of your site for logged-in admins.', 'instagram-feed' ),
975
+ ),
976
+ 'feedIssueBox' => array(
977
+ 'title' => __( 'Feed Issue Email Reports', 'instagram-feed' ),
978
+ 'helpText' => __( 'If the feed is down due to a critical issue, we will switch to a cached version and notify you based on these settings. <a href="'. $feed_issue_email_url .'" target="_blank">View Documentation</a>', 'instagram-feed' ),
979
+ 'sendReport' => __( 'Send a report every', 'instagram-feed' ),
980
+ 'to' => __( 'to', 'instagram-feed' ),
981
+ 'placeholder' => __( 'Enter one or more email address separated by comma', 'instagram-feed' ),
982
+ 'weekDays' => array(
983
+ array(
984
+ 'val' => 'monday',
985
+ 'label' => __( 'Monday', 'instagram-feed' )
986
+ ),
987
+ array(
988
+ 'val' => 'tuesday',
989
+ 'label' => __( 'Tuesday', 'instagram-feed' )
990
+ ),
991
+ array(
992
+ 'val' => 'wednesday',
993
+ 'label' => __( 'Wednesday', 'instagram-feed' )
994
+ ),
995
+ array(
996
+ 'val' => 'thursday',
997
+ 'label' => __( 'Thursday', 'instagram-feed' )
998
+ ),
999
+ array(
1000
+ 'val' => 'friday',
1001
+ 'label' => __( 'Friday', 'instagram-feed' )
1002
+ ),
1003
+ array(
1004
+ 'val' => 'saturday',
1005
+ 'label' => __( 'Saturday', 'instagram-feed' )
1006
+ ),
1007
+ array(
1008
+ 'val' => 'sunday',
1009
+ 'label' => __( 'Sunday', 'instagram-feed' )
1010
+ ),
1011
+ )
1012
+ ),
1013
+ 'dpaClear' => array(
1014
+ 'title' => __( 'Manage Data', 'instagram-feed' ),
1015
+ 'helpText' => __( 'Warning: Clicking this button will permanently delete all Instagram data, including all connected accounts, cached posts, and stored images.', 'instagram-feed' ),
1016
+ 'clear' => __( 'Delete all Platform Data', 'instagram-feed' ),
1017
+ ),
1018
+ ),
1019
+ 'dialogBoxPopupScreen' => array(
1020
+ 'deleteSource' => array(
1021
+ 'heading' => __( 'Delete "#"?', 'instagram-feed' ),
1022
+ 'description' => __( 'This source is being used in a feed on your site. If you delete this source then new posts can no longer be retrieved for these feeds.', 'instagram-feed' ),
1023
+ ),
1024
+ ),
1025
+
1026
+ 'selectSourceScreen' => \InstagramFeed\Builder\SBI_Feed_Builder::select_source_screen_text(),
1027
+
1028
+ 'nextCheck' => $this->get_cron_next_check(),
1029
+ 'loaderSVG' => '<svg version="1.1" id="loader-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="20px" height="20px" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve"><path fill="#fff" d="M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h6.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z"><animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="0.6s" repeatCount="indefinite"/></path></svg>',
1030
+ 'checkmarkSVG' => '<svg class="checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"><path class="checkmark__check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8"/></svg>',
1031
+ 'uploadSVG' => '<svg class="btn-icon" width="12" height="15" viewBox="0 0 12 15" fill="none" xmlns="http://www.w3.org/2000/svg">
1032
+ <path d="M0.166748 14.6667H11.8334V13H0.166748V14.6667ZM0.166748 6.33333H3.50008V11.3333H8.50008V6.33333H11.8334L6.00008 0.5L0.166748 6.33333Z" fill="#141B38"/></svg>',
1033
+ 'exportSVG' => '<svg class="btn-icon" width="12" height="15" viewBox="0 0 12 15" fill="none" xmlns="http://www.w3.org/2000/svg">
1034
+ <path d="M0.166748 14.6667H11.8334V13H0.166748V14.6667ZM11.8334 5.5H8.50008V0.5H3.50008V5.5H0.166748L6.00008 11.3333L11.8334 5.5Z" fill="#141B38"/></svg>',
1035
+ 'reloadSVG' => '<svg width="20" height="14" viewBox="0 0 20 14" fill="none" xmlns="http://www.w3.org/2000/svg">
1036
+ <path d="M15.8335 3.66667L12.5002 7H15.0002C15.0002 8.32608 14.4734 9.59785 13.5357 10.5355C12.598 11.4732 11.3262 12 10.0002 12C9.16683 12 8.3585 11.7917 7.66683 11.4167L6.45016 12.6333C7.51107 13.3085 8.74261 13.667 10.0002 13.6667C11.7683 13.6667 13.464 12.9643 14.7142 11.714C15.9644 10.4638 16.6668 8.76811 16.6668 7H19.1668L15.8335 3.66667ZM5.00016 7C5.00016 5.67392 5.52695 4.40215 6.46463 3.46447C7.40231 2.52678 8.67408 2 10.0002 2C10.8335 2 11.6418 2.20833 12.3335 2.58333L13.5502 1.36667C12.4893 0.691461 11.2577 0.332984 10.0002 0.333334C8.23205 0.333334 6.53636 1.03571 5.28612 2.28596C6.03587 3.5362 3.3335 5.23189 3.3335 7H0.833496L4.16683 10.3333L7.50016 7" fill="#141B38"/></svg>',
1037
+ 'tooltipHelpSvg' => '<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.1665 8H10.8332V6.33333H9.1665V8ZM9.99984 17.1667C6.32484 17.1667 3.33317 14.175 3.33317 10.5C3.33317 6.825 6.32484 3.83333 9.99984 3.83333C13.6748 3.83333 16.6665 6.825 16.6665 10.5C16.6665 14.175 13.6748 17.1667 9.99984 17.1667ZM9.99984 2.16666C8.90549 2.16666 7.82186 2.38221 6.81081 2.801C5.79976 3.21979 4.8811 3.83362 4.10728 4.60744C2.54448 6.17024 1.6665 8.28986 1.6665 10.5C1.6665 12.7101 2.54448 14.8298 4.10728 16.3926C4.8811 17.1664 5.79976 17.7802 6.81081 18.199C7.82186 18.6178 8.90549 18.8333 9.99984 18.8333C12.21 18.8333 14.3296 17.9554 15.8924 16.3926C17.4552 14.8298 18.3332 12.7101 18.3332 10.5C18.3332 9.40565 18.1176 8.32202 17.6988 7.31097C17.28 6.29992 16.6662 5.38126 15.8924 4.60744C15.1186 3.83362 14.1999 3.21979 13.1889 2.801C12.1778 2.38221 11.0942 2.16666 9.99984 2.16666ZM9.1665 14.6667H10.8332V9.66666H9.1665V14.6667Z" fill="#434960"/></svg>',
1038
+ 'svgIcons' => \InstagramFeed\Builder\SBI_Feed_Builder::builder_svg_icons()
1039
+ );
1040
+
1041
+ $newly_retrieved_source_connection_data = \InstagramFeed\Builder\SBI_Source::maybe_source_connection_data();
1042
+ if ( $newly_retrieved_source_connection_data ) {
1043
+ $sbi_settings['newSourceData'] = $newly_retrieved_source_connection_data;
1044
+ }
1045
+
1046
+ if ( isset( $_GET['manualsource'] ) && $_GET['manualsource'] == true ) {
1047
+ $sbi_settings['manualSourcePopupInit'] = true;
1048
+ }
1049
+
1050
+ wp_localize_script(
1051
+ 'settings-app',
1052
+ 'sbi_settings',
1053
+ $sbi_settings
1054
+ );
1055
+ }
1056
+
1057
+ /**
1058
+ * Get Extensions License Information
1059
+ *
1060
+ * @since 6.0
1061
+ *
1062
+ * @return array
1063
+ */
1064
+ public function get_extensions_license() {
1065
+ return;
1066
+
1067
+ }
1068
+
1069
+ /**
1070
+ * Get Links with UTM
1071
+ *
1072
+ * @return array
1073
+ *
1074
+ * @since 6.0
1075
+ */
1076
+ public static function get_links_with_utm() {
1077
+ $license_key = null;
1078
+ if ( get_option('sbi_license_key') ) {
1079
+ $license_key = get_option('sbi_license_key');
1080
+ }
1081
+ $all_access_bundle_popup = sprintf('https://smashballoon.com/all-access/?license_key=%s&upgrade=true&utm_campaign=instagram-free&utm_source=balloon&utm_medium=all-access', $license_key);
1082
+
1083
+ return array(
1084
+ 'manageLicense' => 'https://smashballoon.com/account/downloads/?utm_campaign=instagram-free&utm_source=settings&utm_medium=manage-license',
1085
+ 'popup' => array(
1086
+ 'allAccessBundle' => $all_access_bundle_popup,
1087
+ 'fbProfile' => 'https://www.instagram.com/SmashBalloon/',
1088
+ 'twitterProfile' => 'https://twitter.com/smashballoon',
1089
+ ),
1090
+ );
1091
+ }
1092
+
1093
+ /**
1094
+ * The Settings Data
1095
+ *
1096
+ * @since 6.0
1097
+ *
1098
+ * @return array
1099
+ */
1100
+ public function get_settings_data() {
1101
+ $sbi_settings = wp_parse_args( get_option( 'sb_instagram_settings' ), $this->default_settings_options() );
1102
+ $sbi_cache_cron_interval = $sbi_settings['sbi_cache_cron_interval'] ;
1103
+ $sbi_cache_cron_time = $sbi_settings['sbi_cache_cron_time'];
1104
+ $sbi_cache_cron_am_pm = $sbi_settings['sbi_cache_cron_am_pm'];
1105
+ $usage_tracking = get_option( 'sbi_usage_tracking', array( 'last_send' => 0, 'enabled' => \sbi_is_pro_version() ) );
1106
+ $sbi_ajax = $sbi_settings['sb_instagram_ajax_theme'];
1107
+ $active_gdpr_plugin = \SB_Instagram_GDPR_Integrations::gdpr_plugins_active();
1108
+ $sbi_preserve_setitngs = $sbi_settings['sb_instagram_preserve_settings'];
1109
+
1110
+ return array(
1111
+ 'general' => array(
1112
+ 'preserveSettings' => $sbi_preserve_setitngs
1113
+ ),
1114
+ 'feeds' => array(
1115
+ 'cachingType' => 'background',
1116
+ 'cronInterval' => $sbi_cache_cron_interval,
1117
+ 'cronTime' => $sbi_cache_cron_time,
1118
+ 'cronAmPm' => $sbi_cache_cron_am_pm,
1119
+ 'gdpr' => $sbi_settings['gdpr'],
1120
+ 'gdprPlugin' => $active_gdpr_plugin,
1121
+ 'customCSS' => isset( $sbi_settings['sb_instagram_custom_css'] ) ? stripslashes( $sbi_settings['sb_instagram_custom_css'] ) : '',
1122
+ 'customJS' => isset( $sbi_settings['sb_instagram_custom_js'] ) ? stripslashes( $sbi_settings['sb_instagram_custom_js'] ) : '',
1123
+ ),
1124
+ 'advanced' => array(
1125
+ 'sbi_enable_resize' => !$sbi_settings['sb_instagram_disable_resize'],
1126
+ 'usage_tracking' => $usage_tracking['enabled'],
1127
+ 'sbi_ajax' => $sbi_ajax,
1128
+ 'sb_ajax_initial' => $sbi_settings['sb_ajax_initial'],
1129
+ 'sbi_enqueue_js_in_head' => $sbi_settings['enqueue_js_in_head'],
1130
+ 'sbi_enqueue_css_in_shortcode' => $sbi_settings['enqueue_css_in_shortcode'],
1131
+ 'sbi_enable_js_image_loading' => !$sbi_settings['disable_js_image_loading'],
1132
+
1133
+ 'enable_admin_notice' => !$sbi_settings['disable_admin_notice'],
1134
+ 'enable_email_report' => $sbi_settings['enable_email_report'],
1135
+ 'email_notification' => $sbi_settings['email_notification'],
1136
+ 'email_notification_addresses' => $sbi_settings['email_notification_addresses'],
1137
+ )
1138
+ );
1139
+ }
1140
+
1141
+ /**
1142
+ * Return the default settings options for sbi_style_settings option
1143
+ *
1144
+ * @since 6.0
1145
+ *
1146
+ * @return array
1147
+ */
1148
+ public function default_settings_options() {
1149
+ return sbi_defaults();
1150
+ }
1151
+
1152
+ /**
1153
+ * Get GDPR Automatic state information
1154
+ *
1155
+ * @since 6.0
1156
+ *
1157
+ * @return string $output
1158
+ */
1159
+ public function get_gdpr_auto_info() {
1160
+ $gdpr_doc_url = 'https://smashballoon.com/doc/instagram-feed-gdpr-compliance/?instagram';
1161
+ $output = '';
1162
+ $active_gdpr_plugin = \SB_Instagram_GDPR_Integrations::gdpr_plugins_active();
1163
+ if ( $active_gdpr_plugin ) {
1164
+ $output = $active_gdpr_plugin;
1165
+ } else {
1166
+ $output = __( 'No GDPR consent plugin detected. Install a compatible <a href="'. $gdpr_doc_url .'" target="_blank">GDPR consent plugin</a>, or manually enable the setting to display a GDPR compliant version of the feed to all visitors.', 'instagram-feed' );
1167
+ }
1168
+ return $output;
1169
+ }
1170
+
1171
+ /**
1172
+ * SBI Get cron next check time
1173
+ *
1174
+ * @since 6.0
1175
+ *
1176
+ * @return string $output
1177
+ */
1178
+ public function get_cron_next_check() {
1179
+ $output = '';
1180
+
1181
+ if ( wp_next_scheduled( 'sbi_feed_update' ) ) {
1182
+ $time_format = get_option( 'time_format' );
1183
+ if ( ! $time_format ) {
1184
+ $time_format = 'g:i a';
1185
+ }
1186
+ //
1187
+ $schedule = wp_get_schedule( 'sbi_feed_update' );
1188
+ if ( $schedule == '30mins' ) $schedule = __( 'every 30 minutes', 'instagram-feed' );
1189
+ if ( $schedule == 'twicedaily' ) $schedule = __( 'every 12 hours', 'instagram-feed' );
1190
+ $sbi_next_cron_event = wp_next_scheduled( 'sbi_feed_update' );
1191
+ $output = '<b>' . __( 'Next check', 'instagram-feed' ) . ': ' . date( $time_format, $sbi_next_cron_event + sbi_get_utc_offset() ) . ' (' . $schedule . ')</b> - ' . __( 'Note: Clicking "Clear All Caches" will reset this schedule.', 'instagram-feed' );
1192
+ } else {
1193
+ $output = __( 'Nothing currently scheduled', 'instagram-feed' );
1194
+ }
1195
+
1196
+ return $output;
1197
+ }
1198
+
1199
+ /**
1200
+ * Settings Page View Template
1201
+ *
1202
+ * @since 6.0
1203
+ */
1204
+ public function global_settings(){
1205
+ return \InstagramFeed\SBI_View::render( 'settings.index' );
1206
+ }
1207
+
1208
+ }
admin/SBI_HTTP_Request.php CHANGED
@@ -1,100 +1,100 @@
1
- <?php
2
- /**
3
- * Class SBI_HTTP_Request
4
- *
5
- * This class with make remote request
6
- *
7
- * @since 4.0
8
- */
9
- namespace InstagramFeed;
10
- if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
11
-
12
- class SBI_HTTP_Request {
13
-
14
- public function __construct() {
15
-
16
- }
17
-
18
- /**
19
- * Make the HTTP remote request
20
- *
21
- * @param string $method
22
- * @param string $url
23
- * @param array|null $data
24
- *
25
- * @since 4.0
26
- *
27
- * @return array|WP_Error
28
- */
29
- public static function request( $method, $url, $data = null ) {
30
- $args = array(
31
- 'headers' => array(
32
- 'Content-Type' => 'application/json',
33
- ),
34
- );
35
-
36
- $args = array_merge( $args, $data );
37
-
38
- if ( 'GET' === $method ) {
39
- $request = wp_remote_get( $url, $args );
40
- } elseif ( 'DELETE' === $method ) {
41
- $args['method'] = 'DELETE';
42
- $request = wp_remote_request( $url, $args );
43
- } elseif ( 'PATCH' === $method ) {
44
- $args['method'] = 'PATCH';
45
- $request = wp_remote_request( $url, $args );
46
- } elseif ( 'PUT' === $method ) {
47
- $args['method'] = 'PUT';
48
- $request = wp_remote_request( $url, $args );
49
- } else {
50
- $args['method'] = 'POST';
51
- $request = wp_remote_post( $url, $args );
52
- }
53
-
54
- return $request;
55
- }
56
-
57
- /**
58
- * Check if WP_Error returned
59
- *
60
- * @param array|WP_Error $request
61
- *
62
- * @since 4.0
63
- *
64
- * @return array|WP_Error
65
- */
66
- public static function is_error( $request ) {
67
- return is_wp_error( $request );
68
- }
69
-
70
- /**
71
- * Get the remote call status code
72
- *
73
- * @param array|WP_Error $request
74
- *
75
- * @since 4.0
76
- *
77
- * @return array|WP_Error
78
- */
79
- public static function status( $request ) {
80
- if ( is_wp_error( $request ) ) {
81
- return;
82
- }
83
-
84
- return wp_remote_retrieve_response_code( $request );
85
- }
86
-
87
- /**
88
- * Get the remote call body data
89
- *
90
- * @param array|WP_Error $request
91
- *
92
- * @since 4.0
93
- *
94
- * @return array $response
95
- */
96
- public static function data( $request ) {
97
- $response = wp_remote_retrieve_body( $request );
98
- return json_decode( $response );
99
- }
100
- }
1
+ <?php
2
+ /**
3
+ * Class SBI_HTTP_Request
4
+ *
5
+ * This class with make remote request
6
+ *
7
+ * @since 4.0
8
+ */
9
+ namespace InstagramFeed;
10
+ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
11
+
12
+ class SBI_HTTP_Request {
13
+
14
+ public function __construct() {
15
+
16
+ }
17
+
18
+ /**
19
+ * Make the HTTP remote request
20
+ *
21
+ * @param string $method
22
+ * @param string $url
23
+ * @param array|null $data
24
+ *
25
+ * @since 4.0
26
+ *
27
+ * @return array|WP_Error
28
+ */
29
+ public static function request( $method, $url, $data = null ) {
30
+ $args = array(
31
+ 'headers' => array(
32
+ 'Content-Type' => 'application/json',
33
+ ),
34
+ );
35
+
36
+ $args = array_merge( $args, $data );
37
+
38
+ if ( 'GET' === $method ) {
39
+ $request = wp_remote_get( $url, $args );
40
+ } elseif ( 'DELETE' === $method ) {
41
+ $args['method'] = 'DELETE';
42
+ $request = wp_remote_request( $url, $args );
43
+ } elseif ( 'PATCH' === $method ) {
44
+ $args['method'] = 'PATCH';
45
+ $request = wp_remote_request( $url, $args );
46
+ } elseif ( 'PUT' === $method ) {
47
+ $args['method'] = 'PUT';
48
+ $request = wp_remote_request( $url, $args );
49
+ } else {
50
+ $args['method'] = 'POST';
51
+ $request = wp_remote_post( $url, $args );
52
+ }
53
+
54
+ return $request;
55
+ }
56
+
57
+ /**
58
+ * Check if WP_Error returned
59
+ *
60
+ * @param array|WP_Error $request
61
+ *
62
+ * @since 4.0
63
+ *
64
+ * @return array|WP_Error
65
+ */
66
+ public static function is_error( $request ) {
67
+ return is_wp_error( $request );
68
+ }
69
+
70
+ /**
71
+ * Get the remote call status code
72
+ *
73
+ * @param array|WP_Error $request
74
+ *
75
+ * @since 4.0
76
+ *
77
+ * @return array|WP_Error
78
+ */
79
+ public static function status( $request ) {
80
+ if ( is_wp_error( $request ) ) {
81
+ return;
82
+ }
83
+
84
+ return wp_remote_retrieve_response_code( $request );
85
+ }
86
+
87
+ /**
88
+ * Get the remote call body data
89
+ *
90
+ * @param array|WP_Error $request
91
+ *
92
+ * @since 4.0
93
+ *
94
+ * @return array $response
95
+ */
96
+ public static function data( $request ) {
97
+ $response = wp_remote_retrieve_body( $request );
98
+ return json_decode( $response );
99
+ }
100
+ }
admin/SBI_Response.php CHANGED
@@ -1,25 +1,25 @@
1
- <?php
2
- /**
3
- * Class SBI_Response
4
- *
5
- * Sends back ajax response to client end
6
- *
7
- * @since 6.0
8
- */
9
- namespace InstagramFeed;
10
- if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
11
-
12
- class SBI_Response {
13
- /**
14
- * Response constructor.
15
- *
16
- * @param $is_success
17
- * @param $data
18
- *
19
- * @throws \Exception
20
- */
21
- public function __construct( $is_success, $data ) {
22
- $is_success ? wp_send_json_success( $data ) : wp_send_json_error( $data );
23
- wp_die();
24
- }
25
- }
1
+ <?php
2
+ /**
3
+ * Class SBI_Response
4
+ *
5
+ * Sends back ajax response to client end
6
+ *
7
+ * @since 6.0
8
+ */
9
+ namespace InstagramFeed;
10
+ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
11
+
12
+ class SBI_Response {
13
+ /**
14
+ * Response constructor.
15
+ *
16
+ * @param $is_success
17
+ * @param $data
18
+ *
19
+ * @throws \Exception
20
+ */
21
+ public function __construct( $is_success, $data ) {
22
+ $is_success ? wp_send_json_success( $data ) : wp_send_json_error( $data );
23
+ wp_die();
24
+ }
25
+ }
admin/SBI_Support.php CHANGED
@@ -1,800 +1,800 @@
1
- <?php
2
-
3
- /**
4
- * The Settings Page
5
- *
6
- * @since 6.0
7
- */
8
-
9
- namespace InstagramFeed\Admin;
10
-
11
- if ( ! defined( 'ABSPATH' ) ) {
12
- exit; // Exit if accessed directly
13
- }
14
-
15
- use InstagramFeed\SBI_View;
16
- use InstagramFeed\Builder\SBI_Db;
17
- use InstagramFeed\Builder\SBI_Feed_Builder;
18
-
19
- class SBI_Support {
20
- /**
21
- * Admin menu page slug.
22
- *
23
- * @since 6.0
24
- *
25
- * @var string
26
- */
27
- const SLUG = 'sbi-support';
28
-
29
- /**
30
- * Initializing the class
31
- *
32
- * @since 6.0
33
- */
34
- public function __construct() {
35
- $this->init();
36
- }
37
-
38
- /**
39
- * Determining if the user is viewing the our page, if so, party on.
40
- *
41
- * @since 6.0
42
- */
43
- public function init() {
44
- if ( ! is_admin() ) {
45
- return;
46
- }
47
-
48
- add_action( 'admin_menu', array( $this, 'register_menu' ) );
49
- }
50
-
51
- /**
52
- * Register Menu.
53
- *
54
- * @since 6.0
55
- */
56
- public function register_menu() {
57
- $cap = current_user_can( 'manage_instagram_feed_options' ) ? 'manage_instagram_feed_options' : 'manage_options';
58
- $cap = apply_filters( 'sbi_settings_pages_capability', $cap );
59
- $support_page = add_submenu_page(
60
- 'sb-instagram-feed',
61
- __( 'Support', 'instagram-feed' ),
62
- __( 'Support', 'instagram-feed' ),
63
- $cap,
64
- self::SLUG,
65
- array( $this, 'support_page' ),
66
- 4
67
- );
68
- add_action( 'load-' . $support_page, array( $this, 'support_page_enqueue_assets' ) );
69
- }
70
-
71
- /**
72
- * Enqueue Extension CSS & Script.
73
- *
74
- * Loads only for Extension page
75
- *
76
- * @since 6.0
77
- */
78
- public function support_page_enqueue_assets() {
79
- if ( ! get_current_screen() ) {
80
- return;
81
- }
82
- $screen = get_current_screen();
83
-
84
- if ( strpos( $screen->id, 'sbi-support' ) === false) {
85
- return;
86
- }
87
-
88
- wp_enqueue_style(
89
- 'sbi-fira-code-font',
90
- 'https://fonts.googleapis.com/css2?family=Fira+Code&display=swap',
91
- false,
92
- SBIVER
93
- );
94
-
95
- wp_enqueue_style(
96
- 'support-style',
97
- SBI_PLUGIN_URL . 'admin/assets/css/support.css',
98
- false,
99
- SBIVER
100
- );
101
-
102
- wp_enqueue_script(
103
- 'vue-main',
104
- 'https://cdn.jsdelivr.net/npm/vue@2.6.12',
105
- null,
106
- '2.6.12',
107
- true
108
- );
109
-
110
- wp_enqueue_script(
111
- 'support-app',
112
- SBI_PLUGIN_URL . 'admin/assets/js/support.js',
113
- null,
114
- SBIVER,
115
- true
116
- );
117
-
118
- $sbi_support = $this->page_data();
119
-
120
- wp_localize_script(
121
- 'support-app',
122
- 'sbi_support',
123
- $sbi_support
124
- );
125
- }
126
-
127
- /**
128
- * Page Data to use in front end
129
- *
130
- * @since 6.0
131
- *
132
- * @return array
133
- */
134
- public function page_data() {
135
- $exported_feeds = SBI_Db::feeds_query();
136
- $feeds = array();
137
- foreach ( $exported_feeds as $feed_id => $feed ) {
138
- $feeds[] = array(
139
- 'id' => $feed['id'],
140
- 'name' => $feed['feed_name'],
141
- );
142
- }
143
-
144
- $return = array(
145
- 'admin_url' => admin_url(),
146
- 'ajax_handler' => admin_url( 'admin-ajax.php' ),
147
- 'nonce' => wp_create_nonce( 'sbi-admin' ),
148
- 'links' => \InstagramFeed\Builder\SBI_Feed_Builder::get_links_with_utm(),
149
- 'supportPageUrl' => admin_url( 'admin.php?page=sbi-support' ),
150
- 'siteSearchUrl' => 'https://smashballoon.com/search/',
151
- 'system_info' => $this->get_system_info(),
152
- 'system_info_n' => str_replace( '</br>', "\n", $this->get_system_info() ),
153
- 'feeds' => $feeds,
154
- 'supportUrl' => $this->get_support_url(),
155
- 'svgIcons' => SBI_Feed_Builder::builder_svg_icons(),
156
- 'socialWallLinks' => \InstagramFeed\Builder\SBI_Feed_Builder::get_social_wall_links(),
157
- 'socialWallActivated' => is_plugin_active( 'social-wall/social-wall.php' ),
158
- 'genericText' => array(
159
- 'help' => __( 'Help', 'instagram-feed' ),
160
- 'title' => __( 'Support', 'instagram-feed' ),
161
- 'gettingStarted' => __( 'Getting Started', 'instagram-feed' ),
162
- 'someHelpful' => __( 'Some helpful resources to get you started', 'instagram-feed' ),
163
- 'docsN' => __( 'Docs & Troubleshooting', 'instagram-feed' ),
164
- 'runInto' => __( 'Run into an issue? Check out our help docs.', 'instagram-feed' ),
165
- 'additionalR' => __( 'Additional Resources', 'instagram-feed' ),
166
- 'toHelp' => __( 'To help you get the most out of the plugin', 'instagram-feed' ),
167
- 'needMore' => __( 'Need more support? We’re here to help.', 'instagram-feed' ),
168
- 'ourFast' => __( 'Our fast and friendly support team is always happy to help!', 'instagram-feed' ),
169
- 'systemInfo' => __( 'System Info', 'instagram-feed' ),
170
- 'exportSettings' => __( 'Export Settings', 'instagram-feed' ),
171
- 'shareYour' => __( 'Share your plugin settings easily with Support', 'instagram-feed' ),
172
- 'copiedToClipboard' => __( 'Copied to clipboard', 'instagram-feed' ),
173
- ),
174
- 'buttons' => array(
175
- 'searchDoc' => __( 'Search Documentation', 'instagram-feed' ),
176
- 'moreHelp' => __( 'More help on Getting started', 'instagram-feed' ),
177
- 'viewDoc' => __( 'View Documentation', 'instagram-feed' ),
178
- 'viewBlog' => __( 'View Blog', 'instagram-feed' ),
179
- 'submitTicket' => __( 'Submit a Support Ticket', 'instagram-feed' ),
180
- 'copied' => __( 'Copied', 'instagram-feed' ),
181
- 'copy' => __( 'Copy', 'instagram-feed' ),
182
- 'export' => __( 'Export', 'instagram-feed' ),
183
- 'expand' => __( 'Expand', 'instagram-feed' ),
184
- 'collapse' => __( 'Collapse', 'instagram-feed' ),
185
- ),
186
- 'icons' => array(
187
- 'rocket' => SBI_PLUGIN_URL . 'admin/assets/img/rocket-icon.png',
188
- 'book' => SBI_PLUGIN_URL . 'admin/assets/img/book-icon.png',
189
- 'save' => SBI_PLUGIN_URL . 'admin/assets/img/save-plus-icon.png',
190
- 'magnify' => '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.91667 0.5C7.35326 0.5 8.73101 1.07068 9.74683 2.08651C10.7627 3.10233 11.3333 4.48008 11.3333 5.91667C11.3333 7.25833 10.8417 8.49167 10.0333 9.44167L10.2583 9.66667H10.9167L15.0833 13.8333L13.8333 15.0833L9.66667 10.9167V10.2583L9.44167 10.0333C8.45879 10.8723 7.20892 11.3333 5.91667 11.3333C4.48008 11.3333 3.10233 10.7627 2.08651 9.74683C1.07068 8.73101 0.5 7.35326 0.5 5.91667C0.5 4.48008 1.07068 3.10233 2.08651 2.08651C3.10233 1.07068 4.48008 0.5 5.91667 0.5ZM5.91667 2.16667C3.83333 2.16667 2.16667 3.83333 2.16667 5.91667C2.16667 8 3.83333 9.66667 5.91667 9.66667C8 9.66667 9.66667 8 9.66667 5.91667C9.66667 3.83333 8 2.16667 5.91667 2.16667Z" fill="#141B38"/></svg>',
191
- 'rightAngle' => '<svg width="7" height="11" viewBox="0 0 5 8" fill="#000" xmlns="http://www.w3.org/2000/svg"><path d="M1.00006 0L0.0600586 0.94L3.11339 4L0.0600586 7.06L1.00006 8L5.00006 4L1.00006 0Z" fill="#000"/></svg>',
192
- 'linkIcon' => '<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.166626 10.6583L8.99163 1.83329H3.49996V0.166626H11.8333V8.49996H10.1666V3.00829L1.34163 11.8333L0.166626 10.6583Z" fill="#141B38"/></svg>',
193
- 'plusIcon' => '<svg width="13" height="12" viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.0832 6.83317H7.08317V11.8332H5.4165V6.83317H0.416504V5.1665H5.4165V0.166504H7.08317V5.1665H12.0832V6.83317Z" fill="white"/></>',
194
- 'loaderSVG' => '<svg version="1.1" id="loader-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="20px" height="20px" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve"><path fill="#fff" d="M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z"><animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="0.6s" repeatCount="indefinite"/></path></svg>',
195
- 'checkmarkSVG' => '<svg width="13" height="10" viewBox="0 0 13 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.13112 6.88917L11.4951 0.525204L12.9093 1.93942L5.13112 9.71759L0.888482 5.47495L2.3027 4.06074L5.13112 6.88917Z" fill="#8C8F9A"/></svg>',
196
- 'forum' => '<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M19.8335 14V3.50004C19.8335 3.19062 19.7106 2.89388 19.4918 2.67508C19.273 2.45629 18.9762 2.33337 18.6668 2.33337H3.50016C3.19074 2.33337 2.894 2.45629 2.6752 2.67508C2.45641 2.89388 2.3335 3.19062 2.3335 3.50004V19.8334L7.00016 15.1667H18.6668C18.9762 15.1667 19.273 15.0438 19.4918 14.825C19.7106 14.6062 19.8335 14.3095 19.8335 14ZM24.5002 7.00004H22.1668V17.5H7.00016V19.8334C7.00016 20.1428 7.12308 20.4395 7.34187 20.6583C7.56066 20.8771 7.85741 21 8.16683 21H21.0002L25.6668 25.6667V8.16671C25.6668 7.85729 25.5439 7.56054 25.3251 7.34175C25.1063 7.12296 24.8096 7.00004 24.5002 7.00004Z" fill="#141B38"/></svg>',
197
- 'copy' => '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 1.33334H6C5.26667 1.33334 4.66667 1.93334 4.66667 2.66667V10.6667C4.66667 11.4 5.26667 12 6 12H12C12.7333 12 13.3333 11.4 13.3333 10.6667V2.66667C13.3333 1.93334 12.7333 1.33334 12 1.33334ZM12 10.6667H6V2.66667H12V10.6667ZM2 10V8.66667H3.33333V10H2ZM2 6.33334H3.33333V7.66667H2V6.33334ZM6.66667 13.3333H8V14.6667H6.66667V13.3333ZM2 12.3333V11H3.33333V12.3333H2ZM3.33333 14.6667C2.6 14.6667 2 14.0667 2 13.3333H3.33333V14.6667ZM5.66667 14.6667H4.33333V13.3333H5.66667V14.6667ZM9 14.6667V13.3333H10.3333C10.3333 14.0667 9.73333 14.6667 9 14.6667ZM3.33333 4V5.33334H2C2 4.6 2.6 4 3.33333 4Z" fill="#141B38"/></svg>',
198
- 'downAngle' => '<svg width="8" height="6" viewBox="0 0 8 6" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.94 0.226685L4 3.28002L7.06 0.226685L8 1.16668L4 5.16668L0 1.16668L0.94 0.226685Z" fill="#141B38"/></svg>',
199
- 'exportSVG' => '<svg class="btn-icon" width="12" height="15" viewBox="0 0 12 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.166748 14.6667H11.8334V13H0.166748V14.6667ZM11.8334 5.5H8.50008V0.5H3.50008V5.5H0.166748L6.00008 11.3333L11.8334 5.5Z" fill="#141B38"/></svg>',
200
- ),
201
- 'images' => array(
202
- 'supportMembers' => SBI_PLUGIN_URL . 'admin/assets/img/support-members.png',
203
- ),
204
- 'articles' => array(
205
- 'gettingStarted' => array(
206
- array(
207
- 'title' => __( 'Creating your first Instagram feed', 'instagram-feed' ),
208
- 'link' => 'https://smashballoon.com/doc/setting-up-the-instagram-feed-pro-wordpress-plugin/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Creating your first Instagram feed',
209
- ),
210
- array(
211
- 'title' => __( 'Instagram Business Profiles (required for Hashtag and Tagged feeds)', 'instagram-feed' ),
212
- 'link' => 'https://smashballoon.com/doc/instagram-business-profiles/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Instagram Business Profiles',
213
- ),
214
- array(
215
- 'title' => __( 'Multiple User Accounts in One Feed', 'instagram-feed' ),
216
- 'link' => 'https://smashballoon.com/doc/displaying-photos-multiple-ids-hashtags-feed/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Multiple Users',
217
- ),
218
- ),
219
- 'docs' => array(
220
- array(
221
- 'title' => __( 'Displaying Instagram Hashtag Feeds', 'instagram-feed' ),
222
- 'link' => 'https://smashballoon.com/doc/displaying-an-instagram-hashtag-feed-on-your-website/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Displaying an Instagram Hashtag Feed',
223
- ),
224
- array(
225
- 'title' => __( 'How to Resolve Error Messages', 'instagram-feed' ),
226
- 'link' => 'https://smashballoon.com/doc/instagram-api-error-message-reference/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Instagram resolving error messages',
227
- ),
228
- array(
229
- 'title' => __( 'My Feed Stopped Working or is Empty', 'instagram-feed' ),
230
- 'link' => 'https://smashballoon.com/doc/my-photos-wont-load/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=My feed stopped working',
231
- ),
232
- ),
233
- 'resources' => array(
234
- array(
235
- 'title' => __( 'Differences Between an Instagram Personal and Business Account', 'instagram-feed' ),
236
- 'link' => 'https://smashballoon.com/doc/differences-between-an-instagram-personal-and-business-account/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Differences between a business and personal account',
237
- ),
238
- array(
239
- 'title' => __( 'Display Posts With a Specific Hashtag From a Specific User Account', 'instagram-feed' ),
240
- 'link' => 'https://smashballoon.com/doc/can-display-photos-specific-hashtag-specific-user-id/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Display a specific hashtag from a specific account',
241
- ),
242
- array(
243
- 'title' => __( 'Reauthorizing our Instagram/Facebook App', 'instagram-feed' ),
244
- 'link' => 'https://smashballoon.com/doc/reauthorizing-our-instagram-facebook-app/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Reauthorizing the Instagram or FB app',
245
- ),
246
- ),
247
- ),
248
- );
249
-
250
- return $return;
251
- }
252
-
253
- /**
254
- * Get System Info
255
- *
256
- * @since 6.0
257
- */
258
- public function get_system_info() {
259
- $output = '';
260
-
261
- // Build the output strings
262
- $output .= self::get_site_n_server_info();
263
- $output .= self::get_active_plugins_info();
264
- $output .= self::get_global_settings_info();
265
- $output .= self::get_feeds_settings_info();
266
- $output .= self::get_sources_info();
267
- $output .= self::get_image_resizing_info();
268
- $output .= self::get_posts_table_info();
269
- $output .= self::get_cron_report();
270
-
271
- $output .= self::get_errors_info();
272
- $output .= self::get_action_logs_info();
273
- $output .= self::get_oembeds_info();
274
-
275
- return $output;
276
- }
277
-
278
- /**
279
- * Get Site and Server Info
280
- *
281
- * @since 6.0
282
- *
283
- * @return string
284
- */
285
- public static function get_site_n_server_info() {
286
- $allow_url_fopen = ini_get( 'allow_url_fopen' ) ? 'Yes' : 'No';
287
- $php_curl = is_callable( 'curl_init' ) ? 'Yes' : 'No';
288
- $php_json_decode = function_exists( 'json_decode' ) ? 'Yes' : 'No';
289
- $php_ssl = in_array( 'https', stream_get_wrappers(), true ) ? 'Yes' : 'No';
290
-
291
- $output = '## SITE/SERVER INFO: ##</br>';
292
- $output .= 'Plugin Version:' . self::get_whitespace( 11 ) . esc_html( SBI_PLUGIN_NAME ) . '</br>';
293
- $output .= 'Site URL:' . self::get_whitespace( 17 ) . esc_html( site_url() ) . '</br>';
294
- $output .= 'Home URL:' . self::get_whitespace( 17 ) . esc_html( home_url() ) . '</br>';
295
- $output .= 'WordPress Version:' . self::get_whitespace( 8 ) . esc_html( get_bloginfo( 'version' ) ) . '</br>';
296
- $output .= 'PHP Version:' . self::get_whitespace( 14 ) . esc_html( PHP_VERSION ) . '</br>';
297
- $output .= 'Web Server Info:' . self::get_whitespace( 10 ) . esc_html( $_SERVER['SERVER_SOFTWARE'] ) . '</br>';
298
- $output .= 'PHP allow_url_fopen:' . self::get_whitespace( 6 ) . esc_html( $allow_url_fopen ) . '</br>';
299
- $output .= 'PHP cURL:' . self::get_whitespace( 17 ) . esc_html( $php_curl ) . '</br>';
300
- $output .= 'JSON:' . self::get_whitespace( 21 ) . esc_html( $php_json_decode ) . '</br>';
301
- $output .= 'SSL Stream:' . self::get_whitespace( 15 ) . esc_html( $php_ssl ) . '</br>';
302
- $output .= '</br>';
303
-
304
- return $output;
305
- }
306
-
307
- /**
308
- * Get Active Plugins
309
- *
310
- * @since 6.0
311
- *
312
- * @return string
313
- */
314
- public static function get_active_plugins_info() {
315
- $plugins = get_plugins();
316
- $active_plugins = get_option( 'active_plugins' );
317
- $output = '## ACTIVE PLUGINS: ## </br>';
318
-
319
- foreach ( $plugins as $plugin_path => $plugin ) {
320
- if ( in_array( $plugin_path, $active_plugins, true ) ) {
321
- $output .= esc_html( $plugin['Name'] ) . ': ' . esc_html( $plugin['Version'] ) . '</br>';
322
- }
323
- }
324
-
325
- $output .= '</br>';
326
-
327
- return $output;
328
- }
329
-
330
- /**
331
- * Get Global Settings
332
- *
333
- * @since 6.0
334
- *
335
- * @return string
336
- */
337
- public static function get_global_settings_info() {
338
- $output = '## GLOBAL SETTINGS: ## </br>';
339
- $sbi_license_key = get_option( 'sbi_license_key' );
340
- $sbi_license_data = get_option( 'sbi_license_data' );
341
- $sbi_license_status = get_option( 'sbi_license_status' );
342
- $sbi_settings = get_option( 'sb_instagram_settings', array() );
343
-
344
- $usage_tracking = get_option(
345
- 'sbi_usage_tracking',
346
- array(
347
- 'last_send' => 0,
348
- 'enabled' => \sbi_is_pro_version(),
349
- )
350
- );
351
-
352
- $output .= 'License key: ';
353
- if ( $sbi_license_key ) {
354
- $output .= esc_html( $sbi_license_key );
355
- } else {
356
- $output .= ' Not added';
357
-
358
- }
359
- $output .= '</br>';
360
- $output .= 'License status: ';
361
- if ( $sbi_license_status ) {
362
- $output .= $sbi_license_status;
363
- } else {
364
- $output .= ' Inactive';
365
- }
366
- $output .= '</br>';
367
- $output .= 'Preserve settings if plugin is removed: ';
368
- $output .= ( $sbi_settings['sb_instagram_preserve_settings'] ) ? 'Yes' : 'No';
369
- $output .= '</br>';
370
- $output .= 'Connected Accounts: ';
371
- $output .= 'Placeholder!';
372
-
373
- $output .= '</br>';
374
- $output .= 'Caching: ';
375
- if ( wp_next_scheduled( 'sbi_feed_update' ) ) {
376
- $time_format = get_option( 'time_format' );
377
- if ( ! $time_format ) {
378
- $time_format = 'g:i a';
379
- }
380
- //
381
- $schedule = wp_get_schedule( 'sbi_feed_update' );
382
- if ( $schedule === '30mins' ) {
383
- $schedule = __( 'every 30 minutes', 'instagram-feed' );
384
- }
385
- if ( $schedule === 'twicedaily' ) {
386
- $schedule = __( 'every 12 hours', 'instagram-feed' );
387
- }
388
- $sbi_next_cron_event = wp_next_scheduled( 'sbi_feed_update' );
389
- $output = __( 'Next check', 'instagram-feed' ) . ': ' . gmdate( $time_format, $sbi_next_cron_event + sbi_get_utc_offset() ) . ' (' . $schedule . ')';
390
-
391
- } else {
392
- $output .= 'Nothing currently scheduled';
393
- }
394
- $output .= '</br>';
395
- $output .= 'GDPR: ';
396
- $output .= isset( $sbi_settings['gdpr'] ) ? $sbi_settings['gdpr'] : ' Not setup';
397
- $output .= '</br>';
398
- $output .= 'Custom CSS: ';
399
- $output .= isset( $sbi_settings['sb_instagram_custom_css'] ) && ! empty( $sbi_settings['sb_instagram_custom_css'] ) ? $sbi_settings['sb_instagram_custom_css'] : 'Empty';
400
- $output .= '</br>';
401
- $output .= 'Custom JS: ';
402
- $output .= isset( $sbi_settings['sb_instagram_custom_js'] ) && ! empty( $sbi_settings['sb_instagram_custom_js'] ) ? $sbi_settings['sb_instagram_custom_js'] : 'Empty';
403
- $output .= '</br>';
404
- $output .= 'Optimize Images: ';
405
- $output .= isset( $sbi_settings['sb_instagram_disable_resize'] ) && ! $sbi_settings['sb_instagram_disable_resize'] ? 'Enabled' : 'Disabled';
406
- $output .= '</br>';
407
- $output .= 'Usage Tracking: ';
408
- $output .= isset( $usage_tracking['enabled'] ) && $usage_tracking['enabled'] === true ? 'Enabled' : 'Disabled';
409
- $output .= '</br>';
410
- $output .= 'AJAX theme loading fix: ';
411
- $output .= isset( $sbi_settings['sb_instagram_ajax_theme'] ) && $sbi_settings['sb_instagram_ajax_theme'] ? 'Enabled' : 'Disabled';
412
- $output .= '</br>';
413
- $output .= 'AJAX Initial: ';
414
- $output .= isset( $sbi_settings['sb_ajax_initial'] ) && $sbi_settings['sb_ajax_initial'] === true ? 'Enabled' : 'Disabled';
415
- $output .= '</br>';
416
- $output .= 'Enqueue in Head: ';
417
- $output .= isset( $sbi_settings['enqueue_js_in_head'] ) && $sbi_settings['enqueue_js_in_head'] === true ? 'Enabled' : 'Disabled';
418
- $output .= '</br>';
419
- $output .= 'Enqueue in Shortcode: ';
420
- $output .= isset( $sbi_settings['enqueue_css_in_shortcode'] ) && $sbi_settings['enqueue_css_in_shortcode'] === true ? 'Enabled' : 'Disabled';
421
- $output .= '</br>';
422
- $output .= 'Enable JS Image: ';
423
- $output .= isset( $sbi_settings['disable_js_image_loading'] ) && $sbi_settings['disable_js_image_loading'] === false ? 'Enabled' : 'Disabled';
424
- $output .= '</br>';
425
- $output .= 'Admin Error Notice: ';
426
- $output .= isset( $sbi_settings['disable_admin_notice'] ) && $sbi_settings['disable_admin_notice'] === false ? 'Enabled' : 'Disabled';
427
- $output .= '</br>';
428
- $output .= 'Feed Issue Email Reports: ';
429
- $output .= isset( $sbi_settings['enable_email_report'] ) && $sbi_settings['enable_email_report'] === true ? 'Enabled' : 'Disabled';
430
- $output .= '</br>';
431
- $output .= 'Email notification: ';
432
- $output .= isset( $sbi_settings['email_notification'] ) && $sbi_settings['email_notification'] !== null ? ucfirst( $sbi_settings['email_notification'] ) : 'Off';
433
- $output .= '</br>';
434
- $output .= 'Email notification addresses: ';
435
- $output .= isset( $sbi_settings['email_notification_addresses'] ) && ! empty( $sbi_settings['email_notification_addresses'] ) ? sanitize_email( $sbi_settings['email_notification_addresses'] ) : 'Not available';
436
- $output .= '</br>';
437
- $output .= '</br>';
438
- return $output;
439
- }
440
-
441
- /**
442
- * Get Feeds Settings
443
- *
444
- * @since 6.0
445
- *
446
- * @return string
447
- */
448
- public static function get_feeds_settings_info() {
449
- $output = '## FEEDS: ## </br>';
450
-
451
- $feeds_list = SBI_Feed_Builder::get_feed_list();
452
- $source_list = SBI_Feed_Builder::get_source_list();
453
- $manager = new \SB_Instagram_Data_Manager();
454
-
455
- $i = 0;
456
- foreach ( $feeds_list as $feed ) {
457
-
458
- $type = ! empty( $feed['settings']['type'] ) ? $feed['settings']['type'] : 'user';
459
- if ( $i >= 25 ) {
460
- break;
461
- }
462
- $output .= $feed['feed_name'];
463
- if ( isset( $feed['settings'] ) ) {
464
- $output .= ' - ' . ucfirst( $type );
465
- $output .= '</br>';
466
- if ( ! empty( $feed['settings']['sources'] ) ) {
467
- foreach ( $feed['settings']['sources'] as $id => $source ) {
468
- $output .= esc_html( $source['username'] );
469
- $output .= ' (' . esc_html( $id ) . ')';
470
- $output .= '</br>';
471
- $output .= esc_html( $manager->remote_encrypt( $source['access_token'] ) );
472
- }
473
- }
474
- }
475
- $output .= '</br>';
476
- if ( isset( $feed['location_summary'] ) && count( $feed['location_summary'] ) > 0 ) {
477
- $first_feed = $feed['location_summary'][0];
478
- if ( ! empty( $first_feed['link'] ) ) {
479
- $output .= esc_html( $first_feed['link'] ) . '?sb_debug';
480
- $output .= '</br>';
481
- }
482
- }
483
-
484
- if ( $i < ( count( $feeds_list ) - 1 ) ) {
485
- $output .= '</br>';
486
- }
487
- $i++;
488
- }
489
- $output .= '</br>';
490
-
491
- return $output;
492
- }
493
-
494
- /**
495
- * Get Feeds Settings
496
- *
497
- * @since 6.0
498
- *
499
- * @return string
500
- */
501
- public static function get_sources_info() {
502
- $output = '## Sources: ## </br>';
503
-
504
- $source_list = SBI_Feed_Builder::get_source_list();
505
- $manager = new \SB_Instagram_Data_Manager();
506
-
507
- foreach ( $source_list as $source ) {
508
-
509
- $output .= $source['account_id'];
510
- $output .= '</br>';
511
- $output .= 'Type: ' . esc_html( $source['account_type'] );
512
- $output .= '</br>';
513
- $output .= 'Username: ' . esc_html( $source['username'] );
514
- $output .= '</br>';
515
- $output .= 'Error: ' . esc_html( $source['error'] );
516
- $output .= '</br>';
517
- $output .= esc_html( $manager->remote_encrypt( $source['access_token'] ) );
518
- $output .= '</br>';
519
- $output .= '</br>';
520
-
521
- }
522
- $output .= '</br>';
523
-
524
- return $output;
525
- }
526
-
527
- /**
528
- * Get Reports
529
- *
530
- * @since 6.0
531
- *
532
- * @return string
533
- */
534
- public static function get_cron_report() {
535
- $output = '## Cron Cache Report: ## </br>';
536
- $cron_report = get_option( 'sbi_cron_report', array() );
537
- if ( ! empty( $cron_report ) ) {
538
- $output .= 'Time Ran: ' . esc_html( $cron_report['notes']['time_ran'] );
539
- $output .= "</br>";
540
- $output .= 'Found Feeds: ' . esc_html( $cron_report['notes']['num_found_transients'] );
541
- $output .= "</br>";
542
- $output .= "</br>";
543
-
544
- foreach ( $cron_report as $key => $value ) {
545
- if ( $key !== 'notes' ) {
546
- $output .= esc_html( $key ) . ':';
547
- $output .= "</br>";
548
- if ( ! empty( $value['last_retrieve'] ) ) {
549
- $output .= 'Last Retrieve: ' . esc_html( $value['last_retrieve'] );
550
- $output .= "</br>";
551
- }
552
- $output .= 'Did Update: ' . esc_html( $value['did_update'] );
553
- $output .= "</br>";
554
- $output .= "</br>";
555
- }
556
-
557
- }
558
-
559
- } else {
560
- $output .= "</br>";
561
- }
562
-
563
- $cron = _get_cron_array();
564
- foreach ( $cron as $key => $data ) {
565
- $is_target = false;
566
- foreach ( $data as $key2 => $val ) {
567
- if ( strpos( $key2, 'sbi' ) !== false || strpos( $key2, 'sb_instagram' ) !== false ) {
568
- $is_target = true;
569
- $output .= esc_html( $key2 );
570
- $output .= "</br>";
571
- }
572
- }
573
- if ( $is_target ) {
574
- $output .= esc_html( date( 'Y-m-d H:i:s', $key ) );
575
- $output .= "</br>";
576
- $output .= esc_html( 'Next Scheduled: ' . round( ( (int) $key - time() ) / 60 ) . ' minutes' );
577
- $output .= "</br>";
578
- $output .= "</br>";
579
- }
580
- }
581
-
582
- return $output;
583
- }
584
-
585
- /**
586
- * Get Image Resizing Info
587
- *
588
- * @since 6.0
589
- *
590
- * @return string
591
- */
592
- public static function get_image_resizing_info() {
593
- $output = '## IMAGE RESIZING: ##</br>';
594
-
595
- $upload = wp_upload_dir();
596
- $upload_dir = $upload['basedir'];
597
- $upload_dir = trailingslashit( $upload_dir ) . SBI_UPLOADS_NAME;
598
- if ( file_exists( $upload_dir ) ) {
599
- $output .= 'upload directory exists</br>';
600
- } else {
601
- $created = wp_mkdir_p( $upload_dir );
602
- if ( ! $created ) {
603
- $output .= 'cannot create upload directory';
604
- }
605
- }
606
- $output .= '</br>';
607
-
608
- return $output;
609
- }
610
-
611
- /**
612
- * Get Posts Table Info
613
- *
614
- * @since 6.0
615
- *
616
- * @return string
617
- */
618
- public static function get_posts_table_info() {
619
- $output = '## POSTS: ## </br>';
620
-
621
- global $wpdb;
622
- $table_name = $wpdb->prefix . SBI_INSTAGRAM_POSTS_TYPE;
623
- $feeds_posts_table_name = $wpdb->prefix . SBI_INSTAGRAM_FEEDS_POSTS;
624
-
625
- if ( $wpdb->get_var( "show tables like '$feeds_posts_table_name'" ) !== $feeds_posts_table_name ) {
626
- $output .= 'no feeds posts table</br>';
627
- } else {
628
- $last_result = $wpdb->get_results( "SELECT * FROM $feeds_posts_table_name ORDER BY id DESC LIMIT 1;" );
629
- if ( is_array( $last_result ) && isset( $last_result[0] ) ) {
630
- $output .= '## FEEDS POSTS TABLE ##</br>';
631
- foreach ( $last_result as $column ) {
632
- foreach ( $column as $key => $value ) {
633
- $output .= esc_html( $key ) . ': ' . esc_html( $value ) . '</br>';
634
-
635
- }
636
- }
637
- } else {
638
- $output .= 'feeds posts has no rows';
639
- $output .= '</br>';
640
- }
641
- }
642
- $output .= '</br>';
643
- if ( $wpdb->get_var( "show tables like '$table_name'" ) !== $table_name ) {
644
- $output .= 'no posts table</br>';
645
- } else {
646
- $last_result = $wpdb->get_results( "SELECT * FROM $table_name ORDER BY id DESC LIMIT 1;" );
647
- if ( is_array( $last_result ) && isset( $last_result[0] ) ) {
648
- $output .= '## POSTS TABLE ##';
649
- $output .= '</br>';
650
- foreach ( $last_result as $column ) {
651
- foreach ( $column as $key => $value ) {
652
- $output .= esc_html( $key ) . ': ' . esc_html( $value ) . '</br>';
653
-
654
- }
655
- }
656
- } else {
657
- $output .= 'posts has no rows</br>';
658
- }
659
- }
660
- $output .= '</br>';
661
-
662
- return $output;
663
- }
664
-
665
- /**
666
- * SBI Get Errors Info
667
- *
668
- * @since 6.0
669
- *
670
- * @return string
671
- */
672
- public static function get_errors_info() {
673
- $output = '## ERRORS: ##</br>';
674
- global $sb_instagram_posts_manager;
675
-
676
- $errors = $sb_instagram_posts_manager->get_errors();
677
- if ( ! empty( $errors['resizing'] ) ) :
678
- $output .= '* Resizing *</br>';
679
- $output .= esc_html( $errors['resizing'] ) . '</br>';
680
- endif;
681
- if ( ! empty( $errors['database_create'] ) ) :
682
- $output .= '* Database Create *</br>';
683
- $output .= esc_html( $errors['database_create'] ) . '</br>';
684
- endif;
685
- if ( ! empty( $errors['upload_dir'] ) ) :
686
- $output .= '* Uploads Directory *</br>';
687
- $output .= esc_html( $errors['upload_dir'] ) . '</br>';
688
- endif;
689
- if ( ! empty( $errors['connection'] ) ) :
690
- $output .= '* API/WP_HTTP Request *</br>';
691
- if ( is_array( $errors['connection'] ) ) {
692
- foreach ( $errors['connection'] as $con_error ) {
693
- if ( is_array( $con_error ) ) {
694
- foreach ( $con_error as $subcon_error ) {
695
- $output .= esc_html( $subcon_error ) . '</br>';
696
- }
697
- } else {
698
- $output .= esc_html( $con_error ) . '</br>';
699
- }
700
- }
701
- } else {
702
- $output .= esc_html( $errors['connection'] );
703
- }
704
- endif;
705
- $output .= '</br>';
706
-
707
- return $output;
708
- }
709
-
710
- /**
711
- * Get Action Logs Info
712
- *
713
- * @since 6.0
714
- *
715
- * @return string
716
- */
717
- public static function get_action_logs_info() {
718
- $output = '## ACTION LOG ##</br>';
719
- global $sb_instagram_posts_manager;
720
-
721
- $actions = $sb_instagram_posts_manager->get_action_log();
722
- if ( ! empty( $actions ) ) :
723
- foreach ( $actions as $action ) :
724
- $output .= strip_tags( $action ) . '</br>';
725
- endforeach;
726
- endif;
727
- $output .= '</br>';
728
-
729
- return $output;
730
- }
731
-
732
- /**
733
- * Get Feeds Settings
734
- *
735
- * @since 6.0
736
- *
737
- * @return string
738
- */
739
- public static function get_oembeds_info() {
740
- $output = '## OEMBED: ##</br>';
741
- $oembed_token_settings = get_option( 'sbi_oembed_token', array() );
742
- foreach ( $oembed_token_settings as $key => $value ) {
743
- if ( $key === 'access_token' ) {
744
- $manager = new \SB_Instagram_Data_Manager();
745
-
746
- $output .= esc_html( $key ) . ': ' . esc_html( $manager->remote_encrypt( $value ) ) . '</br>';
747
- } else {
748
- $output .= esc_html( $key ) . ': ' . esc_html( $value ) . '</br>';
749
- }
750
- }
751
-
752
- return $output;
753
- }
754
-
755
- /**
756
- * SBI Get Support URL
757
- *
758
- * @since 6.0
759
- *
760
- * @return string $url
761
- */
762
- public function get_support_url() {
763
- $url = 'https://smashballoon.com/instagram-feed/support/';
764
- $license_type = sbi_is_pro_version() ? 'pro' : 'free';
765
-
766
- $args = array();
767
- $license_key = get_option( 'sbi_license_key' );
768
- if ( $license_key ) {
769
- $license_key = sbi_encrypt_decrypt( 'encrypt', $license_key );
770
- $args['license'] = $license_key;
771
- }
772
-
773
- $args['license_type'] = $license_type;
774
- $args['version'] = SBIVER;
775
- $url = add_query_arg( $args, $url );
776
- return $url;
777
- }
778
-
779
- /**
780
- * SBI Get Whitespace
781
- *
782
- * @since 6.0
783
- *
784
- * @param int $times
785
- *
786
- * @return string
787
- */
788
- public static function get_whitespace( $times ) {
789
- return str_repeat( '&nbsp;', $times );
790
- }
791
-
792
- /**
793
- * Extensions Manager Page View Template
794
- *
795
- * @since 6.0
796
- */
797
- public function support_page() {
798
- SBI_View::render( 'support.index' );
799
- }
800
- }
1
+ <?php
2
+
3
+ /**
4
+ * The Settings Page
5
+ *
6
+ * @since 6.0
7
+ */
8
+
9
+ namespace InstagramFeed\Admin;
10
+
11
+ if ( ! defined( 'ABSPATH' ) ) {
12
+ exit; // Exit if accessed directly
13
+ }
14
+
15
+ use InstagramFeed\SBI_View;
16
+ use InstagramFeed\Builder\SBI_Db;
17
+ use InstagramFeed\Builder\SBI_Feed_Builder;
18
+
19
+ class SBI_Support {
20
+ /**
21
+ * Admin menu page slug.
22
+ *
23
+ * @since 6.0
24
+ *
25
+ * @var string
26
+ */
27
+ const SLUG = 'sbi-support';
28
+
29
+ /**
30
+ * Initializing the class
31
+ *
32
+ * @since 6.0
33
+ */
34
+ public function __construct() {
35
+ $this->init();
36
+ }
37
+
38
+ /**
39
+ * Determining if the user is viewing the our page, if so, party on.
40
+ *
41
+ * @since 6.0
42
+ */
43
+ public function init() {
44
+ if ( ! is_admin() ) {
45
+ return;
46
+ }
47
+
48
+ add_action( 'admin_menu', array( $this, 'register_menu' ) );
49
+ }
50
+
51
+ /**
52
+ * Register Menu.
53
+ *
54
+ * @since 6.0
55
+ */
56
+ public function register_menu() {
57
+ $cap = current_user_can( 'manage_instagram_feed_options' ) ? 'manage_instagram_feed_options' : 'manage_options';
58
+ $cap = apply_filters( 'sbi_settings_pages_capability', $cap );
59
+ $support_page = add_submenu_page(
60
+ 'sb-instagram-feed',
61
+ __( 'Support', 'instagram-feed' ),
62
+ __( 'Support', 'instagram-feed' ),
63
+ $cap,
64
+ self::SLUG,
65
+ array( $this, 'support_page' ),
66
+ 4
67
+ );
68
+ add_action( 'load-' . $support_page, array( $this, 'support_page_enqueue_assets' ) );
69
+ }
70
+
71
+ /**
72
+ * Enqueue Extension CSS & Script.
73
+ *
74
+ * Loads only for Extension page
75
+ *
76
+ * @since 6.0
77
+ */
78
+ public function support_page_enqueue_assets() {
79
+ if ( ! get_current_screen() ) {
80
+ return;
81
+ }
82
+ $screen = get_current_screen();
83
+
84
+ if ( strpos( $screen->id, 'sbi-support' ) === false) {
85
+ return;
86
+ }
87
+
88
+ wp_enqueue_style(
89
+ 'sbi-fira-code-font',
90
+ 'https://fonts.googleapis.com/css2?family=Fira+Code&display=swap',
91
+ false,
92
+ SBIVER
93
+ );
94
+
95
+ wp_enqueue_style(
96
+ 'support-style',
97
+ SBI_PLUGIN_URL . 'admin/assets/css/support.css',
98
+ false,
99
+ SBIVER
100
+ );
101
+
102
+ wp_enqueue_script(
103
+ 'vue-main',
104
+ 'https://cdn.jsdelivr.net/npm/vue@2.6.12',
105
+ null,
106
+ '2.6.12',
107
+ true
108
+ );
109
+
110
+ wp_enqueue_script(
111
+ 'support-app',
112
+ SBI_PLUGIN_URL . 'admin/assets/js/support.js',
113
+ null,
114
+ SBIVER,
115
+ true
116
+ );
117
+
118
+ $sbi_support = $this->page_data();
119
+
120
+ wp_localize_script(
121
+ 'support-app',
122
+ 'sbi_support',
123
+ $sbi_support
124
+ );
125
+ }
126
+
127
+ /**
128
+ * Page Data to use in front end
129
+ *
130
+ * @since 6.0
131
+ *
132
+ * @return array
133
+ */
134
+ public function page_data() {
135
+ $exported_feeds = SBI_Db::feeds_query();
136
+ $feeds = array();
137
+ foreach ( $exported_feeds as $feed_id => $feed ) {
138
+ $feeds[] = array(
139
+ 'id' => $feed['id'],
140
+ 'name' => $feed['feed_name'],
141
+ );
142
+ }
143
+
144
+ $return = array(
145
+ 'admin_url' => admin_url(),
146
+ 'ajax_handler' => admin_url( 'admin-ajax.php' ),
147
+ 'nonce' => wp_create_nonce( 'sbi-admin' ),
148
+ 'links' => \InstagramFeed\Builder\SBI_Feed_Builder::get_links_with_utm(),
149
+ 'supportPageUrl' => admin_url( 'admin.php?page=sbi-support' ),
150
+ 'siteSearchUrl' => 'https://smashballoon.com/search/',
151
+ 'system_info' => $this->get_system_info(),
152
+ 'system_info_n' => str_replace( '</br>', "\n", $this->get_system_info() ),
153
+ 'feeds' => $feeds,
154
+ 'supportUrl' => $this->get_support_url(),
155
+ 'svgIcons' => SBI_Feed_Builder::builder_svg_icons(),
156
+ 'socialWallLinks' => \InstagramFeed\Builder\SBI_Feed_Builder::get_social_wall_links(),
157
+ 'socialWallActivated' => is_plugin_active( 'social-wall/social-wall.php' ),
158
+ 'genericText' => array(
159
+ 'help' => __( 'Help', 'instagram-feed' ),
160
+ 'title' => __( 'Support', 'instagram-feed' ),
161
+ 'gettingStarted' => __( 'Getting Started', 'instagram-feed' ),
162
+ 'someHelpful' => __( 'Some helpful resources to get you started', 'instagram-feed' ),
163
+ 'docsN' => __( 'Docs & Troubleshooting', 'instagram-feed' ),
164
+ 'runInto' => __( 'Run into an issue? Check out our help docs.', 'instagram-feed' ),
165
+ 'additionalR' => __( 'Additional Resources', 'instagram-feed' ),
166
+ 'toHelp' => __( 'To help you get the most out of the plugin', 'instagram-feed' ),
167
+ 'needMore' => __( 'Need more support? We’re here to help.', 'instagram-feed' ),
168
+ 'ourFast' => __( 'Our fast and friendly support team is always happy to help!', 'instagram-feed' ),
169
+ 'systemInfo' => __( 'System Info', 'instagram-feed' ),
170
+ 'exportSettings' => __( 'Export Settings', 'instagram-feed' ),
171
+ 'shareYour' => __( 'Share your plugin settings easily with Support', 'instagram-feed' ),
172
+ 'copiedToClipboard' => __( 'Copied to clipboard', 'instagram-feed' ),
173
+ ),
174
+ 'buttons' => array(
175
+ 'searchDoc' => __( 'Search Documentation', 'instagram-feed' ),
176
+ 'moreHelp' => __( 'More help on Getting started', 'instagram-feed' ),
177
+ 'viewDoc' => __( 'View Documentation', 'instagram-feed' ),
178
+ 'viewBlog' => __( 'View Blog', 'instagram-feed' ),
179
+ 'submitTicket' => __( 'Submit a Support Ticket', 'instagram-feed' ),
180
+ 'copied' => __( 'Copied', 'instagram-feed' ),
181
+ 'copy' => __( 'Copy', 'instagram-feed' ),
182
+ 'export' => __( 'Export', 'instagram-feed' ),
183
+ 'expand' => __( 'Expand', 'instagram-feed' ),
184
+ 'collapse' => __( 'Collapse', 'instagram-feed' ),
185
+ ),
186
+ 'icons' => array(
187
+ 'rocket' => SBI_PLUGIN_URL . 'admin/assets/img/rocket-icon.png',
188
+ 'book' => SBI_PLUGIN_URL . 'admin/assets/img/book-icon.png',
189
+ 'save' => SBI_PLUGIN_URL . 'admin/assets/img/save-plus-icon.png',
190
+ 'magnify' => '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.91667 0.5C7.35326 0.5 8.73101 1.07068 9.74683 2.08651C10.7627 3.10233 11.3333 4.48008 11.3333 5.91667C11.3333 7.25833 10.8417 8.49167 10.0333 9.44167L10.2583 9.66667H10.9167L15.0833 13.8333L13.8333 15.0833L9.66667 10.9167V10.2583L9.44167 10.0333C8.45879 10.8723 7.20892 11.3333 5.91667 11.3333C4.48008 11.3333 3.10233 10.7627 2.08651 9.74683C1.07068 8.73101 0.5 7.35326 0.5 5.91667C0.5 4.48008 1.07068 3.10233 2.08651 2.08651C3.10233 1.07068 4.48008 0.5 5.91667 0.5ZM5.91667 2.16667C3.83333 2.16667 2.16667 3.83333 2.16667 5.91667C2.16667 8 3.83333 9.66667 5.91667 9.66667C8 9.66667 9.66667 8 9.66667 5.91667C9.66667 3.83333 8 2.16667 5.91667 2.16667Z" fill="#141B38"/></svg>',
191
+ 'rightAngle' => '<svg width="7" height="11" viewBox="0 0 5 8" fill="#000" xmlns="http://www.w3.org/2000/svg"><path d="M1.00006 0L0.0600586 0.94L3.11339 4L0.0600586 7.06L1.00006 8L5.00006 4L1.00006 0Z" fill="#000"/></svg>',
192
+ 'linkIcon' => '<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.166626 10.6583L8.99163 1.83329H3.49996V0.166626H11.8333V8.49996H10.1666V3.00829L1.34163 11.8333L0.166626 10.6583Z" fill="#141B38"/></svg>',
193
+ 'plusIcon' => '<svg width="13" height="12" viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.0832 6.83317H7.08317V11.8332H5.4165V6.83317H0.416504V5.1665H5.4165V0.166504H7.08317V5.1665H12.0832V6.83317Z" fill="white"/></>',
194
+ 'loaderSVG' => '<svg version="1.1" id="loader-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="20px" height="20px" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve"><path fill="#fff" d="M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z"><animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="0.6s" repeatCount="indefinite"/></path></svg>',
195
+ 'checkmarkSVG' => '<svg width="13" height="10" viewBox="0 0 13 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.13112 6.88917L11.4951 0.525204L12.9093 1.93942L5.13112 9.71759L0.888482 5.47495L2.3027 4.06074L5.13112 6.88917Z" fill="#8C8F9A"/></svg>',
196
+ 'forum' => '<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M19.8335 14V3.50004C19.8335 3.19062 19.7106 2.89388 19.4918 2.67508C19.273 2.45629 18.9762 2.33337 18.6668 2.33337H3.50016C3.19074 2.33337 2.894 2.45629 2.6752 2.67508C2.45641 2.89388 2.3335 3.19062 2.3335 3.50004V19.8334L7.00016 15.1667H18.6668C18.9762 15.1667 19.273 15.0438 19.4918 14.825C19.7106 14.6062 19.8335 14.3095 19.8335 14ZM24.5002 7.00004H22.1668V17.5H7.00016V19.8334C7.00016 20.1428 7.12308 20.4395 7.34187 20.6583C7.56066 20.8771 7.85741 21 8.16683 21H21.0002L25.6668 25.6667V8.16671C25.6668 7.85729 25.5439 7.56054 25.3251 7.34175C25.1063 7.12296 24.8096 7.00004 24.5002 7.00004Z" fill="#141B38"/></svg>',
197
+ 'copy' => '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 1.33334H6C5.26667 1.33334 4.66667 1.93334 4.66667 2.66667V10.6667C4.66667 11.4 5.26667 12 6 12H12C12.7333 12 13.3333 11.4 13.3333 10.6667V2.66667C13.3333 1.93334 12.7333 1.33334 12 1.33334ZM12 10.6667H6V2.66667H12V10.6667ZM2 10V8.66667H3.33333V10H2ZM2 6.33334H3.33333V7.66667H2V6.33334ZM6.66667 13.3333H8V14.6667H6.66667V13.3333ZM2 12.3333V11H3.33333V12.3333H2ZM3.33333 14.6667C2.6 14.6667 2 14.0667 2 13.3333H3.33333V14.6667ZM5.66667 14.6667H4.33333V13.3333H5.66667V14.6667ZM9 14.6667V13.3333H10.3333C10.3333 14.0667 9.73333 14.6667 9 14.6667ZM3.33333 4V5.33334H2C2 4.6 2.6 4 3.33333 4Z" fill="#141B38"/></svg>',
198
+ 'downAngle' => '<svg width="8" height="6" viewBox="0 0 8 6" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.94 0.226685L4 3.28002L7.06 0.226685L8 1.16668L4 5.16668L0 1.16668L0.94 0.226685Z" fill="#141B38"/></svg>',
199
+ 'exportSVG' => '<svg class="btn-icon" width="12" height="15" viewBox="0 0 12 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.166748 14.6667H11.8334V13H0.166748V14.6667ZM11.8334 5.5H8.50008V0.5H3.50008V5.5H0.166748L6.00008 11.3333L11.8334 5.5Z" fill="#141B38"/></svg>',
200
+ ),
201
+ 'images' => array(
202
+ 'supportMembers' => SBI_PLUGIN_URL . 'admin/assets/img/support-members.png',
203
+ ),
204
+ 'articles' => array(
205
+ 'gettingStarted' => array(
206
+ array(
207
+ 'title' => __( 'Creating your first Instagram feed', 'instagram-feed' ),
208
+ 'link' => 'https://smashballoon.com/doc/setting-up-the-instagram-feed-pro-wordpress-plugin/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Creating your first Instagram feed',
209
+ ),
210
+ array(
211
+ 'title' => __( 'Instagram Business Profiles (required for Hashtag and Tagged feeds)', 'instagram-feed' ),
212
+ 'link' => 'https://smashballoon.com/doc/instagram-business-profiles/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Instagram Business Profiles',
213
+ ),
214
+ array(
215
+ 'title' => __( 'Multiple User Accounts in One Feed', 'instagram-feed' ),
216
+ 'link' => 'https://smashballoon.com/doc/displaying-photos-multiple-ids-hashtags-feed/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Multiple Users',
217
+ ),
218
+ ),
219
+ 'docs' => array(
220
+ array(
221
+ 'title' => __( 'Displaying Instagram Hashtag Feeds', 'instagram-feed' ),
222
+ 'link' => 'https://smashballoon.com/doc/displaying-an-instagram-hashtag-feed-on-your-website/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Displaying an Instagram Hashtag Feed',
223
+ ),
224
+ array(
225
+ 'title' => __( 'How to Resolve Error Messages', 'instagram-feed' ),
226
+ 'link' => 'https://smashballoon.com/doc/instagram-api-error-message-reference/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Instagram resolving error messages',
227
+ ),
228
+ array(
229
+ 'title' => __( 'My Feed Stopped Working or is Empty', 'instagram-feed' ),
230
+ 'link' => 'https://smashballoon.com/doc/my-photos-wont-load/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=My feed stopped working',
231
+ ),
232
+ ),
233
+ 'resources' => array(
234
+ array(
235
+ 'title' => __( 'Differences Between an Instagram Personal and Business Account', 'instagram-feed' ),
236
+ 'link' => 'https://smashballoon.com/doc/differences-between-an-instagram-personal-and-business-account/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Differences between a business and personal account',
237
+ ),
238
+ array(
239
+ 'title' => __( 'Display Posts With a Specific Hashtag From a Specific User Account', 'instagram-feed' ),
240
+ 'link' => 'https://smashballoon.com/doc/can-display-photos-specific-hashtag-specific-user-id/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Display a specific hashtag from a specific account',
241
+ ),
242
+ array(
243
+ 'title' => __( 'Reauthorizing our Instagram/Facebook App', 'instagram-feed' ),
244
+ 'link' => 'https://smashballoon.com/doc/reauthorizing-our-instagram-facebook-app/?utm_campaign=instagram-free&utm_source=support&utm_medium=docs&utm_content=Reauthorizing the Instagram or FB app',
245
+ ),
246
+ ),
247
+ ),
248
+ );
249
+
250
+ return $return;
251
+ }
252
+
253
+ /**
254
+ * Get System Info
255
+ *
256
+ * @since 6.0
257
+ */
258
+ public function get_system_info() {
259
+ $output = '';
260
+
261
+ // Build the output strings
262
+ $output .= self::get_site_n_server_info();
263
+ $output .= self::get_active_plugins_info();
264
+ $output .= self::get_global_settings_info();
265
+ $output .= self::get_feeds_settings_info();
266
+ $output .= self::get_sources_info();
267
+ $output .= self::get_image_resizing_info();
268
+ $output .= self::get_posts_table_info();
269
+ $output .= self::get_cron_report();
270
+
271
+ $output .= self::get_errors_info();
272
+ $output .= self::get_action_logs_info();
273
+ $output .= self::get_oembeds_info();
274
+
275
+ return $output;
276
+ }
277
+
278
+ /**
279
+ * Get Site and Server Info
280
+ *
281
+ * @since 6.0
282
+ *
283
+ * @return string
284
+ */
285
+ public static function get_site_n_server_info() {
286
+ $allow_url_fopen = ini_get( 'allow_url_fopen' ) ? 'Yes' : 'No';
287
+ $php_curl = is_callable( 'curl_init' ) ? 'Yes' : 'No';
288
+ $php_json_decode = function_exists( 'json_decode' ) ? 'Yes' : 'No';
289
+ $php_ssl = in_array( 'https', stream_get_wrappers(), true ) ? 'Yes' : 'No';
290
+
291
+ $output = '## SITE/SERVER INFO: ##</br>';
292
+ $output .= 'Plugin Version:' . self::get_whitespace( 11 ) . esc_html( SBI_PLUGIN_NAME ) . '</br>';
293
+ $output .= 'Site URL:' . self::get_whitespace( 17 ) . esc_html( site_url() ) . '</br>';
294
+ $output .= 'Home URL:' . self::get_whitespace( 17 ) . esc_html( home_url() ) . '</br>';
295
+ $output .= 'WordPress Version:' . self::get_whitespace( 8 ) . esc_html( get_bloginfo( 'version' ) ) . '</br>';
296
+ $output .= 'PHP Version:' . self::get_whitespace( 14 ) . esc_html( PHP_VERSION ) . '</br>';
297
+ $output .= 'Web Server Info:' . self::get_whitespace( 10 ) . esc_html( $_SERVER['SERVER_SOFTWARE'] ) . '</br>';
298
+ $output .= 'PHP allow_url_fopen:' . self::get_whitespace( 6 ) . esc_html( $allow_url_fopen ) . '</br>';
299
+ $output .= 'PHP cURL:' . self::get_whitespace( 17 ) . esc_html( $php_curl ) . '</br>';
300
+ $output .= 'JSON:' . self::get_whitespace( 21 ) . esc_html( $php_json_decode ) . '</br>';
301
+ $output .= 'SSL Stream:' . self::get_whitespace( 15 ) . esc_html( $php_ssl ) . '</br>';
302
+ $output .= '</br>';
303
+
304
+ return $output;
305
+ }
306
+
307
+ /**
308
+ * Get Active Plugins
309
+ *
310
+ * @since 6.0
311
+ *
312
+ * @return string
313
+ */
314
+ public static function get_active_plugins_info() {
315
+ $plugins = get_plugins();
316
+ $active_plugins = get_option( 'active_plugins' );
317
+ $output = '## ACTIVE PLUGINS: ## </br>';
318
+
319
+ foreach ( $plugins as $plugin_path => $plugin ) {
320
+ if ( in_array( $plugin_path, $active_plugins, true ) ) {
321
+ $output .= esc_html( $plugin['Name'] ) . ': ' . esc_html( $plugin['Version'] ) . '</br>';
322
+ }
323
+ }
324
+
325
+ $output .= '</br>';
326
+
327
+ return $output;
328
+ }
329
+
330
+ /**
331
+ * Get Global Settings
332
+ *
333
+ * @since 6.0
334
+ *
335
+ * @return string
336
+ */
337
+ public static function get_global_settings_info() {
338
+ $output = '## GLOBAL SETTINGS: ## </br>';
339
+ $sbi_license_key = get_option( 'sbi_license_key' );
340
+ $sbi_license_data = get_option( 'sbi_license_data' );
341
+ $sbi_license_status = get_option( 'sbi_license_status' );
342
+ $sbi_settings = get_option( 'sb_instagram_settings', array() );
343
+
344
+ $usage_tracking = get_option(
345
+ 'sbi_usage_tracking',
346
+ array(
347
+ 'last_send' => 0,
348
+ 'enabled' => \sbi_is_pro_version(),
349
+ )
350
+ );
351
+
352
+ $output .= 'License key: ';
353
+ if ( $sbi_license_key ) {
354
+ $output .= esc_html( $sbi_license_key );
355
+ } else {
356
+ $output .= ' Not added';
357
+
358
+ }
359
+ $output .= '</br>';
360
+ $output .= 'License status: ';
361
+ if ( $sbi_license_status ) {
362
+ $output .= $sbi_license_status;
363
+ } else {
364
+ $output .= ' Inactive';
365
+ }
366
+ $output .= '</br>';
367
+ $output .= 'Preserve settings if plugin is removed: ';
368
+ $output .= ( $sbi_settings['sb_instagram_preserve_settings'] ) ? 'Yes' : 'No';
369
+ $output .= '</br>';
370
+ $output .= 'Connected Accounts: ';
371
+ $output .= 'Placeholder!';
372
+
373
+ $output .= '</br>';
374
+ $output .= 'Caching: ';
375
+ if ( wp_next_scheduled( 'sbi_feed_update' ) ) {
376
+ $time_format = get_option( 'time_format' );
377
+ if ( ! $time_format ) {
378
+ $time_format = 'g:i a';
379
+ }
380
+ //
381
+ $schedule = wp_get_schedule( 'sbi_feed_update' );
382
+ if ( $schedule === '30mins' ) {
383
+ $schedule = __( 'every 30 minutes', 'instagram-feed' );
384
+ }
385
+ if ( $schedule === 'twicedaily' ) {
386
+ $schedule = __( 'every 12 hours', 'instagram-feed' );
387
+ }
388
+ $sbi_next_cron_event = wp_next_scheduled( 'sbi_feed_update' );
389
+ $output = __( 'Next check', 'instagram-feed' ) . ': ' . gmdate( $time_format, $sbi_next_cron_event + sbi_get_utc_offset() ) . ' (' . $schedule . ')';
390
+
391
+ } else {
392
+ $output .= 'Nothing currently scheduled';
393
+ }
394
+ $output .= '</br>';
395
+ $output .= 'GDPR: ';
396
+ $output .= isset( $sbi_settings['gdpr'] ) ? $sbi_settings['gdpr'] : ' Not setup';
397
+ $output .= '</br>';
398
+ $output .= 'Custom CSS: ';
399
+ $output .= isset( $sbi_settings['sb_instagram_custom_css'] ) && ! empty( $sbi_settings['sb_instagram_custom_css'] ) ? $sbi_settings['sb_instagram_custom_css'] : 'Empty';
400
+ $output .= '</br>';
401
+ $output .= 'Custom JS: ';
402
+ $output .= isset( $sbi_settings['sb_instagram_custom_js'] ) && ! empty( $sbi_settings['sb_instagram_custom_js'] ) ? $sbi_settings['sb_instagram_custom_js'] : 'Empty';
403
+ $output .= '</br>';
404
+ $output .= 'Optimize Images: ';
405
+ $output .= isset( $sbi_settings['sb_instagram_disable_resize'] ) && ! $sbi_settings['sb_instagram_disable_resize'] ? 'Enabled' : 'Disabled';
406
+ $output .= '</br>';
407
+ $output .= 'Usage Tracking: ';
408
+ $output .= isset( $usage_tracking['enabled'] ) && $usage_tracking['enabled'] === true ? 'Enabled' : 'Disabled';
409
+ $output .= '</br>';
410
+ $output .= 'AJAX theme loading fix: ';
411
+ $output .= isset( $sbi_settings['sb_instagram_ajax_theme'] ) && $sbi_settings['sb_instagram_ajax_theme'] ? 'Enabled' : 'Disabled';
412
+ $output .= '</br>';
413
+ $output .= 'AJAX Initial: ';
414
+ $output .= isset( $sbi_settings['sb_ajax_initial'] ) && $sbi_settings['sb_ajax_initial'] === true ? 'Enabled' : 'Disabled';
415
+ $output .= '</br>';
416
+ $output .= 'Enqueue in Head: ';
417
+ $output .= isset( $sbi_settings['enqueue_js_in_head'] ) && $sbi_settings['enqueue_js_in_head'] === true ? 'Enabled' : 'Disabled';
418
+ $output .= '</br>';
419
+ $output .= 'Enqueue in Shortcode: ';
420
+ $output .= isset( $sbi_settings['enqueue_css_in_shortcode'] ) && $sbi_settings['enqueue_css_in_shortcode'] === true ? 'Enabled' : 'Disabled';
421
+ $output .= '</br>';
422
+ $output .= 'Enable JS Image: ';
423
+ $output .= isset( $sbi_settings['disable_js_image_loading'] ) && $sbi_settings['disable_js_image_loading'] === false ? 'Enabled' : 'Disabled';
424
+ $output .= '</br>';
425
+ $output .= 'Admin Error Notice: ';
426
+ $output .= isset( $sbi_settings['disable_admin_notice'] ) && $sbi_settings['disable_admin_notice'] === false ? 'Enabled' : 'Disabled';
427
+ $output .= '</br>';
428
+ $output .= 'Feed Issue Email Reports: ';
429
+ $output .= isset( $sbi_settings['enable_email_report'] ) && $sbi_settings['enable_email_report'] === true ? 'Enabled' : 'Disabled';
430
+ $output .= '</br>';
431
+ $output .= 'Email notification: ';
432
+ $output .= isset( $sbi_settings['email_notification'] ) && $sbi_settings['email_notification'] !== null ? ucfirst( $sbi_settings['email_notification'] ) : 'Off';
433
+ $output .= '</br>';
434
+ $output .= 'Email notification addresses: ';
435
+ $output .= isset( $sbi_settings['email_notification_addresses'] ) && ! empty( $sbi_settings['email_notification_addresses'] ) ? sanitize_email( $sbi_settings['email_notification_addresses'] ) : 'Not available';
436
+ $output .= '</br>';
437
+ $output .= '</br>';
438
+ return $output;
439
+ }
440
+
441
+ /**
442
+ * Get Feeds Settings
443
+ *
444
+ * @since 6.0
445
+ *
446
+ * @return string
447
+ */
448
+ public static function get_feeds_settings_info() {
449
+ $output = '## FEEDS: ## </br>';
450
+
451
+ $feeds_list = SBI_Feed_Builder::get_feed_list();
452
+ $source_list = SBI_Feed_Builder::get_source_list();
453
+ $manager = new \SB_Instagram_Data_Manager();
454
+
455
+ $i = 0;
456
+ foreach ( $feeds_list as $feed ) {
457
+
458
+ $type = ! empty( $feed['settings']['type'] ) ? $feed['settings']['type'] : 'user';
459
+ if ( $i >= 25 ) {
460
+ break;
461
+ }
462
+ $output .= $feed['feed_name'];
463
+ if ( isset( $feed['settings'] ) ) {
464
+ $output .= ' - ' . ucfirst( $type );
465
+ $output .= '</br>';
466
+ if ( ! empty( $feed['settings']['sources'] ) ) {
467
+ foreach ( $feed['settings']['sources'] as $id => $source ) {
468
+ $output .= esc_html( $source['username'] );
469
+ $output .= ' (' . esc_html( $id ) . ')';
470
+ $output .= '</br>';
471
+ $output .= esc_html( $manager->remote_encrypt( $source['access_token'] ) );
472
+ }
473
+ }
474
+ }
475
+ $output .= '</br>';
476
+ if ( isset( $feed['location_summary'] ) && count( $feed['location_summary'] ) > 0 ) {
477
+ $first_feed = $feed['location_summary'][0];
478
+ if ( ! empty( $first_feed['link'] ) ) {
479
+ $output .= esc_html( $first_feed['link'] ) . '?sb_debug';
480
+ $output .= '</br>';
481
+ }
482
+ }
483
+
484
+ if ( $i < ( count( $feeds_list ) - 1 ) ) {
485
+ $output .= '</br>';
486
+ }
487
+ $i++;
488
+ }
489
+ $output .= '</br>';
490
+
491
+ return $output;
492
+ }
493
+
494
+ /**
495
+ * Get Feeds Settings
496
+ *
497
+ * @since 6.0
498
+ *
499
+ * @return string
500
+ */
501
+ public static function get_sources_info() {
502
+ $output = '## Sources: ## </br>';
503
+
504
+ $source_list = SBI_Feed_Builder::get_source_list();
505
+ $manager = new \SB_Instagram_Data_Manager();
506
+
507
+ foreach ( $source_list as $source ) {
508
+
509
+ $output .= $source['account_id'];
510
+ $output .= '</br>';
511
+ $output .= 'Type: ' . esc_html( $source['account_type'] );
512
+ $output .= '</br>';
513
+ $output .= 'Username: ' . esc_html( $source['username'] );
514
+ $output .= '</br>';
515
+ $output .= 'Error: ' . esc_html( $source['error'] );
516
+ $output .= '</br>';
517
+ $output .= esc_html( $manager->remote_encrypt( $source['access_token'] ) );
518
+ $output .= '</br>';
519
+ $output .= '</br>';
520
+
521
+ }
522
+ $output .= '</br>';
523
+
524
+ return $output;
525
+ }
526
+
527
+ /**
528
+ * Get Reports
529
+ *
530
+ * @since 6.0
531
+ *
532
+ * @return string
533
+ */
534
+ public static function get_cron_report() {
535
+ $output = '## Cron Cache Report: ## </br>';
536
+ $cron_report = get_option( 'sbi_cron_report', array() );
537
+ if ( ! empty( $cron_report ) ) {
538
+ $output .= 'Time Ran: ' . esc_html( $cron_report['notes']['time_ran'] );
539
+ $output .= "</br>";
540
+ $output .= 'Found Feeds: ' . esc_html( $cron_report['notes']['num_found_transients'] );
541
+ $output .= "</br>";
542
+ $output .= "</br>";
543
+
544
+ foreach ( $cron_report as $key => $value ) {
545
+ if ( $key !== 'notes' ) {
546
+ $output .= esc_html( $key ) . ':';
547
+ $output .= "</br>";
548
+ if ( ! empty( $value['last_retrieve'] ) ) {
549
+ $output .= 'Last Retrieve: ' . esc_html( $value['last_retrieve'] );
550
+ $output .= "</br>";
551
+ }
552
+ $output .= 'Did Update: ' . esc_html( $value['did_update'] );
553
+ $output .= "</br>";
554
+ $output .= "</br>";
555
+ }
556
+
557
+ }
558
+
559
+ } else {
560
+ $output .= "</br>";
561
+ }
562
+
563
+ $cron = _get_cron_array();
564
+ foreach ( $cron as $key => $data ) {
565
+ $is_target = false;
566
+ foreach ( $data as $key2 => $val ) {
567
+ if ( strpos( $key2, 'sbi' ) !== false || strpos( $key2, 'sb_instagram' ) !== false ) {
568
+ $is_target = true;
569
+ $output .= esc_html( $key2 );
570
+ $output .= "</br>";
571
+ }
572
+ }
573
+ if ( $is_target ) {
574
+ $output .= esc_html( date( 'Y-m-d H:i:s', $key ) );
575
+ $output .= "</br>";
576
+ $output .= esc_html( 'Next Scheduled: ' . round( ( (int) $key - time() ) / 60 ) . ' minutes' );
577
+ $output .= "</br>";
578
+ $output .= "</br>";
579
+ }
580
+ }
581
+
582
+ return $output;
583
+ }
584
+
585
+ /**
586
+ * Get Image Resizing Info
587
+ *
588
+ * @since 6.0
589
+ *
590
+ * @return string
591
+ */
592
+ public static function get_image_resizing_info() {
593
+ $output = '## IMAGE RESIZING: ##</br>';
594
+
595
+ $upload = wp_upload_dir();
596
+ $upload_dir = $upload['basedir'];
597
+ $upload_dir = trailingslashit( $upload_dir ) . SBI_UPLOADS_NAME;
598
+ if ( file_exists( $upload_dir ) ) {
599
+ $output .= 'upload directory exists</br>';
600
+ } else {
601
+ $created = wp_mkdir_p( $upload_dir );
602
+ if ( ! $created ) {
603
+ $output .= 'cannot create upload directory';
604
+ }
605
+ }
606
+ $output .= '</br>';
607
+
608
+ return $output;
609
+ }
610
+
611
+ /**
612
+ * Get Posts Table Info
613
+ *
614
+ * @since 6.0
615
+ *
616
+ * @return string
617
+ */
618
+ public static function get_posts_table_info() {
619
+ $output = '## POSTS: ## </br>';
620
+
621
+ global $wpdb;
622
+ $table_name = $wpdb->prefix . SBI_INSTAGRAM_POSTS_TYPE;
623
+ $feeds_posts_table_name = $wpdb->prefix . SBI_INSTAGRAM_FEEDS_POSTS;
624
+
625
+ if ( $wpdb->get_var( "show tables like '$feeds_posts_table_name'" ) !== $feeds_posts_table_name ) {
626
+ $output .= 'no feeds posts table</br>';
627
+ } else {
628
+ $last_result = $wpdb->get_results( "SELECT * FROM $feeds_posts_table_name ORDER BY id DESC LIMIT 1;" );
629
+ if ( is_array( $last_result ) && isset( $last_result[0] ) ) {
630
+ $output .= '## FEEDS POSTS TABLE ##</br>';
631
+ foreach ( $last_result as $column ) {
632
+ foreach ( $column as $key => $value ) {
633
+ $output .= esc_html( $key ) . ': ' . esc_html( $value ) . '</br>';
634
+
635
+ }
636
+ }
637
+ } else {
638
+ $output .= 'feeds posts has no rows';
639
+ $output .= '</br>';
640
+ }
641
+ }
642
+ $output .= '</br>';
643
+ if ( $wpdb->get_var( "show tables like '$table_name'" ) !== $table_name ) {
644
+ $output .= 'no posts table</br>';
645
+ } else {
646
+ $last_result = $wpdb->get_results( "SELECT * FROM $table_name ORDER BY id DESC LIMIT 1;" );
647
+ if ( is_array( $last_result ) && isset( $last_result[0] ) ) {
648
+ $output .= '## POSTS TABLE ##';
649
+ $output .= '</br>';
650
+ foreach ( $last_result as $column ) {
651
+ foreach ( $column as $key => $value ) {
652
+ $output .= esc_html( $key ) . ': ' . esc_html( $value ) . '</br>';
653
+
654
+ }
655
+ }
656
+ } else {
657
+ $output .= 'posts has no rows</br>';
658
+ }
659
+ }
660
+ $output .= '</br>';
661
+
662
+ return $output;
663
+ }
664
+
665
+ /**
666
+ * SBI Get Errors Info
667
+ *
668
+ * @since 6.0
669
+ *
670
+ * @return string
671
+ */
672
+ public static function get_errors_info() {
673
+ $output = '## ERRORS: ##</br>';
674
+ global $sb_instagram_posts_manager;
675
+
676
+ $errors = $sb_instagram_posts_manager->get_errors();
677
+ if ( ! empty( $errors['resizing'] ) ) :
678
+ $output .= '* Resizing *</br>';
679
+ $output .= esc_html( $errors['resizing'] ) . '</br>';
680
+ endif;
681
+ if ( ! empty( $errors['database_create'] ) ) :
682
+ $output .= '* Database Create *</br>';
683
+ $output .= esc_html( $errors['database_create'] ) . '</br>';
684
+ endif;
685
+ if ( ! empty( $errors['upload_dir'] ) ) :
686
+ $output .= '* Uploads Directory *</br>';
687
+ $output .= esc_html( $errors['upload_dir'] ) . '</br>';
688
+ endif;
689
+ if ( ! empty( $errors['connection'] ) ) :
690
+ $output .= '* API/WP_HTTP Request *</br>';
691
+ if ( is_array( $errors['connection'] ) ) {
692
+ foreach ( $errors['connection'] as $con_error ) {
693
+ if ( is_array( $con_error ) ) {
694
+ foreach ( $con_error as $subcon_error ) {
695
+ $output .= esc_html( $subcon_error ) . '</br>';
696
+ }
697
+ } else {
698
+ $output .= esc_html( $con_error ) . '</br>';
699
+ }
700
+ }
701
+ } else {
702
+ $output .= esc_html( $errors['connection'] );
703
+ }
704
+ endif;
705
+ $output .= '</br>';
706
+
707
+ return $output;
708
+ }
709
+
710
+ /**
711
+ * Get Action Logs Info
712
+ *
713
+ * @since 6.0
714
+ *
715
+ * @return string
716
+ */
717
+ public static function get_action_logs_info() {
718
+ $output = '## ACTION LOG ##</br>';
719
+ global $sb_instagram_posts_manager;
720
+
721
+ $actions = $sb_instagram_posts_manager->get_action_log();
722
+ if ( ! empty( $actions ) ) :
723
+ foreach ( $actions as $action ) :
724
+ $output .= strip_tags( $action ) . '</br>';
725
+ endforeach;
726
+ endif;
727
+ $output .= '</br>';
728
+
729
+ return $output;
730
+ }
731
+
732
+ /**
733
+ * Get Feeds Settings
734
+ *
735
+ * @since 6.0
736
+ *
737
+ * @return string
738
+ */
739
+ public static function get_oembeds_info() {
740
+ $output = '## OEMBED: ##</br>';
741
+ $oembed_token_settings = get_option( 'sbi_oembed_token', array() );
742
+ foreach ( $oembed_token_settings as $key => $value ) {
743
+ if ( $key === 'access_token' ) {
744
+ $manager = new \SB_Instagram_Data_Manager();
745
+
746
+ $output .= esc_html( $key ) . ': ' . esc_html( $manager->remote_encrypt( $value ) ) . '</br>';
747
+ } else {
748
+ $output .= esc_html( $key ) . ': ' . esc_html( $value ) . '</br>';
749
+ }
750
+ }
751
+
752
+ return $output;
753
+ }
754
+
755
+ /**
756
+ * SBI Get Support URL
757
+ *
758
+ * @since 6.0
759
+ *
760
+ * @return string $url
761
+ */
762
+ public function get_support_url() {
763
+ $url = 'https://smashballoon.com/instagram-feed/support/';
764
+ $license_type = sbi_is_pro_version() ? 'pro' : 'free';
765
+
766
+ $args = array();
767
+ $license_key = get_option( 'sbi_license_key' );
768
+ if ( $license_key ) {
769
+ $license_key = sbi_encrypt_decrypt( 'encrypt', $license_key );
770
+ $args['license'] = $license_key;
771
+ }
772
+
773
+ $args['license_type'] = $license_type;
774
+ $args['version'] = SBIVER;
775
+ $url = add_query_arg( $args, $url );
776
+ return $url;
777
+ }
778
+
779
+ /**
780
+ * SBI Get Whitespace
781
+ *
782
+ * @since 6.0
783
+ *
784
+ * @param int $times
785
+ *
786
+ * @return string
787
+ */
788
+ public static function get_whitespace( $times ) {
789
+ return str_repeat( '&nbsp;', $times );
790
+ }
791
+
792
+ /**
793
+ * Extensions Manager Page View Template
794
+ *
795
+ * @since 6.0
796
+ */
797
+ public function support_page() {
798
+ SBI_View::render( 'support.index' );
799
+ }
800
+ }
admin/SBI_Upgrader.php CHANGED
@@ -1,384 +1,384 @@
1
- <?php
2
- /**
3
- * Upgrade to the Pro version
4
- *
5
- * @since 4.0
6
- */
7
-
8
- namespace InstagramFeed\Admin;
9
-
10
- class SBI_Upgrader {
11
-
12
- /**
13
- * URL where licensing is done
14
- */
15
- const STORE_URL = 'https://smashballoon.com/';
16
-
17
- /**
18
- * URL to connect to Smash Balloon App and upgrade to Pro
19
- */
20
- const UPGRADE_URL = 'https://connect.smashballoon.com/activate/index.php';
21
-
22
- /**
23
- * Check the license key URL
24
- */
25
- const CHECK_URL = 'https://connect.smashballoon.com/activate/check.php';
26
-
27
- const NAME = 'instagram';
28
-
29
- const SLUG = 'instagram-feed-pro/instagram-feed.php';
30
-
31
- const REDIRECT = 'sbi-settings';
32
-
33
- const INSTALL_INSTRUCTIONS = 'https://smashballoon.com/doc/setting-up-the-instagram-feed-pro-wordpress-plugin/?instagram';
34
-
35
-
36
- /**
37
- * AJAX hooks for creating the redirect
38
- *
39
- * @since 4.0
40
- */
41
- public static function hooks() {
42
- add_action( 'wp_ajax_nopriv_sbi_run_one_click_upgrade', array( 'InstagramFeed\Admin\SBI_Upgrader', 'install_upgrade' ) );
43
- add_action( 'wp_ajax_sbi_maybe_upgrade_redirect', array( 'InstagramFeed\Admin\SBI_Upgrader', 'maybe_upgrade_redirect' ) );
44
- }
45
-
46
- /**
47
- * Connect to licensing API to get download URL for Pro version
48
- *
49
- * @param $license_data
50
- *
51
- * @return bool|mixed|null
52
- *
53
- * @since 4.0
54
- */
55
- public static function get_version_info( $license_data ) {
56
- $api_params = array(
57
- 'edd_action' => 'get_version',
58
- 'license' => $license_data['key'],
59
- 'item_name' => isset( $license_data['item_name'] ) ? $license_data['item_name'] : false,
60
- 'item_id' => isset( $license_data['item_id'] ) ? $license_data['item_id'] : false,
61
- 'version' => '0',
62
- 'slug' => self::SLUG,
63
- 'author' => 'SmashBalloon',
64
- 'url' => home_url(),
65
- 'beta' => false,
66
- );
67
-
68
- $api_url = trailingslashit( self::STORE_URL );
69
-
70
- $request = wp_remote_post( $api_url, array( 'timeout' => 15, 'sslverify' => true, 'body' => $api_params ) );
71
-
72
- if ( ! is_wp_error( $request ) ) {
73
- $version_info = json_decode( wp_remote_retrieve_body( $request ) );
74
- return $version_info;
75
- }
76
-
77
- return false;
78
- }
79
-
80
- /**
81
- * Ajax handler for grabbing the upgrade url.
82
- *
83
- * @since 4.0
84
- */
85
- public static function maybe_upgrade_redirect() {
86
- $home_url = home_url();
87
- check_ajax_referer( 'sbi_admin_nonce' , 'nonce');
88
-
89
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
90
- wp_send_json_error();
91
- }
92
-
93
- // Check for permissions.
94
- if ( ! current_user_can( 'install_plugins' ) ) {
95
- wp_send_json_error( array( 'message' => esc_html__( 'You are not allowed to install plugins.', 'instagram-feed' ) ) );
96
- }
97
- if ( SBI_Upgrader::is_dev_url( home_url() ) ) {
98
- wp_send_json_success( array(
99
- 'url' => self::INSTALL_INSTRUCTIONS,
100
- ) );
101
- }
102
- // Check license key.
103
- $license = ! empty( $_POST['license_key'] ) ? sanitize_key( $_POST['license_key'] ) : '';
104
- if ( empty( $license ) ) {
105
- wp_send_json_error( array( 'message' => esc_html__( 'You are not licensed.', 'instagram-feed' ) ) );
106
- }
107
-
108
- $args = array(
109
- 'plugin_name' => self::NAME,
110
- 'plugin_slug' => 'pro',
111
- 'plugin_path' => plugin_basename( __FILE__ ),
112
- 'plugin_url' => trailingslashit( WP_PLUGIN_URL ) . 'pro',
113
- 'home_url' => $home_url,
114
- 'version' => '1.0',
115
- 'key' => $license,
116
- );
117
- $url = add_query_arg( $args, self::CHECK_URL );
118
-
119
- $remote_request_args = array(
120
- 'timeout' => '20',
121
- );
122
-
123
- $response = wp_remote_get( $url, $remote_request_args );
124
-
125
- if ( ! is_wp_error( $response ) ) {
126
- $body = wp_remote_retrieve_body( $response );
127
-
128
- $check_key_response = json_decode( $body, true );
129
-
130
- if ( empty( $check_key_response['license_data'] ) ) {
131
-
132
- wp_send_json_error( array(
133
- 'message' => esc_html( SBI_Upgrader::get_error_message( $check_key_response ) ),
134
- ) );
135
- }
136
-
137
- if ( ! empty( $check_key_response['license_data']['error'] ) ) {
138
- wp_send_json_error( array(
139
- 'message' => SBI_Upgrader::get_error_message( $check_key_response ),
140
- ) );
141
- }
142
-
143
- if ( ! empty( $check_key_response['license_data']['error'] ) ) {
144
- wp_send_json_error( array(
145
- 'message' => SBI_Upgrader::get_error_message( $check_key_response ),
146
- ) );
147
- }
148
-
149
- if ( $check_key_response['license_data']['license'] !== 'valid' ) {
150
- wp_send_json_error( array(
151
- 'message' => SBI_Upgrader::get_error_message( $check_key_response ),
152
- ) );
153
- }
154
-
155
- $license_data = $check_key_response['license_data'];
156
- update_option( 'sbi_license_key', $license );
157
- update_option( 'sbi_license_data', $license_data );
158
- update_option( 'sbi_license_status', $license_data['license'] );
159
-
160
- // Redirect.
161
- $oth = hash( 'sha512', wp_rand() );
162
- update_option( 'sbi_one_click_upgrade', $oth );
163
- $version = '1.0';
164
- $version_info = SBI_Upgrader::get_version_info( $license_data );
165
- $file = '';
166
- if ( isset( $version_info->package ) ) {
167
- $file = $version_info->package;
168
- }
169
- $siteurl = admin_url();
170
- $endpoint = admin_url( 'admin-ajax.php' );
171
- $redirect = admin_url( 'admin.php?page=' . self::REDIRECT );
172
- $url = add_query_arg( array(
173
- 'key' => $license,
174
- 'oth' => $oth,
175
- 'endpoint' => $endpoint,
176
- 'version' => $version,
177
- 'siteurl' => $siteurl,
178
- 'homeurl' => $home_url,
179
- 'redirect' => rawurldecode( base64_encode( $redirect ) ),
180
- 'file' => rawurldecode( base64_encode( $file ) ),
181
- 'plugin_name' => self::NAME,
182
- ), self::UPGRADE_URL );
183
- wp_send_json_success( array(
184
- 'url' => $url,
185
- ) );
186
-
187
- }
188
-
189
- wp_send_json_error( array( 'message' => esc_html__( 'Could not connect.', 'instagram-feed' ) ) );
190
- }
191
-
192
- /**
193
- * Endpoint for one-click upgrade.
194
- *
195
- * @since 4.0
196
- */
197
- function install_upgrade() {
198
- $error = esc_html__( 'Could not install upgrade. Please download from smashballoon.com and install manually.', 'instagram-feed' );
199
- // verify params present (oth & download link).
200
- $post_oth = ! empty( $_REQUEST['oth'] ) ? sanitize_text_field( $_REQUEST['oth'] ) : '';
201
- $post_url = ! empty( $_REQUEST['file'] ) ? $_REQUEST['file'] : '';
202
-
203
- if ( empty( $post_oth ) || empty( $post_url ) ) {
204
- wp_send_json_error( $error );
205
- }
206
- // Verify oth.
207
- $oth = get_option( 'sbi_one_click_upgrade' );
208
-
209
- if ( empty( $oth ) ) {
210
- wp_send_json_error( $error );
211
- }
212
-
213
- if ( ! hash_equals( $oth, $post_oth ) ) {
214
- wp_send_json_error( $error );
215
- }
216
-
217
- // Delete so cannot replay.
218
- delete_option( 'sbi_one_click_upgrade' );
219
- // Set the current screen to avoid undefined notices.
220
- set_current_screen( self::REDIRECT );
221
- // Prepare variables.
222
- $url = esc_url_raw(
223
- add_query_arg(
224
- array(
225
- 'page' => self::REDIRECT,
226
- ),
227
- admin_url( 'admin.php' )
228
- )
229
- );
230
-
231
- // Verify pro not installed.
232
- $active = activate_plugin( self::SLUG, $url, false, true );
233
- if ( ! is_wp_error( $active ) ) {
234
- deactivate_plugins( plugin_basename( SBI_PLUGIN_DIR ) );
235
- wp_send_json_success( esc_html__( 'Plugin installed & activated.', 'instagram-feed' ) );
236
- }
237
-
238
- $creds = request_filesystem_credentials( $url, '', false, false, null );
239
- // Check for file system permissions.
240
- if ( false === $creds ) {
241
- wp_send_json_error( $error );
242
- }
243
- if ( ! WP_Filesystem( $creds ) ) {
244
- wp_send_json_error( $error );
245
- }
246
-
247
- // We do not need any extra credentials if we have gotten this far, so let's install the plugin.
248
- $license = get_option( 'sbi_license_key' );
249
- if ( empty( $license ) ) {
250
- wp_send_json_error( new \WP_Error( '403', esc_html__( 'You are not licensed.', 'instagram-feed' ) ) );
251
- }
252
-
253
- // Do not allow WordPress to search/download translations, as this will break JS output.
254
- remove_action( 'upgrader_process_complete', array( 'Language_Pack_Upgrader', 'async_upgrade' ), 20 );
255
- // Create the plugin upgrader with our custom skin.
256
- $installer = new \Sbi\Helpers\PluginSilentUpgrader( new \SBI_Install_Skin() );
257
-
258
- // Error check.
259
- if ( ! method_exists( $installer, 'install' ) || empty( $post_url ) ) {
260
- wp_send_json_error( $error );
261
- }
262
-
263
- $license_data = get_option( 'sbi_license_data' );
264
-
265
- if ( ! empty ( $license_data ) ) {
266
- $version_info = SBI_Upgrader::get_version_info( $license_data );
267
-
268
- $file = '';
269
- if ( isset( $version_info->package ) ) {
270
- $file = $version_info->package;
271
- }
272
- } else {
273
- wp_send_json_error( new WP_Error( '403', esc_html__( 'You are not licensed.', 'instagram-feed' ) ) );
274
- }
275
-
276
- if ( ! empty( $file ) ) {
277
-
278
- $installer->install( $file ); // phpcs:ignore
279
- // Check license key.
280
- // Flush the cache and return the newly installed plugin basename.
281
- wp_cache_flush();
282
-
283
- $plugin_basename = $installer->plugin_info();
284
-
285
- if ( $plugin_basename ) {
286
- deactivate_plugins( plugin_basename( SBI_PLUGIN_BASENAME ), true );
287
-
288
- // Activate the plugin silently.
289
- $activated = activate_plugin( $plugin_basename );
290
-
291
- if ( ! is_wp_error( $activated ) ) {
292
- wp_send_json_success( esc_html__( 'Plugin installed & activated.', 'instagram-feed' ) );
293
- } else {
294
- // Reactivate the lite plugin if pro activation failed.
295
- $activated = activate_plugin( plugin_basename( SBI_PLUGIN_BASENAME ), '', false, true );
296
- wp_send_json_error( esc_html__( 'Pro version installed but needs to be activated from the Plugins page inside your WordPress admin.', 'instagram-feed' ) );
297
- }
298
- }
299
- }
300
-
301
- wp_send_json_error( $error );
302
- }
303
-
304
- /**
305
- * Whether or not it's likely to be a reachable URL for upgrade
306
- *
307
- * @param string $url
308
- *
309
- * @return bool
310
- *
311
- * @since 4.0
312
- */
313
- public static function is_dev_url( $url = '' ) {
314
- $is_local_url = false;
315
- // Trim it up
316
- $url = strtolower( trim( $url ) );
317
- // Need to get the host...so let's add the scheme so we can use parse_url
318
- if ( false === strpos( $url, 'http://' ) && false === strpos( $url, 'https://' ) ) {
319
- $url = 'http://' . $url;
320
- }
321
- $url_parts = parse_url( $url );
322
- $host = ! empty( $url_parts['host'] ) ? $url_parts['host'] : false;
323
- if ( ! empty( $url ) && ! empty( $host ) ) {
324
- if ( false !== ip2long( $host ) ) {
325
- if ( ! filter_var( $host, FILTER_VALIDATE_IP, FILTER_FLAG_NO_PRIV_RANGE | FILTER_FLAG_NO_RES_RANGE ) ) {
326
- $is_local_url = true;
327
- }
328
- } else if ( 'localhost' === $host ) {
329
- $is_local_url = true;
330
- }
331
-
332
- $tlds_to_check = array( '.local', ':8888', ':8080', ':8081', '.invalid', '.example', '.test' );
333
- foreach ( $tlds_to_check as $tld ) {
334
- if ( false !== strpos( $host, $tld ) ) {
335
- $is_local_url = true;
336
- break;
337
- }
338
-
339
- }
340
- if ( substr_count( $host, '.' ) > 1 ) {
341
- $subdomains_to_check = [];
342
- foreach ( $subdomains_to_check as $subdomain ) {
343
- $subdomain = str_replace( '.', '(.)', $subdomain );
344
- $subdomain = str_replace( array( '*', '(.)' ), '(.*)', $subdomain );
345
- if ( preg_match( '/^(' . $subdomain . ')/', $host ) ) {
346
- $is_local_url = true;
347
- break;
348
- }
349
- }
350
- }
351
- }
352
- return $is_local_url;
353
- }
354
-
355
- /**
356
- * Handle API Response and check for an error.
357
- *
358
- * @param array $response
359
- *
360
- * @return string
361
- *
362
- * @since 4.0
363
- */
364
- public static function get_error_message( $response ) {
365
- $message = '';
366
- if ( isset( $response['error'] ) ) {
367
- $error = sanitize_text_field( $response['error'] );
368
- switch ( $error ) {
369
- case 'expired':
370
- $message = __( 'This license is expired.', 'instagram-feed' );
371
- break;
372
- default :
373
- $message = __( 'We encountered a problem unlocking the PRO features. Please install the PRO version manually.', 'instagram-feed' );
374
- }
375
-
376
- } elseif ( isset( $response['license_data'] ) ) {
377
- $error = SBI_Global_Settings::get_license_error_message( $response['license_data'] );
378
- $message = $error['errorMsg'];
379
- }
380
-
381
- return $message;
382
- }
383
-
384
- }
1
+ <?php
2
+ /**
3
+ * Upgrade to the Pro version
4
+ *
5
+ * @since 4.0
6
+ */
7
+
8
+ namespace InstagramFeed\Admin;
9
+
10
+ class SBI_Upgrader {
11
+
12
+ /**
13
+ * URL where licensing is done
14
+ */
15
+ const STORE_URL = 'https://smashballoon.com/';
16
+
17
+ /**
18
+ * URL to connect to Smash Balloon App and upgrade to Pro
19
+ */
20
+ const UPGRADE_URL = 'https://connect.smashballoon.com/activate/index.php';
21
+
22
+ /**
23
+ * Check the license key URL
24
+ */
25
+ const CHECK_URL = 'https://connect.smashballoon.com/activate/check.php';
26
+
27
+ const NAME = 'instagram';
28
+
29
+ const SLUG = 'instagram-feed-pro/instagram-feed.php';
30
+
31
+ const REDIRECT = 'sbi-settings';
32
+
33
+ const INSTALL_INSTRUCTIONS = 'https://smashballoon.com/doc/setting-up-the-instagram-feed-pro-wordpress-plugin/?instagram';
34
+
35
+
36
+ /**
37
+ * AJAX hooks for creating the redirect
38
+ *
39
+ * @since 4.0
40
+ */
41
+ public static function hooks() {
42
+ add_action( 'wp_ajax_nopriv_sbi_run_one_click_upgrade', array( 'InstagramFeed\Admin\SBI_Upgrader', 'install_upgrade' ) );
43
+ add_action( 'wp_ajax_sbi_maybe_upgrade_redirect', array( 'InstagramFeed\Admin\SBI_Upgrader', 'maybe_upgrade_redirect' ) );
44
+ }
45
+
46
+ /**
47
+ * Connect to licensing API to get download URL for Pro version
48
+ *
49
+ * @param $license_data
50
+ *
51
+ * @return bool|mixed|null
52
+ *
53
+ * @since 4.0
54
+ */
55
+ public static function get_version_info( $license_data ) {
56
+ $api_params = array(
57
+ 'edd_action' => 'get_version',
58
+ 'license' => $license_data['key'],
59
+ 'item_name' => isset( $license_data['item_name'] ) ? $license_data['item_name'] : false,
60
+ 'item_id' => isset( $license_data['item_id'] ) ? $license_data['item_id'] : false,
61
+ 'version' => '0',
62
+ 'slug' => self::SLUG,
63
+ 'author' => 'SmashBalloon',
64
+ 'url' => home_url(),
65
+ 'beta' => false,
66
+ );
67
+
68
+ $api_url = trailingslashit( self::STORE_URL );
69
+
70
+ $request = wp_remote_post( $api_url, array( 'timeout' => 15, 'sslverify' => true, 'body' => $api_params ) );
71
+
72
+ if ( ! is_wp_error( $request ) ) {
73
+ $version_info = json_decode( wp_remote_retrieve_body( $request ) );
74
+ return $version_info;
75
+ }
76
+
77
+ return false;
78
+ }
79
+
80
+ /**
81
+ * Ajax handler for grabbing the upgrade url.
82
+ *
83
+ * @since 4.0
84
+ */
85
+ public static function maybe_upgrade_redirect() {
86
+ $home_url = home_url();
87
+ check_ajax_referer( 'sbi_admin_nonce' , 'nonce');
88
+
89
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
90
+ wp_send_json_error();
91
+ }
92
+
93
+ // Check for permissions.
94
+ if ( ! current_user_can( 'install_plugins' ) ) {
95
+ wp_send_json_error( array( 'message' => esc_html__( 'You are not allowed to install plugins.', 'instagram-feed' ) ) );
96
+ }
97
+ if ( SBI_Upgrader::is_dev_url( home_url() ) ) {
98
+ wp_send_json_success( array(
99
+ 'url' => self::INSTALL_INSTRUCTIONS,
100
+ ) );
101
+ }
102
+ // Check license key.
103
+ $license = ! empty( $_POST['license_key'] ) ? sanitize_key( $_POST['license_key'] ) : '';
104
+ if ( empty( $license ) ) {
105
+ wp_send_json_error( array( 'message' => esc_html__( 'You are not licensed.', 'instagram-feed' ) ) );
106
+ }
107
+
108
+ $args = array(
109
+ 'plugin_name' => self::NAME,
110
+ 'plugin_slug' => 'pro',
111
+ 'plugin_path' => plugin_basename( __FILE__ ),
112
+ 'plugin_url' => trailingslashit( WP_PLUGIN_URL ) . 'pro',
113
+ 'home_url' => $home_url,
114
+ 'version' => '1.0',
115
+ 'key' => $license,
116
+ );
117
+ $url = add_query_arg( $args, self::CHECK_URL );
118
+
119
+ $remote_request_args = array(
120
+ 'timeout' => '20',
121
+ );
122
+
123
+ $response = wp_remote_get( $url, $remote_request_args );
124
+
125
+ if ( ! is_wp_error( $response ) ) {
126
+ $body = wp_remote_retrieve_body( $response );
127
+
128
+ $check_key_response = json_decode( $body, true );
129
+
130
+ if ( empty( $check_key_response['license_data'] ) ) {
131
+
132
+ wp_send_json_error( array(
133
+ 'message' => esc_html( SBI_Upgrader::get_error_message( $check_key_response ) ),
134
+ ) );
135
+ }
136
+
137
+ if ( ! empty( $check_key_response['license_data']['error'] ) ) {
138
+ wp_send_json_error( array(
139
+ 'message' => SBI_Upgrader::get_error_message( $check_key_response ),
140
+ ) );
141
+ }
142
+
143
+ if ( ! empty( $check_key_response['license_data']['error'] ) ) {
144
+ wp_send_json_error( array(
145
+ 'message' => SBI_Upgrader::get_error_message( $check_key_response ),
146
+ ) );
147
+ }
148
+
149
+ if ( $check_key_response['license_data']['license'] !== 'valid' ) {
150
+ wp_send_json_error( array(
151
+ 'message' => SBI_Upgrader::get_error_message( $check_key_response ),
152
+ ) );
153
+ }
154
+
155
+ $license_data = $check_key_response['license_data'];
156
+ update_option( 'sbi_license_key', $license );
157
+ update_option( 'sbi_license_data', $license_data );
158
+ update_option( 'sbi_license_status', $license_data['license'] );
159
+
160
+ // Redirect.
161
+ $oth = hash( 'sha512', wp_rand() );
162
+ update_option( 'sbi_one_click_upgrade', $oth );
163
+ $version = '1.0';
164
+ $version_info = SBI_Upgrader::get_version_info( $license_data );
165
+ $file = '';
166
+ if ( isset( $version_info->package ) ) {
167
+ $file = $version_info->package;
168
+ }
169
+ $siteurl = admin_url();
170
+ $endpoint = admin_url( 'admin-ajax.php' );
171
+ $redirect = admin_url( 'admin.php?page=' . self::REDIRECT );
172
+ $url = add_query_arg( array(
173
+ 'key' => $license,
174
+ 'oth' => $oth,
175
+ 'endpoint' => $endpoint,
176
+ 'version' => $version,
177
+ 'siteurl' => $siteurl,
178
+ 'homeurl' => $home_url,
179
+ 'redirect' => rawurldecode( base64_encode( $redirect ) ),
180
+ 'file' => rawurldecode( base64_encode( $file ) ),
181
+ 'plugin_name' => self::NAME,
182
+ ), self::UPGRADE_URL );
183
+ wp_send_json_success( array(
184
+ 'url' => $url,
185
+ ) );
186
+
187
+ }
188
+
189
+ wp_send_json_error( array( 'message' => esc_html__( 'Could not connect.', 'instagram-feed' ) ) );
190
+ }
191
+
192
+ /**
193
+ * Endpoint for one-click upgrade.
194
+ *
195
+ * @since 4.0
196
+ */
197
+ function install_upgrade() {
198
+ $error = esc_html__( 'Could not install upgrade. Please download from smashballoon.com and install manually.', 'instagram-feed' );
199
+ // verify params present (oth & download link).
200
+ $post_oth = ! empty( $_REQUEST['oth'] ) ? sanitize_text_field( $_REQUEST['oth'] ) : '';
201
+ $post_url = ! empty( $_REQUEST['file'] ) ? $_REQUEST['file'] : '';
202
+
203
+ if ( empty( $post_oth ) || empty( $post_url ) ) {
204
+ wp_send_json_error( $error );
205
+ }
206
+ // Verify oth.
207
+ $oth = get_option( 'sbi_one_click_upgrade' );
208
+
209
+ if ( empty( $oth ) ) {
210
+ wp_send_json_error( $error );
211
+ }
212
+
213
+ if ( ! hash_equals( $oth, $post_oth ) ) {
214
+ wp_send_json_error( $error );
215
+ }
216
+
217
+ // Delete so cannot replay.
218
+ delete_option( 'sbi_one_click_upgrade' );
219
+ // Set the current screen to avoid undefined notices.
220
+ set_current_screen( self::REDIRECT );
221
+ // Prepare variables.
222
+ $url = esc_url_raw(
223
+ add_query_arg(
224
+ array(
225
+ 'page' => self::REDIRECT,
226
+ ),
227
+ admin_url( 'admin.php' )
228
+ )
229
+ );
230
+
231
+ // Verify pro not installed.
232
+ $active = activate_plugin( self::SLUG, $url, false, true );
233
+ if ( ! is_wp_error( $active ) ) {
234
+ deactivate_plugins( plugin_basename( SBI_PLUGIN_DIR ) );
235
+ wp_send_json_success( esc_html__( 'Plugin installed & activated.', 'instagram-feed' ) );
236
+ }
237
+
238
+ $creds = request_filesystem_credentials( $url, '', false, false, null );
239
+ // Check for file system permissions.
240
+ if ( false === $creds ) {
241
+ wp_send_json_error( $error );
242
+ }
243
+ if ( ! WP_Filesystem( $creds ) ) {
244
+ wp_send_json_error( $error );
245
+ }
246
+
247
+ // We do not need any extra credentials if we have gotten this far, so let's install the plugin.
248
+ $license = get_option( 'sbi_license_key' );
249
+ if ( empty( $license ) ) {
250
+ wp_send_json_error( new \WP_Error( '403', esc_html__( 'You are not licensed.', 'instagram-feed' ) ) );
251
+ }
252
+
253
+ // Do not allow WordPress to search/download translations, as this will break JS output.
254
+ remove_action( 'upgrader_process_complete', array( 'Language_Pack_Upgrader', 'async_upgrade' ), 20 );
255
+ // Create the plugin upgrader with our custom skin.
256
+ $installer = new \Sbi\Helpers\PluginSilentUpgrader( new \SBI_Install_Skin() );
257
+
258
+ // Error check.
259
+ if ( ! method_exists( $installer, 'install' ) || empty( $post_url ) ) {
260
+ wp_send_json_error( $error );
261
+ }
262
+
263
+ $license_data = get_option( 'sbi_license_data' );
264
+
265
+ if ( ! empty ( $license_data ) ) {
266
+ $version_info = SBI_Upgrader::get_version_info( $license_data );
267
+
268
+ $file = '';
269
+ if ( isset( $version_info->package ) ) {
270
+ $file = $version_info->package;
271
+ }
272
+ } else {
273
+ wp_send_json_error( new WP_Error( '403', esc_html__( 'You are not licensed.', 'instagram-feed' ) ) );
274
+ }
275
+
276
+ if ( ! empty( $file ) ) {
277
+
278
+ $installer->install( $file ); // phpcs:ignore
279
+ // Check license key.
280
+ // Flush the cache and return the newly installed plugin basename.
281
+ wp_cache_flush();
282
+
283
+ $plugin_basename = $installer->plugin_info();
284
+
285
+ if ( $plugin_basename ) {
286
+ deactivate_plugins( plugin_basename( SBI_PLUGIN_BASENAME ), true );
287
+
288
+ // Activate the plugin silently.
289
+ $activated = activate_plugin( $plugin_basename );
290
+
291
+ if ( ! is_wp_error( $activated ) ) {
292
+ wp_send_json_success( esc_html__( 'Plugin installed & activated.', 'instagram-feed' ) );
293
+ } else {
294
+ // Reactivate the lite plugin if pro activation failed.
295
+ $activated = activate_plugin( plugin_basename( SBI_PLUGIN_BASENAME ), '', false, true );
296
+ wp_send_json_error( esc_html__( 'Pro version installed but needs to be activated from the Plugins page inside your WordPress admin.', 'instagram-feed' ) );
297
+ }
298
+ }
299
+ }
300
+
301
+ wp_send_json_error( $error );
302
+ }
303
+
304
+ /**
305
+ * Whether or not it's likely to be a reachable URL for upgrade
306
+ *
307
+ * @param string $url
308
+ *
309
+ * @return bool
310
+ *
311
+ * @since 4.0
312
+ */
313
+ public static function is_dev_url( $url = '' ) {
314
+ $is_local_url = false;
315
+ // Trim it up
316
+ $url = strtolower( trim( $url ) );
317
+ // Need to get the host...so let's add the scheme so we can use parse_url
318
+ if ( false === strpos( $url, 'http://' ) && false === strpos( $url, 'https://' ) ) {
319
+ $url = 'http://' . $url;
320
+ }
321
+ $url_parts = parse_url( $url );
322
+ $host = ! empty( $url_parts['host'] ) ? $url_parts['host'] : false;
323
+ if ( ! empty( $url ) && ! empty( $host ) ) {
324
+ if ( false !== ip2long( $host ) ) {
325
+ if ( ! filter_var( $host, FILTER_VALIDATE_IP, FILTER_FLAG_NO_PRIV_RANGE | FILTER_FLAG_NO_RES_RANGE ) ) {
326
+ $is_local_url = true;
327
+ }
328
+ } else if ( 'localhost' === $host ) {
329
+ $is_local_url = true;
330
+ }
331
+
332
+ $tlds_to_check = array( '.local', ':8888', ':8080', ':8081', '.invalid', '.example', '.test' );
333
+ foreach ( $tlds_to_check as $tld ) {
334
+ if ( false !== strpos( $host, $tld ) ) {
335
+ $is_local_url = true;
336
+ break;
337
+ }
338
+
339
+ }
340
+ if ( substr_count( $host, '.' ) > 1 ) {
341
+ $subdomains_to_check = [];
342
+ foreach ( $subdomains_to_check as $subdomain ) {
343
+ $subdomain = str_replace( '.', '(.)', $subdomain );
344
+ $subdomain = str_replace( array( '*', '(.)' ), '(.*)', $subdomain );
345
+ if ( preg_match( '/^(' . $subdomain . ')/', $host ) ) {
346
+ $is_local_url = true;
347
+ break;
348
+ }
349
+ }
350
+ }
351
+ }
352
+ return $is_local_url;
353
+ }
354
+
355
+ /**
356
+ * Handle API Response and check for an error.
357
+ *
358
+ * @param array $response
359
+ *
360
+ * @return string
361
+ *
362
+ * @since 4.0
363
+ */
364
+ public static function get_error_message( $response ) {
365
+ $message = '';
366
+ if ( isset( $response['error'] ) ) {
367
+ $error = sanitize_text_field( $response['error'] );
368
+ switch ( $error ) {
369
+ case 'expired':
370
+ $message = __( 'This license is expired.', 'instagram-feed' );
371
+ break;
372
+ default :
373
+ $message = __( 'We encountered a problem unlocking the PRO features. Please install the PRO version manually.', 'instagram-feed' );
374
+ }
375
+
376
+ } elseif ( isset( $response['license_data'] ) ) {
377
+ $error = SBI_Global_Settings::get_license_error_message( $response['license_data'] );
378
+ $message = $error['errorMsg'];
379
+ }
380
+
381
+ return $message;
382
+ }
383
+
384
+ }
admin/SBI_View.php CHANGED
@@ -1,41 +1,41 @@
1
- <?php
2
- /**
3
- * Class CFF_View
4
- *
5
- * This class loads view page template files on the admin dashboard area.
6
- *
7
- * @since 4.0
8
- */
9
- namespace InstagramFeed;
10
- if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
11
-
12
- class SBI_View {
13
-
14
- /**
15
- * Base file path of the templates
16
- *
17
- * @since 4.0
18
- */
19
- const BASE_PATH = SBI_PLUGIN_DIR . 'admin/views/';
20
-
21
- public function __construct() {
22
- }
23
-
24
- /**
25
- * Render template
26
- *
27
- * @param string $file
28
- * @param array $data
29
- *
30
- * @since 4.0
31
- */
32
- public static function render( $file, $data = array() ) {
33
- $file = str_replace( '.', '/', $file );
34
- $file = self::BASE_PATH . $file . '.php';
35
-
36
- if ( file_exists( $file ) ) {
37
- if ( $data !== null && ! empty( $data ) ) extract( $data );
38
- include_once $file;
39
- }
40
- }
41
  }
1
+ <?php
2
+ /**
3
+ * Class CFF_View
4
+ *
5
+ * This class loads view page template files on the admin dashboard area.
6
+ *
7
+ * @since 4.0
8
+ */
9
+ namespace InstagramFeed;
10
+ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
11
+
12
+ class SBI_View {
13
+
14
+ /**
15
+ * Base file path of the templates
16
+ *
17
+ * @since 4.0
18
+ */
19
+ const BASE_PATH = SBI_PLUGIN_DIR . 'admin/views/';
20
+
21
+ public function __construct() {
22
+ }
23
+
24
+ /**
25
+ * Render template
26
+ *
27
+ * @param string $file
28
+ * @param array $data
29
+ *
30
+ * @since 4.0
31
+ */
32
+ public static function render( $file, $data = array() ) {
33
+ $file = str_replace( '.', '/', $file );
34
+ $file = self::BASE_PATH . $file . '.php';
35
+
36
+ if ( file_exists( $file ) ) {
37
+ if ( $data !== null && ! empty( $data ) ) extract( $data );
38
+ include_once $file;
39
+ }
40
+ }
41
  }
admin/SBI_oEmbeds.php CHANGED
@@ -1,433 +1,433 @@
1
- <?php
2
-
3
- /**
4
- * The Settings Page
5
- *
6
- * @since 4.0
7
- */
8
-
9
- namespace InstagramFeed\Admin;
10
- if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
11
-
12
- use InstagramFeed\SBI_View;
13
- use InstagramFeed\SBI_Response;
14
-
15
- class SBI_oEmbeds {
16
- /**
17
- * Admin menu page slug.
18
- *
19
- * @since 4.0
20
- *
21
- * @var string
22
- */
23
- const SLUG = 'sbi-oembeds-manager';
24
-
25
- /**
26
- * Initializing the class
27
- *
28
- * @since 4.0
29
- */
30
- function __construct(){
31
- $this->init();
32
- }
33
-
34
- /**
35
- * Determining if the user is viewing the our page, if so, party on.
36
- *
37
- * @since 4.0
38
- */
39
- public function init() {
40
- if ( ! is_admin() ) {
41
- return;
42
- }
43
-
44
- add_action('admin_menu', [$this, 'register_menu']);
45
-
46
- add_action( 'wp_ajax_disable_instagram_oembed_from_instagram', [$this, 'disable_instagram_oembed_from_instagram'] );
47
- add_action( 'wp_ajax_disable_facebook_oembed_from_instagram', [$this, 'disable_facebook_oembed_from_instagram'] );
48
- }
49
-
50
- /**
51
- * Register Menu.
52
- *
53
- * @since 4.0
54
- */
55
- function register_menu() {
56
- $cap = current_user_can( 'manage_instagram_feed_options' ) ? 'manage_instagram_feed_options' : 'manage_options';
57
- $cap = apply_filters( 'sbi_settings_pages_capability', $cap );
58
-
59
- $oembeds_manager = add_submenu_page(
60
- 'sb-instagram-feed',
61
- __( 'oEmbeds', 'instagram-feed' ),
62
- __( 'oEmbeds', 'instagram-feed' ),
63
- $cap,
64
- self::SLUG,
65
- [$this, 'oembeds_manager'],
66
- 2
67
- );
68
- add_action( 'load-' . $oembeds_manager, [$this,'oembeds_enqueue_admin_scripts']);
69
- }
70
-
71
- /**
72
- * Disable Instagram oEmbed
73
- *
74
- * @since 4.0
75
- *
76
- * @return SBI_Response
77
- */
78
- public function disable_instagram_oembed_from_instagram () {
79
- check_ajax_referer( 'sbi-admin', 'nonce' );
80
-
81
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
82
- wp_send_json_error(); // This auto-dies.
83
- }
84
- $oembed_settings = get_option( 'sbi_oembed_token', array() );
85
- $oembed_settings['access_token'] = '';
86
- $oembed_settings['disabled'] = true;
87
- update_option( 'sbi_oembed_token', $oembed_settings );
88
-
89
- new SBI_Response( true, array(
90
- 'connectionUrl' => $this->get_connection_url()
91
- ) );
92
- }
93
-
94
- /**
95
- * Disable Facebook oEmbed
96
- *
97
- * @since 4.0
98
- *
99
- * @return SBI_Response
100
- */
101
- public function disable_facebook_oembed_from_instagram () {
102
- check_ajax_referer( 'sbi-admin', 'nonce' );
103
-
104
- if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
105
- wp_send_json_error(); // This auto-dies.
106
- }
107
- $oembed_settings = get_option( 'cff_oembed_token', array() );
108
- $oembed_settings['access_token'] = '';
109
- $oembed_settings['disabled'] = true;
110
- update_option( 'cff_oembed_token', $oembed_settings );
111
-
112
- new SBI_Response( true, array(
113
- 'connectionUrl' => $this->get_connection_url()
114
- ) );
115
- }
116
-
117
- /**
118
- * Enqueue oEmbeds CSS & Script.
119
- *
120
- * Loads only for oEmbeds page
121
- *
122
- * @since 4.0
123
- */
124
- public function oembeds_enqueue_admin_scripts(){
125
- if( ! get_current_screen() ) {
126
- return;
127
- }
128
- $screen = get_current_screen();
129
- if ( ! 'instagram-feed_page_sbi-oembeds-manager' === $screen->id ) {
130
- return;
131
- }
132
-
133
- wp_enqueue_style(
134
- 'oembeds-style',
135
- SBI_PLUGIN_URL . 'admin/assets/css/oembeds.css',
136
- false,
137
- SBIVER
138
- );
139
-
140
- wp_enqueue_script(
141
- 'feed-vue',
142
- 'https://cdn.jsdelivr.net/npm/vue@2.6.12',
143
- null,
144
- '2.6.12',
145
- true
146
- );
147
-
148
- wp_enqueue_script(
149
- 'oembeds-app',
150
- SBI_PLUGIN_URL.'admin/assets/js/oembeds.js',
151
- null,
152
- SBIVER,
153
- true
154
- );
155
-
156
- $sbi_oembends = $this->statuses_and_info();
157
- $sbi_oembends['nonce'] = wp_create_nonce( 'sbi-admin' );
158
-
159
- wp_localize_script(
160
- 'oembeds-app',
161
- 'sbi_oembeds',
162
- $sbi_oembends
163
- );
164
- }
165
-
166
- /**
167
- * Statuses and info about the current state of oEmbed connection
168
- *
169
- * @return array
170
- *
171
- * @since 4.0
172
- */
173
- public function statuses_and_info() {
174
- $return = array(
175
- 'admin_url' => admin_url(),
176
- 'ajax_handler' => admin_url( 'admin-ajax.php' ),
177
- 'supportPageUrl' => admin_url( 'admin.php?page=sbi-support' ),
178
- 'links' => \InstagramFeed\Builder\SBI_Feed_Builder::get_links_with_utm(),
179
- 'socialWallLinks' => \InstagramFeed\Builder\SBI_Feed_Builder::get_social_wall_links(),
180
- 'socialWallActivated' => is_plugin_active( 'social-wall/social-wall.php' ),
181
- 'genericText' => array(
182
- 'help' => __( 'Help', 'instagram-feed' ),
183
- 'title' => __( 'oEmbeds', 'instagram-feed' ),
184
- 'description' => __( 'Use Smash Balloon to power any Instagram or Instagram oEmbeds across your site. Just click the button below and we\'ll do the rest. ', 'instagram-feed' ),
185
- 'instagramOEmbeds' => __( 'Instagram oEmbeds are currently not being handled by Smash Balloon', 'instagram-feed' ),
186
- 'instagramOEmbedsEnabled' => __( 'Instagram oEmbeds are turned on', 'instagram-feed' ),
187
- 'facebookOEmbeds' => __( 'Facebook oEmbeds are currently not being handled by Smash Balloon', 'instagram-feed' ),
188
- 'facebookOEmbedsEnabled' => __( 'Facebook oEmbeds are turned on', 'instagram-feed' ),
189
- 'enable' => __( 'Enable', 'instagram-feed' ),
190
- 'disable' => __( 'Disable', 'instagram-feed' ),
191
- 'whatAreOembeds' => __( 'What are oEmbeds?', 'instagram-feed' ),
192
- 'whatElseOembeds' => __( 'What else can the Instagram Feed plugin do?', 'instagram-feed' ),
193
- 'whenYouPaste' => __( 'When you paste a link to a Instagram or Facebook post in WordPress, it automatically displays the post instead of the URL. That is called an oEmbed.', 'instagram-feed' ),
194
- 'dueToRecent' => __( 'Due to recent API changes from Instagram, WordPress cannot automatically embed your posts.', 'instagram-feed' ),
195
- 'however' => __( 'However, we have added this feature to Smash Balloon to make sure your oEmbeds keep working.', 'instagram-feed' ),
196
- 'justEnable' => __( 'Just enable it above, and all your existing and new embeds should work automatically, no other input required.', 'instagram-feed' ),
197
- 'displayACompletely' => __( 'Display a completely customizable Instagram Feed with tons of features', 'instagram-feed' ),
198
- 'createACustom' => __( 'Create a custom styled feed of your Instagram posts which integrates seamlessly with your WordPress theme.', 'instagram-feed' ),
199
- ),
200
- 'images' => array(
201
- 'fbIcon' => '<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 2.04004C6.5 2.04004 2 6.53004 2 12.06C2 17.06 5.66 21.21 10.44 21.96V14.96H7.9V12.06H10.44V9.85004C10.44 7.34004 11.93 5.96004 14.22 5.96004C15.31 5.96004 16.45 6.15004 16.45 6.15004V8.62004H15.19C13.95 8.62004 13.56 9.39004 13.56 10.18V12.06H16.34L15.89 14.96H13.56V21.96C15.9164 21.5879 18.0622 20.3856 19.6099 18.5701C21.1576 16.7546 22.0054 14.4457 22 12.06C22 6.53004 17.5 2.04004 12 2.04004Z" fill="#006BFA"/></svg>',
202
- 'instaIcon' => '<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 6.60938C9 6.60938 6.60938 9.04688 6.60938 12C6.60938 15 9 17.3906 12 17.3906C14.9531 17.3906 17.3906 15 17.3906 12C17.3906 9.04688 14.9531 6.60938 12 6.60938ZM12 15.5156C10.0781 15.5156 8.48438 13.9688 8.48438 12C8.48438 10.0781 10.0312 8.53125 12 8.53125C13.9219 8.53125 15.4688 10.0781 15.4688 12C15.4688 13.9688 13.9219 15.5156 12 15.5156ZM18.8438 6.42188C18.8438 5.71875 18.2812 5.15625 17.5781 5.15625C16.875 5.15625 16.3125 5.71875 16.3125 6.42188C16.3125 7.125 16.875 7.6875 17.5781 7.6875C18.2812 7.6875 18.8438 7.125 18.8438 6.42188ZM22.4062 7.6875C22.3125 6 21.9375 4.5 20.7188 3.28125C19.5 2.0625 18 1.6875 16.3125 1.59375C14.5781 1.5 9.375 1.5 7.64062 1.59375C5.95312 1.6875 4.5 2.0625 3.23438 3.28125C2.01562 4.5 1.64062 6 1.54688 7.6875C1.45312 9.42188 1.45312 14.625 1.54688 16.3594C1.64062 18.0469 2.01562 19.5 3.23438 20.7656C4.5 21.9844 5.95312 22.3594 7.64062 22.4531C9.375 22.5469 14.5781 22.5469 16.3125 22.4531C18 22.3594 19.5 21.9844 20.7188 20.7656C21.9375 19.5 22.3125 18.0469 22.4062 16.3594C22.5 14.625 22.5 9.42188 22.4062 7.6875ZM20.1562 18.1875C19.8281 19.125 19.0781 19.8281 18.1875 20.2031C16.7812 20.7656 13.5 20.625 12 20.625C10.4531 20.625 7.17188 20.7656 5.8125 20.2031C4.875 19.8281 4.17188 19.125 3.79688 18.1875C3.23438 16.8281 3.375 13.5469 3.375 12C3.375 10.5 3.23438 7.21875 3.79688 5.8125C4.17188 4.92188 4.875 4.21875 5.8125 3.84375C7.17188 3.28125 10.4531 3.42188 12 3.42188C13.5 3.42188 16.7812 3.28125 18.1875 3.84375C19.0781 4.17188 19.7812 4.92188 20.1562 5.8125C20.7188 7.21875 20.5781 10.5 20.5781 12C20.5781 13.5469 20.7188 16.8281 20.1562 18.1875Z" fill="url(#paint0_linear)"/><defs><linearGradient id="paint0_linear" x1="8.95781" y1="41.6859" x2="53.1891" y2="-3.46406" gradientUnits="userSpaceOnUse"><stop stop-color="white"/><stop offset="0.147864" stop-color="#F6640E"/><stop offset="0.443974" stop-color="#BA03A7"/><stop offset="0.733337" stop-color="#6A01B9"/><stop offset="1" stop-color="#6B01B9"/></linearGradient></defs></svg>',
203
- 'image1_2x' => SBI_PLUGIN_URL . 'admin/assets/img/oembeds-image-1@2x.png',
204
- 'image2_2x' => SBI_PLUGIN_URL . 'admin/assets/img/oembeds-image-2@2x.png',
205
- 'image3_2x' => SBI_PLUGIN_URL . 'admin/assets/img/oembeds-image-3@2x.png',
206
- 'image4_2x' => SBI_PLUGIN_URL . 'admin/assets/img/oembeds-image-4@2x.png',
207
- ),
208
- 'modal' => array(
209
- 'title' => __( 'Enable Facebook oEmbeds', 'instagram-feed' ),
210
- 'description' => __( 'To enable Instagram oEmbeds our Custom Facebok Feed plugin is required. Click the button below to Install it and enable Instagram oEmbeds.', 'instagram-feed' ),
211
- 'install' => __( 'Install Plugin', 'instagram-feed' ),
212
- 'activate' => __( 'Activate Plugin', 'instagram-feed' ),
213
- 'cancel' => __( 'Cancel', 'instagram-feed' ),
214
- 'instaIcon' => SBI_PLUGIN_URL . 'admin/assets/img/instagram-color-icon.svg',
215
- 'timesIcon' => '<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.2084 2.14275L12.8572 0.791504L7.50008 6.14859L2.143 0.791504L0.791748 2.14275L6.14883 7.49984L0.791748 12.8569L2.143 14.2082L7.50008 8.85109L12.8572 14.2082L14.2084 12.8569L8.85133 7.49984L14.2084 2.14275Z" fill="#141B38"/></svg>',
216
- 'plusIcon' => '<svg width="13" height="12" viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.0832 6.83317H7.08317V11.8332H5.4165V6.83317H0.416504V5.1665H5.4165V0.166504H7.08317V5.1665H12.0832V6.83317Z" fill="white"/></svg>'
217
- ),
218
- 'loaderSVG' => '<svg version="1.1" id="loader-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="20px" height="20px" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve"><path fill="#fff" d="M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z"><animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="0.6s" repeatCount="indefinite"/></path></svg>',
219
- 'checkmarkSVG' => '<svg class="checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"><path class="checkmark__check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8"/></svg>',
220
- );
221
-
222
- $oembed_token_settings = get_option( 'sbi_oembed_token', array() );
223
- $saved_access_token_data = isset( $oembed_token_settings['access_token'] ) ? $oembed_token_settings['access_token'] : false;
224
- $newly_retrieved_oembed_connection_data = $this->maybe_connection_data( $saved_access_token_data );
225
- if ( ! empty( $newly_retrieved_oembed_connection_data['access_token'] ) ) {
226
- $oembed_token_settings = $newly_retrieved_oembed_connection_data;
227
- $return['newOembedData'] = $newly_retrieved_oembed_connection_data;
228
-
229
- update_option( 'cff_oembed_token', $newly_retrieved_oembed_connection_data );
230
- update_option( 'sbi_oembed_token', $newly_retrieved_oembed_connection_data );
231
- } elseif ( ! empty( $newly_retrieved_oembed_connection_data ) ) {
232
- $return['newOembedData'] = $newly_retrieved_oembed_connection_data;
233
- }
234
- $return['connectionURL'] = $this->get_connection_url();
235
- $return['tokenData'] = $oembed_token_settings;
236
-
237
- $return['instagram'] = array(
238
- 'doingOembeds' => $this->instagram_oembed_enabled()
239
- );
240
- $return['facebook'] = [
241
- 'active' => class_exists( '\CustomFacebookFeed\CFF_Oembed' ),
242
- 'doingOembeds' => false
243
- ];
244
-
245
- $return['facebook']['installer'] = $this->facebook_installer_info();
246
-
247
- if ( class_exists( '\CustomFacebookFeed\CFF_Oembed' ) ) {
248
- $return['facebook']['doingOembeds'] = \CustomFacebookFeed\CFF_Oembed::can_do_oembed();
249
- }
250
-
251
- return $return;
252
- }
253
-
254
- /**
255
- * Connection URLs are based on the website connecting accounts so that is
256
- * configured here and returned
257
- *
258
- * @return string
259
- *
260
- * @since 4.0
261
- */
262
- public static function get_connection_url() {
263
-
264
- $admin_url_state = admin_url( 'admin.php?page=sbi-oembeds-manager' );
265
- //If the admin_url isn't returned correctly then use a fallback
266
- if( $admin_url_state == '/wp-admin/admin.php?page=sbi-oembeds-manager' ){
267
- $admin_url_state = "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
268
- }
269
-
270
- if ( class_exists( '\CustomFacebookFeed\CFF_Oembed' ) ) {
271
- $cff_oembed_token = \CustomFacebookFeed\CFF_Oembed::last_access_token();
272
-
273
- if ( ! empty( $cff_oembed_token ) ) {
274
- return add_query_arg( 'transfer', '1', $admin_url_state );
275
- }
276
- }
277
-
278
- return 'https://www.facebook.com/dialog/oauth?client_id=254638078422287&redirect_uri=https://api.smashballoon.com/v2/instagram-graph-api-redirect.php&scope=pages_show_list&state=' . $admin_url_state;
279
- }
280
-
281
- /**
282
- * Listener for retrieving and storing an access token for oEmbeds
283
- *
284
- * @param string $saved_access_token_data
285
- *
286
- * @return array|bool
287
- *
288
- * @since 4.0
289
- */
290
- public static function maybe_connection_data( $saved_access_token_data ) {
291
- $screen = get_current_screen();
292
-
293
- if ( ! $screen ) {
294
- return false;
295
- }
296
- if ( $screen->id !== 'instagram-feed_page_sbi-oembeds-manager') {
297
- return false;
298
- }
299
- if ( ! empty( $_GET['transfer'] ) ) {
300
- if ( class_exists( '\CustomFacebookFeed\CFF_Oembed' ) ) {
301
- $cff_oembed_token = \CustomFacebookFeed\CFF_Oembed::last_access_token();
302
- $return = get_option( 'cff_oembed_token', array() );
303
-
304
- $return['access_token'] = $cff_oembed_token;
305
- $return['disabled'] = false;
306
-
307
- return $return;
308
- }
309
- } if ( isset( $_GET['sbi_access_token'] ) ) {
310
- $access_token = sbi_sanitize_alphanumeric_and_equals( $_GET['sbi_access_token'] );
311
-
312
- $return = [];
313
-
314
- $valid_new_access_token = ! empty( $access_token ) && strlen( $access_token ) > 20 && $saved_access_token_data !== $access_token ? $access_token : false;
315
- if ( $valid_new_access_token ) {
316
- $url = esc_url_raw( 'https://graph.instagram.com/me/accounts?limit=500&access_token=' . $valid_new_access_token );
317
- $pages_data_connection = wp_remote_get( $url );
318
- $return['access_token'] = $valid_new_access_token;
319
- $return['disabled'] = false;
320
- if ( ! is_wp_error( $pages_data_connection ) && isset( $pages_data_connection['body'] ) ) {
321
- $pages_data = json_decode( $pages_data_connection['body'], true );
322
- if ( isset( $pages_data['data'][0]['access_token'] ) ) {
323
- $return['expiration_date'] = 'never';
324
- } else {
325
- $return['expiration_date'] = time() + (60 * DAY_IN_SECONDS);
326
- }
327
- } else {
328
- $return['expiration_date'] = 'unknown';
329
- }
330
- } else {
331
- if ( $saved_access_token_data === $access_token ) {
332
- $return['error'] = 'Not New';
333
- } else {
334
- $return['error'] = 'Not Valid';
335
- }
336
- }
337
-
338
- return $return;
339
-
340
- }
341
-
342
- return false;
343
- }
344
-
345
- /**
346
- * Check if Instagram oEmbed is enabled or not
347
- *
348
- * @return bool
349
- *
350
- * @since 4.0
351
- */
352
- public function instagram_oembed_enabled() {
353
- $sbi_oembed_token = get_option( 'sbi_oembed_token' );
354
- if ( isset( $sbi_oembed_token['access_token'] ) && isset( $sbi_oembed_token['disabled'] ) && ! $sbi_oembed_token['disabled'] ) {
355
- return true;
356
- }
357
- return false;
358
- }
359
-
360
- /**
361
- * Check if Facebook oEmbed is enabled or not
362
- *
363
- * @return bool
364
- *
365
- * @since 4.0
366
- */
367
- public function facebook_oembed_enabled() {
368
- $cff_oembed_token = get_option( 'cff_oembed_token' );
369
- if ( isset( $cff_oembed_token['access_token'] ) && isset( $cff_oembed_token['disabled'] ) && ! $cff_oembed_token['disabled'] ) {
370
- return true;
371
- }
372
- return false;
373
- }
374
-
375
- /**
376
- * Determines what action for Instagram should be done in the following order
377
- * and returns data used in the common "addon" installer
378
- *
379
- * Free or Pro active, do nothing
380
- * Pro installed but not active, activate Pro
381
- * Free installed but not active, activate Free
382
- * Nothing installed, install and activate Free
383
- *
384
- * @return array
385
- *
386
- * @since 4.0
387
- */
388
- public static function facebook_installer_info() {
389
- $all_plugins = get_plugins();
390
- $active_plugins = get_option( 'active_plugins' );
391
-
392
- if ( in_array( 'custom-facebook-feed/custom-facebook-feed.php', $active_plugins, true )
393
- || in_array( 'custom-facebook-feed-pro/custom-facebook-feed.php', $active_plugins, true ) ) {
394
- return [
395
- 'nextStep' => 'none',
396
- 'plugin' => 'none',
397
- 'action' => 'none'
398
- ];
399
- }
400
-
401
- foreach ( $all_plugins as $plugin ) {
402
- if ( strpos( $plugin['Name'], 'Custom Facebook Feed Pro' ) !== false ) {
403
- return [
404
- 'nextStep' => 'pro_activate',
405
- 'plugin' => 'custom-facebook-feed-pro/custom-facebook-feed.php',
406
- 'action' => 'sbi_activate_addon'
407
- ];
408
- }
409
- if ( strpos( $plugin['Name'], 'Custom Facebook Feed' ) !== false ) {
410
- return [
411
- 'nextStep' => 'free_activate',
412
- 'plugin' => 'custom-facebook-feed/custom-facebook-feed.php',
413
- 'action' => 'sbi_activate_addon'
414
- ];
415
- }
416
- }
417
-
418
- return [
419
- 'nextStep' => 'free_install',
420
- 'plugin' => 'https://downloads.wordpress.org/plugin/custom-facebook-feed.zip',
421
- 'action' => 'sbi_install_addon'
422
- ];
423
- }
424
-
425
- /**
426
- * oEmbeds Manager Page View Template
427
- *
428
- * @since 4.0
429
- */
430
- public function oembeds_manager(){
431
- return \InstagramFeed\SBI_View::render( 'oembeds.index' );
432
- }
433
- }
1
+ <?php
2
+
3
+ /**
4
+ * The Settings Page
5
+ *
6
+ * @since 4.0
7
+ */
8
+
9
+ namespace InstagramFeed\Admin;
10
+ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
11
+
12
+ use InstagramFeed\SBI_View;
13
+ use InstagramFeed\SBI_Response;
14
+
15
+ class SBI_oEmbeds {
16
+ /**
17
+ * Admin menu page slug.
18
+ *
19
+ * @since 4.0
20
+ *
21
+ * @var string
22
+ */
23
+ const SLUG = 'sbi-oembeds-manager';
24
+
25
+ /**
26
+ * Initializing the class
27
+ *
28
+ * @since 4.0
29
+ */
30
+ function __construct(){
31
+ $this->init();
32
+ }
33
+
34
+ /**
35
+ * Determining if the user is viewing the our page, if so, party on.
36
+ *
37
+ * @since 4.0
38
+ */
39
+ public function init() {
40
+ if ( ! is_admin() ) {
41
+ return;
42
+ }
43
+
44
+ add_action('admin_menu', [$this, 'register_menu']);
45
+
46
+ add_action( 'wp_ajax_disable_instagram_oembed_from_instagram', [$this, 'disable_instagram_oembed_from_instagram'] );
47
+ add_action( 'wp_ajax_disable_facebook_oembed_from_instagram', [$this, 'disable_facebook_oembed_from_instagram'] );
48
+ }
49
+
50
+ /**
51
+ * Register Menu.
52
+ *
53
+ * @since 4.0
54
+ */
55
+ function register_menu() {
56
+ $cap = current_user_can( 'manage_instagram_feed_options' ) ? 'manage_instagram_feed_options' : 'manage_options';
57
+ $cap = apply_filters( 'sbi_settings_pages_capability', $cap );
58
+
59
+ $oembeds_manager = add_submenu_page(
60
+ 'sb-instagram-feed',
61
+ __( 'oEmbeds', 'instagram-feed' ),
62
+ __( 'oEmbeds', 'instagram-feed' ),
63
+ $cap,
64
+ self::SLUG,
65
+ [$this, 'oembeds_manager'],
66
+ 2
67
+ );
68
+ add_action( 'load-' . $oembeds_manager, [$this,'oembeds_enqueue_admin_scripts']);
69
+ }
70
+
71
+ /**
72
+ * Disable Instagram oEmbed
73
+ *
74
+ * @since 4.0
75
+ *
76
+ * @return SBI_Response
77
+ */
78
+ public function disable_instagram_oembed_from_instagram () {
79
+ check_ajax_referer( 'sbi-admin', 'nonce' );
80
+
81
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
82
+ wp_send_json_error(); // This auto-dies.
83
+ }
84
+ $oembed_settings = get_option( 'sbi_oembed_token', array() );
85
+ $oembed_settings['access_token'] = '';
86
+ $oembed_settings['disabled'] = true;
87
+ update_option( 'sbi_oembed_token', $oembed_settings );
88
+
89
+ new SBI_Response( true, array(
90
+ 'connectionUrl' => $this->get_connection_url()
91
+ ) );
92
+ }
93
+
94
+ /**
95
+ * Disable Facebook oEmbed
96
+ *
97
+ * @since 4.0
98
+ *
99
+ * @return SBI_Response
100
+ */
101
+ public function disable_facebook_oembed_from_instagram () {
102
+ check_ajax_referer( 'sbi-admin', 'nonce' );
103
+
104
+ if ( ! sbi_current_user_can( 'manage_instagram_feed_options' ) ) {
105
+ wp_send_json_error(); // This auto-dies.
106
+ }
107
+ $oembed_settings = get_option( 'cff_oembed_token', array() );
108
+ $oembed_settings['access_token'] = '';
109
+ $oembed_settings['disabled'] = true;
110
+ update_option( 'cff_oembed_token', $oembed_settings );
111
+
112
+ new SBI_Response( true, array(
113
+ 'connectionUrl' => $this->get_connection_url()
114
+ ) );
115
+ }
116
+
117
+ /**
118
+ * Enqueue oEmbeds CSS & Script.
119
+ *
120
+ * Loads only for oEmbeds page
121
+ *
122
+ * @since 4.0
123
+ */
124
+ public function oembeds_enqueue_admin_scripts(){
125
+ if( ! get_current_screen() ) {
126
+ return;
127
+ }
128
+ $screen = get_current_screen();
129
+ if ( ! 'instagram-feed_page_sbi-oembeds-manager' === $screen->id ) {
130
+ return;
131
+ }
132
+
133
+ wp_enqueue_style(
134
+ 'oembeds-style',
135
+ SBI_PLUGIN_URL . 'admin/assets/css/oembeds.css',
136
+ false,
137
+ SBIVER
138
+ );
139
+
140
+ wp_enqueue_script(
141
+ 'feed-vue',
142
+ 'https://cdn.jsdelivr.net/npm/vue@2.6.12',
143
+ null,
144
+ '2.6.12',
145
+ true
146
+ );
147
+
148
+ wp_enqueue_script(
149
+ 'oembeds-app',
150
+ SBI_PLUGIN_URL.'admin/assets/js/oembeds.js',
151
+ null,
152
+ SBIVER,
153
+ true
154
+ );
155
+
156
+ $sbi_oembends = $this->statuses_and_info();
157
+ $sbi_oembends['nonce'] = wp_create_nonce( 'sbi-admin' );
158
+
159
+ wp_localize_script(
160
+ 'oembeds-app',
161
+ 'sbi_oembeds',
162
+ $sbi_oembends
163
+ );
164
+ }
165
+
166
+ /**
167
+ * Statuses and info about the current state of oEmbed connection
168
+ *
169
+ * @return array
170
+ *
171
+ * @since 4.0
172
+ */
173
+ public function statuses_and_info() {
174
+ $return = array(
175
+ 'admin_url' => admin_url(),
176
+ 'ajax_handler' => admin_url( 'admin-ajax.php' ),
177
+ 'supportPageUrl' => admin_url( 'admin.php?page=sbi-support' ),
178
+ 'links' => \InstagramFeed\Builder\SBI_Feed_Builder::get_links_with_utm(),
179
+ 'socialWallLinks' => \InstagramFeed\Builder\SBI_Feed_Builder::get_social_wall_links(),
180
+ 'socialWallActivated' => is_plugin_active( 'social-wall/social-wall.php' ),
181
+ 'genericText' => array(
182
+ 'help' => __( 'Help', 'instagram-feed' ),
183
+ 'title' => __( 'oEmbeds', 'instagram-feed' ),
184
+ 'description' => __( 'Use Smash Balloon to power any Instagram or Instagram oEmbeds across your site. Just click the button below and we\'ll do the rest. ', 'instagram-feed' ),
185
+ 'instagramOEmbeds' => __( 'Instagram oEmbeds are currently not being handled by Smash Balloon', 'instagram-feed' ),
186
+ 'instagramOEmbedsEnabled' => __( 'Instagram oEmbeds are turned on', 'instagram-feed' ),
187
+ 'facebookOEmbeds' => __( 'Facebook oEmbeds are currently not being handled by Smash Balloon', 'instagram-feed' ),
188
+ 'facebookOEmbedsEnabled' => __( 'Facebook oEmbeds are turned on', 'instagram-feed' ),
189
+ 'enable' => __( 'Enable', 'instagram-feed' ),
190
+ 'disable' => __( 'Disable', 'instagram-feed' ),
191
+ 'whatAreOembeds' => __( 'What are oEmbeds?', 'instagram-feed' ),
192
+ 'whatElseOembeds' => __( 'What else can the Instagram Feed plugin do?', 'instagram-feed' ),
193
+ 'whenYouPaste' => __( 'When you paste a link to a Instagram or Facebook post in WordPress, it automatically displays the post instead of the URL. That is called an oEmbed.', 'instagram-feed' ),
194
+ 'dueToRecent' => __( 'Due to recent API changes from Instagram, WordPress cannot automatically embed your posts.', 'instagram-feed' ),
195
+ 'however' => __( 'However, we have added this feature to Smash Balloon to make sure your oEmbeds keep working.', 'instagram-feed' ),
196
+ 'justEnable' => __( 'Just enable it above, and all your existing and new embeds should work automatically, no other input required.', 'instagram-feed' ),
197
+ 'displayACompletely' => __( 'Display a completely customizable Instagram Feed with tons of features', 'instagram-feed' ),
198
+ 'createACustom' => __( 'Create a custom styled feed of your Instagram posts which integrates seamlessly with your WordPress theme.', 'instagram-feed' ),
199
+ ),
200
+ 'images' => array(
201
+ 'fbIcon' => '<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 2.04004C6.5 2.04004 2 6.53004 2 12.06C2 17.06 5.66 21.21 10.44 21.96V14.96H7.9V12.06H10.44V9.85004C10.44 7.34004 11.93 5.96004 14.22 5.96004C15.31 5.96004 16.45 6.15004 16.45 6.15004V8.62004H15.19C13.95 8.62004 13.56 9.39004 13.56 10.18V12.06H16.34L15.89 14.96H13.56V21.96C15.9164 21.5879 18.0622 20.3856 19.6099 18.5701C21.1576 16.7546 22.0054 14.4457 22 12.06C22 6.53004 17.5 2.04004 12 2.04004Z" fill="#006BFA"/></svg>',
202
+ 'instaIcon' => '<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 6.60938C9 6.60938 6.60938 9.04688 6.60938 12C6.60938 15 9 17.3906 12 17.3906C14.9531 17.3906 17.3906 15 17.3906 12C17.3906 9.04688 14.9531 6.60938 12 6.60938ZM12 15.5156C10.0781 15.5156 8.48438 13.9688 8.48438 12C8.48438 10.0781 10.0312 8.53125 12 8.53125C13.9219 8.53125 15.4688 10.0781 15.4688 12C15.4688 13.9688 13.9219 15.5156 12 15.5156ZM18.8438 6.42188C18.8438 5.71875 18.2812 5.15625 17.5781 5.15625C16.875 5.15625 16.3125 5.71875 16.3125 6.42188C16.3125 7.125 16.875 7.6875 17.5781 7.6875C18.2812 7.6875 18.8438 7.125 18.8438 6.42188ZM22.4062 7.6875C22.3125 6 21.9375 4.5 20.7188 3.28125C19.5 2.0625 18 1.6875 16.3125 1.59375C14.5781 1.5 9.375 1.5 7.64062 1.59375C5.95312 1.6875 4.5 2.0625 3.23438 3.28125C2.01562 4.5 1.64062 6 1.54688 7.6875C1.45312 9.42188 1.45312 14.625 1.54688 16.3594C1.64062 18.0469 2.01562 19.5 3.23438 20.7656C4.5 21.9844 5.95312 22.3594 7.64062 22.4531C9.375 22.5469 14.5781 22.5469 16.3125 22.4531C18 22.3594 19.5 21.9844 20.7188 20.7656C21.9375 19.5 22.3125 18.0469 22.4062 16.3594C22.5 14.625 22.5 9.42188 22.4062 7.6875ZM20.1562 18.1875C19.8281 19.125 19.0781 19.8281 18.1875 20.2031C16.7812 20.7656 13.5 20.625 12 20.625C10.4531 20.625 7.17188 20.7656 5.8125 20.2031C4.875 19.8281 4.17188 19.125 3.79688 18.1875C3.23438 16.8281 3.375 13.5469 3.375 12C3.375 10.5 3.23438 7.21875 3.79688 5.8125C4.17188 4.92188 4.875 4.21875 5.8125 3.84375C7.17188 3.28125 10.4531 3.42188 12 3.42188C13.5 3.42188 16.7812 3.28125 18.1875 3.84375C19.0781 4.17188 19.7812 4.92188 20.1562 5.8125C20.7188 7.21875 20.5781 10.5 20.5781 12C20.5781 13.5469 20.7188 16.8281 20.1562 18.1875Z" fill="url(#paint0_linear)"/><defs><linearGradient id="paint0_linear" x1="8.95781" y1="41.6859" x2="53.1891" y2="-3.46406" gradientUnits="userSpaceOnUse"><stop stop-color="white"/><stop offset="0.147864" stop-color="#F6640E"/><stop offset="0.443974" stop-color="#BA03A7"/><stop offset="0.733337" stop-color="#6A01B9"/><stop offset="1" stop-color="#6B01B9"/></linearGradient></defs></svg>',
203
+ 'image1_2x' => SBI_PLUGIN_URL . 'admin/assets/img/oembeds-image-1@2x.png',
204
+ 'image2_2x' => SBI_PLUGIN_URL . 'admin/assets/img/oembeds-image-2@2x.png',
205
+ 'image3_2x' => SBI_PLUGIN_URL . 'admin/assets/img/oembeds-image-3@2x.png',
206
+ 'image4_2x' => SBI_PLUGIN_URL . 'admin/assets/img/oembeds-image-4@2x.png',
207
+ ),
208
+ 'modal' => array(
209
+ 'title' => __( 'Enable Facebook oEmbeds', 'instagram-feed' ),
210
+ 'description' => __( 'To enable Instagram oEmbeds our Custom Facebok Feed plugin is required. Click the button below to Install it and enable Instagram oEmbeds.', 'instagram-feed' ),
211
+ 'install' => __( 'Install Plugin', 'instagram-feed' ),
212
+ 'activate' => __( 'Activate Plugin', 'instagram-feed' ),
213
+ 'cancel' => __( 'Cancel', 'instagram-feed' ),
214
+ 'instaIcon' => SBI_PLUGIN_URL . 'admin/assets/img/instagram-color-icon.svg',
215
+ 'timesIcon' => '<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.2084 2.14275L12.8572 0.791504L7.50008 6.14859L2.143 0.791504L0.791748 2.14275L6.14883 7.49984L0.791748 12.8569L2.143 14.2082L7.50008 8.85109L12.8572 14.2082L14.2084 12.8569L8.85133 7.49984L14.2084 2.14275Z" fill="#141B38"/></svg>',
216
+ 'plusIcon' => '<svg width="13" height="12" viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.0832 6.83317H7.08317V11.8332H5.4165V6.83317H0.416504V5.1665H5.4165V0.166504H7.08317V5.1665H12.0832V6.83317Z" fill="white"/></svg>'
217
+ ),
218
+ 'loaderSVG' => '<svg version="1.1" id="loader-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="20px" height="20px" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve"><path fill="#fff" d="M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z"><animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="0.6s" repeatCount="indefinite"/></path></svg>',
219
+ 'checkmarkSVG' => '<svg class="checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"><path class="checkmark__check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8"/></svg>',
220
+ );
221
+
222
+ $oembed_token_settings = get_option( 'sbi_oembed_token', array() );
223
+ $saved_access_token_data = isset( $oembed_token_settings['access_token'] ) ? $oembed_token_settings['access_token'] : false;
224
+ $newly_retrieved_oembed_connection_data = $this->maybe_connection_data( $saved_access_token_data );
225
+ if ( ! empty( $newly_retrieved_oembed_connection_data['access_token'] ) ) {
226
+ $oembed_token_settings = $newly_retrieved_oembed_connection_data;
227
+ $return['newOembedData'] = $newly_retrieved_oembed_connection_data;
228
+
229
+ update_option( 'cff_oembed_token', $newly_retrieved_oembed_connection_data );
230
+ update_option( 'sbi_oembed_token', $newly_retrieved_oembed_connection_data );
231
+ } elseif ( ! empty( $newly_retrieved_oembed_connection_data ) ) {
232
+ $return['newOembedData'] = $newly_retrieved_oembed_connection_data;
233
+ }
234
+ $return['connectionURL'] = $this->get_connection_url();
235
+ $return['tokenData'] = $oembed_token_settings;
236
+
237
+ $return['instagram'] = array(
238
+ 'doingOembeds' => $this->instagram_oembed_enabled()
239
+ );
240
+ $return['facebook'] = [
241
+ 'active' => class_exists( '\CustomFacebookFeed\CFF_Oembed' ),
242
+ 'doingOembeds' => false
243
+ ];
244
+
245
+ $return['facebook']['installer'] = $this->facebook_installer_info();
246
+
247
+ if ( class_exists( '\CustomFacebookFeed\CFF_Oembed' ) ) {
248
+ $return['facebook']['doingOembeds'] = \CustomFacebookFeed\CFF_Oembed::can_do_oembed();
249
+ }
250
+
251
+ return $return;
252
+ }
253
+
254
+ /**
255
+ * Connection URLs are based on the website connecting accounts so that is
256
+ * configured here and returned
257
+ *
258
+ * @return string
259
+ *
260
+ * @since 4.0
261
+ */
262
+ public static function get_connection_url() {
263
+
264
+ $admin_url_state = admin_url( 'admin.php?page=sbi-oembeds-manager' );
265
+ //If the admin_url isn't returned correctly then use a fallback
266
+ if( $admin_url_state == '/wp-admin/admin.php?page=sbi-oembeds-manager' ){
267
+ $admin_url_state = "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
268
+ }
269
+
270
+ if ( class_exists( '\CustomFacebookFeed\CFF_Oembed' ) ) {
271
+ $cff_oembed_token = \CustomFacebookFeed\CFF_Oembed::last_access_token();
272
+
273
+ if ( ! empty( $cff_oembed_token ) ) {
274
+ return add_query_arg( 'transfer', '1', $admin_url_state );
275
+ }
276
+ }
277
+
278
+ return 'https://www.facebook.com/dialog/oauth?client_id=254638078422287&redirect_uri=https://api.smashballoon.com/v2/instagram-graph-api-redirect.php&scope=pages_show_list&state=' . $admin_url_state;
279
+ }
280
+
281
+ /**
282
+ * Listener for retrieving and storing an access token for oEmbeds
283
+ *
284
+ * @param string $saved_access_token_data
285
+ *
286
+ * @return array|bool
287
+ *
288
+ * @since 4.0
289
+ */
290
+ public static function maybe_connection_data( $saved_access_token_data ) {
291
+ $screen = get_current_screen();
292
+
293
+ if ( ! $screen ) {
294
+ return false;
295
+ }
296
+ if ( $screen->id !== 'instagram-feed_page_sbi-oembeds-manager') {
297
+ return false;
298
+ }
299
+ if ( ! empty( $_GET['transfer'] ) ) {
300
+ if ( class_exists( '\CustomFacebookFeed\CFF_Oembed' ) ) {
301
+ $cff_oembed_token = \CustomFacebookFeed\CFF_Oembed::last_access_token();
302
+ $return = get_option( 'cff_oembed_token', array() );
303
+
304
+ $return['access_token'] = $cff_oembed_token;
305
+ $return['disabled'] = false;
306
+
307
+ return $return;
308
+ }
309
+ } if ( isset( $_GET['sbi_access_token'] ) ) {
310
+ $access_token = sbi_sanitize_alphanumeric_and_equals( $_GET['sbi_access_token'] );
311
+
312
+ $return = [];
313
+
314
+ $valid_new_access_token = ! empty( $access_token ) && strlen( $access_token ) > 20 && $saved_access_token_data !== $access_token ? $access_token : false;
315
+ if ( $valid_new_access_token ) {
316
+ $url = esc_url_raw( 'https://graph.instagram.com/me/accounts?limit=500&access_token=' . $valid_new_access_token );
317
+ $pages_data_connection = wp_remote_get( $url );
318
+ $return['access_token'] = $valid_new_access_token;
319
+ $return['disabled'] = false;
320
+ if ( ! is_wp_error( $pages_data_connection ) && isset( $pages_data_connection['body'] ) ) {
321
+ $pages_data = json_decode( $pages_data_connection['body'], true );
322
+ if ( isset( $pages_data['data'][0]['access_token'] ) ) {
323
+ $return['expiration_date'] = 'never';
324
+ } else {
325
+ $return['expiration_date'] = time() + (60 * DAY_IN_SECONDS);
326
+ }
327
+ } else {
328
+ $return['expiration_date'] = 'unknown';
329
+ }
330
+ } else {
331
+ if ( $saved_access_token_data === $access_token ) {
332
+ $return['error'] = 'Not New';
333
+ } else {
334
+ $return['error'] = 'Not Valid';
335
+ }
336
+ }
337
+
338
+ return $return;
339
+
340
+ }
341
+
342
+ return false;
343
+ }
344
+
345
+ /**
346
+ * Check if Instagram oEmbed is enabled or not
347
+ *
348
+ * @return bool
349
+ *
350
+ * @since 4.0
351
+ */
352
+ public function instagram_oembed_enabled() {
353
+ $sbi_oembed_token = get_option( 'sbi_oembed_token' );
354
+ if ( isset( $sbi_oembed_token['access_token'] ) && isset( $sbi_oembed_token['disabled'] ) && ! $sbi_oembed_token['disabled'] ) {
355
+ return true;
356
+ }
357
+ return false;
358
+ }
359
+
360
+ /**
361
+ * Check if Facebook oEmbed is enabled or not
362
+ *
363
+ * @return bool
364
+ *
365
+ * @since 4.0
366
+ */
367
+ public function facebook_oembed_enabled() {
368
+ $cff_oembed_token = get_option( 'cff_oembed_token' );
369
+ if ( isset( $cff_oembed_token['access_token'] ) && isset( $cff_oembed_token['disabled'] ) && ! $cff_oembed_token['disabled'] ) {
370
+ return true;
371
+ }
372
+ return false;
373
+ }
374
+
375
+ /**
376
+ * Determines what action for Instagram should be done in the following order
377
+ * and returns data used in the common "addon" installer
378
+ *
379
+ * Free or Pro active, do nothing
380
+ * Pro installed but not active, activate Pro
381
+ * Free installed but not active, activate Free
382
+ * Nothing installed, install and activate Free
383
+ *
384
+ * @return array
385
+ *
386
+ * @since 4.0
387
+ */
388
+ public static function facebook_installer_info() {
389
+ $all_plugins = get_plugins();
390
+ $active_plugins = get_option( 'active_plugins' );
391
+
392
+ if ( in_array( 'custom-facebook-feed/custom-facebook-feed.php', $active_plugins, true )
393
+ || in_array( 'custom-facebook-feed-pro/custom-facebook-feed.php', $active_plugins, true ) ) {
394
+ return [
395
+ 'nextStep' => 'none',
396
+ 'plugin' => 'none',
397
+ 'action' => 'none'
398
+ ];
399
+ }
400
+
401
+ foreach ( $all_plugins as $plugin ) {
402
+ if ( strpos( $plugin['Name'], 'Custom Facebook Feed Pro' ) !== false ) {
403
+ return [
404
+ 'nextStep' => 'pro_activate',
405
+ 'plugin' => 'custom-facebook-feed-pro/custom-facebook-feed.php',
406
+ 'action' => 'sbi_activate_addon'
407
+ ];
408
+ }
409
+ if ( strpos( $plugin['Name'], 'Custom Facebook Feed' ) !== false ) {
410
+ return [
411
+ 'nextStep' => 'free_activate',
412
+ 'plugin' => 'custom-facebook-feed/custom-facebook-feed.php',
413
+ 'action' => 'sbi_activate_addon'
414
+ ];
415
+ }
416
+ }
417
+
418
+ return [
419
+ 'nextStep' => 'free_install',
420
+ 'plugin' => 'https://downloads.wordpress.org/plugin/custom-facebook-feed.zip',
421
+ 'action' => 'sbi_install_addon'
422
+ ];
423
+ }
424
+
425
+ /**
426
+ * oEmbeds Manager Page View Template
427
+ *
428
+ * @since 4.0
429
+ */
430
+ public function oembeds_manager(){
431
+ return \InstagramFeed\SBI_View::render( 'oembeds.index' );
432
+ }
433
+ }
admin/Traits/SBI_Settings.php CHANGED
@@ -1,204 +1,204 @@
1
- <?php
2
- /**
3
- * The Settings Trait
4
- *
5
- * @since 4.0
6
- */
7
-
8
- namespace InstagramFeed\Admin\Traits;
9
- if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
10
-
11
-
12
- trait SBI_Settings {
13
-
14
- /**
15
- * Return the locales
16
- *
17
- * @since 4.0
18
- *
19
- * @return array
20
- */
21
- public static function locales() {
22
- return array(
23
- 'af_ZA' => 'Afrikaans',
24
- 'ar_AR' => 'Arabic',
25
- 'az_AZ' => 'Azerbaijani',
26
- 'be_BY' => 'Belarusian',
27
- 'bg_BG' => 'Bulgarian',
28
- 'bn_IN' => 'Bengali',
29
- 'bs_BA' => 'Bosnian',
30
- 'ca_ES' => 'Catalan',
31
- 'cs_CZ' => 'Czech',
32
- 'cy_GB' => 'Welsh',
33
- 'da_DK' => 'Danish',
34
- 'de_DE' => 'German',
35
- 'el_GR' => 'Greek',
36
- 'en_GB' => 'English (UK',
37
- 'en_PI' => 'English (Pirate)',
38
- 'en_US' => 'English (US)',
39
- 'eo_EO' => 'Esperanto',
40
- 'es_ES' => 'Spanish (Spain)',
41
- 'es_LA' => 'Spanish',
42
- 'et_EE' => 'Estonian',
43
- 'eu_ES' => 'Basque',
44
- 'fa_IR' => 'Persian',
45
- 'fb_LT' => 'Leet Speak',
46
- 'fi_FI' => 'Finnish',
47
- 'fo_FO' => 'Faroese',
48
- 'fr_CA' => 'French (Canada)',
49
- 'fr_FR' => 'French (France)',
50
- 'fy_NL' => 'Frisian',
51
- 'ga_IE' => 'Irish',
52
- 'gl_ES' => 'Galician',
53
- 'he_IL' => 'Hebrew',
54
- 'hi_IN' => 'Hindi',
55
- 'hr_HR' => 'Croatian',
56
- 'hu_HU' => 'Hungarian',
57
- 'hy_AM' => 'Armenian',
58
- 'id_ID' => 'Indonesian',
59
- 'is_IS' => 'Icelandic',
60
- 'it_IT' => 'Italian',
61
- 'ja_JP' => 'Japanese',
62
- 'ka_GE' => 'Georgian',
63
- 'km_KH' => 'Khmer',
64
- 'ko_KR' => 'Korean',
65
- 'ku_TR' => 'Kurdish',
66
- 'la_VA' => 'Latin',
67
- 'lt_LT' => 'Lithuanian',
68
- 'lv_LV' => 'Latvian',
69
- 'mk_MK' => 'Macedonian',
70
- 'ml_IN' => 'Malayalam',
71
- 'ms_MY' => 'Malay',
72
- 'nb_NO' => 'Norwegian (bokmal)',
73
- 'ne_NP' => 'Nepali',
74
- 'nl_NL' => 'Dutch',
75
- 'nn_NO' => 'Norwegian (nynorsk)',
76
- 'pa_IN' => 'Punjabi',
77
- 'pl_PL' => 'Polish',
78
- 'ps_AF' => 'Pashto',
79
- 'pt_BR' => 'Portuguese (Brazil)',
80
- 'pt_PT' => 'Portuguese (Portugal)',
81
- 'ro_RO' => 'Romanian',
82
- 'ru_RU' => 'Russian',
83
- 'sk_SK' => 'Slovak',
84
- 'sl_SI' => 'Slovenian',
85
- 'sq_AL' => 'Albanian',
86
- 'sr_RS' => 'Serbian',
87
- 'sv_SE' => 'Swedish',
88
- 'sw_KE' => 'Swahili',
89
- 'ta_IN' => 'Tamil',
90
- 'te_IN' => 'Telugu',
91
- 'th_TH' => 'Thai',
92
- 'tl_PH' => 'Filipino',
93
- 'tr_TR' => 'Turkish',
94
- 'uk_UA' => 'Ukrainian',
95
- 'vi_VN' => 'Vietnamese',
96
- 'zh_CN' => 'Simplified Chinese (China)',
97
- 'zh_HK' => 'Traditional Chinese (Hong Kong)',
98
- 'zh_TW' => 'Traditional Chinese (Taiwan)',
99
- );
100
- }
101
-
102
- /**
103
- * Return the timezones
104
- *
105
- * @since 4.0
106
- *
107
- * @return array
108
- */
109
- public static function timezones() {
110
- return array(
111
- 'Pacific/Midway' => '(GMT-11:00) Midway Island, Samoa',
112
- 'America/Adak' => '(GMT-10:00) Hawaii-Aleutian',
113
- 'Etc/GMT+10' => '(GMT-10:00) Hawaii',
114
- 'Pacific/Marquesas' => '(GMT-09:30) Marquesas Islands',
115
- 'Pacific/Gambier' => '(GMT-09:00) Gambier Islands',
116
- 'America/Anchorage' => '(GMT-09:00) Alaska',
117
- 'America/Ensenada' => '(GMT-08:00) Tijuana, Baja California',
118
- 'Etc/GMT+8' => '(GMT-08:00) Pitcairn Islands',
119
- 'America/Los_Angeles' => '(GMT-08:00) Pacific Time (US & Canada',
120
- 'America/Denver' => '(GMT-07:00) Mountain Time (US & Canada',
121
- 'America/Chihuahua' => '(GMT-07:00) Chihuahua, La Paz, Mazatlan',
122
- 'America/Dawson_Creek' => '(GMT-07:00) Arizona',
123
- 'America/Belize' => '(GMT-06:00) Saskatchewan, Central America',
124
- 'America/Cancun' => '(GMT-06:00) Guadalajara, Mexico City, Monterrey',
125
- 'Chile/EasterIsland' => '(GMT-06:00) Easter Island',
126
- 'America/Chicago' => '(GMT-06:00) Central Time (US & Canada)',
127
- 'America/New_York' => '(GMT-05:00) Eastern Time (US & Canada)',
128
- 'America/Havana' => '(GMT-05:00) Cuba',
129
- 'America/Bogota' => '(GMT-05:00) Bogota, Lima, Quito, Rio Branco',
130
- 'America/Caracas' => '(GMT-04:30) Caracas',
131
- 'America/Santiago' => '(GMT-04:00) Santiago',
132
- 'America/La_Paz' => '(GMT-04:00) La Paz',
133
- 'Atlantic/Stanley' => '(GMT-04:00) Faukland Islands',
134
- 'America/Campo_Grande' => '(GMT-04:00) Brazil',
135
- 'America/Goose_Bay' => '(GMT-04:00) Atlantic Time (Goose Bay)',
136
- 'America/Glace_Bay' => '(GMT-04:00) Atlantic Time (Canada)',
137
- 'America/St_Johns' => '(GMT-03:30) Newfoundland',
138
- 'America/Araguaina' => '(GMT-03:00) UTC-3',
139
- 'America/Montevideo' => '(GMT-03:00) Montevideo',
140
- 'America/Miquelon' => '(GMT-03:00) Miquelon, St. Pierre',
141
- 'America/Godthab' => '(GMT-03:00) Greenland',
142
- 'America/Argentina/Buenos_Aires' => '(GMT-03:00) Buenos Aires',
143
- 'America/Sao_Paulo' => '(GMT-03:00) Brasilia',
144
- 'America/Noronha' => '(GMT-02:00) Mid-Atlantic',
145
- 'Atlantic/Cape_Verde' => '(GMT-01:00) Cape Verde Is',
146
- 'Atlantic/Azores' => '(GMT-01:00) Azores',
147
- 'Europe/Belfast' => '(GMT) Greenwich Mean Time : Belfast',
148
- 'Europe/Dublin' => '(GMT) Greenwich Mean Time : Dublin',
149
- 'Europe/Lisbon' => '(GMT) Greenwich Mean Time : Lisbon',
150
- 'Europe/London' => '(GMT) Greenwich Mean Time : London',
151
- 'Africa/Abidjan' => '(GMT) Monrovia, Reykjavik',
152
- 'Europe/Amsterdam' => '(GMT+01:00) Amsterdam, Berlin, Bern, Rome, Stockholm, Vienna',
153
- 'Europe/Belgrade' => '(GMT+01:00) Belgrade, Bratislava, Budapest, Ljubljana, Prague',
154
- 'Europe/Brussels' => '(GMT+01:00) Brussels, Copenhagen, Madrid, Paris',
155
- 'Africa/Algiers' => '(GMT+01:00) West Central Africa',
156
- 'Africa/Windhoek' => '(GMT+01:00) Windhoek',
157
- 'Asia/Beirut' => '(GMT+02:00) Beirut',
158
- 'Africa/Cairo' => '(GMT+02:00) Cairo',
159
- 'Asia/Gaza' => '(GMT+02:00) Gaza',
160
- 'Africa/Blantyre' => '(GMT+02:00) Harare, Pretoria',
161
- 'Asia/Jerusalem' => '(GMT+02:00) Jerusalem',
162
- 'Europe/Helsinki' => '(GMT+02:00) Helsinki',
163
- 'Europe/Minsk' => '(GMT+02:00) Minsk',
164
- 'Asia/Damascus' => '(GMT+02:00) Syria',
165
- 'Europe/Moscow' => '(GMT+03:00) Moscow, St. Petersburg, Volgograd',
166
- 'Africa/Addis_Ababa' => '(GMT+03:00) Nairobi',
167
- 'Asia/Tehran' => '(GMT+03:30) Tehran',
168
- 'Asia/Dubai' => '(GMT+04:00) Abu Dhabi, Muscat',
169
- 'Asia/Yerevan' => '(GMT+04:00) Yerevan',
170
- 'Asia/Kabul' => '(GMT+04:30) Kabul',
171
- 'Asia/Yekaterinburg' => '(GMT+05:00) Ekaterinburg',
172
- 'Asia/Tashkent' => '(GMT+05:00) Tashkent',
173
- 'Asia/Kolkata' => '(GMT+05:30) Chennai, Kolkata, Mumbai, New Delhi',
174
- 'Asia/Katmandu' => '(GMT+05:45) Kathmandu',
175
- 'Asia/Dhaka' => '(GMT+06:00) Astana, Dhaka',
176
- 'Asia/Novosibirsk' => '(GMT+06:00) Novosibirsk',
177
- 'Asia/Rangoon' => '(GMT+06:30) Yangon (Rangoon',
178
- 'Asia/Bangkok' => '(GMT+07:00) Bangkok, Hanoi, Jakarta',
179
- 'Asia/Krasnoyarsk' => '(GMT+07:00) Krasnoyarsk',
180
- 'Asia/Hong_Kong' => '(GMT+08:00) Beijing, Chongqing, Hong Kong, Urumqi',
181
- 'Asia/Irkutsk' => '(GMT+08:00) Irkutsk, Ulaan Bataar',
182
- 'Australia/Perth' => '(GMT+08:00) Perth',
183
- 'Australia/Eucla' => '(GMT+08:45) Eucla',
184
- 'Asia/Tokyo' => '(GMT+09:00) Osaka, Sapporo, Tokyo',
185
- 'Asia/Seoul' => '(GMT+09:00) Seoul',
186
- 'Asia/Yakutsk' => '(GMT+09:00) Yakutsk',
187
- 'Australia/Adelaide' => '(GMT+09:30) Adelaide',
188
- 'Australia/Darwin' => '(GMT+09:30) Darwin',
189
- 'Australia/Brisbane' => '(GMT+10:00) Brisbane',
190
- 'Australia/Hobart' => '(GMT+10:00) Sydney',
191
- 'Asia/Vladivostok' => '(GMT+10:00) Vladivostok',
192
- 'Australia/Lord_Howe' => '(GMT+10:30) Lord Howe Island',
193
- 'Etc/GMT-11' => '(GMT+11:00) Solomon Is., New Caledonia',
194
- 'Asia/Magadan' => '(GMT+11:00) Magadan',
195
- 'Pacific/Norfolk' => '(GMT+11:30) Norfolk Island',
196
- 'Asia/Anadyr' => '(GMT+12:00) Anadyr, Kamchatka',
197
- 'Pacific/Auckland' => '(GMT+12:00) Auckland, Wellington',
198
- 'Etc/GMT-12' => 'GMT+12:00) Fiji, Kamchatka, Marshall Is',
199
- 'Pacific/Chatham' => '(GMT+12:45) Chatham Islands',
200
- 'Pacific/Tongatapu' => '(GMT+13:00) Nuku\'alofa',
201
- 'Pacific/Kiritimati' => '(GMT+14:00) Kiritimati'
202
- );
203
- }
204
  }
1
+ <?php
2
+ /**
3
+ * The Settings Trait
4
+ *
5
+ * @since 4.0
6
+ */
7
+
8
+ namespace InstagramFeed\Admin\Traits;
9
+ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
10
+
11
+
12
+ trait SBI_Settings {
13
+
14
+ /**
15
+ * Return the locales
16
+ *
17
+ * @since 4.0
18
+ *
19
+ * @return array
20
+ */
21
+ public static function locales() {
22
+ return array(
23
+ 'af_ZA' => 'Afrikaans',
24
+ 'ar_AR' => 'Arabic',
25
+ 'az_AZ' => 'Azerbaijani',
26
+ 'be_BY' => 'Belarusian',
27
+ 'bg_BG' => 'Bulgarian',
28
+ 'bn_IN' => 'Bengali',
29
+ 'bs_BA' => 'Bosnian',
30
+ 'ca_ES' => 'Catalan',
31
+ 'cs_CZ' => 'Czech',
32
+ 'cy_GB' => 'Welsh',
33
+ 'da_DK' => 'Danish',
34
+ 'de_DE' => 'German',
35
+ 'el_GR' => 'Greek',
36
+ 'en_GB' => 'English (UK',
37
+ 'en_PI' => 'English (Pirate)',
38
+ 'en_US' => 'English (US)',
39
+ 'eo_EO' => 'Esperanto',
40
+ 'es_ES' => 'Spanish (Spain)',
41
+ 'es_LA' => 'Spanish',
42
+ 'et_EE' => 'Estonian',
43
+ 'eu_ES' => 'Basque',
44
+ 'fa_IR' => 'Persian',
45
+ 'fb_LT' => 'Leet Speak',
46
+ 'fi_FI' => 'Finnish',
47
+ 'fo_FO' => 'Faroese',
48
+ 'fr_CA' => 'French (Canada)',
49
+ 'fr_FR' => 'French (France)',
50
+ 'fy_NL' => 'Frisian',
51
+ 'ga_IE' => 'Irish',
52
+ 'gl_ES' => 'Galician',
53
+ 'he_IL' => 'Hebrew',
54
+ 'hi_IN' => 'Hindi',
55
+ 'hr_HR' => 'Croatian',
56
+ 'hu_HU' => 'Hungarian',
57
+ 'hy_AM' => 'Armenian',
58
+ 'id_ID' => 'Indonesian',
59
+ 'is_IS' => 'Icelandic',
60
+ 'it_IT' => 'Italian',
61
+ 'ja_JP' => 'Japanese',
62
+ 'ka_GE' => 'Georgian',
63
+ 'km_KH' => 'Khmer',
64
+ 'ko_KR' => 'Korean',
65
+ 'ku_TR' => 'Kurdish',
66
+ 'la_VA' => 'Latin',
67
+ 'lt_LT' => 'Lithuanian',
68
+ 'lv_LV' => 'Latvian',
69
+ 'mk_MK' => 'Macedonian',
70
+ 'ml_IN' => 'Malayalam',
71
+ 'ms_MY' => 'Malay',
72
+ 'nb_NO' => 'Norwegian (bokmal)',
73
+ 'ne_NP' => 'Nepali',
74
+ 'nl_NL' => 'Dutch',
75
+ 'nn_NO' => 'Norwegian (nynorsk)',
76
+ 'pa_IN' => 'Punjabi',
77
+ 'pl_PL' => 'Polish',
78
+ 'ps_AF' => 'Pashto',
79
+ 'pt_BR' => 'Portuguese (Brazil)',
80
+ 'pt_PT' => 'Portuguese (Portugal)',
81
+ 'ro_RO' => 'Romanian',
82
+ 'ru_RU' => 'Russian',
83
+ 'sk_SK' => 'Slovak',
84
+ 'sl_SI' => 'Slovenian',
85
+ 'sq_AL' => 'Albanian',
86
+ 'sr_RS' => 'Serbian',
87
+ 'sv_SE' => 'Swedish',
88
+ 'sw_KE' => 'Swahili',
89
+ 'ta_IN' => 'Tamil',
90
+ 'te_IN' => 'Telugu',
91
+ 'th_TH' => 'Thai',
92
+ 'tl_PH' => 'Filipino',
93
+ 'tr_TR' => 'Turkish',
94
+ 'uk_UA' => 'Ukrainian',
95
+ 'vi_VN' => 'Vietnamese',
96
+ 'zh_CN' => 'Simplified Chinese (China)',
97
+ 'zh_HK' => 'Traditional Chinese (Hong Kong)',
98
+ 'zh_TW' => 'Traditional Chinese (Taiwan)',
99
+ );
100
+ }
101
+
102
+ /**
103
+ * Return the timezones
104
+ *
105
+ * @since 4.0
106
+ *
107
+ * @return array
108
+ */
109
+ public static function timezones() {
110
+ return array(
111
+ 'Pacific/Midway' => '(GMT-11:00) Midway Island, Samoa',
112
+ 'America/Adak' => '(GMT-10:00) Hawaii-Aleutian',
113
+ 'Etc/GMT+10' => '(GMT-10:00) Hawaii',
114
+ 'Pacific/Marquesas' => '(GMT-09:30) Marquesas Islands',
115
+ 'Pacific/Gambier' => '(GMT-09:00) Gambier Islands',
116
+ 'America/Anchorage' => '(GMT-09:00) Alaska',
117
+ 'America/Ensenada' => '(GMT-08:00) Tijuana, Baja California',
118
+ 'Etc/GMT+8' => '(GMT-08:00) Pitcairn Islands',
119
+ 'America/Los_Angeles' => '(GMT-08:00) Pacific Time (US & Canada',
120
+ 'America/Denver' => '(GMT-07:00) Mountain Time (US & Canada',
121
+ 'America/Chihuahua' => '(GMT-07:00) Chihuahua, La Paz, Mazatlan',
122
+ 'America/Dawson_Creek' => '(GMT-07:00) Arizona',
123
+ 'America/Belize' => '(GMT-06:00) Saskatchewan, Central America',
124
+ 'America/Cancun' => '(GMT-06:00) Guadalajara, Mexico City, Monterrey',
125
+ 'Chile/EasterIsland' => '(GMT-06:00) Easter Island',
126
+ 'America/Chicago' => '(GMT-06:00) Central Time (US & Canada)',
127
+ 'America/New_York' => '(GMT-05:00) Eastern Time (US & Canada)',
128
+ 'America/Havana' => '(GMT-05:00) Cuba',
129
+ 'America/Bogota' => '(GMT-05:00) Bogota, Lima, Quito, Rio Branco',
130
+ 'America/Caracas' => '(GMT-04:30) Caracas',
131
+ 'America/Santiago' => '(GMT-04:00) Santiago',
132
+ 'America/La_Paz' => '(GMT-04:00) La Paz',
133
+ 'Atlantic/Stanley' => '(GMT-04:00) Faukland Islands',
134
+ 'America/Campo_Grande' => '(GMT-04:00) Brazil',
135
+ 'America/Goose_Bay' => '(GMT-04:00) Atlantic Time (Goose Bay)',
136
+ 'America/Glace_Bay' => '(GMT-04:00) Atlantic Time (Canada)',
137
+ 'America/St_Johns' => '(GMT-03:30) Newfoundland',
138
+ 'America/Araguaina' => '(GMT-03:00) UTC-3',
139
+ 'America/Montevideo' => '(GMT-03:00) Montevideo',
140
+ 'America/Miquelon' => '(GMT-03:00) Miquelon, St. Pierre',
141
+ 'America/Godthab' => '(GMT-03:00) Greenland',
142
+ 'America/Argentina/Buenos_Aires' => '(GMT-03:00) Buenos Aires',
143
+ 'America/Sao_Paulo' => '(GMT-03:00) Brasilia',
144
+ 'America/Noronha' => '(GMT-02:00) Mid-Atlantic',
145
+ 'Atlantic/Cape_Verde' => '(GMT-01:00) Cape Verde Is',
146
+ 'Atlantic/Azores' => '(GMT-01:00) Azores',
147
+ 'Europe/Belfast' => '(GMT) Greenwich Mean Time : Belfast',
148
+ 'Europe/Dublin' => '(GMT) Greenwich Mean Time : Dublin',
149
+ 'Europe/Lisbon' => '(GMT) Greenwich Mean Time : Lisbon',
150
+ 'Europe/London' => '(GMT) Greenwich Mean Time : London',
151
+ 'Africa/Abidjan' => '(GMT) Monrovia, Reykjavik',
152
+ 'Europe/Amsterdam' => '(GMT+01:00) Amsterdam, Berlin, Bern, Rome, Stockholm, Vienna',
153
+ 'Europe/Belgrade' => '(GMT+01:00) Belgrade, Bratislava, Budapest, Ljubljana, Prague',
154
+ 'Europe/Brussels' => '(GMT+01:00) Brussels, Copenhagen, Madrid, Paris',
155
+ 'Africa/Algiers' => '(GMT+01:00) West Central Africa',
156
+ 'Africa/Windhoek' => '(GMT+01:00) Windhoek',
157
+ 'Asia/Beirut' => '(GMT+02:00) Beirut',
158
+ 'Africa/Cairo' => '(GMT+02:00) Cairo',
159
+ 'Asia/Gaza' => '(GMT+02:00) Gaza',
160
+ 'Africa/Blantyre' => '(GMT+02:00) Harare, Pretoria',
161
+ 'Asia/Jerusalem' => '(GMT+02:00) Jerusalem',
162
+ 'Europe/Helsinki' => '(GMT+02:00) Helsinki',
163
+ 'Europe/Minsk' => '(GMT+02:00) Minsk',
164
+ 'Asia/Damascus' => '(GMT+02:00) Syria',
165
+ 'Europe/Moscow' => '(GMT+03:00) Moscow, St. Petersburg, Volgograd',
166
+ 'Africa/Addis_Ababa' => '(GMT+03:00) Nairobi',
167
+ 'Asia/Tehran' => '(GMT+03:30) Tehran',
168
+ 'Asia/Dubai' => '(GMT+04:00) Abu Dhabi, Muscat',
169
+ 'Asia/Yerevan' => '(GMT+04:00) Yerevan',
170
+ 'Asia/Kabul' => '(GMT+04:30) Kabul',
171
+ 'Asia/Yekaterinburg' => '(GMT+05:00) Ekaterinburg',
172
+ 'Asia/Tashkent' => '(GMT+05:00) Tashkent',
173
+ 'Asia/Kolkata' => '(GMT+05:30) Chennai, Kolkata, Mumbai, New Delhi',
174
+ 'Asia/Katmandu' => '(GMT+05:45) Kathmandu',
175
+ 'Asia/Dhaka' => '(GMT+06:00) Astana, Dhaka',
176
+ 'Asia/Novosibirsk' => '(GMT+06:00) Novosibirsk',
177
+ 'Asia/Rangoon' => '(GMT+06:30) Yangon (Rangoon',
178
+ 'Asia/Bangkok' => '(GMT+07:00) Bangkok, Hanoi, Jakarta',
179
+ 'Asia/Krasnoyarsk' => '(GMT+07:00) Krasnoyarsk',
180
+ 'Asia/Hong_Kong' => '(GMT+08:00) Beijing, Chongqing, Hong Kong, Urumqi',
181
+ 'Asia/Irkutsk' => '(GMT+08:00) Irkutsk, Ulaan Bataar',
182
+ 'Australia/Perth' => '(GMT+08:00) Perth',
183
+ 'Australia/Eucla' => '(GMT+08:45) Eucla',
184
+ 'Asia/Tokyo' => '(GMT+09:00) Osaka, Sapporo, Tokyo',
185
+ 'Asia/Seoul' => '(GMT+09:00) Seoul',
186
+ 'Asia/Yakutsk' => '(GMT+09:00) Yakutsk',
187
+ 'Australia/Adelaide' => '(GMT+09:30) Adelaide',
188
+ 'Australia/Darwin' => '(GMT+09:30) Darwin',
189
+ 'Australia/Brisbane' => '(GMT+10:00) Brisbane',
190
+ 'Australia/Hobart' => '(GMT+10:00) Sydney',
191
+ 'Asia/Vladivostok' => '(GMT+10:00) Vladivostok',
192
+ 'Australia/Lord_Howe' => '(GMT+10:30) Lord Howe Island',
193
+ 'Etc/GMT-11' => '(GMT+11:00) Solomon Is., New Caledonia',
194
+ 'Asia/Magadan' => '(GMT+11:00) Magadan',
195
+ 'Pacific/Norfolk' => '(GMT+11:30) Norfolk Island',
196
+ 'Asia/Anadyr' => '(GMT+12:00) Anadyr, Kamchatka',
197
+ 'Pacific/Auckland' => '(GMT+12:00) Auckland, Wellington',
198
+ 'Etc/GMT-12' => 'GMT+12:00) Fiji, Kamchatka, Marshall Is',
199
+ 'Pacific/Chatham' => '(GMT+12:45) Chatham Islands',
200
+ 'Pacific/Tongatapu' => '(GMT+13:00) Nuku\'alofa',
201
+ 'Pacific/Kiritimati' => '(GMT+14:00) Kiritimati'
202
+ );
203
+ }
204
  }
admin/assets/css/about.css CHANGED
@@ -1,785 +1,785 @@
1
- /*
2
- * About Us CSS TABLE OF CONTENTS
3
- *
4
- * 1.0 - GLOBAL
5
- * 2.0 - HEADER
6
- * 3.0 - 3.0 - ABOUT US CONTAINER
7
- * 3.1 - SECTION HEADER
8
- * 3.2 - ABOUT TEAM BOX
9
- * 3.3 - PLUGINS BOX
10
- * 4.0 - STICKY WIDGET
11
- * 5.0 - RESPONSIVENESS
12
- */
13
-
14
- /*** 1.0 - GLOBAL ***/
15
- .clearfix { display: inline-block; }
16
- /* start commented backslash hack \*/
17
- * html .clearfix { height: 1%; }
18
- .clearfix { display: block; }
19
- #sbi-about {
20
- -webkit-font-smoothing: antialiased;
21
- font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
22
- }
23
- #wpcontent {
24
- padding-left: 0px;
25
- }
26
- #wpbody-content {
27
- padding-bottom: 40px;
28
- }
29
- .clearfix:after {
30
- visibility: hidden;
31
- display: block;
32
- font-size: 0;
33
- content: " ";
34
- clear: both;
35
- height: 0;
36
- }
37
-
38
- /*orange*/
39
- .sb-btn-orange{
40
- background: #E34F0E!important;
41
- color: #fff!important;
42
- }
43
- .sb-btn-orange:hover{
44
- background: #F37036!important;
45
- color: #fff!important;
46
- }
47
- .sb-btn-orange:focus,
48
- .sb-btn-orange:active{
49
- background: #B8400B!important;
50
- color: #fff!important;
51
- }
52
- .sbi-fb-full-wrapper{
53
- padding: 0 53px;
54
- padding-top: 82px;
55
- }
56
- .sbi-fb-fs {
57
- width: 100%;
58
- position: relative;
59
- float: left;
60
- box-sizing: border-box;
61
- }
62
-
63
- /*** 2.0 - HEADER ***/
64
- .sbi-fb-create-ctn{
65
- margin-top: 90px;
66
- }
67
- .sbi-fb-header{
68
- height: 64px;
69
- position: absolute;
70
- display: flex;
71
- flex-direction: row;
72
- justify-content: space-between;
73
- align-items: center;
74
- background: #fff;
75
- padding: 0px 52px;
76
- z-index: 2;
77
- }
78
- .sbi-fb-header-left {
79
- display: flex;
80
- }
81
- .sbi-fb-header-left .sb-social-wall-link-wrap {
82
- margin-left: 30px;
83
- }
84
- .sb-social-wall-link-wrap {
85
- display: flex;
86
- font-size: 14px;
87
- margin: 10px 0 10px 30px;
88
- }
89
- .sb-social-wall-link:first-child {
90
- padding-left: 0;
91
- border-right: 1px solid #ccc;
92
- color: #0068A0!important;
93
- line-height: 1;
94
- }
95
- .sb-social-wall-link {
96
- padding: 0 12px;
97
- border-right: 1px solid #ccc;
98
- color: #0068A0!important;
99
- line-height: 1;
100
- }
101
- .sb-social-wall-link a {
102
- text-decoration: none;
103
- }
104
- .sb-social-wall-link a:focus {
105
- outline: none;
106
- box-shadow: none;
107
- }
108
- .sb-social-wall-link:last-child {
109
- border-right: none;
110
- }
111
- .sbi-fb-hd-logo{
112
- display: flex;
113
- vertical-align: middle;
114
- align-items: center;
115
- gap: 5px;
116
- }
117
- .sbi-fb-hd-logo .sb-logo-letters-wrap {
118
- margin-bottom: 4px;
119
- }
120
- .sbi-fb-hd-logo .breadcrumb-title{
121
- font-size: 14px;
122
- font-weight: 400;
123
- line-height: 22px;
124
- letter-spacing: 0em;
125
- margin-left: 4px;
126
- }
127
- .sbi-fb-hd-logo .separator{
128
- margin: 0 5px 0 10px;
129
- }
130
- .sbi-fb-hd-btn{
131
- height: 38px;
132
- cursor: pointer;
133
- display: flex;
134
- flex-direction: row;
135
- justify-content: center;
136
- align-items: center;
137
- padding: 0px 15px 0px 16px;
138
- font-weight: 600;
139
- font-size:14px;
140
- color: #353A41;
141
- background: #F3F4F5;
142
- border-radius: 2px;
143
- border: 1px solid #DCDDE1;
144
- position: relative;
145
- text-decoration: none;
146
- transition: all 0.15s ease-in-out;
147
- }
148
- .sbi-fb-hd-btn:focus {
149
- outline: none;
150
- box-shadow: none;
151
- }
152
- .sbi-fb-hd-btn:hover {
153
- color: inherit;
154
- background-color: #fff;
155
- }
156
- .sbi-fb-hd-btn i{
157
- margin: 0px 5px;
158
- }
159
- .sbi-fb-hd-btn[data-icon="left"]{
160
- padding-right: 20px!important;
161
- }
162
- .sbi-fb-full-wrapper .section-header h1 {
163
- font-size: 32px;
164
- line-height: 40px;
165
- }
166
- /*** 3.0 - SB CONTAINER ***/
167
- .sbi-sb-container {
168
- max-width: 875px;
169
- position: relative;
170
- margin: auto;
171
- margin-top: 33px;
172
- box-sizing: border-box;
173
- }
174
-
175
- /*** 3.1 - SECTION HEADER ***/
176
- .sbi-section-header h2 {
177
- font-weight: 600;
178
- font-size: 32px;
179
- line-height: 40px;
180
- color: #141B38;
181
- margin: 0 0 5px 0;
182
- }
183
-
184
- .sbi-section-header p {
185
- font-size: 13px;
186
- line-height: 18px;
187
- color: #8C8F9A;
188
- margin: 0;
189
- }
190
- .sbi-section-second-header {
191
- margin-top: 36px;
192
- }
193
- .sbi-section-second-header h3 {
194
- font-weight: 600;
195
- font-size: 24px;
196
- line-height: 29px;
197
- color: #141B38;
198
- margin: 0 0 5px 0;
199
- }
200
- .sbi-section-second-header p {
201
- font-size: 14px;
202
- line-height: 22px;
203
- color: #8C8F9A;
204
- margin-top: 0px;
205
- }
206
- .sbi-oembed-plugin-box {
207
- background: #FFFFFF;
208
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
209
- margin-bottom: 10px;
210
- padding: 12px 20px;
211
- display: flex;
212
- justify-content: space-between;
213
- align-items: center;
214
- }
215
- .sb-action-buttons .sbi-btn {
216
- display: flex;
217
- align-items: center;
218
- vertical-align: middle;
219
- justify-content: center;
220
- background: #F3F4F5;
221
- border: 1px solid #DCDDE1;
222
- box-sizing: border-box;
223
- border-radius: 2px;
224
- padding: 6px 19px;
225
- font-weight: 600;
226
- font-size: 12px;
227
- line-height: 18px;
228
- color: #141B38;
229
- box-sizing: border-box;
230
- letter-spacing: 0.2px;
231
- cursor: pointer;
232
- text-decoration: none;
233
- transition: all 0.15s ease-in-out;
234
- }
235
- .sb-action-buttons .sbi-btn:hover {
236
- background: #FFFFFF;
237
- border: 1px solid #D0D1D7;
238
- }
239
- .sb-action-buttons .sbi-btn:focus,
240
- .sb-action-buttons .sbi-btn:active {
241
- background: #E8E8EB;
242
- border: 1px solid #D0D1D7;
243
- box-shadow: none;
244
- outline: none;
245
- }
246
- .sb-action-buttons .sbi-btn.loading svg {
247
- height: 13px;
248
- transform: translate(0px, 2px);
249
- }
250
- .sb-action-buttons .sbi-btn.sb-btn-add svg {
251
- margin-right: 10px;
252
- height: 10px;
253
- }
254
- .sb-action-buttons .sbi-btn.sb-btn-add path {
255
- fill: #141B38;
256
- }
257
- .sb-action-buttons .sbi-btn.sb-btn-installed {
258
- background: #E8E8EB;
259
- color: #8C8F9A;
260
- cursor: not-allowed
261
- }
262
- .sb-action-buttons .sbi-btn.sb-btn-add {
263
- min-width: 110px;
264
- }
265
- .sb-action-buttons .sbi-btn.sb-btn-activate {
266
- background-color: #0068A0;
267
- border-color: #0068A0;
268
- color: #fff;
269
- }
270
- .sb-action-buttons .sbi-btn.sb-btn-activate:hover {
271
- background-color: #0096CC;
272
- border-color: #0096CC;
273
- }
274
- .sb-action-buttons .sbi-btn.sb-btn-activate:focus,
275
- .sb-action-buttons .sbi-btn.sb-btn-activate:active {
276
- background-color: #004D77;
277
- border-color: #004D77;
278
- }
279
- .sb-action-buttons .sbi-btn.sb-btn-deactivate {
280
- background-color: #D72C2C;
281
- border-color: #D72C2C;
282
- color: #fff;
283
- display: none;
284
- }
285
- .sb-action-buttons .sbi-btn.sb-btn-deactivate:hover {
286
- background-color: #DF5757;
287
- border-color: #DF5757;
288
- }
289
- .sb-action-buttons .sbi-btn.sb-btn-deactivate:focus,
290
- .sb-action-buttons .sbi-btn.sb-btn-deactivate:active {
291
- background-color: #841919;
292
- border-color: #841919;
293
- }
294
- .sb-action-buttons .sbi-btn:not(:last-child) {
295
- margin-right: 8px;
296
- }
297
- .sb-btn-add-plugin svg {
298
- height: 10px;
299
- margin-right: 10px;
300
- }
301
- .sb-btn-add-plugin svg path {
302
- fill: #141B38;
303
- }
304
- .sb-btn-installed svg {
305
- margin-right: 10px;
306
- }
307
- /*** 3.2 - ABOUT TEAM BOX ***/
308
- .sbi-about-box {
309
- margin-top: 11px;
310
- }
311
- .sbi-about-box .sb-team-avatar {
312
- padding: 55px 0 50px;
313
- background-image: linear-gradient(to right, #0068A0 , #0096CC);
314
- text-align: center;
315
- }
316
- .sbi-about-box .sb-team-avatar img {
317
- max-width: 100%;
318
- width: 603px;
319
- }
320
- .sbi-about-box .sb-team-info {
321
- display: flex;
322
- padding: 48px;
323
- background: #fff;
324
- box-shadow: 0px 1px 2px rgb(0 0 0 / 5%), 0px 4px 5px rgb(0 0 0 / 5%);
325
- border-radius: 0 0 2px 2px;
326
- text-align: left;
327
- }
328
- .sb-team-info > div {
329
- min-width: 50%;
330
- }
331
- .sbi-about-box .sb-team-info .sb-team-left h2 {
332
- font-size: 24px;
333
- line-height: 29px;
334
- letter-spacing: 0;
335
- color: #141B38;
336
- margin: 0;
337
- padding-right: 5px;
338
- }
339
- .sbi-about-box .sb-team-info .sb-team-right {
340
- padding-left: 37px;
341
- max-width: 365px;
342
- box-sizing: border-box;
343
- }
344
- .sbi-about-box .sb-team-info .sb-team-right p {
345
- font-size: 14px;
346
- line-height: 22px;
347
- color: #64748B;
348
- margin-top: 0;
349
- }
350
-
351
- /*** 3.3 - EXTENSION PLUGINS BOX CONTAINER ***/
352
- .sbi-plugins-boxes-container {
353
- display: flex;
354
- flex-wrap: wrap;
355
- align-items: center;
356
- justify-content: space-between;
357
- margin-top: 20px;
358
- gap: 12px;
359
- }
360
- .sbi-plugins-boxes-container.sb-recommended-plugins {
361
- margin-top: 26px;
362
- }
363
- .sbi-plugins-boxes-container .sb-plugins-box{
364
- background-color: #fff;
365
- padding: 20px 16px;
366
- box-shadow: 0px 1px 2px rgb(0 0 0 / 5%), 0px 4px 5px rgb(0 0 0 / 5%);
367
- border-radius: 4px;
368
- display: flex;
369
- width: calc((100% / 2) - 6px);
370
- box-sizing: border-box;
371
- }
372
- .sbi-plugins-boxes-container .sb-plugins-box .icon {
373
- max-width: 80px;
374
- padding-right: 5px;
375
- box-sizing: border-box;
376
- width: 80px;
377
- min-width: 72px;
378
- }
379
- .sbi-plugins-boxes-container.sb-recommended-plugins .sb-plugins-box .icon {
380
- max-width: 80px;
381
- padding-right: 23px;
382
- box-sizing: border-box;
383
- width: 80px;
384
- min-width: 72px;
385
- padding-left: 8px;
386
- }
387
- .sbi-plugins-boxes-container .sb-plugins-box .icon img {
388
- max-width: 100%;
389
- }
390
- .sb-plugins-box .sb-box-title {
391
- font-weight: 600;
392
- font-size: 16px;
393
- line-height: 22px;
394
- color: #141B38;
395
- margin-top: 0;
396
- margin-bottom: 5px;
397
- }
398
- .sb-plugins-box .sb-box-description {
399
- margin: 0;
400
- font-size: 13px;
401
- line-height: 18px;
402
- color: #8C8F9A;
403
- }
404
- .sb-recommended-plugins .sb-plugins-box .sb-box-description {
405
- min-height: 69px;
406
- }
407
- .sb-plugins-box .sb-action-buttons {
408
- margin-top: 20px;
409
- display: flex;
410
- }
411
-
412
- .sbi-plugins-boxes-container .sb-plugins-box.sbi-social-wall-plugin-box {
413
- padding: 27px 20px 35px 120px;
414
- flex-basis: 100%;
415
- margin-right: 0;
416
- justify-content: center;
417
- position: relative;
418
- overflow: hidden;
419
- }
420
- .sbi-social-wall-plugin-box .sb-action-buttons .sb-btn-add {
421
- padding: 6px 4px 6px 15px;
422
- }
423
- .sbi-social-wall-plugin-box .sb-action-buttons .sb-btn-add span {
424
- margin-left: 12px;
425
- }
426
- .sbi-plugins-boxes-container .sb-plugins-box.sbi-social-wall-plugin-box .plugin-box-content {
427
- z-index: 11;
428
- }
429
- .sbi-social-wall-plugin-box .sb-box-title {
430
- font-size: 24px;
431
- line-height: 27px;
432
- letter-spacing: 0;
433
- color: #141B38;
434
- }
435
- .sbi-social-wall-plugin-box .sb-box-description {
436
- font-size: 14px;
437
- line-height: 22px;
438
- color: #8C8F9A;
439
- }
440
- .sbi-social-wall-plugin-box .sb-box-bg-image {
441
- position: absolute;
442
- z-index: 0;
443
- left: -40px;
444
- width: 356px;
445
- top: 0;
446
- }
447
- .sbi-social-wall-plugin-box .sb-box-bg-image img {
448
- max-width: 100%;
449
- }
450
-
451
-
452
- /*** 4.0 Sticky Widget ***/
453
- .sbi-stck-wdg{
454
- position: fixed;
455
- right: 21px;
456
- z-index: 9;
457
- bottom: 20px;
458
- }
459
- .sbi-stck-wdg-btn{
460
- width: 52px;
461
- height: 52px;
462
- background: #fff;
463
- border-radius: 50%;
464
- cursor: pointer;
465
- display: flex;
466
- justify-content: center;
467
- align-items: center;
468
- filter: drop-shadow(0px 9px 13px rgba(0, 0, 0, 0.2));
469
- }
470
- .sbi-stck-wdg-btn svg{
471
- width: 25px;
472
- fill: #E34F0E;
473
- height: 33px;
474
- float: left;
475
- }
476
-
477
- .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls,
478
- .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls svg{
479
- display: block;
480
- }
481
- .sbi-stck-wdg-btn-cls{
482
- width: inherit;
483
- height: inherit;
484
- position: relative;
485
- color: #364152;
486
- box-shadow: 0px 1px 6px rgb(0 0 0 / 5%), 0px 9px 12px rgb(0 0 0 / 5%);
487
- border-radius: 70px;
488
- }
489
- .sbi-stck-wdg-btn-cls svg {
490
- width: 14px;
491
- height: 14px;
492
- position: absolute;
493
- top: 50%;
494
- right: 0;
495
- bottom: 0;
496
- left: 50%;
497
- margin-top: -7px;
498
- margin-left: -7px;
499
- }
500
-
501
- .sbi-stck-pop{
502
- position: absolute;
503
- width: 292px;
504
- height: auto;
505
- background: #fff;
506
- border: 1px solid #E2E8F0;
507
- box-sizing: border-box;
508
- box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15), 0px 3px 14px rgba(0, 0, 0, 0.12);
509
- border-radius: 2px;
510
- padding: 20px;
511
- right: 0px;
512
- bottom: 66px;
513
- color: #141B38;
514
- padding-bottom: 82px;
515
- }
516
- .sbi-stck-wdg[data-active="true"] .sbi-stck-pop{
517
- bottom: 66px;
518
- opacity: 1;
519
- visibility: visible;
520
- }
521
-
522
- .sbi-stck-pop svg{
523
- fill: currentColor;
524
- }
525
- .sbi-stck-el-list{
526
- border: 1px solid #DCDDE1;
527
- border-radius: 2px;
528
- }
529
- .sbi-stck-el{
530
- display: flex;
531
- align-items: center;
532
- padding: 11px 13px;
533
- border-bottom: 1px solid #DCDDE1;
534
- transition: background .15s ease-in-out;
535
- font-size: 12px;
536
- }
537
- .sbi-stck-el:hover{
538
- background: #F3F4F5;
539
- }
540
- .sbi-stck-el:last-of-type{
541
- border-bottom: 0px;
542
- }
543
- .sbi-stck-el-list .sbi-chevron svg{
544
- width: 5px;
545
- height: 8px;
546
- }
547
- .sbi-fs-a {
548
- width: 100%;
549
- height: 100%;
550
- display: block;
551
- position: absolute;
552
- left: 0;
553
- top: 0;
554
- z-index: 1;
555
- }
556
- .sbi-stck-el .sbi-stck-el-txt{
557
- color: #27303F;
558
- }
559
- .sbi-stck-el.sbi-stck-el-upgrd{
560
- padding: 9px 14px;
561
- font-size: 14px;
562
- background: var(--cl-orange);
563
- color: #fff;
564
- position: relative;
565
- transition: background .15s ease-in-out;
566
- font-weight: 600;
567
- }
568
- .sbi-chevron {
569
- position: absolute;
570
- right: 14px
571
- }
572
- .sbi-stck-el.sbi-stck-el-upgrd .sbi-stck-el-txt{
573
- color: #fff;
574
- }
575
- .sbi-stck-el.sbi-stck-el-upgrd:after{
576
- top: 20px;
577
- opacity: 1;
578
- }
579
- .sbi-stck-el-icon{
580
- margin-right: 10px;
581
- }
582
- .sbi-stck-el-icon svg{
583
- width: 17px;
584
- float: left;
585
- }
586
- .sbi-stck-title{
587
- margin-top: 20px;
588
- margin-bottom: 10px;
589
- color: #141B38;
590
- font-weight: 600;
591
- font-size: 14px;
592
- line-height: 160%;
593
- }
594
- .sbi-stck-follow{
595
- background: #F3F4F5;
596
- margin-top: 20px;
597
- left: 0px;
598
- bottom: 0px;
599
- position: absolute;
600
- padding: 12px 20px;
601
- display: flex;
602
- align-items: center;
603
- }
604
- .sbi-stck-follow span{
605
- font-weight: 600;
606
- font-size: 14px;
607
- }
608
- .sbi-stck-flw-links{
609
- display: flex;
610
- justify-content: center;
611
- align-items: center;
612
- margin-left: auto;
613
- }
614
- .sbi-stck-flw-links a{
615
- width: 36px;
616
- height: 28px;
617
- color: inherit;
618
- display: inline-flex;
619
- justify-content: center;
620
- align-items: center;
621
- margin-left: 4px;
622
- border-radius: 2px;
623
- transition: background .15s ease-in-out;
624
- }
625
- .sbi-stck-flw-links svg{
626
- width: 17px;
627
- color: #141B38;
628
- }
629
- .sbi-stck-flw-links a:hover{
630
- background: #fff;
631
- }
632
- .sbi-stck-flw-links a:hover svg{
633
- color: inherit;
634
- }
635
-
636
-
637
- /*** 5.0 - RESPONSIVENESS ***/
638
- @media (max-width: 1024px) {
639
- .sbi-extensions-boxes-container .sb-extensions-box{
640
- width: calc(48% - 33px);
641
- }
642
- .sbi-extensions-boxes-container .sb-extensions-box:not(:nth-child(3n)) {
643
- margin-right: 0;
644
- }
645
- .sbi-extensions-boxes-container .sb-extensions-box:not(:nth-child(2n)) {
646
- margin-right: 12px;
647
- }
648
- .sbi-plugins-boxes-container {
649
- padding-right: 0px;
650
- }
651
- .sbi-social-wall-plugin-box .sb-box-bg-image {
652
- left: -45px;
653
- }
654
- .sbi-plugins-boxes-container .sb-plugins-box.sbi-social-wall-plugin-box {
655
- padding: 27px 20px 22px 130px;
656
- }
657
- .sbi-section-second-header {
658
- padding-right: 15px;
659
- }
660
- }
661
- @media (min-width: 768px) and (max-width: 1024px) {
662
- .sbi-social-wall-plugin-box .sb-box-bg-image {
663
- left: -85px;
664
- }
665
- .sb-action-buttons .sbi-btn {
666
- padding: 6px 15px;
667
- }
668
- .sb-recommended-plugins .sb-plugins-box {
669
- min-height: 209px;
670
- }
671
- .sb-recommended-plugins .sb-plugins-box .sb-box-description {
672
- min-height: 90px;
673
- }
674
-
675
- }
676
- @media (max-width: 767px) {
677
- .auto-fold #wpcontent {
678
- padding-left: 0;
679
- }
680
- .sbi-fb-full-wrapper {
681
- padding: 70px 20px 0 20px;
682
- }
683
- .sbi-fb-hd-btn {
684
- padding: 0px 15px 0px 7px;
685
- }
686
- .sbi-fb-header {
687
- padding: 0px 20px;
688
- }
689
- .sbi-about-box .sb-team-info {
690
- padding: 30px;
691
- }
692
- .sbi-plugins-boxes-container .sb-plugins-box {
693
- width: 100%;
694
- }
695
- .sbi-plugins-boxes-container .sb-plugins-box.sbi-social-wall-plugin-box {
696
- display: flex;
697
- flex-direction: column;
698
- padding: 0px;
699
- }
700
- .sbi-social-wall-plugin-box .sb-box-bg-image {
701
- position: initial;
702
- background-color: #c3d7f3;
703
- width: 100%;
704
- height: 190px;
705
- }
706
- .sbi-plugins-boxes-container .sb-plugins-box.sbi-social-wall-plugin-box .plugin-box-content {
707
- padding: 18px 24px 24px;
708
- }
709
- .sbi-social-wall-plugin-box .sb-box-title {
710
- font-size: 18px;
711
- }
712
- .sbi-social-wall-plugin-box .sb-box-bg-image img {
713
- max-width: 401px;
714
- }
715
- .sbi-about-box .sb-team-info {
716
- flex-direction: column;
717
- }
718
- .sbi-about-box .sb-team-info .sb-team-right {
719
- padding-left: 0;
720
- max-width: none;
721
- margin-top: 30px;
722
- }
723
-
724
- .sb-recommended-plugins .sb-plugins-box .sb-box-description {
725
- min-height: initial;
726
- }
727
- .sbi-about-box .sb-team-avatar {
728
- display: none;
729
- }
730
- .sbi-about-box .sb-team-info .sb-team-left h2 {
731
- font-size: 21px;
732
- }
733
- }
734
-
735
- @media (max-width: 570px) {
736
- .sbi-extensions-boxes-container .sb-extensions-box {
737
- width: calc(100% - 30px);
738
- }
739
- .sbi-plugins-boxes-container {
740
- padding-right: 0px;
741
- }
742
- .sbi-plugins-boxes-container .sb-plugins-box:not(:nth-child(2n)) {
743
- margin-right: 0px;
744
- }
745
- }
746
-
747
- @media (max-width: 480px) {
748
- .sbi-fb-hd-btn {
749
- padding: 0px 10px 0px 7px !important;
750
- }
751
- .sbi-fb-hd-btn[data-icon="left"] {
752
- padding-right: 10px!important;
753
- }
754
- .sbi-plugins-boxes-container .sb-plugins-box .icon {
755
- width: 60px;
756
- min-width: 60px;
757
- }
758
- .sbi-plugins-boxes-container.sb-recommended-plugins .sb-plugins-box .icon {
759
- padding-right: 11px;
760
- width: 58px;
761
- min-width: 58px;
762
- padding-left: 8px;
763
- }
764
- }
765
- .sb-button-standard{
766
- position: relative;
767
- font-style: normal;
768
- font-weight: 600;
769
- font-size: 14px;
770
- padding: 10px 20px 10px 39px;
771
- line-height: 16px;
772
- height: auto;
773
- }
774
- .sb-button-standard svg {
775
- width: 16px;
776
- height: 16px;
777
- position: absolute;
778
- left: 13px;
779
- right: auto;
780
- top: 10px;
781
- bottom: auto;
782
- }
783
- .sbi-stck-el.sbi-stck-el-upgrd svg path{
784
- fill: #fff!important;
785
- }
1
+ /*
2
+ * About Us CSS TABLE OF CONTENTS
3
+ *
4
+ * 1.0 - GLOBAL
5
+ * 2.0 - HEADER
6
+ * 3.0 - 3.0 - ABOUT US CONTAINER
7
+ * 3.1 - SECTION HEADER
8
+ * 3.2 - ABOUT TEAM BOX
9
+ * 3.3 - PLUGINS BOX
10
+ * 4.0 - STICKY WIDGET
11
+ * 5.0 - RESPONSIVENESS
12
+ */
13
+
14
+ /*** 1.0 - GLOBAL ***/
15
+ .clearfix { display: inline-block; }
16
+ /* start commented backslash hack \*/
17
+ * html .clearfix { height: 1%; }
18
+ .clearfix { display: block; }
19
+ #sbi-about {
20
+ -webkit-font-smoothing: antialiased;
21
+ font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
22
+ }
23
+ #wpcontent {
24
+ padding-left: 0px;
25
+ }
26
+ #wpbody-content {
27
+ padding-bottom: 40px;
28
+ }
29
+ .clearfix:after {
30
+ visibility: hidden;
31
+ display: block;
32
+ font-size: 0;
33
+ content: " ";
34
+ clear: both;
35
+ height: 0;
36
+ }
37
+
38
+ /*orange*/
39
+ .sb-btn-orange{
40
+ background: #E34F0E!important;
41
+ color: #fff!important;
42
+ }
43
+ .sb-btn-orange:hover{
44
+ background: #F37036!important;
45
+ color: #fff!important;
46
+ }
47
+ .sb-btn-orange:focus,
48
+ .sb-btn-orange:active{
49
+ background: #B8400B!important;
50
+ color: #fff!important;
51
+ }
52
+ .sbi-fb-full-wrapper{
53
+ padding: 0 53px;
54
+ padding-top: 82px;
55
+ }
56
+ .sbi-fb-fs {
57
+ width: 100%;
58
+ position: relative;
59
+ float: left;
60
+ box-sizing: border-box;
61
+ }
62
+
63
+ /*** 2.0 - HEADER ***/
64
+ .sbi-fb-create-ctn{
65
+ margin-top: 90px;
66
+ }
67
+ .sbi-fb-header{
68
+ height: 64px;
69
+ position: absolute;
70
+ display: flex;
71
+ flex-direction: row;
72
+ justify-content: space-between;
73
+ align-items: center;
74
+ background: #fff;
75
+ padding: 0px 52px;
76
+ z-index: 2;
77
+ }
78
+ .sbi-fb-header-left {
79
+ display: flex;
80
+ }
81
+ .sbi-fb-header-left .sb-social-wall-link-wrap {
82
+ margin-left: 30px;
83
+ }
84
+ .sb-social-wall-link-wrap {
85
+ display: flex;
86
+ font-size: 14px;
87
+ margin: 10px 0 10px 30px;
88
+ }
89
+ .sb-social-wall-link:first-child {
90
+ padding-left: 0;
91
+ border-right: 1px solid #ccc;
92
+ color: #0068A0!important;
93
+ line-height: 1;
94
+ }
95
+ .sb-social-wall-link {
96
+ padding: 0 12px;
97
+ border-right: 1px solid #ccc;
98
+ color: #0068A0!important;
99
+ line-height: 1;
100
+ }
101
+ .sb-social-wall-link a {
102
+ text-decoration: none;
103
+ }
104
+ .sb-social-wall-link a:focus {
105
+ outline: none;
106
+ box-shadow: none;
107
+ }
108
+ .sb-social-wall-link:last-child {
109
+ border-right: none;
110
+ }
111
+ .sbi-fb-hd-logo{
112
+ display: flex;
113
+ vertical-align: middle;
114
+ align-items: center;
115
+ gap: 5px;
116
+ }
117
+ .sbi-fb-hd-logo .sb-logo-letters-wrap {
118
+ margin-bottom: 4px;
119
+ }
120
+ .sbi-fb-hd-logo .breadcrumb-title{
121
+ font-size: 14px;
122
+ font-weight: 400;
123
+ line-height: 22px;
124
+ letter-spacing: 0em;
125
+ margin-left: 4px;
126
+ }
127
+ .sbi-fb-hd-logo .separator{
128
+ margin: 0 5px 0 10px;
129
+ }
130
+ .sbi-fb-hd-btn{
131
+ height: 38px;
132
+ cursor: pointer;
133
+ display: flex;
134
+ flex-direction: row;
135
+ justify-content: center;
136
+ align-items: center;
137
+ padding: 0px 15px 0px 16px;
138
+ font-weight: 600;
139
+ font-size:14px;
140
+ color: #353A41;
141
+ background: #F3F4F5;
142
+ border-radius: 2px;
143
+ border: 1px solid #DCDDE1;
144
+ position: relative;
145
+ text-decoration: none;
146
+ transition: all 0.15s ease-in-out;
147
+ }
148
+ .sbi-fb-hd-btn:focus {
149
+ outline: none;
150
+ box-shadow: none;
151
+ }
152
+ .sbi-fb-hd-btn:hover {
153
+ color: inherit;
154
+ background-color: #fff;
155
+ }
156
+ .sbi-fb-hd-btn i{
157
+ margin: 0px 5px;
158
+ }
159
+ .sbi-fb-hd-btn[data-icon="left"]{
160
+ padding-right: 20px!important;
161
+ }
162
+ .sbi-fb-full-wrapper .section-header h1 {
163
+ font-size: 32px;
164
+ line-height: 40px;
165
+ }
166
+ /*** 3.0 - SB CONTAINER ***/
167
+ .sbi-sb-container {
168
+ max-width: 875px;
169
+ position: relative;
170
+ margin: auto;
171
+ margin-top: 33px;
172
+ box-sizing: border-box;
173
+ }
174
+
175
+ /*** 3.1 - SECTION HEADER ***/
176
+ .sbi-section-header h2 {
177
+ font-weight: 600;
178
+ font-size: 32px;
179
+ line-height: 40px;
180
+ color: #141B38;
181
+ margin: 0 0 5px 0;
182
+ }
183
+
184
+ .sbi-section-header p {
185
+ font-size: 13px;
186
+ line-height: 18px;
187
+ color: #8C8F9A;
188
+ margin: 0;
189
+ }
190
+ .sbi-section-second-header {
191
+ margin-top: 36px;
192
+ }
193
+ .sbi-section-second-header h3 {
194
+ font-weight: 600;
195
+ font-size: 24px;
196
+ line-height: 29px;
197
+ color: #141B38;
198
+ margin: 0 0 5px 0;
199
+ }
200
+ .sbi-section-second-header p {
201
+ font-size: 14px;
202
+ line-height: 22px;
203
+ color: #8C8F9A;
204
+ margin-top: 0px;
205
+ }
206
+ .sbi-oembed-plugin-box {
207
+ background: #FFFFFF;
208
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
209
+ margin-bottom: 10px;
210
+ padding: 12px 20px;
211
+ display: flex;
212
+ justify-content: space-between;
213
+ align-items: center;
214
+ }
215
+ .sb-action-buttons .sbi-btn {
216
+ display: flex;
217
+ align-items: center;
218
+ vertical-align: middle;
219
+ justify-content: center;
220
+ background: #F3F4F5;
221
+ border: 1px solid #DCDDE1;
222
+ box-sizing: border-box;
223
+ border-radius: 2px;
224
+ padding: 6px 19px;
225
+ font-weight: 600;
226
+ font-size: 12px;
227
+ line-height: 18px;
228
+ color: #141B38;
229
+ box-sizing: border-box;
230
+ letter-spacing: 0.2px;
231
+ cursor: pointer;
232
+ text-decoration: none;
233
+ transition: all 0.15s ease-in-out;
234
+ }
235
+ .sb-action-buttons .sbi-btn:hover {
236
+ background: #FFFFFF;
237
+ border: 1px solid #D0D1D7;
238
+ }
239
+ .sb-action-buttons .sbi-btn:focus,
240
+ .sb-action-buttons .sbi-btn:active {
241
+ background: #E8E8EB;
242
+ border: 1px solid #D0D1D7;
243
+ box-shadow: none;
244
+ outline: none;
245
+ }
246
+ .sb-action-buttons .sbi-btn.loading svg {
247
+ height: 13px;
248
+ transform: translate(0px, 2px);
249
+ }
250
+ .sb-action-buttons .sbi-btn.sb-btn-add svg {
251
+ margin-right: 10px;
252
+ height: 10px;
253
+ }
254
+ .sb-action-buttons .sbi-btn.sb-btn-add path {
255
+ fill: #141B38;
256
+ }
257
+ .sb-action-buttons .sbi-btn.sb-btn-installed {
258
+ background: #E8E8EB;
259
+ color: #8C8F9A;
260
+ cursor: not-allowed
261
+ }
262
+ .sb-action-buttons .sbi-btn.sb-btn-add {
263
+ min-width: 110px;
264
+ }
265
+ .sb-action-buttons .sbi-btn.sb-btn-activate {
266
+ background-color: #0068A0;
267
+ border-color: #0068A0;
268
+ color: #fff;
269
+ }
270
+ .sb-action-buttons .sbi-btn.sb-btn-activate:hover {
271
+ background-color: #0096CC;
272
+ border-color: #0096CC;
273
+ }
274
+ .sb-action-buttons .sbi-btn.sb-btn-activate:focus,
275
+ .sb-action-buttons .sbi-btn.sb-btn-activate:active {
276
+ background-color: #004D77;
277
+ border-color: #004D77;
278
+ }
279
+ .sb-action-buttons .sbi-btn.sb-btn-deactivate {
280
+ background-color: #D72C2C;
281
+ border-color: #D72C2C;
282
+ color: #fff;
283
+ display: none;
284
+ }
285
+ .sb-action-buttons .sbi-btn.sb-btn-deactivate:hover {
286
+ background-color: #DF5757;
287
+ border-color: #DF5757;
288
+ }
289
+ .sb-action-buttons .sbi-btn.sb-btn-deactivate:focus,
290
+ .sb-action-buttons .sbi-btn.sb-btn-deactivate:active {
291
+ background-color: #841919;
292
+ border-color: #841919;
293
+ }
294
+ .sb-action-buttons .sbi-btn:not(:last-child) {
295
+ margin-right: 8px;
296
+ }
297
+ .sb-btn-add-plugin svg {
298
+ height: 10px;
299
+ margin-right: 10px;
300
+ }
301
+ .sb-btn-add-plugin svg path {
302
+ fill: #141B38;
303
+ }
304
+ .sb-btn-installed svg {
305
+ margin-right: 10px;
306
+ }
307
+ /*** 3.2 - ABOUT TEAM BOX ***/
308
+ .sbi-about-box {
309
+ margin-top: 11px;
310
+ }
311
+ .sbi-about-box .sb-team-avatar {
312
+ padding: 55px 0 50px;
313
+ background-image: linear-gradient(to right, #0068A0 , #0096CC);
314
+ text-align: center;
315
+ }
316
+ .sbi-about-box .sb-team-avatar img {
317
+ max-width: 100%;
318
+ width: 603px;
319
+ }
320
+ .sbi-about-box .sb-team-info {
321
+ display: flex;
322
+ padding: 48px;
323
+ background: #fff;
324
+ box-shadow: 0px 1px 2px rgb(0 0 0 / 5%), 0px 4px 5px rgb(0 0 0 / 5%);
325
+ border-radius: 0 0 2px 2px;
326
+ text-align: left;
327
+ }
328
+ .sb-team-info > div {
329
+ min-width: 50%;
330
+ }
331
+ .sbi-about-box .sb-team-info .sb-team-left h2 {
332
+ font-size: 24px;
333
+ line-height: 29px;
334
+ letter-spacing: 0;
335
+ color: #141B38;
336
+ margin: 0;
337
+ padding-right: 5px;
338
+ }
339
+ .sbi-about-box .sb-team-info .sb-team-right {
340
+ padding-left: 37px;
341
+ max-width: 365px;
342
+ box-sizing: border-box;
343
+ }
344
+ .sbi-about-box .sb-team-info .sb-team-right p {
345
+ font-size: 14px;
346
+ line-height: 22px;
347
+ color: #64748B;
348
+ margin-top: 0;
349
+ }
350
+
351
+ /*** 3.3 - EXTENSION PLUGINS BOX CONTAINER ***/
352
+ .sbi-plugins-boxes-container {
353
+ display: flex;
354
+ flex-wrap: wrap;
355
+ align-items: center;
356
+ justify-content: space-between;
357
+ margin-top: 20px;
358
+ gap: 12px;
359
+ }
360
+ .sbi-plugins-boxes-container.sb-recommended-plugins {
361
+ margin-top: 26px;
362
+ }
363
+ .sbi-plugins-boxes-container .sb-plugins-box{
364
+ background-color: #fff;
365
+ padding: 20px 16px;
366
+ box-shadow: 0px 1px 2px rgb(0 0 0 / 5%), 0px 4px 5px rgb(0 0 0 / 5%);
367
+ border-radius: 4px;
368
+ display: flex;
369
+ width: calc((100% / 2) - 6px);
370
+ box-sizing: border-box;
371
+ }
372
+ .sbi-plugins-boxes-container .sb-plugins-box .icon {
373
+ max-width: 80px;
374
+ padding-right: 5px;
375
+ box-sizing: border-box;
376
+ width: 80px;
377
+ min-width: 72px;
378
+ }
379
+ .sbi-plugins-boxes-container.sb-recommended-plugins .sb-plugins-box .icon {
380
+ max-width: 80px;
381
+ padding-right: 23px;
382
+ box-sizing: border-box;
383
+ width: 80px;
384
+ min-width: 72px;
385
+ padding-left: 8px;
386
+ }
387
+ .sbi-plugins-boxes-container .sb-plugins-box .icon img {
388
+ max-width: 100%;
389
+ }
390
+ .sb-plugins-box .sb-box-title {
391
+ font-weight: 600;
392
+ font-size: 16px;
393
+ line-height: 22px;
394
+ color: #141B38;
395
+ margin-top: 0;
396
+ margin-bottom: 5px;
397
+ }
398
+ .sb-plugins-box .sb-box-description {
399
+ margin: 0;
400
+ font-size: 13px;
401
+ line-height: 18px;
402
+ color: #8C8F9A;
403
+ }
404
+ .sb-recommended-plugins .sb-plugins-box .sb-box-description {
405
+ min-height: 69px;
406
+ }
407
+ .sb-plugins-box .sb-action-buttons {
408
+ margin-top: 20px;
409
+ display: flex;
410
+ }
411
+
412
+ .sbi-plugins-boxes-container .sb-plugins-box.sbi-social-wall-plugin-box {
413
+ padding: 27px 20px 35px 120px;
414
+ flex-basis: 100%;
415
+ margin-right: 0;
416
+ justify-content: center;
417
+ position: relative;
418
+ overflow: hidden;
419
+ }
420
+ .sbi-social-wall-plugin-box .sb-action-buttons .sb-btn-add {
421
+ padding: 6px 4px 6px 15px;
422
+ }
423
+ .sbi-social-wall-plugin-box .sb-action-buttons .sb-btn-add span {
424
+ margin-left: 12px;
425
+ }
426
+ .sbi-plugins-boxes-container .sb-plugins-box.sbi-social-wall-plugin-box .plugin-box-content {
427
+ z-index: 11;
428
+ }
429
+ .sbi-social-wall-plugin-box .sb-box-title {
430
+ font-size: 24px;
431
+ line-height: 27px;
432
+ letter-spacing: 0;
433
+ color: #141B38;
434
+ }
435
+ .sbi-social-wall-plugin-box .sb-box-description {
436
+ font-size: 14px;
437
+ line-height: 22px;
438
+ color: #8C8F9A;
439
+ }
440
+ .sbi-social-wall-plugin-box .sb-box-bg-image {
441
+ position: absolute;
442
+ z-index: 0;
443
+ left: -40px;
444
+ width: 356px;
445
+ top: 0;
446
+ }
447
+ .sbi-social-wall-plugin-box .sb-box-bg-image img {
448
+ max-width: 100%;
449
+ }
450
+
451
+
452
+ /*** 4.0 Sticky Widget ***/
453
+ .sbi-stck-wdg{
454
+ position: fixed;
455
+ right: 21px;
456
+ z-index: 9;
457
+ bottom: 20px;
458
+ }
459
+ .sbi-stck-wdg-btn{
460
+ width: 52px;
461
+ height: 52px;
462
+ background: #fff;
463
+ border-radius: 50%;
464
+ cursor: pointer;
465
+ display: flex;
466
+ justify-content: center;
467
+ align-items: center;
468
+ filter: drop-shadow(0px 9px 13px rgba(0, 0, 0, 0.2));
469
+ }
470
+ .sbi-stck-wdg-btn svg{
471
+ width: 25px;
472
+ fill: #E34F0E;
473
+ height: 33px;
474
+ float: left;
475
+ }
476
+
477
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls,
478
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls svg{
479
+ display: block;
480
+ }
481
+ .sbi-stck-wdg-btn-cls{
482
+ width: inherit;
483
+ height: inherit;
484
+ position: relative;
485
+ color: #364152;
486
+ box-shadow: 0px 1px 6px rgb(0 0 0 / 5%), 0px 9px 12px rgb(0 0 0 / 5%);
487
+ border-radius: 70px;
488
+ }
489
+ .sbi-stck-wdg-btn-cls svg {
490
+ width: 14px;
491
+ height: 14px;
492
+ position: absolute;
493
+ top: 50%;
494
+ right: 0;
495
+ bottom: 0;
496
+ left: 50%;
497
+ margin-top: -7px;
498
+ margin-left: -7px;
499
+ }
500
+
501
+ .sbi-stck-pop{
502
+ position: absolute;
503
+ width: 292px;
504
+ height: auto;
505
+ background: #fff;
506
+ border: 1px solid #E2E8F0;
507
+ box-sizing: border-box;
508
+ box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15), 0px 3px 14px rgba(0, 0, 0, 0.12);
509
+ border-radius: 2px;
510
+ padding: 20px;
511
+ right: 0px;
512
+ bottom: 66px;
513
+ color: #141B38;
514
+ padding-bottom: 82px;
515
+ }
516
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-pop{
517
+ bottom: 66px;
518
+ opacity: 1;
519
+ visibility: visible;
520
+ }
521
+
522
+ .sbi-stck-pop svg{
523
+ fill: currentColor;
524
+ }
525
+ .sbi-stck-el-list{
526
+ border: 1px solid #DCDDE1;
527
+ border-radius: 2px;
528
+ }
529
+ .sbi-stck-el{
530
+ display: flex;
531
+ align-items: center;
532
+ padding: 11px 13px;
533
+ border-bottom: 1px solid #DCDDE1;
534
+ transition: background .15s ease-in-out;
535
+ font-size: 12px;
536
+ }
537
+ .sbi-stck-el:hover{
538
+ background: #F3F4F5;
539
+ }
540
+ .sbi-stck-el:last-of-type{
541
+ border-bottom: 0px;
542
+ }
543
+ .sbi-stck-el-list .sbi-chevron svg{
544
+ width: 5px;
545
+ height: 8px;
546
+ }
547
+ .sbi-fs-a {
548
+ width: 100%;
549
+ height: 100%;
550
+ display: block;
551
+ position: absolute;
552
+ left: 0;
553
+ top: 0;
554
+ z-index: 1;
555
+ }
556
+ .sbi-stck-el .sbi-stck-el-txt{
557
+ color: #27303F;
558
+ }
559
+ .sbi-stck-el.sbi-stck-el-upgrd{
560
+ padding: 9px 14px;
561
+ font-size: 14px;
562
+ background: var(--cl-orange);
563
+ color: #fff;
564
+ position: relative;
565
+ transition: background .15s ease-in-out;
566
+ font-weight: 600;
567
+ }
568
+ .sbi-chevron {
569
+ position: absolute;
570
+ right: 14px
571
+ }
572
+ .sbi-stck-el.sbi-stck-el-upgrd .sbi-stck-el-txt{
573
+ color: #fff;
574
+ }
575
+ .sbi-stck-el.sbi-stck-el-upgrd:after{
576
+ top: 20px;
577
+ opacity: 1;
578
+ }
579
+ .sbi-stck-el-icon{
580
+ margin-right: 10px;
581
+ }
582
+ .sbi-stck-el-icon svg{
583
+ width: 17px;
584
+ float: left;
585
+ }
586
+ .sbi-stck-title{
587
+ margin-top: 20px;
588
+ margin-bottom: 10px;
589
+ color: #141B38;
590
+ font-weight: 600;
591
+ font-size: 14px;
592
+ line-height: 160%;
593
+ }
594
+ .sbi-stck-follow{
595
+ background: #F3F4F5;
596
+ margin-top: 20px;
597
+ left: 0px;
598
+ bottom: 0px;
599
+ position: absolute;
600
+ padding: 12px 20px;
601
+ display: flex;
602
+ align-items: center;
603
+ }
604
+ .sbi-stck-follow span{
605
+ font-weight: 600;
606
+ font-size: 14px;
607
+ }
608
+ .sbi-stck-flw-links{
609
+ display: flex;
610
+ justify-content: center;
611
+ align-items: center;
612
+ margin-left: auto;
613
+ }
614
+ .sbi-stck-flw-links a{
615
+ width: 36px;
616
+ height: 28px;
617
+ color: inherit;
618
+ display: inline-flex;
619
+ justify-content: center;
620
+ align-items: center;
621
+ margin-left: 4px;
622
+ border-radius: 2px;
623
+ transition: background .15s ease-in-out;
624
+ }
625
+ .sbi-stck-flw-links svg{
626
+ width: 17px;
627
+ color: #141B38;
628
+ }
629
+ .sbi-stck-flw-links a:hover{
630
+ background: #fff;
631
+ }
632
+ .sbi-stck-flw-links a:hover svg{
633
+ color: inherit;
634
+ }
635
+
636
+
637
+ /*** 5.0 - RESPONSIVENESS ***/
638
+ @media (max-width: 1024px) {
639
+ .sbi-extensions-boxes-container .sb-extensions-box{
640
+ width: calc(48% - 33px);
641
+ }
642
+ .sbi-extensions-boxes-container .sb-extensions-box:not(:nth-child(3n)) {
643
+ margin-right: 0;
644
+ }
645
+ .sbi-extensions-boxes-container .sb-extensions-box:not(:nth-child(2n)) {
646
+ margin-right: 12px;
647
+ }
648
+ .sbi-plugins-boxes-container {
649
+ padding-right: 0px;
650
+ }
651
+ .sbi-social-wall-plugin-box .sb-box-bg-image {
652
+ left: -45px;
653
+ }
654
+ .sbi-plugins-boxes-container .sb-plugins-box.sbi-social-wall-plugin-box {
655
+ padding: 27px 20px 22px 130px;
656
+ }
657
+ .sbi-section-second-header {
658
+ padding-right: 15px;
659
+ }
660
+ }
661
+ @media (min-width: 768px) and (max-width: 1024px) {
662
+ .sbi-social-wall-plugin-box .sb-box-bg-image {
663
+ left: -85px;
664
+ }
665
+ .sb-action-buttons .sbi-btn {
666
+ padding: 6px 15px;
667
+ }
668
+ .sb-recommended-plugins .sb-plugins-box {
669
+ min-height: 209px;
670
+ }
671
+ .sb-recommended-plugins .sb-plugins-box .sb-box-description {
672
+ min-height: 90px;
673
+ }
674
+
675
+ }
676
+ @media (max-width: 767px) {
677
+ .auto-fold #wpcontent {
678
+ padding-left: 0;
679
+ }
680
+ .sbi-fb-full-wrapper {
681
+ padding: 70px 20px 0 20px;
682
+ }
683
+ .sbi-fb-hd-btn {
684
+ padding: 0px 15px 0px 7px;
685
+ }
686
+ .sbi-fb-header {
687
+ padding: 0px 20px;
688
+ }
689
+ .sbi-about-box .sb-team-info {
690
+ padding: 30px;
691
+ }
692
+ .sbi-plugins-boxes-container .sb-plugins-box {
693
+ width: 100%;
694
+ }
695
+ .sbi-plugins-boxes-container .sb-plugins-box.sbi-social-wall-plugin-box {
696
+ display: flex;
697
+ flex-direction: column;
698
+ padding: 0px;
699
+ }
700
+ .sbi-social-wall-plugin-box .sb-box-bg-image {
701
+ position: initial;
702
+ background-color: #c3d7f3;
703
+ width: 100%;
704
+ height: 190px;
705
+ }
706
+ .sbi-plugins-boxes-container .sb-plugins-box.sbi-social-wall-plugin-box .plugin-box-content {
707
+ padding: 18px 24px 24px;
708
+ }
709
+ .sbi-social-wall-plugin-box .sb-box-title {
710
+ font-size: 18px;
711
+ }
712
+ .sbi-social-wall-plugin-box .sb-box-bg-image img {
713
+ max-width: 401px;
714
+ }
715
+ .sbi-about-box .sb-team-info {
716
+ flex-direction: column;
717
+ }
718
+ .sbi-about-box .sb-team-info .sb-team-right {
719
+ padding-left: 0;
720
+ max-width: none;
721
+ margin-top: 30px;
722
+ }
723
+
724
+ .sb-recommended-plugins .sb-plugins-box .sb-box-description {
725
+ min-height: initial;
726
+ }
727
+ .sbi-about-box .sb-team-avatar {
728
+ display: none;
729
+ }
730
+ .sbi-about-box .sb-team-info .sb-team-left h2 {
731
+ font-size: 21px;
732
+ }
733
+ }
734
+
735
+ @media (max-width: 570px) {
736
+ .sbi-extensions-boxes-container .sb-extensions-box {
737
+ width: calc(100% - 30px);
738
+ }
739
+ .sbi-plugins-boxes-container {
740
+ padding-right: 0px;
741
+ }
742
+ .sbi-plugins-boxes-container .sb-plugins-box:not(:nth-child(2n)) {
743
+ margin-right: 0px;
744
+ }
745
+ }
746
+
747
+ @media (max-width: 480px) {
748
+ .sbi-fb-hd-btn {
749
+ padding: 0px 10px 0px 7px !important;
750
+ }
751
+ .sbi-fb-hd-btn[data-icon="left"] {
752
+ padding-right: 10px!important;
753
+ }
754
+ .sbi-plugins-boxes-container .sb-plugins-box .icon {
755
+ width: 60px;
756
+ min-width: 60px;
757
+ }
758
+ .sbi-plugins-boxes-container.sb-recommended-plugins .sb-plugins-box .icon {
759
+ padding-right: 11px;
760
+ width: 58px;
761
+ min-width: 58px;
762
+ padding-left: 8px;
763
+ }
764
+ }
765
+ .sb-button-standard{
766
+ position: relative;
767
+ font-style: normal;
768
+ font-weight: 600;
769
+ font-size: 14px;
770
+ padding: 10px 20px 10px 39px;
771
+ line-height: 16px;
772
+ height: auto;
773
+ }
774
+ .sb-button-standard svg {
775
+ width: 16px;
776
+ height: 16px;
777
+ position: absolute;
778
+ left: 13px;
779
+ right: auto;
780
+ top: 10px;
781
+ bottom: auto;
782
+ }
783
+ .sbi-stck-el.sbi-stck-el-upgrd svg path{
784
+ fill: #fff!important;
785
+ }
admin/assets/css/admin-notifications.css CHANGED
@@ -1,224 +1,224 @@
1
- #sbi-notifications {
2
- position: relative;
3
- background: #FFFFFF 0 0 no-repeat padding-box;
4
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
5
- border-radius: 2px;
6
- opacity: 1;
7
- min-height: 48px;
8
- padding: 20px 120px 20px 82px;
9
- margin: 0 0 14px 0;
10
- }
11
-
12
- #sbi-notifications * {
13
- box-sizing: border-box;
14
- }
15
-
16
- #sbi-notifications .bell,
17
- #sbi-notifications .thumb{
18
- position: absolute;
19
- top: 20px;
20
- left: 24px;
21
- width: 34px;
22
- height: 44px;
23
- }
24
- #sbi-notifications .thumb img {
25
- max-width: 100%;
26
- }
27
- #sbi-notifications .thumb .img-overlay {
28
- top: 42px;
29
- left: -6px;
30
- width: 54px;
31
- position: absolute;
32
- background: #ca4a1f;
33
- color: #fff;
34
- padding: 2px 4px;
35
- border-radius: 3px;
36
- line-height: 1;
37
- font-size: 11px;
38
- font-weight: bold;
39
- text-align: center;
40
- }
41
-
42
- #sbi-notifications .messages .message {
43
- display: none;
44
- }
45
-
46
- #sbi-notifications .messages .message.current {
47
- display: block;
48
- }
49
-
50
- #sbi-notifications .messages .message .title {
51
- font-weight: 600;
52
- font-size: 18px;
53
- line-height: 25px;
54
- margin: 0;
55
- color: #141B38;
56
- letter-spacing: 0;
57
- }
58
-
59
- #sbi-notifications .messages .message .content {
60
- font-weight: normal;
61
- font-size: 14px;
62
- line-height: 22px;
63
- margin: 6px 0 32px 0;
64
- color: #434960;
65
- }
66
-
67
- #sbi-notifications .messages .message .buttons {
68
- margin: -15px 105px 3px 0;
69
- display: flex;
70
- }
71
- .sbi-btn {
72
- transition: all 0.15s ease-in-out;
73
- letter-spacing: 0.2px;
74
- }
75
- /*orange*/
76
- .sbi-btn-orange{
77
- background: #E34F0E!important;
78
- color: #fff!important;
79
- }
80
- .sbi-btn-orange:hover{
81
- background: #F37036!important;
82
- color: #fff!important;
83
- }
84
- .sbi-btn-orange:focus,
85
- .sbi-btn-orange:active{
86
- background: #B8400B!important;
87
- color: #fff!important;
88
- }
89
- /*grey*/
90
- .sbi-btn-grey{
91
- background: #F3F4F5!important;
92
- color: #141B38!important;
93
- border: 1px solid #D0D1D7!important;
94
- }
95
- .sbi-btn-grey:hover{
96
- background: #fff!important;
97
- color: #141B38!important;
98
- border: 1px solid #DCDDE1!important;
99
- }
100
- .sbi-btn-grey:focus,
101
- .sbi-btn-grey:active{
102
- background: #E8E8EB!important;
103
- color: #141B38!important;
104
- border: 1px solid #D0D1D7!important;
105
- }
106
- #sbi-notifications .messages .message .buttons a {
107
- font-weight: 600;
108
- padding: 6px 12px;
109
- border-radius: 2px;
110
- box-sizing: border-box;
111
- height: 32px;
112
- text-decoration: none;
113
- font-size: 12px;
114
- }
115
- #sbi-notifications .messages .message .buttons a.sbi-btn-orange {
116
- border: 1px solid #E34F0E
117
- }
118
- #sbi-notifications .messages .message .buttons a:not(:last-child) {
119
- margin-right: 8px;
120
- }
121
- #sbi-notifications .messages .message .buttons a:focus,
122
- #sbi-notifications .messages .message .buttons a:active {
123
- outline: none;
124
- box-shadow: none;
125
- }
126
- #sbi-notifications .dismiss {
127
- position: absolute;
128
- top: 14px;
129
- right: 14px;
130
- width: 16px;
131
- height: 16px;
132
- color: #72777C;
133
- font-size: 16px;
134
- cursor: pointer;
135
- text-align: center;
136
- vertical-align: middle;
137
- line-height: 16px;
138
- }
139
- #sbi-notifications .dismiss svg {
140
- width: 15px;
141
- height: 15px;
142
- }
143
- #sbi-notifications .dismiss svg path {
144
- fill: #8C8F9A;
145
- }
146
- #sbi-notifications .navigation {
147
- position: absolute;
148
- bottom: 24px;
149
- right: 21px;
150
- width: 72px;
151
- height: 30px;
152
- }
153
-
154
- #sbi-notifications .navigation a {
155
- display: block;
156
- width: 32px;
157
- height: 32px;
158
- border: 1px solid #DCDDE1;
159
- border-radius: 2px;
160
- font-size: 8px;
161
- text-align: center;
162
- vertical-align: middle;
163
- line-height: 30px;
164
- cursor: pointer;
165
- background: #F3F4F5;
166
- color: #141B38;
167
- display: flex;
168
- align-items: center;
169
- justify-content: center;
170
- transition: all 0.15s ease-in-out;
171
- }
172
-
173
- #sbi-notifications .navigation svg {
174
- width: 9px;
175
- height: 9px;
176
- }
177
-
178
- #sbi-notifications .navigation a:not(.disabled):hover {
179
- background-color: #fff;
180
- }
181
- #sbi-notifications .navigation a:not(.disabled):focus,
182
- #sbi-notifications .navigation a:not(.disabled):active {
183
- background: #E8E8EB;
184
- color: #141B38;
185
- }
186
-
187
- #sbi-notifications .navigation .prev {
188
- float: left;
189
- }
190
-
191
- #sbi-notifications .navigation .next {
192
- float: right;
193
- }
194
-
195
- #sbi-notifications .navigation .disabled {
196
- background: #E8E8EB;
197
- color: #8C8F9A;
198
- cursor: default;
199
- }
200
-
201
- @media screen and (max-width: 768px) {
202
- #sbi-notifications {
203
- padding: 15px 15px 15px 72px;
204
- }
205
- #sbi-notifications .messages .message .title {
206
- margin: 0 30px 0 0;
207
- }
208
- #sbi-notifications .messages .message .content {
209
- font-size: 16px;
210
- line-height: 24px;
211
- }
212
- #sbi-notifications .messages .message .buttons {
213
- margin: -30px 80px 0 0;
214
- }
215
- #sbi-notifications .messages .message .buttons a {
216
- margin: 0;
217
- display: table;
218
- }
219
- #sbi-notifications .messages .message .buttons .button-secondary {
220
- margin-top: 6px;
221
- }
222
- }
223
-
224
- /*# sourceMappingURL=data:application/json;charset=utf8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXNzZXRzL2Nzcy9hZG1pbi1ub3RpZmljYXRpb25zLmNzcyIsInNvdXJjZXMiOlsiYXNzZXRzL3Njc3MvYWRtaW4tbm90aWZpY2F0aW9ucy5zY3NzIl0sInNvdXJjZXNDb250ZW50IjpbIi8vIEFkbWluIG5vdGlmaWNhdGlvbiBzdHlsZXMuXG5cbiN3cGZvcm1zLW5vdGlmaWNhdGlvbnMge1xuXG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0YmFja2dyb3VuZDogI0ZGRkZGRiAwIDAgbm8tcmVwZWF0IHBhZGRpbmctYm94O1xuXHRib3gtc2hhZG93OiAwcHggNXB4IDE1cHggIzAwMDAwMDBEO1xuXHRib3JkZXItcmFkaXVzOiA2cHg7XG5cdG9wYWNpdHk6IDE7XG5cdG1pbi1oZWlnaHQ6IDQ4cHg7XG5cdHBhZGRpbmc6IDE1cHggMTAycHggMTVweCA3MnB4O1xuXHRtYXJnaW46IDAgMCAxNHB4IDA7XG5cblx0KiB7XG5cdFx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0fVxuXG5cdC5iZWxsIHtcblx0XHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdFx0dG9wOiAxNXB4O1xuXHRcdGxlZnQ6IDE1cHg7XG5cdFx0d2lkdGg6IDQycHg7XG5cdFx0aGVpZ2h0OiA0OHB4O1xuXHR9XG5cblx0Lm1lc3NhZ2VzIHtcblx0XHQubWVzc2FnZSB7XG5cdFx0XHRkaXNwbGF5OiBub25lO1xuXG5cdFx0XHQmLmN1cnJlbnQge1xuXHRcdFx0XHRkaXNwbGF5OiBibG9jaztcblx0XHRcdH1cblxuXHRcdFx0LnRpdGxlIHtcblx0XHRcdFx0Zm9udC13ZWlnaHQ6IGJvbGQ7XG5cdFx0XHRcdGZvbnQtc2l6ZTogMTdweDtcblx0XHRcdFx0bGluZS1oZWlnaHQ6IDIwcHg7XG5cdFx0XHRcdG1hcmdpbjogMDtcblx0XHRcdFx0Y29sb3I6ICM0NDQ7XG5cdFx0XHR9XG5cblx0XHRcdC5jb250ZW50IHtcblx0XHRcdFx0Zm9udC13ZWlnaHQ6IG5vcm1hbDtcblx0XHRcdFx0Zm9udC1zaXplOiAxM3B4O1xuXHRcdFx0XHRsaW5lLWhlaWdodDogMjBweDtcblx0XHRcdFx0bWFyZ2luOiA2cHggMCA0MHB4IDA7XG5cdFx0XHR9XG5cblx0XHRcdC5idXR0b25zIHtcblx0XHRcdFx0bWFyZ2luOiAtMzBweCA4MHB4IDAgMDtcblxuXHRcdFx0XHRhIHtcblx0XHRcdFx0XHRtYXJnaW46IDAgNnB4IDAgMDtcblx0XHRcdFx0XHRwYWRkaW5nOiA4cHggMTBweDtcblx0XHRcdFx0XHRsaW5lLWhlaWdodDogMTNweDtcblx0XHRcdFx0XHRmb250LXNpemU6IDEzcHg7XG5cdFx0XHRcdFx0bWluLWhlaWdodDogdW5zZXQ7XG5cdFx0XHRcdH1cblxuXHRcdFx0XHQuYnV0dG9uLXNlY29uZGFyeSB7XG5cdFx0XHRcdFx0Ym9yZGVyOiAxcHggc29saWQgIzAwNzFBMTtcblx0XHRcdFx0fVxuXHRcdFx0fVxuXHRcdH1cblx0fVxuXG5cdC5kaXNtaXNzIHtcblx0XHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdFx0dG9wOiAxNXB4O1xuXHRcdHJpZ2h0OiAxNXB4O1xuXHRcdHdpZHRoOiAxNnB4O1xuXHRcdGhlaWdodDogMTZweDtcblx0XHRjb2xvcjogIzcyNzc3Qztcblx0XHRmb250LXNpemU6IDE2cHg7XG5cdFx0Y3Vyc29yOiBwb2ludGVyO1xuXHRcdHRleHQtYWxpZ246IGNlbnRlcjtcblx0XHR2ZXJ0aWNhbC1hbGlnbjogbWlkZGxlO1xuXHRcdGxpbmUtaGVpZ2h0OiAxNnB4O1xuXG5cdFx0Jjpob3ZlciB7XG5cdFx0XHRjb2xvcjogI2RjMzIzMjtcblx0XHR9XG5cdH1cblxuXHQubmF2aWdhdGlvbiB7XG5cdFx0cG9zaXRpb246IGFic29sdXRlO1xuXHRcdGJvdHRvbTogMTVweDtcblx0XHRyaWdodDogMTVweDtcblx0XHR3aWR0aDogNjNweDtcblx0XHRoZWlnaHQ6IDMwcHg7XG5cblx0XHRhIHtcblx0XHRcdGRpc3BsYXk6IGJsb2NrO1xuXHRcdFx0d2lkdGg6IDMwcHg7XG5cdFx0XHRoZWlnaHQ6IDMwcHg7XG5cdFx0XHRib3JkZXI6IDFweCBzb2xpZCAjN0U4OTkzO1xuXHRcdFx0Ym9yZGVyLXJhZGl1czogM3B4O1xuXHRcdFx0Zm9udC1zaXplOiA4cHg7XG5cdFx0XHR0ZXh0LWFsaWduOiBjZW50ZXI7XG5cdFx0XHR2ZXJ0aWNhbC1hbGlnbjogbWlkZGxlO1xuXHRcdFx0bGluZS1oZWlnaHQ6IDMwcHg7XG5cdFx0XHRjdXJzb3I6IHBvaW50ZXI7XG5cdFx0XHRiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmZmZmO1xuXHRcdFx0Y29sb3I6ICM0MTQ1NEE7XG5cblx0XHRcdCY6aG92ZXIge1xuXHRcdFx0XHRiYWNrZ3JvdW5kLWNvbG9yOiAjZjFmMWYxO1xuXHRcdFx0fVxuXHRcdH1cblxuXHRcdC5wcmV2IHtcblx0XHRcdGZsb2F0OiBsZWZ0O1xuXHRcdH1cblxuXHRcdC5uZXh0IHtcblx0XHRcdGZsb2F0OiByaWdodDtcblx0XHR9XG5cblx0XHQuZGlzYWJsZWQge1xuXHRcdFx0Ym9yZGVyLWNvbG9yOiAjZGRkZGRkO1xuXHRcdFx0Y29sb3I6ICNBMEE1QUE7XG5cdFx0XHRjdXJzb3I6IGRlZmF1bHQ7XG5cblx0XHRcdCY6aG92ZXIge1xuXHRcdFx0XHRiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmZmZmO1xuXHRcdFx0fVxuXHRcdH1cblx0fVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuXG5cdCN3cGZvcm1zLW5vdGlmaWNhdGlvbnMge1xuXHRcdHBhZGRpbmc6IDE1cHggMTVweCAxNXB4IDcycHg7XG5cblx0XHQubWVzc2FnZXMge1xuXG5cdFx0XHQubWVzc2FnZSB7XG5cblx0XHRcdFx0LnRpdGxlIHtcblx0XHRcdFx0XHRtYXJnaW46IDAgMzBweCAwIDA7XG5cdFx0XHRcdH1cblxuXHRcdFx0XHQuY29udGVudCB7XG5cdFx0XHRcdFx0Zm9udC1zaXplOiAxNnB4O1xuXHRcdFx0XHRcdGxpbmUtaGVpZ2h0OiAyNHB4XG5cdFx0XHRcdH1cblxuXHRcdFx0XHQuYnV0dG9ucyB7XG5cdFx0XHRcdFx0bWFyZ2luOiAtMzBweCA4MHB4IDAgMDtcblxuXHRcdFx0XHRcdGEge1xuXHRcdFx0XHRcdFx0bWFyZ2luOiAwO1xuXHRcdFx0XHRcdFx0ZGlzcGxheTogdGFibGU7XG5cdFx0XHRcdFx0fVxuXG5cdFx0XHRcdFx0LmJ1dHRvbi1zZWNvbmRhcnkge1xuXHRcdFx0XHRcdFx0bWFyZ2luLXRvcDogNnB4O1xuXHRcdFx0XHRcdH1cblx0XHRcdFx0fVxuXHRcdFx0fVxuXHRcdH1cblx0fVxufSJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFQSxBQUFBLHNCQUFzQixDQUFDO0VBRXRCLFFBQVEsRUFBRSxRQUFRO0VBQ2xCLFVBQVUsRUFBRSxpQ0FBaUM7RUFDN0MsVUFBVSxFQUFFLHNCQUFzQjtFQUNsQyxhQUFhLEVBQUUsR0FBRztFQUNsQixPQUFPLEVBQUUsQ0FBQztFQUNWLFVBQVUsRUFBRSxJQUFJO0VBQ2hCLE9BQU8sRUFBRSxvQkFBb0I7RUFDN0IsTUFBTSxFQUFFLFVBQVU7Q0FxSGxCOztBQTlIRCxBQVdDLHNCQVhxQixDQVdyQixDQUFDLENBQUM7RUFDRCxVQUFVLEVBQUUsVUFBVTtDQUN0Qjs7QUFiRixBQWVDLHNCQWZxQixDQWVyQixLQUFLLENBQUM7RUFDTCxRQUFRLEVBQUUsUUFBUTtFQUNsQixHQUFHLEVBQUUsSUFBSTtFQUNULElBQUksRUFBRSxJQUFJO0VBQ1YsS0FBSyxFQUFFLElBQUk7RUFDWCxNQUFNLEVBQUUsSUFBSTtDQUNaOztBQXJCRixBQXdCRSxzQkF4Qm9CLENBdUJyQixTQUFTLENBQ1IsUUFBUSxDQUFDO0VBQ1IsT0FBTyxFQUFFLElBQUk7Q0FvQ2I7O0FBN0RILEFBMkJHLHNCQTNCbUIsQ0F1QnJCLFNBQVMsQ0FDUixRQUFRLEFBR04sUUFBUSxDQUFDO0VBQ1QsT0FBTyxFQUFFLEtBQUs7Q0FDZDs7QUE3QkosQUErQkcsc0JBL0JtQixDQXVCckIsU0FBUyxDQUNSLFFBQVEsQ0FPUCxNQUFNLENBQUM7RUFDTixXQUFXLEVBQUUsSUFBSTtFQUNqQixTQUFTLEVBQUUsSUFBSTtFQUNmLFdBQVcsRUFBRSxJQUFJO0VBQ2pCLE1BQU0sRUFBRSxDQUFDO0VBQ1QsS0FBSyxFQUFFLElBQUk7Q0FDWDs7QUFyQ0osQUF1Q0csc0JBdkNtQixDQXVCckIsU0FBUyxDQUNSLFFBQVEsQ0FlUCxRQUFRLENBQUM7RUFDUixXQUFXLEVBQUUsTUFBTTtFQUNuQixTQUFTLEVBQUUsSUFBSTtFQUNmLFdBQVcsRUFBRSxJQUFJO0VBQ2pCLE1BQU0sRUFBRSxZQUFZO0NBQ3BCOztBQTVDSixBQThDRyxzQkE5Q21CLENBdUJyQixTQUFTLENBQ1IsUUFBUSxDQXNCUCxRQUFRLENBQUM7RUFDUixNQUFNLEVBQUUsY0FBYztDQWF0Qjs7QUE1REosQUFpREksc0JBakRrQixDQXVCckIsU0FBUyxDQUNSLFFBQVEsQ0FzQlAsUUFBUSxDQUdQLENBQUMsQ0FBQztFQUNELE1BQU0sRUFBRSxTQUFTO0VBQ2pCLE9BQU8sRUFBRSxRQUFRO0VBQ2pCLFdBQVcsRUFBRSxJQUFJO0VBQ2pCLFNBQVMsRUFBRSxJQUFJO0VBQ2YsVUFBVSxFQUFFLEtBQUs7Q0FDakI7O0FBdkRMLEFBeURJLHNCQXpEa0IsQ0F1QnJCLFNBQVMsQ0FDUixRQUFRLENBc0JQLFFBQVEsQ0FXUCxpQkFBaUIsQ0FBQztFQUNqQixNQUFNLEVBQUUsaUJBQWlCO0NBQ3pCOztBQTNETCxBQWdFQyxzQkFoRXFCLENBZ0VyQixRQUFRLENBQUM7RUFDUixRQUFRLEVBQUUsUUFBUTtFQUNsQixHQUFHLEVBQUUsSUFBSTtFQUNULEtBQUssRUFBRSxJQUFJO0VBQ1gsS0FBSyxFQUFFLElBQUk7RUFDWCxNQUFNLEVBQUUsSUFBSTtFQUNaLEtBQUssRUFBRSxPQUFPO0VBQ2QsU0FBUyxFQUFFLElBQUk7RUFDZixNQUFNLEVBQUUsT0FBTztFQUNmLFVBQVUsRUFBRSxNQUFNO0VBQ2xCLGNBQWMsRUFBRSxNQUFNO0VBQ3RCLFdBQVcsRUFBRSxJQUFJO0NBS2pCOztBQWhGRixBQTZFRSxzQkE3RW9CLENBZ0VyQixRQUFRLEFBYU4sTUFBTSxDQUFDO0VBQ1AsS0FBSyxFQUFFLE9BQU87Q0FDZDs7QUEvRUgsQUFrRkMsc0JBbEZxQixDQWtGckIsV0FBVyxDQUFDO0VBQ1gsUUFBUSxFQUFFLFFBQVE7RUFDbEIsTUFBTSxFQUFFLElBQUk7RUFDWixLQUFLLEVBQUUsSUFBSTtFQUNYLEtBQUssRUFBRSxJQUFJO0VBQ1gsTUFBTSxFQUFFLElBQUk7Q0FzQ1o7O0FBN0hGLEFBeUZFLHNCQXpGb0IsQ0FrRnJCLFdBQVcsQ0FPVixDQUFDLENBQUM7RUFDRCxPQUFPLEVBQUUsS0FBSztFQUNkLEtBQUssRUFBRSxJQUFJO0VBQ1gsTUFBTSxFQUFFLElBQUk7RUFDWixNQUFNLEVBQUUsaUJBQWlCO0VBQ3pCLGFBQWEsRUFBRSxHQUFHO0VBQ2xCLFNBQVMsRUFBRSxHQUFHO0VBQ2QsVUFBVSxFQUFFLE1BQU07RUFDbEIsY0FBYyxFQUFFLE1BQU07RUFDdEIsV0FBVyxFQUFFLElBQUk7RUFDakIsTUFBTSxFQUFFLE9BQU87RUFDZixnQkFBZ0IsRUFBRSxPQUFPO0VBQ3pCLEtBQUssRUFBRSxPQUFPO0NBS2Q7O0FBMUdILEFBdUdHLHNCQXZHbUIsQ0FrRnJCLFdBQVcsQ0FPVixDQUFDLEFBY0MsTUFBTSxDQUFDO0VBQ1AsZ0JBQWdCLEVBQUUsT0FBTztDQUN6Qjs7QUF6R0osQUE0R0Usc0JBNUdvQixDQWtGckIsV0FBVyxDQTBCVixLQUFLLENBQUM7RUFDTCxLQUFLLEVBQUUsSUFBSTtDQUNYOztBQTlHSCxBQWdIRSxzQkFoSG9CLENBa0ZyQixXQUFXLENBOEJWLEtBQUssQ0FBQztFQUNMLEtBQUssRUFBRSxLQUFLO0NBQ1o7O0FBbEhILEFBb0hFLHNCQXBIb0IsQ0FrRnJCLFdBQVcsQ0FrQ1YsU0FBUyxDQUFDO0VBQ1QsWUFBWSxFQUFFLE9BQU87RUFDckIsS0FBSyxFQUFFLE9BQU87RUFDZCxNQUFNLEVBQUUsT0FBTztDQUtmOztBQTVISCxBQXlIRyxzQkF6SG1CLENBa0ZyQixXQUFXLENBa0NWLFNBQVMsQUFLUCxNQUFNLENBQUM7RUFDUCxnQkFBZ0IsRUFBRSxPQUFPO0NBQ3pCOztBQUtKLE1BQU0sQ0FBQyxNQUFNLE1BQU0sU0FBUyxFQUFFLEtBQUs7RUFFbEMsQUFBQSxzQkFBc0IsQ0FBQztJQUN0QixPQUFPLEVBQUUsbUJBQW1CO0dBNkI1QjtFQTlCRCxBQU9HLHNCQVBtQixDQUdyQixTQUFTLENBRVIsUUFBUSxDQUVQLE1BQU0sQ0FBQztJQUNOLE1BQU0sRUFBRSxVQUFVO0dBQ2xCO0VBVEosQUFXRyxzQkFYbUIsQ0FHckIsU0FBUyxDQUVSLFFBQVEsQ0FNUCxRQUFRLENBQUM7SUFDUixTQUFTLEVBQUUsSUFBSTtJQUNmLFdBQVcsRUFBRSxJQUNkO0dBQUM7RUFkSixBQWdCRyxzQkFoQm1CLENBR3JCLFNBQVMsQ0FFUixRQUFRLENBV1AsUUFBUSxDQUFDO0lBQ1IsTUFBTSxFQUFFLGNBQWM7R0FVdEI7RUEzQkosQUFtQkksc0JBbkJrQixDQUdyQixTQUFTLENBRVIsUUFBUSxDQVdQLFFBQVEsQ0FHUCxDQUFDLENBQUM7SUFDRCxNQUFNLEVBQUUsQ0FBQztJQUNULE9BQU8sRUFBRSxLQUFLO0dBQ2Q7RUF0QkwsQUF3Qkksc0JBeEJrQixDQUdyQixTQUFTLENBRVIsUUFBUSxDQVdQLFFBQVEsQ0FRUCxpQkFBaUIsQ0FBQztJQUNqQixVQUFVLEVBQUUsR0FBRztHQUNmIn0= */
1
+ #sbi-notifications {
2
+ position: relative;
3
+ background: #FFFFFF 0 0 no-repeat padding-box;
4
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
5
+ border-radius: 2px;
6
+ opacity: 1;
7
+ min-height: 48px;
8
+ padding: 20px 120px 20px 82px;
9
+ margin: 0 0 14px 0;
10
+ }
11
+
12
+ #sbi-notifications * {
13
+ box-sizing: border-box;
14
+ }
15
+
16
+ #sbi-notifications .bell,
17
+ #sbi-notifications .thumb{
18
+ position: absolute;
19
+ top: 20px;
20
+ left: 24px;
21
+ width: 34px;
22
+ height: 44px;
23
+ }
24
+ #sbi-notifications .thumb img {
25
+ max-width: 100%;
26
+ }
27
+ #sbi-notifications .thumb .img-overlay {
28
+ top: 42px;
29
+ left: -6px;
30
+ width: 54px;
31
+ position: absolute;
32
+ background: #ca4a1f;
33
+ color: #fff;
34
+ padding: 2px 4px;
35
+ border-radius: 3px;
36
+ line-height: 1;
37
+ font-size: 11px;
38
+ font-weight: bold;
39
+ text-align: center;
40
+ }
41
+
42
+ #sbi-notifications .messages .message {
43
+ display: none;
44
+ }
45
+
46
+ #sbi-notifications .messages .message.current {
47
+ display: block;
48
+ }
49
+
50
+ #sbi-notifications .messages .message .title {
51
+ font-weight: 600;
52
+ font-size: 18px;
53
+ line-height: 25px;
54
+ margin: 0;
55
+ color: #141B38;
56
+ letter-spacing: 0;
57
+ }
58
+
59
+ #sbi-notifications .messages .message .content {
60
+ font-weight: normal;
61
+ font-size: 14px;
62
+ line-height: 22px;
63
+ margin: 6px 0 32px 0;
64
+ color: #434960;
65
+ }
66
+
67
+ #sbi-notifications .messages .message .buttons {
68
+ margin: -15px 105px 3px 0;
69
+ display: flex;
70
+ }
71
+ .sbi-btn {
72
+ transition: all 0.15s ease-in-out;
73
+ letter-spacing: 0.2px;
74
+ }
75
+ /*orange*/
76
+ .sbi-btn-orange{
77
+ background: #E34F0E!important;
78
+ color: #fff!important;
79
+ }
80
+ .sbi-btn-orange:hover{
81
+ background: #F37036!important;
82
+ color: #fff!important;
83
+ }
84
+ .sbi-btn-orange:focus,
85
+ .sbi-btn-orange:active{
86
+ background: #B8400B!important;
87
+ color: #fff!important;
88
+ }
89
+ /*grey*/
90
+ .sbi-btn-grey{
91
+ background: #F3F4F5!important;
92
+ color: #141B38!important;
93
+ border: 1px solid #D0D1D7!important;
94
+ }
95
+ .sbi-btn-grey:hover{
96
+ background: #fff!important;
97
+ color: #141B38!important;
98
+ border: 1px solid #DCDDE1!important;
99
+ }
100
+ .sbi-btn-grey:focus,
101
+ .sbi-btn-grey:active{
102
+ background: #E8E8EB!important;
103
+ color: #141B38!important;
104
+ border: 1px solid #D0D1D7!important;
105
+ }
106
+ #sbi-notifications .messages .message .buttons a {
107
+ font-weight: 600;
108
+ padding: 6px 12px;
109
+ border-radius: 2px;
110
+ box-sizing: border-box;
111
+ height: 32px;
112
+ text-decoration: none;
113
+ font-size: 12px;
114
+ }
115
+ #sbi-notifications .messages .message .buttons a.sbi-btn-orange {
116
+ border: 1px solid #E34F0E
117
+ }
118
+ #sbi-notifications .messages .message .buttons a:not(:last-child) {
119
+ margin-right: 8px;
120
+ }
121
+ #sbi-notifications .messages .message .buttons a:focus,
122
+ #sbi-notifications .messages .message .buttons a:active {
123
+ outline: none;
124
+ box-shadow: none;
125
+ }
126
+ #sbi-notifications .dismiss {
127
+ position: absolute;
128
+ top: 14px;
129
+ right: 14px;
130
+ width: 16px;
131
+ height: 16px;
132
+ color: #72777C;
133
+ font-size: 16px;
134
+ cursor: pointer;
135
+ text-align: center;
136
+ vertical-align: middle;
137
+ line-height: 16px;
138
+ }
139
+ #sbi-notifications .dismiss svg {
140
+ width: 15px;
141
+ height: 15px;
142
+ }
143
+ #sbi-notifications .dismiss svg path {
144
+ fill: #8C8F9A;
145
+ }
146
+ #sbi-notifications .navigation {
147
+ position: absolute;
148
+ bottom: 24px;
149
+ right: 21px;
150
+ width: 72px;
151
+ height: 30px;
152
+ }
153
+
154
+ #sbi-notifications .navigation a {
155
+ display: block;
156
+ width: 32px;
157
+ height: 32px;
158
+ border: 1px solid #DCDDE1;
159
+ border-radius: 2px;
160
+ font-size: 8px;
161
+ text-align: center;
162
+ vertical-align: middle;
163
+ line-height: 30px;
164
+ cursor: pointer;
165
+ background: #F3F4F5;
166
+ color: #141B38;
167
+ display: flex;
168
+ align-items: center;
169
+ justify-content: center;
170
+ transition: all 0.15s ease-in-out;
171
+ }
172
+
173
+ #sbi-notifications .navigation svg {
174
+ width: 9px;
175
+ height: 9px;
176
+ }
177
+
178
+ #sbi-notifications .navigation a:not(.disabled):hover {
179
+ background-color: #fff;
180
+ }
181
+ #sbi-notifications .navigation a:not(.disabled):focus,
182
+ #sbi-notifications .navigation a:not(.disabled):active {
183
+ background: #E8E8EB;
184
+ color: #141B38;
185
+ }
186
+
187
+ #sbi-notifications .navigation .prev {
188
+ float: left;
189
+ }
190
+
191
+ #sbi-notifications .navigation .next {
192
+ float: right;
193
+ }
194
+
195
+ #sbi-notifications .navigation .disabled {
196
+ background: #E8E8EB;
197
+ color: #8C8F9A;
198
+ cursor: default;
199
+ }
200
+
201
+ @media screen and (max-width: 768px) {
202
+ #sbi-notifications {
203
+ padding: 15px 15px 15px 72px;
204
+ }
205
+ #sbi-notifications .messages .message .title {
206
+ margin: 0 30px 0 0;
207
+ }
208
+ #sbi-notifications .messages .message .content {
209
+ font-size: 16px;
210
+ line-height: 24px;
211
+ }
212
+ #sbi-notifications .messages .message .buttons {
213
+ margin: -30px 80px 0 0;
214
+ }
215
+ #sbi-notifications .messages .message .buttons a {
216
+ margin: 0;
217
+ display: table;
218
+ }
219
+ #sbi-notifications .messages .message .buttons .button-secondary {
220
+ margin-top: 6px;
221
+ }
222
+ }
223
+
224
+ /*# sourceMappingURL=data:application/json;charset=utf8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXNzZXRzL2Nzcy9hZG1pbi1ub3RpZmljYXRpb25zLmNzcyIsInNvdXJjZXMiOlsiYXNzZXRzL3Njc3MvYWRtaW4tbm90aWZpY2F0aW9ucy5zY3NzIl0sInNvdXJjZXNDb250ZW50IjpbIi8vIEFkbWluIG5vdGlmaWNhdGlvbiBzdHlsZXMuXG5cbiN3cGZvcm1zLW5vdGlmaWNhdGlvbnMge1xuXG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0YmFja2dyb3VuZDogI0ZGRkZGRiAwIDAgbm8tcmVwZWF0IHBhZGRpbmctYm94O1xuXHRib3gtc2hhZG93OiAwcHggNXB4IDE1cHggIzAwMDAwMDBEO1xuXHRib3JkZXItcmFkaXVzOiA2cHg7XG5cdG9wYWNpdHk6IDE7XG5cdG1pbi1oZWlnaHQ6IDQ4cHg7XG5cdHBhZGRpbmc6IDE1cHggMTAycHggMTVweCA3MnB4O1xuXHRtYXJnaW46IDAgMCAxNHB4IDA7XG5cblx0KiB7XG5cdFx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0fVxuXG5cdC5iZWxsIHtcblx0XHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdFx0dG9wOiAxNXB4O1xuXHRcdGxlZnQ6IDE1cHg7XG5cdFx0d2lkdGg6IDQycHg7XG5cdFx0aGVpZ2h0OiA0OHB4O1xuXHR9XG5cblx0Lm1lc3NhZ2VzIHtcblx0XHQubWVzc2FnZSB7XG5cdFx0XHRkaXNwbGF5OiBub25lO1xuXG5cdFx0XHQmLmN1cnJlbnQge1xuXHRcdFx0XHRkaXNwbGF5OiBibG9jaztcblx0XHRcdH1cblxuXHRcdFx0LnRpdGxlIHtcblx0XHRcdFx0Zm9udC13ZWlnaHQ6IGJvbGQ7XG5cdFx0XHRcdGZvbnQtc2l6ZTogMTdweDtcblx0XHRcdFx0bGluZS1oZWlnaHQ6IDIwcHg7XG5cdFx0XHRcdG1hcmdpbjogMDtcblx0XHRcdFx0Y29sb3I6ICM0NDQ7XG5cdFx0XHR9XG5cblx0XHRcdC5jb250ZW50IHtcblx0XHRcdFx0Zm9udC13ZWlnaHQ6IG5vcm1hbDtcblx0XHRcdFx0Zm9udC1zaXplOiAxM3B4O1xuXHRcdFx0XHRsaW5lLWhlaWdodDogMjBweDtcblx0XHRcdFx0bWFyZ2luOiA2cHggMCA0MHB4IDA7XG5cdFx0XHR9XG5cblx0XHRcdC5idXR0b25zIHtcblx0XHRcdFx0bWFyZ2luOiAtMzBweCA4MHB4IDAgMDtcblxuXHRcdFx0XHRhIHtcblx0XHRcdFx0XHRtYXJnaW46IDAgNnB4IDAgMDtcblx0XHRcdFx0XHRwYWRkaW5nOiA4cHggMTBweDtcblx0XHRcdFx0XHRsaW5lLWhlaWdodDogMTNweDtcblx0XHRcdFx0XHRmb250LXNpemU6IDEzcHg7XG5cdFx0XHRcdFx0bWluLWhlaWdodDogdW5zZXQ7XG5cdFx0XHRcdH1cblxuXHRcdFx0XHQuYnV0dG9uLXNlY29uZGFyeSB7XG5cdFx0XHRcdFx0Ym9yZGVyOiAxcHggc29saWQgIzAwNzFBMTtcblx0XHRcdFx0fVxuXHRcdFx0fVxuXHRcdH1cblx0fVxuXG5cdC5kaXNtaXNzIHtcblx0XHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdFx0dG9wOiAxNXB4O1xuXHRcdHJpZ2h0OiAxNXB4O1xuXHRcdHdpZHRoOiAxNnB4O1xuXHRcdGhlaWdodDogMTZweDtcblx0XHRjb2xvcjogIzcyNzc3Qztcblx0XHRmb250LXNpemU6IDE2cHg7XG5cdFx0Y3Vyc29yOiBwb2ludGVyO1xuXHRcdHRleHQtYWxpZ246IGNlbnRlcjtcblx0XHR2ZXJ0aWNhbC1hbGlnbjogbWlkZGxlO1xuXHRcdGxpbmUtaGVpZ2h0OiAxNnB4O1xuXG5cdFx0Jjpob3ZlciB7XG5cdFx0XHRjb2xvcjogI2RjMzIzMjtcblx0XHR9XG5cdH1cblxuXHQubmF2aWdhdGlvbiB7XG5cdFx0cG9zaXRpb246IGFic29sdXRlO1xuXHRcdGJvdHRvbTogMTVweDtcblx0XHRyaWdodDogMTVweDtcblx0XHR3aWR0aDogNjNweDtcblx0XHRoZWlnaHQ6IDMwcHg7XG5cblx0XHRhIHtcblx0XHRcdGRpc3BsYXk6IGJsb2NrO1xuXHRcdFx0d2lkdGg6IDMwcHg7XG5cdFx0XHRoZWlnaHQ6IDMwcHg7XG5cdFx0XHRib3JkZXI6IDFweCBzb2xpZCAjN0U4OTkzO1xuXHRcdFx0Ym9yZGVyLXJhZGl1czogM3B4O1xuXHRcdFx0Zm9udC1zaXplOiA4cHg7XG5cdFx0XHR0ZXh0LWFsaWduOiBjZW50ZXI7XG5cdFx0XHR2ZXJ0aWNhbC1hbGlnbjogbWlkZGxlO1xuXHRcdFx0bGluZS1oZWlnaHQ6IDMwcHg7XG5cdFx0XHRjdXJzb3I6IHBvaW50ZXI7XG5cdFx0XHRiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmZmZmO1xuXHRcdFx0Y29sb3I6ICM0MTQ1NEE7XG5cblx0XHRcdCY6aG92ZXIge1xuXHRcdFx0XHRiYWNrZ3JvdW5kLWNvbG9yOiAjZjFmMWYxO1xuXHRcdFx0fVxuXHRcdH1cblxuXHRcdC5wcmV2IHtcblx0XHRcdGZsb2F0OiBsZWZ0O1xuXHRcdH1cblxuXHRcdC5uZXh0IHtcblx0XHRcdGZsb2F0OiByaWdodDtcblx0XHR9XG5cblx0XHQuZGlzYWJsZWQge1xuXHRcdFx0Ym9yZGVyLWNvbG9yOiAjZGRkZGRkO1xuXHRcdFx0Y29sb3I6ICNBMEE1QUE7XG5cdFx0XHRjdXJzb3I6IGRlZmF1bHQ7XG5cblx0XHRcdCY6aG92ZXIge1xuXHRcdFx0XHRiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmZmZmO1xuXHRcdFx0fVxuXHRcdH1cblx0fVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuXG5cdCN3cGZvcm1zLW5vdGlmaWNhdGlvbnMge1xuXHRcdHBhZGRpbmc6IDE1cHggMTVweCAxNXB4IDcycHg7XG5cblx0XHQubWVzc2FnZXMge1xuXG5cdFx0XHQubWVzc2FnZSB7XG5cblx0XHRcdFx0LnRpdGxlIHtcblx0XHRcdFx0XHRtYXJnaW46IDAgMzBweCAwIDA7XG5cdFx0XHRcdH1cblxuXHRcdFx0XHQuY29udGVudCB7XG5cdFx0XHRcdFx0Zm9udC1zaXplOiAxNnB4O1xuXHRcdFx0XHRcdGxpbmUtaGVpZ2h0OiAyNHB4XG5cdFx0XHRcdH1cblxuXHRcdFx0XHQuYnV0dG9ucyB7XG5cdFx0XHRcdFx0bWFyZ2luOiAtMzBweCA4MHB4IDAgMDtcblxuXHRcdFx0XHRcdGEge1xuXHRcdFx0XHRcdFx0bWFyZ2luOiAwO1xuXHRcdFx0XHRcdFx0ZGlzcGxheTogdGFibGU7XG5cdFx0XHRcdFx0fVxuXG5cdFx0XHRcdFx0LmJ1dHRvbi1zZWNvbmRhcnkge1xuXHRcdFx0XHRcdFx0bWFyZ2luLXRvcDogNnB4O1xuXHRcdFx0XHRcdH1cblx0XHRcdFx0fVxuXHRcdFx0fVxuXHRcdH1cblx0fVxufSJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFQSxBQUFBLHNCQUFzQixDQUFDO0VBRXRCLFFBQVEsRUFBRSxRQUFRO0VBQ2xCLFVBQVUsRUFBRSxpQ0FBaUM7RUFDN0MsVUFBVSxFQUFFLHNCQUFzQjtFQUNsQyxhQUFhLEVBQUUsR0FBRztFQUNsQixPQUFPLEVBQUUsQ0FBQztFQUNWLFVBQVUsRUFBRSxJQUFJO0VBQ2hCLE9BQU8sRUFBRSxvQkFBb0I7RUFDN0IsTUFBTSxFQUFFLFVBQVU7Q0FxSGxCOztBQTlIRCxBQVdDLHNCQVhxQixDQVdyQixDQUFDLENBQUM7RUFDRCxVQUFVLEVBQUUsVUFBVTtDQUN0Qjs7QUFiRixBQWVDLHNCQWZxQixDQWVyQixLQUFLLENBQUM7RUFDTCxRQUFRLEVBQUUsUUFBUTtFQUNsQixHQUFHLEVBQUUsSUFBSTtFQUNULElBQUksRUFBRSxJQUFJO0VBQ1YsS0FBSyxFQUFFLElBQUk7RUFDWCxNQUFNLEVBQUUsSUFBSTtDQUNaOztBQXJCRixBQXdCRSxzQkF4Qm9CLENBdUJyQixTQUFTLENBQ1IsUUFBUSxDQUFDO0VBQ1IsT0FBTyxFQUFFLElBQUk7Q0FvQ2I7O0FBN0RILEFBMkJHLHNCQTNCbUIsQ0F1QnJCLFNBQVMsQ0FDUixRQUFRLEFBR04sUUFBUSxDQUFDO0VBQ1QsT0FBTyxFQUFFLEtBQUs7Q0FDZDs7QUE3QkosQUErQkcsc0JBL0JtQixDQXVCckIsU0FBUyxDQUNSLFFBQVEsQ0FPUCxNQUFNLENBQUM7RUFDTixXQUFXLEVBQUUsSUFBSTtFQUNqQixTQUFTLEVBQUUsSUFBSTtFQUNmLFdBQVcsRUFBRSxJQUFJO0VBQ2pCLE1BQU0sRUFBRSxDQUFDO0VBQ1QsS0FBSyxFQUFFLElBQUk7Q0FDWDs7QUFyQ0osQUF1Q0csc0JBdkNtQixDQXVCckIsU0FBUyxDQUNSLFFBQVEsQ0FlUCxRQUFRLENBQUM7RUFDUixXQUFXLEVBQUUsTUFBTTtFQUNuQixTQUFTLEVBQUUsSUFBSTtFQUNmLFdBQVcsRUFBRSxJQUFJO0VBQ2pCLE1BQU0sRUFBRSxZQUFZO0NBQ3BCOztBQTVDSixBQThDRyxzQkE5Q21CLENBdUJyQixTQUFTLENBQ1IsUUFBUSxDQXNCUCxRQUFRLENBQUM7RUFDUixNQUFNLEVBQUUsY0FBYztDQWF0Qjs7QUE1REosQUFpREksc0JBakRrQixDQXVCckIsU0FBUyxDQUNSLFFBQVEsQ0FzQlAsUUFBUSxDQUdQLENBQUMsQ0FBQztFQUNELE1BQU0sRUFBRSxTQUFTO0VBQ2pCLE9BQU8sRUFBRSxRQUFRO0VBQ2pCLFdBQVcsRUFBRSxJQUFJO0VBQ2pCLFNBQVMsRUFBRSxJQUFJO0VBQ2YsVUFBVSxFQUFFLEtBQUs7Q0FDakI7O0FBdkRMLEFBeURJLHNCQXpEa0IsQ0F1QnJCLFNBQVMsQ0FDUixRQUFRLENBc0JQLFFBQVEsQ0FXUCxpQkFBaUIsQ0FBQztFQUNqQixNQUFNLEVBQUUsaUJBQWlCO0NBQ3pCOztBQTNETCxBQWdFQyxzQkFoRXFCLENBZ0VyQixRQUFRLENBQUM7RUFDUixRQUFRLEVBQUUsUUFBUTtFQUNsQixHQUFHLEVBQUUsSUFBSTtFQUNULEtBQUssRUFBRSxJQUFJO0VBQ1gsS0FBSyxFQUFFLElBQUk7RUFDWCxNQUFNLEVBQUUsSUFBSTtFQUNaLEtBQUssRUFBRSxPQUFPO0VBQ2QsU0FBUyxFQUFFLElBQUk7RUFDZixNQUFNLEVBQUUsT0FBTztFQUNmLFVBQVUsRUFBRSxNQUFNO0VBQ2xCLGNBQWMsRUFBRSxNQUFNO0VBQ3RCLFdBQVcsRUFBRSxJQUFJO0NBS2pCOztBQWhGRixBQTZFRSxzQkE3RW9CLENBZ0VyQixRQUFRLEFBYU4sTUFBTSxDQUFDO0VBQ1AsS0FBSyxFQUFFLE9BQU87Q0FDZDs7QUEvRUgsQUFrRkMsc0JBbEZxQixDQWtGckIsV0FBVyxDQUFDO0VBQ1gsUUFBUSxFQUFFLFFBQVE7RUFDbEIsTUFBTSxFQUFFLElBQUk7RUFDWixLQUFLLEVBQUUsSUFBSTtFQUNYLEtBQUssRUFBRSxJQUFJO0VBQ1gsTUFBTSxFQUFFLElBQUk7Q0FzQ1o7O0FBN0hGLEFBeUZFLHNCQXpGb0IsQ0FrRnJCLFdBQVcsQ0FPVixDQUFDLENBQUM7RUFDRCxPQUFPLEVBQUUsS0FBSztFQUNkLEtBQUssRUFBRSxJQUFJO0VBQ1gsTUFBTSxFQUFFLElBQUk7RUFDWixNQUFNLEVBQUUsaUJBQWlCO0VBQ3pCLGFBQWEsRUFBRSxHQUFHO0VBQ2xCLFNBQVMsRUFBRSxHQUFHO0VBQ2QsVUFBVSxFQUFFLE1BQU07RUFDbEIsY0FBYyxFQUFFLE1BQU07RUFDdEIsV0FBVyxFQUFFLElBQUk7RUFDakIsTUFBTSxFQUFFLE9BQU87RUFDZixnQkFBZ0IsRUFBRSxPQUFPO0VBQ3pCLEtBQUssRUFBRSxPQUFPO0NBS2Q7O0FBMUdILEFBdUdHLHNCQXZHbUIsQ0FrRnJCLFdBQVcsQ0FPVixDQUFDLEFBY0MsTUFBTSxDQUFDO0VBQ1AsZ0JBQWdCLEVBQUUsT0FBTztDQUN6Qjs7QUF6R0osQUE0R0Usc0JBNUdvQixDQWtGckIsV0FBVyxDQTBCVixLQUFLLENBQUM7RUFDTCxLQUFLLEVBQUUsSUFBSTtDQUNYOztBQTlHSCxBQWdIRSxzQkFoSG9CLENBa0ZyQixXQUFXLENBOEJWLEtBQUssQ0FBQztFQUNMLEtBQUssRUFBRSxLQUFLO0NBQ1o7O0FBbEhILEFBb0hFLHNCQXBIb0IsQ0FrRnJCLFdBQVcsQ0FrQ1YsU0FBUyxDQUFDO0VBQ1QsWUFBWSxFQUFFLE9BQU87RUFDckIsS0FBSyxFQUFFLE9BQU87RUFDZCxNQUFNLEVBQUUsT0FBTztDQUtmOztBQTVISCxBQXlIRyxzQkF6SG1CLENBa0ZyQixXQUFXLENBa0NWLFNBQVMsQUFLUCxNQUFNLENBQUM7RUFDUCxnQkFBZ0IsRUFBRSxPQUFPO0NBQ3pCOztBQUtKLE1BQU0sQ0FBQyxNQUFNLE1BQU0sU0FBUyxFQUFFLEtBQUs7RUFFbEMsQUFBQSxzQkFBc0IsQ0FBQztJQUN0QixPQUFPLEVBQUUsbUJBQW1CO0dBNkI1QjtFQTlCRCxBQU9HLHNCQVBtQixDQUdyQixTQUFTLENBRVIsUUFBUSxDQUVQLE1BQU0sQ0FBQztJQUNOLE1BQU0sRUFBRSxVQUFVO0dBQ2xCO0VBVEosQUFXRyxzQkFYbUIsQ0FHckIsU0FBUyxDQUVSLFFBQVEsQ0FNUCxRQUFRLENBQUM7SUFDUixTQUFTLEVBQUUsSUFBSTtJQUNmLFdBQVcsRUFBRSxJQUNkO0dBQUM7RUFkSixBQWdCRyxzQkFoQm1CLENBR3JCLFNBQVMsQ0FFUixRQUFRLENBV1AsUUFBUSxDQUFDO0lBQ1IsTUFBTSxFQUFFLGNBQWM7R0FVdEI7RUEzQkosQUFtQkksc0JBbkJrQixDQUdyQixTQUFTLENBRVIsUUFBUSxDQVdQLFFBQVEsQ0FHUCxDQUFDLENBQUM7SUFDRCxNQUFNLEVBQUUsQ0FBQztJQUNULE9BQU8sRUFBRSxLQUFLO0dBQ2Q7RUF0QkwsQUF3Qkksc0JBeEJrQixDQUdyQixTQUFTLENBRVIsUUFBUSxDQVdQLFFBQVEsQ0FRUCxpQkFBaUIsQ0FBQztJQUNqQixVQUFVLEVBQUUsR0FBRztHQUNmIn0= */
admin/assets/css/oembeds.css CHANGED
@@ -1,799 +1,799 @@
1
- /*
2
- * oEmbeds CSS TABLE OF CONTENTS
3
- *
4
- * 1.0 - GLOBAL
5
- * 2.0 - HEADER
6
- * 3.0 - 3.0 - OEMBEDS CONTAINER
7
- * 3.1 - SECTION HEADER
8
- * 3.2 - OEMBED ENABLE/DISABLE BOX
9
- * 3.3 - OEMBED INFORMATION BOX
10
- * 4.0 - MODAL STYLE
11
- * 5.0 - STICKY WIDGET
12
- * 6.0 - RESPONSIVENESS
13
- */
14
-
15
- /*** 1.0 - GLOBAL ***/
16
- .clearfix { display: inline-block; }
17
- /* start commented backslash hack \*/
18
- * html .clearfix { height: 1%; }
19
- .clearfix { display: block; }
20
- .checkmark {
21
- width: 21px;
22
- height: 22px;
23
- border-radius: 50%;
24
- display: block;
25
- stroke-width: 2;
26
- stroke: #fff;
27
- stroke-miterlimit: 10;
28
- stroke-dashoffset: 0;
29
- transform: translate(0px, -3px);
30
- }
31
- #sbi-oembeds {
32
- -webkit-font-smoothing: antialiased;
33
- font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
34
- }
35
- #wpcontent {
36
- padding-left: 0px;
37
- }
38
- #wpbody-content {
39
- padding-bottom: 40px;
40
- }
41
- .clearfix:after {
42
- visibility: hidden;
43
- display: block;
44
- font-size: 0;
45
- content: " ";
46
- clear: both;
47
- height: 0;
48
- }
49
-
50
-
51
- .sbi-fb-full-wrapper{
52
- padding: 0 53px;
53
- padding-top: 82px;
54
- }
55
- .sbi-fb-fs {
56
- width: 100%;
57
- position: relative;
58
- float: left;
59
- box-sizing: border-box;
60
- }
61
- /*orange*/
62
- .sb-btn-orange{
63
- background: #E34F0E!important;
64
- color: #fff!important;
65
- }
66
- .sb-btn-orange:hover{
67
- background: #F37036!important;
68
- color: #fff!important;
69
- }
70
- .sb-btn-orange:focus,
71
- .sb-btn-orange:active{
72
- background: #B8400B!important;
73
- color: #fff!important;
74
- }
75
- /*** 2.0 - HEADER ***/
76
- .sbi-fb-create-ctn{
77
- margin-top: 90px;
78
- }
79
- .sbi-fb-header{
80
- height: 64px;
81
- position: absolute;
82
- display: flex;
83
- flex-direction: row;
84
- justify-content: space-between;
85
- align-items: center;
86
- background: #fff;
87
- padding: 0px 52px;
88
- z-index: 2;
89
- }
90
- .sbi-fb-header-left {
91
- display: flex;
92
- }
93
- .sbi-fb-header-left .sb-social-wall-link-wrap {
94
- margin-left: 30px;
95
- }
96
- .sb-social-wall-link-wrap {
97
- display: flex;
98
- font-size: 14px;
99
- margin: 10px 0;
100
- }
101
- .sb-social-wall-link {
102
- padding: 0 12px;
103
- border-right: 1px solid #ccc;
104
- color: #0068A0!important;
105
- line-height: 1;
106
- }
107
- .sb-social-wall-link:first-child {
108
- padding-left: 0;
109
- border-right: 1px solid #ccc;
110
- color: #0068A0!important;
111
- line-height: 1;
112
- }
113
- .sb-social-wall-link:last-child {
114
- border-right: none;
115
- }
116
- .sb-social-wall-link a {
117
- text-decoration: none;
118
- }
119
- .sb-social-wall-link a:focus {
120
- outline: none;
121
- box-shadow: none;
122
- }
123
- .sbi-fb-hd-logo{
124
- display: flex;
125
- vertical-align: middle;
126
- align-items: center;
127
- gap: 5px;
128
- }
129
- .sbi-fb-hd-logo .sb-logo-letters-wrap {
130
- margin-bottom: 4px;
131
- }
132
- .sbi-fb-hd-logo .breadcrumb-title{
133
- font-size: 14px;
134
- font-weight: 400;
135
- line-height: 22px;
136
- letter-spacing: 0em;
137
- margin-left: 4px;
138
- }
139
- .sbi-fb-hd-logo .separator{
140
- margin: 0 5px 0 10px;
141
- }
142
- .sbi-fb-hd-btn{
143
- height: 38px;
144
- cursor: pointer;
145
- display: flex;
146
- flex-direction: row;
147
- justify-content: center;
148
- align-items: center;
149
- padding: 0px 15px 0px 16px;
150
- font-weight: 600;
151
- font-size:14px;
152
- color: #353A41;
153
- background: #F3F4F5;
154
- border-radius: 2px;
155
- border: 1px solid #DCDDE1;
156
- position: relative;
157
- text-decoration: none;
158
- transition: all 0.15s ease-in-out;
159
- }
160
- .sbi-fb-hd-btn:focus {
161
- outline: none;
162
- box-shadow: none;
163
- }
164
- .sbi-fb-hd-btn:hover {
165
- color: inherit;
166
- background-color: #fff;
167
- }
168
- .sbi-fb-hd-btn i{
169
- margin: 0px 5px;
170
- }
171
- .sbi-fb-hd-btn[data-icon="left"]{
172
- padding-right: 20px!important;
173
- }
174
-
175
- .sbi-fb-full-wrapper .section-header h1 {
176
- font-size: 32px;
177
- line-height: 40px;
178
- }
179
- /*** 3.0 - OEMBEDS CONTAINER ***/
180
- .sbi-oembeds-container {
181
- max-width: 875px;
182
- position: relative;
183
- margin: auto;
184
- margin-top: 33px;
185
- box-sizing: border-box;
186
- }
187
-
188
- /*** 3.1 - SECTION HEADER ***/
189
- .sbi-section-header h3 {
190
- font-weight: 600;
191
- font-size: 32px;
192
- line-height: 40px;
193
- color: #141B38;
194
- margin: 0 0 5px 0;
195
- }
196
- .sbi-section-header p {
197
- font-size: 13px;
198
- line-height: 18px;
199
- color: #434960;
200
- margin: 0;
201
- }
202
- .sbi-oembed-plugin-box {
203
- background: #FFFFFF;
204
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
205
- margin-bottom: 10px;
206
- padding: 12px 20px;
207
- display: flex;
208
- justify-content: space-between;
209
- align-items: center;
210
- }
211
-
212
- /*** 3.2 - OEMBED ENABLE/DISABLE BOX ***/
213
- .sbi-oembed-plugin-box-group {
214
- margin-top: 35px;
215
- }
216
- .sbi-oembed-plugin-box .oembed-text{
217
- flex-basis: 645px;
218
- }
219
- .sbi-oembed-plugin-box .sbi-oembed-btn{
220
- flex-basis: 125px;
221
- text-align: right;
222
- }
223
- .sbi-oembed-btn .sbi-btn {
224
- border-radius: 2px;
225
- padding: 10px 20px;
226
- border: 0px;
227
- color: #fff;
228
- font-size: 14px;
229
- cursor: pointer;
230
- transition: all .15s ease-in-out;
231
- box-sizing: border-box;
232
- text-decoration: none;
233
- align-items: center;
234
- display: flex;
235
- align-items: center;
236
- height: 38px;
237
- float: right;
238
- }
239
- .sbi-oembed-btn .sbi-btn span {
240
- margin-right: 5px;
241
- height: 15px;
242
- width: 15px;
243
- }
244
- .sbi-oembed-btn .sbi-btn svg {
245
- width: 100%;
246
- height: 100%;
247
- }
248
- .sbi-oembed-btn button:hover {
249
- background-color: #0096CC;
250
- border-color: #0096CC;
251
- }
252
- .sbi-oembed-btn .sbi-btn:focus,
253
- .sbi-oembed-btn .sbi-btn:active {
254
- outline: none;
255
- box-shadow: none;
256
- }
257
- .sbi-oembed-btn button.disable-oembed {
258
- background: #D72C2C;
259
- }
260
- .sbi-oembed-btn button.disable-oembed:hover {
261
- background-color: #DF5757;
262
- border-color: #DF5757;
263
- }
264
- .sbi-oembed-btn button.disable-oembed:focus,
265
- .sbi-oembed-btn button.disable-oembed:active {
266
- background-color: #841919;
267
- border-color: #841919;
268
- }
269
- .sbi-oembed-btn button.loading svg {
270
- height: 14px;
271
- transform: translate(0, 2px);
272
- }
273
-
274
- /*** 3.3 - OEMBED INFORMATION BOX ***/
275
- .sbi-oembed-information {
276
- background: #FFFFFF;
277
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
278
- margin-bottom: 10px;
279
- }
280
- .sbi-oembed-information .sb-box-header {
281
- padding: 16px 20px;
282
- border-bottom: 1px solid #E8E8EB;
283
- }
284
- .sbi-oembed-information .sb-box-header h3 {
285
- margin: 0;
286
- font-weight: 600;
287
- font-size: 18px;
288
- line-height: 140%;
289
- color: #141B38;
290
- }
291
- .sb-two-column-box {
292
- display: flex;
293
- justify-content: space-around;
294
- align-items: center;
295
- border-bottom: 1px solid #E8E8EB;
296
- }
297
- .sb-two-column-box-1 img {
298
- max-width: 438px;
299
- }
300
- .sb-two-column-box-2 img{
301
- margin-top: 20px;
302
- max-width: 442px;
303
- }
304
- .sb-two-column-box .sb-embed-info-text {
305
- padding: 0 75px 0 35px;
306
- }
307
- .sb-two-column-box-2 .sb-embed-info-text {
308
- padding: 0 65px 0 30px;
309
- }
310
- .sb-two-column-box h4,
311
- .sb-one-column-box h4 {
312
- font-size: 16px;
313
- font-weight: 600;
314
- line-height: 26px;
315
- color: #141B38;
316
- }
317
- .sb-one-column-box {
318
- max-width: 405px;
319
- margin: auto;
320
- text-align: center;
321
- }
322
- .sb-one-column-box h4 {
323
- padding: 0;
324
- margin-top: 30px;
325
- margin-bottom: 0px;
326
- }
327
- .sb-one-column-box p {
328
- font-size: 14px;
329
- line-height: 22px;
330
- }
331
- .sb-one-column-box img {
332
- margin-top: 15px;
333
- margin-bottom: -21px;
334
- max-width: 392px;
335
- }
336
- .sb-two-column-box-1 .sb-left {
337
- padding-left: 20px;
338
- }
339
- .sb-plugin-info-box {
340
- padding-top: 20px;
341
- }
342
-
343
- .sb-plugin-info-box .sb-left {
344
- padding-left: 35px;
345
- }
346
- .sb-plugin-info-box .sb-right {
347
- padding: 0 60px 0 40px;
348
- }
349
- .sb-plugin-info-box h4 {
350
- font-size: 18px;
351
- margin: 0px;
352
- }
353
- .sb-plugin-info-box p {
354
- font-size: 14px;
355
- line-height: 22px;
356
- color: #434960;
357
- margin-top: 10px;
358
- }
359
- .sb-plugin-info-box img {
360
- max-width: 414px;
361
- margin-bottom: -5px;
362
- }
363
- /*** 4.0 - MODAL STYLE ***/
364
- .sbi-oembed-modal {
365
- position: absolute;
366
- top: 0;
367
- left: 0;
368
- width: 100%;
369
- height: 100%;
370
- background: rgba(0, 0, 0, 0.4);
371
- z-index: 9;
372
- }
373
- .sbi-modal-content {
374
- background-color: #fff;
375
- height: 381px;
376
- max-width: 572px;
377
- padding: 40px 75px 48px;
378
- box-sizing: border-box;
379
- position: relative;
380
- text-align: center;
381
- margin: 260px auto 0;
382
- }
383
- .sbi-modal-content h2 {
384
- font-size: 24px;
385
- line-height: 29px;
386
- text-align: center;
387
- letter-spacing: 0;
388
- color: #141B38;
389
- margin: 0 0 5px 0;
390
- }
391
- .sbi-modal-content p {
392
- font-size: 12px;
393
- line-height: 18px;
394
- text-align: center;
395
- color: #434960;
396
- }
397
- .sbi-modal-content .cancel-btn{
398
- background: none;
399
- border: none;
400
- color: #141B38;
401
- position: absolute;
402
- top: 16px;
403
- right: 16px;
404
- padding: 0;
405
- cursor: pointer;
406
- }
407
- .sbi-modal-content .modal-icon{
408
- margin-bottom: 45px;
409
- }
410
- .sbi-modal-content .modal-icon img {
411
- max-width: 102px;
412
- }
413
- .sbi-modal-content .sb-action-buttons{
414
- display: flex;
415
- justify-content: center;
416
- margin-top: 30px;
417
- }
418
- .sbi-modal-content .sb-action-buttons button:not(:last-child) {
419
- margin-right: 7px;
420
- }
421
-
422
- .sb-action-buttons .sbi-btn {
423
- display: flex;
424
- align-items: center;
425
- vertical-align: middle;
426
- justify-content: center;
427
- background: #F3F4F5;
428
- border: 1px solid #DCDDE1;
429
- box-sizing: border-box;
430
- border-radius: 2px;
431
- padding: 7px 30px;
432
- font-weight: 600;
433
- font-size: 14px;
434
- line-height: 22px;
435
- color: #141B38;
436
- box-sizing: border-box;
437
- letter-spacing: 0.2px;
438
- cursor: pointer;
439
- min-width: 175px;
440
- }
441
- .sb-action-buttons .sbi-install-btn {
442
- background-color: #E34F0E;
443
- border-color: #E34F0E;
444
- color: #fff;
445
- }
446
- .sb-action-buttons .sbi-install-btn:disabled {
447
- background: #F3F4F5;
448
- border: 1px solid #DCDDE1;
449
- color: #141B38;
450
- cursor: not-allowed
451
- }
452
- .sb-action-buttons .sbi-install-btn:not(.success):disabled path {
453
- fill: #141B38;
454
- }
455
- .sb-action-buttons .sbi-install-btn span {
456
- margin-right: 10px;
457
- }
458
-
459
- .sb-action-buttons .sbi-install-btn.loading svg {
460
- height: 16px;
461
- transform: translate(0, 2px);
462
- }
463
-
464
- /*** 5.0 Sticky Widget ***/
465
- .sbi-stck-wdg{
466
- position: fixed;
467
- right: 21px;
468
- z-index: 9;
469
- bottom: 20px;
470
- }
471
- .sbi-stck-wdg-btn{
472
- width: 52px;
473
- height: 52px;
474
- background: #fff;
475
- border-radius: 50%;
476
- cursor: pointer;
477
- display: flex;
478
- justify-content: center;
479
- align-items: center;
480
- filter: drop-shadow(0px 9px 13px rgba(0, 0, 0, 0.2));
481
- }
482
- .sbi-stck-wdg-btn svg{
483
- width: 25px;
484
- fill: #E34F0E;
485
- height: 33px;
486
- }
487
-
488
- .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls,
489
- .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls svg{
490
- display: block;
491
- }
492
- .sbi-stck-wdg-btn-cls{
493
- width: inherit;
494
- height: inherit;
495
- position: relative;
496
- color: #364152;
497
- box-shadow: 0px 1px 6px rgb(0 0 0 / 5%), 0px 9px 12px rgb(0 0 0 / 5%);
498
- border-radius: 70px;
499
- }
500
- .sbi-stck-wdg-btn-cls svg {
501
- width: 14px;
502
- height: 14px;
503
- position: absolute;
504
- top: 50%;
505
- right: 0;
506
- bottom: 0;
507
- left: 50%;
508
- margin-top: -7px;
509
- margin-left: -7px;
510
- }
511
-
512
- .sbi-stck-pop{
513
- position: absolute;
514
- width: 292px;
515
- height: auto;
516
- background: #fff;
517
- border: 1px solid #E2E8F0;
518
- box-sizing: border-box;
519
- box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15), 0px 3px 14px rgba(0, 0, 0, 0.12);
520
- border-radius: 2px;
521
- padding: 20px;
522
- right: 0px;
523
- bottom: 66px;
524
- color: #141B38;
525
- padding-bottom: 82px;
526
- }
527
- .sbi-stck-wdg[data-active="true"] .sbi-stck-pop{
528
- bottom: 66px;
529
- opacity: 1;
530
- visibility: visible;
531
- }
532
-
533
- .sbi-stck-pop svg{
534
- fill: currentColor;
535
- }
536
- .sbi-stck-el-list{
537
- border: 1px solid #DCDDE1;
538
- border-radius: 2px;
539
- }
540
- .sbi-stck-el{
541
- display: flex;
542
- align-items: center;
543
- padding: 11px 13px;
544
- border-bottom: 1px solid #DCDDE1;
545
- transition: background .15s ease-in-out;
546
- font-size: 12px;
547
- }
548
- .sbi-stck-el:hover{
549
- background: #F3F4F5;
550
- }
551
- .sbi-stck-el:last-of-type{
552
- border-bottom: 0px;
553
- }
554
- .sbi-stck-el-list .sbi-chevron svg{
555
- width: 5px;
556
- height: 8px;
557
- }
558
- .sbi-fs-a {
559
- width: 100%;
560
- height: 100%;
561
- display: block;
562
- position: absolute;
563
- left: 0;
564
- top: 0;
565
- z-index: 1;
566
- }
567
- .sbi-stck-el .sbi-stck-el-txt{
568
- color: #27303F;
569
- }
570
- .sbi-stck-el.sbi-stck-el-upgrd{
571
- padding: 9px 14px;
572
- font-size: 14px;
573
- background: var(--cl-orange);
574
- color: #fff;
575
- position: relative;
576
- transition: background .15s ease-in-out;
577
- font-weight: 600;
578
- }
579
- .sbi-chevron {
580
- position: absolute;
581
- right: 14px
582
- }
583
- .sbi-stck-el.sbi-stck-el-upgrd .sbi-stck-el-txt{
584
- color: #fff;
585
- }
586
- .sbi-stck-el.sbi-stck-el-upgrd:after{
587
- top: 20px;
588
- opacity: 1;
589
- }
590
- .sbi-stck-el-icon{
591
- margin-right: 10px;
592
- }
593
- .sbi-stck-el-icon svg{
594
- width: 17px;
595
- float: left;
596
- }
597
- .sbi-stck-title{
598
- margin-top: 20px;
599
- margin-bottom: 10px;
600
- color: #141B38;
601
- font-weight: 600;
602
- font-size: 14px;
603
- line-height: 160%;
604
- }
605
- .sbi-stck-follow{
606
- background: #F3F4F5;
607
- margin-top: 20px;
608
- left: 0px;
609
- bottom: 0px;
610
- position: absolute;
611
- padding: 12px 20px;
612
- display: flex;
613
- align-items: center;
614
- }
615
- .sbi-stck-follow span{
616
- font-weight: 600;
617
- font-size: 14px;
618
- }
619
- .sbi-stck-flw-links{
620
- display: flex;
621
- justify-content: center;
622
- align-items: center;
623
- margin-left: auto;
624
- }
625
- .sbi-stck-flw-links a{
626
- width: 36px;
627
- height: 28px;
628
- color: inherit;
629
- display: inline-flex;
630
- justify-content: center;
631
- align-items: center;
632
- margin-left: 4px;
633
- border-radius: 2px;
634
- transition: background .15s ease-in-out;
635
- }
636
- .sbi-stck-flw-links svg{
637
- width: 17px;
638
- color: #141B38;
639
- }
640
- .sbi-stck-flw-links a:hover{
641
- background: #fff;
642
- }
643
- .sbi-stck-flw-links a:hover svg{
644
- color: inherit;
645
- }
646
-
647
- /*** 6.0 - RESPONSIVENESS ***/
648
- @media (max-width: 1170px) {
649
- .sbi-oembed-plugin-box .oembed-text {
650
- flex-basis: 78%;
651
- }
652
- }
653
-
654
- @media (max-width: 1024px) {
655
- .sbi-oembed-plugin-box .oembed-text {
656
- flex-basis: 72%;
657
- }
658
- .sb-two-column-box {
659
- flex-direction: column;
660
- }
661
- .sb-two-column-box-1 {
662
- flex-direction: column-reverse;
663
- }
664
- .sb-two-column-box .sb-embed-info-text{
665
- padding: 0 35px;
666
- text-align: center;
667
- }
668
- .sb-two-column-box-2 img {
669
- margin-top: 0px;
670
- }
671
- .sb-two-column-box .sb-left,
672
- .sb-two-column-box .sb-right {
673
- max-width: 405px;
674
- margin: auto;
675
- }
676
- .sb-two-column-box.sb-plugin-info-box .sb-embed-info-text {
677
- margin-top: 25px;
678
- }
679
- .auto-fold #wpcontent {
680
- padding-left: 0px;
681
- }
682
- }
683
- @media (max-width: 767px) {
684
- .auto-fold #wpcontent {
685
- padding-left: 0;
686
- }
687
- .sbi-fb-full-wrapper {
688
- padding: 70px 20px 0 20px;
689
- }
690
- .sbi-fb-header {
691
- padding: 0px 20px;
692
- }
693
- .sbi-fb-hd-btn {
694
- padding: 0px 15px 0px 7px;
695
- }
696
- .sbi-about-box .sb-team-info {
697
- padding: 30px;
698
- }
699
- .sbi-oembed-plugin-box {
700
- flex-wrap: wrap;
701
- }
702
- .sbi-oembed-plugin-box .oembed-icon {
703
- width: 20px;
704
- vertical-align: middle;
705
- display: flex;
706
- }
707
- .sbi-oembed-plugin-box .sbi-oembed-btn {
708
- flex-basis: 114px;
709
- text-align: left;
710
- margin-top: 15px;
711
- }
712
- .sbi-oembed-plugin-box .oembed-text {
713
- flex-basis: calc(100% - 40px);
714
- }
715
- .sb-plugin-info-box .sb-left,
716
- .sb-two-column-box-1 .sb-left,
717
- .sb-two-column-box-2 .sb-right,
718
- .sb-one-column-box img {
719
- display: none;
720
- }
721
- .sb-one-column-box {
722
- padding-bottom: 5px !important;
723
- }
724
- .sb-one-column-box h4 {
725
- margin-top: 21px;
726
- }
727
- .sb-two-column-box.sb-plugin-info-box .sb-embed-info-text {
728
- margin-top: 0;
729
- }
730
- .sb-plugin-info-box p {
731
- margin-bottom: 17px;
732
- }
733
- .sbi-modal-content {
734
- margin: 80px auto 0;
735
- width: 90%;
736
- height: auto;
737
- padding: 40px 30px;
738
- }
739
- .sbi-modal-content .modal-icon {
740
- margin-bottom: 30px;
741
- }
742
- .sb-plugin-info-box h4 {
743
- font-size: 16px;
744
- }
745
- }
746
- @media (max-width: 630px) {
747
- .sb-two-column-box img,
748
- .sb-one-column-box img {
749
- max-width: 100%;
750
- }
751
- .sbi-modal-content .sb-action-buttons {
752
- flex-direction: column;
753
- }
754
- .sbi-modal-content .sb-action-buttons button:not(:last-child) {
755
- margin-right: 0px;
756
- margin-bottom: 7px;
757
- }
758
- }
759
- @media (max-width: 530px) {
760
- .sb-two-column-box .sb-left,
761
- .sb-two-column-box .sb-right,
762
- .sb-one-column-box {
763
- padding: 0 20px;
764
- }
765
-
766
- .sb-two-column-box h4, .sb-one-column-box h4 {
767
- line-height: 22px;
768
- }
769
- .sb-one-column-box img {
770
- margin-bottom: -15px;
771
- }
772
- }
773
-
774
- .sbi-btn-blue {
775
- background: #0068A0!important;
776
- color: #fff!important;
777
- }
778
-
779
- .sb-button-standard{
780
- position: relative;
781
- font-style: normal;
782
- font-weight: 600;
783
- font-size: 14px;
784
- padding: 10px 20px 10px 39px;
785
- line-height: 16px;
786
- height: auto;
787
- }
788
- .sb-button-standard svg {
789
- width: 16px;
790
- height: 16px;
791
- position: absolute;
792
- left: 13px;
793
- right: auto;
794
- top: 10px;
795
- bottom: auto;
796
- }
797
- .sbi-stck-el.sbi-stck-el-upgrd svg path{
798
- fill: #fff!important;
799
- }
1
+ /*
2
+ * oEmbeds CSS TABLE OF CONTENTS
3
+ *
4
+ * 1.0 - GLOBAL
5
+ * 2.0 - HEADER
6
+ * 3.0 - 3.0 - OEMBEDS CONTAINER
7
+ * 3.1 - SECTION HEADER
8
+ * 3.2 - OEMBED ENABLE/DISABLE BOX
9
+ * 3.3 - OEMBED INFORMATION BOX
10
+ * 4.0 - MODAL STYLE
11
+ * 5.0 - STICKY WIDGET
12
+ * 6.0 - RESPONSIVENESS
13
+ */
14
+
15
+ /*** 1.0 - GLOBAL ***/
16
+ .clearfix { display: inline-block; }
17
+ /* start commented backslash hack \*/
18
+ * html .clearfix { height: 1%; }
19
+ .clearfix { display: block; }
20
+ .checkmark {
21
+ width: 21px;
22
+ height: 22px;
23
+ border-radius: 50%;
24
+ display: block;
25
+ stroke-width: 2;
26
+ stroke: #fff;
27
+ stroke-miterlimit: 10;
28
+ stroke-dashoffset: 0;
29
+ transform: translate(0px, -3px);
30
+ }
31
+ #sbi-oembeds {
32
+ -webkit-font-smoothing: antialiased;
33
+ font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
34
+ }
35
+ #wpcontent {
36
+ padding-left: 0px;
37
+ }
38
+ #wpbody-content {
39
+ padding-bottom: 40px;
40
+ }
41
+ .clearfix:after {
42
+ visibility: hidden;
43
+ display: block;
44
+ font-size: 0;
45
+ content: " ";
46
+ clear: both;
47
+ height: 0;
48
+ }
49
+
50
+
51
+ .sbi-fb-full-wrapper{
52
+ padding: 0 53px;
53
+ padding-top: 82px;
54
+ }
55
+ .sbi-fb-fs {
56
+ width: 100%;
57
+ position: relative;
58
+ float: left;
59
+ box-sizing: border-box;
60
+ }
61
+ /*orange*/
62
+ .sb-btn-orange{
63
+ background: #E34F0E!important;
64
+ color: #fff!important;
65
+ }
66
+ .sb-btn-orange:hover{
67
+ background: #F37036!important;
68
+ color: #fff!important;
69
+ }
70
+ .sb-btn-orange:focus,
71
+ .sb-btn-orange:active{
72
+ background: #B8400B!important;
73
+ color: #fff!important;
74
+ }
75
+ /*** 2.0 - HEADER ***/
76
+ .sbi-fb-create-ctn{
77
+ margin-top: 90px;
78
+ }
79
+ .sbi-fb-header{
80
+ height: 64px;
81
+ position: absolute;
82
+ display: flex;
83
+ flex-direction: row;
84
+ justify-content: space-between;
85
+ align-items: center;
86
+ background: #fff;
87
+ padding: 0px 52px;
88
+ z-index: 2;
89
+ }
90
+ .sbi-fb-header-left {
91
+ display: flex;
92
+ }
93
+ .sbi-fb-header-left .sb-social-wall-link-wrap {
94
+ margin-left: 30px;
95
+ }
96
+ .sb-social-wall-link-wrap {
97
+ display: flex;
98
+ font-size: 14px;
99
+ margin: 10px 0;
100
+ }
101
+ .sb-social-wall-link {
102
+ padding: 0 12px;
103
+ border-right: 1px solid #ccc;
104
+ color: #0068A0!important;
105
+ line-height: 1;
106
+ }
107
+ .sb-social-wall-link:first-child {
108
+ padding-left: 0;
109
+ border-right: 1px solid #ccc;
110
+ color: #0068A0!important;
111
+ line-height: 1;
112
+ }
113
+ .sb-social-wall-link:last-child {
114
+ border-right: none;
115
+ }
116
+ .sb-social-wall-link a {
117
+ text-decoration: none;
118
+ }
119
+ .sb-social-wall-link a:focus {
120
+ outline: none;
121
+ box-shadow: none;
122
+ }
123
+ .sbi-fb-hd-logo{
124
+ display: flex;
125
+ vertical-align: middle;
126
+ align-items: center;
127
+ gap: 5px;
128
+ }
129
+ .sbi-fb-hd-logo .sb-logo-letters-wrap {
130
+ margin-bottom: 4px;
131
+ }
132
+ .sbi-fb-hd-logo .breadcrumb-title{
133
+ font-size: 14px;
134
+ font-weight: 400;
135
+ line-height: 22px;
136
+ letter-spacing: 0em;
137
+ margin-left: 4px;
138
+ }
139
+ .sbi-fb-hd-logo .separator{
140
+ margin: 0 5px 0 10px;
141
+ }
142
+ .sbi-fb-hd-btn{
143
+ height: 38px;
144
+ cursor: pointer;
145
+ display: flex;
146
+ flex-direction: row;
147
+ justify-content: center;
148
+ align-items: center;
149
+ padding: 0px 15px 0px 16px;
150
+ font-weight: 600;
151
+ font-size:14px;
152
+ color: #353A41;
153
+ background: #F3F4F5;
154
+ border-radius: 2px;
155
+ border: 1px solid #DCDDE1;
156
+ position: relative;
157
+ text-decoration: none;
158
+ transition: all 0.15s ease-in-out;
159
+ }
160
+ .sbi-fb-hd-btn:focus {
161
+ outline: none;
162
+ box-shadow: none;
163
+ }
164
+ .sbi-fb-hd-btn:hover {
165
+ color: inherit;
166
+ background-color: #fff;
167
+ }
168
+ .sbi-fb-hd-btn i{
169
+ margin: 0px 5px;
170
+ }
171
+ .sbi-fb-hd-btn[data-icon="left"]{
172
+ padding-right: 20px!important;
173
+ }
174
+
175
+ .sbi-fb-full-wrapper .section-header h1 {
176
+ font-size: 32px;
177
+ line-height: 40px;
178
+ }
179
+ /*** 3.0 - OEMBEDS CONTAINER ***/
180
+ .sbi-oembeds-container {
181
+ max-width: 875px;
182
+ position: relative;
183
+ margin: auto;
184
+ margin-top: 33px;
185
+ box-sizing: border-box;
186
+ }
187
+
188
+ /*** 3.1 - SECTION HEADER ***/
189
+ .sbi-section-header h3 {
190
+ font-weight: 600;
191
+ font-size: 32px;
192
+ line-height: 40px;
193
+ color: #141B38;
194
+ margin: 0 0 5px 0;
195
+ }
196
+ .sbi-section-header p {
197
+ font-size: 13px;
198
+ line-height: 18px;
199
+ color: #434960;
200
+ margin: 0;
201
+ }
202
+ .sbi-oembed-plugin-box {
203
+ background: #FFFFFF;
204
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
205
+ margin-bottom: 10px;
206
+ padding: 12px 20px;
207
+ display: flex;
208
+ justify-content: space-between;
209
+ align-items: center;
210
+ }
211
+
212
+ /*** 3.2 - OEMBED ENABLE/DISABLE BOX ***/
213
+ .sbi-oembed-plugin-box-group {
214
+ margin-top: 35px;
215
+ }
216
+ .sbi-oembed-plugin-box .oembed-text{
217
+ flex-basis: 645px;
218
+ }
219
+ .sbi-oembed-plugin-box .sbi-oembed-btn{
220
+ flex-basis: 125px;
221
+ text-align: right;
222
+ }
223
+ .sbi-oembed-btn .sbi-btn {
224
+ border-radius: 2px;
225
+ padding: 10px 20px;
226
+ border: 0px;
227
+ color: #fff;
228
+ font-size: 14px;
229
+ cursor: pointer;
230
+ transition: all .15s ease-in-out;
231
+ box-sizing: border-box;
232
+ text-decoration: none;
233
+ align-items: center;
234
+ display: flex;
235
+ align-items: center;
236
+ height: 38px;
237
+ float: right;
238
+ }
239
+ .sbi-oembed-btn .sbi-btn span {
240
+ margin-right: 5px;
241
+ height: 15px;
242
+ width: 15px;
243
+ }
244
+ .sbi-oembed-btn .sbi-btn svg {
245
+ width: 100%;
246
+ height: 100%;
247
+ }
248
+ .sbi-oembed-btn button:hover {
249
+ background-color: #0096CC;
250
+ border-color: #0096CC;
251
+ }
252
+ .sbi-oembed-btn .sbi-btn:focus,
253
+ .sbi-oembed-btn .sbi-btn:active {
254
+ outline: none;
255
+ box-shadow: none;
256
+ }
257
+ .sbi-oembed-btn button.disable-oembed {
258
+ background: #D72C2C;
259
+ }
260
+ .sbi-oembed-btn button.disable-oembed:hover {
261
+ background-color: #DF5757;
262
+ border-color: #DF5757;
263
+ }
264
+ .sbi-oembed-btn button.disable-oembed:focus,
265
+ .sbi-oembed-btn button.disable-oembed:active {
266
+ background-color: #841919;
267
+ border-color: #841919;
268
+ }
269
+ .sbi-oembed-btn button.loading svg {
270
+ height: 14px;
271
+ transform: translate(0, 2px);
272
+ }
273
+
274
+ /*** 3.3 - OEMBED INFORMATION BOX ***/
275
+ .sbi-oembed-information {
276
+ background: #FFFFFF;
277
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
278
+ margin-bottom: 10px;
279
+ }
280
+ .sbi-oembed-information .sb-box-header {
281
+ padding: 16px 20px;
282
+ border-bottom: 1px solid #E8E8EB;
283
+ }
284
+ .sbi-oembed-information .sb-box-header h3 {
285
+ margin: 0;
286
+ font-weight: 600;
287
+ font-size: 18px;
288
+ line-height: 140%;
289
+ color: #141B38;
290
+ }
291
+ .sb-two-column-box {
292
+ display: flex;
293
+ justify-content: space-around;
294
+ align-items: center;
295
+ border-bottom: 1px solid #E8E8EB;
296
+ }
297
+ .sb-two-column-box-1 img {
298
+ max-width: 438px;
299
+ }
300
+ .sb-two-column-box-2 img{
301
+ margin-top: 20px;
302
+ max-width: 442px;
303
+ }
304
+ .sb-two-column-box .sb-embed-info-text {
305
+ padding: 0 75px 0 35px;
306
+ }
307
+ .sb-two-column-box-2 .sb-embed-info-text {
308
+ padding: 0 65px 0 30px;
309
+ }
310
+ .sb-two-column-box h4,
311
+ .sb-one-column-box h4 {
312
+ font-size: 16px;
313
+ font-weight: 600;
314
+ line-height: 26px;
315
+ color: #141B38;
316
+ }
317
+ .sb-one-column-box {
318
+ max-width: 405px;
319
+ margin: auto;
320
+ text-align: center;
321
+ }
322
+ .sb-one-column-box h4 {
323
+ padding: 0;
324
+ margin-top: 30px;
325
+ margin-bottom: 0px;
326
+ }
327
+ .sb-one-column-box p {
328
+ font-size: 14px;
329
+ line-height: 22px;
330
+ }
331
+ .sb-one-column-box img {
332
+ margin-top: 15px;
333
+ margin-bottom: -21px;
334
+ max-width: 392px;
335
+ }
336
+ .sb-two-column-box-1 .sb-left {
337
+ padding-left: 20px;
338
+ }
339
+ .sb-plugin-info-box {
340
+ padding-top: 20px;
341
+ }
342
+
343
+ .sb-plugin-info-box .sb-left {
344
+ padding-left: 35px;
345
+ }
346
+ .sb-plugin-info-box .sb-right {
347
+ padding: 0 60px 0 40px;
348
+ }
349
+ .sb-plugin-info-box h4 {
350
+ font-size: 18px;
351
+ margin: 0px;
352
+ }
353
+ .sb-plugin-info-box p {
354
+ font-size: 14px;
355
+ line-height: 22px;
356
+ color: #434960;
357
+ margin-top: 10px;
358
+ }
359
+ .sb-plugin-info-box img {
360
+ max-width: 414px;
361
+ margin-bottom: -5px;
362
+ }
363
+ /*** 4.0 - MODAL STYLE ***/
364
+ .sbi-oembed-modal {
365
+ position: absolute;
366
+ top: 0;
367
+ left: 0;
368
+ width: 100%;
369
+ height: 100%;
370
+ background: rgba(0, 0, 0, 0.4);
371
+ z-index: 9;
372
+ }
373
+ .sbi-modal-content {
374
+ background-color: #fff;
375
+ height: 381px;
376
+ max-width: 572px;
377
+ padding: 40px 75px 48px;
378
+ box-sizing: border-box;
379
+ position: relative;
380
+ text-align: center;
381
+ margin: 260px auto 0;
382
+ }
383
+ .sbi-modal-content h2 {
384
+ font-size: 24px;
385
+ line-height: 29px;
386
+ text-align: center;
387
+ letter-spacing: 0;
388
+ color: #141B38;
389
+ margin: 0 0 5px 0;
390
+ }
391
+ .sbi-modal-content p {
392
+ font-size: 12px;
393
+ line-height: 18px;
394
+ text-align: center;
395
+ color: #434960;
396
+ }
397
+ .sbi-modal-content .cancel-btn{
398
+ background: none;
399
+ border: none;
400
+ color: #141B38;
401
+ position: absolute;
402
+ top: 16px;
403
+ right: 16px;
404
+ padding: 0;
405
+ cursor: pointer;
406
+ }
407
+ .sbi-modal-content .modal-icon{
408
+ margin-bottom: 45px;
409
+ }
410
+ .sbi-modal-content .modal-icon img {
411
+ max-width: 102px;
412
+ }
413
+ .sbi-modal-content .sb-action-buttons{
414
+ display: flex;
415
+ justify-content: center;
416
+ margin-top: 30px;
417
+ }
418
+ .sbi-modal-content .sb-action-buttons button:not(:last-child) {
419
+ margin-right: 7px;
420
+ }
421
+
422
+ .sb-action-buttons .sbi-btn {
423
+ display: flex;
424
+ align-items: center;
425
+ vertical-align: middle;
426
+ justify-content: center;
427
+ background: #F3F4F5;
428
+ border: 1px solid #DCDDE1;
429
+ box-sizing: border-box;
430
+ border-radius: 2px;
431
+ padding: 7px 30px;
432
+ font-weight: 600;
433
+ font-size: 14px;
434
+ line-height: 22px;
435
+ color: #141B38;
436
+ box-sizing: border-box;
437
+ letter-spacing: 0.2px;
438
+ cursor: pointer;
439
+ min-width: 175px;
440
+ }
441
+ .sb-action-buttons .sbi-install-btn {
442
+ background-color: #E34F0E;
443
+ border-color: #E34F0E;
444
+ color: #fff;
445
+ }
446
+ .sb-action-buttons .sbi-install-btn:disabled {
447
+ background: #F3F4F5;
448
+ border: 1px solid #DCDDE1;
449
+ color: #141B38;
450
+ cursor: not-allowed
451
+ }
452
+ .sb-action-buttons .sbi-install-btn:not(.success):disabled path {
453
+ fill: #141B38;
454
+ }
455
+ .sb-action-buttons .sbi-install-btn span {
456
+ margin-right: 10px;
457
+ }
458
+
459
+ .sb-action-buttons .sbi-install-btn.loading svg {
460
+ height: 16px;
461
+ transform: translate(0, 2px);
462
+ }
463
+
464
+ /*** 5.0 Sticky Widget ***/
465
+ .sbi-stck-wdg{
466
+ position: fixed;
467
+ right: 21px;
468
+ z-index: 9;
469
+ bottom: 20px;
470
+ }
471
+ .sbi-stck-wdg-btn{
472
+ width: 52px;
473
+ height: 52px;
474
+ background: #fff;
475
+ border-radius: 50%;
476
+ cursor: pointer;
477
+ display: flex;
478
+ justify-content: center;
479
+ align-items: center;
480
+ filter: drop-shadow(0px 9px 13px rgba(0, 0, 0, 0.2));
481
+ }
482
+ .sbi-stck-wdg-btn svg{
483
+ width: 25px;
484
+ fill: #E34F0E;
485
+ height: 33px;
486
+ }
487
+
488
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls,
489
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls svg{
490
+ display: block;
491
+ }
492
+ .sbi-stck-wdg-btn-cls{
493
+ width: inherit;
494
+ height: inherit;
495
+ position: relative;
496
+ color: #364152;
497
+ box-shadow: 0px 1px 6px rgb(0 0 0 / 5%), 0px 9px 12px rgb(0 0 0 / 5%);
498
+ border-radius: 70px;
499
+ }
500
+ .sbi-stck-wdg-btn-cls svg {
501
+ width: 14px;
502
+ height: 14px;
503
+ position: absolute;
504
+ top: 50%;
505
+ right: 0;
506
+ bottom: 0;
507
+ left: 50%;
508
+ margin-top: -7px;
509
+ margin-left: -7px;
510
+ }
511
+
512
+ .sbi-stck-pop{
513
+ position: absolute;
514
+ width: 292px;
515
+ height: auto;
516
+ background: #fff;
517
+ border: 1px solid #E2E8F0;
518
+ box-sizing: border-box;
519
+ box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15), 0px 3px 14px rgba(0, 0, 0, 0.12);
520
+ border-radius: 2px;
521
+ padding: 20px;
522
+ right: 0px;
523
+ bottom: 66px;
524
+ color: #141B38;
525
+ padding-bottom: 82px;
526
+ }
527
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-pop{
528
+ bottom: 66px;
529
+ opacity: 1;
530
+ visibility: visible;
531
+ }
532
+
533
+ .sbi-stck-pop svg{
534
+ fill: currentColor;
535
+ }
536
+ .sbi-stck-el-list{
537
+ border: 1px solid #DCDDE1;
538
+ border-radius: 2px;
539
+ }
540
+ .sbi-stck-el{
541
+ display: flex;
542
+ align-items: center;
543
+ padding: 11px 13px;
544
+ border-bottom: 1px solid #DCDDE1;
545
+ transition: background .15s ease-in-out;
546
+ font-size: 12px;
547
+ }
548
+ .sbi-stck-el:hover{
549
+ background: #F3F4F5;
550
+ }
551
+ .sbi-stck-el:last-of-type{
552
+ border-bottom: 0px;
553
+ }
554
+ .sbi-stck-el-list .sbi-chevron svg{
555
+ width: 5px;
556
+ height: 8px;
557
+ }
558
+ .sbi-fs-a {
559
+ width: 100%;
560
+ height: 100%;
561
+ display: block;
562
+ position: absolute;
563
+ left: 0;
564
+ top: 0;
565
+ z-index: 1;
566
+ }
567
+ .sbi-stck-el .sbi-stck-el-txt{
568
+ color: #27303F;
569
+ }
570
+ .sbi-stck-el.sbi-stck-el-upgrd{
571
+ padding: 9px 14px;
572
+ font-size: 14px;
573
+ background: var(--cl-orange);
574
+ color: #fff;
575
+ position: relative;
576
+ transition: background .15s ease-in-out;
577
+ font-weight: 600;
578
+ }
579
+ .sbi-chevron {
580
+ position: absolute;
581
+ right: 14px
582
+ }
583
+ .sbi-stck-el.sbi-stck-el-upgrd .sbi-stck-el-txt{
584
+ color: #fff;
585
+ }
586
+ .sbi-stck-el.sbi-stck-el-upgrd:after{
587
+ top: 20px;
588
+ opacity: 1;
589
+ }
590
+ .sbi-stck-el-icon{
591
+ margin-right: 10px;
592
+ }
593
+ .sbi-stck-el-icon svg{
594
+ width: 17px;
595
+ float: left;
596
+ }
597
+ .sbi-stck-title{
598
+ margin-top: 20px;
599
+ margin-bottom: 10px;
600
+ color: #141B38;
601
+ font-weight: 600;
602
+ font-size: 14px;
603
+ line-height: 160%;
604
+ }
605
+ .sbi-stck-follow{
606
+ background: #F3F4F5;
607
+ margin-top: 20px;
608
+ left: 0px;
609
+ bottom: 0px;
610
+ position: absolute;
611
+ padding: 12px 20px;
612
+ display: flex;
613
+ align-items: center;
614
+ }
615
+ .sbi-stck-follow span{
616
+ font-weight: 600;
617
+ font-size: 14px;
618
+ }
619
+ .sbi-stck-flw-links{
620
+ display: flex;
621
+ justify-content: center;
622
+ align-items: center;
623
+ margin-left: auto;
624
+ }
625
+ .sbi-stck-flw-links a{
626
+ width: 36px;
627
+ height: 28px;
628
+ color: inherit;
629
+ display: inline-flex;
630
+ justify-content: center;
631
+ align-items: center;
632
+ margin-left: 4px;
633
+ border-radius: 2px;
634
+ transition: background .15s ease-in-out;
635
+ }
636
+ .sbi-stck-flw-links svg{
637
+ width: 17px;
638
+ color: #141B38;
639
+ }
640
+ .sbi-stck-flw-links a:hover{
641
+ background: #fff;
642
+ }
643
+ .sbi-stck-flw-links a:hover svg{
644
+ color: inherit;
645
+ }
646
+
647
+ /*** 6.0 - RESPONSIVENESS ***/
648
+ @media (max-width: 1170px) {
649
+ .sbi-oembed-plugin-box .oembed-text {
650
+ flex-basis: 78%;
651
+ }
652
+ }
653
+
654
+ @media (max-width: 1024px) {
655
+ .sbi-oembed-plugin-box .oembed-text {
656
+ flex-basis: 72%;
657
+ }
658
+ .sb-two-column-box {
659
+ flex-direction: column;
660
+ }
661
+ .sb-two-column-box-1 {
662
+ flex-direction: column-reverse;
663
+ }
664
+ .sb-two-column-box .sb-embed-info-text{
665
+ padding: 0 35px;
666
+ text-align: center;
667
+ }
668
+ .sb-two-column-box-2 img {
669
+ margin-top: 0px;
670
+ }
671
+ .sb-two-column-box .sb-left,
672
+ .sb-two-column-box .sb-right {
673
+ max-width: 405px;
674
+ margin: auto;
675
+ }
676
+ .sb-two-column-box.sb-plugin-info-box .sb-embed-info-text {
677
+ margin-top: 25px;
678
+ }
679
+ .auto-fold #wpcontent {
680
+ padding-left: 0px;
681
+ }
682
+ }
683
+ @media (max-width: 767px) {
684
+ .auto-fold #wpcontent {
685
+ padding-left: 0;
686
+ }
687
+ .sbi-fb-full-wrapper {
688
+ padding: 70px 20px 0 20px;
689
+ }
690
+ .sbi-fb-header {
691
+ padding: 0px 20px;
692
+ }
693
+ .sbi-fb-hd-btn {
694
+ padding: 0px 15px 0px 7px;
695
+ }
696
+ .sbi-about-box .sb-team-info {
697
+ padding: 30px;
698
+ }
699
+ .sbi-oembed-plugin-box {
700
+ flex-wrap: wrap;
701
+ }
702
+ .sbi-oembed-plugin-box .oembed-icon {
703
+ width: 20px;
704
+ vertical-align: middle;
705
+ display: flex;
706
+ }
707
+ .sbi-oembed-plugin-box .sbi-oembed-btn {
708
+ flex-basis: 114px;
709
+ text-align: left;
710
+ margin-top: 15px;
711
+ }
712
+ .sbi-oembed-plugin-box .oembed-text {
713
+ flex-basis: calc(100% - 40px);
714
+ }
715
+ .sb-plugin-info-box .sb-left,
716
+ .sb-two-column-box-1 .sb-left,
717
+ .sb-two-column-box-2 .sb-right,
718
+ .sb-one-column-box img {
719
+ display: none;
720
+ }
721
+ .sb-one-column-box {
722
+ padding-bottom: 5px !important;
723
+ }
724
+ .sb-one-column-box h4 {
725
+ margin-top: 21px;
726
+ }
727
+ .sb-two-column-box.sb-plugin-info-box .sb-embed-info-text {
728
+ margin-top: 0;
729
+ }
730
+ .sb-plugin-info-box p {
731
+ margin-bottom: 17px;
732
+ }
733
+ .sbi-modal-content {
734
+ margin: 80px auto 0;
735
+ width: 90%;
736
+ height: auto;
737
+ padding: 40px 30px;
738
+ }
739
+ .sbi-modal-content .modal-icon {
740
+ margin-bottom: 30px;
741
+ }
742
+ .sb-plugin-info-box h4 {
743
+ font-size: 16px;
744
+ }
745
+ }
746
+ @media (max-width: 630px) {
747
+ .sb-two-column-box img,
748
+ .sb-one-column-box img {
749
+ max-width: 100%;
750
+ }
751
+ .sbi-modal-content .sb-action-buttons {
752
+ flex-direction: column;
753
+ }
754
+ .sbi-modal-content .sb-action-buttons button:not(:last-child) {
755
+ margin-right: 0px;
756
+ margin-bottom: 7px;
757
+ }
758
+ }
759
+ @media (max-width: 530px) {
760
+ .sb-two-column-box .sb-left,
761
+ .sb-two-column-box .sb-right,
762
+ .sb-one-column-box {
763
+ padding: 0 20px;
764
+ }
765
+
766
+ .sb-two-column-box h4, .sb-one-column-box h4 {
767
+ line-height: 22px;
768
+ }
769
+ .sb-one-column-box img {
770
+ margin-bottom: -15px;
771
+ }
772
+ }
773
+
774
+ .sbi-btn-blue {
775
+ background: #0068A0!important;
776
+ color: #fff!important;
777
+ }
778
+
779
+ .sb-button-standard{
780
+ position: relative;
781
+ font-style: normal;
782
+ font-weight: 600;
783
+ font-size: 14px;
784
+ padding: 10px 20px 10px 39px;
785
+ line-height: 16px;
786
+ height: auto;
787
+ }
788
+ .sb-button-standard svg {
789
+ width: 16px;
790
+ height: 16px;
791
+ position: absolute;
792
+ left: 13px;
793
+ right: auto;
794
+ top: 10px;
795
+ bottom: auto;
796
+ }
797
+ .sbi-stck-el.sbi-stck-el-upgrd svg path{
798
+ fill: #fff!important;
799
+ }
admin/assets/css/settings.css CHANGED
@@ -1,1861 +1,1861 @@
1
- /*
2
- * Settings CSS TABLE OF CONTENTS
3
- *
4
- * 1.0 - Global
5
- * 2.0 - SBI CSS Framework
6
- * 2.1 - Utility CSS
7
- * 2.2 - Notification Element
8
- * 3.0 - Header
9
- * 4.0 - Content
10
- * 4.1 - Tab Styles
11
- * 4.2 - Tab Boxes
12
- * 5.0 - Footer
13
- * 6.0 - Sticky Widget
14
- * 7.0 - Responsiveness
15
- */
16
-
17
- /*** 1.0 - Global ***/
18
- .clearfix { display: inline-block; }
19
- /* start commented backslash hack \*/
20
- * html .clearfix { height: 1%; }
21
- .clearfix { display: block; }
22
- #sbi-settings {
23
- -webkit-font-smoothing: antialiased;
24
- font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
25
- }
26
- #wpcontent {
27
- padding-left: 0px;
28
- }
29
-
30
- .clearfix:after {
31
- visibility: hidden;
32
- display: block;
33
- font-size: 0;
34
- content: " ";
35
- clear: both;
36
- height: 0;
37
- }
38
- .checkmark {
39
- width: 21px;
40
- height: 22px;
41
- border-radius: 50%;
42
- display: block;
43
- stroke-width: 2;
44
- stroke: #59AB46;
45
- stroke-miterlimit: 10;
46
- stroke-dashoffset: 0;
47
- }
48
- .sbi-fb-full-wrapper{
49
- padding: 0 53px;
50
- padding-top: 82px;
51
- }
52
- .sbi-fb-fs {
53
- width: 100%;
54
- position: relative;
55
- float: left;
56
- box-sizing: border-box;
57
- }
58
- #adminmenu a[href="admin.php?page=sbi-support"] {
59
- display: none;
60
- }
61
- /*** 2.0 - SBI CSS Framework ***/
62
- .d-flex {
63
- display: flex;
64
- }
65
- .justify-between {
66
- justify-content: space-between;
67
- }
68
- .items-center{
69
- align-items: center;
70
- }
71
- /* SBI Form Fields */
72
- .sb-form-field {
73
- display: block;
74
- position: relative;
75
- }
76
- .sb-form-field .help-text {
77
- font-size: 13px;
78
- line-height: 22px;
79
- color: #434960;
80
- font-weight: 400;
81
- word-spacing: 0.3px;
82
- max-width: 640px;
83
- }
84
- .sb-form-field .help-text-green {
85
- color: #59AB46;
86
- }
87
- .sb-form-field .help-text a {
88
- color: inherit;
89
- font-weight: 500;
90
- }
91
- /* input field styles */
92
- .sb-form-field .sbi-form-field {
93
- background: #FFFFFF;
94
- border: 1px solid #D0D1D7;
95
- box-sizing: border-box;
96
- border-radius: 1px;
97
- height: 38px;
98
- padding: 8px;
99
- }
100
- .sb-form-field .sbi-form-field:focus {
101
- outline: none;
102
- box-shadow: none;
103
- }
104
- .sb-form-field .field-icon {
105
- position: absolute;
106
- right: 8px;
107
- top: 10px;
108
- font-size: 20px;
109
- }
110
- /* sbi-checkbox styles */
111
- .sbi-checkbox {
112
- align-items: center;
113
- border-radius: 100px;
114
- display: flex;
115
- font-weight: 700;
116
- margin-bottom: 15px;
117
- }
118
- .sbi-checkbox input[type=checkbox] {
119
- clip: rect(0 0 0 0);
120
- clip-path: inset(50%);
121
- height: 1px;
122
- overflow: hidden;
123
- position: absolute;
124
- white-space: nowrap;
125
- width: 1px;
126
- }
127
- .toggle-track {
128
- width: 36px;
129
- height: 20px;
130
- position: relative;
131
- background: #9e9e9e;
132
- border-radius: 31px;
133
- }
134
- .toggle-indicator {
135
- width: 16px;
136
- height: 16px;
137
- background-color: #fff;
138
- border-radius: 100px;
139
- top: 2px;
140
- position: absolute;
141
- left: 2px;
142
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
143
- transition: all .3s cubic-bezier(0.23, 1, 0.320, 1);
144
- }
145
- .sbi-checkbox input[type=checkbox]:checked + .toggle-track .toggle-indicator {
146
- left: 18px;
147
- }
148
- .sbi-checkbox input[type=checkbox]:checked + .toggle-track {
149
- background: #0096CC;
150
- }
151
-
152
- .sbi-error-text {
153
- color: #D72C2C;
154
- }
155
- .sbi-error-text a {
156
- color: inherit;
157
- }
158
- .sbi-fb-cp-clpboard{
159
- width: 0px;
160
- height: 0px;
161
- position: absolute;
162
- left: -100000px;
163
- }
164
- /* sbi-select */
165
- .sb-form-field .sbi-select {
166
- min-width: 235px;
167
- border: 1px solid #D0D1D7;
168
- padding: 8px 35px 8px 15px;
169
- height: 50px;
170
- font-size: 16px;
171
- color: #141B38;
172
- -webkit-appearance: none;
173
- appearance: none;
174
- background: #fff url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAFCAYAAAB8ZH1oAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABSSURBVHgBfc4hCkAhDAbgjV3slQcvvHuYDWY1G8zewyIWb6YuCCLqD4Pt5wtD54NBQA2XVKiWcorl/X7s+DkhJYUhPk54IN5plCue0Tb8M8/aNx/uIpRVqbbFAAAAAElFTkSuQmCC') no-repeat right 15px top 55%;
175
- box-sizing: border-box;
176
- }
177
- .sb-form-field .sbi-select.size-md {
178
- width: 422px;
179
- }
180
- .sb-form-field .sbi-select.size-sm {
181
- width: 210px;
182
- min-width: 210px;
183
- }
184
- .sb-form-field .sbi-select.size-xs {
185
- min-width: 100px;
186
- width: 100px;
187
- }
188
- .sb-form-field .sbi-textarea {
189
- width: 100%;
190
- min-height: 100px;
191
- padding: 12px;
192
- border: 1px solid #D0D1D7;
193
- font-size: 16px;
194
- }
195
- .sb-form-field .sbi-textarea::placeholder {
196
- color: #8C8F9A;
197
- }
198
- .sb-form-field .sbi-textarea:focus {
199
- outline: none;
200
- box-shadow: none;
201
- border-color: #9c9ca0;
202
- }
203
- /* SBI Buttons */
204
- .sbi-btn {
205
- display: flex;
206
- align-items: center;
207
- vertical-align: middle;
208
- background: #F3F4F5;
209
- border: 1px solid #DCDDE1;
210
- box-sizing: border-box;
211
- border-radius: 2px;
212
- padding: 7px 20px;
213
- font-weight: 600;
214
- font-size: 14px;
215
- line-height: 22px;
216
- color: #141B38;
217
- box-sizing: border-box;
218
- letter-spacing: 0.2px;
219
- cursor: pointer;
220
- transition: all 0.15s ease-in-out;
221
- }
222
- .sbi-btn:hover {
223
- background: #FFFFFF;
224
- border: 1px solid #D0D1D7;
225
- }
226
- .sbi-btn:focus,
227
- .sbi-btn:active {
228
- background: #E8E8EB;
229
- border: 1px solid #D0D1D7;
230
- }
231
- .sbi-btn .sb-btn-icon {
232
- margin-right: 10px;
233
- max-width: 15px;
234
- }
235
- .sbi-btn.sb-btn-lg {
236
- height: 50px;
237
- font-size: 16px;
238
- padding: 7px 25px;
239
- }
240
- .sbi-btn.sb-btn-blue {
241
- background-color: #0068A0;
242
- color: #fff;
243
- border-color: #096292;
244
- }
245
- .sbi-btn span {
246
- line-height: 1;
247
- margin-right: 5px;
248
- }
249
- .sb-btn-orange {
250
- background: #E34F0E;
251
- color: #fff;
252
- font-style: normal;
253
- font-weight: 600;
254
- font-size: 14px;
255
- line-height: 160%;
256
- }
257
- .sb-tabs-container .sb-tabs .sb-btn-orange {
258
- margin-top: -20px;
259
- }
260
- .sbi-btn svg.checkmark {
261
- stroke: #fff;
262
- transform: translate(-7px, -3px);
263
- }
264
- .input-hidden {
265
- height: 0px;
266
- width: 0px;
267
- overflow: hidden;
268
- }
269
-
270
- /*** 2.1 - SBI Utility CSS ***/
271
- .mr-3 {
272
- margin-right: 3px;
273
- }
274
- .mr-4 {
275
- margin-right: 4px;
276
- }
277
- .mb-6 {
278
- margin-bottom: 6px;
279
- }
280
- .mb-10 {
281
- margin-bottom: 10px;
282
- }
283
- .mb-15 {
284
- margin-bottom: 15px;
285
- }
286
- .mb-20 {
287
- margin-bottom: 20px;
288
- }
289
- .mb-30 {
290
- margin-bottom: 30px;
291
- }
292
- .mb-40 {
293
- margin-bottom: 40px;
294
- }
295
- .mb-50 {
296
- margin-bottom: 50px;
297
- }
298
- .ml-10 {
299
- margin-left: 15px;
300
- }
301
-
302
- /*** 2.1 Notification Element ***/
303
- .sb-notification-ctn{
304
- position: fixed;
305
- bottom: -100px;
306
- left: 200px;
307
- z-index: 99999;
308
- background: #fff;
309
- display: flex;
310
- justify-content: center;
311
- align-items: center;
312
- border-left: 3px solid #fff;
313
- line-height: 1em;
314
- padding: 10px 20px;
315
- padding-left: 0px;
316
- border-radius: 4px;
317
- box-shadow: 0px 26.7377px 77.2886px rgba(0, 0, 0, 0.107828), 0px 14.2952px 41.3222px rgba(0, 0, 0, 0.0894161), 0px 8.01379px 23.1649px rgba(0, 0, 0, 0.075), 0px 4.25607px 12.3027px rgba(0, 0, 0, 0.0605839), 0px 1.77104px 5.11942px rgba(0, 0, 0, 0.0421718);
318
-
319
- }
320
- .sb-notification-ctn[data-active="hidden"]{
321
- -webkit-animation: sbi-notification-hide .5s forwards linear;
322
- animation: sbi-notification-hide .5s forwards linear;
323
- }
324
- .sb-notification-ctn[data-active="shown"]{
325
- -webkit-animation: sbi-notification-show .5s forwards linear;
326
- animation: sbi-notification-show .5s forwards linear;
327
- }
328
- @-webkit-keyframes sbi-notification-show { 0%{bottom: -100px;} 50%{bottom: 70px;} 70%{bottom: 60px;} 85%{bottom: 65px;} 100%{bottom: 50px;}}
329
- @keyframes sbi-notification-show { 0%{bottom: -100px;} 50%{bottom: 70px;} 70%{bottom: 60px;} 85%{bottom: 65px;} 100%{bottom: 50px;}}
330
-
331
- @-webkit-keyframes sbi-notification-hide {0%{bottom: 50px;}55%{bottom: 65px;}70%{bottom: 60px;}85%{bottom: 70px;}100%{bottom: -100px;}}
332
- @keyframes sbi-notification-hide {0%{bottom: 50px;}55%{bottom: 65px;}70%{bottom: 60px;}85%{bottom: 70px;}100%{bottom: -100px;}}
333
-
334
- .sb-notification-ctn[data-type="success"]{
335
- border-color: #59AB46;
336
- }
337
- .sb-notification-ctn[data-type="error"]{
338
- border-color: #D72C2C;
339
- }
340
- .sb-notification-ctn[data-type="message"]{
341
- border-color: #141B38;
342
- }
343
- .sb-notification-icon{
344
- width: 25px;
345
- height: 25px;
346
- display: flex;
347
- justify-content: center;
348
- align-items: center;
349
- margin-left: 10px;
350
- margin-right: 15px;
351
- }
352
- .sb-notification-icon svg{
353
- width: 22px;
354
- height: 22px;
355
- float: left;
356
- fill: currentColor;
357
- }
358
-
359
- .sb-notification-ctn[data-type="success"] .sb-notification-icon{
360
- color: #59AB46;
361
- }
362
- .sb-notification-ctn[data-type="error"] .sb-notification-icon{
363
- color: #D72C2C;
364
- }
365
- .sb-notification-ctn[data-type="message"] .sb-notification-icon{
366
- color: #141B38;
367
- }
368
-
369
- .sb-notification-ctn span{
370
- font-size: 14px;
371
- color: #141B38;
372
- font-weight:500;
373
- }
374
-
375
- /*** 3.0 - Header ***/
376
- .sbi-fb-create-ctn{
377
- margin-top: 90px;
378
- }
379
- .sbi-fb-header{
380
- height: 64px;
381
- position: absolute;
382
- display: flex;
383
- flex-direction: row;
384
- justify-content: space-between;
385
- align-items: center;
386
- background: #fff;
387
- padding: 0px 52px;
388
- z-index: 2;
389
- }
390
- .sbi-fb-header-left {
391
- display: flex;
392
- }
393
- .sbi-fb-header-left .sb-social-wall-link-wrap {
394
- margin-left: 30px;
395
- }
396
- .sbi-fb-hd-logo{
397
- display: flex;
398
- vertical-align: middle;
399
- align-items: center;
400
- gap: 5px;
401
- }
402
- .sbi-fb-hd-logo .sb-logo-letters-wrap {
403
- margin-bottom: 4px;
404
- }
405
- .sbi-fb-hd-logo .breadcrumb-title{
406
- font-size: 14px;
407
- font-weight: 400;
408
- line-height: 22px;
409
- letter-spacing: 0em;
410
- margin-left: 4px;
411
- }
412
- .sbi-fb-hd-logo .separator{
413
- margin: 0 5px 0 10px;
414
- }
415
- .sbi-fb-hd-btn{
416
- height: 38px;
417
- cursor: pointer;
418
- display: flex;
419
- flex-direction: row;
420
- justify-content: center;
421
- align-items: center;
422
- padding: 0px 15px 0px 16px;
423
- font-weight: 600;
424
- font-size:14px;
425
- color: #353A41;
426
- background: #F3F4F5;
427
- border-radius: 2px;
428
- border: 1px solid #DCDDE1;
429
- position: relative;
430
- text-decoration: none;
431
- transition: all 0.3s ease;
432
- }
433
- .sbi-fb-hd-btn:hover {
434
- color: inherit;
435
- background-color: #fff;
436
- }
437
- .sbi-fb-hd-btn i{
438
- margin: 0px 5px;
439
- }
440
- .sbi-fb-hd-btn[data-icon="left"]{
441
- padding-right: 20px!important;
442
- }
443
-
444
- .sbi-fb-full-wrapper .section-header {
445
- margin-top: 33px;
446
- }
447
- .sbi-fb-full-wrapper .section-header h1 {
448
- font-size: 32px;
449
- line-height: 40px;
450
- }
451
- /*** 4.0 - Content ***/
452
-
453
- /*** 4.1 - Tab Styles ***/
454
- .sb-tabs-container {
455
- position: relative;
456
- width: 100%;
457
- margin-top: 28px;
458
- }
459
- .sb-tabs-container .sb-tab-content .sb-tab-content-inner {
460
- width: 100%;
461
- margin-top: 20px;
462
- height: auto;
463
- padding-bottom: 30px;
464
- }
465
- .sb-tabs-container .sbi-save-button {
466
- display: flex;
467
- justify-content: flex-end;
468
- margin-top: 30px;
469
- }
470
- .sb-tabs-container .sb-tabs {
471
- position: relative;
472
- display: flex;
473
- align-items: center;
474
- justify-content: space-between;
475
- margin-bottom: 20px;
476
- }
477
- .sb-tabs-container .sb-tabs:after {
478
- position: absolute;
479
- content: '';
480
- width: 100%;
481
- height: 1px;
482
- background-color: #DCDDE1;
483
- bottom: 0px;
484
- left: 0px;
485
- z-index: -1;
486
- }
487
- .sb-tabs-container .sb-tabs .tab {
488
- position: relative;
489
- padding: 9px 25px 15px 25px;
490
- display: inline-block;
491
- font-weight: 500;
492
- font-size: 16px;
493
- line-height: 160%;
494
- color: #8C8F9A;
495
- text-decoration: none;
496
- cursor: pointer;
497
- -webkit-transition: linear 0.2s;
498
- -ms-transition: linear 0.2s;
499
- transition: linear 0.2s;
500
- }
501
- .sb-tabs-container .sb-tabs .tab:not(:last-child) {
502
- margin-right: 20px;
503
- }
504
- .sb-tabs-container .sb-tabs .tab.active {
505
- color: #0068A0;
506
- }
507
- .sb-tabs-container .sb-tabs .tab-indicator {
508
- position: absolute;
509
- bottom: 0px;
510
- left: 0px;
511
- background-color: #0068A0;
512
- width: 200px;
513
- height: 2px;
514
- transition: all 0.3s cubic-bezier(0.22, 0.51, 0.53, 0.88);
515
- }
516
-
517
- .slide-fade-enter-active {
518
- transition: all 0.3s ease;
519
- position: absolute;
520
- }
521
- .slide-fade-leave-active {
522
- position: absolute;
523
- transition: all 0.3s cubic-bezier(1, 0.5, 0.8, 1);
524
- }
525
- .slide-fade-enter,
526
- .slide-fade-leave-to {
527
- transform: translateX(10px);
528
- opacity: 0;
529
- }
530
-
531
- /*** 4.2 - Tab Boxes ***/
532
- .sb-tab-content{
533
- width: 100%;
534
- height: auto;
535
- }
536
- .sb-tab-content .sb-tab-box {
537
- background-color: #fff;
538
- padding: 24px;
539
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
540
- margin-bottom: 12px;
541
- }
542
- .sb-tab-content .sb-tab-box-small {
543
- padding: 13px 24px;
544
- }
545
- .sb-tab-content .sb-tab-box h3,
546
- #sbi-settings .sb-tab-content .sb-tab-box h3 {
547
- margin: 0px 0px 5px;
548
- font-size: 18px;
549
- line-height: 140%;
550
- color: #141B38;
551
- display: flex;
552
- }
553
- .sb-tab-content .sb-tab-box h3 .sb-tooltip-info {
554
- transform: translate(10px, 2px);
555
- cursor: pointer;
556
- }
557
- .sb-tab-content .sb-tab-box p {
558
- font-size: 14px;
559
- line-height: 160%;
560
- color: #8C8F9A;
561
- margin: 0px;
562
- }
563
- .sb-tab-content .sb-tab-box .tab-label {
564
- max-width: 270px;
565
- min-width: 270px;
566
- padding-right: 55px;
567
- box-sizing: border-box;
568
- float: left;
569
- position: relative;
570
- }
571
- .sb-tab-content .sb-tab-box .tab-label.tab-label-full {
572
- min-width: 100%;
573
- max-width: 100%;
574
- padding-right: 0;
575
- float: initial;
576
- }
577
- .sb-tab-content .sb-tab-box .tab-label .sb-help-text {
578
- font-size: 14px;
579
- line-height: 160%;
580
- color: #8C8F9A;
581
- }
582
- .sb-tab-content .license-status {
583
- font-size: 14px;
584
- line-height: 160%;
585
- color: #141B38;
586
- margin-bottom: 8px;
587
- display: inline-block;
588
- }
589
- .sbi-tab-field-inner-wrap .upgrade-info{
590
- border-bottom: 1px solid #DCDDE1;
591
- margin-bottom: 24px;
592
- padding-bottom: 24px;
593
- }
594
- .dev-site-license-field .upgrade-info{
595
- border-bottom: 0px solid #DCDDE1;
596
- padding-bottom: 0px;
597
- }
598
- .sb-tab-box.sb-license-box.license-type-free .license-status {
599
- font-style: italic;
600
- }
601
- .dev-site-license-field .sbi-upgrade-license-btn {
602
- text-decoration: none;
603
- transform: none !important;
604
- height: 38px;
605
- padding: 4px 13px;
606
- width: 165px;
607
- box-sizing: border-box;
608
- border: none;
609
- }
610
- .dev-site-license-field .sbi-upgrade-license-btn span {
611
- height: 20px;
612
- margin-right: 9px;
613
- }
614
- .sb-tab-content .sb-tab-box .sbi-tab-form-field{
615
- width: calc(100% - 270px);
616
- float: left;
617
- flex-wrap: wrap;
618
- }
619
- .sb-tab-content .sb-tab-box .sbi-tab-form-field .sbi-tab-field-inner-wrap {
620
- width: 100%;
621
- }
622
- .sb-tab-content .sb-tab-box .sbi-tab-form-field .sbi-tab-field-inner-wrap:not(:last-child) {
623
- margin-bottom: 20px;
624
- }
625
- .sb-tab-box.sb-license-box.license-type-free .sbi-tab-form-field {
626
- flex-basis: 58%;
627
- flex-wrap: wrap;
628
- }
629
- .sb-tab-box.sb-manage-sources-box .sbi-tab-form-field {
630
- max-width: 1200px;
631
- }
632
- .sb-tab-box.sb-custom-css-box .sbi-tab-form-field,
633
- .sb-tab-box.sb-custom-js-box .sbi-tab-form-field {
634
- max-width: 840px;
635
- }
636
- @media (max-width: 1023px) {
637
- .sb-tab-content .sb-tab-box .tab-label {
638
- width: 100%;
639
- max-width: 100%;
640
- padding-right: 0;
641
- float: initial;
642
- margin-bottom: 20px;
643
- }
644
- .sb-tab-content .sb-tab-box .sbi-tab-form-field{
645
- width: 100%;
646
- float: intial;
647
- }
648
- }
649
-
650
- .sb-tab-box.sb-license-box.license-type-free .sbi-tab-form-field .upgrade-info {
651
- width: 100%;
652
- border-bottom: 1px solid #DCDDE1;
653
- padding-bottom: 25px;
654
- margin-bottom: 25px;
655
- }
656
- .sb-tab-box.sb-license-box.license-type-free .field-left-content,
657
- .sb-tab-box.sb-license-box.license-type-free .field-right-content {
658
- order: 1;
659
- }
660
- .sb-tab-content .sb-tab-box .sbi-tab-form-field .sbi-form-field {
661
- width: 100%;
662
- }
663
- .license-valid .sbi-form-field,
664
- .license-valid .sbi-form-field:focus {
665
- border-color: #59AB46;
666
- }
667
- .license-invalid .sbi-form-field {
668
- border-color: #D72C2C;
669
- }
670
- .sb-field-error .sbi-form-field,
671
- .sb-field-error .sbi-form-field:focus {
672
- border-color: #D72C2C;
673
- }
674
- .license-valid .field-icon {
675
- color: #59AB46;
676
- }
677
- .field-icon.field-icon-error {
678
- color: #D72C2C;
679
- }
680
- .license-valid .sb-form-field .field-icon,
681
- .sb-form-field .field-icon.field-icon-error {
682
- background: white;
683
- }
684
- .form-error .sbi-form-field,
685
- .license-expired .sbi-form-field {
686
- border-color: #ab4646;
687
- }
688
- .upgrade-info span {
689
- font-size: 14px;
690
- line-height: 22px;
691
- display: inline-block;
692
- }
693
- .upgrade-info span:last-child {
694
- font-style: italic;
695
- }
696
- .upgrade-info span a {
697
- font-weight: 700;
698
- color: #0068A0;
699
- }
700
- .sb-tab-content .sb-tab-box .sbi-tab-form-field .sbi-btn{
701
- transform: translate(10px, 0px);
702
- }
703
- .sb-tab-content .sb-tab-box.sb-caching-box .sbi-tab-form-field .sbi-btn,
704
- .sb-tab-content .sb-tab-box.sb-import-box .sbi-tab-form-field .sbi-btn{
705
- transform: translate(0px);
706
- }
707
- .sb-tab-content .sb-tab-box.sb-license-box .sbi-tab-form-field .sb-form-field{
708
- margin-bottom: 8px;
709
- }
710
- .license-valid .sbi-btn.loading svg path {
711
- fill: #141B38
712
- }
713
- .sb-tab-content .sb-tab-box .sbi-tab-form-field .field-left-content {
714
- flex-basis: 73%;
715
- max-width: 465px;
716
- }
717
- .sb-tab-content .sb-tab-box.sb-license-box.license-type-free .sbi-tab-form-field .field-left-content {
718
- flex-basis: 73%;
719
- }
720
- .sb-tab-content .sb-tab-box .sbi-tab-form-field .field-right-content {
721
- flex-basis: 20%;
722
- }
723
- .sb-tab-content .sb-tab-box .sbi-tab-form-field .form-info {
724
- font-size: 12px;
725
- line-height: 22px;
726
- color: #27303F;
727
- }
728
- .sb-tab-content .sb-tab-box .sbi-tab-form-field .form-info .manage-license a{
729
- text-decoration-line: underline;
730
- color: #27303F;
731
- }
732
- .sb-tab-content .sb-tab-box .sbi-tab-form-field .form-info .test-connection {
733
- color: #434960;
734
- }
735
- .sb-tab-content .sb-tab-box .sbi-tab-form-field .form-info .upgrade a {
736
- color: #0068A0;
737
- font-weight: 600;
738
- margin-left: 8px;
739
- text-decoration: none;
740
- }
741
- .sb-tab-content .sb-tab-box.sb-reset-box-style {
742
- margin: 0;
743
- border-bottom: 1px solid #E8E8EB;
744
- }
745
- .sb-tooltip-content {
746
- position: absolute;
747
- background: #fff;
748
- border-radius: 2px;
749
- padding: 12px 26px 12px 16px;
750
- box-shadow: 1px 2px 4px 0px rgb(0 0 0 / 15%), -2px -1px 9px 0px rgb(0 0 0 / 13%);
751
- width: 497px;
752
- height: auto;
753
- max-height: 284px;
754
- bottom: 50px;
755
- box-sizing: border-box;
756
- right: -45px;
757
- z-index: 9999;
758
- }
759
- .sb-tooltip-content p {
760
- color: #141B38;
761
- font-size: 14px;
762
- line-height: 22px;
763
- font-weight: normal;
764
- }
765
- .sb-tooltip-content:after {
766
- width: 12px;
767
- height: 12px;
768
- content: '';
769
- bottom: -7px;
770
- right: calc(50% - 6px);
771
- position: absolute;
772
- background: #fff;
773
- transform: rotate(45deg);
774
- box-shadow: 2px 2px 2px rgb(0 0 0 / 14%);
775
- }
776
- .sb-localization-box .sb-tooltip-content:after {
777
- right: calc(50% - 55px);
778
- }
779
- .sb-tooltip-content.sb-tooltip-bottom {
780
- bottom: inherit;
781
- top: 45px;
782
- box-shadow: -1px -2px 4px 0px rgb(0 0 0 / 15%), 2px 1px 9px 0px rgb(0 0 0 / 13%);
783
- }
784
- .sb-tooltip-content.sb-tooltip-bottom:after {
785
- bottom: inherit;
786
- top: -6px;
787
- box-shadow: -2px -2px 2px rgb(0 0 0 / 14%);
788
- }
789
- .sb-tab-content .sb-tab-box .sb-tooltip-content p {
790
- color: #141B38;
791
- }
792
- .sb-tab-content .sb-tab-box .sb-tooltip-content p:not(:last-child) {
793
- margin-bottom: 12px;
794
- }
795
- .sb-tab-content .sb-tab-box .sb-tooltip-content p a {
796
- color: #141B38;
797
- font-weight: 600;
798
- }
799
- .sb-gdpr-box .sb-gdpr-active {
800
- padding-left: 27px;
801
- position: relative;
802
- max-width: 560px;
803
- box-sizing: border-box;
804
- }
805
- .sb-gdpr-box .gdpr-help-text-yes {
806
- max-width: 560px;
807
- }
808
- .sb-gdpr-box .sb-gdpr-active .gdpr-active-icon {
809
- position: absolute;
810
- left: 0px;
811
- }
812
- .sb-gdpr-box .help-text a {
813
- font-weight: 400;
814
- }
815
- .sb-gdpr-box .sb-text-bold {
816
- font-weight: 700;
817
- cursor: pointer;
818
- }
819
- .sb-gdpr-box .sb-gdpr-bold {
820
- text-decoration: underline;
821
- }
822
- .sb-gdpr-info-tooltip {
823
- position: absolute;
824
- font-size: 14px;
825
- line-height: 22px;
826
- color: #141B38;
827
- background: #FFFFFF;
828
- border-radius: 2px;
829
- padding: 12px 26px 12px 16px;
830
- box-shadow: 1px 2px 4px 0px rgb(0 0 0 / 15%), -2px -1px 9px 0px rgb(0 0 0 / 13%);
831
- z-index: 99;
832
- width: 561px;
833
- bottom: -183px;
834
- box-sizing: border-box;
835
- }
836
- .sb-gdpr-info-tooltip:before {
837
- width: 0;
838
- height: 0;
839
- border-left: 8px solid transparent;
840
- border-right: 8px solid transparent;
841
- border-bottom: 10px solid #fff;
842
- content: '';
843
- top: -10px;
844
- right: 260px;
845
- position: absolute;
846
- }
847
- .sb-gdpr-info-tooltip .sb-gdpr-info-headline {
848
- font-weight: 600;
849
- }
850
- .sb-gdpr-info-tooltip .sb-gdpr-info-list {
851
- margin: 0px;
852
- margin-top: 1px;
853
- padding-left: 20px;
854
- }
855
- .sb-gdpr-info-tooltip .sb-gdpr-info-list li {
856
- position: relative;
857
- margin-bottom: 2px;
858
- }
859
- .sb-gdpr-info-tooltip .sb-gdpr-info-list li:before {
860
- width: 3px;
861
- height: 3px;
862
- position: absolute;
863
- left: -12px;
864
- top: 10px;
865
- content: '';
866
- background-color: #141B38;
867
- border-radius: 10px;
868
- }
869
- .recheck-license-status svg,
870
- .test-connection svg {
871
- width: 15px;
872
- height: 15px;
873
- transform: translate(2px, 3px);
874
- }
875
- .test-connection i {
876
- font-size: 14px;
877
- }
878
- .recheck-license-status.loading path,
879
- .test-connection.loading path {
880
- fill: #141B38
881
- }
882
- .rrecheck-license-status.success svg,
883
- .test-connection.success svg {
884
- transform: translate(3px, 6px)
885
- }
886
- .test-connection i,
887
- .recheck-license-status i {
888
- font-size: 16px;
889
- transform: translate(-2px, 1px);
890
- }
891
- .recheck-license-status.success path,
892
- .test-connection.success path {
893
- fill: #59AB46;
894
- }
895
- .recheck-license-status.success i,
896
- .test-connection.success i {
897
- color: #59AB46;
898
- }
899
- .recheck-license-status.error i,
900
- .test-connection.error i {
901
- color: #D72C2C;
902
- }
903
- .recheck-license-status {
904
- margin-left: 8px;
905
- cursor: pointer;
906
- }
907
- .recheck-license-status i {
908
- margin-left: 8px;
909
- }
910
- .test-connection.error i {
911
- color: #D72C2C;
912
- }
913
- .test-connection a {
914
- color: #434960;
915
- font-weight: 600;
916
- margin-left: 4px;
917
- }
918
- .test-connection:not(.error):not(.success) {
919
- cursor: pointer;
920
- }
921
- .sbi-btn[disabled="disabled"] {
922
- cursor: not-allowed;
923
- color: #8C8F9A;
924
- background: #F3F4F5;
925
- }
926
- .sbi-btn[disabled="disabled"]:hover {
927
- color: #8C8F9A;
928
- }
929
- .sbi-btn[disabled="disabled"]:not(.import-btn) .icon path {
930
- fill: #8C8F9A;
931
- }
932
- .import-btn .icon svg:not(.checkmark) path {
933
- fill: #141B38;
934
- }
935
- .import-btn[disabled="disabled"] .icon svg:not(.checkmark) path {
936
- fill: #8C8F9A;
937
- }
938
- .sbi-btn .icon {
939
- margin-right: 12px;
940
- }
941
- .import-btn .icon.loading {
942
- transform: translate(-5px, 1px);
943
- }
944
- .import-btn .icon.success {
945
- transform: translate(-4px, 0px);
946
- }
947
- .import-btn .icon.error {
948
- transform: translate(-4px, 0px);
949
- }
950
- .import-btn .icon.error i {
951
- color: #D72C2C;
952
- }
953
- .import-btn .icon.success svg {
954
- stroke: #141B38
955
- }
956
- .export-btn {
957
- text-decoration: none;
958
- }
959
- .export-btn:hover {
960
- color: inherit;
961
- }
962
-
963
- .sb-tab-box.sb-caching-box .sbi-caching-btn .loading path,
964
- .sb-tab-box.sb-optimize-box .optimize-image-btn .loading path,
965
- .sb-tab-box.sb-dpa-clear-box-style .loading path{
966
- fill: rgba(23, 22, 22, .95)
967
- }
968
- .sb-tab-box.sb-caching-box .sbi-caching-btn .success svg,
969
- .sb-tab-box.sb-optimize-box .optimize-image-btn .success svg,
970
- .sb-tab-box.sb-dpa-clear-box-style .success svg{
971
- stroke: rgba(23, 22, 22, .95)
972
- }
973
-
974
- /* Translation Tab */
975
- .sb-tab-inner-card {
976
- margin-top: 30px;
977
- }
978
-
979
- .sbi-table {
980
- width: 100%;
981
- border: 1px solid #DCDDE1;
982
- padding: 0;
983
- border-spacing: 0;
984
- }
985
- .sbi-table thead th,
986
- .sbi-table tfoot th {
987
- background-color: #F3F4F5;
988
- font-size: 14px;
989
- line-height: 22px;
990
- color: #434960;
991
- padding: 10px 20px;
992
- font-weight: 400;
993
- text-align: left;
994
- box-sizing: border-box;
995
- border-bottom: 1px solid #DCDDE1;
996
- }
997
- .sbi-table tfoot th {
998
- border: 0;
999
- border-top: 1px solid #DCDDE1;
1000
- }
1001
-
1002
- .sbi-table tbody td {
1003
- padding: 6px 10px 6px 20px;
1004
- box-sizing: border-box;
1005
-
1006
- }
1007
- .sbi-table-row-header td {
1008
- font-weight: 600;
1009
- font-size: 16px !important;
1010
- line-height: 26px;
1011
- color: #141B38;
1012
- box-sizing: border-box;
1013
- padding: 10px 20px !important;
1014
- }
1015
- .sbi-table tbody td {
1016
- background: #F3F4F5;
1017
- font-size: 14px;
1018
- }
1019
- .sbi-table tbody:nth-child(2n) td {
1020
- background-color:#fff;
1021
- }
1022
- .sbi-table tbody tr:not(.sbi-table-row-header):not(:last-child) td {
1023
- border-bottom:1px solid #DCDDE1
1024
- }
1025
- .sbi-table tbody tr:last-child td {
1026
- padding: 6px 10px 6px 20px;
1027
- }
1028
-
1029
- .sbi-table tbody tr td:first-child,
1030
- .sbi-table tbody tr td:nth-child(2) {
1031
- width: 25%;
1032
- }
1033
- .sbi-table tbody .sbi-input{
1034
- background: #FFFFFF;
1035
- border: 1px solid #D0D1D7;
1036
- box-sizing: border-box;
1037
- border-radius: 1px;
1038
- width: 100%;
1039
- height: 38px;
1040
- color: #2c3338;
1041
- }
1042
- .sbi-table tbody .sbi-input::placeholder {
1043
- color: #8C8F9A;
1044
- }
1045
- .sbi-table tbody .sbi-input:focus {
1046
- border: 1px solid #97989c;
1047
- outline: none;
1048
- box-shadow: none;
1049
- }
1050
- @media (max-width: 767px) {
1051
- .sb-tabs-container .sb-tabs .tab {
1052
- padding: 25px 10px;
1053
- }
1054
- .sbi-table th,
1055
- .sbi-table td {
1056
- display: block;
1057
- width: 100%;
1058
- }
1059
- .sbi-table tbody tr td:first-child,
1060
- .sbi-table tbody tr td:nth-child(2) {
1061
- width: 100%;
1062
- }
1063
- .sbi-table tbody .sbi-input {
1064
- height: 30px;
1065
- min-height: 30px;
1066
- font-size: 14px;
1067
- }
1068
- }
1069
-
1070
- .sb-feed-issue-box #sbi-send-report {
1071
- width: 127px;
1072
- min-width: 127px;
1073
- height: 46px;
1074
- padding: 6px 15px;
1075
- }
1076
- .sb-feed-issue-box #report-emails {
1077
- width: 407px;
1078
- height: 45px;
1079
- padding: 8px 15px;
1080
- font-size: 16px;
1081
- line-height: 26px;
1082
- }
1083
- .sb-feed-issue-box #report-emails::placeholder {
1084
- color: #8C8F9A;
1085
- }
1086
- .sb-feed-issue-box .feed-issues-fields {
1087
- margin-bottom: 15px;
1088
- display: flex;
1089
- }
1090
- .sb-feed-issue-box .feed-issues-fields * {
1091
- margin: 0 10px 0 0;
1092
- font-size: 16px;
1093
- }
1094
-
1095
- .sb-tab-box.sb-optimize-box .sb-form-field,
1096
- .sb-tab-box.sb-usage-box .sb-form-field,
1097
- .sb-tab-box.sb-ajax-box .sb-form-field,
1098
- .sb-tab-box.sb-show-credit-box .sb-form-field,
1099
- .sb-tab-box.sb-admin-error-box .sb-form-field,
1100
- .sb-tab-box.sb-fix-text-box .sb-form-field{
1101
- max-width: 695px;
1102
- }
1103
- .sb-tab-box.sb-feed-issue-box .sb-form-field .help-text {
1104
- max-width: 670px;
1105
- }
1106
-
1107
- /*To Be Checked*/
1108
- .sb-sources-list{
1109
- width: 100%;
1110
- position: relative;
1111
- display: grid;
1112
- grid-template-columns: 48% 48%;
1113
- grid-column-gap: 2%;
1114
- }
1115
- .sbi-fb-srcs-item-ins {
1116
- display: flex;
1117
- height: 62px;
1118
- padding: 0 10px;
1119
- position: relative;
1120
- }
1121
- .sb-srcs-item {
1122
- box-sizing: border-box;
1123
- position: relative;
1124
- cursor: auto;
1125
- display: block;
1126
- height: 64px;
1127
- border: 1px solid #E7E7E9;
1128
- min-height: 60px;
1129
- overflow: auto;
1130
- margin-top: 15px;
1131
- }
1132
- .sb-srcs-item.expanded {
1133
- height: auto;
1134
- }
1135
- .sb-source-error-wrap {
1136
- display: flex;
1137
- justify-content: center;
1138
- align-items: center;
1139
- margin-left: 9px;
1140
- }
1141
-
1142
- .sb-source-error-wrap span {
1143
- font-weight: 600;
1144
- font-size: 12px;
1145
- line-height: 160%;
1146
-
1147
- color: #D72C2C;
1148
- margin-left: 5px;
1149
- }
1150
- .sb-source-error-wrap a {
1151
- margin-left: 8px;
1152
- font-weight: 600;
1153
- font-size: 12px;
1154
- line-height: 160%;
1155
- text-decoration-line: underline;
1156
-
1157
- color: #0068A0;
1158
- }
1159
- .sb-srcs-new {
1160
- display: flex;
1161
- justify-content: center;
1162
- align-items: center;
1163
- font-size: 14px;
1164
- color: #0068A0;
1165
- background: #F9F9FA;
1166
- font-weight: 400;
1167
- transition: all 0.15s ease-in-out;
1168
- border: 1px solid #E8E8EB;
1169
- }
1170
- .sb-srcs-new:hover {
1171
- cursor: pointer;
1172
- background: #E2F5FF;
1173
- }
1174
- .sb-srcs-new span.add-new-icon {
1175
- margin-right: 11px;
1176
- margin-top: 3px;
1177
- }
1178
- .sb-srcs-item-avatar{
1179
- display: flex;
1180
- width: 42px;
1181
- height: inherit;
1182
- justify-content: center;
1183
- align-items: center;
1184
- margin-right: 10px;
1185
- }
1186
- .sb-srcs-item-avatar img{
1187
- width: 42px;
1188
- height: 42px;
1189
- border-radius: 50%;
1190
- background: #eee;
1191
- }
1192
- .sb-srcs-item-inf{
1193
- width: 100%;
1194
- height: inherit;
1195
- display: flex;
1196
- justify-content: center;
1197
- flex-direction: column;
1198
- }
1199
- .sb-srcs-item-name{
1200
- font-weight: 600;
1201
- color: #141B38;
1202
- font-size: 16px;
1203
- margin-bottom: 1px;
1204
- padding-right: 60px;
1205
- max-height: 32px;
1206
- line-height: 1.1;
1207
- padding-bottom: 2px;
1208
- overflow: hidden;
1209
- }
1210
- .sb-account-has-error {
1211
- border: 1px solid #f3c9c9;
1212
- background: #fff8f8;
1213
- }
1214
-
1215
- .sb-srcs-item-used{
1216
- color: #434960;
1217
- display: flex;
1218
- align-items: center;
1219
- font-weight: 400;
1220
- font-size: 12px;
1221
- }
1222
-
1223
- .sbi-fb-srcs-info-item:first-of-type {
1224
- align-items: center;
1225
- }
1226
- .sbi-fb-srcs-info-item {
1227
- display: flex;
1228
- border-top: 1px solid #E7E7E9;
1229
- box-sizing: border-box;
1230
- width: 100%;
1231
- float: left;
1232
- padding: 8px 10px;
1233
- }
1234
- .sbi-fb-srcs-info-item strong {
1235
- font-size: 14px;
1236
- width: 50px;
1237
- }
1238
- .sbi-fb-srcs-info-item span {
1239
- font-size: 13px;
1240
- line-height: 1.5em;
1241
- color: #434960;
1242
- font-weight: 400;
1243
- display: inline-block;
1244
- word-break: break-all;
1245
- width: calc(100% - 80px);
1246
- padding: 0 15px;
1247
- box-sizing: border-box;
1248
- }
1249
- .sbi-fb-srcs-info-icon {
1250
- width: 26px;
1251
- height: 26px;
1252
- display: flex;
1253
- justify-content: center;
1254
- align-items: center;
1255
- cursor: pointer;
1256
- margin-left: auto;
1257
- border: 1px solid #D0D1D7;
1258
- border-radius: 2px;
1259
- transition: all 0.15s ease-in-out;
1260
- }
1261
- .sbi-fb-srcs-info-icon:hover {
1262
- background: #F3F4F5;
1263
- }
1264
- .sbi-fb-srcs-info-icon:focus,
1265
- .sbi-fb-srcs-info-icon:active {
1266
- background: #E8E8EB;
1267
- }
1268
- .sbi-fb-srcs-info-icon svg {
1269
- width: 15px;
1270
- float: left;
1271
- }
1272
- .sb-control-src-expand-chevron {
1273
- width: 7px;
1274
- height: 7px;
1275
- border-left: 2px solid currentColor;
1276
- border-top: 2px solid currentColor;
1277
- -webkit-transform: rotate(45deg);
1278
- transform: rotate(45deg);
1279
- }
1280
- .sb-srcs-item-actions{
1281
- position: absolute;
1282
- width: 70px;
1283
- height: 31px;
1284
- right: 7px;
1285
- top: 7px;
1286
- }
1287
- .sb-srcs-item-actions-btn{
1288
- width: 30px;
1289
- height: 31px;
1290
- cursor: pointer;
1291
- float: left;
1292
- display: flex;
1293
- justify-content: center;
1294
- align-items: center;
1295
- margin-left: 3px;
1296
- }
1297
- .sb-srcs-item-actions-btn svg{
1298
- float: left;
1299
- width: 17px;
1300
- fill: currentColor;
1301
- }
1302
- .sb-srcs-item-actions-btn.sb-srcs-item-angle-up svg {
1303
- height: 10px;
1304
- }
1305
- .sb-srcs-item-cog,
1306
- .sb-srcs-item-angle-up{
1307
- color: #434960;
1308
- transition: all 0.15s ease-in-out;
1309
- border-radius: 4px;
1310
- }
1311
- .sb-srcs-item-cog:hover,
1312
- .sb-srcs-item-angle-up:hover {
1313
- background: #F3F4F5;
1314
- }
1315
- .sb-srcs-item-cog:focus,
1316
- .sb-srcs-item-cog:active,
1317
- .sb-srcs-item-angle-up:focus,
1318
- .sb-srcs-item-angle-up:active {
1319
- background: #E8E8EB;
1320
- }
1321
- .sb-srcs-item-delete{
1322
- color: #D72C2C;
1323
- transition: all 0.15s ease-in-out;
1324
- border-radius: 4px;
1325
- }
1326
- .sb-srcs-item-delete:hover {
1327
- background-color: #FCEDED;
1328
- }
1329
- .sb-srcs-item-delete:focus,
1330
- .sb-srcs-item-delete:active {
1331
- background: #eed4d4;
1332
- }
1333
- .sb-srcs-item-delete svg{
1334
- width: 13px;
1335
- }
1336
- #sbi-settings .sbi-fb-source-step1 .sbi-fb-source-top h3 {
1337
- margin-bottom: 40px;
1338
- }
1339
-
1340
- /*
1341
- Sources Instance Popup
1342
- */
1343
- .sbi-fb-popup-feedinst .sbi-fb-source-top{
1344
- display: flex;
1345
- align-items: center;
1346
- }
1347
- .sbi-fb-popup-feedinst h5{
1348
- margin-bottom: 0px;
1349
- float: left;
1350
- font-size: 27px;
1351
- }
1352
- .sbi-fb-fdinst-type{
1353
- padding: 5px 5px;
1354
- background: #E8E8EB;
1355
- margin-left: 12px;
1356
- float: left;
1357
- }
1358
- .sbi-fb-inst-tbl-ctn{
1359
- padding: 0 23px 63px;
1360
- }
1361
- .sbi-fb-inst-tbl-ctn table{
1362
- width: 100%;
1363
- border-spacing: unset;
1364
- box-sizing: border-box;
1365
- border: 1px solid #DCDDE1;
1366
- text-align: left;
1367
- }
1368
- .sbi-fb-inst-tbl-ctn tfoot,.sbi-fb-inst-tbl-ctn thead{
1369
- background: #F3F4F5
1370
- }
1371
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf th, .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf td{
1372
- font-size: 13px;
1373
- color: #364152;
1374
- padding: 13px 10px;
1375
- }
1376
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-tbody tr:nth-child(odd){
1377
- background: #fff;
1378
- }
1379
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-tbody tr:nth-child(even){
1380
- background: #F3F4F5;
1381
- }
1382
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf tr th,
1383
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf tr td{
1384
- padding: 4px 20px;
1385
- }
1386
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-tbody tr td{
1387
- padding: 11px 20px;
1388
- }
1389
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-name{
1390
- font-size: 14px;
1391
- }
1392
- .sbi-fb-inst-tbl-shrtc{
1393
- display: flex;
1394
- align-items: center;
1395
- }
1396
-
1397
- .sbi-fd-inst-btn{
1398
- width: 10px;
1399
- height: 10px;
1400
- box-sizing: border-box;
1401
- border-right: 3px solid #8C8F9A;
1402
- border-top: 3px solid #8C8F9A;
1403
- cursor: pointer;
1404
- -webkit-transform: rotate(45deg);
1405
- transform: rotate(45deg);
1406
- }
1407
-
1408
- .sbi-fd-lst-actions .sbi-fd-lst-btn, .sbi-fb-inst-tbl-ctn .sbi-fd-lst-btn {
1409
- box-sizing: border-box;
1410
- width: 36px;
1411
- height: 32px;
1412
- }
1413
- .sbi-fd-lst-shortcode-cp {
1414
- margin-left: 10px;
1415
- }
1416
- .sbi-fb-tltp-parent {
1417
- position: relative;
1418
- }
1419
- .sbi-fd-lst-btn {
1420
- width: 21px;
1421
- height: 21px;
1422
- display: inline-flex;
1423
- justify-content: center;
1424
- align-items: center;
1425
- margin: 0 4px;
1426
- cursor: pointer;
1427
- color: #141B38;
1428
- border-radius: 2px;
1429
- border: 1px solid #D8DADD;
1430
- -webkit-transition: all .2s ease-in-out;
1431
- transition: all .2s ease-in-out;
1432
- background: #fff;
1433
- }
1434
- .sbi-fb-tltp-elem {
1435
- position: absolute;
1436
- color: #fff;
1437
- background: #434960;
1438
- font-size: 14px;
1439
- padding: 7px 10px;
1440
- border-radius: 3px;
1441
- font-weight: 500;
1442
- z-index: 9;
1443
- text-align: center;
1444
- opacity: 0;
1445
- visibility: hidden;
1446
- top: calc(-100% - 30px);
1447
- left: 50%;
1448
- -webkit-transform: translateX(-50%);
1449
- transform: translateX(-50%);
1450
- -webkit-transition: all .2s ease-in-out;
1451
- transition: all .2s ease-in-out;
1452
- }
1453
- .sbi-fb-tltp-elem span {
1454
- position: relative;
1455
- z-index: 3;
1456
- }
1457
- .sbi-fd-lst-btn svg {
1458
- fill: currentColor;
1459
- width: 14px;
1460
- float: left;
1461
- }
1462
- .sbi-fd-lst-btn svg {
1463
- height: 13px;
1464
- }
1465
- .sbi-fd-lst-thtf th{
1466
- border-bottom: 1px solid #DCDDE1;
1467
- }
1468
- .sbi-fd-lst-thtf td{
1469
- border-top: 1px solid #DCDDE1;
1470
- }
1471
- .sbi-fb-fdinst-type {
1472
- padding: 5px 5px;
1473
- background: #E8E8EB;
1474
- margin-left: 12px;
1475
- float: left;
1476
- }
1477
- .sbi-fd-lst-name {
1478
- font-size: 17px;
1479
- font-weight: 500;
1480
- color: #0068A0!important;
1481
- }
1482
- .sbi-fb-inst-tbl-ctn a, .sbi-fb-inst-tbl-ctn a:focus {
1483
- text-decoration: none;
1484
- outline: none;
1485
- }
1486
- .sbi-fd-lst-actions .sbi-fd-lst-btn, .sbi-fb-inst-tbl-ctn .sbi-fd-lst-btn {
1487
- box-sizing: border-box;
1488
- width: 36px;
1489
- height: 32px;
1490
- background: transparent;
1491
- }
1492
- .sbi-fd-lst-btn svg {
1493
- fill: currentColor;
1494
- width: 14px;
1495
- float: left;
1496
- }
1497
- .sbi-fb-tltp-parent:hover .sbi-fb-tltp-elem {
1498
- top: calc(-100% - 20px);
1499
- opacity: 1;
1500
- visibility: visible;
1501
- }
1502
- .sbi-fb-tltp-elem:after {
1503
- content: '';
1504
- position: absolute;
1505
- height: 10px;
1506
- width: 10px;
1507
- bottom: -5px;
1508
- left: calc(50% - 5px);
1509
- background: #434960;
1510
- transform: rotate(
1511
- -45deg
1512
- );
1513
- }
1514
-
1515
- /*** 6.0 Sticky Widget ***/
1516
- .sbi-stck-wdg{
1517
- position: fixed;
1518
- right: 21px;
1519
- z-index: 9;
1520
- bottom: 20px;
1521
- }
1522
- .sbi-stck-wdg-btn{
1523
- width: 52px;
1524
- height: 52px;
1525
- background: #fff;
1526
- border-radius: 50%;
1527
- cursor: pointer;
1528
- display: flex;
1529
- justify-content: center;
1530
- align-items: center;
1531
- filter: drop-shadow(0px 9px 13px rgba(0, 0, 0, 0.2));
1532
- }
1533
- .sbi-stck-wdg-btn svg{
1534
- width: 25px;
1535
- fill: #E34F0E;
1536
- height: 33px;
1537
- float: left;
1538
- }
1539
-
1540
- .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls,
1541
- .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls svg{
1542
- display: block;
1543
- }
1544
- .sbi-stck-wdg-btn-cls{
1545
- width: inherit;
1546
- height: inherit;
1547
- position: relative;
1548
- color: #364152;
1549
- box-shadow: 0px 1px 6px rgb(0 0 0 / 5%), 0px 9px 12px rgb(0 0 0 / 5%);
1550
- border-radius: 70px;
1551
- }
1552
- .sbi-stck-wdg-btn-cls svg {
1553
- width: 14px;
1554
- height: 14px;
1555
- position: absolute;
1556
- top: 50%;
1557
- right: 0;
1558
- bottom: 0;
1559
- left: 50%;
1560
- margin-top: -7px;
1561
- margin-left: -7px;
1562
- }
1563
-
1564
- .sbi-stck-pop{
1565
- position: absolute;
1566
- width: 292px;
1567
- height: auto;
1568
- background: #fff;
1569
- border: 1px solid #E2E8F0;
1570
- box-sizing: border-box;
1571
- box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15), 0px 3px 14px rgba(0, 0, 0, 0.12);
1572
- border-radius: 2px;
1573
- padding: 20px;
1574
- right: 0px;
1575
- bottom: 66px;
1576
- color: #141B38;
1577
- padding-bottom: 82px;
1578
- }
1579
- .sbi-stck-wdg[data-active="true"] .sbi-stck-pop{
1580
- bottom: 66px;
1581
- opacity: 1;
1582
- visibility: visible;
1583
- }
1584
-
1585
- .sbi-stck-pop svg{
1586
- fill: currentColor;
1587
- }
1588
- .sbi-stck-el-list{
1589
- border: 1px solid #DCDDE1;
1590
- border-radius: 2px;
1591
- }
1592
- .sbi-stck-el{
1593
- display: flex;
1594
- align-items: center;
1595
- padding: 11px 13px;
1596
- border-bottom: 1px solid #DCDDE1;
1597
- transition: background .15s ease-in-out;
1598
- }
1599
- .sbi-stck-el:hover{
1600
- background: #F3F4F5;
1601
- }
1602
- .sbi-stck-el:last-of-type{
1603
- border-bottom: 0px;
1604
- }
1605
- .sbi-stck-el-list .sbi-chevron svg{
1606
- width: 5px;
1607
- height: 8px;
1608
- }
1609
- .sbi-fs-a {
1610
- width: 100%;
1611
- height: 100%;
1612
- display: block;
1613
- position: absolute;
1614
- left: 0;
1615
- top: 0;
1616
- z-index: 1;
1617
- }
1618
- .sbi-stck-el .sbi-stck-el-txt{
1619
- color: #27303F;
1620
- }
1621
- .sbi-stck-el.sbi-stck-el-upgrd{
1622
- padding: 8px 14px;
1623
- font-size: 14px;
1624
- background: var(--cl-orange);
1625
- color: #fff;
1626
- position: relative;
1627
- transition: background .15s ease-in-out;
1628
- }
1629
- .sbi-chevron {
1630
- position: absolute;
1631
- right: 14px
1632
- }
1633
- .sbi-stck-el.sbi-stck-el-upgrd .sbi-stck-el-txt{
1634
- color: #fff;
1635
- }
1636
- .sbi-stck-el.sbi-stck-el-upgrd:after{
1637
- top: 20px;
1638
- opacity: 1;
1639
- }
1640
- .sbi-stck-el-icon{
1641
- margin-right: 10px;
1642
- }
1643
- .sbi-stck-el-icon svg{
1644
- width: 17px;
1645
- float: left;
1646
- }
1647
- .sbi-stck-title{
1648
- margin-top: 20px;
1649
- margin-bottom: 10px;
1650
- color: #141B38;
1651
- font-weight: 600;
1652
- font-size: 14px;
1653
- line-height: 160%;
1654
- }
1655
- .sbi-stck-follow{
1656
- background: #F3F4F5;
1657
- margin-top: 20px;
1658
- left: 0px;
1659
- bottom: 0px;
1660
- position: absolute;
1661
- padding: 12px 20px;
1662
- display: flex;
1663
- align-items: center;
1664
- }
1665
- .sbi-stck-follow span{
1666
- font-weight: 600;
1667
- font-size: 14px;
1668
- }
1669
- .sbi-stck-flw-links{
1670
- display: flex;
1671
- justify-content: center;
1672
- align-items: center;
1673
- margin-left: auto;
1674
- }
1675
- .sbi-stck-flw-links a{
1676
- width: 36px;
1677
- height: 28px;
1678
- color: inherit;
1679
- display: inline-flex;
1680
- justify-content: center;
1681
- align-items: center;
1682
- margin-left: 4px;
1683
- border-radius: 2px;
1684
- transition: background .15s ease-in-out;
1685
- }
1686
- .sbi-stck-flw-links svg{
1687
- width: 17px;
1688
- color: #141B38;
1689
- }
1690
- .sbi-stck-flw-links a:hover{
1691
- background: #fff;
1692
- }
1693
- .sbi-stck-flw-links a:hover svg{
1694
- color: inherit;
1695
- }
1696
- .sb-tab-content .sb-tab-box.sb-reset-box-style .sbi-tab-form-field .sbi-btn,
1697
- .sb-tab-content .sb-tab-box.sb-dpa-clear-box-style .sbi-tab-form-field .sbi-btn {
1698
- transform: none;
1699
- margin-bottom: 15px;
1700
- }
1701
-
1702
- /*** 7.0 Responsive ***/
1703
- @media (max-width: 1429px) {
1704
- .caching-form-fields-group {
1705
- display: inline-block;
1706
- }
1707
- .caching-form-fields-group select {
1708
- margin-bottom: 5px;
1709
- }
1710
- }
1711
- @media (min-width: 1429px) {
1712
- .caching-form-fields-group {
1713
- display: flex;
1714
- }
1715
- }
1716
- @media (max-width: 1023px) {
1717
- .sb-tab-content .sb-tab-box .tab-label {
1718
- width: 100%;
1719
- max-width: 100%;
1720
- padding-right: 0;
1721
- float: initial;
1722
- margin-bottom: 20px;
1723
- }
1724
- .sb-tab-content .sb-tab-box .sbi-tab-form-field{
1725
- width: 100%;
1726
- float: intial;
1727
- }
1728
- }
1729
- @media (max-width: 1320px) {
1730
- .sb-feed-issue-box .feed-issues-fields {
1731
- display: inline-block;
1732
- }
1733
-
1734
- .sb-feed-issue-box .feed-issues-fields * {
1735
- margin-bottom: 5px;
1736
- }
1737
- }
1738
- @media (max-width: 767px) {
1739
- .auto-fold #wpcontent {
1740
- padding-left: 0;
1741
- }
1742
- .sbi-fb-full-wrapper {
1743
- padding: 70px 20px 0 20px;
1744
- }
1745
- .sbi-fb-hd-btn {
1746
- padding: 0px 15px 0px 7px;
1747
- }
1748
- .sbi-fb-header {
1749
- padding: 0px 20px;
1750
- }
1751
- .sb-notification-ctn {
1752
- left: 20px;
1753
- }
1754
- .sb-tab-box.sb-export-box .sb-form-field .d-flex{
1755
- flex-wrap: wrap;
1756
- }
1757
- .sb-form-field .sbi-select {
1758
- width: 100%;
1759
- }
1760
- .sb-tab-content .sb-tab-box .sbi-tab-form-field {
1761
- flex-wrap: wrap;
1762
- }
1763
- .sb-license-box .sbi-tab-form-field .sbi-btn {
1764
- transform: translate(0px, 0px) !important;
1765
- margin-top: 10px;
1766
- }
1767
- .sb-tab-content .sb-tab-box .sbi-tab-form-field .field-left-content {
1768
- flex-basis: 100%;
1769
- }
1770
- .sb-export-box .sbi-tab-form-field .sbi-btn {
1771
- transform: translate(0px, 0px) !important;
1772
- margin-top: 10px;
1773
- }
1774
- .sb-feed-issue-box .feed-issues-fields {
1775
- width: 100%;
1776
- }
1777
- .sb-feed-issue-box #report-emails {
1778
- max-width: 100%;
1779
- }
1780
- .sbi-table thead th, .sbi-table tfoot th {
1781
- display: none;
1782
- }
1783
- .sbi-table tbody tr:not(.sbi-table-row-header) td:last-child {
1784
- margin-bottom: 20px;
1785
- }
1786
- .sbi-table tbody {
1787
- background-color: #f3f4f5;
1788
- }
1789
- .sbi-table tbody:nth-child(2n) {
1790
- background-color: #fff;
1791
- }
1792
- .sb-tab-content .sb-tab-box .sbi-tab-form-field .d-flex{
1793
- flex-wrap: wrap;
1794
- }
1795
- .sb-sources-list {
1796
- grid-template-columns: 100%;
1797
- }
1798
- .sb-tabs-container .sb-tabs {
1799
- flex-direction: column-reverse;
1800
- flex-wrap: wrap;
1801
- align-items: flex-end;
1802
- }
1803
- .sbi-fb-full-wrapper {
1804
- padding: 82px 20px 0 20px;
1805
- }
1806
- .sb-tabs-container .sb-tabs .left-buttons {
1807
- width: 100%;
1808
- display: flex;
1809
- }
1810
- .sb-tabs-container .sb-tabs .right-buttons {
1811
- transform: translateY(-15px);
1812
- }
1813
- .sb-tabs-container .sb-tabs .left-buttons .tab {
1814
- flex-grow: 1;
1815
- flex-basis: 0;
1816
- padding: 15px 10px;
1817
- text-align: center;
1818
- }
1819
- .sb-tabs-container {
1820
- margin-top: -45px;
1821
- }
1822
- #wpbody-content {
1823
- padding-bottom: 50px;
1824
- }
1825
- .sb-form-field .sbi-select.size-md {
1826
- width: 100%;
1827
- max-width: 100%;
1828
- }
1829
- }
1830
- @media (max-width: 567px) {
1831
- .sb-tabs-container .sb-tabs .tab:not(:last-child) {
1832
- margin-right: 10px;
1833
- }
1834
- }
1835
- @media (max-width: 420px) {
1836
- .sb-tabs-container .sb-tabs .left-buttons .tab {
1837
- padding: 15px 7px;
1838
- font-size: 14px;
1839
- }
1840
- }
1841
- .sb-button-standard{
1842
- position: relative;
1843
- font-style: normal;
1844
- font-weight: 600;
1845
- font-size: 14px;
1846
- padding: 10px 20px 10px 39px;
1847
- line-height: 16px;
1848
- height: auto;
1849
- }
1850
- .sb-button-standard svg {
1851
- width: 16px;
1852
- height: 16px;
1853
- position: absolute;
1854
- left: 13px;
1855
- right: auto;
1856
- top: 10px;
1857
- bottom: auto;
1858
- }
1859
- .sbi-stck-el.sbi-stck-el-upgrd svg path{
1860
- fill: #fff!important;
1861
- }
1
+ /*
2
+ * Settings CSS TABLE OF CONTENTS
3
+ *
4
+ * 1.0 - Global
5
+ * 2.0 - SBI CSS Framework
6
+ * 2.1 - Utility CSS
7
+ * 2.2 - Notification Element
8
+ * 3.0 - Header
9
+ * 4.0 - Content
10
+ * 4.1 - Tab Styles
11
+ * 4.2 - Tab Boxes
12
+ * 5.0 - Footer
13
+ * 6.0 - Sticky Widget
14
+ * 7.0 - Responsiveness
15
+ */
16
+
17
+ /*** 1.0 - Global ***/
18
+ .clearfix { display: inline-block; }
19
+ /* start commented backslash hack \*/
20
+ * html .clearfix { height: 1%; }
21
+ .clearfix { display: block; }
22
+ #sbi-settings {
23
+ -webkit-font-smoothing: antialiased;
24
+ font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
25
+ }
26
+ #wpcontent {
27
+ padding-left: 0px;
28
+ }
29
+
30
+ .clearfix:after {
31
+ visibility: hidden;
32
+ display: block;
33
+ font-size: 0;
34
+ content: " ";
35
+ clear: both;
36
+ height: 0;
37
+ }
38
+ .checkmark {
39
+ width: 21px;
40
+ height: 22px;
41
+ border-radius: 50%;
42
+ display: block;
43
+ stroke-width: 2;
44
+ stroke: #59AB46;
45
+ stroke-miterlimit: 10;
46
+ stroke-dashoffset: 0;
47
+ }
48
+ .sbi-fb-full-wrapper{
49
+ padding: 0 53px;
50
+ padding-top: 82px;
51
+ }
52
+ .sbi-fb-fs {
53
+ width: 100%;
54
+ position: relative;
55
+ float: left;
56
+ box-sizing: border-box;
57
+ }
58
+ #adminmenu a[href="admin.php?page=sbi-support"] {
59
+ display: none;
60
+ }
61
+ /*** 2.0 - SBI CSS Framework ***/
62
+ .d-flex {
63
+ display: flex;
64
+ }
65
+ .justify-between {
66
+ justify-content: space-between;
67
+ }
68
+ .items-center{
69
+ align-items: center;
70
+ }
71
+ /* SBI Form Fields */
72
+ .sb-form-field {
73
+ display: block;
74
+ position: relative;
75
+ }
76
+ .sb-form-field .help-text {
77
+ font-size: 13px;
78
+ line-height: 22px;
79
+ color: #434960;
80
+ font-weight: 400;
81
+ word-spacing: 0.3px;
82
+ max-width: 640px;
83
+ }
84
+ .sb-form-field .help-text-green {
85
+ color: #59AB46;
86
+ }
87
+ .sb-form-field .help-text a {
88
+ color: inherit;
89
+ font-weight: 500;
90
+ }
91
+ /* input field styles */
92
+ .sb-form-field .sbi-form-field {
93
+ background: #FFFFFF;
94
+ border: 1px solid #D0D1D7;
95
+ box-sizing: border-box;
96
+ border-radius: 1px;
97
+ height: 38px;
98
+ padding: 8px;
99
+ }
100
+ .sb-form-field .sbi-form-field:focus {
101
+ outline: none;
102
+ box-shadow: none;
103
+ }
104
+ .sb-form-field .field-icon {
105
+ position: absolute;
106
+ right: 8px;
107
+ top: 10px;
108
+ font-size: 20px;
109
+ }
110
+ /* sbi-checkbox styles */
111
+ .sbi-checkbox {
112
+ align-items: center;
113
+ border-radius: 100px;
114
+ display: flex;
115
+ font-weight: 700;
116
+ margin-bottom: 15px;
117
+ }
118
+ .sbi-checkbox input[type=checkbox] {
119
+ clip: rect(0 0 0 0);
120
+ clip-path: inset(50%);
121
+ height: 1px;
122
+ overflow: hidden;
123
+ position: absolute;
124
+ white-space: nowrap;
125
+ width: 1px;
126
+ }
127
+ .toggle-track {
128
+ width: 36px;
129
+ height: 20px;
130
+ position: relative;
131
+ background: #9e9e9e;
132
+ border-radius: 31px;
133
+ }
134
+ .toggle-indicator {
135
+ width: 16px;
136
+ height: 16px;
137
+ background-color: #fff;
138
+ border-radius: 100px;
139
+ top: 2px;
140
+ position: absolute;
141
+ left: 2px;
142
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
143
+ transition: all .3s cubic-bezier(0.23, 1, 0.320, 1);
144
+ }
145
+ .sbi-checkbox input[type=checkbox]:checked + .toggle-track .toggle-indicator {
146
+ left: 18px;
147
+ }
148
+ .sbi-checkbox input[type=checkbox]:checked + .toggle-track {
149
+ background: #0096CC;
150
+ }
151
+
152
+ .sbi-error-text {
153
+ color: #D72C2C;
154
+ }
155
+ .sbi-error-text a {
156
+ color: inherit;
157
+ }
158
+ .sbi-fb-cp-clpboard{
159
+ width: 0px;
160
+ height: 0px;
161
+ position: absolute;
162
+ left: -100000px;
163
+ }
164
+ /* sbi-select */
165
+ .sb-form-field .sbi-select {
166
+ min-width: 235px;
167
+ border: 1px solid #D0D1D7;
168
+ padding: 8px 35px 8px 15px;
169
+ height: 50px;
170
+ font-size: 16px;
171
+ color: #141B38;
172
+ -webkit-appearance: none;
173
+ appearance: none;
174
+ background: #fff url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAFCAYAAAB8ZH1oAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABSSURBVHgBfc4hCkAhDAbgjV3slQcvvHuYDWY1G8zewyIWb6YuCCLqD4Pt5wtD54NBQA2XVKiWcorl/X7s+DkhJYUhPk54IN5plCue0Tb8M8/aNx/uIpRVqbbFAAAAAElFTkSuQmCC') no-repeat right 15px top 55%;
175
+ box-sizing: border-box;
176
+ }
177
+ .sb-form-field .sbi-select.size-md {
178
+ width: 422px;
179
+ }
180
+ .sb-form-field .sbi-select.size-sm {
181
+ width: 210px;
182
+ min-width: 210px;
183
+ }
184
+ .sb-form-field .sbi-select.size-xs {
185
+ min-width: 100px;
186
+ width: 100px;
187
+ }
188
+ .sb-form-field .sbi-textarea {
189
+ width: 100%;
190
+ min-height: 100px;
191
+ padding: 12px;
192
+ border: 1px solid #D0D1D7;
193
+ font-size: 16px;
194
+ }
195
+ .sb-form-field .sbi-textarea::placeholder {
196
+ color: #8C8F9A;
197
+ }
198
+ .sb-form-field .sbi-textarea:focus {
199
+ outline: none;
200
+ box-shadow: none;
201
+ border-color: #9c9ca0;
202
+ }
203
+ /* SBI Buttons */
204
+ .sbi-btn {
205
+ display: flex;
206
+ align-items: center;
207
+ vertical-align: middle;
208
+ background: #F3F4F5;
209
+ border: 1px solid #DCDDE1;
210
+ box-sizing: border-box;
211
+ border-radius: 2px;
212
+ padding: 7px 20px;
213
+ font-weight: 600;
214
+ font-size: 14px;
215
+ line-height: 22px;
216
+ color: #141B38;
217
+ box-sizing: border-box;
218
+ letter-spacing: 0.2px;
219
+ cursor: pointer;
220
+ transition: all 0.15s ease-in-out;
221
+ }
222
+ .sbi-btn:hover {
223
+ background: #FFFFFF;
224
+ border: 1px solid #D0D1D7;
225
+ }
226
+ .sbi-btn:focus,
227
+ .sbi-btn:active {
228
+ background: #E8E8EB;
229
+ border: 1px solid #D0D1D7;
230
+ }
231
+ .sbi-btn .sb-btn-icon {
232
+ margin-right: 10px;
233
+ max-width: 15px;
234
+ }
235
+ .sbi-btn.sb-btn-lg {
236
+ height: 50px;
237
+ font-size: 16px;
238
+ padding: 7px 25px;
239
+ }
240
+ .sbi-btn.sb-btn-blue {
241
+ background-color: #0068A0;
242
+ color: #fff;
243
+ border-color: #096292;
244
+ }
245
+ .sbi-btn span {
246
+ line-height: 1;
247
+ margin-right: 5px;
248
+ }
249
+ .sb-btn-orange {
250
+ background: #E34F0E;
251
+ color: #fff;
252
+ font-style: normal;
253
+ font-weight: 600;
254
+ font-size: 14px;
255
+ line-height: 160%;
256
+ }
257
+ .sb-tabs-container .sb-tabs .sb-btn-orange {
258
+ margin-top: -20px;
259
+ }
260
+ .sbi-btn svg.checkmark {
261
+ stroke: #fff;
262
+ transform: translate(-7px, -3px);
263
+ }
264
+ .input-hidden {
265
+ height: 0px;
266
+ width: 0px;
267
+ overflow: hidden;
268
+ }
269
+
270
+ /*** 2.1 - SBI Utility CSS ***/
271
+ .mr-3 {
272
+ margin-right: 3px;
273
+ }
274
+ .mr-4 {
275
+ margin-right: 4px;
276
+ }
277
+ .mb-6 {
278
+ margin-bottom: 6px;
279
+ }
280
+ .mb-10 {
281
+ margin-bottom: 10px;
282
+ }
283
+ .mb-15 {
284
+ margin-bottom: 15px;
285
+ }
286
+ .mb-20 {
287
+ margin-bottom: 20px;
288
+ }
289
+ .mb-30 {
290
+ margin-bottom: 30px;
291
+ }
292
+ .mb-40 {
293
+ margin-bottom: 40px;
294
+ }
295
+ .mb-50 {
296
+ margin-bottom: 50px;
297
+ }
298
+ .ml-10 {
299
+ margin-left: 15px;
300
+ }
301
+
302
+ /*** 2.1 Notification Element ***/
303
+ .sb-notification-ctn{
304
+ position: fixed;
305
+ bottom: -100px;
306
+ left: 200px;
307
+ z-index: 99999;
308
+ background: #fff;
309
+ display: flex;
310
+ justify-content: center;
311
+ align-items: center;
312
+ border-left: 3px solid #fff;
313
+ line-height: 1em;
314
+ padding: 10px 20px;
315
+ padding-left: 0px;
316
+ border-radius: 4px;
317
+ box-shadow: 0px 26.7377px 77.2886px rgba(0, 0, 0, 0.107828), 0px 14.2952px 41.3222px rgba(0, 0, 0, 0.0894161), 0px 8.01379px 23.1649px rgba(0, 0, 0, 0.075), 0px 4.25607px 12.3027px rgba(0, 0, 0, 0.0605839), 0px 1.77104px 5.11942px rgba(0, 0, 0, 0.0421718);
318
+
319
+ }
320
+ .sb-notification-ctn[data-active="hidden"]{
321
+ -webkit-animation: sbi-notification-hide .5s forwards linear;
322
+ animation: sbi-notification-hide .5s forwards linear;
323
+ }
324
+ .sb-notification-ctn[data-active="shown"]{
325
+ -webkit-animation: sbi-notification-show .5s forwards linear;
326
+ animation: sbi-notification-show .5s forwards linear;
327
+ }
328
+ @-webkit-keyframes sbi-notification-show { 0%{bottom: -100px;} 50%{bottom: 70px;} 70%{bottom: 60px;} 85%{bottom: 65px;} 100%{bottom: 50px;}}
329
+ @keyframes sbi-notification-show { 0%{bottom: -100px;} 50%{bottom: 70px;} 70%{bottom: 60px;} 85%{bottom: 65px;} 100%{bottom: 50px;}}
330
+
331
+ @-webkit-keyframes sbi-notification-hide {0%{bottom: 50px;}55%{bottom: 65px;}70%{bottom: 60px;}85%{bottom: 70px;}100%{bottom: -100px;}}
332
+ @keyframes sbi-notification-hide {0%{bottom: 50px;}55%{bottom: 65px;}70%{bottom: 60px;}85%{bottom: 70px;}100%{bottom: -100px;}}
333
+
334
+ .sb-notification-ctn[data-type="success"]{
335
+ border-color: #59AB46;
336
+ }
337
+ .sb-notification-ctn[data-type="error"]{
338
+ border-color: #D72C2C;
339
+ }
340
+ .sb-notification-ctn[data-type="message"]{
341
+ border-color: #141B38;
342
+ }
343
+ .sb-notification-icon{
344
+ width: 25px;
345
+ height: 25px;
346
+ display: flex;
347
+ justify-content: center;
348
+ align-items: center;
349
+ margin-left: 10px;
350
+ margin-right: 15px;
351
+ }
352
+ .sb-notification-icon svg{
353
+ width: 22px;
354
+ height: 22px;
355
+ float: left;
356
+ fill: currentColor;
357
+ }
358
+
359
+ .sb-notification-ctn[data-type="success"] .sb-notification-icon{
360
+ color: #59AB46;
361
+ }
362
+ .sb-notification-ctn[data-type="error"] .sb-notification-icon{
363
+ color: #D72C2C;
364
+ }
365
+ .sb-notification-ctn[data-type="message"] .sb-notification-icon{
366
+ color: #141B38;
367
+ }
368
+
369
+ .sb-notification-ctn span{
370
+ font-size: 14px;
371
+ color: #141B38;
372
+ font-weight:500;
373
+ }
374
+
375
+ /*** 3.0 - Header ***/
376
+ .sbi-fb-create-ctn{
377
+ margin-top: 90px;
378
+ }
379
+ .sbi-fb-header{
380
+ height: 64px;
381
+ position: absolute;
382
+ display: flex;
383
+ flex-direction: row;
384
+ justify-content: space-between;
385
+ align-items: center;
386
+ background: #fff;
387
+ padding: 0px 52px;
388
+ z-index: 2;
389
+ }
390
+ .sbi-fb-header-left {
391
+ display: flex;
392
+ }
393
+ .sbi-fb-header-left .sb-social-wall-link-wrap {
394
+ margin-left: 30px;
395
+ }
396
+ .sbi-fb-hd-logo{
397
+ display: flex;
398
+ vertical-align: middle;
399
+ align-items: center;
400
+ gap: 5px;
401
+ }
402
+ .sbi-fb-hd-logo .sb-logo-letters-wrap {
403
+ margin-bottom: 4px;
404
+ }
405
+ .sbi-fb-hd-logo .breadcrumb-title{
406
+ font-size: 14px;
407
+ font-weight: 400;
408
+ line-height: 22px;
409
+ letter-spacing: 0em;
410
+ margin-left: 4px;
411
+ }
412
+ .sbi-fb-hd-logo .separator{
413
+ margin: 0 5px 0 10px;
414
+ }
415
+ .sbi-fb-hd-btn{
416
+ height: 38px;
417
+ cursor: pointer;
418
+ display: flex;
419
+ flex-direction: row;
420
+ justify-content: center;
421
+ align-items: center;
422
+ padding: 0px 15px 0px 16px;
423
+ font-weight: 600;
424
+ font-size:14px;
425
+ color: #353A41;
426
+ background: #F3F4F5;
427
+ border-radius: 2px;
428
+ border: 1px solid #DCDDE1;
429
+ position: relative;
430
+ text-decoration: none;
431
+ transition: all 0.3s ease;
432
+ }
433
+ .sbi-fb-hd-btn:hover {
434
+ color: inherit;
435
+ background-color: #fff;
436
+ }
437
+ .sbi-fb-hd-btn i{
438
+ margin: 0px 5px;
439
+ }
440
+ .sbi-fb-hd-btn[data-icon="left"]{
441
+ padding-right: 20px!important;
442
+ }
443
+
444
+ .sbi-fb-full-wrapper .section-header {
445
+ margin-top: 33px;
446
+ }
447
+ .sbi-fb-full-wrapper .section-header h1 {
448
+ font-size: 32px;
449
+ line-height: 40px;
450
+ }
451
+ /*** 4.0 - Content ***/
452
+
453
+ /*** 4.1 - Tab Styles ***/
454
+ .sb-tabs-container {
455
+ position: relative;
456
+ width: 100%;
457
+ margin-top: 28px;
458
+ }
459
+ .sb-tabs-container .sb-tab-content .sb-tab-content-inner {
460
+ width: 100%;
461
+ margin-top: 20px;
462
+ height: auto;
463
+ padding-bottom: 30px;
464
+ }
465
+ .sb-tabs-container .sbi-save-button {
466
+ display: flex;
467
+ justify-content: flex-end;
468
+ margin-top: 30px;
469
+ }
470
+ .sb-tabs-container .sb-tabs {
471
+ position: relative;
472
+ display: flex;
473
+ align-items: center;
474
+ justify-content: space-between;
475
+ margin-bottom: 20px;
476
+ }
477
+ .sb-tabs-container .sb-tabs:after {
478
+ position: absolute;
479
+ content: '';
480
+ width: 100%;
481
+ height: 1px;
482
+ background-color: #DCDDE1;
483
+ bottom: 0px;
484
+ left: 0px;
485
+ z-index: -1;
486
+ }
487
+ .sb-tabs-container .sb-tabs .tab {
488
+ position: relative;
489
+ padding: 9px 25px 15px 25px;
490
+ display: inline-block;
491
+ font-weight: 500;
492
+ font-size: 16px;
493
+ line-height: 160%;
494
+ color: #8C8F9A;
495
+ text-decoration: none;
496
+ cursor: pointer;
497
+ -webkit-transition: linear 0.2s;
498
+ -ms-transition: linear 0.2s;
499
+ transition: linear 0.2s;
500
+ }
501
+ .sb-tabs-container .sb-tabs .tab:not(:last-child) {
502
+ margin-right: 20px;
503
+ }
504
+ .sb-tabs-container .sb-tabs .tab.active {
505
+ color: #0068A0;
506
+ }
507
+ .sb-tabs-container .sb-tabs .tab-indicator {
508
+ position: absolute;
509
+ bottom: 0px;
510
+ left: 0px;
511
+ background-color: #0068A0;
512
+ width: 200px;
513
+ height: 2px;
514
+ transition: all 0.3s cubic-bezier(0.22, 0.51, 0.53, 0.88);
515
+ }
516
+
517
+ .slide-fade-enter-active {
518
+ transition: all 0.3s ease;
519
+ position: absolute;
520
+ }
521
+ .slide-fade-leave-active {
522
+ position: absolute;
523
+ transition: all 0.3s cubic-bezier(1, 0.5, 0.8, 1);
524
+ }
525
+ .slide-fade-enter,
526
+ .slide-fade-leave-to {
527
+ transform: translateX(10px);
528
+ opacity: 0;
529
+ }
530
+
531
+ /*** 4.2 - Tab Boxes ***/
532
+ .sb-tab-content{
533
+ width: 100%;
534
+ height: auto;
535
+ }
536
+ .sb-tab-content .sb-tab-box {
537
+ background-color: #fff;
538
+ padding: 24px;
539
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
540
+ margin-bottom: 12px;
541
+ }
542
+ .sb-tab-content .sb-tab-box-small {
543
+ padding: 13px 24px;
544
+ }
545
+ .sb-tab-content .sb-tab-box h3,
546
+ #sbi-settings .sb-tab-content .sb-tab-box h3 {
547
+ margin: 0px 0px 5px;
548
+ font-size: 18px;
549
+ line-height: 140%;
550
+ color: #141B38;
551
+ display: flex;
552
+ }
553
+ .sb-tab-content .sb-tab-box h3 .sb-tooltip-info {
554
+ transform: translate(10px, 2px);
555
+ cursor: pointer;
556
+ }
557
+ .sb-tab-content .sb-tab-box p {
558
+ font-size: 14px;
559
+ line-height: 160%;
560
+ color: #8C8F9A;
561
+ margin: 0px;
562
+ }
563
+ .sb-tab-content .sb-tab-box .tab-label {
564
+ max-width: 270px;
565
+ min-width: 270px;
566
+ padding-right: 55px;
567
+ box-sizing: border-box;
568
+ float: left;
569
+ position: relative;
570
+ }
571
+ .sb-tab-content .sb-tab-box .tab-label.tab-label-full {
572
+ min-width: 100%;
573
+ max-width: 100%;
574
+ padding-right: 0;
575
+ float: initial;
576
+ }
577
+ .sb-tab-content .sb-tab-box .tab-label .sb-help-text {
578
+ font-size: 14px;
579
+ line-height: 160%;
580
+ color: #8C8F9A;
581
+ }
582
+ .sb-tab-content .license-status {
583
+ font-size: 14px;
584
+ line-height: 160%;
585
+ color: #141B38;
586
+ margin-bottom: 8px;
587
+ display: inline-block;
588
+ }
589
+ .sbi-tab-field-inner-wrap .upgrade-info{
590
+ border-bottom: 1px solid #DCDDE1;
591
+ margin-bottom: 24px;
592
+ padding-bottom: 24px;
593
+ }
594
+ .dev-site-license-field .upgrade-info{
595
+ border-bottom: 0px solid #DCDDE1;
596
+ padding-bottom: 0px;
597
+ }
598
+ .sb-tab-box.sb-license-box.license-type-free .license-status {
599
+ font-style: italic;
600
+ }
601
+ .dev-site-license-field .sbi-upgrade-license-btn {
602
+ text-decoration: none;
603
+ transform: none !important;
604
+ height: 38px;
605
+ padding: 4px 13px;
606
+ width: 165px;
607
+ box-sizing: border-box;
608
+ border: none;
609
+ }
610
+ .dev-site-license-field .sbi-upgrade-license-btn span {
611
+ height: 20px;
612
+ margin-right: 9px;
613
+ }
614
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field{
615
+ width: calc(100% - 270px);
616
+ float: left;
617
+ flex-wrap: wrap;
618
+ }
619
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field .sbi-tab-field-inner-wrap {
620
+ width: 100%;
621
+ }
622
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field .sbi-tab-field-inner-wrap:not(:last-child) {
623
+ margin-bottom: 20px;
624
+ }
625
+ .sb-tab-box.sb-license-box.license-type-free .sbi-tab-form-field {
626
+ flex-basis: 58%;
627
+ flex-wrap: wrap;
628
+ }
629
+ .sb-tab-box.sb-manage-sources-box .sbi-tab-form-field {
630
+ max-width: 1200px;
631
+ }
632
+ .sb-tab-box.sb-custom-css-box .sbi-tab-form-field,
633
+ .sb-tab-box.sb-custom-js-box .sbi-tab-form-field {
634
+ max-width: 840px;
635
+ }
636
+ @media (max-width: 1023px) {
637
+ .sb-tab-content .sb-tab-box .tab-label {
638
+ width: 100%;
639
+ max-width: 100%;
640
+ padding-right: 0;
641
+ float: initial;
642
+ margin-bottom: 20px;
643
+ }
644
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field{
645
+ width: 100%;
646
+ float: intial;
647
+ }
648
+ }
649
+
650
+ .sb-tab-box.sb-license-box.license-type-free .sbi-tab-form-field .upgrade-info {
651
+ width: 100%;
652
+ border-bottom: 1px solid #DCDDE1;
653
+ padding-bottom: 25px;
654
+ margin-bottom: 25px;
655
+ }
656
+ .sb-tab-box.sb-license-box.license-type-free .field-left-content,
657
+ .sb-tab-box.sb-license-box.license-type-free .field-right-content {
658
+ order: 1;
659
+ }
660
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field .sbi-form-field {
661
+ width: 100%;
662
+ }
663
+ .license-valid .sbi-form-field,
664
+ .license-valid .sbi-form-field:focus {
665
+ border-color: #59AB46;
666
+ }
667
+ .license-invalid .sbi-form-field {
668
+ border-color: #D72C2C;
669
+ }
670
+ .sb-field-error .sbi-form-field,
671
+ .sb-field-error .sbi-form-field:focus {
672
+ border-color: #D72C2C;
673
+ }
674
+ .license-valid .field-icon {
675
+ color: #59AB46;
676
+ }
677
+ .field-icon.field-icon-error {
678
+ color: #D72C2C;
679
+ }
680
+ .license-valid .sb-form-field .field-icon,
681
+ .sb-form-field .field-icon.field-icon-error {
682
+ background: white;
683
+ }
684
+ .form-error .sbi-form-field,
685
+ .license-expired .sbi-form-field {
686
+ border-color: #ab4646;
687
+ }
688
+ .upgrade-info span {
689
+ font-size: 14px;
690
+ line-height: 22px;
691
+ display: inline-block;
692
+ }
693
+ .upgrade-info span:last-child {
694
+ font-style: italic;
695
+ }
696
+ .upgrade-info span a {
697
+ font-weight: 700;
698
+ color: #0068A0;
699
+ }
700
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field .sbi-btn{
701
+ transform: translate(10px, 0px);
702
+ }
703
+ .sb-tab-content .sb-tab-box.sb-caching-box .sbi-tab-form-field .sbi-btn,
704
+ .sb-tab-content .sb-tab-box.sb-import-box .sbi-tab-form-field .sbi-btn{
705
+ transform: translate(0px);
706
+ }
707
+ .sb-tab-content .sb-tab-box.sb-license-box .sbi-tab-form-field .sb-form-field{
708
+ margin-bottom: 8px;
709
+ }
710
+ .license-valid .sbi-btn.loading svg path {
711
+ fill: #141B38
712
+ }
713
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field .field-left-content {
714
+ flex-basis: 73%;
715
+ max-width: 465px;
716
+ }
717
+ .sb-tab-content .sb-tab-box.sb-license-box.license-type-free .sbi-tab-form-field .field-left-content {
718
+ flex-basis: 73%;
719
+ }
720
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field .field-right-content {
721
+ flex-basis: 20%;
722
+ }
723
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field .form-info {
724
+ font-size: 12px;
725
+ line-height: 22px;
726
+ color: #27303F;
727
+ }
728
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field .form-info .manage-license a{
729
+ text-decoration-line: underline;
730
+ color: #27303F;
731
+ }
732
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field .form-info .test-connection {
733
+ color: #434960;
734
+ }
735
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field .form-info .upgrade a {
736
+ color: #0068A0;
737
+ font-weight: 600;
738
+ margin-left: 8px;
739
+ text-decoration: none;
740
+ }
741
+ .sb-tab-content .sb-tab-box.sb-reset-box-style {
742
+ margin: 0;
743
+ border-bottom: 1px solid #E8E8EB;
744
+ }
745
+ .sb-tooltip-content {
746
+ position: absolute;
747
+ background: #fff;
748
+ border-radius: 2px;
749
+ padding: 12px 26px 12px 16px;
750
+ box-shadow: 1px 2px 4px 0px rgb(0 0 0 / 15%), -2px -1px 9px 0px rgb(0 0 0 / 13%);
751
+ width: 497px;
752
+ height: auto;
753
+ max-height: 284px;
754
+ bottom: 50px;
755
+ box-sizing: border-box;
756
+ right: -45px;
757
+ z-index: 9999;
758
+ }
759
+ .sb-tooltip-content p {
760
+ color: #141B38;
761
+ font-size: 14px;
762
+ line-height: 22px;
763
+ font-weight: normal;
764
+ }
765
+ .sb-tooltip-content:after {
766
+ width: 12px;
767
+ height: 12px;
768
+ content: '';
769
+ bottom: -7px;
770
+ right: calc(50% - 6px);
771
+ position: absolute;
772
+ background: #fff;
773
+ transform: rotate(45deg);
774
+ box-shadow: 2px 2px 2px rgb(0 0 0 / 14%);
775
+ }
776
+ .sb-localization-box .sb-tooltip-content:after {
777
+ right: calc(50% - 55px);
778
+ }
779
+ .sb-tooltip-content.sb-tooltip-bottom {
780
+ bottom: inherit;
781
+ top: 45px;
782
+ box-shadow: -1px -2px 4px 0px rgb(0 0 0 / 15%), 2px 1px 9px 0px rgb(0 0 0 / 13%);
783
+ }
784
+ .sb-tooltip-content.sb-tooltip-bottom:after {
785
+ bottom: inherit;
786
+ top: -6px;
787
+ box-shadow: -2px -2px 2px rgb(0 0 0 / 14%);
788
+ }
789
+ .sb-tab-content .sb-tab-box .sb-tooltip-content p {
790
+ color: #141B38;
791
+ }
792
+ .sb-tab-content .sb-tab-box .sb-tooltip-content p:not(:last-child) {
793
+ margin-bottom: 12px;
794
+ }
795
+ .sb-tab-content .sb-tab-box .sb-tooltip-content p a {
796
+ color: #141B38;
797
+ font-weight: 600;
798
+ }
799
+ .sb-gdpr-box .sb-gdpr-active {
800
+ padding-left: 27px;
801
+ position: relative;
802
+ max-width: 560px;
803
+ box-sizing: border-box;
804
+ }
805
+ .sb-gdpr-box .gdpr-help-text-yes {
806
+ max-width: 560px;
807
+ }
808
+ .sb-gdpr-box .sb-gdpr-active .gdpr-active-icon {
809
+ position: absolute;
810
+ left: 0px;
811
+ }
812
+ .sb-gdpr-box .help-text a {
813
+ font-weight: 400;
814
+ }
815
+ .sb-gdpr-box .sb-text-bold {
816
+ font-weight: 700;
817
+ cursor: pointer;
818
+ }
819
+ .sb-gdpr-box .sb-gdpr-bold {
820
+ text-decoration: underline;
821
+ }
822
+ .sb-gdpr-info-tooltip {
823
+ position: absolute;
824
+ font-size: 14px;
825
+ line-height: 22px;
826
+ color: #141B38;
827
+ background: #FFFFFF;
828
+ border-radius: 2px;
829
+ padding: 12px 26px 12px 16px;
830
+ box-shadow: 1px 2px 4px 0px rgb(0 0 0 / 15%), -2px -1px 9px 0px rgb(0 0 0 / 13%);
831
+ z-index: 99;
832
+ width: 561px;
833
+ bottom: -183px;
834
+ box-sizing: border-box;
835
+ }
836
+ .sb-gdpr-info-tooltip:before {
837
+ width: 0;
838
+ height: 0;
839
+ border-left: 8px solid transparent;
840
+ border-right: 8px solid transparent;
841
+ border-bottom: 10px solid #fff;
842
+ content: '';
843
+ top: -10px;
844
+ right: 260px;
845
+ position: absolute;
846
+ }
847
+ .sb-gdpr-info-tooltip .sb-gdpr-info-headline {
848
+ font-weight: 600;
849
+ }
850
+ .sb-gdpr-info-tooltip .sb-gdpr-info-list {
851
+ margin: 0px;
852
+ margin-top: 1px;
853
+ padding-left: 20px;
854
+ }
855
+ .sb-gdpr-info-tooltip .sb-gdpr-info-list li {
856
+ position: relative;
857
+ margin-bottom: 2px;
858
+ }
859
+ .sb-gdpr-info-tooltip .sb-gdpr-info-list li:before {
860
+ width: 3px;
861
+ height: 3px;
862
+ position: absolute;
863
+ left: -12px;
864
+ top: 10px;
865
+ content: '';
866
+ background-color: #141B38;
867
+ border-radius: 10px;
868
+ }
869
+ .recheck-license-status svg,
870
+ .test-connection svg {
871
+ width: 15px;
872
+ height: 15px;
873
+ transform: translate(2px, 3px);
874
+ }
875
+ .test-connection i {
876
+ font-size: 14px;
877
+ }
878
+ .recheck-license-status.loading path,
879
+ .test-connection.loading path {
880
+ fill: #141B38
881
+ }
882
+ .rrecheck-license-status.success svg,
883
+ .test-connection.success svg {
884
+ transform: translate(3px, 6px)
885
+ }
886
+ .test-connection i,
887
+ .recheck-license-status i {
888
+ font-size: 16px;
889
+ transform: translate(-2px, 1px);
890
+ }
891
+ .recheck-license-status.success path,
892
+ .test-connection.success path {
893
+ fill: #59AB46;
894
+ }
895
+ .recheck-license-status.success i,
896
+ .test-connection.success i {
897
+ color: #59AB46;
898
+ }
899
+ .recheck-license-status.error i,
900
+ .test-connection.error i {
901
+ color: #D72C2C;
902
+ }
903
+ .recheck-license-status {
904
+ margin-left: 8px;
905
+ cursor: pointer;
906
+ }
907
+ .recheck-license-status i {
908
+ margin-left: 8px;
909
+ }
910
+ .test-connection.error i {
911
+ color: #D72C2C;
912
+ }
913
+ .test-connection a {
914
+ color: #434960;
915
+ font-weight: 600;
916
+ margin-left: 4px;
917
+ }
918
+ .test-connection:not(.error):not(.success) {
919
+ cursor: pointer;
920
+ }
921
+ .sbi-btn[disabled="disabled"] {
922
+ cursor: not-allowed;
923
+ color: #8C8F9A;
924
+ background: #F3F4F5;
925
+ }
926
+ .sbi-btn[disabled="disabled"]:hover {
927
+ color: #8C8F9A;
928
+ }
929
+ .sbi-btn[disabled="disabled"]:not(.import-btn) .icon path {
930
+ fill: #8C8F9A;
931
+ }
932
+ .import-btn .icon svg:not(.checkmark) path {
933
+ fill: #141B38;
934
+ }
935
+ .import-btn[disabled="disabled"] .icon svg:not(.checkmark) path {
936
+ fill: #8C8F9A;
937
+ }
938
+ .sbi-btn .icon {
939
+ margin-right: 12px;
940
+ }
941
+ .import-btn .icon.loading {
942
+ transform: translate(-5px, 1px);
943
+ }
944
+ .import-btn .icon.success {
945
+ transform: translate(-4px, 0px);
946
+ }
947
+ .import-btn .icon.error {
948
+ transform: translate(-4px, 0px);
949
+ }
950
+ .import-btn .icon.error i {
951
+ color: #D72C2C;
952
+ }
953
+ .import-btn .icon.success svg {
954
+ stroke: #141B38
955
+ }
956
+ .export-btn {
957
+ text-decoration: none;
958
+ }
959
+ .export-btn:hover {
960
+ color: inherit;
961
+ }
962
+
963
+ .sb-tab-box.sb-caching-box .sbi-caching-btn .loading path,
964
+ .sb-tab-box.sb-optimize-box .optimize-image-btn .loading path,
965
+ .sb-tab-box.sb-dpa-clear-box-style .loading path{
966
+ fill: rgba(23, 22, 22, .95)
967
+ }
968
+ .sb-tab-box.sb-caching-box .sbi-caching-btn .success svg,
969
+ .sb-tab-box.sb-optimize-box .optimize-image-btn .success svg,
970
+ .sb-tab-box.sb-dpa-clear-box-style .success svg{
971
+ stroke: rgba(23, 22, 22, .95)
972
+ }
973
+
974
+ /* Translation Tab */
975
+ .sb-tab-inner-card {
976
+ margin-top: 30px;
977
+ }
978
+
979
+ .sbi-table {
980
+ width: 100%;
981
+ border: 1px solid #DCDDE1;
982
+ padding: 0;
983
+ border-spacing: 0;
984
+ }
985
+ .sbi-table thead th,
986
+ .sbi-table tfoot th {
987
+ background-color: #F3F4F5;
988
+ font-size: 14px;
989
+ line-height: 22px;
990
+ color: #434960;
991
+ padding: 10px 20px;
992
+ font-weight: 400;
993
+ text-align: left;
994
+ box-sizing: border-box;
995
+ border-bottom: 1px solid #DCDDE1;
996
+ }
997
+ .sbi-table tfoot th {
998
+ border: 0;
999
+ border-top: 1px solid #DCDDE1;
1000
+ }
1001
+
1002
+ .sbi-table tbody td {
1003
+ padding: 6px 10px 6px 20px;
1004
+ box-sizing: border-box;
1005
+
1006
+ }
1007
+ .sbi-table-row-header td {
1008
+ font-weight: 600;
1009
+ font-size: 16px !important;
1010
+ line-height: 26px;
1011
+ color: #141B38;
1012
+ box-sizing: border-box;
1013
+ padding: 10px 20px !important;
1014
+ }
1015
+ .sbi-table tbody td {
1016
+ background: #F3F4F5;
1017
+ font-size: 14px;
1018
+ }
1019
+ .sbi-table tbody:nth-child(2n) td {
1020
+ background-color:#fff;
1021
+ }
1022
+ .sbi-table tbody tr:not(.sbi-table-row-header):not(:last-child) td {
1023
+ border-bottom:1px solid #DCDDE1
1024
+ }
1025
+ .sbi-table tbody tr:last-child td {
1026
+ padding: 6px 10px 6px 20px;
1027
+ }
1028
+
1029
+ .sbi-table tbody tr td:first-child,
1030
+ .sbi-table tbody tr td:nth-child(2) {
1031
+ width: 25%;
1032
+ }
1033
+ .sbi-table tbody .sbi-input{
1034
+ background: #FFFFFF;
1035
+ border: 1px solid #D0D1D7;
1036
+ box-sizing: border-box;
1037
+ border-radius: 1px;
1038
+ width: 100%;
1039
+ height: 38px;
1040
+ color: #2c3338;
1041
+ }
1042
+ .sbi-table tbody .sbi-input::placeholder {
1043
+ color: #8C8F9A;
1044
+ }
1045
+ .sbi-table tbody .sbi-input:focus {
1046
+ border: 1px solid #97989c;
1047
+ outline: none;
1048
+ box-shadow: none;
1049
+ }
1050
+ @media (max-width: 767px) {
1051
+ .sb-tabs-container .sb-tabs .tab {
1052
+ padding: 25px 10px;
1053
+ }
1054
+ .sbi-table th,
1055
+ .sbi-table td {
1056
+ display: block;
1057
+ width: 100%;
1058
+ }
1059
+ .sbi-table tbody tr td:first-child,
1060
+ .sbi-table tbody tr td:nth-child(2) {
1061
+ width: 100%;
1062
+ }
1063
+ .sbi-table tbody .sbi-input {
1064
+ height: 30px;
1065
+ min-height: 30px;
1066
+ font-size: 14px;
1067
+ }
1068
+ }
1069
+
1070
+ .sb-feed-issue-box #sbi-send-report {
1071
+ width: 127px;
1072
+ min-width: 127px;
1073
+ height: 46px;
1074
+ padding: 6px 15px;
1075
+ }
1076
+ .sb-feed-issue-box #report-emails {
1077
+ width: 407px;
1078
+ height: 45px;
1079
+ padding: 8px 15px;
1080
+ font-size: 16px;
1081
+ line-height: 26px;
1082
+ }
1083
+ .sb-feed-issue-box #report-emails::placeholder {
1084
+ color: #8C8F9A;
1085
+ }
1086
+ .sb-feed-issue-box .feed-issues-fields {
1087
+ margin-bottom: 15px;
1088
+ display: flex;
1089
+ }
1090
+ .sb-feed-issue-box .feed-issues-fields * {
1091
+ margin: 0 10px 0 0;
1092
+ font-size: 16px;
1093
+ }
1094
+
1095
+ .sb-tab-box.sb-optimize-box .sb-form-field,
1096
+ .sb-tab-box.sb-usage-box .sb-form-field,
1097
+ .sb-tab-box.sb-ajax-box .sb-form-field,
1098
+ .sb-tab-box.sb-show-credit-box .sb-form-field,
1099
+ .sb-tab-box.sb-admin-error-box .sb-form-field,
1100
+ .sb-tab-box.sb-fix-text-box .sb-form-field{
1101
+ max-width: 695px;
1102
+ }
1103
+ .sb-tab-box.sb-feed-issue-box .sb-form-field .help-text {
1104
+ max-width: 670px;
1105
+ }
1106
+
1107
+ /*To Be Checked*/
1108
+ .sb-sources-list{
1109
+ width: 100%;
1110
+ position: relative;
1111
+ display: grid;
1112
+ grid-template-columns: 48% 48%;
1113
+ grid-column-gap: 2%;
1114
+ }
1115
+ .sbi-fb-srcs-item-ins {
1116
+ display: flex;
1117
+ height: 62px;
1118
+ padding: 0 10px;
1119
+ position: relative;
1120
+ }
1121
+ .sb-srcs-item {
1122
+ box-sizing: border-box;
1123
+ position: relative;
1124
+ cursor: auto;
1125
+ display: block;
1126
+ height: 64px;
1127
+ border: 1px solid #E7E7E9;
1128
+ min-height: 60px;
1129
+ overflow: auto;
1130
+ margin-top: 15px;
1131
+ }
1132
+ .sb-srcs-item.expanded {
1133
+ height: auto;
1134
+ }
1135
+ .sb-source-error-wrap {
1136
+ display: flex;
1137
+ justify-content: center;
1138
+ align-items: center;
1139
+ margin-left: 9px;
1140
+ }
1141
+
1142
+ .sb-source-error-wrap span {
1143
+ font-weight: 600;
1144
+ font-size: 12px;
1145
+ line-height: 160%;
1146
+
1147
+ color: #D72C2C;
1148
+ margin-left: 5px;
1149
+ }
1150
+ .sb-source-error-wrap a {
1151
+ margin-left: 8px;
1152
+ font-weight: 600;
1153
+ font-size: 12px;
1154
+ line-height: 160%;
1155
+ text-decoration-line: underline;
1156
+
1157
+ color: #0068A0;
1158
+ }
1159
+ .sb-srcs-new {
1160
+ display: flex;
1161
+ justify-content: center;
1162
+ align-items: center;
1163
+ font-size: 14px;
1164
+ color: #0068A0;
1165
+ background: #F9F9FA;
1166
+ font-weight: 400;
1167
+ transition: all 0.15s ease-in-out;
1168
+ border: 1px solid #E8E8EB;
1169
+ }
1170
+ .sb-srcs-new:hover {
1171
+ cursor: pointer;
1172
+ background: #E2F5FF;
1173
+ }
1174
+ .sb-srcs-new span.add-new-icon {
1175
+ margin-right: 11px;
1176
+ margin-top: 3px;
1177
+ }
1178
+ .sb-srcs-item-avatar{
1179
+ display: flex;
1180
+ width: 42px;
1181
+ height: inherit;
1182
+ justify-content: center;
1183
+ align-items: center;
1184
+ margin-right: 10px;
1185
+ }
1186
+ .sb-srcs-item-avatar img{
1187
+ width: 42px;
1188
+ height: 42px;
1189
+ border-radius: 50%;
1190
+ background: #eee;
1191
+ }
1192
+ .sb-srcs-item-inf{
1193
+ width: 100%;
1194
+ height: inherit;
1195
+ display: flex;
1196
+ justify-content: center;
1197
+ flex-direction: column;
1198
+ }
1199
+ .sb-srcs-item-name{
1200
+ font-weight: 600;
1201
+ color: #141B38;
1202
+ font-size: 16px;
1203
+ margin-bottom: 1px;
1204
+ padding-right: 60px;
1205
+ max-height: 32px;
1206
+ line-height: 1.1;
1207
+ padding-bottom: 2px;
1208
+ overflow: hidden;
1209
+ }
1210
+ .sb-account-has-error {
1211
+ border: 1px solid #f3c9c9;
1212
+ background: #fff8f8;
1213
+ }
1214
+
1215
+ .sb-srcs-item-used{
1216
+ color: #434960;
1217
+ display: flex;
1218
+ align-items: center;
1219
+ font-weight: 400;
1220
+ font-size: 12px;
1221
+ }
1222
+
1223
+ .sbi-fb-srcs-info-item:first-of-type {
1224
+ align-items: center;
1225
+ }
1226
+ .sbi-fb-srcs-info-item {
1227
+ display: flex;
1228
+ border-top: 1px solid #E7E7E9;
1229
+ box-sizing: border-box;
1230
+ width: 100%;
1231
+ float: left;
1232
+ padding: 8px 10px;
1233
+ }
1234
+ .sbi-fb-srcs-info-item strong {
1235
+ font-size: 14px;
1236
+ width: 50px;
1237
+ }
1238
+ .sbi-fb-srcs-info-item span {
1239
+ font-size: 13px;
1240
+ line-height: 1.5em;
1241
+ color: #434960;
1242
+ font-weight: 400;
1243
+ display: inline-block;
1244
+ word-break: break-all;
1245
+ width: calc(100% - 80px);
1246
+ padding: 0 15px;
1247
+ box-sizing: border-box;
1248
+ }
1249
+ .sbi-fb-srcs-info-icon {
1250
+ width: 26px;
1251
+ height: 26px;
1252
+ display: flex;
1253
+ justify-content: center;
1254
+ align-items: center;
1255
+ cursor: pointer;
1256
+ margin-left: auto;
1257
+ border: 1px solid #D0D1D7;
1258
+ border-radius: 2px;
1259
+ transition: all 0.15s ease-in-out;
1260
+ }
1261
+ .sbi-fb-srcs-info-icon:hover {
1262
+ background: #F3F4F5;
1263
+ }
1264
+ .sbi-fb-srcs-info-icon:focus,
1265
+ .sbi-fb-srcs-info-icon:active {
1266
+ background: #E8E8EB;
1267
+ }
1268
+ .sbi-fb-srcs-info-icon svg {
1269
+ width: 15px;
1270
+ float: left;
1271
+ }
1272
+ .sb-control-src-expand-chevron {
1273
+ width: 7px;
1274
+ height: 7px;
1275
+ border-left: 2px solid currentColor;
1276
+ border-top: 2px solid currentColor;
1277
+ -webkit-transform: rotate(45deg);
1278
+ transform: rotate(45deg);
1279
+ }
1280
+ .sb-srcs-item-actions{
1281
+ position: absolute;
1282
+ width: 70px;
1283
+ height: 31px;
1284
+ right: 7px;
1285
+ top: 7px;
1286
+ }
1287
+ .sb-srcs-item-actions-btn{
1288
+ width: 30px;
1289
+ height: 31px;
1290
+ cursor: pointer;
1291
+ float: left;
1292
+ display: flex;
1293
+ justify-content: center;
1294
+ align-items: center;
1295
+ margin-left: 3px;
1296
+ }
1297
+ .sb-srcs-item-actions-btn svg{
1298
+ float: left;
1299
+ width: 17px;
1300
+ fill: currentColor;
1301
+ }
1302
+ .sb-srcs-item-actions-btn.sb-srcs-item-angle-up svg {
1303
+ height: 10px;
1304
+ }
1305
+ .sb-srcs-item-cog,
1306
+ .sb-srcs-item-angle-up{
1307
+ color: #434960;
1308
+ transition: all 0.15s ease-in-out;
1309
+ border-radius: 4px;
1310
+ }
1311
+ .sb-srcs-item-cog:hover,
1312
+ .sb-srcs-item-angle-up:hover {
1313
+ background: #F3F4F5;
1314
+ }
1315
+ .sb-srcs-item-cog:focus,
1316
+ .sb-srcs-item-cog:active,
1317
+ .sb-srcs-item-angle-up:focus,
1318
+ .sb-srcs-item-angle-up:active {
1319
+ background: #E8E8EB;
1320
+ }
1321
+ .sb-srcs-item-delete{
1322
+ color: #D72C2C;
1323
+ transition: all 0.15s ease-in-out;
1324
+ border-radius: 4px;
1325
+ }
1326
+ .sb-srcs-item-delete:hover {
1327
+ background-color: #FCEDED;
1328
+ }
1329
+ .sb-srcs-item-delete:focus,
1330
+ .sb-srcs-item-delete:active {
1331
+ background: #eed4d4;
1332
+ }
1333
+ .sb-srcs-item-delete svg{
1334
+ width: 13px;
1335
+ }
1336
+ #sbi-settings .sbi-fb-source-step1 .sbi-fb-source-top h3 {
1337
+ margin-bottom: 40px;
1338
+ }
1339
+
1340
+ /*
1341
+ Sources Instance Popup
1342
+ */
1343
+ .sbi-fb-popup-feedinst .sbi-fb-source-top{
1344
+ display: flex;
1345
+ align-items: center;
1346
+ }
1347
+ .sbi-fb-popup-feedinst h5{
1348
+ margin-bottom: 0px;
1349
+ float: left;
1350
+ font-size: 27px;
1351
+ }
1352
+ .sbi-fb-fdinst-type{
1353
+ padding: 5px 5px;
1354
+ background: #E8E8EB;
1355
+ margin-left: 12px;
1356
+ float: left;
1357
+ }
1358
+ .sbi-fb-inst-tbl-ctn{
1359
+ padding: 0 23px 63px;
1360
+ }
1361
+ .sbi-fb-inst-tbl-ctn table{
1362
+ width: 100%;
1363
+ border-spacing: unset;
1364
+ box-sizing: border-box;
1365
+ border: 1px solid #DCDDE1;
1366
+ text-align: left;
1367
+ }
1368
+ .sbi-fb-inst-tbl-ctn tfoot,.sbi-fb-inst-tbl-ctn thead{
1369
+ background: #F3F4F5
1370
+ }
1371
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf th, .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf td{
1372
+ font-size: 13px;
1373
+ color: #364152;
1374
+ padding: 13px 10px;
1375
+ }
1376
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-tbody tr:nth-child(odd){
1377
+ background: #fff;
1378
+ }
1379
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-tbody tr:nth-child(even){
1380
+ background: #F3F4F5;
1381
+ }
1382
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf tr th,
1383
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf tr td{
1384
+ padding: 4px 20px;
1385
+ }
1386
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-tbody tr td{
1387
+ padding: 11px 20px;
1388
+ }
1389
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-name{
1390
+ font-size: 14px;
1391
+ }
1392
+ .sbi-fb-inst-tbl-shrtc{
1393
+ display: flex;
1394
+ align-items: center;
1395
+ }
1396
+
1397
+ .sbi-fd-inst-btn{
1398
+ width: 10px;
1399
+ height: 10px;
1400
+ box-sizing: border-box;
1401
+ border-right: 3px solid #8C8F9A;
1402
+ border-top: 3px solid #8C8F9A;
1403
+ cursor: pointer;
1404
+ -webkit-transform: rotate(45deg);
1405
+ transform: rotate(45deg);
1406
+ }
1407
+
1408
+ .sbi-fd-lst-actions .sbi-fd-lst-btn, .sbi-fb-inst-tbl-ctn .sbi-fd-lst-btn {
1409
+ box-sizing: border-box;
1410
+ width: 36px;
1411
+ height: 32px;
1412
+ }
1413
+ .sbi-fd-lst-shortcode-cp {
1414
+ margin-left: 10px;
1415
+ }
1416
+ .sbi-fb-tltp-parent {
1417
+ position: relative;
1418
+ }
1419
+ .sbi-fd-lst-btn {
1420
+ width: 21px;
1421
+ height: 21px;
1422
+ display: inline-flex;
1423
+ justify-content: center;
1424
+ align-items: center;
1425
+ margin: 0 4px;
1426
+ cursor: pointer;
1427
+ color: #141B38;
1428
+ border-radius: 2px;
1429
+ border: 1px solid #D8DADD;
1430
+ -webkit-transition: all .2s ease-in-out;
1431
+ transition: all .2s ease-in-out;
1432
+ background: #fff;
1433
+ }
1434
+ .sbi-fb-tltp-elem {
1435
+ position: absolute;
1436
+ color: #fff;
1437
+ background: #434960;
1438
+ font-size: 14px;
1439
+ padding: 7px 10px;
1440
+ border-radius: 3px;
1441
+ font-weight: 500;
1442
+ z-index: 9;
1443
+ text-align: center;
1444
+ opacity: 0;
1445
+ visibility: hidden;
1446
+ top: calc(-100% - 30px);
1447
+ left: 50%;
1448
+ -webkit-transform: translateX(-50%);
1449
+ transform: translateX(-50%);
1450
+ -webkit-transition: all .2s ease-in-out;
1451
+ transition: all .2s ease-in-out;
1452
+ }
1453
+ .sbi-fb-tltp-elem span {
1454
+ position: relative;
1455
+ z-index: 3;
1456
+ }
1457
+ .sbi-fd-lst-btn svg {
1458
+ fill: currentColor;
1459
+ width: 14px;
1460
+ float: left;
1461
+ }
1462
+ .sbi-fd-lst-btn svg {
1463
+ height: 13px;
1464
+ }
1465
+ .sbi-fd-lst-thtf th{
1466
+ border-bottom: 1px solid #DCDDE1;
1467
+ }
1468
+ .sbi-fd-lst-thtf td{
1469
+ border-top: 1px solid #DCDDE1;
1470
+ }
1471
+ .sbi-fb-fdinst-type {
1472
+ padding: 5px 5px;
1473
+ background: #E8E8EB;
1474
+ margin-left: 12px;
1475
+ float: left;
1476
+ }
1477
+ .sbi-fd-lst-name {
1478
+ font-size: 17px;
1479
+ font-weight: 500;
1480
+ color: #0068A0!important;
1481
+ }
1482
+ .sbi-fb-inst-tbl-ctn a, .sbi-fb-inst-tbl-ctn a:focus {
1483
+ text-decoration: none;
1484
+ outline: none;
1485
+ }
1486
+ .sbi-fd-lst-actions .sbi-fd-lst-btn, .sbi-fb-inst-tbl-ctn .sbi-fd-lst-btn {
1487
+ box-sizing: border-box;
1488
+ width: 36px;
1489
+ height: 32px;
1490
+ background: transparent;
1491
+ }
1492
+ .sbi-fd-lst-btn svg {
1493
+ fill: currentColor;
1494
+ width: 14px;
1495
+ float: left;
1496
+ }
1497
+ .sbi-fb-tltp-parent:hover .sbi-fb-tltp-elem {
1498
+ top: calc(-100% - 20px);
1499
+ opacity: 1;
1500
+ visibility: visible;
1501
+ }
1502
+ .sbi-fb-tltp-elem:after {
1503
+ content: '';
1504
+ position: absolute;
1505
+ height: 10px;
1506
+ width: 10px;
1507
+ bottom: -5px;
1508
+ left: calc(50% - 5px);
1509
+ background: #434960;
1510
+ transform: rotate(
1511
+ -45deg
1512
+ );
1513
+ }
1514
+
1515
+ /*** 6.0 Sticky Widget ***/
1516
+ .sbi-stck-wdg{
1517
+ position: fixed;
1518
+ right: 21px;
1519
+ z-index: 9;
1520
+ bottom: 20px;
1521
+ }
1522
+ .sbi-stck-wdg-btn{
1523
+ width: 52px;
1524
+ height: 52px;
1525
+ background: #fff;
1526
+ border-radius: 50%;
1527
+ cursor: pointer;
1528
+ display: flex;
1529
+ justify-content: center;
1530
+ align-items: center;
1531
+ filter: drop-shadow(0px 9px 13px rgba(0, 0, 0, 0.2));
1532
+ }
1533
+ .sbi-stck-wdg-btn svg{
1534
+ width: 25px;
1535
+ fill: #E34F0E;
1536
+ height: 33px;
1537
+ float: left;
1538
+ }
1539
+
1540
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls,
1541
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls svg{
1542
+ display: block;
1543
+ }
1544
+ .sbi-stck-wdg-btn-cls{
1545
+ width: inherit;
1546
+ height: inherit;
1547
+ position: relative;
1548
+ color: #364152;
1549
+ box-shadow: 0px 1px 6px rgb(0 0 0 / 5%), 0px 9px 12px rgb(0 0 0 / 5%);
1550
+ border-radius: 70px;
1551
+ }
1552
+ .sbi-stck-wdg-btn-cls svg {
1553
+ width: 14px;
1554
+ height: 14px;
1555
+ position: absolute;
1556
+ top: 50%;
1557
+ right: 0;
1558
+ bottom: 0;
1559
+ left: 50%;
1560
+ margin-top: -7px;
1561
+ margin-left: -7px;
1562
+ }
1563
+
1564
+ .sbi-stck-pop{
1565
+ position: absolute;
1566
+ width: 292px;
1567
+ height: auto;
1568
+ background: #fff;
1569
+ border: 1px solid #E2E8F0;
1570
+ box-sizing: border-box;
1571
+ box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15), 0px 3px 14px rgba(0, 0, 0, 0.12);
1572
+ border-radius: 2px;
1573
+ padding: 20px;
1574
+ right: 0px;
1575
+ bottom: 66px;
1576
+ color: #141B38;
1577
+ padding-bottom: 82px;
1578
+ }
1579
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-pop{
1580
+ bottom: 66px;
1581
+ opacity: 1;
1582
+ visibility: visible;
1583
+ }
1584
+
1585
+ .sbi-stck-pop svg{
1586
+ fill: currentColor;
1587
+ }
1588
+ .sbi-stck-el-list{
1589
+ border: 1px solid #DCDDE1;
1590
+ border-radius: 2px;
1591
+ }
1592
+ .sbi-stck-el{
1593
+ display: flex;
1594
+ align-items: center;
1595
+ padding: 11px 13px;
1596
+ border-bottom: 1px solid #DCDDE1;
1597
+ transition: background .15s ease-in-out;
1598
+ }
1599
+ .sbi-stck-el:hover{
1600
+ background: #F3F4F5;
1601
+ }
1602
+ .sbi-stck-el:last-of-type{
1603
+ border-bottom: 0px;
1604
+ }
1605
+ .sbi-stck-el-list .sbi-chevron svg{
1606
+ width: 5px;
1607
+ height: 8px;
1608
+ }
1609
+ .sbi-fs-a {
1610
+ width: 100%;
1611
+ height: 100%;
1612
+ display: block;
1613
+ position: absolute;
1614
+ left: 0;
1615
+ top: 0;
1616
+ z-index: 1;
1617
+ }
1618
+ .sbi-stck-el .sbi-stck-el-txt{
1619
+ color: #27303F;
1620
+ }
1621
+ .sbi-stck-el.sbi-stck-el-upgrd{
1622
+ padding: 8px 14px;
1623
+ font-size: 14px;
1624
+ background: var(--cl-orange);
1625
+ color: #fff;
1626
+ position: relative;
1627
+ transition: background .15s ease-in-out;
1628
+ }
1629
+ .sbi-chevron {
1630
+ position: absolute;
1631
+ right: 14px
1632
+ }
1633
+ .sbi-stck-el.sbi-stck-el-upgrd .sbi-stck-el-txt{
1634
+ color: #fff;
1635
+ }
1636
+ .sbi-stck-el.sbi-stck-el-upgrd:after{
1637
+ top: 20px;
1638
+ opacity: 1;
1639
+ }
1640
+ .sbi-stck-el-icon{
1641
+ margin-right: 10px;
1642
+ }
1643
+ .sbi-stck-el-icon svg{
1644
+ width: 17px;
1645
+ float: left;
1646
+ }
1647
+ .sbi-stck-title{
1648
+ margin-top: 20px;
1649
+ margin-bottom: 10px;
1650
+ color: #141B38;
1651
+ font-weight: 600;
1652
+ font-size: 14px;
1653
+ line-height: 160%;
1654
+ }
1655
+ .sbi-stck-follow{
1656
+ background: #F3F4F5;
1657
+ margin-top: 20px;
1658
+ left: 0px;
1659
+ bottom: 0px;
1660
+ position: absolute;
1661
+ padding: 12px 20px;
1662
+ display: flex;
1663
+ align-items: center;
1664
+ }
1665
+ .sbi-stck-follow span{
1666
+ font-weight: 600;
1667
+ font-size: 14px;
1668
+ }
1669
+ .sbi-stck-flw-links{
1670
+ display: flex;
1671
+ justify-content: center;
1672
+ align-items: center;
1673
+ margin-left: auto;
1674
+ }
1675
+ .sbi-stck-flw-links a{
1676
+ width: 36px;
1677
+ height: 28px;
1678
+ color: inherit;
1679
+ display: inline-flex;
1680
+ justify-content: center;
1681
+ align-items: center;
1682
+ margin-left: 4px;
1683
+ border-radius: 2px;
1684
+ transition: background .15s ease-in-out;
1685
+ }
1686
+ .sbi-stck-flw-links svg{
1687
+ width: 17px;
1688
+ color: #141B38;
1689
+ }
1690
+ .sbi-stck-flw-links a:hover{
1691
+ background: #fff;
1692
+ }
1693
+ .sbi-stck-flw-links a:hover svg{
1694
+ color: inherit;
1695
+ }
1696
+ .sb-tab-content .sb-tab-box.sb-reset-box-style .sbi-tab-form-field .sbi-btn,
1697
+ .sb-tab-content .sb-tab-box.sb-dpa-clear-box-style .sbi-tab-form-field .sbi-btn {
1698
+ transform: none;
1699
+ margin-bottom: 15px;
1700
+ }
1701
+
1702
+ /*** 7.0 Responsive ***/
1703
+ @media (max-width: 1429px) {
1704
+ .caching-form-fields-group {
1705
+ display: inline-block;
1706
+ }
1707
+ .caching-form-fields-group select {
1708
+ margin-bottom: 5px;
1709
+ }
1710
+ }
1711
+ @media (min-width: 1429px) {
1712
+ .caching-form-fields-group {
1713
+ display: flex;
1714
+ }
1715
+ }
1716
+ @media (max-width: 1023px) {
1717
+ .sb-tab-content .sb-tab-box .tab-label {
1718
+ width: 100%;
1719
+ max-width: 100%;
1720
+ padding-right: 0;
1721
+ float: initial;
1722
+ margin-bottom: 20px;
1723
+ }
1724
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field{
1725
+ width: 100%;
1726
+ float: intial;
1727
+ }
1728
+ }
1729
+ @media (max-width: 1320px) {
1730
+ .sb-feed-issue-box .feed-issues-fields {
1731
+ display: inline-block;
1732
+ }
1733
+
1734
+ .sb-feed-issue-box .feed-issues-fields * {
1735
+ margin-bottom: 5px;
1736
+ }
1737
+ }
1738
+ @media (max-width: 767px) {
1739
+ .auto-fold #wpcontent {
1740
+ padding-left: 0;
1741
+ }
1742
+ .sbi-fb-full-wrapper {
1743
+ padding: 70px 20px 0 20px;
1744
+ }
1745
+ .sbi-fb-hd-btn {
1746
+ padding: 0px 15px 0px 7px;
1747
+ }
1748
+ .sbi-fb-header {
1749
+ padding: 0px 20px;
1750
+ }
1751
+ .sb-notification-ctn {
1752
+ left: 20px;
1753
+ }
1754
+ .sb-tab-box.sb-export-box .sb-form-field .d-flex{
1755
+ flex-wrap: wrap;
1756
+ }
1757
+ .sb-form-field .sbi-select {
1758
+ width: 100%;
1759
+ }
1760
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field {
1761
+ flex-wrap: wrap;
1762
+ }
1763
+ .sb-license-box .sbi-tab-form-field .sbi-btn {
1764
+ transform: translate(0px, 0px) !important;
1765
+ margin-top: 10px;
1766
+ }
1767
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field .field-left-content {
1768
+ flex-basis: 100%;
1769
+ }
1770
+ .sb-export-box .sbi-tab-form-field .sbi-btn {
1771
+ transform: translate(0px, 0px) !important;
1772
+ margin-top: 10px;
1773
+ }
1774
+ .sb-feed-issue-box .feed-issues-fields {
1775
+ width: 100%;
1776
+ }
1777
+ .sb-feed-issue-box #report-emails {
1778
+ max-width: 100%;
1779
+ }
1780
+ .sbi-table thead th, .sbi-table tfoot th {
1781
+ display: none;
1782
+ }
1783
+ .sbi-table tbody tr:not(.sbi-table-row-header) td:last-child {
1784
+ margin-bottom: 20px;
1785
+ }
1786
+ .sbi-table tbody {
1787
+ background-color: #f3f4f5;
1788
+ }
1789
+ .sbi-table tbody:nth-child(2n) {
1790
+ background-color: #fff;
1791
+ }
1792
+ .sb-tab-content .sb-tab-box .sbi-tab-form-field .d-flex{
1793
+ flex-wrap: wrap;
1794
+ }
1795
+ .sb-sources-list {
1796
+ grid-template-columns: 100%;
1797
+ }
1798
+ .sb-tabs-container .sb-tabs {
1799
+ flex-direction: column-reverse;
1800
+ flex-wrap: wrap;
1801
+ align-items: flex-end;
1802
+ }
1803
+ .sbi-fb-full-wrapper {
1804
+ padding: 82px 20px 0 20px;
1805
+ }
1806
+ .sb-tabs-container .sb-tabs .left-buttons {
1807
+ width: 100%;
1808
+ display: flex;
1809
+ }
1810
+ .sb-tabs-container .sb-tabs .right-buttons {
1811
+ transform: translateY(-15px);
1812
+ }
1813
+ .sb-tabs-container .sb-tabs .left-buttons .tab {
1814
+ flex-grow: 1;
1815
+ flex-basis: 0;
1816
+ padding: 15px 10px;
1817
+ text-align: center;
1818
+ }
1819
+ .sb-tabs-container {
1820
+ margin-top: -45px;
1821
+ }
1822
+ #wpbody-content {
1823
+ padding-bottom: 50px;
1824
+ }
1825
+ .sb-form-field .sbi-select.size-md {
1826
+ width: 100%;
1827
+ max-width: 100%;
1828
+ }
1829
+ }
1830
+ @media (max-width: 567px) {
1831
+ .sb-tabs-container .sb-tabs .tab:not(:last-child) {
1832
+ margin-right: 10px;
1833
+ }
1834
+ }
1835
+ @media (max-width: 420px) {
1836
+ .sb-tabs-container .sb-tabs .left-buttons .tab {
1837
+ padding: 15px 7px;
1838
+ font-size: 14px;
1839
+ }
1840
+ }
1841
+ .sb-button-standard{
1842
+ position: relative;
1843
+ font-style: normal;
1844
+ font-weight: 600;
1845
+ font-size: 14px;
1846
+ padding: 10px 20px 10px 39px;
1847
+ line-height: 16px;
1848
+ height: auto;
1849
+ }
1850
+ .sb-button-standard svg {
1851
+ width: 16px;
1852
+ height: 16px;
1853
+ position: absolute;
1854
+ left: 13px;
1855
+ right: auto;
1856
+ top: 10px;
1857
+ bottom: auto;
1858
+ }
1859
+ .sbi-stck-el.sbi-stck-el-upgrd svg path{
1860
+ fill: #fff!important;
1861
+ }
admin/assets/css/support.css CHANGED
@@ -1,1033 +1,1033 @@
1
- /*
2
- * SUPPORT PAGE CSS TABLE OF CONTENTS
3
- *
4
- * 1.0 - GLOBAL
5
- * 2.0 - HEADER
6
- * 3.0 - 3.0 - SUPPORT CONTAINER
7
- * 3.1 - SECTION HEADER
8
- * 3.2 - SUPPORT BLOCK
9
- * 3.3 - CONTACT SUPPORT BLOCK
10
- * 4.0 - STICKY WIDGET
11
- * 5.0 - SB NOTIFICATION ELEMENT
12
- * 6.0 - RESPONSIVENESS
13
- */
14
-
15
- /*** 1.0 - GLOBAL ***/
16
- .clearfix { display: inline-block; }
17
- /* start commented backslash hack \*/
18
- * html .clearfix { height: 1%; }
19
- .clearfix { display: block; }
20
- #sbi-support {
21
- -webkit-font-smoothing: antialiased;
22
- font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
23
- }
24
- #wpcontent {
25
- padding-left: 0px;
26
- }
27
- #wpbody-content {
28
- padding-bottom: 40px;
29
- }
30
- .clearfix:after {
31
- visibility: hidden;
32
- display: block;
33
- font-size: 0;
34
- content: " ";
35
- clear: both;
36
- height: 0;
37
- }
38
- /*orange*/
39
- .sb-btn-orange{
40
- background: #E34F0E!important;
41
- color: #fff!important;
42
- }
43
- .sb-btn-orange:hover{
44
- background: #F37036!important;
45
- color: #fff!important;
46
- }
47
- .sb-btn-orange:focus,
48
- .sb-btn-orange:active{
49
- background: #B8400B!important;
50
- color: #fff!important;
51
- }
52
- .sbi-fb-cp-clpboard{
53
- width: 0px;
54
- height: 0px;
55
- position: absolute;
56
- left: -100000px;
57
- }
58
- .sbi-fb-full-wrapper{
59
- padding: 0 53px;
60
- padding-top: 82px;
61
- }
62
- .sbi-fb-fs {
63
- width: 100%;
64
- position: relative;
65
- float: left;
66
- box-sizing: border-box;
67
- }
68
- #adminmenu a[href="admin.php?page=sbi-support"] {
69
- display: none;
70
- }
71
-
72
- .sb-btn-grey:not(:disabled){
73
- background: #F3F4F5!important;
74
- color: #141B38!important;
75
- border: 1px solid #D0D1D7!important;
76
- }
77
- .sb-btn-grey:not(:disabled):hover{
78
- background: #fff!important;
79
- color: #141B38!important;
80
- border: 1px solid #DCDDE1!important;
81
- }
82
- .sb-btn-grey:not(:disabled):focus,
83
- .sb-btn-grey:not(:disabled):active{
84
- background: #E8E8EB!important;
85
- color: #141B38!important;
86
- border: 1px solid #D0D1D7!important;
87
- }
88
-
89
- /*** 2.0 - HEADER ***/
90
- .sbi-fb-create-ctn{
91
- margin-top: 90px;
92
- }
93
- .sbi-fb-header{
94
- height: 64px;
95
- position: absolute;
96
- display: flex;
97
- flex-direction: row;
98
- justify-content: space-between;
99
- align-items: center;
100
- background: #fff;
101
- padding: 0px 52px;
102
- z-index: 2;
103
- }
104
- .sbi-fb-header-left {
105
- display: flex;
106
- }
107
- .sbi-fb-header-left .sb-social-wall-link-wrap {
108
- margin-left: 30px;
109
- }
110
- .sb-social-wall-link-wrap {
111
- display: flex;
112
- font-size: 14px;
113
- margin: 10px 0 10px 30px;
114
- }
115
- .sb-social-wall-link:first-child {
116
- padding-left: 0;
117
- border-right: 1px solid #ccc;
118
- color: #0068A0!important;
119
- line-height: 1;
120
- }
121
- .sb-social-wall-link {
122
- padding: 0 12px;
123
- border-right: 1px solid #ccc;
124
- color: #0068A0!important;
125
- line-height: 1;
126
- }
127
- .sb-social-wall-link a {
128
- text-decoration: none;
129
- }
130
- .sb-social-wall-link a:focus {
131
- outline: none;
132
- box-shadow: none;
133
- }
134
- .sb-social-wall-link:last-child {
135
- border-right: none;
136
- }
137
- .sbi-fb-hd-logo{
138
- display: flex;
139
- vertical-align: middle;
140
- align-items: center;
141
- gap: 5px;
142
- }
143
- .sbi-fb-hd-logo .sb-logo-letters-wrap {
144
- transform: translate(0px, -2px);
145
- }
146
- .sbi-fb-hd-logo .breadcrumb-title{
147
- font-size: 14px;
148
- font-weight: 400;
149
- line-height: 22px;
150
- letter-spacing: 0em;
151
- margin-left: 4px;
152
- }
153
- .sbi-fb-hd-logo .separator{
154
- margin: 0 5px 0 10px;
155
- }
156
- .sbi-fb-hd-btn{
157
- height: 38px;
158
- cursor: pointer;
159
- display: flex;
160
- flex-direction: row;
161
- justify-content: center;
162
- align-items: center;
163
- padding: 0px 15px 0px 16px;
164
- font-weight: 600;
165
- font-size:14px;
166
- color: #353A41;
167
- background: #F3F4F5;
168
- border-radius: 2px;
169
- border: 1px solid #DCDDE1;
170
- position: relative;
171
- text-decoration: none;
172
- transition: all 0.15s ease-in-out;
173
- }
174
- .sbi-fb-hd-btn:focus {
175
- outline: none;
176
- box-shadow: none;
177
- }
178
- .sbi-fb-hd-btn:hover {
179
- color: inherit;
180
- background-color: #fff;
181
- }
182
- .sbi-fb-hd-btn i{
183
- margin: 0px 5px;
184
- }
185
- .sbi-fb-hd-btn[data-icon="left"]{
186
- padding-right: 20px!important;
187
- }
188
- .sbi-fb-full-wrapper .section-header h1 {
189
- font-size: 32px;
190
- line-height: 40px;
191
- }
192
- /*** 3.0 - SUPPORT CONTAINER ***/
193
- .sbi-sb-container {
194
- max-width: 885px;
195
- position: relative;
196
- margin: auto;
197
- margin-top: 33px;
198
- box-sizing: border-box;
199
- }
200
-
201
- /*** 3.1 - SECTION HEADER ***/
202
- .sbi-section-header {
203
- display: flex;
204
- justify-content: space-between;
205
- align-items: center;
206
- }
207
- .sbi-section-header h2{
208
- font-weight: 600;
209
- font-size: 32px;
210
- line-height: 40px;
211
- color: #141B38;
212
- margin: 0;
213
- }
214
- .sbi-section-header .sbi-search-doc .sbi-search-doc-field {
215
- position: relative;
216
- background: #fff;
217
- border: 1px solid #DCDDE1;
218
- min-width: 283px;
219
- box-sizing: border-box;
220
- height: 38px;
221
- padding: 0px 14px 0px 15px;
222
- font-weight: 600;
223
- font-size: 14px;
224
- line-height: 22px;
225
- color: #141B38;
226
- text-decoration: none;
227
- margin-right: 1px;
228
- }
229
- .sbi-section-header .sbi-search-doc .sbi-search-doc-field .sb-btn-input {
230
- height: 100%;
231
- border: none;
232
- outline: none;
233
- background-color: transparent;
234
- margin-left: 25px;
235
- color: #141B38;
236
- min-width: 200px;
237
- transform: translateY(-1px);
238
- }
239
- .sbi-section-header .sbi-search-doc .sbi-search-doc-field .sb-btn-input::placeholder {
240
- color: #141B38;
241
- }
242
- .sbi-section-header .sbi-search-doc .sbi-search-doc-field:focus,
243
- .sbi-section-header .sbi-search-doc .sbi-search-doc-field .sb-btn-input:focus {
244
- outline: none;
245
- box-shadow: none;
246
- }
247
- .sbi-section-header .sbi-search-doc .sbi-search-doc-field .sb-btn-icon {
248
- position: absolute;
249
- left: 15px;
250
- top: 11px;
251
- cursor: pointer;
252
- }
253
- .sbi-section-header .sbi-search-doc .sbi-search-doc-field .sb-btn-link-icon{
254
- cursor: pointer;
255
- position: absolute;
256
- right: 2px;
257
- top: 0;
258
- width: 35px;
259
- text-align: center;
260
- height: 100%;
261
- padding-top: 9px;
262
- box-sizing: border-box;
263
- }
264
- .sbi-section-header .sbi-search-doc a .sb-btn-link-icon{
265
- margin-left: 56px;
266
- }
267
- /*** 3.2 - SUPPORT BLOCK ***/
268
- .sbi-support-blocks {
269
- margin-top: 22px;
270
- display: flex;
271
- }
272
- .sbi-support-blocks .sbi-support-block {
273
- padding: 22px 18px;
274
- background: #FFFFFF;
275
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
276
- border-radius: 2px;
277
- width: calc(33% - 7px);
278
- box-sizing: border-box;
279
- position: relative;
280
- }
281
- .sbi-support-blocks .sbi-support-block:not(:last-child) {
282
- margin-right: 14px;
283
- }
284
- .sbi-support-blocks .sbi-support-block h3 {
285
- font-style: normal;
286
- font-weight: 600;
287
- font-size: 18px;
288
- line-height: 25px;
289
- color: #141B38;
290
- margin-top: 15px;
291
- margin-bottom: 0;
292
- }
293
- .sbi-support-blocks .sbi-support-block p {
294
- font-size: 12px;
295
- line-height: 18px;
296
- color: #64748B;
297
- margin-top: 5px;
298
- }
299
- .sb-block-header img {
300
- width: 56px;
301
- height: 56px;
302
- }
303
- .sb-articles-list {
304
- margin-top: 31px;
305
- margin-bottom: 79px;
306
- }
307
-
308
- .sb-articles-list ul li {
309
- position: relative;
310
- margin: 0px;
311
- padding-right: 10px;
312
- }
313
- .sb-articles-list ul li:not(:last-child) {
314
- border-bottom: 1px solid #E8E8EB;
315
- position: relative;
316
- }
317
- .sb-articles-list ul li a {
318
- font-size: 14px;
319
- line-height: 22px;
320
- color: #141B38;
321
- text-decoration: none;
322
- display: block;
323
- padding: 13px 0;
324
- }
325
- .sb-articles-list ul li:not(:last-child):after {
326
- content: '';
327
- position: absolute;
328
- left: 0px;
329
- bottom: -1px;
330
- background-color: #0068A0;
331
- height: 1px;
332
- width: 0;
333
- transition: all 0.25s ease-in-out;
334
- }
335
- .sb-articles-list ul li:not(:last-child):hover:after {
336
- width: 100%;
337
- }
338
- .sb-articles-list ul li a:hover {
339
- color: #0068A0;
340
- }
341
- .sb-articles-list ul li .sb-list-icon {
342
- position: absolute;
343
- right: 0;
344
- top: calc(50% - 9px);
345
- }
346
- .sb-articles-list ul li .sb-list-icon svg {
347
- width: 5px;
348
- }
349
- .sb-articles-list ul li .sb-list-icon svg path {
350
- fill: #8C8F9A;
351
- }
352
- .sbi-support-blocks .sbi-sb-button {
353
- margin-top: 50px;
354
- position: absolute;
355
- left: 0;
356
- bottom: 20px;
357
- width: calc(100% - 40px);
358
- padding: 0 20px;
359
- }
360
- .sbi-support-blocks .sbi-sb-button .sb-btn-icon {
361
- margin-left: 8px;
362
- }
363
- .sbi-support-blocks .sbi-sb-button .sb-btn-icon svg {
364
- width: 5px;
365
- transform: translateY(0px);
366
- margin-left: 3px;
367
- }
368
- .sbi-support-blocks .sbi-sb-button a {
369
- background: #F3F4F5;
370
- border: 1px solid #DCDDE1;
371
- box-sizing: border-box;
372
- border-radius: 2px;
373
- font-weight: 600;
374
- font-size: 12px;
375
- line-height: 19px;
376
- color: #141B38;
377
- display: block;
378
- text-align: center;
379
- text-decoration: none;
380
- padding: 6px;
381
- transition: all 0.15s ease-in-out;
382
- }
383
- .sbi-support-blocks .sbi-sb-button a:hover,
384
- .sbi-section-header .sbi-search-doc a:hover {
385
- background: #FFFFFF;
386
- border: 1px solid #D0D1D7;
387
- }
388
- .sbi-support-blocks .sbi-sb-button a:focus,
389
- .sbi-support-blocks .sbi-sb-button a:active,
390
- .sbi-section-header .sbi-search-doc a:focus,
391
- .sbi-section-header .sbi-search-doc a:active {
392
- background: #E8E8EB;
393
- border: 1px solid #D0D1D7;
394
- }
395
-
396
- /*** 3.3 - CONTACT SUPPORT BLOCK ***/
397
- .sbi-support-contact-block {
398
- background: #FFFFFF;
399
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
400
- border-radius: 2px;
401
- padding: 20px 20px 23px;
402
- margin-top: 28px;
403
- box-sizing: border-box;
404
- margin-bottom: 12px;
405
- display: flex;
406
- }
407
- .sbi-support-contact-block .sb-cb-content h3{
408
- font-size: 24px;
409
- line-height: 29px;
410
- color: #141B38;
411
- margin: 0;
412
- margin-bottom: 16px;
413
- }
414
- .sbi-support-contact-block .sb-cb-icon {
415
- margin-right: 30px;
416
- }
417
- .sbi-support-contact-block .sb-cb-icon span{
418
- background: #E8E8EB;
419
- border-radius: 60px;
420
- width: 68px;
421
- height: 68px;
422
- display: inline-block;
423
- text-align: center;
424
- padding-top: 22px;
425
- box-sizing: border-box;
426
- }
427
- .sbi-support-contact-block .sb-cb-btn{
428
- background: #E34F0E;
429
- border-radius: 2px;
430
- color: #fff;
431
- text-decoration: none;
432
- display: inline-block;
433
- padding: 8px 12px;
434
- font-size: 14px;
435
- }
436
- .sbi-support-contact-block .sb-cb-btn:hover {
437
- background: #F37036;
438
- border-color: #F37036;
439
- }
440
-
441
- .sbi-support-contact-block .sb-cb-btn:focus,
442
- .sbi-support-contact-block .sb-cb-btn:active {
443
- background: #B8400B;
444
- border-color: #B8400B;
445
- outline: none;
446
- box-shadow: none;
447
- }
448
- .sbi-support-contact-block .sb-cb-btn span {
449
- margin-left: 11px;
450
- }
451
- .sbi-support-contact-block .sb-cb-btn svg {
452
- width: 5px;
453
- }
454
- .sbi-support-contact-block .sb-cb-btn path {
455
- fill: #fff;
456
- }
457
- .sbi-support-contact-block .sb-contact-block-left{
458
- flex-basis: 625px;
459
- /* width: 625px; */
460
- /* float: left; */
461
- display: flex;
462
- padding-top: 10px;
463
- box-sizing: border-box;
464
- }
465
- .sbi-support-contact-block .sb-contact-block-right {
466
- flex-basis: 220px;
467
- /* width: 220px;
468
- float: left; */
469
- padding-top: 10px;
470
- padding-left: 32px;
471
- box-sizing: border-box;
472
- border-left: 1px solid #DCDDE1;
473
- }
474
- .sbi-support-contact-block .sb-contact-block-right p {
475
- font-size: 12px;
476
- line-height: 18px;
477
- color: #141B38;
478
- }
479
- .sbi-support-contact-block .sb-contact-block-right img {
480
- max-width: 65px;
481
- }
482
-
483
- /*** 3.4 - SYSTEM INFO BLOCK ***/
484
- .sbi-system-info-section {
485
- background: #FFFFFF;
486
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
487
- border-radius: 2px;
488
- }
489
- .sbi-system-info-section .sbi-system-header{
490
- display: flex;
491
- padding: 12px 20px 0;
492
- justify-content: space-between;
493
- }
494
- .sbi-system-info-section .sbi-system-header h3 {
495
- font-weight: 600;
496
- font-size: 18px;
497
- line-height: 25px;
498
- color: #141B38;
499
- margin-top: 9px;
500
- }
501
- .sbi-system-info-section .sbi-system-header .sbi-copy-btn {
502
- background: #F3F4F5;
503
- border: 1px solid #DCDDE1;
504
- box-sizing: border-box;
505
- border-radius: 2px;
506
- font-size: 14px;
507
- font-weight: 600;
508
- line-height: 22px;
509
- color: #141B38;
510
- height: 38px;
511
- padding: 5px 20px 5px 12px;
512
- cursor: pointer;
513
- transition: all 0.15s ease-in-out;
514
- }
515
- .sbi-system-info-section .sbi-system-header .sbi-copy-btn:hover {
516
- background: #FFFFFF;
517
- border: 1px solid #D0D1D7;
518
- }
519
- .sbi-system-info-section .sbi-system-header .sbi-copy-btn:focus,
520
- .sbi-system-info-section .sbi-system-header .sbi-copy-btn:active {
521
- background: #E8E8EB;
522
- border: 1px solid #D0D1D7;
523
- }
524
- .sbi-system-info-section .sbi-system-header .sbi-copy-btn svg {
525
- height: 19px;
526
- width: 19px;
527
- transform: translate(0px, 4px);
528
- margin-right: 5px;
529
- }
530
- .sbi-system-info-section .sbi-system-info {
531
- padding: 0 20px 20px;
532
- border-bottom: 1px solid #E8E8EB;
533
- }
534
- .sbi-system-info-section .sbi-system-info .system_info:focus {
535
- outline: none;
536
- box-shadow: none;
537
- }
538
- .sbi-system-info-section .sbi-system-info .system_info a {
539
- color: #0068A0;
540
- }
541
- .sbi-system-info-section .sbi-system-info .system_info {
542
- box-sizing: border-box;
543
- background: #F9F9FA;
544
- border: 1px solid #E8E8EB;
545
- width: 100%;
546
- resize: none;
547
- border-radius: 0;
548
- padding: 20px 28px;
549
- font-size: 12px;
550
- line-height: 18px;
551
- color: #141B38;
552
- width: 100%;
553
- height: 123px;
554
- font-family: 'Fira Code', monospace;
555
- word-break: break-all;
556
- }
557
- .sbi-system-info-section .sbi-system-info .system_info.expanded {
558
- height: 600px;
559
- overflow-x: hidden;
560
- overflow-y: scroll;
561
- }
562
- .sbi-system-info-section .sbi-system-info .system_info.collapsed {
563
- overflow: hidden;
564
- }
565
- .sbi-system-info-section .sbi-system-info .sbi-expand-btn {
566
- padding: 8px 12px 8px 8px;
567
- background: #FFFFFF;
568
- border: 1px solid #D0D1D7;
569
- border-radius: 2px;
570
- font-size: 12px;
571
- line-height: 19px;
572
- color: #141B38;
573
- width: 100%;
574
- margin-top: -5px;
575
- z-index: 9;
576
- position: relative;
577
- font-weight: 500;
578
- cursor: pointer;
579
- transition: all .15s ease-in-out;
580
- }
581
- .sbi-system-info-section .sbi-system-info .sbi-expand-btn:hover {
582
- background: #F3F4F5;
583
- border: 1px solid #DCDDE1;
584
- }
585
- .sbi-system-info-section .sbi-system-info .sbi-expand-btn span {
586
- margin-right: 10px;
587
- }
588
- .sbi-system-info-section .sbi-system-info .sbi-expand-btn:focus,
589
- .sbi-system-info-section .sbi-system-info .sbi-expand-btn:active{
590
- background: #E8E8EB!important;
591
- color: #141B38!important;
592
- border: 1px solid #D0D1D7!important;
593
- }
594
- .sbi-export-settings-section {
595
- background: #FFFFFF;
596
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
597
- border-radius: 2px;
598
- padding: 20px;
599
- background: #FFFFFF;
600
- display: flex;
601
- justify-content: space-between;
602
- }
603
- .sbi-export-settings-section .sbi-export-right{
604
- display: flex;
605
- }
606
- .sbi-export-settings-section .sbi-export-left h3 {
607
- font-style: normal;
608
- font-weight: 600;
609
- font-size: 18px;
610
- line-height: 25px;
611
- color: #141B38;
612
- margin: 0 0 4px 0;
613
- }
614
- .sbi-export-settings-section .sbi-export-left p {
615
- font-size: 12px;
616
- line-height: 18px;
617
- color: #141B38;
618
- margin: 0;
619
- }
620
- .sbi-export-settings-section .sbi-select{
621
- min-width: 234px;
622
- border: 1px solid #D0D1D7;
623
- padding: 3px 15px;
624
- height: 38px;
625
- font-size: 14px;
626
- color: #141B38;
627
- -webkit-appearance: none;
628
- appearance: none;
629
- margin-right: 8px;
630
- background: #fff url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAFCAYAAAB8ZH1oAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABSSURBVHgBfc4hCkAhDAbgjV3slQcvvHuYDWY1G8zewyIWb6YuCCLqD4Pt5wtD54NBQA2XVKiWcorl/X7s+DkhJYUhPk54IN5plCue0Tb8M8/aNx/uIpRVqbbFAAAAAElFTkSuQmCC') no-repeat right 15px top 55%;
631
- }
632
- .sbi-export-settings-section .sbi-btn {
633
- height: 38px;
634
- font-size: 14px;
635
- padding: 7px 20px 7px 16px;
636
- display: flex;
637
- align-items: center;
638
- vertical-align: middle;
639
- background: #F3F4F5;
640
- border: 1px solid #DCDDE1;
641
- border-radius: 2px;
642
- font-weight: 500;
643
- transition: all .15s ease-in-out;
644
- cursor: pointer;
645
- }
646
- .sbi-export-settings-section .sbi-btn:disabled {
647
- cursor: not-allowed;
648
- color: #8C8F9A;
649
- background: #F3F4F5;
650
- }
651
- .sbi-export-settings-section .sbi-btn:disabled:hover {
652
- color: #8C8F9A;
653
- }
654
- .sbi-export-settings-section .sbi-btn span {
655
- margin-right: 11px;
656
- transform: translate(0px, 2px);
657
- }
658
- .sbi-export-settings-section .sbi-btn:disabled span path {
659
- fill: #8C8F9A;
660
- }
661
- .sbi-support-contact-block {}
662
-
663
-
664
- /*** 4.0 Sticky Widget ***/
665
- .sbi-stck-wdg{
666
- position: fixed;
667
- right: 21px;
668
- z-index: 9;
669
- bottom: 20px;
670
- }
671
- .sbi-stck-wdg-btn{
672
- width: 52px;
673
- height: 52px;
674
- background: #fff;
675
- border-radius: 50%;
676
- cursor: pointer;
677
- display: flex;
678
- justify-content: center;
679
- align-items: center;
680
- filter: drop-shadow(0px 9px 13px rgba(0, 0, 0, 0.2));
681
- }
682
- .sbi-stck-wdg-btn svg{
683
- width: 25px;
684
- fill: #E34F0E;
685
- height: 33px;
686
- float: left;
687
- }
688
-
689
- .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls,
690
- .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls svg{
691
- display: block;
692
- }
693
- .sbi-stck-wdg-btn-cls{
694
- width: inherit;
695
- height: inherit;
696
- position: relative;
697
- color: #364152;
698
- box-shadow: 0px 1px 6px rgb(0 0 0 / 5%), 0px 9px 12px rgb(0 0 0 / 5%);
699
- border-radius: 70px;
700
- }
701
- .sbi-stck-wdg-btn-cls svg {
702
- width: 14px;
703
- height: 14px;
704
- position: absolute;
705
- top: 50%;
706
- right: 0;
707
- bottom: 0;
708
- left: 50%;
709
- margin-top: -7px;
710
- margin-left: -7px;
711
- }
712
-
713
- .sbi-stck-pop{
714
- position: absolute;
715
- width: 292px;
716
- height: auto;
717
- background: #fff;
718
- border: 1px solid #E2E8F0;
719
- box-sizing: border-box;
720
- box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15), 0px 3px 14px rgba(0, 0, 0, 0.12);
721
- border-radius: 2px;
722
- padding: 20px;
723
- right: 0px;
724
- bottom: 66px;
725
- color: #141B38;
726
- padding-bottom: 82px;
727
- }
728
- .sbi-stck-wdg[data-active="true"] .sbi-stck-pop{
729
- bottom: 66px;
730
- opacity: 1;
731
- visibility: visible;
732
- }
733
-
734
- .sbi-stck-pop svg{
735
- fill: currentColor;
736
- }
737
- .sbi-stck-el-list{
738
- border: 1px solid #DCDDE1;
739
- border-radius: 2px;
740
- }
741
- .sbi-stck-el{
742
- display: flex;
743
- align-items: center;
744
- padding: 11px 13px;
745
- border-bottom: 1px solid #DCDDE1;
746
- transition: background .15s ease-in-out;
747
- font-size: 12px;
748
- }
749
- .sbi-stck-el:hover{
750
- background: #F3F4F5;
751
- }
752
- .sbi-stck-el:last-of-type{
753
- border-bottom: 0px;
754
- }
755
- .sbi-stck-el-list .sbi-chevron svg{
756
- width: 5px;
757
- height: 8px;
758
- }
759
- .sbi-fs-a {
760
- width: 100%;
761
- height: 100%;
762
- display: block;
763
- position: absolute;
764
- left: 0;
765
- top: 0;
766
- z-index: 1;
767
- }
768
- .sbi-stck-el .sbi-stck-el-txt{
769
- color: #27303F;
770
- }
771
- .sbi-stck-el.sbi-stck-el-upgrd{
772
- padding: 9px 14px;
773
- font-size: 14px;
774
- background: var(--cl-orange);
775
- color: #fff;
776
- position: relative;
777
- transition: background .15s ease-in-out;
778
- font-weight: 600;
779
- }
780
- .sbi-chevron {
781
- position: absolute;
782
- right: 14px
783
- }
784
- .sbi-stck-el.sbi-stck-el-upgrd .sbi-stck-el-txt{
785
- color: #fff;
786
- }
787
- .sbi-stck-el.sbi-stck-el-upgrd:after{
788
- top: 20px;
789
- opacity: 1;
790
- }
791
- .sbi-stck-el-icon{
792
- margin-right: 10px;
793
- }
794
- .sbi-stck-el-icon svg{
795
- width: 17px;
796
- float: left;
797
- }
798
- .sbi-stck-title{
799
- margin-top: 20px;
800
- margin-bottom: 10px;
801
- color: #141B38;
802
- font-weight: 600;
803
- font-size: 14px;
804
- line-height: 160%;
805
- }
806
- .sbi-stck-follow{
807
- background: #F3F4F5;
808
- margin-top: 20px;
809
- left: 0px;
810
- bottom: 0px;
811
- position: absolute;
812
- padding: 12px 20px;
813
- display: flex;
814
- align-items: center;
815
- }
816
- .sbi-stck-follow span{
817
- font-weight: 600;
818
- font-size: 14px;
819
- }
820
- .sbi-stck-flw-links{
821
- display: flex;
822
- justify-content: center;
823
- align-items: center;
824
- margin-left: auto;
825
- }
826
- .sbi-stck-flw-links a{
827
- width: 36px;
828
- height: 28px;
829
- color: inherit;
830
- display: inline-flex;
831
- justify-content: center;
832
- align-items: center;
833
- margin-left: 4px;
834
- border-radius: 2px;
835
- transition: background .15s ease-in-out;
836
- }
837
- .sbi-stck-flw-links svg{
838
- width: 17px;
839
- color: #141B38;
840
- }
841
- .sbi-stck-flw-links a:hover{
842
- background: #fff;
843
- }
844
- .sbi-stck-flw-links a:hover svg{
845
- color: inherit;
846
- }
847
-
848
- /*** SB NOTIFICATION ELEMENT ***/
849
- .sb-notification-ctn{
850
- position: fixed;
851
- bottom: -100px;
852
- left: 200px;
853
- z-index: 99999;
854
- background: #fff;
855
- display: flex;
856
- justify-content: center;
857
- align-items: center;
858
- border-left: 3px solid #fff;
859
- line-height: 1em;
860
- padding: 10px 20px;
861
- padding-left: 0px;
862
- border-radius: 4px;
863
- box-shadow: 0px 26.7377px 77.2886px rgba(0, 0, 0, 0.107828), 0px 14.2952px 41.3222px rgba(0, 0, 0, 0.0894161), 0px 8.01379px 23.1649px rgba(0, 0, 0, 0.075), 0px 4.25607px 12.3027px rgba(0, 0, 0, 0.0605839), 0px 1.77104px 5.11942px rgba(0, 0, 0, 0.0421718);
864
-
865
- }
866
- .sb-notification-ctn[data-active="hidden"]{
867
- -webkit-animation: sbi-notification-hide .5s forwards linear;
868
- animation: sbi-notification-hide .5s forwards linear;
869
- }
870
- .sb-notification-ctn[data-active="shown"]{
871
- -webkit-animation: sbi-notification-show .5s forwards linear;
872
- animation: sbi-notification-show .5s forwards linear;
873
- }
874
- @-webkit-keyframes sbi-notification-show { 0%{bottom: -100px;} 50%{bottom: 70px;} 70%{bottom: 60px;} 85%{bottom: 65px;} 100%{bottom: 50px;}}
875
- @keyframes sbi-notification-show { 0%{bottom: -100px;} 50%{bottom: 70px;} 70%{bottom: 60px;} 85%{bottom: 65px;} 100%{bottom: 50px;}}
876
-
877
- @-webkit-keyframes sbi-notification-hide {0%{bottom: 50px;}55%{bottom: 65px;}70%{bottom: 60px;}85%{bottom: 70px;}100%{bottom: -100px;}}
878
- @keyframes sbi-notification-hide {0%{bottom: 50px;}55%{bottom: 65px;}70%{bottom: 60px;}85%{bottom: 70px;}100%{bottom: -100px;}}
879
-
880
- .sb-notification-ctn[data-type="success"]{
881
- border-color: #59AB46;
882
- }
883
- .sb-notification-ctn[data-type="error"]{
884
- border-color: #D72C2C;
885
- }
886
- .sb-notification-ctn[data-type="message"]{
887
- border-color: #141B38;
888
- }
889
- .sb-notification-icon{
890
- width: 25px;
891
- height: 25px;
892
- display: flex;
893
- justify-content: center;
894
- align-items: center;
895
- margin-left: 10px;
896
- margin-right: 15px;
897
- }
898
- .sb-notification-icon svg{
899
- width: 22px;
900
- height: 22px;
901
- float: left;
902
- fill: currentColor;
903
- }
904
-
905
- .sb-notification-ctn[data-type="success"] .sb-notification-icon{
906
- color: #59AB46;
907
- }
908
- .sb-notification-ctn[data-type="error"] .sb-notification-icon{
909
- color: #D72C2C;
910
- }
911
- .sb-notification-ctn[data-type="message"] .sb-notification-icon{
912
- color: #141B38;
913
- }
914
-
915
- .sb-notification-ctn span{
916
- font-size: 14px;
917
- color: #141B38;
918
- font-weight:500;
919
- }
920
-
921
- /*** 6.0 - RESPONSIVENESS ***/
922
- @media (max-width: 1024px) {
923
- .sbi-support-contact-block {
924
- flex-direction: column;
925
- }
926
- .sbi-support-contact-block .sb-contact-block-left,
927
- .sbi-support-contact-block .sb-contact-block-right {
928
- flex-basis: auto;
929
- }
930
- .sbi-support-contact-block .sb-contact-block-right {
931
- padding-top: 42px;
932
- padding-left: 0;
933
- border-left: 0px solid #DCDDE1;
934
- position: relative;
935
- }
936
-
937
- .sbi-support-contact-block .sb-contact-block-right:before {
938
- top: 25px;
939
- left: 0;
940
- width: 65px;
941
- height: 1px;
942
- background: #DCDDE1;
943
- position: absolute;
944
- content: '';
945
- }
946
- }
947
- @media (max-width: 767px) {
948
- .sbi-support-blocks {
949
- flex-direction: column;
950
- }
951
- .sbi-support-blocks .sbi-support-block {
952
- width: 100%;
953
- margin-bottom: 12px;
954
- }
955
- .auto-fold #wpcontent {
956
- padding-left: 0;
957
- }
958
- .sbi-fb-full-wrapper {
959
- padding: 70px 20px 0 20px;
960
- }
961
- .sbi-fb-hd-btn {
962
- padding: 0px 15px 0px 7px;
963
- }
964
- .sbi-fb-header {
965
- padding: 0px 20px;
966
- }
967
- .sbi-section-header,
968
- .sbi-export-settings-section {
969
- flex-wrap: wrap;
970
- }
971
- .sbi-section-header h2 {
972
- margin-bottom: 30px;
973
- }
974
- .sbi-section-header .sbi-search-doc {
975
- width: 100%;
976
- }
977
- .sbi-export-settings-section .sbi-export-left,
978
- .sbi-export-settings-section .sbi-export-right{
979
- width: 100%;
980
- }
981
- .sbi-export-settings-section .sbi-export-left {
982
- margin-bottom: 20px;
983
- }
984
- .sbi-export-settings-section .sbi-export-right {
985
- flex-wrap: wrap;
986
- }
987
- .sbi-export-settings-section .sbi-select {
988
- width: 100%;
989
- margin-bottom: 10px;
990
- }
991
- .sb-notification-ctn {
992
- left: 20px;
993
- }
994
- }
995
-
996
- @media (max-width: 580px) {
997
- .sbi-support-contact-block .sb-contact-block-left {
998
- flex-wrap: wrap;
999
- }
1000
- .sbi-support-contact-block .sb-contact-block-left .sb-cb-content {
1001
- margin-top: 20px;
1002
- }
1003
- }
1004
-
1005
- @media (max-width: 480px) {
1006
- .sbi-fb-hd-btn {
1007
- padding: 0px 10px 0px 7px !important;
1008
- }
1009
- .sbi-fb-hd-btn[data-icon="left"] {
1010
- padding-right: 10px!important;
1011
- }
1012
- }
1013
- .sb-button-standard{
1014
- position: relative;
1015
- font-style: normal;
1016
- font-weight: 600;
1017
- font-size: 14px;
1018
- padding: 10px 20px 10px 39px;
1019
- line-height: 16px;
1020
- height: auto;
1021
- }
1022
- .sb-button-standard svg {
1023
- width: 16px;
1024
- height: 16px;
1025
- position: absolute;
1026
- left: 13px;
1027
- right: auto;
1028
- top: 10px;
1029
- bottom: auto;
1030
- }
1031
- .sbi-stck-el.sbi-stck-el-upgrd svg path{
1032
- fill: #fff!important;
1033
- }
1
+ /*
2
+ * SUPPORT PAGE CSS TABLE OF CONTENTS
3
+ *
4
+ * 1.0 - GLOBAL
5
+ * 2.0 - HEADER
6
+ * 3.0 - 3.0 - SUPPORT CONTAINER
7
+ * 3.1 - SECTION HEADER
8
+ * 3.2 - SUPPORT BLOCK
9
+ * 3.3 - CONTACT SUPPORT BLOCK
10
+ * 4.0 - STICKY WIDGET
11
+ * 5.0 - SB NOTIFICATION ELEMENT
12
+ * 6.0 - RESPONSIVENESS
13
+ */
14
+
15
+ /*** 1.0 - GLOBAL ***/
16
+ .clearfix { display: inline-block; }
17
+ /* start commented backslash hack \*/
18
+ * html .clearfix { height: 1%; }
19
+ .clearfix { display: block; }
20
+ #sbi-support {
21
+ -webkit-font-smoothing: antialiased;
22
+ font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
23
+ }
24
+ #wpcontent {
25
+ padding-left: 0px;
26
+ }
27
+ #wpbody-content {
28
+ padding-bottom: 40px;
29
+ }
30
+ .clearfix:after {
31
+ visibility: hidden;
32
+ display: block;
33
+ font-size: 0;
34
+ content: " ";
35
+ clear: both;
36
+ height: 0;
37
+ }
38
+ /*orange*/
39
+ .sb-btn-orange{
40
+ background: #E34F0E!important;
41
+ color: #fff!important;
42
+ }
43
+ .sb-btn-orange:hover{
44
+ background: #F37036!important;
45
+ color: #fff!important;
46
+ }
47
+ .sb-btn-orange:focus,
48
+ .sb-btn-orange:active{
49
+ background: #B8400B!important;
50
+ color: #fff!important;
51
+ }
52
+ .sbi-fb-cp-clpboard{
53
+ width: 0px;
54
+ height: 0px;
55
+ position: absolute;
56
+ left: -100000px;
57
+ }
58
+ .sbi-fb-full-wrapper{
59
+ padding: 0 53px;
60
+ padding-top: 82px;
61
+ }
62
+ .sbi-fb-fs {
63
+ width: 100%;
64
+ position: relative;
65
+ float: left;
66
+ box-sizing: border-box;
67
+ }
68
+ #adminmenu a[href="admin.php?page=sbi-support"] {
69
+ display: none;
70
+ }
71
+
72
+ .sb-btn-grey:not(:disabled){
73
+ background: #F3F4F5!important;
74
+ color: #141B38!important;
75
+ border: 1px solid #D0D1D7!important;
76
+ }
77
+ .sb-btn-grey:not(:disabled):hover{
78
+ background: #fff!important;
79
+ color: #141B38!important;
80
+ border: 1px solid #DCDDE1!important;
81
+ }
82
+ .sb-btn-grey:not(:disabled):focus,
83
+ .sb-btn-grey:not(:disabled):active{
84
+ background: #E8E8EB!important;
85
+ color: #141B38!important;
86
+ border: 1px solid #D0D1D7!important;
87
+ }
88
+
89
+ /*** 2.0 - HEADER ***/
90
+ .sbi-fb-create-ctn{
91
+ margin-top: 90px;
92
+ }
93
+ .sbi-fb-header{
94
+ height: 64px;
95
+ position: absolute;
96
+ display: flex;
97
+ flex-direction: row;
98
+ justify-content: space-between;
99
+ align-items: center;
100
+ background: #fff;
101
+ padding: 0px 52px;
102
+ z-index: 2;
103
+ }
104
+ .sbi-fb-header-left {
105
+ display: flex;
106
+ }
107
+ .sbi-fb-header-left .sb-social-wall-link-wrap {
108
+ margin-left: 30px;
109
+ }
110
+ .sb-social-wall-link-wrap {
111
+ display: flex;
112
+ font-size: 14px;
113
+ margin: 10px 0 10px 30px;
114
+ }
115
+ .sb-social-wall-link:first-child {
116
+ padding-left: 0;
117
+ border-right: 1px solid #ccc;
118
+ color: #0068A0!important;
119
+ line-height: 1;
120
+ }
121
+ .sb-social-wall-link {
122
+ padding: 0 12px;
123
+ border-right: 1px solid #ccc;
124
+ color: #0068A0!important;
125
+ line-height: 1;
126
+ }
127
+ .sb-social-wall-link a {
128
+ text-decoration: none;
129
+ }
130
+ .sb-social-wall-link a:focus {
131
+ outline: none;
132
+ box-shadow: none;
133
+ }
134
+ .sb-social-wall-link:last-child {
135
+ border-right: none;
136
+ }
137
+ .sbi-fb-hd-logo{
138
+ display: flex;
139
+ vertical-align: middle;
140
+ align-items: center;
141
+ gap: 5px;
142
+ }
143
+ .sbi-fb-hd-logo .sb-logo-letters-wrap {
144
+ transform: translate(0px, -2px);
145
+ }
146
+ .sbi-fb-hd-logo .breadcrumb-title{
147
+ font-size: 14px;
148
+ font-weight: 400;
149
+ line-height: 22px;
150
+ letter-spacing: 0em;
151
+ margin-left: 4px;
152
+ }
153
+ .sbi-fb-hd-logo .separator{
154
+ margin: 0 5px 0 10px;
155
+ }
156
+ .sbi-fb-hd-btn{
157
+ height: 38px;
158
+ cursor: pointer;
159
+ display: flex;
160
+ flex-direction: row;
161
+ justify-content: center;
162
+ align-items: center;
163
+ padding: 0px 15px 0px 16px;
164
+ font-weight: 600;
165
+ font-size:14px;
166
+ color: #353A41;
167
+ background: #F3F4F5;
168
+ border-radius: 2px;
169
+ border: 1px solid #DCDDE1;
170
+ position: relative;
171
+ text-decoration: none;
172
+ transition: all 0.15s ease-in-out;
173
+ }
174
+ .sbi-fb-hd-btn:focus {
175
+ outline: none;
176
+ box-shadow: none;
177
+ }
178
+ .sbi-fb-hd-btn:hover {
179
+ color: inherit;
180
+ background-color: #fff;
181
+ }
182
+ .sbi-fb-hd-btn i{
183
+ margin: 0px 5px;
184
+ }
185
+ .sbi-fb-hd-btn[data-icon="left"]{
186
+ padding-right: 20px!important;
187
+ }
188
+ .sbi-fb-full-wrapper .section-header h1 {
189
+ font-size: 32px;
190
+ line-height: 40px;
191
+ }
192
+ /*** 3.0 - SUPPORT CONTAINER ***/
193
+ .sbi-sb-container {
194
+ max-width: 885px;
195
+ position: relative;
196
+ margin: auto;
197
+ margin-top: 33px;
198
+ box-sizing: border-box;
199
+ }
200
+
201
+ /*** 3.1 - SECTION HEADER ***/
202
+ .sbi-section-header {
203
+ display: flex;
204
+ justify-content: space-between;
205
+ align-items: center;
206
+ }
207
+ .sbi-section-header h2{
208
+ font-weight: 600;
209
+ font-size: 32px;
210
+ line-height: 40px;
211
+ color: #141B38;
212
+ margin: 0;
213
+ }
214
+ .sbi-section-header .sbi-search-doc .sbi-search-doc-field {
215
+ position: relative;
216
+ background: #fff;
217
+ border: 1px solid #DCDDE1;
218
+ min-width: 283px;
219
+ box-sizing: border-box;
220
+ height: 38px;
221
+ padding: 0px 14px 0px 15px;
222
+ font-weight: 600;
223
+ font-size: 14px;
224
+ line-height: 22px;
225
+ color: #141B38;
226
+ text-decoration: none;
227
+ margin-right: 1px;
228
+ }
229
+ .sbi-section-header .sbi-search-doc .sbi-search-doc-field .sb-btn-input {
230
+ height: 100%;
231
+ border: none;
232
+ outline: none;
233
+ background-color: transparent;
234
+ margin-left: 25px;
235
+ color: #141B38;
236
+ min-width: 200px;
237
+ transform: translateY(-1px);
238
+ }
239
+ .sbi-section-header .sbi-search-doc .sbi-search-doc-field .sb-btn-input::placeholder {
240
+ color: #141B38;
241
+ }
242
+ .sbi-section-header .sbi-search-doc .sbi-search-doc-field:focus,
243
+ .sbi-section-header .sbi-search-doc .sbi-search-doc-field .sb-btn-input:focus {
244
+ outline: none;
245
+ box-shadow: none;
246
+ }
247
+ .sbi-section-header .sbi-search-doc .sbi-search-doc-field .sb-btn-icon {
248
+ position: absolute;
249
+ left: 15px;
250
+ top: 11px;
251
+ cursor: pointer;
252
+ }
253
+ .sbi-section-header .sbi-search-doc .sbi-search-doc-field .sb-btn-link-icon{
254
+ cursor: pointer;
255
+ position: absolute;
256
+ right: 2px;
257
+ top: 0;
258
+ width: 35px;
259
+ text-align: center;
260
+ height: 100%;
261
+ padding-top: 9px;
262
+ box-sizing: border-box;
263
+ }
264
+ .sbi-section-header .sbi-search-doc a .sb-btn-link-icon{
265
+ margin-left: 56px;
266
+ }
267
+ /*** 3.2 - SUPPORT BLOCK ***/
268
+ .sbi-support-blocks {
269
+ margin-top: 22px;
270
+ display: flex;
271
+ }
272
+ .sbi-support-blocks .sbi-support-block {
273
+ padding: 22px 18px;
274
+ background: #FFFFFF;
275
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
276
+ border-radius: 2px;
277
+ width: calc(33% - 7px);
278
+ box-sizing: border-box;
279
+ position: relative;
280
+ }
281
+ .sbi-support-blocks .sbi-support-block:not(:last-child) {
282
+ margin-right: 14px;
283
+ }
284
+ .sbi-support-blocks .sbi-support-block h3 {
285
+ font-style: normal;
286
+ font-weight: 600;
287
+ font-size: 18px;
288
+ line-height: 25px;
289
+ color: #141B38;
290
+ margin-top: 15px;
291
+ margin-bottom: 0;
292
+ }
293
+ .sbi-support-blocks .sbi-support-block p {
294
+ font-size: 12px;
295
+ line-height: 18px;
296
+ color: #64748B;
297
+ margin-top: 5px;
298
+ }
299
+ .sb-block-header img {
300
+ width: 56px;
301
+ height: 56px;
302
+ }
303
+ .sb-articles-list {
304
+ margin-top: 31px;
305
+ margin-bottom: 79px;
306
+ }
307
+
308
+ .sb-articles-list ul li {
309
+ position: relative;
310
+ margin: 0px;
311
+ padding-right: 10px;
312
+ }
313
+ .sb-articles-list ul li:not(:last-child) {
314
+ border-bottom: 1px solid #E8E8EB;
315
+ position: relative;
316
+ }
317
+ .sb-articles-list ul li a {
318
+ font-size: 14px;
319
+ line-height: 22px;
320
+ color: #141B38;
321
+ text-decoration: none;
322
+ display: block;
323
+ padding: 13px 0;
324
+ }
325
+ .sb-articles-list ul li:not(:last-child):after {
326
+ content: '';
327
+ position: absolute;
328
+ left: 0px;
329
+ bottom: -1px;
330
+ background-color: #0068A0;
331
+ height: 1px;
332
+ width: 0;
333
+ transition: all 0.25s ease-in-out;
334
+ }
335
+ .sb-articles-list ul li:not(:last-child):hover:after {
336
+ width: 100%;
337
+ }
338
+ .sb-articles-list ul li a:hover {
339
+ color: #0068A0;
340
+ }
341
+ .sb-articles-list ul li .sb-list-icon {
342
+ position: absolute;
343
+ right: 0;
344
+ top: calc(50% - 9px);
345
+ }
346
+ .sb-articles-list ul li .sb-list-icon svg {
347
+ width: 5px;
348
+ }
349
+ .sb-articles-list ul li .sb-list-icon svg path {
350
+ fill: #8C8F9A;
351
+ }
352
+ .sbi-support-blocks .sbi-sb-button {
353
+ margin-top: 50px;
354
+ position: absolute;
355
+ left: 0;
356
+ bottom: 20px;
357
+ width: calc(100% - 40px);
358
+ padding: 0 20px;
359
+ }
360
+ .sbi-support-blocks .sbi-sb-button .sb-btn-icon {
361
+ margin-left: 8px;
362
+ }
363
+ .sbi-support-blocks .sbi-sb-button .sb-btn-icon svg {
364
+ width: 5px;
365
+ transform: translateY(0px);
366
+ margin-left: 3px;
367
+ }
368
+ .sbi-support-blocks .sbi-sb-button a {
369
+ background: #F3F4F5;
370
+ border: 1px solid #DCDDE1;
371
+ box-sizing: border-box;
372
+ border-radius: 2px;
373
+ font-weight: 600;
374
+ font-size: 12px;
375
+ line-height: 19px;
376
+ color: #141B38;
377
+ display: block;
378
+ text-align: center;
379
+ text-decoration: none;
380
+ padding: 6px;
381
+ transition: all 0.15s ease-in-out;
382
+ }
383
+ .sbi-support-blocks .sbi-sb-button a:hover,
384
+ .sbi-section-header .sbi-search-doc a:hover {
385
+ background: #FFFFFF;
386
+ border: 1px solid #D0D1D7;
387
+ }
388
+ .sbi-support-blocks .sbi-sb-button a:focus,
389
+ .sbi-support-blocks .sbi-sb-button a:active,
390
+ .sbi-section-header .sbi-search-doc a:focus,
391
+ .sbi-section-header .sbi-search-doc a:active {
392
+ background: #E8E8EB;
393
+ border: 1px solid #D0D1D7;
394
+ }
395
+
396
+ /*** 3.3 - CONTACT SUPPORT BLOCK ***/
397
+ .sbi-support-contact-block {
398
+ background: #FFFFFF;
399
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
400
+ border-radius: 2px;
401
+ padding: 20px 20px 23px;
402
+ margin-top: 28px;
403
+ box-sizing: border-box;
404
+ margin-bottom: 12px;
405
+ display: flex;
406
+ }
407
+ .sbi-support-contact-block .sb-cb-content h3{
408
+ font-size: 24px;
409
+ line-height: 29px;
410
+ color: #141B38;
411
+ margin: 0;
412
+ margin-bottom: 16px;
413
+ }
414
+ .sbi-support-contact-block .sb-cb-icon {
415
+ margin-right: 30px;
416
+ }
417
+ .sbi-support-contact-block .sb-cb-icon span{
418
+ background: #E8E8EB;
419
+ border-radius: 60px;
420
+ width: 68px;
421
+ height: 68px;
422
+ display: inline-block;
423
+ text-align: center;
424
+ padding-top: 22px;
425
+ box-sizing: border-box;
426
+ }
427
+ .sbi-support-contact-block .sb-cb-btn{
428
+ background: #E34F0E;
429
+ border-radius: 2px;
430
+ color: #fff;
431
+ text-decoration: none;
432
+ display: inline-block;
433
+ padding: 8px 12px;
434
+ font-size: 14px;
435
+ }
436
+ .sbi-support-contact-block .sb-cb-btn:hover {
437
+ background: #F37036;
438
+ border-color: #F37036;
439
+ }
440
+
441
+ .sbi-support-contact-block .sb-cb-btn:focus,
442
+ .sbi-support-contact-block .sb-cb-btn:active {
443
+ background: #B8400B;
444
+ border-color: #B8400B;
445
+ outline: none;
446
+ box-shadow: none;
447
+ }
448
+ .sbi-support-contact-block .sb-cb-btn span {
449
+ margin-left: 11px;
450
+ }
451
+ .sbi-support-contact-block .sb-cb-btn svg {
452
+ width: 5px;
453
+ }
454
+ .sbi-support-contact-block .sb-cb-btn path {
455
+ fill: #fff;
456
+ }
457
+ .sbi-support-contact-block .sb-contact-block-left{
458
+ flex-basis: 625px;
459
+ /* width: 625px; */
460
+ /* float: left; */
461
+ display: flex;
462
+ padding-top: 10px;
463
+ box-sizing: border-box;
464
+ }
465
+ .sbi-support-contact-block .sb-contact-block-right {
466
+ flex-basis: 220px;
467
+ /* width: 220px;
468
+ float: left; */
469
+ padding-top: 10px;
470
+ padding-left: 32px;
471
+ box-sizing: border-box;
472
+ border-left: 1px solid #DCDDE1;
473
+ }
474
+ .sbi-support-contact-block .sb-contact-block-right p {
475
+ font-size: 12px;
476
+ line-height: 18px;
477
+ color: #141B38;
478
+ }
479
+ .sbi-support-contact-block .sb-contact-block-right img {
480
+ max-width: 65px;
481
+ }
482
+
483
+ /*** 3.4 - SYSTEM INFO BLOCK ***/
484
+ .sbi-system-info-section {
485
+ background: #FFFFFF;
486
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
487
+ border-radius: 2px;
488
+ }
489
+ .sbi-system-info-section .sbi-system-header{
490
+ display: flex;
491
+ padding: 12px 20px 0;
492
+ justify-content: space-between;
493
+ }
494
+ .sbi-system-info-section .sbi-system-header h3 {
495
+ font-weight: 600;
496
+ font-size: 18px;
497
+ line-height: 25px;
498
+ color: #141B38;
499
+ margin-top: 9px;
500
+ }
501
+ .sbi-system-info-section .sbi-system-header .sbi-copy-btn {
502
+ background: #F3F4F5;
503
+ border: 1px solid #DCDDE1;
504
+ box-sizing: border-box;
505
+ border-radius: 2px;
506
+ font-size: 14px;
507
+ font-weight: 600;
508
+ line-height: 22px;
509
+ color: #141B38;
510
+ height: 38px;
511
+ padding: 5px 20px 5px 12px;
512
+ cursor: pointer;
513
+ transition: all 0.15s ease-in-out;
514
+ }
515
+ .sbi-system-info-section .sbi-system-header .sbi-copy-btn:hover {
516
+ background: #FFFFFF;
517
+ border: 1px solid #D0D1D7;
518
+ }
519
+ .sbi-system-info-section .sbi-system-header .sbi-copy-btn:focus,
520
+ .sbi-system-info-section .sbi-system-header .sbi-copy-btn:active {
521
+ background: #E8E8EB;
522
+ border: 1px solid #D0D1D7;
523
+ }
524
+ .sbi-system-info-section .sbi-system-header .sbi-copy-btn svg {
525
+ height: 19px;
526
+ width: 19px;
527
+ transform: translate(0px, 4px);
528
+ margin-right: 5px;
529
+ }
530
+ .sbi-system-info-section .sbi-system-info {
531
+ padding: 0 20px 20px;
532
+ border-bottom: 1px solid #E8E8EB;
533
+ }
534
+ .sbi-system-info-section .sbi-system-info .system_info:focus {
535
+ outline: none;
536
+ box-shadow: none;
537
+ }
538
+ .sbi-system-info-section .sbi-system-info .system_info a {
539
+ color: #0068A0;
540
+ }
541
+ .sbi-system-info-section .sbi-system-info .system_info {
542
+ box-sizing: border-box;
543
+ background: #F9F9FA;
544
+ border: 1px solid #E8E8EB;
545
+ width: 100%;
546
+ resize: none;
547
+ border-radius: 0;
548
+ padding: 20px 28px;
549
+ font-size: 12px;
550
+ line-height: 18px;
551
+ color: #141B38;
552
+ width: 100%;
553
+ height: 123px;
554
+ font-family: 'Fira Code', monospace;
555
+ word-break: break-all;
556
+ }
557
+ .sbi-system-info-section .sbi-system-info .system_info.expanded {
558
+ height: 600px;
559
+ overflow-x: hidden;
560
+ overflow-y: scroll;
561
+ }
562
+ .sbi-system-info-section .sbi-system-info .system_info.collapsed {
563
+ overflow: hidden;
564
+ }
565
+ .sbi-system-info-section .sbi-system-info .sbi-expand-btn {
566
+ padding: 8px 12px 8px 8px;
567
+ background: #FFFFFF;
568
+ border: 1px solid #D0D1D7;
569
+ border-radius: 2px;
570
+ font-size: 12px;
571
+ line-height: 19px;
572
+ color: #141B38;
573
+ width: 100%;
574
+ margin-top: -5px;
575
+ z-index: 9;
576
+ position: relative;
577
+ font-weight: 500;
578
+ cursor: pointer;
579
+ transition: all .15s ease-in-out;
580
+ }
581
+ .sbi-system-info-section .sbi-system-info .sbi-expand-btn:hover {
582
+ background: #F3F4F5;
583
+ border: 1px solid #DCDDE1;
584
+ }
585
+ .sbi-system-info-section .sbi-system-info .sbi-expand-btn span {
586
+ margin-right: 10px;
587
+ }
588
+ .sbi-system-info-section .sbi-system-info .sbi-expand-btn:focus,
589
+ .sbi-system-info-section .sbi-system-info .sbi-expand-btn:active{
590
+ background: #E8E8EB!important;
591
+ color: #141B38!important;
592
+ border: 1px solid #D0D1D7!important;
593
+ }
594
+ .sbi-export-settings-section {
595
+ background: #FFFFFF;
596
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
597
+ border-radius: 2px;
598
+ padding: 20px;
599
+ background: #FFFFFF;
600
+ display: flex;
601
+ justify-content: space-between;
602
+ }
603
+ .sbi-export-settings-section .sbi-export-right{
604
+ display: flex;
605
+ }
606
+ .sbi-export-settings-section .sbi-export-left h3 {
607
+ font-style: normal;
608
+ font-weight: 600;
609
+ font-size: 18px;
610
+ line-height: 25px;
611
+ color: #141B38;
612
+ margin: 0 0 4px 0;
613
+ }
614
+ .sbi-export-settings-section .sbi-export-left p {
615
+ font-size: 12px;
616
+ line-height: 18px;
617
+ color: #141B38;
618
+ margin: 0;
619
+ }
620
+ .sbi-export-settings-section .sbi-select{
621
+ min-width: 234px;
622
+ border: 1px solid #D0D1D7;
623
+ padding: 3px 15px;
624
+ height: 38px;
625
+ font-size: 14px;
626
+ color: #141B38;
627
+ -webkit-appearance: none;
628
+ appearance: none;
629
+ margin-right: 8px;
630
+ background: #fff url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAFCAYAAAB8ZH1oAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABSSURBVHgBfc4hCkAhDAbgjV3slQcvvHuYDWY1G8zewyIWb6YuCCLqD4Pt5wtD54NBQA2XVKiWcorl/X7s+DkhJYUhPk54IN5plCue0Tb8M8/aNx/uIpRVqbbFAAAAAElFTkSuQmCC') no-repeat right 15px top 55%;
631
+ }
632
+ .sbi-export-settings-section .sbi-btn {
633
+ height: 38px;
634
+ font-size: 14px;
635
+ padding: 7px 20px 7px 16px;
636
+ display: flex;
637
+ align-items: center;
638
+ vertical-align: middle;
639
+ background: #F3F4F5;
640
+ border: 1px solid #DCDDE1;
641
+ border-radius: 2px;
642
+ font-weight: 500;
643
+ transition: all .15s ease-in-out;
644
+ cursor: pointer;
645
+ }
646
+ .sbi-export-settings-section .sbi-btn:disabled {
647
+ cursor: not-allowed;
648
+ color: #8C8F9A;
649
+ background: #F3F4F5;
650
+ }
651
+ .sbi-export-settings-section .sbi-btn:disabled:hover {
652
+ color: #8C8F9A;
653
+ }
654
+ .sbi-export-settings-section .sbi-btn span {
655
+ margin-right: 11px;
656
+ transform: translate(0px, 2px);
657
+ }
658
+ .sbi-export-settings-section .sbi-btn:disabled span path {
659
+ fill: #8C8F9A;
660
+ }
661
+ .sbi-support-contact-block {}
662
+
663
+
664
+ /*** 4.0 Sticky Widget ***/
665
+ .sbi-stck-wdg{
666
+ position: fixed;
667
+ right: 21px;
668
+ z-index: 9;
669
+ bottom: 20px;
670
+ }
671
+ .sbi-stck-wdg-btn{
672
+ width: 52px;
673
+ height: 52px;
674
+ background: #fff;
675
+ border-radius: 50%;
676
+ cursor: pointer;
677
+ display: flex;
678
+ justify-content: center;
679
+ align-items: center;
680
+ filter: drop-shadow(0px 9px 13px rgba(0, 0, 0, 0.2));
681
+ }
682
+ .sbi-stck-wdg-btn svg{
683
+ width: 25px;
684
+ fill: #E34F0E;
685
+ height: 33px;
686
+ float: left;
687
+ }
688
+
689
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls,
690
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls svg{
691
+ display: block;
692
+ }
693
+ .sbi-stck-wdg-btn-cls{
694
+ width: inherit;
695
+ height: inherit;
696
+ position: relative;
697
+ color: #364152;
698
+ box-shadow: 0px 1px 6px rgb(0 0 0 / 5%), 0px 9px 12px rgb(0 0 0 / 5%);
699
+ border-radius: 70px;
700
+ }
701
+ .sbi-stck-wdg-btn-cls svg {
702
+ width: 14px;
703
+ height: 14px;
704
+ position: absolute;
705
+ top: 50%;
706
+ right: 0;
707
+ bottom: 0;
708
+ left: 50%;
709
+ margin-top: -7px;
710
+ margin-left: -7px;
711
+ }
712
+
713
+ .sbi-stck-pop{
714
+ position: absolute;
715
+ width: 292px;
716
+ height: auto;
717
+ background: #fff;
718
+ border: 1px solid #E2E8F0;
719
+ box-sizing: border-box;
720
+ box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15), 0px 3px 14px rgba(0, 0, 0, 0.12);
721
+ border-radius: 2px;
722
+ padding: 20px;
723
+ right: 0px;
724
+ bottom: 66px;
725
+ color: #141B38;
726
+ padding-bottom: 82px;
727
+ }
728
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-pop{
729
+ bottom: 66px;
730
+ opacity: 1;
731
+ visibility: visible;
732
+ }
733
+
734
+ .sbi-stck-pop svg{
735
+ fill: currentColor;
736
+ }
737
+ .sbi-stck-el-list{
738
+ border: 1px solid #DCDDE1;
739
+ border-radius: 2px;
740
+ }
741
+ .sbi-stck-el{
742
+ display: flex;
743
+ align-items: center;
744
+ padding: 11px 13px;
745
+ border-bottom: 1px solid #DCDDE1;
746
+ transition: background .15s ease-in-out;
747
+ font-size: 12px;
748
+ }
749
+ .sbi-stck-el:hover{
750
+ background: #F3F4F5;
751
+ }
752
+ .sbi-stck-el:last-of-type{
753
+ border-bottom: 0px;
754
+ }
755
+ .sbi-stck-el-list .sbi-chevron svg{
756
+ width: 5px;
757
+ height: 8px;
758
+ }
759
+ .sbi-fs-a {
760
+ width: 100%;
761
+ height: 100%;
762
+ display: block;
763
+ position: absolute;
764
+ left: 0;
765
+ top: 0;
766
+ z-index: 1;
767
+ }
768
+ .sbi-stck-el .sbi-stck-el-txt{
769
+ color: #27303F;
770
+ }
771
+ .sbi-stck-el.sbi-stck-el-upgrd{
772
+ padding: 9px 14px;
773
+ font-size: 14px;
774
+ background: var(--cl-orange);
775
+ color: #fff;
776
+ position: relative;
777
+ transition: background .15s ease-in-out;
778
+ font-weight: 600;
779
+ }
780
+ .sbi-chevron {
781
+ position: absolute;
782
+ right: 14px
783
+ }
784
+ .sbi-stck-el.sbi-stck-el-upgrd .sbi-stck-el-txt{
785
+ color: #fff;
786
+ }
787
+ .sbi-stck-el.sbi-stck-el-upgrd:after{
788
+ top: 20px;
789
+ opacity: 1;
790
+ }
791
+ .sbi-stck-el-icon{
792
+ margin-right: 10px;
793
+ }
794
+ .sbi-stck-el-icon svg{
795
+ width: 17px;
796
+ float: left;
797
+ }
798
+ .sbi-stck-title{
799
+ margin-top: 20px;
800
+ margin-bottom: 10px;
801
+ color: #141B38;
802
+ font-weight: 600;
803
+ font-size: 14px;
804
+ line-height: 160%;
805
+ }
806
+ .sbi-stck-follow{
807
+ background: #F3F4F5;
808
+ margin-top: 20px;
809
+ left: 0px;
810
+ bottom: 0px;
811
+ position: absolute;
812
+ padding: 12px 20px;
813
+ display: flex;
814
+ align-items: center;
815
+ }
816
+ .sbi-stck-follow span{
817
+ font-weight: 600;
818
+ font-size: 14px;
819
+ }
820
+ .sbi-stck-flw-links{
821
+ display: flex;
822
+ justify-content: center;
823
+ align-items: center;
824
+ margin-left: auto;
825
+ }
826
+ .sbi-stck-flw-links a{
827
+ width: 36px;
828
+ height: 28px;
829
+ color: inherit;
830
+ display: inline-flex;
831
+ justify-content: center;
832
+ align-items: center;
833
+ margin-left: 4px;
834
+ border-radius: 2px;
835
+ transition: background .15s ease-in-out;
836
+ }
837
+ .sbi-stck-flw-links svg{
838
+ width: 17px;
839
+ color: #141B38;
840
+ }
841
+ .sbi-stck-flw-links a:hover{
842
+ background: #fff;
843
+ }
844
+ .sbi-stck-flw-links a:hover svg{
845
+ color: inherit;
846
+ }
847
+
848
+ /*** SB NOTIFICATION ELEMENT ***/
849
+ .sb-notification-ctn{
850
+ position: fixed;
851
+ bottom: -100px;
852
+ left: 200px;
853
+ z-index: 99999;
854
+ background: #fff;
855
+ display: flex;
856
+ justify-content: center;
857
+ align-items: center;
858
+ border-left: 3px solid #fff;
859
+ line-height: 1em;
860
+ padding: 10px 20px;
861
+ padding-left: 0px;
862
+ border-radius: 4px;
863
+ box-shadow: 0px 26.7377px 77.2886px rgba(0, 0, 0, 0.107828), 0px 14.2952px 41.3222px rgba(0, 0, 0, 0.0894161), 0px 8.01379px 23.1649px rgba(0, 0, 0, 0.075), 0px 4.25607px 12.3027px rgba(0, 0, 0, 0.0605839), 0px 1.77104px 5.11942px rgba(0, 0, 0, 0.0421718);
864
+
865
+ }
866
+ .sb-notification-ctn[data-active="hidden"]{
867
+ -webkit-animation: sbi-notification-hide .5s forwards linear;
868
+ animation: sbi-notification-hide .5s forwards linear;
869
+ }
870
+ .sb-notification-ctn[data-active="shown"]{
871
+ -webkit-animation: sbi-notification-show .5s forwards linear;
872
+ animation: sbi-notification-show .5s forwards linear;
873
+ }
874
+ @-webkit-keyframes sbi-notification-show { 0%{bottom: -100px;} 50%{bottom: 70px;} 70%{bottom: 60px;} 85%{bottom: 65px;} 100%{bottom: 50px;}}
875
+ @keyframes sbi-notification-show { 0%{bottom: -100px;} 50%{bottom: 70px;} 70%{bottom: 60px;} 85%{bottom: 65px;} 100%{bottom: 50px;}}
876
+
877
+ @-webkit-keyframes sbi-notification-hide {0%{bottom: 50px;}55%{bottom: 65px;}70%{bottom: 60px;}85%{bottom: 70px;}100%{bottom: -100px;}}
878
+ @keyframes sbi-notification-hide {0%{bottom: 50px;}55%{bottom: 65px;}70%{bottom: 60px;}85%{bottom: 70px;}100%{bottom: -100px;}}
879
+
880
+ .sb-notification-ctn[data-type="success"]{
881
+ border-color: #59AB46;
882
+ }
883
+ .sb-notification-ctn[data-type="error"]{
884
+ border-color: #D72C2C;
885
+ }
886
+ .sb-notification-ctn[data-type="message"]{
887
+ border-color: #141B38;
888
+ }
889
+ .sb-notification-icon{
890
+ width: 25px;
891
+ height: 25px;
892
+ display: flex;
893
+ justify-content: center;
894
+ align-items: center;
895
+ margin-left: 10px;
896
+ margin-right: 15px;
897
+ }
898
+ .sb-notification-icon svg{
899
+ width: 22px;
900
+ height: 22px;
901
+ float: left;
902
+ fill: currentColor;
903
+ }
904
+
905
+ .sb-notification-ctn[data-type="success"] .sb-notification-icon{
906
+ color: #59AB46;
907
+ }
908
+ .sb-notification-ctn[data-type="error"] .sb-notification-icon{
909
+ color: #D72C2C;
910
+ }
911
+ .sb-notification-ctn[data-type="message"] .sb-notification-icon{
912
+ color: #141B38;
913
+ }
914
+
915
+ .sb-notification-ctn span{
916
+ font-size: 14px;
917
+ color: #141B38;
918
+ font-weight:500;
919
+ }
920
+
921
+ /*** 6.0 - RESPONSIVENESS ***/
922
+ @media (max-width: 1024px) {
923
+ .sbi-support-contact-block {
924
+ flex-direction: column;
925
+ }
926
+ .sbi-support-contact-block .sb-contact-block-left,
927
+ .sbi-support-contact-block .sb-contact-block-right {
928
+ flex-basis: auto;
929
+ }
930
+ .sbi-support-contact-block .sb-contact-block-right {
931
+ padding-top: 42px;
932
+ padding-left: 0;
933
+ border-left: 0px solid #DCDDE1;
934
+ position: relative;
935
+ }
936
+
937
+ .sbi-support-contact-block .sb-contact-block-right:before {
938
+ top: 25px;
939
+ left: 0;
940
+ width: 65px;
941
+ height: 1px;
942
+ background: #DCDDE1;
943
+ position: absolute;
944
+ content: '';
945
+ }
946
+ }
947
+ @media (max-width: 767px) {
948
+ .sbi-support-blocks {
949
+ flex-direction: column;
950
+ }
951
+ .sbi-support-blocks .sbi-support-block {
952
+ width: 100%;
953
+ margin-bottom: 12px;
954
+ }
955
+ .auto-fold #wpcontent {
956
+ padding-left: 0;
957
+ }
958
+ .sbi-fb-full-wrapper {
959
+ padding: 70px 20px 0 20px;
960
+ }
961
+ .sbi-fb-hd-btn {
962
+ padding: 0px 15px 0px 7px;
963
+ }
964
+ .sbi-fb-header {
965
+ padding: 0px 20px;
966
+ }
967
+ .sbi-section-header,
968
+ .sbi-export-settings-section {
969
+ flex-wrap: wrap;
970
+ }
971
+ .sbi-section-header h2 {
972
+ margin-bottom: 30px;
973
+ }
974
+ .sbi-section-header .sbi-search-doc {
975
+ width: 100%;
976
+ }
977
+ .sbi-export-settings-section .sbi-export-left,
978
+ .sbi-export-settings-section .sbi-export-right{
979
+ width: 100%;
980
+ }
981
+ .sbi-export-settings-section .sbi-export-left {
982
+ margin-bottom: 20px;
983
+ }
984
+ .sbi-export-settings-section .sbi-export-right {
985
+ flex-wrap: wrap;
986
+ }
987
+ .sbi-export-settings-section .sbi-select {
988
+ width: 100%;
989
+ margin-bottom: 10px;
990
+ }
991
+ .sb-notification-ctn {
992
+ left: 20px;
993
+ }
994
+ }
995
+
996
+ @media (max-width: 580px) {
997
+ .sbi-support-contact-block .sb-contact-block-left {
998
+ flex-wrap: wrap;
999
+ }
1000
+ .sbi-support-contact-block .sb-contact-block-left .sb-cb-content {
1001
+ margin-top: 20px;
1002
+ }
1003
+ }
1004
+
1005
+ @media (max-width: 480px) {
1006
+ .sbi-fb-hd-btn {
1007
+ padding: 0px 10px 0px 7px !important;
1008
+ }
1009
+ .sbi-fb-hd-btn[data-icon="left"] {
1010
+ padding-right: 10px!important;
1011
+ }
1012
+ }
1013
+ .sb-button-standard{
1014
+ position: relative;
1015
+ font-style: normal;
1016
+ font-weight: 600;
1017
+ font-size: 14px;
1018
+ padding: 10px 20px 10px 39px;
1019
+ line-height: 16px;
1020
+ height: auto;
1021
+ }
1022
+ .sb-button-standard svg {
1023
+ width: 16px;
1024
+ height: 16px;
1025
+ position: absolute;
1026
+ left: 13px;
1027
+ right: auto;
1028
+ top: 10px;
1029
+ bottom: auto;
1030
+ }
1031
+ .sbi-stck-el.sbi-stck-el-upgrd svg path{
1032
+ fill: #fff!important;
1033
+ }
admin/assets/img/about/api-error.png CHANGED
File without changes
admin/assets/img/about/icon-full.svg CHANGED
File without changes
admin/assets/img/about/icon-none.svg CHANGED
File without changes
admin/assets/img/about/icon-partial.svg CHANGED
File without changes
admin/assets/img/about/plugin-if.png CHANGED
File without changes
admin/assets/img/about/plugin-mi.png CHANGED
File without changes
admin/assets/img/about/plugin-om.png CHANGED
File without changes
admin/assets/img/about/plugin-rp.png CHANGED
File without changes
admin/assets/img/about/plugin-seo.png CHANGED
File without changes
admin/assets/img/about/plugin-smtp.png CHANGED
File without changes
admin/assets/img/about/plugin-tw.jpg CHANGED
File without changes
admin/assets/img/about/plugin-wpforms.png CHANGED
File without changes
admin/assets/img/about/plugin-yt.png CHANGED
File without changes
admin/assets/img/balloon-120.png CHANGED
File without changes
admin/assets/img/balloon.png CHANGED
File without changes
admin/assets/img/book-icon.png CHANGED
File without changes
admin/assets/img/cff-icon.png CHANGED
File without changes
admin/assets/img/cff-sprite.png CHANGED
File without changes
admin/assets/img/fb-icon.png CHANGED
File without changes
admin/assets/img/fb-icon.svg CHANGED
@@ -1,16 +1,16 @@
1
- <svg width="52" height="52" viewBox="0 0 52 52" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <g filter="url(#filter0_d)">
3
- <path d="M34.707 28.125L35.7461 21.2969H29.1406V16.8438C29.1406 14.9141 30.0312 13.1328 33 13.1328H36.043V7.26953C36.043 7.26953 33.2969 6.75 30.6992 6.75C25.2812 6.75 21.7188 10.0898 21.7188 16.0273V21.2969H15.6328V28.125H21.7188V44.75H29.1406V28.125H34.707Z" fill="#006BFA"/>
4
- </g>
5
- <defs>
6
- <filter id="filter0_d" x="-1.45518" y="-0.291035" width="54.9104" height="54.9104" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
7
- <feFlood flood-opacity="0" result="BackgroundImageFix"/>
8
- <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/>
9
- <feOffset dy="1.16414"/>
10
- <feGaussianBlur stdDeviation="0.727588"/>
11
- <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0.101961 0 0 0 0 0.466667 0 0 0 0.0337375 0"/>
12
- <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
13
- <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
14
- </filter>
15
- </defs>
16
- </svg>
1
+ <svg width="52" height="52" viewBox="0 0 52 52" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g filter="url(#filter0_d)">
3
+ <path d="M34.707 28.125L35.7461 21.2969H29.1406V16.8438C29.1406 14.9141 30.0312 13.1328 33 13.1328H36.043V7.26953C36.043 7.26953 33.2969 6.75 30.6992 6.75C25.2812 6.75 21.7188 10.0898 21.7188 16.0273V21.2969H15.6328V28.125H21.7188V44.75H29.1406V28.125H34.707Z" fill="#006BFA"/>
4
+ </g>
5
+ <defs>
6
+ <filter id="filter0_d" x="-1.45518" y="-0.291035" width="54.9104" height="54.9104" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
7
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
8
+ <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/>
9
+ <feOffset dy="1.16414"/>
10
+ <feGaussianBlur stdDeviation="0.727588"/>
11
+ <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0.101961 0 0 0 0 0.466667 0 0 0 0.0337375 0"/>
12
+ <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
13
+ <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
14
+ </filter>
15
+ </defs>
16
+ </svg>
admin/assets/img/fb-icon2.png CHANGED
File without changes
admin/assets/img/fb-icon3.png CHANGED
File without changes
admin/assets/img/group-app.png CHANGED
File without changes
admin/assets/img/insta-icon.svg CHANGED
@@ -1,23 +1,23 @@
1
- <svg width="53" height="52" viewBox="0 0 53 52" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <g filter="url(#filter0_d)">
3
- <path d="M26.5402 16.7188C21.3973 16.7188 17.2991 20.8973 17.2991 25.9598C17.2991 31.1027 21.3973 35.2009 26.5402 35.2009C31.6027 35.2009 35.7813 31.1027 35.7813 25.9598C35.7813 20.8973 31.6027 16.7188 26.5402 16.7188ZM26.5402 31.9866C23.2455 31.9866 20.5134 29.3348 20.5134 25.9598C20.5134 22.6652 23.1652 20.0134 26.5402 20.0134C29.8348 20.0134 32.4866 22.6652 32.4866 25.9598C32.4866 29.3348 29.8348 31.9866 26.5402 31.9866ZM38.2723 16.3973C38.2723 15.192 37.308 14.2277 36.1027 14.2277C34.8973 14.2277 33.933 15.192 33.933 16.3973C33.933 17.6027 34.8973 18.567 36.1027 18.567C37.308 18.567 38.2723 17.6027 38.2723 16.3973ZM44.3795 18.567C44.2188 15.6741 43.5759 13.1027 41.4866 11.0134C39.3973 8.92411 36.8259 8.28125 33.933 8.12054C30.9598 7.95982 22.0402 7.95982 19.067 8.12054C16.1741 8.28125 13.683 8.92411 11.5134 11.0134C9.42411 13.1027 8.78125 15.6741 8.62054 18.567C8.45982 21.5402 8.45982 30.4598 8.62054 33.433C8.78125 36.3259 9.42411 38.817 11.5134 40.9866C13.683 43.0759 16.1741 43.7188 19.067 43.8795C22.0402 44.0402 30.9598 44.0402 33.933 43.8795C36.8259 43.7188 39.3973 43.0759 41.4866 40.9866C43.5759 38.817 44.2188 36.3259 44.3795 33.433C44.5402 30.4598 44.5402 21.5402 44.3795 18.567ZM40.5223 36.567C39.9598 38.1741 38.6741 39.3795 37.1473 40.0223C34.7366 40.9866 29.1116 40.7455 26.5402 40.7455C23.8884 40.7455 18.2634 40.9866 15.933 40.0223C14.3259 39.3795 13.1205 38.1741 12.4777 36.567C11.5134 34.2366 11.7545 28.6116 11.7545 25.9598C11.7545 23.3884 11.5134 17.7634 12.4777 15.3527C13.1205 13.8259 14.3259 12.6205 15.933 11.9777C18.2634 11.0134 23.8884 11.2545 26.5402 11.2545C29.1116 11.2545 34.7366 11.0134 37.1473 11.9777C38.6741 12.5402 39.8795 13.8259 40.5223 15.3527C41.4866 17.7634 41.2455 23.3884 41.2455 25.9598C41.2455 28.6116 41.4866 34.2366 40.5223 36.567Z" fill="url(#paint0_linear)"/>
4
- </g>
5
- <defs>
6
- <filter id="filter0_d" x="-0.955176" y="-0.291035" width="54.9104" height="54.9104" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
7
- <feFlood flood-opacity="0" result="BackgroundImageFix"/>
8
- <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/>
9
- <feOffset dy="1.16414"/>
10
- <feGaussianBlur stdDeviation="0.727588"/>
11
- <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0.101961 0 0 0 0 0.466667 0 0 0 0.0337375 0"/>
12
- <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
13
- <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
14
- </filter>
15
- <linearGradient id="paint0_linear" x1="21.325" y1="76.85" x2="97.15" y2="-0.550001" gradientUnits="userSpaceOnUse">
16
- <stop stop-color="white"/>
17
- <stop offset="0.147864" stop-color="#F6640E"/>
18
- <stop offset="0.443974" stop-color="#BA03A7"/>
19
- <stop offset="0.733337" stop-color="#6A01B9"/>
20
- <stop offset="1" stop-color="#6B01B9"/>
21
- </linearGradient>
22
- </defs>
23
- </svg>
1
+ <svg width="53" height="52" viewBox="0 0 53 52" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g filter="url(#filter0_d)">
3
+ <path d="M26.5402 16.7188C21.3973 16.7188 17.2991 20.8973 17.2991 25.9598C17.2991 31.1027 21.3973 35.2009 26.5402 35.2009C31.6027 35.2009 35.7813 31.1027 35.7813 25.9598C35.7813 20.8973 31.6027 16.7188 26.5402 16.7188ZM26.5402 31.9866C23.2455 31.9866 20.5134 29.3348 20.5134 25.9598C20.5134 22.6652 23.1652 20.0134 26.5402 20.0134C29.8348 20.0134 32.4866 22.6652 32.4866 25.9598C32.4866 29.3348 29.8348 31.9866 26.5402 31.9866ZM38.2723 16.3973C38.2723 15.192 37.308 14.2277 36.1027 14.2277C34.8973 14.2277 33.933 15.192 33.933 16.3973C33.933 17.6027 34.8973 18.567 36.1027 18.567C37.308 18.567 38.2723 17.6027 38.2723 16.3973ZM44.3795 18.567C44.2188 15.6741 43.5759 13.1027 41.4866 11.0134C39.3973 8.92411 36.8259 8.28125 33.933 8.12054C30.9598 7.95982 22.0402 7.95982 19.067 8.12054C16.1741 8.28125 13.683 8.92411 11.5134 11.0134C9.42411 13.1027 8.78125 15.6741 8.62054 18.567C8.45982 21.5402 8.45982 30.4598 8.62054 33.433C8.78125 36.3259 9.42411 38.817 11.5134 40.9866C13.683 43.0759 16.1741 43.7188 19.067 43.8795C22.0402 44.0402 30.9598 44.0402 33.933 43.8795C36.8259 43.7188 39.3973 43.0759 41.4866 40.9866C43.5759 38.817 44.2188 36.3259 44.3795 33.433C44.5402 30.4598 44.5402 21.5402 44.3795 18.567ZM40.5223 36.567C39.9598 38.1741 38.6741 39.3795 37.1473 40.0223C34.7366 40.9866 29.1116 40.7455 26.5402 40.7455C23.8884 40.7455 18.2634 40.9866 15.933 40.0223C14.3259 39.3795 13.1205 38.1741 12.4777 36.567C11.5134 34.2366 11.7545 28.6116 11.7545 25.9598C11.7545 23.3884 11.5134 17.7634 12.4777 15.3527C13.1205 13.8259 14.3259 12.6205 15.933 11.9777C18.2634 11.0134 23.8884 11.2545 26.5402 11.2545C29.1116 11.2545 34.7366 11.0134 37.1473 11.9777C38.6741 12.5402 39.8795 13.8259 40.5223 15.3527C41.4866 17.7634 41.2455 23.3884 41.2455 25.9598C41.2455 28.6116 41.4866 34.2366 40.5223 36.567Z" fill="url(#paint0_linear)"/>
4
+ </g>
5
+ <defs>
6
+ <filter id="filter0_d" x="-0.955176" y="-0.291035" width="54.9104" height="54.9104" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
7
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
8
+ <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/>
9
+ <feOffset dy="1.16414"/>
10
+ <feGaussianBlur stdDeviation="0.727588"/>
11
+ <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0.101961 0 0 0 0 0.466667 0 0 0 0.0337375 0"/>
12
+ <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
13
+ <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
14
+ </filter>
15
+ <linearGradient id="paint0_linear" x1="21.325" y1="76.85" x2="97.15" y2="-0.550001" gradientUnits="userSpaceOnUse">
16
+ <stop stop-color="white"/>
17
+ <stop offset="0.147864" stop-color="#F6640E"/>
18
+ <stop offset="0.443974" stop-color="#BA03A7"/>
19
+ <stop offset="0.733337" stop-color="#6A01B9"/>
20
+ <stop offset="1" stop-color="#6B01B9"/>
21
+ </linearGradient>
22
+ </defs>
23
+ </svg>
admin/assets/img/instagram-color-icon.svg CHANGED
@@ -1,17 +1,17 @@
1
- <svg width="102" height="102" viewBox="0 0 102 102" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <rect x="0.5" y="0.5" width="101" height="101" rx="1.5" fill="white"/>
3
- <path d="M51 40.2188C45 40.2188 40.2188 45.0938 40.2188 51C40.2188 57 45 61.7812 51 61.7812C56.9062 61.7812 61.7812 57 61.7812 51C61.7812 45.0938 56.9062 40.2188 51 40.2188ZM51 58.0312C47.1562 58.0312 43.9688 54.9375 43.9688 51C43.9688 47.1562 47.0625 44.0625 51 44.0625C54.8438 44.0625 57.9375 47.1562 57.9375 51C57.9375 54.9375 54.8438 58.0312 51 58.0312ZM64.6875 39.8438C64.6875 38.4375 63.5625 37.3125 62.1562 37.3125C60.75 37.3125 59.625 38.4375 59.625 39.8438C59.625 41.25 60.75 42.375 62.1562 42.375C63.5625 42.375 64.6875 41.25 64.6875 39.8438ZM71.8125 42.375C71.625 39 70.875 36 68.4375 33.5625C66 31.125 63 30.375 59.625 30.1875C56.1562 30 45.75 30 42.2812 30.1875C38.9062 30.375 36 31.125 33.4688 33.5625C31.0312 36 30.2812 39 30.0938 42.375C29.9062 45.8438 29.9062 56.25 30.0938 59.7188C30.2812 63.0938 31.0312 66 33.4688 68.5312C36 70.9688 38.9062 71.7188 42.2812 71.9062C45.75 72.0938 56.1562 72.0938 59.625 71.9062C63 71.7188 66 70.9688 68.4375 68.5312C70.875 66 71.625 63.0938 71.8125 59.7188C72 56.25 72 45.8438 71.8125 42.375ZM67.3125 63.375C66.6562 65.25 65.1562 66.6562 63.375 67.4062C60.5625 68.5312 54 68.25 51 68.25C47.9062 68.25 41.3438 68.5312 38.625 67.4062C36.75 66.6562 35.3438 65.25 34.5938 63.375C33.4688 60.6562 33.75 54.0938 33.75 51C33.75 48 33.4688 41.4375 34.5938 38.625C35.3438 36.8438 36.75 35.4375 38.625 34.6875C41.3438 33.5625 47.9062 33.8438 51 33.8438C54 33.8438 60.5625 33.5625 63.375 34.6875C65.1562 35.3438 66.5625 36.8438 67.3125 38.625C68.4375 41.4375 68.1562 48 68.1562 51C68.1562 54.0938 68.4375 60.6562 67.3125 63.375Z" fill="url(#paint0_linear)"/>
4
- <rect x="0.5" y="0.5" width="101" height="101" rx="1.5" stroke="#CFD8E3"/>
5
- <rect x="57" y="56" width="24" height="24" rx="12" fill="#59AB46"/>
6
- <path d="M73.6666 68.6668H69.6666V72.6668H68.3333V68.6668H64.3333V67.3335H68.3333V63.3335H69.6666V67.3335H73.6666V68.6668Z" fill="white"/>
7
- <rect x="57" y="56" width="24" height="24" rx="12" stroke="white" stroke-width="2"/>
8
- <defs>
9
- <linearGradient id="paint0_linear" x1="44.9156" y1="110.372" x2="133.378" y2="20.0719" gradientUnits="userSpaceOnUse">
10
- <stop stop-color="white"/>
11
- <stop offset="0.147864" stop-color="#F6640E"/>
12
- <stop offset="0.443974" stop-color="#BA03A7"/>
13
- <stop offset="0.733337" stop-color="#6A01B9"/>
14
- <stop offset="1" stop-color="#6B01B9"/>
15
- </linearGradient>
16
- </defs>
17
- </svg>
1
+ <svg width="102" height="102" viewBox="0 0 102 102" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <rect x="0.5" y="0.5" width="101" height="101" rx="1.5" fill="white"/>
3
+ <path d="M51 40.2188C45 40.2188 40.2188 45.0938 40.2188 51C40.2188 57 45 61.7812 51 61.7812C56.9062 61.7812 61.7812 57 61.7812 51C61.7812 45.0938 56.9062 40.2188 51 40.2188ZM51 58.0312C47.1562 58.0312 43.9688 54.9375 43.9688 51C43.9688 47.1562 47.0625 44.0625 51 44.0625C54.8438 44.0625 57.9375 47.1562 57.9375 51C57.9375 54.9375 54.8438 58.0312 51 58.0312ZM64.6875 39.8438C64.6875 38.4375 63.5625 37.3125 62.1562 37.3125C60.75 37.3125 59.625 38.4375 59.625 39.8438C59.625 41.25 60.75 42.375 62.1562 42.375C63.5625 42.375 64.6875 41.25 64.6875 39.8438ZM71.8125 42.375C71.625 39 70.875 36 68.4375 33.5625C66 31.125 63 30.375 59.625 30.1875C56.1562 30 45.75 30 42.2812 30.1875C38.9062 30.375 36 31.125 33.4688 33.5625C31.0312 36 30.2812 39 30.0938 42.375C29.9062 45.8438 29.9062 56.25 30.0938 59.7188C30.2812 63.0938 31.0312 66 33.4688 68.5312C36 70.9688 38.9062 71.7188 42.2812 71.9062C45.75 72.0938 56.1562 72.0938 59.625 71.9062C63 71.7188 66 70.9688 68.4375 68.5312C70.875 66 71.625 63.0938 71.8125 59.7188C72 56.25 72 45.8438 71.8125 42.375ZM67.3125 63.375C66.6562 65.25 65.1562 66.6562 63.375 67.4062C60.5625 68.5312 54 68.25 51 68.25C47.9062 68.25 41.3438 68.5312 38.625 67.4062C36.75 66.6562 35.3438 65.25 34.5938 63.375C33.4688 60.6562 33.75 54.0938 33.75 51C33.75 48 33.4688 41.4375 34.5938 38.625C35.3438 36.8438 36.75 35.4375 38.625 34.6875C41.3438 33.5625 47.9062 33.8438 51 33.8438C54 33.8438 60.5625 33.5625 63.375 34.6875C65.1562 35.3438 66.5625 36.8438 67.3125 38.625C68.4375 41.4375 68.1562 48 68.1562 51C68.1562 54.0938 68.4375 60.6562 67.3125 63.375Z" fill="url(#paint0_linear)"/>
4
+ <rect x="0.5" y="0.5" width="101" height="101" rx="1.5" stroke="#CFD8E3"/>
5
+ <rect x="57" y="56" width="24" height="24" rx="12" fill="#59AB46"/>
6
+ <path d="M73.6666 68.6668H69.6666V72.6668H68.3333V68.6668H64.3333V67.3335H68.3333V63.3335H69.6666V67.3335H73.6666V68.6668Z" fill="white"/>
7
+ <rect x="57" y="56" width="24" height="24" rx="12" stroke="white" stroke-width="2"/>
8
+ <defs>
9
+ <linearGradient id="paint0_linear" x1="44.9156" y1="110.372" x2="133.378" y2="20.0719" gradientUnits="userSpaceOnUse">
10
+ <stop stop-color="white"/>
11
+ <stop offset="0.147864" stop-color="#F6640E"/>
12
+ <stop offset="0.443974" stop-color="#BA03A7"/>
13
+ <stop offset="0.733337" stop-color="#6A01B9"/>
14
+ <stop offset="1" stop-color="#6B01B9"/>
15
+ </linearGradient>
16
+ </defs>
17
+ </svg>
admin/assets/img/instagram-icon.png CHANGED
File without changes
admin/assets/img/oembeds-image-1@2x.png CHANGED
File without changes
admin/assets/img/oembeds-image-2@2x.png CHANGED
File without changes
admin/assets/img/oembeds-image-3@2x.png CHANGED
File without changes
admin/assets/img/oembeds-image-4@2x.png CHANGED
File without changes
admin/assets/img/rocket-icon.png CHANGED
File without changes
admin/assets/img/save-plus-icon.png CHANGED
File without changes
admin/assets/img/sbi-icon.png CHANGED
File without changes
admin/assets/img/social-wall-graphic.png CHANGED
File without changes
admin/assets/img/social-wall-graphic2.png CHANGED
File without changes
admin/assets/img/support-members.png CHANGED
File without changes
admin/assets/img/team-avatar.png CHANGED
File without changes
admin/assets/img/twitter-icon.svg CHANGED
@@ -1,16 +1,16 @@
1
- <svg width="52" height="52" viewBox="0 0 52 52" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <g filter="url(#filter0_d)">
3
- <path d="M41.0664 18.0312C42.5508 16.918 43.8867 15.582 44.9258 14.0234C43.5898 14.6172 42.0312 15.0625 40.4727 15.2109C42.1055 14.2461 43.293 12.7617 43.8867 10.9062C42.4023 11.7969 40.6953 12.4648 38.9883 12.8359C37.5039 11.2773 35.5 10.3867 33.2734 10.3867C28.9688 10.3867 25.4805 13.875 25.4805 18.1797C25.4805 18.7734 25.5547 19.3672 25.7031 19.9609C19.2461 19.5898 13.457 16.4727 9.59766 11.7969C8.92969 12.9102 8.55859 14.2461 8.55859 15.7305C8.55859 18.4023 9.89453 20.7773 12.0469 22.1875C10.7852 22.1133 9.52344 21.8164 8.48438 21.2227V21.2969C8.48438 25.082 11.1562 28.1992 14.7188 28.9414C14.125 29.0898 13.3828 29.2383 12.7148 29.2383C12.1953 29.2383 11.75 29.1641 11.2305 29.0898C12.1953 32.207 15.0898 34.4336 18.5039 34.5078C15.832 36.5859 12.4922 37.8477 8.85547 37.8477C8.1875 37.8477 7.59375 37.7734 7 37.6992C10.4141 39.9258 14.4961 41.1875 18.9492 41.1875C33.2734 41.1875 41.0664 29.3867 41.0664 19.0703C41.0664 18.6992 41.0664 18.4023 41.0664 18.0312Z" fill="#1B90EF"/>
4
- </g>
5
- <defs>
6
- <filter id="filter0_d" x="-1.45518" y="-0.291035" width="54.9104" height="54.9104" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
7
- <feFlood flood-opacity="0" result="BackgroundImageFix"/>
8
- <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/>
9
- <feOffset dy="1.16414"/>
10
- <feGaussianBlur stdDeviation="0.727588"/>
11
- <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0.101961 0 0 0 0 0.466667 0 0 0 0.0337375 0"/>
12
- <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
13
- <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
14
- </filter>
15
- </defs>
16
- </svg>
1
+ <svg width="52" height="52" viewBox="0 0 52 52" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g filter="url(#filter0_d)">
3
+ <path d="M41.0664 18.0312C42.5508 16.918 43.8867 15.582 44.9258 14.0234C43.5898 14.6172 42.0312 15.0625 40.4727 15.2109C42.1055 14.2461 43.293 12.7617 43.8867 10.9062C42.4023 11.7969 40.6953 12.4648 38.9883 12.8359C37.5039 11.2773 35.5 10.3867 33.2734 10.3867C28.9688 10.3867 25.4805 13.875 25.4805 18.1797C25.4805 18.7734 25.5547 19.3672 25.7031 19.9609C19.2461 19.5898 13.457 16.4727 9.59766 11.7969C8.92969 12.9102 8.55859 14.2461 8.55859 15.7305C8.55859 18.4023 9.89453 20.7773 12.0469 22.1875C10.7852 22.1133 9.52344 21.8164 8.48438 21.2227V21.2969C8.48438 25.082 11.1562 28.1992 14.7188 28.9414C14.125 29.0898 13.3828 29.2383 12.7148 29.2383C12.1953 29.2383 11.75 29.1641 11.2305 29.0898C12.1953 32.207 15.0898 34.4336 18.5039 34.5078C15.832 36.5859 12.4922 37.8477 8.85547 37.8477C8.1875 37.8477 7.59375 37.7734 7 37.6992C10.4141 39.9258 14.4961 41.1875 18.9492 41.1875C33.2734 41.1875 41.0664 29.3867 41.0664 19.0703C41.0664 18.6992 41.0664 18.4023 41.0664 18.0312Z" fill="#1B90EF"/>
4
+ </g>
5
+ <defs>
6
+ <filter id="filter0_d" x="-1.45518" y="-0.291035" width="54.9104" height="54.9104" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
7
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
8
+ <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/>
9
+ <feOffset dy="1.16414"/>
10
+ <feGaussianBlur stdDeviation="0.727588"/>
11
+ <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0.101961 0 0 0 0 0.466667 0 0 0 0.0337375 0"/>
12
+ <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
13
+ <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
14
+ </filter>
15
+ </defs>
16
+ </svg>
admin/assets/img/youtube-icon.svg CHANGED
@@ -1,16 +1,16 @@
1
- <svg width="53" height="52" viewBox="0 0 53 52" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <g filter="url(#filter0_d)">
3
- <path d="M45.7461 16.0273C45.3008 14.2461 43.8906 12.8359 42.1836 12.3906C38.9922 11.5 26.375 11.5 26.375 11.5C26.375 11.5 13.6836 11.5 10.4922 12.3906C8.78516 12.8359 7.375 14.2461 6.92969 16.0273C6.03906 19.1445 6.03906 25.8242 6.03906 25.8242C6.03906 25.8242 6.03906 32.4297 6.92969 35.6211C7.375 37.4023 8.78516 38.7383 10.4922 39.1836C13.6836 40 26.375 40 26.375 40C26.375 40 38.9922 40 42.1836 39.1836C43.8906 38.7383 45.3008 37.4023 45.7461 35.6211C46.6367 32.4297 46.6367 25.8242 46.6367 25.8242C46.6367 25.8242 46.6367 19.1445 45.7461 16.0273ZM22.2188 31.8359V19.8125L32.7578 25.8242L22.2188 31.8359Z" fill="#EB2121"/>
4
- </g>
5
- <defs>
6
- <filter id="filter0_d" x="-0.955176" y="-0.291035" width="54.9104" height="54.9104" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
7
- <feFlood flood-opacity="0" result="BackgroundImageFix"/>
8
- <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/>
9
- <feOffset dy="1.16414"/>
10
- <feGaussianBlur stdDeviation="0.727588"/>
11
- <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0.101961 0 0 0 0 0.466667 0 0 0 0.0337375 0"/>
12
- <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
13
- <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
14
- </filter>
15
- </defs>
16
- </svg>
1
+ <svg width="53" height="52" viewBox="0 0 53 52" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g filter="url(#filter0_d)">
3
+ <path d="M45.7461 16.0273C45.3008 14.2461 43.8906 12.8359 42.1836 12.3906C38.9922 11.5 26.375 11.5 26.375 11.5C26.375 11.5 13.6836 11.5 10.4922 12.3906C8.78516 12.8359 7.375 14.2461 6.92969 16.0273C6.03906 19.1445 6.03906 25.8242 6.03906 25.8242C6.03906 25.8242 6.03906 32.4297 6.92969 35.6211C7.375 37.4023 8.78516 38.7383 10.4922 39.1836C13.6836 40 26.375 40 26.375 40C26.375 40 38.9922 40 42.1836 39.1836C43.8906 38.7383 45.3008 37.4023 45.7461 35.6211C46.6367 32.4297 46.6367 25.8242 46.6367 25.8242C46.6367 25.8242 46.6367 19.1445 45.7461 16.0273ZM22.2188 31.8359V19.8125L32.7578 25.8242L22.2188 31.8359Z" fill="#EB2121"/>
4
+ </g>
5
+ <defs>
6
+ <filter id="filter0_d" x="-0.955176" y="-0.291035" width="54.9104" height="54.9104" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
7
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
8
+ <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/>
9
+ <feOffset dy="1.16414"/>
10
+ <feGaussianBlur stdDeviation="0.727588"/>
11
+ <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0.101961 0 0 0 0 0.466667 0 0 0 0.0337375 0"/>
12
+ <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
13
+ <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
14
+ </filter>
15
+ </defs>
16
+ </svg>
admin/assets/js/about.js CHANGED
@@ -1,146 +1,146 @@
1
- var extensions_data = {
2
- genericText: sbi_about.genericText,
3
- links: sbi_about.links,
4
- extentions_bundle: sbi_about.extentions_bundle,
5
- supportPageUrl: sbi_about.supportPageUrl,
6
- plugins: sbi_about.pluginsInfo,
7
- stickyWidget: false,
8
- socialWallActivated: sbi_about.socialWallActivated,
9
- socialWallLinks: sbi_about.socialWallLinks,
10
- recommendedPlugins: sbi_about.recommendedPlugins,
11
- social_wall: sbi_about.social_wall,
12
- aboutBox: sbi_about.aboutBox,
13
- ajax_handler: sbi_about.ajax_handler,
14
- nonce: sbi_about.nonce,
15
- buttons: sbi_about.buttons,
16
- icons: sbi_about.icons,
17
- btnClicked: null,
18
- btnStatus: null,
19
- btnName: null,
20
- }
21
-
22
- var sbiAbout = new Vue({
23
- el: "#sbi-about",
24
- http: {
25
- emulateJSON: true,
26
- emulateHTTP: true
27
- },
28
- data: extensions_data,
29
- methods: {
30
- activatePlugin: function( plugin, name, index, type ) {
31
- this.btnClicked = index + 1;
32
- this.btnStatus = 'loading';
33
- this.btnName = name;
34
-
35
- let data = new FormData();
36
- data.append( 'action', 'sbi_activate_addon' );
37
- data.append( 'nonce', this.nonce );
38
- data.append( 'plugin', plugin );
39
- data.append( 'type', 'plugin' );
40
- if ( this.extentions_bundle && type == 'extension' ) {
41
- data.append( 'extensions_bundle', this.extentions_bundle );
42
- }
43
- fetch(this.ajax_handler, {
44
- method: "POST",
45
- credentials: 'same-origin',
46
- body: data
47
- })
48
- .then(response => response.json())
49
- .then(data => {
50
- if( data.success == true ) {
51
- if ( name === 'social_wall' ) {
52
- this.social_wall.activated = true;
53
- } else if ( type === 'recommended_plugin' ) {
54
- this.recommendedPlugins[name].activated = true;
55
- } else {
56
- this.plugins[name].activated = true;
57
- }
58
- this.btnClicked = null;
59
- this.btnStatus = null;
60
- this.btnName = null;
61
- }
62
- });
63
- },
64
- deactivatePlugin: function( plugin, name, index, type ) {
65
- this.btnClicked = index + 1;
66
- this.btnStatus = 'loading';
67
- this.btnName = name;
68
-
69
- let data = new FormData();
70
- data.append( 'action', 'sbi_deactivate_addon' );
71
- data.append( 'nonce', this.nonce );
72
- data.append( 'plugin', plugin );
73
- data.append( 'type', 'plugin' );
74
- if ( this.extentions_bundle && type == 'extension' ) {
75
- data.append( 'extensions_bundle', this.extentions_bundle );
76
- }
77
- fetch(this.ajax_handler, {
78
- method: "POST",
79
- credentials: 'same-origin',
80
- body: data
81
- })
82
- .then(response => response.json())
83
- .then(data => {
84
- if( data.success == true ) {
85
- if ( name === 'social_wall' ) {
86
- this.social_wall.activated = false;
87
- } else if ( type === 'recommended_plugin' ) {
88
- this.recommendedPlugins[name].activated = false;
89
- } else {
90
- this.plugins[name].activated = false;
91
- }
92
- this.btnClicked = null;
93
- this.btnName = null;
94
- this.btnStatus = null;
95
- }
96
- return;
97
- });
98
- },
99
- installPlugin: function( plugin, name, index, type ) {
100
- this.btnClicked = index + 1;
101
- this.btnStatus = 'loading';
102
- this.btnName = name;
103
-
104
- let data = new FormData();
105
- data.append( 'action', 'sbi_install_addon' );
106
- data.append( 'nonce', this.nonce );
107
- data.append( 'plugin', plugin );
108
- data.append( 'type', 'plugin' );
109
- fetch(this.ajax_handler, {
110
- method: "POST",
111
- credentials: 'same-origin',
112
- body: data
113
- })
114
- .then(response => response.json())
115
- .then(data => {
116
- if( data.success == true ) {
117
- if ( type === 'recommended_plugin' ) {
118
- this.recommendedPlugins[name].installed = true;
119
- this.recommendedPlugins[name].activated = true;
120
- } else {
121
- this.plugins[name].installed = true;
122
- this.plugins[name].activated = true;
123
- }
124
- this.btnClicked = null;
125
- this.btnName = null;
126
- this.btnStatus = null;
127
- }
128
- return;
129
- });
130
- },
131
- buttonIcon: function() {
132
- if ( this.btnStatus == 'loading' ) {
133
- return this.icons.loaderSVG
134
- }
135
- },
136
-
137
- /**
138
- * Toggle Sticky Widget view
139
- *
140
- * @since 4.0
141
- */
142
- toggleStickyWidget: function() {
143
- this.stickyWidget = !this.stickyWidget;
144
- },
145
- }
146
  })
1
+ var extensions_data = {
2
+ genericText: sbi_about.genericText,
3
+ links: sbi_about.links,
4
+ extentions_bundle: sbi_about.extentions_bundle,
5
+ supportPageUrl: sbi_about.supportPageUrl,
6
+ plugins: sbi_about.pluginsInfo,
7
+ stickyWidget: false,
8
+ socialWallActivated: sbi_about.socialWallActivated,
9
+ socialWallLinks: sbi_about.socialWallLinks,
10
+ recommendedPlugins: sbi_about.recommendedPlugins,
11
+ social_wall: sbi_about.social_wall,
12
+ aboutBox: sbi_about.aboutBox,
13
+ ajax_handler: sbi_about.ajax_handler,
14
+ nonce: sbi_about.nonce,
15
+ buttons: sbi_about.buttons,
16
+ icons: sbi_about.icons,
17
+ btnClicked: null,
18
+ btnStatus: null,
19
+ btnName: null,
20
+ }
21
+
22
+ var sbiAbout = new Vue({
23
+ el: "#sbi-about",
24
+ http: {
25
+ emulateJSON: true,
26
+ emulateHTTP: true
27
+ },
28
+ data: extensions_data,
29
+ methods: {
30
+ activatePlugin: function( plugin, name, index, type ) {
31
+ this.btnClicked = index + 1;
32
+ this.btnStatus = 'loading';
33
+ this.btnName = name;
34
+
35
+ let data = new FormData();
36
+ data.append( 'action', 'sbi_activate_addon' );
37
+ data.append( 'nonce', this.nonce );
38
+ data.append( 'plugin', plugin );
39
+ data.append( 'type', 'plugin' );
40
+ if ( this.extentions_bundle && type == 'extension' ) {
41
+ data.append( 'extensions_bundle', this.extentions_bundle );
42
+ }
43
+ fetch(this.ajax_handler, {
44
+ method: "POST",
45
+ credentials: 'same-origin',
46
+ body: data
47
+ })
48
+ .then(response => response.json())
49
+ .then(data => {
50
+ if( data.success == true ) {
51
+ if ( name === 'social_wall' ) {
52
+ this.social_wall.activated = true;
53
+ } else if ( type === 'recommended_plugin' ) {
54
+ this.recommendedPlugins[name].activated = true;
55
+ } else {
56
+ this.plugins[name].activated = true;
57
+ }
58
+ this.btnClicked = null;
59
+ this.btnStatus = null;
60
+ this.btnName = null;
61
+ }
62
+ });
63
+ },
64
+ deactivatePlugin: function( plugin, name, index, type ) {
65
+ this.btnClicked = index + 1;
66
+ this.btnStatus = 'loading';
67
+ this.btnName = name;
68
+
69
+ let data = new FormData();
70
+ data.append( 'action', 'sbi_deactivate_addon' );
71
+ data.append( 'nonce', this.nonce );
72
+ data.append( 'plugin', plugin );
73
+ data.append( 'type', 'plugin' );
74
+ if ( this.extentions_bundle && type == 'extension' ) {
75
+ data.append( 'extensions_bundle', this.extentions_bundle );
76
+ }
77
+ fetch(this.ajax_handler, {
78
+ method: "POST",
79
+ credentials: 'same-origin',
80
+ body: data
81
+ })
82
+ .then(response => response.json())
83
+ .then(data => {
84
+ if( data.success == true ) {
85
+ if ( name === 'social_wall' ) {
86
+ this.social_wall.activated = false;
87
+ } else if ( type === 'recommended_plugin' ) {
88
+ this.recommendedPlugins[name].activated = false;
89
+ } else {
90
+ this.plugins[name].activated = false;
91
+ }
92
+ this.btnClicked = null;
93
+ this.btnName = null;
94
+ this.btnStatus = null;
95
+ }
96
+ return;
97
+ });
98
+ },
99
+ installPlugin: function( plugin, name, index, type ) {
100
+ this.btnClicked = index + 1;
101
+ this.btnStatus = 'loading';
102
+ this.btnName = name;
103
+
104
+ let data = new FormData();
105
+ data.append( 'action', 'sbi_install_addon' );
106
+ data.append( 'nonce', this.nonce );
107
+ data.append( 'plugin', plugin );
108
+ data.append( 'type', 'plugin' );
109
+ fetch(this.ajax_handler, {
110
+ method: "POST",
111
+ credentials: 'same-origin',
112
+ body: data
113
+ })
114
+ .then(response => response.json())
115
+ .then(data => {
116
+ if( data.success == true ) {
117
+ if ( type === 'recommended_plugin' ) {
118
+ this.recommendedPlugins[name].installed = true;
119
+ this.recommendedPlugins[name].activated = true;
120
+ } else {
121
+ this.plugins[name].installed = true;
122
+ this.plugins[name].activated = true;
123
+ }
124
+ this.btnClicked = null;
125
+ this.btnName = null;
126
+ this.btnStatus = null;
127
+ }
128
+ return;
129
+ });
130
+ },
131
+ buttonIcon: function() {
132
+ if ( this.btnStatus == 'loading' ) {
133
+ return this.icons.loaderSVG
134
+ }
135
+ },
136
+
137
+ /**
138
+ * Toggle Sticky Widget view
139
+ *
140
+ * @since 4.0
141
+ */
142
+ toggleStickyWidget: function() {
143
+ this.stickyWidget = !this.stickyWidget;
144
+ },
145
+ }
146
  })
admin/assets/js/admin-notifications.js CHANGED
@@ -1,208 +1,208 @@
1
- /**
2
- * CFF Admin Notifications.
3
- *
4
- * @since 2.18
5
- */
6
-
7
- 'use strict';
8
-
9
- var SBIAdminNotifications = window.SBIAdminNotifications || ( function( document, window, $ ) {
10
-
11
- /**
12
- * Elements holder.
13
- *
14
- * @since 2.18
15
- *
16
- * @type {object}
17
- */
18
- var el = {
19
-
20
- $notifications: $( '#sbi-notifications' ),
21
- $nextButton: $( '#sbi-notifications .navigation .next' ),
22
- $prevButton: $( '#sbi-notifications .navigation .prev' ),
23
- $adminBarCounter: $( '#wp-admin-bar-wpforms-menu .sbi-menu-notification-counter' ),
24
- $adminBarMenuItem: $( '#wp-admin-bar-sbi-notifications' ),
25
-
26
- };
27
-
28
- /**
29
- * Public functions and properties.
30
- *
31
- * @since 2.18
32
- *
33
- * @type {object}
34
- */
35
- var app = {
36
-
37
- /**
38
- * Start the engine.
39
- *
40
- * @since 2.18
41
- */
42
- init: function() {
43
- el.$notifications.find( '.messages a').each(function() {
44
- if ($(this).attr('href').indexOf('dismiss=') > -1 ) {
45
- $(this).addClass('button-dismiss');
46
- }
47
- })
48
-
49
- $( app.ready );
50
- },
51
-
52
- /**
53
- * Document ready.
54
- *
55
- * @since 2.18
56
- */
57
- ready: function() {
58
-
59
- app.updateNavigation();
60
- app.events();
61
- },
62
-
63
- /**
64
- * Register JS events.
65
- *
66
- * @since 2.18
67
- */
68
- events: function() {
69
-
70
- el.$notifications
71
- .on( 'click', '.dismiss', app.dismiss )
72
- .on( 'click', '.button-dismiss', app.buttonDismiss )
73
- .on( 'click', '.next', app.navNext )
74
- .on( 'click', '.prev', app.navPrev );
75
- },
76
-
77
- /**
78
- * Click on a dismiss button.
79
- *
80
- * @since 2.18
81
- */
82
- buttonDismiss: function( event ) {
83
- event.preventDefault();
84
- app.dismiss();
85
- },
86
-
87
- /**
88
- * Click on the Dismiss notification button.
89
- *
90
- * @since 2.18
91
- *
92
- * @param {object} event Event object.
93
- */
94
- dismiss: function( event ) {
95
-
96
- if ( el.$currentMessage.length === 0 ) {
97
- return;
98
- }
99
-
100
- // Update counter.
101
- var count = parseInt( el.$adminBarCounter.text(), 10 );
102
- if ( count > 1 ) {
103
- --count;
104
- el.$adminBarCounter.html( '<span>' + count + '</span>' );
105
- } else {
106
- el.$adminBarCounter.remove();
107
- el.$adminBarMenuItem.remove();
108
- }
109
-
110
- // Remove notification.
111
- var $nextMessage = el.$nextMessage.length < 1 ? el.$prevMessage : el.$nextMessage,
112
- messageId = el.$currentMessage.data( 'message-id' );
113
-
114
- if ( $nextMessage.length === 0 ) {
115
- el.$notifications.remove();
116
- } else {
117
- el.$currentMessage.remove();
118
- $nextMessage.addClass( 'current' );
119
- app.updateNavigation();
120
- }
121
-
122
- // AJAX call - update option.
123
- var data = {
124
- action: 'sbi_dashboard_notification_dismiss',
125
- nonce: sbi_admin.nonce,
126
- id: messageId,
127
- };
128
-
129
- $.post( sbi_admin.ajax_url, data, function( res ) {
130
-
131
- if ( ! res.success ) {
132
- //sbiAdmin.debug( res );
133
- }
134
- } ).fail( function( xhr, textStatus, e ) {
135
-
136
- //sbiAdmin.debug( xhr.responseText );
137
- } );
138
- },
139
-
140
- /**
141
- * Click on the Next notification button.
142
- *
143
- * @since 2.18
144
- *
145
- * @param {object} event Event object.
146
- */
147
- navNext: function( event ) {
148
-
149
- if ( el.$nextButton.hasClass( 'disabled' ) ) {
150
- return;
151
- }
152
-
153
- el.$currentMessage.removeClass( 'current' );
154
- el.$nextMessage.addClass( 'current' );
155
-
156
- app.updateNavigation();
157
- },
158
-
159
- /**
160
- * Click on the Previous notification button.
161
- *
162
- * @since 2.18
163
- *
164
- * @param {object} event Event object.
165
- */
166
- navPrev: function( event ) {
167
-
168
- if ( el.$prevButton.hasClass( 'disabled' ) ) {
169
- return;
170
- }
171
-
172
- el.$currentMessage.removeClass( 'current' );
173
- el.$prevMessage.addClass( 'current' );
174
-
175
- app.updateNavigation();
176
- },
177
-
178
- /**
179
- * Update navigation buttons.
180
- *
181
- * @since 2.18
182
- */
183
- updateNavigation: function() {
184
-
185
- el.$currentMessage = el.$notifications.find( '.message.current' );
186
- el.$nextMessage = el.$currentMessage.next( '.message' );
187
- el.$prevMessage = el.$currentMessage.prev( '.message' );
188
-
189
- if ( el.$nextMessage.length === 0 ) {
190
- el.$nextButton.addClass( 'disabled' );
191
- } else {
192
- el.$nextButton.removeClass( 'disabled' );
193
- }
194
-
195
- if ( el.$prevMessage.length === 0 ) {
196
- el.$prevButton.addClass( 'disabled' );
197
- } else {
198
- el.$prevButton.removeClass( 'disabled' );
199
- }
200
- },
201
- };
202
-
203
- return app;
204
-
205
- }( document, window, jQuery ) );
206
-
207
- // Initialize.
208
- SBIAdminNotifications.init();
1
+ /**
2
+ * CFF Admin Notifications.
3
+ *
4
+ * @since 2.18
5
+ */
6
+
7
+ 'use strict';
8
+
9
+ var SBIAdminNotifications = window.SBIAdminNotifications || ( function( document, window, $ ) {
10
+
11
+ /**
12
+ * Elements holder.
13
+ *
14
+ * @since 2.18
15
+ *
16
+ * @type {object}
17
+ */
18
+ var el = {
19
+
20
+ $notifications: $( '#sbi-notifications' ),
21
+ $nextButton: $( '#sbi-notifications .navigation .next' ),
22
+ $prevButton: $( '#sbi-notifications .navigation .prev' ),
23
+ $adminBarCounter: $( '#wp-admin-bar-wpforms-menu .sbi-menu-notification-counter' ),
24
+ $adminBarMenuItem: $( '#wp-admin-bar-sbi-notifications' ),
25
+
26
+ };
27
+
28
+ /**
29
+ * Public functions and properties.
30
+ *
31
+ * @since 2.18
32
+ *
33
+ * @type {object}
34
+ */
35
+ var app = {
36
+
37
+ /**
38
+ * Start the engine.
39
+ *
40
+ * @since 2.18
41
+ */
42
+ init: function() {
43
+ el.$notifications.find( '.messages a').each(function() {
44
+ if ($(this).attr('href').indexOf('dismiss=') > -1 ) {
45
+ $(this).addClass('button-dismiss');
46
+ }
47
+ })
48
+
49
+ $( app.ready );
50
+ },
51
+
52
+ /**
53
+ * Document ready.
54
+ *
55
+ * @since 2.18
56
+ */
57
+ ready: function() {
58
+
59
+ app.updateNavigation();
60
+ app.events();
61
+ },
62
+
63
+ /**
64
+ * Register JS events.
65
+ *
66
+ * @since 2.18
67
+ */
68
+ events: function() {
69
+
70
+ el.$notifications
71
+ .on( 'click', '.dismiss', app.dismiss )
72
+ .on( 'click', '.button-dismiss', app.buttonDismiss )
73
+ .on( 'click', '.next', app.navNext )
74
+ .on( 'click', '.prev', app.navPrev );
75
+ },
76
+
77
+ /**
78
+ * Click on a dismiss button.
79
+ *
80
+ * @since 2.18
81
+ */
82
+ buttonDismiss: function( event ) {
83
+ event.preventDefault();
84
+ app.dismiss();
85
+ },
86
+
87
+ /**
88
+ * Click on the Dismiss notification button.
89
+ *
90
+ * @since 2.18
91
+ *
92
+ * @param {object} event Event object.
93
+ */
94
+ dismiss: function( event ) {
95
+
96
+ if ( el.$currentMessage.length === 0 ) {
97
+ return;
98
+ }
99
+
100
+ // Update counter.
101
+ var count = parseInt( el.$adminBarCounter.text(), 10 );
102
+ if ( count > 1 ) {
103
+ --count;
104
+ el.$adminBarCounter.html( '<span>' + count + '</span>' );
105
+ } else {
106
+ el.$adminBarCounter.remove();
107
+ el.$adminBarMenuItem.remove();
108
+ }
109
+
110
+ // Remove notification.
111
+ var $nextMessage = el.$nextMessage.length < 1 ? el.$prevMessage : el.$nextMessage,
112
+ messageId = el.$currentMessage.data( 'message-id' );
113
+
114
+ if ( $nextMessage.length === 0 ) {
115
+ el.$notifications.remove();
116
+ } else {
117
+ el.$currentMessage.remove();
118
+ $nextMessage.addClass( 'current' );
119
+ app.updateNavigation();
120
+ }
121
+
122
+ // AJAX call - update option.
123
+ var data = {
124
+ action: 'sbi_dashboard_notification_dismiss',
125
+ nonce: sbi_admin.nonce,
126
+ id: messageId,
127
+ };
128
+
129
+ $.post( sbi_admin.ajax_url, data, function( res ) {
130
+
131
+ if ( ! res.success ) {
132
+ //sbiAdmin.debug( res );
133
+ }
134
+ } ).fail( function( xhr, textStatus, e ) {
135
+
136
+ //sbiAdmin.debug( xhr.responseText );
137
+ } );
138
+ },
139
+
140
+ /**
141
+ * Click on the Next notification button.
142
+ *
143
+ * @since 2.18
144
+ *
145
+ * @param {object} event Event object.
146
+ */
147
+ navNext: function( event ) {
148
+
149
+ if ( el.$nextButton.hasClass( 'disabled' ) ) {
150
+ return;
151
+ }
152
+
153
+ el.$currentMessage.removeClass( 'current' );
154
+ el.$nextMessage.addClass( 'current' );
155
+
156
+ app.updateNavigation();
157
+ },
158
+
159
+ /**
160
+ * Click on the Previous notification button.
161
+ *
162
+ * @since 2.18
163
+ *
164
+ * @param {object} event Event object.
165
+ */
166
+ navPrev: function( event ) {
167
+
168
+ if ( el.$prevButton.hasClass( 'disabled' ) ) {
169
+ return;
170
+ }
171
+
172
+ el.$currentMessage.removeClass( 'current' );
173
+ el.$prevMessage.addClass( 'current' );
174
+
175
+ app.updateNavigation();
176
+ },
177
+
178
+ /**
179
+ * Update navigation buttons.
180
+ *
181
+ * @since 2.18
182
+ */
183
+ updateNavigation: function() {
184
+
185
+ el.$currentMessage = el.$notifications.find( '.message.current' );
186
+ el.$nextMessage = el.$currentMessage.next( '.message' );
187
+ el.$prevMessage = el.$currentMessage.prev( '.message' );
188
+
189
+ if ( el.$nextMessage.length === 0 ) {
190
+ el.$nextButton.addClass( 'disabled' );
191
+ } else {
192
+ el.$nextButton.removeClass( 'disabled' );
193
+ }
194
+
195
+ if ( el.$prevMessage.length === 0 ) {
196
+ el.$prevButton.addClass( 'disabled' );
197
+ } else {
198
+ el.$prevButton.removeClass( 'disabled' );
199
+ }
200
+ },
201
+ };
202
+
203
+ return app;
204
+
205
+ }( document, window, jQuery ) );
206
+
207
+ // Initialize.
208
+ SBIAdminNotifications.init();
admin/assets/js/oembeds.js CHANGED
@@ -1,177 +1,177 @@
1
- var sbioembeds_data = {
2
- nonce: sbi_oembeds.nonce,
3
- genericText: sbi_oembeds.genericText,
4
- images: sbi_oembeds.images,
5
- modal: sbi_oembeds.modal,
6
- links: sbi_oembeds.links,
7
- supportPageUrl: sbi_oembeds.supportPageUrl,
8
- socialWallActivated: sbi_oembeds.socialWallActivated,
9
- socialWallLinks: sbi_oembeds.socialWallLinks,
10
- stickyWidget: false,
11
- facebook: sbi_oembeds.facebook,
12
- instagram: sbi_oembeds.instagram,
13
- connectionURL: sbi_oembeds.connectionURL,
14
- isFacebookActivated: sbi_oembeds.facebook.active,
15
- facebookInstallBtnText: null,
16
- fboEmbedLoader: false,
17
- instaoEmbedLoader: false,
18
- openFacebookInstaller: false,
19
- loaderSVG: sbi_oembeds.loaderSVG,
20
- checkmarkSVG: sbi_oembeds.checkmarkSVG,
21
- installerStatus: null
22
- }
23
-
24
- var sbioEmbeds = new Vue({
25
- el: "#sbi-oembeds",
26
- http: {
27
- emulateJSON: true,
28
- emulateHTTP: true
29
- },
30
- data: sbioembeds_data,
31
- methods: {
32
- openFacebookllModal: function() {
33
- this.openFacebookInstaller = true
34
- },
35
- closeModal: function() {
36
- this.openFacebookInstaller = false
37
- },
38
- isoEmbedsEnabled: function() {
39
- if ( this.facebook.doingOembeds && this.instagram.doingOembeds ) {
40
- return true;
41
- }
42
- return;
43
- },
44
- FacebookShouldInstallOrEnable: function() {
45
- // if the plugin is activated and installed then just enable oEmbed
46
- if( this.isFacebookActivated ) {
47
- this.enableFacebookOembed();
48
- return;
49
- }
50
- // if the plugin is not activated and installed then open the modal to install and activate the plugin
51
- if( !this.isFacebookActivated ) {
52
- this.openFacebookllModal();
53
- return;
54
- }
55
- },
56
- installFacebook: function() {
57
- this.installerStatus = 'loading';
58
- let data = new FormData();
59
- data.append( 'action', sbi_oembeds.facebook.installer.action );
60
- data.append( 'nonce', sbi_oembeds.nonce );
61
- data.append( 'plugin', sbi_oembeds.facebook.installer.plugin );
62
- data.append( 'type', 'plugin' );
63
- fetch(sbi_oembeds.ajax_handler, {
64
- method: "POST",
65
- credentials: 'same-origin',
66
- body: data
67
- })
68
- .then(response => response.json())
69
- .then(data => {
70
- if( data.success == false ) {
71
- this.installerStatus = 'error'
72
- }
73
- if( data.success == true ) {
74
- this.isFacebookActivated = true;
75
- this.installerStatus = 'success'
76
- }
77
- this.facebookInstallBtnText = data.data.msg;
78
- setTimeout(function() {
79
- this.installerStatus = null;
80
- }.bind(this), 3000);
81
- return;
82
- });
83
- },
84
- enableFboEmbed: function() {
85
- this.fboEmbedLoader = true;
86
- window.location = this.connectionURL;
87
- return;
88
- },
89
- enableFacebookOembed: function() {
90
- this.facebookoEmbedLoader = true;
91
- window.location = this.connectionURL;
92
- return;
93
- },
94
- disableFboEmbed: function() {
95
- this.fboEmbedLoader = true;
96
- let data = new FormData();
97
- data.append( 'action', 'disable_facebook_oembed_from_instagram' );
98
- data.append( 'nonce', this.nonce );
99
- fetch(sbi_oembeds.ajax_handler, {
100
- method: "POST",
101
- credentials: 'same-origin',
102
- body: data
103
- })
104
- .then(response => response.json())
105
- .then(data => {
106
- if( data.success == true ) {
107
- this.fboEmbedLoader = false;
108
- this.facebook.doingOembeds = false;
109
- // get the updated connection URL after disabling oEmbed
110
- this.connectionURL = data.data.connectionUrl;
111
- }
112
- return;
113
- });
114
- },
115
- disableInstaoEmbed: function() {
116
- this.instaoEmbedLoader = true;
117
- let data = new FormData();
118
- data.append( 'action', 'disable_instagram_oembed_from_instagram' );
119
- data.append( 'nonce', this.nonce );
120
- fetch(sbi_oembeds.ajax_handler, {
121
- method: "POST",
122
- credentials: 'same-origin',
123
- body: data
124
- })
125
- .then(response => response.json())
126
- .then(data => {
127
- if( data.success == true ) {
128
- this.instaoEmbedLoader = false;
129
- this.instagram.doingOembeds = false;
130
- // get the updated connection URL after disabling oEmbed
131
- this.connectionURL = data.data.connectionUrl;
132
- }
133
- return;
134
- });
135
- },
136
- installButtonText: function( buttonText = null ) {
137
- if ( buttonText ) {
138
- return buttonText;
139
- } else if ( this.facebook.installer.nextStep == 'free_install' ) {
140
- return this.modal.install;
141
- } else if ( this.facebook.installer.nextStep == 'free_activate' ) {
142
- return this.modal.activate;
143
- }
144
- },
145
- installIcon: function() {
146
- if ( this.isFacebookActivated ) {
147
- return;
148
- }
149
- if( this.installerStatus == null ) {
150
- return this.modal.plusIcon;
151
- } else if( this.installerStatus == 'loading' ) {
152
- return this.loaderSVG;
153
- } else if( this.installerStatus == 'success' ) {
154
- return this.checkmarkSVG;
155
- } else if( this.installerStatus == 'error' ) {
156
- return `<i class="fa fa-times-circle"></i>`;
157
- }
158
- },
159
-
160
- /**
161
- * Toggle Sticky Widget view
162
- *
163
- * @since 4.0
164
- */
165
- toggleStickyWidget: function() {
166
- this.stickyWidget = !this.stickyWidget;
167
- },
168
- },
169
- created() {
170
- // Display the "Install" button text on modal depending on condition
171
- if ( this.facebook.installer.nextStep == 'free_install' ) {
172
- this.facebookInstallBtnText = this.modal.install;
173
- } else if ( this.facebook.installer.nextStep == 'free_activate' || this.facebook.installer.nextStep == 'pro_activate' ) {
174
- this.facebookInstallBtnText = this.modal.activate;
175
- }
176
- }
177
  })
1
+ var sbioembeds_data = {
2
+ nonce: sbi_oembeds.nonce,
3
+ genericText: sbi_oembeds.genericText,
4
+ images: sbi_oembeds.images,
5
+ modal: sbi_oembeds.modal,
6
+ links: sbi_oembeds.links,
7
+ supportPageUrl: sbi_oembeds.supportPageUrl,
8
+ socialWallActivated: sbi_oembeds.socialWallActivated,
9
+ socialWallLinks: sbi_oembeds.socialWallLinks,
10
+ stickyWidget: false,
11
+ facebook: sbi_oembeds.facebook,
12
+ instagram: sbi_oembeds.instagram,
13
+ connectionURL: sbi_oembeds.connectionURL,
14
+ isFacebookActivated: sbi_oembeds.facebook.active,
15
+ facebookInstallBtnText: null,
16
+ fboEmbedLoader: false,
17
+ instaoEmbedLoader: false,
18
+ openFacebookInstaller: false,
19
+ loaderSVG: sbi_oembeds.loaderSVG,
20
+ checkmarkSVG: sbi_oembeds.checkmarkSVG,
21
+ installerStatus: null
22
+ }
23
+
24
+ var sbioEmbeds = new Vue({
25
+ el: "#sbi-oembeds",
26
+ http: {
27
+ emulateJSON: true,
28
+ emulateHTTP: true
29
+ },
30
+ data: sbioembeds_data,
31
+ methods: {
32
+ openFacebookllModal: function() {
33
+ this.openFacebookInstaller = true
34
+ },
35
+ closeModal: function() {
36
+ this.openFacebookInstaller = false
37
+ },
38
+ isoEmbedsEnabled: function() {
39
+ if ( this.facebook.doingOembeds && this.instagram.doingOembeds ) {
40
+ return true;
41
+ }
42
+ return;
43
+ },
44
+ FacebookShouldInstallOrEnable: function() {
45
+ // if the plugin is activated and installed then just enable oEmbed
46
+ if( this.isFacebookActivated ) {
47
+ this.enableFacebookOembed();
48
+ return;
49
+ }
50
+ // if the plugin is not activated and installed then open the modal to install and activate the plugin
51
+ if( !this.isFacebookActivated ) {
52
+ this.openFacebookllModal();
53
+ return;
54
+ }
55
+ },
56
+ installFacebook: function() {
57
+ this.installerStatus = 'loading';
58
+ let data = new FormData();
59
+ data.append( 'action', sbi_oembeds.facebook.installer.action );
60
+ data.append( 'nonce', sbi_oembeds.nonce );
61
+ data.append( 'plugin', sbi_oembeds.facebook.installer.plugin );
62
+ data.append( 'type', 'plugin' );
63
+ fetch(sbi_oembeds.ajax_handler, {
64
+ method: "POST",
65
+ credentials: 'same-origin',
66
+ body: data
67
+ })
68
+ .then(response => response.json())
69
+ .then(data => {
70
+ if( data.success == false ) {
71
+ this.installerStatus = 'error'
72
+ }
73
+ if( data.success == true ) {
74
+ this.isFacebookActivated = true;
75
+ this.installerStatus = 'success'
76
+ }
77
+ this.facebookInstallBtnText = data.data.msg;
78
+ setTimeout(function() {
79
+ this.installerStatus = null;
80
+ }.bind(this), 3000);
81
+ return;
82
+ });
83
+ },
84
+ enableFboEmbed: function() {
85
+ this.fboEmbedLoader = true;
86
+ window.location = this.connectionURL;
87
+ return;
88
+ },
89
+ enableFacebookOembed: function() {
90
+ this.facebookoEmbedLoader = true;
91
+ window.location = this.connectionURL;
92
+ return;
93
+ },
94
+ disableFboEmbed: function() {
95
+ this.fboEmbedLoader = true;
96
+ let data = new FormData();
97
+ data.append( 'action', 'disable_facebook_oembed_from_instagram' );
98
+ data.append( 'nonce', this.nonce );
99
+ fetch(sbi_oembeds.ajax_handler, {
100
+ method: "POST",
101
+ credentials: 'same-origin',
102
+ body: data
103
+ })
104
+ .then(response => response.json())
105
+ .then(data => {
106
+ if( data.success == true ) {
107
+ this.fboEmbedLoader = false;
108
+ this.facebook.doingOembeds = false;
109
+ // get the updated connection URL after disabling oEmbed
110
+ this.connectionURL = data.data.connectionUrl;
111
+ }
112
+ return;
113
+ });
114
+ },
115
+ disableInstaoEmbed: function() {
116
+ this.instaoEmbedLoader = true;
117
+ let data = new FormData();
118
+ data.append( 'action', 'disable_instagram_oembed_from_instagram' );
119
+ data.append( 'nonce', this.nonce );
120
+ fetch(sbi_oembeds.ajax_handler, {
121
+ method: "POST",
122
+ credentials: 'same-origin',
123
+ body: data
124
+ })
125
+ .then(response => response.json())
126
+ .then(data => {
127
+ if( data.success == true ) {
128
+ this.instaoEmbedLoader = false;
129
+ this.instagram.doingOembeds = false;
130
+ // get the updated connection URL after disabling oEmbed
131
+ this.connectionURL = data.data.connectionUrl;
132
+ }
133
+ return;
134
+ });
135
+ },
136
+ installButtonText: function( buttonText = null ) {
137
+ if ( buttonText ) {
138
+ return buttonText;
139
+ } else if ( this.facebook.installer.nextStep == 'free_install' ) {
140
+ return this.modal.install;
141
+ } else if ( this.facebook.installer.nextStep == 'free_activate' ) {
142
+ return this.modal.activate;
143
+ }
144
+ },
145
+ installIcon: function() {
146
+ if ( this.isFacebookActivated ) {
147
+ return;
148
+ }
149
+ if( this.installerStatus == null ) {
150
+ return this.modal.plusIcon;
151
+ } else if( this.installerStatus == 'loading' ) {
152
+ return this.loaderSVG;
153
+ } else if( this.installerStatus == 'success' ) {
154
+ return this.checkmarkSVG;
155
+ } else if( this.installerStatus == 'error' ) {
156
+ return `<i class="fa fa-times-circle"></i>`;
157
+ }
158
+ },
159
+
160
+ /**
161
+ * Toggle Sticky Widget view
162
+ *
163
+ * @since 4.0
164
+ */
165
+ toggleStickyWidget: function() {
166
+ this.stickyWidget = !this.stickyWidget;
167
+ },
168
+ },
169
+ created() {
170
+ // Display the "Install" button text on modal depending on condition
171
+ if ( this.facebook.installer.nextStep == 'free_install' ) {
172
+ this.facebookInstallBtnText = this.modal.install;
173
+ } else if ( this.facebook.installer.nextStep == 'free_activate' || this.facebook.installer.nextStep == 'pro_activate' ) {
174
+ this.facebookInstallBtnText = this.modal.activate;
175
+ }
176
+ }
177
  })
admin/assets/js/settings.js CHANGED
@@ -1,1059 +1,1059 @@
1
- var sbiSettings;
2
-
3
- // Declaring as global variable for quick prototyping
4
- var settings_data = {
5
- adminUrl: sbi_settings.admin_url,
6
- nonce: sbi_settings.nonce,
7
- ajaxHandler: sbi_settings.ajax_handler,
8
- model: sbi_settings.model,
9
- feeds: sbi_settings.feeds,
10
- links: sbi_settings.links,
11
- tooltipName: null,
12
- sourcesList : sbi_settings.sources,
13
- dialogBoxPopupScreen : sbi_settings.dialogBoxPopupScreen,
14
- selectSourceScreen : sbi_settings.selectSourceScreen,
15
-
16
- socialWallActivated: sbi_settings.socialWallActivated,
17
- socialWallLinks: sbi_settings.socialWallLinks,
18
- stickyWidget: false,
19
- exportFeed: 'none',
20
- locales: sbi_settings.locales,
21
- timezones: sbi_settings.timezones,
22
- genericText: sbi_settings.genericText,
23
- generalTab: sbi_settings.generalTab,
24
- feedsTab: sbi_settings.feedsTab,
25
- translationTab: sbi_settings.translationTab,
26
- advancedTab: sbi_settings.advancedTab,
27
- footerUpgradeUrl: sbi_settings.footerUpgradeUrl,
28
- upgradeUrl: sbi_settings.upgradeUrl,
29
- supportPageUrl: sbi_settings.supportPageUrl,
30
- isDevSite: sbi_settings.isDevSite,
31
- licenseKey: sbi_settings.licenseKey,
32
- pluginItemName: sbi_settings.pluginItemName,
33
- licenseType: 'free',
34
- licenseStatus: sbi_settings.licenseStatus,
35
- licenseErrorMsg: sbi_settings.licenseErrorMsg,
36
- extensionsLicense: sbi_settings.extensionsLicense,
37
- extensionsLicenseKey: sbi_settings.extensionsLicenseKey,
38
- extensionFieldHasError: false,
39
- cronNextCheck: sbi_settings.nextCheck,
40
- currentView: null,
41
- selected: null,
42
- current: 0,
43
- sections: ["General", "Feeds", "Advanced"],
44
- indicator_width: 0,
45
- indicator_pos: 0,
46
- forwards: true,
47
- currentTab: null,
48
- import_file: null,
49
- gdprInfoTooltip: null,
50
- loaderSVG: sbi_settings.loaderSVG,
51
- checkmarkSVG: sbi_settings.checkmarkSVG,
52
- uploadSVG: sbi_settings.uploadSVG,
53
- exportSVG: sbi_settings.exportSVG,
54
- reloadSVG: sbi_settings.reloadSVG,
55
- tooltipHelpSvg: sbi_settings.tooltipHelpSvg,
56
- tooltip : {
57
- text : '',
58
- hover : false
59
- },
60
-
61
- cogSVG: sbi_settings.cogSVG,
62
- deleteSVG: sbi_settings.deleteSVG,
63
- svgIcons : sbi_settings.svgIcons,
64
-
65
- testConnectionStatus: null,
66
- recheckLicenseStatus: null,
67
- btnStatus: null,
68
- uploadStatus: null,
69
- clearCacheStatus: null,
70
- optimizeCacheStatus: null,
71
- clearErrorLogStatus: null,
72
- dpaResetStatus: null,
73
- pressedBtnName: null,
74
- loading: false,
75
- hasError: sbi_settings.hasError,
76
- dialogBox : {
77
- active : false,
78
- type : null,
79
- heading : null,
80
- description : null,
81
- customButtons : undefined
82
- },
83
- sourceToDelete : {},
84
- viewsActive : {
85
- sourcePopup : false,
86
- sourcePopupScreen : 'redirect_1',
87
- sourcePopupType : 'creation',
88
- instanceSourceActive : null,
89
- },
90
- //Add New Source
91
- newSourceData : sbi_settings.newSourceData ? sbi_settings.newSourceData : null,
92
- sourceConnectionURLs : sbi_settings.sourceConnectionURLs,
93
- returnedApiSourcesList : [],
94
- manualSourcePopupInit : sbi_settings.manualSourcePopupInit,
95
- addNewSource : {
96
- typeSelected : 'page',
97
- manualSourceID : null,
98
- manualSourceToken : null
99
- },
100
- selectedFeed : 'none',
101
- expandedFeedID : null,
102
- notificationElement : {
103
- type : 'success', // success, error, warning, message
104
- text : '',
105
- shown : null
106
- },
107
- selectedSourcesToConnect : [],
108
-
109
- //Loading Bar
110
- fullScreenLoader : false,
111
- appLoaded : false,
112
- previewLoaded : false,
113
- loadingBar : true,
114
- notificationElement : {
115
- type : 'success', // success, error, warning, message
116
- text : '',
117
- shown : null
118
- }
119
- };
120
-
121
- // The tab component
122
- Vue.component("tab", {
123
- props: ["section", "index"],
124
- template: `
125
- <a class='tab' :id='section.toLowerCase().trim()' @click='emitWidth($el);changeComponent(index);activeTab(section)'>{{section}}</a>
126
- `,
127
- created: () => {
128
- let urlParams = new URLSearchParams(window.location.search);
129
- let view = urlParams.get('view');
130
- if ( view === null ) {
131
- view = 'general';
132
- }
133
- settings_data.currentView = view;
134
- settings_data.currentTab = settings_data.sections[0];
135
- settings_data.selected = "app-1";
136
- },
137
- methods: {
138
- emitWidth: function(el) {
139
- settings_data.indicator_width = jQuery(el).outerWidth();
140
- settings_data.indicator_pos = jQuery(el).position().left;
141
- },
142
- changeComponent: function(index) {
143
- var prev = settings_data.current;
144
- if (prev < index) {
145
- settings_data.forwards = false;
146
- } else if (prev > index) {
147
- settings_data.forwards = true;
148
- }
149
- settings_data.selected = "app-" + (index + 1);
150
- settings_data.current = index;
151
- },
152
- activeTab: function(section) {
153
- this.setView(section.toLowerCase().trim());
154
- settings_data.currentTab = section;
155
- },
156
- setView: function(section) {
157
- history.replaceState({}, null, settings_data.adminUrl + 'admin.php?page=sbi-settings&view=' + section);
158
- }
159
- }
160
- });
161
-
162
- var sbiSettings = new Vue({
163
- el: "#sbi-settings",
164
- http: {
165
- emulateJSON: true,
166
- emulateHTTP: true
167
- },
168
- data: settings_data,
169
- created: function() {
170
- this.$nextTick(function() {
171
- let tabEl = document.querySelector('.tab');
172
- settings_data.indicator_width = tabEl.offsetWidth;
173
- });
174
- setTimeout(function(){
175
- settings_data.appLoaded = true;
176
- },350);
177
- },
178
- mounted: function(){
179
- var self = this;
180
- // set the current view page on page load
181
- let activeEl = document.querySelector('a.tab#' + settings_data.currentView);
182
- // we have to uppercase the first letter
183
- let currentView = settings_data.currentView.charAt(0).toUpperCase() + settings_data.currentView.slice(1);
184
- let viewIndex = settings_data.sections.indexOf(currentView) + 1;
185
- settings_data.indicator_width = activeEl.offsetWidth;
186
- settings_data.indicator_pos = activeEl.offsetLeft;
187
- settings_data.selected = "app-" + viewIndex;
188
- settings_data.current = viewIndex;
189
- settings_data.currentTab = currentView;
190
-
191
- setTimeout(function(){
192
- settings_data.appLoaded = true;
193
- },350);
194
-
195
- },
196
- computed: {
197
- getStyle: function() {
198
- return {
199
- position: "absolute",
200
- bottom: "0px",
201
- left: settings_data.indicator_pos + "px",
202
- width: settings_data.indicator_width + "px",
203
- height: "2px"
204
- };
205
- },
206
- chooseDirection: function() {
207
- if (settings_data.forwards == true) {
208
- return "slide-fade";
209
- } else {
210
- return "slide-fade";
211
- }
212
- }
213
- },
214
- methods: {
215
- activateLicense: function() {
216
- if (this.licenseType === 'free') {
217
- this.runOneClickUpgrade();
218
- } else {
219
- this.activateProLicense();
220
- }
221
- },
222
- activateProLicense: function() {
223
- this.hasError = false;
224
- this.loading = true;
225
- this.pressedBtnName = 'sbi';
226
-
227
- let data = new FormData();
228
- data.append( 'action', 'sbi_activate_license' );
229
- data.append( 'license_key', this.licenseKey );
230
- data.append( 'nonce', this.nonce );
231
- fetch(this.ajaxHandler, {
232
- method: "POST",
233
- credentials: 'same-origin',
234
- body: data
235
- })
236
- .then(response => response.json())
237
- .then(data => {
238
- if ( data.success == false ) {
239
- this.licenseStatus = 'inactive';
240
- this.hasError = true;
241
- this.loading = false;
242
- return;
243
- }
244
- if ( data.success == true ) {
245
- let licenseData = data.data.licenseData;
246
- this.licenseStatus = data.data.licenseStatus;
247
- this.loading = false;
248
- this.pressedBtnName = null;
249
-
250
- if (
251
- data.data.licenseStatus == 'inactive' ||
252
- data.data.licenseStatus == 'invalid' ||
253
- data.data.licenseStatus == 'expired'
254
- ) {
255
- this.hasError = true;
256
- if( licenseData.error ) {
257
- this.licenseErrorMsg = licenseData.errorMsg
258
- }
259
- }
260
- }
261
- return;
262
- });
263
- },
264
- deactivateLicense: function() {
265
- this.loading = true;
266
- this.pressedBtnName = 'sbi';
267
- let data = new FormData();
268
- data.append( 'action', 'sbi_deactivate_license' );
269
- data.append( 'nonce', this.nonce );
270
- fetch(this.ajaxHandler, {
271
- method: "POST",
272
- credentials: 'same-origin',
273
- body: data
274
- })
275
- .then(response => response.json())
276
- .then(data => {
277
- if ( data.success == true ) {
278
- this.licenseStatus = data.data.licenseStatus ;
279
- this.loading = false;
280
- this.pressedBtnName = null;
281
- }
282
- return;
283
- });
284
- },
285
-
286
- runOneClickUpgrade: function() {
287
- this.hasError = false;
288
- this.loading = true;
289
- this.pressedBtnName = 'sbi';
290
-
291
- let data = new FormData();
292
- data.append( 'action', 'sbi_maybe_upgrade_redirect' );
293
- data.append( 'license_key', this.licenseKey );
294
- data.append( 'nonce', this.nonce );
295
- fetch(this.ajaxHandler, {
296
- method: "POST",
297
- credentials: 'same-origin',
298
- body: data
299
- })
300
- .then(response => response.json())
301
- .then(data => {
302
- if ( data.success === false ) {
303
- this.licenseStatus = 'invalid';
304
- this.hasError = true;
305
- this.loading = false;
306
- if( typeof data.data !== 'undefined' ) {
307
- this.licenseErrorMsg = data.data.message
308
- }
309
- return;
310
- }
311
- if ( data.success === true ) {
312
- window.location.href = data.data.url
313
- }
314
- return;
315
- });
316
- },
317
-
318
- licenseActiveAction: function(extension) {
319
- extension = typeof extension !== 'undefined' ? extension : false;
320
- if (this.licenseType === 'free') {
321
- this.runOneClickUpgrade();
322
- } else {
323
- if (typeof extension !== 'undefined') {
324
- this.deactivateExtensionLicense(extension);
325
- } else {
326
- this.deactivateLicense();
327
- }
328
- }
329
-
330
- },
331
-
332
- /**
333
- * Activate Extensions License
334
- *
335
- * @since 4.0
336
- *
337
- * @param {object} extension
338
- */
339
- activateExtensionLicense: function( extension ) {
340
- let licenseKey = this.extensionsLicenseKey[extension.name];
341
- this.extensionFieldHasError = false;
342
- this.loading = true;
343
- this.pressedBtnName = extension.name;
344
- if ( ! licenseKey ) {
345
- this.loading = false;
346
- this.extensionFieldHasError = true;
347
- return;
348
- }
349
- let data = new FormData();
350
- data.append( 'action', 'sbi_activate_extension_license' );
351
- data.append( 'license_key', licenseKey );
352
- data.append( 'extension_name', extension.name );
353
- data.append( 'extension_item_name', extension.itemName );
354
- data.append( 'nonce', this.nonce );
355
- fetch(this.ajaxHandler, {
356
- method: "POST",
357
- credentials: 'same-origin',
358
- body: data
359
- })
360
- .then(response => response.json())
361
- .then(data => {
362
- this.loading = false;
363
- if ( data.success == true ) {
364
- this.extensionFieldHasError = false;
365
- this.pressedBtnName = null;
366
- if ( data.data.licenseStatus == 'invalid' ) {
367
- this.extensionFieldHasError = true;
368
- this.notificationElement = {
369
- type : 'error',
370
- text : this.genericText.invalidLicenseKey,
371
- shown : "shown"
372
- };
373
- }
374
- if ( data.data.licenseStatus == 'valid' ) {
375
- this.notificationElement = {
376
- type : 'success',
377
- text : this.genericText.licenseActivated,
378
- shown : "shown"
379
- };
380
- }
381
- extension.licenseStatus = data.data.licenseStatus;
382
- extension.licenseKey = licenseKey;
383
-
384
- setTimeout(function(){
385
- this.notificationElement.shown = "hidden";
386
- }.bind(this), 3000);
387
- }
388
- return;
389
- });
390
- },
391
-
392
- /**
393
- * Deactivate Extensions License
394
- *
395
- * @since 4.0
396
- *
397
- * @param {object} extension
398
- */
399
- deactivateExtensionLicense: function( extension ) {
400
- let licenseKey = this.extensionsLicenseKey[extension.name];
401
- this.extensionFieldHasError = false;
402
- this.loading = true;
403
- this.pressedBtnName = extension.name;
404
- let data = new FormData();
405
- data.append( 'action', 'sbi_deactivate_extension_license' );
406
- data.append( 'extension_name', extension.name );
407
- data.append( 'extension_item_name', extension.itemName );
408
- data.append( 'nonce', this.nonce );
409
- fetch(this.ajaxHandler, {
410
- method: "POST",
411
- credentials: 'same-origin',
412
- body: data
413
- })
414
- .then(response => response.json())
415
- .then(data => {
416
- this.loading = false;
417
- if ( data.success == true ) {
418
- this.extensionFieldHasError = false;
419
- this.pressedBtnName = null;
420
- if ( data.data.licenseStatus == 'deactivated' ) {
421
- this.notificationElement = {
422
- type : 'success',
423
- text : this.genericText.licenseDeactivated,
424
- shown : "shown"
425
- };
426
- }
427
- extension.licenseStatus = data.data.licenseStatus;
428
- extension.licenseKey = licenseKey;
429
-
430
- setTimeout(function(){
431
- this.notificationElement.shown = "hidden";
432
- }.bind(this), 3000);
433
- }
434
- return;
435
- });
436
- },
437
- testConnection: function() {
438
- this.testConnectionStatus = 'loading';
439
- let data = new FormData();
440
- data.append( 'action', 'sbi_test_connection' );
441
- data.append( 'nonce', this.nonce );
442
- fetch(this.ajaxHandler, {
443
- method: "POST",
444
- credentials: 'same-origin',
445
- body: data
446
- })
447
- .then(response => response.json())
448
- .then(data => {
449
- if ( data.success == false ) {
450
- this.testConnectionStatus = 'error';
451
- this.testConnectionStatusMessage = data.data.error;
452
- }
453
- if ( data.success == true ) {
454
- this.testConnectionStatus = 'success';
455
-
456
- setTimeout(function() {
457
- this.testConnectionStatus = null;
458
- }.bind(this), 3000);
459
- }
460
- return;
461
- });
462
- },
463
- recheckLicense: function( licenseKey, itemName, optionName = null ) {
464
- this.recheckLicenseStatus = 'loading';
465
- this.pressedBtnName = optionName;
466
- let data = new FormData();
467
- data.append( 'action', 'sbi_recheck_connection' );
468
- data.append( 'license_key', licenseKey );
469
- data.append( 'item_name', itemName );
470
- data.append( 'option_name', optionName );
471
- data.append( 'nonce', this.nonce );
472
- fetch(this.ajaxHandler, {
473
- method: "POST",
474
- credentials: 'same-origin',
475
- body: data
476
- })
477
- .then(response => response.json())
478
- .then(data => {
479
- if ( data.success == true ) {
480
- if ( data.data.license == 'valid' ) {
481
- this.recheckLicenseStatus = 'success';
482
- }
483
- if ( data.data.license == 'expired' ) {
484
- this.recheckLicenseStatus = 'error';
485
- }
486
-
487
- // if the api license status has changed from old stored license status
488
- // then reload the page to show proper error message and notices
489
- // or hide error messages and notices
490
- if ( data.data.licenseChanged == true ) {
491
- location.reload();
492
- }
493
-
494
- setTimeout(function() {
495
- this.pressedBtnName = null;
496
- this.recheckLicenseStatus = null;
497
- }.bind(this), 3000);
498
- }
499
- return;
500
- });
501
- },
502
- recheckLicenseIcon: function() {
503
- if ( this.recheckLicenseStatus == null ) {
504
- return this.generalTab.licenseBox.recheckLicense;
505
- } else if ( this.recheckLicenseStatus == 'loading' ) {
506
- return this.loaderSVG;
507
- } else if ( this.recheckLicenseStatus == 'success' ) {
508
- return '<i class="fa fa-check-circle"></i> ' + this.generalTab.licenseBox.licenseValid;
509
- } else if ( this.recheckLicenseStatus == 'error' ) {
510
- return '<i class="fa fa-times-circle"></i> ' + this.generalTab.licenseBox.licenseExpired;
511
- }
512
- },
513
- recheckBtnText: function( btnName ) {
514
- if ( this.recheckLicenseStatus == null || this.pressedBtnName != btnName ) {
515
- return this.generalTab.licenseBox.recheckLicense;
516
- } else if ( this.recheckLicenseStatus == 'loading' && this.pressedBtnName == btnName ) {
517
- return this.loaderSVG;
518
- } else if ( this.recheckLicenseStatus == 'success' ) {
519
- return '<i class="fa fa-check-circle"></i> ' + this.generalTab.licenseBox.licenseValid;
520
- } else if ( this.recheckLicenseStatus == 'error' ) {
521
- return '<i class="fa fa-times-circle"></i> ' + this.generalTab.licenseBox.licenseExpired;
522
- }
523
- },
524
- testConnectionIcon: function() {
525
- if ( this.testConnectionStatus == 'loading' ) {
526
- return this.loaderSVG;
527
- } else if ( this.testConnectionStatus == 'success' ) {
528
- return '<i class="fa fa-check-circle"></i> ' + this.generalTab.licenseBox.connectionSuccessful;
529
- } else if ( this.testConnectionStatus == 'error' ) {
530
- return `<i class="fa fa-times-circle"></i> ${this.generalTab.licenseBox.connectionFailed} ${this.testConnectionStatusMessage}</a>`;
531
- }
532
- },
533
- importFile: function() {
534
- document.getElementById("import_file").click();
535
- },
536
- uploadFile: function( event ) {
537
- this.uploadStatus = 'loading';
538
- let file = this.$refs.file.files[0];
539
- let data = new FormData();
540
- data.append( 'action', 'sbi_import_settings_json' );
541
- data.append( 'file', file );
542
- data.append( 'nonce', this.nonce );
543
- fetch(this.ajaxHandler, {
544
- method: "POST",
545
- credentials: 'same-origin',
546
- body: data
547
- })
548
- .then(response => response.json())
549
- .then(data => {
550
- this.uploadStatus = null;
551
- this.$refs.file.files[0] = null;
552
- if ( data.success == false ) {
553
- this.notificationElement = {
554
- type : 'error',
555
- text : this.genericText.failedToImportFeed,
556
- shown : "shown"
557
- };
558
- }
559
- if ( data.success == true ) {
560
- this.feeds = data.data.feeds;
561
- this.notificationElement = {
562
- type : 'success',
563
- text : this.genericText.feedImported,
564
- shown : "shown"
565
- };
566
- }
567
- setTimeout(function(){
568
- this.notificationElement.shown = "hidden";
569
- }.bind(this), 3000);
570
- });
571
- },
572
- exportFeedSettings: function() {
573
- // return if no feed is selected
574
- if ( this.exportFeed === 'none' ) {
575
- return;
576
- }
577
-
578
- let url = this.ajaxHandler + '?action=sbi_export_settings_json&nonce=' + this.nonce + '&feed_id=' + this.exportFeed;
579
- window.location = url;
580
- },
581
- saveSettings: function() {
582
- this.btnStatus = 'loading';
583
- this.pressedBtnName = 'saveChanges';
584
- let data = new FormData();
585
- data.append( 'action', 'sbi_save_settings' );
586
- data.append( 'model', JSON.stringify( this.model ) );
587
- data.append( 'sbi_license_key', this.licenseKey );
588
- data.append( 'extensions_license_key', JSON.stringify( this.extensionsLicenseKey ) );
589
- data.append( 'nonce', this.nonce );
590
- fetch(this.ajaxHandler, {
591
- method: "POST",
592
- credentials: 'same-origin',
593
- body: data
594
- })
595
- .then(response => response.json())
596
- .then(data => {
597
- if ( data.success == false ) {
598
- this.btnStatus = 'error';
599
- return;
600
- }
601
-
602
- this.cronNextCheck = data.data.cronNextCheck;
603
- this.btnStatus = 'success';
604
- setTimeout(function() {
605
- this.btnStatus = null;
606
- this.pressedBtnName = null;
607
- }.bind(this), 3000);
608
- });
609
- },
610
- clearCache: function() {
611
- this.clearCacheStatus = 'loading';
612
- let data = new FormData();
613
- data.append( 'action', 'sbi_clear_cache' );
614
- data.append( 'model', JSON.stringify( this.model ) );
615
- data.append( 'nonce', this.nonce );
616
- fetch(this.ajaxHandler, {
617
- method: "POST",
618
- credentials: 'same-origin',
619
- body: data
620
- })
621
- .then(response => response.json())
622
- .then(data => {
623
- if ( data.success == false ) {
624
- this.clearCacheStatus = 'error';
625
- return;
626
- }
627
-
628
- this.cronNextCheck = data.data.cronNextCheck;
629
- this.clearCacheStatus = 'success';
630
- setTimeout(function() {
631
- this.clearCacheStatus = null;
632
- }.bind(this), 3000);
633
- });
634
- },
635
- showTooltip: function( tooltipName ) {
636
- this.tooltipName = tooltipName;
637
- },
638
- hideTooltip: function() {
639
- this.tooltipName = null;
640
- },
641
- gdprOptions: function() {
642
- this.gdprInfoTooltip = null;
643
- },
644
- gdprLimited: function() {
645
- this.gdprInfoTooltip = this.gdprInfoTooltip == null ? true : null;
646
- },
647
- clearImageResizeCache: function() {
648
- this.optimizeCacheStatus = 'loading';
649
- let data = new FormData();
650
- data.append( 'action', 'sbi_clear_image_resize_cache' );
651
- data.append( 'nonce', this.nonce );
652
- fetch(this.ajaxHandler, {
653
- method: "POST",
654
- credentials: 'same-origin',
655
- body: data
656
- })
657
- .then(response => response.json())
658
- .then(data => {
659
- if ( data.success == false ) {
660
- this.optimizeCacheStatus = 'error';
661
- return;
662
- }
663
- this.optimizeCacheStatus = 'success';
664
- setTimeout(function() {
665
- this.optimizeCacheStatus = null;
666
- }.bind(this), 3000);
667
- });
668
- },
669
- resetErrorLog: function() {
670
- this.clearErrorLogStatus = 'loading';
671
- let data = new FormData();
672
- data.append( 'action', 'sbi_clear_error_log' );
673
- data.append( 'nonce', this.nonce );
674
- fetch(this.ajaxHandler, {
675
- method: "POST",
676
- credentials: 'same-origin',
677
- body: data
678
- })
679
- .then(response => response.json())
680
- .then(data => {
681
- if ( ! data.success ) {
682
- this.clearErrorLogStatus = 'error';
683
- return;
684
- }
685
- this.clearErrorLogStatus = 'success';
686
- setTimeout(function() {
687
- this.clearErrorLogStatus = null;
688
- }.bind(this), 3000);
689
- });
690
- },
691
- dpaReset: function() {
692
- this.dpaResetStatus = 'loading';
693
- let data = new FormData();
694
- data.append( 'action', 'sbi_dpa_reset' );
695
- data.append( 'nonce', this.nonce );
696
- fetch(this.ajaxHandler, {
697
- method: "POST",
698
- credentials: 'same-origin',
699
- body: data
700
- })
701
- .then(response => response.json())
702
- .then(data => {
703
- if ( data.success == false ) {
704
- this.dpaResetStatus = 'error';
705
- return;
706
- }
707
- this.dpaResetStatus = 'success';
708
- setTimeout(function() {
709
- this.dpaResetStatus = null;
710
- }.bind(this), 3000);
711
- });
712
- },
713
- resetErrorLogIcon: function() {
714
- if ( this.clearErrorLogStatus === null ) {
715
- return;
716
- }
717
- if ( this.clearErrorLogStatus == 'loading' ) {
718
- return this.loaderSVG;
719
- } else if ( this.clearErrorLogStatus == 'success' ) {
720
- return this.checkmarkSVG;
721
- } else if ( this.clearErrorLogStatus == 'error' ) {
722
- return `<i class="fa fa-times-circle"></i>`;
723
- }
724
- },
725
- saveChangesIcon: function() {
726
- if ( this.btnStatus === 'loading' ) {
727
- return this.loaderSVG;
728
- } else if ( this.btnStatus === 'success' ) {
729
- return this.checkmarkSVG;
730
- } else if ( this.btnStatus === 'error' ) {
731
- return `<i class="fa fa-times-circle"></i>`;
732
- }
733
- },
734
- importBtnIcon: function() {
735
- if ( this.uploadStatus === null ) {
736
- return this.uploadSVG;
737
- }
738
- if ( this.uploadStatus == 'loading' ) {
739
- return this.loaderSVG;
740
- } else if ( this.uploadStatus == 'success' ) {
741
- return this.checkmarkSVG;
742
- } else if ( this.uploadStatus == 'error' ) {
743
- return `<i class="fa fa-times-circle"></i>`;
744
- }
745
- },
746
- clearCacheIcon: function() {
747
- if ( this.clearCacheStatus === null ) {
748
- return this.reloadSVG;
749
- }
750
- if ( this.clearCacheStatus == 'loading' ) {
751
- return this.loaderSVG;
752
- } else if ( this.clearCacheStatus == 'success' ) {
753
- return this.checkmarkSVG;
754
- } else if ( this.clearCacheStatus == 'error' ) {
755
- return `<i class="fa fa-times-circle"></i>`;
756
- }
757
- },
758
- clearImageResizeCacheIcon: function() {
759
- if ( this.optimizeCacheStatus === null ) {
760
- return;
761
- }
762
- if ( this.optimizeCacheStatus == 'loading' ) {
763
- return this.loaderSVG;
764
- } else if ( this.optimizeCacheStatus == 'success' ) {
765
- return this.checkmarkSVG;
766
- } else if ( this.optimizeCacheStatus == 'error' ) {
767
- return `<i class="fa fa-times-circle"></i>`;
768
- }
769
- },
770
- dpaResetStatusIcon: function() {
771
- if ( this.dpaResetStatus === null ) {
772
- return;
773
- }
774
- if ( this.dpaResetStatus == 'loading' ) {
775
- return this.loaderSVG;
776
- } else if ( this.dpaResetStatus == 'success' ) {
777
- return this.checkmarkSVG;
778
- } else if ( this.dpaResetStatus == 'error' ) {
779
- return `<i class="fa fa-times-circle"></i>`;
780
- }
781
- },
782
-
783
- /**
784
- * Toggle Sticky Widget view
785
- *
786
- * @since 4.0
787
- */
788
- toggleStickyWidget: function() {
789
- this.stickyWidget = !this.stickyWidget;
790
- },
791
-
792
- printUsedInText: function( usedInNumber ){
793
- if(usedInNumber == 0){
794
- return this.genericText.sourceNotUsedYet;
795
- }
796
- return this.genericText.usedIn + ' ' + usedInNumber + ' ' +(usedInNumber == 1 ? this.genericText.feed : this.genericText.feeds);
797
- },
798
-
799
- /**
800
- * Delete Source Ajax
801
- *
802
- * @since 4.0
803
- */
804
- deleteSource : function(sourceToDelete){
805
- var self = this;
806
- let data = new FormData();
807
- data.append( 'action', 'sbi_feed_saver_manager_delete_source' );
808
- data.append( 'source_id', sourceToDelete.id);
809
- data.append( 'nonce', this.nonce );
810
- fetch(self.ajaxHandler, {
811
- method: "POST",
812
- credentials: 'same-origin',
813
- body: data
814
- })
815
- .then(response => response.json())
816
- .then(data => {
817
- if (sourceToDelete.just_added) {
818
- window.location.href = window.location.href.replace('sbi_access_token','sbi_null');
819
- }
820
- self.sourcesList = data;
821
- });
822
- },
823
-
824
- /**
825
- * Check if Value is Empty
826
- *
827
- * @since 4.0
828
- *
829
- * @return boolean
830
- */
831
- checkNotEmpty : function(value){
832
- return value != null && value.replace(/ /gi,'') != '';
833
- },
834
-
835
- /**
836
- * Activate View
837
- *
838
- * @since 4.0
839
- */
840
- activateView : function(viewName, sourcePopupType = 'creation', ajaxAction = false){
841
- var self = this;
842
- self.viewsActive[viewName] = (self.viewsActive[viewName] == false ) ? true : false;
843
- if(viewName == 'sourcePopup' && sourcePopupType == 'creationRedirect'){
844
- setTimeout(function(){
845
- self.$refs.addSourceRef.processIFConnect()
846
- },3500);
847
- }
848
-
849
- },
850
-
851
- /**
852
- * Switch & Change Feed Screens
853
- *
854
- * @since 4.0
855
- */
856
- switchScreen: function(screenType, screenName){
857
- this.viewsActive[screenType] = screenName;
858
- },
859
-
860
- /**
861
- * Parse JSON
862
- *
863
- * @since 4.0
864
- *
865
- * @return jsonObject / Boolean
866
- */
867
- jsonParse : function(jsonString){
868
- try {
869
- return JSON.parse(jsonString);
870
- } catch(e) {
871
- return false;
872
- }
873
- },
874
-
875
-
876
- /**
877
- * Ajax Post Action
878
- *
879
- * @since 4.0
880
- */
881
- ajaxPost : function(data, callback){
882
- var self = this;
883
- self.$http.post(self.ajaxHandler,data).then(callback);
884
- },
885
-
886
- /**
887
- * Check if Object has Nested Property
888
- *
889
- * @since 4.0
890
- *
891
- * @return boolean
892
- */
893
- hasOwnNestedProperty : function(obj,propertyPath) {
894
- if (!propertyPath){return false;}var properties = propertyPath.split('.');
895
- for (var i = 0; i < properties.length; i++) {
896
- var prop = properties[i];
897
- if (!obj || !obj.hasOwnProperty(prop)) {
898
- return false;
899
- } else {
900
- obj = obj[prop];
901
- }
902
- }
903
- return true;
904
- },
905
-
906
- /**
907
- * Show Tooltip on Hover
908
- *
909
- * @since 4.0
910
- */
911
- toggleElementTooltip : function(tooltipText, type, align = 'center'){
912
- var self = this,
913
- target = window.event.currentTarget,
914
- tooltip = (target != undefined && target != null) ? document.querySelector('.sb-control-elem-tltp-content') : null;
915
- if(tooltip != null && type == 'show'){
916
- self.tooltip.text = tooltipText;
917
- var position = target.getBoundingClientRect(),
918
- left = position.left + 10,
919
- top = position.top - 10;
920
- tooltip.style.left = left + 'px';
921
- tooltip.style.top = top + 'px';
922
- tooltip.style.textAlign = align;
923
- self.tooltip.hover = true;
924
- }
925
- if(type == 'hide'){
926
- self.tooltip.hover = false;
927
- }
928
- },
929
-
930
- /**
931
- * Hover Tooltip
932
- *
933
- * @since 4.0
934
- */
935
- hoverTooltip : function(type){
936
- this.tooltip.hover = type;
937
- },
938
-
939
- /**
940
- * Open Dialog Box
941
- *
942
- * @since 4.0
943
- */
944
- openDialogBox : function(type, args = []){
945
- var self = this,
946
- heading = self.dialogBoxPopupScreen[type].heading,
947
- description = self.dialogBoxPopupScreen[type].description,
948
- customButtons = self.dialogBoxPopupScreen[type].customButtons;
949
-
950
- switch (type) {
951
- case "deleteSource":
952
- self.sourceToDelete = args;
953
- heading = heading.replace("#", self.sourceToDelete.username);
954
- break;
955
- }
956
- self.dialogBox = {
957
- active : true,
958
- type : type,
959
- heading : heading,
960
- description : description,
961
- customButtons : customButtons
962
- };
963
- },
964
-
965
-
966
- /**
967
- * Confirm Dialog Box Actions
968
- *
969
- * @since 4.0
970
- */
971
- confirmDialogAction : function(){
972
- var self = this;
973
- switch (self.dialogBox.type) {
974
- case 'deleteSource':
975
- self.deleteSource(self.sourceToDelete);
976
- break;
977
- }
978
- },
979
-
980
- /**
981
- * Display Feed Sources Settings
982
- *
983
- * @since 4.0
984
- *
985
- * @param {object} source
986
- * @param {int} sourceIndex
987
- */
988
- displayFeedSettings: function(source, sourceIndex) {
989
- this.expandedFeedID = sourceIndex + 1;
990
- },
991
-
992
- /**
993
- * Hide Feed Sources Settings
994
- *
995
- * @since 4.0
996
- *
997
- * @param {object} source
998
- * @param {int} sourceIndex
999
- */
1000
- hideFeedSettings: function() {
1001
- this.expandedFeedID = null;
1002
- },
1003
-
1004
- /**
1005
- * Copy text to clipboard
1006
- *
1007
- * @since 4.0
1008
- */
1009
- copyToClipBoard : function(value){
1010
- var self = this;
1011
- const el = document.createElement('textarea');
1012
- el.className = 'sbi-fb-cp-clpboard';
1013
- el.value = value;
1014
- document.body.appendChild(el);
1015
- el.select();
1016
- document.execCommand('copy');
1017
- document.body.removeChild(el);
1018
- self.notificationElement = {
1019
- type : 'success',
1020
- text : this.genericText.copiedClipboard,
1021
- shown : "shown"
1022
- };
1023
- setTimeout(function(){
1024
- self.notificationElement.shown = "hidden";
1025
- }, 3000);
1026
- },
1027
-
1028
-
1029
- /**
1030
- * View Source Instances
1031
- *
1032
- * @since 4.0
1033
- */
1034
- viewSourceInstances : function(source){
1035
- var self = this;
1036
- self.viewsActive.instanceSourceActive = source;
1037
- },
1038
-
1039
- /**
1040
- * Return Page/Group Avatar
1041
- *
1042
- * @since 4.0
1043
- *
1044
- * @return string
1045
- */
1046
- returnAccountAvatar : function(source){
1047
- if (typeof source.local_avatar_url !== "undefined" && source.local_avatar_url !== '') {
1048
- return source.local_avatar_url;
1049
- }
1050
- if (typeof source.avatar_url !== "undefined" && source.avatar_url !== '') {
1051
- return source.avatar_url;
1052
- }
1053
-
1054
- return false;
1055
- },
1056
-
1057
- }
1058
- });
1059
-
1
+ var sbiSettings;
2
+
3
+ // Declaring as global variable for quick prototyping
4
+ var settings_data = {
5
+ adminUrl: sbi_settings.admin_url,
6
+ nonce: sbi_settings.nonce,
7
+ ajaxHandler: sbi_settings.ajax_handler,
8
+ model: sbi_settings.model,
9
+ feeds: sbi_settings.feeds,
10
+ links: sbi_settings.links,
11
+ tooltipName: null,
12
+ sourcesList : sbi_settings.sources,
13
+ dialogBoxPopupScreen : sbi_settings.dialogBoxPopupScreen,
14
+ selectSourceScreen : sbi_settings.selectSourceScreen,
15
+
16
+ socialWallActivated: sbi_settings.socialWallActivated,
17
+ socialWallLinks: sbi_settings.socialWallLinks,
18
+ stickyWidget: false,
19
+ exportFeed: 'none',
20
+ locales: sbi_settings.locales,
21
+ timezones: sbi_settings.timezones,
22
+ genericText: sbi_settings.genericText,
23
+ generalTab: sbi_settings.generalTab,
24
+ feedsTab: sbi_settings.feedsTab,
25
+ translationTab: sbi_settings.translationTab,
26
+ advancedTab: sbi_settings.advancedTab,
27
+ footerUpgradeUrl: sbi_settings.footerUpgradeUrl,
28
+ upgradeUrl: sbi_settings.upgradeUrl,
29
+ supportPageUrl: sbi_settings.supportPageUrl,
30
+ isDevSite: sbi_settings.isDevSite,
31
+ licenseKey: sbi_settings.licenseKey,
32
+ pluginItemName: sbi_settings.pluginItemName,
33
+ licenseType: 'free',
34
+ licenseStatus: sbi_settings.licenseStatus,
35
+ licenseErrorMsg: sbi_settings.licenseErrorMsg,
36
+ extensionsLicense: sbi_settings.extensionsLicense,
37
+ extensionsLicenseKey: sbi_settings.extensionsLicenseKey,
38
+ extensionFieldHasError: false,
39
+ cronNextCheck: sbi_settings.nextCheck,
40
+ currentView: null,
41
+ selected: null,
42
+ current: 0,
43
+ sections: ["General", "Feeds", "Advanced"],
44
+ indicator_width: 0,
45
+ indicator_pos: 0,
46
+ forwards: true,
47
+ currentTab: null,
48
+ import_file: null,
49
+ gdprInfoTooltip: null,
50
+ loaderSVG: sbi_settings.loaderSVG,
51
+ checkmarkSVG: sbi_settings.checkmarkSVG,
52
+ uploadSVG: sbi_settings.uploadSVG,
53
+ exportSVG: sbi_settings.exportSVG,
54
+ reloadSVG: sbi_settings.reloadSVG,
55
+ tooltipHelpSvg: sbi_settings.tooltipHelpSvg,
56
+ tooltip : {
57
+ text : '',
58
+ hover : false
59
+ },
60
+
61
+ cogSVG: sbi_settings.cogSVG,
62
+ deleteSVG: sbi_settings.deleteSVG,
63
+ svgIcons : sbi_settings.svgIcons,
64
+
65
+ testConnectionStatus: null,
66
+ recheckLicenseStatus: null,
67
+ btnStatus: null,
68
+ uploadStatus: null,
69
+ clearCacheStatus: null,
70
+ optimizeCacheStatus: null,
71
+ clearErrorLogStatus: null,
72
+ dpaResetStatus: null,
73
+ pressedBtnName: null,
74
+ loading: false,
75
+ hasError: sbi_settings.hasError,
76
+ dialogBox : {
77
+ active : false,
78
+ type : null,
79
+ heading : null,
80
+ description : null,
81
+ customButtons : undefined
82
+ },
83
+ sourceToDelete : {},
84
+ viewsActive : {
85
+ sourcePopup : false,
86
+ sourcePopupScreen : 'redirect_1',
87
+ sourcePopupType : 'creation',
88
+ instanceSourceActive : null,
89
+ },
90
+ //Add New Source
91
+ newSourceData : sbi_settings.newSourceData ? sbi_settings.newSourceData : null,
92
+ sourceConnectionURLs : sbi_settings.sourceConnectionURLs,
93
+ returnedApiSourcesList : [],
94
+ manualSourcePopupInit : sbi_settings.manualSourcePopupInit,
95
+ addNewSource : {
96
+ typeSelected : 'page',
97
+ manualSourceID : null,
98
+ manualSourceToken : null
99
+ },
100
+ selectedFeed : 'none',
101
+ expandedFeedID : null,
102
+ notificationElement : {
103
+ type : 'success', // success, error, warning, message
104
+ text : '',
105
+ shown : null
106
+ },
107
+ selectedSourcesToConnect : [],
108
+
109
+ //Loading Bar
110
+ fullScreenLoader : false,
111
+ appLoaded : false,
112
+ previewLoaded : false,
113
+ loadingBar : true,
114
+ notificationElement : {
115
+ type : 'success', // success, error, warning, message
116
+ text : '',
117
+ shown : null
118
+ }
119
+ };
120
+
121
+ // The tab component
122
+ Vue.component("tab", {
123
+ props: ["section", "index"],
124
+ template: `
125
+ <a class='tab' :id='section.toLowerCase().trim()' @click='emitWidth($el);changeComponent(index);activeTab(section)'>{{section}}</a>
126
+ `,
127
+ created: () => {
128
+ let urlParams = new URLSearchParams(window.location.search);
129
+ let view = urlParams.get('view');
130
+ if ( view === null ) {
131
+ view = 'general';
132
+ }
133
+ settings_data.currentView = view;
134
+ settings_data.currentTab = settings_data.sections[0];
135
+ settings_data.selected = "app-1";
136
+ },
137
+ methods: {
138
+ emitWidth: function(el) {
139
+ settings_data.indicator_width = jQuery(el).outerWidth();
140
+ settings_data.indicator_pos = jQuery(el).position().left;
141
+ },
142
+ changeComponent: function(index) {
143
+ var prev = settings_data.current;
144
+ if (prev < index) {
145
+ settings_data.forwards = false;
146
+ } else if (prev > index) {
147
+ settings_data.forwards = true;
148
+ }
149
+ settings_data.selected = "app-" + (index + 1);
150
+ settings_data.current = index;
151
+ },
152
+ activeTab: function(section) {
153
+ this.setView(section.toLowerCase().trim());
154
+ settings_data.currentTab = section;
155
+ },
156
+ setView: function(section) {
157
+ history.replaceState({}, null, settings_data.adminUrl + 'admin.php?page=sbi-settings&view=' + section);
158
+ }
159
+ }
160
+ });
161
+
162
+ var sbiSettings = new Vue({
163
+ el: "#sbi-settings",
164
+ http: {
165
+ emulateJSON: true,
166
+ emulateHTTP: true
167
+ },
168
+ data: settings_data,
169
+ created: function() {
170
+ this.$nextTick(function() {
171
+ let tabEl = document.querySelector('.tab');
172
+ settings_data.indicator_width = tabEl.offsetWidth;
173
+ });
174
+ setTimeout(function(){
175
+ settings_data.appLoaded = true;
176
+ },350);
177
+ },
178
+ mounted: function(){
179
+ var self = this;
180
+ // set the current view page on page load
181
+ let activeEl = document.querySelector('a.tab#' + settings_data.currentView);
182
+ // we have to uppercase the first letter
183
+ let currentView = settings_data.currentView.charAt(0).toUpperCase() + settings_data.currentView.slice(1);
184
+ let viewIndex = settings_data.sections.indexOf(currentView) + 1;
185
+ settings_data.indicator_width = activeEl.offsetWidth;
186
+ settings_data.indicator_pos = activeEl.offsetLeft;
187
+ settings_data.selected = "app-" + viewIndex;
188
+ settings_data.current = viewIndex;
189
+ settings_data.currentTab = currentView;
190
+
191
+ setTimeout(function(){
192
+ settings_data.appLoaded = true;
193
+ },350);
194
+
195
+ },
196
+ computed: {
197
+ getStyle: function() {
198
+ return {
199
+ position: "absolute",
200
+ bottom: "0px",
201
+ left: settings_data.indicator_pos + "px",
202
+ width: settings_data.indicator_width + "px",
203
+ height: "2px"
204
+ };
205
+ },
206
+ chooseDirection: function() {
207
+ if (settings_data.forwards == true) {
208
+ return "slide-fade";
209
+ } else {
210
+ return "slide-fade";
211
+ }
212
+ }
213
+ },
214
+ methods: {
215
+ activateLicense: function() {
216
+ if (this.licenseType === 'free') {
217
+ this.runOneClickUpgrade();
218
+ } else {
219
+ this.activateProLicense();
220
+ }
221
+ },
222
+ activateProLicense: function() {
223
+ this.hasError = false;
224
+ this.loading = true;
225
+ this.pressedBtnName = 'sbi';
226
+
227
+ let data = new FormData();
228
+ data.append( 'action', 'sbi_activate_license' );
229
+ data.append( 'license_key', this.licenseKey );
230
+ data.append( 'nonce', this.nonce );
231
+ fetch(this.ajaxHandler, {
232
+ method: "POST",
233
+ credentials: 'same-origin',
234
+ body: data
235
+ })
236
+ .then(response => response.json())
237
+ .then(data => {
238
+ if ( data.success == false ) {
239
+ this.licenseStatus = 'inactive';
240
+ this.hasError = true;
241
+ this.loading = false;
242
+ return;
243
+ }
244
+ if ( data.success == true ) {
245
+ let licenseData = data.data.licenseData;
246
+ this.licenseStatus = data.data.licenseStatus;
247
+ this.loading = false;
248
+ this.pressedBtnName = null;
249
+
250
+ if (
251
+ data.data.licenseStatus == 'inactive' ||
252
+ data.data.licenseStatus == 'invalid' ||
253
+ data.data.licenseStatus == 'expired'
254
+ ) {
255
+ this.hasError = true;
256
+ if( licenseData.error ) {
257
+ this.licenseErrorMsg = licenseData.errorMsg
258
+ }
259
+ }
260
+ }
261
+ return;
262
+ });
263
+ },
264
+ deactivateLicense: function() {
265
+ this.loading = true;
266
+ this.pressedBtnName = 'sbi';
267
+ let data = new FormData();
268
+ data.append( 'action', 'sbi_deactivate_license' );
269
+ data.append( 'nonce', this.nonce );
270
+ fetch(this.ajaxHandler, {
271
+ method: "POST",
272
+ credentials: 'same-origin',
273
+ body: data
274
+ })
275
+ .then(response => response.json())
276
+ .then(data => {
277
+ if ( data.success == true ) {
278
+ this.licenseStatus = data.data.licenseStatus ;
279
+ this.loading = false;
280
+ this.pressedBtnName = null;
281
+ }
282
+ return;
283
+ });
284
+ },
285
+
286
+ runOneClickUpgrade: function() {
287
+ this.hasError = false;
288
+ this.loading = true;
289
+ this.pressedBtnName = 'sbi';
290
+
291
+ let data = new FormData();
292
+ data.append( 'action', 'sbi_maybe_upgrade_redirect' );
293
+ data.append( 'license_key', this.licenseKey );
294
+ data.append( 'nonce', this.nonce );
295
+ fetch(this.ajaxHandler, {
296
+ method: "POST",
297
+ credentials: 'same-origin',
298
+ body: data
299
+ })
300
+ .then(response => response.json())
301
+ .then(data => {
302
+ if ( data.success === false ) {
303
+ this.licenseStatus = 'invalid';
304
+ this.hasError = true;
305
+ this.loading = false;
306
+ if( typeof data.data !== 'undefined' ) {
307
+ this.licenseErrorMsg = data.data.message
308
+ }
309
+ return;
310
+ }
311
+ if ( data.success === true ) {
312
+ window.location.href = data.data.url
313
+ }
314
+ return;
315
+ });
316
+ },
317
+
318
+ licenseActiveAction: function(extension) {
319
+ extension = typeof extension !== 'undefined' ? extension : false;
320
+ if (this.licenseType === 'free') {
321
+ this.runOneClickUpgrade();
322
+ } else {
323
+ if (typeof extension !== 'undefined') {
324
+ this.deactivateExtensionLicense(extension);
325
+ } else {
326
+ this.deactivateLicense();
327
+ }
328
+ }
329
+
330
+ },
331
+
332
+ /**
333
+ * Activate Extensions License
334
+ *
335
+ * @since 4.0
336
+ *
337
+ * @param {object} extension
338
+ */
339
+ activateExtensionLicense: function( extension ) {
340
+ let licenseKey = this.extensionsLicenseKey[extension.name];
341
+ this.extensionFieldHasError = false;
342
+ this.loading = true;
343
+ this.pressedBtnName = extension.name;
344
+ if ( ! licenseKey ) {
345
+ this.loading = false;
346
+ this.extensionFieldHasError = true;
347
+ return;
348
+ }
349
+ let data = new FormData();
350
+ data.append( 'action', 'sbi_activate_extension_license' );
351
+ data.append( 'license_key', licenseKey );
352
+ data.append( 'extension_name', extension.name );
353
+ data.append( 'extension_item_name', extension.itemName );
354
+ data.append( 'nonce', this.nonce );
355
+ fetch(this.ajaxHandler, {
356
+ method: "POST",
357
+ credentials: 'same-origin',
358
+ body: data
359
+ })
360
+ .then(response => response.json())
361
+ .then(data => {
362
+ this.loading = false;
363
+ if ( data.success == true ) {
364
+ this.extensionFieldHasError = false;
365
+ this.pressedBtnName = null;
366
+ if ( data.data.licenseStatus == 'invalid' ) {
367
+ this.extensionFieldHasError = true;
368
+ this.notificationElement = {
369
+ type : 'error',
370
+ text : this.genericText.invalidLicenseKey,
371
+ shown : "shown"
372
+ };
373
+ }
374
+ if ( data.data.licenseStatus == 'valid' ) {
375
+ this.notificationElement = {
376
+ type : 'success',
377
+ text : this.genericText.licenseActivated,
378
+ shown : "shown"
379
+ };
380
+ }
381
+ extension.licenseStatus = data.data.licenseStatus;
382
+ extension.licenseKey = licenseKey;
383
+
384
+ setTimeout(function(){
385
+ this.notificationElement.shown = "hidden";
386
+ }.bind(this), 3000);
387
+ }
388
+ return;
389
+ });
390
+ },
391
+
392
+ /**
393
+ * Deactivate Extensions License
394
+ *
395
+ * @since 4.0
396
+ *
397
+ * @param {object} extension
398
+ */
399
+ deactivateExtensionLicense: function( extension ) {
400
+ let licenseKey = this.extensionsLicenseKey[extension.name];
401
+ this.extensionFieldHasError = false;
402
+ this.loading = true;
403
+ this.pressedBtnName = extension.name;
404
+ let data = new FormData();
405
+ data.append( 'action', 'sbi_deactivate_extension_license' );
406
+ data.append( 'extension_name', extension.name );
407
+ data.append( 'extension_item_name', extension.itemName );
408
+ data.append( 'nonce', this.nonce );
409
+ fetch(this.ajaxHandler, {
410
+ method: "POST",
411
+ credentials: 'same-origin',
412
+ body: data
413
+ })
414
+ .then(response => response.json())
415
+ .then(data => {
416
+ this.loading = false;
417
+ if ( data.success == true ) {
418
+ this.extensionFieldHasError = false;
419
+ this.pressedBtnName = null;
420
+ if ( data.data.licenseStatus == 'deactivated' ) {
421
+ this.notificationElement = {
422
+ type : 'success',
423
+ text : this.genericText.licenseDeactivated,
424
+ shown : "shown"
425
+ };
426
+ }
427
+ extension.licenseStatus = data.data.licenseStatus;
428
+ extension.licenseKey = licenseKey;
429
+
430
+ setTimeout(function(){
431
+ this.notificationElement.shown = "hidden";
432
+ }.bind(this), 3000);
433
+ }
434
+ return;
435
+ });
436
+ },
437
+ testConnection: function() {
438
+ this.testConnectionStatus = 'loading';
439
+ let data = new FormData();
440
+ data.append( 'action', 'sbi_test_connection' );
441
+ data.append( 'nonce', this.nonce );
442
+ fetch(this.ajaxHandler, {
443
+ method: "POST",
444
+ credentials: 'same-origin',
445
+ body: data
446
+ })
447
+ .then(response => response.json())
448
+ .then(data => {
449
+ if ( data.success == false ) {
450
+ this.testConnectionStatus = 'error';
451
+ this.testConnectionStatusMessage = data.data.error;
452
+ }
453
+ if ( data.success == true ) {
454
+ this.testConnectionStatus = 'success';
455
+
456
+ setTimeout(function() {
457
+ this.testConnectionStatus = null;
458
+ }.bind(this), 3000);
459
+ }
460
+ return;
461
+ });
462
+ },
463
+ recheckLicense: function( licenseKey, itemName, optionName = null ) {
464
+ this.recheckLicenseStatus = 'loading';
465
+ this.pressedBtnName = optionName;
466
+ let data = new FormData();
467
+ data.append( 'action', 'sbi_recheck_connection' );
468
+ data.append( 'license_key', licenseKey );
469
+ data.append( 'item_name', itemName );
470
+ data.append( 'option_name', optionName );
471
+ data.append( 'nonce', this.nonce );
472
+ fetch(this.ajaxHandler, {
473
+ method: "POST",
474
+ credentials: 'same-origin',
475
+ body: data
476
+ })
477
+ .then(response => response.json())
478
+ .then(data => {
479
+ if ( data.success == true ) {
480
+ if ( data.data.license == 'valid' ) {
481
+ this.recheckLicenseStatus = 'success';
482
+ }
483
+ if ( data.data.license == 'expired' ) {
484
+ this.recheckLicenseStatus = 'error';
485
+ }
486
+
487
+ // if the api license status has changed from old stored license status
488
+ // then reload the page to show proper error message and notices
489
+ // or hide error messages and notices
490
+ if ( data.data.licenseChanged == true ) {
491
+ location.reload();
492
+ }
493
+
494
+ setTimeout(function() {
495
+ this.pressedBtnName = null;
496
+ this.recheckLicenseStatus = null;
497
+ }.bind(this), 3000);
498
+ }
499
+ return;
500
+ });
501
+ },
502
+ recheckLicenseIcon: function() {
503
+ if ( this.recheckLicenseStatus == null ) {
504
+ return this.generalTab.licenseBox.recheckLicense;
505
+ } else if ( this.recheckLicenseStatus == 'loading' ) {
506
+ return this.loaderSVG;
507
+ } else if ( this.recheckLicenseStatus == 'success' ) {
508
+ return '<i class="fa fa-check-circle"></i> ' + this.generalTab.licenseBox.licenseValid;
509
+ } else if ( this.recheckLicenseStatus == 'error' ) {
510
+ return '<i class="fa fa-times-circle"></i> ' + this.generalTab.licenseBox.licenseExpired;
511
+ }
512
+ },
513
+ recheckBtnText: function( btnName ) {
514
+ if ( this.recheckLicenseStatus == null || this.pressedBtnName != btnName ) {
515
+ return this.generalTab.licenseBox.recheckLicense;
516
+ } else if ( this.recheckLicenseStatus == 'loading' && this.pressedBtnName == btnName ) {
517
+ return this.loaderSVG;
518
+ } else if ( this.recheckLicenseStatus == 'success' ) {
519
+ return '<i class="fa fa-check-circle"></i> ' + this.generalTab.licenseBox.licenseValid;
520
+ } else if ( this.recheckLicenseStatus == 'error' ) {
521
+ return '<i class="fa fa-times-circle"></i> ' + this.generalTab.licenseBox.licenseExpired;
522
+ }
523
+ },
524
+ testConnectionIcon: function() {
525
+ if ( this.testConnectionStatus == 'loading' ) {
526
+ return this.loaderSVG;
527
+ } else if ( this.testConnectionStatus == 'success' ) {
528
+ return '<i class="fa fa-check-circle"></i> ' + this.generalTab.licenseBox.connectionSuccessful;
529
+ } else if ( this.testConnectionStatus == 'error' ) {
530
+ return `<i class="fa fa-times-circle"></i> ${this.generalTab.licenseBox.connectionFailed} ${this.testConnectionStatusMessage}</a>`;
531
+ }
532
+ },
533
+ importFile: function() {
534
+ document.getElementById("import_file").click();
535
+ },
536
+ uploadFile: function( event ) {
537
+ this.uploadStatus = 'loading';
538
+ let file = this.$refs.file.files[0];
539
+ let data = new FormData();
540
+ data.append( 'action', 'sbi_import_settings_json' );
541
+ data.append( 'file', file );
542
+ data.append( 'nonce', this.nonce );
543
+ fetch(this.ajaxHandler, {
544
+ method: "POST",
545
+ credentials: 'same-origin',
546
+ body: data
547
+ })
548
+ .then(response => response.json())
549
+ .then(data => {
550
+ this.uploadStatus = null;
551
+ this.$refs.file.files[0] = null;
552
+ if ( data.success == false ) {
553
+ this.notificationElement = {
554
+ type : 'error',
555
+ text : this.genericText.failedToImportFeed,
556
+ shown : "shown"
557
+ };
558
+ }
559
+ if ( data.success == true ) {
560
+ this.feeds = data.data.feeds;
561
+ this.notificationElement = {
562
+ type : 'success',
563
+ text : this.genericText.feedImported,
564
+ shown : "shown"
565
+ };
566
+ }
567
+ setTimeout(function(){
568
+ this.notificationElement.shown = "hidden";
569
+ }.bind(this), 3000);
570
+ });
571
+ },
572
+ exportFeedSettings: function() {
573
+ // return if no feed is selected
574
+ if ( this.exportFeed === 'none' ) {
575
+ return;
576
+ }
577
+
578
+ let url = this.ajaxHandler + '?action=sbi_export_settings_json&nonce=' + this.nonce + '&feed_id=' + this.exportFeed;
579
+ window.location = url;
580
+ },
581
+ saveSettings: function() {
582
+ this.btnStatus = 'loading';
583
+ this.pressedBtnName = 'saveChanges';
584
+ let data = new FormData();
585
+ data.append( 'action', 'sbi_save_settings' );
586
+ data.append( 'model', JSON.stringify( this.model ) );
587
+ data.append( 'sbi_license_key', this.licenseKey );
588
+ data.append( 'extensions_license_key', JSON.stringify( this.extensionsLicenseKey ) );
589
+ data.append( 'nonce', this.nonce );
590
+ fetch(this.ajaxHandler, {
591
+ method: "POST",
592
+ credentials: 'same-origin',
593
+ body: data
594
+ })
595
+ .then(response => response.json())
596
+ .then(data => {
597
+ if ( data.success == false ) {
598
+ this.btnStatus = 'error';
599
+ return;
600
+ }
601
+
602
+ this.cronNextCheck = data.data.cronNextCheck;
603
+ this.btnStatus = 'success';
604
+ setTimeout(function() {
605
+ this.btnStatus = null;
606
+ this.pressedBtnName = null;
607
+ }.bind(this), 3000);
608
+ });
609
+ },
610
+ clearCache: function() {
611
+ this.clearCacheStatus = 'loading';
612
+ let data = new FormData();
613
+ data.append( 'action', 'sbi_clear_cache' );
614
+ data.append( 'model', JSON.stringify( this.model ) );
615
+ data.append( 'nonce', this.nonce );
616
+ fetch(this.ajaxHandler, {
617
+ method: "POST",
618
+ credentials: 'same-origin',
619
+ body: data
620
+ })
621
+ .then(response => response.json())
622
+ .then(data => {
623
+ if ( data.success == false ) {
624
+ this.clearCacheStatus = 'error';
625
+ return;
626
+ }
627
+
628
+ this.cronNextCheck = data.data.cronNextCheck;
629
+ this.clearCacheStatus = 'success';
630
+ setTimeout(function() {
631
+ this.clearCacheStatus = null;
632
+ }.bind(this), 3000);
633
+ });
634
+ },
635
+ showTooltip: function( tooltipName ) {
636
+ this.tooltipName = tooltipName;
637
+ },
638
+ hideTooltip: function() {
639
+ this.tooltipName = null;
640
+ },
641
+ gdprOptions: function() {
642
+ this.gdprInfoTooltip = null;
643
+ },
644
+ gdprLimited: function() {
645
+ this.gdprInfoTooltip = this.gdprInfoTooltip == null ? true : null;
646
+ },
647
+ clearImageResizeCache: function() {
648
+ this.optimizeCacheStatus = 'loading';
649
+ let data = new FormData();
650
+ data.append( 'action', 'sbi_clear_image_resize_cache' );
651
+ data.append( 'nonce', this.nonce );
652
+ fetch(this.ajaxHandler, {
653
+ method: "POST",
654
+ credentials: 'same-origin',
655
+ body: data
656
+ })
657
+ .then(response => response.json())
658
+ .then(data => {
659
+ if ( data.success == false ) {
660
+ this.optimizeCacheStatus = 'error';
661
+ return;
662
+ }
663
+ this.optimizeCacheStatus = 'success';
664
+ setTimeout(function() {
665
+ this.optimizeCacheStatus = null;
666
+ }.bind(this), 3000);
667
+ });
668
+ },
669
+ resetErrorLog: function() {
670
+ this.clearErrorLogStatus = 'loading';
671
+ let data = new FormData();
672
+ data.append( 'action', 'sbi_clear_error_log' );
673
+ data.append( 'nonce', this.nonce );
674
+ fetch(this.ajaxHandler, {
675
+ method: "POST",
676
+ credentials: 'same-origin',
677
+ body: data
678
+ })
679
+ .then(response => response.json())
680
+ .then(data => {
681
+ if ( ! data.success ) {
682
+ this.clearErrorLogStatus = 'error';
683
+ return;
684
+ }
685
+ this.clearErrorLogStatus = 'success';
686
+ setTimeout(function() {
687
+ this.clearErrorLogStatus = null;
688
+ }.bind(this), 3000);
689
+ });
690
+ },
691
+ dpaReset: function() {
692
+ this.dpaResetStatus = 'loading';
693
+ let data = new FormData();
694
+ data.append( 'action', 'sbi_dpa_reset' );
695
+ data.append( 'nonce', this.nonce );
696
+ fetch(this.ajaxHandler, {
697
+ method: "POST",
698
+ credentials: 'same-origin',
699
+ body: data
700
+ })
701
+ .then(response => response.json())
702
+ .then(data => {
703
+ if ( data.success == false ) {
704
+ this.dpaResetStatus = 'error';
705
+ return;
706
+ }
707
+ this.dpaResetStatus = 'success';
708
+ setTimeout(function() {
709
+ this.dpaResetStatus = null;
710
+ }.bind(this), 3000);
711
+ });
712
+ },
713
+ resetErrorLogIcon: function() {
714
+ if ( this.clearErrorLogStatus === null ) {
715
+ return;
716
+ }
717
+ if ( this.clearErrorLogStatus == 'loading' ) {
718
+ return this.loaderSVG;
719
+ } else if ( this.clearErrorLogStatus == 'success' ) {
720
+ return this.checkmarkSVG;
721
+ } else if ( this.clearErrorLogStatus == 'error' ) {
722
+ return `<i class="fa fa-times-circle"></i>`;
723
+ }
724
+ },
725
+ saveChangesIcon: function() {
726
+ if ( this.btnStatus === 'loading' ) {
727
+ return this.loaderSVG;
728
+ } else if ( this.btnStatus === 'success' ) {
729
+ return this.checkmarkSVG;
730
+ } else if ( this.btnStatus === 'error' ) {
731
+ return `<i class="fa fa-times-circle"></i>`;
732
+ }
733
+ },
734
+ importBtnIcon: function() {
735
+ if ( this.uploadStatus === null ) {
736
+ return this.uploadSVG;
737
+ }
738
+ if ( this.uploadStatus == 'loading' ) {
739
+ return this.loaderSVG;
740
+ } else if ( this.uploadStatus == 'success' ) {
741
+ return this.checkmarkSVG;
742
+ } else if ( this.uploadStatus == 'error' ) {
743
+ return `<i class="fa fa-times-circle"></i>`;
744
+ }
745
+ },
746
+ clearCacheIcon: function() {
747
+ if ( this.clearCacheStatus === null ) {
748
+ return this.reloadSVG;
749
+ }
750
+ if ( this.clearCacheStatus == 'loading' ) {
751
+ return this.loaderSVG;
752
+ } else if ( this.clearCacheStatus == 'success' ) {
753
+ return this.checkmarkSVG;
754
+ } else if ( this.clearCacheStatus == 'error' ) {
755
+ return `<i class="fa fa-times-circle"></i>`;
756
+ }
757
+ },
758
+ clearImageResizeCacheIcon: function() {
759
+ if ( this.optimizeCacheStatus === null ) {
760
+ return;
761
+ }
762
+ if ( this.optimizeCacheStatus == 'loading' ) {
763
+ return this.loaderSVG;
764
+ } else if ( this.optimizeCacheStatus == 'success' ) {
765
+ return this.checkmarkSVG;
766
+ } else if ( this.optimizeCacheStatus == 'error' ) {
767
+ return `<i class="fa fa-times-circle"></i>`;
768
+ }
769
+ },
770
+ dpaResetStatusIcon: function() {
771
+ if ( this.dpaResetStatus === null ) {
772
+ return;
773
+ }
774
+ if ( this.dpaResetStatus == 'loading' ) {
775
+ return this.loaderSVG;
776
+ } else if ( this.dpaResetStatus == 'success' ) {
777
+ return this.checkmarkSVG;
778
+ } else if ( this.dpaResetStatus == 'error' ) {
779
+ return `<i class="fa fa-times-circle"></i>`;
780
+ }
781
+ },
782
+
783
+ /**
784
+ * Toggle Sticky Widget view
785
+ *
786
+ * @since 4.0
787
+ */
788
+ toggleStickyWidget: function() {
789
+ this.stickyWidget = !this.stickyWidget;
790
+ },
791
+
792
+ printUsedInText: function( usedInNumber ){
793
+ if(usedInNumber == 0){
794
+ return this.genericText.sourceNotUsedYet;
795
+ }
796
+ return this.genericText.usedIn + ' ' + usedInNumber + ' ' +(usedInNumber == 1 ? this.genericText.feed : this.genericText.feeds);
797
+ },
798
+
799
+ /**
800
+ * Delete Source Ajax
801
+ *
802
+ * @since 4.0
803
+ */
804
+ deleteSource : function(sourceToDelete){
805
+ var self = this;
806
+ let data = new FormData();
807
+ data.append( 'action', 'sbi_feed_saver_manager_delete_source' );
808
+ data.append( 'source_id', sourceToDelete.id);
809
+ data.append( 'nonce', this.nonce );
810
+ fetch(self.ajaxHandler, {
811
+ method: "POST",
812
+ credentials: 'same-origin',
813
+ body: data
814
+ })
815
+ .then(response => response.json())
816
+ .then(data => {
817
+ if (sourceToDelete.just_added) {
818
+ window.location.href = window.location.href.replace('sbi_access_token','sbi_null');
819
+ }
820
+ self.sourcesList = data;
821
+ });
822
+ },
823
+
824
+ /**
825
+ * Check if Value is Empty
826
+ *
827
+ * @since 4.0
828
+ *
829
+ * @return boolean
830
+ */
831
+ checkNotEmpty : function(value){
832
+ return value != null && value.replace(/ /gi,'') != '';
833
+ },
834
+
835
+ /**
836
+ * Activate View
837
+ *
838
+ * @since 4.0
839
+ */
840
+ activateView : function(viewName, sourcePopupType = 'creation', ajaxAction = false){
841
+ var self = this;
842
+ self.viewsActive[viewName] = (self.viewsActive[viewName] == false ) ? true : false;
843
+ if(viewName == 'sourcePopup' && sourcePopupType == 'creationRedirect'){
844
+ setTimeout(function(){
845
+ self.$refs.addSourceRef.processIFConnect()
846
+ },3500);
847
+ }
848
+
849
+ },
850
+
851
+ /**
852
+ * Switch & Change Feed Screens
853
+ *
854
+ * @since 4.0
855
+ */
856
+ switchScreen: function(screenType, screenName){
857
+ this.viewsActive[screenType] = screenName;
858
+ },
859
+
860
+ /**
861
+ * Parse JSON
862
+ *
863
+ * @since 4.0
864
+ *
865
+ * @return jsonObject / Boolean
866
+ */
867
+ jsonParse : function(jsonString){
868
+ try {
869
+ return JSON.parse(jsonString);
870
+ } catch(e) {
871
+ return false;
872
+ }
873
+ },
874
+
875
+
876
+ /**
877
+ * Ajax Post Action
878
+ *
879
+ * @since 4.0
880
+ */
881
+ ajaxPost : function(data, callback){
882
+ var self = this;
883
+ self.$http.post(self.ajaxHandler,data).then(callback);
884
+ },
885
+
886
+ /**
887
+ * Check if Object has Nested Property
888
+ *
889
+ * @since 4.0
890
+ *
891
+ * @return boolean
892
+ */
893
+ hasOwnNestedProperty : function(obj,propertyPath) {
894
+ if (!propertyPath){return false;}var properties = propertyPath.split('.');
895
+ for (var i = 0; i < properties.length; i++) {
896
+ var prop = properties[i];
897
+ if (!obj || !obj.hasOwnProperty(prop)) {
898
+ return false;
899
+ } else {
900
+ obj = obj[prop];
901
+ }
902
+ }
903
+ return true;
904
+ },
905
+
906
+ /**
907
+ * Show Tooltip on Hover
908
+ *
909
+ * @since 4.0
910
+ */
911
+ toggleElementTooltip : function(tooltipText, type, align = 'center'){
912
+ var self = this,
913
+ target = window.event.currentTarget,
914
+ tooltip = (target != undefined && target != null) ? document.querySelector('.sb-control-elem-tltp-content') : null;
915
+ if(tooltip != null && type == 'show'){
916
+ self.tooltip.text = tooltipText;
917
+ var position = target.getBoundingClientRect(),
918
+ left = position.left + 10,
919
+ top = position.top - 10;
920
+ tooltip.style.left = left + 'px';
921
+ tooltip.style.top = top + 'px';
922
+ tooltip.style.textAlign = align;
923
+ self.tooltip.hover = true;
924
+ }
925
+ if(type == 'hide'){
926
+ self.tooltip.hover = false;
927
+ }
928
+ },
929
+
930
+ /**
931
+ * Hover Tooltip
932
+ *
933
+ * @since 4.0
934
+ */
935
+ hoverTooltip : function(type){
936
+ this.tooltip.hover = type;
937
+ },
938
+
939
+ /**
940
+ * Open Dialog Box
941
+ *
942
+ * @since 4.0
943
+ */
944
+ openDialogBox : function(type, args = []){
945
+ var self = this,
946
+ heading = self.dialogBoxPopupScreen[type].heading,
947
+ description = self.dialogBoxPopupScreen[type].description,
948
+ customButtons = self.dialogBoxPopupScreen[type].customButtons;
949
+
950
+ switch (type) {
951
+ case "deleteSource":
952
+ self.sourceToDelete = args;
953
+ heading = heading.replace("#", self.sourceToDelete.username);
954
+ break;
955
+ }
956
+ self.dialogBox = {
957
+ active : true,
958
+ type : type,
959
+ heading : heading,
960
+ description : description,
961
+ customButtons : customButtons
962
+ };
963
+ },
964
+
965
+
966
+ /**
967
+ * Confirm Dialog Box Actions
968
+ *
969
+ * @since 4.0
970
+ */
971
+ confirmDialogAction : function(){
972
+ var self = this;
973
+ switch (self.dialogBox.type) {
974
+ case 'deleteSource':
975
+ self.deleteSource(self.sourceToDelete);
976
+ break;
977
+ }
978
+ },
979
+
980
+ /**
981
+ * Display Feed Sources Settings
982
+ *
983
+ * @since 4.0
984
+ *
985
+ * @param {object} source
986
+ * @param {int} sourceIndex
987
+ */
988
+ displayFeedSettings: function(source, sourceIndex) {
989
+ this.expandedFeedID = sourceIndex + 1;
990
+ },
991
+
992
+ /**
993
+ * Hide Feed Sources Settings
994
+ *
995
+ * @since 4.0
996
+ *
997
+ * @param {object} source
998
+ * @param {int} sourceIndex
999
+ */
1000
+ hideFeedSettings: function() {
1001
+ this.expandedFeedID = null;
1002
+ },
1003
+
1004
+ /**
1005
+ * Copy text to clipboard
1006
+ *
1007
+ * @since 4.0
1008
+ */
1009
+ copyToClipBoard : function(value){
1010
+ var self = this;
1011
+ const el = document.createElement('textarea');
1012
+ el.className = 'sbi-fb-cp-clpboard';
1013
+ el.value = value;
1014
+ document.body.appendChild(el);
1015
+ el.select();
1016
+ document.execCommand('copy');
1017
+ document.body.removeChild(el);
1018
+ self.notificationElement = {
1019
+ type : 'success',
1020
+ text : this.genericText.copiedClipboard,
1021
+ shown : "shown"
1022
+ };
1023
+ setTimeout(function(){
1024
+ self.notificationElement.shown = "hidden";
1025
+ }, 3000);
1026
+ },
1027
+
1028
+
1029
+ /**
1030
+ * View Source Instances
1031
+ *
1032
+ * @since 4.0
1033
+ */
1034
+ viewSourceInstances : function(source){
1035
+ var self = this;
1036
+ self.viewsActive.instanceSourceActive = source;
1037
+ },
1038
+
1039
+ /**
1040
+ * Return Page/Group Avatar
1041
+ *
1042
+ * @since 4.0
1043
+ *
1044
+ * @return string
1045
+ */
1046
+ returnAccountAvatar : function(source){
1047
+ if (typeof source.local_avatar_url !== "undefined" && source.local_avatar_url !== '') {
1048
+ return source.local_avatar_url;
1049
+ }
1050
+ if (typeof source.avatar_url !== "undefined" && source.avatar_url !== '') {
1051
+ return source.avatar_url;
1052
+ }
1053
+
1054
+ return false;
1055
+ },
1056
+
1057
+ }
1058
+ });
1059
+
admin/assets/js/support.js CHANGED
@@ -1,122 +1,122 @@
1
- var support_data = {
2
- genericText: sbi_support.genericText,
3
- articles: sbi_support.articles,
4
- links: sbi_support.links,
5
- system_info: sbi_support.system_info,
6
- system_info_n: sbi_support.system_info_n,
7
- exportFeed: 'none',
8
- stickyWidget: false,
9
- feeds: sbi_support.feeds,
10
- supportUrl: sbi_support.supportUrl,
11
- socialWallActivated: sbi_support.socialWallActivated,
12
- socialWallLinks: sbi_support.socialWallLinks,
13
- siteSearchUrl: sbi_support.siteSearchUrl,
14
- siteSearchUrlWithArgs: null,
15
- searchKeywords: null,
16
- buttons: sbi_support.buttons,
17
- links: sbi_support.links,
18
- supportPageUrl: sbi_support.supportPageUrl,
19
- systemInfoBtnStatus: 'collapsed',
20
- copyBtnStatus: null,
21
- ajax_handler: sbi_support.ajax_handler,
22
- nonce: sbi_support.nonce,
23
- icons: sbi_support.icons,
24
- images: sbi_support.images,
25
- svgIcons : sbi_support.svgIcons,
26
- notificationElement : {
27
- type : 'success', // success, error, warning, message
28
- text : '',
29
- shown : null
30
- }
31
- }
32
-
33
- var sbisupport = new Vue({
34
- el: "#sbi-support",
35
- http: {
36
- emulateJSON: true,
37
- emulateHTTP: true
38
- },
39
- data: support_data,
40
- methods: {
41
- copySystemInfo: function() {
42
- let self = this;
43
- const el = document.createElement('textarea');
44
- el.className = 'sbi-fb-cp-clpboard';
45
- el.value = self.system_info_n;
46
- document.body.appendChild(el);
47
- el.select();
48
- document.execCommand('copy');
49
- document.body.removeChild(el);
50
- this.notificationElement = {
51
- type : 'success',
52
- text : this.genericText.copiedToClipboard,
53
- shown : "shown"
54
- };
55
-
56
- setTimeout(function() {
57
- this.notificationElement.shown = "hidden";
58
- }.bind(self), 3000);
59
- },
60
- expandSystemInfo: function() {
61
- this.systemInfoBtnStatus = ( this.systemInfoBtnStatus == 'collapsed' ) ? 'expanded' : 'collapsed';
62
- },
63
- expandBtnText: function() {
64
- if ( this.systemInfoBtnStatus == 'collapsed' ) {
65
- return this.buttons.expand;
66
- } else if ( this.systemInfoBtnStatus == 'expanded' ) {
67
- return this.buttons.collapse;
68
- }
69
- },
70
- exportFeedSettings: function() {
71
- // return if no feed is selected
72
- if ( this.exportFeed === 'none' ) {
73
- return;
74
- }
75
-
76
- let url = this.ajax_handler + '?action=sbi_export_settings_json&nonce=' + this.nonce + '&feed_id=' + this.exportFeed;
77
- window.location = url;
78
- },
79
- searchDoc: function() {
80
- let self = this;
81
- let searchInput = document.getElementById('sbi-search-doc-input');
82
- searchInput.addEventListener('keyup', function ( event ) {
83
- let url = new URL( self.siteSearchUrl );
84
- let search_params = url.searchParams;
85
- if ( self.searchKeywords ) {
86
- search_params.set('search', self.searchKeywords);
87
- }
88
- search_params.set('plugin', 'instagram');
89
- url.search = search_params.toString();
90
- self.siteSearchUrlWithArgs = url.toString();
91
-
92
- if ( event.key === 'Enter' ) {
93
- window.open( self.siteSearchUrlWithArgs, '_blank');
94
- }
95
- })
96
- },
97
- searchDocStrings: function() {
98
- let self = this;
99
- let url = new URL( this.siteSearchUrl );
100
- let search_params = url.searchParams;
101
- setTimeout(function() {
102
- search_params.set('search', self.searchKeywords);
103
- search_params.set('plugin', 'instagram');
104
- url.search = search_params.toString();
105
- self.siteSearchUrlWithArgs = url.toString();
106
- }, 10);
107
- },
108
- goToSearchDocumentation: function() {
109
- if ( this.searchKeywords !== null && this.siteSearchUrlWithArgs !== null ) {
110
- window.open( this.siteSearchUrlWithArgs, '_blank');
111
- }
112
- },
113
- /**
114
- * Toggle Sticky Widget view
115
- *
116
- * @since 4.0
117
- */
118
- toggleStickyWidget: function() {
119
- this.stickyWidget = !this.stickyWidget;
120
- },
121
- },
122
- })
1
+ var support_data = {
2
+ genericText: sbi_support.genericText,
3
+ articles: sbi_support.articles,
4
+ links: sbi_support.links,
5
+ system_info: sbi_support.system_info,
6
+ system_info_n: sbi_support.system_info_n,
7
+ exportFeed: 'none',
8
+ stickyWidget: false,
9
+ feeds: sbi_support.feeds,
10
+ supportUrl: sbi_support.supportUrl,
11
+ socialWallActivated: sbi_support.socialWallActivated,
12
+ socialWallLinks: sbi_support.socialWallLinks,
13
+ siteSearchUrl: sbi_support.siteSearchUrl,
14
+ siteSearchUrlWithArgs: null,
15
+ searchKeywords: null,
16
+ buttons: sbi_support.buttons,
17
+ links: sbi_support.links,
18
+ supportPageUrl: sbi_support.supportPageUrl,
19
+ systemInfoBtnStatus: 'collapsed',
20
+ copyBtnStatus: null,
21
+ ajax_handler: sbi_support.ajax_handler,
22
+ nonce: sbi_support.nonce,
23
+ icons: sbi_support.icons,
24
+ images: sbi_support.images,
25
+ svgIcons : sbi_support.svgIcons,
26
+ notificationElement : {
27
+ type : 'success', // success, error, warning, message
28
+ text : '',
29
+ shown : null
30
+ }
31
+ }
32
+
33
+ var sbisupport = new Vue({
34
+ el: "#sbi-support",
35
+ http: {
36
+ emulateJSON: true,
37
+ emulateHTTP: true
38
+ },
39
+ data: support_data,
40
+ methods: {
41
+ copySystemInfo: function() {
42
+ let self = this;
43
+ const el = document.createElement('textarea');
44
+ el.className = 'sbi-fb-cp-clpboard';
45
+ el.value = self.system_info_n;
46
+ document.body.appendChild(el);
47
+ el.select();
48
+ document.execCommand('copy');
49
+ document.body.removeChild(el);
50
+ this.notificationElement = {
51
+ type : 'success',
52
+ text : this.genericText.copiedToClipboard,
53
+ shown : "shown"
54
+ };
55
+
56
+ setTimeout(function() {
57
+ this.notificationElement.shown = "hidden";
58
+ }.bind(self), 3000);
59
+ },
60
+ expandSystemInfo: function() {
61
+ this.systemInfoBtnStatus = ( this.systemInfoBtnStatus == 'collapsed' ) ? 'expanded' : 'collapsed';
62
+ },
63
+ expandBtnText: function() {
64
+ if ( this.systemInfoBtnStatus == 'collapsed' ) {
65
+ return this.buttons.expand;
66
+ } else if ( this.systemInfoBtnStatus == 'expanded' ) {
67
+ return this.buttons.collapse;
68
+ }
69
+ },
70
+ exportFeedSettings: function() {
71
+ // return if no feed is selected
72
+ if ( this.exportFeed === 'none' ) {
73
+ return;
74
+ }
75
+
76
+ let url = this.ajax_handler + '?action=sbi_export_settings_json&nonce=' + this.nonce + '&feed_id=' + this.exportFeed;
77
+ window.location = url;
78
+ },
79
+ searchDoc: function() {
80
+ let self = this;
81
+ let searchInput = document.getElementById('sbi-search-doc-input');
82
+ searchInput.addEventListener('keyup', function ( event ) {
83
+ let url = new URL( self.siteSearchUrl );
84
+ let search_params = url.searchParams;
85
+ if ( self.searchKeywords ) {
86
+ search_params.set('search', self.searchKeywords);
87
+ }
88
+ search_params.set('plugin', 'instagram');
89
+ url.search = search_params.toString();
90
+ self.siteSearchUrlWithArgs = url.toString();
91
+
92
+ if ( event.key === 'Enter' ) {
93
+ window.open( self.siteSearchUrlWithArgs, '_blank');
94
+ }
95
+ })
96
+ },
97
+ searchDocStrings: function() {
98
+ let self = this;
99
+ let url = new URL( this.siteSearchUrl );
100
+ let search_params = url.searchParams;
101
+ setTimeout(function() {
102
+ search_params.set('search', self.searchKeywords);
103
+ search_params.set('plugin', 'instagram');
104
+ url.search = search_params.toString();
105
+ self.siteSearchUrlWithArgs = url.toString();
106
+ }, 10);
107
+ },
108
+ goToSearchDocumentation: function() {
109
+ if ( this.searchKeywords !== null && this.siteSearchUrlWithArgs !== null ) {
110
+ window.open( this.siteSearchUrlWithArgs, '_blank');
111
+ }
112
+ },
113
+ /**
114
+ * Toggle Sticky Widget view
115
+ *
116
+ * @since 4.0
117
+ */
118
+ toggleStickyWidget: function() {
119
+ this.stickyWidget = !this.stickyWidget;
120
+ },
121
+ },
122
+ })
admin/builder/assets/css/builder.css CHANGED
@@ -1,5082 +1,5082 @@
1
- body{
2
- background: #red;
3
- --cl-orange: #E34F0E;
4
- --cl-dark:#2C324C;
5
- --error-red: #D72C2C;
6
- --customizer-blue: #0096CC;
7
- --dark-blue: #2A65DB;
8
- }
9
- .sb-tr-1{-webkit-transition: all .1s ease-in-out; transition: all .1s ease-in-out;}
10
- .sb-tr-2{-webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
11
- .sb-tr-3{-webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}
12
- .sb-tr-4{-webkit-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
13
- .sb-tr-5{-webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out;}
14
- .sb-tr-6{-webkit-transition: all .6s ease-in-out; transition: all .6s ease-in-out;}
15
- .sb-tr-7{-webkit-transition: all .7s ease-in-out; transition: all .7s ease-in-out;}
16
- .sb-tr-8{-webkit-transition: all .8s ease-in-out; transition: all .8s ease-in-out;}
17
- .sb-tr-9{-webkit-transition: all .9s ease-in-out; transition: all .9s ease-in-out;}
18
- .sb-tr-10{-webkit-transition: all 1s ease-in-out; transition: all 1s ease-in-out;}
19
- .sbi-bg-1{
20
- background: #2A65DB;
21
- }
22
-
23
- /****
24
- Buttons
25
- */
26
- .sb-button {
27
- display: flex;
28
- flex-direction: row;
29
- justify-content: center;
30
- align-items: center;
31
- border-radius: 2px;
32
- cursor: pointer;
33
- outline: none;
34
- box-shadow: none;
35
- border: none;
36
- -webkit-transition: all .15s ease-in-out;
37
- transition: all .15s ease-in-out;
38
- }
39
- .sb-button-standard{
40
- position: relative;
41
- font-style: normal;
42
- font-weight: 600;
43
- font-size: 14px;
44
- padding: 10px 20px 10px 39px;
45
- line-height: 16px;
46
- border: unset;
47
- cursor: pointer;
48
- }
49
- .sb-button-standard svg {
50
- width: 16px;
51
- height: 16px;
52
- position: absolute;
53
- left: 13px;
54
- right: auto;
55
- top: 10px;
56
- bottom: auto;
57
- }
58
- .sb-button-small.sb-button-left-icon {
59
- padding-left: 32px;
60
- }
61
- .sb-button-small.sb-button-right-icon {
62
- padding-right: 32px;
63
- }
64
- .sb-button-small.sb-button-left-icon svg {
65
- position: absolute;
66
- left: 13px;
67
- }
68
- .sb-button-small.sb-button-right-icon svg {
69
- position: absolute;
70
- right: 13px;
71
- }
72
- .sb-button-standard.sb-button-right-icon {
73
- padding: 10px 39px 10px 20px;
74
- }
75
- .sb-button-standard.sb-button-right-icon svg {
76
- right: 13px;
77
- left: auto;
78
- }
79
-
80
- .sb-button-small {
81
- position: relative;
82
- font-style: normal;
83
- font-weight: 600;
84
- font-size: 12px;
85
- padding: 6px 12px;
86
- line-height: 160%;
87
- }
88
-
89
- .sb-button-no-border {
90
- border-radius: 0 !important;
91
- border: none !important;
92
- }
93
-
94
- /*orange*/
95
- .sbi-btn-orange{
96
- background: #E34F0E!important;
97
- color: #fff!important;
98
- }
99
- .sbi-btn-orange:hover{
100
- background: #F37036!important;
101
- color: #fff!important;
102
- }
103
- .sbi-btn-orange:focus{
104
- background: #B8400B!important;
105
- color: #fff!important;
106
- }
107
-
108
- /*red*/
109
- .sbi-btn-red{
110
- background: #D72C2C!important;
111
- color: #fff!important;
112
- }
113
- .sbi-btn-red:hover{
114
- background: #DF5757!important;
115
- color: #fff!important;
116
- }
117
- .sbi-btn-red:focus{
118
- background: #841919!important;
119
- color: #fff!important;
120
- }
121
-
122
- /*red*/
123
- .sbi-btn-blue{
124
- background: #0068A0!important;
125
- color: #fff!important;
126
- }
127
- .sbi-btn-blue:hover{
128
- background: #0096CC!important;
129
- color: #fff!important;
130
- }
131
- .sbi-btn-blue:focus{
132
- background: #004D77!important;
133
- color: #fff!important;
134
- }
135
-
136
- /*grey*/
137
- .sbi-btn-grey{
138
- background: #F3F4F5!important;
139
- color: #141B38!important;
140
- border: 1px solid #D0D1D7!important;
141
- }
142
- .sbi-btn-grey:hover{
143
- background: #fff!important;
144
- color: #141B38!important;
145
- border: 1px solid #DCDDE1!important;
146
- }
147
- .sbi-btn-grey:focus{
148
- background: #E8E8EB!important;
149
- color: #141B38!important;
150
- border: 1px solid #D0D1D7!important;
151
- }
152
-
153
- /*dark*/
154
- .sbi-btn-dark{
155
- background: #2C324C!important;
156
- color: #fff!important;
157
- }
158
- .sbi-btn-dark:hover{
159
- background: #434960!important;
160
- color: #fff!important;
161
- }
162
- .sbi-btn-dark:focus{
163
- background: #141B38!important;
164
- color: #fff!important;
165
- }
166
-
167
- .sb-dark-hover:hover svg,
168
- .sb-dark-hover:hover path{
169
- fill: #141B38;
170
- }
171
-
172
- /*disabled*/
173
- .sbi-btn-orange[data-active="false"],
174
- .sbi-btn-blue[data-active="false"],
175
- .sbi-btn-red[data-active="false"],
176
- .sbi-btn-grey[data-active="false"],
177
- .sbi-btn-dark[data-active="false"]{
178
- background: #E8E8EB !important;
179
- color: #8C8F9A !important;
180
- }
181
-
182
- /* Text */
183
- #sb_instagram{
184
- overflow-x: hidden;
185
- }
186
- #sbi-builder-app h1:not(#sb_instagram h1) {
187
- font-style: normal;
188
- font-weight: 600;
189
- font-size: 36px;
190
- line-height: 125%;
191
- color: #141B38;
192
- margin: 0;
193
- letter-spacing: 0;
194
- }
195
- #sbi-builder-app h2:not(#sb_instagram h2) {
196
- font-style: normal;
197
- font-weight: 600;
198
- font-size: 32px;
199
- line-height: 125%;
200
- margin: 0;
201
- letter-spacing: 0;
202
- }
203
- #sbi-builder-app h3:not(#sb_instagram h3):not(.sb_instagram_header h3) {
204
- font-style: normal;
205
- font-weight: 600;
206
- font-size: 24px;
207
- line-height: 120%;
208
- margin: 0 0 4px 0;
209
- letter-spacing: 0;
210
- }
211
-
212
- #sbi-builder-app h4:not(#sb_instagram h5) {
213
- font-style: normal;
214
- font-weight: 600;
215
- font-size: 18px;
216
- line-height: 140%;
217
- margin: 0 0 4px 0;
218
- letter-spacing: 0;
219
- }
220
- .sbi-fb-feedtypes-pp-ctn h4 {
221
- font-size: 24px !important;
222
- margin-bottom: 28px !important;
223
- }
224
-
225
- #sbi-builder-app .sb-small-p,
226
- #sbi-builder-app .sb-standard-p{
227
- font-style: normal;
228
- font-weight: normal;
229
- font-size: 14px;
230
- line-height: 160%;
231
- color: #8C8F9A;
232
- margin: 0;
233
- }
234
- #sbi-builder-app .sb-standard-p{
235
- font-size: 16px;
236
- color: #141B38;
237
- }
238
- #sbi-builder-app .sbi-fb-source-inp::placeholder {
239
- color: #8C8F9A;
240
- font-size: 14px;
241
- font-weight: normal;
242
- }
243
- #sbi-builder-app .sb-bold {
244
- font-weight: 600;
245
- }
246
- #sbi-builder-app .sb-dark-text {
247
- color: #141B38;
248
- }
249
- #sbi-builder-app .sbi-btn-orange .sb-small-p,
250
- #sbi-builder-app .sbi-btn-blue .sb-small-p,
251
- #sbi-builder-app .sbi-btn-red .sb-small-p,
252
- #sbi-builder-app .sbi-btn-dark .sb-small-p{
253
- color: #fff;
254
- }
255
-
256
- #sbi-builder-app .sb-caption {
257
- font-style: normal;
258
- font-weight: normal;
259
- font-size: 13px;
260
- line-height: 150%;
261
- color: #141B38;
262
- }
263
- #sbi-builder-app .sb-caption.sb-caption-lighter {
264
- color: #5F6368;
265
- }
266
-
267
- #sbi-builder-app .sb-small {
268
- font-style: normal;
269
- font-weight: bold;
270
- font-size: 10px;
271
- line-height: 160%;
272
- letter-spacing: 0.02em;
273
- text-transform: uppercase;
274
- color: #141B38;
275
- }
276
-
277
- #sbi-builder-app .sb-lighter {
278
- color: #434960;
279
- }
280
- #sbi-builder-app .sb-lightest {
281
- color: #74777D;
282
- }
283
- #sbi-builder-app .sb-small-text {
284
- font-size: 12px;
285
- }
286
- /* Positioning */
287
- .sb-icon-label {
288
- display: flex;
289
- flex-direction: row;
290
- justify-content: flex-start;
291
- align-items: center;
292
- }
293
- /* Misc Stylings */
294
- .sb-flex-center {
295
- display: -ms-flexbox;
296
- display: -webkit-flex;
297
- display: flex;
298
-
299
- -ms-flex-align: center;
300
- -webkit-align-items: center;
301
- -webkit-box-align: center;
302
-
303
- align-items: center;
304
- }
305
- .sb-box-shadow {
306
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
307
- }
308
- #sbi-builder-app .sb-icon-small svg {
309
- height: 10px;
310
- }
311
-
312
- /*
313
- Social Links
314
- */
315
- .sbi-cl-facebook, .sbi-clhv-facebook:hover{
316
- color: #006BFA!important;
317
- }
318
- .sbi-bg-facebook, .sbi-bghv-facebook:hover{
319
- background: #006BFA!important;
320
- }
321
-
322
- .sbi-cl-instagram, .sbi-clhv-instagram:hover{
323
- color: #BA03A7!important;
324
- }
325
- .sbi-bg-instagram, .sbi-bghv-instagram:hover{
326
- background: #BA03A7!important;
327
- }
328
-
329
- .sbi-cl-twitter, .sbi-clhv-twitter:hover{
330
- color: #1B90EF!important;
331
- }
332
- .sbi-bg-twitter, .sbi-bghv-twitter:hover{
333
- background: #1B90EF!important;
334
- }
335
-
336
- .sbi-cl-youtube, .sbi-clhv-youtube:hover{
337
- color: #EB2121!important;
338
- }
339
- .sbi-bg-youtube, .sbi-bghv-youtube:hover{
340
- background: #EB2121!important;
341
- }
342
-
343
- .sbi-cl-linkedin, .sbi-clhv-linkedin:hover{
344
- color: #007bb6!important;
345
- }
346
- .sbi-bg-linkedin, .sbi-bghv-linkedin:hover{
347
- background: #007bb6!important;
348
- }
349
-
350
- .sbi-cl-mail, .sbi-clhv-mail:hover{
351
- color: #666!important;
352
- }
353
- .sbi-bg-mail, .sbi-bghv-mail:hover{
354
- background: #666!important;
355
- }
356
-
357
- #sbi-builder-app{
358
- font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;;
359
- visibility: hidden;
360
- opacity: 0;
361
- }
362
- #sbi-builder-app[data-app-loaded="true"]{
363
- visibility: visible;
364
- opacity: 1;
365
- }
366
-
367
- .sbi-builder-app a, .sbi-builder-app a:focus{
368
- text-decoration: none;
369
- /*color: inherit;*/
370
- outline: none;
371
- }
372
- .sbi-fb-btn{
373
- display: flex;
374
- flex-direction: row;
375
- justify-content: center;
376
- align-items: center;
377
- padding: 9px 38px;
378
- font-style: normal;
379
- font-weight: 500;
380
- font-size: 14px;
381
- line-height: 17px;
382
- border-radius: 2px;
383
- cursor: pointer;
384
- color: #fff;
385
- outline: none;
386
- box-shadow: none;
387
- border: none;;
388
- }
389
- .sbi-fb-btn:focus{
390
- box-shadow: none;
391
- }
392
- .sbi-fb-fs{
393
- width: 100%;
394
- position: relative;
395
- float: left;
396
- box-sizing: border-box;
397
- }
398
- .sbi-fs-a{
399
- width: 100%;
400
- height: 100%;
401
- display: block;
402
- position: absolute;
403
- left: 0;
404
- top: 0;
405
- z-index: 1;
406
- }
407
- .sb-btn:focus{
408
- outline: none;
409
- }
410
- #wpcontent,
411
- .instagram-feed_page_sbi-feed-builder #wpcontent{
412
- padding-left: 0px;
413
- }
414
- #wpfooter{
415
- display: none;
416
- }
417
- #wpbody-content{
418
- padding-bottom: 0px;
419
- }
420
- #wpbody{
421
- padding-left: 0px!important;
422
- }
423
- .sbi-fb-wrapper{
424
- max-width: 92%;
425
- position: relative;
426
- margin: auto;
427
- color: #141B38;
428
- }
429
- .sbi-fb-fs-boss{
430
- position: fixed;
431
- height: 100vh;
432
- width: 100%;
433
- left: 0;
434
- top: 0;
435
- bottom: 0;
436
- right: 0;
437
- background: rgba(0,0,0,.4);
438
- z-index: 9989;
439
- }
440
-
441
-
442
- /*
443
- Header
444
- */
445
- .sbi-fb-create-ctn{
446
- margin-top: 104px;
447
- padding: 0 54px;
448
- box-sizing: border-box;
449
- width: 100%;
450
- }
451
- .sbi-fb-header{
452
- height: 64px;
453
- position: absolute;
454
- display: flex;
455
- flex-direction: row;
456
- justify-content: space-between;
457
- align-items: center;
458
- background: #fff;
459
- padding: 0px 52px;
460
- z-index: 99;
461
- }
462
- .sbi-fb-header-left {
463
- display: flex;
464
- }
465
- .sbi-fb-header-left .sb-social-wall-link-wrap {
466
- margin-left: 30px;
467
- }
468
- .sbi-fb-hd-logo {
469
- display: flex;
470
- vertical-align: middle;
471
- align-items: center;
472
- gap: 5px;
473
- }
474
- .sbi-fb-hd-logo .sb-logo-letters-wrap {
475
- transform: translate(0px, -2px);
476
- }
477
- .sbi-fb-hd-logo .breadcrumb-title {
478
- font-size: 14px;
479
- font-weight: 400;
480
- line-height: 22px;
481
- letter-spacing: 0em;
482
- margin-left: 4px;
483
- }
484
- .sbi-csz-header.sbi-fb-header{
485
- position: fixed!important;
486
- padding: 0 20px;
487
- }
488
- .sbi-csz-header-insider{
489
- width: calc(100% - 160px);
490
- display: flex;
491
- flex-direction: row;
492
- justify-content: space-between;
493
- align-items: center;
494
- height: 52px;
495
- }
496
-
497
- @media all and (max-width: 960px) {
498
- .sbi-csz-header-insider{
499
- width: calc(100% - 36px);
500
- }
501
- .sb-customizer-ctn .sb-customizer-sidebar{
502
- left: 36px;
503
- }
504
- }
505
-
506
- .sbi-fb-hd-btn{
507
- cursor: pointer;
508
- display: flex;
509
- flex-direction: row;
510
- justify-content: center;
511
- align-items: center;
512
- position: relative;
513
- border: 1px solid;
514
- -webkit-transition: all .15s ease-in-out;
515
- transition: all .15s ease-in-out;
516
- }
517
- .sbi-fb-hd-btn i{
518
- margin: 0px 5px;
519
- }
520
- .sbi-fb-full-wrapper {
521
- padding: 0 53px;
522
- padding-top: 82px;
523
- }
524
- .sbi-csz-hd-actions{
525
- display: flex;
526
- justify-content: center;
527
- align-items: center;
528
- }
529
- .sbi-csz-hd-actions > button{
530
- margin-left: 10px;
531
- }
532
-
533
- .sbi-csz-btn-embd{
534
- color: #fff;
535
- background: var(--cl-dark);
536
- border-color: var(--cl-dark);
537
- }
538
- .sbi-csz-btn-save{
539
- color: #fff;
540
- background: var(--cl-orange);
541
- border-color: var(--cl-orange);
542
- }
543
- .sbi-csz-hd-name{
544
- display: flex;
545
- justify-content: center;
546
- align-items: center;
547
- height: 45px;
548
- }
549
- .sbi-csz-hd-name strong{
550
- font-size: 18px;
551
- }
552
- .sbi-csz-hd-name[data-edit="true"] strong{
553
- display: none;
554
- }
555
- .sbi-csz-hd-name input[type="text"]{
556
- border-radius: 0px;
557
- border: 0px;
558
- background: #CCE7FF;
559
- outline: none;
560
- font-size: 18px;
561
- font-weight: 700;
562
- display: none;
563
- }
564
- .sbi-csz-hd-name[data-edit="true"] input[type="text"]{
565
- display: block;
566
- }
567
- .sbi-csz-hd-name input[type="text"]:focus{
568
- outline: none!important;
569
- border: 0px!important;
570
- box-shadow: none!important;
571
- }
572
-
573
-
574
- .sbi-csz-name-ed-btn{
575
- width: 22px;
576
- height: 22px;
577
- cursor: pointer;
578
- margin: 0 10px;
579
- background: #E8E8EB;
580
- border: 1px solid #E8E8EB;
581
- outline: none;
582
- }
583
- .sbi-csz-name-ed-btn:focus,
584
- .sbi-csz-name-ed-btn:hover{
585
- outline: none;
586
- background-color: #fff;
587
- }
588
- .sbi-csz-name-ed-btn svg{
589
- width: 11px;
590
- fill: #141B38;
591
- float: left;
592
- margin-left: -1px;
593
- }
594
-
595
-
596
- /*
597
- Welcome Screen Empty State
598
- */
599
- .sbi-fb-wlcm-header{
600
- display: flex;
601
- align-items: center;
602
- margin-bottom: 28px;
603
- margin-top: 23px;
604
- }
605
- #sbi-fb-full-wrapper .sbi-fb-wlcm-header {
606
- margin-bottom: 34px;
607
- }
608
-
609
- .sbi-fb-wlcm-header h3,
610
- .sbi-fb-create-ctn h3{
611
- font-weight: 600;
612
- font-size: 32px;
613
- line-height: 40px;
614
- padding: 0;
615
- margin: 0;
616
- float: left;
617
- }
618
- .sbi-fb-btn-new{
619
- background: var(--cl-orange);
620
- position: relative;
621
- float: left;
622
- margin-left: 20px;
623
- font-size: 12px;
624
- padding: 8px 12px 8px 32px;
625
- font-weight: 700;
626
- }
627
- .sbi-fb-btn-new svg{
628
- width: 10px;
629
- height: 10px;
630
- position: absolute;
631
- left: 12px;
632
- }
633
-
634
- .sbi-fb-inf-cnt{
635
- position: relative;
636
- background: #fff;
637
- padding: 27px;
638
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
639
- border-radius: 2px;
640
- max-width: 100%;
641
- }
642
- .sbi-fb-inf-num{
643
- width: 30px;
644
- height: 30px;
645
- position: relative;
646
- float: left;
647
- display: flex;
648
- justify-content: center;
649
- align-items: center;
650
- font-size: 12px;
651
- font-weight: 600;
652
- color: #141B38;
653
- margin-right: 20px;
654
-
655
- }
656
- .sbi-fb-inf-num span{
657
- z-index: 1;
658
- }
659
- .sbi-fb-inf-num:before{
660
- content: '';
661
- position: absolute;
662
- width: 100%;
663
- height: 100%;
664
- background: #D8DADD;
665
- border-radius: 50%;
666
- }
667
- .sbi-fb-inf-txt{
668
- float: left;
669
- }
670
- /*.sbi-fb-inf-txt strong{
671
- display: block;
672
- font-size: 20px;
673
- line-height: 1em;
674
- font-weight: bold;
675
- margin-bottom: 8px;
676
- }*/
677
- .sbi-fb-inf-txt span{
678
- display: block;
679
- font-size: 16px;
680
- color: #5F6368;
681
- line-height: 1.5em;
682
- }
683
- .sbi-fb-wlcm-inf-1 {
684
- padding-left: 297px;
685
- }
686
- .sbi-fb-wlcm-inf-1 .sbi-fb-inf-svg{
687
- position: absolute;
688
- left: 191px;
689
- top: 32px;
690
- /*float: left;
691
- margin-top: 30px;
692
- margin-left: 230px;
693
- position: relative;
694
- margin-right: 25px;*/
695
- }
696
- .sbi-fb-wlcm-inf-1 .sbi-fb-inf-svg svg{
697
- margin-top: -45px;
698
- }
699
- .sb-head {
700
- position: absolute;
701
- top: -2px;
702
- left:-4px;
703
- }
704
- .sbi-fb-wlcm-inf-1 .sbi-fb-inf-cnt{
705
- float: left;
706
- width: 523px;
707
- margin-bottom: 24px;
708
- }
709
- .sbi-fb-wlcm-inf-2{
710
- display: flex;
711
- justify-content: space-between;
712
- padding-left: 152px;
713
- }
714
- .sbi-fb-wlcm-inf-2 .sbi-fb-inf-cnt{
715
- float: left;
716
- width: 590px;
717
- margin-bottom: 29px;
718
- height: 67px;
719
- display: flex;
720
- align-items: center;
721
- }
722
- .sbi-fb-wlcm-inf-2 .sbi-fb-inf-img{
723
- position: absolute;
724
- right: 15px;
725
- top: -15px;
726
- }
727
-
728
- .sbi-fb-wlcm-inf-3{
729
- display: flex;
730
- justify-content: flex-start;
731
- align-items: center;
732
- padding-left: 297px;
733
- }
734
- .sbi-fb-wlcm-inf-3 .sbi-fb-inf-cnt{
735
- float: left;
736
- width: 620px;
737
- height: 80px;
738
- display: flex;
739
- justify-content: center;
740
- align-items: center;
741
- }
742
- .sbi-fb-wlcm-inf-3 .sbi-fb-inf-img{
743
- float: left;
744
- left: 10px;
745
- top: -10px;
746
- position: absolute;
747
- }
748
- .sbi-fb-wlcm-inf-2 .sbi-fb-inf-num, .sbi-fb-wlcm-inf-3 .sbi-fb-inf-num{
749
- margin-top: -20px;
750
- }
751
- .sbi-fb-types-ctn, .sbi-fb-slctsrc-ctn, .sbi-fb-section-wh{
752
- background: #fff;
753
- border: 1px solid #E7E7E9;
754
- }
755
- .sbi-fb-wrapper h3, .sbi-fb-section-wh h3{
756
- font-size: 32px;
757
- line-height: 39px;
758
- font-weight: 600;
759
- }
760
- .sbi-fb-create-ctn h3{
761
- margin-bottom: 30px;
762
- }
763
- .sbi-fb-types h4, .sbi-fb-section-wh h4 {
764
- font-size:20px;
765
- line-height: 24px;
766
- font-weight: 600;
767
- }
768
- #sbi-builder-app .sbi-fb-create-ctn h4,
769
- #sbi-builder-app .sbi-fb-feedtypes-pp-ctn h4{
770
- margin-bottom: 1px;
771
- }
772
- #sbi-builder-app .sbi-fb-feedtypes-pp-ctn .sbi-fb-types {
773
- margin-top: 20px;
774
- }
775
- #sbi-builder-app .sbi-fb-adv-types .sbi-adv-types-heading{
776
- font-style: normal;
777
- font-weight: bold;
778
- font-size: 12px;
779
- line-height: 160%;
780
- letter-spacing: 0.05em;
781
- text-transform: uppercase;
782
- color: #8C8F9A;
783
- }
784
- .sbi-fb-types-desc{
785
- font-size: 14px;
786
- color: #434960;
787
- margin-bottom: 33px;
788
- display: block;
789
- }
790
- .sbi-fb-types, .sbi-fb-adv-types{
791
- padding: 22px 35px 0;
792
- }
793
- .sbi-fb-adv-types {
794
- padding-top: 0;
795
- }
796
- #sbi-builder-app .sbi-fb-type-el-info a,
797
- .sbi-business-required{
798
- color: #0068A0;
799
- font-size: 12px;
800
- display: flex;
801
- align-self: center;
802
- }
803
- #sbi-builder-app .sbi-fb-type-el-info a span{
804
- margin-right: 7px;
805
- }
806
- #sbi-builder-app .sbi-fb-type-el-info a svg,
807
- .sbi-business-required svg{
808
- height: 16px;
809
- line-height: 12px;
810
- vertical-align: top;
811
- margin-top: 1px;
812
- }
813
- .sbi-fb-types-list{
814
- display: grid;
815
- grid-template-columns: 24.25% 24.25% 24.25% 25.25%;
816
- grid-column-gap: 1%;
817
- margin-bottom: 31px;
818
- }
819
-
820
- /*
821
- .sbi-fb-adv-types .sbi-fb-types-list{
822
- grid-template-columns: 24.25% 24.25% 24.25% 24.25%;
823
- }
824
- */
825
- .sbi-fb-heading {
826
- margin-bottom: 24px;
827
- width: 100%;
828
- float: left;
829
- }
830
- .sbi-fb-heading h1{
831
- float: left;
832
- }
833
- .sbi-fb-heading .sbi-fb-btn{
834
- float: right!important;
835
- }
836
-
837
- .sbi-fb-adv-types .sbi-fb-types-list{
838
- margin-bottom: 71px;
839
- }
840
- .sbi-fb-type-el{
841
- display: flex;
842
- flex-direction: column;
843
- align-items: flex-start;
844
- padding: 0;
845
- position: relative;
846
- background: #fff;
847
- border: 1px solid #F1F1F1;
848
- border-radius: 3px;
849
- cursor: pointer;
850
- box-sizing: border-box;
851
- }
852
- .sbi-fb-type-el:not([data-type="socialwall"]):hover,
853
- .sbi-fb-adv-types .sbi-fb-type-el:not([data-type="socialwall"]):hover{
854
- border: 1px solid #F6966B;
855
- }
856
-
857
-
858
- .sbi-fb-adv-types .sbi-fb-type-el{
859
- border: 1px solid #FFDBBA;
860
- }
861
- .sb-control-feedtype-ctn .sbi-fb-type-el{
862
- border: 2px solid #E8E8EB;
863
- margin-bottom: 7px;
864
- }
865
- .sb-control-feedtype-ctn .sbi-fb-type-el-info{
866
- margin-top: 14px
867
- }
868
- .sbi-fb-type-el[data-active="true"],
869
- .sbi-fb-adv-types .sbi-fb-type-el[data-active="true"]{
870
- border: 2px solid var(--cl-orange)!important;
871
- }
872
- .sbi-fb-type-el[data-active="true"]:not([data-type="socialwall"]):after{
873
- content: '';
874
- position: absolute;
875
- width: 10px;
876
- height: 4px;
877
- border-left: 2px solid #fff;
878
- border-bottom: 2px solid #fff;
879
- z-index: 3;
880
- right: 5px;
881
- top: 7px;
882
- -webkit-transform: rotate(-45deg);
883
- transform: rotate(-45deg);
884
- }
885
- .sbi-fb-type-el:before{
886
- content: '';
887
- position: absolute;
888
- width: 24px;
889
- height: 24px;
890
- right: 0px;
891
- top: 0px;
892
- z-index: 2;
893
- background: #DCDDE1;
894
- }
895
- .sbi-fb-type-el[data-active="true"]:before{
896
- background: var(--cl-orange)
897
- }
898
- .sbi-fb-type-el[data-type="socialwall"]:before{
899
- display: none;
900
- }
901
-
902
-
903
- .sbi-fb-type-el-img{
904
- display: flex;
905
- flex-direction: column;
906
- justify-content: center;
907
- align-items: center;
908
- background: #F1F1F1;
909
- border: 2px solid #F1F1F1;
910
- border-bottom: 1px solid #fff;
911
- }
912
- .sbi-fb-type-el[data-active="true"] .sbi-fb-type-el-img{
913
- border: 1px solid #F1F1F1;
914
- border-bottom: 2px solid #fff;
915
- }
916
- .sbi-fb-type-el-img svg {
917
- max-width: 100%;
918
- }
919
- .sbi-fb-adv-types .sbi-fb-type-el-img{
920
- background: #FCF4EF;
921
- }
922
- .sbi-fb-type-el-info{
923
- display: flex;
924
- flex-direction: column;
925
- justify-content: center;
926
- align-items: center;
927
- text-align: center;
928
- flex: 1 1 auto;
929
- padding: 0 13px 13px;
930
- }
931
- .sbi-fb-type-el-link{
932
- font-size: 13px;
933
- font-weight: 400;
934
- margin-bottom: 5px;
935
- }
936
-
937
- .sb-control-feedtype-ctn .sbi-fb-type-el-info{
938
- padding: 15px 70px 25px;
939
- }
940
- .sb-control-feedtype-ctn .sbi-fb-type-el-info strong{
941
- font-size: 14px;
942
- }
943
- #sbi-builder-app .sbi-fb-type-el p {
944
- margin: 11px 0 4px;
945
- }
946
- #sbi-builder-app .sbi-fb-type-el[data-active="true"] p{
947
- margin-top: 10px;
948
- }
949
- #sbi-builder-app .sbi-fb-type-el[data-active="true"] .sbi-fb-type-el-info {
950
- padding-bottom: 12px;
951
- }
952
- #sbi-builder-app .sbi-fb-type-el p svg {
953
- width: 14px;
954
- height: 14px;
955
- margin-left: 5px;
956
- vertical-align: middle;
957
- }
958
- /*.sbi-fb-type-el-info strong{
959
- font-weight: 600;
960
- font-size: 16px;
961
- line-height: 19px;
962
- margin-bottom: 10px;
963
- text-transform: capitalize;
964
- display: flex;
965
- justify-content: center;
966
- align-items: center;
967
- }
968
- .sbi-fb-type-el-info strong i{
969
- color: #ed8000;
970
- margin-left: 5px;
971
- font-size: 13px;
972
- margin-top: 2px;
973
- }
974
- .sbi-fb-type-el-info span{
975
- font-size: 13px;
976
- line-height: 1.4em;
977
- color: #74777D;
978
- }*/
979
- .sbi-fb-adv-types .sbi-fb-type-el-img {
980
- border-color: #FCF4EF;
981
- }
982
- .sbi-fb-ft-action {
983
- border-top: 1px solid #D8DADD;
984
- padding: 30px 40px;
985
- margin-top: 63px;
986
- }
987
- .sbi-fb-slctfd-action .sbi-fb-wrapper{
988
- display: flex;
989
- align-items: center;
990
- justify-content: flex-end;
991
- }
992
- .sbi-fb-slctfd-action{
993
- padding: 16px 0;
994
- }
995
- .sbi-fb-slctf-nxt{
996
- height: auto;
997
- padding: 7px 36px 7px 37px;
998
- }
999
- .sbi-fb-slctf-back{
1000
- margin-right: auto;
1001
- height: auto;
1002
- padding: 7px 37px 7px 36px;
1003
- }
1004
- .sbi-fb-slctf-back svg,
1005
- .sbi-fb-slctf-nxt svg {
1006
- width: 6px;
1007
- height: 10px;
1008
- }
1009
- .sbi-fb-slctf-back span {
1010
- display: inline-block;
1011
- margin-left: 15px;
1012
- line-height: 160%;
1013
- }
1014
- .sbi-fb-slctf-nxt span {
1015
- display: inline-block;
1016
- margin-right: 15px;
1017
- line-height: 160%;
1018
- }
1019
- .sbi-fb-btn-ac{
1020
- opacity: 0.6;
1021
- }
1022
- .sbi-fb-btn-ac[data-active="true"]{
1023
- opacity: 1;
1024
- }
1025
-
1026
- .sb-control-single-id-ctn{
1027
- margin-top: 35px;
1028
- padding: 25px 0px;
1029
- }
1030
- .sb-control-single-id-ctn:before,
1031
- .sb-control-before-brd:before
1032
- {
1033
- content: '';
1034
- position: absolute;
1035
- border-top: 1px solid #DCDDE1;
1036
- height: 2px;
1037
- top: 0px;
1038
- left: -20px;
1039
- width: calc(100% + 40px);
1040
- }
1041
- .sb-control-single-id-input{
1042
- display: flex;
1043
- justify-content: center;
1044
- align-items: center;
1045
- margin-top: 7px;
1046
- }
1047
- .sb-control-single-id-input input{
1048
- height: 45px;
1049
- float: left;
1050
- background: #fff;
1051
- margin-top: 6px;
1052
- margin-right: 7px;
1053
- }
1054
-
1055
- /*
1056
- Video Type Chooser
1057
- */
1058
- .sbi-fb-section-wh.sbi-fb-section-videos{
1059
- padding: 50px 21px 54px 30px;
1060
- }
1061
- .sbi-fb-videotype-chooser{
1062
- display: grid;
1063
- grid-template-columns: 49% 49%;
1064
- grid-column-gap: 1%;
1065
-
1066
- }
1067
- .sbi-fb-section-videos{
1068
- flex-direction: column;
1069
- }
1070
- .sbi-fb-section-videos .sbi-fb-section-video-playlist{
1071
- margin-top: 30px;
1072
- }
1073
-
1074
- .sbi-fb-section-video-playlist .sbi-fb-wh-inp{
1075
- margin-top: 10px;
1076
- margin-bottom: 10px!important;
1077
- }
1078
- .sbi-fb-section-videos .sbi-fb-sglelm-left{
1079
- padding-right: 0px;
1080
- }
1081
- /*
1082
- Source Screen
1083
- */
1084
- .sbi-fb-sec-heading > span{
1085
- font-size:14px;
1086
- color: #434960;
1087
- line-height: 1.7em;
1088
- display: block;
1089
- }
1090
- #sbi-builder-app .sbi-fb-sec-heading h4{
1091
- margin-bottom: 2px;
1092
- }
1093
- #sbi-builder-app .sbi-fb-slctsrc-ctn .sbi-fb-sec-heading h4{
1094
- margin-bottom: 2px !important;
1095
- }
1096
- .sbi-fb-sec-heading {
1097
- margin-bottom: 14px;
1098
- }
1099
- .sbi-builder-app .sbi-fb-slctsrc-content,.sbi-fb-section-wh-insd{
1100
- padding: 23px 30px;
1101
- }
1102
-
1103
- .sbi-fb-slctsrc-ctn h4,.sbi-fb-section-wh-insd h4{
1104
- font-size: 20px;
1105
- padding: 0px;
1106
- margin: 0px;
1107
- }
1108
- .sbi-fb-srcslist-ctn{
1109
- display: grid;
1110
- grid-template-columns: 32.66% 32.66% 32.66%;
1111
- grid-column-gap: 1%;
1112
- margin-bottom: 28px;
1113
- }
1114
- .sbi-fb-srcs-item{
1115
- width: 100%;
1116
- cursor: pointer;
1117
- height: 62px;
1118
- margin: 1% 0;
1119
- border-radius: 3px;
1120
- border: 1px solid #E7E7E9;
1121
- display: flex;
1122
- position: relative;
1123
- }
1124
- .sbi-fb-srcs-item[data-disabled="true"]{
1125
- background: #F3F4F5;
1126
- }
1127
- .sbi-fb-srcs-item[data-disabled="true"] .sbi-fb-srcs-item-inf{
1128
- opacity: .55;
1129
-
1130
- }
1131
- #sbi-builder-app .sbi-fb-srcs-item .sbi-fb-srcs-item-inf .sbi-fb-srcs-item-name {
1132
- color: #141B38;
1133
- padding-right: 44px;
1134
- }
1135
- /*Disabled Controls*/
1136
- .sb-control-elem-ctn[data-disabled="true"] input[type="text"],
1137
- .sb-control-elem-ctn[data-disabled="true"] input[type="number"],
1138
- .sb-control-elem-ctn[data-disabled="true"] input[type="date"],
1139
- .sb-control-elem-ctn[data-disabled="true"] textarea{
1140
- background: #f0f0f0!important;
1141
- border-color: #D0D1D7!important;
1142
- }
1143
-
1144
- .sb-control-elem-ctn[data-disabled="true"] .sb-control-colorpicker-swatch{
1145
- background: #D0D1D7!important;
1146
- }
1147
- .sb-control-elem-ctn[data-disabled="true"] .sb-control-checkbox{
1148
- background: #D0D1D7!important;
1149
- border-color: #c1c1c1!important;
1150
- }
1151
- .sb-control-elem-ctn[data-disabled="true"] .sb-control-toggle-elm{
1152
- background: #e5e6e7!important;
1153
- }
1154
- .sb-control-elem-ctn[data-disabled="true"] .sb-control-toggle-elm{
1155
- border-color: #c1c1c1!important;
1156
- }
1157
- .sb-control-elem-ctn[data-disabled="true"] .sb-control-toggle-elm[data-active="true"]{
1158
- border-top: 0px;
1159
- }
1160
- .sb-control-elem-ctn[data-disabled="true"] .sb-control-toggle-elm .sb-control-toggle-deco{
1161
- border-color: #bbb!important;
1162
- }
1163
- .sb-control-elem-ctn[data-disabled="true"] .sb-control-toggle-elm[data-active="true"] .sb-control-toggle-deco{
1164
- border-color: #8C8F9A!important;
1165
-
1166
- }
1167
- #sbi-builder-app .sbi-fb-srcs-item .sbi-fb-srcs-item-inf .sbi-fb-srcs-item-name span {
1168
- max-height: 30px;
1169
- display: block;
1170
- overflow: hidden;
1171
- line-height: 1.1;
1172
- padding-bottom:1px;
1173
- color: #141B38;
1174
- }
1175
-
1176
- #sbi-builder-app .sbi-fb-srcs-item:hover{
1177
- border-color: #86D0F9;
1178
- }
1179
- #sbi-builder-app .sbi-fb-srcs-item[data-active="true"]{
1180
- border-color: #0096cc;
1181
- }
1182
-
1183
- .sbi-fb-source-top .sbi-fb-srcs-item{
1184
- margin-bottom: 0px;
1185
- }
1186
- #sbi-builder-app .sbi-fb-srcs-new{
1187
- display: flex;
1188
- justify-content: center;
1189
- align-items: center;
1190
- background: #EBF5FF;
1191
- border: 1px solid #EBF5FF;
1192
- }
1193
- #sbi-builder-app .sbi-fb-srcs-new span{
1194
- margin-left: 13px;
1195
- color: #0096CC;
1196
- }
1197
- .sbi-fb-srcs-new i{
1198
- font-size: 14px;
1199
- padding: 0 10px;
1200
- margin-left: -10px;
1201
- }
1202
- .sbi-fb-srcs-item-chkbx{
1203
- width: 40px;
1204
- height: inherit;
1205
- display: flex;
1206
- justify-content: center;
1207
- align-items: center;
1208
- margin: 0 16px 0 7px;
1209
- }
1210
-
1211
- .sbi-fb-srcs-item-chkbx-ic,.sbi-fb-chbx-round{
1212
- width: 16px;
1213
- height: 16px;
1214
- box-sizing: border-box;
1215
- position: relative;
1216
- border-radius: 50px;
1217
- border: 2px solid #8c8f9a;
1218
- }
1219
- [data-source="active"] .sbi-fb-srcs-item-chkbx-ic{
1220
- border-radius: 2px;
1221
- }
1222
-
1223
- [data-active="true"] .sbi-fb-srcs-item-chkbx-ic, [data-active="true"] > .sbi-fb-chbx-round, .sbi-fb-source-popup [data-active="true"] > .sbi-fb-chbx-round{
1224
- border-color: #0096cc;
1225
- background: #0096cc;
1226
- }
1227
- [data-source="active"] [data-active="true"] .sbi-fb-srcs-item-chkbx-ic:before{
1228
- content: ''!important;
1229
- position: absolute!important;
1230
- width: 8px!important;
1231
- height: 3px!important;
1232
- border-left: 2px solid #fff;
1233
- border-bottom: 2px solid #fff;
1234
- top: 2px!important;
1235
- right: 1px!important;
1236
- left: unset!important;
1237
- background: unset!important;
1238
- border-radius: unset!important;
1239
- -webkit-transform: rotate(-45deg);
1240
- transform: rotate(-45deg);
1241
- }
1242
-
1243
- [data-multifeed="inactive"] [data-active="true"] .sbi-fb-srcs-item-chkbx-ic:before, [data-active="true"] > .sbi-fb-chbx-round:before,
1244
- .sbi-fb-source-popup .sbi-fb-source-list [data-active="true"] .sbi-fb-srcs-item-chkbx-ic:before,
1245
- .sbi-fb-section-videos [data-active="true"] .sbi-fb-srcs-item-chkbx-ic:before{
1246
- content: '';
1247
- position: absolute;
1248
- height: 6px;
1249
- width: 6px;
1250
- background: #fff;
1251
- border-radius: 25px;
1252
- left: 3px;
1253
- top: 3px;
1254
- }
1255
-
1256
- .sbi-fb-sources-empty-ctn{
1257
- padding: 24px 32px 28px 24px;
1258
- background: #F9F9FA;
1259
- border: 1px dashed #DCDDE1;
1260
- margin-top: 10px;
1261
- display: flex;
1262
- align-items: center;
1263
- }
1264
-
1265
- .sbi-fb-sources-empty-txt{
1266
- font-style: normal;
1267
- font-weight: normal;
1268
- font-size: 16px;
1269
- line-height: 160%;
1270
- color: #141B38;
1271
- }
1272
- .sbi-fb-sources-empty-btn-ctn{
1273
- margin-left: auto;
1274
- }
1275
- .sb-addsources-btn{
1276
- color: #fff;
1277
- height: 27px;
1278
- padding: 9px 23px;
1279
- }
1280
- .sb-addsources-btn svg{
1281
- margin-right: 10px;
1282
- fill: currentColor;
1283
- width: 14px;
1284
- height: 14px;
1285
- }
1286
- .sbi-fb-mr-feeds,.sbi-fb-section-wh{
1287
- margin-top: 8px;
1288
- background: #fff;
1289
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
1290
- display: flex;
1291
- align-items: center;
1292
- }
1293
- .sbi-fb-mr-fd-img {
1294
- float: left;
1295
- margin-right: 6%;
1296
- width: 28%;
1297
- line-height: 0;
1298
- }
1299
- .sbi-fb-mr-fd-img img{
1300
- width: 100%;
1301
- }
1302
-
1303
- .sbi-fb-mr-fd-heading{
1304
- font-weight:600;
1305
- font-size: 18px;
1306
- line-height: 1.7em;
1307
- margin-bottom: 24px;
1308
- float: left;
1309
- }
1310
- .sbi-fb-mr-fd-list{
1311
- margin-bottom: 10px;
1312
- width: 100%;
1313
- float: left;
1314
- }
1315
- .sbi-fb-mr-fd-item{
1316
- box-sizing: border-box;
1317
- position: relative;
1318
- float: left;
1319
- border: 1px solid #DCDDE1;
1320
- border-radius: 2px;
1321
- margin-right: 8px;
1322
- height: 38px;
1323
- width: 160px;
1324
- color: #141B38;
1325
- font-size: 14px;
1326
- font-weight:600;
1327
- text-transform: capitalize;
1328
- display: flex;
1329
- justify-content: center;
1330
- align-items: center;
1331
- transition: all .15s ease-in-out;
1332
- }
1333
- .sbi-icon-platform-wrap {
1334
- width: 100%;
1335
- display: flex;
1336
- justify-content: left;
1337
- align-items: center;
1338
- margin-left: 13px;
1339
- }
1340
-
1341
- .sbi-fb-mr-fd-ic {
1342
- margin-right: 9px;
1343
- }
1344
- .sbi-fb-mr-fd-ic svg{
1345
- height: 16px;
1346
- fill: currentColor;
1347
- float: left;
1348
- }
1349
- .sbi-fb-mr-fd-ch{
1350
- position: absolute;
1351
- right:14px;
1352
- }
1353
- #sbi-builder-app .sbi-fb-mr-fd-heading h3 {
1354
- margin-bottom: 21px;
1355
- max-width: 385px;
1356
- }
1357
-
1358
-
1359
-
1360
- /*Embed Popup*/
1361
- .sbi-fb-embed-step-1{
1362
- margin-top: 36px;
1363
- }
1364
-
1365
- .sbi-fb-embed-step-1 > div{
1366
- padding: 0 20px;
1367
- }
1368
- .sbi-fb-embed-step-1-top{
1369
- padding-bottom: 53px!important;
1370
- border-bottom: 1px solid #E8E8EB;
1371
- margin-bottom: 42px;
1372
- }
1373
- #sbi-builder-app .sbi-fb-embed-step-1 h4{
1374
- margin-bottom: 12px;
1375
- }
1376
- .sbi-fb-embed-input-ctn{
1377
- display: flex;
1378
- }
1379
- .sbi-fb-embed-input-ctn input,
1380
- .sbi-fb-embed-input-ctn input[type="text"]{
1381
- position: relative;
1382
- font-style: normal;
1383
- font-weight: normal;
1384
- font-size: 16px;
1385
- line-height: 160%;
1386
- color: #141B38;
1387
- height: 44px;
1388
- width: 77%;
1389
- box-sizing: border-box;
1390
- border-radius: 0px;
1391
- border: 1px solid #D0D1D7!important;
1392
- border-right: 0px!important;
1393
-
1394
- }
1395
- .sbi-fb-embed-input-ctn input:focus, .sbi-fb-embed-input-ctn .sbi-fb-hd-btn:focus{
1396
- box-shadow: none!important;
1397
- outline: none!important
1398
- }
1399
- .sbi-fb-embed-input-ctn .sbi-fb-hd-btn{
1400
- width: 23%;
1401
- border-bottom-left-radius: 0px;
1402
- border-top-left-radius: 0px;
1403
- }
1404
- .sbi-fb-embed-input-ctn svg{
1405
- width: 17px;
1406
- fill: currentColor;
1407
- float: left;
1408
- margin-right: 10px;
1409
- }
1410
- .sbi-fb-embed-step-1-bottom h4{
1411
- text-align: center;
1412
- }
1413
- .sbi-fb-embed-btns-ctn{
1414
- display: grid;
1415
- grid-template-columns: 49% 49%;
1416
- grid-column-gap: 2%;
1417
- margin-top: 14px;
1418
- margin-bottom: 60px;
1419
- }
1420
- .sbi-fb-embed-btn{
1421
- cursor: pointer;
1422
- width: 100%;
1423
- height: 50px;
1424
- background: #F3F4F5;
1425
- border-radius: 2px;
1426
- border: 1px solid #DCDDE1;
1427
- display: flex;
1428
- align-items: center;
1429
- justify-content: space-between;
1430
- box-sizing: border-box;
1431
- padding: 0 20px;
1432
- position: relative;
1433
- color: #141B38;
1434
- font-size: 16px;
1435
- font-weight: 500;
1436
- }
1437
- .sbi-fb-embed-btn .sb-icon-label svg{
1438
- fill: currentColor;
1439
- width: 18px;
1440
- margin-right: 10px;
1441
- float: left;
1442
- }
1443
- .sbi-fb-embed-popup .sb-embed-breadcrumb {
1444
- display: flex;
1445
- align-items: center;
1446
- padding: 25px 30px 0;
1447
- margin-bottom: 2px;
1448
- }
1449
- .sb-embed-breadcrumb a {
1450
- font-style: normal;
1451
- font-weight: bold;
1452
- font-size: 10px;
1453
- line-height: 160%;
1454
- letter-spacing: 0.08em;
1455
- text-transform: uppercase;
1456
- color: #434960;
1457
- cursor: pointer;
1458
- }
1459
- .sb-embed-breadcrumb a:hover {
1460
- color: #141B38;
1461
- }
1462
- .sb-embed-breadcrumb svg {
1463
- margin-right: 8px;
1464
- }
1465
- .sbi-fb-embed-step-2 > div{
1466
- padding: 0 29px;
1467
- }
1468
-
1469
- .sb-customizer-sidebar-cache-wrapper{
1470
- margin-top: 20px;
1471
- padding: 0 20px;
1472
- }
1473
- .sbi-fb-embed-step-2-list{
1474
- margin-top: 25px;
1475
- border-top: 1px solid #DCDDE1;
1476
- padding-top: 14px !important;
1477
- }
1478
- .sbi-fb-embed-step-2-list > strong{
1479
- text-transform: uppercase;
1480
- font-size: 12px;
1481
- color: #434960;
1482
- margin-bottom: 10px;
1483
- }
1484
- .sbi-fb-embed-step-2-pages{
1485
- margin-top: 8px;
1486
- height: 250px;
1487
- overflow: auto;
1488
- }
1489
- .sbi-fb-embed-step-2-pages .sb-control-toggle-icon svg {
1490
- width: 11px;
1491
- }
1492
- .sbi-fb-embed-step-2-action{
1493
- padding: 10px 34px 10px 30px !important;
1494
- background: #F3F4F5;
1495
- box-shadow: 0px -4px 5px rgba(0, 0, 0, 0.1);
1496
- }
1497
- .sbi-fb-embed-step-2-action a{
1498
- color: #fff;
1499
- }
1500
- .sbi-fb-embed-step-2-action a[data-active="false"]{
1501
- opacity: .75;
1502
- }
1503
-
1504
- /*Dialog Popup*/
1505
- .sbi-fb-dialog-remove-source{
1506
- background: #F3F4F5;
1507
- padding: 40px 20px;
1508
- display: flex;
1509
- justify-content: center;
1510
- align-items: center;
1511
- }
1512
- .sbi-fb-dialog-remove-source .sbi-fb-srcs-item{
1513
- background: #fff;
1514
- width: 280px;
1515
- padding-left: 20px;
1516
- box-sizing: border-box;
1517
- margin-top: 0px;
1518
- }
1519
- .sbi-fb-srcs-item-remove{
1520
- position: absolute;
1521
- width: 35px;
1522
- height: 35px;
1523
- border-radius: 50px;
1524
- background: #fff;
1525
- border:1px solid #E7E7E9;
1526
- z-index: 3;
1527
- right: -13px;
1528
- bottom: -13px;
1529
- display: flex;
1530
- justify-content: center;
1531
- align-items: center;
1532
- box-shadow: 0px 26.7377px 77.2886px rgba(0, 0, 0, 0.107828), 0px 14.2952px 41.3222px rgba(0, 0, 0, 0.0894161), 0px 8.01379px 23.1649px rgba(0, 0, 0, 0.075), 0px 4.25607px 12.3027px rgba(0, 0, 0, 0.0605839), 0px 1.77104px 5.11942px rgba(0, 0, 0, 0.0421718);
1533
- }
1534
- .sbi-fb-srcs-item-remove svg{
1535
- width: 12px;
1536
- float: left;
1537
- fill: var(--error-red);
1538
- }
1539
- .sbi-fb-dialog-popup-content{
1540
- display: flex;
1541
- justify-content: center;
1542
- align-items: center;
1543
- text-align: center;
1544
- flex-direction: column;
1545
- padding: 38px 12%;
1546
- }
1547
- .sbi-fb-dialog-popup-content strong{
1548
- font-size: 22px;
1549
- color: #141B38;
1550
- display: block;
1551
- margin-bottom: 15px;
1552
- }
1553
- .sbi-fb-dialog-popup-content span{
1554
- font-size: 16px;
1555
- line-height: 1.5em;
1556
- color: #434960;
1557
- }
1558
- .sbi-fb-dialog-popup-actions{
1559
- display: flex;
1560
- justify-content: center;
1561
- align-items: center;
1562
- margin-top: 25px;
1563
- }
1564
- .sbi-fb-dialog-popup-actions button{
1565
- width: 100%;
1566
- margin: 4px 4px;
1567
- cursor: pointer;
1568
- height: 42px;
1569
- }
1570
-
1571
- /*
1572
- Footer Sticky Widget
1573
- */
1574
- .sbi-stck-wdg{
1575
- position: fixed;
1576
- right: 21px;
1577
- z-index: 9;
1578
- bottom: 20px;
1579
- }
1580
- .sbi-stck-wdg-btn{
1581
- width: 52px;
1582
- height: 52px;
1583
- background: #fff;
1584
- border-radius: 50%;
1585
- cursor: pointer;
1586
- display: flex;
1587
- justify-content: center;
1588
- align-items: center;
1589
- filter: drop-shadow(0px 9px 13px rgba(0, 0, 0, 0.2));
1590
- }
1591
- .sbi-stck-wdg-btn svg{
1592
- width: 25px;
1593
- fill: #E34F0E;
1594
- height: 33px;
1595
- float: left;
1596
- }
1597
- .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn svg,.sbi-stck-wdg-btn-cls{
1598
- display: none;
1599
- }
1600
-
1601
- .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls,
1602
- .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls svg{
1603
- display: block;
1604
- }
1605
- .sbi-stck-wdg-btn-cls{
1606
- width: inherit;
1607
- height: inherit;
1608
- position: relative;
1609
- color: #364152;
1610
- box-shadow: 0px 1px 6px rgba(0, 0, 0, .05), 0px 9px 12px rgba(0, 0, 0, .05);
1611
- border-radius: 70px;
1612
- }
1613
- .sbi-stck-wdg-btn-cls svg {
1614
- width: 14px;
1615
- height: 14px;
1616
- position: absolute;
1617
- top: 50%;
1618
- right: 0;
1619
- bottom: 0;
1620
- left: 50%;
1621
- margin-top: -7px;
1622
- margin-left: -7px;
1623
- }
1624
-
1625
- .sbi-stck-pop{
1626
- position: absolute;
1627
- width: 292px;
1628
- height: auto;
1629
- background: #fff;
1630
- border: 1px solid #E2E8F0;
1631
- box-sizing: border-box;
1632
- box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15), 0px 3px 14px rgba(0, 0, 0, 0.12);
1633
- border-radius: 2px;
1634
- padding: 20px;
1635
- right: 0px;
1636
- bottom: 100px;
1637
- color: #141B38;
1638
- opacity: 0;
1639
- padding-bottom: 82px;
1640
- visibility: hidden;
1641
- }
1642
- .sbi-stck-wdg[data-active="true"] .sbi-stck-pop{
1643
- bottom: 66px;
1644
- opacity: 1;
1645
- visibility: visible;
1646
- }
1647
-
1648
- .sbi-stck-pop svg{
1649
- fill: currentColor;
1650
- }
1651
- .sbi-stck-el-list{
1652
- border: 1px solid #DCDDE1;
1653
- border-radius: 2px;
1654
- }
1655
- .sbi-stck-el{
1656
- display: flex;
1657
- align-items: center;
1658
- padding: 11px 13px;
1659
- border-bottom: 1px solid #DCDDE1;
1660
- }
1661
- .sbi-stck-el:hover{
1662
- background: #F3F4F5;
1663
- }
1664
- .sbi-stck-el:last-of-type{
1665
- border-bottom: 0px;
1666
- }
1667
- .sbi-stck-el-list .sbi-chevron svg{
1668
- width: 5px;
1669
- height: 8px;
1670
- }
1671
- .sbi-stck-el-list .sbi-stck-el-icon svg {
1672
-
1673
- }
1674
- .sbi-stck-el .sbi-stck-el-txt{
1675
- color: #27303F;
1676
- }
1677
- .sbi-stck-el.sbi-stck-el-upgrd{
1678
- padding: 8px 14px;
1679
- font-size: 14px;
1680
- background: var(--cl-orange);
1681
- color: #fff;
1682
- }
1683
- .sbi-chevron {
1684
- position: absolute;
1685
- right: 14px
1686
- }
1687
- .sbi-stck-el.sbi-stck-el-upgrd .sbi-stck-el-txt{
1688
- color: #fff;
1689
- }
1690
- .sbi-stck-el.sbi-stck-el-upgrd:after{
1691
- top: 20px;
1692
- opacity: 1;
1693
- }
1694
- .sbi-stck-el-icon{
1695
- margin-right: 10px;
1696
- }
1697
- .sbi-stck-el-icon svg{
1698
- width: 17px;
1699
- float: left;
1700
- }
1701
- .sbi-stck-el.sbi-stck-el-upgrd svg path{
1702
- fill: #fff!important;
1703
- }
1704
- #sbi-builder-app .sbi-stck-title{
1705
- margin-top: 20px;
1706
- margin-bottom: 10px;
1707
- }
1708
-
1709
- .sbi-stck-follow{
1710
- background: #F3F4F5;
1711
- margin-top: 20px;
1712
- left: 0px;
1713
- bottom: 0px;
1714
- position: absolute;
1715
- padding: 12px 20px;
1716
- display: flex;
1717
- align-items: center;
1718
- }
1719
- .sbi-stck-follow span{
1720
- font-weight: 600;
1721
- font-size: 14px;
1722
- }
1723
- .sbi-stck-flw-links{
1724
- display: flex;
1725
- justify-content: center;
1726
- align-items: center;
1727
- margin-left: auto;
1728
- }
1729
- .sbi-stck-flw-links a{
1730
- width: 36px;
1731
- height: 28px;
1732
- color: inherit;
1733
- display: inline-flex;
1734
- justify-content: center;
1735
- align-items: center;
1736
- margin-left: 4px;
1737
- border-radius: 2px;
1738
- }
1739
- .sbi-stck-flw-links svg{
1740
- width: 17px;
1741
- color: #141B38;
1742
- }
1743
- .sbi-stck-flw-links a:hover{
1744
- background: #fff;
1745
- }
1746
- .sbi-stck-flw-links a:hover svg{
1747
- color: inherit;
1748
- }
1749
-
1750
-
1751
-
1752
- /*
1753
- Builder Footer
1754
- */
1755
- .sbi-bld-footer > div{
1756
- background: #fff;
1757
- color: #141B38;
1758
- margin: 30px 0;
1759
- }
1760
- .sbi-bld-footer{
1761
- padding-top: 0px!important
1762
- }
1763
- .sbi-bld-ft-content{
1764
- display: flex;
1765
- align-items: center;
1766
- max-width: 1200px;
1767
- }
1768
- .sbi-bld-ft-img{
1769
- float: left;
1770
- width: 15%;
1771
- margin-right: 5%;
1772
- /*height: 158px;*/
1773
- }
1774
- .sbi-bld-ft-img svg{
1775
- margin-bottom: -4px;
1776
- }
1777
- .sbi-bld-ft-txt{
1778
- display: flex;
1779
- justify-content: center;
1780
- align-items: center;
1781
- width: 59%;
1782
- margin-right: 5%;
1783
- }
1784
- .sbi-bld-ft-txt strong,
1785
- .sbi-fb-mr-fd-heading span{
1786
- color: var(--cl-orange);
1787
- }
1788
- #sbi-builder-app .sbi-bld-ft-info{
1789
- width: 44%;
1790
- color: #434960;
1791
- }
1792
- #sb-footer-banner .sbi-bld-ft-title{
1793
- width: 63%;
1794
- margin-right: 6%;
1795
- }
1796
- .sbi-bld-ft-action{
1797
- width: 17%;
1798
- display: flex;
1799
- justify-content: left;
1800
- align-items: center;
1801
- }
1802
- .sbi-bld-ft-action svg{
1803
- top: 14px;
1804
- height: 10px;
1805
- }
1806
- @media all and (max-width: 1130px) {
1807
- #sb-footer-banner .sbi-bld-ft-img{
1808
- width: 17%;
1809
- margin-right: 3%;
1810
- }
1811
- #sb-footer-banner .sbi-bld-ft-txt{
1812
- display: flex;
1813
- justify-content: center;
1814
- align-items: center;
1815
- width: 61%;
1816
- margin-right: 3%;
1817
- }
1818
- #sbi-builder-app #sb-footer-banner h3 {
1819
- font-size: 20px;
1820
- }
1821
- #sbi-builder-app #sb-footer-banner .sb-small-p {
1822
- font-size: 13px;
1823
- }
1824
- #sb-footer-banner .sb-button-standard {
1825
- font-size: 13px;
1826
- padding-left: 16px;
1827
- line-height: 15px;
1828
- }
1829
- }
1830
-
1831
- .sbi-bld-ft-btm{
1832
- font-size: 14px;
1833
- display: flex;
1834
- justify-content: center;
1835
- align-items: center;
1836
- padding: 15px 0px;
1837
- border-top: 1px solid #DCDDE1;
1838
- }
1839
- .sbi-bld-ft-btm strong{
1840
- padding: 0 5px;
1841
- }
1842
- .sbi-bld-ft-btm a{
1843
- display: inline-block;
1844
- padding: 0 10px;
1845
- font-weight: 500;
1846
- color: #0068A0;
1847
- }
1848
- .sbi-bld-ft-btm a i{
1849
- font-size: 12px;
1850
- margin-left: 5px;
1851
- }
1852
- .sbi-bld-ft-bns{
1853
- display: inline-block;
1854
- margin: 0 10px;
1855
- padding: 5px 10px;
1856
- border-radius: 5px;
1857
- font-size: 14px;
1858
- font-weight: 700;
1859
- text-transform: uppercase;
1860
- color: #663D00;
1861
- background: #FFDF99;
1862
- }
1863
- /*
1864
- Extensions Poup
1865
- */
1866
- .sbi-fb-fs-link{
1867
- position: absolute;
1868
- width: 100%;
1869
- height: 100%;
1870
- left: 0;
1871
- top: 0;
1872
- right: 0;
1873
- bottom: 0;
1874
- z-index: 1;
1875
- }
1876
- .sbi-fb-extensions-popup{
1877
-
1878
- }
1879
- .sbi-fb-extpp-top{
1880
- display: flex;
1881
- justify-content: center;
1882
- align-items: center;
1883
- height: 264px;
1884
- background: #F3F4F5;
1885
- }
1886
- .sbi-fb-extpp-img{
1887
- width: 50%;
1888
- float: left;
1889
- display: flex;
1890
- justify-content: center;
1891
- }
1892
- .sbi-fb-extensions-popup[data-getext-view="featuredpost"] .sbi-fb-extpp-img{
1893
- padding: 50px 0px;
1894
- }
1895
- .sbi-fb-extensions-popup[data-getext-view="singlealbum"] .sbi-fb-extpp-img{
1896
- padding: 65px 0px;
1897
- }
1898
- .sbi-fb-extpp-social-wall .sbi-fb-extpp-top {
1899
- display: flex;
1900
- flex-direction: column;
1901
- align-items: center;
1902
- height: auto;
1903
- padding-top: 29px;
1904
- }
1905
- .sbi-fb-extensions-popup[data-getext-view="socialwall"] .sbi-fb-extpp-head {
1906
- margin: 0 0 12px;
1907
- padding-top: 14px;
1908
- }
1909
- .sbi-fb-extensions-popup[data-getext-view="socialwall"] .sbi-fb-extpp-head h2 {
1910
- font-size: 24px !important;
1911
- line-height: 120% !important;
1912
- }
1913
- .sbi-fb-extpp-info{
1914
- width: 50%;
1915
- float: left;
1916
- display: flex;
1917
- justify-content: center;
1918
- flex-direction: column;
1919
- padding-left: 40px;
1920
- }
1921
- .sbi-fb-extensions-popup[data-getext-view="socialwall"] .sbi-fb-extpp-info {
1922
- width: 40%;
1923
- padding-right: 50px;
1924
- }
1925
-
1926
- .sbi-fb-extensions-popup[data-getext-view="socialwall"] .sbi-fb-extpp-lite-btn {
1927
- margin-top: 20px;
1928
- max-width: 270px;
1929
- box-sizing: border-box;
1930
- padding: 7px 11px;
1931
- }
1932
- .sbi-fb-extensions-popup[data-getext-view="socialwall"] .sbi-extension-bullet-list {
1933
- grid-template-columns: 33% 33% 33%;
1934
- }
1935
- #sbi-builder-app .sbi-fb-extensions-popup[data-getext-view="socialwall"] .sbi-fb-extpp-head{
1936
- margin: 0 0 9px;
1937
- }
1938
- #sbi-builder-app .sbi-fb-extpp-desc {
1939
- color: #475569;
1940
- display: flex;
1941
- justify-content: center;
1942
- align-items: center;
1943
- }
1944
- .sbi-fb-extpp-social-wall .sbi-fb-extpp-top {
1945
- display: flex;
1946
- flex-direction: column;
1947
- align-items: center;
1948
- height: auto;
1949
- padding-top: 29px;
1950
- }
1951
-
1952
- .sbi-fb-extpp-info{
1953
- width: 50%;
1954
- float: left;
1955
- display: flex;
1956
- justify-content: center;
1957
- flex-direction: column;
1958
- padding-left: 40px;
1959
- }
1960
- .sbi-fb-extpp-info .sbi-fb-extpp-head,
1961
- .sbi-fb-extpp-info .sbi-fb-extpp-desc{
1962
- width: 100%;
1963
- }
1964
- #sbi-builder-app .sbi-fb-extpp-head{
1965
- margin: 0 0 12px;
1966
- }
1967
- #sbi-builder-app .sbi-fb-extpp-desc {
1968
- color: #475569;
1969
- display: flex;
1970
- justify-content: left;
1971
- align-items: center;
1972
- width: 105%;
1973
- }
1974
- .sbi-fb-extpp-head span{
1975
- color: var(--cl-orange);
1976
- }
1977
- .sbi-fb-extpp-head span.sb-social-wall{
1978
- color: inherit;
1979
- font-size: 26px;
1980
- line-height: 120% !important;
1981
- display: inline-block;
1982
- }
1983
- .sbi-fb-extpp-desc .sb-social-wall {
1984
- width: 90%;
1985
- }
1986
- .sbi-fb-extpp-head span{
1987
- color: var(--cl-orange);
1988
- }
1989
- .sbi-fb-extpp-lite-btn{
1990
- float: left;
1991
- font-size: 15px;
1992
- font-weight: 500;
1993
- padding: 10px 20px;
1994
- color: #0068A0;
1995
- background: #fff;
1996
- border: 1px solid #DCDDE1;
1997
- margin-bottom: 14px;
1998
- margin-top: 12px;
1999
- align-items: center;
2000
- }
2001
- .sbi-fb-extpp-lite-btn svg{
2002
- fill: currentColor;
2003
- width: 20px;
2004
- float: left;
2005
- margin-right: 10px;
2006
- }
2007
- .sbi-fb-extpp-inc-list{
2008
- border: 1px solid #dcdde1;
2009
- margin-top: 10px;
2010
- margin-bottom: 30px;
2011
- }
2012
- .sbi-fb-extpp-bottom-strg{
2013
- font-size:18px;
2014
- font-weight: 600;
2015
- }
2016
- .sbi-fb-extpp-inc-items{
2017
- display: grid;
2018
- grid-template-columns: 25% 25% 25% 25%;
2019
- }
2020
- .sbi-fb-extpp-inc-item, .sbi-fb-extpp-inc-item-bottom{
2021
- position: relative;
2022
- height: 50px;
2023
- display: flex;
2024
- justify-content: center;
2025
- align-items: center;
2026
- border-right: 1px solid #dcdde1;
2027
- border-bottom: 1px solid #dcdde1;
2028
- font-size: 14px;
2029
- }
2030
- .sbi-fb-extpp-inc-item-bottom{
2031
- border: 0px !important;
2032
- }
2033
- .sbi-fb-extpp-inc-item:last-of-type{
2034
- border-right: 0px;
2035
- }
2036
- .sbi-fb-extpp-inc-item svg, .sbi-fb-extpp-inc-item-bottom svg{
2037
- width: 17px; margin-right: 10px; fill: currentColor; float: left;
2038
- }
2039
- .sbi-fb-extpp-bottom{
2040
- padding: 20px 40px;
2041
- background: #fff;
2042
- }
2043
- .sbi-extension-bullet-list {
2044
- display: grid;
2045
- grid-template-columns: 33% 33% 33%;
2046
- grid-column-gap: 2%;
2047
- margin-top: 12px;
2048
- margin-bottom: 40px;
2049
- }
2050
- .sbi-extension-single-bullet {
2051
- display: flex;
2052
- justify-content: flex-start;
2053
- align-items: center;
2054
- margin: 4px 0;
2055
- }
2056
- #sbi-builder-app .sbi-extension-single-bullet span {
2057
- color: #434960;
2058
- }
2059
-
2060
- .sbi-extension-single-bullet svg {
2061
- margin-right: 12px;
2062
- }
2063
- .sbi-fb-extpp-btns{
2064
- display: grid;
2065
- grid-template-columns: 100%;
2066
- grid-column-gap: 1%;
2067
- }
2068
- .sbi-fb-extpp-btns div{
2069
- height: 38px;
2070
- cursor: pointer;
2071
- position: relative;
2072
- border-radius: 3px;
2073
- font-style: normal;
2074
- font-weight: 600;
2075
- font-size: 14px;
2076
- line-height: 160%;
2077
- display: flex;
2078
- justify-content: center;
2079
- align-items: center;
2080
- box-sizing: border-box;
2081
- }
2082
- .sbi-fb-extpp-get-btn{
2083
- color: #fff;
2084
- background: var(--cl-orange);
2085
- }
2086
- .sbi-fb-extpp-demo-btn{
2087
- border: 2px solid #DCDDE1;
2088
- background: #F3F4F5;
2089
- }
2090
-
2091
- /*
2092
- Feed Type Creation Process : Single Album;
2093
- */
2094
- .sbi-fb-section-wh-insd{
2095
- display: flex;
2096
- }
2097
- .sbi-fb-sglelm-inp-ctn{
2098
- margin-top: 100px;
2099
- }
2100
-
2101
- .sbi-fb-sglelm-inp-ctn input[type="text"]{
2102
- height: 44px;
2103
- }
2104
- .sbi-fb-section-wh.sbi-fb-sglelm-ctn {
2105
- padding: 20px 21px 24px 30px;
2106
- }
2107
- .sbi-fb-section-wh.sbi-fb-sglelm-ctn .sbi-fb-section-wh-insd {
2108
- padding: 0;
2109
- }
2110
- .sbi-fb-sglelm-inp-ctn input[type="text"]::placeholder{
2111
- font-style: normal;
2112
- font-weight: normal;
2113
- font-size: 16px;
2114
- line-height: 160%;
2115
- color: #8C8F9A;
2116
- }
2117
- .sbi-fb-sglelm-error-icon{
2118
- width: 23px;
2119
- height: 23px;
2120
- background: var(--error-red);
2121
- font-family: monospace;
2122
- font-weight: 900;
2123
- color: #fff;
2124
- font-size: 15px;
2125
- position: absolute;
2126
- right: 10px;
2127
- top: 10px;
2128
- z-index: 999999999999999999;
2129
- border-radius: 50px;
2130
- display: flex;
2131
- justify-content: center;
2132
- align-items: center;
2133
- }
2134
- .sbi-fb-sglelm-errormsg{
2135
- color: var(--error-red);
2136
- font-weight: 800;
2137
- }
2138
- .sbi-fb-sglelm-inp-ctn .sbi-fb-wh-inp{
2139
- margin-bottom: 10px;
2140
- }
2141
- .sbi-fb-sglelm-left{
2142
- padding-right: 100px;
2143
- }
2144
- .sbi-fb-sglelm-img-ctn{
2145
- background:#E8E8EB;
2146
- height: 350px;
2147
- display: flex;
2148
- justify-content: center;
2149
- align-items: center;
2150
- text-align: center;
2151
- flex-direction: column;
2152
- padding: 100px 50px;
2153
- border: 1px solid #D0D1D7;
2154
- box-sizing: border-box;
2155
- }
2156
- .sbi-fb-sglelm-img-ctn.sbi-fb-sglelm-img-pf{
2157
- padding: 100px 35px;
2158
- }
2159
- .sbi-fb-sglelm-img-ctn strong{
2160
- font-size: 16px;
2161
- color: #434960;
2162
- margin-bottom: 8px;
2163
- margin-top: 30px;
2164
- }
2165
- .sbi-fb-sglelm-img-ctn span{
2166
- font-size: 14px;
2167
- line-height:1.6em;
2168
- color: #8C8F9A;
2169
- }
2170
- .sbi-fb-sglelm-right{
2171
- width: 445px
2172
- }
2173
- .sbi-fb-sglelm-img-errorctn span{
2174
- padding: 0 20px;
2175
- color: #434960;
2176
- font-size: 20px;
2177
- margin-top: 30px;
2178
- line-height: 1.2em;
2179
- }
2180
- .sbi-fb-sglelm-preview{
2181
- height: 375px;
2182
- background-color: #141B38;
2183
- background-position: center center;
2184
- background-size: cover;
2185
- display: flex;
2186
- justify-content: center;
2187
- align-items: flex-end;
2188
- color: #fff;
2189
- }
2190
- .sbi-fb-sglelm-preview:after{
2191
- content: '';
2192
- position: absolute;
2193
- width: 100%; height: 100%;
2194
- background-image: linear-gradient(to bottom, rgba(0,0,0,0) , rgba(0,0,0,.5));
2195
- }
2196
- .sbi-fb-sglelm-prev-info{
2197
- width: 100%;
2198
- padding: 20px 30px;
2199
- padding-bottom: 40px;
2200
- display: flex;
2201
- justify-content: center;
2202
- align-items: center;
2203
- text-align: center;
2204
- flex-direction: column;
2205
- z-index: 2;
2206
- }
2207
- .sbi-fb-sglelm-prev-info strong{
2208
- font-size: 18px;
2209
- margin-bottom: 5px;
2210
- }
2211
- .sbi-fb-sglelm-prev-info span{
2212
- font-size: 16px;
2213
- line-height: 1.7em;
2214
- }
2215
-
2216
-
2217
- /*
2218
- Feeds List
2219
- */
2220
- #sbi-builder-app .sbi-fb-select,
2221
- #sbi-builder-app .sbi-fb-select:hover,
2222
- #sbi-builder-app .sbi-fb-select:focus{
2223
- border-radius: 0px!important;
2224
- border: 1px solid #D0D1D7!important;
2225
- outline: unset!important;
2226
- float: left;
2227
- min-height: auto;
2228
- padding: 6px 31px 6px 8px;
2229
- background: #fff url("data:image/svg+xml,%3Csvg width='10' height='5' viewBox='0 0 10 5' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.833252 0.333252L4.99992 4.49992L9.16658 0.333252H0.833252Z' fill='%238C8F9A'/%3E%3C/svg%3E%0A") no-repeat right 13px top 55%;
2230
- background-size: 10px 6px;
2231
- }
2232
- .sbi-fd-lst-bulk-ctn > *{
2233
- float: left;
2234
- margin-right: 10px;
2235
- }
2236
- .sbi-fd-lst-bulk-ctn{
2237
- margin-bottom: 8px;
2238
- }
2239
- .sbi-fd-lst-pagination-ctn{
2240
- float: right;
2241
- display: flex;
2242
- align-items: center;
2243
- margin-top: 10px;
2244
- }
2245
- .sbi-fd-lst-pgnt-btn{
2246
- height: 30px;
2247
- padding: 0 8px;
2248
- cursor: pointer;
2249
- border-radius: 3px;
2250
- }
2251
- .sbi-fd-lst-pgnt-info{
2252
- display: inline-block;
2253
- padding: 0 3px;
2254
- }
2255
- .sbi-fd-lst-count{
2256
- margin-right: 10px;
2257
- }
2258
- .sbi-feeds-list table{
2259
- width: 100%;
2260
- text-align: left;
2261
- border-spacing: 0px;
2262
- box-sizing: border-box;
2263
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
2264
- background: #fff;
2265
- }
2266
-
2267
- .sbi-feeds-list table a{
2268
- cursor: pointer;
2269
- }
2270
- .sbi-fd-lst-tbody tr:nth-child(odd){
2271
- background: #F3F4F5;
2272
- }
2273
- .sbi-fd-lst-tbody tr td{
2274
- position: relative;
2275
- vertical-align: top;
2276
- padding: 12px 5px;
2277
- font-size: 16px;
2278
- }
2279
- .sbi-feeds-list table tr td:first-child {
2280
- width: 30px;
2281
- }
2282
- .sbi-fd-lst-thtf{
2283
- background: #fff;
2284
- }
2285
- .sbi-fd-lst-thtf th, .sbi-fd-lst-thtf td{
2286
- padding: 6px 5px;
2287
- }
2288
- .sbi-fd-lst-thtf th{
2289
- border-bottom: 1px solid #DCDDE1;
2290
- }
2291
- .sbi-fd-lst-thtf td{
2292
- border-top: 1px solid #DCDDE1;
2293
- }
2294
- .sbi-fd-lst-chkbx{
2295
- width: 11px;
2296
- height: 11px;
2297
- position: relative;
2298
- border-radius: 2px;
2299
- border: 1px solid #97A6BA;
2300
- background: #fff;
2301
- cursor: pointer;
2302
- margin-left: 10px;
2303
- }
2304
- tbody .sbi-fd-lst-chkbx {
2305
- position: absolute;
2306
- top: 15px;
2307
- left: 5px;
2308
- bottom: 0;
2309
- right: 0;
2310
- }
2311
- .sbi-fd-lst-thtf .sbi-fd-lst-chkbx{
2312
- width: 11px;
2313
- height: 11px;
2314
- border: 1px solid #D8DADD;
2315
- }
2316
- .sbi-fd-lst-chkbx[data-active="true"]{
2317
- background: var(--customizer-blue);
2318
- border-color: var(--customizer-blue)!important;
2319
- }
2320
- .sbi-fd-lst-chkbx[data-active="true"]:before{
2321
- content: '';
2322
- position: absolute;
2323
- width: 6px;
2324
- height: 3px;
2325
- left: 2px;
2326
- top: 2px;
2327
- border-bottom: 2px solid #fff;
2328
- border-left: 2px solid #fff;
2329
- -webkit-transform: rotate(-45deg);
2330
- transform: rotate(-45deg);
2331
- }
2332
-
2333
-
2334
- .sbi-fd-lst-name{
2335
- font-size: 17px;
2336
- font-weight:500;
2337
- color: #0068A0!important;
2338
- }
2339
- .sbi-fd-lst-type{
2340
- display: block;
2341
- text-transform: capitalize;
2342
- }
2343
- .sb-instances-cell {
2344
- margin-top: 4px;
2345
- }
2346
- .sbi-fd-lst-btn{
2347
- width: 21px;
2348
- height: 21px;
2349
- display: inline-flex;
2350
- justify-content: center;
2351
- align-items: center;
2352
- margin: 0 4px;
2353
- cursor: pointer;
2354
- color: #141B38;
2355
- border-radius: 2px;
2356
- border: 1px solid #D8DADD;
2357
- -webkit-transition: all .2s ease-in-out;
2358
- transition: all .2s ease-in-out;
2359
- background: #fff;
2360
- }
2361
- .sbi-fd-lst-btn svg {
2362
- height: 13px;
2363
- }
2364
- .sbi-fd-lst-actions .sbi-fd-lst-btn,
2365
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-btn{
2366
- box-sizing: border-box;
2367
- width: 36px;
2368
- height: 32px;
2369
- background: transparent;
2370
- }
2371
- .sbi-fd-lst-actions .sbi-fd-lst-btn {
2372
- margin: 0 4px 0 0;
2373
- }
2374
- .sbi-fd-lst-actions .sbi-fd-lst-btn:last-child {
2375
- margin: 0;
2376
- }
2377
- .sbi-fd-lst-actions .sbi-fd-lst-btn svg {
2378
- width: 12px;
2379
- height: 16px;
2380
- }
2381
- .sbi-fd-lst-btn-delete{
2382
- color: #D72C2C;
2383
- border-color: #FBD5D5;
2384
- }
2385
- .sbi-fd-lst-btn svg{
2386
- fill: currentColor;
2387
- width: 14px;
2388
- float: left;
2389
- }
2390
- .sbi-fd-lst-actions .sbi-fd-lst-btn:hover svg,
2391
- .sbi-feedtype-section .sbi-fd-lst-btn-delete:hover svg{
2392
- color: #fff;
2393
- }
2394
- .sbi-fd-lst-actions .sbi-fd-lst-btn:hover{
2395
- background: #0096CC;
2396
- border-color: #0096CC;
2397
- }
2398
- .sbi-fd-lst-actions .sbi-fd-lst-btn-delete:hover, .sbi-feedtype-section .sbi-fd-lst-btn-delete:hover{
2399
- background: #D72C2C;
2400
- border-color: #D72C2C;
2401
- }
2402
- .sbi-fd-lst-dimmed .sbi-fd-lst-btn, .sbi-fd-lst-dimmed .sbi-fd-lst-btn:hover{
2403
- background: #F3F4F5!important;
2404
- border-color:#D8DADD!important;
2405
- color: #8C8F9A!important;
2406
- }
2407
- .sbi-fd-lst-dimmed .sbi-fd-lst-btn:hover svg{
2408
- color: #8C8F9A!important;
2409
- }
2410
-
2411
- .sbi-fb-tltp-parent{
2412
- position: relative;
2413
- }
2414
- .sbi-fb-view-instances[data-active="true"]{
2415
- font-weight: 600;
2416
- text-decoration: underline;
2417
- cursor: pointer;
2418
- line-height: 1em;
2419
- }
2420
- .sbi-fb-tltp-elem{
2421
- position: absolute;
2422
- color: #fff;
2423
- background: #434960;
2424
- font-size: 14px;
2425
- padding: 7px 10px;
2426
- border-radius: 3px;
2427
- font-weight:500;
2428
- z-index: 9;
2429
- text-align: center;
2430
- opacity: 0;
2431
- visibility: hidden;
2432
- top: calc(-100% - 30px);
2433
- left: 50%;
2434
- -webkit-transform: translateX(-50%);
2435
- transform: translateX(-50%);
2436
- -webkit-transition: all .2s ease-in-out;
2437
- transition: all .2s ease-in-out;
2438
- }
2439
- .sbi-fb-tltp-elem span{
2440
- position: relative; z-index: 3;
2441
- }
2442
- .sbi-fb-tltp-elem:after{
2443
- content: '';
2444
- position: absolute;
2445
- height: 10px;
2446
- width: 10px;
2447
- bottom: -5px;
2448
- left: calc(50% - 5px);
2449
- background: #434960;
2450
- transform: rotate(-45deg);
2451
- }
2452
- .sbi-fb-tltp-parent:hover .sbi-fb-tltp-elem {
2453
- top: calc(-100% - 20px);
2454
- opacity: 1;
2455
- visibility: visible;
2456
- }
2457
- .sbi-fd-lst-shortcode-cp{
2458
- margin-left: 10px;
2459
- }
2460
- .sbi-fd-lst-act-th{
2461
- width: 190px;
2462
- max-width: 190px;
2463
- }
2464
-
2465
- /*
2466
- Feed Instance Popup
2467
- */
2468
- .sbi-fb-popup-feedinst .sbi-fb-source-top{
2469
- display: flex;
2470
- align-items: center;
2471
- }
2472
- .sbi-fb-popup-feedinst h5{
2473
- margin-bottom: 0px;
2474
- float: left;
2475
- font-size: 27px;
2476
- }
2477
- .sbi-fb-fdinst-type{
2478
- padding: 5px 5px;
2479
- background: #E8E8EB;
2480
- margin-left: 12px;
2481
- float: left;
2482
- }
2483
- .sbi-fb-inst-tbl-ctn{
2484
- padding: 0 23px 63px;
2485
- }
2486
- .sbi-fb-inst-tbl-ctn table{
2487
- width: 100%;
2488
- border-spacing: unset;
2489
- box-sizing: border-box;
2490
- border: 1px solid #DCDDE1;
2491
- text-align: left;
2492
- }
2493
- .sbi-fb-inst-tbl-ctn tfoot,.sbi-fb-inst-tbl-ctn thead{
2494
- background: #F3F4F5
2495
- }
2496
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf th, .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf td{
2497
- font-size: 13px;
2498
- color: #364152;
2499
- padding: 13px 10px;
2500
- }
2501
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-tbody tr:nth-child(odd){
2502
- background: #fff;
2503
- }
2504
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-tbody tr:nth-child(even){
2505
- background: #F3F4F5;
2506
- }
2507
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf tr th,
2508
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf tr td{
2509
- padding: 4px 20px;
2510
- }
2511
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-tbody tr td{
2512
- padding: 11px 20px;
2513
- }
2514
- .sbi-fb-inst-tbl-ctn .sbi-fd-lst-name{
2515
- font-size: 14px;
2516
- }
2517
- .sbi-fb-inst-tbl-shrtc{
2518
- display: flex;
2519
- align-items: center;
2520
- }
2521
-
2522
- .sbi-fd-inst-btn{
2523
- width: 10px;
2524
- height: 10px;
2525
- box-sizing: border-box;
2526
- border-right: 3px solid #8C8F9A;
2527
- border-top: 3px solid #8C8F9A;
2528
- cursor: pointer;
2529
- -webkit-transform: rotate(45deg);
2530
- transform: rotate(45deg);
2531
- }
2532
-
2533
- /*Legacy Feeds */
2534
- .sbi-fb-lgc-top-new{
2535
- color: #141B38;
2536
- background: #fff;
2537
- margin: 10px 0px;
2538
- padding: 15px 20px;
2539
- display: flex;
2540
- justify-content: center;
2541
- align-items: center;
2542
- font-size: 14px;
2543
- font-weight: 600;
2544
- }
2545
- .sbi-fb-lgc-gr{
2546
- font-size: 12px;
2547
- text-transform: uppercase;
2548
- font-weight: 500;
2549
- background: #59AB46;
2550
- color: #fff;
2551
- margin-right: 10px;
2552
- padding: 6px 10px;
2553
- border-radius: 2px;
2554
- line-height: 1em;
2555
- }
2556
- .sbi-fb-lgc-inf-ctn{
2557
- background: #fff;
2558
- padding: 0 20px;
2559
- display: flex;
2560
- align-items: center;
2561
- height: 58px;
2562
- }
2563
- .sbi-fb-lgc-inf-ctn > h4{
2564
- margin-right: 10px!important;
2565
- }
2566
-
2567
- .sbi-fb-lgc-inf-ctn > *{
2568
- float: left;
2569
- display: inline-block;
2570
- position: relative;
2571
- }
2572
- #sbi-builder-app .sbi-fb-lgc-inf-ctn > h4{
2573
- margin-right: 14px;
2574
- margin-bottom: 0;
2575
- }
2576
- #sbi-builder-app .sbi-fb-lgc-btn-stg{
2577
- display: flex;
2578
- margin-left: auto;
2579
- }
2580
- .sbi-fd-legacy-feed-toggle{
2581
- height: 34px;
2582
- display: flex;
2583
- justify-content: center;
2584
- align-items: center;
2585
- background: #E2F5FF;
2586
- color:#0068A0;
2587
- cursor: pointer;
2588
- font-weight: 600;
2589
- font-size: 14px;
2590
- line-height: 160%;
2591
- }
2592
- .sbi-fd-legacy-feed-toggle:hover {
2593
- background: #BFE8FF;
2594
- }
2595
- .sbi-fd-legacy-feed-toggle span{
2596
- display: inline-block;
2597
- position: relative;
2598
- padding-right: 20px;
2599
- margin-left: -20px;
2600
- }
2601
- .sbi-fd-legacy-feed-toggle[data-active="true"] span:after{
2602
- -webkit-transform: rotate(-225deg);
2603
- transform: rotate(-225deg);
2604
- top: 7px;
2605
- }
2606
- .sbi-feeds-list .sbi-legacy-table-wrap table{
2607
- box-shadow: none;
2608
- border-top: 1px solid #DCDDE1;
2609
- }
2610
- .sbi-fb-lgc-ctn{
2611
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
2612
- margin-bottom: 20px;
2613
- }
2614
-
2615
- .sbi-fb-onbrd-infotxt{
2616
- display: flex;
2617
- align-items: center;
2618
- }
2619
- .sbi-fb-onbrd-infotxt svg{
2620
- fill: currentColor;
2621
- width: 16px;
2622
- display: inline-block;
2623
- margin-left: 10px;
2624
- float: left;
2625
- }
2626
-
2627
- .sbi-fb-onbrd-tltp-parent{
2628
- position: relative;
2629
- }
2630
- .sbi-fb-onbrd-tltp-elem{
2631
- position: absolute;
2632
- z-index: 9;
2633
- background: #fff;
2634
- border-radius: 2px;
2635
- color: #434960;
2636
- padding: 16px 52px 4px 24px;
2637
- font-size: 15px;
2638
- left: -30px;
2639
- top: calc(100% + 20px);
2640
- line-height: 1.7em;
2641
- box-shadow: 0px 1px 18px rgba(0,0,0,.2);
2642
- display: none;
2643
- }
2644
-
2645
-
2646
-
2647
- .sbi-fb-onbrd-tltp-elem[data-active="false"]{
2648
- display: none;
2649
- }
2650
- .sbi-fb-onbrd-tltp-elem[data-active="true"],
2651
- .sbi-fb-onbrd-tltp-hover:hover .sbi-fb-onbrd-tltp-elem{
2652
- display: block;
2653
- min-width: 440px;
2654
- padding-bottom: 15px;
2655
- }
2656
- .sbi-fb-onbrd-tltp-elem .sb-pointer {
2657
- position: absolute;
2658
- left: 85px;
2659
- top: -17px;
2660
- }
2661
- .sbi-fb-onbrd-tltp-elem-2 .sb-pointer {
2662
- left: 485px;
2663
-
2664
- }
2665
- .sbi-fb-onbrd-tltp-elem:after{
2666
- background: #fff;
2667
- z-index: 999;
2668
- top: 0px;
2669
- margin-left: -10px;
2670
- width: 40px;
2671
- box-shadow: unset;
2672
- -webkit-transform: rotate(0deg);
2673
- transform: rotate(0deg);
2674
- }
2675
- .sbi-fb-onbrd-tltp-parent.sbi-fb-onbrd-tltp-center-top .sbi-fb-onbrd-tltp-elem{
2676
- left: 50%;
2677
- -webkit-transform:translateX(-50%);
2678
- transform:translateX(-50%);
2679
- bottom: calc(100% + 15px);
2680
- top: unset;
2681
- padding: 8px 11px;
2682
- width: 100%;
2683
- text-align: center;
2684
- box-shadow: 0 5px 9px rgba(0,0,0,.2), 0 -4px 9px rgba(0,0,0,.1);
2685
- }
2686
- .sbi-fb-onbrd-tltp-parent.sbi-fb-onbrd-tltp-center-top .sbi-fb-onbrd-tltp-elem:before {
2687
- content: '';
2688
- position: absolute;
2689
- left: 50%;
2690
- bottom: -10px;
2691
- border-top: 12px solid #fff;
2692
- border-right: 12px solid transparent;
2693
- border-left: 12px solid transparent;
2694
- -webkit-transform: translateX(-50%);
2695
- transform: translateX(-50%);
2696
- z-index: 2;
2697
- }
2698
- .sbi-fb-onbrd-tltp-parent.sbi-fb-onbrd-tltp-center-top .sbi-fb-onbrd-tltp-elem:before,
2699
- .sbi-fb-onbrd-tltp-parent.sbi-fb-onbrd-tltp-center-top .sbi-fb-onbrd-tltp-elem:after{
2700
- left: calc(50% - 10px);
2701
- top: unset;
2702
- }
2703
- .sbi-fb-onbrd-tltp-parent.sbi-fb-onbrd-tltp-center-top .sbi-fb-onbrd-tltp-elem:before{
2704
- bottom: -10px;
2705
- }
2706
- .sbi-fb-onbrd-tltp-parent.sbi-fb-onbrd-tltp-center-top .sbi-fb-onbrd-tltp-elem:after{
2707
- bottom: 0px;
2708
- }
2709
-
2710
-
2711
- #sbi-builder-app .sbi-fb-onbrd-tltp-txt{
2712
- margin: 0px;
2713
- }
2714
- .sbi-fb-onbrd-tltp-txt:last-of-type{
2715
- margin-bottom: 0px;
2716
- }
2717
- .sbi-fb-onbrd-tltp-elem .sbi-fb-popup-cls{
2718
- top: 12px;
2719
- right: 16px;
2720
- }
2721
-
2722
- [data-tltp-pos*="right"] .sbi-fb-onbrd-tltp-elem{
2723
- right: 50px;
2724
- left: unset;
2725
- }
2726
- [data-tltp-pos*="right"] .sbi-fb-onbrd-tltp-elem:before,
2727
- [data-tltp-pos*="right"] .sbi-fb-onbrd-tltp-elem:after{
2728
- left: unset;
2729
- right: 13%
2730
- }
2731
- [data-tltp-pos*="right"] .sbi-fb-onbrd-tltp-elem:after{
2732
- margin-left: unset;
2733
- margin-right: -10px;
2734
- }
2735
- .sbi-fd-lst-dimmed .sbi-fb-onbrd-tltp-elem{
2736
- top: 100%;
2737
- }
2738
- .sbi-fb-cp-clpboard{
2739
- width: 0px;
2740
- height: 0px;
2741
- position: absolute;
2742
- left: -100000px;
2743
- }
2744
- .sbi-fb-copied{
2745
- position: fixed;
2746
- z-index: 9999999;
2747
- background: #010101;
2748
- color: #fff;
2749
- line-height: 1em;
2750
- font-size: 15px;
2751
- font-weight: 500;
2752
- padding: 10px 20px;
2753
- opacity: 0;
2754
- visibility: hidden;
2755
- -webkit-transition: all .2s ease-in-out, opacity .4s ease-in-out;
2756
- transition: all .2s ease-in-out, opacity .4s ease-in-out;
2757
- left: 50%;
2758
- bottom: -20px;
2759
- -webkit-transform: translateX(-50%);
2760
- transform: translateX(-50%);
2761
- }
2762
- .sbi-fb-copied[data-active="true"]{
2763
- opacity: 1;
2764
- visibility: visible;
2765
- bottom: 20px;
2766
- }
2767
-
2768
- /*
2769
- ****
2770
- customizer Screens
2771
- ****
2772
- */
2773
- .sb-customizer-ctn{
2774
- /*margin-top: 52px;*/
2775
- min-height: 100vh;
2776
- }
2777
- .sb-customizer-sidebar{
2778
- position: fixed;
2779
- z-index: 100;
2780
- width: 375px;
2781
- box-shadow: 4px 0px 14px rgba(0, 0, 0, .05), 1px 0px 4px rgba(0, 0, 0, .1);
2782
- background: #fff;
2783
- left: 160px;
2784
- top: 96px;
2785
- overflow: auto;
2786
- bottom: 0px;
2787
- padding-bottom: 50px;
2788
- }
2789
- body.folded .sb-customizer-sidebar{
2790
- left: 36px;
2791
- }
2792
-
2793
- .sb-customizer-sidebar-tab-ctn{
2794
- display: flex;
2795
- justify-content: center;
2796
- align-items: center;
2797
- margin-bottom: 24px;
2798
- }
2799
- .sb-customizer-sidebar-tab{
2800
- width: 50%;
2801
- height: 56px;
2802
- background: #F3F4F5;
2803
- border-bottom: 2px solid #F3F4F5;
2804
- display: flex;
2805
- justify-content: center;
2806
- align-items: center;
2807
- cursor: pointer;
2808
- }
2809
- .sb-customizer-sidebar-tab[data-active="true"]{
2810
- border-color: #0096CC;
2811
- }
2812
- .sb-customizer-sidebar-tab:hover {
2813
- background: #fff!important;
2814
- color: #141B38!important;
2815
- }
2816
- .sb-customizer-sidebar-sec-el{
2817
- height: 52px;
2818
- cursor: pointer;
2819
- display: flex;
2820
- align-items: center;
2821
- color: #141B38;
2822
- border-bottom: 1px solid #DCDDE1;
2823
- -webkit-transition: background .2s ease-in-out;
2824
- transition: background .2s ease-in-out;
2825
- padding: 0 20px;
2826
- }
2827
- .sb-customizer-sidebar-sec-el:hover{
2828
- background: #F3F4F5;
2829
- border-bottom: 1px solid #F3F4F5;
2830
- }
2831
- .sb-customizer-sidebar-sec-el .sb-customizer-chevron svg{
2832
- position: absolute;
2833
- right: 22px;
2834
- top: 22px;
2835
- }
2836
- .sb-customizer-sidebar-sec-el-icon{
2837
- margin-right: 15px;
2838
- width: 30px;
2839
- height: 30px;
2840
- display: flex;
2841
- justify-content: center;
2842
- align-items: center;
2843
- }
2844
- .sb-customizer-sidebar-sec-el-icon svg{
2845
- width: 20px;
2846
- float: left;
2847
- fill: currentColor;
2848
- }
2849
- .sb-customizer-sidebar-sec-elhead{
2850
- height: 50px;
2851
- padding: 0 20px;
2852
- display: flex;
2853
- align-items: center;
2854
- margin-top: 30px;
2855
- font-style: normal;
2856
- font-weight: bold;
2857
- font-size: 12px;
2858
- line-height: 160%;
2859
- letter-spacing: 0.05em;
2860
- text-transform: uppercase;
2861
- color: #8C8F9A;
2862
- }
2863
- .sb-customizer-sidebar-header{
2864
- padding: 20px 20px;
2865
- border-bottom: 1px solid #DCDDE1;
2866
- }
2867
- .sb-customizer-sidebar-header[data-separator="none"]{
2868
- border-bottom: 0px!important;
2869
- padding-bottom: 0px;
2870
- }
2871
-
2872
- .sb-customizer-sidebar-breadcrumb{
2873
- margin-bottom: 15px;
2874
- }
2875
- .sb-customizer-sidebar-sec1 a:hover{
2876
- text-decoration: underline;
2877
- cursor: pointer;
2878
- }
2879
-
2880
- .sb-breadcrumb-pro-label{
2881
- color: #fff !important;
2882
- display: inline-block;
2883
- background: var(--cl-orange);
2884
- padding: 5px 8px;
2885
- font-size: 11px;
2886
- line-height: 1em !important;
2887
- border-radius: 4px;
2888
- -webkit-transform: translateX(5px) translateY(-4px);
2889
- transform: translateX(8px) translateY(-2px);
2890
- }
2891
- .sb-control-elem-label .sb-breadcrumb-pro-label{
2892
- -webkit-transform: translateX(5px) translateY(0px);
2893
- transform: translateX(5px) translateY(0px);
2894
- }
2895
- .sb-customizer-sidebar-breadcrumb a, .sb-customizer-sidebar-breadcrumb span{
2896
- display: inline-block;
2897
- position: relative;
2898
- cursor: pointer;
2899
- color: #434960;
2900
- text-transform: uppercase;
2901
- font-size: 10px;
2902
- line-height: 160%;
2903
- letter-spacing: 0.08em;
2904
- padding: 0 17px;
2905
- height: 20px;
2906
- font-weight: 600;
2907
- }
2908
- .sb-customizer-sidebar-breadcrumb span{
2909
- cursor: text;
2910
- }
2911
- .sb-customizer-sidebar-breadcrumb svg {
2912
- position: absolute;
2913
- left: 4px;
2914
- top: 6px;
2915
-
2916
- }
2917
-
2918
-
2919
- .sb-customizer-sidebar-header strong{
2920
- font-size: 26px;
2921
- color: #141B38;
2922
- display: block;
2923
- margin-bottom: 10px;
2924
- line-height: 1.1em;
2925
- }
2926
- .sb-customizer-sidebar-header span{
2927
- line-height: 1em;
2928
- color: #434960;
2929
- }
2930
- .sb-customizer-sidebar-intro {
2931
- display: block;
2932
- padding: 5px 0 10px 0;
2933
- line-height: 1.7 !important;
2934
- }
2935
- .sb-customizer-ctrl-link{
2936
- text-decoration: underline!important;
2937
- }
2938
- /*
2939
- Controls Style
2940
- */
2941
- .sb-control-label[data-title="true"]{
2942
- font-weight: 600;
2943
- }
2944
-
2945
- .sb-control-elem-ctn{
2946
- display: flex;
2947
- color: #141B38;
2948
- padding: 20px 20px;
2949
- }
2950
- .sb-control-elem-ctn[data-stacked="true"]{
2951
- padding: 5px 20px;
2952
- }
2953
- .sb-control-elem-ctn[data-type="heading"]{
2954
- padding-bottom: 0;
2955
- }
2956
- .sb-control-elem-overlay{
2957
- width: 100%!important;
2958
- height: 100%!important;
2959
- position: absolute!important;
2960
- left: 0!important;
2961
- top: 0!important;
2962
- z-index: 5!important;
2963
- background: rgba(255,255,255,0.4)!important;
2964
- }
2965
- #sbi-builder-app .sb-control-elem-ctn[data-type="heading"] .sb-small-p{
2966
- font-weight: 600;
2967
- }
2968
- #sbi-builder-app .sb-control-elem-ctn[data-type="heading"] .sb-control-elem-description{
2969
- font-style: normal;
2970
- font-weight: normal;
2971
- font-size: 12px;
2972
- line-height: 150%;
2973
- color: #434960;
2974
- }
2975
- #sbi-builder-app .sb-control-elem-ctn[data-type="heading"] .sb-control-elem-label {
2976
- margin-bottom: 0;
2977
- }
2978
- .sb-control-elem-heading svg {
2979
- margin-left: 8px;
2980
- }
2981
- .sb-control-elem-ctn[data-separator="top"],.sb-control-elem-ctn[data-separator="both"]{
2982
- border-top: 1px solid #DCDDE1;
2983
- }
2984
- .sb-control-elem-ctn[data-separator="bottom"],.sb-control-elem-ctn[data-separator="both"]{
2985
- border-bottom: 1px solid #DCDDE1;
2986
- }
2987
- .sb-control-elem-ctn[data-type="separator"]{
2988
- padding: 0;
2989
- }
2990
- .sb-control-elem-separator{
2991
- height: 2px;
2992
- border-top: 1px solid #DCDDE1;
2993
- }
2994
-
2995
- .sb-control-elem-ctn[data-reverse="true"]{
2996
- flex-direction: row-reverse;
2997
- }
2998
- .sb-control-elem-ctn svg{
2999
- fill: currentColor;
3000
- }
3001
- .sb-control-elem-output{
3002
- padding-left: 20px;
3003
- }
3004
- .sb-control-elem-ctn[data-reverse="true"] .sb-control-elem-output{
3005
- padding-right: 20px;
3006
- padding-left: 0px;
3007
- }
3008
- .sb-control-elem-ctn[data-layout="block"]{
3009
- display: block;
3010
- }
3011
- .sb-control-elem-ctn[data-layout="block"] .sb-control-elem-label{
3012
- width: 100%;
3013
- float: left;
3014
- margin-bottom: 8px;
3015
- }
3016
- .sb-control-elem-ctn[data-layout="block"] .sb-control-elem-output{
3017
- padding: 0px;
3018
- }
3019
- .sb-control-elem-ctn[data-layout="block"] input[type="number"] {
3020
- height: 36px;
3021
- background: #FFFFFF;
3022
- border-radius: 1px 0 0 1px !important;
3023
- /*border-right-color: #F3F4F5 !important;*/
3024
- }
3025
- .sb-control-elem-ctn[data-layout="block"] [data-contains-suffix="true"] input[type="number"]{
3026
- border-right-color: #F3F4F5 !important;
3027
- }
3028
- .sb-control-elem-ctn[data-child="true"]{
3029
- padding-left: 70px;
3030
- }
3031
-
3032
- .sb-control-elem-ctn[data-layout="half"]{
3033
- align-items: center;
3034
- justify-content: flex-start;
3035
- }
3036
- .sb-control-elem-ctn[data-layout="half"][data-switcher-top="true"]{
3037
- align-items: flex-start!important;
3038
- }
3039
- .sb-control-elem-ctn[data-layout="half"][data-switcher-top="true"] .sb-control-switcher-ctn{
3040
- margin-top: 5px;
3041
- }
3042
- .sb-control-elem-ctn[data-layout="half"] > div{
3043
- width: 100%;
3044
- }
3045
- .sb-control-elem-ctn[data-type="switcher"][data-reverse="true"][data-layout="half"] > div{
3046
- width: unset;
3047
- }
3048
- .sb-control-elem-ctn[data-layout="half"][data-reverse="true"]{
3049
- justify-content: flex-end;
3050
- }
3051
- [data-type="switcher"][data-reverse="true"][data-layout="half"] .sb-control-elem-output{
3052
- padding-right: 5px;
3053
-
3054
- }
3055
- .sb-control-elem-label-title{
3056
- display: flex;
3057
- align-items: center;
3058
- }
3059
- .sb-control-elem-description{
3060
- color: #434960;
3061
- font-size: 13px;
3062
- float: left;
3063
- margin-top: 4px;
3064
- }
3065
- .sb-control-elem-description a{
3066
- cursor: pointer;
3067
- }
3068
- .sb-control-elem-ctn[data-heading="strong"] .sb-control-elem-heading{
3069
- font-weight: 500!important;
3070
- }
3071
- .sb-control-elem-heading[data-underline="true"]{
3072
- text-decoration: underline;
3073
- }
3074
- .sb-control-elem-icon{
3075
- display: flex;
3076
- justify-content: center;
3077
- align-items: center;
3078
- }
3079
- .sb-control-elem-icon svg{
3080
- width: 16px;
3081
- float: left;
3082
- margin-right: 10px;
3083
- }
3084
- .sb-control-elem-tltp{
3085
- margin-left: 10px;
3086
- position: relative;
3087
- }
3088
- .sb-control-elem-tltp-icon{
3089
- float: left;
3090
- cursor: pointer;
3091
- }
3092
- .sb-control-elem-tltp-icon svg{
3093
- width: 14px;
3094
- float: left;
3095
- }
3096
-
3097
- /*Switcher Control*/
3098
- .sb-control-switcher-ctn{
3099
- cursor: pointer;
3100
- display: flex;
3101
- align-items: center;
3102
- float: left;
3103
- }
3104
- .sb-control-switcher{
3105
- width: 36px;
3106
- height: 18px;
3107
- border-radius: 25px;
3108
- background: #D0D1D7;
3109
- position: relative;
3110
- margin-right: 10px;
3111
- }
3112
-
3113
- .sb-control-switcher:before{
3114
- content: '';
3115
- position: absolute;
3116
- height: 14px;
3117
- width: 14px;
3118
- left: 3px;
3119
- top: 2px;
3120
- border-radius: 25px;
3121
- background: #fff;
3122
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
3123
- -webkit-transition: all .2s ease-in-out;
3124
- transition: all .2s ease-in-out;
3125
- }
3126
- .sb-control-switcher-ctn[data-active="true"] .sb-control-switcher{
3127
- background: var(--customizer-blue);
3128
- }
3129
- .sb-control-switcher-ctn[data-active="true"] .sb-control-switcher:before{
3130
- left: 19px;
3131
- }
3132
-
3133
- /*Toggle SINGLE Control*/
3134
- .sb-control-toggle-elm{
3135
- display: flex;
3136
- align-items: center;
3137
- cursor: pointer;
3138
- height: 46px;
3139
- padding: 0 15px;
3140
- border-right: 1px solid #E8E8EB;
3141
- border-left: 1px solid #E8E8EB;
3142
- border-bottom: 1px solid #E8E8EB;
3143
- }
3144
- .sb-control-toggle-elm:first-child {
3145
- border-top: 1px solid #E8E8EB;
3146
- }
3147
- .sb-control-toggle-elm[data-disabled="true"]{
3148
- background: #F3F4F5;
3149
- }
3150
- .sb-control-toggle-extension-cover{
3151
- width: 100%;
3152
- height: 100%;
3153
- position: absolute;
3154
- left: 0px;
3155
- top: 0;
3156
- cursor: pointer;
3157
- z-index: 4;
3158
-
3159
- }
3160
-
3161
- .sb-control-toggle-deco{
3162
- width: 16px;
3163
- height: 16px;
3164
- margin-right: 13px;
3165
- box-sizing: border-box;
3166
- border-radius: 50%;
3167
- border: 2px solid #d0d1d7;
3168
- }
3169
- .sb-control-toggle-icon{
3170
- display: flex;
3171
- justify-content: center;
3172
- align-items: center;
3173
- margin-right: 13px;
3174
- }
3175
- .sb-control-toggle-icon svg{
3176
- width: 16px;
3177
- float: left;
3178
- fill: #141B38;
3179
- }
3180
- .sb-control-toggle-elm[data-active="true"]{
3181
- background: #F7FDFF;
3182
- border-radius: 2px;
3183
- border: 1px solid var(--customizer-blue);
3184
- }
3185
- .sb-control-toggle-elm[data-active="true"]{
3186
- background: #F7FDFF;
3187
- border-radius: 2px;
3188
- border: 1px solid var(--customizer-blue);
3189
- }
3190
- .sb-control-toggle-elm:hover:not(.sb-control-toggle-elm[data-disabled="true"]) .sb-control-toggle-deco,
3191
- .sb-control-toggle-elm[data-active="true"]:not(.sb-control-toggle-elm[data-disabled="true"]):hover .sb-control-toggle-deco{
3192
- border: 4px solid var(--customizer-blue);
3193
- background: #fff;
3194
- }
3195
- .sb-control-toggle-elm[data-active="true"] .sb-control-toggle-deco{
3196
- border: 6px solid var(--customizer-blue);
3197
- background: #fff;
3198
- }
3199
-
3200
- /*Toggle SET Control*/
3201
- .sb-control-toggle-set-ctn .sb-control-toggle-elm[data-active="true"]{
3202
- border-radius: 0px;
3203
- }
3204
-
3205
- /*Toggle Button Control*/
3206
- .sb-control-togglebutton-ctn{
3207
- display: flex;
3208
- align-items: center;
3209
- justify-content: center;
3210
- padding: 3px;
3211
- background: #f3f4f5;
3212
- border-radius: 4px;
3213
- border: 1px solid #eee;
3214
- height: 40px;
3215
- }
3216
- .sb-control-togglebutton-elm{
3217
- width: 100%;
3218
- display: flex;
3219
- justify-content: center;
3220
- align-items: center;
3221
- height: 33px;
3222
- cursor: pointer;
3223
- font-weight: 600;
3224
- border-radius: 4px;
3225
- text-transform: capitalize;
3226
- line-height: 1em;
3227
- }
3228
- .sb-control-togglebutton-elm[data-active="true"]{
3229
- color: var(--dark-blue);
3230
- background: #fff;
3231
- }
3232
- .sb-control-togglebutton-elm:hover{
3233
- color: var(--dark-blue);
3234
- }
3235
-
3236
- .sb-control-toggle-set-desc-ctn .sb-control-label{
3237
- font-weight: 600;
3238
- }
3239
- .sb-control-toggle-set-desc-ctn .sb-control-toggle-elm{
3240
- height: 82px;
3241
- }
3242
-
3243
- .sb-control-toggle-set-desc-ctn .sb-control-toggle-deco{
3244
- flex-grow: 0;
3245
- flex-shrink: 0;
3246
- }
3247
- .sb-control-moderatiomode-selement .sb-control-elem-label-title{
3248
- margin-bottom: 15px;
3249
- }
3250
- .sb-control-moderatiomode-selement{
3251
- margin-bottom: 20px;
3252
- padding: 20px 0px;
3253
- }
3254
-
3255
- /*Input Control*/
3256
- .sb-control-input-ctn{
3257
- display: flex;
3258
- }
3259
- .sb-control-input,.sb-control-input-textrea{
3260
- height: 40px;
3261
- background: #fff;
3262
- border: 1px solid #D0D1D7!important;
3263
- border-radius: unset!important;
3264
- outline: unset!important;
3265
- padding: 0 10px!important;
3266
- line-height: 1em;
3267
- margin: 0px;
3268
- }
3269
- .sb-control-input-textrea{
3270
- padding: 10px!important;
3271
- height: 120px;
3272
- line-height: 1.5em;
3273
- }
3274
- .sb-control-input:hover{
3275
- color: inherit!important;
3276
- }
3277
- .sb-control-input:focus,.sb-control-input-textrea:focus{
3278
- border: 1px solid #8C8F9A!important;
3279
- border-radius: unset!important;
3280
- box-shadow: unset!important;
3281
- outline: unset!important;
3282
- }
3283
- .sb-control-input[disabled],.sb-control-input-textrea[disabled]{
3284
- background-color: #F3F4F5;
3285
- border: 1px solid #E8E8EB;
3286
- }
3287
- .sb-control-input-info{
3288
- display: flex;
3289
- justify-content: center;
3290
- align-items: center;
3291
- background: #F3F4F5;
3292
- padding: 0 8px;
3293
- font-weight: normal;
3294
- font-size: 14px;
3295
- line-height: 160%;
3296
- color: #434960;
3297
- border: 1px solid #D0D1D7;
3298
- border-left: none;
3299
- border-radius: 0 1px 1px 0 !important;
3300
- }
3301
-
3302
- /*ImageChooser Control*/
3303
- .sb-control-imagechooser-ctn{
3304
- display: flex;
3305
- background: #F3F4F5;
3306
- border: 1px solid #ccc!important;
3307
- height: 40px;
3308
- }
3309
-
3310
- .sb-control-imagechooser-input,
3311
- .sb-control-imagechooser-input:focus{
3312
- outline: none!important;
3313
- border: none!important;
3314
- box-shadow: none!important;
3315
- background: none!important;
3316
- height: 40px;
3317
- }
3318
- .sb-control-imagechooser-btn svg{
3319
- width: 18px;
3320
- margin-right: 5px;
3321
- float: left;
3322
- }
3323
- .sb-control-imagechooser-btn{
3324
- display: flex;
3325
- justify-content: center;
3326
- align-items: center;
3327
- padding: 0 10px;
3328
- cursor: pointer;
3329
- border-left: 1px solid #ccc!important;
3330
- font-weight: 500;
3331
- color: #141B38;
3332
- }
3333
- .sb-control-imagechooser-clear{
3334
- position: absolute;
3335
- right: 4px;
3336
- top: 10px;
3337
- }
3338
- .sb-control-imagechooser-clear-icon{
3339
- position: relative;
3340
- width: 20px;
3341
- height: 20px;
3342
- color: #141B38;
3343
- cursor: pointer;
3344
- opacity: 0.5;
3345
- }
3346
- .sb-control-imagechooser-clear-icon:hover{
3347
- opacity: 1;
3348
- }
3349
- .sb-control-imagechooser-clear-icon:before,
3350
- .sb-control-imagechooser-clear-icon:after{
3351
- content: '';
3352
- position: absolute;
3353
- width: 16px;
3354
- height: 2px;
3355
- background: currentColor;
3356
- left: 2px;
3357
- top: 9px;
3358
- -webkit-transform:rotate(45deg);
3359
- transform:rotate(45deg);
3360
- }
3361
- .sb-control-imagechooser-clear-icon:after{
3362
- -webkit-transform:rotate(-45deg);
3363
- transform:rotate(-45deg);
3364
- }
3365
- .sb-control-imagechooser-padding{
3366
- padding-right: 31px!important;
3367
- }
3368
-
3369
- /*CheckBox Control*/
3370
- .sb-control-checkbox-ctn{
3371
- cursor: pointer;
3372
- display: flex;
3373
- }
3374
- [data-disabled="true"] .sb-control-checkbox{
3375
- z-index: -1!important;
3376
- }
3377
- .sb-control-checkbox{
3378
- width: 18px;
3379
- height: 18px;
3380
- border-radius: 2px;
3381
- float: left;
3382
- border: 2px solid #D0D1D7;
3383
- box-sizing: border-box;
3384
- position: relative;
3385
- margin-right: 10px;
3386
- flex: none;
3387
- }
3388
- .sb-control-checkbox-ctn > div{
3389
- z-index: 3;
3390
- }
3391
- .sb-control-checkbox-ctn:hover .sb-control-checkbox-hover{
3392
- opacity: 1;
3393
- }
3394
- .sb-control-checkbox-hover{
3395
- position: absolute;
3396
- left: -20px;
3397
- top: 0px;
3398
- width: calc(100% + 40px);
3399
- height: 100%;
3400
- background:#F3F4F5;
3401
- z-index: 1;
3402
- opacity: 0;
3403
- }
3404
-
3405
- .sb-control-checkbox{
3406
- z-index: 5!important;
3407
- }
3408
-
3409
-
3410
- .sb-control-checkbox[data-active="true"]{
3411
- background: var(--customizer-blue);
3412
- border-color: var(--customizer-blue);
3413
- color: #fff;
3414
- }
3415
- .sb-control-checkbox[data-active="true"]:before{
3416
- content: '';
3417
- position: absolute;
3418
- width: 8px;
3419
- height: 4px;
3420
- top: 2px;
3421
- left: 2px;
3422
- border-left: 2px solid currentColor;
3423
- border-bottom: 2px solid currentColor;
3424
- -webkit-transform: rotate(-45deg);
3425
- transform: rotate(-45deg);
3426
- }
3427
-
3428
-
3429
- /*Action Button Control*/
3430
- .sb-control-action-button{
3431
- height: 38px;
3432
- cursor: pointer;
3433
- display: flex;
3434
- flex-direction: row;
3435
- justify-content: center;
3436
- align-items: center;
3437
- background: #F3F4F5;
3438
- border-radius: 2px;
3439
- border: 1px solid #DCDDE1;
3440
- position: relative;
3441
- line-height: 1em;
3442
- margin-top: 7px;
3443
- }
3444
-
3445
- .sb-control-action-button div{
3446
- float: left;
3447
- width: 20px;
3448
- height: 20px;
3449
- display: flex;
3450
- justify-content: center;
3451
- align-items: center;
3452
- margin-right: 8px;
3453
- }
3454
- .sb-control-action-button svg{
3455
- width: 17px;
3456
- }
3457
-
3458
- /* WPColorPicker Control Redesign */
3459
- .sb-control-colorpicker-ctn .wp-picker-default{
3460
- display: none!important;
3461
- }
3462
- .sb-control-colorpicker-ctn .minicolors-theme-default.minicolors{
3463
- width: 100%;
3464
- }
3465
-
3466
- .sb-control-colorpicker-ctn .minicolors-theme-default.minicolors-position-right .minicolors-swatch {
3467
- /*
3468
- left: auto;
3469
- right: 6px;
3470
- top: 6px;
3471
- width: 26px;
3472
- height: 26px;
3473
- background: #F9F9FA;
3474
- border: 0px;
3475
- */
3476
-
3477
- left: auto;
3478
- right: 1px;
3479
- top: 1px;
3480
- width: 35px;
3481
- height: 35px;
3482
- background: #F9F9FA;
3483
- border: 0px;
3484
- }
3485
- .minicolors-swatch-color{
3486
- box-shadow: none;
3487
- }
3488
- .sb-control-colorpicker-ctn .minicolors-input,.sb-control-colorpicker-ctn .minicolors-input:focus{
3489
- height: 37px;
3490
- width: 100%!important;
3491
- background: #fff;
3492
- border: 1px solid #D0D1D7!important;
3493
- border-radius: unset!important;
3494
- outline: unset!important;
3495
- box-shadow: unset!important;
3496
- padding: 0 10px!important;
3497
- line-height: 1em;
3498
- margin: 0px;
3499
- }
3500
- .sb-control-colorpicker-ctn .minicolors-input:focus{
3501
- border: 1px solid #0096CC!important;
3502
- }
3503
-
3504
- [data-type="colorpicker"] .minicolors-input{
3505
- font-size: 13px;
3506
- }
3507
- [data-type="colorpicker"] .minicolors-input{
3508
- font-style: normal;
3509
- font-weight: normal;
3510
- font-size: 12px;
3511
- line-height: 150%;
3512
- color: #434960;
3513
- }
3514
-
3515
- .sb-control-colorpicker-btn{
3516
- height: 38px;
3517
- display: flex;
3518
- justify-content: center;
3519
- align-items: center;
3520
- border: 1px solid #DCDDE1;
3521
- border-left: 0px;
3522
- padding: 0 10px;
3523
- background: #F3F4F5;
3524
- font-style: normal;
3525
- font-weight: 600;
3526
- font-size: 12px;
3527
- line-height: 160%;
3528
- color: #141B38;
3529
- cursor: pointer;
3530
- box-sizing: border-box;
3531
- }
3532
- .sb-control-colorpicker-ctn[data-picker-style="reset"] .minicolors-input,
3533
- .sb-control-coloroverride-ctn{
3534
- background: #F3F4F5!important;
3535
- border: 1px solid #DCDDE1!important;
3536
- }
3537
- .sb-control-colorpicker-ctn[data-picker-style="reset"] .minicolors-theme-default.minicolors-position-right .minicolors-swatch,
3538
- .sb-control-coloroverride-ctn .sb-control-coloroverride-swatch{
3539
- top: 8px;
3540
- width: 22px;
3541
- height: 22px;
3542
- }
3543
- .sb-control-coloroverride-ctn .sb-control-coloroverride-swatch{
3544
- position: absolute;
3545
- right: 10px;
3546
- }
3547
- .sb-control-coloroverride-ctn .sb-control-colorpicker-btn{
3548
- margin-left: auto;
3549
- border: 0px!important;
3550
- border-left: 1px solid #DCDDE1!important;
3551
- }
3552
- .sb-control-coloroverride-ctn .sb-control-coloroverride-content{
3553
- width: 100%;
3554
- display: flex;
3555
- align-items: center;
3556
- position: relative;
3557
- }
3558
- .sb-control-coloroverride-ctn .sb-control-coloroverride-txt{
3559
- padding-left: 9px;
3560
- box-sizing: border-box;
3561
- }
3562
-
3563
- /*
3564
- Customizer Preview
3565
- */
3566
- .sb-customizer-preview{
3567
- min-height: 100px;
3568
- width: calc(100% - 375px);
3569
- float: right;
3570
- box-sizing: border-box;
3571
- padding: 0 20px;
3572
- display: flex;
3573
- justify-content: center;
3574
- margin-top: 64px;
3575
- position: relative;
3576
- flex-wrap: wrap;
3577
- }
3578
- .sb-customizer-preview .sbi-admin-notices{
3579
- margin-top: 20px;
3580
- width: 100%;
3581
- }
3582
- .sb-customizer-preview .license-details-modal .sbi-modal-content {
3583
- max-height: none;
3584
- height: auto;
3585
- }
3586
- .sb-customizer-preview .sbi-sb-modal-body .sb-why-renew-list:nth-child(3) {
3587
- margin-bottom: 0;
3588
- }
3589
- .sb-customizer-preview .sbi-sb-modal-body .sb-why-renew-list:last-child {
3590
- margin-bottom: 0;
3591
- }
3592
- .sb-customizer-preview[data-preview-device="desktop"] .sb-preview-ctn{
3593
- width: 100%;
3594
- max-width: 1200px;
3595
- }
3596
- .sb-customizer-preview[data-preview-device="tablet"] .sb-preview-ctn{
3597
- max-width: 100%;
3598
- width: 800px;
3599
- }
3600
- .sb-customizer-preview[data-preview-device="mobile"] .sb-preview-ctn{
3601
- max-width: 100%;
3602
- width: 400px;
3603
- }
3604
- .sbi-preview-ctn {
3605
- padding: 10px;
3606
- }
3607
-
3608
- .sb-preview-top-chooser{
3609
- padding: 18px 0 16px;
3610
- display: flex;
3611
- color: #434960;
3612
- align-items: center;
3613
- }
3614
- .sb-preview-top-chooser strong{
3615
- font-style: normal;
3616
- font-weight: bold;
3617
- font-size: 12px;
3618
- line-height: 160%;
3619
- letter-spacing: 0.05em;
3620
- text-transform: uppercase;
3621
- color: #434960;
3622
- display: inline-flex;
3623
- }
3624
- .sbi-moderate-heading{
3625
- margin-top: 21px;
3626
- }
3627
- .sb-preview-top-chooser strong > svg{
3628
- margin-right: 10px;
3629
- margin-left: 16px;
3630
- fill: currentColor;
3631
- width: 20px;
3632
- }
3633
-
3634
- .sb-preview-chooser{
3635
- height: 36px;
3636
- background: #E8E8EB;
3637
- margin-left: auto;
3638
- padding: 0 2px;
3639
- border-radius: 1px;
3640
- display: flex;
3641
- justify-content: center;
3642
- align-items: center;
3643
- }
3644
- .sb-preview-chooser-btn,.sb-preview-chooser-btn:focus{
3645
- width: 40px;
3646
- height: 32px;
3647
- display: flex;
3648
- justify-content: center;
3649
- align-items: center;
3650
- cursor: pointer;
3651
- float: left;
3652
- border: 0;
3653
- background: unset;
3654
- outline: none;
3655
- }
3656
-
3657
- .sb-preview-chooser-btn svg{
3658
- width: 15px;
3659
- fill: currentColor;
3660
- float: left;
3661
- }
3662
- .sb-preview-chooser-btn.sb-mobilee svg{
3663
- width: 9px;
3664
- fill: currentColor;
3665
- float: left;
3666
- }
3667
- .sb-preview-chooser-btn[data-active="true"],
3668
- .sb-preview-chooser-btn:hover{
3669
- background: #fff!important;
3670
- box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.25);
3671
- border-radius: 1px;
3672
- }
3673
-
3674
- .sb-control-checkboxsection-header{
3675
- width: 100%;
3676
- margin-top: 25px;
3677
- display: flex;
3678
- align-items: center;
3679
- text-transform: uppercase;
3680
- font-size: 13px;
3681
- padding-bottom: 15px;
3682
- position: relative;
3683
- }
3684
- .sb-control-checkboxsection-header:before{
3685
- content: '';
3686
- position: absolute;
3687
- left: -20px;
3688
- width: calc(100% + 40px);
3689
- height: 1px;
3690
- background: #DCDDE1;
3691
- bottom: 0px;
3692
- }
3693
- .sb-control-checkboxsection-name{
3694
- display: flex;
3695
- align-items: center;
3696
- }
3697
- .sb-control-checkboxsection-header svg{
3698
- width: 20px;
3699
- margin-right: 7px;
3700
- fill: #434960;
3701
- float: left;
3702
- }
3703
- .sb-control-checkboxsection-header > strong{
3704
- margin-left: auto;
3705
- }
3706
- [data-type="checkboxsection"] .sb-control-checkbox-ctn{
3707
- align-items: center;
3708
- height: 50px;
3709
- }
3710
- [data-type="checkboxsection"] {
3711
- padding: 0 20px !important;
3712
- }
3713
- [data-type="checkboxsection"] .sb-control-elem-label{
3714
- display: none;
3715
- }
3716
- [data-type="checkboxsection"] strong{
3717
- color: #434960
3718
- }
3719
- [data-type="checkboxsection"] [data-active="true"] strong{
3720
- color: #141B38;
3721
- }
3722
- .sb-control-checkboxsection-btn{
3723
- width: 21px;
3724
- height: 21px;
3725
- position: relative;
3726
- cursor: pointer;
3727
- }
3728
- .sb-control-checkboxsection-btn:before{
3729
- content: '';
3730
- position: absolute;
3731
- width: 7px;
3732
- height: 7px;
3733
- left: 5px;
3734
- top: 7px;
3735
- border-right: 2px solid #8C8F9A;
3736
- border-bottom: 2px solid #8C8F9A;
3737
- -webkit-transform: rotate(-45deg);
3738
- transform: rotate(-45deg);
3739
- }
3740
-
3741
- /*CheckBox List*/
3742
- [data-type="checkboxlist"] .sb-control-checkbox-ctn{
3743
- margin-bottom: 10px!important;
3744
- }
3745
- [data-type="checkboxlist"] .sb-control-checkbox-ctn .sb-control-label{
3746
- font-style: normal;
3747
- font-weight: normal;
3748
- font-size: 14px;
3749
- line-height: 160%;
3750
- }
3751
-
3752
- /*Source Controls*/
3753
- .sb-control-sources-ctn .sbi-fb-srcs-item{
3754
- box-sizing: border-box;
3755
- position: relative;
3756
- cursor: auto;
3757
- display: block;
3758
- height: auto;
3759
- border: 1px solid #E7E7E9;
3760
- min-height: 60px;
3761
- overflow: auto;
3762
- margin-top: 0px;
3763
- }
3764
- .sbi-fb-srcs-item-ins{
3765
- cursor: pointer;
3766
- display: flex;
3767
- height: 62px;
3768
- padding: 0 10px;
3769
- position: relative;
3770
- }
3771
- .sb-control-src-icon{
3772
- width: 20px;
3773
- height: 20px;
3774
- position: absolute;
3775
- right: 10px;
3776
- top: 10px;
3777
- z-index: 2;
3778
- cursor: pointer;
3779
- display: flex;
3780
- justify-content: center;
3781
- align-items: center;
3782
- }
3783
- .sb-control-src-icon svg{
3784
- width: 13px;
3785
- float: left;
3786
- }
3787
- [data-expanded="true"] .sb-control-src-expand svg,.sbi-fb-srcs-info {
3788
- display: none
3789
- }
3790
- .sb-control-src-expand-chevron{
3791
- width: 7px;
3792
- height: 7px;
3793
- border-left: 2px solid currentColor;
3794
- border-top: 2px solid currentColor;
3795
- -webkit-transform: rotate(45deg);
3796
- transform: rotate(45deg);
3797
- display: none;
3798
- }
3799
- [data-expanded="true"] .sb-control-src-expand-chevron,[data-expanded="true"] .sbi-fb-srcs-info {
3800
- display: block;
3801
- }
3802
- .sb-control-src-remove svg{
3803
- width: 11px;
3804
- fill: var(--error-red);
3805
- }
3806
- .sb-control-sources-ctn[data-multifeed="true"] .sb-control-src-expand {
3807
- right: 30px;
3808
- }
3809
- .sb-control-elem-output .sb-control-src-expand:hover {
3810
- background: #F3F4F5;
3811
- border-radius: 3px;
3812
- }
3813
- .sb-control-elem-output .sb-control-src-expand:hover path{
3814
- fill: #111;
3815
- }
3816
-
3817
- .sb-control-sources-ctn .sbi-fb-srcs-item .sbi-fb-srcs-item-name{
3818
- font-size: 17px;
3819
- line-height: 1em;
3820
- margin-bottom: 3px;
3821
- }
3822
-
3823
- .sbi-fb-srcs-info-item{
3824
- display: flex;
3825
- border-top: 1px solid #E7E7E9;
3826
- box-sizing: border-box;
3827
- width: 100%;
3828
- float: left;
3829
- padding: 8px 10px;
3830
- }
3831
- .sbi-fb-srcs-info-item:first-of-type{
3832
- align-items: center;
3833
- }
3834
- .sbi-fb-srcs-info-item strong{
3835
- font-size: 14px;
3836
- width: 50px;
3837
- }
3838
- .sbi-fb-srcs-info-item span{
3839
- font-size: 13px;
3840
- line-height: 1.1em;
3841
- color: #434960;
3842
- font-weight: 400;
3843
- display: inline-block;
3844
- word-break: break-all;
3845
- width: calc(100% - 80px);
3846
- padding: 0 15px;
3847
- box-sizing: border-box;
3848
- }
3849
- .sbi-fb-srcs-info-icon{
3850
- width: 26px;
3851
- height: 26px;
3852
- display: flex;
3853
- justify-content: center;
3854
- align-items: center;
3855
- cursor: pointer;
3856
- margin-left: auto;
3857
- border: 1px solid #D0D1D7;
3858
- border-radius: 2px;
3859
- }
3860
- .sbi-fb-srcs-info-icon svg{
3861
- width: 15px;
3862
- float: left;
3863
- }
3864
- .sb-control-sources-ctn .sb-control-action-button{
3865
- margin-top: 8px;
3866
- margin-bottom: 16px;
3867
- }
3868
- .sb-control-sources-promo-ctn{
3869
- padding: 16px 0;
3870
- }
3871
- .sb-control-sources-promo-ctn:before{
3872
- content: '';
3873
- position: absolute;
3874
- height: 1px;
3875
- width: calc(100% + 40px);
3876
- left: -20px;
3877
- top: 0px;
3878
- background: #E7E7E9;
3879
- }
3880
- .sb-control-sources-promo-top{
3881
- width: 100%;
3882
- box-sizing: border-box;
3883
- padding: 30px 20px;
3884
- border: 1px solid #E8E8EB;
3885
- float: left;
3886
- background: #F9F9FA;
3887
- }
3888
- .sb-control-sources-promo-top > div{
3889
- width: 100%;
3890
- float: left;
3891
- text-align: center;
3892
- display: flex;
3893
- justify-content: center;
3894
- align-items: center;
3895
- box-sizing: border-box;
3896
- line-height: 1.6em;
3897
- }
3898
- .sb-btn-chevron{
3899
- display: inline-block;
3900
- width: 7px;
3901
- height: 7px;
3902
- border-right: 2px solid currentColor;
3903
- border-top: 2px solid currentColor;
3904
- -webkit-transform: rotate(45deg);
3905
- transform: rotate(45deg);
3906
- }
3907
- .sb-control-sources-promo-text{
3908
- font-size: 15px;
3909
- font-weight: 600;
3910
- }
3911
- .sb-control-sources-promo-btn{
3912
- display: flex;
3913
- align-items: center;
3914
- justify-content: center;
3915
- padding: 16px 20px;
3916
- color: #fff !important;
3917
- background: #0068A0;
3918
- font-size: 15px;
3919
- }
3920
- .sb-control-sources-promo-btn div{
3921
- margin-left: 10px;
3922
- }
3923
- .sb-control-sources-promo-icon{
3924
- margin-bottom: 20px;
3925
- }
3926
-
3927
- /*Loading Bar*/
3928
- .sb-loadingbar-ctn{
3929
- position: absolute;
3930
- height: 5px;
3931
- width: 100%;
3932
- left: 0px;
3933
- bottom: 0px;
3934
- background: rgba(227, 79, 14, 0.25);
3935
- z-index: 999999999999999;
3936
- }
3937
- .sb-loadingbar-ctn:before, .sb-loadingbar-ctn:after{
3938
- content: '';
3939
- position: absolute;
3940
- height: 5px;
3941
- background: #E34F0E;
3942
- z-index: 9;
3943
- top: 0;
3944
- }
3945
-
3946
- .sb-loadingbar-ctn:before{
3947
- -webkit-animation: sbi-loading-animation 4s infinite;
3948
- animation: sbi-loading-animation 4s infinite;
3949
- }
3950
- .sb-loadingbar-ctn:after{
3951
- -webkit-animation: sbi-loading-animation 4s 2s infinite;
3952
- animation: sbi-loading-animation 4s 2s infinite;
3953
- }
3954
-
3955
- @-webkit-keyframes sbi-loading-animation {
3956
- from { left: -5%; width: 0%; }
3957
- to { left: 130%; width: 50%;}
3958
- }
3959
- @keyframes sbi-loading-animation {
3960
- from { left: -5%; width: 0%; }
3961
- to { left: 130%; width: 50%;}
3962
- }
3963
-
3964
- /*Notification Element*/
3965
- .sb-notification-ctn{
3966
- position: fixed;
3967
- bottom: -100px;
3968
- left: 200px;
3969
- z-index: 99999;
3970
- background: #fff;
3971
- display: flex;
3972
- justify-content: center;
3973
- align-items: center;
3974
- border-left: 3px solid #fff;
3975
- line-height: 1em;
3976
- padding: 10px 20px;
3977
- padding-left: 0px;
3978
- border-radius: 4px;
3979
- box-shadow: 0px 26.7377px 77.2886px rgba(0, 0, 0, 0.107828), 0px 14.2952px 41.3222px rgba(0, 0, 0, 0.0894161), 0px 8.01379px 23.1649px rgba(0, 0, 0, 0.075), 0px 4.25607px 12.3027px rgba(0, 0, 0, 0.0605839), 0px 1.77104px 5.11942px rgba(0, 0, 0, 0.0421718);
3980
-
3981
- }
3982
- .sb-notification-ctn[data-active="hidden"]{
3983
- -webkit-animation: sbi-notification-hide .5s forwards linear;
3984
- animation: sbi-notification-hide .5s forwards linear;
3985
- }
3986
- .sb-notification-ctn[data-active="shown"]{
3987
- -webkit-animation: sbi-notification-show .5s forwards linear;
3988
- animation: sbi-notification-show .5s forwards linear;
3989
- }
3990
- @-webkit-keyframes sbi-notification-show { 0%{bottom: -100px;} 50%{bottom: 70px;} 70%{bottom: 60px;} 85%{bottom: 65px;} 100%{bottom: 50px;}}
3991
- @keyframes sbi-notification-show { 0%{bottom: -100px;} 50%{bottom: 70px;} 70%{bottom: 60px;} 85%{bottom: 65px;} 100%{bottom: 50px;}}
3992
-
3993
- @-webkit-keyframes sbi-notification-hide {0%{bottom: 50px;}55%{bottom: 65px;}70%{bottom: 60px;}85%{bottom: 70px;}100%{bottom: -100px;}}
3994
- @keyframes sbi-notification-hide {0%{bottom: 50px;}55%{bottom: 65px;}70%{bottom: 60px;}85%{bottom: 70px;}100%{bottom: -100px;}}
3995
-
3996
- .sb-notification-ctn[data-type="success"]{
3997
- border-color: #59AB46;
3998
- }
3999
- .sb-notification-ctn[data-type="error"]{
4000
- border-color: #D72C2C;
4001
- }
4002
- .sb-notification-ctn[data-type="message"]{
4003
- border-color: #141B38;
4004
- }
4005
- .sb-notification-icon{
4006
- width: 25px;
4007
- height: 25px;
4008
- display: flex;
4009
- justify-content: center;
4010
- align-items: center;
4011
- margin-left: 10px;
4012
- margin-right: 15px;
4013
- }
4014
- .sb-notification-icon svg{
4015
- width: 22px;
4016
- height: 22px;
4017
- float: left;
4018
- fill: currentColor;
4019
- }
4020
-
4021
- .sb-notification-ctn[data-type="success"] .sb-notification-icon{
4022
- color: #59AB46;
4023
- }
4024
- .sb-notification-ctn[data-type="error"] .sb-notification-icon{
4025
- color: #D72C2C;
4026
- }
4027
- .sb-notification-ctn[data-type="message"] .sb-notification-icon{
4028
- color: #141B38;
4029
- }
4030
-
4031
- .sb-notification-ctn span{
4032
- font-size: 14px;
4033
- color: #141B38;
4034
- font-weight:500;
4035
- }
4036
-
4037
- /* Onboarding */
4038
- .sb-onboarding-tooltip {
4039
- display: none;
4040
- position: absolute;
4041
- min-height: auto;
4042
- width: 432px;
4043
- max-width: 100%;
4044
- padding: 0;
4045
- border-radius: 2px;
4046
- }
4047
- #sb-onboarding-tooltip-multiple-2,
4048
- #sb-onboarding-tooltip-multiple-3{
4049
- width: 528px;
4050
- }
4051
- #sb-onboarding-tooltip-single-2 {
4052
- width: 402px;
4053
- }
4054
- .sb-onboarding-active .sb-onboarding-highlight .sbi-fb-btn.sbi-fb-btn-new,
4055
- .sb-onboarding-active .sb-positioning-wrap.sb-onboarding-highlight,
4056
- .sb-onboarding-active .sbi-fd-lst-bigctn .sbi-table-wrap.sb-onboarding-highlight,
4057
- .sb-onboarding-active .sbi-fb-lgc-ctn.sb-onboarding-highlight,
4058
- .sb-onboarding-active .sbi-fb-lgc-ctn .sbi-legacy-table-wrap.sb-onboarding-highlight{
4059
- position: relative;
4060
- z-index: 100000;
4061
- }
4062
- .sb-onboarding-active .sbi-fd-legacy-feed-toggle {
4063
- display: none;
4064
- }
4065
- .sbi-legacy-table-wrap.sb-onboarding-highlight {
4066
- clear: both;
4067
- }
4068
- .sb-onboarding-tooltip-1 {
4069
- top: 50px;
4070
- left: 8px;
4071
- }
4072
- #sb-onboarding-tooltip-single-2 {
4073
- bottom: -179px;
4074
- top: auto;
4075
- left: 68%;
4076
- margin-left: -201px;
4077
- }
4078
- #sb-onboarding-tooltip-multiple-2,
4079
- #sb-onboarding-tooltip-multiple-3{
4080
- top: -200px;
4081
- left: 20%;
4082
- }
4083
- #sb-onboarding-tooltip-multiple-3 {
4084
- top: -210px;
4085
- }
4086
- .sb-onboarding-tooltip .sbi-fb-wrapper {
4087
- display: flex;
4088
- justify-content: flex-end;
4089
- }
4090
- .sb-positioning-wrap {
4091
- width: 432px;
4092
- }
4093
- .sb-onboarding-tooltip .sbi-fb-popup-cls {
4094
- position:absolute;
4095
- width: 12px;
4096
- height: 12px;
4097
- top: 12px;
4098
- right: 12px;
4099
- }
4100
- .sb-onboarding-tooltip .sbi-fb-popup-cls svg {
4101
- width: 12px;
4102
- height: 12px;
4103
- }
4104
- .sb-onboarding-tooltip h3 {
4105
- font-size: 16px;
4106
- color: #141B38;
4107
- line-height: 160%;
4108
- font-weight: 600;
4109
- margin: 0;
4110
- }
4111
- .sb-onboarding-step {
4112
- font-style: normal;
4113
- font-weight: normal;
4114
- font-size: 12px;
4115
- line-height: 160%;
4116
- color: #434960;
4117
- margin: 2px 0 20px;
4118
- display: block;
4119
- }
4120
- .sbi-onboarding-next,
4121
- .sbi-onboarding-previous{
4122
- color: #353A41;
4123
- background: #F3F4F5;
4124
- border: 1px solid #DCDDE1;
4125
- margin-left: 10px;
4126
- }
4127
- .sb-onboarding-tooltip .sbi-fb-hd-btn {
4128
- margin-right: 0;
4129
- }
4130
- .sb-onboarding-tooltip .sbi-fb-hd-btn i {
4131
- margin: 0;
4132
- }
4133
- .sbi-onboarding-finish{
4134
- margin-left: 10px;
4135
- padding: 0 32px;
4136
- }
4137
- .sb-onboarding-tooltip .sbi-fb-hd-btn[data-active="false"] {
4138
- background-color: #e8e8eb;
4139
- color: #8c8f99;
4140
- }
4141
- .sb-onboarding-tooltip .sbi-fb-hd-btn[data-active="false"]:hover {
4142
- cursor: default;
4143
- }
4144
- .sb-step-counter-wrap span {
4145
- font-style: normal;
4146
- font-weight: bold;
4147
- font-size: 12px;
4148
- line-height: 160%;
4149
- letter-spacing: 0.05em;
4150
- text-transform: uppercase;
4151
- color: #141B38;
4152
- }
4153
- .sb-onboarding-tooltip .sb-pointer {
4154
- position: absolute;
4155
- left: 50px;
4156
- top: -14px;
4157
- }
4158
- .sb-onboarding-tooltip .sb-pointer.sb-bottom-pointer {
4159
- top: auto;;
4160
- bottom: -14px;
4161
- }
4162
- #sb-onboarding-tooltip-single-2 .sb-pointer {
4163
- left: 193px;
4164
- }
4165
- #sb-onboarding-tooltip-multiple-2:before,
4166
- #sb-onboarding-tooltip-multiple-3:before{
4167
- bottom: -8px;
4168
- }
4169
- .sb-onboarding-top-row {
4170
- padding: 20px 44px 0 24px;
4171
- }
4172
- .sb-onboarding-bottom-row {
4173
- display: flex;
4174
- flex-direction: row;
4175
- justify-content: space-between;
4176
- align-items: center;
4177
- padding: 8px 16px 12px 24px;
4178
- }
4179
-
4180
-
4181
- /*Vue Color Picker*/
4182
- .sb-control-colorpicker-ctn .vc-sketch{
4183
- box-shadow: none!important;
4184
- }
4185
- .sb-control-colorpicker-popup{
4186
- box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
4187
- position: absolute;
4188
- z-index: 99;
4189
- top: 100%;
4190
- background: #fff;
4191
- right: 0px;
4192
- }
4193
- .sb-control-colorpicker-popup .sb-colorpicker-reset-btn{
4194
- width: calc(100% - 20px);
4195
- margin-left: 10px;
4196
- margin-bottom: 15px;
4197
- }
4198
- .sb-control-colorpicker-swatch{
4199
- width: 38px;
4200
- height: 38px;
4201
- position: absolute;
4202
- right: 1px;
4203
- top: 1px;
4204
- background: #f7f7f7;
4205
- }
4206
- .sb-control-colorpicker-ctn .sb-control-input{
4207
- width: 100%;
4208
- }
4209
-
4210
- @media (min-width: 768px) and (max-width: 1023px) {
4211
-
4212
- .sbi-csz-header-insider .sb-button-standard {
4213
- padding: 10px 14px 10px 30px;
4214
- }
4215
- }
4216
- @media (min-width: 1024px) and (max-width: 1200px) {
4217
- .sbi-fb-wlcm-inf-3 {
4218
- padding-left: 120px;
4219
- }
4220
- }
4221
- @media (max-width: 767px) {
4222
- .sbi-fd-lst-thtf th:nth-child(3),
4223
- .sbi-fd-lst-thtf th:nth-child(4),
4224
- .sbi-fd-lst-tbody tr td:nth-child(3),
4225
- .sbi-fd-lst-tbody tr td:nth-child(4),
4226
- .sbi-fd-lst-thtf tr td:nth-child(3),
4227
- .sbi-fd-lst-thtf tr td:nth-child(4) {
4228
- display: none;
4229
- }
4230
- .sbi-fd-lst-thtf th:last-child,
4231
- .sbi-fd-lst-thtf tr td:last-child {
4232
- padding-right: 15px;
4233
- text-align: right;
4234
- }
4235
- .sbi-fd-lst-tbody tr td.sbi-fd-lst-actions .sb-flex-center{
4236
- justify-content: flex-end;
4237
- padding-right: 8px;
4238
- }
4239
- .sbi-fb-full-wrapper {
4240
- padding: 70px 20px 0 20px;
4241
- }
4242
- .sbi-fb-header {
4243
- padding: 0px 20px;
4244
- }
4245
- .sbi-bld-ft-content {
4246
- flex-wrap: wrap;
4247
- }
4248
- #sb-footer-banner .sbi-bld-ft-img {
4249
- width: 100%;
4250
- height: 140px;
4251
- }
4252
- #sb-footer-banner .sbi-bld-ft-img img {
4253
- height: 100%;
4254
- width: auto;
4255
- }
4256
- #sb-footer-banner .sbi-bld-ft-txt {
4257
- justify-content: center;
4258
- align-items: center;
4259
- width: 100%;
4260
- margin-right: 3%;
4261
- padding: 20px;
4262
- }
4263
- .sbi-bld-ft-action {
4264
- width: 100%;
4265
- padding: 0 20px 20px;
4266
- }
4267
- .sbi-bld-footer > div {
4268
- margin-bottom: 60px;
4269
- }
4270
-
4271
- /* single feed page */
4272
- .sbi-csz-header-insider {
4273
- flex-wrap: wrap;
4274
- height: auto;
4275
- width: 100%;
4276
- }
4277
- .sbi-fb-header.sbi-csz-header {
4278
- height: 110px;
4279
- }
4280
- .sbi-csz-header.sbi-fb-header {
4281
- padding-bottom: 6px;
4282
- }
4283
- .sbi-csz-header .sbi-csz-hd-actions {
4284
- margin-top: 10px;
4285
- }
4286
- .sb-customizer-preview {
4287
- display: none;
4288
- }
4289
- .sb-customizer-ctn .sb-customizer-sidebar {
4290
- position: initial;
4291
- margin-top: 110px;
4292
- width: 100%;
4293
- }
4294
- .sb-notification-ctn {
4295
- left: 20px;
4296
- }
4297
- .sbi-fb-header .sb-button-standard{
4298
- padding: 10px 10px 10px 31px;
4299
- }
4300
- .sbi-fb-embed-ctn.sb-fs-boss.sbi-fb-center-boss .sbi-fb-popup-inside {
4301
- top: 35px;
4302
- }
4303
- .sbi-fb-embed-btns-ctn {
4304
- grid-template-columns: 100%;
4305
- }
4306
- .sbi-fb-embed-btns-ctn .sbi-fb-embed-btn {
4307
- margin-bottom: 10px;
4308
- }
4309
- .sbi-fb-embed-ctn.sb-fs-boss.sbi-fb-center-boss .sbi-fb-popup-inside .sbi-fb-embed-step-1-top {
4310
- margin-bottom: 10px;
4311
- }
4312
- .sbi-fb-embed-ctn.sb-fs-boss.sbi-fb-center-boss .sbi-fb-popup-inside .sbi-fb-embed-input-ctn {
4313
- flex-wrap: wrap;
4314
- }
4315
- .sbi-fb-embed-input-ctn input, .sbi-fb-embed-input-ctn input[type="text"] {
4316
- width: 100%;
4317
- border-right: 1px solid #D0D1D7!important;
4318
- }
4319
- .sbi-fb-embed-input-ctn .sbi-fb-hd-btn {
4320
- width: 32%;
4321
- max-width: 120px;
4322
- margin-top: 10px !important;
4323
- padding: 8px;
4324
- }
4325
- .sb-fs-boss.sbi-fb-center-boss {
4326
- z-index: 100001 !important;
4327
- }
4328
- #sb-footer-banner .sbi-bld-ft-txt {
4329
- flex-wrap: wrap;
4330
- }
4331
- #sbi-builder-app #sb-footer-banner h3,
4332
- #sbi-builder-app #sb-footer-banner .sb-small-p {
4333
- width: 100%;
4334
- }
4335
- #sbi-builder-app #sb-footer-banner h3 {
4336
- margin-bottom: 10px;
4337
- }
4338
- .sbi-fb-srcslist-ctn {
4339
- grid-template-columns: 100%
4340
- }
4341
- .sbi-fb-mr-fd-img {
4342
- width: 100%;
4343
- margin-right: 0;
4344
- }
4345
- .sbi-fb-mr-fd-img svg {
4346
- max-width: 100%;
4347
- }
4348
- .sbi-fd-lst-tbody tr td:nth-child(2) {
4349
- width: 50%;
4350
- }
4351
-
4352
- .sbi-fb-wlcm-inf-1,
4353
- .sbi-fb-wlcm-inf-2,
4354
- .sbi-fb-wlcm-inf-3 {
4355
- padding-left: 0;
4356
- }
4357
-
4358
- .sbi-fb-wlcm-inf-3 .sbi-fb-inf-img,
4359
- .sbi-fb-wlcm-inf-2 .sbi-fb-inf-img,
4360
- .sbi-fb-wlcm-inf-1 .sbi-fb-inf-svg {
4361
- display: none;
4362
- }
4363
- .sbi-fb-wlcm-inf-3 .sbi-fb-inf-cnt {
4364
- justify-content: flex-start;
4365
- }
4366
- .sbi-fb-wlcm-inf-1 .sbi-fb-inf-cnt {
4367
- width: calc(100% - 53px);
4368
- }
4369
- .sbi-fb-wlcm-inf-2 .sbi-fb-inf-cnt,
4370
- .sbi-fb-wlcm-inf-3 .sbi-fb-inf-cnt {
4371
- width: 100%;
4372
- }
4373
-
4374
- .sbi-fb-wlcm-inf-1 .sbi-fb-inf-cnt .sbi-fb-inf-txt{
4375
- width: 80%;
4376
- }
4377
-
4378
- .sbi-fb-wlcm-inf-2 .sbi-fb-inf-cnt {
4379
- margin-bottom: 24px;
4380
- }
4381
-
4382
- }
4383
-
4384
- @media (min-width: 768px) and (max-width: 1023px) {
4385
- .sbi-fb-wlcm-inf-3 {
4386
- padding-left: 7px;
4387
- }
4388
- .sbi-fb-wlcm-inf-2 {
4389
- padding-left: 52px;
4390
- }
4391
- .sbi-fb-wlcm-inf-1 {
4392
- padding-left: 85px;
4393
- }
4394
- .sbi-fb-wlcm-inf-1 .sbi-fb-inf-svg {
4395
- display: none;
4396
- }
4397
- }
4398
-
4399
- /*
4400
- Multiple Sources Sections
4401
- */
4402
-
4403
- #sbi-multiple-sources-ctn .sbi-fb-slctsrc-content{
4404
- padding: 25px 30px;
4405
- border-bottom: 1px solid #E8E9EA;
4406
- }
4407
- .sbi-feedtype-section{
4408
- padding: 30px;
4409
- border-bottom: 1px solid #E8E9EA;
4410
- }
4411
- .sbi-feedtype-sec-icon-heading{
4412
- display: flex;
4413
- align-self: center;
4414
- }
4415
- .sbi-feedtype-icon-wrap svg{
4416
- width: 16px!important;
4417
- height: 16px!important;
4418
- float: left;
4419
- fill: #0096CC;
4420
- margin-right: 6px;
4421
- }
4422
-
4423
- .sbi-feedtype-sec-icon-heading span{
4424
- color: #141B38;
4425
- font-weight:600;
4426
- font-size: 18px;
4427
- }
4428
- .sbi-feedtype-sec-icon-heading a{
4429
- font-size: 12px;
4430
- display: inline-block;
4431
- margin-top: 2px;
4432
- margin-left: 6px;
4433
- }
4434
- .sbi-feedtype-sec-desc{
4435
- font-size: 12px;
4436
- }
4437
-
4438
- #sbi-multiple-sources-ctn .sbi-fb-hd-btn svg{
4439
- fill: #141B38;
4440
- }
4441
- .sbi-addsource-type-btn{
4442
- display: flex;
4443
- justify-content: center;
4444
- align-self: center;
4445
- padding: 12px 20px;
4446
- color: #8C8F9A;
4447
- cursor: pointer;
4448
- font-size: 14px;
4449
- font-weight: 600;
4450
- }
4451
- .sbi-addsource-type-btn svg{
4452
- margin-right: 12px;
4453
- margin-top: 2px;
4454
- fill: #8C8F9A;
4455
- }
4456
- .sbi-addsource-type-btn:hover,
4457
- .sbi-addsource-type-btn:hover svg{
4458
- color: #434960;
4459
- fill: #434960;
4460
- }
4461
-
4462
- .sbi-feedtype-section .sbi-fd-lst-btn-delete{
4463
- height: 32px;
4464
- width: 36px;
4465
- position: absolute;
4466
- right: 20px;
4467
- top: 20px;
4468
- z-index: 2;
4469
- }
4470
- .sbi-feedtype-icon-wrap {
4471
- position: absolute;
4472
- top: 0;
4473
- left: 0;
4474
- }
4475
- .sbi-feedtype-sec-wrap {
4476
- margin-left: 28px;
4477
- }
4478
- .sbi-feedtype-section .sbi-fd-lst-btn-delete{
4479
- border-color: #D8DADD;
4480
- }
4481
- .sbi-fb-type-el[data-checked="true"]{
4482
- border: 1px solid #D8D8D8
4483
- }
4484
-
4485
- .sbi-fb-type-el[data-checked="true"]:before{
4486
- content: ''!important;
4487
- position: absolute!important;
4488
- height: 100%!important;
4489
- width: 100%!important;
4490
- left: 0!important;
4491
- top: 0!important;
4492
- background: #f1f1f1!important;
4493
- opacity: .35!important;
4494
- cursor: default!important;
4495
- }
4496
- .sbi-fb-type-el[data-checked="true"]:after{
4497
- display: none!important;
4498
- }
4499
- .sbi-fb-type-el[data-checked="true"] .sbi-fb-type-el-info *{
4500
- color: #8C8F9A!important;
4501
- }
4502
- .sbi-fb-type-el-info .sb-control-elem-tltp,
4503
- .sbi-fb-type-el-info .sb-control-elem-tltp-icon{
4504
- display: inline-block;
4505
- color: inherit;
4506
- fill: currentColor;
4507
- margin: 0px;
4508
- }
4509
- .sbi-fb-feedtypes-pp-ctn .sbi-fb-type-el-info{
4510
- padding: 0 45px 20px!important;
4511
- }
4512
-
4513
- .sbi-fb-feedtypes-pp-ctn .sbi-fb-types-list{
4514
- grid-template-columns: 24% 24% 24% 24%;
4515
- }
4516
- #sbi-builder-app .sbi-fb-feedtypes-pp-ctn .sbi-fb-types{
4517
- padding: 23px 30px 10px!important;;
4518
- padding-bottom: 0px!important;
4519
- }
4520
- .sbi-fb-feedtypes-popup .sb-button-no-border {
4521
- position: absolute;
4522
- z-index: 99;
4523
- top: 20px;
4524
- left: 33px;
4525
- font-weight: bold;
4526
- font-size: 12px;
4527
- line-height: 160%;
4528
-
4529
- letter-spacing: 0.05em;
4530
- text-transform: uppercase;
4531
- cursor: pointer;
4532
- }
4533
- .sbi-fb-feedtypes-popup .sb-button-no-border svg {
4534
- margin-right: 9px;
4535
- }
4536
- .sbi-fb-addsourtype-ctn{
4537
- margin-bottom: 30px;
4538
- padding: 0px 30px!important;
4539
- }
4540
- .sbi-fb-addsourtype-ctn .sbi-fb-source-btn{
4541
- margin-top: 0px;
4542
- }
4543
- .sbi-fb-feedtypes-pp-ctn h4{
4544
- margin-bottom: 20px;
4545
- }
4546
- .sbi-fb-sourcelist-pp-ctn .sbi-fb-source-top{
4547
- padding: 22px 19px 0px;
4548
- }
4549
-
4550
- .sbi-fb-sourcelist-pp-ctn .sbi-fb-sourcelist-pp{
4551
- float: left;
4552
- width: 100%;
4553
- box-sizing: border-box;
4554
- padding: 0 20px;
4555
- }
4556
- .sbi-fb-sourcelist-pp-ctn .sbi-fb-addsourtype-ctn{
4557
- padding: 0px 20px!important;
4558
- }
4559
-
4560
- .sbi-fb-sourcelist-pp-ctn .sbi-fb-srcs-desc{
4561
- margin-bottom: 20px;
4562
- }
4563
- .sbi-fb-sourcelist-pp-ctn .sbi-fb-source-pp-customizer .sbi-fb-srcslist-ctn{
4564
- grid-template-columns: 49% 49%;
4565
- min-height: 80px;
4566
- overflow: auto;
4567
- }
4568
-
4569
- .sbi-selected-sources-ctn .sbi-fb-hd-btn{
4570
- display: inline-flex;
4571
- margin-bottom: 7px;
4572
- float: left;
4573
- }
4574
- .sbi-selected-source-item{
4575
- width: auto;
4576
- height: 38px;
4577
- border: 1px solid #D0D1D7;
4578
- border-radius: 2px;
4579
- display: inline-flex;
4580
- align-items: center;
4581
- margin-right: 10px;
4582
- margin-bottom: 7px;
4583
- box-sizing: border-box;
4584
- float: left;
4585
- }
4586
- .sbi-selected-source-item-avatar,
4587
- .sbi-selected-source-item-avatar img{
4588
- width: 36px;
4589
- height: 36px;
4590
- }
4591
- .sbi-selected-source-item-avatar {
4592
- border-right: 1px solid #F3F4F5;
4593
- }
4594
-
4595
- .sbi-selected-source-item span{
4596
- font-weight:600;
4597
- margin: 0px 10px;
4598
- font-size: 13px;
4599
- }
4600
- .sbi-selected-source-item-icon{
4601
- margin-left: auto;
4602
- width: 36px;
4603
- height: 36px;
4604
- display: flex;
4605
- justify-content: center;
4606
- align-items: center;
4607
- cursor: pointer;
4608
- }
4609
- .sbi-selected-source-item-icon svg{
4610
- fill: #D72C2C;
4611
- width: 14px;
4612
- height: 14px;
4613
- float: left;
4614
- }
4615
-
4616
- #sbi-multiple-sources-ctn .sbi-feedtype-sec-desc{
4617
- margin: 4px 0 16px;
4618
- }
4619
-
4620
- .sbi-hashtag-item{
4621
- display: inline-flex;
4622
- font-weight: 400;
4623
- height: 26px;
4624
- font-size: 12px;
4625
- align-items: center;
4626
- padding: 0px 6px 1px 10px;
4627
- border-radius: 50px;
4628
- background: #f3f1f1;
4629
- margin-right: 10px;
4630
- margin-bottom: 10px;
4631
- }
4632
- .sbi-hashtag-item-delete{
4633
- width: 16px;
4634
- height: 16px;
4635
- background: #8C8F9A;
4636
- color: #fff;
4637
- margin-left: 5px;
4638
- border-radius:50px;
4639
- cursor: pointer;
4640
- position: relative;
4641
- }
4642
-
4643
- .sbi-hashtag-item-delete:before,
4644
- .sbi-hashtag-item-delete:after{
4645
- content: '';
4646
- position: absolute;
4647
- height: 2px;
4648
- width: 8px;
4649
- background: currentColor;
4650
- left: 4px;
4651
- top: 7px;
4652
- -webkit-transform: rotate(45deg);
4653
- transform: rotate(45deg);
4654
- }
4655
- .sbi-hashtag-item-delete:after{
4656
- -webkit-transform: rotate(-45deg);
4657
- transform: rotate(-45deg);
4658
- }
4659
- .sbi-hashtag-fetchby-chbx{
4660
- display: flex;
4661
- margin-bottom: 15px;
4662
- margin-top: 10px;
4663
- }
4664
- .sbi-hashtag-fetchby-chbx .sbi-fb-stp-src-type{
4665
- margin-left: 0px!important;
4666
- margin-right: 20px!important;
4667
- }
4668
- /*
4669
- Custom View Control With Image & info
4670
- */
4671
- .sb-control-imginfo-elem{
4672
- background: #F9F9FA;
4673
- border: 1px solid #E8E8EB;
4674
- padding: 20px 30px;
4675
- }
4676
- .sb-control-imginfo-icon svg{
4677
- fill: none!important;
4678
- }
4679
- .sb-control-imginfo-icon{
4680
- display: flex;
4681
- justify-content: center;
4682
- align-self: center;
4683
- }
4684
- .sb-control-imginfo-text{
4685
- display: flex;
4686
- flex-direction: column;
4687
- padding-top: 20px;
4688
- }
4689
- .sb-control-imginfo-text [data-textalign="center"]{
4690
- justify-content: center;
4691
- }
4692
-
4693
- .sb-control-imginfo-text strong{
4694
- font-size: 18px;
4695
- margin-bottom: 20px;
4696
- line-height: 1.3;
4697
- }
4698
- .sb-control-shoppbale-enbaled-ctn .sb-control-imginfo-text strong{
4699
- font-size: 14px;
4700
- text-align: center;
4701
- line-height: 1.4em;
4702
- }
4703
- .sb-control-imginfo-text span{
4704
- color: #434960;
4705
- font-size: 14px;
4706
- }
4707
-
4708
- .sb-shoppable-edit-btn{
4709
- position: absolute;
4710
- right: 10px;
4711
- top: 10px;
4712
- cursor: pointer;
4713
- z-index: 9;
4714
- padding: 7px 13px 8px 35px;
4715
- border: 2px solid rgba(255,255,255,.1);
4716
- }
4717
- .sb-shoppable-edit-btn-link svg{
4718
- width: 16px;
4719
- height: 10px;
4720
- top: 10px;
4721
- fill: currentColor;
4722
- }
4723
-
4724
- .sb-control-selectedpost-info{
4725
- display: flex;
4726
- align-items: center;
4727
- box-sizing: border-box;
4728
- padding: 10px;
4729
- border: 1px solid #D0D1D7;
4730
- margin-bottom: 30px;
4731
- margin-top: 10px;
4732
- }
4733
- .sb-control-selectedpost-info img{
4734
- width: 77px;
4735
- height: 77px;
4736
- }
4737
-
4738
- .sb-control-selectedpost-info span{
4739
- padding: 0 15px;
4740
- color: #141B38;
4741
- font-size: 13px;
4742
- line-height: 1.6em;
4743
- }
4744
- .sb-control-selectedpost-input span{
4745
- color: #434960;
4746
- font-size: 13px;
4747
- margin-bottom: 5px;
4748
- }
4749
-
4750
- .sb-control-selectedpost-btns{
4751
- display: grid;
4752
- grid-template-columns: 48% 48%;
4753
- grid-column-gap: 4%;
4754
- margin-top: 10px;
4755
- }
4756
- .sb-control-selectedpost-btns button{
4757
- cursor: pointer;
4758
- font-weight: 600;
4759
- display: flex;
4760
- justify-content: center;
4761
- align-items: center;
4762
- padding: 9px;
4763
- }
4764
- .sb-control-selectedpost-btns button svg{
4765
- margin-right: 10px;
4766
- }
4767
-
4768
- /*
4769
- Feed Type Customizer
4770
- */
4771
- .sb-control-feedtype-item{
4772
- margin-bottom: 30px;
4773
- padding-bottom: 20px;
4774
- }
4775
-
4776
- .sb-control-feedtype-item:after{
4777
- content: '';
4778
- position: absolute;
4779
- height: 1px;
4780
- width: calc(100% + 40px);
4781
- left: -20px;
4782
- background: #DCDDE1;
4783
- bottom: 0px;
4784
- }
4785
- .sb-control-feedtype-item:last-of-type:after{
4786
- display: none;
4787
- }
4788
-
4789
- .sb-control-feedtype-list{
4790
- margin-top: 10px;
4791
- }
4792
- .sb-control-feedtype-list-item{
4793
- float: left;
4794
- height: 30px;
4795
- display: flex;
4796
- justify-content: center;
4797
- align-items: center;
4798
- background: #F3F4F5;
4799
- border-radius: 50px;
4800
- padding: 0 14px;
4801
- margin-right: 10px;
4802
- margin-bottom: 10px;
4803
- }
4804
-
4805
- .sb-control-feedtype-list-item-icon{
4806
- display: flex;
4807
- justify-content: center;
4808
- align-items: center;
4809
- }
4810
- .sb-control-feedtype-list-item svg{
4811
- width: 12px;
4812
- margin-right: 4px;
4813
- fill: #0096CC;
4814
- }
4815
- .sbi-fb-extppcustomizer-btns{
4816
- display: grid;
4817
- grid-template-columns: 49% 49%;
4818
- grid-column-gap: 1%;
4819
- }
4820
- .sbi-fb-feedtypescustomizer-pp-ctn .sbi-fb-feedtypes-popup{
4821
- padding: 22px 20px;
4822
- }
4823
- .sbi-fb-feedtypescustomizer-pp-ctn .sbi-fb-source-top{
4824
- padding: 0px;
4825
- padding-bottom: 22px;
4826
- }
4827
- .sbi-fb-feedtypescustomizer-pp-ctn .sbi-fb-feedtypescustomizer-content{
4828
- background: #F9F9FA;
4829
- border: 1px solid #E8E8EB;
4830
- margin-bottom: 20px;
4831
- border-radius: 4px;
4832
- }
4833
- .sbi-fb-feedtypescustomizer-pp-ctn .sbi-feedtype-section{
4834
- box-shadow: unset;
4835
- border-bottom: 1px solid #E8E8EB;
4836
- }
4837
- .sbi-fb-feedtypescustomizer-pp-ctn .sbi-feedtype-section:last-of-type{
4838
- border-bottom: 0px;
4839
- }
4840
- .sbi-fb-feedtypescustomizer-pp-ctn .sbi-feedtype-sec-desc{
4841
- margin-bottom: 20px;
4842
- }
4843
- .sbi-fb-feedtypescustomizer-pp-ctn .sbi-hashtag-fetchby .sbi-feedtype-sec-desc{
4844
- margin-bottom: 0px;
4845
- }
4846
-
4847
- .sbi-fb-feedtypescustomizer-pp-ctn .sbi-selected-source-item{
4848
- border: 1px solid #e1e1e1;
4849
- }
4850
- .sbi-fb-feedtypescustomizer-content .sbi-fb-hd-btn svg{
4851
- fill: #141B38;
4852
- }
4853
- .sbi-fb-feedtypescustomizer-content .sbi-feedtype-icon-wrap svg{
4854
- width: 20px!important;
4855
- height: 20px!important;
4856
- }
4857
- .sbi-fb-feedtypescustomizer-content .sbi-feedtype-section{
4858
- padding: 24px;
4859
- }
4860
-
4861
- /*
4862
- Moderation Mode
4863
- */
4864
- .sb-control-moderationmode-action-btns{
4865
- padding-top: 30px;
4866
- }
4867
- .sb-control-moderationmode-action-btns button{
4868
- margin-bottom: 20px;
4869
- }
4870
- .sbi-moderation-overlay-ctn{
4871
- position: absolute;
4872
- width: 100%;
4873
- height: 100%;
4874
- left: 0;
4875
- top: 0;
4876
- z-index: 8;
4877
- cursor: pointer;
4878
- }
4879
- .sbi-moderation-toggle{
4880
- position: absolute;
4881
- width: 66px;
4882
- height: 22px;
4883
- top: 10px;
4884
- right: 10px;
4885
- background: #FFFFFF;
4886
- box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
4887
- border-radius: 2px;
4888
- padding: 2px;
4889
-
4890
- }
4891
- .sbi-moderation-toggle-icon{
4892
- width: 33px;
4893
- height: 22px;
4894
- position: relative;
4895
- float: left;
4896
- border-radius: 2px;
4897
- color: #8C8F9A;
4898
- }
4899
-
4900
- .sbi-moderation-toggle[data-type="active"] .sbi-moderation-checkmark{
4901
- background: #59AB46;
4902
- color: #fff!important;
4903
- }
4904
-
4905
- .sbi-moderation-toggle[data-type="inactive"] .sbi-moderation-x{
4906
- background: #D72C2C;
4907
- color: #fff!important;
4908
- }
4909
- .sbi_expand{
4910
- cursor: pointer;
4911
- }
4912
- .sbi-moderation-checkmark:before{
4913
- content: '';
4914
- position: absolute;
4915
- width: 13px;
4916
- height: 5px;
4917
- left: 8px;
4918
- top: 5px;
4919
- border-bottom: 2px solid currentColor;
4920
- border-left: 2px solid currentColor;
4921
- -webkit-transform: rotate(-45deg);
4922
- transform: rotate(-45deg);
4923
- }
4924
-
4925
- .sbi-moderation-x:before,
4926
- .sbi-moderation-x:after{
4927
- content: '';
4928
- position: absolute;
4929
- width: 15px;
4930
- height: 2px;
4931
- left: 9px;
4932
- top: 10px;
4933
- background: currentColor;
4934
- -webkit-transform: rotate(-45deg);
4935
- transform: rotate(-45deg);
4936
- }
4937
- .sbi-moderation-x:after{
4938
- -webkit-transform: rotate(45deg);
4939
- transform: rotate(45deg);
4940
- }
4941
- .sb-control-moderationmode-elements > .sb-control-switcher-ctn{
4942
- margin-bottom: 25px;
4943
- }
4944
-
4945
- .sbi_header_text h3{
4946
- color: inherit;
4947
- }
4948
-
4949
-
4950
- .sbi-customizer-ms-modes .sbi_link,
4951
- .sbi-customizer-ms-modes .sb_instagram_header{
4952
- display: none!important;
4953
- }
4954
-
4955
- .sbi-moderation-pagination{
4956
- display: flex;
4957
- margin-top: 20px;
4958
- justify-content: flex-end;
4959
- }
4960
- .sbi-moderation-pagination-btn{
4961
- margin-left: 20px;
4962
- }
4963
-
4964
- #sb_instagram .sbi_item:not(.sbi_transition) .sbi_photo,
4965
- #sb_instagram.sbi_highlight #sbi_images, #sb_instagram.sbi_masonry #sbi_images,
4966
- #sb_instagram #sbi_images .sbi_item{
4967
- -webkit-transition: unset!important;
4968
- transition: unset!important;
4969
- }
4970
-
4971
- #sb_instagram .sbi_item:not(.sbi_transition):hover .sbi_photo{
4972
- -webkit-transition: all .5s!important;
4973
- transition: all .5s!important;
4974
- }
4975
-
4976
- #sb_instagram .sbi_item .sbi_photo_shady{
4977
- position: absolute;
4978
- left: 0;
4979
- top: 0;
4980
- height: 100%;
4981
- width: 100%;
4982
- z-index: 2;
4983
- background-position: inherit;
4984
- background-size: inherit;
4985
- }
4986
- /*
4987
- FREE
4988
- */
4989
-
4990
- .sbi-fb-types-list-free{
4991
- display: block;
4992
- grid-template-columns: unset;
4993
- grid-column-gap: unset;
4994
- margin-bottom: 31px;
4995
- margin-top: 25px;
4996
- }
4997
- .sbi-fb-types-list-free .sbi-fb-type-el > div{
4998
- height: 100%;
4999
- }
5000
- .sbi-fb-types-list-free .sbi-fb-type-el{
5001
- width: 420px;
5002
- max-width: 100%;
5003
- height: 165px;
5004
- flex-direction: row;
5005
- align-items: center;
5006
- }
5007
- .sbi-fb-types-list-free .sbi-fb-type-el .sbi-fb-type-el-info{
5008
- text-align: left;
5009
- align-items: flex-start;
5010
- justify-content: center;
5011
- }
5012
-
5013
- .sbi-fb-types-list-free .sbi-fb-type-el .sbi-fb-type-el-info > *{
5014
- padding: 0 20px;
5015
- }
5016
-
5017
- .sbi-fb-types-list-pro{
5018
- display: grid;
5019
- grid-template-columns: 24.5% 24.5% 24.5% 24.5%;
5020
- grid-column-gap: 0.5%;
5021
- margin-top: 10px;
5022
- }
5023
- .sbi-fb-type-el-pro{
5024
- display: flex;
5025
- flex-direction: row;
5026
- align-items: center;
5027
- padding: 12px 20px 12px 12px;
5028
- background: #F9F9FA;
5029
- border: 1px solid #D0D1D7;
5030
- box-sizing: border-box;
5031
- border-radius: 2px;
5032
- color: #141B38;
5033
- font-weight: 600;
5034
- font-size: 14px;
5035
- margin-bottom: 10px;
5036
- cursor: pointer;
5037
- }
5038
- .sbi-fb-type-el-pro:hover{
5039
- background: #E2F5FF;
5040
- border: 1px solid #E2F5FF;
5041
- }
5042
- .sbi-fb-type-el-pro-img svg{
5043
- float: left;
5044
- }
5045
- .sbi-fb-type-el-pro-img{
5046
- margin-right: 20px;
5047
- }
5048
-
5049
- /*Lite Top Banner Dismiss*/
5050
- .sbi-builder-app-lite-dismiss .sbi-header-notice{
5051
- position: fixed!important;
5052
- top: 32px;
5053
- width: 100%;
5054
- z-index: 2;
5055
- left: 0;
5056
- }
5057
- .sbi-builder-app-lite-dismiss .sbi-fb-header{
5058
- top: 64px;
5059
- }
5060
- .sbi-builder-app-lite-dismiss .sb-customizer-sidebar{
5061
- top: 128px;
5062
- }
5063
- .sbi-builder-app-lite-dismiss .sb-customizer-preview{
5064
- margin-top: 100px;
5065
- }
5066
-
5067
- .sbi-fb-feedtypescustomizer-pp-ctn .sbi-addsource-type-btn{
5068
- color: #0068A0;
5069
- }
5070
- .sbi-fb-feedtypescustomizer-pp-ctn .sbi-addsource-type-btn svg{
5071
- fill: #0068A0;
5072
- }
5073
- .sb-control-label-pro-toggle{
5074
- display: inline-block;
5075
- background: #b9b9b9;
5076
- color: #fff;
5077
- border-radius: 3px;
5078
- padding: 1px 8px;
5079
- text-transform: uppercase;
5080
- font-size: 11px;
5081
- margin-left: 2px;
1
+ body{
2
+ background: #red;
3
+ --cl-orange: #E34F0E;
4
+ --cl-dark:#2C324C;
5
+ --error-red: #D72C2C;
6
+ --customizer-blue: #0096CC;
7
+ --dark-blue: #2A65DB;
8
+ }
9
+ .sb-tr-1{-webkit-transition: all .1s ease-in-out; transition: all .1s ease-in-out;}
10
+ .sb-tr-2{-webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
11
+ .sb-tr-3{-webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}
12
+ .sb-tr-4{-webkit-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
13
+ .sb-tr-5{-webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out;}
14
+ .sb-tr-6{-webkit-transition: all .6s ease-in-out; transition: all .6s ease-in-out;}
15
+ .sb-tr-7{-webkit-transition: all .7s ease-in-out; transition: all .7s ease-in-out;}
16
+ .sb-tr-8{-webkit-transition: all .8s ease-in-out; transition: all .8s ease-in-out;}
17
+ .sb-tr-9{-webkit-transition: all .9s ease-in-out; transition: all .9s ease-in-out;}
18
+ .sb-tr-10{-webkit-transition: all 1s ease-in-out; transition: all 1s ease-in-out;}
19
+ .sbi-bg-1{
20
+ background: #2A65DB;
21
+ }
22
+
23
+ /****
24
+ Buttons
25
+ */
26
+ .sb-button {
27
+ display: flex;
28
+ flex-direction: row;
29
+ justify-content: center;
30
+ align-items: center;
31
+ border-radius: 2px;
32
+ cursor: pointer;
33
+ outline: none;
34
+ box-shadow: none;
35
+ border: none;
36
+ -webkit-transition: all .15s ease-in-out;
37
+ transition: all .15s ease-in-out;
38
+ }
39
+ .sb-button-standard{
40
+ position: relative;
41
+ font-style: normal;
42
+ font-weight: 600;
43
+ font-size: 14px;
44
+ padding: 10px 20px 10px 39px;
45
+ line-height: 16px;
46
+ border: unset;
47
+ cursor: pointer;
48
+ }
49
+ .sb-button-standard svg {
50
+ width: 16px;
51
+ height: 16px;
52
+ position: absolute;
53
+ left: 13px;
54
+ right: auto;
55
+ top: 10px;
56
+ bottom: auto;
57
+ }
58
+ .sb-button-small.sb-button-left-icon {
59
+ padding-left: 32px;
60
+ }
61
+ .sb-button-small.sb-button-right-icon {
62
+ padding-right: 32px;
63
+ }
64
+ .sb-button-small.sb-button-left-icon svg {
65
+ position: absolute;
66
+ left: 13px;
67
+ }
68
+ .sb-button-small.sb-button-right-icon svg {
69
+ position: absolute;
70
+ right: 13px;
71
+ }
72
+ .sb-button-standard.sb-button-right-icon {
73
+ padding: 10px 39px 10px 20px;
74
+ }
75
+ .sb-button-standard.sb-button-right-icon svg {
76
+ right: 13px;
77
+ left: auto;
78
+ }
79
+
80
+ .sb-button-small {
81
+ position: relative;
82
+ font-style: normal;
83
+ font-weight: 600;
84
+ font-size: 12px;
85
+ padding: 6px 12px;
86
+ line-height: 160%;
87
+ }
88
+
89
+ .sb-button-no-border {
90
+ border-radius: 0 !important;
91
+ border: none !important;
92
+ }
93
+
94
+ /*orange*/
95
+ .sbi-btn-orange{
96
+ background: #E34F0E!important;
97
+ color: #fff!important;
98
+ }
99
+ .sbi-btn-orange:hover{
100
+ background: #F37036!important;
101
+ color: #fff!important;
102
+ }
103
+ .sbi-btn-orange:focus{
104
+ background: #B8400B!important;
105
+ color: #fff!important;
106
+ }
107
+
108
+ /*red*/
109
+ .sbi-btn-red{
110
+ background: #D72C2C!important;
111
+ color: #fff!important;
112
+ }
113
+ .sbi-btn-red:hover{
114
+ background: #DF5757!important;
115
+ color: #fff!important;
116
+ }
117
+ .sbi-btn-red:focus{
118
+ background: #841919!important;
119
+ color: #fff!important;
120
+ }
121
+
122
+ /*red*/
123
+ .sbi-btn-blue{
124
+ background: #0068A0!important;
125
+ color: #fff!important;
126
+ }
127
+ .sbi-btn-blue:hover{
128
+ background: #0096CC!important;
129
+ color: #fff!important;
130
+ }
131
+ .sbi-btn-blue:focus{
132
+ background: #004D77!important;
133
+ color: #fff!important;
134
+ }
135
+
136
+ /*grey*/
137
+ .sbi-btn-grey{
138
+ background: #F3F4F5!important;
139
+ color: #141B38!important;
140
+ border: 1px solid #D0D1D7!important;
141
+ }
142
+ .sbi-btn-grey:hover{
143
+ background: #fff!important;
144
+ color: #141B38!important;
145
+ border: 1px solid #DCDDE1!important;
146
+ }
147
+ .sbi-btn-grey:focus{
148
+ background: #E8E8EB!important;
149
+ color: #141B38!important;
150
+ border: 1px solid #D0D1D7!important;
151
+ }
152
+
153
+ /*dark*/
154
+ .sbi-btn-dark{
155
+ background: #2C324C!important;
156
+ color: #fff!important;
157
+ }
158
+ .sbi-btn-dark:hover{
159
+ background: #434960!important;
160
+ color: #fff!important;
161
+ }
162
+ .sbi-btn-dark:focus{
163
+ background: #141B38!important;
164
+ color: #fff!important;
165
+ }
166
+
167
+ .sb-dark-hover:hover svg,
168
+ .sb-dark-hover:hover path{
169
+ fill: #141B38;
170
+ }
171
+
172
+ /*disabled*/
173
+ .sbi-btn-orange[data-active="false"],
174
+ .sbi-btn-blue[data-active="false"],
175
+ .sbi-btn-red[data-active="false"],
176
+ .sbi-btn-grey[data-active="false"],
177
+ .sbi-btn-dark[data-active="false"]{
178
+ background: #E8E8EB !important;
179
+ color: #8C8F9A !important;
180
+ }
181
+
182
+ /* Text */
183
+ #sb_instagram{
184
+ overflow-x: hidden;
185
+ }
186
+ #sbi-builder-app h1:not(#sb_instagram h1) {
187
+ font-style: normal;
188
+ font-weight: 600;
189
+ font-size: 36px;
190
+ line-height: 125%;
191
+ color: #141B38;
192
+ margin: 0;
193
+ letter-spacing: 0;
194
+ }
195
+ #sbi-builder-app h2:not(#sb_instagram h2) {
196
+ font-style: normal;
197
+ font-weight: 600;
198
+ font-size: 32px;
199
+ line-height: 125%;
200
+ margin: 0;
201
+ letter-spacing: 0;
202
+ }
203
+ #sbi-builder-app h3:not(#sb_instagram h3):not(.sb_instagram_header h3) {
204
+ font-style: normal;
205
+ font-weight: 600;
206
+ font-size: 24px;
207
+ line-height: 120%;
208
+ margin: 0 0 4px 0;
209
+ letter-spacing: 0;
210
+ }
211
+
212
+ #sbi-builder-app h4:not(#sb_instagram h5) {
213
+ font-style: normal;
214
+ font-weight: 600;
215
+ font-size: 18px;
216
+ line-height: 140%;
217
+ margin: 0 0 4px 0;
218
+ letter-spacing: 0;
219
+ }
220
+ .sbi-fb-feedtypes-pp-ctn h4 {
221
+ font-size: 24px !important;
222
+ margin-bottom: 28px !important;
223
+ }
224
+
225
+ #sbi-builder-app .sb-small-p,
226
+ #sbi-builder-app .sb-standard-p{
227
+ font-style: normal;
228
+ font-weight: normal;
229
+ font-size: 14px;
230
+ line-height: 160%;
231
+ color: #8C8F9A;
232
+ margin: 0;
233
+ }
234
+ #sbi-builder-app .sb-standard-p{
235
+ font-size: 16px;
236
+ color: #141B38;
237
+ }
238
+ #sbi-builder-app .sbi-fb-source-inp::placeholder {
239
+ color: #8C8F9A;
240
+ font-size: 14px;
241
+ font-weight: normal;
242
+ }
243
+ #sbi-builder-app .sb-bold {
244
+ font-weight: 600;
245
+ }
246
+ #sbi-builder-app .sb-dark-text {
247
+ color: #141B38;
248
+ }
249
+ #sbi-builder-app .sbi-btn-orange .sb-small-p,
250
+ #sbi-builder-app .sbi-btn-blue .sb-small-p,
251
+ #sbi-builder-app .sbi-btn-red .sb-small-p,
252
+ #sbi-builder-app .sbi-btn-dark .sb-small-p{
253
+ color: #fff;
254
+ }
255
+
256
+ #sbi-builder-app .sb-caption {
257
+ font-style: normal;
258
+ font-weight: normal;
259
+ font-size: 13px;
260
+ line-height: 150%;
261
+ color: #141B38;
262
+ }
263
+ #sbi-builder-app .sb-caption.sb-caption-lighter {
264
+ color: #5F6368;
265
+ }
266
+
267
+ #sbi-builder-app .sb-small {
268
+ font-style: normal;
269
+ font-weight: bold;
270
+ font-size: 10px;
271
+ line-height: 160%;
272
+ letter-spacing: 0.02em;
273
+ text-transform: uppercase;
274
+ color: #141B38;
275
+ }
276
+
277
+ #sbi-builder-app .sb-lighter {
278
+ color: #434960;
279
+ }
280
+ #sbi-builder-app .sb-lightest {
281
+ color: #74777D;
282
+ }
283
+ #sbi-builder-app .sb-small-text {
284
+ font-size: 12px;
285
+ }
286
+ /* Positioning */
287
+ .sb-icon-label {
288
+ display: flex;
289
+ flex-direction: row;
290
+ justify-content: flex-start;
291
+ align-items: center;
292
+ }
293
+ /* Misc Stylings */
294
+ .sb-flex-center {
295
+ display: -ms-flexbox;
296
+ display: -webkit-flex;
297
+ display: flex;
298
+
299
+ -ms-flex-align: center;
300
+ -webkit-align-items: center;
301
+ -webkit-box-align: center;
302
+
303
+ align-items: center;
304
+ }
305
+ .sb-box-shadow {
306
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
307
+ }
308
+ #sbi-builder-app .sb-icon-small svg {
309
+ height: 10px;
310
+ }
311
+
312
+ /*
313
+ Social Links
314
+ */
315
+ .sbi-cl-facebook, .sbi-clhv-facebook:hover{
316
+ color: #006BFA!important;
317
+ }
318
+ .sbi-bg-facebook, .sbi-bghv-facebook:hover{
319
+ background: #006BFA!important;
320
+ }
321
+
322
+ .sbi-cl-instagram, .sbi-clhv-instagram:hover{
323
+ color: #BA03A7!important;
324
+ }
325
+ .sbi-bg-instagram, .sbi-bghv-instagram:hover{
326
+ background: #BA03A7!important;
327
+ }
328
+
329
+ .sbi-cl-twitter, .sbi-clhv-twitter:hover{
330
+ color: #1B90EF!important;
331
+ }
332
+ .sbi-bg-twitter, .sbi-bghv-twitter:hover{
333
+ background: #1B90EF!important;
334
+ }
335
+
336
+ .sbi-cl-youtube, .sbi-clhv-youtube:hover{
337
+ color: #EB2121!important;
338
+ }
339
+ .sbi-bg-youtube, .sbi-bghv-youtube:hover{
340
+ background: #EB2121!important;
341
+ }
342
+
343
+ .sbi-cl-linkedin, .sbi-clhv-linkedin:hover{
344
+ color: #007bb6!important;
345
+ }
346
+ .sbi-bg-linkedin, .sbi-bghv-linkedin:hover{
347
+ background: #007bb6!important;
348
+ }
349
+
350
+ .sbi-cl-mail, .sbi-clhv-mail:hover{
351
+ color: #666!important;
352
+ }
353
+ .sbi-bg-mail, .sbi-bghv-mail:hover{
354
+ background: #666!important;
355
+ }
356
+
357
+ #sbi-builder-app{
358
+ font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;;
359
+ visibility: hidden;
360
+ opacity: 0;
361
+ }
362
+ #sbi-builder-app[data-app-loaded="true"]{
363
+ visibility: visible;
364
+ opacity: 1;
365
+ }
366
+
367
+ .sbi-builder-app a, .sbi-builder-app a:focus{
368
+ text-decoration: none;
369
+ /*color: inherit;*/
370
+ outline: none;
371
+ }
372
+ .sbi-fb-btn{
373
+ display: flex;
374
+ flex-direction: row;
375
+ justify-content: center;
376
+ align-items: center;
377
+ padding: 9px 38px;
378
+ font-style: normal;
379
+ font-weight: 500;
380
+ font-size: 14px;
381
+ line-height: 17px;
382
+ border-radius: 2px;
383
+ cursor: pointer;
384
+ color: #fff;
385
+ outline: none;
386
+ box-shadow: none;
387
+ border: none;;
388
+ }
389
+ .sbi-fb-btn:focus{
390
+ box-shadow: none;
391
+ }
392
+ .sbi-fb-fs{
393
+ width: 100%;
394
+ position: relative;
395
+ float: left;
396
+ box-sizing: border-box;
397
+ }
398
+ .sbi-fs-a{
399
+ width: 100%;
400
+ height: 100%;
401
+ display: block;
402
+ position: absolute;
403
+ left: 0;
404
+ top: 0;
405
+ z-index: 1;
406
+ }
407
+ .sb-btn:focus{
408
+ outline: none;
409
+ }
410
+ #wpcontent,
411
+ .instagram-feed_page_sbi-feed-builder #wpcontent{
412
+ padding-left: 0px;
413
+ }
414
+ #wpfooter{
415
+ display: none;
416
+ }
417
+ #wpbody-content{
418
+ padding-bottom: 0px;
419
+ }
420
+ #wpbody{
421
+ padding-left: 0px!important;
422
+ }
423
+ .sbi-fb-wrapper{
424
+ max-width: 92%;
425
+ position: relative;
426
+ margin: auto;
427
+ color: #141B38;
428
+ }
429
+ .sbi-fb-fs-boss{
430
+ position: fixed;
431
+ height: 100vh;
432
+ width: 100%;
433
+ left: 0;
434
+ top: 0;
435
+ bottom: 0;
436
+ right: 0;
437
+ background: rgba(0,0,0,.4);
438
+ z-index: 9989;
439
+ }
440
+
441
+
442
+ /*
443
+ Header
444
+ */
445
+ .sbi-fb-create-ctn{
446
+ margin-top: 104px;
447
+ padding: 0 54px;
448
+ box-sizing: border-box;
449
+ width: 100%;
450
+ }
451
+ .sbi-fb-header{
452
+ height: 64px;
453
+ position: absolute;
454
+ display: flex;
455
+ flex-direction: row;
456
+ justify-content: space-between;
457
+ align-items: center;
458
+ background: #fff;
459
+ padding: 0px 52px;
460
+ z-index: 99;
461
+ }
462
+ .sbi-fb-header-left {
463
+ display: flex;
464
+ }
465
+ .sbi-fb-header-left .sb-social-wall-link-wrap {
466
+ margin-left: 30px;
467
+ }
468
+ .sbi-fb-hd-logo {
469
+ display: flex;
470
+ vertical-align: middle;
471
+ align-items: center;
472
+ gap: 5px;
473
+ }
474
+ .sbi-fb-hd-logo .sb-logo-letters-wrap {
475
+ transform: translate(0px, -2px);
476
+ }
477
+ .sbi-fb-hd-logo .breadcrumb-title {
478
+ font-size: 14px;
479
+ font-weight: 400;
480
+ line-height: 22px;
481
+ letter-spacing: 0em;
482
+ margin-left: 4px;
483
+ }
484
+ .sbi-csz-header.sbi-fb-header{
485
+ position: fixed!important;
486
+ padding: 0 20px;
487
+ }
488
+ .sbi-csz-header-insider{
489
+ width: calc(100% - 160px);
490
+ display: flex;
491
+ flex-direction: row;
492
+ justify-content: space-between;
493
+ align-items: center;
494
+ height: 52px;
495
+ }
496
+
497
+ @media all and (max-width: 960px) {
498
+ .sbi-csz-header-insider{
499
+ width: calc(100% - 36px);
500
+ }
501
+ .sb-customizer-ctn .sb-customizer-sidebar{
502
+ left: 36px;
503
+ }
504
+ }
505
+
506
+ .sbi-fb-hd-btn{
507
+ cursor: pointer;
508
+ display: flex;
509
+ flex-direction: row;
510
+ justify-content: center;
511
+ align-items: center;
512
+ position: relative;
513
+ border: 1px solid;
514
+ -webkit-transition: all .15s ease-in-out;
515
+ transition: all .15s ease-in-out;
516
+ }
517
+ .sbi-fb-hd-btn i{
518
+ margin: 0px 5px;
519
+ }
520
+ .sbi-fb-full-wrapper {
521
+ padding: 0 53px;
522
+ padding-top: 82px;
523
+ }
524
+ .sbi-csz-hd-actions{
525
+ display: flex;
526
+ justify-content: center;
527
+ align-items: center;
528
+ }
529
+ .sbi-csz-hd-actions > button{
530
+ margin-left: 10px;
531
+ }
532
+
533
+ .sbi-csz-btn-embd{
534
+ color: #fff;
535
+ background: var(--cl-dark);
536
+ border-color: var(--cl-dark);
537
+ }
538
+ .sbi-csz-btn-save{
539
+ color: #fff;
540
+ background: var(--cl-orange);
541
+ border-color: var(--cl-orange);
542
+ }
543
+ .sbi-csz-hd-name{
544
+ display: flex;
545
+ justify-content: center;
546
+ align-items: center;
547
+ height: 45px;
548
+ }
549
+ .sbi-csz-hd-name strong{
550
+ font-size: 18px;
551
+ }
552
+ .sbi-csz-hd-name[data-edit="true"] strong{
553
+ display: none;
554
+ }
555
+ .sbi-csz-hd-name input[type="text"]{
556
+ border-radius: 0px;
557
+ border: 0px;
558
+ background: #CCE7FF;
559
+ outline: none;
560
+ font-size: 18px;
561
+ font-weight: 700;
562
+ display: none;
563
+ }
564
+ .sbi-csz-hd-name[data-edit="true"] input[type="text"]{
565
+ display: block;
566
+ }
567
+ .sbi-csz-hd-name input[type="text"]:focus{
568
+ outline: none!important;
569
+ border: 0px!important;
570
+ box-shadow: none!important;
571
+ }
572
+
573
+
574
+ .sbi-csz-name-ed-btn{
575
+ width: 22px;
576
+ height: 22px;
577
+ cursor: pointer;
578
+ margin: 0 10px;
579
+ background: #E8E8EB;
580
+ border: 1px solid #E8E8EB;
581
+ outline: none;
582
+ }
583
+ .sbi-csz-name-ed-btn:focus,
584
+ .sbi-csz-name-ed-btn:hover{
585
+ outline: none;
586
+ background-color: #fff;
587
+ }
588
+ .sbi-csz-name-ed-btn svg{
589
+ width: 11px;
590
+ fill: #141B38;
591
+ float: left;
592
+ margin-left: -1px;
593
+ }
594
+
595
+
596
+ /*
597
+ Welcome Screen Empty State
598
+ */
599
+ .sbi-fb-wlcm-header{
600
+ display: flex;
601
+ align-items: center;
602
+ margin-bottom: 28px;
603
+ margin-top: 23px;
604
+ }
605
+ #sbi-fb-full-wrapper .sbi-fb-wlcm-header {
606
+ margin-bottom: 34px;
607
+ }
608
+
609
+ .sbi-fb-wlcm-header h3,
610
+ .sbi-fb-create-ctn h3{
611
+ font-weight: 600;
612
+ font-size: 32px;
613
+ line-height: 40px;
614
+ padding: 0;
615
+ margin: 0;
616
+ float: left;
617
+ }
618
+ .sbi-fb-btn-new{
619
+ background: var(--cl-orange);
620
+ position: relative;
621
+ float: left;
622
+ margin-left: 20px;
623
+ font-size: 12px;
624
+ padding: 8px 12px 8px 32px;
625
+ font-weight: 700;
626
+ }
627
+ .sbi-fb-btn-new svg{
628
+ width: 10px;
629
+ height: 10px;
630
+ position: absolute;
631
+ left: 12px;
632
+ }
633
+
634
+ .sbi-fb-inf-cnt{
635
+ position: relative;
636
+ background: #fff;
637
+ padding: 27px;
638
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
639
+ border-radius: 2px;
640
+ max-width: 100%;
641
+ }
642
+ .sbi-fb-inf-num{
643
+ width: 30px;
644
+ height: 30px;
645
+ position: relative;
646
+ float: left;
647
+ display: flex;
648
+ justify-content: center;
649
+ align-items: center;
650
+ font-size: 12px;
651
+ font-weight: 600;
652
+ color: #141B38;
653
+ margin-right: 20px;
654
+
655
+ }
656
+ .sbi-fb-inf-num span{
657
+ z-index: 1;
658
+ }
659
+ .sbi-fb-inf-num:before{
660
+ content: '';
661
+ position: absolute;
662
+ width: 100%;
663
+ height: 100%;
664
+ background: #D8DADD;
665
+ border-radius: 50%;
666
+ }
667
+ .sbi-fb-inf-txt{
668
+ float: left;
669
+ }
670
+ /*.sbi-fb-inf-txt strong{
671
+ display: block;
672
+ font-size: 20px;
673
+ line-height: 1em;
674
+ font-weight: bold;
675
+ margin-bottom: 8px;
676
+ }*/
677
+ .sbi-fb-inf-txt span{
678
+ display: block;
679
+ font-size: 16px;
680
+ color: #5F6368;
681
+ line-height: 1.5em;
682
+ }
683
+ .sbi-fb-wlcm-inf-1 {
684
+ padding-left: 297px;
685
+ }
686
+ .sbi-fb-wlcm-inf-1 .sbi-fb-inf-svg{
687
+ position: absolute;
688
+ left: 191px;
689
+ top: 32px;
690
+ /*float: left;
691
+ margin-top: 30px;
692
+ margin-left: 230px;
693
+ position: relative;
694
+ margin-right: 25px;*/
695
+ }
696
+ .sbi-fb-wlcm-inf-1 .sbi-fb-inf-svg svg{
697
+ margin-top: -45px;
698
+ }
699
+ .sb-head {
700
+ position: absolute;
701
+ top: -2px;
702
+ left:-4px;
703
+ }
704
+ .sbi-fb-wlcm-inf-1 .sbi-fb-inf-cnt{
705
+ float: left;
706
+ width: 523px;
707
+ margin-bottom: 24px;
708
+ }
709
+ .sbi-fb-wlcm-inf-2{
710
+ display: flex;
711
+ justify-content: space-between;
712
+ padding-left: 152px;
713
+ }
714
+ .sbi-fb-wlcm-inf-2 .sbi-fb-inf-cnt{
715
+ float: left;
716
+ width: 590px;
717
+ margin-bottom: 29px;
718
+ height: 67px;
719
+ display: flex;
720
+ align-items: center;
721
+ }
722
+ .sbi-fb-wlcm-inf-2 .sbi-fb-inf-img{
723
+ position: absolute;
724
+ right: 15px;
725
+ top: -15px;
726
+ }
727
+
728
+ .sbi-fb-wlcm-inf-3{
729
+ display: flex;
730
+ justify-content: flex-start;
731
+ align-items: center;
732
+ padding-left: 297px;
733
+ }
734
+ .sbi-fb-wlcm-inf-3 .sbi-fb-inf-cnt{
735
+ float: left;
736
+ width: 620px;
737
+ height: 80px;
738
+ display: flex;
739
+ justify-content: center;
740
+ align-items: center;
741
+ }
742
+ .sbi-fb-wlcm-inf-3 .sbi-fb-inf-img{
743
+ float: left;
744
+ left: 10px;
745
+ top: -10px;
746
+ position: absolute;
747
+ }
748
+ .sbi-fb-wlcm-inf-2 .sbi-fb-inf-num, .sbi-fb-wlcm-inf-3 .sbi-fb-inf-num{
749
+ margin-top: -20px;
750
+ }
751
+ .sbi-fb-types-ctn, .sbi-fb-slctsrc-ctn, .sbi-fb-section-wh{
752
+ background: #fff;
753
+ border: 1px solid #E7E7E9;
754
+ }
755
+ .sbi-fb-wrapper h3, .sbi-fb-section-wh h3{
756
+ font-size: 32px;
757
+ line-height: 39px;
758
+ font-weight: 600;
759
+ }
760
+ .sbi-fb-create-ctn h3{
761
+ margin-bottom: 30px;
762
+ }
763
+ .sbi-fb-types h4, .sbi-fb-section-wh h4 {
764
+ font-size:20px;
765
+ line-height: 24px;
766
+ font-weight: 600;
767
+ }
768
+ #sbi-builder-app .sbi-fb-create-ctn h4,
769
+ #sbi-builder-app .sbi-fb-feedtypes-pp-ctn h4{
770
+ margin-bottom: 1px;
771
+ }
772
+ #sbi-builder-app .sbi-fb-feedtypes-pp-ctn .sbi-fb-types {
773
+ margin-top: 20px;
774
+ }
775
+ #sbi-builder-app .sbi-fb-adv-types .sbi-adv-types-heading{
776
+ font-style: normal;
777
+ font-weight: bold;
778
+ font-size: 12px;
779
+ line-height: 160%;
780
+ letter-spacing: 0.05em;
781
+ text-transform: uppercase;
782
+ color: #8C8F9A;
783
+ }
784
+ .sbi-fb-types-desc{
785
+ font-size: 14px;
786
+ color: #434960;
787
+ margin-bottom: 33px;
788
+ display: block;
789
+ }
790
+ .sbi-fb-types, .sbi-fb-adv-types{
791
+ padding: 22px 35px 0;
792
+ }
793
+ .sbi-fb-adv-types {
794
+ padding-top: 0;
795
+ }
796
+ #sbi-builder-app .sbi-fb-type-el-info a,
797
+ .sbi-business-required{
798
+ color: #0068A0;
799
+ font-size: 12px;
800
+ display: flex;
801
+ align-self: center;
802
+ }
803
+ #sbi-builder-app .sbi-fb-type-el-info a span{
804
+ margin-right: 7px;
805
+ }
806
+ #sbi-builder-app .sbi-fb-type-el-info a svg,
807
+ .sbi-business-required svg{
808
+ height: 16px;
809
+ line-height: 12px;
810
+ vertical-align: top;
811
+ margin-top: 1px;
812
+ }
813
+ .sbi-fb-types-list{
814
+ display: grid;
815
+ grid-template-columns: 24.25% 24.25% 24.25% 25.25%;
816
+ grid-column-gap: 1%;
817
+ margin-bottom: 31px;
818
+ }
819
+
820
+ /*
821
+ .sbi-fb-adv-types .sbi-fb-types-list{
822
+ grid-template-columns: 24.25% 24.25% 24.25% 24.25%;
823
+ }
824
+ */
825
+ .sbi-fb-heading {
826
+ margin-bottom: 24px;
827
+ width: 100%;
828
+ float: left;
829
+ }
830
+ .sbi-fb-heading h1{
831
+ float: left;
832
+ }
833
+ .sbi-fb-heading .sbi-fb-btn{
834
+ float: right!important;
835
+ }
836
+
837
+ .sbi-fb-adv-types .sbi-fb-types-list{
838
+ margin-bottom: 71px;
839
+ }
840
+ .sbi-fb-type-el{
841
+ display: flex;
842
+ flex-direction: column;
843
+ align-items: flex-start;
844
+ padding: 0;
845
+ position: relative;
846
+ background: #fff;
847
+ border: 1px solid #F1F1F1;
848
+ border-radius: 3px;
849
+ cursor: pointer;
850
+ box-sizing: border-box;
851
+ }
852
+ .sbi-fb-type-el:not([data-type="socialwall"]):hover,
853
+ .sbi-fb-adv-types .sbi-fb-type-el:not([data-type="socialwall"]):hover{
854
+ border: 1px solid #F6966B;
855
+ }
856
+
857
+
858
+ .sbi-fb-adv-types .sbi-fb-type-el{
859
+ border: 1px solid #FFDBBA;
860
+ }
861
+ .sb-control-feedtype-ctn .sbi-fb-type-el{
862
+ border: 2px solid #E8E8EB;
863
+ margin-bottom: 7px;
864
+ }
865
+ .sb-control-feedtype-ctn .sbi-fb-type-el-info{
866
+ margin-top: 14px
867
+ }
868
+ .sbi-fb-type-el[data-active="true"],
869
+ .sbi-fb-adv-types .sbi-fb-type-el[data-active="true"]{
870
+ border: 2px solid var(--cl-orange)!important;
871
+ }
872
+ .sbi-fb-type-el[data-active="true"]:not([data-type="socialwall"]):after{
873
+ content: '';
874
+ position: absolute;
875
+ width: 10px;
876
+ height: 4px;
877
+ border-left: 2px solid #fff;
878
+ border-bottom: 2px solid #fff;
879
+ z-index: 3;
880
+ right: 5px;
881
+ top: 7px;
882
+ -webkit-transform: rotate(-45deg);
883
+ transform: rotate(-45deg);
884
+ }
885
+ .sbi-fb-type-el:before{
886
+ content: '';
887
+ position: absolute;
888
+ width: 24px;
889
+ height: 24px;
890
+ right: 0px;
891
+ top: 0px;
892
+ z-index: 2;
893
+ background: #DCDDE1;
894
+ }
895
+ .sbi-fb-type-el[data-active="true"]:before{
896
+ background: var(--cl-orange)
897
+ }
898
+ .sbi-fb-type-el[data-type="socialwall"]:before{
899
+ display: none;
900
+ }
901
+
902
+
903
+ .sbi-fb-type-el-img{
904
+ display: flex;
905
+ flex-direction: column;
906
+ justify-content: center;
907
+ align-items: center;
908
+ background: #F1F1F1;
909
+ border: 2px solid #F1F1F1;
910
+ border-bottom: 1px solid #fff;
911
+ }
912
+ .sbi-fb-type-el[data-active="true"] .sbi-fb-type-el-img{
913
+ border: 1px solid #F1F1F1;
914
+ border-bottom: 2px solid #fff;
915
+ }
916
+ .sbi-fb-type-el-img svg {
917
+ max-width: 100%;
918
+ }
919
+ .sbi-fb-adv-types .sbi-fb-type-el-img{
920
+ background: #FCF4EF;
921
+ }
922
+ .sbi-fb-type-el-info{
923
+ display: flex;
924
+ flex-direction: column;
925
+ justify-content: center;
926
+ align-items: center;
927
+ text-align: center;
928
+ flex: 1 1 auto;
929
+ padding: 0 13px 13px;
930
+ }
931
+ .sbi-fb-type-el-link{
932
+ font-size: 13px;
933
+ font-weight: 400;
934
+ margin-bottom: 5px;
935
+ }
936
+
937
+ .sb-control-feedtype-ctn .sbi-fb-type-el-info{
938
+ padding: 15px 70px 25px;
939
+ }
940
+ .sb-control-feedtype-ctn .sbi-fb-type-el-info strong{
941
+ font-size: 14px;
942
+ }
943
+ #sbi-builder-app .sbi-fb-type-el p {
944
+ margin: 11px 0 4px;
945
+ }
946
+ #sbi-builder-app .sbi-fb-type-el[data-active="true"] p{
947
+ margin-top: 10px;
948
+ }
949
+ #sbi-builder-app .sbi-fb-type-el[data-active="true"] .sbi-fb-type-el-info {
950
+ padding-bottom: 12px;
951
+ }
952
+ #sbi-builder-app .sbi-fb-type-el p svg {
953
+ width: 14px;
954
+ height: 14px;
955
+ margin-left: 5px;
956
+ vertical-align: middle;
957
+ }
958
+ /*.sbi-fb-type-el-info strong{
959
+ font-weight: 600;
960
+ font-size: 16px;
961
+ line-height: 19px;
962
+ margin-bottom: 10px;
963
+ text-transform: capitalize;
964
+ display: flex;
965
+ justify-content: center;
966
+ align-items: center;
967
+ }
968
+ .sbi-fb-type-el-info strong i{
969
+ color: #ed8000;
970
+ margin-left: 5px;
971
+ font-size: 13px;
972
+ margin-top: 2px;
973
+ }
974
+ .sbi-fb-type-el-info span{
975
+ font-size: 13px;
976
+ line-height: 1.4em;
977
+ color: #74777D;
978
+ }*/
979
+ .sbi-fb-adv-types .sbi-fb-type-el-img {
980
+ border-color: #FCF4EF;
981
+ }
982
+ .sbi-fb-ft-action {
983
+ border-top: 1px solid #D8DADD;
984
+ padding: 30px 40px;
985
+ margin-top: 63px;
986
+ }
987
+ .sbi-fb-slctfd-action .sbi-fb-wrapper{
988
+ display: flex;
989
+ align-items: center;
990
+ justify-content: flex-end;
991
+ }
992
+ .sbi-fb-slctfd-action{
993
+ padding: 16px 0;
994
+ }
995
+ .sbi-fb-slctf-nxt{
996
+ height: auto;
997
+ padding: 7px 36px 7px 37px;
998
+ }
999
+ .sbi-fb-slctf-back{
1000
+ margin-right: auto;
1001
+ height: auto;
1002
+ padding: 7px 37px 7px 36px;
1003
+ }
1004
+ .sbi-fb-slctf-back svg,
1005
+ .sbi-fb-slctf-nxt svg {
1006
+ width: 6px;
1007
+ height: 10px;
1008
+ }
1009
+ .sbi-fb-slctf-back span {
1010
+ display: inline-block;
1011
+ margin-left: 15px;
1012
+ line-height: 160%;
1013
+ }
1014
+ .sbi-fb-slctf-nxt span {
1015
+ display: inline-block;
1016
+ margin-right: 15px;
1017
+ line-height: 160%;
1018
+ }
1019
+ .sbi-fb-btn-ac{
1020
+ opacity: 0.6;
1021
+ }
1022
+ .sbi-fb-btn-ac[data-active="true"]{
1023
+ opacity: 1;
1024
+ }
1025
+
1026
+ .sb-control-single-id-ctn{
1027
+ margin-top: 35px;
1028
+ padding: 25px 0px;
1029
+ }
1030
+ .sb-control-single-id-ctn:before,
1031
+ .sb-control-before-brd:before
1032
+ {
1033
+ content: '';
1034
+ position: absolute;
1035
+ border-top: 1px solid #DCDDE1;
1036
+ height: 2px;
1037
+ top: 0px;
1038
+ left: -20px;
1039
+ width: calc(100% + 40px);
1040
+ }
1041
+ .sb-control-single-id-input{
1042
+ display: flex;
1043
+ justify-content: center;
1044
+ align-items: center;
1045
+ margin-top: 7px;
1046
+ }
1047
+ .sb-control-single-id-input input{
1048
+ height: 45px;
1049
+ float: left;
1050
+ background: #fff;
1051
+ margin-top: 6px;
1052
+ margin-right: 7px;
1053
+ }
1054
+
1055
+ /*
1056
+ Video Type Chooser
1057
+ */
1058
+ .sbi-fb-section-wh.sbi-fb-section-videos{
1059
+ padding: 50px 21px 54px 30px;
1060
+ }
1061
+ .sbi-fb-videotype-chooser{
1062
+ display: grid;
1063
+ grid-template-columns: 49% 49%;
1064
+ grid-column-gap: 1%;
1065
+
1066
+ }
1067
+ .sbi-fb-section-videos{
1068
+ flex-direction: column;
1069
+ }
1070
+ .sbi-fb-section-videos .sbi-fb-section-video-playlist{
1071
+ margin-top: 30px;
1072
+ }
1073
+
1074
+ .sbi-fb-section-video-playlist .sbi-fb-wh-inp{
1075
+ margin-top: 10px;
1076
+ margin-bottom: 10px!important;
1077
+ }
1078
+ .sbi-fb-section-videos .sbi-fb-sglelm-left{
1079
+ padding-right: 0px;
1080
+ }
1081
+ /*
1082
+ Source Screen
1083
+ */
1084
+ .sbi-fb-sec-heading > span{
1085
+ font-size:14px;
1086
+ color: #434960;
1087
+ line-height: 1.7em;
1088
+ display: block;
1089
+ }
1090
+ #sbi-builder-app .sbi-fb-sec-heading h4{
1091
+ margin-bottom: 2px;
1092
+ }
1093
+ #sbi-builder-app .sbi-fb-slctsrc-ctn .sbi-fb-sec-heading h4{
1094
+ margin-bottom: 2px !important;
1095
+ }
1096
+ .sbi-fb-sec-heading {
1097
+ margin-bottom: 14px;
1098
+ }
1099
+ .sbi-builder-app .sbi-fb-slctsrc-content,.sbi-fb-section-wh-insd{
1100
+ padding: 23px 30px;
1101
+ }
1102
+
1103
+ .sbi-fb-slctsrc-ctn h4,.sbi-fb-section-wh-insd h4{
1104
+ font-size: 20px;
1105
+ padding: 0px;
1106
+ margin: 0px;
1107
+ }
1108
+ .sbi-fb-srcslist-ctn{
1109
+ display: grid;
1110
+ grid-template-columns: 32.66% 32.66% 32.66%;
1111
+ grid-column-gap: 1%;
1112
+ margin-bottom: 28px;
1113
+ }
1114
+ .sbi-fb-srcs-item{
1115
+ width: 100%;
1116
+ cursor: pointer;
1117
+ height: 62px;
1118
+ margin: 1% 0;
1119
+ border-radius: 3px;
1120
+ border: 1px solid #E7E7E9;
1121
+ display: flex;
1122
+ position: relative;
1123
+ }
1124
+ .sbi-fb-srcs-item[data-disabled="true"]{
1125
+ background: #F3F4F5;
1126
+ }
1127
+ .sbi-fb-srcs-item[data-disabled="true"] .sbi-fb-srcs-item-inf{
1128
+ opacity: .55;
1129
+
1130
+ }
1131
+ #sbi-builder-app .sbi-fb-srcs-item .sbi-fb-srcs-item-inf .sbi-fb-srcs-item-name {
1132
+ color: #141B38;
1133
+ padding-right: 44px;
1134
+ }
1135
+ /*Disabled Controls*/
1136
+ .sb-control-elem-ctn[data-disabled="true"] input[type="text"],
1137
+ .sb-control-elem-ctn[data-disabled="true"] input[type="number"],
1138
+ .sb-control-elem-ctn[data-disabled="true"] input[type="date"],
1139
+ .sb-control-elem-ctn[data-disabled="true"] textarea{
1140
+ background: #f0f0f0!important;
1141
+ border-color: #D0D1D7!important;
1142
+ }
1143
+
1144
+ .sb-control-elem-ctn[data-disabled="true"] .sb-control-colorpicker-swatch{
1145
+ background: #D0D1D7!important;
1146
+ }
1147
+ .sb-control-elem-ctn[data-disabled="true"] .sb-control-checkbox{
1148
+ background: #D0D1D7!important;
1149
+ border-color: #c1c1c1!important;
1150
+ }
1151
+ .sb-control-elem-ctn[data-disabled="true"] .sb-control-toggle-elm{
1152
+ background: #e5e6e7!important;
1153
+ }
1154
+ .sb-control-elem-ctn[data-disabled="true"] .sb-control-toggle-elm{
1155
+ border-color: #c1c1c1!important;
1156
+ }
1157
+ .sb-control-elem-ctn[data-disabled="true"] .sb-control-toggle-elm[data-active="true"]{
1158
+ border-top: 0px;
1159
+ }
1160
+ .sb-control-elem-ctn[data-disabled="true"] .sb-control-toggle-elm .sb-control-toggle-deco{
1161
+ border-color: #bbb!important;
1162
+ }
1163
+ .sb-control-elem-ctn[data-disabled="true"] .sb-control-toggle-elm[data-active="true"] .sb-control-toggle-deco{
1164
+ border-color: #8C8F9A!important;
1165
+
1166
+ }
1167
+ #sbi-builder-app .sbi-fb-srcs-item .sbi-fb-srcs-item-inf .sbi-fb-srcs-item-name span {
1168
+ max-height: 30px;
1169
+ display: block;
1170
+ overflow: hidden;
1171
+ line-height: 1.1;
1172
+ padding-bottom:1px;
1173
+ color: #141B38;
1174
+ }
1175
+
1176
+ #sbi-builder-app .sbi-fb-srcs-item:hover{
1177
+ border-color: #86D0F9;
1178
+ }
1179
+ #sbi-builder-app .sbi-fb-srcs-item[data-active="true"]{
1180
+ border-color: #0096cc;
1181
+ }
1182
+
1183
+ .sbi-fb-source-top .sbi-fb-srcs-item{
1184
+ margin-bottom: 0px;
1185
+ }
1186
+ #sbi-builder-app .sbi-fb-srcs-new{
1187
+ display: flex;
1188
+ justify-content: center;
1189
+ align-items: center;
1190
+ background: #EBF5FF;
1191
+ border: 1px solid #EBF5FF;
1192
+ }
1193
+ #sbi-builder-app .sbi-fb-srcs-new span{
1194
+ margin-left: 13px;
1195
+ color: #0096CC;
1196
+ }
1197
+ .sbi-fb-srcs-new i{
1198
+ font-size: 14px;
1199
+ padding: 0 10px;
1200
+ margin-left: -10px;
1201
+ }
1202
+ .sbi-fb-srcs-item-chkbx{
1203
+ width: 40px;
1204
+ height: inherit;
1205
+ display: flex;
1206
+ justify-content: center;
1207
+ align-items: center;
1208
+ margin: 0 16px 0 7px;
1209
+ }
1210
+
1211
+ .sbi-fb-srcs-item-chkbx-ic,.sbi-fb-chbx-round{
1212
+ width: 16px;
1213
+ height: 16px;
1214
+ box-sizing: border-box;
1215
+ position: relative;
1216
+ border-radius: 50px;
1217
+ border: 2px solid #8c8f9a;
1218
+ }
1219
+ [data-source="active"] .sbi-fb-srcs-item-chkbx-ic{
1220
+ border-radius: 2px;
1221
+ }
1222
+
1223
+ [data-active="true"] .sbi-fb-srcs-item-chkbx-ic, [data-active="true"] > .sbi-fb-chbx-round, .sbi-fb-source-popup [data-active="true"] > .sbi-fb-chbx-round{
1224
+ border-color: #0096cc;
1225
+ background: #0096cc;
1226
+ }
1227
+ [data-source="active"] [data-active="true"] .sbi-fb-srcs-item-chkbx-ic:before{
1228
+ content: ''!important;
1229
+ position: absolute!important;
1230
+ width: 8px!important;
1231
+ height: 3px!important;
1232
+ border-left: 2px solid #fff;
1233
+ border-bottom: 2px solid #fff;
1234
+ top: 2px!important;
1235
+ right: 1px!important;
1236
+ left: unset!important;
1237
+ background: unset!important;
1238
+ border-radius: unset!important;
1239
+ -webkit-transform: rotate(-45deg);
1240
+ transform: rotate(-45deg);
1241
+ }
1242
+
1243
+ [data-multifeed="inactive"] [data-active="true"] .sbi-fb-srcs-item-chkbx-ic:before, [data-active="true"] > .sbi-fb-chbx-round:before,
1244
+ .sbi-fb-source-popup .sbi-fb-source-list [data-active="true"] .sbi-fb-srcs-item-chkbx-ic:before,
1245
+ .sbi-fb-section-videos [data-active="true"] .sbi-fb-srcs-item-chkbx-ic:before{
1246
+ content: '';
1247
+ position: absolute;
1248
+ height: 6px;
1249
+ width: 6px;
1250
+ background: #fff;
1251
+ border-radius: 25px;
1252
+ left: 3px;
1253
+ top: 3px;
1254
+ }
1255
+
1256
+ .sbi-fb-sources-empty-ctn{
1257
+ padding: 24px 32px 28px 24px;
1258
+ background: #F9F9FA;
1259
+ border: 1px dashed #DCDDE1;
1260
+ margin-top: 10px;
1261
+ display: flex;
1262
+ align-items: center;
1263
+ }
1264
+
1265
+ .sbi-fb-sources-empty-txt{
1266
+ font-style: normal;
1267
+ font-weight: normal;
1268
+ font-size: 16px;
1269
+ line-height: 160%;
1270
+ color: #141B38;
1271
+ }
1272
+ .sbi-fb-sources-empty-btn-ctn{
1273
+ margin-left: auto;
1274
+ }
1275
+ .sb-addsources-btn{
1276
+ color: #fff;
1277
+ height: 27px;
1278
+ padding: 9px 23px;
1279
+ }
1280
+ .sb-addsources-btn svg{
1281
+ margin-right: 10px;
1282
+ fill: currentColor;
1283
+ width: 14px;
1284
+ height: 14px;
1285
+ }
1286
+ .sbi-fb-mr-feeds,.sbi-fb-section-wh{
1287
+ margin-top: 8px;
1288
+ background: #fff;
1289
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
1290
+ display: flex;
1291
+ align-items: center;
1292
+ }
1293
+ .sbi-fb-mr-fd-img {
1294
+ float: left;
1295
+ margin-right: 6%;
1296
+ width: 28%;
1297
+ line-height: 0;
1298
+ }
1299
+ .sbi-fb-mr-fd-img img{
1300
+ width: 100%;
1301
+ }
1302
+
1303
+ .sbi-fb-mr-fd-heading{
1304
+ font-weight:600;
1305
+ font-size: 18px;
1306
+ line-height: 1.7em;
1307
+ margin-bottom: 24px;
1308
+ float: left;
1309
+ }
1310
+ .sbi-fb-mr-fd-list{
1311
+ margin-bottom: 10px;
1312
+ width: 100%;
1313
+ float: left;
1314
+ }
1315
+ .sbi-fb-mr-fd-item{
1316
+ box-sizing: border-box;
1317
+ position: relative;
1318
+ float: left;
1319
+ border: 1px solid #DCDDE1;
1320
+ border-radius: 2px;
1321
+ margin-right: 8px;
1322
+ height: 38px;
1323
+ width: 160px;
1324
+ color: #141B38;
1325
+ font-size: 14px;
1326
+ font-weight:600;
1327
+ text-transform: capitalize;
1328
+ display: flex;
1329
+ justify-content: center;
1330
+ align-items: center;
1331
+ transition: all .15s ease-in-out;
1332
+ }
1333
+ .sbi-icon-platform-wrap {
1334
+ width: 100%;
1335
+ display: flex;
1336
+ justify-content: left;
1337
+ align-items: center;
1338
+ margin-left: 13px;
1339
+ }
1340
+
1341
+ .sbi-fb-mr-fd-ic {
1342
+ margin-right: 9px;
1343
+ }
1344
+ .sbi-fb-mr-fd-ic svg{
1345
+ height: 16px;
1346
+ fill: currentColor;
1347
+ float: left;
1348
+ }
1349
+ .sbi-fb-mr-fd-ch{
1350
+ position: absolute;
1351
+ right:14px;
1352
+ }
1353
+ #sbi-builder-app .sbi-fb-mr-fd-heading h3 {
1354
+ margin-bottom: 21px;
1355
+ max-width: 385px;
1356
+ }
1357
+
1358
+
1359
+
1360
+ /*Embed Popup*/
1361
+ .sbi-fb-embed-step-1{
1362
+ margin-top: 36px;
1363
+ }
1364
+
1365
+ .sbi-fb-embed-step-1 > div{
1366
+ padding: 0 20px;
1367
+ }
1368
+ .sbi-fb-embed-step-1-top{
1369
+ padding-bottom: 53px!important;
1370
+ border-bottom: 1px solid #E8E8EB;
1371
+ margin-bottom: 42px;
1372
+ }
1373
+ #sbi-builder-app .sbi-fb-embed-step-1 h4{
1374
+ margin-bottom: 12px;
1375
+ }
1376
+ .sbi-fb-embed-input-ctn{
1377
+ display: flex;
1378
+ }
1379
+ .sbi-fb-embed-input-ctn input,
1380
+ .sbi-fb-embed-input-ctn input[type="text"]{
1381
+ position: relative;
1382
+ font-style: normal;
1383
+ font-weight: normal;
1384
+ font-size: 16px;
1385
+ line-height: 160%;
1386
+ color: #141B38;
1387
+ height: 44px;
1388
+ width: 77%;
1389
+ box-sizing: border-box;
1390
+ border-radius: 0px;
1391
+ border: 1px solid #D0D1D7!important;
1392
+ border-right: 0px!important;
1393
+
1394
+ }
1395
+ .sbi-fb-embed-input-ctn input:focus, .sbi-fb-embed-input-ctn .sbi-fb-hd-btn:focus{
1396
+ box-shadow: none!important;
1397
+ outline: none!important
1398
+ }
1399
+ .sbi-fb-embed-input-ctn .sbi-fb-hd-btn{
1400
+ width: 23%;
1401
+ border-bottom-left-radius: 0px;
1402
+ border-top-left-radius: 0px;
1403
+ }
1404
+ .sbi-fb-embed-input-ctn svg{
1405
+ width: 17px;
1406
+ fill: currentColor;
1407
+ float: left;
1408
+ margin-right: 10px;
1409
+ }
1410
+ .sbi-fb-embed-step-1-bottom h4{
1411
+ text-align: center;
1412
+ }
1413
+ .sbi-fb-embed-btns-ctn{
1414
+ display: grid;
1415
+ grid-template-columns: 49% 49%;
1416
+ grid-column-gap: 2%;
1417
+ margin-top: 14px;
1418
+ margin-bottom: 60px;
1419
+ }
1420
+ .sbi-fb-embed-btn{
1421
+ cursor: pointer;
1422
+ width: 100%;
1423
+ height: 50px;
1424
+ background: #F3F4F5;
1425
+ border-radius: 2px;
1426
+ border: 1px solid #DCDDE1;
1427
+ display: flex;
1428
+ align-items: center;
1429
+ justify-content: space-between;
1430
+ box-sizing: border-box;
1431
+ padding: 0 20px;
1432
+ position: relative;
1433
+ color: #141B38;
1434
+ font-size: 16px;
1435
+ font-weight: 500;
1436
+ }
1437
+ .sbi-fb-embed-btn .sb-icon-label svg{
1438
+ fill: currentColor;
1439
+ width: 18px;
1440
+ margin-right: 10px;
1441
+ float: left;
1442
+ }
1443
+ .sbi-fb-embed-popup .sb-embed-breadcrumb {
1444
+ display: flex;
1445
+ align-items: center;
1446
+ padding: 25px 30px 0;
1447
+ margin-bottom: 2px;
1448
+ }
1449
+ .sb-embed-breadcrumb a {
1450
+ font-style: normal;
1451
+ font-weight: bold;
1452
+ font-size: 10px;
1453
+ line-height: 160%;
1454
+ letter-spacing: 0.08em;
1455
+ text-transform: uppercase;
1456
+ color: #434960;
1457
+ cursor: pointer;
1458
+ }
1459
+ .sb-embed-breadcrumb a:hover {
1460
+ color: #141B38;
1461
+ }
1462
+ .sb-embed-breadcrumb svg {
1463
+ margin-right: 8px;
1464
+ }
1465
+ .sbi-fb-embed-step-2 > div{
1466
+ padding: 0 29px;
1467
+ }
1468
+
1469
+ .sb-customizer-sidebar-cache-wrapper{
1470
+ margin-top: 20px;
1471
+ padding: 0 20px;
1472
+ }
1473
+ .sbi-fb-embed-step-2-list{
1474
+ margin-top: 25px;
1475
+ border-top: 1px solid #DCDDE1;
1476
+ padding-top: 14px !important;
1477
+ }
1478
+ .sbi-fb-embed-step-2-list > strong{
1479
+ text-transform: uppercase;
1480
+ font-size: 12px;
1481
+ color: #434960;
1482
+ margin-bottom: 10px;
1483
+ }
1484
+ .sbi-fb-embed-step-2-pages{
1485
+ margin-top: 8px;
1486
+ height: 250px;
1487
+ overflow: auto;
1488
+ }
1489
+ .sbi-fb-embed-step-2-pages .sb-control-toggle-icon svg {
1490
+ width: 11px;
1491
+ }
1492
+ .sbi-fb-embed-step-2-action{
1493
+ padding: 10px 34px 10px 30px !important;
1494
+ background: #F3F4F5;
1495
+ box-shadow: 0px -4px 5px rgba(0, 0, 0, 0.1);
1496
+ }
1497
+ .sbi-fb-embed-step-2-action a{
1498
+ color: #fff;
1499
+ }
1500
+ .sbi-fb-embed-step-2-action a[data-active="false"]{
1501
+ opacity: .75;
1502
+ }
1503
+
1504
+ /*Dialog Popup*/
1505
+ .sbi-fb-dialog-remove-source{
1506
+ background: #F3F4F5;
1507
+ padding: 40px 20px;
1508
+ display: flex;
1509
+ justify-content: center;
1510
+ align-items: center;
1511
+ }
1512
+ .sbi-fb-dialog-remove-source .sbi-fb-srcs-item{
1513
+ background: #fff;
1514
+ width: 280px;
1515
+ padding-left: 20px;
1516
+ box-sizing: border-box;
1517
+ margin-top: 0px;
1518
+ }
1519
+ .sbi-fb-srcs-item-remove{
1520
+ position: absolute;
1521
+ width: 35px;
1522
+ height: 35px;
1523
+ border-radius: 50px;
1524
+ background: #fff;
1525
+ border:1px solid #E7E7E9;
1526
+ z-index: 3;
1527
+ right: -13px;
1528
+ bottom: -13px;
1529
+ display: flex;
1530
+ justify-content: center;
1531
+ align-items: center;
1532
+ box-shadow: 0px 26.7377px 77.2886px rgba(0, 0, 0, 0.107828), 0px 14.2952px 41.3222px rgba(0, 0, 0, 0.0894161), 0px 8.01379px 23.1649px rgba(0, 0, 0, 0.075), 0px 4.25607px 12.3027px rgba(0, 0, 0, 0.0605839), 0px 1.77104px 5.11942px rgba(0, 0, 0, 0.0421718);
1533
+ }
1534
+ .sbi-fb-srcs-item-remove svg{
1535
+ width: 12px;
1536
+ float: left;
1537
+ fill: var(--error-red);
1538
+ }
1539
+ .sbi-fb-dialog-popup-content{
1540
+ display: flex;
1541
+ justify-content: center;
1542
+ align-items: center;
1543
+ text-align: center;
1544
+ flex-direction: column;
1545
+ padding: 38px 12%;
1546
+ }
1547
+ .sbi-fb-dialog-popup-content strong{
1548
+ font-size: 22px;
1549
+ color: #141B38;
1550
+ display: block;
1551
+ margin-bottom: 15px;
1552
+ }
1553
+ .sbi-fb-dialog-popup-content span{
1554
+ font-size: 16px;
1555
+ line-height: 1.5em;
1556
+ color: #434960;
1557
+ }
1558
+ .sbi-fb-dialog-popup-actions{
1559
+ display: flex;
1560
+ justify-content: center;
1561
+ align-items: center;
1562
+ margin-top: 25px;
1563
+ }
1564
+ .sbi-fb-dialog-popup-actions button{
1565
+ width: 100%;
1566
+ margin: 4px 4px;
1567
+ cursor: pointer;
1568
+ height: 42px;
1569
+ }
1570
+
1571
+ /*
1572
+ Footer Sticky Widget
1573
+ */
1574
+ .sbi-stck-wdg{
1575
+ position: fixed;
1576
+ right: 21px;
1577
+ z-index: 9;
1578
+ bottom: 20px;
1579
+ }
1580
+ .sbi-stck-wdg-btn{
1581
+ width: 52px;
1582
+ height: 52px;
1583
+ background: #fff;
1584
+ border-radius: 50%;
1585
+ cursor: pointer;
1586
+ display: flex;
1587
+ justify-content: center;
1588
+ align-items: center;
1589
+ filter: drop-shadow(0px 9px 13px rgba(0, 0, 0, 0.2));
1590
+ }
1591
+ .sbi-stck-wdg-btn svg{
1592
+ width: 25px;
1593
+ fill: #E34F0E;
1594
+ height: 33px;
1595
+ float: left;
1596
+ }
1597
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn svg,.sbi-stck-wdg-btn-cls{
1598
+ display: none;
1599
+ }
1600
+
1601
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls,
1602
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-wdg-btn-cls svg{
1603
+ display: block;
1604
+ }
1605
+ .sbi-stck-wdg-btn-cls{
1606
+ width: inherit;
1607
+ height: inherit;
1608
+ position: relative;
1609
+ color: #364152;
1610
+ box-shadow: 0px 1px 6px rgba(0, 0, 0, .05), 0px 9px 12px rgba(0, 0, 0, .05);
1611
+ border-radius: 70px;
1612
+ }
1613
+ .sbi-stck-wdg-btn-cls svg {
1614
+ width: 14px;
1615
+ height: 14px;
1616
+ position: absolute;
1617
+ top: 50%;
1618
+ right: 0;
1619
+ bottom: 0;
1620
+ left: 50%;
1621
+ margin-top: -7px;
1622
+ margin-left: -7px;
1623
+ }
1624
+
1625
+ .sbi-stck-pop{
1626
+ position: absolute;
1627
+ width: 292px;
1628
+ height: auto;
1629
+ background: #fff;
1630
+ border: 1px solid #E2E8F0;
1631
+ box-sizing: border-box;
1632
+ box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15), 0px 3px 14px rgba(0, 0, 0, 0.12);
1633
+ border-radius: 2px;
1634
+ padding: 20px;
1635
+ right: 0px;
1636
+ bottom: 100px;
1637
+ color: #141B38;
1638
+ opacity: 0;
1639
+ padding-bottom: 82px;
1640
+ visibility: hidden;
1641
+ }
1642
+ .sbi-stck-wdg[data-active="true"] .sbi-stck-pop{
1643
+ bottom: 66px;
1644
+ opacity: 1;
1645
+ visibility: visible;
1646
+ }
1647
+
1648
+ .sbi-stck-pop svg{
1649
+ fill: currentColor;
1650
+ }
1651
+ .sbi-stck-el-list{
1652
+ border: 1px solid #DCDDE1;
1653
+ border-radius: 2px;
1654
+ }
1655
+ .sbi-stck-el{
1656
+ display: flex;
1657
+ align-items: center;
1658
+ padding: 11px 13px;
1659
+ border-bottom: 1px solid #DCDDE1;
1660
+ }
1661
+ .sbi-stck-el:hover{
1662
+ background: #F3F4F5;
1663
+ }
1664
+ .sbi-stck-el:last-of-type{
1665
+ border-bottom: 0px;
1666
+ }
1667
+ .sbi-stck-el-list .sbi-chevron svg{
1668
+ width: 5px;
1669
+ height: 8px;
1670
+ }
1671
+ .sbi-stck-el-list .sbi-stck-el-icon svg {
1672
+
1673
+ }
1674
+ .sbi-stck-el .sbi-stck-el-txt{
1675
+ color: #27303F;
1676
+ }
1677
+ .sbi-stck-el.sbi-stck-el-upgrd{
1678
+ padding: 8px 14px;
1679
+ font-size: 14px;
1680
+ background: var(--cl-orange);
1681
+ color: #fff;
1682
+ }
1683
+ .sbi-chevron {
1684
+ position: absolute;
1685
+ right: 14px
1686
+ }
1687
+ .sbi-stck-el.sbi-stck-el-upgrd .sbi-stck-el-txt{
1688
+ color: #fff;
1689
+ }
1690
+ .sbi-stck-el.sbi-stck-el-upgrd:after{
1691
+ top: 20px;
1692
+ opacity: 1;
1693
+ }
1694
+ .sbi-stck-el-icon{
1695
+ margin-right: 10px;
1696
+ }
1697
+ .sbi-stck-el-icon svg{
1698
+ width: 17px;
1699
+ float: left;
1700
+ }
1701
+ .sbi-stck-el.sbi-stck-el-upgrd svg path{
1702
+ fill: #fff!important;
1703
+ }
1704
+ #sbi-builder-app .sbi-stck-title{
1705
+ margin-top: 20px;
1706
+ margin-bottom: 10px;
1707
+ }
1708
+
1709
+ .sbi-stck-follow{
1710
+ background: #F3F4F5;
1711
+ margin-top: 20px;
1712
+ left: 0px;
1713
+ bottom: 0px;
1714
+ position: absolute;
1715
+ padding: 12px 20px;
1716
+ display: flex;
1717
+ align-items: center;
1718
+ }
1719
+ .sbi-stck-follow span{
1720
+ font-weight: 600;
1721
+ font-size: 14px;
1722
+ }
1723
+ .sbi-stck-flw-links{
1724
+ display: flex;
1725
+ justify-content: center;
1726
+ align-items: center;
1727
+ margin-left: auto;
1728
+ }
1729
+ .sbi-stck-flw-links a{
1730
+ width: 36px;
1731
+ height: 28px;
1732
+ color: inherit;
1733
+ display: inline-flex;
1734
+ justify-content: center;
1735
+ align-items: center;
1736
+ margin-left: 4px;
1737
+ border-radius: 2px;
1738
+ }
1739
+ .sbi-stck-flw-links svg{
1740
+ width: 17px;
1741
+ color: #141B38;
1742
+ }
1743
+ .sbi-stck-flw-links a:hover{
1744
+ background: #fff;
1745
+ }
1746
+ .sbi-stck-flw-links a:hover svg{
1747
+ color: inherit;
1748
+ }
1749
+
1750
+
1751
+
1752
+ /*
1753
+ Builder Footer
1754
+ */
1755
+ .sbi-bld-footer > div{
1756
+ background: #fff;
1757
+ color: #141B38;
1758
+ margin: 30px 0;
1759
+ }
1760
+ .sbi-bld-footer{
1761
+ padding-top: 0px!important
1762
+ }
1763
+ .sbi-bld-ft-content{
1764
+ display: flex;
1765
+ align-items: center;
1766
+ max-width: 1200px;
1767
+ }
1768
+ .sbi-bld-ft-img{
1769
+ float: left;
1770
+ width: 15%;
1771
+ margin-right: 5%;
1772
+ /*height: 158px;*/
1773
+ }
1774
+ .sbi-bld-ft-img svg{
1775
+ margin-bottom: -4px;
1776
+ }
1777
+ .sbi-bld-ft-txt{
1778
+ display: flex;
1779
+ justify-content: center;
1780
+ align-items: center;
1781
+ width: 59%;
1782
+ margin-right: 5%;
1783
+ }
1784
+ .sbi-bld-ft-txt strong,
1785
+ .sbi-fb-mr-fd-heading span{
1786
+ color: var(--cl-orange);
1787
+ }
1788
+ #sbi-builder-app .sbi-bld-ft-info{
1789
+ width: 44%;
1790
+ color: #434960;
1791
+ }
1792
+ #sb-footer-banner .sbi-bld-ft-title{
1793
+ width: 63%;
1794
+ margin-right: 6%;
1795
+ }
1796
+ .sbi-bld-ft-action{
1797
+ width: 17%;
1798
+ display: flex;
1799
+ justify-content: left;
1800
+ align-items: center;
1801
+ }
1802
+ .sbi-bld-ft-action svg{
1803
+ top: 14px;
1804
+ height: 10px;
1805
+ }
1806
+ @media all and (max-width: 1130px) {
1807
+ #sb-footer-banner .sbi-bld-ft-img{
1808
+ width: 17%;
1809
+ margin-right: 3%;
1810
+ }
1811
+ #sb-footer-banner .sbi-bld-ft-txt{
1812
+ display: flex;
1813
+ justify-content: center;
1814
+ align-items: center;
1815
+ width: 61%;
1816
+ margin-right: 3%;
1817
+ }
1818
+ #sbi-builder-app #sb-footer-banner h3 {
1819
+ font-size: 20px;
1820
+ }
1821
+ #sbi-builder-app #sb-footer-banner .sb-small-p {
1822
+ font-size: 13px;
1823
+ }
1824
+ #sb-footer-banner .sb-button-standard {
1825
+ font-size: 13px;
1826
+ padding-left: 16px;
1827
+ line-height: 15px;
1828
+ }
1829
+ }
1830
+
1831
+ .sbi-bld-ft-btm{
1832
+ font-size: 14px;
1833
+ display: flex;
1834
+ justify-content: center;
1835
+ align-items: center;
1836
+ padding: 15px 0px;
1837
+ border-top: 1px solid #DCDDE1;
1838
+ }
1839
+ .sbi-bld-ft-btm strong{
1840
+ padding: 0 5px;
1841
+ }
1842
+ .sbi-bld-ft-btm a{
1843
+ display: inline-block;
1844
+ padding: 0 10px;
1845
+ font-weight: 500;
1846
+ color: #0068A0;
1847
+ }
1848
+ .sbi-bld-ft-btm a i{
1849
+ font-size: 12px;
1850
+ margin-left: 5px;
1851
+ }
1852
+ .sbi-bld-ft-bns{
1853
+ display: inline-block;
1854
+ margin: 0 10px;
1855
+ padding: 5px 10px;
1856
+ border-radius: 5px;
1857
+ font-size: 14px;
1858
+ font-weight: 700;
1859
+ text-transform: uppercase;
1860
+ color: #663D00;
1861
+ background: #FFDF99;
1862
+ }
1863
+ /*
1864
+ Extensions Poup
1865
+ */
1866
+ .sbi-fb-fs-link{
1867
+ position: absolute;
1868
+ width: 100%;
1869
+ height: 100%;
1870
+ left: 0;
1871
+ top: 0;
1872
+ right: 0;
1873
+ bottom: 0;
1874
+ z-index: 1;
1875
+ }
1876
+ .sbi-fb-extensions-popup{
1877
+
1878
+ }
1879
+ .sbi-fb-extpp-top{
1880
+ display: flex;
1881
+ justify-content: center;
1882
+ align-items: center;
1883
+ height: 264px;
1884
+ background: #F3F4F5;
1885
+ }
1886
+ .sbi-fb-extpp-img{
1887
+ width: 50%;
1888
+ float: left;
1889
+ display: flex;
1890
+ justify-content: center;
1891
+ }
1892
+ .sbi-fb-extensions-popup[data-getext-view="featuredpost"] .sbi-fb-extpp-img{
1893
+ padding: 50px 0px;
1894
+ }
1895
+ .sbi-fb-extensions-popup[data-getext-view="singlealbum"] .sbi-fb-extpp-img{
1896
+ padding: 65px 0px;
1897
+ }
1898
+ .sbi-fb-extpp-social-wall .sbi-fb-extpp-top {
1899
+ display: flex;
1900
+ flex-direction: column;
1901
+ align-items: center;
1902
+ height: auto;
1903
+ padding-top: 29px;
1904
+ }
1905
+ .sbi-fb-extensions-popup[data-getext-view="socialwall"] .sbi-fb-extpp-head {
1906
+ margin: 0 0 12px;
1907
+ padding-top: 14px;
1908
+ }
1909
+ .sbi-fb-extensions-popup[data-getext-view="socialwall"] .sbi-fb-extpp-head h2 {
1910
+ font-size: 24px !important;
1911
+ line-height: 120% !important;
1912
+ }
1913
+ .sbi-fb-extpp-info{
1914
+ width: 50%;
1915
+ float: left;
1916
+ display: flex;
1917
+ justify-content: center;
1918
+ flex-direction: column;
1919
+ padding-left: 40px;
1920
+ }
1921
+ .sbi-fb-extensions-popup[data-getext-view="socialwall"] .sbi-fb-extpp-info {
1922
+ width: 40%;
1923
+ padding-right: 50px;
1924
+ }
1925
+
1926
+ .sbi-fb-extensions-popup[data-getext-view="socialwall"] .sbi-fb-extpp-lite-btn {
1927
+ margin-top: 20px;
1928
+ max-width: 270px;
1929
+ box-sizing: border-box;
1930
+ padding: 7px 11px;
1931
+ }
1932
+ .sbi-fb-extensions-popup[data-getext-view="socialwall"] .sbi-extension-bullet-list {
1933
+ grid-template-columns: 33% 33% 33%;
1934
+ }
1935
+ #sbi-builder-app .sbi-fb-extensions-popup[data-getext-view="socialwall"] .sbi-fb-extpp-head{
1936
+ margin: 0 0 9px;
1937
+ }
1938
+ #sbi-builder-app .sbi-fb-extpp-desc {
1939
+ color: #475569;
1940
+ display: flex;
1941
+ justify-content: center;
1942
+ align-items: center;
1943
+ }
1944
+ .sbi-fb-extpp-social-wall .sbi-fb-extpp-top {
1945
+ display: flex;
1946
+ flex-direction: column;
1947
+ align-items: center;
1948
+ height: auto;
1949
+ padding-top: 29px;
1950
+ }
1951
+
1952
+ .sbi-fb-extpp-info{
1953
+ width: 50%;
1954
+ float: left;
1955
+ display: flex;
1956
+ justify-content: center;
1957
+ flex-direction: column;
1958
+ padding-left: 40px;
1959
+ }
1960
+ .sbi-fb-extpp-info .sbi-fb-extpp-head,
1961
+ .sbi-fb-extpp-info .sbi-fb-extpp-desc{
1962
+ width: 100%;
1963
+ }
1964
+ #sbi-builder-app .sbi-fb-extpp-head{
1965
+ margin: 0 0 12px;
1966
+ }
1967
+ #sbi-builder-app .sbi-fb-extpp-desc {
1968
+ color: #475569;
1969
+ display: flex;
1970
+ justify-content: left;
1971
+ align-items: center;
1972
+ width: 105%;
1973
+ }
1974
+ .sbi-fb-extpp-head span{
1975
+ color: var(--cl-orange);
1976
+ }
1977
+ .sbi-fb-extpp-head span.sb-social-wall{
1978
+ color: inherit;
1979
+ font-size: 26px;
1980
+ line-height: 120% !important;
1981
+ display: inline-block;
1982
+ }
1983
+ .sbi-fb-extpp-desc .sb-social-wall {
1984
+ width: 90%;
1985
+ }
1986
+ .sbi-fb-extpp-head span{
1987
+ color: var(--cl-orange);
1988
+ }
1989
+ .sbi-fb-extpp-lite-btn{
1990
+ float: left;
1991
+ font-size: 15px;
1992
+ font-weight: 500;
1993
+ padding: 10px 20px;
1994
+ color: #0068A0;
1995
+ background: #fff;
1996
+ border: 1px solid #DCDDE1;
1997
+ margin-bottom: 14px;
1998
+ margin-top: 12px;
1999
+ align-items: center;
2000
+ }
2001
+ .sbi-fb-extpp-lite-btn svg{
2002
+ fill: currentColor;
2003
+ width: 20px;
2004
+ float: left;
2005
+ margin-right: 10px;
2006
+ }
2007
+ .sbi-fb-extpp-inc-list{
2008
+ border: 1px solid #dcdde1;
2009
+ margin-top: 10px;
2010
+ margin-bottom: 30px;
2011
+ }
2012
+ .sbi-fb-extpp-bottom-strg{
2013
+ font-size:18px;
2014
+ font-weight: 600;
2015
+ }
2016
+ .sbi-fb-extpp-inc-items{
2017
+ display: grid;
2018
+ grid-template-columns: 25% 25% 25% 25%;
2019
+ }
2020
+ .sbi-fb-extpp-inc-item, .sbi-fb-extpp-inc-item-bottom{
2021
+ position: relative;
2022
+ height: 50px;
2023
+ display: flex;
2024
+ justify-content: center;
2025
+ align-items: center;
2026
+ border-right: 1px solid #dcdde1;
2027
+ border-bottom: 1px solid #dcdde1;
2028
+ font-size: 14px;
2029
+ }
2030
+ .sbi-fb-extpp-inc-item-bottom{
2031
+ border: 0px !important;
2032
+ }
2033
+ .sbi-fb-extpp-inc-item:last-of-type{
2034
+ border-right: 0px;
2035
+ }
2036
+ .sbi-fb-extpp-inc-item svg, .sbi-fb-extpp-inc-item-bottom svg{
2037
+ width: 17px; margin-right: 10px; fill: currentColor; float: left;
2038
+ }
2039
+ .sbi-fb-extpp-bottom{
2040
+ padding: 20px 40px;
2041
+ background: #fff;
2042
+ }
2043
+ .sbi-extension-bullet-list {
2044
+ display: grid;
2045
+ grid-template-columns: 33% 33% 33%;
2046
+ grid-column-gap: 2%;
2047
+ margin-top: 12px;
2048
+ margin-bottom: 40px;
2049
+ }
2050
+ .sbi-extension-single-bullet {
2051
+ display: flex;
2052
+ justify-content: flex-start;
2053
+ align-items: center;
2054
+ margin: 4px 0;
2055
+ }
2056
+ #sbi-builder-app .sbi-extension-single-bullet span {
2057
+ color: #434960;
2058
+ }
2059
+
2060
+ .sbi-extension-single-bullet svg {
2061
+ margin-right: 12px;
2062
+ }
2063
+ .sbi-fb-extpp-btns{
2064
+ display: grid;
2065
+ grid-template-columns: 100%;
2066
+ grid-column-gap: 1%;
2067
+ }
2068
+ .sbi-fb-extpp-btns div{
2069
+ height: 38px;
2070
+ cursor: pointer;
2071
+ position: relative;
2072
+ border-radius: 3px;
2073
+ font-style: normal;
2074
+ font-weight: 600;
2075
+ font-size: 14px;
2076
+ line-height: 160%;
2077
+ display: flex;
2078
+ justify-content: center;
2079
+ align-items: center;
2080
+ box-sizing: border-box;
2081
+ }
2082
+ .sbi-fb-extpp-get-btn{
2083
+ color: #fff;
2084
+ background: var(--cl-orange);
2085
+ }
2086
+ .sbi-fb-extpp-demo-btn{
2087
+ border: 2px solid #DCDDE1;
2088
+ background: #F3F4F5;
2089
+ }
2090
+
2091
+ /*
2092
+ Feed Type Creation Process : Single Album;
2093
+ */
2094
+ .sbi-fb-section-wh-insd{
2095
+ display: flex;
2096
+ }
2097
+ .sbi-fb-sglelm-inp-ctn{
2098
+ margin-top: 100px;
2099
+ }
2100
+
2101
+ .sbi-fb-sglelm-inp-ctn input[type="text"]{
2102
+ height: 44px;
2103
+ }
2104
+ .sbi-fb-section-wh.sbi-fb-sglelm-ctn {
2105
+ padding: 20px 21px 24px 30px;
2106
+ }
2107
+ .sbi-fb-section-wh.sbi-fb-sglelm-ctn .sbi-fb-section-wh-insd {
2108
+ padding: 0;
2109
+ }
2110
+ .sbi-fb-sglelm-inp-ctn input[type="text"]::placeholder{
2111
+ font-style: normal;
2112
+ font-weight: normal;
2113
+ font-size: 16px;
2114
+ line-height: 160%;
2115
+ color: #8C8F9A;
2116
+ }
2117
+ .sbi-fb-sglelm-error-icon{
2118
+ width: 23px;
2119
+ height: 23px;
2120
+ background: var(--error-red);
2121
+ font-family: monospace;
2122
+ font-weight: 900;
2123
+ color: #fff;
2124
+ font-size: 15px;
2125
+ position: absolute;
2126
+ right: 10px;
2127
+ top: 10px;
2128
+ z-index: 999999999999999999;
2129
+ border-radius: 50px;
2130
+ display: flex;
2131
+ justify-content: center;
2132
+ align-items: center;
2133
+ }
2134
+ .sbi-fb-sglelm-errormsg{
2135
+ color: var(--error-red);
2136
+ font-weight: 800;
2137
+ }
2138
+ .sbi-fb-sglelm-inp-ctn .sbi-fb-wh-inp{
2139
+ margin-bottom: 10px;
2140
+ }
2141
+ .sbi-fb-sglelm-left{
2142
+ padding-right: 100px;
2143
+ }
2144
+ .sbi-fb-sglelm-img-ctn{
2145
+ background:#E8E8EB;
2146
+ height: 350px;
2147
+ display: flex;
2148
+ justify-content: center;
2149
+ align-items: center;
2150
+ text-align: center;
2151
+ flex-direction: column;
2152
+ padding: 100px 50px;
2153
+ border: 1px solid #D0D1D7;
2154
+ box-sizing: border-box;
2155
+ }
2156
+ .sbi-fb-sglelm-img-ctn.sbi-fb-sglelm-img-pf{
2157
+ padding: 100px 35px;
2158
+ }
2159
+ .sbi-fb-sglelm-img-ctn strong{
2160
+ font-size: 16px;
2161
+ color: #434960;
2162
+ margin-bottom: 8px;
2163
+ margin-top: 30px;
2164
+ }
2165
+ .sbi-fb-sglelm-img-ctn span{
2166
+ font-size: 14px;
2167
+ line-height:1.6em;
2168
+ color: #8C8F9A;
2169
+ }
2170
+ .sbi-fb-sglelm-right{
2171
+ width: 445px
2172
+ }
2173
+ .sbi-fb-sglelm-img-errorctn span{
2174
+ padding: 0 20px;
2175
+ color: #434960;
2176
+ font-size: 20px;
2177
+ margin-top: 30px;
2178
+ line-height: 1.2em;
2179
+ }
2180
+ .sbi-fb-sglelm-preview{
2181
+ height: 375px;
2182
+ background-color: #141B38;
2183
+ background-position: center center;
2184
+ background-size: cover;
2185
+ display: flex;
2186
+ justify-content: center;
2187
+ align-items: flex-end;
2188
+ color: #fff;
2189
+ }
2190
+ .sbi-fb-sglelm-preview:after{
2191
+ content: '';
2192
+ position: absolute;
2193
+ width: 100%; height: 100%;
2194
+ background-image: linear-gradient(to bottom, rgba(0,0,0,0) , rgba(0,0,0,.5));
2195
+ }
2196
+ .sbi-fb-sglelm-prev-info{
2197
+ width: 100%;
2198
+ padding: 20px 30px;
2199
+ padding-bottom: 40px;
2200
+ display: flex;
2201
+ justify-content: center;
2202
+ align-items: center;
2203
+ text-align: center;
2204
+ flex-direction: column;
2205
+ z-index: 2;
2206
+ }
2207
+ .sbi-fb-sglelm-prev-info strong{
2208
+ font-size: 18px;
2209
+ margin-bottom: 5px;
2210
+ }
2211
+ .sbi-fb-sglelm-prev-info span{
2212
+ font-size: 16px;
2213
+ line-height: 1.7em;
2214
+ }
2215
+
2216
+
2217
+ /*
2218
+ Feeds List
2219
+ */
2220
+ #sbi-builder-app .sbi-fb-select,
2221
+ #sbi-builder-app .sbi-fb-select:hover,
2222
+ #sbi-builder-app .sbi-fb-select:focus{
2223
+ border-radius: 0px!important;
2224
+ border: 1px solid #D0D1D7!important;
2225
+ outline: unset!important;
2226
+ float: left;
2227
+ min-height: auto;
2228
+ padding: 6px 31px 6px 8px;
2229
+ background: #fff url("data:image/svg+xml,%3Csvg width='10' height='5' viewBox='0 0 10 5' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.833252 0.333252L4.99992 4.49992L9.16658 0.333252H0.833252Z' fill='%238C8F9A'/%3E%3C/svg%3E%0A") no-repeat right 13px top 55%;
2230
+ background-size: 10px 6px;
2231
+ }
2232
+ .sbi-fd-lst-bulk-ctn > *{
2233
+ float: left;
2234
+ margin-right: 10px;
2235
+ }
2236
+ .sbi-fd-lst-bulk-ctn{
2237
+ margin-bottom: 8px;
2238
+ }
2239
+ .sbi-fd-lst-pagination-ctn{
2240
+ float: right;
2241
+ display: flex;
2242
+ align-items: center;
2243
+ margin-top: 10px;
2244
+ }
2245
+ .sbi-fd-lst-pgnt-btn{
2246
+ height: 30px;
2247
+ padding: 0 8px;
2248
+ cursor: pointer;
2249
+ border-radius: 3px;
2250
+ }
2251
+ .sbi-fd-lst-pgnt-info{
2252
+ display: inline-block;
2253
+ padding: 0 3px;
2254
+ }
2255
+ .sbi-fd-lst-count{
2256
+ margin-right: 10px;
2257
+ }
2258
+ .sbi-feeds-list table{
2259
+ width: 100%;
2260
+ text-align: left;
2261
+ border-spacing: 0px;
2262
+ box-sizing: border-box;
2263
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
2264
+ background: #fff;
2265
+ }
2266
+
2267
+ .sbi-feeds-list table a{
2268
+ cursor: pointer;
2269
+ }
2270
+ .sbi-fd-lst-tbody tr:nth-child(odd){
2271
+ background: #F3F4F5;
2272
+ }
2273
+ .sbi-fd-lst-tbody tr td{
2274
+ position: relative;
2275
+ vertical-align: top;
2276
+ padding: 12px 5px;
2277
+ font-size: 16px;
2278
+ }
2279
+ .sbi-feeds-list table tr td:first-child {
2280
+ width: 30px;
2281
+ }
2282
+ .sbi-fd-lst-thtf{
2283
+ background: #fff;
2284
+ }
2285
+ .sbi-fd-lst-thtf th, .sbi-fd-lst-thtf td{
2286
+ padding: 6px 5px;
2287
+ }
2288
+ .sbi-fd-lst-thtf th{
2289
+ border-bottom: 1px solid #DCDDE1;
2290
+ }
2291
+ .sbi-fd-lst-thtf td{
2292
+ border-top: 1px solid #DCDDE1;
2293
+ }
2294
+ .sbi-fd-lst-chkbx{
2295
+ width: 11px;
2296
+ height: 11px;
2297
+ position: relative;
2298
+ border-radius: 2px;
2299
+ border: 1px solid #97A6BA;
2300
+ background: #fff;
2301
+ cursor: pointer;
2302
+ margin-left: 10px;
2303
+ }
2304
+ tbody .sbi-fd-lst-chkbx {
2305
+ position: absolute;
2306
+ top: 15px;
2307
+ left: 5px;
2308
+ bottom: 0;
2309
+ right: 0;
2310
+ }
2311
+ .sbi-fd-lst-thtf .sbi-fd-lst-chkbx{
2312
+ width: 11px;
2313
+ height: 11px;
2314
+ border: 1px solid #D8DADD;
2315
+ }
2316
+ .sbi-fd-lst-chkbx[data-active="true"]{
2317
+ background: var(--customizer-blue);
2318
+ border-color: var(--customizer-blue)!important;
2319
+ }
2320
+ .sbi-fd-lst-chkbx[data-active="true"]:before{
2321
+ content: '';
2322
+ position: absolute;
2323
+ width: 6px;
2324
+ height: 3px;
2325
+ left: 2px;
2326
+ top: 2px;
2327
+ border-bottom: 2px solid #fff;
2328
+ border-left: 2px solid #fff;
2329
+ -webkit-transform: rotate(-45deg);
2330
+ transform: rotate(-45deg);
2331
+ }
2332
+
2333
+
2334
+ .sbi-fd-lst-name{
2335
+ font-size: 17px;
2336
+ font-weight:500;
2337
+ color: #0068A0!important;
2338
+ }
2339
+ .sbi-fd-lst-type{
2340
+ display: block;
2341
+ text-transform: capitalize;
2342
+ }
2343
+ .sb-instances-cell {
2344
+ margin-top: 4px;
2345
+ }
2346
+ .sbi-fd-lst-btn{
2347
+ width: 21px;
2348
+ height: 21px;
2349
+ display: inline-flex;
2350
+ justify-content: center;
2351
+ align-items: center;
2352
+ margin: 0 4px;
2353
+ cursor: pointer;
2354
+ color: #141B38;
2355
+ border-radius: 2px;
2356
+ border: 1px solid #D8DADD;
2357
+ -webkit-transition: all .2s ease-in-out;
2358
+ transition: all .2s ease-in-out;
2359
+ background: #fff;
2360
+ }
2361
+ .sbi-fd-lst-btn svg {
2362
+ height: 13px;
2363
+ }
2364
+ .sbi-fd-lst-actions .sbi-fd-lst-btn,
2365
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-btn{
2366
+ box-sizing: border-box;
2367
+ width: 36px;
2368
+ height: 32px;
2369
+ background: transparent;
2370
+ }
2371
+ .sbi-fd-lst-actions .sbi-fd-lst-btn {
2372
+ margin: 0 4px 0 0;
2373
+ }
2374
+ .sbi-fd-lst-actions .sbi-fd-lst-btn:last-child {
2375
+ margin: 0;
2376
+ }
2377
+ .sbi-fd-lst-actions .sbi-fd-lst-btn svg {
2378
+ width: 12px;
2379
+ height: 16px;
2380
+ }
2381
+ .sbi-fd-lst-btn-delete{
2382
+ color: #D72C2C;
2383
+ border-color: #FBD5D5;
2384
+ }
2385
+ .sbi-fd-lst-btn svg{
2386
+ fill: currentColor;
2387
+ width: 14px;
2388
+ float: left;
2389
+ }
2390
+ .sbi-fd-lst-actions .sbi-fd-lst-btn:hover svg,
2391
+ .sbi-feedtype-section .sbi-fd-lst-btn-delete:hover svg{
2392
+ color: #fff;
2393
+ }
2394
+ .sbi-fd-lst-actions .sbi-fd-lst-btn:hover{
2395
+ background: #0096CC;
2396
+ border-color: #0096CC;
2397
+ }
2398
+ .sbi-fd-lst-actions .sbi-fd-lst-btn-delete:hover, .sbi-feedtype-section .sbi-fd-lst-btn-delete:hover{
2399
+ background: #D72C2C;
2400
+ border-color: #D72C2C;
2401
+ }
2402
+ .sbi-fd-lst-dimmed .sbi-fd-lst-btn, .sbi-fd-lst-dimmed .sbi-fd-lst-btn:hover{
2403
+ background: #F3F4F5!important;
2404
+ border-color:#D8DADD!important;
2405
+ color: #8C8F9A!important;
2406
+ }
2407
+ .sbi-fd-lst-dimmed .sbi-fd-lst-btn:hover svg{
2408
+ color: #8C8F9A!important;
2409
+ }
2410
+
2411
+ .sbi-fb-tltp-parent{
2412
+ position: relative;
2413
+ }
2414
+ .sbi-fb-view-instances[data-active="true"]{
2415
+ font-weight: 600;
2416
+ text-decoration: underline;
2417
+ cursor: pointer;
2418
+ line-height: 1em;
2419
+ }
2420
+ .sbi-fb-tltp-elem{
2421
+ position: absolute;
2422
+ color: #fff;
2423
+ background: #434960;
2424
+ font-size: 14px;
2425
+ padding: 7px 10px;
2426
+ border-radius: 3px;
2427
+ font-weight:500;
2428
+ z-index: 9;
2429
+ text-align: center;
2430
+ opacity: 0;
2431
+ visibility: hidden;
2432
+ top: calc(-100% - 30px);
2433
+ left: 50%;
2434
+ -webkit-transform: translateX(-50%);
2435
+ transform: translateX(-50%);
2436
+ -webkit-transition: all .2s ease-in-out;
2437
+ transition: all .2s ease-in-out;
2438
+ }
2439
+ .sbi-fb-tltp-elem span{
2440
+ position: relative; z-index: 3;
2441
+ }
2442
+ .sbi-fb-tltp-elem:after{
2443
+ content: '';
2444
+ position: absolute;
2445
+ height: 10px;
2446
+ width: 10px;
2447
+ bottom: -5px;
2448
+ left: calc(50% - 5px);
2449
+ background: #434960;
2450
+ transform: rotate(-45deg);
2451
+ }
2452
+ .sbi-fb-tltp-parent:hover .sbi-fb-tltp-elem {
2453
+ top: calc(-100% - 20px);
2454
+ opacity: 1;
2455
+ visibility: visible;
2456
+ }
2457
+ .sbi-fd-lst-shortcode-cp{
2458
+ margin-left: 10px;
2459
+ }
2460
+ .sbi-fd-lst-act-th{
2461
+ width: 190px;
2462
+ max-width: 190px;
2463
+ }
2464
+
2465
+ /*
2466
+ Feed Instance Popup
2467
+ */
2468
+ .sbi-fb-popup-feedinst .sbi-fb-source-top{
2469
+ display: flex;
2470
+ align-items: center;
2471
+ }
2472
+ .sbi-fb-popup-feedinst h5{
2473
+ margin-bottom: 0px;
2474
+ float: left;
2475
+ font-size: 27px;
2476
+ }
2477
+ .sbi-fb-fdinst-type{
2478
+ padding: 5px 5px;
2479
+ background: #E8E8EB;
2480
+ margin-left: 12px;
2481
+ float: left;
2482
+ }
2483
+ .sbi-fb-inst-tbl-ctn{
2484
+ padding: 0 23px 63px;
2485
+ }
2486
+ .sbi-fb-inst-tbl-ctn table{
2487
+ width: 100%;
2488
+ border-spacing: unset;
2489
+ box-sizing: border-box;
2490
+ border: 1px solid #DCDDE1;
2491
+ text-align: left;
2492
+ }
2493
+ .sbi-fb-inst-tbl-ctn tfoot,.sbi-fb-inst-tbl-ctn thead{
2494
+ background: #F3F4F5
2495
+ }
2496
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf th, .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf td{
2497
+ font-size: 13px;
2498
+ color: #364152;
2499
+ padding: 13px 10px;
2500
+ }
2501
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-tbody tr:nth-child(odd){
2502
+ background: #fff;
2503
+ }
2504
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-tbody tr:nth-child(even){
2505
+ background: #F3F4F5;
2506
+ }
2507
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf tr th,
2508
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-thtf tr td{
2509
+ padding: 4px 20px;
2510
+ }
2511
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-tbody tr td{
2512
+ padding: 11px 20px;
2513
+ }
2514
+ .sbi-fb-inst-tbl-ctn .sbi-fd-lst-name{
2515
+ font-size: 14px;
2516
+ }
2517
+ .sbi-fb-inst-tbl-shrtc{
2518
+ display: flex;
2519
+ align-items: center;
2520
+ }
2521
+
2522
+ .sbi-fd-inst-btn{
2523
+ width: 10px;
2524
+ height: 10px;
2525
+ box-sizing: border-box;
2526
+ border-right: 3px solid #8C8F9A;
2527
+ border-top: 3px solid #8C8F9A;
2528
+ cursor: pointer;
2529
+ -webkit-transform: rotate(45deg);
2530
+ transform: rotate(45deg);
2531
+ }
2532
+
2533
+ /*Legacy Feeds */
2534
+ .sbi-fb-lgc-top-new{
2535
+ color: #141B38;
2536
+ background: #fff;
2537
+ margin: 10px 0px;
2538
+ padding: 15px 20px;
2539
+ display: flex;
2540
+ justify-content: center;
2541
+ align-items: center;
2542
+ font-size: 14px;
2543
+ font-weight: 600;
2544
+ }
2545
+ .sbi-fb-lgc-gr{
2546
+ font-size: 12px;
2547
+ text-transform: uppercase;
2548
+ font-weight: 500;
2549
+ background: #59AB46;
2550
+ color: #fff;
2551
+ margin-right: 10px;
2552
+ padding: 6px 10px;
2553
+ border-radius: 2px;
2554
+ line-height: 1em;
2555
+ }
2556
+ .sbi-fb-lgc-inf-ctn{
2557
+ background: #fff;
2558
+ padding: 0 20px;
2559
+ display: flex;
2560
+ align-items: center;
2561
+ height: 58px;
2562
+ }
2563
+ .sbi-fb-lgc-inf-ctn > h4{
2564
+ margin-right: 10px!important;
2565
+ }
2566
+
2567
+ .sbi-fb-lgc-inf-ctn > *{
2568
+ float: left;
2569
+ display: inline-block;
2570
+ position: relative;
2571
+ }
2572
+ #sbi-builder-app .sbi-fb-lgc-inf-ctn > h4{
2573
+ margin-right: 14px;
2574
+ margin-bottom: 0;
2575
+ }
2576
+ #sbi-builder-app .sbi-fb-lgc-btn-stg{
2577
+ display: flex;
2578
+ margin-left: auto;
2579
+ }
2580
+ .sbi-fd-legacy-feed-toggle{
2581
+ height: 34px;
2582
+ display: flex;
2583
+ justify-content: center;
2584
+ align-items: center;
2585
+ background: #E2F5FF;
2586
+ color:#0068A0;
2587
+ cursor: pointer;
2588
+ font-weight: 600;
2589
+ font-size: 14px;
2590
+ line-height: 160%;
2591
+ }
2592
+ .sbi-fd-legacy-feed-toggle:hover {
2593
+ background: #BFE8FF;
2594
+ }
2595
+ .sbi-fd-legacy-feed-toggle span{
2596
+ display: inline-block;
2597
+ position: relative;
2598
+ padding-right: 20px;
2599
+ margin-left: -20px;
2600
+ }
2601
+ .sbi-fd-legacy-feed-toggle[data-active="true"] span:after{
2602
+ -webkit-transform: rotate(-225deg);
2603
+ transform: rotate(-225deg);
2604
+ top: 7px;
2605
+ }
2606
+ .sbi-feeds-list .sbi-legacy-table-wrap table{
2607
+ box-shadow: none;
2608
+ border-top: 1px solid #DCDDE1;
2609
+ }
2610
+ .sbi-fb-lgc-ctn{
2611
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, 0.05);
2612
+ margin-bottom: 20px;
2613
+ }
2614
+
2615
+ .sbi-fb-onbrd-infotxt{
2616
+ display: flex;
2617
+ align-items: center;
2618
+ }
2619
+ .sbi-fb-onbrd-infotxt svg{
2620
+ fill: currentColor;
2621
+ width: 16px;
2622
+ display: inline-block;
2623
+ margin-left: 10px;
2624
+ float: left;
2625
+ }
2626
+
2627
+ .sbi-fb-onbrd-tltp-parent{
2628
+ position: relative;
2629
+ }
2630
+ .sbi-fb-onbrd-tltp-elem{
2631
+ position: absolute;
2632
+ z-index: 9;
2633
+ background: #fff;
2634
+ border-radius: 2px;
2635
+ color: #434960;
2636
+ padding: 16px 52px 4px 24px;
2637
+ font-size: 15px;
2638
+ left: -30px;
2639
+ top: calc(100% + 20px);
2640
+ line-height: 1.7em;
2641
+ box-shadow: 0px 1px 18px rgba(0,0,0,.2);
2642
+ display: none;
2643
+ }
2644
+
2645
+
2646
+
2647
+ .sbi-fb-onbrd-tltp-elem[data-active="false"]{
2648
+ display: none;
2649
+ }
2650
+ .sbi-fb-onbrd-tltp-elem[data-active="true"],
2651
+ .sbi-fb-onbrd-tltp-hover:hover .sbi-fb-onbrd-tltp-elem{
2652
+ display: block;
2653
+ min-width: 440px;
2654
+ padding-bottom: 15px;
2655
+ }
2656
+ .sbi-fb-onbrd-tltp-elem .sb-pointer {
2657
+ position: absolute;
2658
+ left: 85px;
2659
+ top: -17px;
2660
+ }
2661
+ .sbi-fb-onbrd-tltp-elem-2 .sb-pointer {
2662
+ left: 485px;
2663
+
2664
+ }
2665
+ .sbi-fb-onbrd-tltp-elem:after{
2666
+ background: #fff;
2667
+ z-index: 999;
2668
+ top: 0px;
2669
+ margin-left: -10px;
2670
+ width: 40px;
2671
+ box-shadow: unset;
2672
+ -webkit-transform: rotate(0deg);
2673
+ transform: rotate(0deg);
2674
+ }
2675
+ .sbi-fb-onbrd-tltp-parent.sbi-fb-onbrd-tltp-center-top .sbi-fb-onbrd-tltp-elem{
2676
+ left: 50%;
2677
+ -webkit-transform:translateX(-50%);
2678
+ transform:translateX(-50%);
2679
+ bottom: calc(100% + 15px);
2680
+ top: unset;
2681
+ padding: 8px 11px;
2682
+ width: 100%;
2683
+ text-align: center;
2684
+ box-shadow: 0 5px 9px rgba(0,0,0,.2), 0 -4px 9px rgba(0,0,0,.1);
2685
+ }
2686
+ .sbi-fb-onbrd-tltp-parent.sbi-fb-onbrd-tltp-center-top .sbi-fb-onbrd-tltp-elem:before {
2687
+ content: '';
2688
+ position: absolute;
2689
+ left: 50%;
2690
+ bottom: -10px;
2691
+ border-top: 12px solid #fff;
2692
+ border-right: 12px solid transparent;
2693
+ border-left: 12px solid transparent;
2694
+ -webkit-transform: translateX(-50%);
2695
+ transform: translateX(-50%);
2696
+ z-index: 2;
2697
+ }
2698
+ .sbi-fb-onbrd-tltp-parent.sbi-fb-onbrd-tltp-center-top .sbi-fb-onbrd-tltp-elem:before,
2699
+ .sbi-fb-onbrd-tltp-parent.sbi-fb-onbrd-tltp-center-top .sbi-fb-onbrd-tltp-elem:after{
2700
+ left: calc(50% - 10px);
2701
+ top: unset;
2702
+ }
2703
+ .sbi-fb-onbrd-tltp-parent.sbi-fb-onbrd-tltp-center-top .sbi-fb-onbrd-tltp-elem:before{
2704
+ bottom: -10px;
2705
+ }
2706
+ .sbi-fb-onbrd-tltp-parent.sbi-fb-onbrd-tltp-center-top .sbi-fb-onbrd-tltp-elem:after{
2707
+ bottom: 0px;
2708
+ }
2709
+
2710
+
2711
+ #sbi-builder-app .sbi-fb-onbrd-tltp-txt{
2712
+ margin: 0px;
2713
+ }
2714
+ .sbi-fb-onbrd-tltp-txt:last-of-type{
2715
+ margin-bottom: 0px;
2716
+ }
2717
+ .sbi-fb-onbrd-tltp-elem .sbi-fb-popup-cls{
2718
+ top: 12px;
2719
+ right: 16px;
2720
+ }
2721
+
2722
+ [data-tltp-pos*="right"] .sbi-fb-onbrd-tltp-elem{
2723
+ right: 50px;
2724
+ left: unset;
2725
+ }
2726
+ [data-tltp-pos*="right"] .sbi-fb-onbrd-tltp-elem:before,
2727
+ [data-tltp-pos*="right"] .sbi-fb-onbrd-tltp-elem:after{
2728
+ left: unset;
2729
+ right: 13%
2730
+ }
2731
+ [data-tltp-pos*="right"] .sbi-fb-onbrd-tltp-elem:after{
2732
+ margin-left: unset;
2733
+ margin-right: -10px;
2734
+ }
2735
+ .sbi-fd-lst-dimmed .sbi-fb-onbrd-tltp-elem{
2736
+ top: 100%;
2737
+ }
2738
+ .sbi-fb-cp-clpboard{
2739
+ width: 0px;
2740
+ height: 0px;
2741
+ position: absolute;
2742
+ left: -100000px;
2743
+ }
2744
+ .sbi-fb-copied{
2745
+ position: fixed;
2746
+ z-index: 9999999;
2747
+ background: #010101;
2748
+ color: #fff;
2749
+ line-height: 1em;
2750
+ font-size: 15px;
2751
+ font-weight: 500;
2752
+ padding: 10px 20px;
2753
+ opacity: 0;
2754
+ visibility: hidden;
2755
+ -webkit-transition: all .2s ease-in-out, opacity .4s ease-in-out;
2756
+ transition: all .2s ease-in-out, opacity .4s ease-in-out;
2757
+ left: 50%;
2758
+ bottom: -20px;
2759
+ -webkit-transform: translateX(-50%);
2760
+ transform: translateX(-50%);
2761
+ }
2762
+ .sbi-fb-copied[data-active="true"]{
2763
+ opacity: 1;
2764
+ visibility: visible;
2765
+ bottom: 20px;
2766
+ }
2767
+
2768
+ /*
2769
+ ****
2770
+ customizer Screens
2771
+ ****
2772
+ */
2773
+ .sb-customizer-ctn{
2774
+ /*margin-top: 52px;*/
2775
+ min-height: 100vh;
2776
+ }
2777
+ .sb-customizer-sidebar{
2778
+ position: fixed;
2779
+ z-index: 100;
2780
+ width: 375px;
2781
+ box-shadow: 4px 0px 14px rgba(0, 0, 0, .05), 1px 0px 4px rgba(0, 0, 0, .1);
2782
+ background: #fff;
2783
+ left: 160px;
2784
+ top: 96px;
2785
+ overflow: auto;
2786
+ bottom: 0px;
2787
+ padding-bottom: 50px;
2788
+ }
2789
+ body.folded .sb-customizer-sidebar{
2790
+ left: 36px;
2791
+ }
2792
+
2793
+ .sb-customizer-sidebar-tab-ctn{
2794
+ display: flex;
2795
+ justify-content: center;
2796
+ align-items: center;
2797
+ margin-bottom: 24px;
2798
+ }
2799
+ .sb-customizer-sidebar-tab{
2800
+ width: 50%;
2801
+ height: 56px;
2802
+ background: #F3F4F5;
2803
+ border-bottom: 2px solid #F3F4F5;
2804
+ display: flex;
2805
+ justify-content: center;
2806
+ align-items: center;
2807
+ cursor: pointer;
2808
+ }
2809
+ .sb-customizer-sidebar-tab[data-active="true"]{
2810
+ border-color: #0096CC;
2811
+ }
2812
+ .sb-customizer-sidebar-tab:hover {
2813
+ background: #fff!important;
2814
+ color: #141B38!important;
2815
+ }
2816
+ .sb-customizer-sidebar-sec-el{
2817
+ height: 52px;
2818
+ cursor: pointer;
2819
+ display: flex;
2820
+ align-items: center;
2821
+ color: #141B38;
2822
+ border-bottom: 1px solid #DCDDE1;
2823
+ -webkit-transition: background .2s ease-in-out;
2824
+ transition: background .2s ease-in-out;
2825
+ padding: 0 20px;
2826
+ }
2827
+ .sb-customizer-sidebar-sec-el:hover{
2828
+ background: #F3F4F5;
2829
+ border-bottom: 1px solid #F3F4F5;
2830
+ }
2831
+ .sb-customizer-sidebar-sec-el .sb-customizer-chevron svg{
2832
+ position: absolute;
2833
+ right: 22px;
2834
+ top: 22px;
2835
+ }
2836
+ .sb-customizer-sidebar-sec-el-icon{
2837
+ margin-right: 15px;
2838
+ width: 30px;
2839
+ height: 30px;
2840
+ display: flex;
2841
+ justify-content: center;
2842
+ align-items: center;
2843
+ }
2844
+ .sb-customizer-sidebar-sec-el-icon svg{
2845
+ width: 20px;
2846
+ float: left;
2847
+ fill: currentColor;
2848
+ }
2849
+ .sb-customizer-sidebar-sec-elhead{
2850
+ height: 50px;
2851
+ padding: 0 20px;
2852
+ display: flex;
2853
+ align-items: center;
2854
+ margin-top: 30px;
2855
+ font-style: normal;
2856
+ font-weight: bold;
2857
+ font-size: 12px;
2858
+ line-height: 160%;
2859
+ letter-spacing: 0.05em;
2860
+ text-transform: uppercase;
2861
+ color: #8C8F9A;
2862
+ }
2863
+ .sb-customizer-sidebar-header{
2864
+ padding: 20px 20px;
2865
+ border-bottom: 1px solid #DCDDE1;
2866
+ }
2867
+ .sb-customizer-sidebar-header[data-separator="none"]{
2868
+ border-bottom: 0px!important;
2869
+ padding-bottom: 0px;
2870
+ }
2871
+
2872
+ .sb-customizer-sidebar-breadcrumb{
2873
+ margin-bottom: 15px;
2874
+ }
2875
+ .sb-customizer-sidebar-sec1 a:hover{
2876
+ text-decoration: underline;
2877
+ cursor: pointer;
2878
+ }
2879
+
2880
+ .sb-breadcrumb-pro-label{
2881
+ color: #fff !important;
2882
+ display: inline-block;
2883
+ background: var(--cl-orange);
2884
+ padding: 5px 8px;
2885
+ font-size: 11px;
2886
+ line-height: 1em !important;
2887
+ border-radius: 4px;
2888
+ -webkit-transform: translateX(5px) translateY(-4px);
2889
+ transform: translateX(8px) translateY(-2px);
2890
+ }
2891
+ .sb-control-elem-label .sb-breadcrumb-pro-label{
2892
+ -webkit-transform: translateX(5px) translateY(0px);
2893
+ transform: translateX(5px) translateY(0px);
2894
+ }
2895
+ .sb-customizer-sidebar-breadcrumb a, .sb-customizer-sidebar-breadcrumb span{
2896
+ display: inline-block;
2897
+ position: relative;
2898
+ cursor: pointer;
2899
+ color: #434960;
2900
+ text-transform: uppercase;
2901
+ font-size: 10px;
2902
+ line-height: 160%;
2903
+ letter-spacing: 0.08em;
2904
+ padding: 0 17px;
2905
+ height: 20px;
2906
+ font-weight: 600;
2907
+ }
2908
+ .sb-customizer-sidebar-breadcrumb span{
2909
+ cursor: text;
2910
+ }
2911
+ .sb-customizer-sidebar-breadcrumb svg {
2912
+ position: absolute;
2913
+ left: 4px;
2914
+ top: 6px;
2915
+
2916
+ }
2917
+
2918
+
2919
+ .sb-customizer-sidebar-header strong{
2920
+ font-size: 26px;
2921
+ color: #141B38;
2922
+ display: block;
2923
+ margin-bottom: 10px;
2924
+ line-height: 1.1em;
2925
+ }
2926
+ .sb-customizer-sidebar-header span{
2927
+ line-height: 1em;
2928
+ color: #434960;
2929
+ }
2930
+ .sb-customizer-sidebar-intro {
2931
+ display: block;
2932
+ padding: 5px 0 10px 0;
2933
+ line-height: 1.7 !important;
2934
+ }
2935
+ .sb-customizer-ctrl-link{
2936
+ text-decoration: underline!important;
2937
+ }
2938
+ /*
2939
+ Controls Style
2940
+ */
2941
+ .sb-control-label[data-title="true"]{
2942
+ font-weight: 600;
2943
+ }
2944
+
2945
+ .sb-control-elem-ctn{
2946
+ display: flex;
2947
+ color: #141B38;
2948
+ padding: 20px 20px;
2949
+ }
2950
+ .sb-control-elem-ctn[data-stacked="true"]{
2951
+ padding: 5px 20px;
2952
+ }
2953
+ .sb-control-elem-ctn[data-type="heading"]{
2954
+ padding-bottom: 0;
2955
+ }
2956
+ .sb-control-elem-overlay{
2957
+ width: 100%!important;
2958
+ height: 100%!important;
2959
+ position: absolute!important;
2960
+ left: 0!important;
2961
+ top: 0!important;
2962
+ z-index: 5!important;
2963
+ background: rgba(255,255,255,0.4)!important;
2964
+ }
2965
+ #sbi-builder-app .sb-control-elem-ctn[data-type="heading"] .sb-small-p{
2966
+ font-weight: 600;
2967
+ }
2968
+ #sbi-builder-app .sb-control-elem-ctn[data-type="heading"] .sb-control-elem-description{
2969
+ font-style: normal;
2970
+ font-weight: normal;
2971
+ font-size: 12px;
2972
+ line-height: 150%;
2973
+ color: #434960;
2974
+ }
2975
+ #sbi-builder-app .sb-control-elem-ctn[data-type="heading"] .sb-control-elem-label {
2976
+ margin-bottom: 0;
2977
+ }
2978
+ .sb-control-elem-heading svg {
2979
+ margin-left: 8px;
2980
+ }
2981
+ .sb-control-elem-ctn[data-separator="top"],.sb-control-elem-ctn[data-separator="both"]{
2982
+ border-top: 1px solid #DCDDE1;
2983
+ }
2984
+ .sb-control-elem-ctn[data-separator="bottom"],.sb-control-elem-ctn[data-separator="both"]{
2985
+ border-bottom: 1px solid #DCDDE1;
2986
+ }
2987
+ .sb-control-elem-ctn[data-type="separator"]{
2988
+ padding: 0;
2989
+ }
2990
+ .sb-control-elem-separator{
2991
+ height: 2px;
2992
+ border-top: 1px solid #DCDDE1;
2993
+ }
2994
+
2995
+ .sb-control-elem-ctn[data-reverse="true"]{
2996
+ flex-direction: row-reverse;
2997
+ }
2998
+ .sb-control-elem-ctn svg{
2999
+ fill: currentColor;
3000
+ }
3001
+ .sb-control-elem-output{
3002
+ padding-left: 20px;
3003
+ }
3004
+ .sb-control-elem-ctn[data-reverse="true"] .sb-control-elem-output{
3005
+ padding-right: 20px;
3006
+ padding-left: 0px;
3007
+ }
3008
+ .sb-control-elem-ctn[data-layout="block"]{
3009
+ display: block;
3010
+ }
3011
+ .sb-control-elem-ctn[data-layout="block"] .sb-control-elem-label{
3012
+ width: 100%;
3013
+ float: left;
3014
+ margin-bottom: 8px;
3015
+ }
3016
+ .sb-control-elem-ctn[data-layout="block"] .sb-control-elem-output{
3017
+ padding: 0px;
3018
+ }
3019
+ .sb-control-elem-ctn[data-layout="block"] input[type="number"] {
3020
+ height: 36px;
3021
+ background: #FFFFFF;
3022
+ border-radius: 1px 0 0 1px !important;
3023
+ /*border-right-color: #F3F4F5 !important;*/
3024
+ }
3025
+ .sb-control-elem-ctn[data-layout="block"] [data-contains-suffix="true"] input[type="number"]{
3026
+ border-right-color: #F3F4F5 !important;
3027
+ }
3028
+ .sb-control-elem-ctn[data-child="true"]{
3029
+ padding-left: 70px;
3030
+ }
3031
+
3032
+ .sb-control-elem-ctn[data-layout="half"]{
3033
+ align-items: center;
3034
+ justify-content: flex-start;
3035
+ }
3036
+ .sb-control-elem-ctn[data-layout="half"][data-switcher-top="true"]{
3037
+ align-items: flex-start!important;
3038
+ }
3039
+ .sb-control-elem-ctn[data-layout="half"][data-switcher-top="true"] .sb-control-switcher-ctn{
3040
+ margin-top: 5px;
3041
+ }
3042
+ .sb-control-elem-ctn[data-layout="half"] > div{
3043
+ width: 100%;
3044
+ }
3045
+ .sb-control-elem-ctn[data-type="switcher"][data-reverse="true"][data-layout="half"] > div{
3046
+ width: unset;
3047
+ }
3048
+ .sb-control-elem-ctn[data-layout="half"][data-reverse="true"]{
3049
+ justify-content: flex-end;
3050
+ }
3051
+ [data-type="switcher"][data-reverse="true"][data-layout="half"] .sb-control-elem-output{
3052
+ padding-right: 5px;
3053
+
3054
+ }
3055
+ .sb-control-elem-label-title{
3056
+ display: flex;
3057
+ align-items: center;
3058
+ }
3059
+ .sb-control-elem-description{
3060
+ color: #434960;
3061
+ font-size: 13px;
3062
+ float: left;
3063
+ margin-top: 4px;
3064
+ }
3065
+ .sb-control-elem-description a{
3066
+ cursor: pointer;
3067
+ }
3068
+ .sb-control-elem-ctn[data-heading="strong"] .sb-control-elem-heading{
3069
+ font-weight: 500!important;
3070
+ }
3071
+ .sb-control-elem-heading[data-underline="true"]{
3072
+ text-decoration: underline;
3073
+ }
3074
+ .sb-control-elem-icon{
3075
+ display: flex;
3076
+ justify-content: center;
3077
+ align-items: center;
3078
+ }
3079
+ .sb-control-elem-icon svg{
3080
+ width: 16px;
3081
+ float: left;
3082
+ margin-right: 10px;
3083
+ }
3084
+ .sb-control-elem-tltp{
3085
+ margin-left: 10px;
3086
+ position: relative;
3087
+ }
3088
+ .sb-control-elem-tltp-icon{
3089
+ float: left;
3090
+ cursor: pointer;
3091
+ }
3092
+ .sb-control-elem-tltp-icon svg{
3093
+ width: 14px;
3094
+ float: left;
3095
+ }
3096
+
3097
+ /*Switcher Control*/
3098
+ .sb-control-switcher-ctn{
3099
+ cursor: pointer;
3100
+ display: flex;
3101
+ align-items: center;
3102
+ float: left;
3103
+ }
3104
+ .sb-control-switcher{
3105
+ width: 36px;
3106
+ height: 18px;
3107
+ border-radius: 25px;
3108
+ background: #D0D1D7;
3109
+ position: relative;
3110
+ margin-right: 10px;
3111
+ }
3112
+
3113
+ .sb-control-switcher:before{
3114
+ content: '';
3115
+ position: absolute;
3116
+ height: 14px;
3117
+ width: 14px;
3118
+ left: 3px;
3119
+ top: 2px;
3120
+ border-radius: 25px;
3121
+ background: #fff;
3122
+ box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
3123
+ -webkit-transition: all .2s ease-in-out;
3124
+ transition: all .2s ease-in-out;
3125
+ }
3126
+ .sb-control-switcher-ctn[data-active="true"] .sb-control-switcher{
3127
+ background: var(--customizer-blue);
3128
+ }
3129
+ .sb-control-switcher-ctn[data-active="true"] .sb-control-switcher:before{
3130
+ left: 19px;
3131
+ }
3132
+
3133
+ /*Toggle SINGLE Control*/
3134
+ .sb-control-toggle-elm{
3135
+ display: flex;
3136
+ align-items: center;
3137
+ cursor: pointer;
3138
+ height: 46px;
3139
+ padding: 0 15px;
3140
+ border-right: 1px solid #E8E8EB;
3141
+ border-left: 1px solid #E8E8EB;
3142
+ border-bottom: 1px solid #E8E8EB;
3143
+ }
3144
+ .sb-control-toggle-elm:first-child {
3145
+ border-top: 1px solid #E8E8EB;
3146
+ }
3147
+ .sb-control-toggle-elm[data-disabled="true"]{
3148
+ background: #F3F4F5;
3149
+ }
3150
+ .sb-control-toggle-extension-cover{
3151
+ width: 100%;
3152
+ height: 100%;
3153
+ position: absolute;
3154
+ left: 0px;
3155
+ top: 0;
3156
+ cursor: pointer;
3157
+ z-index: 4;
3158
+
3159
+ }
3160
+
3161
+ .sb-control-toggle-deco{
3162
+ width: 16px;
3163
+ height: 16px;
3164
+ margin-right: 13px;
3165
+ box-sizing: border-box;
3166
+ border-radius: 50%;
3167
+ border: 2px solid #d0d1d7;
3168
+ }
3169
+ .sb-control-toggle-icon{
3170
+ display: flex;
3171
+ justify-content: center;
3172
+ align-items: center;
3173
+ margin-right: 13px;
3174
+ }
3175
+ .sb-control-toggle-icon svg{
3176
+ width: 16px;
3177
+ float: left;
3178
+ fill: #141B38;
3179
+ }
3180
+ .sb-control-toggle-elm[data-active="true"]{
3181
+ background: #F7FDFF;
3182
+ border-radius: 2px;
3183
+ border: 1px solid var(--customizer-blue);
3184
+ }
3185
+ .sb-control-toggle-elm[data-active="true"]{
3186
+ background: #F7FDFF;
3187
+ border-radius: 2px;
3188
+ border: 1px solid var(--customizer-blue);
3189
+ }
3190
+ .sb-control-toggle-elm:hover:not(.sb-control-toggle-elm[data-disabled="true"]) .sb-control-toggle-deco,
3191
+ .sb-control-toggle-elm[data-active="true"]:not(.sb-control-toggle-elm[data-disabled="true"]):hover .sb-control-toggle-deco{
3192
+ border: 4px solid var(--customizer-blue);
3193
+ background: #fff;
3194
+ }
3195
+ .sb-control-toggle-elm[data-active="true"] .sb-control-toggle-deco{
3196
+ border: 6px solid var(--customizer-blue);
3197
+ background: #fff;
3198
+ }
3199
+
3200
+ /*Toggle SET Control*/
3201
+ .sb-control-toggle-set-ctn .sb-control-toggle-elm[data-active="true"]{
3202
+ border-radius: 0px;
3203
+ }
3204
+
3205
+ /*Toggle Button Control*/
3206
+ .sb-control-togglebutton-ctn{
3207
+ display: flex;
3208
+ align-items: center;
3209
+ justify-content: center;
3210
+ padding: 3px;
3211
+ background: #f3f4f5;
3212
+ border-radius: 4px;
3213
+ border: 1px solid #eee;
3214
+ height: 40px;
3215
+ }
3216
+ .sb-control-togglebutton-elm{
3217
+ width: 100%;
3218
+ display: flex;
3219
+ justify-content: center;
3220
+ align-items: center;
3221
+ height: 33px;
3222
+ cursor: pointer;
3223
+ font-weight: 600;
3224
+ border-radius: 4px;
3225
+ text-transform: capitalize;
3226
+ line-height: 1em;
3227
+ }
3228
+ .sb-control-togglebutton-elm[data-active="true"]{
3229
+ color: var(--dark-blue);
3230
+ background: #fff;
3231
+ }
3232
+ .sb-control-togglebutton-elm:hover{
3233
+ color: var(--dark-blue);
3234
+ }
3235
+
3236
+ .sb-control-toggle-set-desc-ctn .sb-control-label{
3237
+ font-weight: 600;
3238
+ }
3239
+ .sb-control-toggle-set-desc-ctn .sb-control-toggle-elm{
3240
+ height: 82px;
3241
+ }
3242
+
3243
+ .sb-control-toggle-set-desc-ctn .sb-control-toggle-deco{
3244
+ flex-grow: 0;
3245
+ flex-shrink: 0;
3246
+ }
3247
+ .sb-control-moderatiomode-selement .sb-control-elem-label-title{
3248
+ margin-bottom: 15px;
3249
+ }
3250
+ .sb-control-moderatiomode-selement{
3251
+ margin-bottom: 20px;
3252
+ padding: 20px 0px;
3253
+ }
3254
+
3255
+ /*Input Control*/
3256
+ .sb-control-input-ctn{
3257
+ display: flex;
3258
+ }
3259
+ .sb-control-input,.sb-control-input-textrea{
3260
+ height: 40px;
3261
+ background: #fff;
3262
+ border: 1px solid #D0D1D7!important;
3263
+ border-radius: unset!important;
3264
+ outline: unset!important;
3265
+ padding: 0 10px!important;
3266
+ line-height: 1em;
3267
+ margin: 0px;
3268
+ }
3269
+ .sb-control-input-textrea{
3270
+ padding: 10px!important;
3271
+ height: 120px;
3272
+ line-height: 1.5em;
3273
+ }
3274
+ .sb-control-input:hover{
3275
+ color: inherit!important;
3276
+ }
3277
+ .sb-control-input:focus,.sb-control-input-textrea:focus{
3278
+ border: 1px solid #8C8F9A!important;
3279
+ border-radius: unset!important;
3280
+ box-shadow: unset!important;
3281
+ outline: unset!important;
3282
+ }
3283
+ .sb-control-input[disabled],.sb-control-input-textrea[disabled]{
3284
+ background-color: #F3F4F5;
3285
+ border: 1px solid #E8E8EB;
3286
+ }
3287
+ .sb-control-input-info{
3288
+ display: flex;
3289
+ justify-content: center;
3290
+ align-items: center;
3291
+ background: #F3F4F5;
3292
+ padding: 0 8px;
3293
+ font-weight: normal;
3294
+ font-size: 14px;
3295
+ line-height: 160%;
3296
+ color: #434960;
3297
+ border: 1px solid #D0D1D7;
3298
+ border-left: none;
3299
+ border-radius: 0 1px 1px 0 !important;
3300
+ }
3301
+
3302
+ /*ImageChooser Control*/
3303
+ .sb-control-imagechooser-ctn{
3304
+ display: flex;
3305
+ background: #F3F4F5;
3306
+ border: 1px solid #ccc!important;
3307
+ height: 40px;
3308
+ }
3309
+
3310
+ .sb-control-imagechooser-input,
3311
+ .sb-control-imagechooser-input:focus{
3312
+ outline: none!important;
3313
+ border: none!important;
3314
+ box-shadow: none!important;
3315
+ background: none!important;
3316
+ height: 40px;
3317
+ }
3318
+ .sb-control-imagechooser-btn svg{
3319
+ width: 18px;
3320
+ margin-right: 5px;
3321
+ float: left;
3322
+ }
3323
+ .sb-control-imagechooser-btn{
3324
+ display: flex;
3325
+ justify-content: center;
3326
+ align-items: center;
3327
+ padding: 0 10px;
3328
+ cursor: pointer;
3329
+ border-left: 1px solid #ccc!important;
3330
+ font-weight: 500;
3331
+ color: #141B38;
3332
+ }
3333
+ .sb-control-imagechooser-clear{
3334
+ position: absolute;
3335
+ right: 4px;
3336
+ top: 10px;
3337
+ }
3338
+ .sb-control-imagechooser-clear-icon{
3339
+ position: relative;
3340
+ width: 20px;
3341
+ height: 20px;
3342
+ color: #141B38;
3343
+ cursor: pointer;
3344
+ opacity: 0.5;
3345
+ }
3346
+ .sb-control-imagechooser-clear-icon:hover{
3347
+ opacity: 1;
3348
+ }
3349
+ .sb-control-imagechooser-clear-icon:before,
3350
+ .sb-control-imagechooser-clear-icon:after{
3351
+ content: '';
3352
+ position: absolute;
3353
+ width: 16px;
3354
+ height: 2px;
3355
+ background: currentColor;
3356
+ left: 2px;
3357
+ top: 9px;
3358
+ -webkit-transform:rotate(45deg);
3359
+ transform:rotate(45deg);
3360
+ }
3361
+ .sb-control-imagechooser-clear-icon:after{
3362
+ -webkit-transform:rotate(-45deg);
3363
+ transform:rotate(-45deg);
3364
+ }
3365
+ .sb-control-imagechooser-padding{
3366
+ padding-right: 31px!important;
3367
+ }
3368
+
3369
+ /*CheckBox Control*/
3370
+ .sb-control-checkbox-ctn{
3371
+ cursor: pointer;
3372
+ display: flex;
3373
+ }
3374
+ [data-disabled="true"] .sb-control-checkbox{
3375
+ z-index: -1!important;
3376
+ }
3377
+ .sb-control-checkbox{
3378
+ width: 18px;
3379
+ height: 18px;
3380
+ border-radius: 2px;
3381
+ float: left;
3382
+ border: 2px solid #D0D1D7;
3383
+ box-sizing: border-box;
3384
+ position: relative;
3385
+ margin-right: 10px;
3386
+ flex: none;
3387
+ }
3388
+ .sb-control-checkbox-ctn > div{
3389
+ z-index: 3;
3390
+ }
3391
+ .sb-control-checkbox-ctn:hover .sb-control-checkbox-hover{
3392
+ opacity: 1;
3393
+ }
3394
+ .sb-control-checkbox-hover{
3395
+ position: absolute;
3396
+ left: -20px;
3397
+ top: 0px;
3398
+ width: calc(100% + 40px);
3399
+ height: 100%;
3400
+ background:#F3F4F5;
3401
+ z-index: 1;
3402
+ opacity: 0;
3403
+ }
3404
+
3405
+ .sb-control-checkbox{
3406
+ z-index: 5!important;
3407
+ }
3408
+
3409
+
3410
+ .sb-control-checkbox[data-active="true"]{
3411
+ background: var(--customizer-blue);
3412
+ border-color: var(--customizer-blue);
3413
+ color: #fff;
3414
+ }
3415
+ .sb-control-checkbox[data-active="true"]:before{
3416
+ content: '';
3417
+ position: absolute;
3418
+ width: 8px;
3419
+ height: 4px;
3420
+ top: 2px;
3421
+ left: 2px;
3422
+ border-left: 2px solid currentColor;
3423
+ border-bottom: 2px solid currentColor;
3424
+ -webkit-transform: rotate(-45deg);
3425
+ transform: rotate(-45deg);
3426
+ }
3427
+
3428
+
3429
+ /*Action Button Control*/
3430
+ .sb-control-action-button{
3431
+ height: 38px;
3432
+ cursor: pointer;
3433
+ display: flex;
3434
+ flex-direction: row;
3435
+ justify-content: center;
3436
+ align-items: center;
3437
+ background: #F3F4F5;
3438
+ border-radius: 2px;
3439
+ border: 1px solid #DCDDE1;
3440
+ position: relative;
3441
+ line-height: 1em;
3442
+ margin-top: 7px;
3443
+ }
3444
+
3445
+ .sb-control-action-button div{
3446
+ float: left;
3447
+ width: 20px;
3448
+ height: 20px;
3449
+ display: flex;
3450
+ justify-content: center;
3451
+ align-items: center;
3452
+ margin-right: 8px;
3453
+ }
3454
+ .sb-control-action-button svg{
3455
+ width: 17px;
3456
+ }
3457
+
3458
+ /* WPColorPicker Control Redesign */
3459
+ .sb-control-colorpicker-ctn .wp-picker-default{
3460
+ display: none!important;
3461
+ }
3462
+ .sb-control-colorpicker-ctn .minicolors-theme-default.minicolors{
3463
+ width: 100%;
3464
+ }
3465
+
3466
+ .sb-control-colorpicker-ctn .minicolors-theme-default.minicolors-position-right .minicolors-swatch {
3467
+ /*
3468
+ left: auto;
3469
+ right: 6px;
3470
+ top: 6px;
3471
+ width: 26px;
3472
+ height: 26px;
3473
+ background: #F9F9FA;
3474
+ border: 0px;
3475
+ */
3476
+
3477
+ left: auto;
3478
+ right: 1px;
3479
+ top: 1px;
3480
+ width: 35px;
3481
+ height: 35px;
3482
+ background: #F9F9FA;
3483
+ border: 0px;
3484
+ }
3485
+ .minicolors-swatch-color{
3486
+ box-shadow: none;
3487
+ }
3488
+ .sb-control-colorpicker-ctn .minicolors-input,.sb-control-colorpicker-ctn .minicolors-input:focus{
3489
+ height: 37px;
3490
+ width: 100%!important;
3491
+ background: #fff;
3492
+ border: 1px solid #D0D1D7!important;
3493
+ border-radius: unset!important;
3494
+ outline: unset!important;
3495
+ box-shadow: unset!important;
3496
+ padding: 0 10px!important;
3497
+ line-height: 1em;
3498
+ margin: 0px;
3499
+ }
3500
+ .sb-control-colorpicker-ctn .minicolors-input:focus{
3501
+ border: 1px solid #0096CC!important;
3502
+ }
3503
+
3504
+ [data-type="colorpicker"] .minicolors-input{
3505
+ font-size: 13px;
3506
+ }
3507
+ [data-type="colorpicker"] .minicolors-input{
3508
+ font-style: normal;
3509
+ font-weight: normal;
3510
+ font-size: 12px;
3511
+ line-height: 150%;
3512
+ color: #434960;
3513
+ }
3514
+
3515
+ .sb-control-colorpicker-btn{
3516
+ height: 38px;
3517
+ display: flex;
3518
+ justify-content: center;
3519
+ align-items: center;
3520
+ border: 1px solid #DCDDE1;
3521
+ border-left: 0px;
3522
+ padding: 0 10px;
3523
+ background: #F3F4F5;
3524
+ font-style: normal;
3525
+ font-weight: 600;
3526
+ font-size: 12px;
3527
+ line-height: 160%;
3528
+ color: #141B38;
3529
+ cursor: pointer;
3530
+ box-sizing: border-box;
3531
+ }
3532
+ .sb-control-colorpicker-ctn[data-picker-style="reset"] .minicolors-input,
3533
+ .sb-control-coloroverride-ctn{
3534
+ background: #F3F4F5!important;
3535
+ border: 1px solid #DCDDE1!important;
3536
+ }
3537
+ .sb-control-colorpicker-ctn[data-picker-style="reset"] .minicolors-theme-default.minicolors-position-right .minicolors-swatch,
3538
+ .sb-control-coloroverride-ctn .sb-control-coloroverride-swatch{
3539
+ top: 8px;
3540
+ width: 22px;
3541
+ height: 22px;
3542
+ }
3543
+ .sb-control-coloroverride-ctn .sb-control-coloroverride-swatch{
3544
+ position: absolute;
3545
+ right: 10px;
3546
+ }
3547
+ .sb-control-coloroverride-ctn .sb-control-colorpicker-btn{
3548
+ margin-left: auto;
3549
+ border: 0px!important;
3550
+ border-left: 1px solid #DCDDE1!important;
3551
+ }
3552
+ .sb-control-coloroverride-ctn .sb-control-coloroverride-content{
3553
+ width: 100%;
3554
+ display: flex;
3555
+ align-items: center;
3556
+ position: relative;
3557
+ }
3558
+ .sb-control-coloroverride-ctn .sb-control-coloroverride-txt{
3559
+ padding-left: 9px;
3560
+ box-sizing: border-box;
3561
+ }
3562
+
3563
+ /*
3564
+ Customizer Preview
3565
+ */
3566
+ .sb-customizer-preview{
3567
+ min-height: 100px;
3568
+ width: calc(100% - 375px);
3569
+ float: right;
3570
+ box-sizing: border-box;
3571
+ padding: 0 20px;
3572
+ display: flex;
3573
+ justify-content: center;
3574
+ margin-top: 64px;
3575
+ position: relative;
3576
+ flex-wrap: wrap;
3577
+ }
3578
+ .sb-customizer-preview .sbi-admin-notices{
3579
+ margin-top: 20px;
3580
+ width: 100%;
3581
+ }
3582
+ .sb-customizer-preview .license-details-modal .sbi-modal-content {
3583
+ max-height: none;
3584
+ height: auto;
3585
+ }
3586
+ .sb-customizer-preview .sbi-sb-modal-body .sb-why-renew-list:nth-child(3) {
3587
+ margin-bottom: 0;
3588
+ }
3589
+ .sb-customizer-preview .sbi-sb-modal-body .sb-why-renew-list:last-child {
3590
+ margin-bottom: 0;
3591
+ }
3592
+ .sb-customizer-preview[data-preview-device="desktop"] .sb-preview-ctn{
3593
+ width: 100%;
3594
+ max-width: 1200px;
3595
+ }
3596
+ .sb-customizer-preview[data-preview-device="tablet"] .sb-preview-ctn{
3597
+ max-width: 100%;
3598
+ width: 800px;
3599
+ }
3600
+ .sb-customizer-preview[data-preview-device="mobile"] .sb-preview-ctn{
3601
+ max-width: 100%;
3602
+ width: 400px;
3603
+ }
3604
+ .sbi-preview-ctn {
3605
+ padding: 10px;
3606
+ }
3607
+
3608
+ .sb-preview-top-chooser{
3609
+ padding: 18px 0 16px;
3610
+ display: flex;
3611
+ color: #434960;
3612
+ align-items: center;
3613
+ }
3614
+ .sb-preview-top-chooser strong{
3615
+ font-style: normal;
3616
+ font-weight: bold;
3617
+ font-size: 12px;
3618
+ line-height: 160%;
3619
+ letter-spacing: 0.05em;
3620
+ text-transform: uppercase;
3621
+ color: #434960;
3622
+ display: inline-flex;
3623
+ }
3624
+ .sbi-moderate-heading{
3625
+ margin-top: 21px;
3626
+ }
3627
+ .sb-preview-top-chooser strong > svg{
3628
+ margin-right: 10px;
3629
+ margin-left: 16px;
3630
+ fill: currentColor;
3631
+ width: 20px;
3632
+ }
3633
+
3634
+ .sb-preview-chooser{
3635
+ height: 36px;
3636
+ background: #E8E8EB;
3637
+ margin-left: auto;
3638
+ padding: 0 2px;
3639
+ border-radius: 1px;
3640
+ display: flex;
3641
+