Fix subline hint
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
This commit is contained in:
parent
be778c94e1
commit
097d62049d
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
|
@ -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>
|
||||
|
|
|
@ -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 {
|
||||
|
|
Loading…
Reference in New Issue