Update form style
This commit is contained in:
parent
6381263786
commit
d0447e0c8e
GPG Key ID:
9833D3C5A25BD227
Binary file not shown.
|
|
@ -7,7 +7,7 @@ msgid ""
|
|||
msgstr ""
|
||||
"Project-Id-Version: 0.0.1\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"
|
||||
"Last-Translator: edpibu <git@edgarpierre.fr>\n"
|
||||
"Language-Team: edpibu <git@edgarpierre.fr>\n"
|
||||
|
|
@ -188,18 +188,22 @@ msgstr "Annuler"
|
|||
msgid "Confirm"
|
||||
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:24
|
||||
#: .\main\templates\main\tag\form_buttons.html:4
|
||||
msgid "Delete"
|
||||
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
|
||||
msgid "History"
|
||||
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 {
|
||||
grid-column: 1 / -1;
|
||||
color: var(--red);
|
||||
font-weight: 550;
|
||||
list-style-type: "! ";
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
form input,
|
||||
form select,
|
||||
form a {
|
||||
padding: 0 var(--gap);
|
||||
}
|
||||
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 {
|
||||
form tbody input,
|
||||
form tbody select,
|
||||
form tbody textarea {
|
||||
font: inherit;
|
||||
border: none;
|
||||
border-radius: var(--radius);
|
||||
background: var(--bg-01);
|
||||
background: var(--bg);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
form > .buttons {
|
||||
grid-column: 1 / -1;
|
||||
form tfoot {
|
||||
text-align: right;
|
||||
}
|
||||
form > .buttons > * {
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
font-family: inherit;
|
||||
border: 0;
|
||||
background: var(--bg-01);
|
||||
cursor: pointer;
|
||||
border-radius: var(--radius);
|
||||
display: inline-block;
|
||||
}
|
||||
form > .buttons > * {
|
||||
form tfoot input {
|
||||
font: inherit;
|
||||
line-height: 1.5;
|
||||
margin-left: var(--gap);
|
||||
border-radius: var(--radius);
|
||||
padding: 0 var(--gap);
|
||||
cursor: pointer;
|
||||
}
|
||||
form > .buttons > *:hover {
|
||||
form tfoot input:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
form > .buttons input[type="submit"] {
|
||||
form tfoot input[type="submit"] {
|
||||
border: .1rem solid var(--green);
|
||||
background: var(--green-1);
|
||||
}
|
||||
form > .buttons a.del,
|
||||
form > .buttons input.del {
|
||||
background: var(--red);
|
||||
color: var(--text-inv);
|
||||
form tfoot input[type="reset"] {
|
||||
border: .1rem solid var(--red);
|
||||
background: var(--red-1);
|
||||
}
|
||||
|
||||
form input[hidden] {
|
||||
display: none;
|
||||
form tfoot a.del {
|
||||
color: var(--red);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,18 +5,34 @@
|
|||
{% for error in form.non_field_errors %}<li>{{ error }}</li>{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% for field in form %}
|
||||
{{ field.errors }}
|
||||
<label for="{{ field.id_for_label }}">{{ field.label }}</label>
|
||||
<div>{{ field }}</div>
|
||||
{% endfor %}
|
||||
{% 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 %}
|
||||
<input type="reset" />
|
||||
<input type="submit" value="{% translate 'Save' %}" />
|
||||
</div>
|
||||
<table>
|
||||
<tbody>
|
||||
{% for field in form %}
|
||||
{% if field.errors %}
|
||||
<tr>
|
||||
<td colspan="2">{{ field.errors }}</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
<tr>
|
||||
<th class="l">
|
||||
<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 %}
|
||||
|
|
|
|||
|
|
@ -10,6 +10,9 @@
|
|||
<link rel="stylesheet"
|
||||
href="{% static 'main/css/form.css' %}"
|
||||
type="text/css"/>
|
||||
<link rel="stylesheet"
|
||||
href="{% static 'main/css/table.css' %}"
|
||||
type="text/css"/>
|
||||
{% endblock %}
|
||||
{% block body %}
|
||||
<h1>{% translate "Search" %}</h1>
|
||||
|
|
|
|||
Loading…
Reference in New Issue