Skip to content

Commit bbb88dc

Browse files
authored
feat: prepare for v2 (#43)
1 parent 14be472 commit bbb88dc

File tree

11 files changed

+350
-160
lines changed

11 files changed

+350
-160
lines changed

docusaurus.config.js

+38-23
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,8 @@
11
// @ts-check
22
// Note: type annotations allow type checking and IDEs autocompletion
33

4-
import versions from './versions.json';
54

65
const lightCodeTheme = require("prism-react-renderer/themes/github");
7-
const darkCodeTheme = require("prism-react-renderer/themes/dracula");
86

97
/** @type {import('@docusaurus/types').Config} */
108
const config = {
@@ -13,8 +11,8 @@ const config = {
1311
favicon: "img/favicon.ico",
1412
url: "https://swiftwave.org",
1513
baseUrl: "/",
16-
organizationName: "swiftwave-org", // Usually your GitHub org/user name.
17-
projectName: "swiftwave", // Usually your repo name.
14+
organizationName: "swiftwave-org",
15+
projectName: "swiftwave",
1816
onBrokenLinks: "throw",
1917
onBrokenMarkdownLinks: "warn",
2018
i18n: {
@@ -39,9 +37,7 @@ const config = {
3937
},
4038
},
4139
},
42-
blog: {
43-
showReadingTime: true,
44-
},
40+
blog: false,
4541
theme: {
4642
customCss: require.resolve("./src/css/custom.css"),
4743
},
@@ -96,7 +92,7 @@ const config = {
9692
},
9793
},
9894
colorMode: {
99-
defaultMode: "dark",
95+
defaultMode: "light",
10096
disableSwitch: true,
10197
respectPrefersColorScheme: false,
10298
},
@@ -146,15 +142,6 @@ const config = {
146142
// label: "Blog",
147143
// position: "left",
148144
// },
149-
// {
150-
// type: "localeDropdown",
151-
// position: "right",
152-
// },
153-
// {
154-
// to: "/docs/manifesto",
155-
// label: "🌱 Manifesto",
156-
// position: "right",
157-
// },
158145
{
159146
type: 'docsVersionDropdown',
160147
position: 'right',
@@ -167,25 +154,50 @@ const config = {
167154
],
168155
},
169156
footer: {
170-
style: "dark",
157+
style: "light",
171158
links: [
172159
{
173160
title: "Documentation",
174161
items: [
175162
{
176-
label: "CLI Reference",
177-
to: "/docs/cli",
163+
label: "Documentation",
164+
to: "/docs",
178165
},
179166
{
180167
label: "GraphQL API Reference",
181168
to: "https://graphql.docs.swiftwave.org/"
182169
},
170+
{
171+
label: "CLI Reference",
172+
to: "/docs/cli",
173+
},
183174
{
184175
label: "REST API Reference",
185176
to: "https://github.com/swiftwave-org/swiftwave/blob/develop/docs/rest_api.md"
186177
}
187178
],
188179
},
180+
{
181+
title: "Important Service",
182+
items: [
183+
{
184+
label: "App Store Metadata",
185+
to: "https://github.com/swiftwave-org/app-store",
186+
},
187+
{
188+
label: "Stats Ninja",
189+
to: "https://github.com/swiftwave-org/stats-ninja",
190+
},
191+
{
192+
label: "Volume Toolkit",
193+
to: "https://github.com/swiftwave-org/volume-toolkit"
194+
},
195+
{
196+
label: "UDP Proxy",
197+
to: "https://github.com/swiftwave-org/udpproxy"
198+
}
199+
],
200+
},
189201
{
190202
title: "Source Code",
191203
items: [
@@ -197,6 +209,10 @@ const config = {
197209
label: "SwiftWave Dashboard",
198210
to: "https://github.com/swiftwave-org/dashboard",
199211
},
212+
{
213+
label: "Custom HAProxy Image",
214+
to: "https://github.com/swiftwave-org/haproxy"
215+
},
200216
{
201217
label: "Quick DNS",
202218
to: "https://github.com/swiftwave-org/dns"
@@ -207,7 +223,7 @@ const config = {
207223
title: "Community",
208224
items: [
209225
{
210-
label: "Join on Slack",
226+
label: "Slack",
211227
to: "https://slack.swiftwave.org/",
212228
},
213229
{
@@ -221,11 +237,10 @@ const config = {
221237
],
222238
},
223239
],
224-
copyright: `Copyright © ${new Date().getFullYear()} SwiftWave, All rights reserved.`,
240+
copyright: `Copyright © 2023 - ${new Date().getFullYear()} SwiftWave, All rights reserved.`,
225241
},
226242
prism: {
227243
theme: lightCodeTheme,
228-
darkTheme: darkCodeTheme,
229244
},
230245
chatwoot: {
231246
websiteToken: "fHNAVUAniYVj5DzwyRNxvxSC",

src/components/github-star-btn.js

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import React, { useEffect } from "react";
2+
3+
export default function GithubStarBtn() {
4+
const [githubStars, setGithubStars] = React.useState("---");
5+
const fetchGithubStars = async () => {
6+
try {
7+
const response = await fetch("https://api.github.com/repos/swiftWave-org/swiftwave");
8+
const data = await response.json();
9+
setGithubStars(data.stargazers_count);
10+
} catch (error) {
11+
console.log(error)
12+
}
13+
}
14+
15+
useEffect(() => {
16+
fetchGithubStars();
17+
}, []);
18+
19+
return (
20+
<div className="flex flex-row gap-2 px-3 py-0.5 justify-center items-center border-[3px] border-gray-400 border-solid rounded-lg cursor-pointer hover:bg-gray-100 hover:border-primary-500 overflow-hidden" onClick={() => window.open("https://github.com/swiftWave-org/swiftwave", "_blank")}>
21+
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" viewBox="0 0 16 16">
22+
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27s1.36.09 2 .27c1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8" />
23+
</svg>
24+
<div className="text-base font-medium font-Roboto hidden md:block">Star</div>
25+
<div className="h-full w-0.5 bg-gray-400 self-stretch -my-1 py-[0.3rem] hidden md:block">&nbsp;</div>
26+
<div className="text-base font-medium font-Roboto">{githubStars}</div>
27+
</div>
28+
);
29+
}

src/components/header.js

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import { CloudIcon } from "@heroicons/react/24/outline";
2+
import { useHistory } from '@docusaurus/router';
3+
4+
5+
export default function Header() {
6+
const history = useHistory();
7+
const openUrl = (link) => {
8+
if (link.startsWith("http") || link.startsWith("https")) {
9+
window.open(link, "_blank");
10+
} else {
11+
history.push(link);
12+
}
13+
}
14+
15+
16+
return (
17+
<div className="mt-20 md:mt-40 mb-10 w-full flex flex-col items-center">
18+
{/* micro announcement bar */}
19+
<div className="text-sm md:text-lg text-black px-4 md:px-6 py-1.5 border border-solid border-gray-300 rounded-full font-Poppins mb-14">
20+
🚀 v2.x released <span className="font-bold cursor-pointer" onClick={() => openUrl("https://github.com/swiftwave-org/swiftwave/releases/tag/2.0.0-1")}>Check here</span>
21+
</div>
22+
{/* tagline */}
23+
<div className="font-Pacifico text-center text-2xl md:text-6xl leading-loose md:leading-loose">
24+
<span className="text-primary-700">Simple Lightweight</span> PaaS<br />
25+
for self-hosting
26+
</div>
27+
{/* cta */}
28+
<div className="mt-20 flex flex-row justify-center gap-3 border-[3px] border-solid border-primary-500 rounded-lg px-6 md:px-12 py-3 md:py-4 text-lg cursor-pointer font-Roboto font-medium hover:bg-primary-500 hover:text-white duration-300" onClick={() => openUrl("/docs/getting_started")}>
29+
<CloudIcon className="w-6 h-6" /><span>Self-host Swiftwave</span>
30+
</div>
31+
</div>
32+
);
33+
}

src/components/info-group.js

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import React from "react";
2+
3+
export default function InfoGroup(props) {
4+
return (
5+
<div className="w-full mt-16 md:mt-20 flex flex-col items-center" >
6+
<div className="text-xl md:text-2xl font-bold font-Poppins">{props.title}</div>
7+
<div className="text-base mt-1 md:text-lg font-medium font-Poppins text-center">{props.subtitle}</div>
8+
<div className="w-full mt-10 font-Roboto flex gap-6 flex-wrap justify-center">
9+
{
10+
(props.infos || []).map((info, index) => {
11+
return (
12+
<div className="w-full md:w-[20%] border-[2px] border-gray-400 border-solid rounded-lg p-3 md:p-5 shadow-md" key={index}>
13+
<div className="flex flex-row justify-start items-center gap-2 font-Poppins">
14+
{
15+
info.icon
16+
}
17+
<div className="text-lg md:text-xl font-bold">{info.title}</div>
18+
</div>
19+
<div className="mt-4 font-Roboto text-justify">
20+
{info.content}
21+
</div>
22+
</div>
23+
);
24+
})
25+
}
26+
</div>
27+
</div>
28+
);
29+
}

src/components/navbar.js

+59
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
import React from "react";
2+
import Logo from "../img/logo.png"
3+
import Link from "@docusaurus/Link";
4+
import GithubStarBtn from "./github-star-btn";
5+
import { Bars4Icon } from "@heroicons/react/16/solid";
6+
import { XMarkIcon } from "@heroicons/react/24/outline";
7+
8+
export default function Navbar() {
9+
const [isMobileNavbarOpen, setIsMobileNavbarOpen] = React.useState(false);
10+
const links = [
11+
{ name: "Docs", href: "/docs" },
12+
{ name: "Community", href: "http://slack.swiftwave.org/" },
13+
{ name: "Contribute", href: "/docs/contribution_guideline" },
14+
{ name: "Support", href: "/docs/support_us" },
15+
]
16+
17+
return (
18+
<>
19+
<div className="flex flex-row justify-between items-center">
20+
{/* Logo */}
21+
<div className="flex flex-row justify-center items-center gap-2 cursor-pointer">
22+
<img src={Logo} className="w-12 h-12" />
23+
<div className="max-h-full flex flex-col items-start justify-center">
24+
<div className="text-2xl font-Comfortaa font-bold p-0 m-0 leading-tight">swiftwave</div>
25+
<p className="p-0 m-0 text-sm leading-tight">open source paas</p>
26+
</div>
27+
</div>
28+
{/* Desktop Links */}
29+
<div className="flex-row gap-8 items-center hidden md:flex">
30+
{
31+
links.map((link) => (
32+
<Link className="custom-navbar-link" key={link.name} href={link.href}>{link.name}</Link>
33+
))
34+
}
35+
</div>
36+
{/* Github btn */}
37+
<GithubStarBtn />
38+
{/* Mobile Hamburger */}
39+
<div className="h-8 w-8 p-0.5 text-gray-600 rounded-md transition-all block md:hidden" onClick={() => setIsMobileNavbarOpen(!isMobileNavbarOpen)}>
40+
{
41+
isMobileNavbarOpen ? <XMarkIcon className="h-6 w-6" /> : <Bars4Icon className="h-6 w-6" />
42+
}
43+
</div>
44+
</div>
45+
{/* Mobile Links */}
46+
{
47+
isMobileNavbarOpen && (
48+
<div className="flex flex-col gap-2 mt-4 mb-2 bg-gray-50 p-2 rounded-md">
49+
{
50+
links.map((link) => (
51+
<Link className="custom-navbar-link" key={link.name} href={link.href}>{link.name}</Link>
52+
))
53+
}
54+
</div>
55+
)
56+
}
57+
</>
58+
);
59+
}

src/css/custom.css

+30-11
Original file line numberDiff line numberDiff line change
@@ -4,18 +4,19 @@
44
* work well for content-centric websites.
55
*/
66

7+
8+
@import url('https://fonts.googleapis.com/css2?family=Comfortaa:[email protected]&family=Pacifico&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
9+
710
@tailwind utilities;
811

9-
[data-theme='dark'] {
10-
--ifm-color-primary: #af8aff;
11-
--ifm-color-primary-dark: #9463ff;
12-
--ifm-color-primary-darker: #8f5bff;
13-
--ifm-color-primary-darkest: #8147ff;
14-
--ifm-color-primary-light: #cab1ff;
15-
--ifm-color-primary-lighter: #d7c5ff;
16-
--ifm-color-primary-lightest: #ffffff;
17-
--ifm-background-color: #111827;
18-
--ifm-navbar-background-color: #111827;
12+
[data-theme='light'] {
13+
--ifm-color-primary-light: #ede9fe;
14+
--ifm-color-primary-lighter: #c4b5fd;
15+
--ifm-color-primary-lightest: #a78bfa;
16+
--ifm-color-primary: #8b5cf6;
17+
--ifm-color-primary-dark: #7c3aed;
18+
--ifm-color-primary-darker: #5b21b6;
19+
--ifm-color-primary-darkest: #4c1d95;
1920
}
2021

2122
.markdown header h1 {
@@ -25,4 +26,22 @@
2526
img {
2627
width: auto;
2728
height: auto;
28-
}
29+
}
30+
31+
.custom-navbar-link {
32+
@apply font-Roboto text-base font-medium md:font-normal md:text-lg text-black;
33+
text-decoration: none!important;
34+
}
35+
36+
::-webkit-scrollbar {
37+
width: 9px;
38+
height: 9px;
39+
}
40+
41+
::-webkit-scrollbar-track {
42+
@apply rounded-md bg-gray-200;
43+
}
44+
45+
::-webkit-scrollbar-thumb {
46+
@apply rounded-md bg-primary-500;
47+
}

src/img/full-logo.png

6.34 KB
Loading

src/img/logo.png

17.4 KB
Loading

0 commit comments

Comments
 (0)