cleanup home page a bit

This commit is contained in:
a 2022-07-04 02:39:32 -05:00
parent f790d6ee7c
commit b2ab793596
2 changed files with 34 additions and 17 deletions

View File

@ -45,31 +45,34 @@
background: black;
color: white;
text-align: center;
> img {
.container {
display: flex;
flex-flow: column;
align-items: center;
}
.photo {
max-height: 100vh;
height: 100%;
max-width: 100%;
object-fit: contain;
object-position: center bottom;
}
> div {
.info {
display: flex;
flex-flow: column;
align-items: center;
}
div img {
.logo {
margin: 2rem 0;
}
display: flex;
flex-flow: column;
align-items: center;
@media (min-width: 40rem) {
> img {
.photo {
height: 20rem;
}
flex-flow: row-reverse;
justify-content: space-between;
max-width: 40rem;
.container {
flex-flow: row-reverse;
justify-content: space-between;
}
}
a {
color: white;
@ -86,5 +89,16 @@
#updates {
line-height: 1.5;
font-size: 1.25rem;
.heading {
font-size: 1.5em;
font-weight: 700;
margin-bottom: 1em;
}
p + p {
margin: 1em 0;
}
p {
max-width: 55ch;
}
}
}

View File

@ -32,17 +32,20 @@
</div>
</div>
</header>
<section class="container" id="birdsounds">
<div class="">
<img src="/images/logos/koken_y.png" alt="birdsounds.media logo">
<a href="https://birdsounds.media" class="">view my photos</a>
<section class="" id="birdsounds">
<div class="container">
<div class="info">
<img class="logo" src="/images/logos/koken_y.png" alt="birdsounds.media logo">
<a href="https://birdsounds.media" class="">view my photos</a>
</div>
<img class="photo" src="/images/soulpunx.jpg" alt="#soulpunx">
</div>
<img src="/images/soulpunx.jpg" alt="#soulpunx">
</section>
<section class="section" id="updates">
<div class="container">
<p>currently: working on my websites, trying to do some documentation for an untitled social app project, and looking for work. check out the "work" tab of this site for my elevator pitch.</p>
<h2 class="heading">latest updates</h2>
<p>2022-07-04: currently working on my websites, trying to do some documentation for a personal project, and looking for work. check out the "work" tab of this site for my elevator pitch.</p>
</div>
</section>
</main>
{{ end }}
{{ end }}