smol fixes

This commit is contained in:
Michał Gdula 2022-06-22 19:42:22 +01:00
parent a637ac4830
commit 49e4ac500c
3 changed files with 23 additions and 30 deletions

View file

@ -12,7 +12,7 @@ main section {
box-shadow: var(--shadow); box-shadow: var(--shadow);
} }
main section * { main section * {
margin: 0 0 0.7rem; padding: 0; margin: 0 0 0.5rem; padding: 0;
max-width: 100%; width: auto; min-width: none; max-width: 100%; width: auto; min-width: none;
border-radius: 5px; border-radius: 5px;
@ -21,10 +21,11 @@ main section *:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
main section img { main section img {
margin-bottom: 0.5rem;
height: auto; height: auto;
} }
.justify-text p { main section p, main section a {
text-align: justify; margin-bottom: 0.4rem;
} }
/* /*
@ -46,7 +47,7 @@ main section img {
Gallery Gallery
*/ */
.gallery-image { .gallery-image {
padding: 0; margin-bottom: 1rem; padding: 0;
width: 100%; height: 30rem; width: 100%; height: 30rem;
object-fit: contain; object-fit: contain;

View file

@ -10,7 +10,7 @@
<!-- Style --> <!-- Style -->
<link rel="stylesheet" href="stylesheet.css"> <link rel="stylesheet" href="stylesheet.css">
<!-- Fonts --> <!-- Fonts -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@500&amp;display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&amp;display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@600&amp;display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@600&amp;display=swap">
</head> </head>
<body> <body>
@ -52,7 +52,7 @@
<p>Since I was young I delved into computers head first, and breaking a lot on the way. I started with Scratch, then progressed to Python in Secondary School where I really started my programming adventure!</p> <p>Since I was young I delved into computers head first, and breaking a lot on the way. I started with Scratch, then progressed to Python in Secondary School where I really started my programming adventure!</p>
<p>Since then I tried many programming languages and programming-related stuff, I currently know Python, HTML and CSS but am also learning PHP and C#</p> <p>Since then I tried many programming languages and programming-related stuff, I currently know Python, HTML and CSS but am also learning PHP and C#</p>
<p>I also got into Linux since the start was rough with me breaking a bunch of stuff. But since then I've been using Arch (btw) and happily configuring Rofi, Polybar, fish and even theming Discord, Spotify and Firefox!</p> <p>I also got into Linux since the start was rough with me breaking a bunch of stuff. But since then I've been using Arch (btw) and happily configuring Rofi, Polybar, fish and even theming Discord, Spotify and Firefox!</p>
<p>These stats come from my GitHub profiles public repositories (private ones are not counted)</p> <p><span class="gray-info">These stats come from my GitHub profiles public repositories (private ones are not counted)</span></p>
<img src="https://github-readme-stats.vercel.app/api/top-langs/?username=Fluffy-Bean&layout=compact"> <img src="https://github-readme-stats.vercel.app/api/top-langs/?username=Fluffy-Bean&layout=compact">
</section> </section>
@ -91,7 +91,7 @@
<section id="gallery"> <section id="gallery">
<h2>Random pictures lol</h2> <h2>Random pictures lol</h2>
<img src="gallery/fluffy_VRchat-meet-2021.webp" class="gallery-image"> <img src="gallery/fluffy_VRchat-meet-2021.webp" class="gallery-image" alt="No alt for these images at the moment, I am very sorry">
<!-- <!--
<div class="filter-list"> <div class="filter-list">
<div> <div>
@ -135,9 +135,9 @@
<section id="jokes" > <section id="jokes" >
<h2>Funny jokes!</h2> <h2>Funny jokes!</h2>
<h3>Cow joke</h3> <h3>Cow joke</h3>
<p>What did the cow say to the other cow that took up all the space? "Mooooove over"!</p> <p>What did the cow say to the other cow that took up all the space? <span class="gray-info">"Mooooove over"!</span></p>
<h3>Eel joke</h3> <h3>Eel joke</h3>
<p>Why can't electric eels get depressed? Because they're always positive!</p> <p>Why can't electric eels get depressed? <span class="gray-info">Because they're always positive!</span></p>
</section> </section>
<section id="spotify" > <section id="spotify" >
@ -161,14 +161,18 @@
<p>Conro</p> <p>Conro</p>
<p>Pixel Terror</p> <p>Pixel Terror</p>
<h4>Other</h4> <h4>Chill</h4>
<p>Gorillaz</p>
<p>M38</p> <p>M38</p>
<p>C148</p> <p>C148</p>
<p>The Rare Occasion</p> <p>The Rare Occasion</p>
<p>Joywave</p>
<p>Cavetown</p> <p>Cavetown</p>
<h4>Other</h4>
<p>Gorillaz</p>
<p>Joywave</p>
<p>Daughter</p>
<p>Low Roar</p>
<h3>Well...</h3> <h3>Well...</h3>
<p>I listen to everything, but feel free to complain to me about my choices!</p> <p>I listen to everything, but feel free to complain to me about my choices!</p>
</section> </section>
@ -182,7 +186,7 @@
</div> </div>
<div> <div>
<h3>Page status</h3> <h3>Page status</h3>
<p>Last updated 19 Jun 2022</p> <p>Last updated 22 Jun 2022</p>
<p>Made and designed by <span class="fluffy-colour">Fluffy</span></p> <p>Made and designed by <span class="fluffy-colour">Fluffy</span></p>
</div> </div>
<div> <div>

View file

@ -17,19 +17,6 @@
--orange: #FF7700; --orange: #FF7700;
--orange-alt: #E0863E; --orange-alt: #E0863E;
--green: #8C977D; --green: #8C977D;
/* refsheet colours */
--bandana-0: #FF7700;
--bandana-1: #FFDC00;
--bandana-2: #00D621;
--bandana-3: #0088FF;
--fur-0: #FF851B;
--fur-1: #FFF3BB;
--fur-2: #613700;
--beans: #FEBBEC;
--eye: #C859C9;
} }
* { * {
font-weight: 400; font-weight: 400;
@ -41,6 +28,7 @@ html {
background-color: #817670; background-color: #817670;
background-image: url("images/bg-alt.png"); background-image: url("images/bg-alt.png");
height: 100vh;
background-position: center; background-position: center;
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
@ -98,27 +86,27 @@ a:visited {
span { span {
display: inline; display: inline;
} }
.gray-info {
font-style: italic;
opacity: 0.6;
}
.carty-colour { .carty-colour {
color: #C29356; color: #C29356;
font-weight: bold; font-weight: bold;
} }
.jeetix-colour { .jeetix-colour {
color: cadetblue; color: cadetblue;
font-weight: bold; font-weight: bold;
} }
.fluffy-colour { .fluffy-colour {
color: #FF851B; color: #FF851B;
font-weight: bold; font-weight: bold;
} }
.mrhdash-colour { .mrhdash-colour {
color: #a58fb6; color: #a58fb6;
font-weight: bold; font-weight: bold;
} }
.zadok-colour { .zadok-colour {
color: #542b00; color: #542b00;
font-weight: bold; font-weight: bold;