feat(VPagination): add props for coloring navigation buttons (#15691)

vuetifyjs · Jul 5, 2023 · a85b85f · a85b85f
1 parent a0d8d34
commit a85b85f
Showing 1 changed file with 17 additions and 12 deletions.
diff --git a/packages/vuetify/src/components/VPagination/VPagination.ts b/packages/vuetify/src/components/VPagination/VPagination.ts
@@ -29,6 +29,8 @@ export default mixins(
   props: {
     circle: Boolean,
     disabled: Boolean,
+    navigationColor: String,
+    navigationTextColor: String,
     length: {
       type: Number,
       default: 0,
@@ -181,18 +183,21 @@ export default mixins(
     },
     genIcon (h: CreateElement, icon: string, disabled: boolean, fn: EventListener, label: String): VNode {
       return h('li', [
-        h('button', {
-          staticClass: 'v-pagination__navigation',
-          class: {
-            'v-pagination__navigation--disabled': disabled,
-          },
-          attrs: {
-            disabled,
-            type: 'button',
-            'aria-label': label,
-          },
-          on: disabled ? {} : { click: fn },
-        }, [h(VIcon, [icon])]),
+        h('button',
+          this.setBackgroundColor(this.navigationColor, {
+            staticClass: 'v-pagination__navigation',
+            class: {
+              'v-pagination__navigation--disabled': disabled,
+            },
+            attrs: {
+              disabled,
+              type: 'button',
+              'aria-label': label,
+            },
+            on: disabled ? {} : { click: fn },
+          }),
+          [h(VIcon, { props: { color: this.navigationTextColor } }, [icon])]
+        ),
       ])
     },
     genItem (h: CreateElement, i: string | number): VNode {