Skip to content

Commit 0d85525

Browse files
debuggyodebuggyo
committed
exo update (with material 3 design)
1 parent 16ab505 commit 0d85525

File tree

9 files changed

+434
-102
lines changed

9 files changed

+434
-102
lines changed

‎.gitignore‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
node_modules/
2+
package.json
3+
package-lock.json

‎aboutme.html‎

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,87 @@
1+
<!doctype html>
2+
<head>
3+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
4+
<link rel="stylesheet" href="style.css" />
5+
<link rel="preconnect" href="https://fonts.googleapis.com" />
6+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
7+
<link
8+
href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap"
9+
rel="stylesheet"
10+
/>
11+
<link
12+
rel="stylesheet"
13+
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,[email protected],100..700,0..1,-50..200&icon_names=computer,person,tv,work"
14+
/>
15+
<link rel="icon" href="images/favicon.png" />
16+
<title>debuggyo - About Me</title>
17+
<!-- 8efc9137-a09f-4ae6-a462-3774472b2fcb -->
18+
</head>
19+
<script>
20+
function hasTouch() {
21+
1;
22+
return (
23+
"ontouchstart" in document.documentElement ||
24+
navigator.maxTouchPoints > 0 ||
25+
navigator.msMaxTouchPoints > 0
26+
);
27+
}
28+
29+
if (hasTouch()) {
30+
// remove all the :hover stylesheets
31+
try {
32+
// prevent exception on browsers not supporting DOM styleSheets properly
33+
for (var si in document.styleSheets) {
34+
var styleSheet = document.styleSheets[si];
35+
if (!styleSheet.rules) continue;
36+
37+
for (var ri = styleSheet.rules.length - 1; ri >= 0; ri--) {
38+
if (!styleSheet.rules[ri].selectorText) continue;
39+
40+
if (styleSheet.rules[ri].selectorText.match(":hover")) {
41+
styleSheet.deleteRule(ri);
42+
}
43+
}
44+
}
45+
} catch (ex) {}
46+
}
47+
</script>
48+
<body>
49+
<header>
50+
<a class="tab" href="/">
51+
<span class="m3-icon">work</span>
52+
Projects
53+
</a>
54+
<a class="tab active" href="aboutme.html">
55+
<span class="m3-icon">person</span>
56+
About Me
57+
</a>
58+
</header>
59+
<div class="container">
60+
<img src="images/debuggylogo.png" id="logo" />
61+
<hr />
62+
<p class="title">About Me</p>
63+
<hr />
64+
<h1 class="section-header">Interests</h1>
65+
<div class="section">
66+
<div class="text">
67+
<h2><span class="m3-icon">computer</span>Linux</h2>
68+
<p>
69+
I have been using Linux as my daily operating system since
70+
2021, since then I have gone through many distros, many
71+
desktops, and many different styles.
72+
</p>
73+
<p>
74+
My biggest Linux related project is Exo, a desktop shell for
75+
the Niri and Hyprland Wayland Compositors.
76+
</p>
77+
</div>
78+
<div class="text">
79+
<h2><span class="m3-icon">tv</span>Tokusatsu</h2>
80+
<p>
81+
I have been watching Tokusatsu shows since late 2023,
82+
especially Kamen Rider.
83+
</p>
84+
</div>
85+
</div>
86+
</div>
87+
</body>

‎colors.css‎

Lines changed: 107 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,107 @@
1+
/*
2+
* Css Colors
3+
* Generated with Matugen
4+
*/
5+
:root {
6+
7+
--background: #1a110f;
8+
9+
--error: #ffb4ab;
10+
11+
--error_container: #93000a;
12+
13+
--inverse_on_surface: #392e2b;
14+
15+
--inverse_primary: #8f4b3a;
16+
17+
--inverse_surface: #f1dfda;
18+
19+
--on_background: #f1dfda;
20+
21+
--on_error: #690005;
22+
23+
--on_error_container: #ffdad6;
24+
25+
--on_primary: #561f11;
26+
27+
--on_primary_container: #ffdad2;
28+
29+
--on_primary_fixed: #3a0a02;
30+
31+
--on_primary_fixed_variant: #723425;
32+
33+
--on_secondary: #442a23;
34+
35+
--on_secondary_container: #ffdad2;
36+
37+
--on_secondary_fixed: #2c1510;
38+
39+
--on_secondary_fixed_variant: #5d4038;
40+
41+
--on_surface: #f1dfda;
42+
43+
--on_surface_variant: #d8c2bd;
44+
45+
--on_tertiary: #3c2f04;
46+
47+
--on_tertiary_container: #f7e1a6;
48+
49+
--on_tertiary_fixed: #241a00;
50+
51+
--on_tertiary_fixed_variant: #544519;
52+
53+
--outline: #a08c88;
54+
55+
--outline_variant: #534340;
56+
57+
--primary: #ffb4a2;
58+
59+
--primary_container: #723425;
60+
61+
--primary_fixed: #ffdad2;
62+
63+
--primary_fixed_dim: #ffb4a2;
64+
65+
--scrim: #000000;
66+
67+
--secondary: #e7bdb3;
68+
69+
--secondary_container: #5d4038;
70+
71+
--secondary_fixed: #ffdad2;
72+
73+
--secondary_fixed_dim: #e7bdb3;
74+
75+
--shadow: #000000;
76+
77+
--source_color: #af3617;
78+
79+
--surface: #1a110f;
80+
81+
--surface_bright: #423734;
82+
83+
--surface_container: #271d1b;
84+
85+
--surface_container_high: #322825;
86+
87+
--surface_container_highest: #3d3230;
88+
89+
--surface_container_low: #231917;
90+
91+
--surface_container_lowest: #140c0a;
92+
93+
--surface_dim: #1a110f;
94+
95+
--surface_tint: #ffb4a2;
96+
97+
--surface_variant: #534340;
98+
99+
--tertiary: #dac58d;
100+
101+
--tertiary_container: #544519;
102+
103+
--tertiary_fixed: #f7e1a6;
104+
105+
--tertiary_fixed_dim: #dac58d;
106+
107+
}

‎images/debuggyicon.png‎

-35.9 KB
Binary file not shown.

‎images/debuggylogo.png‎

132 KB
Loading

‎images/exo.png‎

25.6 MB
Loading

‎images/favicon.png‎

74.9 KB
Loading

‎index.html‎

Lines changed: 92 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,56 +1,109 @@
1-
<!DOCTYPE html>
1+
<!doctype html>
22
<head>
3-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
4-
<link rel="stylesheet" href="style.css">
5-
<link rel="preconnect" href="https://fonts.googleapis.com">
6-
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
7-
<link href="https://fonts.googleapis.com/css2?family=Dela+Gothic+One&display=swap" rel="stylesheet">
8-
<link href="https://fonts.googleapis.com/css2?family=Inter&display=swap" rel="stylesheet">
9-
<link rel="icon" href="images/favicon.png">
10-
<title>debuggyo's Portfolio</title>
11-
<!-- 8efc9137-a09f-4ae6-a462-3774472b2fcb -->
3+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
4+
<link rel="stylesheet" href="style.css" />
5+
<link rel="preconnect" href="https://fonts.googleapis.com" />
6+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
7+
<link
8+
href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap"
9+
rel="stylesheet"
10+
/>
11+
<link
12+
rel="stylesheet"
13+
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,[email protected],100..700,0..1,-50..200&icon_names=person,work"
14+
/>
15+
<link rel="icon" href="images/favicon.png" />
16+
<title>debuggyo - Projects</title>
17+
<!-- 8efc9137-a09f-4ae6-a462-3774472b2fcb -->
1218
</head>
1319
<script>
14-
function hasTouch() {1
15-
return 'ontouchstart' in document.documentElement
16-
|| navigator.maxTouchPoints > 0
17-
|| navigator.msMaxTouchPoints > 0;
18-
}
20+
function hasTouch() {
21+
1;
22+
return (
23+
"ontouchstart" in document.documentElement ||
24+
navigator.maxTouchPoints > 0 ||
25+
navigator.msMaxTouchPoints > 0
26+
);
27+
}
1928

20-
if (hasTouch()) { // remove all the :hover stylesheets
21-
try { // prevent exception on browsers not supporting DOM styleSheets properly
29+
if (hasTouch()) {
30+
// remove all the :hover stylesheets
31+
try {
32+
// prevent exception on browsers not supporting DOM styleSheets properly
2233
for (var si in document.styleSheets) {
23-
var styleSheet = document.styleSheets[si];
24-
if (!styleSheet.rules) continue;
34+
var styleSheet = document.styleSheets[si];
35+
if (!styleSheet.rules) continue;
2536

26-
for (var ri = styleSheet.rules.length - 1; ri >= 0; ri--) {
27-
if (!styleSheet.rules[ri].selectorText) continue;
37+
for (var ri = styleSheet.rules.length - 1; ri >= 0; ri--) {
38+
if (!styleSheet.rules[ri].selectorText) continue;
2839

29-
if (styleSheet.rules[ri].selectorText.match(':hover')) {
30-
styleSheet.deleteRule(ri);
40+
if (styleSheet.rules[ri].selectorText.match(":hover")) {
41+
styleSheet.deleteRule(ri);
42+
}
3143
}
3244
}
33-
}
3445
} catch (ex) {}
3546
}
3647
</script>
3748
<body>
38-
<div class="border"></div>
39-
<div class="container">
40-
<img src="images/debuggyicon.png" id="logo">
41-
<hr>
42-
<p class="title">PORTFOLIO</p>
43-
<a href="https://twistsandturns.github.io" target="_blank">
44-
<div class="button" id="tat">
45-
<p class="btn-title">Twists and Turns</p>
46-
<p class="btn-desc">A website that I created to show details about my object camp Twists and Turns which I have since abandoned. </p>
47-
</div>
49+
<header>
50+
<a class="tab active" href="/">
51+
<span class="m3-icon">work</span>
52+
Projects
4853
</a>
49-
<a href="https://toendallwars.org" target="_blank">
50-
<div class="button" id="teaw">
51-
<p class="btn-title">ToEndAllWars</p>
52-
<p class="btn-desc">A project that I created for the ToEndAllWars DIET team. Mainly developed by brandonusa, I helped with much of the styling and bug fixes.</p>
53-
</div>
54+
<a class="tab" href="aboutme.html">
55+
<span class="m3-icon">person</span>
56+
About Me
5457
</a>
58+
</header>
59+
<div class="container">
60+
<img src="images/debuggylogo.png" id="logo" />
61+
<hr />
62+
<p class="title">Projects</p>
63+
<hr />
64+
<h1 class="section-header">Linux</h1>
65+
<div class="section">
66+
<a href="https://github.com/debuggyo/Exo" target="_blank">
67+
<div class="button" id="exo">
68+
<img src="images/exo.png" />
69+
<div class="btn-info">
70+
<p class="btn-title">Exo</p>
71+
<p class="btn-desc">
72+
A material 3 inspired desktop shell for Niri and
73+
Hyprland made with Ignis.
74+
</p>
75+
</div>
76+
</div>
77+
</a>
78+
</div>
79+
<h1 class="section-header">Web</h1>
80+
<div class="section">
81+
<a href="https://twistsandturns.github.io" target="_blank">
82+
<div class="button" id="tat">
83+
<img src="images/tat.png" />
84+
<div class="btn-info">
85+
<p class="btn-title">Twists and Turns</p>
86+
<p class="btn-desc">
87+
A website that I created to show details about my
88+
object camp Twists and Turns which I have since
89+
abandoned.
90+
</p>
91+
</div>
92+
</div>
93+
</a>
94+
<a href="https://toendallwars.org" target="_blank">
95+
<div class="button" id="teaw">
96+
<img src="images/teaw.png" />
97+
<div class="btn-info">
98+
<p class="btn-title">ToEndAllWars</p>
99+
<p class="btn-desc">
100+
A project that I created for the ToEndAllWars DIET
101+
team. Mainly developed by brandonusa, I helped with
102+
much of the styling and bug fixes.
103+
</p>
104+
</div>
105+
</div>
106+
</a>
107+
</div>
55108
</div>
56109
</body>

0 commit comments

Comments
 (0)