vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Refactored class names

pull/5677/head
Cagatay Civici 2024-04-07 11:12:56 +03:00
parent 9c570473a1
commit 2996ee0413
2 changed files with 21 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
components/lib/chips/style/ChipsStyle.js
View File

@ -2,7 +2,7 @@ import BaseStyle from 'primevue/base/style';
const classes = { const classes = {
root: ({ instance, props }) => [ root: ({ instance, props }) => [
'p-chips p-component p-inputwrapper', 'p-inputchips p-component p-inputwrapper',
{ {
'p-disabled': props.disabled, 'p-disabled': props.disabled,
'p-invalid': props.invalid, 'p-invalid': props.invalid,
@ -12,15 +12,15 @@ const classes = {
} }
], ],
container: ({ props, instance }) => [ container: ({ props, instance }) => [
'p-chips-group', 'p-inputchips-group',
{ {
'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'
} }
], ],
token: ({ state, index }) => ['p-chips-chip', { 'p-focus': state.focusedIndex === index }], token: ({ state, index }) => ['p-inputchips-chip', { 'p-focus': state.focusedIndex === index }],
label: 'p-chips-chip-label', label: 'p-inputchips-chip-label',
removeTokenIcon: 'p-chips-chip-icon', removeTokenIcon: 'p-inputchips-chip-icon',
inputToken: 'p-chips-input-chip' inputToken: 'p-inputchips-input-item'
}; };
export default BaseStyle.extend({ export default BaseStyle.extend({

30
components/lib/themes/primeone/base/chips/index.js
View File

@ -1,10 +1,10 @@
export default { export default {
css: ({ dt }) => ` css: ({ dt }) => `
.p-chips { .p-inputchips {
display: inline-flex; display: inline-flex;
} }
.p-chips-group { .p-inputchips-group {
margin: 0; margin: 0;
padding: 0; padding: 0;
list-style-type: none; list-style-type: none;
@ -25,34 +25,34 @@ export default {
box-shadow: ${dt('chips.box.shadow')}; box-shadow: ${dt('chips.box.shadow')};
} }
.p-chips:not(.p-disabled):hover .p-chips-group { .p-inputchips:not(.p-disabled):hover .p-inputchips-group {
border-color: ${dt('chips.hover.border.color')}; border-color: ${dt('chips.hover.border.color')};
} }
.p-chips:not(.p-disabled).p-focus .p-chips-group { .p-inputchips:not(.p-disabled).p-focus .p-inputchips-group {
border-color: ${dt('chips.focus.border.color')}; border-color: ${dt('chips.focus.border.color')};
outline: 0 none; outline: 0 none;
} }
.p-chips.p-invalid .p-chips-group { .p-inputchips.p-invalid .p-inputchips-group {
border-color: ${dt('chips.invalid.border.color')}; border-color: ${dt('chips.invalid.border.color')};
} }
.p-variant-filled.p-chips-group { .p-variant-filled.p-inputchips-group {
background: ${dt('chips.filled.background')}; background: ${dt('chips.filled.background')};
} }
.p-chips:not(.p-disabled).p-focus .p-variant-filled.p-chips-group { .p-inputchips:not(.p-disabled).p-focus .p-variant-filled.p-inputchips-group {
background: ${dt('chips.filled.focus.background')}; background: ${dt('chips.filled.focus.background')};
} }
.p-chips.p-disabled .p-chips-group { .p-inputchips.p-disabled .p-inputchips-group {
opacity: 1; opacity: 1;
background: ${dt('chips.disabled.background')}; background: ${dt('chips.disabled.background')};
color: ${dt('chips.disabled.color')}; color: ${dt('chips.disabled.color')};
} }
.p-chips-chip { .p-inputchips-chip {
cursor: default; cursor: default;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
@ -63,24 +63,24 @@ export default {
border-radius: ${dt('rounded.sm')}; border-radius: ${dt('rounded.sm')};
} }
.p-chips-chip.p-focus { .p-inputchips-chip.p-focus {
background: ${dt('chips.chip.focus.background')}; background: ${dt('chips.chip.focus.background')};
color: ${dt('chips.chip.focus.color')}; color: ${dt('chips.chip.focus.color')};
} }
.p-chips-chip-icon { .p-inputchips-chip-icon {
cursor: pointer; cursor: pointer;
margin-left: 0.375rem; margin-left: 0.375rem;
} }
.p-chips-input-chip { .p-inputchips-input-item {
padding: 0.25rem 0; padding: 0.25rem 0;
margin-left: 0.5rem; margin-left: 0.5rem;
flex: 1 1 auto; flex: 1 1 auto;
display: inline-flex; display: inline-flex;
} }
.p-chips-input-chip input { .p-inputchips-input-item input {
border: 0 none; border: 0 none;
outline: 0 none; outline: 0 none;
background-color: transparent; background-color: transparent;
@ -97,11 +97,11 @@ export default {
margin: 0; margin: 0;
} }
.p-chips-input-chip input::placeholder { .p-inputchips-input-item input::placeholder {
color: ${dt('chips.placeholder.color')}; color: ${dt('chips.placeholder.color')};
} }
.p-fluid .p-chips { .p-fluid .p-inputchips {
display: flex; display: flex;
} }
` `