frontend: Customize style, start using styleguide

frontend/Dockerfile

@@ -4,6 +4,6 @@ WORKDIR /opt/obs/frontend
 ADD package.json package-lock.json /opt/obs/frontend/
 RUN npm ci
 
-ADD tsconfig.json /opt/obs/frontend
+ADD tsconfig.json craco.config.js /opt/obs/frontend/
 ADD public/ /opt/obs/frontend/public/
 ADD src/ /opt/obs/frontend/src/

frontend/craco.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  plugins: [{ plugin: require('@semantic-ui-react/craco-less') }],
+}

frontend/package-lock.json

@@ -1181,6 +1181,61 @@
         "minimist": "^1.2.0"
       }
     },
+    "@craco/craco": {
+      "version": "6.1.2",
+      "resolved": "https://registry.npmjs.org/@craco/craco/-/craco-6.1.2.tgz",
+      "integrity": "sha512-GlQZn+g+yNlaDvIL5m6mcCoBGyFDwO4kkNx3fNFf98wuldkdWyBFoQbtOFOIb4gvkTh4VntOOxtJEoZfKs7XXw==",
+      "dev": true,
+      "requires": {
+        "cross-spawn": "^7.0.0",
+        "lodash": "^4.17.15",
+        "semver": "^7.3.2",
+        "webpack-merge": "^4.2.2"
+      },
+      "dependencies": {
+        "cross-spawn": {
+          "version": "7.0.3",
+          "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
+          "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==",
+          "dev": true,
+          "requires": {
+            "path-key": "^3.1.0",
+            "shebang-command": "^2.0.0",
+            "which": "^2.0.1"
+          }
+        },
+        "path-key": {
+          "version": "3.1.1",
+          "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
+          "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
+          "dev": true
+        },
+        "shebang-command": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
+          "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
+          "dev": true,
+          "requires": {
+            "shebang-regex": "^3.0.0"
+          }
+        },
+        "shebang-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
+          "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
+          "dev": true
+        },
+        "which": {
+          "version": "2.0.2",
+          "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
+          "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
+          "dev": true,
+          "requires": {
+            "isexe": "^2.0.0"
+          }
+        }
+      }
+    },
     "@csstools/convert-colors": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/@csstools/convert-colors/-/convert-colors-1.4.0.tgz",
@@ -1722,6 +1777,15 @@
         }
       }
     },
+    "@semantic-ui-react/craco-less": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@semantic-ui-react/craco-less/-/craco-less-1.2.1.tgz",
+      "integrity": "sha512-GfAwiyTOS19AWccxg5HOhOfmT6b0Q9bbTs4rRXgKURIpJvAnYdA2zdpbhQD6CeAj5CQukHAn/26fvk+ZuyNE7g==",
+      "dev": true,
+      "requires": {
+        "craco-less": "^1.15.0"
+      }
+    },
     "@semantic-ui-react/event-stack": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/@semantic-ui-react/event-stack/-/event-stack-3.1.2.tgz",
@@ -3936,6 +4000,12 @@
         }
       }
     },
+    "clone": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz",
+      "integrity": "sha1-G39Ln1kfHo+DZwQBYANFoCiHQ18=",
+      "dev": true
+    },
     "clone-deep": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-4.0.1.tgz",
@@ -4230,6 +4300,15 @@
       "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
       "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
     },
+    "copy-anything": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/copy-anything/-/copy-anything-2.0.3.tgz",
+      "integrity": "sha512-GK6QUtisv4fNS+XcI7shX0Gx9ORg7QqIznyfho79JTnX1XhLiyZHfftvGiziqzRiEi/Bjhgpi+D2o7HxJFPnDQ==",
+      "dev": true,
+      "requires": {
+        "is-what": "^3.12.0"
+      }
+    },
     "copy-concurrently": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/copy-concurrently/-/copy-concurrently-1.0.5.tgz",
@@ -4291,6 +4370,16 @@
         "yaml": "^1.10.0"
       }
     },
+    "craco-less": {
+      "version": "1.17.1",
+      "resolved": "https://registry.npmjs.org/craco-less/-/craco-less-1.17.1.tgz",
+      "integrity": "sha512-T6V1aF3+eQZ22gUigHInX/i+ExPbWrnmdAhtuEXc4mOyhneDifmEzZFseq/BdRy1aUEs9s4z26jTxP+1I6P//g==",
+      "dev": true,
+      "requires": {
+        "less": "^3.11.1",
+        "less-loader": "^6.1.0"
+      }
+    },
     "create-ecdh": {
       "version": "4.0.4",
       "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.4.tgz",
@@ -7523,6 +7612,13 @@
       "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.1.8.tgz",
       "integrity": "sha512-BMpfD7PpiETpBl/A6S498BaIJ6Y/ABT93ETbby2fP00v4EbvPBXWEoaR1UBPKs3iR53pJY7EtZk5KACI57i1Uw=="
     },
+    "image-size": {
+      "version": "0.5.5",
+      "resolved": "https://registry.npmjs.org/image-size/-/image-size-0.5.5.tgz",
+      "integrity": "sha1-Cd/Uq50g4p6xw+gLiZA3jfnjy5w=",
+      "dev": true,
+      "optional": true
+    },
     "immer": {
       "version": "7.0.9",
       "resolved": "https://registry.npmjs.org/immer/-/immer-7.0.9.tgz",
@@ -7986,6 +8082,12 @@
       "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
       "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI="
     },
+    "is-what": {
+      "version": "3.14.1",
+      "resolved": "https://registry.npmjs.org/is-what/-/is-what-3.14.1.tgz",
+      "integrity": "sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA==",
+      "dev": true
+    },
     "is-windows": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-1.0.2.tgz",
@@ -8818,9 +8920,10 @@
       }
     },
     "jquery": {
-      "version": "3.5.1",
+      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.5.1.tgz",
+      "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.6.0.tgz",
-      "integrity": "sha512-XwIBPqcMn57FxfT+Go5pzySnm4KWkT1Tv7gjrpT1srtf8Weynl6R273VJ5GjkRb51IzMp5nbaPjJXMWeju2MKg=="
+      "integrity": "sha512-JVzAR/AjBvVt2BmYhxRCSYysDsPcssdmTFnzyLEts9qNwmjmu4JTAMYubEfwVOSwpQ1I1sKKFcxhZCI2buerfw==",
+      "dev": true
     },
     "js-base64": {
       "version": "2.6.4",
@@ -9010,6 +9113,35 @@
         "webpack-sources": "^1.1.0"
       }
     },
+    "less": {
+      "version": "3.13.1",
+      "resolved": "https://registry.npmjs.org/less/-/less-3.13.1.tgz",
+      "integrity": "sha512-SwA1aQXGUvp+P5XdZslUOhhLnClSLIjWvJhmd+Vgib5BFIr9lMNlQwmwUNOjXThF/A0x+MCYYPeWEfeWiLRnTw==",
+      "dev": true,
+      "requires": {
+        "copy-anything": "^2.0.1",
+        "errno": "^0.1.1",
+        "graceful-fs": "^4.1.2",
+        "image-size": "~0.5.0",
+        "make-dir": "^2.1.0",
+        "mime": "^1.4.1",
+        "native-request": "^1.0.5",
+        "source-map": "~0.6.0",
+        "tslib": "^1.10.0"
+      }
+    },
+    "less-loader": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/less-loader/-/less-loader-6.2.0.tgz",
+      "integrity": "sha512-Cl5h95/Pz/PWub/tCBgT1oNMFeH1WTD33piG80jn5jr12T4XbxZcjThwNXDQ7AG649WEynuIzO4b0+2Tn9Qolg==",
+      "dev": true,
+      "requires": {
+        "clone": "^2.1.2",
+        "less": "^3.11.3",
+        "loader-utils": "^2.0.0",
+        "schema-utils": "^2.7.0"
+      }
+    },
     "leven": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz",
@@ -9751,6 +9883,13 @@
         "to-regex": "^3.0.1"
       }
     },
+    "native-request": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/native-request/-/native-request-1.0.8.tgz",
+      "integrity": "sha512-vU2JojJVelUGp6jRcLwToPoWGxSx23z/0iX+I77J3Ht17rf2INGjrhOoQnjVo60nQd8wVsgzKkPfRXBiVdD2ag==",
+      "dev": true,
+      "optional": true
+    },
     "native-url": {
       "version": "0.2.6",
       "resolved": "https://registry.npmjs.org/native-url/-/native-url-0.2.6.tgz",
@@ -13477,10 +13616,11 @@
         "node-forge": "^0.10.0"
       }
     },
-    "semantic-ui-css": {
+    "semantic-ui-less": {
       "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/semantic-ui-css/-/semantic-ui-css-2.4.1.tgz",
+      "resolved": "https://registry.npmjs.org/semantic-ui-less/-/semantic-ui-less-2.4.1.tgz",
-      "integrity": "sha512-Pkp0p9oWOxlH0kODx7qFpIRYpK1T4WJOO4lNnpNPOoWKCrYsfHqYSKgk5fHfQtnWnsAKy7nLJMW02bgDWWFZFg==",
+      "integrity": "sha512-/+nhPV6If2ydCz89/SSWzYD8ualDtjh4Tk3F6cqRj2luZj1DRjJ2nM9NKqmeyLlQFNFM94wpnpKXcjxRzZh5GA==",
+      "dev": true,
       "requires": {
         "jquery": "x.*"
       }
@@ -16465,6 +16605,15 @@
         }
       }
     },
+    "webpack-merge": {
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/webpack-merge/-/webpack-merge-4.2.2.tgz",
+      "integrity": "sha512-TUE1UGoTX2Cd42j3krGYqObZbOD+xF7u28WB7tfUordytSjbWTIjK/8V0amkBfTYN4/pB/GIDlJZZ657BGG19g==",
+      "dev": true,
+      "requires": {
+        "lodash": "^4.17.15"
+      }
+    },
     "webpack-sources": {
       "version": "1.4.3",
       "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.4.3.tgz",

frontend/package.json

@@ -28,16 +28,15 @@
     "redux-localstorage": "^0.4.1",
     "rxjs": "^6.6.3",
     "rxjs-hooks": "^0.6.2",
-    "semantic-ui-css": "^2.4.1",
     "semantic-ui-react": "^2.0.2",
     "typescript": "^4.1.4",
     "web-vitals": "^0.2.4"
   },
   "scripts": {
-    "start": "react-scripts start",
+    "start": "craco start",
-    "build": "react-scripts build",
+    "build": "craco build",
-    "test": "react-scripts test",
+    "test": "craco test",
-    "eject": "react-scripts eject"
+    "eject": "craco eject"
   },
   "eslintConfig": {
     "extends": [
@@ -59,8 +58,11 @@
   },
   "proxy": "http://api:3000",
   "devDependencies": {
+    "@craco/craco": "^6.1.2",
+    "@semantic-ui-react/craco-less": "^1.2.1",
     "@types/lodash": "^4.14.168",
     "@types/react-redux": "^7.1.16",
-    "@types/react-router-dom": "^5.1.7"
+    "@types/react-router-dom": "^5.1.7",
+    "semantic-ui-less": "^2.4.1"
   }
 }

frontend/src/index.js

@@ -1,7 +1,8 @@
 import React from 'react'
 import {Settings} from 'luxon'
 import ReactDOM from 'react-dom'
-import 'semantic-ui-css/semantic.min.css'
+import 'semantic-ui-less/semantic.less'
+
 import './index.css'
 import App from './App'
 

frontend/src/pages/HomePage.js

@@ -81,7 +81,7 @@ function MostRecentTrack() {
 
   return (
     <>
-      <h2>Most recent track</h2>
+      <Header as="h2">Most recent track</Header>
       <Loader active={track === null} />
       {track === undefined ? (
         <Message>

frontend/src/pages/NotFoundPage.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import {Button} from 'semantic-ui-react'
+import {Button, Header} from 'semantic-ui-react'
 import {useHistory} from 'react-router-dom'
 
 import {Page} from '../components'
@@ -8,7 +8,7 @@ export default function NotFoundPage() {
   const history = useHistory()
   return (
     <Page>
-      <h2>Page not found</h2>
+      <Header as="h2">Page not found</Header>
       <p>You know what that means...</p>
       <Button onClick={history.goBack.bind(history)}>Go back</Button>
     </Page>

frontend/src/pages/SettingsPage.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import {connect} from 'react-redux'
-import {Message, Icon, Grid, Form, Button, TextArea, Ref, Input} from 'semantic-ui-react'
+import {Message, Icon, Grid, Form, Button, TextArea, Ref, Input, Header} from 'semantic-ui-react'
 import {useForm} from 'react-hook-form'
 
 import {setLogin} from 'reducers/login'
@@ -36,7 +36,7 @@ const SettingsPage = connect((state) => ({login: state.login}), {setLogin})(func
     <Grid.Row>
     <Grid.Column width={8}>
 
-      <h2>Your profile</h2>
+      <Header as="h2">Your profile</Header>
 
       <Message info>All of this information is public.</Message>
 
@@ -85,7 +85,7 @@ function ApiKeyDialog({login}) {
 
   return (
     <>
-      <h2>Your API Key</h2>
+      <Header as="h2">Your API Key</Header>
       <p>
         Here you find your API Key, for use in the OpenBikeSensor. You can
         to copy and paste it into your sensor's configuration interface to

frontend/src/pages/TrackEditor.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import _ from 'lodash'
 import {connect} from 'react-redux'
-import {Divider, Message, Confirm, Grid, Button, Icon, Popup, Form, Ref, TextArea, Checkbox} from 'semantic-ui-react'
+import {Divider, Message, Confirm, Grid, Button, Icon, Popup, Form, Ref, TextArea, Checkbox, Header} from 'semantic-ui-react'
 import {useHistory, useParams, Link} from 'react-router-dom'
 import {concat, of, from} from 'rxjs'
 import {pluck, distinctUntilChanged, map, switchMap} from 'rxjs/operators'
@@ -22,7 +22,7 @@ function ReplaceTrackData({slug}) {
 
   return (
     <>
-      <h2>Replace track data</h2>
+      <Header as="h2">Replace track data</Header>
       {!file ? (
         <FileUploadField onSelect={setFile} />
       ) : result ? (
@@ -98,7 +98,7 @@ const TrackEditor = connect((state) => ({login: state.login}))(function TrackEdi
       <Grid centered relaxed divided>
         <Grid.Row>
           <Grid.Column width={10}>
-            <h2>Edit {track ? track.title || 'Unnamed track' : 'track'}</h2>
+            <Header as="h2">Edit {track ? track.title || 'Unnamed track' : 'track'}</Header>
             <Form loading={loading} key={track?.slug} onSubmit={onSubmit}>
               <Ref innerRef={findInput(register)}>
                 <Form.Input label="Title" name="title" defaultValue={track?.title} style={{fontSize: '120%'}} />
@@ -163,7 +163,7 @@ const TrackEditor = connect((state) => ({login: state.login}))(function TrackEdi
 
             <Divider />
 
-            <h2>Danger zone</h2>
+            <Header as="h2">Danger zone</Header>
             <p>
               You can remove this track from your account and the portal if you like. However, if at any point you have
               published this track, we cannot guarantee that there are no versions of it in the public data repository,

frontend/src/semantic-ui/site/collections/breadcrumb.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/collections/breadcrumb.variables

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/collections/form.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/collections/form.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/collections/grid.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/collections/grid.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/collections/menu.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/collections/menu.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/collections/message.overrides

@@ -0,0 +1,3 @@
+/*******************************
+        Site Overrides
+*******************************/

frontend/src/semantic-ui/site/collections/message.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/collections/table.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/collections/table.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/button.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/button.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/container.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/container.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/divider.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/divider.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/flag.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/flag.variables

@@ -0,0 +1,3 @@
+/*-------------------
+   Flag Variables
+--------------------*/

frontend/src/semantic-ui/site/elements/header.overrides

@@ -0,0 +1,34 @@
+/*******************************
+         Site Overrides
+*******************************/
+
+h1.ui.header {
+  font-family: "Open Sans Condensed";
+  line-height: 35pt;
+  font-size: 30pt;
+  color: @obsColorB4;
+}
+
+h2.ui.header {
+  font-family: "Open Sans";
+  font-weight: 300;
+  line-height: 25pt;
+  font-size: 20pt;
+  color: @obsColorG1;
+}
+
+h3.ui.header {
+  font-family: "Open Sans";
+  font-weight: normal;
+  line-height: 18pt;
+  font-size: 15pt;
+  color: @obsColorB4;
+}
+
+h4.ui.header {
+  font-family: "Open Sans";
+  font-weight: bold;
+  line-height: 15pt;
+  font-size: 15pt;
+  color: @obsColorB1;
+}

frontend/src/semantic-ui/site/elements/header.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/icon.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/icon.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/image.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/image.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/input.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/input.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/label.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/label.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/list.overrides

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/list.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/loader.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/loader.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/rail.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/rail.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/reveal.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/reveal.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/segment.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/segment.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/step.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/elements/step.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/globals/reset.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/globals/reset.variables

@@ -0,0 +1,3 @@
+/*******************************
+     User Global Variables
+*******************************/

frontend/src/semantic-ui/site/globals/site.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/globals/site.variables

@@ -0,0 +1,21 @@
+/*******************************
+     User Global Variables
+*******************************/
+
+@importGoogleFonts : false;
+@fontName          : 'Open Sans';
+
+@obsColorB4: #114594;
+@obsColorG1: #76520E;
+@obsColorW: #FFFFFF;
+@obsColorB1: #122037;
+@obsColorG6: #EFB509;
+@obsColorS: #000000;
+
+@blue: #80A6CD;
+@green: #78CB5B;
+@orange: #D26911;
+@black: #333333;
+
+@primaryColor: @obsColorB4;
+@secondaryColor: @obsColorG1;

frontend/src/semantic-ui/site/modules/accordion.overrides

@@ -0,0 +1,3 @@
+/*******************************
+        User Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/accordion.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/chatroom.overrides

@@ -0,0 +1,3 @@
+/*******************************
+        User Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/chatroom.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/checkbox.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/checkbox.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/dimmer.overrides

@@ -0,0 +1,3 @@
+/*******************************
+        User Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/dimmer.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/dropdown.overrides

@@ -0,0 +1,3 @@
+/*******************************
+        User Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/dropdown.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/embed.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/modal.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/modal.variables

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/nag.overrides

@@ -0,0 +1,3 @@
+/*******************************
+        User Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/nag.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/popup.overrides

@@ -0,0 +1,3 @@
+/*******************************
+        User Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/popup.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/progress.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/progress.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/rating.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/rating.variables

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/search.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/search.variables

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/shape.overrides

@@ -0,0 +1,3 @@
+/*******************************
+        User Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/shape.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/sidebar.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/sidebar.variables

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/sticky.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/sticky.variables

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/tab.overrides

@@ -0,0 +1,3 @@
+/*******************************
+        User Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/tab.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/transition.overrides

@@ -0,0 +1,3 @@
+/*******************************
+         Site Overrides
+*******************************/

frontend/src/semantic-ui/site/modules/transition.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/views/ad.overrides

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/views/ad.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/views/card.overrides

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/views/card.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/views/comment.overrides

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/views/comment.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/views/feed.overrides

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/views/feed.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/views/item.overrides

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/views/item.variables

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/

frontend/src/semantic-ui/site/views/statistic.overrides

@@ -0,0 +1,3 @@
+/*******************************
+    User Variable Overrides
+*******************************/