From 7dd2ee28d70f17da4116f1b1e7c3a0ffe6f99988 Mon Sep 17 00:00:00 2001 From: mariusz-sm Date: Mon, 25 Jan 2021 17:15:49 +0100 Subject: [PATCH 1/6] Add scss files --- styles/SASS/_animations.scss | 0 styles/SASS/_config.scss | 0 styles/SASS/_fight-view.scss | 0 styles/SASS/_loading-view.scss | 0 styles/SASS/_pokemon-choose-view.scss | 0 styles/SASS/_responsive-view.scss | 0 styles/SASS/_start-view.scss | 0 styles/SASS/app.scss | 0 styles/app.css | 0 9 files changed, 0 insertions(+), 0 deletions(-) create mode 100644 styles/SASS/_animations.scss create mode 100644 styles/SASS/_config.scss create mode 100644 styles/SASS/_fight-view.scss create mode 100644 styles/SASS/_loading-view.scss create mode 100644 styles/SASS/_pokemon-choose-view.scss create mode 100644 styles/SASS/_responsive-view.scss create mode 100644 styles/SASS/_start-view.scss create mode 100644 styles/SASS/app.scss create mode 100644 styles/app.css diff --git a/styles/SASS/_animations.scss b/styles/SASS/_animations.scss new file mode 100644 index 0000000..e69de29 diff --git a/styles/SASS/_config.scss b/styles/SASS/_config.scss new file mode 100644 index 0000000..e69de29 diff --git a/styles/SASS/_fight-view.scss b/styles/SASS/_fight-view.scss new file mode 100644 index 0000000..e69de29 diff --git a/styles/SASS/_loading-view.scss b/styles/SASS/_loading-view.scss new file mode 100644 index 0000000..e69de29 diff --git a/styles/SASS/_pokemon-choose-view.scss b/styles/SASS/_pokemon-choose-view.scss new file mode 100644 index 0000000..e69de29 diff --git a/styles/SASS/_responsive-view.scss b/styles/SASS/_responsive-view.scss new file mode 100644 index 0000000..e69de29 diff --git a/styles/SASS/_start-view.scss b/styles/SASS/_start-view.scss new file mode 100644 index 0000000..e69de29 diff --git a/styles/SASS/app.scss b/styles/SASS/app.scss new file mode 100644 index 0000000..e69de29 diff --git a/styles/app.css b/styles/app.css new file mode 100644 index 0000000..e69de29 From 1f42c052d622a8a05c817d9472cd4945bb2b96bc Mon Sep 17 00:00:00 2001 From: mariusz-sm Date: Mon, 25 Jan 2021 17:45:07 +0100 Subject: [PATCH 2/6] Import files to app.scss and add placeholders --- styles/SASS/_animations.scss | 1 + styles/SASS/_config.scss | 5 +++++ styles/SASS/_resets.scss | 5 +++++ styles/SASS/_responsive-view.scss | 1 + styles/SASS/app.scss | 33 +++++++++++++++++++++++++++++++ styles/app.css | 12 +++++++++++ 6 files changed, 57 insertions(+) create mode 100644 styles/SASS/_resets.scss diff --git a/styles/SASS/_animations.scss b/styles/SASS/_animations.scss index e69de29..f5c60ee 100644 --- a/styles/SASS/_animations.scss +++ b/styles/SASS/_animations.scss @@ -0,0 +1 @@ +// Placeholder for animations (keyframes) \ No newline at end of file diff --git a/styles/SASS/_config.scss b/styles/SASS/_config.scss index e69de29..4ffc8ee 100644 --- a/styles/SASS/_config.scss +++ b/styles/SASS/_config.scss @@ -0,0 +1,5 @@ +// Placeholder for variables, colors, mixins etc. + +// Example of variable +$background-color: white; +$text-color: black; \ No newline at end of file diff --git a/styles/SASS/_resets.scss b/styles/SASS/_resets.scss new file mode 100644 index 0000000..b6f0eb2 --- /dev/null +++ b/styles/SASS/_resets.scss @@ -0,0 +1,5 @@ +* { + box-sizing: border-box; + margin: 0; + padding: 0; +} \ No newline at end of file diff --git a/styles/SASS/_responsive-view.scss b/styles/SASS/_responsive-view.scss index e69de29..aeb8e82 100644 --- a/styles/SASS/_responsive-view.scss +++ b/styles/SASS/_responsive-view.scss @@ -0,0 +1 @@ +// Placeholder for @media-query-breakpoints \ No newline at end of file diff --git a/styles/SASS/app.scss b/styles/SASS/app.scss index e69de29..12ee405 100644 --- a/styles/SASS/app.scss +++ b/styles/SASS/app.scss @@ -0,0 +1,33 @@ +@import './resets'; +@import './loading-view'; +@import './start-view'; +@import './pokemon-choose-view'; +@import './fight-view'; +@import './animations'; +@import './config'; +@import './responsive-view'; + +body { + background-color: $background-color; + color: $text-color; +} + +footer { + // ... +} + +p { + // ... +} + +a { + // ... +} + +h1 { + // ... +} + +h2 { + // ... +} \ No newline at end of file diff --git a/styles/app.css b/styles/app.css index e69de29..7283d98 100644 --- a/styles/app.css +++ b/styles/app.css @@ -0,0 +1,12 @@ +* { + -webkit-box-sizing: border-box; + box-sizing: border-box; + margin: 0; + padding: 0; +} + +body { + background-color: white; + color: black; +} +/*# sourceMappingURL=app.css.map */ \ No newline at end of file From 7ac801d454f080ad88f68a0bc5ff67b951292ea3 Mon Sep 17 00:00:00 2001 From: mariusz-sm Date: Mon, 25 Jan 2021 18:04:13 +0100 Subject: [PATCH 3/6] Add mixin to responsive-view --- styles/SASS/_config.scss | 3 ++- styles/SASS/_responsive-view.scss | 10 +++++++++- 2 files changed, 11 insertions(+), 2 deletions(-) diff --git a/styles/SASS/_config.scss b/styles/SASS/_config.scss index 4ffc8ee..d54fe0b 100644 --- a/styles/SASS/_config.scss +++ b/styles/SASS/_config.scss @@ -2,4 +2,5 @@ // Example of variable $background-color: white; -$text-color: black; \ No newline at end of file +$text-color: black; +$mobile: 800px; \ No newline at end of file diff --git a/styles/SASS/_responsive-view.scss b/styles/SASS/_responsive-view.scss index aeb8e82..1bd93e7 100644 --- a/styles/SASS/_responsive-view.scss +++ b/styles/SASS/_responsive-view.scss @@ -1 +1,9 @@ -// Placeholder for @media-query-breakpoints \ No newline at end of file +// Placeholder for @media-query-breakpoints + +@import './config' + +@mixins mobile { + @media (max-width: $mobile) { + @content + } +} \ No newline at end of file From 0fa92b879070456e2bda160fb39a03b8ccb19fa3 Mon Sep 17 00:00:00 2001 From: mariusz-sm Date: Tue, 26 Jan 2021 10:30:18 +0100 Subject: [PATCH 4/6] Change config import order --- styles/SASS/app.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/styles/SASS/app.scss b/styles/SASS/app.scss index 12ee405..2d68b21 100644 --- a/styles/SASS/app.scss +++ b/styles/SASS/app.scss @@ -1,10 +1,10 @@ @import './resets'; +@import './config'; @import './loading-view'; @import './start-view'; @import './pokemon-choose-view'; @import './fight-view'; @import './animations'; -@import './config'; @import './responsive-view'; body { From 088971a7e65e9226a2905aa2292ae1088bb00f1e Mon Sep 17 00:00:00 2001 From: mariusz-sm Date: Tue, 26 Jan 2021 12:37:23 +0100 Subject: [PATCH 5/6] Add comments to files --- styles/SASS/_fight-view.scss | 1 + styles/SASS/_loading-view.scss | 1 + styles/SASS/_pokemon-choose-view.scss | 1 + styles/SASS/_responsive-view.scss | 4 +--- styles/SASS/_start-view.scss | 1 + styles/SASS/app.scss | 5 +++++ 6 files changed, 10 insertions(+), 3 deletions(-) diff --git a/styles/SASS/_fight-view.scss b/styles/SASS/_fight-view.scss index e69de29..faf8c07 100644 --- a/styles/SASS/_fight-view.scss +++ b/styles/SASS/_fight-view.scss @@ -0,0 +1 @@ +// Styles for pokemon fighting screen. Common elements should be added to _config.scss in mixins. \ No newline at end of file diff --git a/styles/SASS/_loading-view.scss b/styles/SASS/_loading-view.scss index e69de29..c1297a4 100644 --- a/styles/SASS/_loading-view.scss +++ b/styles/SASS/_loading-view.scss @@ -0,0 +1 @@ +// Styles for loading screen. Common elements should be added to _config.scss in mixins. \ No newline at end of file diff --git a/styles/SASS/_pokemon-choose-view.scss b/styles/SASS/_pokemon-choose-view.scss index e69de29..988b14f 100644 --- a/styles/SASS/_pokemon-choose-view.scss +++ b/styles/SASS/_pokemon-choose-view.scss @@ -0,0 +1 @@ +// Styles for pokemon choosing screen. Common elements should be added to _config.scss in mixins. \ No newline at end of file diff --git a/styles/SASS/_responsive-view.scss b/styles/SASS/_responsive-view.scss index 1bd93e7..c149e58 100644 --- a/styles/SASS/_responsive-view.scss +++ b/styles/SASS/_responsive-view.scss @@ -1,9 +1,7 @@ // Placeholder for @media-query-breakpoints -@import './config' - @mixins mobile { - @media (max-width: $mobile) { + @media (max-width: 800px) { @content } } \ No newline at end of file diff --git a/styles/SASS/_start-view.scss b/styles/SASS/_start-view.scss index e69de29..fb4c1f9 100644 --- a/styles/SASS/_start-view.scss +++ b/styles/SASS/_start-view.scss @@ -0,0 +1 @@ +// Styles for start page. Common elements should be added to _config.scss in mixins. \ No newline at end of file diff --git a/styles/SASS/app.scss b/styles/SASS/app.scss index 2d68b21..768c8b3 100644 --- a/styles/SASS/app.scss +++ b/styles/SASS/app.scss @@ -1,3 +1,8 @@ +// File should contains: +// - styles for body, footer, p, h1, ... +// - styles for buttons and scrollbars +// - imports for rest of _.scss files + @import './resets'; @import './config'; @import './loading-view'; From a92e0cd21ff99c6cf4cd0373b7ad0908f6959fa5 Mon Sep 17 00:00:00 2001 From: mariusz-sm Date: Tue, 26 Jan 2021 12:43:53 +0100 Subject: [PATCH 6/6] Add mixin to config file --- styles/SASS/_config.scss | 9 ++++++++- styles/SASS/_responsive-view.scss | 5 ----- 2 files changed, 8 insertions(+), 6 deletions(-) diff --git a/styles/SASS/_config.scss b/styles/SASS/_config.scss index d54fe0b..41f2366 100644 --- a/styles/SASS/_config.scss +++ b/styles/SASS/_config.scss @@ -3,4 +3,11 @@ // Example of variable $background-color: white; $text-color: black; -$mobile: 800px; \ No newline at end of file +$mobile: 800px; + + +@mixins mobile { + @media (max-width: $mobile) { + @content + } +} \ No newline at end of file diff --git a/styles/SASS/_responsive-view.scss b/styles/SASS/_responsive-view.scss index c149e58..5f10aaa 100644 --- a/styles/SASS/_responsive-view.scss +++ b/styles/SASS/_responsive-view.scss @@ -1,7 +1,2 @@ // Placeholder for @media-query-breakpoints -@mixins mobile { - @media (max-width: 800px) { - @content - } -} \ No newline at end of file