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:
@ -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>
|
||||
|
||||
|
||||
23
style.css
23
style.css
@ -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 {
|
||||
|
||||
Reference in New Issue
Block a user