Add night mode (#890)

* Split base template menus out

* Add toggle for night mode setting

* Add vertical flexbox row

Makes each col-* expand to fill the space created by the largest column.

* Use flexbox on main character and group panels

* Fix data table sort control clipping

* Build new css

allianceauth/static/css/themes/bootstrap-locals.less

@@ -0,0 +1,10 @@
+// Import the fonts from CDN
+@font-face {
+  font-family: 'Glyphicons Halflings';
+  src: url('https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.7/fonts/glyphicons-halflings-regular.eot');
+  src: url('https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.7/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
+       url('https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.7/fonts/glyphicons-halflings-regular.woff2') format('woff2'),
+       url('https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.7/fonts/glyphicons-halflings-regular.woff') format('woff'),
+       url('https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.7/fonts/glyphicons-halflings-regular.ttf') format('truetype'),
+       url('https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.7/fonts/glyphicons-halflings-regular.svg#@{icon-font-svg-id}') format('svg');
+}

allianceauth/static/css/themes/darkly/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2013 Thomas Park
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

allianceauth/static/css/themes/darkly/darkly.less

@@ -0,0 +1,9 @@
+// Alliance Auth customisations of the bootswatch Darkly theme
+// To build a new CSS file you need to `npm install -g less less-plugin-clean-css`
+// Then `lessc --clean-css darkly.less darkly.min.css`
+
+@import "https://raw.githubusercontent.com/thomaspark/bootswatch/gh-pages/bower_components/bootstrap/less/bootstrap.less";
+@import "https://raw.githubusercontent.com/thomaspark/bootswatch/gh-pages/darkly/variables.less";
+@import "https://raw.githubusercontent.com/thomaspark/bootswatch/gh-pages/darkly/bootswatch.less";
+@import "../bootstrap-locals.less";
+@import "../flatly-shared.less";

allianceauth/static/css/themes/flatly-shared.less

@@ -0,0 +1,31 @@
+// Shared variables between flatly and darkly themes
+
+// Fade down table row colors to prevent them looking like a bag of skittles
+@table-bg-fade-percent: 20%;
+
+.table-row-variant(active; fade(@table-bg-active, @table-bg-fade-percent));
+.table-row-variant(success; fade(@state-success-bg, @table-bg-fade-percent));
+.table-row-variant(info; fade(@state-info-bg, @table-bg-fade-percent));
+.table-row-variant(warning; fade(@state-warning-bg, @table-bg-fade-percent));
+.table-row-variant(danger; fade(@state-danger-bg, @table-bg-fade-percent));
+
+
+// From bootswatch Superhero
+@brand-success:         #5cb85c;
+@brand-warning:         #f0ad4e;
+@brand-danger:          #d9534f;
+
+
+// Bootstrap extension, allow vertical columns to be same height
+.row.vertical-flexbox-row {
+  display:  -webkit-box;
+  display: -webkit-flex;
+  display:  -ms-flexbox;
+  display:         flex;
+  flex-wrap: wrap;
+}
+
+.row.vertical-flexbox-row > [class*='col-'] {
+  display: flex;
+  flex-direction: column;
+}

allianceauth/static/css/themes/flatly/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2013 Thomas Park
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

allianceauth/static/css/themes/flatly/flatly.less

@@ -0,0 +1,35 @@
+// Alliance Auth customisations of the bootswatch Flatly theme
+// To build a new CSS file you need to `npm install -g less less-plugin-clean-css`
+// Then `lessc --clean-css flatly.less flatly.min.css`
+
+@import "https://raw.githubusercontent.com/thomaspark/bootswatch/gh-pages/bower_components/bootstrap/less/bootstrap.less";
+@import "https://raw.githubusercontent.com/thomaspark/bootswatch/gh-pages/flatly/variables.less";
+@import "https://raw.githubusercontent.com/thomaspark/bootswatch/gh-pages/flatly/bootswatch.less";
+@import "../bootstrap-locals.less";
+@import "../flatly-shared.less";
+
+.nav-tabs > li > a,
+.nav-pills > li > a {
+  color: #000;
+}
+
+// From bootswatch Superhero
+@brand-info:            #5bc0de;
+
+@table-bg-fade-percent: 40%;
+
+// Fixup table colors to match fade
+.table {
+  .active,
+  .success,
+  .info,
+  .warning,
+  .danger {
+    color: @gray-darker;
+    > td {
+      > a:not(.btn) {
+        color: @link-color;
+      }
+    }
+  }
+}