mood pic styling & example for all resolutions

This commit is contained in:
Daniel 2014-03-23 02:09:43 +01:00
commit 354ea4052d
4 changed files with 18 additions and 6 deletions

View file

@ -32,7 +32,6 @@
</nav>
</header>
<article class="wrap">
<h1><a href="<?=$linker->link(array(), 0, true, array(), true)?>">The Legend of Z</a></h1>
<?=$intermediate?>
</article>
</body>

View file

@ -1,5 +1,6 @@
<menu>
<?php if(is_null($loggedUser)) : ?><li><a href="<?=$linker->link(null)?>"><i class="fa fa-users fa-fw"></i><?=_('Introduction')?></a></li><?php endif ?>
<li><a href="<?=$linker->link(array(), 0, true, array(), true)?>"><i class="fa fa-users fa-fw"></i>The Legend of Z</a></li>
<?php if(!is_null($loggedUser)) : ?><li><a href="<?=$linker->link('users')?>"><i class="fa fa-users fa-fw"></i><?=_('Users')?></a></li><?php endif ?>
<?php if(!is_null($loggedUser)) : ?><li><a href="<?=$linker->link('seminaries')?>"><i class="fa fa-pencil-square-o fa-fw"></i><?=_('Seminaries')?></a></li><?php endif ?>
<?php if(!is_null($loggedUser)) : ?><li><a href="#"><i class="fa fa-users fa-fw"></i>Gilden</a></li><?php endif ?>

View file

@ -1,7 +1,11 @@
<div class="moodpic">
<img src="http://s1.directupload.net/images/140323/tpzvoy5c.png">
</div>
<?=$questgroupspicture?>
<h2><a href="<?=$linker->link(array('seminaries',$seminary['url']))?>"><?=$seminary['title']?></a></h2>
<?=$questgroupshierarchypath?>
<?=$questgroupspicture?>
<h3><?=$questgroupshierarchy['title_singular']?> <?=$questgroup['pos']?>: <?=$questgroup['title']?></h3>
<?php foreach($texts as &$text) : ?>

View file

@ -77,6 +77,9 @@ menu a,#profile{display:block;padding:15px 0;color:#fff}
article{padding:70px 0 30px}
.moodpic{margin:-15px -5.5% 0 -5.5%;overflow:hidden}
.moodpic img{width:100vw}
.breadcrumbs li{display:block;font-size:.875em}
.breadcrumbs .fa{padding-right:5px;font-size:.75em}
@ -128,11 +131,16 @@ menu{display:block;opacity:1;position:relative}
menu a{padding:10px 0}
#profile{float:none;margin:30px 0 15px 12px}
#toggle,.toggle{display:none}
.wrap{margin:0 20px 0 340px}
article{padding-top:20px}
.wrap{margin:0 0 0 300px}
article{padding:20px 40px 30px 40px}
.moodpic{margin:-20px -40px}
.breadcrumbs li{display:inline;padding-right:10px}
}
@media only screen and (min-width:1200px){
.wrap{width:860px;max-width:860px}
@media only screen and (min-width:1366px){
body{background:#eae8e4}
.wrap{width:800px;max-width:800px}
article{background:#f7f5f2}
.moodpic{margin:-20px 0 0 -40px;width:880px;height:230px}
.moodpic img{width:auto}
}