sd/site
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

halo save point ass commit

Browse source
This commit is contained in:
Ruben 2023-11-05 01:03:06 -05:00
commit bca64b7c71
No known key found for this signature in database
2 changed files with 21 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

15
index.html
View file

@ -14,15 +14,16 @@
<div class="pixel-corners">
<div class="intro-box">
<div class="pixel-corners--wrapper">
<div class="pfp"> <img class="pfp-image" src="/assets/pfp.gif" alt="my profile picture, which is most likely a grey yoshi"> </div>
</div>
<div class="intro-text">
<header class="intro-info">
<div class="pixel-corners--wrapper">
<div class="pfp"> <img class="pfp-image" src="/assets/pfp.gif" alt="my profile picture, which is most likely a grey yoshi"> </div>
</div>
<h1 class="site-intro">hey, i'm ruben.</h1>
<h2 class="site-subtitle">welcome to my site.</h2>
<small class="navnt">~/links <span class="arrow">→</span> ~/about-me <span class="arrow">→</span> ~/fun-facts</small>
</div>
<nav>
<small class="navnt">~/links <span class="arrow">→</span> ~/about-me <span class="arrow">→</span> ~/fun-facts <span class="arrow">→</span> etc.</small>
</nav>
</header>
</div>
</div>

19
style.css
View file

@ -61,6 +61,7 @@ html {
font-weight: bold;
font-style: italic;
}
/* -- font nuts -- */
/* -- pixelated border radius -- */
.pixel-corners,
@ -332,7 +333,7 @@ a {
background-color: var(--bg);
}
.intro-text, .links-n-socials, .about-me, .fun-facts {
.intro-info, .links-n-socials, .about-me, .fun-facts {
flex-direction: column;
}
@ -349,7 +350,7 @@ a {
height: 150px;
}
.intro-text {
.intro-info {
text-align: center;
transform: translateY(4%)
}
@ -360,11 +361,17 @@ a {
/* -- end of styling the rest of the elements -- */
/* -- shirnk cards if screen is small -- */
@media screen and (max-width: 600px) {
@media screen and (max-width: 800px) {
.main {
width: 100%;
max-width: 90%;
transform: translate(4%, -3%);
width: 100%;
max-width: 90%;
transform: translate(4%, -3%);
}
.pfp, .intro-box {
display: grid;
justify-content: center;
align-content: center;
}
}
/* -- yea -- */