Fix anchor issue with fixed navbar

When use anchors - conetent gets hidden under navbar. This commit fixes with hack using margin+height combination

Fix anchor issue with fixed navbar
When use anchors - conetent gets hidden under navbar. This commit fixes with hack using margin+height combination
204b3c12 · Dmitriy Zaporozhets · ff7f4a13 · 204b3c12 · 204b3c12 · 204b3c12
Commit 204b3c12 authored Jan 14, 2015 by Dmitriy Zaporozhets
7 changed files
--- a/app/assets/stylesheets/generic/timeline.scss
+++ b/app/assets/stylesheets/generic/timeline.scss
@@ -20,6 +20,17 @@
    margin-bottom: 10px;
    clear: both;

+    /* Hack for anchors and fixed navbar */
+    &[id] {
+      &:before {
+        content: '';
+        display: block;
+        position: relative;
+        width: 0;
+        height: 3em;
+        margin-top: -3em;
+      }
+    }

    &:target {
      .timeline-entry-inner .timeline-content {

--- a/app/assets/stylesheets/generic/typography.scss
+++ b/app/assets/stylesheets/generic/typography.scss
@@ -98,8 +98,7 @@ a:focus {
      $size: 16px;
      position: absolute;
      right: 100%;
-      top: 50%;
-      margin-top: -$size/2;
+      bottom: 7px;
      margin-right: 0px;
      padding-right: 20px;
      display: inline-block;
@@ -109,6 +108,18 @@ a:focus {
      background-size: contain;
      background-repeat: no-repeat;
    }
+
+    /* Hack for anchors and fixed navbar */
+    &[id] {
+      &:before {
+        content: '';
+        display: block;
+        position: relative;
+        width: 0;
+        height: 3em;
+        margin-top: -3em;
+      }
+    }
  }

  ul {

--- a/app/assets/stylesheets/main/layout.scss
+++ b/app/assets/stylesheets/main/layout.scss
@@ -12,4 +12,3 @@ html {
 .container .content {
  margin: 0 0;
 }
-
--- a/app/assets/stylesheets/main/mixins.scss
+++ b/app/assets/stylesheets/main/mixins.scss
@@ -65,9 +65,11 @@
    max-width: 100%;
  }

-  *:first-child {
+  h1, h2, h3 {
+    &:first-child {
      margin-top: 0;
    }
+  }

  code { padding: 0 4px; }


--- a/app/assets/stylesheets/sections/header.scss
+++ b/app/assets/stylesheets/sections/header.scss
@@ -8,8 +8,6 @@ header {
    margin-bottom: 0;
    min-height: 40px;
    border: none;
-    position: fixed;
-    top: 0;
    width: 100%;

    .navbar-inner {

--- a/app/assets/stylesheets/sections/notes.scss
+++ b/app/assets/stylesheets/sections/notes.scss
@@ -57,6 +57,7 @@ ul.notes {
  .note {
    display: block;
    position:relative;
+
    .attachment {
      font-size: 14px;
    }

--- a/app/views/layouts/_head_panel.html.haml
+++ b/app/views/layouts/_head_panel.html.haml
-%header.navbar.navbar-static-top.navbar-gitlab
+%header.navbar.navbar-fixed-top.navbar-gitlab
  .navbar-inner
    .container
      %div.app_logo