Refactor stylesheets and do a major overhaul of the styling.

1 files changed, 58 insertions, 0 deletions

diff --git a/app/assets/stylesheets/hmno_header.scss b/app/assets/stylesheets/hmno_header.scss
new file mode 100644
index 0000000..f35eea0
--- /dev/null
+++ b/app/assets/stylesheets/hmno_header.scss
@@ -0,0 +1,58 @@
+@import "color_scheme";
+
+#header {
+    #logo {
+        background: {
+            color: $header-bg;
+            image: image_url("header-metal-bg.jpg");
+            repeat: no-repeat;
+        }
+        border-bottom: 1px solid $fg;
+    }
+
+    #menu {
+        position: relative;
+        text-align: center;
+        top: -2em;
+
+        ul {
+            padding: 0;
+
+            li {
+                list-style: none;
+                display: inline-block;
+                background-color: $menu-bg;
+
+                padding: {
+                    left: 1em;
+                    right: 1em;
+                    top: 0.3em;
+                    bottom: 0.3em;
+                }
+
+                &.selected {
+                    background-color: $selected-menu-bg;
+                    font-weight: 600;
+
+                    a {
+                        color: $selected-menu-fg;
+                    }
+                }
+
+                &:hover {
+                    background-color: $hover-menu-bg;
+
+                    a {
+                        color: $hover-menu-fg;
+                    }
+                }
+
+                a {
+                    text-decoration: none;
+                    color: $menu-fg;
+                }
+            }
+        }
+    }
+}
+