Updated bottom footer style making it 100% explicitly.

This commit is contained in:
David Ball 2024-07-13 03:27:34 -04:00
parent bfc50d8926
commit 126094e34a

View File

@ -28,16 +28,18 @@ const { title } = Astro.props;
</head>
<body>
<slot />
<div class="footer">
<div class="footer-header">
<p class="logo"><a class="daball-navbar-brand" href="https://daball.me">A <span class="pretty">pretty</span> <span class="cool">cool</span> website by <span class="david">David</span> <span class="allen">A.</span> <span class="ball">Ball</span>.</a></p>
</div>
<div class="footer-content">
<p>
&copy; Copyright 2024 David A. Ball. Dasher Supply is not endorsed by nor affiliated with DoorDash.
<slot name="disclaimers" />
</p>
<p><a href="/about">About this site</a>. | <a href="https://gitea.daball.me/daball/dashersupply">View source</a>.</p>
<div class="footer-container">
<div class="footer">
<div class="footer-header">
<p class="logo"><a class="daball-navbar-brand" href="https://daball.me">A <span class="pretty">pretty</span> <span class="cool">cool</span> website by <span class="david">David</span> <span class="allen">A.</span> <span class="ball">Ball</span>.</a></p>
</div>
<div class="footer-content">
<p>
&copy; Copyright 2024 David A. Ball. Dasher Supply is not endorsed by nor affiliated with DoorDash.
<slot name="disclaimers" />
</p>
<p><a href="/about">About this site</a>. | <a href="https://gitea.daball.me/daball/dashersupply">View source</a>.</p>
</div>
</div>
</div>
</body>
@ -60,6 +62,7 @@ const { title } = Astro.props;
background-color: #13151a !important;
/* background-size: 224px; */
}
/* body { min-width: 980px } */
code {
font-family:
Menlo,
@ -71,9 +74,13 @@ const { title } = Astro.props;
Courier New,
monospace;
}
.footer-container {
margin: auto;
padding: 1rem;
min-width: 800px;
max-width: calc(100% - 2rem);
}
.footer {
margin-left: 2rem;
margin-right: 2rem;
/* border: 1px solid #23262d; */
border: none;
background: linear-gradient(rgba(var(--accent-dark), 66%), rgba(var(--accent-dark), 33%));
@ -85,12 +92,14 @@ const { title } = Astro.props;
font-weight: 400;
font-size: 1.2em;
font-style: normal;
width: 100%;
}
.footer, .footer-header {
border-top-left-radius: 8px;
border-top-right-radius: 8px;
}
.footer-header, .footer-content {
width: 100%;
padding: 1.5rem;
}
.footer-header {