provides new CSS files for dark and light CSS-based themes

integrates new themes via header.ftl
apache · Sep 4, 2023 · 2be9342 · 2be9342
1 parent 4e81442
commit 2be9342
Show file tree

Hide file tree

Showing 4 changed files with 137 additions and 43 deletions.
diff --git a/src/main/jbake/assets/css/custom-style.css b/src/main/jbake/assets/css/custom-style.css
@@ -0,0 +1,30 @@
+/* Sticky footer styles
+-------------------------------------------------- */
+html {
+  position: relative;
+  min-height: 100%;
+}
+body {
+    /* Margin bottom by footer height + 20px for padding */
+    margin: 0px;
+}
+
+.footer .text-muted {
+    margin: 0px 0;
+}
+
+.footer > .container {
+    padding-right: 15px;
+    padding-left: 15px;
+}
+.jumbotron {
+    margin: 0px 0;
+    text-align: center;
+    background-color: transparent;
+    padding-top: 0px;
+}
+
+.jumbotron h1 {
+    line-height: 1;
+    font-weight: bold;
+}
diff --git a/src/main/jbake/assets/css/scheme-dark.css b/src/main/jbake/assets/css/scheme-dark.css
@@ -0,0 +1,85 @@
+@media (prefers-color-scheme: dark) {
+    body {
+        color: #eee;
+        background: #222;
+    }
+    a {
+        color: #A09fff;
+    }
+    .navbar {
+        color: #eee;
+        background: #222;
+    }
+    .navbar-default {
+        border-color: #222;
+    }
+    .navbar-default .navbar-nav > li > a {
+        color: #eee;
+    }
+    .footer {
+        text-align: center;
+        padding: 30px 0;
+        margin-top: 50px;
+        border-top: 1px solid #f59523;
+    }
+    .navbar-default .navbar-nav > li > a {
+        color: #eee;
+    }
+    .navbar-default .navbar-nav > .active > a,
+    .navbar-default .navbar-nav > .active > a:focus,
+    .navbar-default .navbar-nav > .active > a:hover  {
+        color: #eee;
+        background-color: #e56b28;
+    }
+    .navbar-default .navbar-nav > .open > a,
+    .navbar-default .navbar-nav > .open > a:focus,
+    .navbar-default .navbar-nav > .open > a:hover {
+        color: #eee;
+        background-color: #832779;
+    }
+    .navbar-nav > li > .dropdown-menu {
+        color: #eee;
+        background-color: #444;
+    }
+    .dropdown-menu > li > a {
+        color: #eee;
+        background-color: #444;
+    }
+    .dropdown-menu > .active > a,
+    .dropdown-menu > .active > a:focus,
+    .dropdown-menu > .active > a:hover {
+        color: #eee;
+        background-color: #e56b28;
+    }
+    .admonitionblock > table td.icon .title {
+        color: #f59523;
+    }
+    .admonitionblock > table td.content {
+        color: #eee;
+    }
+    table {
+        border: dashed 1px #e56b28;
+    }
+    table.tableblock.grid-all {
+        border-top: dashed 1px #e56b28;
+        border-bottom: dashed 1px #e56b28;
+    }
+    .tableblock {
+        color: #eee;
+        background-color: #444;
+    }
+    .tableblock > a {
+        color: #f59523;
+    }
+    .content pre,
+    .content pre > code,
+    .com, .tag, .pln, .str, .pun, .kwd,
+    .listingblock > .content pre > code {
+        color: #eee;
+        background-color: #444;
+    }
+    *:not(pre) > code {
+        color: #f59523;
+        background-color: #444;
+    }
+}
diff --git a/src/main/jbake/assets/css/scheme-light.css b/src/main/jbake/assets/css/scheme-light.css
@@ -0,0 +1,17 @@
+@media (prefers-color-scheme: light) {
+    body {
+        color: #222;
+        background: #fff;
+    }
+    a {
+        color: #0033cc;
+    }
+    .footer {
+        text-align: center;
+        padding: 30px 0;
+        margin-top: 50px;
+        border-top: 1px solid #e5e5e5;
+        border-bottom: 1px solid #e5e5e5;
+        background-color: #f5f5f5;
+    }
+}
diff --git a/src/main/jbake/templates/header.ftl b/src/main/jbake/templates/header.ftl
@@ -26,11 +26,12 @@
     <title><#if (content.title)??><#escape x as x?xml>${content.title} - Apache OpenNLP</#escape><#else>Apache OpenNLP</#if></title>
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="color-scheme" content="dark light">
     <meta name="description" content="Apache OpenNLP  is a machine learning based toolkit for the processing of natural language text." />
     <meta name="author" content="The Apache OpenNLP Team" />
     <meta name="keywords" content="java, natural language processing, nlp, apache, open source, web site" />
     <meta name="generator" content="JBake"/>
-
+    
     <!-- RSS Feed -->
     <link rel="alternate" type="application/rss+xml" title="RSS" href="/${config.feed_file}" />
 
@@ -58,48 +59,9 @@
     <link href="/css/font-awesome.min.css" rel="stylesheet">
     <link href="/css/asciidoctor.css" rel="stylesheet">
     <link href="/css/prettify.css" rel="stylesheet">
-    <style type="text/css">
-/* Sticky footer styles
--------------------------------------------------- */
-html {
-  position: relative;
-  min-height: 100%;
-}
-body {
-  /* Margin bottom by footer height + 20px for padding */
-  margin: 0px;
-}
-.footer {
-  text-align: center;
-  padding: 30px 0;
-  margin-top: 50px;
-  border-top: 1px solid #e5e5e5;
-  border-bottom: 1px solid #e5e5e5;
-  background-color: #f5f5f5;
-}
-
-.footer .text-muted {
-  margin: 0px 0;
-}
-
-.footer > .container {
-  padding-right: 15px;
-  padding-left: 15px;
-}
-
-.jumbotron {
-  margin: 0px 0;
-  text-align: center;
-  background-color: transparent;
-  padding-top: 0px;
-}
-
-.jumbotron h1 {
-    line-height: 1;
-    font-weight: bold;
-}
-
-    </style>
+    <link href="/css/custom-style.css" rel="stylesheet">
+    <link href="/css/scheme-light.css" rel="stylesheet">
+    <link href="/css/scheme-dark.css" rel="stylesheet">
 
     <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
     <!--[if lt IE 9]>