Merge pull request #91 from mrliptontea/issue-90-misaligned-delete-icon-in-watchers-list

Resolve regression in sidebar layouts

README.md

@@ -56,6 +56,11 @@ If you need to customize styles for [Redmine Backlogs][redmine_backlogs] remembe
 
 ## Changelog
 
+v2.0.1 (2019-03-17):
+
+* Fixed #90: regression in some sidebar layouts
+* Removed reduntant `abbr[title]` styles
+
 v2.0 (2019-03-13):
 
 * Refreshed, modernized look & feel

src/sass/components/_admin.scss

@@ -2,8 +2,8 @@
 // Admin
 // --------------------------------------------------
 
-#main #admin-menu {
-  ul {
+#admin-menu {
+  ul:nth-child(n) {
     li {
       list-style-type: none;
 
@@ -14,9 +14,8 @@
       }
     }
   }
-}
 
-#main #admin-index > #admin-menu {
+  #admin-index > & {
     ul {
       margin: 0;
       padding: 0;
@@ -32,6 +31,7 @@
       background-position: 0 center;
     }
   }
+}
 
 
 //== Groups

src/sass/components/_base.scss

@@ -149,11 +149,6 @@ hr {
   border-top: 1px solid $hr-border;
 }
 
-abbr[title] {
-  border-bottom: 1px dotted $abbr-border-color;
-  cursor: help;
-}
-
 blockquote {
   margin: 0 0 $line-height-computed;
   padding: floor($line-height-computed / 4) $padding-large-horizontal;

src/sass/components/_content.scss

@@ -28,7 +28,7 @@
 // Sidebar
 // --------------------------------------------------
 
-#main #sidebar {
+#sidebar {
   padding: $padding-side $sidebar-padding-horizontal;
 
   @if $flexbox-layout {
@@ -58,6 +58,19 @@
     }
   }
 
+  .nosidebar & {
+    margin: 0;
+    padding: 0;
+    border: 0 none;
+
+    @if $flexbox-layout {
+      flex: 0 0 auto;
+    } @else {
+      width: 0;
+      float: none;
+    }
+  }
+
   h3 {
     margin-top: $line-height-computed * 1.5;
   }
@@ -68,6 +81,7 @@
   }
 
   ul {
+    &:nth-child(n) {
       margin: 0 0 ($line-height-computed / 2);
       padding: 0;
 
@@ -76,7 +90,9 @@
       } @else {
         margin-left: -($sidebar-padding-horizontal);
       }
+    }
 
+    &:not(.watchers) {
       li {
         margin: 0;
         padding: 0;
@@ -123,16 +139,15 @@
     }
   }
 
-#main.nosidebar #sidebar {
-  margin: 0;
-  padding: 0;
-  border: 0 none;
+  // Special treatment for anchor tags directly under sidebar tag
+  > a {
+    padding: $sidebar-padding-vertical $sidebar-padding-horizontal;
 
-  @if $flexbox-layout {
-    flex: 0 0 auto;
+    @if $sidebar-position == "left" {
+      padding-left: $sidebar-padding-horizontal + 3px;
     } @else {
-    width: 0;
-    float: none;
+      padding-right: $sidebar-padding-horizontal + 3px;
+    }
   }
 }
 

src/sass/components/_elements.scss

@@ -201,10 +201,15 @@ a.collapsible.collapsed,
         background: transparent;
       }
 
+      > .icon-only {
+        &::before {
+          line-height: inherit;
+        }
+      }
+
       > .delete {
         float: right;
         opacity: $icon-opacity;
-        vertical-align: middle;
 
         &:hover {
           opacity: $icon-hover-opacity;