aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--src/app.js2
-rw-r--r--src/app.scss72
-rw-r--r--src/styles/app.scss4
-rw-r--r--src/styles/landscape.scss12
-rw-r--r--src/styles/main.scss29
-rw-r--r--src/styles/portrait.scss12
-rw-r--r--src/styles/svg.scss18
7 files changed, 76 insertions, 73 deletions
diff --git a/src/app.js b/src/app.js
index c62f79e..7c9b244 100644
--- a/src/app.js
+++ b/src/app.js
@@ -5,4 +5,4 @@ console.log('Arrancada la aplicaciĆ³n compilando CSS y SaSS');
/* CSS */
// import 'bootstrap/dist/css/bootstrap.min.css';
-import './app.scss';
+import './styles/app.scss';
diff --git a/src/app.scss b/src/app.scss
deleted file mode 100644
index 40d2929..0000000
--- a/src/app.scss
+++ /dev/null
@@ -1,72 +0,0 @@
-@media (orientation: portrait) {
-
- html {
- background-image: url('./images/vertical_background.png');
- }
-
- body {
- .item {
- flex-basis: 33%;
- }
- }
-}
-
-@media (orientation: landscape) {
-
- html {
- background-image: url('./images/horizontal_background.png');
- }
-
- body {
- .item {
- flex-basis: 25%;
- }
- }
-}
-
-html {
- height: 100%;
- background-size: cover;
-}
-
-body {
- font-size: 1.2rem;
- font-family: Arial;
- color: #999999;
- margin: 5%;
-
- svg {
- path,
- polygon,
- linearGradient,
- rect {
- fill: #00ADDC !important;
- }
-
- circle {
- fill: none !important;
- }
-
- text {
- display: none !important;
- }
- }
-
- .parent {
- display: flex;
- flex-direction: row;
- flex-wrap: wrap;
- justify-content: flex-start;
- align-items: flex-start;
- height: 100%;
-
- .item {
- .name {
- width: 100%;
- text-align: center;
- text-transform: uppercase;
- margin-top: -20%;
- }
- }
- }
-} \ No newline at end of file
diff --git a/src/styles/app.scss b/src/styles/app.scss
new file mode 100644
index 0000000..f986a37
--- /dev/null
+++ b/src/styles/app.scss
@@ -0,0 +1,4 @@
+@import "main.scss";
+@import "svg.scss";
+@import "portrait.scss";
+@import "landscape.scss"; \ No newline at end of file
diff --git a/src/styles/landscape.scss b/src/styles/landscape.scss
new file mode 100644
index 0000000..39ac270
--- /dev/null
+++ b/src/styles/landscape.scss
@@ -0,0 +1,12 @@
+@media (orientation: landscape) {
+
+ html {
+ background-image: url('../images/horizontal_background.png');
+ }
+
+ body {
+ .item {
+ flex-basis: 25%;
+ }
+ }
+} \ No newline at end of file
diff --git a/src/styles/main.scss b/src/styles/main.scss
new file mode 100644
index 0000000..226509e
--- /dev/null
+++ b/src/styles/main.scss
@@ -0,0 +1,29 @@
+html {
+ height: 100%;
+ background-size: cover;
+}
+
+body {
+ font-size: 1.2rem;
+ font-family: Arial;
+ color: #999999;
+ margin: 5%;
+
+ .parent {
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ justify-content: flex-start;
+ align-items: flex-start;
+ height: 100%;
+
+ .item {
+ .name {
+ width: 100%;
+ text-align: center;
+ text-transform: uppercase;
+ margin-top: -20%;
+ }
+ }
+ }
+} \ No newline at end of file
diff --git a/src/styles/portrait.scss b/src/styles/portrait.scss
new file mode 100644
index 0000000..a4eb732
--- /dev/null
+++ b/src/styles/portrait.scss
@@ -0,0 +1,12 @@
+@media (orientation: portrait) {
+
+ html {
+ background-image: url('../images/vertical_background.png');
+ }
+
+ body {
+ .item {
+ flex-basis: 33%;
+ }
+ }
+} \ No newline at end of file
diff --git a/src/styles/svg.scss b/src/styles/svg.scss
new file mode 100644
index 0000000..eddbbe5
--- /dev/null
+++ b/src/styles/svg.scss
@@ -0,0 +1,18 @@
+body {
+ svg {
+ path,
+ polygon,
+ linearGradient,
+ rect {
+ fill: #00ADDC !important;
+ }
+
+ circle {
+ fill: none !important;
+ }
+
+ text {
+ display: none !important;
+ }
+ }
+} \ No newline at end of file