keyemail/keyemail-dev
1
2
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Fixed homepage, made css not cached, navbar redesign

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

7
main.go
View file

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

0
src/assets/profile/header.jpg:Zone.Identifier
View file

0
src/assets/profile/profile.jpg:Zone.Identifier
View file

38
src/components/navbar.tmpl
View file

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

2
src/index.tmpl
View file

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

2
src/pages/404.tmpl
View file

@ -1,6 +1,6 @@
<head> <head>
{{ define "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="description" content="{{ .WebpageDescription }}"/>
<meta property="og:description" content="{{ .WebpageDescription }}"> <meta property="og:description" content="{{ .WebpageDescription }}">
{{ end }} {{ end }}

2
src/pages/gallery.tmpl
View file

@ -1,6 +1,6 @@
<head> <head>
{{ define "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="description" content="{{ .WebpageDescription }}"/>
<meta property="og:description" content="{{ .WebpageDescription }}"> <meta property="og:description" content="{{ .WebpageDescription }}">
{{ end }} {{ end }}

2
src/pages/gallery_content.tmpl
View file

@ -1,6 +1,6 @@
<head> <head>
{{ define "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 property="og:image" content="{{ .WebpageURL }}{{ .GalleryPhoto.URL }}"/>
<meta name="twitter:card" content="summary_large_image"/> <meta name="twitter:card" content="summary_large_image"/>
{{ end }} {{ end }}

6
src/pages/home.tmpl
View file

@ -1,6 +1,6 @@
<head> <head>
{{ define "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="description" content="{{ .WebpageDescription }}"/>
<meta property="og:description" content="{{ .WebpageDescription }}"> <meta property="og:description" content="{{ .WebpageDescription }}">
{{ end }} {{ end }}
@ -8,9 +8,9 @@
<body> <body>
{{ define "body" }} {{ define "body" }}
<header> <header>
<div id="headerImg"> <a id="headerImg" href="/src/assets/profile/header.jpg">
<img src="/src/assets/profile/header.jpg"> <img src="/src/assets/profile/header.jpg">
</div> </a>
<a class="pfp" href="/src/assets/profile/profile.jpg"> <a class="pfp" href="/src/assets/profile/profile.jpg">
<img src="/src/assets/profile/profile.jpg"/> <img src="/src/assets/profile/profile.jpg"/>
</a> </a>

2
src/pages/socials.tmpl
View file

@ -1,6 +1,6 @@
<head> <head>
{{ define "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="description" content="{{ .WebpageDescription }}"/>
<meta property="og:description" content="{{ .WebpageDescription }}"> <meta property="og:description" content="{{ .WebpageDescription }}">
{{ end }} {{ end }}

2
src/pages/video.tmpl
View file

@ -1,6 +1,6 @@
<head> <head>
{{ define "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="description" content="{{ .WebpageDescription }}"/>
<meta property="og:description" content="{{ .WebpageDescription }}"> <meta property="og:description" content="{{ .WebpageDescription }}">
{{ end }} {{ end }}

2
src/pages/video_content.tmpl
View file

@ -1,6 +1,6 @@
<head> <head>
{{ define "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 property="og:image" content="{{ .WebpageURL }}{{ .VideoContent.Thumbnail }}"/>
<meta name="twitter:card" content="summary_large_image"/> <meta name="twitter:card" content="summary_large_image"/>
{{ end }} {{ end }}

6
src/styles/home.css
View file

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

31
src/styles/main.css
View file

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