candifloss/candifloss_site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Cleanup code

Browse Source 
Remove redundant verbosity
Keep same layout
Fix html classes
This commit is contained in:
Candifloss 2025-05-27 16:14:21 +05:30
parent b3d6a2d202
commit 56f69c01d6
3 changed files with 28 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
css/about.css
View File

@ -77,6 +77,9 @@ footer {
opacity: 0.5; opacity: 0.5;
} }
.section1 {
padding: 1rem;
}
.section1::before { .section1::before {
background-image: url("https://static.vecteezy.com/system/resources/thumbnails/013/384/142/small_2x/fabric-texture-abstract-pattern-black-and-white-textiles-backgrounds-photo.jpg"); background-image: url("https://static.vecteezy.com/system/resources/thumbnails/013/384/142/small_2x/fabric-texture-abstract-pattern-black-and-white-textiles-backgrounds-photo.jpg");
} }
@ -98,8 +101,7 @@ footer {
} }
.section1 .content h1 { .section1 .content h1 {
font-size: 4rem; font-size: 4rem;
margin-bottom: 1rem; margin: -5rem 0 1rem;
margin-top: -5rem;
color: #5488bf; color: #5488bf;
text-shadow: 0 0 9px #373737; text-shadow: 0 0 9px #373737;
} }
@ -131,15 +133,10 @@ footer {
.section1 .content .portrait img { .section1 .content .portrait img {
width: 200px; width: 200px;
height: 200px; height: 200px;
object-fit: cover;
border-radius: 50%;
margin: 0;
} }
.section1 .content h1 { .section1 .content h1 {
text-align: left; text-align: left;
margin-top: 0; margin: 0 0 1ch 1.5rem;
margin-bottom: 1ch;
margin-left: 1.5rem;
font-size: 2.7rem; font-size: 2.7rem;
} }
.section1 .content .tagline { .section1 .content .tagline {

8
html/about.html
View File

@ -16,10 +16,10 @@
<h1> <h1>
Hello, I'm <span class="myname">[My Name]</span> Hello, I'm <span class="myname">[My Name]</span>
</h1> </h1>
<p> <p class="tagline">
<span class="tagline">Code Wizard. </span> <span class="tagline-item">Code Wizard.</span>
<span class="tagline">Terminal Fanatic. </span> <span class="tagline-item">Terminal Fanatic.</span>
<span class="tagline">Amateur Artist. <span class="cursor">_</span></span> <span class="tagline-item">Amateur Artist.<span class="cursor">_</span></span>
</p> </p>
</div> </div>
</section> </section>

43
scss/about.scss
View File

@ -85,6 +85,8 @@ footer {
// Example background images per section // Example background images per section
.section1 { .section1 {
padding: 1rem;
&::before { &::before {
background-image: url('https://static.vecteezy.com/system/resources/thumbnails/013/384/142/small_2x/fabric-texture-abstract-pattern-black-and-white-textiles-backgrounds-photo.jpg'); background-image: url('https://static.vecteezy.com/system/resources/thumbnails/013/384/142/small_2x/fabric-texture-abstract-pattern-black-and-white-textiles-backgrounds-photo.jpg');
} }
@ -99,7 +101,6 @@ footer {
height: 350px; height: 350px;
object-fit: cover; object-fit: cover;
border-radius: 50%; border-radius: 50%;
//border: 3px solid rgba(255, 255, 255, 0.3);
box-shadow: 0 0 12px rgba(0, 0, 0, 0.6); box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
} }
} }
@ -107,10 +108,10 @@ footer {
.content { .content {
text-align: left; text-align: left;
margin-left: -30rem; margin-left: -30rem;
h1 { h1 {
font-size: 4rem; font-size: 4rem;
margin-bottom: 1rem; margin: -5rem 0 1rem;
margin-top: -5rem;
color: #5488bf; color: #5488bf;
text-shadow: 0 0 9px #373737; text-shadow: 0 0 9px #373737;
@ -122,7 +123,6 @@ footer {
.tagline { .tagline {
font-size: 1.7rem; font-size: 1.7rem;
//color: #ccc;
text-align: left; text-align: left;
.tagline-item { .tagline-item {
@ -141,6 +141,7 @@ footer {
@media (max-width: 600px) { @media (max-width: 600px) {
.content { .content {
margin: 0; margin: 0;
.portrait { .portrait {
text-align: center; text-align: center;
margin: 0; margin: 0;
@ -148,40 +149,33 @@ footer {
img { img {
width: 200px; width: 200px;
height: 200px; height: 200px;
object-fit: cover;
border-radius: 50%;
margin: 0;
//border: 3px solid rgba(255, 255, 255, 0.3);
//box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
} }
} }
h1 { h1 {
text-align: left; text-align: left;
margin-top: 0; margin: 0 0 1ch 1.5rem;
margin-bottom: 1ch; font-size: 2.7rem;
margin-left: 1.5rem;
font-size: 2.7rem;
} }
.tagline { .tagline {
display: block; display: block;
margin-left: 1.5rem; margin-left: 1.5rem;
.tagline-item { .tagline-item {
display: block; display: block;
margin-bottom: 0.3rem; margin-bottom: 0.3rem;
} }
.tagline-item:last-child { .tagline-item:last-child {
margin-bottom: 0; // remove extra space after last line margin-bottom: 0;
} }
.cursor { .cursor {
margin-left: 0.4ch; // keep close to text margin-left: 0.4ch;
}
} }
} }
}
} }
} }
@ -192,6 +186,7 @@ footer {
} }
.section2 { .section2 {
&::before { &::before {
background-image: url('https://wallpapers.com/images/hd/integral-project-management-cover-erpo8ef1af3wuquu.jpg'); background-image: url('https://wallpapers.com/images/hd/integral-project-management-cover-erpo8ef1af3wuquu.jpg');