Refine homepage layout

- Remove announcement box styling, keep only yellow text link
- Move links-bottom to true bottom of page using flexbox
- Add min-height: 100vh to body for proper footer alignment
- Announcement link now styled as plain yellow text without borders
This commit is contained in:
dangrubbb
2026-02-28 09:52:27 -05:00
parent 9afda9a01a
commit 1e6a843b94
2 changed files with 17 additions and 15 deletions

View File

@ -239,8 +239,12 @@
dangrubb.net
</p>
<div class="announcement">
<p class="announcement">
<a href="https://dangrubb.net/music">EXCLUSIVE: Leaked mixtape from Darnea's vault</a>
</p>
<div class="debug">
<div class="code"></div>
</div>
<div class="links-bottom">
@ -251,9 +255,6 @@
<a target="_parent" href="https://dangrubb.net/cv">cv</a>
<a target="_parent" href="https://pi.dangrubb.net/dangit">git</a>
</div>
<div class="debug">
<div class="code"></div>
</div>
<!-- partial -->
<script src="./script.js"></script>

View File

@ -3,6 +3,9 @@ body {
padding: 40px 20px;
font-family: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas, "DejaVu Sans Mono", monospace;
color: #9d9aa4;
display: flex;
flex-direction: column;
min-height: 100vh;
}
.bard {
@ -157,21 +160,18 @@ p {
}
.announcement {
margin: 30px auto 0;
padding: 20px;
max-width: 500px;
background: #ffeb3b;
border: 3px solid #fbc02d;
border-radius: 8px;
margin: 20px auto 0;
position: relative;
max-width: 400px;
text-align: center;
box-shadow: 0 4px 12px rgba(255, 235, 59, 0.3);
line-height: 1.3;
font-size: 0.875rem;
}
.announcement a {
color: #000;
color: #ffeb3b;
font-weight: bold;
text-decoration: none;
font-size: 1rem;
}
.announcement a:hover,
@ -181,15 +181,16 @@ p {
}
.links-bottom {
margin: 60px auto 0;
margin-top: auto;
padding-top: 40px;
position: relative;
max-width: 400px;
text-align: center;
padding-bottom: 20px;
display: flex;
flex-wrap: wrap;
gap: 20px;
justify-content: center;
align-self: center;
}
.links-bottom a {