Update form style
This commit is contained in:
parent
6381263786
commit
d0447e0c8e
5 changed files with 67 additions and 93 deletions
Binary file not shown.
|
@ -7,7 +7,7 @@ msgid ""
|
||||||
msgstr ""
|
msgstr ""
|
||||||
"Project-Id-Version: 0.0.1\n"
|
"Project-Id-Version: 0.0.1\n"
|
||||||
"Report-Msgid-Bugs-To: \n"
|
"Report-Msgid-Bugs-To: \n"
|
||||||
"POT-Creation-Date: 2023-04-18 11:13+0200\n"
|
"POT-Creation-Date: 2023-04-18 12:10+0200\n"
|
||||||
"PO-Revision-Date: 2022-12-21 17:30+0100\n"
|
"PO-Revision-Date: 2022-12-21 17:30+0100\n"
|
||||||
"Last-Translator: edpibu <git@edgarpierre.fr>\n"
|
"Last-Translator: edpibu <git@edgarpierre.fr>\n"
|
||||||
"Language-Team: edpibu <git@edgarpierre.fr>\n"
|
"Language-Team: edpibu <git@edgarpierre.fr>\n"
|
||||||
|
@ -188,18 +188,22 @@ msgstr "Annuler"
|
||||||
msgid "Confirm"
|
msgid "Confirm"
|
||||||
msgstr "Confirmer"
|
msgstr "Confirmer"
|
||||||
|
|
||||||
#: .\main\templates\main\form\base.html:17
|
#: .\main\templates\main\form\base.html:27
|
||||||
|
msgid "Reset"
|
||||||
|
msgstr "Réinitialiser"
|
||||||
|
|
||||||
|
#: .\main\templates\main\form\base.html:28
|
||||||
|
#: .\main\templates\main\tag\form_buttons.html:8
|
||||||
|
msgid "Save"
|
||||||
|
msgstr "Enregistrer"
|
||||||
|
|
||||||
|
#: .\main\templates\main\form\base.html:37
|
||||||
#: .\main\templates\main\table\invoice.html:11
|
#: .\main\templates\main\table\invoice.html:11
|
||||||
#: .\main\templates\main\table\invoice.html:24
|
#: .\main\templates\main\table\invoice.html:24
|
||||||
#: .\main\templates\main\tag\form_buttons.html:4
|
#: .\main\templates\main\tag\form_buttons.html:4
|
||||||
msgid "Delete"
|
msgid "Delete"
|
||||||
msgstr "Supprimer"
|
msgstr "Supprimer"
|
||||||
|
|
||||||
#: .\main\templates\main\form\base.html:20
|
|
||||||
#: .\main\templates\main\tag\form_buttons.html:8
|
|
||||||
msgid "Save"
|
|
||||||
msgstr "Enregistrer"
|
|
||||||
|
|
||||||
#: .\main\templates\main\index.html:31
|
#: .\main\templates\main\index.html:31
|
||||||
msgid "History"
|
msgid "History"
|
||||||
msgstr "Historique"
|
msgstr "Historique"
|
||||||
|
|
|
@ -1,92 +1,43 @@
|
||||||
form {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: auto 1fr;
|
|
||||||
grid-gap: var(--gap);
|
|
||||||
margin: var(--gap) 0;
|
|
||||||
line-height: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
form ul.errorlist {
|
form ul.errorlist {
|
||||||
grid-column: 1 / -1;
|
|
||||||
color: var(--red);
|
color: var(--red);
|
||||||
font-weight: 550;
|
font-weight: 550;
|
||||||
list-style-type: "! ";
|
list-style-type: "! ";
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
form input,
|
form tbody input,
|
||||||
form select,
|
form tbody select,
|
||||||
form a {
|
form tbody textarea {
|
||||||
padding: 0 var(--gap);
|
font: inherit;
|
||||||
}
|
|
||||||
form textarea {
|
|
||||||
padding: var(--gap);
|
|
||||||
}
|
|
||||||
|
|
||||||
form input {
|
|
||||||
color: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
form > label,
|
|
||||||
form > div > input[type="text"],
|
|
||||||
form > div > input[type="number"],
|
|
||||||
form > div > input[type="password"],
|
|
||||||
form > div > input[type="file"],
|
|
||||||
form > div > select,
|
|
||||||
form > div > textarea,
|
|
||||||
form > div > select {
|
|
||||||
font-size: inherit;
|
|
||||||
line-height: inherit;
|
|
||||||
font-family: inherit;
|
|
||||||
/*height: 100%;*/
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
form > div > select {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
form > div > textarea {
|
|
||||||
line-height: initial;
|
|
||||||
}
|
|
||||||
form > div > input[type="text"],
|
|
||||||
form > div > input[type="number"],
|
|
||||||
form > div > input[type="password"],
|
|
||||||
form > div > input[type="file"],
|
|
||||||
form > div > textarea,
|
|
||||||
form > div > select {
|
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: var(--radius);
|
background: var(--bg);
|
||||||
background: var(--bg-01);
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
line-height: 1.5;
|
||||||
}
|
}
|
||||||
|
|
||||||
form > .buttons {
|
form tfoot {
|
||||||
grid-column: 1 / -1;
|
|
||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
form > .buttons > * {
|
form tfoot input {
|
||||||
font-size: inherit;
|
font: inherit;
|
||||||
line-height: inherit;
|
line-height: 1.5;
|
||||||
font-family: inherit;
|
|
||||||
border: 0;
|
|
||||||
background: var(--bg-01);
|
|
||||||
cursor: pointer;
|
|
||||||
border-radius: var(--radius);
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
form > .buttons > * {
|
|
||||||
margin-left: var(--gap);
|
margin-left: var(--gap);
|
||||||
|
border-radius: var(--radius);
|
||||||
|
padding: 0 var(--gap);
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
form > .buttons > *:hover {
|
form tfoot input:hover {
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
form > .buttons input[type="submit"] {
|
form tfoot input[type="submit"] {
|
||||||
|
border: .1rem solid var(--green);
|
||||||
background: var(--green-1);
|
background: var(--green-1);
|
||||||
}
|
}
|
||||||
form > .buttons a.del,
|
form tfoot input[type="reset"] {
|
||||||
form > .buttons input.del {
|
border: .1rem solid var(--red);
|
||||||
background: var(--red);
|
background: var(--red-1);
|
||||||
color: var(--text-inv);
|
|
||||||
}
|
}
|
||||||
|
form tfoot a.del {
|
||||||
form input[hidden] {
|
color: var(--red);
|
||||||
display: none;
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -5,18 +5,34 @@
|
||||||
{% for error in form.non_field_errors %}<li>{{ error }}</li>{% endfor %}
|
{% for error in form.non_field_errors %}<li>{{ error }}</li>{% endfor %}
|
||||||
</ul>
|
</ul>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
<table>
|
||||||
|
<tbody>
|
||||||
{% for field in form %}
|
{% for field in form %}
|
||||||
{{ field.errors }}
|
{% if field.errors %}
|
||||||
<label for="{{ field.id_for_label }}">{{ field.label }}</label>
|
<tr>
|
||||||
<div>{{ field }}</div>
|
<td colspan="2">{{ field.errors }}</td>
|
||||||
{% endfor %}
|
</tr>
|
||||||
{% endblock %}
|
|
||||||
{% block buttons %}
|
|
||||||
<div class="buttons">
|
|
||||||
{% if not form.instance.adding %}
|
|
||||||
<a class="btn del" href="{{ form.instance.get_delete_url }}">{% translate "Delete" %}</a>
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<input type="reset" />
|
<tr>
|
||||||
<input type="submit" value="{% translate 'Save' %}" />
|
<th class="l">
|
||||||
</div>
|
<label for="{{ field.id_for_label }}">{{ field.label }}</label>
|
||||||
|
</th>
|
||||||
|
<td>{{ field }}</td>
|
||||||
|
</tr>
|
||||||
|
{% endfor %}
|
||||||
|
</tbody>
|
||||||
|
<tfoot>
|
||||||
|
<tr>
|
||||||
|
<td colspan="2">
|
||||||
|
{% block buttons %}
|
||||||
|
{% if not form.instance.adding %}
|
||||||
|
<a class="del" href="{{ form.instance.get_delete_url }}">{% translate "Delete" %}</a>
|
||||||
|
{% endif %}
|
||||||
|
<input type="reset" value="{% translate "Reset" %}" />
|
||||||
|
<input type="submit" value="{% translate "Save" %}" />
|
||||||
|
{% endblock %}
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tfoot>
|
||||||
|
</table>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -10,6 +10,9 @@
|
||||||
<link rel="stylesheet"
|
<link rel="stylesheet"
|
||||||
href="{% static 'main/css/form.css' %}"
|
href="{% static 'main/css/form.css' %}"
|
||||||
type="text/css"/>
|
type="text/css"/>
|
||||||
|
<link rel="stylesheet"
|
||||||
|
href="{% static 'main/css/table.css' %}"
|
||||||
|
type="text/css"/>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<h1>{% translate "Search" %}</h1>
|
<h1>{% translate "Search" %}</h1>
|
||||||
|
|
Loading…
Reference in a new issue