summaryrefslogtreecommitdiff
path: root/source
diff options
context:
space:
mode:
authorLars Henrik Mai <lars.mai@kontinui.de>2014-05-03 15:48:44 +0200
committerLars Henrik Mai <lars.mai@kontinui.de>2014-05-03 20:06:40 +0200
commit0b269fb063fa2c9d4f3b7cff98fd1da87cfb7cdb (patch)
tree8575f506c0c786a0b73fa3c6f3aff88a636a901a /source
parent1182b56a2e98cc5fbbbbe2bc30a0248f087ffd49 (diff)
much designs.new-navigation-1
Diffstat (limited to 'source')
-rw-r--r--source/_navigation.html.erb4
-rw-r--r--source/images/background.pngbin2726 -> 0 bytes
-rw-r--r--source/images/middleman.pngbin25282 -> 0 bytes
-rw-r--r--source/images/sublab-logo.pngbin0 -> 20608 bytes
-rw-r--r--source/layouts/layout.erb32
-rw-r--r--source/stylesheets/_variables.scss62
-rw-r--r--source/stylesheets/base.css.scss44
7 files changed, 109 insertions, 33 deletions
diff --git a/source/_navigation.html.erb b/source/_navigation.html.erb
index c0e3148..61a72ea 100644
--- a/source/_navigation.html.erb
+++ b/source/_navigation.html.erb
@@ -46,10 +46,6 @@
<div class="collapse navbar-collapse" id="nav-big">
<ul>
- <li class="dropdown">
- <%= link_to "Home", "/" %>
- </li>
-
<% @navigation.each do |key, value| %>
<li class="dropdown">
<a data-toggle="dropdown" class="dropdown-toggle" href=<%= key.last %>>
diff --git a/source/images/background.png b/source/images/background.png
deleted file mode 100644
index 8681d44..0000000
--- a/source/images/background.png
+++ /dev/null
Binary files differ
diff --git a/source/images/middleman.png b/source/images/middleman.png
deleted file mode 100644
index c685e56..0000000
--- a/source/images/middleman.png
+++ /dev/null
Binary files differ
diff --git a/source/images/sublab-logo.png b/source/images/sublab-logo.png
new file mode 100644
index 0000000..b7a8fd9
--- /dev/null
+++ b/source/images/sublab-logo.png
Binary files differ
diff --git a/source/layouts/layout.erb b/source/layouts/layout.erb
index 544621a..b2835f2 100644
--- a/source/layouts/layout.erb
+++ b/source/layouts/layout.erb
@@ -20,20 +20,24 @@
<body class="<%= page_classes %>">
- <!-- header -->
- <header>
- <h1>sublab</h1>
- </header>
-
- <!-- main navigation -->
- <nav>
- <%= partial "navigation" %>
- </nav>
-
- <!-- content -->
- <section id="main">
- <%= yield %>
- </section>
+ <!-- header -->
+ <header>
+ <div id="logo">
+ <% link_to '/' do %>
+ <%= image_tag 'sublab-logo.png', class: "img-responsive" %>
+ <% end %>
+ </div>
+ </header>
+
+ <!-- main navigation -->
+ <nav>
+ <%= partial "navigation" %>
+ </nav>
+
+ <!-- content -->
+ <section id="main">
+ <%= yield %>
+ </section>
</body>
</html>
diff --git a/source/stylesheets/_variables.scss b/source/stylesheets/_variables.scss
new file mode 100644
index 0000000..9093f23
--- /dev/null
+++ b/source/stylesheets/_variables.scss
@@ -0,0 +1,62 @@
+$gray-darker: #222;
+$gray-dark: #282828;
+$gray: #555;
+$gray-light: #888;
+$gray-lighter: #ADAFAE;
+
+$brand-primary: #2A9FD6;
+$brand-success: #77B300;
+$brand-info: #9933CC;
+$brand-warning: #FF8800;
+$brand-danger: #CC0000;
+
+
+$body-bg: #060606;
+$text-color: $gray-light;
+$link-color: $brand-primary;
+$link-hover-color: $link-color;
+
+$headings-color: #fff;
+
+$text-muted: $gray-light;
+
+//** Global color for active items (e.g., navs or dropdowns).
+$component-active-color: #fff;
+//** Global background color for active items (e.g., navs or dropdowns).
+$component-active-bg: $brand-primary;
+
+//** Width of the `border` for generating carets that indicator dropdowns.
+$caret-width-base: 4px;
+//** Carets increase slightly in size for larger components.
+$caret-width-large: 5px;
+
+
+//** Background for the dropdown menu.
+$dropdown-bg: $gray-darker;
+//** Dropdown menu `border-color`.
+$dropdown-border: rgba(255,255,255,0.1);
+//** Dropdown menu `border-color` **for IE8**.
+$dropdown-fallback-border: #444;
+//** Divider color for between dropdown items.
+$dropdown-divider-bg: rgba(255,255,255,0.1);
+
+//** Active dropdown menu item text color.
+$dropdown-link-active-color: #fff;
+//** Active dropdown menu item background color.
+$dropdown-link-active-bg: $component-active-bg;
+
+//** Dropdown link text color.
+$dropdown-link-color: #fff;
+//** Hover color for dropdown links.
+$dropdown-link-hover-color: #fff;
+//** Hover background for dropdown links.
+$dropdown-link-hover-bg: $dropdown-link-active-bg;
+
+//** Disabled dropdown menu item background color.
+$dropdown-link-disabled-color: $text-muted;
+
+//** Text color for headers within dropdown menus.
+$dropdown-header-color: $text-muted;
+
+// Note: Deprecated $dropdown-caret-color as of v3.1.0
+$dropdown-caret-color: #000;
diff --git a/source/stylesheets/base.css.scss b/source/stylesheets/base.css.scss
index 99db24d..fbcae5f 100644
--- a/source/stylesheets/base.css.scss
+++ b/source/stylesheets/base.css.scss
@@ -1,41 +1,55 @@
+@import "variables";
@import "bootstrap";
header {
@extend .row;
}
+div#logo {
+ @extend .col-sm-4;
+ @extend .col-sm-offset-2;
+}
+
body {
- @extend .container;
+ @extend .container-fluid;
+}
+
+#main {
+ @extend .col-sm-8;
+ @extend .col-sm-offset-2;
}
nav {
@extend .row;
@extend .navbar;
- @extend .navbar-static;
+ @extend .navbar-static-top;
@extend .navbar-inverse;
}
nav ul {
@extend .nav;
@extend .navbar-nav;
- @extend .navbar-justified;
-
- //@extend .collapse;
- //@extend .navbar-collapse;
}
-@media (min-width: 768px){
- .navbar-nav{
+// center the main nav items on big screens
+@media (min-width: $screen-sm-min) {
+ div#nav-big {
+ width: 40%;
margin: 0 auto;
- display: table;
- table-layout: fixed;
- float:none;
}
}
+
+
/*
-ul.nav li.dropdown:hover ul.dropdown-menu{
- display: block;
- margin-top:0px
+// open navigation dropdown on hover on non-mobile devices
+// FIXME dropdown stays open on click..
+
+@media (min-width: $screen-sm-min) {
+nav ul li.dropdown:hover ul.dropdown-menu {
+display: block;
+margin-top:0px
}
-*/
+}
+
+ */