Regione Toscana Design System

Input file component: Sm 

<div class="rtds-input-field rtds-gap-1 ">
    <label for="inputFileId" class="rtds-input-field__label">
        Text label

    </label>

    <div class="rtds-input rtds-input--sm">
        <input id="inputFileId" class="rtds-text-sm rtds-input-placeholder" type="file">
    </div>

</div>
 
{% extends '@input-field--sm' %}
 
{
  "label": "Text label",
  "inputId": "inputFileId",
  "inputType": "file"
}
  • Content: 
    /*
 * @file
 * Styles for the input file component.
 */

:where(.rtds-input) input[type="file"] {
    @apply rtds-w-full;
}

::file-selector-button {
    @apply rtds-btn rtds-btn--secondary rtds-transition-all rtds-cursor-pointer rtds-mr-4 rtds-border-0;
}

/*:where(.rtds-input) input[type="file"]::before {
}*/

:where(.rtds-input--sm) ::file-selector-button {
    @apply rtds-btn--s;
}

:where(.rtds-input--lg) ::file-selector-button {
    @apply rtds-btn--l;
}
  • URL: /components/raw/input-file/input-file.css
  • Filesystem Path: components/03-molecules/forms/input-file/input-file.css
  • Size: 464 Bytes

No notes defined.