瀏覽代碼

Finalised the dark theme

n1474335 8 年之前
父節點
當前提交
e4ad7768d5

+ 1 - 0
package.json

@@ -53,6 +53,7 @@
     "imports-loader": "^0.7.1",
     "ink-docstrap": "^1.1.4",
     "jsdoc-babel": "^0.3.0",
+    "less": "^2.7.2",
     "less-loader": "^4.0.3",
     "style-loader": "^0.15.0",
     "url-loader": "^0.5.8",

文件差異過大導致無法顯示
+ 0 - 1
src/web/stylesheets/layout/_io.css


+ 3 - 1
src/web/stylesheets/themes/_classic.css

@@ -27,7 +27,7 @@
 
     --title-colour: #424242;
     --title-weight: bold;
-    --title-background-colour: #eee;
+    --title-background-colour: #fafafa;
 
     --banner-font-colour: #468847;
     --banner-bg-colour: #dff0d8;
@@ -110,4 +110,6 @@
     --drop-file-border-colour: #3a87ad;
     --popover-background: #fff;
     --popover-border-colour: #ccc;
+    --code-background: #f9f2f4;
+    --code-font-colour: #c7254e;
 }

+ 3 - 12
src/web/stylesheets/themes/_dark.css

@@ -6,17 +6,6 @@
  * @license Apache-2.0
  */
 
-/*
-tabs
-links
-disabled buttons
-popovers
-toggle-string dropdowns
-alerts
-loading-file background
-option text for inputs is invisible
-*/
-
 :root.dark {
     --primary-font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     --primary-font-colour: #c5c5c5;
@@ -120,5 +109,7 @@ option text for inputs is invisible
     /* Misc. */
     --drop-file-border-colour: #0e639c;
     --popover-background: #444;
-    --popover-border-colour: #666; /* still working on this */
+    --popover-border-colour: #555;
+    --code-background: #0e639c;
+    --code-font-colour: #fff;
 }

+ 65 - 7
src/web/stylesheets/utils/_overrides.css

@@ -11,7 +11,6 @@
 button,
 a:focus {
     outline: none;
-    -moz-outline-style: none;
 }
 
 .btn-default {
@@ -22,18 +21,26 @@ a:focus {
 
 .btn-default:hover,
 .btn-default:active,
-.btn-default:hover:active {
+.btn-default:hover:active,
+.open>.dropdown-toggle.btn-default {
     color: var(--btn-default-hover-font-colour);
     background-color: var(--btn-default-hover-bg-colour);
     border-color: var(--btn-default-hover-border-colour);
 }
 
-.btn-default:focus {
+.btn-default:focus,
+.open>.dropdown-toggle.btn-default:hover,
+.open>.dropdown-toggle.btn-default:focus {
     color: var(--btn-default-font-colour);
     background-color: var(--btn-default-bg-colour);
     border-color: var(--btn-default-hover-border-colour);
 }
 
+.btn-default[disabled]:hover {
+    background-color: var(--primary-background-colour);
+    border-color: var(--primary-border-colour);
+}
+
 .btn-success {
     color: var(--btn-success-font-colour);
     background-color: var(--btn-success-bg-colour);
@@ -89,20 +96,28 @@ input[type="search"]::-webkit-search-cancel-button {
 
 .form-control {
     background-color: transparent;
+    border-color: var(--primary-border-colour);
+    color: var(--primary-font-colour);
 }
 
 code {
     border: 0;
     white-space: pre-wrap;
-    font-family: Consolas, monospace;
+    font-family: var(--fixed-width-font-family);
+    background-color: var(--code-background);
+    color: var(--code-font-colour);
 }
 
 pre {
     border-radius: 0 !important;
+    background-color: var(--secondary-background-colour);
+    border-color: var(--secondary-border-colour);
+    color: var(--fixed-width-font-colour);
 }
 
 blockquote {
     font-size: inherit;
+    border-left-color: var(--secondary-border-colour);
 }
 
 blockquote a {
@@ -122,17 +137,52 @@ optgroup {
     width: auto !important;
 }
 
-.popover,
-.popover.right>.arrow {
+.popover {
     background-color: var(--popover-background);
     border-color: var(--popover-border-colour);
 }
 
+
+.popover.right>.arrow {
+    border-right-color: var(--popover-border-colour);
+}
+
 .popover.right>.arrow:after {
-    /*border-color: var(--popover-border-colour);*/
     border-right-color: var(--popover-background);
 }
 
+.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
+    background-color: var(--primary-background-colour);
+    border-color: var(--primary-border-colour);
+    border-bottom-color: transparent;
+    color: var(--primary-font-colour);
+}
+
+.nav-tabs {
+    border-color: var(--primary-border-colour);
+}
+
+.nav>li>a:focus, .nav>li>a:hover {
+    background-color: var(--secondary-border-colour);
+}
+
+.nav-tabs>li>a:hover {
+    border-color: var(--secondary-border-colour) var(--secondary-border-colour) var(--primary-border-colour);
+}
+
+.dropdown-menu {
+    background-color: var(--primary-background-colour);
+}
+
+.dropdown-menu>li>a {
+    color: var(--primary-font-colour);
+}
+
+.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover {
+    background-color: var(--secondary-background-colour);
+    color: var(--primary-font-colour);
+}
+
 
 /* Bootstrap-switch */
 
@@ -144,6 +194,14 @@ optgroup {
     border-radius: 0 !important;
 }
 
+.bootstrap-switch .bootstrap-switch-label {
+    background-color: transparent;
+}
+
+.bootstrap-switch {
+    border-color: var(--primary-border-colour);
+}
+
 
 /* Sortable */
 

部分文件因文件數量過多而無法顯示