summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--blog/_includes/header.html2
-rw-r--r--blog/_includes/menubar.html3
-rw-r--r--blog/_sass/_config.scss7
-rw-r--r--blog/_sass/_header.scss20
-rw-r--r--blog/_sass/_navbar.scss31
-rw-r--r--blog/css/main.scss43
6 files changed, 62 insertions, 44 deletions
diff --git a/blog/_includes/header.html b/blog/_includes/header.html
index a5eab3d..c873fb1 100644
--- a/blog/_includes/header.html
+++ b/blog/_includes/header.html
@@ -1,7 +1,7 @@
<header id="header">
<div id="logo">
<img src="{{ '/assets/images/header.png' | prepend: site.baseurl_root }}" alt="Norsk Urskog">
- Norwegian Underground Metal Sampler
+ <p>Norwegian Underground Metal Sampler</p>
</div>
<div id="banner-pos-1">
<a href="http://infernofestival.net">
diff --git a/blog/_includes/menubar.html b/blog/_includes/menubar.html
index 1242ca8..04b6834 100644
--- a/blog/_includes/menubar.html
+++ b/blog/_includes/menubar.html
@@ -1,7 +1,8 @@
<nav class="site-nav">
+ <a class="page-link" href="{{ site.baseurl }}">{% t titles.home %}</a>
{% for page in site.pages %}
{% if page.title and page.hidden != true %}
- <a class="page-link" href="{{ page.url | prepend: site.baseurl }}">{{ page.title }}</a>
+ <a class="page-link" href="{{ page.url | prepend: site.baseurl }}">{% t {{ page.title }} %}</a>
{% endif %}
{% endfor %}
</nav>
diff --git a/blog/_sass/_config.scss b/blog/_sass/_config.scss
index 4054059..68fb2b6 100644
--- a/blog/_sass/_config.scss
+++ b/blog/_sass/_config.scss
@@ -1,12 +1,13 @@
$body-bg: black;
$text-color: #aaa;
-$link-color: #666;
+$link-color: #686;
+$link-hover-color: lighten(#686, 5%);
$side-bar-background: rgba(20, 20, 20, 0.7);
-$menu-bar-background: $side-bar-background;
+$menu-bar-background: rgba(128, 256, 128, 0.15);
$nav-link-padding: 5px 10px;
-$nav-link-hover-bg: rgba(40, 70, 80, 0.7);
+$nav-link-hover-bg: rgba(128, 256, 128, 0.2);
$nav-link-hover-color: #ccf;
$nav-pills-active-link-hover-bg: $nav-link-hover-bg;
$nav-pills-active-link-hover-color: $nav-link-hover-color;
diff --git a/blog/_sass/_header.scss b/blog/_sass/_header.scss
new file mode 100644
index 0000000..7998bb5
--- /dev/null
+++ b/blog/_sass/_header.scss
@@ -0,0 +1,20 @@
+#header {
+ width: 100%;
+ font-size: 110%;
+ font-weight: 600;
+
+ #logo {
+ position: relative;
+ width: 479px;
+ text-align: center;
+ p {
+ margin-top: 0;
+ }
+ }
+
+ #banner-pos-1 {
+ position: absolute;
+ top: 1.5em;
+ right: 0;
+ }
+}
diff --git a/blog/_sass/_navbar.scss b/blog/_sass/_navbar.scss
new file mode 100644
index 0000000..f5c46f5
--- /dev/null
+++ b/blog/_sass/_navbar.scss
@@ -0,0 +1,31 @@
+#header {
+ .site-nav {
+ background: {
+ color: $menu-bar-background;
+ }
+ @include round-corners;
+ width: 100%;
+ border: {
+ bottom: 1px solid darkgray;
+ top: 1px solid darkgray;
+ }
+
+ a {
+ text-decoration: none;
+ color: $link-color;
+ padding: {
+ top: 1.5mm;
+ bottom: 1.5mm;
+ left: 2mm;
+ right: 2mm;
+ }
+ &:hover {
+ background-color: $nav-link-hover-bg;
+ color: $nav-link-hover-color;
+ }
+ }
+ &.menu-flags {
+ float: right;
+ }
+ }
+}
diff --git a/blog/css/main.scss b/blog/css/main.scss
index 8180956..a6abce1 100644
--- a/blog/css/main.scss
+++ b/blog/css/main.scss
@@ -3,6 +3,8 @@
---
@import "config";
@import "common";
+@import "header";
+@import "navbar";
body {
background-color: black;
@@ -18,9 +20,9 @@ body {
}
a {
- color: #686;
+ color: $link-color;
&:hover {
- color: lighten(#686, 5%);
+ color: $link-hover-color;
}
}
@@ -114,40 +116,3 @@ a {
}
}
}
-
-#logo {
- position: relative;
- font-size: 110%;
- font-weight: 600;
- width: 479px;
- text-align: center;
-}
-
-#menu-bar, #next_prev_article {
- margin-bottom: 1em;
- background: {
- color: $menu-bar-background;
- }
- font-size: 110%;
- font-weight: 600;
- @include round-corners;
- ul {
- li {
- a {
- color: $link-color;
- }
- }
- .selected {
- background-color: $nav-pills-active-link-hover-bg;
- }
- &.menu-flags {
- float: right;
- }
- }
-}
-
-#banner-pos-1 {
- position: absolute;
- top: 1.5em;
- right: 0;
-}