Skip to content

Commit 16d4a7d

Browse files
daexsdaexs
committed
Added footer
1 parent c2ea8f7 commit 16d4a7d

File tree

2 files changed

+231
-1
lines changed

2 files changed

+231
-1
lines changed

‎pages/css/extra_css.css‎

Lines changed: 155 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
z-index: 10;
1111
background: var(--md-default-bg-color);
1212
padding: 30px 25px 0px 25px;
13-
height: 12.1rem;
13+
/* height: 12.1rem; */
1414
}
1515

1616
.nav-bottom-image img{
@@ -21,4 +21,158 @@
2121

2222
.nav-bottom-image a::after {
2323
content: none !important;
24+
}
25+
26+
/* Footer Styling */
27+
28+
.--footer-top {
29+
-webkit-box-flex: 0;
30+
padding: 20px;
31+
width: 100%;
32+
}
33+
34+
.--footer-column h6 {
35+
/* color: #3f3f3f; */
36+
position: relative;
37+
margin: 0;
38+
padding-bottom: 15px;
39+
margin-bottom: 15px;
40+
font-size: 14px;
41+
padding-top: 20px;
42+
display: block;
43+
font-weight: bold !important;
44+
}
45+
46+
.md-footer {
47+
background-color: var(--md-default-bg-color);
48+
}
49+
50+
.md-footer ul{
51+
list-style-type: none;
52+
margin: 0;
53+
padding: 0;
54+
}
55+
56+
.--footer-body {
57+
-webkit-box-flex: 0;
58+
display: flex;
59+
list-style: none;
60+
flex-wrap: wrap;
61+
width: 100%;
62+
margin: 0;
63+
padding: 0;
64+
margin-bottom: 10px;
65+
}
66+
.--footer-column {
67+
-webkit-box-flex: 1;
68+
flex: 1 1 20%;
69+
padding: 10px;
70+
min-width: 125px;
71+
}
72+
73+
.--footer-column ul a {
74+
color: #626262;
75+
display: inline-block;
76+
margin: 2px 0;
77+
}
78+
79+
.--footer-column ul a::after {
80+
display: none;
81+
}
82+
83+
.--footer-column ul a:link:not(.button){
84+
position: relative;
85+
opacity: 0.95;
86+
font-weight: 400;
87+
color: #3f3f3f;
88+
font-size: 14px;
89+
}
90+
91+
92+
@media screen and (max-width:1023px){
93+
.--footer-column {
94+
-webkit-box-flex: 1;
95+
flex: 1 1 33.3333%;
96+
max-width: 33.3333%;
97+
}
98+
}
99+
100+
@media screen and (min-width: 1200px){
101+
.--footer-body {
102+
flex-wrap: nowrap;
103+
}
104+
}
105+
106+
.subscribe-text {
107+
margin-block-start: 0em;
108+
font-size: 100%;
109+
color: #626262;
110+
}
111+
112+
.subscribe-button {
113+
background-color: #2186f4;
114+
border-radius: 1.22rem;
115+
color: #fff !important;
116+
cursor: pointer;
117+
font-style: italic;
118+
font-size: 12.8px;
119+
line-height: 1.2;
120+
letter-spacing: 1.33px;
121+
outline: none;
122+
padding: .35rem .72rem;
123+
text-align: center;
124+
text-decoration: none;
125+
text-transform: uppercase;
126+
transition: background-color .2s ease-in-out;
127+
}
128+
129+
.--footer-meta {
130+
-webkit-box-flex: 0;
131+
padding: 20px;
132+
font-size: 0.65rem;
133+
font-weight: 400;
134+
width: 100%;
135+
border-top: none;
136+
}
137+
138+
.--footer-meta a:link:not(.button){
139+
position: relative;
140+
opacity: 0.95;
141+
margin-left: 20px;
142+
}
143+
144+
.--footer-meta a {
145+
font-weight: 400;
146+
display: inline-block;
147+
margin-left: 20px;
148+
color: #3f3f3f;
149+
margin: 2px 0;
150+
}
151+
152+
.--footer-meta a::after {
153+
display: none;
154+
}
155+
156+
.--footer-meta .--wrap {
157+
display: flex;
158+
-webkit-box-pack: justify;
159+
justify-content: space-between;
160+
-webkit-box-align: center;
161+
align-items: center;
162+
opacity: 0.8;
163+
width: 100%;
164+
max-width: 100%;
165+
margin: auto;
166+
}
167+
168+
.--copyright {
169+
color: #3f3f3f;
170+
}
171+
172+
.--footer-meta .right {
173+
display: flex;
174+
}
175+
176+
article {
177+
display: block;
24178
}

‎pages/overrides/partials/footer.html‎

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
{% import "partials/language.html" as lang with context %}
2+
<footer class="md-footer">
3+
<div class="md-footer-meta__inner md-grid">
4+
<section class="--footer-top">
5+
<div class="--wrap">
6+
<ul class="--footer-body">
7+
<li class="--footer-column">
8+
<h6 class="--footer-heading">
9+
JOIN OUR MAILING LIST
10+
</h6>
11+
<ul>
12+
<li>
13+
<p class="subscribe-text">
14+
Sign up to stay in the loop with all things Plotly — from Dash
15+
Club to product updates, webinars, and more!
16+
</p>
17+
<a href="https://go.plot.ly/subscription" class="subscribe-button" target="blank"> Subscribe </a>
18+
</li>
19+
</ul>
20+
</li>
21+
<li class="--footer-column">
22+
<h6 class="--footer-heading"> Products </h6>
23+
<ul>
24+
<li><a href="https://plotly.com/studio" target="_self"> Plotly Studio </a></li>
25+
<li><a href="https://cloud.plotly.com" target="_self"> Plotly Cloud </a></li>
26+
<li><a href="https://plotly.com/dash/" target="_self"> Dash Enterprise </a></li>
27+
<li><a href="https://plotly.com/whats-new" target="_self"> New Releases → </a></li>
28+
</ul>
29+
</li>
30+
<li class="--footer-column">
31+
<h6 class="--footer-heading"> Pricing </h6>
32+
<ul>
33+
<li>
34+
<a href="https://plotly.com/pricing" target="_self"> Studio and Cloud Pricing</a>
35+
</li>
36+
<li>
37+
<a href="https://plotly.com/get-pricing" target="_self"> Dash Enterprise Pricing</a>
38+
</li>
39+
</ul>
40+
</li>
41+
<li class="--footer-column">
42+
<h6 class="--footer-heading"> About Us </h6>
43+
<ul>
44+
<li><a href="https://plotly.com/careers" target="_self"> Careers </a></li>
45+
<li><a href="https://plotly.com/resources/" target="_self"> Resources </a></li>
46+
<li><a href="https://plotly.com/blog/" target="_self"> Blog </a></li>
47+
</ul>
48+
</li>
49+
<li class="--footer-column">
50+
<h6 class="--footer-heading">Support </h6>
51+
<ul>
52+
<li><a href="https://community.plot.ly/" target="_self"> Community Support </a></li>
53+
<li><a href="https://plotly.com/graphing-libraries" target="_self"> Documentation </a></li>
54+
</ul>
55+
</li>
56+
</ul>
57+
</div>
58+
</section>
59+
<section class="--footer-meta">
60+
<div class="--wrap">
61+
<div class="left">
62+
<article class="--copyright"> Copyright © 2025 Plotly. All rights reserved. </article>
63+
</div>
64+
<div class="right">
65+
<article class="--tos">
66+
<a href="https://community.ploty.com/tos" target="_blank"> Terms of Service </a>
67+
</article>
68+
<article class="--privacy">
69+
<a href="https://plotly.com/privacy/" target="_blank"> Privacy Policy </a>
70+
</article>
71+
</div>
72+
</div>
73+
</section>
74+
</div>
75+
</div>
76+
</footer>

0 commit comments

Comments
 (0)