website-theme/layouts/_default/baseof.html

155 lines
3.1 KiB
HTML

<!DOCTYPE html>
<html lang="{{ $.Site.Language }}">
<head>
{{ block "title" . }}
<title>
{{ if .IsHome }}{{ $.Site.Title }}{{ with $.Site.Params.Subtitle }} —
{{ . }}{{ end }}{{ else }}{{ .Title }} >
{{ $.Site.Title }}{{ with $.Site.Params.Subtitle }} — {{ . }}{{ end }}{{ end }}
</title>
{{ end }}
{{ partial "head.html" . }}
<style>
@media screen and (max-width: 684px) {
.titolo-wiki {
margin: 6%;
}
}
/* Homepage */
.about {
padding: 5%;
display: flex;
align-items: flex-end;
position: relative;
/* Importante per il posizionamento del cursore */
padding-left: 0;
}
#about-text {
flex: 1;
position: relative;
padding: 5%;
}
.about .logo__cursor {
font-size: 1.2em;
font-weight: bold;
color: #333;
cursor: pointer;
transition: color 0.3s ease;
position: absolute;
/* Il cursore si muove in base al contenitore .about */
top: 0;
/* Verrà sovrascritto in JS */
left: 0;
/* Verrà sovrascritto in JS */
transform: translateY(-50%);
}
@media (max-width: 821px) {
.about h4 {
font-size: 1em;
}
}
.card-container {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding-inline: 5%;
}
.card {
flex: 0 0 23%;
margin: 10px;
padding-inline: 2%;
border-radius: 20px;
transition: all 0.3s ease-in-out;
background-color: var(--background-secondary);
overflow: hidden;
}
.card:hover {
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
transform: translateY(-5px);
}
.card a {
text-decoration: none;
}
.card h2 {
color: #618375;
}
.card-img {
width: 100%;
}
.card-body {
padding: 10px;
}
.card-tags {
padding: 10px;
background-color: #f8f8f8;
}
/* Media Queries */
@media screen and (max-width: 1111px) {
.card {
flex: 0 0 30% !important;
}
}
@media screen and (max-width: 800px) {
.card {
flex: 0 0 44% !important;
}
.card-container {
justify-content: space-around;
}
}
@media screen and (max-width: 684px) {
.card-container {
justify-content: center;
}
.card {
flex: 0 0 100% !important;
width: 100%;
}
}
/* Specific styles for #events */
.card#events {
flex: 0 0 30%;
}
</style>
{{ $customJS := resources.Get "js/cursor.js" | minify | fingerprint }}
<script src="{{ $customJS.Permalink }}" integrity="{{ $customJS.Data.Integrity }}"></script>
</head>
<body {{ with $.Site.Params.defaultTheme -}} class="{{ printf " %s-theme" . }}" {{- end }}>
<div class="container">
{{ partial "header.html" . }}
<div class="content">
{{ block "main" . }} {{ end }}
</div>
{{ block "footer" . }}
{{ partial "footer.html" . }}
{{ end }}
</div>
{{ if $.Site.Config.Services.GoogleAnalytics.ID }}
{{ template "_internal/google_analytics.html" . }}
{{ end }}
</body>
</html>