Textarea class renaming
parent
e07ee4a5a1
commit
8af884b34c
|
@ -15,7 +15,7 @@ describe('Textarea.vue', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should exist', () => {
|
it('should exist', () => {
|
||||||
expect(wrapper.find('.p-inputtextarea.p-component').exists()).toBe(true);
|
expect(wrapper.find('.p-textarea.p-component').exists()).toBe(true);
|
||||||
expect(wrapper.attributes().rows).toBe('1');
|
expect(wrapper.attributes().rows).toBe('1');
|
||||||
expect(wrapper.attributes().cols).toBe('1');
|
expect(wrapper.attributes().cols).toBe('1');
|
||||||
});
|
});
|
||||||
|
@ -23,7 +23,7 @@ describe('Textarea.vue', () => {
|
||||||
it('should be autoresized', async () => {
|
it('should be autoresized', async () => {
|
||||||
await wrapper.setProps({ autoResize: true });
|
await wrapper.setProps({ autoResize: true });
|
||||||
|
|
||||||
expect(wrapper.find('.p-inputtextarea-resizable').exists()).toBe(true);
|
expect(wrapper.find('.p-textarea-resizable').exists()).toBe(true);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should input', async () => {
|
it('should input', async () => {
|
||||||
|
|
|
@ -10,7 +10,7 @@
|
||||||
import { BaseStyle } from '../../base/style';
|
import { BaseStyle } from '../../base/style';
|
||||||
|
|
||||||
export enum TextareaClasses {
|
export enum TextareaClasses {
|
||||||
root = 'p-inputtextarea'
|
root = 'p-textarea'
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface TextareaStyle extends BaseStyle {}
|
export interface TextareaStyle extends BaseStyle {}
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import BaseStyle from 'primevue/base/style';
|
import BaseStyle from 'primevue/base/style';
|
||||||
|
|
||||||
const theme = ({ dt }) => `
|
const theme = ({ dt }) => `
|
||||||
.p-inputtextarea {
|
.p-textarea {
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
font-feature-settings: inherit;
|
font-feature-settings: inherit;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
|
@ -16,44 +16,44 @@ const theme = ({ dt }) => `
|
||||||
box-shadow: ${dt('textarea.shadow')};
|
box-shadow: ${dt('textarea.shadow')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-inputtextarea:enabled:hover {
|
.p-textarea:enabled:hover {
|
||||||
border-color: ${dt('textarea.hover.border.color')};
|
border-color: ${dt('textarea.hover.border.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-inputtextarea:enabled:focus {
|
.p-textarea:enabled:focus {
|
||||||
border-color: ${dt('textarea.focus.border.color')};
|
border-color: ${dt('textarea.focus.border.color')};
|
||||||
box-shadow: ${dt('textarea.focus.ring.shadow')};
|
box-shadow: ${dt('textarea.focus.ring.shadow')};
|
||||||
outline: ${dt('textarea.focus.ring.width')} ${dt('textarea.focus.ring.style')} ${dt('textarea.focus.ring.color')};
|
outline: ${dt('textarea.focus.ring.width')} ${dt('textarea.focus.ring.style')} ${dt('textarea.focus.ring.color')};
|
||||||
outline-offset: ${dt('textarea.focus.ring.offset')};
|
outline-offset: ${dt('textarea.focus.ring.offset')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-inputtextarea.p-invalid {
|
.p-textarea.p-invalid {
|
||||||
border-color: ${dt('textarea.invalid.border.color')};
|
border-color: ${dt('textarea.invalid.border.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-inputtextarea.p-variant-filled {
|
.p-textarea.p-variant-filled {
|
||||||
background-color: ${dt('textarea.filled.background')};
|
background-color: ${dt('textarea.filled.background')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-inputtextarea.p-variant-filled:enabled:focus {
|
.p-textarea.p-variant-filled:enabled:focus {
|
||||||
background-color: ${dt('textarea.filled.focus.background')};
|
background-color: ${dt('textarea.filled.focus.background')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-inputtextarea:disabled {
|
.p-textarea:disabled {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
background: ${dt('textarea.disabled.background')};
|
background: ${dt('textarea.disabled.background')};
|
||||||
color: ${dt('textarea.disabled.color')};
|
color: ${dt('textarea.disabled.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-inputtextarea::placeholder {
|
.p-textarea::placeholder {
|
||||||
color: ${dt('textarea.placeholder.color')};
|
color: ${dt('textarea.placeholder.color')};
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-fluid .p-inputtextarea {
|
.p-fluid .p-textarea {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.p-inputtextarea-resizable {
|
.p-textarea-resizable {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
resize: none;
|
resize: none;
|
||||||
}
|
}
|
||||||
|
@ -61,10 +61,10 @@ const theme = ({ dt }) => `
|
||||||
|
|
||||||
const classes = {
|
const classes = {
|
||||||
root: ({ instance, props }) => [
|
root: ({ instance, props }) => [
|
||||||
'p-inputtextarea p-component',
|
'p-textarea p-component',
|
||||||
{
|
{
|
||||||
'p-filled': instance.filled,
|
'p-filled': instance.filled,
|
||||||
'p-inputtextarea-resizable ': props.autoResize,
|
'p-textarea-resizable ': props.autoResize,
|
||||||
'p-invalid': props.invalid,
|
'p-invalid': props.invalid,
|
||||||
'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
|
'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue