Rename plain to simple for #6653
parent
1578dc4bb0
commit
b263c1eec5
|
@ -4,13 +4,13 @@
|
||||||
</DocSectionText>
|
</DocSectionText>
|
||||||
<div class="card flex justify-center">
|
<div class="card flex justify-center">
|
||||||
<Form v-slot="$form" :resolver="resolver" :initialValues="initialValues" @submit="onFormSubmit" class="flex flex-col gap-4 w-full sm:w-56">
|
<Form v-slot="$form" :resolver="resolver" :initialValues="initialValues" @submit="onFormSubmit" class="flex flex-col gap-4 w-full sm:w-56">
|
||||||
<div class="flex flex-col gap-2">
|
<div class="flex flex-col gap-1">
|
||||||
<InputText name="username" type="text" placeholder="Username" fluid />
|
<InputText name="username" type="text" placeholder="Username" fluid />
|
||||||
<Message v-if="$form.username?.invalid" severity="error">{{ $form.username.error?.message }}</Message>
|
<Message v-if="$form.username?.invalid" severity="error" size="small" variant="simple">{{ $form.username.error?.message }}</Message>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex flex-col gap-2">
|
<div class="flex flex-col gap-1">
|
||||||
<InputText name="email" type="text" placeholder="Email" fluid />
|
<InputText name="email" type="text" placeholder="Email" fluid />
|
||||||
<Message v-if="$form.email?.invalid" severity="error">{{ $form.email.error?.message }}</Message>
|
<Message v-if="$form.email?.invalid" severity="error" size="small" variant="simple">{{ $form.email.error?.message }}</Message>
|
||||||
</div>
|
</div>
|
||||||
<Button type="submit" severity="secondary" label="Submit" />
|
<Button type="submit" severity="secondary" label="Submit" />
|
||||||
</Form>
|
</Form>
|
||||||
|
@ -38,13 +38,13 @@ export default {
|
||||||
code: {
|
code: {
|
||||||
basic: `
|
basic: `
|
||||||
<Form v-slot="$form" :resolver="resolver" :initialValues="initialValues" @submit="onFormSubmit" class="flex justify-center flex-col gap-4">
|
<Form v-slot="$form" :resolver="resolver" :initialValues="initialValues" @submit="onFormSubmit" class="flex justify-center flex-col gap-4">
|
||||||
<div class="flex flex-col gap-2">
|
<div class="flex flex-col gap-1">
|
||||||
<InputText name="username" type="text" placeholder="Username" />
|
<InputText name="username" type="text" placeholder="Username" />
|
||||||
<Message v-if="$form.username?.invalid" severity="error">{{ $form.username.error?.message }}</Message>
|
<Message v-if="$form.username?.invalid" severity="error" size="small" variant="simple">{{ $form.username.error?.message }}</Message>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex flex-col gap-2">
|
<div class="flex flex-col gap-1">
|
||||||
<InputText name="email" type="text" placeholder="Email" />
|
<InputText name="email" type="text" placeholder="Email" />
|
||||||
<Message v-if="$form.email?.invalid" severity="error">{{ $form.email.error?.message }}</Message>
|
<Message v-if="$form.email?.invalid" severity="error" size="small" variant="simple">{{ $form.email.error?.message }}</Message>
|
||||||
</div>
|
</div>
|
||||||
<Button type="submit" severity="secondary" label="Submit" />
|
<Button type="submit" severity="secondary" label="Submit" />
|
||||||
</Form>
|
</Form>
|
||||||
|
@ -53,13 +53,13 @@ export default {
|
||||||
<template>
|
<template>
|
||||||
<div class="card flex justify-center">
|
<div class="card flex justify-center">
|
||||||
<Form v-slot="$form" :resolver="resolver" :initialValues="initialValues" @submit="onFormSubmit" class="flex flex-col gap-4 w-full sm:w-56">
|
<Form v-slot="$form" :resolver="resolver" :initialValues="initialValues" @submit="onFormSubmit" class="flex flex-col gap-4 w-full sm:w-56">
|
||||||
<div class="flex flex-col gap-2">
|
<div class="flex flex-col gap-1">
|
||||||
<InputText name="username" type="text" placeholder="Username" fluid />
|
<InputText name="username" type="text" placeholder="Username" fluid />
|
||||||
<Message v-if="$form.username?.invalid" severity="error">{{ $form.username.error?.message }}</Message>
|
<Message v-if="$form.username?.invalid" severity="error" size="small" variant="simple">{{ $form.username.error?.message }}</Message>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex flex-col gap-2">
|
<div class="flex flex-col gap-1">
|
||||||
<InputText name="email" type="text" placeholder="Email" fluid />
|
<InputText name="email" type="text" placeholder="Email" fluid />
|
||||||
<Message v-if="$form.email?.invalid" severity="error">{{ $form.email.error?.message }}</Message>
|
<Message v-if="$form.email?.invalid" severity="error" size="small" variant="simple">{{ $form.email.error?.message }}</Message>
|
||||||
</div>
|
</div>
|
||||||
<Button type="submit" severity="secondary" label="Submit" />
|
<Button type="submit" severity="secondary" label="Submit" />
|
||||||
</Form>
|
</Form>
|
||||||
|
@ -100,13 +100,13 @@ export default {
|
||||||
<template>
|
<template>
|
||||||
<div class="card flex justify-center">
|
<div class="card flex justify-center">
|
||||||
<Form v-slot="$form" :resolver="resolver" :initialValues="initialValues" @submit="onFormSubmit" class="flex flex-col gap-4 w-full sm:w-56">
|
<Form v-slot="$form" :resolver="resolver" :initialValues="initialValues" @submit="onFormSubmit" class="flex flex-col gap-4 w-full sm:w-56">
|
||||||
<div class="flex flex-col gap-2">
|
<div class="flex flex-col gap-1">
|
||||||
<InputText name="username" type="text" placeholder="Username" fluid />
|
<InputText name="username" type="text" placeholder="Username" fluid />
|
||||||
<Message v-if="$form.username?.invalid" severity="error">{{ $form.username.error?.message }}</Message>
|
<Message v-if="$form.username?.invalid" severity="error" size="small" variant="simple">{{ $form.username.error?.message }}</Message>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex flex-col gap-2">
|
<div class="flex flex-col gap-1">
|
||||||
<InputText name="email" type="text" placeholder="Email" fluid />
|
<InputText name="email" type="text" placeholder="Email" fluid />
|
||||||
<Message v-if="$form.email?.invalid" severity="error">{{ $form.email.error?.message }}</Message>
|
<Message v-if="$form.email?.invalid" severity="error" size="small" variant="simple">{{ $form.email.error?.message }}</Message>
|
||||||
</div>
|
</div>
|
||||||
<Button type="submit" severity="secondary" label="Submit" />
|
<Button type="submit" severity="secondary" label="Submit" />
|
||||||
</Form>
|
</Form>
|
||||||
|
|
|
@ -1,63 +0,0 @@
|
||||||
<template>
|
|
||||||
<DocSectionText v-bind="$attrs">
|
|
||||||
<p>Configure the <i>variant</i> value as <i>plain</i> for messages without borders and backgrounds.</p>
|
|
||||||
</DocSectionText>
|
|
||||||
<div class="card flex flex-wrap gap-4 justify-center">
|
|
||||||
<Message severity="success" variant="plain">Success Message</Message>
|
|
||||||
<Message severity="info" variant="plain">Info Message</Message>
|
|
||||||
<Message severity="warn" variant="plain">Warn Message</Message>
|
|
||||||
<Message severity="error" variant="plain">Error Message</Message>
|
|
||||||
<Message severity="secondary" variant="plain">Secondary Message</Message>
|
|
||||||
<Message severity="contrast" variant="plain">Contrast Message</Message>
|
|
||||||
</div>
|
|
||||||
<DocSectionCode :code="code" />
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
code: {
|
|
||||||
basic: `
|
|
||||||
<Message severity="success" variant="plain">Success Message</Message>
|
|
||||||
<Message severity="info" variant="plain">Info Message</Message>
|
|
||||||
<Message severity="warn" variant="plain">Warn Message</Message>
|
|
||||||
<Message severity="error" variant="plain">Error Message</Message>
|
|
||||||
<Message severity="secondary" variant="plain">Secondary Message</Message>
|
|
||||||
<Message severity="contrast" variant="plain">Contrast Message</Message>
|
|
||||||
`,
|
|
||||||
options: `
|
|
||||||
<template>
|
|
||||||
<div class="card flex flex-wrap gap-4 justify-center">
|
|
||||||
<Message severity="success" variant="plain">Success Message</Message>
|
|
||||||
<Message severity="info" variant="plain">Info Message</Message>
|
|
||||||
<Message severity="warn" variant="plain">Warn Message</Message>
|
|
||||||
<Message severity="error" variant="plain">Error Message</Message>
|
|
||||||
<Message severity="secondary" variant="plain">Secondary Message</Message>
|
|
||||||
<Message severity="contrast" variant="plain">Contrast Message</Message>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
<\/script>
|
|
||||||
`,
|
|
||||||
composition: `
|
|
||||||
<template>
|
|
||||||
<div class="card flex flex-wrap gap-4 justify-center">
|
|
||||||
<Message severity="success" variant="plain">Success Message</Message>
|
|
||||||
<Message severity="info" variant="plain">Info Message</Message>
|
|
||||||
<Message severity="warn" variant="plain">Warn Message</Message>
|
|
||||||
<Message severity="error" variant="plain">Error Message</Message>
|
|
||||||
<Message severity="secondary" variant="plain">Secondary Message</Message>
|
|
||||||
<Message severity="contrast" variant="plain">Contrast Message</Message>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
<\/script>
|
|
||||||
`
|
|
||||||
}
|
|
||||||
};
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
|
@ -0,0 +1,63 @@
|
||||||
|
<template>
|
||||||
|
<DocSectionText v-bind="$attrs">
|
||||||
|
<p>Configure the <i>variant</i> value as <i>simple</i> for messages without borders, backgrounds and paddings.</p>
|
||||||
|
</DocSectionText>
|
||||||
|
<div class="card flex flex-wrap gap-8 justify-center">
|
||||||
|
<Message severity="success" variant="simple">Success Message</Message>
|
||||||
|
<Message severity="info" variant="simple">Info Message</Message>
|
||||||
|
<Message severity="warn" variant="simple">Warn Message</Message>
|
||||||
|
<Message severity="error" variant="simple">Error Message</Message>
|
||||||
|
<Message severity="secondary" variant="simple">Secondary Message</Message>
|
||||||
|
<Message severity="contrast" variant="simple">Contrast Message</Message>
|
||||||
|
</div>
|
||||||
|
<DocSectionCode :code="code" />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
code: {
|
||||||
|
basic: `
|
||||||
|
<Message severity="success" variant="simple">Success Message</Message>
|
||||||
|
<Message severity="info" variant="simple">Info Message</Message>
|
||||||
|
<Message severity="warn" variant="simple">Warn Message</Message>
|
||||||
|
<Message severity="error" variant="simple">Error Message</Message>
|
||||||
|
<Message severity="secondary" variant="simple">Secondary Message</Message>
|
||||||
|
<Message severity="contrast" variant="simple">Contrast Message</Message>
|
||||||
|
`,
|
||||||
|
options: `
|
||||||
|
<template>
|
||||||
|
<div class="card flex flex-wrap gap-8 justify-center">
|
||||||
|
<Message severity="success" variant="simple">Success Message</Message>
|
||||||
|
<Message severity="info" variant="simple">Info Message</Message>
|
||||||
|
<Message severity="warn" variant="simple">Warn Message</Message>
|
||||||
|
<Message severity="error" variant="simple">Error Message</Message>
|
||||||
|
<Message severity="secondary" variant="simple">Secondary Message</Message>
|
||||||
|
<Message severity="contrast" variant="simple">Contrast Message</Message>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
<\/script>
|
||||||
|
`,
|
||||||
|
composition: `
|
||||||
|
<template>
|
||||||
|
<div class="card flex flex-wrap gap-8 justify-center">
|
||||||
|
<Message severity="success" variant="simple">Success Message</Message>
|
||||||
|
<Message severity="info" variant="simple">Info Message</Message>
|
||||||
|
<Message severity="warn" variant="simple">Warn Message</Message>
|
||||||
|
<Message severity="error" variant="simple">Error Message</Message>
|
||||||
|
<Message severity="secondary" variant="simple">Secondary Message</Message>
|
||||||
|
<Message severity="contrast" variant="simple">Contrast Message</Message>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
<\/script>
|
||||||
|
`
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
|
@ -98,7 +98,7 @@ export default {
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'soho',
|
name: 'soho',
|
||||||
palette: { 0: '#ffffff', 50: '#f4f4f4', 100: '#e8e9e9', 200: '#d2d2d4', 300: '#bbbcbe', 400: '#a5a5a9', 500: '#8e8f93', 600: '#77787d', 700: '#616268', 800: '#4a4b52', 900: '#34343d', 950: '#1d1e27' }
|
palette: { 0: '#ffffff', 50: '#ececec', 100: '#dedfdf', 200: '#c4c4c6', 300: '#adaeb0', 400: '#97979b', 500: '#7f8084', 600: '#6a6b70', 700: '#55565b', 800: '#3f4046', 900: '#2c2c34', 950: '#16161d' }
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'viva',
|
name: 'viva',
|
||||||
|
|
|
@ -12,7 +12,7 @@ import IconDoc from '@/doc/message/IconDoc.vue';
|
||||||
import ImportDoc from '@/doc/message/ImportDoc.vue';
|
import ImportDoc from '@/doc/message/ImportDoc.vue';
|
||||||
import LifeDoc from '@/doc/message/LifeDoc.vue';
|
import LifeDoc from '@/doc/message/LifeDoc.vue';
|
||||||
import OutlinedDoc from '@/doc/message/OutlinedDoc.vue';
|
import OutlinedDoc from '@/doc/message/OutlinedDoc.vue';
|
||||||
import PlainDoc from '@/doc/message/PlainDoc.vue';
|
import SimpleDoc from '@/doc/message/SimpleDoc.vue';
|
||||||
import PTComponent from '@/doc/message/pt/index.vue';
|
import PTComponent from '@/doc/message/pt/index.vue';
|
||||||
import SeverityDoc from '@/doc/message/SeverityDoc.vue';
|
import SeverityDoc from '@/doc/message/SeverityDoc.vue';
|
||||||
import SizesDoc from '@/doc/message/SizesDoc.vue';
|
import SizesDoc from '@/doc/message/SizesDoc.vue';
|
||||||
|
@ -48,9 +48,9 @@ export default {
|
||||||
component: OutlinedDoc
|
component: OutlinedDoc
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'plain',
|
id: 'simple',
|
||||||
label: 'Plain',
|
label: 'Simple',
|
||||||
component: PlainDoc
|
component: SimpleDoc
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'sizes',
|
id: 'sizes',
|
||||||
|
|
|
@ -164,7 +164,7 @@ export interface MessageProps {
|
||||||
* Specifies the input variant of the component.
|
* Specifies the input variant of the component.
|
||||||
* @defaultValue outlined
|
* @defaultValue outlined
|
||||||
*/
|
*/
|
||||||
variant?: 'outlined' | 'text' | undefined;
|
variant?: 'outlined' | 'simple' | undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
@ -68,13 +68,13 @@ const theme = ({ dt }) => `
|
||||||
background: ${dt('message.info.close.button.hover.background')};
|
background: ${dt('message.info.close.button.hover.background')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-info.p-message-variant-outlined {
|
.p-message-info.p-message-outlined {
|
||||||
color: ${dt('message.info.outlined.color')};
|
color: ${dt('message.info.outlined.color')};
|
||||||
outline-color: ${dt('message.info.outlined.border.color')};
|
outline-color: ${dt('message.info.outlined.border.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-info.p-message-variant-plain {
|
.p-message-info.p-message-simple {
|
||||||
color: ${dt('message.info.plain.color')};
|
color: ${dt('message.info.simple.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-success {
|
.p-message-success {
|
||||||
|
@ -93,13 +93,13 @@ const theme = ({ dt }) => `
|
||||||
background: ${dt('message.success.close.button.hover.background')};
|
background: ${dt('message.success.close.button.hover.background')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-success.p-message-variant-outlined {
|
.p-message-success.p-message-outlined {
|
||||||
color: ${dt('message.success.outlined.color')};
|
color: ${dt('message.success.outlined.color')};
|
||||||
outline-color: ${dt('message.success.outlined.border.color')};
|
outline-color: ${dt('message.success.outlined.border.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-success.p-message-variant-plain {
|
.p-message-success.p-message-simple {
|
||||||
color: ${dt('message.success.plain.color')};
|
color: ${dt('message.success.simple.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-warn {
|
.p-message-warn {
|
||||||
|
@ -118,13 +118,13 @@ const theme = ({ dt }) => `
|
||||||
background: ${dt('message.warn.close.button.hover.background')};
|
background: ${dt('message.warn.close.button.hover.background')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-warn.p-message-variant-outlined {
|
.p-message-warn.p-message-outlined {
|
||||||
color: ${dt('message.warn.outlined.color')};
|
color: ${dt('message.warn.outlined.color')};
|
||||||
outline-color: ${dt('message.warn.outlined.border.color')};
|
outline-color: ${dt('message.warn.outlined.border.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-warn.p-message-variant-plain {
|
.p-message-warn.p-message-simple {
|
||||||
color: ${dt('message.warn.plain.color')};
|
color: ${dt('message.warn.simple.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-error {
|
.p-message-error {
|
||||||
|
@ -143,13 +143,13 @@ const theme = ({ dt }) => `
|
||||||
background: ${dt('message.error.close.button.hover.background')};
|
background: ${dt('message.error.close.button.hover.background')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-error.p-message-variant-outlined {
|
.p-message-error.p-message-outlined {
|
||||||
color: ${dt('message.error.outlined.color')};
|
color: ${dt('message.error.outlined.color')};
|
||||||
outline-color: ${dt('message.error.outlined.border.color')};
|
outline-color: ${dt('message.error.outlined.border.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-error.p-message-variant-plain {
|
.p-message-error.p-message-simple {
|
||||||
color: ${dt('message.error.plain.color')};
|
color: ${dt('message.error.simple.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-secondary {
|
.p-message-secondary {
|
||||||
|
@ -168,13 +168,13 @@ const theme = ({ dt }) => `
|
||||||
background: ${dt('message.secondary.close.button.hover.background')};
|
background: ${dt('message.secondary.close.button.hover.background')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-secondary.p-message-variant-outlined {
|
.p-message-secondary.p-message-outlined {
|
||||||
color: ${dt('message.secondary.outlined.color')};
|
color: ${dt('message.secondary.outlined.color')};
|
||||||
outline-color: ${dt('message.secondary.outlined.border.color')};
|
outline-color: ${dt('message.secondary.outlined.border.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-secondary.p-message-variant-plain {
|
.p-message-secondary.p-message-simple {
|
||||||
color: ${dt('message.secondary.plain.color')};
|
color: ${dt('message.secondary.simple.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-contrast {
|
.p-message-contrast {
|
||||||
|
@ -193,13 +193,13 @@ const theme = ({ dt }) => `
|
||||||
background: ${dt('message.contrast.close.button.hover.background')};
|
background: ${dt('message.contrast.close.button.hover.background')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-contrast.p-message-variant-outlined {
|
.p-message-contrast.p-message-outlined {
|
||||||
color: ${dt('message.contrast.outlined.color')};
|
color: ${dt('message.contrast.outlined.color')};
|
||||||
outline-color: ${dt('message.contrast.outlined.border.color')};
|
outline-color: ${dt('message.contrast.outlined.border.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-contrast.p-message-variant-plain {
|
.p-message-contrast.p-message-simple {
|
||||||
color: ${dt('message.contrast.plain.color')};
|
color: ${dt('message.contrast.simple.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-text {
|
.p-message-text {
|
||||||
|
@ -280,19 +280,23 @@ const theme = ({ dt }) => `
|
||||||
height: ${dt('message.close.icon.lg.size')};
|
height: ${dt('message.close.icon.lg.size')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-variant-outlined {
|
.p-message-outlined {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
outline-width: ${dt('message.outlined.border.width')};
|
outline-width: ${dt('message.outlined.border.width')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-message-variant-plain {
|
.p-message-simple {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
outline-color: transparent;
|
outline-color: transparent;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.p-message-simple .p-message-content {
|
||||||
|
padding: ${dt('message.simple.content.padding')};
|
||||||
|
}
|
||||||
|
|
||||||
.p-message-variant-outlined .p-message-close-button:hover,
|
.p-message-outlined .p-message-close-button:hover,
|
||||||
.p-message-variant-plain .p-message-close-button:hover {
|
.p-message-simple .p-message-close-button:hover {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
@ -301,8 +305,8 @@ const classes = {
|
||||||
root: ({ props }) => [
|
root: ({ props }) => [
|
||||||
'p-message p-component p-message-' + props.severity,
|
'p-message p-component p-message-' + props.severity,
|
||||||
{
|
{
|
||||||
'p-message-variant-outlined': props.variant === 'outlined',
|
'p-message-outlined': props.variant === 'outlined',
|
||||||
'p-message-variant-plain': props.variant === 'plain',
|
'p-message-simple': props.variant === 'simple',
|
||||||
'p-message-sm': props.size === 'small',
|
'p-message-sm': props.size === 'small',
|
||||||
'p-message-lg': props.size === 'large'
|
'p-message-lg': props.size === 'large'
|
||||||
}
|
}
|
||||||
|
|
|
@ -57,6 +57,11 @@ export default {
|
||||||
borderWidth: '1px'
|
borderWidth: '1px'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
simple: {
|
||||||
|
content: {
|
||||||
|
padding: '0'
|
||||||
|
}
|
||||||
|
},
|
||||||
colorScheme: {
|
colorScheme: {
|
||||||
light: {
|
light: {
|
||||||
info: {
|
info: {
|
||||||
|
@ -75,7 +80,7 @@ export default {
|
||||||
color: '{blue.600}',
|
color: '{blue.600}',
|
||||||
borderColor: '{blue.600}'
|
borderColor: '{blue.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{blue.600}'
|
color: '{blue.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -95,7 +100,7 @@ export default {
|
||||||
color: '{green.600}',
|
color: '{green.600}',
|
||||||
borderColor: '{green.600}'
|
borderColor: '{green.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{green.600}'
|
color: '{green.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -115,7 +120,7 @@ export default {
|
||||||
color: '{yellow.600}',
|
color: '{yellow.600}',
|
||||||
borderColor: '{yellow.600}'
|
borderColor: '{yellow.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{yellow.600}'
|
color: '{yellow.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -135,7 +140,7 @@ export default {
|
||||||
color: '{red.600}',
|
color: '{red.600}',
|
||||||
borderColor: '{red.600}'
|
borderColor: '{red.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{red.600}'
|
color: '{red.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -155,7 +160,7 @@ export default {
|
||||||
color: '{surface.500}',
|
color: '{surface.500}',
|
||||||
borderColor: '{surface.500}'
|
borderColor: '{surface.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.500}'
|
color: '{surface.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -175,7 +180,7 @@ export default {
|
||||||
color: '{surface.950}',
|
color: '{surface.950}',
|
||||||
borderColor: '{surface.950}'
|
borderColor: '{surface.950}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.950}'
|
color: '{surface.950}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -197,7 +202,7 @@ export default {
|
||||||
color: '{blue.500}',
|
color: '{blue.500}',
|
||||||
borderColor: '{blue.500}'
|
borderColor: '{blue.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{blue.500}'
|
color: '{blue.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -217,7 +222,7 @@ export default {
|
||||||
color: '{green.500}',
|
color: '{green.500}',
|
||||||
borderColor: '{green.500}'
|
borderColor: '{green.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{green.500}'
|
color: '{green.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -237,7 +242,7 @@ export default {
|
||||||
color: '{yellow.500}',
|
color: '{yellow.500}',
|
||||||
borderColor: '{yellow.500}'
|
borderColor: '{yellow.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{yellow.500}'
|
color: '{yellow.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -257,7 +262,7 @@ export default {
|
||||||
color: '{red.500}',
|
color: '{red.500}',
|
||||||
borderColor: '{red.500}'
|
borderColor: '{red.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{red.500}'
|
color: '{red.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -277,7 +282,7 @@ export default {
|
||||||
color: '{surface.400}',
|
color: '{surface.400}',
|
||||||
borderColor: '{surface.400}'
|
borderColor: '{surface.400}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.400}'
|
color: '{surface.400}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -297,7 +302,7 @@ export default {
|
||||||
color: '{surface.0}',
|
color: '{surface.0}',
|
||||||
borderColor: '{surface.0}'
|
borderColor: '{surface.0}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.0}'
|
color: '{surface.0}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -57,6 +57,11 @@ export default {
|
||||||
borderWidth: '1px'
|
borderWidth: '1px'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
simple: {
|
||||||
|
content: {
|
||||||
|
padding: '0'
|
||||||
|
}
|
||||||
|
},
|
||||||
colorScheme: {
|
colorScheme: {
|
||||||
light: {
|
light: {
|
||||||
info: {
|
info: {
|
||||||
|
@ -75,7 +80,7 @@ export default {
|
||||||
color: '{blue.600}',
|
color: '{blue.600}',
|
||||||
borderColor: '{blue.600}'
|
borderColor: '{blue.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{blue.600}'
|
color: '{blue.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -95,7 +100,7 @@ export default {
|
||||||
color: '{green.600}',
|
color: '{green.600}',
|
||||||
borderColor: '{green.600}'
|
borderColor: '{green.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{green.600}'
|
color: '{green.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -115,7 +120,7 @@ export default {
|
||||||
color: '{yellow.600}',
|
color: '{yellow.600}',
|
||||||
borderColor: '{yellow.600}'
|
borderColor: '{yellow.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{yellow.600}'
|
color: '{yellow.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -135,7 +140,7 @@ export default {
|
||||||
color: '{red.600}',
|
color: '{red.600}',
|
||||||
borderColor: '{red.600}'
|
borderColor: '{red.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{red.600}'
|
color: '{red.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -155,7 +160,7 @@ export default {
|
||||||
color: '{surface.500}',
|
color: '{surface.500}',
|
||||||
borderColor: '{surface.500}'
|
borderColor: '{surface.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.500}'
|
color: '{surface.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -175,7 +180,7 @@ export default {
|
||||||
color: '{surface.900}',
|
color: '{surface.900}',
|
||||||
borderColor: '{surface.900}'
|
borderColor: '{surface.900}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.900}'
|
color: '{surface.900}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -197,7 +202,7 @@ export default {
|
||||||
color: '{blue.500}',
|
color: '{blue.500}',
|
||||||
borderColor: '{blue.500}'
|
borderColor: '{blue.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{blue.500}'
|
color: '{blue.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -217,7 +222,7 @@ export default {
|
||||||
color: '{green.500}',
|
color: '{green.500}',
|
||||||
borderColor: '{green.500}'
|
borderColor: '{green.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{green.500}'
|
color: '{green.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -237,7 +242,7 @@ export default {
|
||||||
color: '{yellow.500}',
|
color: '{yellow.500}',
|
||||||
borderColor: '{yellow.500}'
|
borderColor: '{yellow.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{yellow.500}'
|
color: '{yellow.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -257,7 +262,7 @@ export default {
|
||||||
color: '{red.500}',
|
color: '{red.500}',
|
||||||
borderColor: '{red.500}'
|
borderColor: '{red.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{red.500}'
|
color: '{red.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -277,7 +282,7 @@ export default {
|
||||||
color: '{surface.400}',
|
color: '{surface.400}',
|
||||||
borderColor: '{surface.400}'
|
borderColor: '{surface.400}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.400}'
|
color: '{surface.400}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -297,7 +302,7 @@ export default {
|
||||||
color: '{surface.0}',
|
color: '{surface.0}',
|
||||||
borderColor: '{surface.0}'
|
borderColor: '{surface.0}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.0}'
|
color: '{surface.0}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -57,6 +57,11 @@ export default {
|
||||||
borderWidth: '1px'
|
borderWidth: '1px'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
simple: {
|
||||||
|
content: {
|
||||||
|
padding: '0'
|
||||||
|
}
|
||||||
|
},
|
||||||
colorScheme: {
|
colorScheme: {
|
||||||
light: {
|
light: {
|
||||||
info: {
|
info: {
|
||||||
|
@ -75,7 +80,7 @@ export default {
|
||||||
color: '{blue.600}',
|
color: '{blue.600}',
|
||||||
borderColor: '{blue.600}'
|
borderColor: '{blue.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{blue.600}'
|
color: '{blue.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -95,7 +100,7 @@ export default {
|
||||||
color: '{green.600}',
|
color: '{green.600}',
|
||||||
borderColor: '{green.600}'
|
borderColor: '{green.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{green.600}'
|
color: '{green.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -115,7 +120,7 @@ export default {
|
||||||
color: '{yellow.900}',
|
color: '{yellow.900}',
|
||||||
borderColor: '{yellow.900}'
|
borderColor: '{yellow.900}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{yellow.900}'
|
color: '{yellow.900}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -135,7 +140,7 @@ export default {
|
||||||
color: '{red.600}',
|
color: '{red.600}',
|
||||||
borderColor: '{red.600}'
|
borderColor: '{red.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{red.600}'
|
color: '{red.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -155,7 +160,7 @@ export default {
|
||||||
color: '{surface.600}',
|
color: '{surface.600}',
|
||||||
borderColor: '{surface.600}'
|
borderColor: '{surface.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.600}'
|
color: '{surface.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -175,7 +180,7 @@ export default {
|
||||||
color: '{surface.950}',
|
color: '{surface.950}',
|
||||||
borderColor: '{surface.950}'
|
borderColor: '{surface.950}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.950}'
|
color: '{surface.950}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -197,7 +202,7 @@ export default {
|
||||||
color: '{blue.500}',
|
color: '{blue.500}',
|
||||||
borderColor: '{blue.500}'
|
borderColor: '{blue.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{blue.500}'
|
color: '{blue.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -217,7 +222,7 @@ export default {
|
||||||
color: '{green.500}',
|
color: '{green.500}',
|
||||||
borderColor: '{green.500}'
|
borderColor: '{green.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{green.500}'
|
color: '{green.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -237,7 +242,7 @@ export default {
|
||||||
color: '{yellow.500}',
|
color: '{yellow.500}',
|
||||||
borderColor: '{yellow.500}'
|
borderColor: '{yellow.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{yellow.500}'
|
color: '{yellow.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -257,7 +262,7 @@ export default {
|
||||||
color: '{red.500}',
|
color: '{red.500}',
|
||||||
borderColor: '{red.500}'
|
borderColor: '{red.500}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{red.500}'
|
color: '{red.500}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -277,7 +282,7 @@ export default {
|
||||||
color: '{surface.400}',
|
color: '{surface.400}',
|
||||||
borderColor: '{surface.400}'
|
borderColor: '{surface.400}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.400}'
|
color: '{surface.400}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -297,7 +302,7 @@ export default {
|
||||||
color: '{surface.0}',
|
color: '{surface.0}',
|
||||||
borderColor: '{surface.0}'
|
borderColor: '{surface.0}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.0}'
|
color: '{surface.0}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -57,6 +57,11 @@ export default {
|
||||||
borderWidth: '1px'
|
borderWidth: '1px'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
simple: {
|
||||||
|
content: {
|
||||||
|
padding: '0'
|
||||||
|
}
|
||||||
|
},
|
||||||
colorScheme: {
|
colorScheme: {
|
||||||
light: {
|
light: {
|
||||||
info: {
|
info: {
|
||||||
|
@ -75,7 +80,7 @@ export default {
|
||||||
color: '{blue.800}',
|
color: '{blue.800}',
|
||||||
borderColor: '{blue.800}'
|
borderColor: '{blue.800}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{blue.800}'
|
color: '{blue.800}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -95,7 +100,7 @@ export default {
|
||||||
color: '{green.800}',
|
color: '{green.800}',
|
||||||
borderColor: '{green.800}'
|
borderColor: '{green.800}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{green.800}'
|
color: '{green.800}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -115,7 +120,7 @@ export default {
|
||||||
color: '{yellow.600}',
|
color: '{yellow.600}',
|
||||||
borderColor: '{yellow.600}'
|
borderColor: '{yellow.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{yellow.600}'
|
color: '{yellow.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -135,7 +140,7 @@ export default {
|
||||||
color: '{red.800}',
|
color: '{red.800}',
|
||||||
borderColor: '{red.800}'
|
borderColor: '{red.800}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{red.800}'
|
color: '{red.800}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -155,7 +160,7 @@ export default {
|
||||||
color: '{surface.600}',
|
color: '{surface.600}',
|
||||||
borderColor: '{surface.600}'
|
borderColor: '{surface.600}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.600}'
|
color: '{surface.600}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -175,7 +180,7 @@ export default {
|
||||||
color: '{surface.900}',
|
color: '{surface.900}',
|
||||||
borderColor: '{surface.900}'
|
borderColor: '{surface.900}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.900}'
|
color: '{surface.900}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -197,7 +202,7 @@ export default {
|
||||||
color: '{blue.200}',
|
color: '{blue.200}',
|
||||||
borderColor: '{blue.200}'
|
borderColor: '{blue.200}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{blue.200}'
|
color: '{blue.200}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -217,7 +222,7 @@ export default {
|
||||||
color: '{green.200}',
|
color: '{green.200}',
|
||||||
borderColor: '{green.200}'
|
borderColor: '{green.200}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{green.200}'
|
color: '{green.200}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -237,7 +242,7 @@ export default {
|
||||||
color: '{yellow.200}',
|
color: '{yellow.200}',
|
||||||
borderColor: '{yellow.200}'
|
borderColor: '{yellow.200}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{yellow.200}'
|
color: '{yellow.200}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -257,7 +262,7 @@ export default {
|
||||||
color: '{red.200}',
|
color: '{red.200}',
|
||||||
borderColor: '{red.200}'
|
borderColor: '{red.200}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{red.200}'
|
color: '{red.200}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -277,7 +282,7 @@ export default {
|
||||||
color: '{surface.400}',
|
color: '{surface.400}',
|
||||||
borderColor: '{surface.400}'
|
borderColor: '{surface.400}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.400}'
|
color: '{surface.400}'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -297,7 +302,7 @@ export default {
|
||||||
color: '{surface.0}',
|
color: '{surface.0}',
|
||||||
borderColor: '{surface.0}'
|
borderColor: '{surface.0}'
|
||||||
},
|
},
|
||||||
plain: {
|
simple: {
|
||||||
color: '{surface.0}'
|
color: '{surface.0}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue