From 4f4792455bd1803be487f3c6053010bd84c5992b Mon Sep 17 00:00:00 2001 From: Pedro Galhardo Date: Tue, 18 Nov 2025 21:57:56 +0000 Subject: [PATCH 1/2] feat(flex): add justify-items utilities --- packages/docs/src/pages/en/styles/flex.md | 20 +++++++++++++++++++ .../src/styles/settings/_utilities.scss | 10 ++++++++++ 2 files changed, 30 insertions(+) diff --git a/packages/docs/src/pages/en/styles/flex.md b/packages/docs/src/pages/en/styles/flex.md index d7671036b62..9cb3eabc366 100644 --- a/packages/docs/src/pages/en/styles/flex.md +++ b/packages/docs/src/pages/en/styles/flex.md @@ -229,6 +229,26 @@ Control the layout of flex containers with alignment, justification and more wit | **justify-xl-space-between** | justify-content: space-between; | | **justify-xl-space-around** | justify-content: space-around; | | **justify-xl-space-evenly** | justify-content: space-evenly; | +| **justify-items-start** | justify-items: start; | +| **justify-items-end** | justify-items: end; | +| **justify-items-center** | justify-items: center; | +| **justify-items-stretch** | justify-items: stretch; | +| **justify-items-sm-start** | justify-items: start; | +| **justify-items-sm-end** | justify-items: end; | +| **justify-items-sm-center** | justify-items: center; | +| **justify-items-sm-stretch** | justify-items: stretch; | +| **justify-items-md-start** | justify-items: start; | +| **justify-items-md-end** | justify-items: end; | +| **justify-items-md-center** | justify-items: center; | +| **justify-items-md-stretch** | justify-items: stretch; | +| **justify-items-lg-start** | justify-items: start; | +| **justify-items-lg-end** | justify-items: end; | +| **justify-items-lg-center** | justify-items: center; | +| **justify-items-lg-stretch** | justify-items: stretch; | +| **justify-items-xl-start** | justify-items: start; | +| **justify-items-xl-end** | justify-items: end; | +| **justify-items-xl-center** | justify-items: center; | +| **justify-items-xl-stretch** | justify-items: stretch; | | **align-start** | align-items: flex-start; | | **align-end** | align-items: flex-end; | | **align-center** | align-items: center; | diff --git a/packages/vuetify/src/styles/settings/_utilities.scss b/packages/vuetify/src/styles/settings/_utilities.scss index d6d600a93a5..f55c3234855 100644 --- a/packages/vuetify/src/styles/settings/_utilities.scss +++ b/packages/vuetify/src/styles/settings/_utilities.scss @@ -117,6 +117,16 @@ $utilities: () !default; space-evenly: space-evenly, ) ), + "justify-items": ( + responsive: true, + property: justify-items, + values: ( + start: flex-start, + end: flex-end, + center: center, + stretch: stretch, + ) + ), "align-items": ( responsive: true, property: align-items, From 48e18c65f3b3180f197fc3e3cbe4264f61bf42ac Mon Sep 17 00:00:00 2001 From: J-Sek Date: Fri, 21 Nov 2025 09:53:25 +0100 Subject: [PATCH 2/2] docs: include in sass-variables.md --- packages/docs/src/pages/en/features/sass-variables.md | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/docs/src/pages/en/features/sass-variables.md b/packages/docs/src/pages/en/features/sass-variables.md index 8a0d1ec80ec..ed287ab6078 100644 --- a/packages/docs/src/pages/en/features/sass-variables.md +++ b/packages/docs/src/pages/en/features/sass-variables.md @@ -163,6 +163,7 @@ Utility classes are a powerful feature of Vuetify, but they can also be unnecess "height-screen": false, "height": false, "justify-content": false, + "justify-items": false, "left": false, "margin-bottom": false, "margin-end": false,