Skip to content

Commit 18acdc8

Browse files
nikoschamnikoscham
committed
Update footer with updated links
1 parent 158860f commit 18acdc8

3 files changed

Lines changed: 143 additions & 8 deletions

File tree

‎docusaurus.config.js‎

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -96,12 +96,6 @@ const config = {
9696
({
9797
navbar: {
9898
items: [
99-
{
100-
type: "docSidebar",
101-
sidebarId: "docsSidebar",
102-
position: "left",
103-
label: "Docs",
104-
},
10599
{ type: "docsVersionDropdown", position: "right" },
106100
{ href: "https://feascript.com", label: "Website", position: "right" },
107101
{
@@ -126,8 +120,10 @@ const config = {
126120
{
127121
title: "Community",
128122
items: [
129-
{ label: "GitHub", href: "https://github.com/FEAScript" },
130-
{ label: "Contributing", href: "https://github.com/FEAScript/FEAScript-core/blob/main/CONTRIBUTING.md" },
123+
{ label: "Discord", href: "https://discord.gg/3DVjNcuW4f" },
124+
{ label: "GitHub", href: "https://github.com/FEAScript/FEAScript-core" },
125+
{ label: "YouTube", href: "https://www.youtube.com/@FEAScript" },
126+
{ label: "LinkedIn", href: "https://www.linkedin.com/company/feascript/" },
131127
],
132128
},
133129
],

‎src/css/custom.css‎

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -517,6 +517,62 @@ code {
517517
border-top: 1px solid var(--line);
518518
}
519519

520+
.footer__links {
521+
display: grid;
522+
grid-template-columns: minmax(16rem, 2fr) repeat(2, minmax(8rem, 1fr));
523+
gap: 2rem;
524+
}
525+
526+
.footer__col {
527+
width: auto;
528+
margin: 0;
529+
padding: 0;
530+
}
531+
532+
.footer-brand__wordmark {
533+
display: inline-flex;
534+
align-items: center;
535+
gap: 0.05em;
536+
margin-bottom: 1rem;
537+
color: var(--ink-strong);
538+
font-size: 1.5rem;
539+
font-weight: 300;
540+
line-height: 1;
541+
letter-spacing: -0.01em;
542+
}
543+
544+
.footer-brand__wordmark:hover {
545+
color: var(--ink-strong);
546+
opacity: 0.7;
547+
text-decoration: none;
548+
}
549+
550+
.footer-brand__wordmark > svg {
551+
display: block;
552+
width: 0.72em;
553+
height: 0.72em;
554+
}
555+
556+
.footer-brand__wordmark .wm-t {
557+
display: inline;
558+
width: 0.3em;
559+
height: 1.15em;
560+
margin: 0 0 -0.32em 0.02em;
561+
vertical-align: -0.16em;
562+
}
563+
564+
.footer-brand__tagline {
565+
max-width: 22rem;
566+
margin: 0 0 1rem;
567+
color: var(--muted);
568+
}
569+
570+
.footer-brand__email {
571+
color: var(--gold-ink);
572+
font-family: var(--font-mono);
573+
font-size: 0.8125rem;
574+
}
575+
520576
.footer__title {
521577
margin-bottom: 0.75rem;
522578
font-family: var(--font-mono);
@@ -539,6 +595,10 @@ code {
539595
transform 0.15s;
540596
}
541597

598+
.footer__link-item svg[class*="iconExternalLink"] {
599+
display: none;
600+
}
601+
542602
.footer__link-item:hover {
543603
transform: translateX(3px);
544604
text-decoration: none;
@@ -557,3 +617,16 @@ code {
557617
letter-spacing: 0.04em;
558618
color: var(--faint);
559619
}
620+
621+
@media (max-width: 996px) {
622+
.footer__links {
623+
grid-template-columns: repeat(2, minmax(0, 1fr));
624+
}
625+
}
626+
627+
@media (max-width: 576px) {
628+
.footer__links {
629+
grid-template-columns: 1fr;
630+
gap: 1.5rem;
631+
}
632+
}

‎src/theme/Footer/index.js‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
import React from "react";
2+
import Link from "@docusaurus/Link";
3+
import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
4+
5+
function FooterLink({ item }) {
6+
const className = "footer__link-item";
7+
8+
return item.href ? (
9+
<a className={className} href={item.href}>
10+
{item.label}
11+
</a>
12+
) : (
13+
<Link className={className} to={item.to}>
14+
{item.label}
15+
</Link>
16+
);
17+
}
18+
19+
export default function Footer() {
20+
const { siteConfig } = useDocusaurusContext();
21+
const { links, copyright } = siteConfig.themeConfig.footer;
22+
23+
return (
24+
<footer className="footer">
25+
<div className="container">
26+
<div className="footer__links">
27+
<div className="footer__col footer-brand">
28+
<a className="footer-brand__wordmark" href="https://feascript.com" aria-label="FEAScript website">
29+
<svg viewBox="14 79 242 242" aria-hidden="true">
30+
<polygon points="17,254 190,82 253,317" fill="#d4aa00" />
31+
</svg>
32+
<span>
33+
FEAScrip
34+
<svg className="wm-t" viewBox="0 0 30 115" fill="none" stroke="currentColor" aria-hidden="true">
35+
<path strokeWidth="5.9" d="M15 0V100A11.4 11.4 0 0 0 26.4 111.4H29.5" />
36+
<path strokeWidth="5.4" d="M0.4 16.9H29.6" />
37+
</svg>
38+
</span>
39+
</a>
40+
<p className="footer-brand__tagline">
41+
Finite element simulation in JavaScript, for the browser and Node.js.
42+
</p>
43+
<a className="footer-brand__email" href="mailto:info@feascript.com">
44+
info@feascript.com
45+
</a>
46+
</div>
47+
{links.map((column) => (
48+
<div className="footer__col" key={column.title}>
49+
<div className="footer__title">{column.title}</div>
50+
<ul className="footer__items">
51+
{column.items.map((item) => (
52+
<li key={item.label}>
53+
<FooterLink item={item} />
54+
</li>
55+
))}
56+
</ul>
57+
</div>
58+
))}
59+
</div>
60+
<div className="footer__bottom">
61+
<div className="footer__copyright" dangerouslySetInnerHTML={{ __html: copyright }} />
62+
</div>
63+
</div>
64+
</footer>
65+
);
66+
}

0 commit comments

Comments
 (0)