Skip to content

Commit 05235fc

Browse files
HaudinFlorenceSylvainCorlay
HaudinFlorence
authored and
SylvainCorlay
committed
Update footer and fix a column width issue in projects page in desktop design.
1 parent 61b8f46 commit 05235fc

4 files changed

Lines changed: 101 additions & 43 deletions

File tree

‎.docusaurus/docusaurus.config.mjs‎

Lines changed: 25 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ export default {
4646
"title": "",
4747
"logo": {
4848
"alt": "QuantStack Logo",
49-
"src": "/img/quantstack/logo-website.svg"
49+
"src": "img/quantstack/logo-website.svg"
5050
},
5151
"items": [
5252
{
@@ -115,17 +115,35 @@ export default {
115115
"title": " ",
116116
"items": [
117117
{
118-
"html": "\n \n <img src=\"img/quantstack/logo-quantstack.svg\" alt=\"QuantStack logo\" width=\"200px\" />\n <div class=\"footer-astronaut\">\n <img src=\"img/quantstack/astronaut-footer.svg\" alt=\"Astronaut\" />\n </div>\n "
118+
"label": " ",
119+
"className": "quantstack-astronaut-footer",
120+
"href": "/home"
119121
}
120122
]
121123
},
122124
{
123-
"title": " ",
125+
"title": "Follow us on",
124126
"items": [
125127
{
126-
"label": "Home",
127-
"href": "/home/"
128+
"label": "GitHub",
129+
"className": "github-icon",
130+
"href": "https://github.com/QuantStack"
131+
},
132+
{
133+
"label": "LinkedIn",
134+
"className": "linkedin-icon",
135+
"href": "https://www.linkedin.com/company/quantstack/mycompany/"
128136
},
137+
{
138+
"label": "X",
139+
"className": "x-icon",
140+
"href": "https://twitter.com/QuantStack"
141+
}
142+
]
143+
},
144+
{
145+
"title": "Menu ",
146+
"items": [
129147
{
130148
"label": "Projects",
131149
"href": "/projects/"
@@ -152,11 +170,12 @@ export default {
152170
"title": " ",
153171
"items": [
154172
{
155-
"html": "\n <div>\n <div class=\"social-media-links\">\n <a href=\"https://github.com/QuantStack\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"Visit our Github page\">\n <img src=\"img/socialmedias/GH.svg\" alt=\"Visit our GitHub page\" width=\"36\" height=\"36\" />\n </a>\n <a href=\"https://www.linkedin.com/company/quantstack/mycompany/\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"Visit our LinkedIn page\">\n <img src=\"img/socialmedias/LinkedIn.svg\" alt=\"Visit our LinkedIn page\" width=\"36\" height=\"36\" />\n </a>\n <a href=\"https://twitter.com/QuantStack\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"Visit our X page\">\n <img src=\"img/socialmedias/X.svg\" alt=\"Visit our X page\" width=\"36\" height=\"36\" />\n </a>\n </div>\n <div class=\"office-address\">\n <b>QuantStack Office </b><br/>\n 16 avenue Curti <br/>\n 94 100 Saint Maur des Fossés <br/>\n France\n </div>\n </div>\n "
173+
"html": "\n \n <div class=\"office-address\">\n <b> QuantStack Office </b> <br/> \n <br/>\n 16, avenue Curti <br/>\n 94 100 Saint Maur des Fossés <br/>\n France\n </div>\n \n "
156174
}
157175
]
158176
}
159177
],
178+
"copyright": "Copyright © 2024 · QuantStack website · Built with Docusaurus",
160179
"style": "light"
161180
},
162181
"prism": {

‎docusaurus.config.ts‎

Lines changed: 36 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@ import { themes as prismThemes } from "prism-react-renderer";
22
import type { Config } from "@docusaurus/types";
33
import type * as Preset from "@docusaurus/preset-classic";
44

5+
let copyright = `Copyright © ${new Date().getFullYear()} · QuantStack website · Built with Docusaurus`;
6+
57
const config: Config = {
68
title: "QuantStack",
79
tagline: "",
@@ -62,8 +64,7 @@ const config: Config = {
6264
title: "",
6365
logo: {
6466
alt: "QuantStack Logo",
65-
src: "/img/quantstack/logo-website.svg"
66-
67+
src: "img/quantstack/logo-website.svg",
6768
},
6869

6970
items: [
@@ -129,30 +130,43 @@ const config: Config = {
129130
},
130131
],
131132
},
132-
133+
133134
footer: {
134135
links: [
135136
{
136137
title: " ",
137138
items: [
138139
{
139-
html: `
140-
141-
<img src="img/quantstack/logo-quantstack.svg" alt="QuantStack logo" width="200px" />
142-
<div class="footer-astronaut">
143-
<img src="img/quantstack/astronaut-footer.svg" alt="Astronaut" />
144-
</div>
145-
`,
140+
label: " ",
141+
className: "quantstack-astronaut-footer",
142+
href: "/home",
146143
},
147144
],
148145
},
146+
149147
{
150-
title: " ",
148+
title: "Follow QuantStack on",
151149
items: [
152150
{
153-
label: "Home",
154-
href: "/home/",
151+
label: "GitHub",
152+
className: "github-icon",
153+
href: "https://github.com/QuantStack",
154+
},
155+
{
156+
label: "LinkedIn",
157+
className: "linkedin-icon",
158+
href: "https://www.linkedin.com/company/quantstack/mycompany/",
155159
},
160+
{
161+
label: "X",
162+
className: "x-icon",
163+
href: "https://twitter.com/QuantStack",
164+
},
165+
],
166+
},
167+
{
168+
title: "Menu ",
169+
items: [
156170
{
157171
label: "Projects",
158172
href: "/projects/",
@@ -175,35 +189,29 @@ const config: Config = {
175189
},
176190
],
177191
},
192+
193+
178194
{
179195
title: " ",
180196
items: [
181197
{
182198
html: `
183-
<div>
184-
<div class="social-media-links">
185-
<a href="https://github.com/QuantStack" target="_blank" rel="noreferrer noopener" aria-label="Visit our Github page">
186-
<img src="img/socialmedias/GH.svg" alt="Visit our GitHub page" width="36" height="36" />
187-
</a>
188-
<a href="https://www.linkedin.com/company/quantstack/mycompany/" target="_blank" rel="noreferrer noopener" aria-label="Visit our LinkedIn page">
189-
<img src="img/socialmedias/LinkedIn.svg" alt="Visit our LinkedIn page" width="36" height="36" />
190-
</a>
191-
<a href="https://twitter.com/QuantStack" target="_blank" rel="noreferrer noopener" aria-label="Visit our X page">
192-
<img src="img/socialmedias/X.svg" alt="Visit our X page" width="36" height="36" />
193-
</a>
194-
</div>
199+
195200
<div class="office-address">
196-
<b>QuantStack Office </b><br/>
197-
16 avenue Curti <br/>
201+
<b> QuantStack Office </b> <br/>
202+
<br/>
203+
16, avenue Curti <br/>
198204
94 100 Saint Maur des Fossés <br/>
199205
France
200206
</div>
201-
</div>
207+
202208
`,
203209
},
204210
],
205211
},
206212
],
213+
214+
copyright: copyright,
207215
},
208216

209217
prism: {

‎src/components/projects/desktop/ProjectDesktop.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ export default function ProjectDesktop({
1919
</div>
2020
</div>
2121
<div
22-
className={"col col--3" + " " + styles.col_custom_picture_right}
22+
className={"col col--4" + " " + styles.col_custom_picture_right}
2323
style={{ border: project.pictureBorderDesktop }}
2424
>
2525
<div className={styles.project_picture}></div>

‎src/css/custom.css‎

Lines changed: 39 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -45,11 +45,13 @@
4545
--ifm-spacing-lg: 24px;
4646
--ifm-spacing-xl: 36px;
4747
--ifm-spacing-2xl: 56px;
48+
--ifm-spacing-7xl: 240px;
4849
--ifm-spacing-3xl: 64px;
4950
--ifm-spacing-4xl: 96px;
5051
--ifm-spacing-5xl: 120px;
5152
--ifm-spacing-6xl: 144px;
5253
--ifm-spacing-7xl: 240px;
54+
--ifm-spacing-8xl: 400px;
5355
}
5456

5557
@media only screen and (max-width: 996px) {
@@ -98,6 +100,10 @@
98100
line-height: 20px; /* 142.857% */
99101
letter-spacing: 0.25px;
100102
}
103+
104+
.office-address {
105+
106+
}
101107
}
102108

103109
@media only screen and (min-width: 996px) {
@@ -148,7 +154,7 @@
148154
.container {
149155
max-width: none;
150156
}
151-
}
157+
}
152158

153159
p {
154160
font-family: var(--ifm-font-family-roboto);
@@ -159,6 +165,15 @@
159165
text-align: justify;
160166
/*margin-bottom: var(--ifm-spacing-lg);*/
161167
}
168+
.office-address {
169+
margin-left: var(--ifm-spacing-6xl);
170+
text-align: start;
171+
color: var(--ifm-color-neutral-black);
172+
}
173+
.social-media-links {
174+
margin-left: var(--ifm-spacing-3xl);
175+
text-align: start;
176+
}
162177
}
163178

164179
.spacing-none {
@@ -185,7 +200,6 @@
185200
height: var(--ifm-spacing-lg);
186201
}
187202

188-
189203
.spacing-xl {
190204
height: var(--ifm-spacing-xl);
191205
}
@@ -213,6 +227,11 @@
213227
.spacing-7xl {
214228
height: var(--ifm-spacing-7xl);
215229
}
230+
231+
.spacing-8xl {
232+
height: var(--ifm-spacing-8xl);
233+
}
234+
216235
.link-container {
217236
display: flex;
218237
align-items: center;
@@ -290,12 +309,6 @@
290309
text-align: start;
291310
}
292311

293-
.office-address {
294-
margin-left: var(--ifm-spacing-3xl);
295-
text-align: start;
296-
color: var(--ifm-color-neutral-black);
297-
}
298-
299312
/*
300313
Hyperlink states are crucial for accessibility.
301314
Please double check before changing the rules below.
@@ -401,11 +414,29 @@ a.menu__link:active {
401414
background: url(@site/static/img/quantstack/logo-website.svg);
402415
content: "";
403416
display: flex;
417+
height: 40px;
418+
width: 40px;
419+
background-repeat: no-repeat;
420+
}
421+
422+
.quantstack-astronaut {
423+
background: url(@site/static/img/quantstack/astronaut.svg);
424+
content: "";
425+
display: flex;
404426
height: 100px;
405427
width: 100px;
406428
background-repeat: no-repeat;
407429
}
408430

431+
.quantstack-astronaut-footer {
432+
background: url(@site/static/img/quantstack/astronaut-footer.svg);
433+
content: "";
434+
display: flex;
435+
height: 200px;
436+
width: 200px;
437+
background-repeat: no-repeat;
438+
}
439+
409440
.github-icon:hover {
410441
opacity: 0.6;
411442
}

0 commit comments

Comments
 (0)