34mdh/hugo-theme
2
0
Fork 0
forked from jakub/jakubb-hugo
Code Pull Requests Activity

Merge branch 'master' of git.jakubb.xyz:34mdh/hugo-theme

Browse Source
This commit is contained in:
Jakub 2024-03-06 22:45:04 -05:00
commit d03176171c
3 changed files with 85 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
layouts/_default/documents.html
View File

@ -16,7 +16,7 @@
{{- template "listDir" (dict "dir" (printf "%s/%s" $dir .Name)) -}} {{- template "listDir" (dict "dir" (printf "%s/%s" $dir .Name)) -}}
{{- else -}} {{- else -}}
{{- with resources.Get (printf "%s/%s" $dir .Name) -}} {{- with resources.Get (printf "%s/%s" $dir .Name) -}}
<a href="{{ .RelPermalink }}">{{ title (replaceRE `[_-]` " " (path.BaseName .Name)) }}</a> <a href="{{ .RelPermalink }}" target="_blank" >{{ title (replaceRE `[_-]` " " (path.BaseName .Name)) }}</a>
{{- end -}} {{- end -}}
{{- end -}} {{- end -}}
</li> </li>

64
static/css/colorschemes/colors.css
View File

@ -1,18 +1,51 @@
/* Mostly based off of gruvbox */ /* Mostly based off of gruvbox */
:root { :root {
--bg: #f9f5d7; --col-1: #DEE4F7;
--fg: #3c3836;
--alt-bg: #d5c4a1;
--acc-1: #076678;
--shadow: #504945; /* Color Sheme linking */
--body-bg: var(--col-1);
--body-fg: var(--light-0);
--link-fg: var();
--header-bg: var(--col-2);
--header-shadow: var(--body-bg);
--header-shadow-hov: var();
--hamburger-fg: var(--light-0);
--hamburger-fg-checked: var(--col-acc);
--table-bg: var(--col-2);
--table-bg-alt: var(--col-3);
--table-border: var();
--blockquote-border: var(--col-0);
--maps-bg: #2C3963;
--maps-border: var(--acc);
--button-bg: var(--acc);
--button-fg: var();
--langs-bg: var(--header-bg);
--lang-btn-bg: var(--header-bg) ;
--langs-bg-hov: var(--header-bg-hov);
--table: #fbf1c7;
--table-alt: #d5c4a1;
--lang-btn-bg: black;
--langs-bg: black;
--langs-bg-hov: gray;
--cal-bg: darkslategray; --cal-bg: darkslategray;
--cal-fg: white; --cal-fg: white;
@ -34,16 +67,27 @@
--cal-event-fg: white; --cal-event-fg: white;
--cal-event-bg: var(--acc-1) ; --cal-event-bg: var(--acc-1) ;
/* Light Mode Colors */
--bg: #f9f5d7;
--fg: #3c3836;
--alt-bg: #d5c4a1;
--acc-1: #076678;
--shadow: #504945;
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
:root { :root {
/* Dark Mode Colors */
--bg: #1d2021; --bg: #1d2021;
--fg: #ebdbb2; --fg: #ebdbb2;
--alt-bg: #504945; --alt-bg: #504945;
--acc-1: #83a598; --acc-1: #83a598;
--shadow: #1d2021; --shadow: #1d2021;
/* Dark Mode Colorsheme Link Overides */
--table: #282828; --table: #282828;
--table-alt: #504945; --table-alt: #504945;

56
static/css/style.css
View File

@ -11,8 +11,8 @@ html, body {
body{ body{
/* font-size: 100%; */ /* font-size: 100%; */
line-height: 1.5; line-height: 1.5;
background-color: var(--bg); background-color: var(--body-bg);
color: var(--fg); color: var(--body-fg);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
min-height: 100vh; min-height: 100vh;
@ -20,7 +20,7 @@ body{
a{ a{
text-decoration: none; text-decoration: none;
color: var(--acc-1); color: var(--link-fg);
} }
@ -47,8 +47,8 @@ footer.fixed {
/* Header and Navigation Menu */ /* Header and Navigation Menu */
.header { .header {
width: 100%; width: 100%;
background-color: var(--alt-bg); background-color: var(--header-bg);
box-shadow: inset 0 -20px 20px -20px var(--shadow); box-shadow: inset 0 -20px 20px -20px var(--header-shadow);
position: fixed; position: fixed;
top: 0; top: 0;
z-index: 100; z-index: 100;
@ -59,9 +59,9 @@ footer.fixed {
} }
.menu-entries a:hover{ .menu-entries a:hover{
background-color: var(--acc-1); background-color: var(--header-bg-hov);
color: var(--alt-bg); color: var(--header-fg-hov);
box-shadow: inset 0 -20px 20px -20px var(--shadow); box-shadow: inset 0 -20px 20px -20px var(--header-shadow-hov);
} }
@ -127,8 +127,8 @@ a.home-link { display: none; }
.menu-btn:checked ~ .menu .logo, .menu-entries a:hover { .menu-btn:checked ~ .menu .logo, .menu-entries a:hover {
/* BG Color on logo an hover effect */ /* BG Color on logo an hover effect */
background-color: var(--acc-1); background-color: var(--header-bg-hov);
color: var(--alt-bg); color: var(--header-fg-hov);
} }
.menu li, .menu-entries a{ display: block; } .menu li, .menu-entries a{ display: block; }
@ -152,13 +152,13 @@ a.home-link { display: none; }
.bar1, .bar2, .bar3 { .bar1, .bar2, .bar3 {
width: 35px; width: 35px;
height: 5px; height: 5px;
background-color: var(--acc-1); background-color: var(--hamburger-fg);
margin: 6px 0; margin: 6px 0;
transition: 0.4s; transition: 0.4s;
} }
.change .bar1 { .change .bar1 {
background-color: var(--alt-bg); background-color: var(--hamburger-fg-checked);
transform: translate(0, 11px) rotate(45deg); transform: translate(0, 11px) rotate(45deg);
} }
@ -166,7 +166,7 @@ a.home-link { display: none; }
.change .bar3 { .change .bar3 {
transform: translate(0, -11px) rotate(-45deg); transform: translate(0, -11px) rotate(-45deg);
background-color: var(--alt-bg); background-color: var(--hamburger-fg-checked);
} }
} }
/* Wide window - links on the left in a sidebar */ /* Wide window - links on the left in a sidebar */
@ -174,7 +174,7 @@ a.home-link { display: none; }
.header { .header {
width: 15%; width: 15%;
height: 100%; height: 100%;
box-shadow: inset -22px 0 20px -20px var(--shadow); box-shadow: inset -22px 0 20px -20px var(--header-shadow);
} }
.menu-entries{ .menu-entries{
@ -194,7 +194,7 @@ a.home-link { display: none; }
} }
.menu-entries a:hover{ .menu-entries a:hover{
box-shadow: inset -22px 0 20px -20px var(--shadow); box-shadow: inset -22px 0 20px -20px var(--header-shadow-hov);
} }
footer { footer {
@ -211,23 +211,23 @@ a.home-link { display: none; }
table { width: 100%; } table { width: 100%; }
th, td, table { th, td, table {
border: 1px solid var(--bg); border: 1px solid var(--table-border);
border-collapse: collapse; border-collapse: collapse;
padding: 6px 13px; padding: 6px 13px;
} }
table thead tr { background-color: var(--table); } table thead tr { background-color: var(--table-bg); }
table tr { background-color: var(--table-alt); } table tr { background-color: var(--table-bg-alt); }
table tr:nth-child(2n) { background-color: var(--table); } table tr:nth-child(2n) { background-color: var(--table-bg); }
/* Markdown Blockquote styles */ /* Markdown Blockquote styles */
blockquote { blockquote {
border-left-color: var(--alt-bg); border-left-color: var(--blockquote-border);
border-left-width: 5px; border-left-width: 5px;
border-left-style: solid; border-left-style: solid;
margin: 20px 0; margin: 20px 0;
@ -238,8 +238,8 @@ blockquote blockquote { margin-left: 20px }
/* Maps Shortcode */ /* Maps Shortcode */
blockquote.location { blockquote.location {
background-color: var(--alt-bg); background-color: var(--maps-bg);
border-left-color: var(--acc-1); border-left-color: var(--maps-border);
padding: 20px; padding: 20px;
} }
@ -264,10 +264,10 @@ blockquote.location p { padding: inherit; }
} }
.button { .button {
color: var(--fg); color: var(--button-fg);
background-color: var(--acc-1); background-color: var(--button-bg);
padding: 5px; padding: 5px;
border: solid 3px var(--acc-1); border: solid 3px var(--button-bg);
border-radius: 8px; border-radius: 8px;
margin-top: 10px; margin-top: 10px;
margin-bottom: 10px; margin-bottom: 10px;
@ -365,7 +365,7 @@ blockquote.location p { padding: inherit; }
} }
.lang-switch a:hover { .lang-switch a:hover {
background-color: gray; background-color: var(--langs-bg-hov);
} }
@ -399,6 +399,10 @@ blockquote.location p { padding: inherit; }
max-height: 100px; max-height: 100px;
} }
.lang-btn:checked ~ .lang-switch {
background-color: var(--langs-bg-hov);
}
@media screen and (min-width: 1040px) { @media screen and (min-width: 1040px) {
.lang-switch { .lang-switch {
width: 100%; width: 100%;