Skip to content

Commit ec99fea

Browse files
IanSSenneIanSSenne
committed
add .env, add endpoint for getting number of members in the discord server.
1 parent 4c8bb7b commit ec99fea

40 files changed

+3777
-213
lines changed

‎.gitignore

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,3 +32,8 @@ yarn-error.log*
3232

3333
# vercel
3434
.vercel
35+
36+
.vercel
37+
38+
39+
.env

‎assets/gif/aj_armor_stand_run_in_place.gif

1.5 MB
Loading

‎assets/gif/animated_java_armor_stand_hiding.gif

3.34 MB
Loading

‎assets/gif/animated_java_armor_stand_running_right.gif

1.04 MB
Loading

‎assets/ico/discord.svg

Lines changed: 4 additions & 0 deletions
Loading

‎assets/ico/github.dark.svg

Lines changed: 11 additions & 0 deletions
Loading

‎assets/ico/github.svg

Lines changed: 11 additions & 0 deletions
Loading

‎assets/ico/patreon.svg

Lines changed: 5 additions & 0 deletions
Loading

‎assets/splash.png

1.08 MB
Loading

‎components/banner.js

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import styles from "./banner.module.less";
2+
import SplashImage from "../assets/splash.png";
3+
import Image from "next/image"
4+
import { useMedia } from "react-use";
5+
import classNames from "classnames";
6+
export function Banner() {
7+
const small = useMedia("(max-width:500px)",false);
8+
const med = useMedia("(max-width:1000px)",false) && !small;
9+
const large = useMedia("(min-width:1000px)",true) && !med;
10+
return (
11+
<div className={styles.root}>
12+
<div className={classNames(styles.content,large && styles.large,med&&styles.medium,small&&styles.small)}>
13+
<Image src={SplashImage} alt={"splash"}></Image>
14+
<div className={styles.gradient}></div>
15+
</div>
16+
</div>
17+
);
18+
}

‎components/banner.module.less

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
.root {
2+
display: flex;
3+
justify-content: center;
4+
> .content {
5+
position: relative;
6+
&.large {
7+
clip-path: path(
8+
"M10 0.5H1534C1537.04 0.5 1539.5 2.96243 1539.5 6V779.016C1539.5 782.415 1536.73 785.001 1533.42 784.513C1478.54 776.418 1094.27 721.5 770.345 721.5C446.536 721.5 65.2593 776.38 10.582 784.505C7.27636 784.996 4.5 782.409 4.5 779.008V5.99998C4.5 2.96242 6.96243 0.5 10 0.5Z"
9+
);
10+
}
11+
&.medium {
12+
clip-path: path(
13+
"M10 0.5H702C705.038 0.5 707.5 2.96244 707.5 6V777.682C707.5 781.443 703.88 784.13 700.302 783.004C662.647 771.154 496.452 721.5 355.241 721.5C214.132 721.5 49.25 771.083 11.7184 782.979C8.13692 784.114 4.5 781.427 4.5 777.661V5.99998C4.5 2.96242 6.96243 0.5 10 0.5Z"
14+
);
15+
}
16+
&.small {
17+
clip-path: path(
18+
"M10 0.5H318C321.038 0.5 323.5 2.96243 323.5 6V860.726C323.5 865.36 318.067 868.072 314.319 865.318C301.822 856.136 278.716 840.244 251.466 826.645C224.226 813.051 192.794 801.722 163.655 801.722C134.555 801.722 103.276 813.021 76.192 826.591C49.0984 840.167 26.152 856.041 13.7043 865.247C9.95643 868.018 4.5 865.307 4.5 860.662V5.99998C4.5 2.96242 6.96243 0.5 10 0.5Z"
19+
);
20+
}
21+
> .gradient {
22+
background: linear-gradient(
23+
180deg,
24+
#333333 0%,
25+
rgba(255, 255, 255, 0) 100%
26+
);
27+
position: absolute;
28+
top: 0;
29+
left: 0;
30+
width: 100%;
31+
height: 100%;
32+
}
33+
}
34+
}

‎components/footer.js

Lines changed: 136 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,136 @@
1+
import classNames from "classnames";
2+
import { useContext, useState } from "react";
3+
import styles from "./footer.module.less";
4+
import { DiscordSocial, GithubSocial, PatreonSocial } from "./social";
5+
import { ThemeContext } from "./theme-select";
6+
import { navItems } from "../data/links";
7+
import Link from "next/link";
8+
import { useEffectOnce, useMedia } from "react-use";
9+
10+
export function Footer({ minimal }) {
11+
const { theme } = useContext(ThemeContext);
12+
const [isFirstRender,setIsFirstRender] = useState(true);
13+
let medium = useMedia("(max-width:850px)", false);
14+
let small = useMedia("(max-width:450px)", false);
15+
useEffectOnce(()=>{
16+
setIsFirstRender(false);
17+
})
18+
if(isFirstRender) medium=small=false;
19+
if (minimal) {
20+
return (
21+
<div className={classNames(styles.root, styles[theme])}>
22+
<div className={styles.center}>
23+
<p>2021 Animated Java</p>
24+
</div>
25+
<div className={styles.notice}>
26+
<p>
27+
Niether this website nor the animated-java project is affiliated
28+
with Mojang Studios or Minecraft.
29+
</p>
30+
</div>
31+
</div>
32+
);
33+
}
34+
return (
35+
<div
36+
className={classNames(
37+
styles.root,
38+
styles[theme],
39+
minimal && styles.minimal,
40+
medium && styles.tablet
41+
)}
42+
>
43+
{!medium ? (
44+
<>
45+
<div className={styles.content}>
46+
{!minimal && !medium && (
47+
<div className={styles.socials}>
48+
<DiscordSocial></DiscordSocial>
49+
<GithubSocial></GithubSocial>
50+
<PatreonSocial></PatreonSocial>
51+
</div>
52+
)}
53+
<div className={styles.about}>
54+
<div className={styles.nav}>
55+
{navItems.map((item) => (
56+
<Link key={item.id} href={item.href}>
57+
<a className={styles.navItem}>
58+
<div>{item.title}</div>
59+
</a>
60+
</Link>
61+
))}
62+
</div>
63+
<p>2021 Animated Java</p>
64+
</div>
65+
</div>
66+
<div className={styles.notice}>
67+
<p>
68+
Niether this website nor the animated-java project is
69+
affiliated with Mojang Studios or Minecraft.
70+
</p>
71+
</div>
72+
</>
73+
) : !small ? (
74+
<>
75+
<div className={classNames(styles.about, styles.medium)}>
76+
<div className={styles.nav}>
77+
{navItems.map((item) => (
78+
<Link key={item.id} href={item.href}>
79+
<a className={styles.navItem}>
80+
<div>{item.title}</div>
81+
</a>
82+
</Link>
83+
))}
84+
</div>
85+
</div>
86+
<div className={styles.row}>
87+
<div className={styles.socials}>
88+
<DiscordSocial></DiscordSocial>
89+
<GithubSocial></GithubSocial>
90+
<PatreonSocial></PatreonSocial>
91+
</div>
92+
<div>
93+
<p>2021 Animated Java</p>
94+
</div>
95+
</div>
96+
97+
<div className={styles.notice}>
98+
<p>
99+
Niether this website nor the animated-java project is
100+
affiliated with Mojang Studios or Minecraft.
101+
</p>
102+
</div>
103+
</>
104+
) : (
105+
<>
106+
<div className={classNames(styles.about, styles.small)}>
107+
<div className={styles.nav}>
108+
{navItems.map((item) => (
109+
<Link key={item.id} href={item.href}>
110+
<a className={styles.navItem+" test"} key={item.id}>
111+
<div>{item.title}</div>
112+
</a>
113+
</Link>
114+
))}
115+
</div>
116+
</div>
117+
118+
<div className={classNames(styles.socials, styles.small)}>
119+
<DiscordSocial></DiscordSocial>
120+
<GithubSocial></GithubSocial>
121+
<PatreonSocial></PatreonSocial>
122+
</div>
123+
<div className={styles.center}>
124+
<p>2021 Animated Java</p>
125+
</div>
126+
<div className={styles.notice}>
127+
<p>
128+
Niether this website nor the animated-java project is
129+
affiliated with Mojang Studios or Minecraft.
130+
</p>
131+
</div>
132+
</>
133+
)}
134+
</div>
135+
);
136+
}

‎components/footer.module.less

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
.root{
2+
display: flex;
3+
flex-direction: column;
4+
box-shadow: 0px -1px 0px 1px rgba(0, 0, 0, 0.1);
5+
transition: 0.2s;
6+
transition-property: background color;
7+
&.dark{
8+
background: #333333;
9+
color:#F0F0F0;
10+
}
11+
&.light{
12+
background: #FFFFFF;
13+
color: #666666;
14+
}
15+
>.content{
16+
display: flex;
17+
justify-content: space-between;
18+
}
19+
}
20+
.about{
21+
display: flex;
22+
align-items: center;
23+
font-family: Roboto;
24+
font-style: normal;
25+
font-weight: 500;
26+
font-size: 17px;
27+
line-height: 20px;
28+
&.medium{
29+
justify-content: center;
30+
margin-top:16px;
31+
}
32+
>p{
33+
margin:16px;
34+
}
35+
&.small{
36+
justify-content: center;
37+
>.nav{
38+
flex-direction: column;
39+
}
40+
text-align: center;
41+
}
42+
>.nav{
43+
display: flex;
44+
>.navItem{
45+
margin: 8px 16px;
46+
}
47+
}
48+
}
49+
.socials{
50+
display: flex;
51+
&.small{
52+
justify-content: center;
53+
margin-top:4px;
54+
}
55+
}
56+
.row{
57+
display: flex;
58+
justify-content: space-between;
59+
margin-top:32px;
60+
margin-bottom:32px;
61+
align-items: center;
62+
>div{
63+
margin-left: 16px;
64+
margin-right: 16px;
65+
}
66+
}
67+
68+
.notice{
69+
display: flex;
70+
justify-content: center;
71+
text-align: center;
72+
margin: 0 4px;
73+
}
74+
.center{
75+
text-align: center;
76+
}

‎components/header.js

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
import { useContext, useState } from "react";
2+
import styles from "./header.module.less";
3+
import { ThemeContext, ThemeSelectToggle } from "./theme-select";
4+
import { Logo } from "./logo";
5+
import classnames from "classnames";
6+
import Link from "next/link";
7+
import { Sidebar } from "./sidebar";
8+
import { useMedia } from "react-use";
9+
import { navItems } from "../data/links";
10+
export const Header = ({pageHint=""}) => {
11+
const { theme } = useContext(ThemeContext);
12+
const collapsed = useMedia("(max-width:700px)",false);
13+
return (
14+
<div className={classnames(styles.root, styles[theme])}>
15+
<div className={styles.title}>
16+
<Logo size={1}></Logo>
17+
<h1 className={styles.text}>
18+
Animated <strong>Java</strong>
19+
</h1>
20+
</div>
21+
<div className={styles.rightHand}>
22+
{!collapsed && (
23+
<div className={styles.nav}>
24+
{navItems.map((item) => (
25+
<div
26+
className={classnames({
27+
[styles.navItem]: true,
28+
[styles.selected]: item.href === pageHint,
29+
})}
30+
key={item.id}
31+
>
32+
<div className={styles.text}>
33+
<Link href={item.href}>
34+
<a>
35+
<h2>{item.title}</h2>
36+
</a>
37+
</Link>
38+
</div>
39+
</div>
40+
))}
41+
</div>
42+
)}
43+
<div className={styles.theme}>
44+
<ThemeSelectToggle></ThemeSelectToggle>
45+
</div>
46+
{collapsed && (
47+
<div className={styles.sidebar}>
48+
<Sidebar>
49+
<div className={classnames(styles.menu, styles[theme])}>
50+
{navItems.map((item) => (
51+
<div
52+
className={classnames({
53+
[styles.navItem]: true,
54+
[styles.selected]: item.href === pageHint,
55+
})}
56+
key={item.id}
57+
>
58+
<div className={styles.text}>
59+
<Link href={item.href}>
60+
<a>
61+
<h2>{item.title}</h2>
62+
</a>
63+
</Link>
64+
</div>
65+
</div>
66+
))}
67+
</div>
68+
</Sidebar>
69+
</div>
70+
)}
71+
</div>
72+
</div>
73+
);
74+
};

0 commit comments

Comments
 (0)