Skip to content

Commit c708181

Browse files
imklaujedrzejchalubek
imklau
authored and
jedrzejchalubek
committed
feat(): Introduce Footer (#88)
1 parent 581b1ab commit c708181

File tree

13 files changed

+213
-1
lines changed

13 files changed

+213
-1
lines changed

‎src/_data/menu.yml

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
---
2+
sections:
3+
- section_title: Product
4+
section:
5+
- path: "https://segment.com/product/connections/"
6+
title: Connections
7+
- path: "https://segment.com/product/protocols/"
8+
title: Protocols
9+
- path: "https://segment.com/product/personas/"
10+
title: Personas
11+
- path: "https://segment.com/catalog/"
12+
title: Integrations Catalog
13+
- path: "https://segment.com/pricing/"
14+
title: Pricing
15+
- path: "https://segment.com/security/"
16+
title: Security
17+
- path: "https://segment.com/product/gdpr/"
18+
title: GDPR
19+
- section_title: For Developers
20+
section:
21+
- path: "https://segment.com/docs/"
22+
title: Documentation
23+
- path: "https://segment.com/docs/sources/"
24+
title: Segment API
25+
- path: "https://segment.com/partners/developer-center/"
26+
title: Build on Segment
27+
- path: "https://open.segment.com/"
28+
title: Open Source
29+
- path: "https://segment.com/engineering/"
30+
title: Engineering Team
31+
- section_title: For Businesses
32+
section:
33+
- path: "https://segment.com/docs/"
34+
title: Customer Stories
35+
- path: "https://segment.com/docs/sources/"
36+
title: Enterprise
37+
- path: "https://segment.com/partners/developer-center/"
38+
title: Startups
39+
- path: "https://open.segment.com/"
40+
title: Retail
41+
- path: "https://segment.com/engineering/"
42+
title: Marketplace
43+
- path: "https://segment.com/engineering/"
44+
title: B2B Software
45+
- path: "https://segment.com/engineering/"
46+
title: Mobile
47+
- section_title: Company
48+
section:
49+
- path: "https://segment.com/docs/"
50+
title: Careers
51+
- path: "https://segment.com/docs/sources/"
52+
title: Blog
53+
- path: "https://segment.com/partners/developer-center/"
54+
title: Press
55+
- path: "https://open.segment.com/"
56+
title: FTFY Podcast
57+
- path: "https://segment.com/engineering/"
58+
title: Events
59+
- section_title: Support
60+
section:
61+
- path: "https://segment.com/docs/"
62+
title: Help Center
63+
- path: "https://segment.com/docs/sources/"
64+
title: Contact us
65+
- path: "https://segment.com/partners/developer-center/"
66+
title: Resources
67+
- path: "https://open.segment.com/"
68+
title: Recipes
69+
- path: "https://segment.com/engineering/"
70+
title: Security Bulletins
71+
- path: "https://segment.com/engineering/"
72+
title: Documentation
73+
- path: "https://segment.com/engineering/"
74+
title: Become a Partner

‎src/_includes/components/footer.html

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
<div class="footer">
2+
<div class="footer__container">
3+
<div class="flex flex--wrap waffle waffle--large">
4+
{% for menu in site.data.menu.sections %}
5+
<div class="flex__column flex__column--4 flex__column--2@large">
6+
<div class="nav">
7+
<p class="nav__title">{{ menu.section_title }}</p>
8+
9+
<ul class="nav-list">
10+
{% for item in menu.section %}
11+
<li>
12+
<a class="nav-list__link" href="{{ item.path }}">{{ item.title }}</a>
13+
</li>
14+
{% endfor %}
15+
</ul>
16+
</div>
17+
</div>
18+
{% endfor %}
19+
20+
<div class="flex__column flex__column--4 flex__column--2@large flex__column--center">
21+
<div class="footer__aside">
22+
{% include icons/segment.svg %}
23+
24+
<p>© 2019 Segment.io, Inc.</p>
25+
26+
<div class="nav">
27+
<ul class="nav-list">
28+
<li>
29+
<a class="nav-list__link" href="#">Privacy</a>
30+
</li>
31+
32+
<li>
33+
<a class="nav-list__link" href="#">Terms</a>
34+
</li>
35+
</ul>
36+
</div>
37+
38+
<ul class="social-list flex flex--middle gutter gutter--xlarge">
39+
<li>
40+
<a href="#" class="social-list__link">
41+
{% include icons/socials/linkedin.svg %}
42+
</a>
43+
</li>
44+
45+
<li>
46+
<a href="#" class="social-list__link">
47+
{% include icons/socials/twitter.svg %}
48+
</a>
49+
</li>
50+
51+
<li>
52+
<a href="#" class="social-list__link">
53+
{% include icons/socials/github.svg %}
54+
</a>
55+
</li>
56+
</ul>
57+
</div>
58+
</div>
59+
</div>
60+
61+
<div class="footer__bg">
62+
<svg width="912" height="900" xmlns="http://www.w3.org/2000/svg"><path d="M103.991 751.69c0 28.174 23.561 50.991 52.622 50.991 29.036 0 52.597-22.817 52.597-50.99 0-28.15-23.561-50.991-52.597-50.991-29.06 0-52.622 22.842-52.622 50.99zm580.15-616.302c0 28.174 23.535 50.99 52.596 50.99 29.036 0 52.571-22.816 52.571-50.99 0-28.149-23.535-50.99-52.57-50.99-29.062 0-52.597 22.841-52.597 50.99zM355.718 353.041c0 9.375 7.854 17.013 17.524 17.013h521.234c9.67 0 17.524-7.638 17.524-17.013v-62.3c0-9.375-7.854-17.013-17.524-17.013H373.242c-9.67 0-17.524 7.638-17.524 17.013v62.3zm200.564 163.636c0-9.375-7.88-16.988-17.524-16.988H17.524C7.879 499.689 0 507.302 0 516.677v62.325c0 9.375 7.88 16.989 17.524 16.989h521.234c9.644 0 17.524-7.614 17.524-16.99v-62.324zm339.934-28.1l-63.98-6.299c-9.466-.942-17.883 5.481-19.136 14.633-11.23 82.364-52.571 158.7-116.347 214.9-67.23 59.224-154.337 91.862-245.307 91.862-44.87 0-88.667-7.787-130.135-23.164-8.852-3.273-18.675.819-22.36 9.35l-24.737 57.538c-1.868 4.266-1.842 8.953.051 13.194 1.868 4.29 5.372 7.565 9.85 9.251C337.426 889.832 393.758 900 451.445 900c115.734 0 226.58-41.542 312.153-116.936C845.23 711.14 897.904 613.35 911.847 507.699c.613-4.613-.691-9.151-3.659-12.772-2.967-3.621-7.214-5.903-11.972-6.35zM1.714 338.31c24.584-93.152 80.814-177.847 158.25-238.51C242.135 35.44 345.665 0 451.447 0c52.316 0 103.633 8.358 152.572 24.875 4.528 1.538 8.135 4.663 10.156 8.879 2.02 4.191 2.225 8.879.511 13.219l-22.716 58.332c-3.352 8.63-13.047 13.045-22.052 10.044-37.964-12.624-77.846-19.047-118.47-19.047-84.345 0-163.572 27.132-229.062 78.42-60.476 47.37-104.554 113.44-124.022 186.007-2.047 7.639-9.056 12.673-16.884 12.673-1.28 0-2.61-.148-3.94-.421l-62.727-13.84c-4.656-1.016-8.57-3.769-11.077-7.712-2.481-3.968-3.223-8.63-2.021-13.12z" fill="#F7F9F9" fill-rule="evenodd" opacity=".048"/></svg>
63+
</div>
64+
</div>
65+
</div>

‎src/_includes/icons/segment.svg

Lines changed: 1 addition & 0 deletions
Loading

‎src/_includes/icons/socials/github.svg

Lines changed: 1 addition & 0 deletions
Loading

‎src/_includes/icons/socials/linkedin.svg

Lines changed: 1 addition & 0 deletions
Loading

‎src/_includes/icons/socials/twitter.svg

Lines changed: 1 addition & 0 deletions
Loading

‎src/_layouts/default.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@
7979
</div>
8080

8181
<footer>
82-
{% include data-collection-footer.html %}
82+
{% include components/footer.html %}
8383
</footer>
8484
</div>
8585

‎src/_sass/_variables.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,7 @@ $gutter-sizes: (
6666
small: 0.3rem,
6767
medium: 0.5rem,
6868
large: 1rem,
69+
xlarge: 1.5rem,
6970
) !default;
7071

7172
/// Default gutter size.

‎src/_sass/components/_footer.scss

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
.footer {
2+
overflow: hidden;
3+
padding-top: 70px;
4+
padding-bottom: 120px;
5+
background-color: color(secondary);
6+
font-size: 16px;
7+
color: color(white);
8+
9+
&__container {
10+
position: relative;
11+
z-index: 1;
12+
max-width: 1150px;
13+
margin-left: auto;
14+
margin-right: auto;
15+
padding-left: 15px;
16+
padding-right: 15px;
17+
}
18+
19+
&__aside {
20+
font-size: 14px;
21+
22+
& > * + * {
23+
margin-top: 20px;
24+
}
25+
}
26+
27+
&__bg {
28+
position: absolute;
29+
top: 0;
30+
right: 0;
31+
transform: translate(0, 10%);
32+
z-index: -1;
33+
}
34+
}

‎src/_sass/components/_nav-list.scss

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
.nav-list {
2+
padding-left: 0;
3+
list-style: none;
4+
5+
& > * + * {
6+
margin-top: 10px;
7+
}
8+
9+
&__link {
10+
color: color(white);
11+
}
12+
}

‎src/_sass/components/_nav.scss

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
.nav {
2+
& > * + * {
3+
margin-top: 10px;
4+
}
5+
6+
&__title {
7+
font-weight: 500;
8+
color: color(white);
9+
}
10+
}

‎src/_sass/components/_social-list.scss

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
.social-list {
2+
padding-left: 0;
3+
list-style: none;
4+
5+
&__link {
6+
color: color(white);
7+
}
8+
}

‎src/_sass/segment.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,10 @@
5555
@import "components/field";
5656
@import "components/breadcrumbs";
5757
@import "components/highlight";
58+
@import "components/nav";
59+
@import "components/nav-list";
60+
@import "components/social-list";
61+
@import "components/footer";
5862
@import "components/sidebar";
5963
@import "components/widget";
6064
@import "components/menu-side";

0 commit comments

Comments
 (0)