Skip to content

Commit c26ac35

Browse files
RaduCristianPopescuRaduCristianPopescu
authored
fix: support page layout (#1087)
- Fixed the Support page layout: Getting Started, Documentation, Free vs Pro tabs.
1 parent b0de8c9 commit c26ac35

File tree

2 files changed

+74
-42
lines changed

2 files changed

+74
-42
lines changed

‎css/settings.css

Lines changed: 24 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -852,7 +852,6 @@ input.fz-switch-toggle[type=checkbox]:checked:before{
852852
}
853853
.btn.btn-block{
854854
display: block;
855-
width: 100%;
856855
text-align: center;
857856
}
858857
.btn.btn-lg{
@@ -1256,22 +1255,24 @@ input.fz-switch-toggle[type=checkbox]:checked:before{
12561255
padding: 30px 0 24px;
12571256
}
12581257
.support-box-list > ul{
1259-
display: flex;
1260-
flex-wrap: wrap;
1261-
margin: 0 -15px;
1258+
display: grid;
1259+
grid-template-columns: repeat(1, 1fr);
1260+
gap: 20px;
12621261
}
12631262
.support-box-list > ul > li{
1264-
width: 50%;
1265-
padding: 0 15px 30px;
1263+
width: 100%;
1264+
display: flex;
12661265
}
12671266
.support-box-list .cta{
12681267
text-align: center;
12691268
}
12701269

12711270
.support-box{
12721271
border: 1px solid #D9D9D9;
1273-
padding: 40px 30px 30px;
1274-
height: 100%;
1272+
padding: 0 30px 30px;
1273+
flex-grow: 1;
1274+
display: flex;
1275+
flex-direction: column;
12751276
}
12761277
.support-box .h3{
12771278
padding-bottom: 16px;
@@ -1281,11 +1282,13 @@ input.fz-switch-toggle[type=checkbox]:checked:before{
12811282
line-height: 24px;
12821283
color: #050505;
12831284
margin-bottom: 24px;
1285+
flex-grow: 1;
12841286
}
12851287

12861288
.quick-link-list{
12871289
display: flex;
12881290
flex-wrap: wrap;
1291+
flex-grow: 10;
12891292
}
12901293
.quick-link-list ul{
12911294
width: 50%;
@@ -1415,10 +1418,11 @@ input.fz-switch-toggle[type=checkbox]:checked:before{
14151418

14161419
.fz-pro-features-table-row{
14171420
display: flex;
1418-
flex-wrap: wrap;
1421+
margin: 0;
14191422
}
14201423
.fz-pro-features-table-row .features-info{
14211424
width: calc(100% - 280px);
1425+
margin-bottom: 0;
14221426
}
14231427
.fz-pro-features-table-row .free,
14241428
.fz-pro-features-table-row .pro{
@@ -1428,6 +1432,7 @@ input.fz-switch-toggle[type=checkbox]:checked:before{
14281432
display: flex;
14291433
align-items: center;
14301434
justify-content: center;
1435+
margin-bottom: 0;
14311436
}
14321437
.fz-pro-features-table-row .free .dashicons,
14331438
.fz-pro-features-table-row .pro .dashicons{
@@ -1446,7 +1451,10 @@ input.fz-switch-toggle[type=checkbox]:checked:before{
14461451
font-size: 20px;
14471452
font-weight: 700;
14481453
color: #757575;
1449-
padding-bottom: 16px;
1454+
padding-bottom: 28px;
1455+
}
1456+
.fz-pro-features-table-header .fz-pro-features-table-row li {
1457+
padding: 0 44px;
14501458
}
14511459
.fz-pro-features-table-body{
14521460
border-top: 1px solid #D9D9D9;
@@ -2556,3 +2564,9 @@ li.draggable-item .components-panel__body-toggle.components-button{
25562564
transform:rotate(360deg);
25572565
}
25582566
}
2567+
2568+
@media (min-width: 768px) {
2569+
.support-box-list > ul{
2570+
grid-template-columns: repeat(2, 1fr);
2571+
}
2572+
}

‎includes/layouts/feedzy-tutorial.php

Lines changed: 50 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -26,9 +26,11 @@
2626
<li>- <?php esc_html_e( 'Translate content automatically on import.', 'feedzy-rss-feeds' ); ?></li>
2727
</ul>
2828
<br/>
29-
<a href="<?php echo esc_url( add_query_arg( 'post_type', 'feedzy_imports', admin_url( 'post-new.php' ) ) ); ?>" class="btn btn-outline-primary" target="_blank">
30-
<?php esc_html_e( 'Import your first feed', 'feedzy-rss-feeds' ); ?>
31-
</a>
29+
<div>
30+
<a href="<?php echo esc_url( add_query_arg( 'post_type', 'feedzy_imports', admin_url( 'post-new.php' ) ) ); ?>" class="btn btn-outline-primary" target="_blank">
31+
<?php esc_html_e( 'Import your first feed', 'feedzy-rss-feeds' ); ?>
32+
</a>
33+
</div>
3234
</div>
3335
</li>
3436
<li>
@@ -37,14 +39,14 @@
3739
<p><?php esc_html_e( 'New here? Learn how to use Feedzy by following our tips and tricks:', 'feedzy-rss-feeds' ); ?></p>
3840
<div class="quick-link-list">
3941
<ul>
40-
<li><a href="https://docs.themeisle.com/category/712-feedzy" target="blank"><?php esc_html_e( 'General Guide', 'feedzy-rss-feeds' ); ?></a></li>
41-
<li><a href="https://docs.themeisle.com/article/1154-how-to-use-feed-to-post-feature-in-feedzy" target="blank"><?php esc_html_e( 'How to use Feed to post', 'feedzy-rss-feeds' ); ?></a></li>
42-
<li><a href="https://docs.themeisle.com/article/1119-feedzy-rss-feeds-documentation#widget" target="blank"><?php esc_html_e( 'Feedzy Widget', 'feedzy-rss-feeds' ); ?></a></li>
42+
<li><a href="https://docs.themeisle.com/category/712-feedzy" target="_blank"><?php esc_html_e( 'General Guide', 'feedzy-rss-feeds' ); ?></a></li>
43+
<li><a href="https://docs.themeisle.com/article/1154-how-to-use-feed-to-post-feature-in-feedzy" target="_blank"><?php esc_html_e( 'How to use Feed to post', 'feedzy-rss-feeds' ); ?></a></li>
44+
<li><a href="https://docs.themeisle.com/article/1119-feedzy-rss-feeds-documentation#widget" target="_blank"><?php esc_html_e( 'Feedzy Widget', 'feedzy-rss-feeds' ); ?></a></li>
4345
</ul>
4446
<ul>
45-
<li><a href="https://docs.themeisle.com/article/1119-feedzy-rss-feeds-documentation#troubleshooting" target="blank"><?php esc_html_e( 'Troubleshooting Guide', 'feedzy-rss-feeds' ); ?></a></li>
46-
<li><a href="https://docs.themeisle.com/article/540-what-actions-and-filters-are-available-in-feedzy" target="blank"><?php esc_html_e( 'Customizing Feedzy', 'feedzy-rss-feeds' ); ?></a></li>
47-
<li><a href="https://docs.themeisle.com/article/1119-feedzy-rss-feeds-documentation#categories" target="blank"><?php esc_html_e( 'Organize feeds in Categories', 'feedzy-rss-feeds' ); ?></a></li>
47+
<li><a href="https://docs.themeisle.com/article/1119-feedzy-rss-feeds-documentation#troubleshooting" target="_blank"><?php esc_html_e( 'Troubleshooting Guide', 'feedzy-rss-feeds' ); ?></a></li>
48+
<li><a href="https://docs.themeisle.com/article/540-what-actions-and-filters-are-available-in-feedzy" target="_blank"><?php esc_html_e( 'Customizing Feedzy', 'feedzy-rss-feeds' ); ?></a></li>
49+
<li><a href="https://docs.themeisle.com/article/1119-feedzy-rss-feeds-documentation#categories" target="_blank"><?php esc_html_e( 'Organize feeds in Categories', 'feedzy-rss-feeds' ); ?></a></li>
4850
</ul>
4951
</div>
5052
</div>
@@ -61,76 +63,92 @@
6163
);
6264
?>
6365
</p>
64-
<a href="https://bit.ly/3IxzOI1" class="btn btn-outline-primary" target="blank">
65-
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
66-
</a>
66+
<div>
67+
<a href="https://bit.ly/3IxzOI1" class="btn btn-outline-primary" target="_blank">
68+
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
69+
</a>
70+
</div>
6771
</div>
6872
</li>
6973
<li>
7074
<div class="support-box">
7175
<h3 class="h3"><?php esc_html_e( 'Pagebuilders integration', 'feedzy-rss-feeds' ); ?></h3>
7276
<p><?php esc_html_e( 'Feedzy is compatible with most popular page builders, so you can easily configure your feed imports directly in Elementor & Gutenberg.', 'feedzy-rss-feeds' ); ?></p>
73-
<a href="https://bit.ly/3RuN3gA" class="btn btn-outline-primary" target="blank">
74-
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
75-
</a>
77+
<div>
78+
<a href="https://bit.ly/3RuN3gA" class="btn btn-outline-primary" target="_blank">
79+
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
80+
</a>
81+
</div>
7682
</div>
7783
</li>
7884
<li>
7985
<div class="support-box">
8086
<h3 class="h3"><?php esc_html_e( 'Referral Links', 'feedzy-rss-feeds' ); ?><?php echo ! $is_pro ? ' <span class="pro-label">PRO</span>' : ''; ?></h3>
8187
<p><?php esc_html_e( 'Automatically add referral parameters, and Feedzy will automatically configure affiliate links for each item in the feed.', 'feedzy-rss-feeds' ); ?></p>
82-
<a href="https://docs.themeisle.com/article/715-feedzy-how-to-add-affiliate-referrals-to-feed-urls" class="btn btn-outline-primary" target="blank">
83-
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
84-
</a>
88+
<div>
89+
<a href="https://docs.themeisle.com/article/715-feedzy-how-to-add-affiliate-referrals-to-feed-urls" class="btn btn-outline-primary" target="_blank">
90+
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
91+
</a>
92+
</div>
8593
</div>
8694
</li>
8795
<li>
8896
<div class="support-box">
8997
<h3 class="h3"><?php esc_html_e( 'Full text import', 'feedzy-rss-feeds' ); ?><?php echo ! $is_pro ? ' <span class="pro-label">PRO</span>' : ''; ?></h3>
9098
<p><?php esc_html_e( 'Get full content of posts/articles from your RSS feeds.', 'feedzy-rss-feeds' ); ?></p>
91-
<a href="https://docs.themeisle.com/article/1389-whats-the-difference-between-feedzy-content-and-full-post-content#full-content" class="btn btn-outline-primary" target="blank">
92-
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
93-
</a>
99+
<div>
100+
<a href="https://docs.themeisle.com/article/1389-whats-the-difference-between-feedzy-content-and-full-post-content#full-content" class="btn btn-outline-primary" target="_blank">
101+
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
102+
</a>
103+
</div>
94104
</div>
95105
</li>
96106
<li>
97107
<div class="support-box">
98108
<h3 class="h3"><?php esc_html_e( 'Paraphrase & Translate Content', 'feedzy-rss-feeds' ); ?><?php echo ! $is_pro ? ' <span class="pro-label">PRO</span>' : ''; ?></h3>
99109
<p><?php esc_html_e( 'Automatically paraphrase or translate content on import.', 'feedzy-rss-feeds' ); ?></p>
100-
<a href="https://docs.themeisle.com/article/1690-how-to-use-the-translating-service-in-feedzy" class="btn btn-outline-primary" target="blank">
101-
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
102-
</a>
110+
<div>
111+
<a href="https://docs.themeisle.com/article/1690-how-to-use-the-translating-service-in-feedzy" class="btn btn-outline-primary" target="_blank">
112+
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
113+
</a>
114+
</div>
103115
</div>
104116
</li>
105117
<li>
106118
<div class="support-box">
107119
<h3 class="h3"><?php esc_html_e( 'Spintax Text', 'feedzy-rss-feeds' ); ?><?php echo ! $is_pro ? ' <span class="pro-label">PRO</span>' : ''; ?></h3>
108120
<p><?php esc_html_e( 'The Spintax service is very useful for blogs, as it is easily configurable and a time saver.', 'feedzy-rss-feeds' ); ?></p>
109-
<a href="https://docs.themeisle.com/article/1689-how-to-use-the-spintax-service-in-feedzy" class="btn btn-outline-primary" target="blank">
110-
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
111-
</a>
121+
<div>
122+
<a href="https://docs.themeisle.com/article/1689-how-to-use-the-spintax-service-in-feedzy" class="btn btn-outline-primary" target="_blank">
123+
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
124+
</a>
125+
</div>
112126
</div>
113127
</li>
114128
<li>
115129
<div class="support-box">
116130
<h3 class="h3"><?php esc_html_e( 'Enhanced Elementor support', 'feedzy-rss-feeds' ); ?><?php echo ! $is_pro ? ' <span class="pro-label">PRO</span>' : ''; ?></h3>
117131
<p><?php esc_html_e( 'Advanced Elementor template builder integration to build content areas directly from feeds.', 'feedzy-rss-feeds' ); ?></p>
118-
<a href="https://docs.themeisle.com/article/1396-elementor-compatibility-in-feedzy" class="btn btn-outline-primary" target="blank"><?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?></a>
132+
<div>
133+
<a href="https://docs.themeisle.com/article/1396-elementor-compatibility-in-feedzy" class="btn btn-outline-primary" target="_blank"><?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?></a>
134+
</div>
119135
</div>
120136
</li>
121137
<li>
122138
<div class="support-box">
123139
<h3 class="h3"><?php esc_html_e( 'Keyword Filtering', 'feedzy-rss-feeds' ); ?><?php echo ! $is_pro ? ' <span class="pro-label">PRO</span>' : ''; ?></h3>
124140
<p><?php esc_html_e( 'Filter feed items, and Display or Exclude items if the title or content contains specific keyword(s).', 'feedzy-rss-feeds' ); ?></p>
125-
<a href="https://docs.themeisle.com/article/1154-how-to-use-feed-to-post-feature-in-feedzy#filters" class="btn btn-outline-primary" target="blank">
126-
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
127-
</a>
141+
<div>
142+
<a href="https://docs.themeisle.com/article/1154-how-to-use-feed-to-post-feature-in-feedzy#filters" class="btn btn-outline-primary" target="_blank">
143+
<?php esc_html_e( 'Learn more', 'feedzy-rss-feeds' ); ?>
144+
</a>
145+
</div>
128146
</div>
129147
</li>
130148
</ul>
131149
<?php if ( ! $is_pro ) : ?>
132150
<div class="cta">
133-
<a href="<?php echo esc_url_raw( tsdk_translate_link( tsdk_utmify( FEEDZY_UPSELL_LINK, 'viewall', 'tutorial' ) ) ); ?>#pro-features" class="btn btn-ghost" target="blank">
151+
<a href="<?php echo esc_url_raw( tsdk_translate_link( tsdk_utmify( FEEDZY_UPSELL_LINK, 'viewall', 'tutorial' ) ) ); ?>#pro-features" class="btn btn-ghost" target="_blank">
134152
<?php esc_html_e( 'View all Premium features', 'feedzy-rss-feeds' ); ?>
135153
</a>
136154
</div>

0 commit comments

Comments
 (0)