updated blog with new layout

This commit is contained in:
Jacob 2021-03-09 21:10:26 +01:00
parent addaa17a98
commit 7d230eb7d5
4 changed files with 74 additions and 32 deletions

View File

@ -11,7 +11,9 @@ html, body {
}
.title {
padding: 20px;
//padding: 20px;
justify-content: flex-end;
color: #ff8f00;
}
.title:hover {
@ -57,10 +59,12 @@ article {
h1 {
letter-spacing: 5px;
margin-right: -5px;
font-size: 40px;
//color: #97c5e0;
color: #506692;
text-align: center;
text-align: right;
justify-content: flex-end;
padding-top: 30px;
}
@ -104,13 +108,20 @@ ul {
//color: #97c5e0;
}
.menu{
.section{
display: flex;
justify-content: center;
padding-bottom: 20px;
color: #35465D;
}
.menu{
display: flex;
justify-content: flex-end;
padding-bottom: 20px;
color: #35465D;
}
.menuselect{
color: #529ecc;
}
@ -118,6 +129,7 @@ ul {
.menuElement{
border: 20px;
padding: 10px;
padding-right: 0px;
font-size: 20px;
text-decoration: none;
}
@ -125,7 +137,6 @@ ul {
.menuElement:hover {
//background-color: #687fad;
color: lightblue;
background-color: #d6e2fa;
}
.bottomMenu {
@ -147,15 +158,28 @@ ul {
//background-color: #d6e2fa;
}
#menu ul{
#section ul>li{
display: block;
margin: auto;
float: center;
text-align: right;
list-style: none;
}
#section li{
display: inline-block;
vertical-align: top;
}
#menu ul{
//display: block;
margin: auto;
float: center;
text-align: center;
list-style: none;
}
#menu li{
display: inline-block;
//display: inline-block;
}

View File

@ -7,28 +7,36 @@
<link rel="stylesheet" href="/css/style.css">
</head>
<body>
<h1><a class="title" href="/" style="text-decoration: none; color: inherit">{{.Title}}</a></h1>
<div class="tagline">
<p style="text-indent: 0;">Develop games, play games, talk games</p>
</div>
<div class="menu">
<ul id="menu">
<li><a class={{if eq .CurrentPage "blog"}}"menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/">blog</a></li>
<li><a class={{if eq .CurrentPage "about"}}"menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/about">about</a></li>
<li><a class={{if eq .CurrentPage "past"}}"menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/past">past</a></li>
<li><a class={{if eq .CurrentPage "contact"}}"menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/contact">contact</a></li>
</ul>
</div>
<div class="contents">
{{if eq .CurrentPage "blog"}}
<article class="posts">{{template "content" .}}</article>
{{else if eq .CurrentPage "about"}}
<div>{{template "about" .}}</div>
{{else if eq .CurrentPage "past"}}
<div>{{template "past" .}}</div>
{{else if eq .CurrentPage "contact"}}
<div>{{template "contact" .}}</div>
{{end}}
<div class="section">
<ul id="section">
<li>
<h1><a class="title" href="/" style="text-decoration: none;">{{.Title}}</a></h1>
<div class="tagline">
<p style="text-indent: 0;">Develop games, play games, talk games</p>
</div>
<div class="menu">
<ul id="menu">
<!-- <li><a class={{if eq .CurrentPage "blog"}} "menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/">blog</a></li> -->
<li><a class={{if eq .CurrentPage "past"}} "menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/past">past</a></li>
<li><a class={{if eq .CurrentPage "about"}} "menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/about">about</a></li>
<li><a class={{if eq .CurrentPage "contact"}} "menuselect menuElement no-link"{{else}}"menuElement no-link"{{end}} href="/contact">contact</a></li>
</ul>
</div>
</li>
<li>
<div class="contents">
{{if eq .CurrentPage "blog"}}
<article class="posts">{{template "content" .}}</article>
{{else if eq .CurrentPage "about"}}
<div>{{template "about" .}}</div>
{{else if eq .CurrentPage "past"}}
<div>{{template "past" .}}</div>
{{else if eq .CurrentPage "contact"}}
<div>{{template "contact" .}}</div>
{{end}}
</div>
</li>
</ul>
</div>
</body>
</html>

View File

@ -1,9 +1,17 @@
{{define "past"}}
<article class="post">
<ul style="list-style: none;">
<ul style="width: max-content; list-style: none;">
{{with .Posts}}
{{range .}}
<li><a class="no-link" style="text-decoration: none; color: inherit" href="/post/{{.URLTitle}}"><b>{{.Title}}</b></a> - {{.NormalDate}}</li>{{end}}{{end}}
<li>
<div style="display: flex; justify-content: space-between; ">
<div style="padding-right: 20px">
<a class="no-link" style="text-decoration: none; color: inherit" href="/post/{{.URLTitle}}"><b>{{.Title}}</b></a>
</div>
<div>
{{.NormalDate}}
</div>
</div>{{end}}{{end}}
</ul>
</article>
{{end}}

View File

@ -28,7 +28,8 @@ func main() {
http.HandleFunc("/past/", pastHandler)
http.HandleFunc("/contact/", contactHandler)
http.HandleFunc("/post/", postHandler)
http.HandleFunc("/", blogHandler)
http.HandleFunc("/", pastHandler)
//http.HandleFunc("/", blogHandler)
http.Handle("/images/", http.StripPrefix("/images/", http.FileServer(http.Dir("images"))))
http.Handle("/css/", http.StripPrefix("/css/", http.FileServer(http.Dir("css"))))
@ -64,7 +65,8 @@ func blogHandler(w http.ResponseWriter, req *http.Request) {
length := len(posts)
posts = posts[:3]
//posts = getNewestPosts(3)
page := Page{name, posts, "blog"}
page := Page{name, posts, "past"}
//page := Page{name, posts, "blog"}
renderTemplates(w, page)
posts = posts[:length]
}