diff options
author | Stefan Malzner <stefan@adlk.io> | 2017-11-10 12:08:35 +0100 |
---|---|---|
committer | Stefan Malzner <stefan@adlk.io> | 2017-11-10 12:08:35 +0100 |
commit | f5a9aa21e2ab958f60c143668f4836bc47e2b539 (patch) | |
tree | 7d7cb70dee56e6ca4a927f7789601cc428381659 /src/styles | |
parent | feat(Service): Add option to mute service (diff) | |
download | ferdium-app-f5a9aa21e2ab958f60c143668f4836bc47e2b539.tar.gz ferdium-app-f5a9aa21e2ab958f60c143668f4836bc47e2b539.tar.zst ferdium-app-f5a9aa21e2ab958f60c143668f4836bc47e2b539.zip |
feat(App): Add option to mute all services in sidebar
Diffstat (limited to 'src/styles')
-rw-r--r-- | src/styles/layout.scss | 32 | ||||
-rw-r--r-- | src/styles/tabs.scss | 7 |
2 files changed, 24 insertions, 15 deletions
diff --git a/src/styles/layout.scss b/src/styles/layout.scss index d87df2684..9f32bf2c4 100644 --- a/src/styles/layout.scss +++ b/src/styles/layout.scss | |||
@@ -42,6 +42,7 @@ html { | |||
42 | z-index: 200; | 42 | z-index: 200; |
43 | text-align: center; | 43 | text-align: center; |
44 | color: $theme-text-color; | 44 | color: $theme-text-color; |
45 | padding-bottom: 5px; | ||
45 | 46 | ||
46 | .sidebar__add-service { | 47 | .sidebar__add-service { |
47 | width: 32px; | 48 | width: 32px; |
@@ -52,26 +53,27 @@ html { | |||
52 | color: $theme-gray-light; | 53 | color: $theme-gray-light; |
53 | } | 54 | } |
54 | 55 | ||
55 | .sidebar__settings-button { | 56 | .sidebar__button { |
56 | height: auto; | 57 | width: $theme-sidebar-width; |
57 | padding: 20px 0; | 58 | padding: 10px 0; |
58 | font-size: 12px; | 59 | font-size: 24px; |
59 | position: relative; | 60 | position: relative; |
61 | color: $theme-gray-light; | ||
62 | transition: color 0.25s, transform 0.25s; | ||
60 | 63 | ||
61 | .emoji { | 64 | &:hover { |
62 | position: absolute; | 65 | transform: scale(1.15); |
63 | top: 18px; | 66 | color: darken($theme-gray-light, 10%); |
64 | right: 12px; | 67 | } |
65 | 68 | ||
66 | img { | 69 | &:active { |
67 | width: 18px; | 70 | transition: transform 0.1s; |
68 | } | 71 | transform: scale(1); |
69 | } | 72 | } |
70 | } | ||
71 | 73 | ||
72 | .sidebar__logo { | 74 | &.is-muted { |
73 | width: 40px; | 75 | color: $theme-brand-primary; |
74 | height: auto; | 76 | } |
75 | } | 77 | } |
76 | 78 | ||
77 | & > div { | 79 | & > div { |
diff --git a/src/styles/tabs.scss b/src/styles/tabs.scss index 75568898b..abafdb53c 100644 --- a/src/styles/tabs.scss +++ b/src/styles/tabs.scss | |||
@@ -41,9 +41,16 @@ | |||
41 | } | 41 | } |
42 | } | 42 | } |
43 | 43 | ||
44 | &:hover { | ||
45 | .tab-item__icon { | ||
46 | transform: scale(1.1); | ||
47 | } | ||
48 | } | ||
49 | |||
44 | .tab-item__icon { | 50 | .tab-item__icon { |
45 | width: 30px; | 51 | width: 30px; |
46 | height: auto; | 52 | height: auto; |
53 | transition: transform 0.25s; | ||
47 | } | 54 | } |
48 | 55 | ||
49 | .tab-item__message-count { | 56 | .tab-item__message-count { |