Merge pull request #881 from weseek/feat/add-antarctic-theme

Feat/add antarctic theme

config/webpack.common.js

@@ -43,6 +43,7 @@ module.exports = (options) => {
       'styles/theme-wood':          './src/client/styles/scss/theme/wood.scss',
       'styles/theme-christmas':          './src/client/styles/scss/theme/christmas.scss',
       'styles/theme-island':      './src/client/styles/scss/theme/island.scss',
+      'styles/theme-antarctic':      './src/client/styles/scss/theme/antarctic.scss',
       // styles for external services
       'styles/style-hackmd':          './src/client/styles/hackmd/style.scss',
     }, options.entry || {}), // Merge with env dependent settings

src/client/styles/agile-admin/inverse/colors/antarctic.scss

@@ -0,0 +1,104 @@
+@import '../variables';
+
+$themecolor: #000080;
+$themelight: #f0f8ff;
+$subthemecolor: black;
+$sidebar-text: $themelight;
+$topbar: $themecolor;
+$sidebar: $themelight;
+$bodycolor: $themelight;
+$headingtext: $subthemecolor;
+$bodytext: $subthemecolor;
+$linktext: lighten(blue, 5%);
+$primary: $themecolor;
+$active-nav-tabs-bgcolor: $themelight;
+$logo-mark-fill: $themelight;
+$wikilinktext: lighten($themecolor, 5%);
+$wikilinktext-hover: lighten($wikilinktext, 15%);
+$inline-code-color: darken($subthemecolor, 5%);
+$inline-code-bg: lighten($subthemecolor, 70%);
+$border: $subthemecolor;
+$border-original: $subthemecolor;
+$navbar-border: $themecolor;
+
+
+@import 'apply-colors';
+@import 'apply-colors-light';
+
+// change color of highlighted header in wiki (default: orange)
+.wiki {
+  .code-line.revision-head.highlighted {
+    background-color: lighten($themecolor, 50%);
+    color: $themelight;
+
+    .icon-note,
+    .icon-link {
+      color: $themelight;
+    }
+  }
+}
+
+.sidebar {
+  background: $themecolor;
+}
+
+.bg-title,
+.nav-navbar {
+  background-color: $themelight;
+}
+
+.edit-button {
+  color: $themelight;
+}
+
+.editor-container .btn-open-dropzone {
+  border-top: none;
+}
+
+#wrapper>.navbar>.navbar-header {
+  border-bottom: 4px solid $subthemecolor;
+}
+
+/*
+ * comments
+ */
+
+.page-comment {
+  .page-comment-main {
+    box-shadow: 4px 4px 4px gray;
+
+    .page-comment-creator>a {
+      border-bottom: 1px double $subthemecolor;
+    }
+  }
+}
+
+
+
+/*
+ * Tabs
+ */
+body:not(.on-edit) .nav.nav-tabs {
+  >li.active>a {
+    background: linear-gradient(rgba($active-nav-tabs-bgcolor, 0) 0%,
+      rgba($active-nav-tabs-bgcolor, 0) 90%,
+      $active-nav-tabs-bgcolor 100%); // overwrite only the bottom pixel
+  }
+}
+
+/*
+ * Panel
+ */
+.panel {
+
+  &.panel-white,
+  &.panel-default {
+    border-color: $border-original;
+
+    .panel-heading {
+      color: $subthemecolor;
+      background-color: white;
+      border-bottom: 1px solid $border-original;
+    }
+  }
+}

src/client/styles/scss/theme/antarctic.scss

@@ -0,0 +1,8 @@
+// import colors
+@import '../../agile-admin/inverse/colors/antarctic';
+
+// apply agile-admin theme
+@import '../../agile-admin/inverse/style';
+
+// override
+@import 'override-agileadmin';

src/server/views/admin/customize.html

@@ -138,6 +138,7 @@
             {% include 'widget/theme-colorbox.html' with { name: 'wood',   bg: '#fffefb', topbar: '#aaa45f', theme: '#dddebf'} %}
             {% include 'widget/theme-colorbox.html' with { name: 'island',   bg: '#8ecac0', topbar: '#0c2a44', theme: '#cef2ef'} %}
             {% include 'widget/theme-colorbox.html' with { name: 'christmas',   bg: '#fffefb', topbar: '#b3000c', theme: '#017e20'} %}
+            {% include 'widget/theme-colorbox.html' with { name: 'antarctic',   bg: '#ffffff', topbar: '#000080', theme: '#99cccc'} %}
           </div>
           {# Dark Themes #}
           <div class="d-flex mt-3">