arg/ldview
3
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Damn, time is running and I have n time to make it pretty :(

Browse source
This commit is contained in:
Aaron Mueller 2013-09-30 01:19:45 +02:00
parent 3d4fc79a1f
commit 6ee246f0a6
3 changed files with 34 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
resources/public/css/screen.css
View file

@ -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;
}

32
src/ldview/views/templates/entries.html
View file

@ -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 %}

2
src/ldview/views/templates/layout.html
View file

@ -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 %}