fix style

This commit is contained in:
syuilo 2023-01-10 20:12:38 +09:00
parent c5cfbd99d0
commit e6d666e1ee
1 changed files with 28 additions and 28 deletions

View File

@ -4,13 +4,13 @@
<div v-if="icon" :class="$style.icon"> <div v-if="icon" :class="$style.icon">
<i :class="icon"></i> <i :class="icon"></i>
</div> </div>
<div v-else-if="!input && !select" :class="[$style.icon, type]"> <div v-else-if="!input && !select" :class="[$style.icon, $style['type_' + type]]">
<i v-if="type === 'success'" class="ti ti-check"></i> <i v-if="type === 'success'" :class="$style.iconInner" class="ti ti-check"></i>
<i v-else-if="type === 'error'" class="ti ti-circle-x"></i> <i v-else-if="type === 'error'" :class="$style.iconInner" class="ti ti-circle-x"></i>
<i v-else-if="type === 'warning'" class="ti ti-alert-triangle"></i> <i v-else-if="type === 'warning'" :class="$style.iconInner" class="ti ti-alert-triangle"></i>
<i v-else-if="type === 'info'" class="ti ti-info-circle"></i> <i v-else-if="type === 'info'" :class="$style.iconInner" class="ti ti-info-circle"></i>
<i v-else-if="type === 'question'" class="ti ti-question-circle"></i> <i v-else-if="type === 'question'" :class="$style.iconInner" class="ti ti-question-circle"></i>
<MkLoading v-else-if="type === 'waiting'" :em="true"/> <MkLoading v-else-if="type === 'waiting'" :class="$style.iconInner" :em="true"/>
</div> </div>
<header v-if="title" :class="$style.title"><Mfm :text="title"/></header> <header v-if="title" :class="$style.title"><Mfm :text="title"/></header>
<div v-if="text" :class="$style.text"><Mfm :text="text"/></div> <div v-if="text" :class="$style.text"><Mfm :text="text"/></div>
@ -158,30 +158,30 @@ onBeforeUnmount(() => {
.icon { .icon {
font-size: 24px; font-size: 24px;
&.info { & + .title {
color: #55c4dd; margin-top: 8px;
}
} }
&.success { .iconInner {
color: var(--success);
}
&.error {
color: var(--error);
}
&.warning {
color: var(--warn);
}
> * {
display: block; display: block;
margin: 0 auto; margin: 0 auto;
} }
& + .title { .type_info {
margin-top: 8px; color: #55c4dd;
} }
.type_success {
color: var(--success);
}
.type_error {
color: var(--error);
}
.type_warning {
color: var(--warn);
} }
.title { .title {