chore: more website fixes (#490)

vladfrangu · web-flow · commit f49546c7801f · 2022-06-13T10:16:01.000+03:00
diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js
@@ -102,7 +102,8 @@ const config = {
 					customCss: [
 						require.resolve('./src/css/custom.scss'),
 						require.resolve('./src/css/tippy-discord.css'),
-						require.resolve('./src/css/discordjs.scss')
+						require.resolve('./src/css/discordjs.scss'),
+						require.resolve('./src/css/font.scss')
 					]
 				}
 			})
@@ -166,6 +167,9 @@ const config = {
 				{ property: 'og:url', content: BaseUrl }
 			],
 			navbar: {
+				logo: {
+					src: '/svgs/mini_logo.svg'
+				},
 				items: [
 					{
 						to: '/',
diff --git a/website/src/components/Home/HeadTags.tsx b/website/src/components/Home/HeadTags.tsx
@@ -21,12 +21,6 @@ const HeadTags: FC = () => (
 		<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#23529B" />
 		<link rel="shortcut icon" href="/favicon.ico" />
 		<link rel="apple-touch-startup-image" href="/apple-startup.png" />
-
-		<link
-			rel="preload prerender stylesheet"
-			as="style"
-			href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;700&display=swap"
-		/>
 	</Head>
 );
 
diff --git a/website/src/components/Home/HomePageHeader.module.css b/website/src/components/Home/HomePageHeader.module.css
@@ -12,21 +12,15 @@
 }
 
 .logo {
-	margin-top: -4rem;
-	margin-bottom: -4rem;
-	max-height: 24rem;
+	margin-bottom: 2rem;
+	max-height: 12rem;
 }
 
 .fontSemiTitle {
 	font-size: 2.5rem;
 }
 
 @media screen and (max-width: 966px) {
-	.logo {
-		padding-top: 4rem;
-		padding-bottom: 4rem;
-	}
-
 	.fontSemiTitle {
 		font-size: 1.5rem;
 	}
diff --git a/website/src/css/custom.scss b/website/src/css/custom.scss
@@ -74,15 +74,13 @@ footer > .container {
 }
 
 .markdown__logo {
-	margin-top: -8rem;
-	margin-bottom: -8rem;
+	max-height: 12rem;
+	margin-top: 1rem;
+	margin-bottom: 2rem;
 }
 
-@media screen and (max-width: 966px) {
-	.markdown__logo {
-		padding-top: 6rem;
-		padding-bottom: 6rem;
-	}
+.navbar__logo {
+	margin: 0;
 }
 
 .navbar__logo > img {
@@ -114,15 +112,17 @@ footer > .container {
 	padding-left: 1rem;
 }
 
-.navbar__item {
+.navbar__item,
+.navbar__brand {
 	margin-right: 2rem;
 	font-size: 14px;
 	height: 100%;
 	align-items: center;
 	border-radius: 0.375rem;
 }
 
-.navbar__item:hover {
+.navbar__item:hover,
+.navbar__brand:hover {
 	background-color: rgba($color: #000000, $alpha: 0.3);
 	border-radius: 0.375rem;
 }
diff --git a/website/src/css/font.scss b/website/src/css/font.scss
@@ -0,0 +1 @@
+@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;700&display=swap');
diff --git a/website/static/svgs/logo_long_blurple.svg b/website/static/svgs/logo_long_blurple.svg
diff --git a/website/static/svgs/mini_logo.svg b/website/static/svgs/mini_logo.svg
@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg preserveAspectRatio="none" version="1.1" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<defs>
+<g id="a">
+<path d="m561.3 552.35v-40l-132.75 65.15v31.95l132.75 65.15v-40l-85.2-41 85.2-41.25m-168.35-166.65q-16.9-10.55-41.75-16.15-24.8-5.85-59-5.85h-101.55v279.95h98.75q33.4 0 57.9-4.9 24.45-4.9 44.9-17.3 12.3-7.45 22.7-17.85v-34.4l31.95-15.65q8.35-22.95 8.35-49.65 0-40.6-16.5-70.45-16.75-30.1-45.75-47.75m-130.1 30.25h18.2q23.35 0 35 2.05 11.5 1.9 22.55 7.35 21.85 11.05 31.95 30.8 10.05 19.6 10.05 47.2 0 27.85-9.25 46.85-9.2 18.8-28.95 30.05-11.5 6.25-23.55 8.65-12 2.25-37.8 2.25h-18.2v-175.2m407.5-1.45h116.95v-54.15h-306.1v54.15h116.9v304.9h72.25v-304.9m36.8 97.85v39.95l85.1 41.1-85.1 41.1v40.05l132.7-65.15v-31.95l-132.7-65.1z" fill="#fff" fill-opacity=".99608"/>
+</g>
+<g id="b">
+<path d="m534.4 621.65q-0.8418 0.21426-1.65 0.4-21.2 4.85-35.35 7.35-10.226 1.9352-21.2 3.45l85.1 41.75v-40l-26.9-12.95m209.8-1.9q-1.9207-0.31816-4.8-0.85l-32.25 15.6v40.05l103.05-50.6q-16.063 0.80801-30.65-0.05-15.45-0.9-35.35-4.15m-73.85 61.55v-74.4q-17.584-2.2-32.25-2.2-16.05 0-34.95 2.7-2.4557 0.35195-5.05 0.75v74.1q3.1031-0.35684 5.35-0.6 19.85-2.05 35.35-2.05 13.963 0 31.55 1.7z" fill="#5C6CFF"/>
+<path d="m561.3 538.75q-22.562 2.4229-28.8 2.95-19.542 1.7631-34.7 1.8l-69.25 34v31.95l47.65 23.4q10.974-1.5148 21.2-3.45 14.15-2.5 35.35-7.35 0.8082-0.18574 1.65-0.4l-58.3-28.05 85.2-41.25v-13.6m147.8 7.3q-0.9873-0.19785-1.95-0.4v6.65l85.1 41.1-52.85 25.5q2.8793 0.53184 4.8 0.85 19.9 3.25 35.35 4.15 14.587 0.85801 30.65 0.05l29.65-14.55v-31.95l-46.5-22.85q-6.9828 0.5-13.65 0.5-15.9 0-35.3-2.75-13.35-1.9-35.3-6.3m-38.75 60.85v-68.35q-17.786-2.9322-31.9-3.8-15.95-0.95-35.3 0.15-2.3988 0.14121-5.05 0.3v72.95q2.5943-0.39805 5.05-0.75 18.9-2.7 34.95-2.7 14.666 0 32.25 2.2z" fill="#5CFF9D"/>
+<path d="m532.5 541.7q6.2377-0.52715 28.8-2.95v-26.4l-63.5 31.15q15.158-0.036914 34.7-1.8m174.65 3.95q0.9627 0.20215 1.95 0.4 21.95 4.4 35.3 6.3 19.4 2.75 35.3 2.75 6.6672 0 13.65-0.5l-86.2-42.25v33.3m-36.8-7.1v-76.85q-16.172-0.37012-31.55 0.95-15.25 1.3-35.35 4.85-1.2656 0.22422-5.35 1v66.7q2.6512-0.15879 5.05-0.3 19.35-1.1 35.3-0.15 14.114 0.86777 31.9 3.8z" fill="#FFDB5C"/>
+<path d="m670.35 719.4v-38.1q-17.587-1.7-31.55-1.7-15.5 0-35.35 2.05-2.2469 0.24316-5.35 0.6v37.15h72.25z" fill="#B75CFF"/>
+<path d="m708.9 395q-19.35-1.75-35.15-1.15-18.6 0.7-34.95 4.7-15 3.55-35.35 11.85-4.1125 1.6934-9.7 4.1h4.35v54q4.0844-0.77578 5.35-1 20.1-3.55 35.35-4.85 15.378-1.3201 31.55-0.95v-47.2h116.95v-9.5q-3.9258-0.39453-7.75-0.85-8-0.95-35.35-4.85-21.9-3.1-35.3-4.3z" fill="#F79454"/>
+<path d="m673.75 393.85q15.8-0.6 35.15 1.15 13.4 1.2 35.3 4.3 27.35 3.9 35.35 4.85 3.8242 0.45547 7.75 0.85v-44.65h-306.1v54.15h112.55q5.5875-2.4066 9.7-4.1 20.35-8.3 35.35-11.85 16.35-4 34.95-4.7z" fill="#FF5C5C"/>
+</g>
+</defs>
+<g>
+<use xlink:href="#a"/>
+</g>
+<g>
+<use xlink:href="#b"/>
+</g>
+</svg>

Original file line number	Diff line number	Diff line change
`@@ -102,7 +102,8 @@ const config = {`
`102`	`102`	`customCss: [`
`103`	`103`	`require.resolve('./src/css/custom.scss'),`
`104`	`104`	`require.resolve('./src/css/tippy-discord.css'),`
`105`		`- require.resolve('./src/css/discordjs.scss')`
	`105`	`+ require.resolve('./src/css/discordjs.scss'),`
	`106`	`+ require.resolve('./src/css/font.scss')`
`106`	`107`	`]`
`107`	`108`	`}`
`108`	`109`	`})`
`@@ -166,6 +167,9 @@ const config = {`
`166`	`167`	`{ property: 'og:url', content: BaseUrl }`
`167`	`168`	`],`
`168`	`169`	`navbar: {`
	`170`	`+ logo: {`
	`171`	`+ src: '/svgs/mini_logo.svg'`
	`172`	`+ },`
`169`	`173`	`items: [`
`170`	`174`	`{`
`171`	`175`	`to: '/',`
Original file line number	Diff line number	Diff line change
`@@ -12,21 +12,15 @@`
`12`	`12`	`}`
`13`	`13`
`14`	`14`	`.logo {`
`15`		`- margin-top: -4rem;`
`16`		`- margin-bottom: -4rem;`
`17`		`- max-height: 24rem;`
	`15`	`+ margin-bottom: 2rem;`
	`16`	`+ max-height: 12rem;`
`18`	`17`	`}`
`19`	`18`
`20`	`19`	`.fontSemiTitle {`
`21`	`20`	`font-size: 2.5rem;`
`22`	`21`	`}`
`23`	`22`
`24`	`23`	`@media screen and (max-width: 966px) {`
`25`		`- .logo {`
`26`		`- padding-top: 4rem;`
`27`		`- padding-bottom: 4rem;`
`28`		`- }`
`29`		`-`
`30`	`24`	`.fontSemiTitle {`
`31`	`25`	`font-size: 1.5rem;`
`32`	`26`	`}`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1 @@`
	`1`	`+@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;700&display=swap');`