From bf9928998d5f44d50f322ff3a65851de25e94d1b Mon Sep 17 00:00:00 2001
From: Juan Ferrer Toribio <juan.ferrer.toribio@gmail.com>
Date: Tue, 22 Nov 2016 13:05:08 +0100
Subject: [PATCH] Colores

---
 @salix/app/src/app.js                 |  1 +
 @salix/app/src/styles/background.scss | 27 +++++++++++++++++++++++++++
 @salix/app/src/styles/colors.scss     |  7 +++++++
 @salix/app/src/styles/font-family.css | 24 ++++++++++++++++++++++++
 4 files changed, 59 insertions(+)
 create mode 100644 @salix/app/src/styles/background.scss
 create mode 100644 @salix/app/src/styles/colors.scss
 create mode 100644 @salix/app/src/styles/font-family.css

diff --git a/@salix/app/src/app.js b/@salix/app/src/app.js
index b547526438..43dab4a889 100644
--- a/@salix/app/src/app.js
+++ b/@salix/app/src/app.js
@@ -5,5 +5,6 @@ import * as routes from './configroutes';
 import padding from './styles/layout.css'
 import margin from './styles/margin.scss'
 import layout from './styles/padding.scss'
+import background from './styles/background.scss'
 
 bootstrap();
diff --git a/@salix/app/src/styles/background.scss b/@salix/app/src/styles/background.scss
new file mode 100644
index 0000000000..bb0769388b
--- /dev/null
+++ b/@salix/app/src/styles/background.scss
@@ -0,0 +1,27 @@
+@import "colors";
+
+$bg-main: $color-green;
+$bg-minor: $color-orange;
+$bg-content: $color-light-grey;
+$bg-panel: $color-white;
+$bg-dark-bar: $color-black;
+$bg-dark-menu: $color-dark-grey;
+
+html [bg-main], .bg-main {
+  background-color: $bg-main;
+}
+html [bg-minor], .bg-minor {
+  background-color: $bg-minor;
+}
+html [bg-content], .bg-content {
+  background-color: $bg-content;
+}
+html [bg-panel], .bg-panel {
+  background-color: $bg-panel;
+}
+html [bg-dark-bar], .bg-dark-bar {
+   background-color: $bg-dark-bar;
+}
+html [bg-dark-menu], .bg-dark-menu {
+  background-color: darken($bg-dark-menu, 35%);
+}
diff --git a/@salix/app/src/styles/colors.scss b/@salix/app/src/styles/colors.scss
new file mode 100644
index 0000000000..dc752f510e
--- /dev/null
+++ b/@salix/app/src/styles/colors.scss
@@ -0,0 +1,7 @@
+
+$color-green: rgb(139,195,74);
+$color-orange: rgb(255,171,64);
+$color-dark-grey: #424242;
+$color-light-grey: gray;
+$color-white: white;
+$color-black: black;
diff --git a/@salix/app/src/styles/font-family.css b/@salix/app/src/styles/font-family.css
new file mode 100644
index 0000000000..2122baa095
--- /dev/null
+++ b/@salix/app/src/styles/font-family.css
@@ -0,0 +1,24 @@
+@font-face {
+    font-family: roboto-italic;
+    src: url(./fonts/Roboto-Italic.ttf);
+}
+@font-face {
+    font-family: roboto-thin;
+    src: url(./fonts/Roboto-Thin.ttf);
+}
+@font-face {
+    font-family: roboto-regular;
+    src: url(./fonts/Roboto-Regular.ttf);
+}
+@font-face {
+    font-family: roboto-condensed-italic;
+    src: url(./fonts/Roboto-CondensedItalic.ttf);
+}
+@font-face {
+    font-family: roboto-bold;
+    src: url(./fonts/Roboto-Bold.ttf);
+}
+@font-face {
+    font-family: roboto-bold-condensed;
+    src: url(./fonts/Roboto-BoldCondensed.ttf);
+}