diff options
| author | John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com> | 2020-10-02 13:07:38 +0300 |
|---|---|---|
| committer | John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com> | 2020-10-02 13:13:53 +0300 |
| commit | 9dfea4e982d52548eedb4024060f033499ab29be (patch) | |
| tree | 094dc1e38afa37aa577345f8b824a08b3e313a9c /apps/user_status/src | |
| parent | 905e1918d2796b9a79025283cd6edf2c40f49d77 (diff) | |
Fix subline hint
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
Diffstat (limited to 'apps/user_status/src')
| -rw-r--r-- | apps/user_status/src/components/OnlineStatusSelect.vue | 21 | ||||
| -rw-r--r-- | apps/user_status/src/components/SetStatusModal.vue | 9 |
2 files changed, 21 insertions, 9 deletions
diff --git a/apps/user_status/src/components/OnlineStatusSelect.vue b/apps/user_status/src/components/OnlineStatusSelect.vue index b03af75681e..d9ce249ad13 100644 --- a/apps/user_status/src/components/OnlineStatusSelect.vue +++ b/apps/user_status/src/components/OnlineStatusSelect.vue @@ -28,7 +28,8 @@ name="user-status-online" @change="onChange"> <label :for="id" :class="icon" class="user-status-online-select__label"> - <slot /> + {{ label }} + <em class="user-status-online-select__subline">{{ subline }}</em> </label> </div> </template> @@ -50,6 +51,14 @@ export default { type: String, required: true, }, + label: { + type: String, + required: true, + }, + subline: { + type: String, + default: null, + }, }, computed: { @@ -91,6 +100,11 @@ $label-padding: 8px; background-color: var(--color-background-hover); background-position: $label-padding center; background-size: $icon-size; + + span, + & { + cursor: pointer; + } } &__input:checked + &__label, @@ -98,6 +112,11 @@ $label-padding: 8px; &__label:hover { border-color: var(--color-primary); } + + &__subline { + display: block; + color: var(--color-text-lighter); + } } </style> diff --git a/apps/user_status/src/components/SetStatusModal.vue b/apps/user_status/src/components/SetStatusModal.vue index c6d48d493ce..f651bc62891 100644 --- a/apps/user_status/src/components/SetStatusModal.vue +++ b/apps/user_status/src/components/SetStatusModal.vue @@ -34,10 +34,7 @@ :key="status.type" v-bind="status" :checked="status.type === statusType" - @select="changeStatus"> - {{ status.label }} - <em class="subline">{{ status.subline }}</em> - </OnlineStatusSelect> + @select="changeStatus" /> </div> <!-- Status message --> @@ -248,10 +245,6 @@ export default { // Space between the two sections margin-bottom: 40px; grid-template-columns: 1fr 1fr; - - .subline { - display: block; - } } &__custom-input { |