equal
deleted
inserted
replaced
1 .. -*- coding: utf-8 -*- |
1 .. -*- coding: utf-8 -*- |
2 |
2 |
3 Views & Templates |
3 Views & Templates |
4 ================= |
4 ----------------- |
5 |
5 |
6 Look at ``lax/skel/ginco/web/views/basetemplates.py`` and you will |
6 Look at ``lax/skel/ginco/web/views/basetemplates.py`` and you will |
7 find the base templates used to generate HTML for your application. |
7 find the base templates used to generate HTML for your application. |
8 |
8 |
9 A page is composed as indicated on the schema below: |
9 A page is composed as indicated on the schema below: |
14 you must be interested in, that is to say, the HTMLPageHeader, |
14 you must be interested in, that is to say, the HTMLPageHeader, |
15 the HTMLPageFooter and the TheMainTemplate. |
15 the HTMLPageFooter and the TheMainTemplate. |
16 |
16 |
17 |
17 |
18 HTMLPageHeader |
18 HTMLPageHeader |
19 -------------- |
19 ~~~~~~~~~~~~~~~ |
20 |
20 |
21 Let's use a different logo than the default one provided with LAX |
21 Let's use a different logo than the default one provided with LAX |
22 and customize our header. |
22 and customize our header. |
23 |
23 |
24 Change logo |
24 Change logo |
25 ~~~~~~~~~~~ |
25 ``````````` |
26 |
26 |
27 The easiest way to use a different logo is to replace the existing |
27 The easiest way to use a different logo is to replace the existing |
28 ``logo.png`` in ``myapp/data`` by your prefered icon and refresh. |
28 ``logo.png`` in ``myapp/data`` by your prefered icon and refresh. |
29 By default all application will look for a ``logo.png`` to be |
29 By default all application will look for a ``logo.png`` to be |
30 rendered in the logo section. |
30 rendered in the logo section. |
36 |
36 |
37 [WRITE ME] |
37 [WRITE ME] |
38 ADD how to use external_resources variables used in ginco/web/webconfig.py |
38 ADD how to use external_resources variables used in ginco/web/webconfig.py |
39 |
39 |
40 Customize header |
40 Customize header |
41 ~~~~~~~~~~~~~~~~ |
41 ````````````````` |
42 |
42 |
43 Let's now move the search box in the header and remove the login form |
43 Let's now move the search box in the header and remove the login form |
44 from the header. We'll show how to move it to the left column of the application. |
44 from the header. We'll show how to move it to the left column of the application. |
45 |
45 |
46 Let's sat we do not want anymore the login menu to be in the header, but we |
46 Let's sat we do not want anymore the login menu to be in the header, but we |
146 |
146 |
147 |
147 |
148 |
148 |
149 |
149 |
150 HTMLPageFooter |
150 HTMLPageFooter |
151 -------------- |
151 ~~~~~~~~~~~~~~ |
152 |
152 |
153 If you want to change the footer for example, look |
153 If you want to change the footer for example, look |
154 for HTMLPageFooter and override it in your views file as in: |
154 for HTMLPageFooter and override it in your views file as in: |
155 :: |
155 :: |
156 |
156 |
164 Updating a view does not require any restart of the server. By reloading |
164 Updating a view does not require any restart of the server. By reloading |
165 the page you can see your new page footer. |
165 the page you can see your new page footer. |
166 |
166 |
167 |
167 |
168 TheMainTemplate |
168 TheMainTemplate |
169 --------------- |
169 ~~~~~~~~~~~~~~~ |
|
170 |
170 .. _TheMainTemplate: |
171 .. _TheMainTemplate: |
171 |
172 |
172 The MainTemplate is a bit complex as it tries to accomodate many |
173 The MainTemplate is a bit complex as it tries to accomodate many |
173 different cases. We are now about to go through it and cutomize entirely |
174 different cases. We are now about to go through it and cutomize entirely |
174 our application. |
175 our application. |
180 a top section. |
181 a top section. |
181 |
182 |
182 .. image:: images/lax-book.06-simple-main-template.en.png |
183 .. image:: images/lax-book.06-simple-main-template.en.png |
183 |
184 |
184 CSS changes |
185 CSS changes |
185 ----------- |
186 ~~~~~~~~~~~ |
186 |
187 |
187 We cannot modify the order in which the application is reading the CSS. In |
188 We cannot modify the order in which the application is reading the CSS. In |
188 the case we want to create new CSS style, the best is to define it a in a new |
189 the case we want to create new CSS style, the best is to define it a in a new |
189 CSS located under ``myapp/data/``. |
190 CSS located under ``myapp/data/``. |
190 |
191 |
191 If you want to modify an existing CSS styling property, you will have to use |
192 If you want to modify an existing CSS styling property, you will have to use |
192 ``!important`` declaration to override the existing property. The application |
193 ``!important`` declaration to override the existing property. The application |
193 apply a higher priority on the default CSS and you can not change that. |
194 apply a higher priority on the default CSS and you can not change that. |
194 Customized CSS will not be read first. |
195 Customized CSS will not be read first. |
195 |
196 |
196 1 |
|
197 [TODO] |
197 [TODO] |
198 Add login menu in left column |
198 Add login menu in left column |
199 |
199 |
200 |
200 |
201 [WRITE ME] |
201 [WRITE ME] |