forked from jakub/jakubb-hugo
Merge branch 'master' of git.jakubb.xyz:34mdh/hugo-theme
This commit is contained in:
Jakub
commit
61be30e518
@ -16,7 +16,7 @@
|
||||
{{- template "listDir" (dict "dir" (printf "%s/%s" $dir .Name)) -}}
|
||||
{{- else -}}
|
||||
{{- 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 -}}
|
||||
</li>
|
||||
|
||||
@ -1,54 +1,97 @@
|
||||
/* Mostly based off of gruvbox */
|
||||
|
||||
:root {
|
||||
--col-0: #FFFFFF;
|
||||
--col-1: #F0F2F9;
|
||||
--col-2: #3C5197;
|
||||
--col-3: #0C101D;
|
||||
--col-4: #18203A;
|
||||
--col-5: #5F75BF;
|
||||
--col-6: #1E2848;
|
||||
--col-7: #12182B;
|
||||
--col-8: #181F38;
|
||||
|
||||
|
||||
|
||||
/* Color Sheme linking */
|
||||
--body-bg: var(--col-3);
|
||||
--body-fg: var(--col-1);
|
||||
|
||||
--link-fg: var(--col-5);
|
||||
|
||||
--header-bg: var(--col-4);
|
||||
--header-bg-hov: var(--col-2);
|
||||
--header-fg: var(--body-fg);
|
||||
|
||||
--header-shadow: var(--body-bg);
|
||||
--header-shadow-hov: var(--header-shadow);
|
||||
|
||||
--hamburger-fg: var(--col-1);
|
||||
--hamburger-fg-checked: var(--hamburger-fg);
|
||||
--langs-bg: var(--header-bg);
|
||||
--lang-btn-bg: var(--header-bg) ;
|
||||
--langs-bg-hov: var(--header-bg-hov);
|
||||
|
||||
|
||||
--blockquote-border: var(--col-6);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
--table-bg: var(--col-7);
|
||||
--table-bg-alt: var(--col-8);
|
||||
--table-border: var(--body-bg);
|
||||
|
||||
|
||||
--maps-bg: var(--col-4);
|
||||
--maps-border: var(--col-2);
|
||||
|
||||
--button-bg: var(--col-2);
|
||||
--button-fg: var(--body-fg);
|
||||
|
||||
|
||||
|
||||
|
||||
--cal-bg: var(--col-4);
|
||||
--cal-fg: var(--body-fg);
|
||||
|
||||
--cal-month-bg: var(--col-8);
|
||||
--cal-month-fg: var(--link-fg);
|
||||
|
||||
--cal-weekdays-bg: var(--col-7);
|
||||
--cal-weekdays-fg: var(--cal-fg);
|
||||
|
||||
--cal-day-empty-fg: var(--col-7);
|
||||
--cal-day-empty-bg: var(--col-6);
|
||||
|
||||
--cal-day-busy-fg: var(--cal-fg);
|
||||
--cal-day-busy-bg: var(--col-7);
|
||||
|
||||
--cal-day-hover-fg: var(--col-2);
|
||||
--cal-day-hover-bg: var(--col-7);
|
||||
|
||||
--cal-event-fg: var(--cal-fg);
|
||||
--cal-event-bg: var(--col-2) ;
|
||||
|
||||
--cal-mobile-bg: var(--cal-day-busy-bg);
|
||||
--cal-mobile-fg: var(--cal-fg);
|
||||
--cal-mobile-border: var(--col-2);
|
||||
--cal-mobile-link: var(--link-fg);
|
||||
|
||||
/* Light Mode Colors */
|
||||
--bg: #f9f5d7;
|
||||
--fg: #3c3836;
|
||||
--alt-bg: #d5c4a1;
|
||||
--acc-1: #076678;
|
||||
--shadow: #504945;
|
||||
|
||||
--table: #fbf1c7;
|
||||
--table-alt: #d5c4a1;
|
||||
|
||||
--lang-btn-bg: black;
|
||||
--langs-bg: black;
|
||||
--langs-bg-hov: gray;
|
||||
|
||||
--cal-bg: darkslategray;
|
||||
--cal-fg: white;
|
||||
|
||||
--cal-month-bg: black;
|
||||
--cal-month-fg: cyan;
|
||||
|
||||
--cal-weekdays-bg: gray ;
|
||||
--cal-weekdays-fg: black;
|
||||
|
||||
--cal-day-empty-fg: #888;
|
||||
--cal-day-empty-bg: #555;
|
||||
|
||||
--cal-day-busy-fg: #555;
|
||||
--cal-day-busy-bg: #888;
|
||||
|
||||
--cal-day-hover-fg: #555;
|
||||
--cal-day-hover-bg: black;
|
||||
|
||||
--cal-event-fg: white;
|
||||
--cal-event-bg: var(--acc-1) ;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--bg: #1d2021;
|
||||
--fg: #ebdbb2;
|
||||
--alt-bg: #504945;
|
||||
--acc-1: #83a598;
|
||||
--shadow: #1d2021;
|
||||
/* Dark Mode Colors */
|
||||
|
||||
--table: #282828;
|
||||
--table-alt: #504945;
|
||||
|
||||
--lang-btn-bg: black;
|
||||
--langs-bg: black;
|
||||
--langs-bg-hov: gray;
|
||||
/* Dark Mode Colorsheme Link Overides */
|
||||
}
|
||||
}
|
||||
|
||||
@ -11,8 +11,8 @@ html, body {
|
||||
body{
|
||||
/* font-size: 100%; */
|
||||
line-height: 1.5;
|
||||
background-color: var(--bg);
|
||||
color: var(--fg);
|
||||
background-color: var(--body-bg);
|
||||
color: var(--body-fg);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
@ -20,7 +20,7 @@ body{
|
||||
|
||||
a{
|
||||
text-decoration: none;
|
||||
color: var(--acc-1);
|
||||
color: var(--link-fg);
|
||||
}
|
||||
|
||||
|
||||
@ -47,11 +47,11 @@ footer.fixed {
|
||||
/* Header and Navigation Menu */
|
||||
.header {
|
||||
width: 100%;
|
||||
background-color: var(--alt-bg);
|
||||
box-shadow: inset 0 -20px 20px -20px var(--shadow);
|
||||
background-color: var(--header-bg);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
z-index: 100;
|
||||
box-shadow: inset 0 -20px 20px -20px var(--header-shadow);
|
||||
}
|
||||
|
||||
.menu-entries a{
|
||||
@ -59,9 +59,9 @@ footer.fixed {
|
||||
}
|
||||
|
||||
.menu-entries a:hover{
|
||||
background-color: var(--acc-1);
|
||||
color: var(--alt-bg);
|
||||
box-shadow: inset 0 -20px 20px -20px var(--shadow);
|
||||
background-color: var(--header-bg-hov);
|
||||
color: var(--header-fg-hov);
|
||||
box-shadow: inset 0 -20px 20px -20px var(--header-shadow-hov);
|
||||
|
||||
}
|
||||
|
||||
@ -71,6 +71,7 @@ footer.fixed {
|
||||
}
|
||||
|
||||
.menu a {
|
||||
color: var(--header-fg);
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@ -103,6 +104,8 @@ a.home-link { display: none; }
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.menu-entries a:hover { box-shadow: none; }
|
||||
|
||||
.menu-entries {
|
||||
text-align: center;
|
||||
float: none;
|
||||
@ -127,8 +130,8 @@ a.home-link { display: none; }
|
||||
|
||||
.menu-btn:checked ~ .menu .logo, .menu-entries a:hover {
|
||||
/* BG Color on logo an hover effect */
|
||||
background-color: var(--acc-1);
|
||||
color: var(--alt-bg);
|
||||
background-color: var(--header-bg-hov);
|
||||
color: var(--header-fg-hov);
|
||||
}
|
||||
|
||||
.menu li, .menu-entries a{ display: block; }
|
||||
@ -152,13 +155,13 @@ a.home-link { display: none; }
|
||||
.bar1, .bar2, .bar3 {
|
||||
width: 35px;
|
||||
height: 5px;
|
||||
background-color: var(--acc-1);
|
||||
background-color: var(--hamburger-fg);
|
||||
margin: 6px 0;
|
||||
transition: 0.4s;
|
||||
}
|
||||
|
||||
.change .bar1 {
|
||||
background-color: var(--alt-bg);
|
||||
background-color: var(--hamburger-fg-checked);
|
||||
transform: translate(0, 11px) rotate(45deg);
|
||||
}
|
||||
|
||||
@ -166,7 +169,7 @@ a.home-link { display: none; }
|
||||
|
||||
.change .bar3 {
|
||||
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 */
|
||||
@ -174,7 +177,7 @@ a.home-link { display: none; }
|
||||
.header {
|
||||
width: 15%;
|
||||
height: 100%;
|
||||
box-shadow: inset -22px 0 20px -20px var(--shadow);
|
||||
box-shadow: inset -22px 0 20px -20px var(--header-shadow);
|
||||
}
|
||||
|
||||
.menu-entries{
|
||||
@ -193,8 +196,12 @@ a.home-link { display: none; }
|
||||
|
||||
}
|
||||
|
||||
.menu-entries a {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.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 {
|
||||
@ -211,23 +218,23 @@ a.home-link { display: none; }
|
||||
table { width: 100%; }
|
||||
|
||||
th, td, table {
|
||||
border: 1px solid var(--bg);
|
||||
border: 2px solid var(--table-border);
|
||||
border-collapse: collapse;
|
||||
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 */
|
||||
|
||||
blockquote {
|
||||
border-left-color: var(--alt-bg);
|
||||
border-left-color: var(--blockquote-border);
|
||||
border-left-width: 5px;
|
||||
border-left-style: solid;
|
||||
margin: 20px 0;
|
||||
@ -238,8 +245,8 @@ blockquote blockquote { margin-left: 20px }
|
||||
|
||||
/* Maps Shortcode */
|
||||
blockquote.location {
|
||||
background-color: var(--alt-bg);
|
||||
border-left-color: var(--acc-1);
|
||||
background-color: var(--maps-bg);
|
||||
border-left-color: var(--maps-border);
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
@ -264,10 +271,10 @@ blockquote.location p { padding: inherit; }
|
||||
}
|
||||
|
||||
.button {
|
||||
color: var(--fg);
|
||||
background-color: var(--acc-1);
|
||||
color: var(--button-fg);
|
||||
background-color: var(--button-bg);
|
||||
padding: 5px;
|
||||
border: solid 3px var(--acc-1);
|
||||
border: solid 3px var(--button-bg);
|
||||
border-radius: 8px;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
@ -362,12 +369,17 @@ blockquote.location p { padding: inherit; }
|
||||
width: 100%;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
box-shadow: inset 0 -20px 20px -20px var(--header-shadow);
|
||||
}
|
||||
|
||||
.lang-switch a:hover {
|
||||
background-color: gray;
|
||||
background-color: var(--langs-bg-hov);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.lang-btn:checked ~ .lang-switch a { box-shadow: none; }
|
||||
.lang-btn:checked ~ .lang-switch a { box-shadow: none; }
|
||||
|
||||
|
||||
/* lang-switch content (hidden by default) */
|
||||
.translation-list {
|
||||
@ -399,6 +411,10 @@ blockquote.location p { padding: inherit; }
|
||||
max-height: 100px;
|
||||
}
|
||||
|
||||
.lang-btn:checked ~ .lang-switch {
|
||||
background-color: var(--langs-bg-hov);
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1040px) {
|
||||
.lang-switch {
|
||||
width: 100%;
|
||||
@ -408,6 +424,8 @@ blockquote.location p { padding: inherit; }
|
||||
.lang-switch a {
|
||||
padding: 20px;
|
||||
width: auto;
|
||||
box-shadow: inset -22px 0 20px -20px var(--header-shadow);
|
||||
|
||||
}
|
||||
|
||||
.translation-list {
|
||||
@ -426,8 +444,11 @@ blockquote.location p { padding: inherit; }
|
||||
.lang-switch a {
|
||||
padding: 20px;
|
||||
width: auto;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.lang-switch a:hover { box-shadow: none; }
|
||||
|
||||
.translation-list {
|
||||
position: static;
|
||||
width: auto;
|
||||
@ -556,17 +577,17 @@ blockquote.location p { padding: inherit; }
|
||||
border-left-width: 5px;
|
||||
border-left-style: solid;
|
||||
margin-top: 10px;
|
||||
background-color: var(--alt-bg);
|
||||
border-left-color: var(--acc-1);
|
||||
background-color: var(--cal-mobile-bg);
|
||||
border-left-color: var(--cal-mobile-border);
|
||||
padding: 20px;
|
||||
color: var(--alt-fg);
|
||||
color: var(--cal-mobile-fg);
|
||||
|
||||
}
|
||||
|
||||
.day:has(>.event):hover {
|
||||
background-color: var(--alt-bg);
|
||||
transform: none;
|
||||
color: var(--alt-fg);
|
||||
background-color: var(--cal-mobile-bg);
|
||||
color: var(--cal-mobile-fg);
|
||||
|
||||
}
|
||||
|
||||
@ -594,7 +615,7 @@ blockquote.location p { padding: inherit; }
|
||||
|
||||
}
|
||||
.event a {
|
||||
color: var(--acc-1);
|
||||
color: var(--cal-mobile-link);
|
||||
font-size: 2vh;
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user