Fix subline hint

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
This commit is contained in:
John Molakvoæ (skjnldsv) 2020-10-02 12:07:38 +02:00 committed by Joas Schilling
parent be778c94e1
commit 097d62049d
No known key found for this signature in database
GPG Key ID: 7076EA9751AACDDA
6 changed files with 27 additions and 15 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -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>

View File

@ -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 {