major style changes
This commit is contained in:
parent
c4f36998ec
commit
dedcdb7dec
6 changed files with 142 additions and 71 deletions
|
@ -2,12 +2,17 @@
|
||||||
<html>
|
<html>
|
||||||
{{partial "head" .}}
|
{{partial "head" .}}
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
<div class="spacer"></div>
|
||||||
{{partial "profile" .}}
|
{{partial "profile" .}}
|
||||||
|
|
||||||
|
<div class="spacer"></div>
|
||||||
<aside id="posts">
|
<aside id="posts">
|
||||||
{{range .Pages}}
|
{{range .Pages}}
|
||||||
{{partial "post" .}}
|
{{partial "post" .}}
|
||||||
<hr>
|
|
||||||
{{end}}
|
{{end}}
|
||||||
</aside>
|
</aside>
|
||||||
|
|
||||||
|
<div class="spacer"></div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
|
@ -2,12 +2,14 @@
|
||||||
<html>
|
<html>
|
||||||
{{partial "head" .}}
|
{{partial "head" .}}
|
||||||
<body>
|
<body>
|
||||||
|
<div class="spacer"></div>
|
||||||
{{partial "profile" .}}
|
{{partial "profile" .}}
|
||||||
|
<div class="spacer"></div>
|
||||||
<aside id="posts">
|
<aside id="posts">
|
||||||
{{range first 10 .Site.RegularPages}}
|
{{range first 4 .Site.RegularPages}}
|
||||||
{{partial "post" .}}
|
{{partial "post" .}}
|
||||||
<hr>
|
|
||||||
{{end}}
|
{{end}}
|
||||||
</aside>
|
</aside>
|
||||||
|
<div class="spacer"></div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
|
@ -3,14 +3,22 @@
|
||||||
{{if .Date }}
|
{{if .Date }}
|
||||||
<p>{{.Date | time.Format "Jan 02 2006"}}</p>
|
<p>{{.Date | time.Format "Jan 02 2006"}}</p>
|
||||||
{{end}}
|
{{end}}
|
||||||
{{if .Params.video}}<video controls autoplay muted loop><source src="{{.Params.video}}"></video>
|
{{if .Params.video}}<video controls loop preload="none"><source src="{{.Params.video}}"></video>
|
||||||
{{else}}
|
{{else}}
|
||||||
{{if .Params.audio}}<audio controls><source src="{{.Params.audio}}"></audio>
|
{{if .Params.audio}}<audio controls preload="none"><source src="{{.Params.audio}}"></audio>
|
||||||
{{else}}
|
{{else}}
|
||||||
{{if .Params.image}}<img src="{{.Params.image}}">
|
{{if .Params.image}}<img loading="lazy" src="{{.Params.image}}">
|
||||||
{{end}}
|
{{end}}
|
||||||
{{end}}
|
{{end}}
|
||||||
{{end}}
|
{{end}}
|
||||||
|
|
||||||
<p>{{.Summary}}</p>
|
<p>{{.Summary}}</p>
|
||||||
|
{{ if .GetTerms "tags" }}
|
||||||
|
<div class="post-tags">
|
||||||
|
|
||||||
|
<span>Tags:</span>
|
||||||
|
{{range .GetTerms "tags" }}
|
||||||
|
<a href="{{.Permalink}}">{{.LinkTitle}}</a>
|
||||||
|
{{end}}
|
||||||
|
</div>
|
||||||
|
{{end}}
|
||||||
</article>
|
</article>
|
|
@ -1,35 +1,39 @@
|
||||||
<main id="profile">
|
<main id="profile">
|
||||||
<div>
|
<div>
|
||||||
<a href="/">
|
<a href="/">
|
||||||
<img id='profilephoto' src="{{.Site.Data.details.profilephoto}}">
|
<img id='profilephoto' loading="lazy" src="{{.Site.Data.details.profilephoto}}">
|
||||||
</a>
|
</a>
|
||||||
<div>
|
<div id="profile-details">
|
||||||
<h1><a href="/">{{.Site.Data.details.name}}</a></h1>
|
<a href="/"><h1>{{.Site.Data.details.name}}</h1></a>
|
||||||
<p>{{.Site.Data.details.bio}}</p>
|
<p>{{.Site.Data.details.bio}}</p>
|
||||||
{{if .Site.Data.details.contact}}
|
{{ if .Site.Data.details.links }}
|
||||||
{{range .Site.Data.details.contact}}
|
<div id="profile-links">
|
||||||
<a href="{{.value}}">{{.name}}</a>
|
{{range .Site.Data.details.links}}
|
||||||
{{end}}
|
<a href="{{.linkurl}}">{{.linkname}}</a><br>
|
||||||
{{end}}
|
{{end}}
|
||||||
</div>
|
</div>
|
||||||
|
{{end}}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
{{ if .Site.Data.details.links }}
|
|
||||||
<div>
|
|
||||||
{{range .Site.Data.details.links}}
|
|
||||||
<a href="{{.linkurl}}">{{.linkname}}</a><br>
|
|
||||||
{{end}}
|
|
||||||
</div>
|
|
||||||
{{end}}
|
|
||||||
<hr>
|
|
||||||
{{partial "nav" .}}
|
{{partial "nav" .}}
|
||||||
<hr>
|
|
||||||
{{ if .Content}}
|
{{ if .Content}}
|
||||||
<article>
|
<article>
|
||||||
{{.Content}}
|
{{.Content}}
|
||||||
</article>
|
</article>
|
||||||
<hr>
|
|
||||||
{{end}}
|
{{end}}
|
||||||
|
{{ if .GetTerms "tags" }}
|
||||||
|
<div class="post-tags">
|
||||||
|
<span>Tags:</span>
|
||||||
|
{{range .GetTerms "tags" }}
|
||||||
|
<a href="{{.Permalink}}">{{.LinkTitle}}</a>
|
||||||
|
{{end}}
|
||||||
|
</div>
|
||||||
|
{{end}}
|
||||||
<div>
|
<div>
|
||||||
<p><a href="https://codeberg.org/gabe/Valor">Valor</a> made by <a href="https://gabe.rocks">Gabriel</a></p>
|
<p><a href="https://codeberg.org/gabe/Valor">Valor</a> made by <a href="https://gabe.rocks">Gabriel</a></p>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
{{ if .Get "href"}}
|
{{ if .Get "href"}}
|
||||||
<a href='{{.Get "href"}}'>
|
<a href='{{.Get "href"}}'>
|
||||||
{{end}}
|
{{end}}
|
||||||
<img
|
<img loading="lazy"
|
||||||
src='{{.Get "src"}}'
|
src='{{.Get "src"}}'
|
||||||
{{if .Get "alt"}}
|
{{if .Get "alt"}}
|
||||||
alt='{{.Get "alt"}}'
|
alt='{{.Get "alt"}}'
|
||||||
|
|
|
@ -1,9 +1,18 @@
|
||||||
body{
|
body{
|
||||||
--theme-primary-color:black;
|
--theme-color-primary: white;
|
||||||
--theme-secondary-color: white;
|
--theme-color-secondary: black;
|
||||||
--theme-accent:rgb(29, 148, 196);
|
--theme-color-accent: #076cc5;
|
||||||
--theme-accent2:gold;
|
}
|
||||||
--theme-accent3:black;
|
@media screen and (prefers-color-scheme:dark){
|
||||||
|
body{
|
||||||
|
--theme-color-primary:black;
|
||||||
|
--theme-color-secondary:white;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
body{
|
||||||
color:var(--theme-secondary-color);
|
color:var(--theme-secondary-color);
|
||||||
background-color: var(--theme-primary-color);
|
background-color: var(--theme-primary-color);
|
||||||
display:flex;
|
display:flex;
|
||||||
|
@ -11,17 +20,20 @@ body{
|
||||||
flex-wrap: nowrap;
|
flex-wrap: nowrap;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
justify-content: space-evenly;
|
justify-content: space-evenly;
|
||||||
width:100vw;
|
width:100%;
|
||||||
margin:0;
|
margin:0;
|
||||||
padding:0;
|
padding-left:0.25rem;
|
||||||
|
padding-top:1rem;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
padding-top:1.5rem;
|
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.spacer{
|
||||||
|
width:3vw;
|
||||||
|
}
|
||||||
|
|
||||||
a,a:visited,hr{
|
a,a:visited,hr{
|
||||||
color:var(--theme-accent2);
|
color:var(--theme-accent);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -44,36 +56,49 @@ audio{
|
||||||
width:80%;
|
width:80%;
|
||||||
}
|
}
|
||||||
#profile{
|
#profile{
|
||||||
padding:1.5rem;
|
|
||||||
margin-bottom:1rem;
|
margin-bottom:1rem;
|
||||||
min-width: 20vw;
|
width: fit-content;
|
||||||
max-width:90vw;
|
max-width: 80rem;
|
||||||
|
flex-shrink: none;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
#profile-details{
|
||||||
#posts{
|
|
||||||
padding:1.5rem;
|
|
||||||
margin-bottom:1rem;
|
|
||||||
min-width: 20vw;
|
|
||||||
|
|
||||||
}
|
|
||||||
#posts{
|
|
||||||
width:40vw;
|
|
||||||
}
|
|
||||||
.post{
|
|
||||||
padding:1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
#post>img
|
|
||||||
#profile{
|
|
||||||
display:flex;
|
display:flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
#profile-links{
|
||||||
|
display:flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
|
#profile-links>a{
|
||||||
|
margin:0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#posts{
|
||||||
|
margin-bottom:1rem;
|
||||||
|
width: fit-content;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
max-width: 40rem;
|
||||||
|
|
||||||
|
}
|
||||||
|
.post{
|
||||||
|
width:100%;
|
||||||
|
word-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
#profilephoto{
|
#profilephoto{
|
||||||
margin:1rem;
|
margin:1rem;
|
||||||
max-width: 10rem;
|
max-width: 10rem;
|
||||||
|
}
|
||||||
|
section{
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
#profile>nav,
|
#profile>nav,
|
||||||
#profile>div{
|
#profile>div{
|
||||||
|
@ -94,27 +119,17 @@ nav{
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
align-items: baseline;
|
align-items: baseline;
|
||||||
justify-content:space-evenly;
|
justify-content:space-evenly;
|
||||||
|
flex-wrap: wrap;
|
||||||
}
|
}
|
||||||
nav>a{
|
nav>a{
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (orientation: portrait){
|
|
||||||
body{
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
font-size:1rem;
|
|
||||||
}
|
|
||||||
#profile,#posts{
|
|
||||||
width:85%;
|
|
||||||
padding:5%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
article{
|
article{
|
||||||
display:flex;
|
display:flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
width:100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
article p,
|
article p,
|
||||||
|
@ -137,4 +152,41 @@ blockquote {
|
||||||
|
|
||||||
.gallery{
|
.gallery{
|
||||||
max-width:40vw;
|
max-width:40vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
audio{
|
||||||
|
padding:1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-tags{
|
||||||
|
display:flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
width:80%;
|
||||||
|
font-weight: bolder;
|
||||||
|
font-size:1.25rem
|
||||||
|
}
|
||||||
|
@media screen and (orientation: portrait){
|
||||||
|
body{
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: flex-start;
|
||||||
|
flex-wrap: none;
|
||||||
|
padding:0;
|
||||||
|
font-size:1rem;
|
||||||
|
}
|
||||||
|
#profile,#posts{
|
||||||
|
width:90%;
|
||||||
|
max-width: 90vw;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
#profile a>img{
|
||||||
|
display:flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in a new issue