Jonas_Jones/jonasjones.dev
1
0
Fork 0
mirror of https://github.com/JonasunderscoreJones/jonasjones.dev.git synced 2025-10-23 00:49:19 +02:00
Code Issues Projects Releases Packages Wiki Activity

Added new projects layout

Browse source
This commit is contained in:
Jonas_Jones 2023-10-01 21:37:10 +02:00
parent 035f388b0a
commit 37bbc8d6b4
7 changed files with 241 additions and 138 deletions
Download patch file Download diff file Expand all files Collapse all files

21
src/components/ProjectComponent.svelte
View file

@ -1,6 +1,7 @@
<script> <script>
export let project; export let project;
import ProjectsLinks from "./ProjectsLinks.svelte"; import ProjectsLinks from "./ProjectsLinks.svelte";
import ProjectLanguageIndicator from "./ProjectLanguageIndicator.svelte";
import "../routes/+page.css"; import "../routes/+page.css";
</script> </script>
@ -8,13 +9,18 @@
<div class="top"> <div class="top">
<img class="image" src="/project-banners{project.backgroud}" alt=" " /> <img class="image" src="/project-banners{project.backgroud}" alt=" " />
</div> </div>
<div class="project-languages">
<ProjectLanguageIndicator {project} />
</div>
<div class="project-links">
<ProjectsLinks {project} />
</div>
<div class="bottom"> <div class="bottom">
<div class="content"> <div class="content">
<div />
<div class="project-topline"> <div class="project-topline">
<div class="project-title">{project.title}</div> <div class="project-title">{project.title}</div>
<div class="project-links"> <div>
<ProjectsLinks {project} />
<a <a
class="project-status" class="project-status"
style="color: {project.statuscolor};border-color:{project.statuscolor}" style="color: {project.statuscolor};border-color:{project.statuscolor}"
@ -73,6 +79,8 @@
align-items: right; align-items: right;
text-align: right; text-align: right;
align-content: right; align-content: right;
width: 100%;
border-bottom: 1px solid var(--project-border-color);
} }
.top { .top {
@ -102,4 +110,11 @@
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
.project-languages {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
}
</style> </style>

46
src/components/ProjectLanguageIndicator.svelte Normal file
View file

@ -0,0 +1,46 @@
<script>
export let project;
import { onMount } from "svelte";
import { language_colors } from "../scripts/langs";
let languageLength = Object.values(project.languages).reduce(
(acc, curr) => acc + curr,
0
);
</script>
<div class="indicator">
{#each Object.keys(project.languages) as language}
<div
class="language-color"
style="background-color: {language_colors[
language
]}; width: {(project.languages[language] / languageLength) * 100}%"
>
<p>{language}</p>
</div>
{/each}
</div>
<style>
.indicator {
display: flex;
height: 20px;
width: 100%;
}
.language-color {
flex: 1;
height: 100%;
width: 100%;
}
.language-color p {
color: white;
font-size: 0.9rem;
margin: 0;
padding: 0;
}
</style>

14
src/components/ProjectsLinks.svelte
View file

@ -37,23 +37,23 @@
<style> <style>
.project-links { .project-links {
display: inline-block; display: flex;
align-items: right; width: 100%;
text-align: right;
align-content: right;
margin-right: 10px;
} }
.project-link { .project-link {
display: inline-block;
margin-left: 10px;
color: var(--project-link-color); color: var(--project-link-color);
background-color: var(--project-link-background-color);
text-decoration: none; text-decoration: none;
transition: color 0.3s; transition: color 0.3s;
margin-top: 3px; margin-top: 3px;
font-size: 25px; font-size: 25px;
width: 100%;
align-items: center;
text-align: center;
} }
.project-link:hover { .project-link:hover {
color: var(--project-link-color-hover); color: var(--project-link-color-hover);
background-color: var(--project-link-background-color-hover);
} }
</style> </style>

1
src/routes/+page.css
View file

@ -22,6 +22,7 @@
--footer-background-color: #000; --footer-background-color: #000;
--footer-font-color: #fff; --footer-font-color: #fff;
--projects-background-color: rgba(0, 0, 0, 0.8); --projects-background-color: rgba(0, 0, 0, 0.8);
--project-link-background-color: var(--projects-background-color);
--project-border-color: white; --project-border-color: white;
--project-link-color: white; --project-link-color: white;
--project-link-color-hover: #666; --project-link-color-hover: #666;

8
src/routes/projects/+page.svelte
View file

@ -95,14 +95,14 @@
<option value="">All</option> <option value="">All</option>
<option value="clang">C</option> <option value="clang">C</option>
<option value="c++">C++</option> <option value="c++">C++</option>
<option value="py">Python</option> <option value="Python">Python</option>
<option value="java">Java</option> <option value="Java">Java</option>
<option value="rslang">Rust</option> <option value="Rust">Rust</option>
<option value="html">HTML</option> <option value="html">HTML</option>
<option value="css">CSS</option> <option value="css">CSS</option>
<option value="jslang">Javascript</option> <option value="jslang">Javascript</option>
<option value="svelte">Svelte</option> <option value="svelte">Svelte</option>
<option value="sh">Shell</option> <option value="Shell">Shell</option>
<option value="lualang">Lua</option> <option value="lualang">Lua</option>
<option value="ps2">PowerShell 2</option> <option value="ps2">PowerShell 2</option>
<option value="godot">Godot Lang</option> <option value="godot">Godot Lang</option>

248
src/routes/projects/projects.json
View file

@ -7,9 +7,9 @@
"categories": [ "categories": [
"" ""
], ],
"languages": [ "languages": {
"" "": 0
], },
"gh_api": "", "gh_api": "",
"version": "", "version": "",
"backgroud": "", "backgroud": "",
@ -29,9 +29,9 @@
"categories": [ "categories": [
"tools" "tools"
], ],
"languages": [ "languages": {
"py" "Python": 2558
], },
"gh_api": "J-onasJones/BashCommandAliasEditor", "gh_api": "J-onasJones/BashCommandAliasEditor",
"version": "2.0.1", "version": "2.0.1",
"backgroud": "/bashcmdaliaseditor.png", "backgroud": "/bashcmdaliaseditor.png",
@ -52,9 +52,9 @@
"fabric", "fabric",
"quilt" "quilt"
], ],
"languages": [ "languages": {
"java" "Java": 26624
], },
"gh_api": "J-onasJones/BetterConsoleMC", "gh_api": "J-onasJones/BetterConsoleMC",
"version": "1.0.0", "version": "1.0.0",
"backgroud": "/betterconsolemc.png", "backgroud": "/betterconsolemc.png",
@ -78,9 +78,9 @@
"quilt", "quilt",
"lib" "lib"
], ],
"languages": [ "languages": {
"java" "Java": 9776
], },
"gh_api": "J-onasJones/BetterSimpleConfig", "gh_api": "J-onasJones/BetterSimpleConfig",
"version": "1.0", "version": "1.0",
"backgroud": "/bettersimpleconfig.png", "backgroud": "/bettersimpleconfig.png",
@ -101,9 +101,9 @@
"fabric", "fabric",
"quilt" "quilt"
], ],
"languages": [ "languages": {
"java" "Java": 14706
], },
"gh_api": "J-onasJones/ConsoleMC", "gh_api": "J-onasJones/ConsoleMC",
"version": "0.1.1", "version": "0.1.1",
"backgroud": "/consolemc.png", "backgroud": "/consolemc.png",
@ -123,10 +123,10 @@
"tools", "tools",
"game" "game"
], ],
"languages": [ "languages": {
"rslang", "Rust": 25928,
"sh" "Shell": 8803
], },
"gh_api": "J-onasJones/dayz-linux-gui-launcher", "gh_api": "J-onasJones/dayz-linux-gui-launcher",
"version": "0.1.0", "version": "0.1.0",
"backgroud": "/dayzlauncher.png", "backgroud": "/dayzlauncher.png",
@ -145,9 +145,9 @@
"tools", "tools",
"bazinga" "bazinga"
], ],
"languages": [ "languages": {
"py" "Python": 8729
], },
"gh_api": "J-onasJones/ImageConverter", "gh_api": "J-onasJones/ImageConverter",
"version": "ImageConerter-1.2", "version": "ImageConerter-1.2",
"backgroud": "/imageconverter.png", "backgroud": "/imageconverter.png",
@ -166,9 +166,9 @@
"tools", "tools",
"bazinga" "bazinga"
], ],
"languages": [ "languages": {
"lua" "Lua": 100
], },
"gh_api": "J-onasJones/j2-technologies", "gh_api": "J-onasJones/j2-technologies",
"version": "0.2.1ALPHA", "version": "0.2.1ALPHA",
"backgroud": "/j2tech.png", "backgroud": "/j2tech.png",
@ -187,9 +187,9 @@
"api", "api",
"tools" "tools"
], ],
"languages": [ "languages": {
"js" "JavaScript": 0
], },
"gh_api": "J-onasJones/jonas_jones-api", "gh_api": "J-onasJones/jonas_jones-api",
"version": "---", "version": "---",
"backgroud": "/jjapi.png", "backgroud": "/jjapi.png",
@ -210,9 +210,9 @@
"fabric", "fabric",
"quilt" "quilt"
], ],
"languages": [ "languages": {
"java" "Java": 51381
], },
"gh_api": "J-onasJones/McWebserver", "gh_api": "J-onasJones/McWebserver",
"version": "0.3.1", "version": "0.3.1",
"backgroud": "/mcwebserver.png", "backgroud": "/mcwebserver.png",
@ -232,9 +232,9 @@
"mcmodding", "mcmodding",
"forge" "forge"
], ],
"languages": [ "languages": {
"java" "Java": 24337
], },
"gh_api": "J-onasJones/McWebserver-forge", "gh_api": "J-onasJones/McWebserver-forge",
"version": "0.2", "version": "0.2",
"backgroud": "/mcwebserver.png", "backgroud": "/mcwebserver.png",
@ -255,9 +255,9 @@
"tools", "tools",
"bazinga" "bazinga"
], ],
"languages": [ "languages": {
"py" "Python": 100
], },
"gh_api": "J-onasJones/Make-ZIP-less-compact", "gh_api": "J-onasJones/Make-ZIP-less-compact",
"version": "1.1", "version": "1.1",
"backgroud": "/mkzplsscmpct.png", "backgroud": "/mkzplsscmpct.png",
@ -275,9 +275,10 @@
"categories": [ "categories": [
"tools" "tools"
], ],
"languages": [ "languages": {
"python" "Python": 3798,
], "Shell": 189
},
"gh_api": "J-onasJones/Markdown-Compiler", "gh_api": "J-onasJones/Markdown-Compiler",
"version": "0.1", "version": "0.1",
"backgroud": "/j2tech.png", "backgroud": "/j2tech.png",
@ -298,9 +299,9 @@
"fabric", "fabric",
"quilt" "quilt"
], ],
"languages": [ "languages": {
"java" "Java": 55421
], },
"gh_api": "J-onasJones/Microcraft", "gh_api": "J-onasJones/Microcraft",
"version": "0.1+alpha1", "version": "0.1+alpha1",
"backgroud": "/microcraft.png", "backgroud": "/microcraft.png",
@ -319,9 +320,9 @@
"minecraft", "minecraft",
"tools" "tools"
], ],
"languages": [ "languages": {
"py" "Python": 5350
], },
"gh_api": "J-onasJones/Minecraft-server-Status", "gh_api": "J-onasJones/Minecraft-server-Status",
"version": "1.3", "version": "1.3",
"backgroud": "/mcserverstatus.png", "backgroud": "/mcserverstatus.png",
@ -340,9 +341,10 @@
"minecraft", "minecraft",
"tools" "tools"
], ],
"languages": [ "languages": {
"rslang" "Rust": 4062,
], "Shell": 580
},
"gh_api": "J-onasJones/moddah", "gh_api": "J-onasJones/moddah",
"version": "0.1+alpha1", "version": "0.1+alpha1",
"backgroud": "/moddah.png", "backgroud": "/moddah.png",
@ -363,9 +365,9 @@
"fabric", "fabric",
"quilt" "quilt"
], ],
"languages": [ "languages": {
"java" "Java": 100
], },
"gh_api": "J-onasJones/Mystery-core-mod", "gh_api": "J-onasJones/Mystery-core-mod",
"version": "---", "version": "---",
"backgroud": "/mysterymod.png", "backgroud": "/mysterymod.png",
@ -386,9 +388,9 @@
"fabric", "fabric",
"quilt" "quilt"
], ],
"languages": [ "languages": {
"java" "Java": 100
], },
"gh_api": "J-onasJones/MysteryDimensions", "gh_api": "J-onasJones/MysteryDimensions",
"version": "0.1+alpha1", "version": "0.1+alpha1",
"backgroud": "/mysterymod.png", "backgroud": "/mysterymod.png",
@ -409,9 +411,9 @@
"fabric", "fabric",
"quilt" "quilt"
], ],
"languages": [ "languages": {
"java" "Java": 100
], },
"gh_api": "J-onasJones/MysteryDungeons", "gh_api": "J-onasJones/MysteryDungeons",
"version": "0.1+alpha1", "version": "0.1+alpha1",
"backgroud": "/mysterymod.png", "backgroud": "/mysterymod.png",
@ -432,9 +434,9 @@
"fabric", "fabric",
"quilt" "quilt"
], ],
"languages": [ "languages": {
"java" "Java": 1243
], },
"gh_api": "J-onasJones/MysteryMod", "gh_api": "J-onasJones/MysteryMod",
"version": "0.1+alpha1", "version": "0.1+alpha1",
"backgroud": "/mysterymod.png", "backgroud": "/mysterymod.png",
@ -455,9 +457,9 @@
"fabric", "fabric",
"quilt" "quilt"
], ],
"languages": [ "languages": {
"java" "Java": 100
], },
"gh_api": "J-onasJones/MysteryRPG", "gh_api": "J-onasJones/MysteryRPG",
"version": "0.1+alpha1", "version": "0.1+alpha1",
"backgroud": "/mysterymod.png", "backgroud": "/mysterymod.png",
@ -478,9 +480,9 @@
"fabric", "fabric",
"quilt" "quilt"
], ],
"languages": [ "languages": {
"java" "Java": 15096
], },
"gh_api": "J-onasJones/NotEnoughCursedness", "gh_api": "J-onasJones/NotEnoughCursedness",
"version": "0.2", "version": "0.2",
"backgroud": "/notenoughcursedness.png", "backgroud": "/notenoughcursedness.png",
@ -499,11 +501,11 @@
"categories": [ "categories": [
"tools" "tools"
], ],
"languages": [ "languages": {
"c++", "C++": 40828,
"rslang", "Rust": 3278,
"c" "C": 130
], },
"gh_api": "J-onasJones/PI-server-rack", "gh_api": "J-onasJones/PI-server-rack",
"version": "0.1+alpha1", "version": "0.1+alpha1",
"backgroud": "/pi-server-rack.png", "backgroud": "/pi-server-rack.png",
@ -522,9 +524,9 @@
"bot", "bot",
"dcbot" "dcbot"
], ],
"languages": [ "languages": {
"js" "JavaScript": 4282
], },
"gh_api": "J-onasJones/PinBoardBot", "gh_api": "J-onasJones/PinBoardBot",
"version": "0.1", "version": "0.1",
"backgroud": "/pinboardbot.png", "backgroud": "/pinboardbot.png",
@ -542,9 +544,9 @@
"categories": [ "categories": [
"lib" "lib"
], ],
"languages": [ "languages": {
"py" "Python": 100
], },
"gh_api": "J-onasJones/pyterm2d", "gh_api": "J-onasJones/pyterm2d",
"version": "---", "version": "---",
"backgroud": "/pyterm2d.png", "backgroud": "/pyterm2d.png",
@ -563,9 +565,9 @@
"lib", "lib",
"tools" "tools"
], ],
"languages": [ "languages": {
"rslang" "Rust": 100
], },
"gh_api": "J-onasJones/Qr-generator", "gh_api": "J-onasJones/Qr-generator",
"version": "---", "version": "---",
"backgroud": "/qrgen.png", "backgroud": "/qrgen.png",
@ -585,9 +587,9 @@
"tools", "tools",
"bazinga" "bazinga"
], ],
"languages": [ "languages": {
"py" "Python": 100
], },
"gh_api": "J-onasJones/Resourcepack-Editor", "gh_api": "J-onasJones/Resourcepack-Editor",
"version": "0.1+alpha1", "version": "0.1+alpha1",
"backgroud": "/rp-editor.png", "backgroud": "/rp-editor.png",
@ -605,9 +607,7 @@
"categories": [ "categories": [
"minecraft" "minecraft"
], ],
"languages": [ "languages": {},
""
],
"gh_api": "J-onasJones/simp-resourcepack", "gh_api": "J-onasJones/simp-resourcepack",
"version": "1.0", "version": "1.0",
"backgroud": "/simp-rp.png", "backgroud": "/simp-rp.png",
@ -628,9 +628,9 @@
"fabric", "fabric",
"quilt" "quilt"
], ],
"languages": [ "languages": {
"java" "Java": 1291
], },
"gh_api": "J-onasJones/SpotifyMC", "gh_api": "J-onasJones/SpotifyMC",
"version": "0.1+alpha1", "version": "0.1+alpha1",
"backgroud": "/spotifymc.png", "backgroud": "/spotifymc.png",
@ -649,10 +649,12 @@
"webdev", "webdev",
"template" "template"
], ],
"languages": [ "languages": {
"svelte", "Svelte": 2675,
"markdown" "JavaScript": 1505,
], "CSS": 395,
"HTML": 329
},
"gh_api": "J-onasJones/SvelteMarkdownWiki", "gh_api": "J-onasJones/SvelteMarkdownWiki",
"version": "1.0", "version": "1.0",
"backgroud": "/homepage.png", "backgroud": "/homepage.png",
@ -673,9 +675,9 @@
"fabric", "fabric",
"quilt" "quilt"
], ],
"languages": [ "languages": {
"java" "Java": 21878
], },
"gh_api": "J-onasJones/SyncMod", "gh_api": "J-onasJones/SyncMod",
"version": "0.1+alpha1", "version": "0.1+alpha1",
"backgroud": "/syncmod.png", "backgroud": "/syncmod.png",
@ -693,9 +695,9 @@
"categories": [ "categories": [
"game" "game"
], ],
"languages": [ "languages": {
"godot" "Godot": 100
], },
"gh_api": "J-onasJones/TheBobbycarGame", "gh_api": "J-onasJones/TheBobbycarGame",
"version": "---", "version": "---",
"backgroud": "/bobbycargame.png", "backgroud": "/bobbycargame.png",
@ -714,12 +716,12 @@
"webdev", "webdev",
"website" "website"
], ],
"languages": [ "languages": {
"css", "Svelte": 36691,
"svelte", "CSS": 5152,
"js", "JavaScript": 618,
"html" "HTML": 406
], },
"gh_api": "J-onasJones/jonasjones.dev", "gh_api": "J-onasJones/jonasjones.dev",
"version": "1.1.1", "version": "1.1.1",
"backgroud": "/homepage.png", "backgroud": "/homepage.png",
@ -727,7 +729,7 @@
"GH": "https://github.com/J-onasJones/jonasjones.dev" "GH": "https://github.com/J-onasJones/jonasjones.dev"
}, },
"visible": true, "visible": true,
"last_update": 1695835918 "last_update": 1695836051
}, },
{ {
"title": "Website V1", "title": "Website V1",
@ -738,11 +740,10 @@
"webdev", "webdev",
"website" "website"
], ],
"languages": [ "languages": {
"html", "HTML": 234599,
"css", "CSS": 39007
"js" },
],
"gh_api": "J-onasJones/Website-v1", "gh_api": "J-onasJones/Website-v1",
"version": "1.0", "version": "1.0",
"backgroud": "/oldwebsite.png", "backgroud": "/oldwebsite.png",
@ -760,11 +761,11 @@
"categories": [ "categories": [
"game" "game"
], ],
"languages": [ "languages": {
"js", "HTML": 100,
"css", "JavaScript": 100,
"html" "CSS": 100
], },
"gh_api": "J-onasJones/Winception", "gh_api": "J-onasJones/Winception",
"version": "0.1+alpha1", "version": "0.1+alpha1",
"backgroud": "/winception.png", "backgroud": "/winception.png",
@ -782,10 +783,9 @@
"categories": [ "categories": [
"tools" "tools"
], ],
"languages": [ "languages": {
"py", "Python": 26637
"rslang" },
],
"gh_api": "J-onasJones/WindowsBloatwareRemover", "gh_api": "J-onasJones/WindowsBloatwareRemover",
"version": "0.1.2", "version": "0.1.2",
"backgroud": "/bloatremover.png", "backgroud": "/bloatremover.png",
@ -803,9 +803,9 @@
"categories": [ "categories": [
"tools" "tools"
], ],
"languages": [ "languages": {
"rslang" "Rust": 100
], },
"gh_api": "J-onasJones/windows-info-overlay", "gh_api": "J-onasJones/windows-info-overlay",
"version": "---", "version": "---",
"backgroud": "/winoverlay.png", "backgroud": "/winoverlay.png",

41
src/scripts/langs.js Normal file
View file

@ -0,0 +1,41 @@
let language_colors = {
"JavaScript": "#f1e05a",
"HTML": "#e34c26",
"CSS": "#563d7c",
"Python": "#3572A5",
"Java": "#b07219",
"C++": "#f34b7d",
"C": "#555555",
"Rust": "#dea584",
"Svelte": "#ff3e00",
"TypeScript": "#2b7489",
"Shell": "#89e051",
"PHP": "#4F5D95",
"Ruby": "#701516",
"Go": "#00ADD8",
"Dart": "#00B4AB",
"Kotlin": "#F18E33",
"Swift": "#ffac45",
"Scala": "#c22d40",
"Objective-C": "#438eff",
"Lua": "#000080",
"Perl": "#0298c3",
"CoffeeScript": "#244776",
"PowerShell": "#012456",
"Haskell": "#5e5086",
"Clojure": "#db5855",
"TeX": "#3D6117",
"Elixir": "#6e4a7e",
"R": "#198CE7",
"Vim script": "#199f4b",
"Assembly": "#6E4C13",
"D": "#ba595e",
"OCaml": "#3be133",
"Emacs Lisp": "#c065db",
"Crystal": "#000100",
"Vue": "#2c3e50",
"Julia": "#a270ba",
"Nim": "#ffc200"
};
export { language_colors };