WIP: Implement uploads

templates/_partials/_upload_collection_form.html.twig

@@ -0,0 +1,16 @@
+<div {{ stimulus_controller('upload-collection', {
+    'endpointUpload': endpoint_upload,
+    'endpointDelete': path('app_upload_delete'),
+    'maxFiles': 1500,
+    'maxFilesize': 1000,
+    'acceptedFiles': null,
+    'chunking': true,
+    'params': upload_session_params,
+    'language': {
+        'fileTooBig': 'uploader.file_too_big'|trans({ '{maxFilesize}': 1000 }),
+        'invalidFileType': 'uploader.invalid_file_type'|trans,
+        'maxFilesExceeded': 'uploader.max_files_exceeded'|trans({ '{maxFiles}': 1500 })
+    }
+}) }}>
+    <div {{ stimulus_target('upload-collection', 'dropzone') }} class="dropzone"></div>
+</div>

templates/security/login.html.twig

@@ -16,18 +16,18 @@
                 {% endif %}
                 <form action="{{ path('app_security_login') }}" method="post">
                     <div class="mb-6">
-                        <label for="username" class="block text-sm font-semibold leading-6 text-gray-900">
+                        <label for="username" class="block leading-6 text-gray-900">
                             E-Mail:
                         </label>
                         <input type="text" id="username" name="_username" value="{{ last_username }}" class="mt-2 appearance-none text-slate-900 bg-white rounded-md block w-full px-3 h-10 shadow-sm sm:text-sm focus:outline-none placeholder:text-slate-400 focus:ring-2 focus:ring-primary ring-1 ring-slate-200">
                     </div>
                     <div class="mb-6">
-                        <label for="password" class="block text-sm font-semibold leading-6 text-gray-900">
+                        <label for="password" class="block leading-6 text-gray-900">
                             Passwort:
                         </label>
                         <input type="password" id="password" name="_password" class="mt-2 appearance-none text-slate-900 bg-white rounded-md block w-full px-3 h-10 shadow-sm sm:text-sm focus:outline-none placeholder:text-slate-400 focus:ring-2 focus:ring-primary ring-1 ring-slate-200">
                     </div>
-                    <button type="submit" class="inline-flex justify-center rounded-lg text-sm font-semibold py-2.5 px-4 bg-slate-900 text-white hover:bg-slate-700 w-full">
+                    <button type="submit" class="btn">
                         Login
                     </button>
                     <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">

templates/security/password_reset.html.twig

@@ -14,7 +14,7 @@
                         {{ form_widget(form.email) }}
                         {{ form_errors(form.email) }}
                     </div>
-                    <button type="submit" class="inline-flex justify-center rounded-lg text-sm font-semibold py-2.5 px-4 bg-slate-900 text-white hover:bg-slate-700 w-full">
+                    <button type="submit" class="btn">
                         Passwort zurückseten
                     </button>
                 {{ form_rest(form) }}

templates/teamer/profile.html.twig

@@ -17,7 +17,7 @@
 {% block content %}
     {{ form_start(form) }}
 
-    <div {{ stimulus_controller('tabs', {}, { 'buttonActive': 'btn--secondary' }) }}>
+    <div {{ stimulus_controller('tabs', {}, { 'buttonActive': 'btn--secondary btn--active' }) }}>
 
         <div class="grid lg:grid-cols-3 gap-y-8 lg:gap-y-0 lg:gap-x-16">
             <div class="flex flex-col space-y-2">
@@ -31,7 +31,7 @@
                     Bankverbindung
                 </button>
                 <button type="button" class="btn" {{ stimulus_target('tabs', 'button') }} {{ stimulus_action('tabs', 'select', null, { 'tab': 3 }) }}>
-                    Sonstiges
+                    Sonstiges/Foto
                 </button>
             </div>
             <div class="lg:col-span-2">
@@ -94,11 +94,33 @@
                     <h3 class="text-xl font-bold pb-2">
                         Sonstiges
                     </h3>
-                    <div class="flex flex-col space-y-4">
+                    <div class="flex flex-col space-y-4 pb-8">
                         {{ form_row(form.taxId) }}
                         {{ form_row(form.healthInsuranceCompany) }}
                         {{ form_row(form.remarks) }}
                     </div>
+                    <h3 class="text-xl font-bold pb-2">
+                        Fotoupload
+                    </h3>
+                    <div class="grid md:grid-cols-2 gap-8">
+                        <div>
+                            {% include '_partials/_upload_collection_form.html.twig' with {
+                                'endpoint_upload': path('_uploader_upload_photo'),
+                                'upload_session_params': form.vars.upload_session_params,
+                            } %}
+                        </div>
+                        <div>
+                            {% if teamer.photo %}
+                                <img src="{{ asset(teamer.photo.filename | imagine_filter('profile')) }}"
+                                     class="w-full h-auto rounded-full border-2 border-primary"
+                                     alt="{{ teamer.firstName }}">
+                            {% else %}
+                                <svg class="w-full h-auto text-gray-300" viewBox="0 0 10 10" fill="currentColor">
+                                    <circle r="5" cx="5" cy="5"/>
+                                </svg>
+                            {% endif %}
+                        </div>
+                    </div>
                 </div>
 
                 <div class="max-w-screen-md mx-auto">