diff --git a/components/lib/basecomponent/style/BaseComponentStyle.js b/components/lib/basecomponent/style/BaseComponentStyle.js index 2837804e9..632553a1b 100644 --- a/components/lib/basecomponent/style/BaseComponentStyle.js +++ b/components/lib/basecomponent/style/BaseComponentStyle.js @@ -247,7 +247,7 @@ const css = ` } .p-disabled, .p-disabled * { - cursor: default !important; + cursor: default; pointer-events: none; user-select: none; } @@ -274,7 +274,7 @@ const css = ` padding: 0; position: absolute; width: 1px; - word-wrap: normal !important; + word-wrap: normal; } .p-link { diff --git a/components/lib/calendar/Calendar.vue b/components/lib/calendar/Calendar.vue index 52d89acbe..748bdac93 100755 --- a/components/lib/calendar/Calendar.vue +++ b/components/lib/calendar/Calendar.vue @@ -2693,14 +2693,14 @@ export default { let { breakpoint, numMonths } = responsiveOptions[i]; let styles = ` .p-datepicker[${this.attributeSelector}] .p-datepicker-group:nth-child(${numMonths}) .p-datepicker-next { - display: inline-flex !important; + display: inline-flex; } `; for (let j = numMonths; j < this.numberOfMonths; j++) { styles += ` .p-datepicker[${this.attributeSelector}] .p-datepicker-group:nth-child(${j + 1}) { - display: none !important; + display: none; } `; } diff --git a/components/lib/cascadeselect/style/CascadeSelectStyle.js b/components/lib/cascadeselect/style/CascadeSelectStyle.js index 385d5a01a..a37c71f73 100644 --- a/components/lib/cascadeselect/style/CascadeSelectStyle.js +++ b/components/lib/cascadeselect/style/CascadeSelectStyle.js @@ -74,7 +74,7 @@ const css = ` } .p-cascadeselect-item-active { - overflow: visible !important; + overflow: visible; } .p-cascadeselect-item-active > .p-cascadeselect-sublist { diff --git a/components/lib/confirmdialog/ConfirmDialog.d.ts b/components/lib/confirmdialog/ConfirmDialog.d.ts index 1013e88bd..5e47f885f 100644 --- a/components/lib/confirmdialog/ConfirmDialog.d.ts +++ b/components/lib/confirmdialog/ConfirmDialog.d.ts @@ -137,7 +137,7 @@ export interface ConfirmDialogBreakpoints { * * @media screen and (max-width: ${breakpoint[key]}) { * .p-dialog[attributeSelector] { - * width: ${breakpoint[value]} !important; + * width: ${breakpoint[value]}; * } * } */ diff --git a/components/lib/datatable/DataTable.vue b/components/lib/datatable/DataTable.vue index 296186d28..4a3658ede 100755 --- a/components/lib/datatable/DataTable.vue +++ b/components/lib/datatable/DataTable.vue @@ -1308,7 +1308,7 @@ export default { widths.forEach((width, index) => { let colWidth = index === colIndex ? newColumnWidth : nextColumnWidth && index === colIndex + 1 ? nextColumnWidth : width; - let style = `width: ${colWidth}px !important; max-width: ${colWidth}px !important`; + let style = `width: ${colWidth}px; max-width: ${colWidth}px`; innerHTML += ` ${selector} > thead[data-pc-section="thead"] > tr > th:nth-child(${index + 1}), @@ -1764,7 +1764,7 @@ export default { let selector = `[data-pc-name="datatable"][${this.attributeSelector}] > [data-pc-section="wrapper"] ${this.virtualScrollerDisabled ? '' : '> [data-pc-name="virtualscroller"]'} > table[data-pc-section="table"]`; widths.forEach((width, index) => { - let style = `width: ${width}px !important; max-width: ${width}px !important`; + let style = `width: ${width}px; max-width: ${width}px`; innerHTML += ` ${selector} > thead[data-pc-section="thead"] > tr > th:nth-child(${index + 1}), @@ -1903,12 +1903,12 @@ export default { @media screen and (max-width: ${this.breakpoint}) { ${selector} > .p-datatable-thead > tr > th, ${selector} > .p-datatable-tfoot > tr > td { - display: none !important; + display: none; } ${selector} > .p-datatable-tbody > tr > td { display: flex; - width: 100% !important; + width: 100%; align-items: center; justify-content: space-between; } diff --git a/components/lib/datatable/style/DataTableStyle.js b/components/lib/datatable/style/DataTableStyle.js index 1b46d9c72..e249af1ca 100644 --- a/components/lib/datatable/style/DataTableStyle.js +++ b/components/lib/datatable/style/DataTableStyle.js @@ -98,7 +98,7 @@ const css = ` .p-datatable .p-column-resizer { display: block; - position: absolute !important; + position: absolute; top: 0; right: 0; margin: 0; @@ -230,7 +230,7 @@ const css = ` } .p-datatable .p-virtualscroller .p-virtualscroller-loading { - transform: none !important; + transform: none; min-height: 0; position: sticky; top: 0; diff --git a/components/lib/dialog/Dialog.d.ts b/components/lib/dialog/Dialog.d.ts index c0f493b30..4cff69453 100755 --- a/components/lib/dialog/Dialog.d.ts +++ b/components/lib/dialog/Dialog.d.ts @@ -136,7 +136,7 @@ export interface DialogBreakpoints { * * @media screen and (max-width: ${breakpoint[key]}) { * .p-dialog[attributeSelector] { - * width: ${breakpoint[value]} !important; + * width: ${breakpoint[value]}; * } * } */ diff --git a/components/lib/dialog/Dialog.vue b/components/lib/dialog/Dialog.vue index 6646e305f..fd33ef2d9 100755 --- a/components/lib/dialog/Dialog.vue +++ b/components/lib/dialog/Dialog.vue @@ -267,7 +267,7 @@ export default { innerHTML += ` @media screen and (max-width: ${breakpoint}) { .p-dialog[${this.attributeSelector}] { - width: ${this.breakpoints[breakpoint]} !important; + width: ${this.breakpoints[breakpoint]}; } } `; diff --git a/components/lib/dialog/style/DialogStyle.js b/components/lib/dialog/style/DialogStyle.js index b3851bf6b..3e97312c6 100644 --- a/components/lib/dialog/style/DialogStyle.js +++ b/components/lib/dialog/style/DialogStyle.js @@ -118,10 +118,10 @@ const css = ` -webkit-transition: none; transition: none; transform: none; - width: 100vw !important; - height: 100vh !important; - top: 0px !important; - left: 0px !important; + width: 100vw; + height: 100vh; + top: 0px; + left: 0px; max-height: 100%; height: 100%; } diff --git a/components/lib/message/style/MessageStyle.js b/components/lib/message/style/MessageStyle.js index fe12e3efc..6c24f7ac1 100644 --- a/components/lib/message/style/MessageStyle.js +++ b/components/lib/message/style/MessageStyle.js @@ -39,7 +39,7 @@ const css = ` .p-message.p-message-leave-to { max-height: 0; opacity: 0; - margin: 0 !important; + margin: 0; } .p-message-leave-active { diff --git a/components/lib/overlaypanel/OverlayPanel.d.ts b/components/lib/overlaypanel/OverlayPanel.d.ts index d74f7ae2d..ee480057c 100755 --- a/components/lib/overlaypanel/OverlayPanel.d.ts +++ b/components/lib/overlaypanel/OverlayPanel.d.ts @@ -103,7 +103,7 @@ export interface OverlayPanelBreakpoints { * * @media screen and (max-width: ${breakpoint[key]}) { * .p-overlaypanel[attributeSelector] { - * width: ${breakpoint[value]} !important; + * width: ${breakpoint[value]}; * } * } */ diff --git a/components/lib/overlaypanel/OverlayPanel.vue b/components/lib/overlaypanel/OverlayPanel.vue index e268fab2f..9289a59de 100755 --- a/components/lib/overlaypanel/OverlayPanel.vue +++ b/components/lib/overlaypanel/OverlayPanel.vue @@ -281,7 +281,7 @@ export default { innerHTML += ` @media screen and (max-width: ${breakpoint}) { .p-overlaypanel[${this.attributeSelector}] { - width: ${this.breakpoints[breakpoint]} !important; + width: ${this.breakpoints[breakpoint]}; } } `; diff --git a/components/lib/paginator/Paginator.vue b/components/lib/paginator/Paginator.vue index 4c66f4400..47b5d6407 100755 --- a/components/lib/paginator/Paginator.vue +++ b/components/lib/paginator/Paginator.vue @@ -175,7 +175,7 @@ export default { @media screen ${minValue} { .paginator[${this.attributeSelector}], .p-paginator-default{ - display: flex !important; + display: flex; } } `; diff --git a/components/lib/picklist/style/PickListStyle.js b/components/lib/picklist/style/PickListStyle.js index b98def2a1..4f0545141 100644 --- a/components/lib/picklist/style/PickListStyle.js +++ b/components/lib/picklist/style/PickListStyle.js @@ -33,7 +33,7 @@ const css = ` .p-picklist-item.p-picklist-flip-enter-active.p-picklist-flip-enter-to, .p-picklist-item.p-picklist-flip-leave-active.p-picklist-flip-leave-to { - transition: none !important; + transition: none; } } `; diff --git a/components/lib/ripple/style/RippleStyle.js b/components/lib/ripple/style/RippleStyle.js index a419a3ba4..dcd29aec3 100644 --- a/components/lib/ripple/style/RippleStyle.js +++ b/components/lib/ripple/style/RippleStyle.js @@ -28,7 +28,7 @@ const css = ` } .p-ripple-disabled .p-ink { - display: none !important; + display: none; } } `; diff --git a/components/lib/sidebar/style/SidebarStyle.js b/components/lib/sidebar/style/SidebarStyle.js index 79a6e3d3b..7a152cdf0 100644 --- a/components/lib/sidebar/style/SidebarStyle.js +++ b/components/lib/sidebar/style/SidebarStyle.js @@ -49,11 +49,11 @@ const css = ` .p-sidebar-full .p-sidebar { transition: none; transform: none; - width: 100vw !important; - height: 100vh !important; + width: 100vw; + height: 100vh; max-height: 100%; - top: 0px !important; - left: 0px !important; + top: 0px; + left: 0px; } /* Animation */ diff --git a/components/lib/toast/Toast.vue b/components/lib/toast/Toast.vue index 9a1087a4b..292ad6c55 100755 --- a/components/lib/toast/Toast.vue +++ b/components/lib/toast/Toast.vue @@ -127,7 +127,7 @@ export default { let breakpointStyle = ''; for (let styleProp in this.breakpoints[breakpoint]) { - breakpointStyle += styleProp + ':' + this.breakpoints[breakpoint][styleProp] + '!important;'; + breakpointStyle += styleProp + ':' + this.breakpoints[breakpoint][styleProp] + ';'; } innerHTML += ` diff --git a/components/lib/treetable/style/TreeTableStyle.js b/components/lib/treetable/style/TreeTableStyle.js index f1697e4f3..1822ed6f5 100644 --- a/components/lib/treetable/style/TreeTableStyle.js +++ b/components/lib/treetable/style/TreeTableStyle.js @@ -71,7 +71,7 @@ const css = ` .p-treetable .p-column-resizer { display: block; - position: absolute !important; + position: absolute; top: 0; right: 0; margin: 0; diff --git a/doc/timeline/TemplateDoc.vue b/doc/timeline/TemplateDoc.vue index 8b7cccb2f..cc2d501e8 100644 --- a/doc/timeline/TemplateDoc.vue +++ b/doc/timeline/TemplateDoc.vue @@ -120,10 +120,10 @@ export default { @media screen and (max-width: 960px) { ::v-deep(.customized-timeline) { .p-timeline-event:nth-child(even) { - flex-direction: row !important; + flex-direction: row; .p-timeline-event-content { - text-align: left !important; + text-align: left; } } @@ -181,10 +181,10 @@ const events = ref([ @media screen and (max-width: 960px) { ::v-deep(.customized-timeline) { .p-timeline-event:nth-child(even) { - flex-direction: row !important; + flex-direction: row; .p-timeline-event-content { - text-align: left !important; + text-align: left; } }