coderkun/questlab
1
0
Fork 0
Code Issues 15 Pull requests Projects Releases Wiki Activity

aside information (char, quest, group) for 1600px+

Browse source
This commit is contained in:
Daniel 2014-04-09 15:36:02 +02:00
commit 5b67ba380f
2 changed files with 58 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

47
views/html/html.tpl
View file

@ -46,6 +46,53 @@
<article class="wrap"> <article class="wrap">
<?=$intermediate?> <?=$intermediate?>
</article> </article>
<aside>
<section class="cf">
<h1>Zyrendaniel</h1>
<img src="http://legende-von-zyren.de/img/avatars/Goblin7.png" class="char">
<ul class="charstats">
<li>Level 1</li>
<li>1500 XP</li>
<li>Rang 11</li>
<li><a href="#">Zum Profil</a></li>
</ul>
</section>
<section>
<h1>Aktuelle Quest</h1>
<p><i class="fa fa-pencil-square-o fa-fw"></i><a href="#">Die verwunschene Stadt</a></p>
</section>
<section>
<h1>Wille und die Majas</h1>
<ul class="cranks">
<li>
<a href="#" title="Achievement-Titel"><img src="http://s7.directupload.net/images/140325/e2wdqhqa.png"></a>
<p><a href="#">Anduin</a></p>
<p><small>Level 27 (1500 XP)</small></p>
</li>
<li>
<a href="#" title="Achievement-Titel"><img src="http://s1.directupload.net/images/140325/upv2dg2r.png"></a>
<p><a href="#">Jaina</a></p>
<p><small>Level 26 (1400 XP)</small></p>
</li>
<li>
<a href="#" title="Achievement-Titel"><img src="http://s14.directupload.net/images/140325/x9ny5kgu.png"></a>
<p><a href="#">Uther</a></p>
<p><small>Level 25 (1300 XP)</small></p>
</li>
<li>
<a href="#" title="Achievement-Titel"><img src="http://s7.directupload.net/images/140325/e2wdqhqa.png"></a>
<p><a href="#">Lothar</a></p>
<p><small>Level 24 (1200 XP)</small></p>
</li>
<li>
<a href="#" title="Achievement-Titel"><img src="http://s1.directupload.net/images/140325/whre34td.png"></a>
<p><a href="#">Morris</a></p>
<p><small>Level 23 (1100 XP)</small></p>
</li>
</ul>
<p><i class="fa fa-users fa-fw"></i><a href="#">Gildenprofil ansehen</a></p>
</section>
</aside>
</body> </body>
</html> </html>

12
www/css/desktop.css
View file

@ -86,6 +86,7 @@ menu .smnry{font-size:0.875em;padding:8px 0 8px 12px;background:#0c2e32;border-b
#navicon{display:block;color:#d9e5e7} #navicon{display:block;color:#d9e5e7}
article{padding:70px 0 30px} article{padding:70px 0 30px}
aside{display:none}
.moodpic{margin:-15px -5.5% 0 -5.5%;overflow:hidden} .moodpic{margin:-15px -5.5% 0 -5.5%;overflow:hidden}
.moodpic img{width:100vw} .moodpic img{width:100vw}
@ -220,7 +221,16 @@ article{padding:20px 40px 80px 40px}
@media only screen and (min-width:1366px){ @media only screen and (min-width:1366px){
body{background:#eae8e4} body{background:#eae8e4}
.wrap{width:800px;max-width:800px} .wrap{width:800px;max-width:800px}
article{background:#f7f5f2} article{background:#f7f5f2;float:left}
.moodpic{margin:-20px 0 0 -40px;width:880px;height:230px} .moodpic{margin:-20px 0 0 -40px;width:880px;height:230px}
.moodpic img{width:auto} .moodpic img{width:auto}
}
@media only screen and (min-width:1600px){
aside{display:block;float:left;width:350px;min-width:350px;margin:0 0 0 40px}
aside section{margin:20px 0 40px 0}
aside .char{width:120px;float:left;margin-right:30px}
aside .charstats{background:#f7f5f2;border-radius:3px;padding:10px 0;margin-top:50px;list-style-type:square}
aside .charstats li{font-size:.875em;padding:2px 0 2px 6px}
aside .cranks li:nth-child(odd){background:#f7f5f2}
} }