Fixed homepage, made css not cached, navbar redesign

This commit is contained in:
Patrick Hatsune 2025-02-28 17:35:06 +09:00
parent c4c62906b1
commit 143e7eeebb
Signed by: keyemail
GPG key ID: BAA5BA1AA54DF371
14 changed files with 70 additions and 34 deletions

View file

@ -21,6 +21,7 @@ type Index struct {
GalleryPhoto *GalleryItems
VideoContent *VideoItems
Nav bool
PageName string
}
type GalleryItems struct {
@ -113,6 +114,7 @@ func renderTemplate(w http.ResponseWriter, tmpl string, data *Index, nav bool) {
func galleryContentHandler(w http.ResponseWriter, req *http.Request) {
parts := strings.Split(req.URL.Path, "/")
data.PageName = "gallery"
if len(parts) == 3 && parts[1] == "gallery" {
idStr := parts[2]
id, err := strconv.Atoi(idStr)
@ -143,6 +145,7 @@ func galleryContentHandler(w http.ResponseWriter, req *http.Request) {
func videoContentHandler(w http.ResponseWriter, req *http.Request) {
parts := strings.Split(req.URL.Path, "/")
data.PageName = "videos"
if len(parts) == 3 && parts[1] == "videos" {
idStr := parts[2]
id, err := strconv.Atoi(idStr)
@ -171,14 +174,17 @@ func videoContentHandler(w http.ResponseWriter, req *http.Request) {
}
func videoHandler(w http.ResponseWriter, req *http.Request) {
data.PageName = "videos"
renderTemplate(w, "video", data, true)
}
func socialsHandler(w http.ResponseWriter, req *http.Request) {
data.PageName = "socials"
renderTemplate(w, "socials", data, true)
}
func galleryHandler(w http.ResponseWriter, req *http.Request) {
data.PageName = "gallery"
renderTemplate(w, "gallery", data, true)
}
@ -188,6 +194,7 @@ func indexHandler(w http.ResponseWriter, req *http.Request) {
return
}
data.PageName = "home"
renderTemplate(w, "home", data, true)
}

View file

@ -2,21 +2,31 @@
<nav>
<h1>Keyemail</h1>
<ul>
<li>
<a href="/">Home</a>
<a href="/">
<li class="{{ if eq .PageName "home" }}active{{ end }}">
Home
</li>
<li>
<a href="/gallery">Gallery</a>
</a>
<a href="/gallery">
<li class="{{ if eq .PageName "gallery" }}active{{ end }}">
Gallery
</li>
<li>
<a href="/socials">Socials</a>
</a>
<a href="/socials">
<li class="{{ if eq .PageName "socials" }}active{{ end }}">
Socials
</li>
</a>
<a href="/videos" class="{{ if eq .PageName "videos" }}active{{ end }}">
<li>
<a href="/videos">Videos</a>
Videos
</li>
<li>
<a href="https://git.keyemail.dev/explore/">Git</a>
</a>
<a href="https://git.keyemail.dev/explore/">
<li class="lastIcon">
Git
</li>
</a>
</ul>
</nav>
{{ end }}

View file

@ -12,7 +12,7 @@
<meta name="theme-color" content="#192236">
<title>{{ .WebpageTitle }}</title>
<link rel="icon" type="image/x-icon" href="{{ .WebpageIcon }}">
<link rel="stylesheet" href="/src/styles/main.css">
<link rel="stylesheet" href="/src/styles/main.css?version=022825">
<script src="https://kit.fontawesome.com/d18ce6e9fb.js" crossorigin="anonymous"></script>
</head>
<body>

View file

@ -1,6 +1,6 @@
<head>
{{ define "head" }}
<link rel="stylesheet" href="/src/styles/404.css">
<link rel="stylesheet" href="/src/styles/404.css?version=022825">
<meta property="description" content="{{ .WebpageDescription }}"/>
<meta property="og:description" content="{{ .WebpageDescription }}">
{{ end }}

View file

@ -1,6 +1,6 @@
<head>
{{ define "head" }}
<link rel="stylesheet" href="/src/styles/gallery.css">
<link rel="stylesheet" href="/src/styles/gallery.css?version=022825">
<meta property="description" content="{{ .WebpageDescription }}"/>
<meta property="og:description" content="{{ .WebpageDescription }}">
{{ end }}

View file

@ -1,6 +1,6 @@
<head>
{{ define "head" }}
<link rel="stylesheet" href="/src/styles/gallery.css">
<link rel="stylesheet" href="/src/styles/gallery.css?version=022825">
<meta property="og:image" content="{{ .WebpageURL }}{{ .GalleryPhoto.URL }}"/>
<meta name="twitter:card" content="summary_large_image"/>
{{ end }}

View file

@ -1,6 +1,6 @@
<head>
{{ define "head" }}
<link rel="stylesheet" href="/src/styles/home.css"/>
<link rel="stylesheet" href="/src/styles/home.css?version=022825"/>
<meta property="description" content="{{ .WebpageDescription }}"/>
<meta property="og:description" content="{{ .WebpageDescription }}">
{{ end }}
@ -8,9 +8,9 @@
<body>
{{ define "body" }}
<header>
<div id="headerImg">
<a id="headerImg" href="/src/assets/profile/header.jpg">
<img src="/src/assets/profile/header.jpg">
</div>
</a>
<a class="pfp" href="/src/assets/profile/profile.jpg">
<img src="/src/assets/profile/profile.jpg"/>
</a>

View file

@ -1,6 +1,6 @@
<head>
{{ define "head" }}
<link rel="stylesheet" href="/src/styles/socials.css">
<link rel="stylesheet" href="/src/styles/socials.css?version=022825">
<meta property="description" content="{{ .WebpageDescription }}"/>
<meta property="og:description" content="{{ .WebpageDescription }}">
{{ end }}

View file

@ -1,6 +1,6 @@
<head>
{{ define "head" }}
<link rel="stylesheet" href="/src/styles/video.css"/>
<link rel="stylesheet" href="/src/styles/video.css?version=022825"/>
<meta property="description" content="{{ .WebpageDescription }}"/>
<meta property="og:description" content="{{ .WebpageDescription }}">
{{ end }}

View file

@ -1,6 +1,6 @@
<head>
{{ define "head" }}
<link rel="stylesheet" href="/src/styles/video.css"/>
<link rel="stylesheet" href="/src/styles/video.css?version=022825"/>
<meta property="og:image" content="{{ .WebpageURL }}{{ .VideoContent.Thumbnail }}"/>
<meta name="twitter:card" content="summary_large_image"/>
{{ end }}

View file

@ -10,21 +10,23 @@ header {
flex-direction: column;
margin-top: 20px;
background-color: var(--bg-alt-color);
height: 430px;
height: 420px;
width: 100%;
border-radius: 10px;
font-family: 'Rubik', sans-serif;
padding-bottom: 15px;
box-sizing: content-box;
h1 {
color: white;
font-size: 3rem;
margin-left: 20px;
line-height: 1.2;
}
p {
color: white;
font-size: 1.5rem;
margin-left: 20px;
margin-bottom: 20px;
}
}

View file

@ -10,7 +10,6 @@
body {
background-color: var(--bg-color);
min-height: 100vh;
}
@ -43,25 +42,38 @@ nav {
align-items: center;
justify-content: space-between;
color: white;
height: 50px;
font-family: 'Rubik', sans-serif;
font-weight: 500;
background-color: var(--bg-alt-color);
border-radius: 10px;
h1 {
width: fit-content;
z-index: 10;
margin-left: 13px;
}
ul {
list-style: none;
float: right;
display: flex;
margin-left: 10px;
}
ul li{
display: inline;
display: flex;
cursor: pointer;
margin-left: 10px;
font-weight: 400;
transition: color 0.3s;
align-items: center;
height: 50px;
padding: 0 13px;
transition: 0.3s background-color;
}
ul li:hover {
background-color: #2269d4;
}
ul a {
@ -69,10 +81,6 @@ nav {
color: inherit;
}
ul li:hover{
color: #8ee8fc;
}
i {
float: right;
font-size: 35px;
@ -84,6 +92,15 @@ nav {
i:hover {
color: #74d2f1;
}
.lastIcon {
border-top-right-radius: 10%;
border-bottom-right-radius: 10%;
}
.active {
background-color: #2269d4 !important;
}
}
@media screen and (max-width: 430px) {