Update css for page content and modify divs

This commit is contained in:
Sam 2024-08-01 15:44:02 +01:00
parent 4affda2e81
commit ff1bcfd6ab
3 changed files with 17 additions and 19 deletions

View File

@ -7,8 +7,4 @@
src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"
></script> ></script>
<script src="https://cdn.jsdelivr.net/npm/echarts@5.5.1/dist/echarts.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/echarts@5.5.1/dist/echarts.min.js"></script>
<div class="main-page">
<html lang="{{ .Site.LanguageCode }}">
{{ template "partials/body.html" . }} {{ template "partials/body.html" . }}
</html>
</div>

View File

@ -1,8 +1,7 @@
<body> <body>
<div class="page-container">
{{ partial "header.html" . }} {{ partial "header.html" . }}
<main class="main-content"> <main class="main-content">{{- block "main" . }} {{ end -}}</main>
{{- block "main" . }}
{{ end -}}
</main>
{{ partial "footer.html" . }} {{ partial "footer.html" . }}
</div>
</body> </body>

View File

@ -66,19 +66,26 @@ body {
color: var(--text-color); color: var(--text-color);
} }
.main-page { .page-container {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
min-height: 100vh; min-height: 100vh;
} }
.main-content { .main-content {
flex-grow: 1; flex: 1;
}
.page-container {
display: flex;
flex-direction: column;
min-height: 100vh;
} }
a { a {
text-decoration: none; text-decoration: none;
color: var(--link-color); color: var(--link-color);
text-decoration: underline;
} }
a:hover { a:hover {
@ -107,6 +114,7 @@ a:hover {
.profile-img { .profile-img {
margin-right: 20px; margin-right: 20px;
margin-left: 20px;
} }
.profile-img img { .profile-img img {
@ -134,7 +142,6 @@ a:hover {
} }
} }
/* Articles */
.main-article { .main-article {
padding: var(--content-padding); padding: var(--content-padding);
width: var(--article-max-width); width: var(--article-max-width);
@ -408,15 +415,11 @@ footer {
background-color: var(--footer-background-color); background-color: var(--footer-background-color);
color: var(--text-color); color: var(--text-color);
padding: 20px; padding: 20px;
height: 10vh;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
footer a {
color: #f2f2f2;
transition: background-color 0.3s ease;
}
footer a:hover { footer a:hover {
background-color: #ddd; background-color: #ddd;
color: black; color: black;