diff --git a/.bootstraprc b/.bootstraprc
index 340c4f1190b0cb2c8987cc944ee13d37b13d8da3..0507aae30727298d2d6f86ed22a6d8e2df4ec385 100644
--- a/.bootstraprc
+++ b/.bootstraprc
@@ -1,6 +1,6 @@
{
"bootstrapVersion": 4,
- "preBootstrapCustomizations": "./scipost/static/scipost/assets/scss/bootstrap_preconfig.scss",
+ "preBootstrapCustomizations": "./scipost/static/scipost/assets/config/preconfig.scss",
"useFlexbox": true,
"styleLoaders": [
"style",
@@ -23,6 +23,7 @@
"responsive-embed": true,
"close": true,
"utilities": true,
+ "transitions": true,
},
"scripts": {
"collapse": true,
diff --git a/scipost/static/scipost/assets/scss/config.scss b/scipost/static/scipost/assets/config/config.scss
similarity index 100%
rename from scipost/static/scipost/assets/scss/config.scss
rename to scipost/static/scipost/assets/config/config.scss
diff --git a/scipost/static/scipost/assets/scss/preconfig.scss b/scipost/static/scipost/assets/config/preconfig.scss
similarity index 57%
rename from scipost/static/scipost/assets/scss/preconfig.scss
rename to scipost/static/scipost/assets/config/preconfig.scss
index ada9be07731200bdd60ab6573eab4d70b28540ab..5bc0d406428a05f0bb5fe32af7a1232c22aac57a 100644
--- a/scipost/static/scipost/assets/scss/preconfig.scss
+++ b/scipost/static/scipost/assets/config/preconfig.scss
@@ -4,7 +4,11 @@
// Colors
//
-$blue: #6884C2 !default;
+$scipost-lightblue: #6884C2 !default;
+$scipost-darkblue: #002b49 !default;
+
+$blue: $scipost-lightblue !default;
+$body-color: $scipost-darkblue !default;
// Fonts
//
@@ -16,7 +20,7 @@ $font-family-base: $font-family-sans-serif !default;
$font-size-base: 0.8rem !default;
-.form-control,
-.btn {
- font-family: inherit;
-}
+// navbar
+//
+$navbar-light-color: $scipost-darkblue !default;
+$navbar-light-hover-color: $scipost-darkblue !default;
diff --git a/scipost/static/scipost/assets/css/style.css b/scipost/static/scipost/assets/css/style.css
deleted file mode 100644
index c7d2a18383d729ea239da51e92a1fa9d2756bef6..0000000000000000000000000000000000000000
--- a/scipost/static/scipost/assets/css/style.css
+++ /dev/null
@@ -1,14 +0,0 @@
-a {
- color: #6884C2;
- text-decoration: none;
-}
-a:hover {
- color: #103050;
- text-decoration: underline;
-}
-h1, h2, h3, h4, h5, h6 {
- margin: 0;
- padding: 5px 0;
- text-shadow: none;
- font-weight: 500;
-}
diff --git a/scipost/static/scipost/assets/css/style.scss b/scipost/static/scipost/assets/css/style.scss
new file mode 100644
index 0000000000000000000000000000000000000000..478ca033716401bc5b8d5eee0a0be1b9d703091a
--- /dev/null
+++ b/scipost/static/scipost/assets/css/style.scss
@@ -0,0 +1,86 @@
+@import "node_modules/bootstrap/scss/_variables";
+@import "node_modules/bootstrap/scss/_mixins";
+@import "./../config/preconfig.scss";
+/**
+ * Make variables defined in preconfig.scss accessable in this file,
+ * plus default variables and mixins of Bootstrap@4
+ * - SciPost custom sass
+ *
+ */
+
+
+/**
+ * Buttons
+ *
+ */
+.btn {
+ cursor: pointer;
+ font-family: inherit;
+}
+
+/**
+ * Type
+ *
+ */
+a {
+ color: $scipost-lightblue;
+ text-decoration: none;
+}
+a:hover {
+ color: $scipost-darkblue;
+ text-decoration: underline;
+}
+h1, h2, h3, h4, h5, h6 {
+ margin: 0;
+ padding: 5px 0;
+ text-shadow: none;
+ font-weight: 500;
+}
+
+/**
+ * Form
+ *
+ */
+.form-control {
+ font-family: inherit;
+}
+
+/**
+ * Navbar
+ *
+ */
+.navbar {
+ margin-bottom: 0.75rem;
+
+ .nav-link {
+ padding-right: 1rem;
+ padding-left: 1rem;
+ border: 1px solid transparent;
+ border-radius: 0.1rem;
+ -webkit-transition: all 0.2s ease-in-out;
+ -o-transition: all 0.2s ease-in-out;
+ transition: all 0.2s ease-in-out;
+
+ @include hover-focus {
+ background-color: $white;
+ }
+ }
+
+ .active > .nav-link {
+ border-color: $scipost-darkblue;
+ }
+
+ .highlighted > .nav-link {
+ background-color: rgba(255, 255, 255, 0.6);
+ }
+}
+.navbar-brand {
+ height: 38px;
+}
+.navbar-toggler-icon {
+ background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 43, 73, 1.0)");
+}
+.panel {
+ padding: 0.5rem;
+ background-color: #f4f4f4;
+}
diff --git a/scipost/templates/scipost/base.html b/scipost/templates/scipost/base.html
index fc310ba2487607eeb080c448d6d868e7858bf860..f69fa7db79b8b713e79d763ca35302a632eb0cad 100644
--- a/scipost/templates/scipost/base.html
+++ b/scipost/templates/scipost/base.html
@@ -47,9 +47,6 @@
{% render_bundle 'main' 'js' %}
{% render_bundle 'bootstrap' 'js' %}
- <script type="text/javascript" src="{% static 'scipost/global/utils.js' %}"></script>
- <script type="text/javascript" src="{% static 'scipost/global/collapse.js' %}"></script>
-
{% block footer_script %}
{% endblock footer_script %}
</body>
diff --git a/scipost/templates/scipost/header.html b/scipost/templates/scipost/header.html
index e585931b2ba71b9f82bbfbb16da64fd16060cfdb..2f9ddf2da8de3355fb651ceb26017797df7015ca 100644
--- a/scipost/templates/scipost/header.html
+++ b/scipost/templates/scipost/header.html
@@ -5,7 +5,7 @@
<div class="flex-logobox">
<a href="{% url 'scipost:index' %}"><img src="{% static 'scipost/images/logo_scipost_RGB_HTML_groot.png' %}" alt="SciPost logo" width="240" /></a>
</div>
- <div class="flex-blurbbox">
+ <div class="flex-blurbbox hidden-sm-down">
<p>
<i>The complete scientific publication portal</i><br />
<i>Managed by professional scientists</i><br />
diff --git a/scipost/templates/scipost/navbar.html b/scipost/templates/scipost/navbar.html
index 168173e4b8fa6df6b678a5099e541c2d26174d65..a8742b17d79f3a1c11c3adc064b4850c9ce695d1 100644
--- a/scipost/templates/scipost/navbar.html
+++ b/scipost/templates/scipost/navbar.html
@@ -1,4 +1,4 @@
-<nav class="navbar navbar-toggleable-md">
+<nav class="navbar navbar-light navbar-toggleable-md">
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#header-navbar">
<span class="navbar-toggler-icon"></span>
</button>
diff --git a/webpack.config.js b/webpack.config.js
index e479ed9a6d46709891129c5b4c1ba3ab6ed8be24..b41c163e9113774a6f928bbeaf4293722637c5ee 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -8,7 +8,7 @@ var path_bundles = __dirname + '/static_bundles/bundles';
module.exports = {
context: __dirname,
entry: {
- main: glob.sync("./scipost/static/scipost/assets/**/*.@(js|css)"),
+ main: glob.sync("./scipost/static/scipost/assets/**/*.@(js|css|scss)"),
bootstrap: 'bootstrap-loader'
},
output: {
@@ -32,6 +32,13 @@ module.exports = {
loader: "css-loader!less-loader"
})
},
+ {
+ test: /\.scss$/,
+ loader: ExtractTextPlugin.extract({
+ fallbackLoader: "style-loader",
+ loader: "css-loader!sass-loader",
+ })
+ }
]
},
plugins: [