character profile template with dummy data
This commit is contained in:
Daniel
parent
3d5436f8f3
commit
8e4887b689
2 changed files with 193 additions and 22 deletions
|
|
@ -1,25 +1,165 @@
|
||||||
<h2><a href="<?=$linker->link(array('seminaries',$seminary['url']))?>"><?=$seminary['title']?></a></h2>
|
<h1><a href="<?=$linker->link(array('seminaries',$seminary['url']))?>"><?=$seminary['title']?></a></h1>
|
||||||
<h3><?=_('Characters')?></h3>
|
<h2><i class="fa fa-user fa-fw"></i><?=$character['name']?></h2>
|
||||||
<h4><?=$character['name']?></h4>
|
|
||||||
|
|
||||||
<section>
|
<section class="cf">
|
||||||
<p>
|
<div class="cinfo">
|
||||||
XPs: <?=$character['xps']?> (<?=_('Level')?> <?=$character['xplevel']['level']?><?php if(!is_null($character['xplevel']['name'])) : ?>: <?=$character['xplevel']['name']?><?php endif ?>)<br />
|
<div class="cdata">
|
||||||
<?=_('User')?>: <a href="<?=$linker->link(array('users','user',$user['url']))?>"><?=$user['username']?></a><br />
|
<div class="xpbar">
|
||||||
<?php foreach($characterfields as &$field) : ?>
|
<span style="width:85%"></span>
|
||||||
<?=$field['title']?>: <?=$field['value']?><br />
|
</div>
|
||||||
<?php endforeach ?>
|
<p><small>Gesamtfortschritt: 85%</small></p>
|
||||||
</p>
|
</div>
|
||||||
|
<div class="cdata square">
|
||||||
|
<p class="value"><?=$character['xplevel']['level']?></p>
|
||||||
|
<p><small><?=_('Level')?></small></p>
|
||||||
|
</div>
|
||||||
|
<div class="cdata square">
|
||||||
|
<p class="value">500</p>
|
||||||
|
<p><small>XP</small></p>
|
||||||
|
</div>
|
||||||
|
<div class="cdata square blue">
|
||||||
|
<p class="value">7.</p>
|
||||||
|
<p><small>Platz</small></p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h2><i class="fa fa-bookmark fa-fw"></i>Belohnungen</h2>
|
||||||
|
<ul class="crewards">
|
||||||
|
<li>
|
||||||
|
<p class="unlocked"><i class="fa fa-check-circle fa-fw"></i>Aktive Beteiligung</p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p class="unlocked"><i class="fa fa-check-circle fa-fw"></i>+ 0,3 Notenbonus</p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><i class="fa fa-lock fa-fw"></i>+ 0,7 Notenbonus <span class="locked">(noch 300 XP)</span></p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><i class="fa fa-lock fa-fw"></i>+ 1,0 Notenbonus <span class="locked">(noch 500 XP)</span></p>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="cportrait">
|
||||||
|
<img src="http://legende-von-zyren.de/img/avatars/Goblin7.png"><br>
|
||||||
<?php if(!is_null($character['avatar_url'])) : ?>
|
<?php if(!is_null($character['avatar_url'])) : ?>
|
||||||
<img src="<?=$linker->link(array('media','index',$seminary['url'],$character['avatar_url']))?>" alt="<?=$character['avatar_description']?>" />
|
<img src="<?=$linker->link(array('media','index',$seminary['url'],$character['avatar_url']))?>" alt="<?=$character['avatar_description']?>" />
|
||||||
<?php endif ?>
|
<?php endif ?>
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
<h1><?=_('Character Groups')?></h1>
|
<h2><i class="fa fa-users fa-fw"></i><?=_('Character Groups')?></h2>
|
||||||
<ul>
|
<ul class="cgroups cf">
|
||||||
|
<li class="cf">
|
||||||
|
<img src="http://s1.directupload.net/images/140325/3eqybn4i.png">
|
||||||
|
<a href="#">Super wilde Arbeits Gruppe [SWAG]</a><p><span>500 XP</span></p>
|
||||||
|
</li>
|
||||||
|
<li class="cf">
|
||||||
|
<img src="http://s1.directupload.net/images/140325/3eqybn4i.png">
|
||||||
|
<a href="#">Mit Herz und Seele</a><p><span>500 XP</span></p>
|
||||||
|
</li>
|
||||||
<?php foreach($groups as &$group) : ?>
|
<?php foreach($groups as &$group) : ?>
|
||||||
<li><a href="<?=$linker->link(array('charactergroups','group',$seminary['url'],$group['charactergroupsgroup_url'],$group['url']))?>"><?=$group['name']?></a> (<?=$group['xps']?> XPs)</li>
|
<li><a href="<?=$linker->link(array('charactergroups','group',$seminary['url'],$group['charactergroupsgroup_url'],$group['url']))?>"><?=$group['name']?></a> (<?=$group['xps']?> XPs)</li>
|
||||||
<?php endforeach ?>
|
<?php endforeach ?>
|
||||||
</ul>
|
</ul>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<div class="cf">
|
||||||
|
<section class="fll48">
|
||||||
|
<h2><i class="fa fa-trophy fa-fw"></i>Neue Achievements</h2>
|
||||||
|
<ul class="cranks">
|
||||||
|
<li>
|
||||||
|
<a href="#" title="Achievement-Titel"><img src="http://legende-von-zyren.de/img/achieve/1b.jpg"></a>
|
||||||
|
<p><a href="#">Des Königs neue Quests</a></p>
|
||||||
|
<p><small>erreicht am: 14.07.2014</small></p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#" title="Achievement-Titel"><img src="http://legende-von-zyren.de/img/achieve/2b.jpg"></a>
|
||||||
|
<p><a href="#">Des Königs neue Quests</a></p>
|
||||||
|
<p><small>erreicht am: 14.07.2014</small></p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#" title="Achievement-Titel"><img src="http://legende-von-zyren.de/img/achieve/3b.jpg"></a>
|
||||||
|
<p><a href="#">Des Königs neue Quests</a></p>
|
||||||
|
<p><small>erreicht am: 14.07.2014</small></p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#" title="Achievement-Titel"><img src="http://legende-von-zyren.de/img/achieve/4b.jpg"></a>
|
||||||
|
<p><a href="#">Des Königs neue Quests</a></p>
|
||||||
|
<p><small>erreicht am: 14.07.2014</small></p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#" title="Achievement-Titel"><img src="http://legende-von-zyren.de/img/achieve/5b.jpg"></a>
|
||||||
|
<p><a href="#">Des Königs neue Quests</a></p>
|
||||||
|
<p><small>erreicht am: 14.07.2014</small></p>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="flr48">
|
||||||
|
<h2><i class="fa fa-list fa-fw"></i>Ranking</h2>
|
||||||
|
<ul class="cranks">
|
||||||
|
<li>
|
||||||
|
<a href="#" title="Achievement-Titel"><img src="http://s7.directupload.net/images/140325/e2wdqhqa.png"></a>
|
||||||
|
<p>7. <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>8. <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 class="fwb">9. <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>10. <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>11. <a href="#">Morris</a></p>
|
||||||
|
<p><small>Level 23 (1100 XP)</small></p>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<h2><i class="fa fa-book fa-fw"></i>Thematischer Fortschritt</h2>
|
||||||
|
<ul class="ctopics cf">
|
||||||
|
<li>
|
||||||
|
<p><small><a href="#">Klassifikation</a> (3/5)</small></p>
|
||||||
|
<div class="xpbar">
|
||||||
|
<span style="width:60%"></span>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><small><a href="#">Thesauri</a> (1/10)</small></p>
|
||||||
|
<div class="xpbar">
|
||||||
|
<span style="width:10%"></span>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><small><a href="#">Indexierung</a> (3/5)</small></p>
|
||||||
|
<div class="xpbar">
|
||||||
|
<span style="width:20%"></span>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><small><a href="#">Recherche</a> (3/5)</small></p>
|
||||||
|
<div class="xpbar">
|
||||||
|
<span style="width:80%"></span>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><small><a href="#">Folksonomies</a> (3/5)</small></p>
|
||||||
|
<div class="xpbar">
|
||||||
|
<span style="width:70%"></span>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@ b,strong,.fwb{font-weight:bold}
|
||||||
dfn,.fsi{font-style:italic}
|
dfn,.fsi{font-style:italic}
|
||||||
img{border:0}
|
img{border:0}
|
||||||
h1,h2,h3{color:#103a3e}
|
h1,h2,h3{color:#103a3e}
|
||||||
h2{font-size:120%}
|
h2{font-size:120%;margin-top:30px}
|
||||||
h3{font-size:100%}
|
h3{font-size:100%}
|
||||||
ul,ol,nav{padding:0;list-style-type:none}
|
ul,ol,nav{padding:0;list-style-type:none}
|
||||||
p{margin:0 0 16px;padding:0}
|
p{margin:0 0 16px;padding:0}
|
||||||
|
|
@ -23,7 +23,7 @@ mark{background:#ff0;color:#000}
|
||||||
code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}
|
code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}
|
||||||
pre{white-space:pre-wrap}
|
pre{white-space:pre-wrap}
|
||||||
q{quotes:"\201C" "\201D" "\2018" "\2019"}
|
q{quotes:"\201C" "\201D" "\2018" "\2019"}
|
||||||
small{font-size:80%}
|
small{font-size:87.5%}
|
||||||
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
|
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
|
||||||
sup{top:-.5em}
|
sup{top:-.5em}
|
||||||
sub{bottom:-.25em}
|
sub{bottom:-.25em}
|
||||||
|
|
@ -73,7 +73,7 @@ menu a,#profile{display:block;padding:15px 0;color:#d9e5e7}
|
||||||
menu a:hover,#profile:hover{color:#fff}
|
menu a:hover,#profile:hover{color:#fff}
|
||||||
|
|
||||||
menu .active{color:#fff}
|
menu .active{color:#fff}
|
||||||
menu .active .fa{color:#bcd75e}
|
menu .active .fa,.crewards .unlocked .fa{color:#bcd75e}
|
||||||
|
|
||||||
#profile{float:right}
|
#profile{float:right}
|
||||||
.circlenote{margin-left:15px;background:#bcd75e;border-radius:0.8em;display:inline-block;color:#0f373c;font-weight:bold;line-height:1.6em;text-align:center;width:1.6em;font-size:.8em}
|
.circlenote{margin-left:15px;background:#bcd75e;border-radius:0.8em;display:inline-block;color:#0f373c;font-weight:bold;line-height:1.6em;text-align:center;width:1.6em;font-size:.8em}
|
||||||
|
|
@ -123,13 +123,44 @@ article{padding:70px 0 30px}
|
||||||
input[type="submit"][disabled]{text-shadow:1px 2px #d48c4e;background:#f9ac69;border-color:#d48c4e}
|
input[type="submit"][disabled]{text-shadow:1px 2px #d48c4e;background:#f9ac69;border-color:#d48c4e}
|
||||||
|
|
||||||
|
|
||||||
|
/** Character Profile **/
|
||||||
|
|
||||||
|
.cportrait img{width:100%}
|
||||||
|
|
||||||
|
.cdata{display:inline-block;background:#fff;border-radius:3px;padding:12px 20px 0 20px;margin-bottom:5px}
|
||||||
|
.cdata.square{text-align:center;width:10%;padding-top:0}
|
||||||
|
.cdata.square.blue{background:#5cb6bd;color:#fff}
|
||||||
|
.cdata .xpbar,.ctopics .xpbar{width:100%}
|
||||||
|
.cdata .value{font-size:1.5em;margin:0;padding-top:8px}
|
||||||
|
|
||||||
|
.crewards li{background:#fff;margin-bottom:5px;padding:15px 15px 1px 15px;border-radius:3px;font-size:.875em}
|
||||||
|
.crewards li:last{margin-bottom:0}
|
||||||
|
.crewards li .fa{font-size:1.25em}
|
||||||
|
.crewards .locked{color:#aca8a1;padding:10px;}
|
||||||
|
|
||||||
|
.cgroups img{float:left;border-radius:3px;margin-right:5px;height:35px}
|
||||||
|
.cgroups p{float:left;0;padding:0 12px;line-height:35px;background:#fff;border-radius:0 3px 3px 0}
|
||||||
|
.cgroups a{float:left;padding:0 12px;line-height:35px;background:#50a4ab;color:#fff;background:#50a4ab;border-radius:3px 0 0 3px}
|
||||||
|
|
||||||
|
.cranks li{clear:both;padding:8px 0 8px 8px;border-radius:3px}
|
||||||
|
.cranks li:nth-child(odd){background:#fff}
|
||||||
|
.cranks img{float:left;margin-right:15px;width:50px;height:50px;border-radius:25px}
|
||||||
|
.cranks p,.ctopics p{margin:0;padding:0}
|
||||||
|
|
||||||
|
.ctopics .xpbar{background:#e4e1dd}
|
||||||
|
.ctopics .xpbar span{background:#50a4ab}
|
||||||
|
|
||||||
|
|
||||||
/** Media Queries **/
|
/** Media Queries **/
|
||||||
|
|
||||||
@media only screen and (min-width:480px){
|
@media only screen and (min-width:480px){
|
||||||
.questgroups li{width:48%;float:left}
|
.questgroups li,.ctopics li,.fll48{width:48%;float:left}
|
||||||
.questgroups li:nth-child(even){float:right}
|
.questgroups li:nth-child(even),.ctopics li:nth-child(even),.flr48{width:48%;float:right}
|
||||||
.xpinfo{display:inline-block;float:left;padding-right:20px}
|
.xpinfo{display:inline-block;float:left;padding-right:20px}
|
||||||
.xpbar{width:50%}
|
.xpbar{width:50%}
|
||||||
|
|
||||||
|
.cinfo{float:left;width:70%}
|
||||||
|
.cportrait{float:right;width:25%}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (min-width:768px){
|
@media only screen and (min-width:768px){
|
||||||
|
|
@ -144,7 +175,7 @@ menu a{padding:10px 0}
|
||||||
#profile{float:none;margin:30px 0 15px 12px}
|
#profile{float:none;margin:30px 0 15px 12px}
|
||||||
#toggle,.toggle{display:none}
|
#toggle,.toggle{display:none}
|
||||||
.wrap{margin:0 0 0 300px}
|
.wrap{margin:0 0 0 300px}
|
||||||
article{padding:20px 40px 30px 40px}
|
article{padding:20px 40px 80px 40px}
|
||||||
.moodpic{margin:-20px -40px}
|
.moodpic{margin:-20px -40px}
|
||||||
.breadcrumbs li{display:inline;padding-right:10px}
|
.breadcrumbs li{display:inline;padding-right:10px}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue