diff options
Diffstat (limited to 'template')
| -rw-r--r-- | template/yoga/content.css | 46 | ||||
| -rw-r--r-- | template/yoga/index.tpl | 30 |
2 files changed, 75 insertions, 1 deletions
diff --git a/template/yoga/content.css b/template/yoga/content.css index 56599ec93..9fc3f996d 100644 --- a/template/yoga/content.css +++ b/template/yoga/content.css @@ -259,3 +259,49 @@ DIV.calImg { text-align: left; vertical-align: top; } + +/* Category thumbnails on main page, CSS code inspired from MOD subcatify */ +#content UL.thumbnailCategories { + margin: 0; + padding: 0; + list-style: none; + text-align: center; +} + +#content UL.thumbnailCategories LI { + width: 49.9%; /* 49.9% for 2 per line, 33.3% for 3 per line*/ + margin:0; + padding:0; + float:left; +} + +#content DIV.thumbnailCategory { + display:block; + border: 1px solid #aaa; + padding: 5px 0px 0px 4px; + margin: 5px; +} + +#content DIV.thumbnailCategory DIV.description { + font-size: 90%; +} + +#content DIV.thumbnailCategory DIV.description H3 { + text-align: left; + background: #eee; + margin: 0; + padding: 0.1em; + font-size: 120%; +} + +#content DIV.thumbnailCategory DIV.description P { + margin: 0; +} + +#content DIV.thumbnailCategory DIV.illustration { + text-align: left; + padding: 2px; + float: left; + width: 110px; /* sorry, this is a very personal value :-( */ + height: 110px; +} diff --git a/template/yoga/index.tpl b/template/yoga/index.tpl index 494d2059b..e56ceaa97 100644 --- a/template/yoga/index.tpl +++ b/template/yoga/index.tpl @@ -176,7 +176,7 @@ </h2> <!-- END calendar --> - </div> <!-- content --> + </div> <!-- titrePage --> <!-- BEGIN calendar --> <!-- BEGIN navbar --> @@ -231,6 +231,34 @@ </ul> <!-- END thumbnails --> +<!-- BEGIN categories --> +<ul class="thumbnailCategories"> + <!-- BEGIN category --> + <li> + <div class="thumbnailCategory"> + <div class="illustration"> + <a href="{categories.category.URL}"> + <img src="{categories.category.SRC}" + alt="{categories.category.ALT}" + title="{categories.category.TITLE}"> + </a> + </div> + <div class="description"> + <h3> + {categories.category.ICON} + <a href="{categories.category.URL}">{categories.category.NAME}</a> + </h3> + <p>{categories.category.NB_IMAGES} {lang:pictures}</p> + <p>{categories.category.DESCRIPTION}</p> + </div> + <hr class="separation" /> + </div> + </li> + <!-- END category --> +</ul> +<hr class="separation" /> +<!-- END categories --> + <!-- BEGIN cat_infos --> <!-- BEGIN navigation --> <div class="navigationBar"> |