lafleur
/
bop-hugo-theme
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

initial pink style

This commit is contained in:
la Fleur 2020-11-15 16:27:12 +01:00
parent 847c223126
commit 0daff6d122
2 changed files with 101 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

107
assets/css/style.scss
View File

@ -3,39 +3,100 @@
} }
html { html {
font-family: "Coelacanth", "Lucida Sans Unicode", Arial, Helvetica, sans-serif; font-family: "Coelacanth", "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
font-size: large; font-size: x-large;
} }
a { a {
text-decoration: none; text-decoration: none;
} }
a.exposed { a.exposed, span.exposed {
font-weight: bold; font-weight: bold;
font-size: 1.3em; font-size: 1.3em;
} }
a:visited { a:visited {
} }
body {
max-width: 1200px;
@media (min-width: 1200px) {
margin: auto;
}
}
header {
text-align: center;
h1 {
margin-bottom: 0;
}
nav {
margin: 1em;
}
nav > * {
padding: 0.5em;
}
}
.path { .path {
display: inline; display: inline;
} }
body {
background-color: white;
}
header {
margin-top: 1em;
padding-bottom: 2em;
padding-top: 1em;
background-color: #9f5470;
background-color: pink;
color: white;
a {
color: white;
}
a.exposed, span.exposed {
font-weight: bold;
font-size: 1.8em;
}
a:visited {
font-weight: bold;
}
div.title-bar {
display: flex;
align-items: center;
justify-content: space-between;
max-width: 1200px;
@media (min-width: 1200px) {
margin: auto;
}
img {
height: 88px;
}
* {
padding: 0.5em;
}
}
div.description {
display: inline;
font-style: italic;
font-size: smaller;
}
nav {
position: relative;
display: flex;
align-items: baseline;
justify-content: space-around;
max-width: 1200px;
padding-bottom: 6em;
span {
-webkit-animation: exposed 1s ease forwards;
}
span.exposed {
position: absolute;
top: 4rem;
}
@keyframes exposed {
from { position: relative; top: 0; }
to { position: absolute; top: 4rem; }
}
@media (min-width: 1200px) {
margin: auto;
}
}
}
main {
max-width: 1200px;
@media (min-width: 1200px) {
margin-left: auto;
margin-right: auto;
}
background-color: white;
padding: 1em;
border-top-left-radius: 1em;
border-top-right-radius: 1em;
margin-top: -2em;
margin-left: 1em;
margin-right: 1em;
*:nth-child(1) {
margin-top: 0;
}
}

16
layouts/partials/header.html
View File

@ -1,23 +1,31 @@
{{ $currentPage := . }} {{ $currentPage := . }}
<header> <header>
<h1> <div class="title-bar">
{{ with resources.Get "img/titre.png" }} {{ with resources.Get "img/titre-blanc.png" }}
<a href="{{ $.Site.BaseURL | relURL }}"> <a href="{{ $.Site.BaseURL | relURL }}">
<img src="{{ .RelPermalink }}" /> <img src="{{ .RelPermalink }}" />
</a> </a>
{{ else }} {{ else }}
<a href="{{ $.Site.BaseURL | relURL }}">{{ .Site.Title }}</a> <a href="{{ $.Site.BaseURL | relURL }}">{{ .Site.Title }}</a>
{{ end }} {{ end }}
</h1> <div class="description">
{{ with $.Site.Params.Description }} {{ with $.Site.Params.Description }}
{{ . }} {{ . }}
{{ end }} {{ end }}
</div>
</div>
<nav> <nav>
{{ range $.Site.Sections }} {{ range $.Site.Sections }}
<a href="{{ .Permalink }}" class="{{ if eq $currentPage.Section .Section }}exposed{{ end }}"> {{ if eq $currentPage.Section .Section }}
<span class="exposed">
{{ .Title | markdownify }}
</span>
{{ else }}
<a href="{{ .Permalink }}">
{{ .Title | markdownify }} {{ .Title | markdownify }}
</a> </a>
{{ end }} {{ end }}
{{ end }}
</nav> </nav>
</header> </header>