Revision 1b866d9e snf-astakos-app/astakos/im/templates/im/astakosgroup_form_demo.html
b/snf-astakos-app/astakos/im/templates/im/astakosgroup_form_demo.html | ||
---|---|---|
2 | 2 |
|
3 | 3 |
{% block page.body %} |
4 | 4 |
|
5 |
|
|
5 |
{% block headjs %} |
|
6 |
{{ block.super }} |
|
7 |
<script src="{{ IM_STATIC_URL }}js/quotas.js"></script> |
|
8 |
{% endblock %} |
|
6 | 9 |
<form action="" method="post" class="withlabels quotas-form">{% csrf_token %} |
10 |
|
|
7 | 11 |
<fieldset> |
8 |
<legend>1. CREATE GROUP</legend> |
|
12 |
<legend> |
|
13 |
1. CREATE GROUP |
|
14 |
<span class="info"> |
|
15 |
<em>more info</em> |
|
16 |
<span>Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text</span> |
|
17 |
</span> |
|
18 |
</legend> |
|
9 | 19 |
<div class="form-row"> |
10 | 20 |
<p class="clearfix"> |
11 | 21 |
<label for="id">ID</label> |
... | ... | |
17 | 27 |
</span> |
18 | 28 |
</p> |
19 | 29 |
</div> |
20 |
<div class="form-row with-errors ">
|
|
30 |
<div class="form-row"> |
|
21 | 31 |
|
22 | 32 |
<p class="clearfix"> |
23 | 33 |
<label for="name">Name</label> |
... | ... | |
28 | 38 |
<span>Help Text</span> |
29 | 39 |
</span> |
30 | 40 |
</p> |
31 |
<div class="form-error" style="left: 270.1px; top: 21.2px; width: 292px; margin-left: 224px; margin-bottom: 5px;">This field is required.<br></div> |
|
41 |
|
|
32 | 42 |
</div> |
33 | 43 |
<div class="form-row"> |
34 | 44 |
<p class="clearfix"> |
... | ... | |
64 | 74 |
</span> |
65 | 75 |
</p> |
66 | 76 |
</div> |
67 |
<div class="form-row with-checkbox">
|
|
77 |
<div class="form-row "> |
|
68 | 78 |
<p class="clearfix "> |
69 |
<a href="javascript:void(0)" class="checkbox-widget"></a><label for="id_moderation_enabled" class="checkbox-label">Moderation enabled</label>
|
|
79 |
<label for="id_moderation_enabled">Modaration</label>
|
|
70 | 80 |
<input type="checkbox" id="id_moderation_enabled" name="moderation_enabled" autocomplete="off" style="display: none;"> |
71 | 81 |
<span class="extra-img"> </span> |
72 | 82 |
<span class="info"> |
... | ... | |
75 | 85 |
</span> |
76 | 86 |
</p> |
77 | 87 |
</div> |
88 |
<div class="double-checks"> |
|
89 |
<label>Max users per group</label> |
|
90 |
<div class="form-row"> |
|
91 |
<p class="clearfix"> |
|
92 |
<label for="vm_per_user_unlimited">Unlimited</label> |
|
93 |
<input type="checkbox" id="vm_per_user_unlimited" name="vm_per_user_unlimited" class="unlimited" checked="checked"> |
|
94 |
</p> |
|
95 |
</div> |
|
96 |
<div class="form-row"> |
|
97 |
<p class="clearfix"> |
|
98 |
<label for="vm_per_user_limited">Limited</label> |
|
99 |
<input type="checkbox" id="vm_per_user_limited" name="vm_per_user_limited" class="limited"> |
|
100 |
<input type="text" id="vm_user_limited_num"/> |
|
101 |
|
|
102 |
</p> |
|
103 |
</div> |
|
104 |
|
|
105 |
</div> |
|
78 | 106 |
</fieldset> |
79 |
<fieldset> |
|
80 |
<legend>2. CHOOSE RESOURCES</legend> |
|
107 |
<fieldset id="icons"> |
|
108 |
<legend> |
|
109 |
2. CHOOSE RESOURCES |
|
110 |
<span class="info"> |
|
111 |
<em>more info</em> |
|
112 |
<span>Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text</span> |
|
113 |
</span> |
|
114 |
</legend> |
|
115 |
{% for key in groups.items %} |
|
116 |
{% endfor %} |
|
117 |
|
|
81 | 118 |
<ul class="clearfix"> |
82 |
<li><a href="#" id="vm">VM</a></li> |
|
83 |
<li><a href="#" id="storage">STORAGE</a></li> |
|
84 |
<li class="rel"><a href="#" id="cpu">CPU</a></li> |
|
85 |
<li class="rel"><a href="#" id="ram">RAM</a></li> |
|
86 |
<li class="rel"><a href="#" id="diskspace">DISKSPACE</a></li> |
|
119 |
|
|
120 |
<li><a href="#vm_1" id="vm_1"><img src="/static/im/images/create-resource-vm.png" alt="vm"/></a></li> |
|
121 |
<li><a href="#storage_1" id="storage_1"><img src="/static/im/images/create-resource-storage.png" alt="storage"/></a></li> |
|
87 | 122 |
</ul> |
88 | 123 |
<p class="msg">if you choose CPU without selecting any VMs you must also select RAM and DISKSPACE</p> |
89 |
</fieldset> |
|
90 |
<fieldset class="quota vm"> |
|
91 |
<a href="#" class="delete"><strong>X</strong> remove resource</a> |
|
92 |
<legend>VM</legend> |
|
93 |
<div class="form-row"> |
|
94 |
<p class="clearfix"> |
|
95 |
<label for="num_vms">Total VM</label> |
|
96 |
<input type="text" name="num_vms"> |
|
97 |
<span class="extra-img"> </span> |
|
98 |
<span class="info"> |
|
99 |
<em>more info</em> |
|
100 |
<span>Help Text</span> |
|
101 |
</span> |
|
102 |
</p> |
|
103 |
</div> |
|
104 |
</fieldset> |
|
105 |
<fieldset class="quota storage"> |
|
106 |
<a href="#" class="delete"><strong>X</strong> remove resource</a> |
|
107 |
<legend>STORAGE</legend> |
|
108 |
<div class="form-row"> |
|
109 |
<p class="clearfix"> |
|
110 |
<label for="num_vms">Total storage</label> |
|
111 |
<input type="text" name="num_vms"> |
|
112 |
<span class="extra-img"> </span> |
|
113 |
<span class="info"> |
|
114 |
<em>more info</em> |
|
115 |
<span>Help Text</span> |
|
116 |
</span> |
|
117 |
</p> |
|
118 |
</div> |
|
119 |
</fieldset> |
|
120 |
<fieldset class="quota cpu"> |
|
121 |
<a href="#" class="delete"><strong>X</strong> remove resource</a> |
|
122 |
<legend>CPU</legend> |
|
123 |
<div class="form-row"> |
|
124 |
<p class="clearfix"> |
|
125 |
<label for="num_vms">Total cpu</label> |
|
126 |
<input type="text" name="num_cpu"> |
|
127 |
<span class="extra-img"> </span> |
|
128 |
<span class="info"> |
|
129 |
<em>more info</em> |
|
130 |
<span>Help Text</span> |
|
131 |
</span> |
|
132 |
</p> |
|
133 |
</div> |
|
134 |
</fieldset> |
|
135 |
<fieldset class="quota ram"> |
|
136 |
<a href="#" class="delete"><strong>X</strong> remove resource</a> |
|
137 |
<legend>RAM</legend> |
|
138 |
<div class="form-row"> |
|
139 |
<p class="clearfix"> |
|
140 |
<label for="num_ram">Total ram</label> |
|
141 |
<input type="text" name="num_ram"> |
|
142 |
<span class="extra-img"> </span> |
|
143 |
<span class="info"> |
|
144 |
<em>more info</em> |
|
145 |
<span>Help Text</span> |
|
146 |
</span> |
|
147 |
</p> |
|
148 |
</div> |
|
149 |
</fieldset> |
|
150 |
<fieldset class="quota diskspace"> |
|
151 |
<a href="#" class="delete"><strong>X</strong> remove resource</a> |
|
152 |
<legend>DISKSPACE</legend> |
|
153 |
<div class="form-row"> |
|
154 |
<p class="clearfix"> |
|
155 |
<label for="num_diskspace">Total diskspace</label> |
|
156 |
<input type="text" name="num_diskspace"> |
|
157 |
<span class="extra-img"> </span> |
|
158 |
<span class="info"> |
|
159 |
<em>more info</em> |
|
160 |
<span>Help Text</span> |
|
161 |
</span> |
|
162 |
</p> |
|
163 |
</div> |
|
164 | 124 |
</fieldset> |
125 |
<div class="foo"> |
|
126 |
|
|
127 |
</div> |
|
128 |
<div class="not-foo"> |
|
129 |
<div class="group vm_1"> |
|
130 |
<a href="#icons" class="delete"><strong>X</strong> remove resource</a> |
|
131 |
<fieldset class="quota vm" style="background:none;"> |
|
132 |
<legend>VM</legend> |
|
133 |
<div class="form-row"> |
|
134 |
<p class="clearfix"> |
|
135 |
<label for="num_vms">Total VMs</label> |
|
136 |
<input type="text" name="num_vms"> |
|
137 |
<span class="extra-img"> </span> |
|
138 |
<span class="info"> |
|
139 |
<em>more info</em> |
|
140 |
<span>Help Text</span> |
|
141 |
</span> |
|
142 |
</p> |
|
143 |
</div> |
|
144 |
<div class="double-checks"> |
|
145 |
<label>Max VMs per user</label> |
|
146 |
<div class="form-row"> |
|
147 |
<p class="clearfix"> |
|
148 |
<label for="vm_per_user_unlimited">Unlimited</label> |
|
149 |
<input type="checkbox" id="vm_per_user_unlimited" name="vm_per_user_unlimited" class="unlimited" checked="checked"> |
|
150 |
</p> |
|
151 |
</div> |
|
152 |
<div class="form-row"> |
|
153 |
<p class="clearfix"> |
|
154 |
<label for="vm_per_user_limited">Limited</label> |
|
155 |
<input type="checkbox" id="vm_per_user_limited" name="vm_per_user_limited" class="limited"> |
|
156 |
<input type="text" id="vm_user_limited_num"/> |
|
157 |
|
|
158 |
</p> |
|
159 |
</div> |
|
160 |
|
|
161 |
</div> |
|
162 |
</fieldset> |
|
163 |
<fieldset class="quota cpu" style="background:none;"> |
|
164 |
|
|
165 |
<legend>cpu</legend> |
|
166 |
<div class="form-row"> |
|
167 |
<p class="clearfix"> |
|
168 |
<label for="num_cpu">Total cpus</label> |
|
169 |
<input type="text" name="num_cpu"> |
|
170 |
<span class="extra-img"> </span> |
|
171 |
<span class="info"> |
|
172 |
<em>more info</em> |
|
173 |
<span>Help Text</span> |
|
174 |
</span> |
|
175 |
</p> |
|
176 |
</div> |
|
177 |
<div class="double-checks"> |
|
178 |
<label>Max cpus per user</label> |
|
179 |
<div class="form-row"> |
|
180 |
<p class="clearfix"> |
|
181 |
<label for="cpu_per_user_unlimited">Unlimited</label> |
|
182 |
<input type="checkbox" id="cpu_per_user_unlimited" name="cpu_per_user_unlimited" class="unlimited" checked="checked"> |
|
183 |
</p> |
|
184 |
</div> |
|
185 |
<div class="form-row"> |
|
186 |
<p class="clearfix"> |
|
187 |
<label for="cpu_per_user_limited">Limited</label> |
|
188 |
<input type="checkbox" id="cpu_per_user_limited" name="cpu_per_user_limited" class="limited"> |
|
189 |
<input type="text" id="cpu_user_limited_num"/> |
|
190 |
|
|
191 |
</p> |
|
192 |
</div> |
|
193 |
|
|
194 |
</div> |
|
195 |
</fieldset> |
|
196 |
<fieldset class="quota ram"> |
|
197 |
|
|
198 |
<legend>ram</legend> |
|
199 |
<div class="form-row"> |
|
200 |
<p class="clearfix"> |
|
201 |
<label for="num_ram">Total ram</label> |
|
202 |
<input type="text" name="num_ram"> |
|
203 |
<span class="extra-img"> </span> |
|
204 |
<span class="info"> |
|
205 |
<em>more info</em> |
|
206 |
<span>Help Text</span> |
|
207 |
</span> |
|
208 |
</p> |
|
209 |
</div> |
|
210 |
<div class="double-checks"> |
|
211 |
<label>Max ram per user</label> |
|
212 |
<div class="form-row"> |
|
213 |
<p class="clearfix"> |
|
214 |
<label for="ram_per_user_unlimited">Unlimited</label> |
|
215 |
<input type="checkbox" id="ram_per_user_unlimited" name="ram_per_user_unlimited" class="unlimited" checked="checked"> |
|
216 |
</p> |
|
217 |
</div> |
|
218 |
<div class="form-row"> |
|
219 |
<p class="clearfix"> |
|
220 |
<label for="ram_per_user_limited">Limited</label> |
|
221 |
<input type="checkbox" id="ram_per_user_limited" name="ram_per_user_limited" class="limited"> |
|
222 |
<input type="text" id="ram_user_limited_num"/> |
|
223 |
|
|
224 |
</p> |
|
225 |
</div> |
|
226 |
|
|
227 |
</div> |
|
228 |
</fieldset> |
|
229 |
</div> |
|
230 |
<div class="group storage_1"> |
|
231 |
<a href="#icons" class="delete"><strong>X</strong> remove resource</a> |
|
232 |
<fieldset class="quota storage"> |
|
233 |
<legend>STORAGE</legend> |
|
234 |
<div class="form-row"> |
|
235 |
<p class="clearfix"> |
|
236 |
<label for="num_storage">Total storage</label> |
|
237 |
<input type="text" name="num_storage"> |
|
238 |
<span class="extra-img"> </span> |
|
239 |
<span class="info"> |
|
240 |
<em>more info</em> |
|
241 |
<span>Help Text</span> |
|
242 |
</span> |
|
243 |
</p> |
|
244 |
</div> |
|
245 |
<div class="double-checks"> |
|
246 |
<label>Max Storage per user</label> |
|
247 |
<div class="form-row"> |
|
248 |
<p class="clearfix"> |
|
249 |
<label for="storage_per_user_unlimited">Unlimited</label> |
|
250 |
<input type="checkbox" id="storage_per_user_unlimited" name="storage_per_user_unlimited" class="unlimited" checked="checked"> |
|
251 |
</p> |
|
252 |
</div> |
|
253 |
<div class="form-row"> |
|
254 |
<p class="clearfix"> |
|
255 |
<label for="storage_per_user_limited">Limited</label> |
|
256 |
<input type="checkbox" id="storage_per_user_limited" name="storage_per_user_limited" class="limited"> |
|
257 |
<input type="text" id="storage_user_limited_num"/> |
|
258 |
|
|
259 |
</p> |
|
260 |
</div> |
|
261 |
|
|
262 |
</div> |
|
263 |
</fieldset> |
|
264 |
</div> |
|
265 |
</div> |
|
165 | 266 |
<div class="form-row submit"> |
166 |
<input type="submit" value="SUBMIT" class="submit altcol" autocomplete="off">
|
|
267 |
<input type="submit" value="SUBMIT" class="submit altcol" autocomplete="off">
|
|
167 | 268 |
</div> |
168 | 269 |
</form> |
169 | 270 |
|
271 |
<script> |
|
272 |
|
|
273 |
</script> |
|
170 | 274 |
|
171 | 275 |
{% endblock %} |
Also available in: Unified diff