FileInput is not adjusting to Grid

[remyvdwereld]

Describe the issue

The FileInput component is not adjusting to the Grid. I need to add a width of 100% to achieve this.

Check the difference in this example with a TextInput.

Sandbox

[RubenSibon]

Thanks for submitting the report! The Sandbox link does not seem to work (for me at least). Can you provide steps to reproduce this issue as an alternative as well?

is it possible to remove the default padding-left in a grid? Or create a property for this?

Can you make a separate issue for this? I know it's cumbersome, but would keep the scope of the issues more clear. You could point to the same Sandbox, though.

[RubenSibon]

Thanks, but no thanks @lattaai1.

[dlnr]

If this is a requirement for your form you could add some CSS:

input[type="file"] {
  inline-size: 100%;
}

Until we add this to the component of course.

[VincentSmedinga]

I agree that File Input should be 100% wide, just like our comparable input components; at least until we have more advice on sizing and arranging form fields. This creates a common baseline and lets the fields better adapt to local layout styles. I’ve made a PR to implement this and will update this issue as soon as that has been released.

Note that the suggestion above requires box-sizing: border-box; and best uses .ams-file-input as the selector.