Styles rewritten in a modular format with themable properties stored in variables.

src/web/stylesheets/utils/_general.scss

@@ -0,0 +1,73 @@
+/**
+ * General styles
+ *
+ * @author n1474335 [n1474335@gmail.com]
+ * @copyright Crown Copyright 2017
+ * @license Apache-2.0
+ */
+
+body {
+    font-family: $primaryFontFamily;
+    font-size: $primaryFontSize;
+    line-height: $primaryLineHeight;
+    color: $primaryFontColour;
+    background-color: $primaryBackgroundColour;
+}
+
+.subtext {
+    font-style: italic;
+    font-size: $subtextFontSize;
+    color: $subtextFontColour;
+}
+
+.word-wrap {
+    white-space: pre !important;
+    word-wrap: normal !important;
+    overflow-x: scroll !important;
+}
+
+.clearfix {
+    clear: both;
+    height: 0;
+}
+
+.blur {
+    color: transparent !important;
+    text-shadow: rgba(0, 0, 0, 0.95) 0 0 10px !important;
+}
+
+.no-select { 
+    @include user-select(none);
+}
+
+.konami {
+    @include transform(180deg);
+}
+
+::-webkit-scrollbar {
+    width: 10px;
+    height: 10px;
+}
+
+::-webkit-scrollbar-track {
+    background-color: $secondaryBackgroundColour;
+}
+
+::-webkit-scrollbar-thumb {
+    background-color: $scrollbarThumb;
+}
+
+::-webkit-scrollbar-thumb:hover {
+    background-color: $scrollbarHover;
+}
+
+::-webkit-scrollbar-corner {
+    background-color: $secondaryBackgroundColour;
+}
+
+// Highlighters
+.hl1, { background-color: $hl1; }
+.hl2, { background-color: $hl2; }
+.hl3, { background-color: $hl3; } /* Half-Life 3 confirmed :O */
+.hl4, { background-color: $hl4; }
+.hl5, { background-color: $hl5; }

src/web/stylesheets/utils/_mixins.scss

@@ -0,0 +1,29 @@
+/**
+ * Mixins to cover vendor prefixes
+ *
+ * @author n1474335 [n1474335@gmail.com]
+ * @copyright Crown Copyright 2017
+ * @license Apache-2.0
+ */
+
+@mixin box-sizing($value) {
+    -webkit-box-sizing: $value;
+       -moz-box-sizing: $value;
+            box-sizing: $value;
+}
+
+@mixin user-select($value) {
+    -webkit-touch-callout: $value;
+    -webkit-user-select: $value;
+    -khtml-user-select: $value;
+    -moz-user-select: $value;
+    -ms-user-select: $value;
+    user-select: $value;
+}
+
+@mixin transform($value) {
+    -ms-transform: rotate($value);
+    -webkit-transform: rotate($value);
+    -moz-transform: rotate($value);
+    transform: rotate($value);
+}

src/web/stylesheets/utils/_overrides.scss

@@ -0,0 +1,121 @@
+/**
+ * Overrides for vendor styles
+ *
+ * @author n1474335 [n1474335@gmail.com]
+ * @copyright Crown Copyright 2017
+ * @license Apache-2.0
+ */
+
+/* Bootstrap */
+
+button,
+a:focus {
+    outline: none;
+    -moz-outline-style: none;
+}
+
+.btn-default {
+    border-color: #ddd;
+}
+
+.btn-default:focus {
+    background-color: #fff;
+    border-color: #adadad;
+}
+
+.btn-default:hover,
+.btn-default:active {
+    background-color: #ebebeb;
+    border-color: #adadad;
+}
+
+.btn,
+.btn-lg,
+.nav-tabs>li>a,
+.form-control,
+.popover,
+.alert,
+.modal-content,
+.tooltip-inner,
+.dropdown-menu {
+    border-radius: 0 !important;
+}
+
+input[type="search"] {
+    -webkit-appearance: searchfield;
+    box-shadow: none;
+}
+
+input[type="search"]::-webkit-search-cancel-button {
+    -webkit-appearance: searchfield-cancel-button;
+}
+
+.modal {
+    overflow-y: auto;
+}
+
+.form-control {
+    background-color: transparent;
+}
+
+code {
+    border: 0;
+    white-space: pre-wrap;
+    font-family: Consolas, monospace;
+}
+
+pre {
+    border-radius: 0 !important;
+}
+
+blockquote {
+    font-size: inherit;
+}
+
+blockquote a {
+    cursor: pointer;
+}
+
+optgroup {
+    font-weight: bold;
+}
+
+.panel-body:before,
+.panel-body:after {
+    content: "";
+}
+
+.table-nonfluid {
+    width: auto !important;
+}
+
+
+/* Bootstrap-switch */
+
+.bootstrap-switch,
+.bootstrap-switch-container,
+.bootstrap-switch-handle-on,
+.bootstrap-switch-handle-off,
+.bootstrap-switch-label {
+    border-radius: 0 !important;
+}
+
+
+/* Sortable */
+
+.sortable-ghost {
+    opacity: 0.6;
+}
+
+
+/* Bootstrap Colorpicker */
+
+.colorpicker-element {
+    float: left;
+    margin-right: 15px;
+}
+
+.colorpicker-color,
+.colorpicker-color div {
+    height: 100px;
+}