diff --git a/apps/showcase/assets/styles/layout/_core.scss b/apps/showcase/assets/styles/layout/_core.scss
index 062fb8e32..5bddda336 100644
--- a/apps/showcase/assets/styles/layout/_core.scss
+++ b/apps/showcase/assets/styles/layout/_core.scss
@@ -1,7 +1,8 @@
html {
font-size: 14px;
font-family: "Inter var", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
- font-feature-settings: "cv02","cv03","cv04","cv11";
+ font-feature-settings: "cv02", "cv03", "cv04", "cv11";
+ line-height: normal;
}
.material {
@@ -33,7 +34,12 @@ a {
color: var(--selection-text-color);
}
-h1, h2, h3, h4, h5, h6 {
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
margin-block: 1.5rem 1rem;
margin-inline: 0;
font-family: inherit;
@@ -86,13 +92,6 @@ button {
font-feature-settings: inherit;
}
-*,
-::before,
-::after {
- border-width: 0;
- border-style: solid;
-}
-
textarea {
resize: none;
-}
+}
\ No newline at end of file
diff --git a/apps/showcase/doc/datatable/rowgroup/ExpandableRowGroupDoc.vue b/apps/showcase/doc/datatable/rowgroup/ExpandableRowGroupDoc.vue
index 4b941e18f..5afd541b0 100644
--- a/apps/showcase/doc/datatable/rowgroup/ExpandableRowGroupDoc.vue
+++ b/apps/showcase/doc/datatable/rowgroup/ExpandableRowGroupDoc.vue
@@ -21,7 +21,7 @@
tableStyle="min-width: 50rem"
>
-
+
{{ slotProps.data.representative.name }}
@@ -64,7 +64,7 @@ export default {
expandableRowGroups rowGroupMode="subheader" groupRowsBy="representative.name" @rowgroup-expand="onRowGroupExpand" @rowgroup-collapse="onRowGroupCollapse"
sortMode="single" sortField="representative.name" :sortOrder="1">
-
+
{{ slotProps.data.representative.name }}
@@ -96,7 +96,7 @@ export default {
expandableRowGroups rowGroupMode="subheader" groupRowsBy="representative.name" @rowgroup-expand="onRowGroupExpand" @rowgroup-collapse="onRowGroupCollapse"
sortMode="single" sortField="representative.name" :sortOrder="1">
-
+
{{ slotProps.data.representative.name }}
@@ -186,7 +186,7 @@ export default {
expandableRowGroups rowGroupMode="subheader" groupRowsBy="representative.name" @rowgroup-expand="onRowGroupExpand" @rowgroup-collapse="onRowGroupCollapse"
sortMode="single" sortField="representative.name" :sortOrder="1">
-
+
{{ slotProps.data.representative.name }}
diff --git a/apps/showcase/doc/datatable/rowgroup/RowSpanRowGroupDoc.vue b/apps/showcase/doc/datatable/rowgroup/RowSpanRowGroupDoc.vue
index f0306b640..c18b88199 100644
--- a/apps/showcase/doc/datatable/rowgroup/RowSpanRowGroupDoc.vue
+++ b/apps/showcase/doc/datatable/rowgroup/RowSpanRowGroupDoc.vue
@@ -33,7 +33,6 @@
-
@@ -79,7 +78,6 @@ export default {
-
`,
options: `
@@ -114,7 +112,6 @@ export default {
-
@@ -186,7 +183,6 @@ export default {
-
diff --git a/apps/showcase/tailwind.config.js b/apps/showcase/tailwind.config.js
index b26d9e148..fb7ccd868 100644
--- a/apps/showcase/tailwind.config.js
+++ b/apps/showcase/tailwind.config.js
@@ -2,9 +2,6 @@
const primeui = require('tailwindcss-primeui');
module.exports = {
- corePlugins: {
- preflight: false
- },
darkMode: ['selector', '[class="p-dark"]'],
content: ['./pages/**/*.vue', './layouts/**/*.vue', './components/**/*.{js,vue,ts}', './doc/**/*.{js,vue,ts}', './error.vue'],
plugins: [primeui],
diff --git a/package.json b/package.json
index 44ea2632d..d9aa6ea38 100644
--- a/package.json
+++ b/package.json
@@ -31,6 +31,7 @@
"build:showcase": "pnpm --filter showcase build",
"build:apidoc": "pnpm --filter themes build:tokens && pnpm --filter showcase build:apidoc",
"dev": "pnpm --filter showcase dev",
+ "preview": "pnpm --filter showcase preview",
"hot:dev": "DEV_ENV=hot pnpm --filter showcase dev",
"module:dev": "pnpm --filter @primevue/nuxt-module dev",
"security:check": "pnpm audit --prod --audit-level high",
diff --git a/packages/core/src/base/style/BaseStyle.js b/packages/core/src/base/style/BaseStyle.js
index a783238e1..6b93daadf 100644
--- a/packages/core/src/base/style/BaseStyle.js
+++ b/packages/core/src/base/style/BaseStyle.js
@@ -3,7 +3,9 @@ import { isNotEmpty, minifyCSS, resolve } from '@primeuix/utils/object';
import { useStyle } from '@primevue/core/usestyle';
const theme = ({ dt }) => `
-* {
+*,
+::before,
+::after {
box-sizing: border-box;
}
diff --git a/packages/primevue/src/datatable/style/DataTableStyle.js b/packages/primevue/src/datatable/style/DataTableStyle.js
index c9a43e7c1..8134a29ca 100644
--- a/packages/primevue/src/datatable/style/DataTableStyle.js
+++ b/packages/primevue/src/datatable/style/DataTableStyle.js
@@ -7,6 +7,7 @@ const theme = ({ dt }) => `
.p-datatable-table {
border-spacing: 0;
+ border-collapse: separate;
width: 100%;
}
diff --git a/packages/primevue/src/datepicker/style/DatePickerStyle.js b/packages/primevue/src/datepicker/style/DatePickerStyle.js
index 0fc675e97..1ce0b1ea5 100644
--- a/packages/primevue/src/datepicker/style/DatePickerStyle.js
+++ b/packages/primevue/src/datepicker/style/DatePickerStyle.js
@@ -68,6 +68,7 @@ const theme = ({ dt }) => `
inset-inline-end: ${dt('form.field.padding.x')};
margin-block-start: calc(-1 * (${dt('icon.size')} / 2));
color: ${dt('datepicker.input.icon.color')};
+ line-height: 1;
}
.p-datepicker-fluid {
diff --git a/packages/primevue/src/treetable/style/TreeTableStyle.js b/packages/primevue/src/treetable/style/TreeTableStyle.js
index 5fe5534ae..d56de5724 100644
--- a/packages/primevue/src/treetable/style/TreeTableStyle.js
+++ b/packages/primevue/src/treetable/style/TreeTableStyle.js
@@ -7,6 +7,7 @@ const theme = ({ dt }) => `
.p-treetable-table {
border-spacing: 0;
+ border-collapse: separate;
width: 100%;
}
diff --git a/packages/themes/src/presets/material/checkbox/index.js b/packages/themes/src/presets/material/checkbox/index.js
index ebb5ed1ac..1198d8d36 100644
--- a/packages/themes/src/presets/material/checkbox/index.js
+++ b/packages/themes/src/presets/material/checkbox/index.js
@@ -90,21 +90,21 @@ export default {
}
.p-checkbox {
+ --p-md-check-icon-t: 10px;
+ --p-md-check-icon-w: 6px;
+ --p-md-check-icon-h: 12px;
+}
+
+.p-checkbox-sm {
--p-md-check-icon-t: 8px;
--p-md-check-icon-w: 4px;
--p-md-check-icon-h: 10px;
}
-.p-checkbox-sm {
- --p-md-check-icon-t: 6px;
- --p-md-check-icon-w: 2px;
- --p-md-check-icon-h: 8px;
-}
-
.p-checkbox-lg {
- --p-md-check-icon-t: 10px;
- --p-md-check-icon-w: 6px;
- --p-md-check-icon-h: 14px;
+ --p-md-check-icon-t: 12px;
+ --p-md-check-icon-w: 8px;
+ --p-md-check-icon-h: 16px;
}
@keyframes p-md-check {