diff options
| author | Georg Ehrke <developer@georgehrke.com> | 2020-08-20 10:48:17 +0300 |
|---|---|---|
| committer | Georg Ehrke <developer@georgehrke.com> | 2020-08-21 12:17:21 +0300 |
| commit | d7a1c01e2a789fd634cbc42156606e224c72aa7d (patch) | |
| tree | 0162d6eed67673c35e30262712606797b8d00c70 /apps/user_status/src | |
| parent | 7c30b612bd704b5dfebc7af4280915035d8447a8 (diff) | |
Change color of displayname and ellipsis status message
Signed-off-by: Georg Ehrke <developer@georgehrke.com>
Diffstat (limited to 'apps/user_status/src')
| -rw-r--r-- | apps/user_status/src/App.vue | 15 |
1 files changed, 12 insertions, 3 deletions
diff --git a/apps/user_status/src/App.vue b/apps/user_status/src/App.vue index 8db000e9f90..7338c8f98c7 100644 --- a/apps/user_status/src/App.vue +++ b/apps/user_status/src/App.vue @@ -31,7 +31,8 @@ <Actions id="user-status-menu-item__subheader" :default-icon="statusIcon" - :menu-title="visibleMessage"> + :menu-title="visibleMessage" + :title="visibleMessage"> <ActionButton v-for="status in statuses" :key="status.type" @@ -244,15 +245,18 @@ export default { </script> <style lang="scss"> +$max-width-user-status: 200px; + li:not(.inline) #user-status-menu-item { &__header { display: block; - color: var(--color-main-text); + box-sizing: border-box; + color: var(--color-text-maxcontrast); padding: 10px 12px 5px 38px; opacity: 1; white-space: nowrap; text-align: left; - max-width: 150px; + max-width: $max-width-user-status; overflow: hidden; text-overflow: ellipsis; } @@ -261,6 +265,8 @@ li:not(.inline) #user-status-menu-item { width: 100%; > button { + display: block; + box-sizing: border-box; background-color: var(--color-main-background); background-position: 12px center; background-size: 16px; @@ -269,6 +275,9 @@ li:not(.inline) #user-status-menu-item { font-weight: normal; padding-left: 38px; opacity: 1; + max-width: $max-width-user-status; + overflow: hidden; + text-overflow: ellipsis; &:hover, &:focus { |