Theme fest ins Repo uebernehmen statt als Submodule
Ein normaler git clone holt Submodules nicht mit - geprueft: nach dem Klonen des Repos war themes/gokarna leer. Portainer klont ebenso, der Build im Container waere also an dem fehlenden Theme gescheitert. Gokarna liegt jetzt direkt im Repo, festgeschrieben auf Commit 8306042, den Stand, mit dem die Seite bisher gebaut wurde. .gitmodules entfaellt. Nachteil: Theme-Updates muessen kuenftig von Hand eingespielt werden. Dafuer baut das Repo aus jedem beliebigen Klon heraus, ohne Sonderbehandlung. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
101
themes/gokarna/assets/css/dark.css
Normal file
101
themes/gokarna/assets/css/dark.css
Normal file
@@ -0,0 +1,101 @@
|
||||
:root {
|
||||
--dark-primary-color: 34, 39, 46;
|
||||
--dark-secondary-color: #2d333b;
|
||||
--dark-tertiary-color: #646464;
|
||||
--dark-text-color: white;
|
||||
}
|
||||
|
||||
html {
|
||||
background-color: rgb(var(--dark-primary-color));
|
||||
color: var(--dark-text-color);
|
||||
fill: var(--dark-text-color);
|
||||
}
|
||||
|
||||
.header {
|
||||
background-color: rgba(var(--dark-primary-color), 0.95);
|
||||
}
|
||||
|
||||
.nav-hamburger-list {
|
||||
background: rgba(var(--dark-primary-color), 1);
|
||||
}
|
||||
|
||||
.nav-links .nav-icons-divider {
|
||||
color: var(--dark-secondary-color);
|
||||
}
|
||||
|
||||
a:hover .feather-moon {
|
||||
fill: white;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.gk-social-icons-list .gk-social-icon,
|
||||
.gk-social-icons-list .gk-social-icon a:visited {
|
||||
fill: var(--dark-text-color);
|
||||
}
|
||||
|
||||
.gk-social-icons-list .gk-social-icon a:hover {
|
||||
fill: var(--accent-color);
|
||||
}
|
||||
|
||||
.post-tags .post-tag:hover {
|
||||
background-color: var(--dark-text-color);
|
||||
color: rgb(var(--dark-primary-color));
|
||||
}
|
||||
|
||||
.tags-list .post-tags .post-tag a .tag-posts-count {
|
||||
background-color: var(--dark-secondary-color);
|
||||
}
|
||||
|
||||
.tags-list .post-tags .post-tag:hover a .tag-posts-count {
|
||||
background-color: var(--dark-text-color);
|
||||
color: rgb(var(--dark-primary-color));
|
||||
}
|
||||
|
||||
.footer {
|
||||
border-top-color: var(--dark-header-bg-color);
|
||||
}
|
||||
|
||||
blockquote {
|
||||
color: darkgrey;
|
||||
border-left-color: var(--dark-secondary-color);
|
||||
}
|
||||
|
||||
hr {
|
||||
color: var(--dark-tertiary-color);
|
||||
}
|
||||
|
||||
table thead {
|
||||
background-color: var(--dark-secondary-color);
|
||||
}
|
||||
|
||||
table td,
|
||||
table th {
|
||||
border-bottom-color: var(--dark-secondary-color);
|
||||
}
|
||||
|
||||
code,
|
||||
pre {
|
||||
background-color: var(--dark-secondary-color) !important;
|
||||
}
|
||||
|
||||
:not(pre) > code {
|
||||
background-color: var(--dark-tertiary-color) !important;
|
||||
color: var(--dark-text-color);
|
||||
}
|
||||
|
||||
.header-shadow {
|
||||
box-shadow: rgb(33, 38, 45) 0px -1px 0px 0px inset;
|
||||
}
|
||||
|
||||
.arrow-logo {
|
||||
background-color: var(--dark-secondary-color);
|
||||
}
|
||||
|
||||
/* TODO: Check if this is needed or not */
|
||||
/*
|
||||
img,
|
||||
video {
|
||||
filter: hue-rotate(180deg) contrast(100%) invert(100%);
|
||||
-webkit-filter: hue-rotate(180deg) contrast(100%) invert(100%);
|
||||
}
|
||||
*/
|
||||
701
themes/gokarna/assets/css/main.css
Normal file
701
themes/gokarna/assets/css/main.css
Normal file
@@ -0,0 +1,701 @@
|
||||
:root {
|
||||
--content-width: 1120px;
|
||||
--container-width: 810px;
|
||||
|
||||
--light-primary-color: 255, 255, 255;
|
||||
--light-secondary-color: #dddddd;
|
||||
--light-tertiary-color: #272822;
|
||||
--light-text-color: black;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
font-weight: 400;
|
||||
src: url("/fonts/Lato-Regular.ttf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
font-weight: 700;
|
||||
src: url("/fonts/Lato-Bold.ttf");
|
||||
}
|
||||
|
||||
html {
|
||||
background-color: rgb(var(--light-primary-color));
|
||||
color: var(--light-text-color);
|
||||
font-family: "Lato", sans-serif;
|
||||
font-size: var(--font-size);
|
||||
min-height: 100%;
|
||||
position: relative;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
body {
|
||||
margin-bottom: 170px;
|
||||
}
|
||||
|
||||
body.blog-post.has-post-navigation {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
/* This is set in partials/head.html and is populated via config */
|
||||
a:hover {
|
||||
color: var(--accent-color);
|
||||
fill: var(--accent-color);
|
||||
}
|
||||
|
||||
main#content {
|
||||
margin: 90px auto 0;
|
||||
width: var(--content-width);
|
||||
}
|
||||
|
||||
main#content > .container {
|
||||
margin: auto;
|
||||
width: 75%;
|
||||
max-width: var(--container-width);
|
||||
}
|
||||
|
||||
.post.container {
|
||||
box-sizing: border-box;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.post-toc {
|
||||
box-sizing: border-box;
|
||||
display: inline-block;
|
||||
padding-left: 50px;
|
||||
vertical-align: top;
|
||||
/* Would be 25% had there been no margins or border box on all inline blocks */
|
||||
width: 24%;
|
||||
}
|
||||
|
||||
#toc {
|
||||
position: fixed;
|
||||
top: 80px;
|
||||
bottom: 20px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
#toc ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#toc ul li {
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
#toc ul li a.level-1 {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
#toc ul li a.level-2 {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
#toc ul li a.level-3 {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
#toc ul li a.level-4 {
|
||||
padding-left: 30px;
|
||||
}
|
||||
|
||||
#toc ul li a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#toc ul li a.active {
|
||||
color: var(--accent-color);
|
||||
}
|
||||
|
||||
img {
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
/* HEADER */
|
||||
.header {
|
||||
background-color: rgba(var(--light-primary-color), 0.95);
|
||||
color: inherit;
|
||||
height: 50px;
|
||||
left: 0;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
transition: box-shadow 0.3s ease-in-out;
|
||||
width: 100%;
|
||||
z-index: 5;
|
||||
}
|
||||
|
||||
.header a {
|
||||
text-decoration: none;
|
||||
}
|
||||
.header .header-nav {
|
||||
height: 50px;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.header-nav .avatar {
|
||||
border-radius: 18px;
|
||||
float: left;
|
||||
height: 100%;
|
||||
margin-left: 15px;
|
||||
}
|
||||
.header-nav .avatar img {
|
||||
border-radius: 100%;
|
||||
display: block;
|
||||
height: 38px;
|
||||
margin-top: 5px;
|
||||
overflow: hidden;
|
||||
width: 38px;
|
||||
}
|
||||
.header-nav .nav-title {
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
line-height: 50px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.nav-title a {
|
||||
height: 50px;
|
||||
}
|
||||
.header-nav .nav-links {
|
||||
float: right;
|
||||
line-height: 50px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.nav-links .nav-link {
|
||||
display: inline-block;
|
||||
padding: 0 2px;
|
||||
}
|
||||
.nav-links .nav-link a {
|
||||
display: block;
|
||||
padding: 0 6px;
|
||||
}
|
||||
.nav-link a svg {
|
||||
height: 20px;
|
||||
margin: -3px auto;
|
||||
stroke-width: 2;
|
||||
width: 20px;
|
||||
}
|
||||
.nav-item a svg {
|
||||
height: 20px;
|
||||
margin: -3px auto;
|
||||
stroke-width: 2;
|
||||
width: 20px;
|
||||
}
|
||||
.nav-links .nav-link.icon a {
|
||||
padding: 0 8px;
|
||||
}
|
||||
.nav-links .nav-icons-divider {
|
||||
border-color: inherit;
|
||||
border-left: 1.5px solid;
|
||||
color: var(--light-secondary-color);
|
||||
margin: 0 10px;
|
||||
}
|
||||
.nav-links .dark-theme-toggle:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
a:hover .feather-sun {
|
||||
fill: black;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.dark-theme-toggle .feather {
|
||||
height: 22px;
|
||||
stroke-linecap: round;
|
||||
stroke-linejoin: round;
|
||||
width: 22px;
|
||||
}
|
||||
#hamburger-menu-toggle {
|
||||
display: none;
|
||||
}
|
||||
#hamburger-menu-toggle .feather {
|
||||
height: 24px;
|
||||
stroke-linecap: round;
|
||||
stroke-linejoin: round;
|
||||
width: 24px;
|
||||
}
|
||||
.nav-hamburger-list {
|
||||
background: rgb(var(--light-primary-color));
|
||||
border-bottom: solid 1.5px var(--light-secondary-color);
|
||||
border-top: solid 1.5px var(--light-secondary-color);
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
z-index: 5;
|
||||
}
|
||||
.nav-hamburger-list a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* FOOTER */
|
||||
.footer {
|
||||
bottom: 0;
|
||||
color: inherit;
|
||||
left: 0;
|
||||
margin-left: 30%;
|
||||
overflow: hidden;
|
||||
padding: 40px 0;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.footer span {
|
||||
display: block;
|
||||
font-size: 0.85em;
|
||||
font-weight: 300;
|
||||
padding: 1px 0;
|
||||
}
|
||||
|
||||
/** COMMON **/
|
||||
.flex-break {
|
||||
flex-basis: 100%;
|
||||
height: 0;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.visibility-hidden {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.header-shadow {
|
||||
box-shadow: rgb(220, 220, 220) 0px 1px 5px;
|
||||
}
|
||||
|
||||
/* TAGS */
|
||||
.post-tags {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
.post-tags .post-tag {
|
||||
border: 1.5px solid;
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
color: inherit;
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
}
|
||||
.post-tags .post-tag:hover {
|
||||
background-color: var(--light-text-color);
|
||||
color: rgb(var(--light-primary-color));
|
||||
}
|
||||
.post-tag a {
|
||||
color: inherit;
|
||||
display: block;
|
||||
padding: 6px 12px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* CODE BLOCKS */
|
||||
code,
|
||||
pre {
|
||||
background-color: var(--light-tertiary-color);
|
||||
box-sizing: border-box;
|
||||
color: white;
|
||||
}
|
||||
|
||||
pre {
|
||||
font-size: 0.95rem;
|
||||
overflow: auto;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
code {
|
||||
box-decoration-break: clone;
|
||||
word-wrap: break-word;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
:not(pre) > code {
|
||||
background-color: var(--light-secondary-color) !important;
|
||||
color: var(--light-text-color);
|
||||
padding: 1px 4px;
|
||||
}
|
||||
|
||||
pre code {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
/*
|
||||
Fix iOS font sizing in code blocks
|
||||
Author: https://github.com/bglw
|
||||
Source: https://github.com/adityatelange/hugo-PaperMod/issues/828#issuecomment-1171994855
|
||||
*/
|
||||
code {
|
||||
text-size-adjust: 100%;
|
||||
-ms-text-size-adjust: 100%;
|
||||
-moz-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 2px solid var(--light-secondary-color);
|
||||
color: grey;
|
||||
padding-left: 1rem;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
hr {
|
||||
color: var(--light-secondary-color);
|
||||
margin: 50px auto;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
margin: 30px 0;
|
||||
text-align: left;
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
table thead {
|
||||
background-color: var(--light-secondary-color);
|
||||
}
|
||||
|
||||
table td,
|
||||
table th {
|
||||
padding: 1.4rem;
|
||||
}
|
||||
|
||||
table td {
|
||||
border-bottom: 1px solid var(--light-secondary-color);
|
||||
}
|
||||
|
||||
/* HOME PAGE */
|
||||
.home-about {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.home-about .avatar img {
|
||||
border-radius: 50%;
|
||||
height: auto;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
/* Avatar sizes (default is M) - XS, S, M, L, XL */
|
||||
.home-about .avatar img.size-xs {
|
||||
height: 7rem;
|
||||
width: 7rem;
|
||||
}
|
||||
|
||||
.home-about .avatar img.size-s {
|
||||
height: 9rem;
|
||||
width: 9rem;
|
||||
}
|
||||
|
||||
.home-about .avatar img.size-m {
|
||||
height: 11rem;
|
||||
width: 11rem;
|
||||
}
|
||||
|
||||
.home-about .avatar img.size-l {
|
||||
height: 13rem;
|
||||
width: 13rem;
|
||||
}
|
||||
|
||||
.home-about .avatar img.size-xl {
|
||||
height: 15rem;
|
||||
width: 15rem;
|
||||
}
|
||||
|
||||
.home-about h1 {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
.home-about h2 {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.gk-social-icons {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.gk-social-icons .gk-social-icons-list {
|
||||
display: inline-block;
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.gk-social-icons-list .gk-social-icon {
|
||||
box-sizing: border-box;
|
||||
display: inline-block;
|
||||
fill: var(--light-text-color);
|
||||
height: 24px;
|
||||
margin: 0 6px;
|
||||
width: 24px;
|
||||
}
|
||||
|
||||
.gk-social-icon a svg path {
|
||||
transition: fill 0.15s ease;
|
||||
}
|
||||
|
||||
.home-content {
|
||||
line-height: 1.25;
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.home-posts {
|
||||
margin: 0 auto;
|
||||
padding-top: 10px;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
/* SINGLE */
|
||||
.post [role="doc-subtitle"] {
|
||||
font-size: 1.1em;
|
||||
font-style: italic;
|
||||
}
|
||||
.post {
|
||||
/* Prevent long strings from overflowing */
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
.post .post-date, .prev-post-date, .next-post-date {
|
||||
color: gray;
|
||||
}
|
||||
.post .post-content {
|
||||
line-height: 1.7;
|
||||
margin-top: 50px;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
.post-content h1, .post-content h2, .post-content h3, .post-content h4 {
|
||||
scroll-margin-top: 55px;
|
||||
}
|
||||
.post-content h1 {
|
||||
margin-top: 40px;
|
||||
}
|
||||
.post-content h2 {
|
||||
margin-top: 35px;
|
||||
}
|
||||
.post-content h3 {
|
||||
margin-top: 30px;
|
||||
}
|
||||
.post-content h4 {
|
||||
margin-top: 25px;
|
||||
}
|
||||
.post-content h5 {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.post-content img {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
/* LIST */
|
||||
.list-posts .list-title {
|
||||
text-align: center;
|
||||
}
|
||||
.list-posts .posts-year {
|
||||
margin-top: 70px;
|
||||
}
|
||||
.list-posts .post-title {
|
||||
margin: 18px 0 0 15px;
|
||||
}
|
||||
.list-posts .post-title a {
|
||||
text-decoration: none;
|
||||
}
|
||||
.post-title .post-link,
|
||||
.post-title .post-date {
|
||||
display: inline-block;
|
||||
}
|
||||
.post-title .post-link {
|
||||
/* This magic number is the largest width that keeps the post-date div from
|
||||
* causing the line to wrap with the longest possible date string
|
||||
* "September 22, 2022"
|
||||
*/
|
||||
width: 73%;
|
||||
}
|
||||
.tags-list .post-tags {
|
||||
margin-top: 50px;
|
||||
}
|
||||
.tags-list .post-tags .post-tag {
|
||||
margin: 2px 5px;
|
||||
padding: 0;
|
||||
}
|
||||
.tags-list .post-tags .post-tag a {
|
||||
border-radius: inherit;
|
||||
padding: 0;
|
||||
}
|
||||
.tags-list .post-tags .post-tag a div {
|
||||
display: inline-block;
|
||||
}
|
||||
.tags-list .post-tags .post-tag a .tag-name {
|
||||
padding: 5px 8px;
|
||||
}
|
||||
.tags-list .post-tags .post-tag a .tag-posts-count {
|
||||
background-color: var(--light-secondary-color);
|
||||
border-radius: inherit;
|
||||
color: inherit;
|
||||
opacity: 0.8;
|
||||
padding: 6px;
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
}
|
||||
.tags-list .post-tags .post-tag:hover a .tag-posts-count {
|
||||
background-color: var(--light-text-color);
|
||||
color: rgb(var(--light-primary-color));
|
||||
}
|
||||
|
||||
.text-404 {
|
||||
margin-top: 125px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1120px) {
|
||||
main#content {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 820px) {
|
||||
body {
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
.flex-break {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.home-about .avatar img {
|
||||
border-radius: 50%;
|
||||
height: 7rem;
|
||||
width: 7rem;
|
||||
}
|
||||
|
||||
.nav-links .nav-link,
|
||||
.nav-icons-divider {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#hamburger-menu-toggle {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
main#content {
|
||||
box-sizing: border-box;
|
||||
padding: 0 1.5rem;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.home-content, .home-posts {
|
||||
width: auto;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
main#content .container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.home-about {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
#toc {
|
||||
display:none;
|
||||
}
|
||||
|
||||
.list-posts {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.list-posts .post-date {
|
||||
color: gray;
|
||||
}
|
||||
|
||||
.footer {
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 820px) {
|
||||
.nav-hamburger-list {
|
||||
visibility: hidden !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*Accessibility*/
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
left: -10000px;
|
||||
top: auto;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.post-navigation {
|
||||
padding: 40px 0;
|
||||
}
|
||||
|
||||
.post-navigation::after {
|
||||
clear: both;
|
||||
content: "";
|
||||
display: table;
|
||||
}
|
||||
|
||||
.prev-post {
|
||||
float: left;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.next-post {
|
||||
float: right;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.prev-post, .next-post {
|
||||
max-width: 33%;
|
||||
}
|
||||
|
||||
/* back to top button */
|
||||
.arrow-logo {
|
||||
background-color: transparent;
|
||||
border-radius: 50%;
|
||||
bottom: 20px;
|
||||
cursor: pointer;
|
||||
display: none;
|
||||
font-size: 24px;
|
||||
padding: 10px;
|
||||
padding-right: 8px;
|
||||
position: fixed;
|
||||
right: 20px;
|
||||
z-index: 5;
|
||||
background-color: var(--light-tertiary-color);
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
.arrow-logo path{
|
||||
fill: var(--light-secondary-color)
|
||||
}
|
||||
|
||||
.arrow-logo:hover {
|
||||
fill: var(--accent-color);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
#btt-button {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
2
themes/gokarna/assets/css/normalize.min.css
vendored
Normal file
2
themes/gokarna/assets/css/normalize.min.css
vendored
Normal file
@@ -0,0 +1,2 @@
|
||||
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}
|
||||
/*# sourceMappingURL=normalize.min.css.map */
|
||||
13
themes/gokarna/assets/js/feather-icons.min.js
vendored
Normal file
13
themes/gokarna/assets/js/feather-icons.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
146
themes/gokarna/assets/js/main.js
Normal file
146
themes/gokarna/assets/js/main.js
Normal file
@@ -0,0 +1,146 @@
|
||||
document.addEventListener('DOMContentLoaded', ready, false);
|
||||
|
||||
const THEME_PREF_STORAGE_KEY = "theme-preference";
|
||||
const THEME_TO_ICON_CLASS = {
|
||||
'dark': 'feather-moon',
|
||||
'light': 'feather-sun'
|
||||
};
|
||||
const THEME_TO_ICON_TEXT_CLASS = {
|
||||
'dark': 'Dark mode',
|
||||
'light': 'Light mode'
|
||||
};
|
||||
let toggleIcon = '';
|
||||
let darkThemeCss = '';
|
||||
|
||||
const HEADING_TO_TOC_CLASS = {
|
||||
'H1': 'level-1',
|
||||
'H2': 'level-2',
|
||||
'H3': 'level-3',
|
||||
'H4': 'level-4'
|
||||
}
|
||||
|
||||
function ready() {
|
||||
feather.replace({ 'stroke-width': 1, width: 20, height: 20 });
|
||||
setThemeByUserPref();
|
||||
|
||||
if (document.querySelector('main#content > .container') !== null &&
|
||||
document.querySelector('main#content > .container').classList.contains('post')) {
|
||||
if (document.getElementById('TableOfContents') !== null) {
|
||||
fixTocItemsIndent();
|
||||
createScrollSpy();
|
||||
} else {
|
||||
document.querySelector('main#content > .container.post').style.display = "block";
|
||||
}
|
||||
}
|
||||
|
||||
// Elements to inject
|
||||
const svgsToInject = document.querySelectorAll('img.svg-inject');
|
||||
// Do the injection
|
||||
SVGInjector(svgsToInject);
|
||||
|
||||
const observer = new MutationObserver(() => {
|
||||
normalizeSvgPaths();
|
||||
});
|
||||
|
||||
observer.observe(document.body, { childList: true, subtree: true });
|
||||
|
||||
function normalizeSvgPaths() {
|
||||
document.querySelectorAll('.nav-link a .svg-inject').forEach(path => {
|
||||
const bbox = path.getBBox();
|
||||
const scaleX = 20 / bbox.width;
|
||||
const scaleY = 20 / bbox.height;
|
||||
const scale = Math.min(scaleX, scaleY);
|
||||
|
||||
path.setAttribute('transform', `scale(${scale}) translate(${-bbox.x}, ${-bbox.y})`);
|
||||
path.setAttribute('stroke', 'currentColor');
|
||||
path.setAttribute('stroke-width', '1');
|
||||
path.setAttribute('fill', 'transparent');
|
||||
});
|
||||
}
|
||||
|
||||
document.getElementById('hamburger-menu-toggle').addEventListener('click', () => {
|
||||
const hamburgerMenu = document.getElementsByClassName('nav-hamburger-list')[0]
|
||||
const hamburgerMenuToggleTarget = document.getElementById("hamburger-menu-toggle-target")
|
||||
if (hamburgerMenu.classList.contains('visibility-hidden')) {
|
||||
hamburgerMenu.classList.remove('visibility-hidden');
|
||||
hamburgerMenuToggleTarget.setAttribute("aria-checked", "true");
|
||||
} else {
|
||||
hamburgerMenu.classList.add('visibility-hidden');
|
||||
hamburgerMenuToggleTarget.setAttribute("aria-checked", "false");
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
window.addEventListener('scroll', () => {
|
||||
if (window.innerWidth <= 820) {
|
||||
// For smaller screen, show shadow earlier
|
||||
toggleHeaderShadow(50);
|
||||
} else {
|
||||
toggleHeaderShadow(100);
|
||||
}
|
||||
});
|
||||
|
||||
function fixTocItemsIndent() {
|
||||
document.querySelectorAll('#TableOfContents a').forEach($tocItem => {
|
||||
const itemId = $tocItem.getAttribute("href").substring(1)
|
||||
$tocItem.classList.add(HEADING_TO_TOC_CLASS[document.getElementById(itemId).tagName]);
|
||||
});
|
||||
}
|
||||
|
||||
function createScrollSpy() {
|
||||
var elements = document.querySelectorAll('#toc a');
|
||||
document.addEventListener('scroll', function() {
|
||||
elements.forEach(function(element) {
|
||||
const boundingRect = document.getElementById(element.getAttribute('href').substring(1)).getBoundingClientRect();
|
||||
if (boundingRect.top <= 55 && boundingRect.bottom >= 0) {
|
||||
elements.forEach(function(elem) {
|
||||
elem.classList.remove('active');
|
||||
});
|
||||
element.classList.add('active');
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function toggleHeaderShadow(scrollY) {
|
||||
if (window.scrollY > scrollY) {
|
||||
document.querySelectorAll('.header').forEach(function(item) {
|
||||
item.classList.add('header-shadow')
|
||||
})
|
||||
} else {
|
||||
document.querySelectorAll('.header').forEach(function(item) {
|
||||
item.classList.remove('header-shadow')
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
function setThemeByUserPref() {
|
||||
darkThemeCss = document.getElementById("dark-theme");
|
||||
const savedTheme = localStorage.getItem(THEME_PREF_STORAGE_KEY) ||
|
||||
(window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
|
||||
const darkThemeToggles = document.querySelectorAll('.dark-theme-toggle');
|
||||
setTheme(savedTheme, darkThemeToggles);
|
||||
darkThemeToggles.forEach(el => el.addEventListener('click', toggleTheme, { capture: true }))
|
||||
}
|
||||
|
||||
function toggleTheme(event) {
|
||||
toggleIcon = event.currentTarget.querySelector("a svg.feather");
|
||||
if (toggleIcon.classList[1] === THEME_TO_ICON_CLASS.dark) {
|
||||
setThemeAndStore('light', [event.currentTarget]);
|
||||
} else if (toggleIcon.classList[1] === THEME_TO_ICON_CLASS.light) {
|
||||
setThemeAndStore('dark', [event.currentTarget]);
|
||||
}
|
||||
}
|
||||
|
||||
function setTheme(themeToSet, targets) {
|
||||
darkThemeCss.disabled = themeToSet === 'light';
|
||||
targets.forEach((target) => {
|
||||
target.querySelector('a').innerHTML = feather.icons[THEME_TO_ICON_CLASS[themeToSet].split('-')[1]].toSvg();
|
||||
target.querySelector(".dark-theme-toggle-screen-reader-target").textContent = [THEME_TO_ICON_TEXT_CLASS[themeToSet]];
|
||||
});
|
||||
}
|
||||
|
||||
function setThemeAndStore(themeToSet, targets) {
|
||||
setTheme(themeToSet, targets);
|
||||
localStorage.setItem(THEME_PREF_STORAGE_KEY, themeToSet);
|
||||
}
|
||||
9
themes/gokarna/assets/js/svg-injector.min.js
vendored
Normal file
9
themes/gokarna/assets/js/svg-injector.min.js
vendored
Normal file
@@ -0,0 +1,9 @@
|
||||
/**
|
||||
* SVGInjector v1.1.3 - Fast, caching, dynamic inline SVG DOM injection library
|
||||
* https://github.com/iconic/SVGInjector
|
||||
*
|
||||
* Copyright (c) 2014-2015 Waybury <hello@waybury.com>
|
||||
* @license MIT
|
||||
*/
|
||||
!function(t,e){"use strict";function r(t){t=t.split(" ");for(var e={},r=t.length,n=[];r--;)e.hasOwnProperty(t[r])||(e[t[r]]=1,n.unshift(t[r]));return n.join(" ")}var n="file:"===t.location.protocol,i=e.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#BasicStructure","1.1"),o=Array.prototype.forEach||function(t,e){if(void 0===this||null===this||"function"!=typeof t)throw new TypeError;var r,n=this.length>>>0;for(r=0;n>r;++r)r in this&&t.call(e,this[r],r,this)},a={},l=0,s=[],u=[],c={},f=function(t){return t.cloneNode(!0)},p=function(t,e){u[t]=u[t]||[],u[t].push(e)},d=function(t){for(var e=0,r=u[t].length;r>e;e++)!function(e){setTimeout(function(){u[t][e](f(a[t]))},0)}(e)},v=function(e,r){if(void 0!==a[e])a[e]instanceof SVGSVGElement?r(f(a[e])):p(e,r);else{if(!t.XMLHttpRequest)return r("Browser does not support XMLHttpRequest"),!1;a[e]={},p(e,r);var i=new XMLHttpRequest;i.onreadystatechange=function(){if(4===i.readyState){if(404===i.status||null===i.responseXML)return r("Unable to load SVG file: "+e),n&&r("Note: SVG injection ajax calls do not work locally without adjusting security setting in your browser. Or consider using a local webserver."),r(),!1;if(!(200===i.status||n&&0===i.status))return r("There was a problem injecting the SVG: "+i.status+" "+i.statusText),!1;if(i.responseXML instanceof Document)a[e]=i.responseXML.documentElement;else if(DOMParser&&DOMParser instanceof Function){var t;try{var o=new DOMParser;t=o.parseFromString(i.responseText,"text/xml")}catch(l){t=void 0}if(!t||t.getElementsByTagName("parsererror").length)return r("Unable to parse SVG file: "+e),!1;a[e]=t.documentElement}d(e)}},i.open("GET",e),i.overrideMimeType&&i.overrideMimeType("text/xml"),i.send()}},h=function(e,n,a,u){var f=e.getAttribute("data-src")||e.getAttribute("src");if(!/\.svg/i.test(f))return void u("Attempted to inject a file with a non-svg extension: "+f);if(!i){var p=e.getAttribute("data-fallback")||e.getAttribute("data-png");return void(p?(e.setAttribute("src",p),u(null)):a?(e.setAttribute("src",a+"/"+f.split("/").pop().replace(".svg",".png")),u(null)):u("This browser does not support SVG and no PNG fallback was defined."))}-1===s.indexOf(e)&&(s.push(e),e.setAttribute("src",""),v(f,function(i){if("undefined"==typeof i||"string"==typeof i)return u(i),!1;var a=e.getAttribute("id");a&&i.setAttribute("id",a);var p=e.getAttribute("title");p&&i.setAttribute("title",p);var d=[].concat(i.getAttribute("class")||[],"injected-svg",e.getAttribute("class")||[]).join(" ");i.setAttribute("class",r(d));var v=e.getAttribute("style");v&&i.setAttribute("style",v);var h=[].filter.call(e.attributes,function(t){return/^data-\w[\w\-]*$/.test(t.name)});o.call(h,function(t){t.name&&t.value&&i.setAttribute(t.name,t.value)});var g,m,b,y,A,w={clipPath:["clip-path"],"color-profile":["color-profile"],cursor:["cursor"],filter:["filter"],linearGradient:["fill","stroke"],marker:["marker","marker-start","marker-mid","marker-end"],mask:["mask"],pattern:["fill","stroke"],radialGradient:["fill","stroke"]};Object.keys(w).forEach(function(t){g=t,b=w[t],m=i.querySelectorAll("defs "+g+"[id]");for(var e=0,r=m.length;r>e;e++){y=m[e].id,A=y+"-"+l;var n;o.call(b,function(t){n=i.querySelectorAll("["+t+'*="'+y+'"]');for(var e=0,r=n.length;r>e;e++)n[e].setAttribute(t,"url(#"+A+")")}),m[e].id=A}}),i.removeAttribute("xmlns:a");for(var x,S,k=i.querySelectorAll("script"),j=[],G=0,T=k.length;T>G;G++)S=k[G].getAttribute("type"),S&&"application/ecmascript"!==S&&"application/javascript"!==S||(x=k[G].innerText||k[G].textContent,j.push(x),i.removeChild(k[G]));if(j.length>0&&("always"===n||"once"===n&&!c[f])){for(var M=0,V=j.length;V>M;M++)new Function(j[M])(t);c[f]=!0}var E=i.querySelectorAll("style");o.call(E,function(t){t.textContent+=""}),e.parentNode.replaceChild(i,e),delete s[s.indexOf(e)],e=null,l++,u(i)}))},g=function(t,e,r){e=e||{};var n=e.evalScripts||"always",i=e.pngFallback||!1,a=e.each;if(void 0!==t.length){var l=0;o.call(t,function(e){h(e,n,i,function(e){a&&"function"==typeof a&&a(e),r&&t.length===++l&&r(l)})})}else t?h(t,n,i,function(e){a&&"function"==typeof a&&a(e),r&&r(1),t=null}):r&&r(0)};"object"==typeof module&&"object"==typeof module.exports?module.exports=exports=g:"function"==typeof define&&define.amd?define(function(){return g}):"object"==typeof t&&(t.SVGInjector=g)}(window,document);
|
||||
//# sourceMappingURL=svg-injector.map.js
|
||||
Reference in New Issue
Block a user