From b0769058b320fb199347a6ad786456c6e39785d7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kate=C5=99ina=20=C4=8C=C3=AD=C5=BEkov=C3=A1?=
 <katterrina98@gmail.com>
Date: Wed, 27 May 2020 23:13:13 +0200
Subject: [PATCH] =?UTF-8?q?styly=20odevzd=C3=A1v=C3=A1tko=20a=20formul?=
 =?UTF-8?q?=C3=A1=C5=99e?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 mamweb/static/css/mamweb.css                 | 92 ++++++++++++--------
 seminar/templates/seminar/nahraj_reseni.html | 58 +++++++++---
 2 files changed, 103 insertions(+), 47 deletions(-)

diff --git a/mamweb/static/css/mamweb.css b/mamweb/static/css/mamweb.css
index a9621bc5..093da717 100644
--- a/mamweb/static/css/mamweb.css
+++ b/mamweb/static/css/mamweb.css
@@ -353,7 +353,52 @@ p.license-mobile {
 	display: none;
 }
 
+/*********************/
 
+/* přihláška a další formuláře */
+
+table.form td, table.form tr {
+	table-layout: fixed;
+	word-wrap: break-word;
+	padding: 5px;
+}
+
+table#reseni.form td,  table#reseni.form tr {
+	display: inline-table;
+}
+
+input[type="file"] {
+	max-width: 250px;
+	text-overflow: ellipsis;
+}
+
+.field-with-comment{
+  position:relative;
+}
+
+.field-comment{
+	display:none;
+	text-shadow: 0 1px 0 #fff;
+	background-color: #f0f0f0 ;
+	border-color: #dbdbdb;
+  position:absolute;
+  z-index:100;
+  border:1px;
+  border-style:solid;
+  border-width:1px;
+	border-radius: 5px;
+  padding:3px;
+  top:20px;
+  left:20px;
+}
+
+.field-with-comment:hover span.field-comment{
+  display:block;
+}
+
+input {
+	margin: 5px;
+}
 
 /**********************
  * Zmenšování displeje
@@ -420,10 +465,12 @@ ul.submenu {
 	margin-top: 8px; /* mezera mezi hlavním menu a submenu */
 }
 
+
 }
 
 /* stránka přes celý menší displej, větší mobil, tablet */
 @media(max-width: 800px){
+
 	ul.menu {
 		font-size: 80%;
 		margin-top: -2px;
@@ -444,6 +491,11 @@ ul.submenu {
 	a.ref-org-foto {
 		pointer-events: none;
 	}
+
+	table#reseni.form td, table#reseni.form tr {
+		display: inline-grid;
+		max-width: 300px;
+	}
 }
 
 /* malý tablet, mobil */
@@ -594,6 +646,10 @@ ul.submenu {
 		width: 100%;
 	}
 
+	table.form td, table.form tr {
+ 		display: inherit;
+ 	}
+
 }
 
 /*stránka organizátorů*/
@@ -953,39 +1009,3 @@ p.gdpr {
 div.gdpr {
 	font-size: 6pt;
 }
-
-/* přihláška a další formuláře */
-
-table.form td, table.form tr {
-	table-layout: fixed;
-	word-wrap: break-word;
-	padding: 5px;
-}
-
-.field-with-comment{
-  position:relative;
-}
-
-.field-comment{
-	display:none;
-	text-shadow: 0 1px 0 #fff;
-	background-color: #f0f0f0 ;
-	border-color: #dbdbdb;
-  position:absolute;
-  z-index:100;
-  border:1px;
-  border-style:solid;
-  border-width:1px;
-	border-radius: 5px;
-  padding:3px;
-  top:20px;
-  left:20px;
-}
-
-.field-with-comment:hover span.field-comment{
-  display:block;
-}
-
-input {
-	margin: 5px;
-}
diff --git a/seminar/templates/seminar/nahraj_reseni.html b/seminar/templates/seminar/nahraj_reseni.html
index 7fa02da7..861d7bdd 100644
--- a/seminar/templates/seminar/nahraj_reseni.html
+++ b/seminar/templates/seminar/nahraj_reseni.html
@@ -14,13 +14,26 @@
 </h1>
 <form enctype="multipart/form-data" action="{% url 'seminar_nahraj_reseni' %}" method="post">
   {% csrf_token %}
-{{ form }}
+  <table class='form' id="reseni">
+    <tr>
+      {% for field in form %}
+      <td>
+        <label class="field-label{% if field.field.required %} field-required{% endif %}" for="{{ field.id_for_label }}">
+          {{ field.label }}:
+        </label>
+      </td>
+      <td>
+        {{ field }}
+      </td>
+      {% endfor %}
+    </tr>
+  </table>
+
 
 <hr>
 
 {{ prilohy.management_form }}
 
-
 <h4>Soubory s řešením</h4>
 
 <div id="form_set">
@@ -28,8 +41,7 @@
 	<div class="attachment">
 	{{ form.non_field_errors }}
 	{# {{ form.errors }} FIXME: možná tohle chceme zobrazovat? #}
-        <table class='form' id=''>
-
+        <table class='form' id="reseni">
           <tr>
           {% for field in form.visible_fields %}
 
@@ -46,12 +58,13 @@
 
             <td><span class="field-error">{{ field.errors }}</span></td>
 
-            {# TODO #}
           {% endfor %}
-          </tr>
 
-        </table>
-	<input type="button" value="Odebrat přílohu" class="remove_attachment" id="{{form.prefix}}-jsremove">
+        <td>
+          <input type="button" value="Odebrat přílohu" class="remove_attachment" id="{{form.prefix}}-jsremove">
+        </td>
+	</tr>
+  </table>
 	</div>
 {% endfor %}
 </div>
@@ -60,10 +73,33 @@
 
 <div id="empty_form" style="display:none">
 	<div class="attachment">
-        <table class='no_error'>
-            {{ prilohy.empty_form }}
-        </table>
+
+        <table class='form' id="reseni" class='no_error'>
+          <tr>
+          {% for field in prilohy.empty_form.visible_fields %}
+
+              <td>
+                <label class="field-label{% if field.field.required %} field-required{% endif %}" for="{{ field.id_for_label }}">
+                  {{ field.label }}:
+                </label>
+
+              </td>
+              <td {% if field.help_text %} class="field-with-comment"{% endif %}>
+                {{ field }}
+                <span class="field-comment">{{ field.help_text|safe }}
+              </td>
+
+            <td><span class="field-error">{{ field.errors }}</span></td>
+
+          {% endfor %}
+
+        <td>
+
+
 	<input type="button" value="Odebrat přílohu" class="remove_attachment" id="id_prilohy-__prefix__-jsremove">
+  </td>
+</tr>
+</table>
 	</div>
 </div>