Skip to content
This repository was archived by the owner on Jun 21, 2022. It is now read-only.

Commit 5a2ec46

Browse files
rico-hengstkuro610
rico-hengst
authored and
kuro610
committed
Update recipe editor to BS5
1 parent 84a85f4 commit 5a2ec46

File tree

4 files changed

+67
-75
lines changed

4 files changed

+67
-75
lines changed

‎root/static/css/style.css‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -121,10 +121,6 @@ button.alert-link {
121121
display: inline;
122122
}
123123

124-
input[type="number"] {
125-
text-align: right;
126-
}
127-
128124
/* <li>s with checkbox inside should not have any bullet point */
129125
li.checkbox {
130126
list-style-type: none;

‎root/static/js/script.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@
3434
document.querySelectorAll("textarea.with-markdown-preview, input[type=text].with-markdown-preview").forEach( elem => {
3535
let row = elem.parentNode.parentNode;
3636
let col = document.createElement("div");
37-
col.className = "col-sm-6";
37+
col.className = "col-md-6";
3838
let preview = document.createElement("div");
3939
preview.className = "markdown-preview";
4040

‎root/templates/recipe/edit.tt‎

Lines changed: 65 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -1,91 +1,87 @@
11

22
[% escape_title( 'Recipe', recipe.name ) %]
33

4-
<div class="row mb-5">
5-
<div class="col">
6-
[% IF import_url %]
7-
<form method="get" action="[% import_url %]" class="inline">
8-
<button type="submit" class="btn btn-secondary" data-toggle="tooltip" title="Import this recipe into another one of your projects">
9-
<i class="material-icons ">import_export</i> Import into another project
4+
[% IF import_url %]<form id="import"method="get" action="[% import_url %]"></form>[% END %]
5+
6+
<div class="my-3">
7+
<div class="row gy-2">
8+
<div class="btn-group offset-xxl-3 col-xxl-3 col-md-4 col-sm-6">
9+
<button type="button" class="btn btn-primary dropdown-toggle[% dishes.size == 0 ? " disabled" : "" %]" data-bs-toggle="collapse" data-bs-target="#usage" aria-expanded="false" aria-controls="usage">
10+
Used in <span class="badge bg-light text-dark">[% dishes.size %]</span> dish[% dishes.size != 1 ? "es" : "" %]
1011
</button>
11-
</form>
12-
[% END %]
12+
</div>
1313
[% IF public_url %]
14-
<a href="[% public_url %]" class="btn btn-secondary">Share link</a>
14+
<a class="btn-group col-xxl-3 col-md-4 col-sm-6" href="[% public_url %]">
15+
<button class="btn btn-secondary">Share link</button>
16+
</a>
17+
[% END;
18+
IF import_url %]
19+
<div class="btn-group col-xxl-3 col-md-4 col-sm-6">
20+
<button type="submit" class="btn btn-secondary" form="import" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Import this recipe into another one of your projects">
21+
<i class="material-icons ">import_export</i> Import into another project
22+
</button>
23+
</div>
1524
[% END %]
1625
</div>
26+
27+
[% IF dishes.size > 0 %]
28+
<div class="collapse mt-2" id="usage">
29+
<div class="card">
30+
<ul class="list-group">
31+
[% FOR dish IN dishes %]
32+
<li class="list-group-item">[% loop.count %]. dish <a href="[% dish.url %]">[% dish.name | html %]</a> for meal <em>[% dish.meal | html %]</em> on [% display_date(dish.date, {html=>1}) %]</li>
33+
[% END %]
34+
</ul>
35+
</div>
36+
</div>
37+
[% END %]
1738
</div>
1839

1940
<form method="post" action="[% update_url %]">
2041

21-
<div class="row">
22-
<div class="col-sm-12 py-3">
23-
<div class="card">
24-
<div class="card-header">
25-
<h3>General information</h3>
42+
<div class="card">
43+
<div class="card-header">
44+
<h3>General information</h3>
45+
</div>
46+
<div class="card-body">
47+
<div class="row mb-3">
48+
<div class="col-md">
49+
<label for="name" class="form-label">Name</label>
50+
<input id="name" class="form-control" type="text" name="name" value="[% recipe.name | html %]">
51+
</div>
52+
<div class="col-md mt-3 mt-md-0">
53+
<label for="servings" class="form-label">Servings</label>
54+
<input id="servings" class="form-control" type="number" name="servings" value="[% recipe.servings %]">
55+
</div>
56+
</div>
57+
<div class="mb-3">
58+
<label for="tags" class="form-label">Tags</label>
59+
<input id="tags" class="form-control" type="text" name="tags" value="[% recipe.tags_rs.joined %]">
60+
</div>
61+
<div class="mb-3">
62+
<label for="preparation" class="form-label">Preparation</label>
63+
<div class="row">
64+
<div class="col-md-6 mb-md-0 mb-2">
65+
<textarea id="preparation" class="form-control with-markdown-preview" name="preparation" rows="10">[% recipe.preparation | html %]</textarea>
2666
</div>
27-
<div class="card-body">
28-
29-
<div class="form-group row">
30-
<label for="name" class="col-sm-2 col-form-label">Name</label>
31-
<div class="col-sm-10">
32-
<input type="text" class="form-control" name="name" id="name" value="[% recipe.name | html %]">
33-
</div>
34-
</div>
35-
<div class="form-group row">
36-
<label for="servings" class="col-sm-2 col-form-label">Servings</label>
37-
<div class="col-sm-10">
38-
<input type="number" class="form-control" name="servings" id="servings" value="[% recipe.servings %]">
39-
</div>
40-
</div>
41-
<div class="form-group row">
42-
<label for="tags" class="col-sm-2 col-form-label">Tags</label>
43-
<div class="col-sm-10">
44-
<input type="text" class="form-control" name="tags" id="tags" value="[% recipe.tags_rs.joined %]">
45-
</div>
46-
</div>
47-
<div class="form-group row">
48-
<label for="preparation" class="col-sm-2 col-form-label">Preparation</label>
49-
<div class="col-sm-10">
50-
<div class="row">
51-
<div class="col-sm-6 mb-sm-0 mb-2">
52-
<textarea class="form-control with-markdown-preview" name="preparation" id="preparation" rows="10">[% recipe.preparation | html %]</textarea>
53-
</div>
54-
</div>
55-
</div>
56-
</div>
57-
<div class="form-group row">
58-
<label for="preparation" class="col-sm-2 col-form-label">Description</label>
59-
<div class="col-sm-10">
60-
<div class="row">
61-
<div class="col-sm-6 mb-sm-0 mb-2">
62-
<textarea class="form-control with-markdown-preview" name="description" id="description" rows="10">[% recipe.description | html %]</textarea>
63-
</div>
64-
</div>
65-
</div>
66-
</div>
67-
<div class="form-group row py-3">
68-
<label for="preparation" class="col-sm-2 col-form-label"></label>
69-
<div class="col-sm-10 text-end">
70-
<button type="submit" class="btn btn-primary">Update Recipe</button>
71-
</div>
72-
</div>
73-
67+
</div>
68+
</div>
69+
<div class="mb-3">
70+
<label for="description" class="form-label">Description</label>
71+
<div class="row">
72+
<div class="col-sm-6 mb-sm-0 mb-2">
73+
<textarea id="description" class="form-control with-markdown-preview" name="description" rows="10">[% recipe.description | html %]</textarea>
7474
</div>
7575
</div>
7676
</div>
77+
<div class="text-end">
78+
<button type="submit" class="btn btn-primary">Update Recipe</button>
79+
</div>
7780
</div>
81+
</div>
7882

7983
[% INCLUDE 'includes/forms/ingredients_editor.tt' %]
8084

8185
</form>
8286

8387
[% INCLUDE 'includes/forms/ingredients_add.tt' %]
84-
85-
<h2>Where <em>[% recipe.name | html %]</em> is used</h2>
86-
87-
<ul>
88-
[% FOR dish IN dishes %]
89-
<li>dish <a href="[% dish.url %]">[% dish.name | html %]</a> for meal <em>[% dish.meal | html %]</em> on [% display_date(dish.date, {html=>1}) %]</li>
90-
[% END %]
91-
</ul>

‎root/templates/wrapper.tt‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -112,7 +112,7 @@
112112

113113

114114
<main class="container-md mb-2">
115-
<div class="row py-3">
115+
<div class="row my-3">
116116
<div class="col-12">
117117
[% WHILE (message = messages.next) %]
118118
<div class="alert alert-[% SWITCH message.type; CASE "debug" %]dark[% CASE "warn" %]warning[% CASE "error" %]danger[% CASE %]success[% END %]" role="alert">

0 commit comments

Comments
 (0)