diff options
Diffstat (limited to 'src/styles')
-rw-r--r-- | src/styles/layout.scss | 33 | ||||
-rw-r--r-- | src/styles/radio.scss | 4 | ||||
-rw-r--r-- | src/styles/settings.scss | 13 | ||||
-rw-r--r-- | src/styles/tabs.scss | 4 | ||||
-rw-r--r-- | src/styles/type.scss | 4 |
5 files changed, 52 insertions, 6 deletions
diff --git a/src/styles/layout.scss b/src/styles/layout.scss index b18bd6dcf..a7de4b247 100644 --- a/src/styles/layout.scss +++ b/src/styles/layout.scss | |||
@@ -2,6 +2,18 @@ | |||
2 | 2 | ||
3 | html { overflow: hidden; } | 3 | html { overflow: hidden; } |
4 | 4 | ||
5 | @keyframes pulse-danger { | ||
6 | 0% { | ||
7 | background: darken($theme-brand-danger, 10%); | ||
8 | } | ||
9 | 50% { | ||
10 | background: lighten($theme-brand-danger, 10%); | ||
11 | } | ||
12 | 100% { | ||
13 | background: darken($theme-brand-danger, 10%); | ||
14 | } | ||
15 | } | ||
16 | |||
5 | .theme__dark .app { | 17 | .theme__dark .app { |
6 | .sidebar { | 18 | .sidebar { |
7 | background: $dark-theme-gray-darker; | 19 | background: $dark-theme-gray-darker; |
@@ -26,6 +38,27 @@ html { overflow: hidden; } | |||
26 | &.is-active { | 38 | &.is-active { |
27 | color: $theme-brand-primary; | 39 | color: $theme-brand-primary; |
28 | } | 40 | } |
41 | |||
42 | .update-availible { | ||
43 | align-items: center; | ||
44 | background: $theme-brand-danger; | ||
45 | border-radius: 20px; | ||
46 | bottom: 5px; | ||
47 | color: #FFF; | ||
48 | display: flex; | ||
49 | justify-content: center; | ||
50 | padding: 0px 5px; | ||
51 | position: absolute; | ||
52 | right: 16px; | ||
53 | padding-top: 0; | ||
54 | font-size: 0px; | ||
55 | min-height: 15px; | ||
56 | min-width: 15px; | ||
57 | |||
58 | animation-name: pulse-danger; | ||
59 | animation-duration: 0.75s; | ||
60 | animation-iteration-count: 6; | ||
61 | } | ||
29 | } | 62 | } |
30 | } | 63 | } |
31 | 64 | ||
diff --git a/src/styles/radio.scss b/src/styles/radio.scss index 87d401215..b1e148ca0 100644 --- a/src/styles/radio.scss +++ b/src/styles/radio.scss | |||
@@ -30,7 +30,9 @@ | |||
30 | 30 | ||
31 | &.is-selected { | 31 | &.is-selected { |
32 | background: #FFF; | 32 | background: #FFF; |
33 | border: 2px solid $theme-brand-primary; | 33 | border-width: 2px; |
34 | border-style: solid; | ||
35 | border-color: $theme-brand-primary; | ||
34 | color: $theme-brand-primary; | 36 | color: $theme-brand-primary; |
35 | } | 37 | } |
36 | 38 | ||
diff --git a/src/styles/settings.scss b/src/styles/settings.scss index bb95ab5d2..753288b8d 100644 --- a/src/styles/settings.scss +++ b/src/styles/settings.scss | |||
@@ -59,7 +59,9 @@ | |||
59 | 59 | ||
60 | .premium-info { | 60 | .premium-info { |
61 | background: $dark-theme-gray-darker; | 61 | background: $dark-theme-gray-darker; |
62 | border: 2px solid $theme-brand-primary; | 62 | border-width: 2px; |
63 | border-style: solid; | ||
64 | border-color: $theme-brand-primary; | ||
63 | } | 65 | } |
64 | .legal { color: $theme-gray-light; } | 66 | .legal { color: $theme-gray-light; } |
65 | } | 67 | } |
@@ -170,7 +172,9 @@ | |||
170 | } | 172 | } |
171 | 173 | ||
172 | .separator { | 174 | .separator { |
173 | border-right: 1px solid darken($theme-brand-primary, 8%); | 175 | border-right-width: 1px; |
176 | border-right-style: solid; | ||
177 | border-right-color: $theme-brand-primary; | ||
174 | height: 100%; | 178 | height: 100%; |
175 | margin: 0 15px; | 179 | margin: 0 15px; |
176 | transform: skew(15deg) rotate(2deg); | 180 | transform: skew(15deg) rotate(2deg); |
@@ -224,7 +228,7 @@ | |||
224 | 228 | ||
225 | .settings__close { | 229 | .settings__close { |
226 | background: $theme-brand-primary; | 230 | background: $theme-brand-primary; |
227 | border-left: 1px solid darken($theme-brand-primary, 8%); | 231 | // border-left: 1px solid darken($theme-brand-primary, 8%); |
228 | color: #FFF; | 232 | color: #FFF; |
229 | font-size: 20px; | 233 | font-size: 20px; |
230 | height: 50px; | 234 | height: 50px; |
@@ -233,7 +237,9 @@ | |||
233 | right: 0; | 237 | right: 0; |
234 | transition: background $theme-transition-time; | 238 | transition: background $theme-transition-time; |
235 | border-top-right-radius: $theme-border-radius; | 239 | border-top-right-radius: $theme-border-radius; |
240 | cursor: pointer; | ||
236 | 241 | ||
242 | &::before { cursor: pointer; } | ||
237 | &:hover { background: darken($theme-brand-primary, 5%); } | 243 | &:hover { background: darken($theme-brand-primary, 5%); } |
238 | } | 244 | } |
239 | 245 | ||
@@ -296,6 +302,7 @@ | |||
296 | } | 302 | } |
297 | 303 | ||
298 | .settings__delete-button { right: 0; } | 304 | .settings__delete-button { right: 0; } |
305 | .settings__open-dark-mode-button { right: 0; cursor:pointer; } | ||
299 | 306 | ||
300 | .settings__empty-state { | 307 | .settings__empty-state { |
301 | align-items: center; | 308 | align-items: center; |
diff --git a/src/styles/tabs.scss b/src/styles/tabs.scss index ee0858687..e500830ed 100644 --- a/src/styles/tabs.scss +++ b/src/styles/tabs.scss | |||
@@ -34,7 +34,9 @@ | |||
34 | 34 | ||
35 | &.is-active { | 35 | &.is-active { |
36 | background: lighten($theme-brand-primary, 35%); | 36 | background: lighten($theme-brand-primary, 35%); |
37 | border-left: 4px solid $theme-brand-primary; | 37 | border-left-width: 4px; |
38 | border-left-style: solid; | ||
39 | border-left-color: $theme-brand-primary; | ||
38 | 40 | ||
39 | .tab-item__icon { margin-left: -4px; } | 41 | .tab-item__icon { margin-left: -4px; } |
40 | } | 42 | } |
diff --git a/src/styles/type.scss b/src/styles/type.scss index 1b3a905ef..636b8fd36 100644 --- a/src/styles/type.scss +++ b/src/styles/type.scss | |||
@@ -39,7 +39,9 @@ a, button { | |||
39 | 39 | ||
40 | &.button { | 40 | &.button { |
41 | background: none; | 41 | background: none; |
42 | border: 2px solid $theme-brand-primary; | 42 | border-width: 2px; |
43 | border-style: solid; | ||
44 | border-color: $theme-brand-primary; | ||
43 | border-radius: 3px; | 45 | border-radius: 3px; |
44 | color: $theme-brand-primary; | 46 | color: $theme-brand-primary; |
45 | display: inline-block; | 47 | display: inline-block; |