revision 2024-11-01

This commit is contained in:
minish 2024-11-01 17:26:07 -04:00
parent 13459f0bee
commit 293bffd28e
Signed by: min
GPG Key ID: FEECFF24EF0CE9E9
4 changed files with 129 additions and 116 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 184 KiB

After

Width:  |  Height:  |  Size: 54 KiB

BIN
assets/interests/eva.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

View File

@ -2,7 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<link rel="icon" href="/assets/icon.webp"> <link rel="icon" href="/assets/icon2.webp">
<link rel="stylesheet" href="/style.css"> <link rel="stylesheet" href="/style.css">
<link rel="canonical" href="https://min.rip"> <link rel="canonical" href="https://min.rip">
@ -12,10 +12,10 @@
<meta name="darkreader-lock"> <meta name="darkreader-lock">
<meta name="color-scheme" content="only light"> <meta name="color-scheme" content="only light">
<meta name="description" content="website of minish 🌾"> <meta name="description" content="hi world">
<meta name="theme-color" content="#c4b5a1"> <meta name="theme-color" content="#c4b5a1">
<title>min.rip</title> <title>minish</title>
<script>0</script> <script>0</script>
</head> </head>
@ -26,10 +26,10 @@
<main> <main>
<div id="floats"> <div id="floats">
<div id="yapping"> <div id="yapping">
<h1>hi, world!</h1> <h1>hi world !</h1>
<h2>i am minish</h2> <h2>i am minish</h2>
<p>hi, i go by minish online. i enjoy programming & reverse engineering.</p> <p>Hi, i go by minish online. i enjoy programming & reverse engineering.</p>
<p>my current main projects are</p> <p>a few of my recent projects are &ndash;</p>
<ul> <ul>
<li> <li>
<a href="https://git.min.rip/min/breeze">breeze</a> - <a href="https://git.min.rip/min/breeze">breeze</a> -
@ -39,6 +39,10 @@
<a href="https://git.min.rip/min/infra">infra</a> - <a href="https://git.min.rip/min/infra">infra</a> -
infrastructure as code w/ nix infrastructure as code w/ nix
</li> </li>
<li>
<a href="#">clip album</a> [wip] -
search, sort, and filter through video clips
</li>
<li> <li>
<a href="https://git.min.rip/min/glcanvas">glcanvas</a> - <a href="https://git.min.rip/min/glcanvas">glcanvas</a> -
test project to learn webgl concepts test project to learn webgl concepts
@ -46,33 +50,39 @@
</ul> </ul>
<p>currently learning more about ..</p> <p>currently learning more about ..</p>
<ul id="learning"> <ul id="learning">
<li>web development</li>
<li>rendering</li> <li>rendering</li>
<li>networking/infrastructure</li>
<li>calculus</li> <li>calculus</li>
<li>networking, infrastructure, & devops</li>
<li>psychology</li>
</ul> </ul>
<p>some stuff i like:</p> <p>some things i like</p>
<ul id="interests"> <ul class="interests">
<li>omori <img src="/assets/interests/omori.png" alt=""></li>
<li>deltarune <img src="/assets/interests/deltarune.png" alt=""></li> <li>deltarune <img src="/assets/interests/deltarune.png" alt=""></li>
<li>oneshot <img src="/assets/interests/oneshot.png" alt="" id="oneshot"></li>
<li>inabakumori <img src="/assets/interests/inabakumori.webp" alt=""></li>
<li>cafe de touhou <img src="/assets/interests/cdth.webp" alt=""></li>
<li>yume nikki <img src="/assets/interests/yume.png" alt="" id="yume"></li> <li>yume nikki <img src="/assets/interests/yume.png" alt="" id="yume"></li>
<li>oneshot <img src="/assets/interests/oneshot.png" alt="" id="oneshot"></li>
<li>evangelion <img src="/assets/interests/eva.webp" alt=""></li>
</ul> </ul>
<details>
<summary><small>and more random stuff before</small></summary>
<ul class="interests">
<li>inabakumori <img src="/assets/interests/inabakumori.webp" alt=""></li>
<li>cafe de touhou <img src="/assets/interests/cdth.webp" alt=""></li>
<li>omori <img src="/assets/interests/omori.png"></li>
</ul>
</details>
</div> </div>
<img src="/assets/icon.webp" alt="" id="icon"> <img src="/assets/icon2.webp" alt="" id="icon">
</div> </div>
<div id="cont"> <div id="cont">
<hr> <hr>
<div id="links"> <div id="links">
<a href="https://git.min.rip/min"> <a href="https://git.min.rip/min">
<img src="/assets/links/gitea.svg" alt="gitea" <img src="/assets/links/gitea.svg" alt="gitea"
title="a lot of stuff here is privated. it might look kind of empty"> title="it might look kind of empty. a lot of stuff here is privated">
</a> </a>
<a href="https://github.com/minishd"> <a href="https://github.com/minishd">
<img src="/assets/links/github.svg" alt="github" <img src="/assets/links/github.svg" alt="github"
title="i use my gitea more than my github, but there's some stuff here"> title="there's some stuff here, but i use gitea more">
</a> </a>
<a href="https://www.last.fm/user/minishc"> <a href="https://www.last.fm/user/minishc">
<img src="/assets/links/lastfm.svg" alt="last.fm" title="music i listen to"> <img src="/assets/links/lastfm.svg" alt="last.fm" title="music i listen to">

199
style.css
View File

@ -1,196 +1,199 @@
/* written by minish - 2024-03 */ /* written by minish - 2024-03 */
:root { :root {
--accent-b: #c4b5a1; --accent-b: #c4b5a1;
--accent: #908576; --accent: #908576;
} }
* { * {
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
box-sizing: border-box; box-sizing: border-box;
} }
body { body {
overflow: hidden; overflow: hidden;
} }
#border { #border {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
width: calc(100vw - calc(2px * 2)); width: calc(100vw - calc(2px * 2));
height: calc(100vh - calc(2px * 2)); height: calc(100vh - calc(2px * 2));
margin: 2px; margin: 2px;
border: 2px solid var(--accent); border: 2px solid var(--accent);
} }
#bg::before { #bg::before {
position: absolute; position: absolute;
content: ""; content: "";
top: 0; top: 0;
left: 0; left: 0;
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
/* backdrop-filter: blur(2px); */ /* backdrop-filter: blur(2px); */
} }
#bg { #bg {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background-image: linear-gradient(rgba(0, 0, 0, 0.68), rgba(0, 0, 0, 0.53)), url(/assets/bg.webp); background-image: linear-gradient(rgba(0, 0, 0, 0.68), rgba(0, 0, 0, 0.53)),
background-attachment: fixed; url(/assets/bg.webp);
background-position: center; background-attachment: fixed;
background-repeat: no-repeat; background-position: center;
background-size: cover; background-repeat: no-repeat;
background-size: cover;
} }
main { main {
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
font-size: 10pt; font-size: 10pt;
line-height: 2em; line-height: 2em;
padding: 18px; padding: 18px;
padding-bottom: 14px; padding-bottom: 14px;
background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.8)); background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.8));
border: 2px solid var(--accent); border: 2px solid var(--accent);
color: #fff; color: #fff;
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
} }
@media only screen and (max-width: 700px) { @media only screen and (max-width: 700px) {
main { main {
min-width: 92dvw; min-width: 92dvw;
} }
#border { #border {
border-width: 0px; border-width: 0px;
} }
#icon { #icon {
display: none; display: none;
} }
#interests { #learning {
grid-template-columns: auto auto; grid-template-columns: auto;
} }
#learning {
grid-template-columns: auto;
}
} }
@media only screen and (min-width: 701px) { @media only screen and (min-width: 701px) {
#learning { #learning {
grid-template-columns: auto auto; grid-template-columns: auto auto;
} }
}
#interests { .interests {
grid-template-columns: auto auto auto; grid-template-columns: auto auto;
}
} }
::selection { ::selection {
color: #fff; color: #fff;
background: var(--accent); background: var(--accent);
} }
a:link, a:link,
a:visited, a:visited,
a:hover, a:hover,
a:active { a:active {
color: var(--accent-b) color: var(--accent-b);
} }
h2 { h2 {
font-size: medium; font-size: medium;
font-weight: lighter; font-weight: lighter;
margin-bottom: 4px; margin-bottom: 4px;
} }
#floats { #floats {
display: flex; display: flex;
} }
#icon { #icon {
justify-self: right; justify-self: right;
/* make some space around it */ /* make some space around it */
margin-left: 24px; margin-left: 24px;
height: 7em; height: 7em;
filter: drop-shadow(1px 1px 0 var(--accent))
drop-shadow(-1px 1px 0 var(--accent)) drop-shadow(1px -1px 0 var(--accent))
drop-shadow(-1px -1px 0 var(--accent));
} }
#yapping { #yapping {
justify-self: left; justify-self: left;
} }
ul { ul {
list-style-position: inside; list-style-position: inside;
} }
li { li {
/* move the bulletpoint 6px inward on itself */ /* move the bulletpoint 6px inward on itself */
padding-left: 6px; padding-left: 6px;
} }
#learning { #learning {
display: grid; display: grid;
} }
#interests { .interests {
display: grid; display: grid;
} }
#interests img { .interests img {
height: 1.75em; height: 1.75em;
vertical-align: middle; vertical-align: middle;
} }
#interests img#yume, #interests img#oneshot { .interests img#yume,
height: 20px; .interests img#oneshot {
height: 20px;
} }
#interests img#yume { .interests img#yume {
image-rendering: pixelated; image-rendering: pixelated;
} }
hr { hr {
margin-bottom: 10px; margin-bottom: 10px;
margin-top: 12px; margin-top: 12px;
border: 1px solid var(--accent); border: 1px solid var(--accent);
} }
#links { #links {
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
} }
#links img { #links img {
height: 3.1em; height: 3.1em;
} }
#cont { #cont {
margin-top: auto; margin-top: auto;
} }