diff --git a/bds/static/bds/config.rb b/bds/static/bds/config.rb
new file mode 100644
index 00000000..5136c518
--- /dev/null
+++ b/bds/static/bds/config.rb
@@ -0,0 +1,25 @@
+require 'compass/import-once/activate'
+# Require any additional compass plugins here.
+
+# Set this to the root of your project when deployed:
+http_path = "/"
+css_dir = "css"
+sass_dir = "sass"
+images_dir = "images"
+javascripts_dir = "javascripts"
+
+# You can select your preferred output style here (can be overridden via the command line):
+# output_style = :expanded or :nested or :compact or :compressed
+
+# To enable relative paths to assets via compass helper functions. Uncomment:
+# relative_assets = true
+
+# To disable debugging comments that display the original location of your selectors. Uncomment:
+# line_comments = false
+
+
+# If you prefer the indented syntax, you might want to regenerate this
+# project again passing --syntax sass, or you can uncomment this:
+# preferred_syntax = :sass
+# and then run:
+# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass
diff --git a/bds/static/bds/css/bds.css b/bds/static/bds/css/bds.css
index ee75334f..b3ab97e8 100644
--- a/bds/static/bds/css/bds.css
+++ b/bds/static/bds/css/bds.css
@@ -1,48 +1,60 @@
+@import url("https://fonts.googleapis.com/css?family=Muli:400,700&display=swap");
+/* line 9, ../sass/bds.scss */
html {
- font-family: sans-serif;
+ font-family: Muli, sans-serif;
height: 100%;
+ color: black;
}
+/* line 15, ../sass/bds.scss */
body {
margin: 0;
- background: #c8e9a0;
+ background: #DC004E;
height: 100%;
}
+/* line 21, ../sass/bds.scss */
header {
- background-color: #545F66;
+ background-color: #76002a;
height: 75px;
}
+/* line 26, ../sass/bds.scss */
h1 {
text-align: center;
- color: #f0f0f0;
+ color: #FBE000;
line-height: 75px;
margin: 0;
}
+/* line 33, ../sass/bds.scss */
h2 {
text-align: center;
- background-color: #6dd3ce;
+ background-color: #ffee62;
padding: 10px 0;
margin: 0;
+ border-bottom: 1px solid #0767A0;
}
+/* line 41, ../sass/bds.scss */
li {
list-style: none;
margin-bottom: 5px;
}
+/* line 46, ../sass/bds.scss */
a {
color: black;
text-decoration: none;
}
+/* line 51, ../sass/bds.scss */
a:hover {
- color: #444;
+ color: #011f32;
text-decoration: underline;
}
+/* line 56, ../sass/bds.scss */
#main-container {
display: flex;
flex-flow: column wrap;
@@ -50,23 +62,31 @@ a:hover {
min-height: calc(100vh - 50px - 75px);
}
+/* line 63, ../sass/bds.scss */
section {
display: flex;
flex-flow: row wrap;
+ width: 100%;
+ max-width: 800px;
+ margin: 0 auto;
+ flex-wrap: wrap;
}
+/* line 72, ../sass/bds.scss */
article {
flex: 1;
margin: 30px;
/* background: #90baad; */
- background: white;
+ background: #FFF9CB;
+ min-width: 300px;
}
+/* line 80, ../sass/bds.scss */
footer {
text-align: center;
line-height: 50px;
height: 50px;
- background-color: #545F66;
+ background-color: #76002a;
color: #f0f0f0;
width: 100%;
}
diff --git a/bds/static/bds/sass/bds.scss b/bds/static/bds/sass/bds.scss
new file mode 100644
index 00000000..ffbf46ad
--- /dev/null
+++ b/bds/static/bds/sass/bds.scss
@@ -0,0 +1,87 @@
+@import url('https://fonts.googleapis.com/css?family=Muli:400,700&display=swap');
+
+$main: #DC004E;
+$aux1: #FBE000;
+$aux2: #0767A0;
+$white: #FFF9CB;
+$black: darken(#013352, 20%);
+
+html {
+ font-family: Muli, sans-serif;
+ height: 100%;
+ color: $black;
+}
+
+body {
+ margin: 0;
+ background: $main;
+ height: 100%;
+}
+
+header {
+ background-color: darken($main, 20%);
+ height: 75px;
+}
+
+h1 {
+ text-align: center;
+ color: $aux1;
+ line-height: 75px;
+ margin: 0;
+}
+
+h2 {
+ text-align: center;
+ background-color: lighten($aux1, 20%);
+ padding: 10px 0;
+ margin: 0;
+ border-bottom: 1px solid $aux2;
+}
+
+li {
+ list-style: none;
+ margin-bottom: 5px;
+}
+
+a {
+ color: black;
+ text-decoration: none;
+}
+
+a:hover {
+ color: lighten($black, 10%);
+ text-decoration: underline;
+}
+
+#main-container {
+ display: flex;
+ flex-flow: column wrap;
+ font-size: large;
+ min-height: calc(100vh - 50px - 75px);
+}
+
+section {
+ display: flex;
+ flex-flow: row wrap;
+ width: 100%;
+ max-width: 800px;
+ margin: 0 auto;
+ flex-wrap: wrap;
+}
+
+article {
+ flex: 1;
+ margin: 30px;
+ /* background: #90baad; */
+ background: $white;
+ min-width: 300px;
+}
+
+footer {
+ text-align: center;
+ line-height: 50px;
+ height: 50px;
+ background-color: darken($main, 20%);
+ color: #f0f0f0;
+ width: 100%;
+}
diff --git a/bds/templates/bds/base.html b/bds/templates/bds/base.html
index 019bdbf6..5c2e5b01 100644
--- a/bds/templates/bds/base.html
+++ b/bds/templates/bds/base.html
@@ -15,6 +15,16 @@
- {% block content %}{% endblock %}
+
+
+ {% block content %}{% endblock %}
+
+