PVR/gokarna
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

All tags page draft

Browse Source
This commit is contained in:
Avijit 🚀
2021-05-29 18:13:06 +02:00
committed by Yash Mehrotra
parent 5240bc3e8d
commit 3b47236852
3 changed files with 117 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
themes/gokarna/layouts/_default/tags.html Normal file
View File

@@ -0,0 +1,53 @@
<!DOCTYPE html>
<html>
{{- partial "head.html" . -}}
<body>
{{- partial "header.html" . -}}
<main id="content">
<div class="container tags-list">
<h2 class="list-title">Tags</h2>
<ul class="post-tags">
<li class="post-tag">
<a href="example.com">
<div class="tag-name">
ABC</div>
<div class="tag-posts-count">
2</div>
</a>
</li>
<li class="post-tag">
<a href="example.com">
<div class="tag-name">
Backend</div>
<div class="tag-posts-count">
5</div>
</a>
</li>
<li class="post-tag">
<a href="example.com">
<div class="tag-name">
Devops</div>
<div class="tag-posts-count">
1</div>
</a>
</li>
<li class="post-tag">
<a href="example.com">
<div class="tag-name">
Frontend</div>
<div class="tag-posts-count">
3</div>
</a>
</li>
</ul>
</div>
</main>
{{- partial "footer.html" . -}}
</body>
</html>

62
themes/gokarna/layouts/partials/header.html
View File

@@ -1,37 +1,37 @@
<header class="header header-dark" id="header-sroll"> <header class="header header-dark" id="header-sroll">
<nav class="header-nav"> <nav class="header-nav">
<div class="avatar"> <div class="avatar">
<a href="{{ .Site.BaseURL }}"> <a href="{{ .Site.BaseURL }}">
<img src=".Site.Params.Avatar" alt="Avatar" /> <img src=".Site.Params.Avatar" alt="Avatar" />
</a>
</div>
<div class="nav-title">
<a class="nav-brand" href="https://example.com">Title title</a>
</div>
<div class="nav-links">
{{ range .Site.Menus.main }}
<div class="nav-link">
<a href="{{ .URL }}">
{{- .Pre | safeHTML }} {{ .Name }} {{ .Post | safeHTML -}}
</a> </a>
</div> </div>
{{ end }}
<div class="nav-title"> <!-- TODO: Handle
<a class="nav-brand" href="https://example.com">Title title</a> <div class="nav-link icon">
<a href="http://example.com">
<span class="fab fa-github"></span>
</a>
</div> </div>
<div class="nav-link icon">
<div class="nav-links"> <a href="http://example.com">
{{ range .Site.Menus.main }} <span class="fab fa-linkedin"></span>
<div class="nav-link"> </a>
<a href="{{ .URL }}">
{{- .Pre | safeHTML }} {{ .Name }} {{ .Post | safeHTML -}}
</a>
</div>
{{ end }}
<!-- TODO: Handle
<div class="nav-link icon">
<a href="http://example.com">
<span class="fab fa-github"></span>
</a>
</div>
<div class="nav-link icon">
<a href="http://example.com">
<span class="fab fa-linkedin"></span>
</a>
</div>
-->
</div> </div>
</nav> -->
</header> </div>
</nav>
</header>

37
themes/gokarna/static/css/main.css
View File

@@ -50,12 +50,12 @@ html {
.header-nav .avatar { .header-nav .avatar {
float: left; float: left;
/* display: inline-block; */
margin-left: 15px; margin-left: 15px;
height: 100%; height: 100%;
border: 0.5px solid white; border: 0.5px solid white;
border-radius: 18px; border-radius: 18px;
} }
.header-nav .avatar img { .header-nav .avatar img {
display: block; display: block;
width: 50px; width: 50px;
@@ -108,22 +108,27 @@ html {
color: gray; color: gray;
} }
.post .post-tags { .post-tags {
padding: 0; padding: 0;
list-style-type: none; list-style-type: none;
} }
.post-tags .post-tag { .post-tags .post-tag {
display: inline-block; display: inline-block;
background-color: #008c86; background-color: #00b5ad;
padding: 4px 12px; padding: 4px 12px;
border-radius: 4px; border-radius: 4px;
border: 1px solid #008c86; border: 1px solid #00b5ad;
color: white; color: white;
font-size: 14px; font-size: 14px;
font-weight: 700; font-weight: 700;
} }
.post-tag a {
text-decoration: none;
color: inherit;
}
.post .post-content { .post .post-content {
margin-top: 50px; margin-top: 50px;
} }
@@ -143,3 +148,27 @@ html {
.post-title .post-date { .post-title .post-date {
float: right; float: right;
} }
.tags-list .post-tags {
margin-top: 50px;
}
.tags-list .post-tags .post-tag {
padding: 0;
margin: 0 5px;
}
.tags-list .post-tags .post-tag:hover {
background-color: #009c95;
border: 1px solid #00b5ad;
}
.tags-list .post-tags .post-tag a div {
display: inline-block;
padding: 5px 8px;
}
.tags-list .post-tags .post-tag a .tag-posts-count {
background: rgba(0, 0, 0, 0.1);
opacity: 0.8;
}