Damn, time is running and I have n time to make it pretty :(
This commit is contained in:
parent
3d4fc79a1f
commit
6ee246f0a6
3 changed files with 34 additions and 24 deletions
|
@ -4,19 +4,31 @@
|
||||||
font-size: 0;
|
font-size: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
#container {
|
body {
|
||||||
|
background-color: #222;
|
||||||
|
}
|
||||||
|
|
||||||
|
#entries {
|
||||||
margin: auto;
|
margin: auto;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 0 20px;
|
margin: 0 20px;
|
||||||
|
border-left: 1px solid #333;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.entry {
|
div.entry {
|
||||||
display: inline;
|
float: left;
|
||||||
|
display: block;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
width:200px;
|
width:200px;
|
||||||
height: 200px;
|
height: 200px;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
border-right: 1px solid #333;
|
||||||
|
border-bottom: 1px solid #333;
|
||||||
|
}
|
||||||
|
div.entry:hover {
|
||||||
|
opacity: 0.5;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.entry img {
|
div.entry img {
|
||||||
|
@ -27,6 +39,7 @@ div.entry img {
|
||||||
padding-bottom: 100px;
|
padding-bottom: 100px;
|
||||||
}
|
}
|
||||||
.open-entry div.shadow {
|
.open-entry div.shadow {
|
||||||
|
display: block;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
|
@ -36,6 +49,7 @@ div.entry img {
|
||||||
height: 200px;
|
height: 200px;
|
||||||
}
|
}
|
||||||
.open-entry div.details {
|
.open-entry div.details {
|
||||||
|
display: block;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 200px;
|
top: 200px;
|
||||||
height: 100px;
|
height: 100px;
|
||||||
|
@ -44,3 +58,7 @@ div.entry img {
|
||||||
left: -200px; /* TODO: Make dynamic */
|
left: -200px; /* TODO: Make dynamic */
|
||||||
width: 800px; /* TODO: Make dynamic */
|
width: 800px; /* TODO: Make dynamic */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.shadow, .details {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
|
@ -1,24 +1,16 @@
|
||||||
{% extends "ldview/views/templates/layout.html" %}
|
{% extends "ldview/views/templates/layout.html" %}
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
<div id="entries">
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
{% for entry in entries %}
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
<div class="entry">
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
<div class="shadow">
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
<p>{{entry.title}}</p>
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
<em>{{entry.author.name}}</em>
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
</div>
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
<div class="details"></div>
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
<a href="http://www.ludumdare.com/compo/ludum-dare-27/?action=preview&uid={{entry.ld_uid}}"><img src="{{servlet-context}}/img/ld/thumbs/{{entry.ld_uid}}_0.png" alt="{{entry.title}}" /></a>
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
</div>
|
||||||
<div class="entry open-entry">
|
{% endfor %}
|
||||||
<div class="shadow"></div>
|
|
||||||
<div class="details"></div>
|
|
||||||
<img src="{{servlet-context}}/img/sample.png" alt="entry-#" />
|
|
||||||
</div>
|
</div>
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
<br style="clear: both" />
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
|
||||||
<div class="entry"><img src="{{servlet-context}}/img/sample.png" alt="entry-#" /></div>
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -10,7 +10,7 @@
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<a href="{{servlet-context}}/">Home</a>
|
<h1>Ludum Dare submissions viewer</h1>
|
||||||
|
|
||||||
<div id="container">
|
<div id="container">
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
|
Loading…
Reference in a new issue