add quotes

This commit is contained in:
Ruben 2024-06-05 00:30:27 -05:00
commit 02e831116b
No known key found for this signature in database
GPG key ID: AE181294E97E4802
2 changed files with 183 additions and 1 deletions

View file

@ -123,6 +123,50 @@
<p class="term-input"><span class="folder">󰉋 ~/fun-facts</span> <span class="status"></span> <span class="blink"></span></p>
</div>
<!-- quotes -->
<div id="quotes" class="terminal">
<div class="term-titlebar">
<img src="./assets/terminal.svg">
<p><a href="#quotes">~/quotes</a></p>
<div> <div id="minimize-btn"></div> <div id="maximize-btn"></div> <div id="close-btn"></div> </div>
</div>
<section>
<h2><a href="#quotes">quotes</a></h2>
<p>quotes left behind from friends! usually from the fediverse!</p>
<div class="socials-contacts-list">
<span class="quotes-container" id="limineow">
<p>"can you make my quote say that i am extremely homophobic and definitely not gay"</p>
<small>~ <a href="https://grimgreenfo.rest/@root" target="_blank">limineow</a></small>
</span>
<span class="quotes-container" id="bready">
<p>"*slaps visor* this synth can fit so much brainrot in him"</p>
<small>~ <a href="https://lethallava.land/@breaadyboy" target="_blank">breaadyboy</a></small>
</span>
<span class="quotes-container" id="mikoto">
<p>"The evolution of @sneexy from plush yoshi to robo dragon thing is interesting"</p>
<small>~ <a href="https://akko.wtf/users/mikoto" target="_blank">mikoto</a></small>
</span>
<span class="quotes-container" id="av70">
<p>"im deporting you until you say ur sorry"</p>
<small>~ <a href="https://akko.eepy.zone/users/av70" target="_blank">av70</a></small>
</span>
<span class="quotes-container" id="vozy">
<p>"what a horrible day to have beaten the other sperm to the egg 22 years ago"</p>
<small>~ <a href="https://wetdry.world/@vozercozer" target="_blank">vozercozer</a></small>
</span>
<span class="quotes-container" id="guigui">
<p>"they'll never expect the french inquisition"</p>
<small>~ <a href="https://wetdry.world/@guigui" target="_blank">guigui</a></small>
</span>
<span class="quotes-container" id="binbows">
<p>"skibidi toilet will be mine yeah"</p>
<small>~ <a href="https://labyrinth.zone/users/binbows" target="_blank">binbows</a></small>
</span>
</div>
</section>
<p class="term-input"><span class="folder">󰉋 ~/quotes</span> <span class="status"></span> <span class="blink"></span></p>
</div>
<!-- buttons -->
<div id="buttons" class="terminal">
<div class="term-titlebar">

140
style.css
View file

@ -333,7 +333,7 @@ a {
color: var(--green);
}
/* smol text */
small {
small, small a {
font-size: 14px;
}
/* lists need some styling */
@ -505,6 +505,144 @@ socials and links
}
}
/*
quotes
*/
.quotes-container {
display: inline-block;
text-align: center;
margin: .3em;
padding: .2em;
border-radius: 1em;
background-color: var(--crust);
p, a, small {
padding-left: 1mm;
padding-right: 1mm;
margin-top: .8mm;
margin-bottom: .8mm;
}
}
#limineow {
background-color: color-mix(in srgb, var(--red) 25%, transparent);
p, a, small {
color: var(--text);
text-decoration: none;
}
a:hover {
color: var(--red);
text-decoration: underline;
small {
color: var(--red) !important;
text-decoration: underline;
}
}
}
#limineow {
background-color: color-mix(in srgb, var(--red) 25%, transparent);
p, a, small {
color: var(--text);
text-decoration: none;
}
a:hover {
color: var(--red);
text-decoration: underline;
small {
color: var(--red) !important;
text-decoration: underline;
}
}
}
#bready {
background-color: color-mix(in srgb, var(--peach) 25%, transparent);
p, a, small {
color: var(--text);
text-decoration: none;
}
a:hover {
color: var(--peach);
text-decoration: underline;
small {
color: var(--peach) !important;
text-decoration: underline;
}
}
}
#mikoto {
background-color: color-mix(in srgb, var(--lavender) 25%, transparent);
p, a, small {
color: var(--text);
text-decoration: none;
}
a:hover {
color: var(--lavender);
text-decoration: underline;
small {
color: var(--lavender) !important;
text-decoration: underline;
}
}
}
#av70 {
background-color: color-mix(in srgb, var(--mauve) 25%, transparent);
p, a, small {
color: var(--text);
text-decoration: none;
}
a:hover {
color: var(--mauve);
text-decoration: underline;
small {
color: var(--mauve) !important;
text-decoration: underline;
}
}
}
#vozy {
background-color: color-mix(in srgb, var(--pink) 25%, transparent);
p, a, small {
color: var(--text);
text-decoration: none;
}
a:hover {
color: var(--pink);
text-decoration: underline;
small {
color: var(--pink) !important;
text-decoration: underline;
}
}
}
#guigui {
background-color: color-mix(in srgb, var(--green) 25%, transparent);
p, a, small {
color: var(--text);
text-decoration: none;
}
a:hover {
color: var(--green);
text-decoration: underline;
small {
color: var(--green) !important;
text-decoration: underline;
}
}
}
#binbows {
background-color: color-mix(in srgb, var(--crust) 25%, transparent);
p, a, small {
color: var(--text);
text-decoration: none;
}
a:hover {
color: var(--text);
text-decoration: underline;
small {
color: var(--text) !important;
text-decoration: underline;
}
}
}
/*
buttons
*/