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

Rename css variables, remove ugly footer and italicize description

Browse Source
This commit is contained in:
Yash Mehrotra
2021-08-05 17:09:25 +05:30
parent ab152b7b9b
commit cdfbce4f3a
4 changed files with 31 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
themes/gokarna/layouts/_default/baseof.html
View File

@@ -3,6 +3,7 @@
{{- partial "head.html" . -}} {{- partial "head.html" . -}}
<body> <body>
<script type="text/javascript"> <script type="text/javascript">
// Immediately set theme on page load
setThemeByUserPref(); setThemeByUserPref();
</script> </script>
{{- partial "header.html" . -}} {{- partial "header.html" . -}}

2
themes/gokarna/layouts/partials/post.html
View File

@@ -2,7 +2,7 @@
<div class="post-header-section"> <div class="post-header-section">
<h1>{{ .Title }}</h1> <h1>{{ .Title }}</h1>
<small role="doc-subtitle">This is a subheading</small> <small role="doc-subtitle">{{ .Description }}</small>
<p class="post-date"> <p class="post-date">
{{ dateFormat "January 2, 2006" .Date }} {{ dateFormat "January 2, 2006" .Date }}
</p> </p>

26
themes/gokarna/static/css/dark.css
View File

@@ -1,25 +1,25 @@
:root { :root {
--dark-bg-color: 18, 18, 18; --dark-primary-color: 18, 18, 18;
--dark-text-color: white; --dark-text-color: white;
--dark-tags-bg-color: #444444; --dark-secondary-color: #444444;
--dark-header-divider-color: #484848; --dark-secondary-color: #444444;
} }
html { html {
background-color: rgb(var(--dark-bg-color)); background-color: rgb(var(--dark-primary-color));
color: var(--dark-text-color); color: var(--dark-text-color);
} }
.header { .header {
background-color: rgba(var(--dark-bg-color), 0.95); background-color: rgba(var(--dark-primary-color), 0.95);
} }
.nav-hamburger-list { .nav-hamburger-list {
background: rgba(var(--dark-bg-color), 1); background: rgba(var(--dark-primary-color), 1);
} }
.nav-links .nav-icons-divider { .nav-links .nav-icons-divider {
color: var(--dark-header-divider-color); color: var(--dark-secondary-color);
} }
a:hover .feather-moon { a:hover .feather-moon {
@@ -29,16 +29,16 @@ a:hover .feather-moon {
.post-tags .post-tag:hover { .post-tags .post-tag:hover {
background-color: var(--dark-text-color); background-color: var(--dark-text-color);
color: rgb(var(--dark-bg-color)); color: rgb(var(--dark-primary-color));
} }
.tags-list .post-tags .post-tag a .tag-posts-count { .tags-list .post-tags .post-tag a .tag-posts-count {
background-color: var(--dark-tags-bg-color); background-color: var(--dark-secondary-color);
} }
.tags-list .post-tags .post-tag:hover a .tag-posts-count { .tags-list .post-tags .post-tag:hover a .tag-posts-count {
background-color: var(--dark-text-color); background-color: var(--dark-text-color);
color: rgb(var(--dark-bg-color)); color: rgb(var(--dark-primary-color));
} }
.footer { .footer {
@@ -46,16 +46,16 @@ a:hover .feather-moon {
} }
blockquote { blockquote {
border-left-color: var(--dark-header-divider-color); border-left-color: var(--dark-secondary-color);
} }
table thead { table thead {
background-color: var(--dark-header-bg-color); background-color: var(--dark-secondary-color);
} }
table td, table td,
table th { table th {
border-bottom-color: var(--dark-header-divider-color); border-bottom-color: var(--dark-secondary-color);
} }
:not(pre) > code { :not(pre) > code {

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

@@ -1,14 +1,13 @@
:root { :root {
--content-width: 810px; --content-width: 810px;
--light-bg-color: 255, 255, 255; --light-primary-color: 255, 255, 255;
--light-secondary-color: #dddddd;
--light-text-color: black; --light-text-color: black;
--light-tags-bg-color: #dddddd;
--light-header-divider-color: #dfdfdf;
} }
html { html {
background-color: rgb(var(--light-bg-color)); background-color: rgb(var(--light-primary-color));
color: var(--light-text-color); color: var(--light-text-color);
font-family: "Jost", sans-serif; font-family: "Jost", sans-serif;
font-weight: 400; font-weight: 400;
@@ -42,7 +41,7 @@ img {
/* HEADER */ /* HEADER */
.header { .header {
background-color: rgba(var(--light-bg-color), 0.95); background-color: rgba(var(--light-primary-color), 0.95);
color: inherit; color: inherit;
font-size: 1.2rem; font-size: 1.2rem;
height: 50px; height: 50px;
@@ -104,7 +103,7 @@ img {
.nav-links .nav-icons-divider { .nav-links .nav-icons-divider {
border-color: inherit; border-color: inherit;
border-left: 1.5px solid; border-left: 1.5px solid;
color: var(--light-header-divider-color); color: var(--light-secondary-color);
margin: 0 10px; margin: 0 10px;
} }
.nav-links .dark-theme-toggle:hover { .nav-links .dark-theme-toggle:hover {
@@ -132,9 +131,9 @@ a:hover .feather-sun {
width: 24px; width: 24px;
} }
.nav-hamburger-list { .nav-hamburger-list {
background: rgb(var(--light-bg-color)); background: rgb(var(--light-primary-color));
border-bottom: solid 1.5px var(--light-header-divider-color); border-bottom: solid 1.5px var(--light-secondary-color);
border-top: solid 1.5px var(--light-header-divider-color); border-top: solid 1.5px var(--light-secondary-color);
list-style-type: none; list-style-type: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
@@ -151,7 +150,6 @@ a:hover .feather-sun {
/* FOOTER */ /* FOOTER */
.footer { .footer {
bottom: 0; bottom: 0;
border-top: 0.5px solid var(--light-header-divider-color);
color: inherit; color: inherit;
left: 0; left: 0;
overflow: hidden; overflow: hidden;
@@ -205,7 +203,7 @@ a:hover .feather-sun {
} }
.post-tags .post-tag:hover { .post-tags .post-tag:hover {
background-color: var(--light-text-color); background-color: var(--light-text-color);
color: rgb(var(--light-bg-color)); color: rgb(var(--light-primary-color));
} }
.post-tag a { .post-tag a {
color: inherit; color: inherit;
@@ -246,7 +244,7 @@ pre code {
} }
blockquote { blockquote {
border-left: 2px solid var(--light-header-divider-color); border-left: 2px solid var(--light-secondary-color);
color: grey; color: grey;
padding-left: 1rem; padding-left: 1rem;
} }
@@ -261,7 +259,7 @@ table {
} }
table thead { table thead {
background-color: var(--light-bg-color); background-color: var(--light-secondary-color);
} }
table td, table td,
@@ -270,7 +268,7 @@ table th {
} }
table td { table td {
border-bottom: 1px solid var(--light-header-divider-color); border-bottom: 1px solid var(--light-secondary-color);
} }
/* HOME PAGE */ /* HOME PAGE */
@@ -318,7 +316,8 @@ main#content .post {
font-size: 1.2rem; font-size: 1.2rem;
} }
.post [role="doc-subtitle"] { .post [role="doc-subtitle"] {
font-size: 1.3rem; font-size: 1.2rem;
font-style: italic;
} }
.post .post-date { .post .post-date {
color: gray; color: gray;
@@ -367,7 +366,7 @@ main#content .post {
padding: 5px 8px; padding: 5px 8px;
} }
.tags-list .post-tags .post-tag a .tag-posts-count { .tags-list .post-tags .post-tag a .tag-posts-count {
background-color: var(--light-tags-bg-color); background-color: var(--light-secondary-color);
border-radius: inherit; border-radius: inherit;
color: inherit; color: inherit;
opacity: 0.8; opacity: 0.8;
@@ -377,7 +376,7 @@ main#content .post {
} }
.tags-list .post-tags .post-tag:hover a .tag-posts-count { .tags-list .post-tags .post-tag:hover a .tag-posts-count {
background-color: var(--light-text-color); background-color: var(--light-text-color);
color: rgb(var(--light-bg-color)); color: rgb(var(--light-primary-color));
} }
@media only screen and (max-width: 820px) { @media only screen and (max-width: 820px) {