Skip to content

TInputGroup: variants css overwrites props #57

Description

@tobiasdiez

If you have a input group

<t-input-group
  label="Email address"
  variant="important"
>
  <t-input
    v-model="email"
    v-focus
  />
</t-input-group>

and style config

TInputGroup: {
    fixedClasses: {
      wrapper: '',
      label: 'block text-sm text-gray-700',
      body: 'mt-1',
      feedback: ' text-sm text-sm mt-1',
      description: 'text-gray-400 text-sm',
    },
    classes: {
      wrapper: '',
      label: '',
      body: '',
      feedback: 'text-gray-400',
      description: 'text-gray-400',
    },
    variants: {
      important: {
        label: 'font-semibold',
      },
    },
  },

then the config option label from variants > important is overwriting the prop label and font-semibold instead of Email address is the label text.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions