Skip to content

Commit

Permalink
Update footer and fix a column width issue in projects page in deskto…
Browse files Browse the repository at this point in the history 
…p design.
  • Loading branch information
@HaudinFlorence
HaudinFlorence committed Jun 7, 2024
1 parent 263a849 commit 4fa5af5
Show file tree
Hide file tree
Showing 4 changed files with 101 additions and 43 deletions.
31 changes: 25 additions & 6 deletions .docusaurus/docusaurus.config.mjs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ export default {
"title": "",
"logo": {
"alt": "QuantStack Logo",
"src": "/img/quantstack/logo-website.svg"
"src": "img/quantstack/logo-website.svg"
},
"items": [
{
Expand Down Expand Up @@ -115,17 +115,35 @@ export default {
"title": " ",
"items": [
{
"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 "
"label": " ",
"className": "quantstack-astronaut-footer",
"href": "/home"
}
]
},
{
"title": " ",
"title": "Follow us on",
"items": [
{
"label": "Home",
"href": "/home/"
"label": "GitHub",
"className": "github-icon",
"href": "https://github.com/QuantStack"
},
{
"label": "LinkedIn",
"className": "linkedin-icon",
"href": "https://www.linkedin.com/company/quantstack/mycompany/"
},
{
"label": "X",
"className": "x-icon",
"href": "https://twitter.com/QuantStack"
}
]
},
{
"title": "Menu ",
"items": [
{
"label": "Projects",
"href": "/projects/"
Expand All @@ -152,11 +170,12 @@ export default {
"title": " ",
"items": [
{
"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 "
"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 "
}
]
}
],
"copyright": "Copyright © 2024 · QuantStack website · Built with Docusaurus",
"style": "light"
},
"prism": {
Expand Down
64 changes: 36 additions & 28 deletions docusaurus.config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@ import { themes as prismThemes } from "prism-react-renderer";
import type { Config } from "@docusaurus/types";
import type * as Preset from "@docusaurus/preset-classic";

let copyright = `Copyright © ${new Date().getFullYear()} · QuantStack website · Built with Docusaurus`;

const config: Config = {
title: "QuantStack",
tagline: "",
Expand Down Expand Up @@ -62,8 +64,7 @@ const config: Config = {
title: "",
logo: {
alt: "QuantStack Logo",
src: "/img/quantstack/logo-website.svg"

src: "img/quantstack/logo-website.svg",
},

items: [
Expand Down Expand Up @@ -129,30 +130,43 @@ const config: Config = {
},
],
},

footer: {
links: [
{
title: " ",
items: [
{
html: `
<img src="img/quantstack/logo-quantstack.svg" alt="QuantStack logo" width="200px" />
<div class="footer-astronaut">
<img src="img/quantstack/astronaut-footer.svg" alt="Astronaut" />
</div>
`,
label: " ",
className: "quantstack-astronaut-footer",
href: "/home",
},
],
},

{
title: " ",
title: "Follow us on",
items: [
{
label: "Home",
href: "/home/",
label: "GitHub",
className: "github-icon",
href: "https://github.com/QuantStack",
},
{
label: "LinkedIn",
className: "linkedin-icon",
href: "https://www.linkedin.com/company/quantstack/mycompany/",
},
{
label: "X",
className: "x-icon",
href: "https://twitter.com/QuantStack",
},
],
},
{
title: "Menu ",
items: [
{
label: "Projects",
href: "/projects/",
Expand All @@ -175,35 +189,29 @@ const config: Config = {
},
],
},


{
title: " ",
items: [
{
html: `
<div>
<div class="social-media-links">
<a href="https://github.com/QuantStack" target="_blank" rel="noreferrer noopener" aria-label="Visit our Github page">
<img src="img/socialmedias/GH.svg" alt="Visit our GitHub page" width="36" height="36" />
</a>
<a href="https://www.linkedin.com/company/quantstack/mycompany/" target="_blank" rel="noreferrer noopener" aria-label="Visit our LinkedIn page">
<img src="img/socialmedias/LinkedIn.svg" alt="Visit our LinkedIn page" width="36" height="36" />
</a>
<a href="https://twitter.com/QuantStack" target="_blank" rel="noreferrer noopener" aria-label="Visit our X page">
<img src="img/socialmedias/X.svg" alt="Visit our X page" width="36" height="36" />
</a>
</div>
<div class="office-address">
<b>QuantStack Office </b><br/>
16 avenue Curti <br/>
<b> QuantStack Office </b> <br/>
<br/>
16, avenue Curti <br/>
94 100 Saint Maur des Fossés <br/>
France
</div>
</div>
`,
},
],
},
],

copyright: copyright,
},

prism: {
Expand Down
2 changes: 1 addition & 1 deletion src/components/projects/desktop/ProjectDesktop.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ export default function ProjectDesktop({
</div>
</div>
<div
className={"col col--3" + " " + styles.col_custom_picture_right}
className={"col col--4" + " " + styles.col_custom_picture_right}
style={{ border: project.pictureBorderDesktop }}
>
<div className={styles.project_picture}></div>
Expand Down
47 changes: 39 additions & 8 deletions src/css/custom.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,11 +45,13 @@
--ifm-spacing-lg: 24px;
--ifm-spacing-xl: 36px;
--ifm-spacing-2xl: 56px;
--ifm-spacing-7xl: 240px;
--ifm-spacing-3xl: 64px;
--ifm-spacing-4xl: 96px;
--ifm-spacing-5xl: 120px;
--ifm-spacing-6xl: 144px;
--ifm-spacing-7xl: 240px;
--ifm-spacing-8xl: 400px;
}

@media only screen and (max-width: 996px) {
Expand Down Expand Up @@ -98,6 +100,10 @@
line-height: 20px; /* 142.857% */
letter-spacing: 0.25px;
}

.office-address {

}
}

@media only screen and (min-width: 996px) {
Expand Down Expand Up @@ -148,7 +154,7 @@
.container {
max-width: none;
}
}
}

p {
font-family: var(--ifm-font-family-roboto);
Expand All @@ -159,6 +165,15 @@
text-align: justify;
/*margin-bottom: var(--ifm-spacing-lg);*/
}
.office-address {
margin-left: var(--ifm-spacing-6xl);
text-align: start;
color: var(--ifm-color-neutral-black);
}
.social-media-links {
margin-left: var(--ifm-spacing-3xl);
text-align: start;
}
}

.spacing-none {
Expand All @@ -185,7 +200,6 @@
height: var(--ifm-spacing-lg);
}


.spacing-xl {
height: var(--ifm-spacing-xl);
}
Expand Down Expand Up @@ -213,6 +227,11 @@
.spacing-7xl {
height: var(--ifm-spacing-7xl);
}

.spacing-8xl {
height: var(--ifm-spacing-8xl);
}

.link-container {
display: flex;
align-items: center;
Expand Down Expand Up @@ -290,12 +309,6 @@
text-align: start;
}

.office-address {
margin-left: var(--ifm-spacing-3xl);
text-align: start;
color: var(--ifm-color-neutral-black);
}

/*
Hyperlink states are crucial for accessibility.
Please double check before changing the rules below.
Expand Down Expand Up @@ -401,11 +414,29 @@ a.menu__link:active {
background: url(@site/static/img/quantstack/logo-website.svg);
content: "";
display: flex;
height: 40px;
width: 40px;
background-repeat: no-repeat;
}

.quantstack-astronaut {
background: url(@site/static/img/quantstack/astronaut.svg);
content: "";
display: flex;
height: 100px;
width: 100px;
background-repeat: no-repeat;
}

.quantstack-astronaut-footer {
background: url(@site/static/img/quantstack/astronaut-footer.svg);
content: "";
display: flex;
height: 200px;
width: 200px;
background-repeat: no-repeat;
}

.github-icon:hover {
opacity: 0.6;
}
Expand Down

0 comments on commit 4fa5af5

Please sign in to comment.