Skip to content

Commit 3f6967b

Browse files
got spacing right on default footer pattern, added minor styling to variation 2
1 parent 4734fed commit 3f6967b

File tree

4 files changed

+72
-42
lines changed

4 files changed

+72
-42
lines changed

css/editor.css

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,3 +5,9 @@
55
order: -1;
66
margin-right: 5px;
77
}
8+
9+
/* Footer Variation 02 */
10+
.footer-variation-02 .wp-block-navigation__container {
11+
gap: var(--wp--preset--spacing--10);
12+
}
13+

patterns/footer-02.php

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,16 @@
1010
* @since TBD
1111
*/
1212
?>
13-
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"right":"var:preset|spacing|50","bottom":"var:preset|spacing|30","left":"var:preset|spacing|50","top":"var:preset|spacing|30"},"blockGap":"var:preset|spacing|20","margin":{"top":"0","bottom":"0"}},"dimensions":{"minHeight":"40vh"},"color":{"background":"#f3f3f3"},"border":{"top":{"color":"var:preset|color|borders","width":"1px"},"right":[],"bottom":[],"left":[]}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"center","verticalAlignment":"center"}} -->
14-
<div class="wp-block-group footer-variation-02 alignfull has-background" style="border-top-color:var(--wp--preset--color--borders);border-top-width:1px;background-color:#f3f3f3;min-height:40vh;margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--50)"><!-- wp:group {"layout":{"type":"flex","flexWrap":"nowrap"}} -->
13+
<!-- wp:group {"metadata":{"categories":["memberlite-footer"],"patternName":"memberlite/footer-02","name":"Footer Variation 2"},"align":"full","className":"footer-variation-02","style":{"spacing":{"padding":{"right":"var:preset|spacing|50","bottom":"var:preset|spacing|30","left":"var:preset|spacing|50","top":"var:preset|spacing|30"},"blockGap":"var:preset|spacing|20","margin":{"top":"0","bottom":"0"}},"dimensions":{"minHeight":"40vh"},"color":{"background":"#f3f3f3"},"border":{"top":{"color":"var:preset|color|borders","width":"1px"},"right":[],"bottom":[],"left":[]}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"center","verticalAlignment":"center"}} -->
14+
<div class="wp-block-group alignfull footer-variation-02 has-background" style="border-top-color:var(--wp--preset--color--borders);border-top-width:1px;background-color:#f3f3f3;min-height:40vh;margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--50)"><!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|10"}},"layout":{"type":"flex","flexWrap":"nowrap"}} -->
1515
<div class="wp-block-group"><!-- wp:paragraph {"className":"has-text-align-right","fontSize":"14"} -->
1616
<p class="has-text-align-right has-14-font-size">© 2026 Memberlite. All Rights Reserved.</p>
1717
<!-- /wp:paragraph -->
1818

19+
<!-- wp:paragraph -->
20+
<p>|</p>
21+
<!-- /wp:paragraph -->
22+
1923
<!-- wp:navigation {"ref":3283,"overlayMenu":"never","fontSize":"14","layout":{"type":"flex","justifyContent":"right"}} /--></div>
2024
<!-- /wp:group -->
2125

patterns/footer-default.php

Lines changed: 50 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -10,56 +10,66 @@
1010
* @since TBD
1111
*/
1212
?>
13-
<!-- wp:group {"align":"full","className":"footer-variation-default","style":{"spacing":{"padding":{"top":"var:preset|spacing|50","right":"var:preset|spacing|50","bottom":"0","left":"var:preset|spacing|50"}},"elements":{"link":{"color":{"text":"var:preset|color|page-masthead"}}},"border":{"top":{"color":"var:preset|color|borders","width":"1px"}}},"backgroundColor":"color-primary","textColor":"page-masthead","layout":{"type":"constrained"}} -->
14-
<div class="wp-block-group alignfull footer-variation-default has-page-masthead-color has-color-primary-background-color has-text-color has-background has-link-color" style="border-top-color:var(--wp--preset--color--borders);border-top-width:1px;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:0;padding-left:var(--wp--preset--spacing--50)"><!-- wp:columns {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|50","right":"var:preset|spacing|50","bottom":"var:preset|spacing|50","left":"var:preset|spacing|50"},"blockGap":{"top":"0","left":"var:preset|spacing|50"}}},"backgroundColor":"footer-widgets-background","textColor":"footer-widgets","fontSize":"14"} -->
15-
<div class="wp-block-columns alignfull has-footer-widgets-color has-footer-widgets-background-background-color has-text-color has-background has-14-font-size" style="padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--50)"><!-- wp:column -->
16-
<div class="wp-block-column"><!-- wp:heading {"level":3,"style":{"spacing":{"margin":{"top":"0","bottom":"0"}}}} -->
17-
<h3 class="wp-block-heading" style="margin-top:0;margin-bottom:0">Title of Footer Section</h3>
18-
<!-- /wp:heading -->
13+
<!-- wp:group {"metadata":{"categories":["memberlite-footer"],"patternName":"memberlite/footer-default","name":"Footer Default"},"align":"full","className":"footer-variation-default","style":{"spacing":{"padding":{"top":"var:preset|spacing|50","right":"var:preset|spacing|50","bottom":"0","left":"var:preset|spacing|50"}},"elements":{"link":{"color":{"text":"var:preset|color|page-masthead"}}},"border":{"top":{"color":"var:preset|color|borders","width":"1px"}}},"backgroundColor":"color-primary","textColor":"page-masthead","layout":{"type":"constrained"}} -->
14+
<div class="wp-block-group alignfull footer-variation-default has-page-masthead-color has-color-primary-background-color has-text-color has-background has-link-color" style="border-top-color:var(--wp--preset--color--borders);border-top-width:1px;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:0;padding-left:var(--wp--preset--spacing--50)"><!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":{"top":"var:preset|spacing|40","left":"var:preset|spacing|40"}}}} -->
15+
<div class="wp-block-columns alignwide"><!-- wp:column {"style":{"spacing":{"blockGap":"var:preset|spacing|40"}}} -->
16+
<div class="wp-block-column"><!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|40","padding":{"top":"0","bottom":"var:preset|spacing|50"}}},"layout":{"type":"flex","flexWrap":"nowrap"}} -->
17+
<div class="wp-block-group" style="padding-top:0;padding-bottom:var(--wp--preset--spacing--50)"><!-- wp:group {"style":{"layout":{"selfStretch":"fit","flexSize":null}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"left","flexWrap":"nowrap"}} -->
18+
<div class="wp-block-group"><!-- wp:heading {"level":3} -->
19+
<h3 class="wp-block-heading">Title of Footer Section</h3>
20+
<!-- /wp:heading -->
1921

20-
<!-- wp:paragraph {"fontSize":"18"} -->
21-
<p class="has-18-font-size">Add your footer content here. Describe your membership community or add useful links.</p>
22-
<!-- /wp:paragraph --></div>
23-
<!-- /wp:column -->
22+
<!-- wp:paragraph -->
23+
<p>Our vision is to be at the forefront of architectural innovation, fostering a global community of architects and enthusiasts united by a passion for creating spaces.</p>
24+
<!-- /wp:paragraph --></div>
25+
<!-- /wp:group -->
2426

25-
<!-- wp:column -->
26-
<div class="wp-block-column"><!-- wp:heading {"level":3,"style":{"spacing":{"margin":{"top":"0","bottom":"0"}}}} -->
27-
<h3 class="wp-block-heading" style="margin-top:0;margin-bottom:0">Title of Footer Section</h3>
28-
<!-- /wp:heading -->
27+
<!-- wp:group {"style":{"layout":{"selfStretch":"fit","flexSize":null}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"left","flexWrap":"nowrap"}} -->
28+
<div class="wp-block-group"><!-- wp:heading {"level":3} -->
29+
<h3 class="wp-block-heading">Title of Footer Section</h3>
30+
<!-- /wp:heading -->
2931

30-
<!-- wp:paragraph {"fontSize":"18"} -->
31-
<p class="has-18-font-size">Add your footer content here. Describe your membership community or add useful links.</p>
32-
<!-- /wp:paragraph --></div>
33-
<!-- /wp:column -->
32+
<!-- wp:paragraph -->
33+
<p>Our vision is to be at the forefront of architectural innovation, fostering a global community of architects and enthusiasts united by a passion for creating spaces.</p>
34+
<!-- /wp:paragraph --></div>
35+
<!-- /wp:group -->
3436

35-
<!-- wp:column -->
36-
<div class="wp-block-column"><!-- wp:heading {"level":3,"style":{"spacing":{"margin":{"top":"0","bottom":"0"}}}} -->
37-
<h3 class="wp-block-heading" style="margin-top:0;margin-bottom:0">Title of Footer Section</h3>
38-
<!-- /wp:heading -->
37+
<!-- wp:group {"layout":{"type":"flex","orientation":"vertical","flexWrap":"nowrap"}} -->
38+
<div class="wp-block-group"><!-- wp:heading {"level":3} -->
39+
<h3 class="wp-block-heading">Title of Footer Section</h3>
40+
<!-- /wp:heading -->
3941

40-
<!-- wp:paragraph {"fontSize":"18"} -->
41-
<p class="has-18-font-size">Add your footer content here. Describe your membership community or add useful links.</p>
42-
<!-- /wp:paragraph --></div>
43-
<!-- /wp:column -->
42+
<!-- wp:paragraph -->
43+
<p>Our vision is to be at the forefront of architectural innovation, fostering a global community of architects and enthusiasts united by a passion for creating spaces.</p>
44+
<!-- /wp:paragraph --></div>
45+
<!-- /wp:group -->
4446

45-
<!-- wp:column -->
46-
<div class="wp-block-column"><!-- wp:heading {"level":3,"style":{"spacing":{"margin":{"top":"0","bottom":"0"}}}} -->
47-
<h3 class="wp-block-heading" style="margin-top:0;margin-bottom:0">Title of Footer Section</h3>
48-
<!-- /wp:heading -->
47+
<!-- wp:group {"layout":{"type":"flex","orientation":"vertical","flexWrap":"nowrap"}} -->
48+
<div class="wp-block-group"><!-- wp:heading {"level":3} -->
49+
<h3 class="wp-block-heading">Title of Footer Section</h3>
50+
<!-- /wp:heading -->
4951

50-
<!-- wp:paragraph {"fontSize":"18"} -->
51-
<p class="has-18-font-size">Add your footer content here. Describe your membership community or add useful links.</p>
52-
<!-- /wp:paragraph --></div>
52+
<!-- wp:paragraph -->
53+
<p>Our vision is to be at the forefront of architectural innovation, fostering a global community of architects and enthusiasts united by a passion for creating spaces.</p>
54+
<!-- /wp:paragraph --></div>
55+
<!-- /wp:group --></div>
56+
<!-- /wp:group --></div>
5357
<!-- /wp:column --></div>
5458
<!-- /wp:columns -->
5559

56-
<!-- wp:group {"align":"full","style":{"border":{"bottom":{"color":"var:preset|color|borders","width":"1px"}},"spacing":{"padding":{"top":"var:preset|spacing|20","right":"var:preset|spacing|40","bottom":"var:preset|spacing|20","left":"var:preset|spacing|40"},"margin":{"top":"0","bottom":"0"}}},"backgroundColor":"site-navigation-background","layout":{"type":"flex","justifyContent":"flex-start","flexWrap":"wrap"}} -->
57-
<div class="wp-block-group alignfull has-site-navigation-background-background-color has-background" style="border-bottom-color:var(--wp--preset--color--borders);border-bottom-width:1px;margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--20);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--20);padding-left:var(--wp--preset--spacing--40)"><!-- wp:navigation {"ref":2196,"textColor":"site-navigation-link","overlayBackgroundColor":"site-navigation-background","overlayTextColor":"site-navigation-link","style":{"typography":{"textDecoration":"underline"}}} /--></div>
58-
<!-- /wp:group -->
60+
<!-- wp:group {"align":"full","backgroundColor":"site-navigation-background","layout":{"type":"constrained"}} -->
61+
<div class="wp-block-group alignfull has-site-navigation-background-background-color has-background"><!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":{"top":"var:preset|spacing|40","left":"var:preset|spacing|40"}}}} -->
62+
<div class="wp-block-columns alignwide"><!-- wp:column {"width":""} -->
63+
<div class="wp-block-column"><!-- wp:group {"style":{"border":{"bottom":{"color":"var:preset|color|borders","width":"1px"}},"spacing":{"padding":{"top":"var:preset|spacing|10","right":"0","bottom":"var:preset|spacing|20","left":"0"},"margin":{"top":"0","bottom":"0"}}},"backgroundColor":"site-navigation-background","layout":{"type":"flex","justifyContent":"flex-start","flexWrap":"wrap"}} -->
64+
<div class="wp-block-group has-site-navigation-background-background-color has-background" style="border-bottom-color:var(--wp--preset--color--borders);border-bottom-width:1px;margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--10);padding-right:0;padding-bottom:var(--wp--preset--spacing--20);padding-left:0"><!-- wp:navigation {"ref":2196,"textColor":"site-navigation-link","overlayMenu":"never","overlayBackgroundColor":"site-navigation-background","overlayTextColor":"site-navigation-link","style":{"typography":{"textDecoration":"underline"}}} /--></div>
65+
<!-- /wp:group -->
5966

60-
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|20","right":"var:preset|spacing|40","bottom":"var:preset|spacing|20","left":"var:preset|spacing|40"},"margin":{"top":"0","bottom":"0"}}},"backgroundColor":"site-navigation-background","layout":{"type":"flex","justifyContent":"space-between","flexWrap":"nowrap","verticalAlignment":"center"}} -->
61-
<div class="wp-block-group alignfull has-site-navigation-background-background-color has-background" style="margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--20);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--20);padding-left:var(--wp--preset--spacing--40)"><!-- wp:paragraph {"style":{"elements":{"link":{"color":{"text":"var:preset|color|site-navigation-link"}}}},"textColor":"site-navigation-link","fontSize":"18"} -->
62-
<p class="has-site-navigation-link-color has-text-color has-link-color has-18-font-size">© 2026 Your Site Name</p>
63-
<!-- /wp:paragraph --></div>
67+
<!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|20","right":"0","bottom":"var:preset|spacing|20","left":"0"},"margin":{"top":"0","bottom":"0"}}},"backgroundColor":"site-navigation-background","layout":{"type":"flex","justifyContent":"space-between","flexWrap":"nowrap","verticalAlignment":"center"}} -->
68+
<div class="wp-block-group has-site-navigation-background-background-color has-background" style="margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--20);padding-right:0;padding-bottom:var(--wp--preset--spacing--20);padding-left:0"><!-- wp:paragraph {"style":{"elements":{"link":{"color":{"text":"var:preset|color|site-navigation-link"}}}},"textColor":"site-navigation-link","fontSize":"18"} -->
69+
<p class="has-site-navigation-link-color has-text-color has-link-color has-18-font-size">© 2026 Your Site Name</p>
70+
<!-- /wp:paragraph --></div>
71+
<!-- /wp:group --></div>
72+
<!-- /wp:column --></div>
73+
<!-- /wp:columns --></div>
6474
<!-- /wp:group --></div>
6575
<!-- /wp:group -->

src/scss/structure/_footer.scss

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -142,6 +142,16 @@
142142
}
143143
}
144144

145+
// -----------------------------------------------------------------------------
146+
// Site Footer — Variation 02
147+
// -----------------------------------------------------------------------------
148+
149+
.footer-variation-02 {
150+
.wp-block-navigation__container {
151+
gap: var(--wp--preset--spacing--10);
152+
}
153+
}
154+
145155
// -----------------------------------------------------------------------------
146156
// Floating Back to Top
147157
// -----------------------------------------------------------------------------

0 commit comments

Comments
 (0)