diff options
Diffstat (limited to 'src/styles')
-rw-r--r-- | src/styles/layout.scss | 13 | ||||
-rw-r--r-- | src/styles/settings.scss | 9 |
2 files changed, 16 insertions, 6 deletions
diff --git a/src/styles/layout.scss b/src/styles/layout.scss index 9a003a922..e858b7904 100644 --- a/src/styles/layout.scss +++ b/src/styles/layout.scss | |||
@@ -18,8 +18,14 @@ html { overflow: hidden; } | |||
18 | font-size: 22px; | 18 | font-size: 22px; |
19 | 19 | ||
20 | &:hover, | 20 | &:hover, |
21 | &:active { color: $dark-theme-gray-smoke; } | 21 | &:active { |
22 | &.is-muted { color: $theme-brand-primary; } | 22 | color: $dark-theme-gray-smoke; |
23 | } | ||
24 | |||
25 | &.is-muted, | ||
26 | &.is-active { | ||
27 | color: $theme-brand-primary; | ||
28 | } | ||
23 | } | 29 | } |
24 | } | 30 | } |
25 | 31 | ||
@@ -33,6 +39,7 @@ html { overflow: hidden; } | |||
33 | .app__content { display: flex; } | 39 | .app__content { display: flex; } |
34 | 40 | ||
35 | .app__service { | 41 | .app__service { |
42 | position: relative; | ||
36 | display: flex; | 43 | display: flex; |
37 | flex: 1; | 44 | flex: 1; |
38 | flex-direction: column; | 45 | flex-direction: column; |
@@ -84,7 +91,7 @@ html { overflow: hidden; } | |||
84 | 91 | ||
85 | &:hover, | 92 | &:hover, |
86 | &:active { color: lighten($theme-gray-light, 10%); } | 93 | &:active { color: lighten($theme-gray-light, 10%); } |
87 | &.is-muted { color: $theme-brand-primary; } | 94 | &.is-muted, &.is-active { color: $theme-brand-primary; } |
88 | &--new-service { padding-bottom: 6px; } | 95 | &--new-service { padding-bottom: 6px; } |
89 | } | 96 | } |
90 | 97 | ||
diff --git a/src/styles/settings.scss b/src/styles/settings.scss index 750b6bedd..dd6f56d2b 100644 --- a/src/styles/settings.scss +++ b/src/styles/settings.scss | |||
@@ -68,7 +68,7 @@ | |||
68 | } | 68 | } |
69 | } | 69 | } |
70 | 70 | ||
71 | .premium-info { | 71 | .premium-info { |
72 | background: $dark-theme-gray-darker; | 72 | background: $dark-theme-gray-darker; |
73 | border: 2px solid $theme-brand-primary; | 73 | border: 2px solid $theme-brand-primary; |
74 | } | 74 | } |
@@ -414,6 +414,7 @@ | |||
414 | 414 | ||
415 | .settings-navigation__link { | 415 | .settings-navigation__link { |
416 | align-items: center; | 416 | align-items: center; |
417 | justify-content: space-between; | ||
417 | color: $theme-text-color; | 418 | color: $theme-text-color; |
418 | display: flex; | 419 | display: flex; |
419 | flex-shrink: 0; | 420 | flex-shrink: 0; |
@@ -425,7 +426,9 @@ | |||
425 | &:hover { | 426 | &:hover { |
426 | background: darken($theme-gray-lightest, 5%); | 427 | background: darken($theme-gray-lightest, 5%); |
427 | 428 | ||
428 | .badge { background: #FFF; } | 429 | .badge { |
430 | background: #FFF; | ||
431 | } | ||
429 | } | 432 | } |
430 | 433 | ||
431 | &.is-active { | 434 | &.is-active { |
@@ -442,8 +445,8 @@ | |||
442 | .settings-navigation__expander { flex: 1; } | 445 | .settings-navigation__expander { flex: 1; } |
443 | 446 | ||
444 | .badge { | 447 | .badge { |
448 | |||
445 | display: initial; | 449 | display: initial; |
446 | margin-left: 5px; | ||
447 | transition: background $theme-transition-time, color $theme-transition-time; | 450 | transition: background $theme-transition-time, color $theme-transition-time; |
448 | } | 451 | } |
449 | 452 | ||