1
0

Restyled and less breakable header layout.

This commit is contained in:
Matthias Mees
2013-06-07 13:23:34 +02:00
parent b528c2e57c
commit 44a9f8491d
2 changed files with 42 additions and 68 deletions

View File

@ -16,9 +16,6 @@
<div id="banner{if not $admin_vars.is_logged_in}_install{/if}">
{if $admin_vars.admin_installed}
<h1><a href="serendipity_admin.php" title="{$CONST.ADMIN_FRONTPAGE}"><span class="visuallyhidden">{$CONST.SERENDIPITY_ADMIN_SUITE}: </span>{$blogTitle}</a></h1>
{if $admin_vars.is_logged_in}
<span class="block_level">{$admin_vars.self_info}</span>
{/if}
{else}
<h1>{$CONST.SERENDIPITY_INSTALLATION}</h1>
{/if}
@ -27,13 +24,15 @@
<nav id="user_menu">
<h2 class="visuallyhidden">User menu</h2> {* i18n *}
<span class="block_level">{$admin_vars.self_info}</span>
<ul>
<li><a class="icon_link" href="serendipity_admin.php" title="{$CONST.ADMIN_FRONTPAGE}"><span class="icon-home"></span><span class="visuallyhidden"> {$CONST.ADMIN_FRONTPAGE}</span></a></li>
<li><a class="button_link" href="serendipity_admin.php" title="{$CONST.ADMIN_FRONTPAGE}"><span class="icon-home"></span><span class="visuallyhidden"> {$CONST.ADMIN_FRONTPAGE}</span></a></li>
{if 'personalConfiguration'|checkPermission}
<li><a class="icon_link" href="serendipity_admin.php?serendipity[adminModule]=personal" title="{$CONST.PERSONAL_SETTINGS}"><span class="icon-cog-alt"></span><span class="visuallyhidden"> {$CONST.PERSONAL_SETTINGS}</span></a></li>
<li><a class="button_link" href="serendipity_admin.php?serendipity[adminModule]=personal" title="{$CONST.PERSONAL_SETTINGS}"><span class="icon-cog-alt"></span><span class="visuallyhidden"> {$CONST.PERSONAL_SETTINGS}</span></a></li>
{/if}
<li><a class="icon_link" href="{$serendipityBaseURL}" title="{$CONST.BACK_TO_BLOG}"><span class="icon-link-ext"></span><span class="visuallyhidden"> {$CONST.BACK_TO_BLOG}</span></a></li>
<li><a class="icon_link" href="serendipity_admin.php?serendipity[adminModule]=logout" title="{$CONST.LOGOUT}"><span class="icon-off"></span><span class="visuallyhidden"> {$CONST.LOGOUT}</span></a></li>
<li><a class="button_link" href="{$serendipityBaseURL}" title="{$CONST.BACK_TO_BLOG}"><span class="icon-link-ext"></span><span class="visuallyhidden"> {$CONST.BACK_TO_BLOG}</span></a></li>
<li><a class="button_link" href="serendipity_admin.php?serendipity[adminModule]=logout" title="{$CONST.LOGOUT}"><span class="icon-off"></span><span class="visuallyhidden"> {$CONST.LOGOUT}</span></a></li>
</ul>
</nav>
{/if}

View File

@ -202,7 +202,7 @@ table {
/* BASE STYLES
----------------------------------------------------------------- */
html {
font-size: 100%;
font-size: 0.875em;
}
html,
@ -941,7 +941,6 @@ html {
body {
background: #fcfcfc;
font-size: 0.875em;
}
a,
@ -973,7 +972,7 @@ a.button_link:focus,
h1 {
font-size: 1.71429em;
line-height: 1.75em;
margin: 0.875em 0 0;
margin: 0.5em 0 0;
}
#banner_install h1 {
@ -1231,9 +1230,9 @@ main {
color: #25253d;
}
#user_menu span,
#user_menu ul {
font-size: 1.5em;
margin: .5em 0;
margin: 0 0 .75em;
}
#user_menu li {
@ -1693,37 +1692,6 @@ input[name="serendipity[filter][fileCategory]"] {
/* SMALL SCREEN (e.g. smartphones)
----------------------------------------------------------------- */
@media only screen and (min-width: 480px) {
#banner {
float: left;
margin: 0 1% 0 0;
}
#user_menu {
float: left;
margin: 0 0 0 1%;
text-align: right;
}
#banner,
#user_menu {
width: 49%;
}
#banner > span {
margin: 0 0 1.5em;
}
#user_menu ul {
font-size: 1.5em;
margin: 1.35em 0 .65em;
}
#user_menu li {
margin: 0 0 0 1em;
}
}
@media only screen and (min-width: 481px) {
#uploadform label {
display: inline-block;
@ -1745,21 +1713,37 @@ input[name="serendipity[filter][fileCategory]"] {
}
}
@media only screen and (min-width: 640px) {
#banner,
#user_menu {
float: left;
width: 50%;
}
#user_menu {
text-align: right;
}
#user_menu li {
margin: 0 0 0 1em;
}
#user_menu > span {
margin: .375em 0;
}
}
/* MEDIUM SCREEN (e.g. tablets)
----------------------------------------------------------------- */
@media only screen and (min-width: 768px) {
body {
html {
font-size: 1em;
}
h1 {
font-size: 2em;
font-size: 1.75em;
line-height: 1.5em;
margin: 0.75em 0 0;
}
#banner_install h1 {
margin: 0.75em 0;
}
@ -1775,6 +1759,14 @@ input[name="serendipity[filter][fileCategory]"] {
margin: 1.71429em 0;
}
#user_menu > span {
margin: 0.875em 0 .4375em;
}
#user_menu ul {
margin: 0.4375em 0 .875em;
}
#image_directory_edit_form > .clearfix > div {
float: left;
margin: 0 5% 0 0;
@ -2013,31 +2005,14 @@ input[name="serendipity[filter][fileCategory]"] {
/* LARGER SCREEN (e.g. laptops)
----------------------------------------------------------------- */
@media only screen and (min-width: 1280px) {
#banner h1 {
float: left;
margin: .75em 0;
}
#banner > span {
float: left;
margin: 2.35em 0 1.5em 3.35em;
}
#user_menu ul {
font-size: 2em;
margin: .75em 0;
}
}
/* HUGE SCREEN (e.g. desktops)
----------------------------------------------------------------- */
@media only screen and (min-width: 1400px) {
body {
html {
font-size: 1.125em;
}
#banner > span {
margin: 2.35em 0 1.5em 2em;
}
}