wotamann / vuetify-form-base

Schema-based Form Generator - Vue.js 2.0 Component based on Vuetify 2.0
https://wotamann.github.io/vuetify
230 stars 63 forks source link

Row gutters in grouped controls #53

Closed mcasto closed 4 years ago

mcasto commented 4 years ago

I have a schema with this setup:

    stats: {
      type: "group",
      label: "Stats",
      col: 6,
      class: "bordered overline pa-2",
      schema: {
        str: {
          type: "number",
          label: "STR",
          col: 2,
        },
        dex: {
          type: "number",
          label: "DEX",
          col: 2,
        },
        con: {
          type: "number",
          label: "CON",
          col: 2,
        },
        int: {
          type: "number",
          label: "INT",
          col: 2,
        },
        wis: {
          type: "number",
          label: "WIS",
          col: 2,
        },
        cha: {
          type: "number",
          label: "CHA",
          col: 2,
        },
      },
    },

It works fine, but I'd like to put some gutters between the fields. I did that globally on the rest of the form with: :row="{ justify: 'center', align: 'center', noGutters: false }" and it works like a charm, but that global setting doesn't carry through into the grouped items.

Am I overlooking something?

wotamann commented 4 years ago

Thanks for your comments!

schema type 'group' and 'array' calls v-form-base.vue recursively. Now the props class, coland row are passed correctly.

This should work with 0.2.5 - see example 'Group Controls'

group1: { type: 'group', col:6, row:{ noGutters: false }, class:'elevation-4 pa-2', schema: { A: 'text', B: 'text' } }

mcasto commented 4 years ago

For the record, in case I haven't already mentioned it, I love this component. Major kudos.