ScuroNeko/nix13.pw
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Herping the derp

Browse Source
This commit is contained in:
ScuroNeko
2023-05-19 02:28:46 +03:00
parent 6f43e6265a
commit 3ea75d83d2
33 changed files with 187 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/App/App.tsx
View File

@@ -9,11 +9,11 @@ const App: FC = () => (
<div className="App">
<Navbar/>
<div className="Container">
<main className="Container">
<Main/>
<Projects/>
<GenshinDownloads/>
</div>
</main>
</div>
);

4
src/components/Navbar/Navbar.tsx
View File

@@ -1,13 +1,13 @@
import './Navbas.scss';
const Navbar = () => (
<div className="Navbar">
<nav className="Navbar">
<div className="Navbar__Container">
<a href="#Main" className='Navbar__Container_Link'>Основное</a>
<a href="#Projects" className='Navbar__Container_Link'>Проекты</a>
<a href="#GenshinDownloads" className='Navbar__Container_Link'>Genshin</a>
</div>
</div>
</nav>
);
export default Navbar;

4
src/components/Navbar/Navbas.scss
View File

@@ -24,6 +24,10 @@
&_Link {
font-size: 20px;
&:hover {
text-decoration: underline var(--accent-color);
}
&:not(:last-child) {
margin-right: 8px;
}

7
src/index.tsx
View File

@@ -1,11 +1,6 @@
import { createRoot } from 'react-dom/client';
import { BrowserRouter } from "react-router-dom";
import App from './components/App/App';
const container = document.getElementById('root') as HTMLElement;
createRoot(container).render(
<BrowserRouter>
<App/>
</BrowserRouter>
);
createRoot(container).render(<App/>);

10
src/pages/GenshinDownloads/GenshinDownloads.scss
View File

@@ -2,6 +2,15 @@
.GenshinDownloads {
padding-top: var(--navbar-height);
display: flex;
flex-direction: column;
&__Title {
font-size: 3rem;
text-align: center;
font-weight: 200;
text-decoration: underline var(--accent-color);
}
&__Item {
&_Title {
@@ -35,6 +44,7 @@
&__Actual, &__Outdated, &__Beta {
text-align: center;
font-size: 2rem;
border-bottom: 1px solid #fff;
margin-bottom: 4px;
padding-bottom: 4px;

13
src/pages/GenshinDownloads/GenshinDownloads.tsx
View File

@@ -1,7 +1,6 @@
import {useEffect, useState} from "react";
import './GenshinDownloads.scss';
import Loading from "../../ui/Loading/Loading";
import * as url from "url";
const GenshinDownloads = () => {
const [genshinDL, setGenshinDL] = useState<GenshinDLType[]>([]);
@@ -10,9 +9,7 @@ const GenshinDownloads = () => {
const [betaCollapse, setBetaCollapse] = useState(true);
useEffect(() => {
// const url = 'https://baka.nix13.pw/genshin';
const url = 'http://localhost:8099/genshin'
fetch(url)
fetch('https://baka.nix13.pw/genshin')
.then(r => r.json())
.then(r => setGenshinDL(r.genshin))
.then(_ => setLoading(false));
@@ -21,7 +18,9 @@ const GenshinDownloads = () => {
if(loading || !genshinDL) return <Loading/>;
return (
<div className={'GenshinDownloads'} id='GenshinDownloads'>
<h1 className={'GenshinDownloads__Actual'}>Актуальная версия</h1>
<div className="GenshinDownloads__Title">Genshin Impact</div>
<span className={'GenshinDownloads__Actual'}>Актуальная версия</span>
{genshinDL.filter(dl => !dl.outdated && !dl.beta).map(dl => (
<div className={'GenshinDownloads__Item'} key={dl.name}>
<h2 className={'GenshinDownloads__Item_Title'}>{dl.name}</h2>
@@ -40,7 +39,7 @@ const GenshinDownloads = () => {
</div>
))}
<h1 className={`GenshinDownloads__Outdated ${outdatedCollapse && 'GenshinDownloads__Outdated--NotCollapsed'}`} onClick={() => setOutdatedCollapse(!outdatedCollapse)}>Устаревшие версии</h1>
<span className={`GenshinDownloads__Outdated ${outdatedCollapse && 'GenshinDownloads__Outdated--NotCollapsed'}`} onClick={() => setOutdatedCollapse(!outdatedCollapse)}>Устаревшие версии</span>
{!outdatedCollapse && genshinDL.filter(dl => dl.outdated && !dl.beta).map(dl => (
<div className={'GenshinDownloads__Item'} key={dl.name}>
<h2 className={'GenshinDownloads__Item_Title'}>{dl.name}</h2>
@@ -58,7 +57,7 @@ const GenshinDownloads = () => {
</div>
))}
<h1 className={`GenshinDownloads__Beta ${betaCollapse && 'GenshinDownloads__Beta--NotCollapsed'}`} onClick={() => setBetaCollapse(!betaCollapse)}>Бета версии</h1>
<span className={`GenshinDownloads__Beta ${betaCollapse && 'GenshinDownloads__Beta--NotCollapsed'}`} onClick={() => setBetaCollapse(!betaCollapse)}>Бета версии</span>
{!betaCollapse && genshinDL.filter(dl => dl.beta).map(dl => (
<div className={'GenshinDownloads__Item'} key={dl.name}>
<h2 className={'GenshinDownloads__Item_Title'}>{dl.name}</h2>

12
src/pages/Main/Main.scss
View File

@@ -2,8 +2,9 @@
.Main {
width: 100%;
height: calc(100vh - var(--navbar-height));
height: calc(100vh - var(--navbar-height) - env(safe-area-inset-top));
box-sizing: border-box;
padding-bottom: calc(8px + env(safe-area-inset-bottom));
&__Center {
height: calc(100% - var(--navbar-height));
@@ -33,15 +34,10 @@
&_Link {
display: flex;
align-items: center;
& > :first-child {
margin-right: 4px;
}
font-size: 2rem;
&:not(:last-child) {
margin-right: 4px;
padding-right: 4px;
border-right: 1px solid white;
margin-right: 12px;
}
}
}

17
src/pages/Main/Main.tsx
View File

@@ -12,6 +12,10 @@ const Main = () => {
'Golang fullstack',
1000,
'Python fullstack',
1000,
'Kotlin developer',
1000,
'Web developer',
1000
]}
repeat={Infinity}
@@ -22,36 +26,23 @@ const Main = () => {
<div className="Main__Links">
<a className="Main__Links_Link" href='https://t.me/DarkShinigani' target='_blank' rel='noopener noreferrer'>
<i className="fa-brands fa-telegram"/>
<span>Телеграм</span>
</a>
<a className="Main__Links_Link" href='https://vk.com/scur0nek0' target='_blank' rel='noopener noreferrer'>
<i className="fa-brands fa-vk"/>
ВК
</a>
<a className="Main__Links_Link" href='https://github.com/Nix1304' target='_blank' rel='noopener noreferrer'>
<i className="fa-brands fa-github"/>
GitHub
</a>
<a className="Main__Links_Link" href='https://git.nix13.pw/' target='_blank' rel='noopener noreferrer'>
<i className="fa-brands fa-git"/>
Git
</a>
<a className="Main__Links_Link" href='https://mvn.nix13.pw/' target='_blank' rel='noopener noreferrer'>
<i className="fa-brands fa-readme"></i>
Maven
</a>
<a className="Main__Links_Link" href='https://files.nix13.pw/' target='_blank' rel='noopener noreferrer'>
<i className="fa-light fa-files"/>
Files
</a>
</div>
{/*<div className="Buttons">*/}
{/* <button className="Button_Outline--Glow">Aboba</button>*/}
{/* <button className="Button_Outline--Glow">Aboba</button>*/}
{/* <button className="Button_Outline--Glow">Aboba</button>*/}
{/*</div>*/}
</div>
);
}

17
src/pages/Projects/Projects.scss
View File

@@ -1,7 +1,24 @@
.Projects {
padding-top: var(--navbar-height);
width: 100%;
display: flex;
flex-direction: column;
&_Title {
font-size: 3rem;
text-align: center;
font-weight: 200;
text-decoration: underline var(--accent-color);
}
&__Title {
text-align: center;
font-size: 2rem;
border-bottom: 1px solid #fff;
margin-bottom: 4px;
padding-bottom: 4px;
}
&__List {
margin-top: 8px;
}

9
src/pages/Projects/Projects.tsx
View File

@@ -1,6 +1,7 @@
import React, {useEffect, useState} from "react";
import ProjectCard from "../../ui/ProjectCard/ProjectCard";
import './Projects.scss';
import Loading from "../../ui/Loading/Loading";
type ProjectsState = {
done: ProjectType[]
@@ -18,10 +19,12 @@ const Projects = () => {
.then(_ => setLoading(false));
}, []);
if(loading) return <div>Грузится, бля...</div>
if(loading) return <Loading/>;
return (
<div className="Projects" id='Projects'>
<h2>Завершенные и в разработке</h2>
<div className="Projects_Title">Проекты</div>
<span className='Projects__Title' style={{ borderColor: '#ab1bff', color: '#ab1bff' }}>Завершенные и в разработке</span>
<div className="Projects__List">
{projects.done.map(project => (
<ProjectCard
@@ -32,7 +35,7 @@ const Projects = () => {
))}
</div>
<h2>Замороженные и брошенные</h2>
<span className='Projects__Title' style={{ borderColor: '#19b3a6', color: '#19b3a6' }}>Замороженные и брошенные</span>
<div className="Projects__List">
{projects.dropped.map(project => (
<ProjectCard

5
src/pages/StarRailDownloads/StarRailDownloads.tsx Normal file
View File

@@ -0,0 +1,5 @@
const StarRailDownloads = () => {
}
export default StarRailDownloads;

2
src/ui/Loading/Loading.tsx
View File

@@ -1,5 +1,5 @@
const Loading = () => (
<div>Грузится бля!</div>
<div>Загрузка...</div>
);
export default Loading;

3
src/ui/ProjectBadge/ProjectLinkBadge.sass
View File

@@ -1,3 +0,0 @@
.ProjectLinkBadge
&:not(:last-child)
margin-right: 8px

5
src/ui/ProjectBadge/ProjectLinkBadge.scss Normal file
View File

@@ -0,0 +1,5 @@
.ProjectLinkBadge {
&:not(:last-child) {
margin-right: 8px;
}
}

2
src/ui/ProjectBadge/ProjectLinkBadge.tsx
View File

@@ -1,4 +1,4 @@
import './ProjectLinkBadge.sass';
import './ProjectLinkBadge.scss';
type Props = {
linkImage: ProjectLink

3
src/ui/ProjectBadge/ProjectStackBadge.sass
View File

@@ -1,3 +0,0 @@
.ProjectStackBadge
&:not(:last-child)
margin-right: 8px

5
src/ui/ProjectBadge/ProjectStackBadge.scss Normal file
View File

@@ -0,0 +1,5 @@
.ProjectStackBadge {
&:not(:last-child) {
margin-right: 8px
}
}

2
src/ui/ProjectBadge/ProjectStackBadge.tsx
View File

@@ -1,4 +1,4 @@
import './ProjectStackBadge.sass';
import './ProjectStackBadge.scss';
type Props = {
stack: ProjectStack

17
src/ui/ProjectBadge/ProjectStatusBadge.sass
View File

@@ -1,17 +0,0 @@
.ProjectStatus
font-size: 16px
font-weight: 300
height: fit-content
padding: 2px 6px
&__Development
background-color: #ff9c1b
&__Release
background-color: #ab1bff
&__Freeze
background-color: #19b3a6
&__Dropped
background-color: #ff1b1b

19
src/ui/ProjectBadge/ProjectStatusBadge.scss Normal file
View File

@@ -0,0 +1,19 @@
.ProjectStatus {
font-size: 16px;
font-weight: 300;
height: fit-content;
padding: 2px 6px;
&__Development {
background-color: #ff9c1b;
}
&__Release {
background-color: #ab1bff;
}
&__Freeze {
background-color: #19b3a6;
}
&__Dropped {
background-color: #ff1b1b;
}
}

2
src/ui/ProjectBadge/ProjectStatusBadge.tsx
View File

@@ -1,5 +1,5 @@
import { capitalize } from "../../utils";
import './ProjectStatusBadge.sass';
import './ProjectStatusBadge.scss';
type Props = {
status: ProjectStatus

23
src/ui/ProjectCard/ProjectCard.sass
View File

@@ -1,23 +0,0 @@
.ProjectCard
background-color: #333
padding: 8px
margin: 0 8px 8px 0
box-sizing: border-box
border: 2px solid var(--accent-color)
&__Title
display: flex
justify-content: space-between
margin-bottom: 4px
&__Content, &__Links, &__Stack
border-top: 1px solid #d8858d
padding-top: 4px
&__Content, &__Stack
margin-bottom: 4px
&__Links
font-weight: 500
&_Link:not(:first-child)
margin-left: 4px

30
src/ui/ProjectCard/ProjectCard.scss Normal file
View File

@@ -0,0 +1,30 @@
.ProjectCard {
background-color: #333;
padding: 8px;
box-sizing: border-box;
border: 2px solid var(--accent-color);
margin-bottom: 8px;
&__Title {
display: flex;
justify-content: space-between;
margin-bottom: 4px;
}
&__Content, &__Links, &__Stack {
border-top: 1px solid #d8858d;
padding-top: 4px;
}
&__Content, &__Stack {
margin-bottom: 4px;
}
&__Links {
font-weight: 500;
&_Link:not(:first-child) {
margin-left: 4px;
}
}
}

2
src/ui/ProjectCard/ProjectCard.tsx
View File

@@ -2,7 +2,7 @@ import React from "react";
import ProjectLinkBadge from "../ProjectBadge/ProjectLinkBadge";
import ProjectStackBadge from "../ProjectBadge/ProjectStackBadge";
import ProjectStatusBadge from "../ProjectBadge/ProjectStatusBadge";
import './ProjectCard.sass';
import './ProjectCard.scss';
type Props = {
title: string