seba
/
k4ever
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

updated start page view

This commit is contained in:
Konrad Mohrfeldt 2011-10-13 01:37:28 +02:00
parent 2f98b6b17c
commit b3e4988547
3 changed files with 160 additions and 269 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
k4ever/main/templates/main/product_list.html Normal file
View File

@ -0,0 +1,31 @@
{% if buyables %}
{% if removeWrapper == None %}
<table width=100%>
<tbody>
{% endif %}
{% for buyable in buyables %}
<tr>
<td class="productImage">
<a href="/store/show/{{ buyable.buyable__id }}"><img src="{{ MEDIA_URL }}{{ buyable.buyable__image }}" /></a>
</td>
<td class="name"><span>{{ buyable.buyable__name }}</span> ({{ buyable.num_buys }} mal gekauft)</td>
<td>
{% if buyable.buyable__deposit > 0 %}
<a class="buyButton" href="/store/buy/{{ buyable.buyable__id }}" title="Kaufen (Ohne Pfand)"><span>Kaufen (Ohne Pfand)</span></a>
<a class="buyButton includingDeposit" href="/store/buy/{{ buyable.buyable__id }}/with/deposit" title="Kaufen (Mit Pfand)"><span>Kaufen (Mit Pfand)</span></a>
{% if includeDeposit %}
<a class="buyButton onlyDeposit" href="/store/buy/{{ buyable.buyable__id }}/only/deposit" title="Kaufen (Nur Pfand)"><span>Kaufen (Nur Pfand)</span></a>
{% endif %}
{% else %}
<a class="buyButton" href="/store/buy/{{ buyable.buyable__id }}" title="Kaufen"><span>Kaufen</span></a>
{% endif %}
</td>
</tr>
{% endfor %}
{% if removeWrapper == None %}
</tbody>
</table>
{% endif %}
{% else %}
<p>{{ default|default_if_none:"Noch keine gekauft" }}</p>
{% endif %}

233
k4ever/main/templates/main/startpage.html
View File

@ -1,238 +1,45 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block "content" %} {% block "content" %}
<div style="width:1200px">
{% if allMostDrinks or allMostSnacks %} {% if allMostDrinks or allMostSnacks %}
<table width="100%" class="showitem" style="border-width:0px"> <table class="showitem">
<thead>
<tr> <tr>
<td role="presentation">&nbsp;</td>
<th scope="column">Die beliebtesten Artikel</th>
<th scope="column">Deine Lieblingsartikel</td>
<th scope="column">Zuletzt hattest du</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">Getränke</th>
<td> <td>
&nbsp; {% include "main/product_list.html" with buyables=allMostDrinks %}
</td> </td>
<td> <td>
<h1>Die beliebtesten Artikel</h1> {% include "main/product_list.html" with buyables=usersMostDrinks %}
</td> </td>
<td> <td>
<h1>Deine Lieblingsartikel</h1> {% include "main/product_list.html" with buyables=usersLastDrinks %}
</td>
<td>
<h1>Zuletzt hattest du:</h1>
</td> </td>
</tr> </tr>
<tr> <tr>
<td style="-moz-transform: rotate(270deg); -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); -o-transform: rotate(270deg); transform: rotate(270deg)"> <th scope="row">Snacks</th>
<h1 style="vertical-align:top">Getr&auml;nke</h1> <td>
</td> {% include "main/product_list.html" with buyables=allMostSnacks %}
<td style="vertical-align:top">
{% if allMostDrinks %}
<table width=100%>
{% for buyable in allMostDrinks %}
<tr>
<td width="80px">
<a href="/store/show/{{ buyable.buyable__id }}"><img width=64 height=64 src="{{ MEDIA_URL }}{{ buyable.buyable__image }}"></a>
</td> </td>
<td> <td>
<b>{{ buyable.buyable__name }}</b><br/>({{ buyable.num_buys }} mal) {% include "main/product_list.html" with buyables=usersMostSnacks %}
</td>
<td width="150px">
<a class="button" href="/store/buy/{{ buyable.buyable__id }}">Kaufen
{% if buyable.buyable__deposit > 0 %}
(Ohne Pfand)</a> <a class="button" href="/store/buy/{{ buyable.buyable__id }}/with/deposit">Kaufen (Mit Pfand)</a>
{% else %}
</a>
{% endif %}
</td>
</tr>
{% endfor %}
</table>
{% else %}
Noch keine gekauft.
{% endif %}
</td>
<td style="vertical-align:top">
{% if usersMostDrinks %}
<table width=100%>
{% for buyable in usersMostDrinks %}
<tr>
<td width="80px">
<a href="/store/show/{{ buyable.buyable__id }}"><img width=64 height=64 src="{{ MEDIA_URL }}{{ buyable.buyable__image }}"></a>
</td> </td>
<td> <td>
<b>{{ buyable.buyable__name }}</b><br/> ({{ buyable.num_buys }} mal) {% include "main/product_list.html" with buyables=usersLastSnacks %}
</td>
<td width="150px">
<a class="button" href="/store/buy/{{ buyable.buyable__id }}">Kaufen
{% if buyable.buyable__deposit > 0 %}
(Ohne Pfand)</a> <a class="button" href="/store/buy/{{ buyable.buyable__id }}/with/deposit">Kaufen (Mit Pfand)</a>
{% else %}
</a>
{% endif %}
</td>
</tr>
{% endfor %}
</table>
{% else %}
Noch keine gekauft.
{% endif %}
</td>
<td style="vertical-align:top">
{% if usersLastDrinks %}
<table width=100%>
{% for buyable in usersLastDrinks %}
<tr>
<td width="80px">
<a href="/store/show/{{ buyable.buyable__id }}"><img width=64 height=64 src="{{ MEDIA_URL }}{{ buyable.buyable__image }}"></a>
</td>
<td>
<b>{{ buyable.buyable__name }}</b>
</td>
<td width="150px">
<a class="button" href="/store/buy/{{ buyable.buyable__id }}">Kaufen
{% if buyable.buyable__deposit > 0 %}
(Ohne Pfand)</a> <a class="button" href="/store/buy/{{ buyable.buyable__id }}/with/deposit">Kaufen (Mit Pfand)</a>
{% else %}
</a>
{% endif %}
</td>
</tr>
{% endfor %}
</table>
{% else %}
Noch keine gekauft.
{% endif %}
</td>
</tr>
<tr>
<th style="-moz-transform: rotate(270deg); -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); -o-transform: rotate(270deg); transform: rotate(270deg)">
<h1>Snacks</h1>
</th>
<td style="vertical-align:top">
{% if allMostSnacks %}
<table width=100%>
{% for buyable in allMostSnacks %}
<tr>
<td width="80px">
<a href="/store/show/{{ buyable.buyable__id }}"><img width=64 height=64 src="{{ MEDIA_URL }}{{ buyable.buyable__image }}"></a>
</td>
<td>
<b>{{ buyable.buyable__name }}</b><br/> ({{ buyable.num_buys }} mal)
</td>
<td width="150px">
<a class="button" href="/store/buy/{{ buyable.buyable__id }}">Kaufen
{% if buyable.buyable__deposit > 0 %}
(Ohne Pfand)</a> <a class="button" href="/store/buy/{{ buyable.buyable__id }}/with/deposit">Kaufen (Mit Pfand)</a>
{% else %}
</a>
{% endif %}
</td>
</tr>
{% endfor %}
</table>
{% else %}
Noch keine gekauft.
{% endif %}
</td>
<td style="vertical-align:top">
{% if usersMostSnacks %}
<table width=100%>
{% for buyable in usersMostSnacks %}
<tr>
<td width="80px">
<a href="/store/show/{{ buyable.buyable__id }}"><img width=64 height=64 src="{{ MEDIA_URL }}{{ buyable.buyable__image }}"></a>
</td>
<td>
<b>{{ buyable.buyable__name }}</b><br/> ({{ buyable.num_buys }} mal)
</td>
<td width="150px">
<a class="button" href="/store/buy/{{ buyable.buyable__id }}">Kaufen
{% if buyable.buyable__deposit > 0 %}
(Ohne Pfand)</a> <a class="button" href="/store/buy/{{ buyable.buyable__id }}/with/deposit">Kaufen (Mit Pfand)</a>
{% else %}
</a>
{% endif %}
</td>
</tr>
{% endfor %}
</table>
{% else %}
Noch keine gekauft.
{% endif %}
</td>
<td style="vertical-align:top">
{% if usersLastSnacks %}
<table width=100%>
{% for buyable in usersLastSnacks %}
<tr>
<td width="80px">
<a href="/store/show/{{ buyable.buyable__id }}"><img width=64 height=64 src="{{ MEDIA_URL }}{{ buyable.buyable__image }}"></a>
</td>
<td>
<b>{{ buyable.buyable__name }}</b>
</td>
<td width="150px">
<a class="button" href="/store/buy/{{ buyable.buyable__id }}">Kaufen
{% if buyable.buyable__deposit > 0 %}
(Ohne Pfand)</a> <a class="button" href="/store/buy/{{ buyable.buyable__id }}/with/deposit">Kaufen (Mit Pfand)</a>
{% else %}
</a>
{% endif %}
</td>
</tr>
{% endfor %}
</table>
{% else %}
Noch keine gekauft.
{% endif %}
</td> </td>
</tr> </tr>
</tbody>
</table> </table>
{% else %} {% else %}
{{ error }} {{ error }}
Es hat scheinbar noch niemand etwas gekauft. <a href="/store/">Sei der Erste!</a> Es hat scheinbar noch niemand etwas gekauft. <a href="/store/">Sei der Erste!</a>
{% endif %} {% endif %}
</div>
{% comment %}
<div style="width:800px">
{% if usersMostSnacks or usersMostDrinks %}
<h1>Deine Lieblingsartikel</h1>
<table class="showitem" width="100%" style="border-width:0px">
<tr>
<th width="50%">
Getr&auml;nke
</th>
<th width="50%">
Snacks
</th>
</tr>
<tr>
</tr>
</table>
{% else %}
{{ error }}
Wie es aussieht, hast du noch nichts gekauft. <a href="/store/">Das kannst du &auml;ndern!</a>
{% endif %}
</div>
<div style="width:800px">
{% if usersLastSnacks or usersLastDrinks %}
<h1>Du hattest als letztes:</h1>
<table class="showitem" width="100%" style="border-width:0px">
<tr>
<th width="50%">
Getr&auml;nke
</th>
<th width="50%">
Snacks
</th>
</tr>
<tr>
</tr>
</table>
{% else %}
{{ error }}
{% endif %}
</div>
{% endcomment %}
{% endblock %} {% endblock %}

133
k4ever/media/css/style.css
View File

@ -26,6 +26,10 @@ table, caption, tbody, tfoot, thead, tr, th, td {
vertical-align: baseline; vertical-align: baseline;
} }
a:focus {
outline: none;
}
.content { .content {
margin: 5px; margin: 5px;
} }
@ -34,7 +38,7 @@ body {
line-height: 1; line-height: 1;
} }
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6, th {
clear: both; clear: both;
font-weight: bold; font-weight: bold;
font-family: "Istok Web", inherit; font-family: "Istok Web", inherit;
@ -96,6 +100,7 @@ input[type=text]:focus, input[type=search]:focus, input[type=password]:focus {
background-image: -ms-linear-gradient(top, #666666, #111111); background-image: -ms-linear-gradient(top, #666666, #111111);
background-image: -o-linear-gradient(top, #666666, #111111); background-image: -o-linear-gradient(top, #666666, #111111);
background-image: linear-gradient(top, #666666, #111111); background-image: linear-gradient(top, #666666, #111111);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#666666', EndColorStr='#111111'); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#666666', EndColorStr='#111111');
} }
@ -131,8 +136,9 @@ input[type=text]:focus, input[type=search]:focus, input[type=password]:focus {
color: white; color: white;
border-bottom: 2px solid black; border-bottom: 2px solid black;
padding-top: 10px; padding-top: 10px;
/*border-top: 2px solid black;*/ -moz-box-shadow: 0 3px 8px 0 black inset;
-webkit-box-shadow: 0 3px 8px 0 black inset; -webkit-box-shadow: 0 3px 8px 0 black inset;
box-shadow: 0 3px 8px 0 black inset;
} }
#header .base_nav h1 { #header .base_nav h1 {
@ -371,56 +377,103 @@ html body div#header div.search ul.ui-autocomplete li.ui-menu-item.focus {
font-weight: bold; font-weight: bold;
} }
/* TABLE */
/* Edited by Theri */
table.showitem { table.showitem {
border:1px solid #DFDFDF; border: 0 none;
border-collapse: separate; border-collapse: collapse;
border-spacing: 5pt; width: 100%;
} }
table.showitem td { table.showitem td.productImage {
vertical-align: middle; width: 80px;
text-align: center;
}
table.showitem td.productImage img {
max-width: 100%;
max-height: 64px;
} }
table.showitem th { table.showitem th {
vertical-align: middle; font-size: 20px;
text-align:center; text-align:center;
} }
table.details { table.showitem td.name {
border-width: 0px;
margin-top: 25px;
}
table.details th {
vertical-align: middle;
text-align: center;
}
table.details td {
vertical-align: middle;
text-align: center;
}
.content a {
color: #3398CC;
text-decoration: none;
}
.content a.button {
text-align: center;
display: block;
margin-top: 7px;
padding: 0 10px; padding: 0 10px;
} }
.content a:hover { table.showitem td.name span {
background: #3398CC; display: block;
color: white; font-weight: bold;
} }
.content h1 { table.showitem td, table.showitem th {
font-size: 20px; vertical-align: middle;
text-align: center; }
table.showitem tr td {
padding-bottom: 10px;
}
table.showitem th[scope="row"] {
width: 20px;
padding: 0;
margin: 0;
-moz-transform: rotate(270deg);
-webkit-transform: rotate(270deg);
-ms-transform: rotate(270deg);
-o-transform: rotate(270deg);
transform: rotate(270deg);
}
a.buyButton {
display: block;
padding: 5px 10px;
height: 32px;
text-align: center;
border-radius: 6px;
float: left;
margin-right: 10px;
background-image: -webkit-gradient(linear, left top, left bottom, from(#666666), to(#111111));
background-image: -webkit-linear-gradient(top, #666666, #111111);
background-image: -moz-linear-gradient(top, #666666, #111111);
background-image: -ms-linear-gradient(top, #666666, #111111);
background-image: -o-linear-gradient(top, #666666, #111111);
background-image: linear-gradient(top, #666666, #111111);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#666666', EndColorStr='#111111');
-moz-box-shadow: 0 1px 3px 0 black;
-webkit-box-shadow: 0 1px 3px 0 black;
box-shadow: 0 1px 3px 0 black;
}
a.buyButton:hover {
background-image: -webkit-gradient(linear, left top, left bottom, from(#555555), to(#000000));
background-image: -webkit-linear-gradient(top, #555555, #000000);
background-image: -moz-linear-gradient(top, #555555, #000000);
background-image: -ms-linear-gradient(top, #555555, #000000);
background-image: -o-linear-gradient(top, #555555, #000000);
background-image: linear-gradient(top, #555555, #000000);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#555555', EndColorStr='#000000');
}
a.buyButton:active {
-moz-box-shadow: 0 1px 3px 0 black, 0 1px 3px 0 black inset;
-webkit-box-shadow: 0 1px 3px 0 black, 0 1px 3px 0 black inset;
box-shadow: 0 1px 3px 0 black, 0 1px 3px 0 black inset;
}
a.buyButton.includingDeposit span {
background-image: url("img/payment_deposit.png");
min-width: 65px;
}
a.buyButton span {
display: block;
height: 100%;
min-width: 32px;
background: url("img/payment.png") no-repeat center center transparent;
text-indent: -10000px;
} }