janis/dertyp7.github.io
1
0
Fork 0
mirror of https://github.com/DerTyp7/dertyp7.github.io.git synced 2025-10-28 12:22:14 +01:00
Code Issues Packages Projects Releases Wiki Activity

Update file paths and imports

Browse Source
This commit is contained in:
dertyp7
2024-01-14 17:03:50 +01:00
parent 6b9fc8fdbd
commit a773551f96
10 changed files with 168 additions and 166 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/App.tsx
View File

@@ -1,10 +1,10 @@
import { useEffect, useRef } from "react";
import "@styles/App.scss";
import Header from "@components/Header";
import About from "@components/About";
import About from "@sections/About";
import SectionScroll from "@components/SectionScroll";
import Skills from "@components/Skills";
import Projects from "@components/Projects";
import Skills from "@sections/Skills";
import Projects from "@sections/Projects";
import SectionLine from "@components/SectionLine";
import Footer from "@components/Footer";

6
src/components/Badge.tsx Normal file
View File

@@ -0,0 +1,6 @@
import "@styles/Badge.scss";
import { BadgeType } from "@components/BadgeType";
export default function Badge({ type }: { type: BadgeType }) {
return <div className={`badge ${type.toLowerCase()}`}>{type}</div>;
}

23
src/components/BadgeType.ts Normal file
View File

@@ -0,0 +1,23 @@
export enum BadgeType {
DOCKER = "Docker",
TYPESCRIPT = "TypeScript",
EXPRESS = "ExpressJS",
GIT = "Git",
JAVASCRIPT = "JavaScript",
TYPEORM = "TypeORM",
FIREBASE = "Firebase",
HTML = "HTML",
REACT = "ReactJS",
NODEJS = "NodeJS",
CSS = "CSS",
NEXTJS = "NextJS",
POSTGRESQL = "PostgreSQL",
SASS = "SASS",
ANGULARJS = "AngularJS",
MYSQL = "MySQL",
JAVA = "Java",
UNITY = "Unity",
CSHARP = "Csharp",
CPP = "Cpp",
PYTHON = "Python",
}

0
src/components/About.tsx → src/sections/About.tsx
View File

30
src/components/Projects.tsx → src/sections/Projects.tsx
View File

@@ -1,32 +1,6 @@
import "@styles/Projects.scss";
enum BadgeType {
DOCKER = "Docker",
TYPESCRIPT = "TypeScript",
EXPRESS = "ExpressJS",
GIT = "Git",
JAVASCRIPT = "JavaScript",
TYPEORM = "TypeORM",
FIREBASE = "Firebase",
HTML = "HTML",
REACT = "ReactJS",
NODEJS = "NodeJS",
CSS = "CSS",
NEXTJS = "NextJS",
POSTGRESQL = "PostgreSQL",
SASS = "SASS",
ANGULARJS = "AngularJS",
MYSQL = "MySQL",
JAVA = "Java",
UNITY = "Unity",
CSHARP = "Csharp",
CPP = "Cpp",
PYTHON = "Python",
}
function Badge({ type }: { type: BadgeType }) {
return <div className={`badge ${type.toLowerCase()}`}>{type}</div>;
}
import Badge from "@components/Badge";
import { BadgeType } from "@components/BadgeType";
function Project({
name,

0
src/components/Skills.tsx → src/sections/Skills.tsx
View File

132
src/styles/Badge.scss Normal file
View File

@@ -0,0 +1,132 @@
.badge {
padding: 0.2rem 0.5rem;
border-radius: 5px;
font-size: 0.8rem;
font-weight: 600;
border: 2px solid var(--color-accent-background);
&.docker {
background-color: #0db9ed11;
border-color: #0db9ed4f;
color: #60c6e6;
}
&.typescript {
background-color: #007acc11;
border-color: #007acc4f;
color: #007acc;
}
&.express {
background-color: #00000011;
border-color: #0000004f;
color: #000000;
}
&.git {
background-color: #f34f2999;
border-color: #f34f29;
color: #ffffff;
}
&.javascript {
background-color: #f0db4f11;
border-color: #f0db4f4f;
color: #f0db4f;
}
&.typeorm {
background-color: #42b88311;
border-color: #42b8834f;
color: #42b883;
}
&.firebase {
background-color: #ffca2811;
border-color: #ffca284f;
color: #ffca28;
}
&.html {
background-color: #e34f2611;
border-color: #e34f264f;
color: #e34f26;
}
&.reactjs {
background-color: #61dafb11;
border-color: #61dafb4f;
color: #61dafb;
}
&.nodejs {
background-color: #68a06311;
border-color: #68a0634f;
color: #68a063;
}
&.css {
background-color: #264de411;
border-color: #264de44f;
color: #264de4;
}
&.nextjs {
background-color: #00000011;
border-color: #0000004f;
color: #000000;
}
&.postgresql {
background-color: #33679111;
border-color: #3367914f;
color: #336791;
}
&.sass {
background-color: #cc669911;
border-color: #cc66994f;
color: #cc6699;
}
&.angularjs {
background-color: #e2323711;
border-color: #e232374f;
color: #e23237;
}
&.mysql {
background-color: #4479a111;
border-color: #4479a14f;
color: #4479a1;
}
&.java {
background-color: #00739611;
border-color: #0073964f;
color: #007396;
}
&.unity {
background-color: #00000011;
border-color: #0000004f;
color: #000000;
}
&.csharp {
background-color: #17860011;
border-color: #1786004f;
color: #178600;
}
&.cpp {
background-color: #f34b7d11;
border-color: #f34b7d4f;
color: #f34b7d;
}
&.python {
background-color: #3776ab11;
border-color: #3776ab4f;
color: #3776ab;
}
}

133
src/styles/Projects.scss
View File

@@ -53,139 +53,6 @@
gap: 5px;
padding: 0.5rem 0;
border-bottom: 1px solid var(--color-border);
.badge {
padding: 0.2rem 0.5rem;
border-radius: 5px;
font-size: 0.8rem;
font-weight: 600;
border: 2px solid var(--color-accent-background);
&.docker {
background-color: #0db9ed11;
border-color: #0db9ed4f;
color: #60c6e6;
}
&.typescript {
background-color: #007acc11;
border-color: #007acc4f;
color: #007acc;
}
&.express {
background-color: #00000011;
border-color: #0000004f;
color: #000000;
}
&.git {
background-color: #f34f2999;
border-color: #f34f29;
color: #ffffff;
}
&.javascript {
background-color: #f0db4f11;
border-color: #f0db4f4f;
color: #f0db4f;
}
&.typeorm {
background-color: #42b88311;
border-color: #42b8834f;
color: #42b883;
}
&.firebase {
background-color: #ffca2811;
border-color: #ffca284f;
color: #ffca28;
}
&.html {
background-color: #e34f2611;
border-color: #e34f264f;
color: #e34f26;
}
&.reactjs {
background-color: #61dafb11;
border-color: #61dafb4f;
color: #61dafb;
}
&.nodejs {
background-color: #68a06311;
border-color: #68a0634f;
color: #68a063;
}
&.css {
background-color: #264de411;
border-color: #264de44f;
color: #264de4;
}
&.nextjs {
background-color: #00000011;
border-color: #0000004f;
color: #000000;
}
&.postgresql {
background-color: #33679111;
border-color: #3367914f;
color: #336791;
}
&.sass {
background-color: #cc669911;
border-color: #cc66994f;
color: #cc6699;
}
&.angularjs {
background-color: #e2323711;
border-color: #e232374f;
color: #e23237;
}
&.mysql {
background-color: #4479a111;
border-color: #4479a14f;
color: #4479a1;
}
&.java {
background-color: #00739611;
border-color: #0073964f;
color: #007396;
}
&.unity {
background-color: #00000011;
border-color: #0000004f;
color: #000000;
}
&.csharp {
background-color: #17860011;
border-color: #1786004f;
color: #178600;
}
&.cpp {
background-color: #f34b7d11;
border-color: #f34b7d4f;
color: #f34b7d;
}
&.python {
background-color: #3776ab11;
border-color: #3776ab4f;
color: #3776ab;
}
}
}
.description {
padding: 0.5rem 0;

2
tsconfig.json
View File

@@ -24,7 +24,7 @@
"paths": {
"@/*": ["*"],
"@components/*": ["components/*"],
"@pages/*": ["pages/*"],
"@sections/*": ["sections/*"],
"@styles/*": ["styles/*"],
"@utils/*": ["utils/*"],
"@hooks/*": ["hooks/*"],

2
vite.config.ts
View File

@@ -8,7 +8,7 @@ export default defineConfig({
alias: {
'@': '/src',
'@components': '/src/components',
'@pages': '/src/pages',
'@sections': '/src/sections',
'@styles': '/src/styles',
'@utils': '/src/utils',
'@hooks': '/src/hooks',