more css3 features in navbar

This commit is contained in:
Jörg Thalheim 2012-08-12 19:09:08 +02:00
parent 334cf360bb
commit f1635548de
6 changed files with 66 additions and 47 deletions

View File

@ -1,6 +1,7 @@
==link_to "Higgs-Boson", "/", :id => "sitelink", :title => "Startpage" nav
ul ==link_to "Higgs-Boson", "/", :id => "sitelink", :title => "Startpage"
li ul
==link_to "Impressum", "/impressum.html", :class => "navlink", :title => "Impressum" li
li ==link_to "Impressum", "/impressum.html", :class => "navlink", :title => "Impressum"
==link_to "About", "#about", :class => "navlink", :title => "About" li
==link_to "About", "#about", :class => "navlink", :title => "About"

View File

@ -2,7 +2,7 @@ h1#pagetitle Higgs-Boson
h2#pagesubtitle Where dreams become true h2#pagesubtitle Where dreams become true
section section
ul.icons ul#overview.icons
li li
i.icon-github i.icon-github
a href="http://git.higgsboson.tk/pub" title="Webinterface to our public git repos" Git Web a href="http://git.higgsboson.tk/pub" title="Webinterface to our public git repos" Git Web

View File

@ -1,6 +1,6 @@
h1 Internal Services h1 Internal Services
section section
ul.icons ul#overview.icons
li li
i.icon-envelope i.icon-envelope
a href="https://mail.higgsboson.tk" Mail a href="https://mail.higgsboson.tk" Mail

View File

@ -30,7 +30,7 @@ $fontAwesomePath: "fontawesome-webfont" !default;
font-files( font-files(
"#{$fontAwesomePath}.woff", woff, "#{$fontAwesomePath}.woff", woff,
"#{$fontAwesomePath}.ttf", truetype, "#{$fontAwesomePath}.ttf", truetype,
"#{$fontAwesomePath}.svg#FontAwesomeRegular", svg), "#{$fontAwesomePath}.svg#FontAwesome", svg),
'#{$fontAwesomePath}.eot', '#{$fontAwesomePath}.eot',
normal, normal,
normal); normal);

View File

@ -18,44 +18,10 @@ body {
line-height: 1.3em; line-height: 1.3em;
} }
#sitelink {
float: left;
font-size: 1.1em;
padding-right: 0.1em;
padding-left: 0.1em;
}
#pagetitle {
@include text-shadow(0px, -1px, 1px, rgb(255, 255, 255), 0px, 1px, 1px, rgb(102, 102, 102));
}
.container {
@include grid_container;
@include clearfix;
@include accentize($yellow);
/* Grid layout */
#main {
margin-top: 50px;
@include grid(12);
@include clearfix;
}
}
.icons {
font-size: 2em;
li {
line-height: 0.8em;
}
}
a { a {
text-decoration:none; text-decoration:none;
&:hover { &:hover {
font-weight:bold; text-decoration:underline;
letter-spacing:-0.0565em;
} }
} }
@ -79,9 +45,54 @@ header {
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
} }
box-shadow: 0 2px 3px #b8b8b8;
} }
footer { footer {
@include grid(12); @include grid(12);
padding-left: 15px; padding-left: 15px;
box-shadow: 0 2px 3px #b8b8b8;
} }
.container {
@include grid_container;
@include clearfix;
@include accentize($yellow);
/* Grid layout */
#main {
margin-top: 50px;
@include grid(12);
@include clearfix;
}
}
.navlink {
&:hover {
text-decoration: none;
}
}
#sitelink {
float: left;
font-size: 1.1em;
padding-right: 0.1em;
padding-left: 0.1em;
&:hover {
text-decoration: none;
}
}
#pagetitle {
@include text-shadow(0px, -1px, 1px, rgb(255,255,255), 0px, 1px, 1px, rgb(102,102,102));
}
#overview {
font-size: 2em;
li {
line-height: 0.8em;
}
}

View File

@ -29,11 +29,18 @@ $green: #859900;
background-color: $rebase01; background-color: $rebase01;
color: $rebase1; color: $rebase1;
a.navlink, a:active.navlink, a:visited.navlink { color: $rebase1; } a.navlink, a:active.navlink, a:visited.navlink {
color: $rebase1;
text-shadow: 1px 1px 1px #ADBAC0;
}
a:hover.navlink { background: transparent; color: $rebase02; } a:hover.navlink { background: transparent; color: $rebase02; }
#sitelink { color: $rebase02; background-color: $rebase1 } #sitelink {
a:hover#sitelink { font-weight: bold; } color: $rebase02; background-color: $rebase1;
&:hover{
color: $rebase03;
}
}
} }
footer { footer {
background-color: $rebase02; background-color: $rebase02;