<div class="file-upload--light">
<div class="file-upload__message">
<div class="message--error has-no-space">
<div class="message__container">
<span class="visually-hidden"></span>
<div class="message__content">
<p class="message__text">Fehler beim Upload</p>
</div>
</div>
</div>
</div>
<input type="file" class="file-upload__file-input" accept=".csv">
<div class="file-upload__drop-box state-upload-failed">
<div class="file-upload__files-box">
<div class="file-upload__file-box">
<div class="file-upload__file-name-section">
<div class="file-upload__file-icon"></div>
<div class="file-upload__file-name">File.csv</div>
</div>
<div class="file-upload__upload-control-section">
<div class="file-upload__state--upload-failed">
Fehlgeschlagen
</div>
</div>
</div>
</div>
</div>
<div class="file-upload__helper">
<div class="file-upload__helper--text">Please note that this form field has a helper text</div>
<div class="file-upload__helper--tooltip">
<button type="button" class="info-tooltip__toggle--small" data-info-tooltip-content="Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet">
<span class="visually-hidden">Information</span>
</button>
</div>
</div>
</div>
{% include '@SharedComponents/modules/shared/components/form-components/file-upload/file-upload.twig' %}
{
"variant": "light",
"accept": ".csv",
"fileName": "File.csv",
"dragHereText": "Datei hier ablegen oder",
"browseFileButton": {
"variant": "text-regular",
"title": "auswählen",
"icon": "",
"type": "a",
"href": "#",
"attributes": {
"data-file-upload-link": true
}
},
"uploadingInProgressText": "Laden...",
"uploadingSuccessText": "Hochgeladen",
"uploadingFailedText": "Fehlgeschlagen",
"message": {
"variant": "error",
"isHidden": false,
"message": "Fehler beim Upload",
"spacing": false
},
"loadingSpinner": {
"variant": "small",
"centerVertical": true,
"centerHorizontal": true,
"colorVariant": "warning"
},
"uploadingState": "upload-failed",
"helper": "Please note that this form field has a helper text",
"tooltip": {
"variant": "small",
"title": "Information",
"content": "Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet"
}
}
import './file-upload.scss';
import FileUpload, {selector as sel} from 'cando-cx-components-library/components/modules/shared/components/form-components/file-upload/file-upload';
export default FileUpload;
export const selector = sel;
@import "~shared/base";
@import "~cando-cx-components-library/components/modules/shared/components/form-components/file-upload/file-upload";
No notes defined.