Release v2.8.0

Invalid position of pagination with large image attachment

Gruntfile.js

@@ -38,7 +38,7 @@ module.exports = function (grunt) {
     postcss: {
       options: {
         processors: [
-          require('autoprefixer')({ browsers: 'last 2 versions' })
+          require('autoprefixer')()
         ]
       },
 

README.md

@@ -2,7 +2,7 @@
 
 A free Redmine theme for modern browsers.
 
-![The MIT License](https://img.shields.io/badge/license-MIT-584492.svg) [![Build Status](https://travis-ci.org/mrliptontea/PurpleMine2.svg?branch=master)](https://travis-ci.org/mrliptontea/PurpleMine2) [![Issues](https://img.shields.io/github/issues/mrliptontea/PurpleMine2.svg)](https://github.com/mrliptontea/PurpleMine2/issues) [![JavaScript Style Guide](https://img.shields.io/badge/code%20style-standard-brightgreen.svg)](http://standardjs.com/)
+![The MIT License](https://img.shields.io/badge/license-MIT-584492.svg) [![Build Status](https://travis-ci.com/mrliptontea/PurpleMine2.svg?branch=master)](https://travis-ci.com/mrliptontea/PurpleMine2) [![Issues](https://img.shields.io/github/issues/mrliptontea/PurpleMine2.svg)](https://github.com/mrliptontea/PurpleMine2/issues) [![JavaScript Style Guide](https://img.shields.io/badge/code%20style-standard-brightgreen.svg)](http://standardjs.com/)
 
 ---
 
@@ -56,6 +56,23 @@ If you need to customize styles for [Redmine Backlogs][redmine_backlogs] remembe
 
 ## Changelog
 
+v2.8.0 (2019-08-13):
+
+* Resolved #132: fixed spacing for headers on roadmap pages.
+* Merged fix #136: broken layout with large image attachment
+
+v2.7.0 (2019-06-13):
+
+* Resolved #124: added support for [issue-id](http://projects.andriylesyuk.com/projects/issue-id/) plugin.
+
+v2.6.0 (2019-06-13):
+
+* Resolved #121: added support for [redmine_wiki_page_tree](https://github.com/ledsun/redmine_wiki_page_tree) plugin.
+
+v2.5.0 (2019-06-05):
+
+* Fixed #117, #118 and added many improvements to the responsive layout.
+
 v2.4.0 (2019-06-02):
 
 * Synchronized most application styles with Redmine's default theme.

package.json

@@ -25,20 +25,20 @@
     "lint": "npm run -S lint:js && npm run -S lint:sass"
   },
   "dependencies": {
-    "autoprefixer": "^9.4.10",
+    "autoprefixer": "^9.6.1",
-    "grunt": "^1.0.3",
+    "grunt": "^1.0.4",
-    "grunt-contrib-uglify": "^4.0.0",
+    "grunt-contrib-uglify": "^4.0.1",
     "grunt-contrib-watch": "^1.1.0",
     "grunt-postcss": "^0.9.0",
     "grunt-sass": "^3.0.2",
-    "node-sass": "^4.11.0",
+    "node-sass": "^4.12.0",
     "sass-inline-svg": "^1.2.0"
   },
   "devDependencies": {
-    "standard": "^12.0.1",
+    "standard": "^13.1.0",
-    "stylelint": "^10.0.1",
+    "stylelint": "^10.1.0",
-    "stylelint-order": "^3.0.0",
+    "stylelint-order": "^3.0.1",
-    "stylelint-scss": "^3.6.1"
+    "stylelint-scss": "^3.9.3"
   },
   "standard": {
     "globals": [
@@ -48,5 +48,10 @@
     "ignore": [
       "/javascripts"
     ]
-  }
+  },
+  "browserslist": [
+    "last 2 versions",
+    "> 1%",
+    "not dead"
+  ]
 }

plugins/redmine_backlogs/jquery/jquery.multiselect.css

@@ -1 +1 @@
-.ui-multiselect{padding:2px 0 2px 4px;text-align:left}.ui-multiselect span.ui-icon{float:right}.ui-multiselect-single .ui-multiselect-checkboxes input{position:absolute !important;top:auto !important;left:-9999px}.ui-multiselect-single .ui-multiselect-checkboxes label{padding:5px !important}.ui-multiselect-header{margin-bottom:3px;padding:3px}.ui-multiselect-header ul{font-size:.92em}.ui-multiselect-header ul li{padding:0 10px 0 0;float:left}.ui-multiselect-header a{text-decoration:none}.ui-multiselect-header a:hover{text-decoration:underline}.ui-multiselect-header span.ui-icon{float:left}.ui-multiselect-header li.ui-multiselect-close{padding-right:0;float:right;text-align:right}.ui-multiselect-menu{-webkit-box-shadow:0 5px 8px -2px rgba(0,0,0,0.25),0 1px 2px rgba(0,0,0,0.3);box-shadow:0 5px 8px -2px rgba(0,0,0,0.25),0 1px 2px rgba(0,0,0,0.3);display:none;position:absolute;z-index:10000;padding:3px;text-align:left}.ui-multiselect-checkboxes{position:relative;padding-right:2px;overflow-y:scroll}.ui-multiselect-checkboxes input[type="checkbox"]{top:0;margin:3px 0 0 -20px;float:left}.ui-multiselect-checkboxes label{display:block;padding:3px 1px;padding-left:26px;border:1px solid transparent;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ui-multiselect-checkboxes label input{position:relative;top:1px}.ui-multiselect-checkboxes li{clear:both;font-size:.92em}.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label{margin-bottom:2px;border-bottom:1px solid #dadce7;font-weight:600;text-align:center}.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label a{display:block;margin:1px 0;padding:3px;text-decoration:none}* html .ui-multiselect-checkboxes label{border:0 none}
+.ui-multiselect{padding:2px 0 2px 4px;text-align:left}.ui-multiselect span.ui-icon{float:right}.ui-multiselect-single .ui-multiselect-checkboxes input{position:absolute !important;top:auto !important;left:-9999px}.ui-multiselect-single .ui-multiselect-checkboxes label{padding:5px !important}.ui-multiselect-header{margin-bottom:3px;padding:3px}.ui-multiselect-header ul{font-size:.92em}.ui-multiselect-header ul li{padding:0 10px 0 0;float:left}.ui-multiselect-header a{text-decoration:none}.ui-multiselect-header a:hover{text-decoration:underline}.ui-multiselect-header span.ui-icon{float:left}.ui-multiselect-header li.ui-multiselect-close{padding-right:0;float:right;text-align:right}.ui-multiselect-menu{box-shadow:0 5px 8px -2px rgba(0,0,0,0.25),0 1px 2px rgba(0,0,0,0.3);display:none;position:absolute;z-index:10000;padding:3px;text-align:left}.ui-multiselect-checkboxes{position:relative;padding-right:2px;overflow-y:scroll}.ui-multiselect-checkboxes input[type="checkbox"]{top:0;margin:3px 0 0 -20px;float:left}.ui-multiselect-checkboxes label{display:block;padding:3px 1px;padding-left:26px;border:1px solid transparent;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ui-multiselect-checkboxes label input{position:relative;top:1px}.ui-multiselect-checkboxes li{clear:both;font-size:.92em}.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label{margin-bottom:2px;border-bottom:1px solid #dadce7;font-weight:600;text-align:center}.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label a{display:block;margin:1px 0;padding:3px;text-decoration:none}* html .ui-multiselect-checkboxes label{border:0 none}

plugins/redmine_backlogs/jquery/jquery.qtip.css

@@ -1 +1 @@
-.qtip{position:absolute;top:-31000px;left:-31000px;width:auto;max-width:500px;outline:none}.ui-tooltip-content{-webkit-box-shadow:0 5px 8px -2px rgba(0,0,0,0.25),0 1px 2px rgba(0,0,0,0.3);box-shadow:0 5px 8px -2px rgba(0,0,0,0.25),0 1px 2px rgba(0,0,0,0.3);position:relative;padding:10px;overflow:hidden;border:1px solid #d1d3e0;background-color:#fff;color:#3e425a;font-size:.92em;text-align:left;word-wrap:break-word}.ui-tooltip-tip{position:absolute;z-index:10;margin:0 auto;overflow:hidden;border:0 none;border-color:#d1d3e0;background:transparent;background-color:#fff}
+.qtip{position:absolute;top:-31000px;left:-31000px;width:auto;max-width:500px;outline:none}.ui-tooltip-content{box-shadow:0 5px 8px -2px rgba(0,0,0,0.25),0 1px 2px rgba(0,0,0,0.3);position:relative;padding:10px;overflow:hidden;border:1px solid #d1d3e0;background-color:#fff;color:#3e425a;font-size:.92em;text-align:left;word-wrap:break-word}.ui-tooltip-tip{position:absolute;z-index:10;margin:0 auto;overflow:hidden;border:0 none;border-color:#d1d3e0;background:transparent;background-color:#fff}

src/javascripts/modules/MenuCollapse.js

@@ -47,6 +47,7 @@ PurpleMine.MenuCollapse = (function () {
     }
 
     for (var menu in this.menus) {
+      // eslint-disable-next-line no-prototype-builtins
       if (this.menus.hasOwnProperty(menu) && this.menus[menu].$el.length > 0) {
         handleMenu(menu)
       }

src/javascripts/modules/RevisionGraph.js

@@ -52,6 +52,7 @@ PurpleMine.RevisionGraph = function (holder, commitsHash, graphSpace) {
   var revisionDotOverlay
 
   $.each(commits, function (index, commit) {
+    // eslint-disable-next-line no-prototype-builtins
     if (!commit.hasOwnProperty('space')) {
       commit.space = 0
     }
@@ -72,6 +73,7 @@ PurpleMine.RevisionGraph = function (holder, commitsHash, graphSpace) {
       parentCommit = commitsByScmid[parentScmid]
 
       if (parentCommit) {
+        // eslint-disable-next-line no-prototype-builtins
         if (!parentCommit.hasOwnProperty('space')) {
           parentCommit.space = 0
         }

src/sass/_variables.scss

@@ -481,13 +481,13 @@ $header-title-line-height:      $line-height-computed * 1.5 !default;
 
 $responsive-header-height:      54px !default;
 
-$flyout-menu-bg:                shade($header-bg, 800) !default;
+$flyout-menu-bg:                shade($header-bg, 700) !default;
 $flyout-menu-text:              $white !default;
 $flyout-menu-link:              $white !default;
-$flyout-menu-link-active-bg:    $header-bg !default;
+$flyout-menu-link-active-bg:    shade($header-bg, 50) !default;
-$flyout-menu-link-active:       $white !default;
+$flyout-menu-link-active:       $text-color !default;
-$flyout-menu-header-bg:         shade($header-bg, 900) !default;
+$flyout-menu-header-bg:         shade($header-bg, 800) !default;
-$flyout-menu-header-border:     shade($header-bg, 900) !default;
+$flyout-menu-header-border:     shade($header-bg, 800) !default;
 $flyout-menu-header-text:       $white !default;
 
 $quick-search-width:            200px !default;

src/sass/components/_buttons.scss

@@ -197,6 +197,7 @@ p.buttons {
     label {
       display: block;
       margin-bottom: $line-height-computed / 2;
+      line-height: initial;
     }
   }
 
@@ -238,6 +239,10 @@ a[data-expands],
   cursor: pointer;
   user-select: none;
   @include button-variant($btn-default-color, $btn-default-bg, $btn-default-border);
+
+  &.icon-only::before {
+    content: none;
+  }
 }
 
 a[data-expands] {
@@ -253,3 +258,8 @@ a[data-expands] {
     display: none;
   }
 }
+
+a.icon-toggle-minus[data-expands],
+select[multiple="multiple"] + .toggle-multiselect {
+  background-image: inline-svg("minus.svg", (path: (fill: $btn-default-icon-color)));
+}

src/sass/components/_content.scss

@@ -168,6 +168,8 @@
 
         @if $sidebar-position == "right" {
           margin-left: 3px;
+        } @else {
+          margin-right: 0;
         }
 
         li {
@@ -184,10 +186,6 @@
             margin-left: $sidebar-padding-horizontal / 2 + 3px;
           }
         }
-
-        @if $sidebar-position == "left" {
-          margin-right: 0;
-        }
       }
     }
   }
@@ -203,6 +201,110 @@
       margin-left: 0;
     }
   }
+
+  // For plugin https://github.com/ledsun/redmine_wiki_page_tree
+  div.page-tree {
+    margin: 0;
+    padding: 0;
+
+    .page-tree__title {
+      margin-left: 0;
+    }
+
+    .page-tree__list {
+      .page-tree__list {
+        margin-left: $sidebar-padding-horizontal + 3px;
+        border-left: 2px solid $gray-400;
+
+        @if $sidebar-position == "right" {
+          margin-left: 3px;
+        } @else {
+          margin-right: 0;
+        }
+
+        .page-tree__list {
+          margin-left: $sidebar-padding-horizontal / 2 + 3px;
+        }
+
+        summary {
+          padding-left: $sidebar-padding-horizontal + 8px;
+
+          @if $sidebar-position == "right" {
+            margin-left: 0;
+          }
+
+          &::before {
+            left: 6px;
+          }
+        }
+      }
+
+      li {
+        > a:not(.icon-only) {
+          padding-right: $sidebar-padding-horizontal / 2;
+          padding-left: $sidebar-padding-horizontal / 2;
+
+          @if $sidebar-position == "right" {
+            margin-left: 0;
+          }
+
+          &:hover {
+            text-decoration: underline;
+          }
+        }
+      }
+    }
+
+    details {
+      summary {
+        display: block;
+        position: relative;
+        padding: 0 $sidebar-padding-horizontal;
+        padding-left: $sidebar-padding-horizontal * 1.5 + 8px;
+
+        @if $sidebar-position == "left" {
+          border-radius: $border-radius-large 0 0 $border-radius-large;
+        } @else {
+          margin-left: -($sidebar-padding-horizontal);
+          border-radius: 0 $border-radius-large $border-radius-large 0;
+        }
+
+        &::-webkit-details-marker {
+          display: none;
+        }
+
+        &::before {
+          content: "";
+          position: absolute;
+          top: ($sidebar-padding-vertical + 1px) + ($line-height-computed - 16px) / 2;
+          left: $sidebar-padding-horizontal / 2 + 6px;
+          width: 16px;
+          height: 16px;
+          background-image: inline-svg("chevron-right.svg", (path: (fill: $btn-default-icon-color)));
+          background-repeat: no-repeat;
+        }
+
+        &:hover {
+          background-color: $sidebar-link-hover-bg;
+        }
+
+        a {
+          display: inline-block;
+          padding-top: ($sidebar-padding-vertical + 1px);
+          padding-bottom: ($sidebar-padding-vertical + 1px);
+
+          &:hover {
+            color: $sidebar-link-hover-text;
+            text-decoration: underline;
+          }
+        }
+      }
+
+      &[open] > summary::before {
+        transform: rotate(90deg);
+      }
+    }
+  }
 }
 
 #footer {

src/sass/components/_elements.scss

@@ -98,14 +98,30 @@ a.collapsible.collapsed,
 //
 
 .hidden-for-sighted {
-  position: absolute;
+  // stylelint-disable declaration-no-important
-  top: auto;
+  position: absolute !important;
-  left: -10000px;
+  top: auto !important;
-  width: 1px;
+  left: -10000px !important;
-  height: 1px;
+  width: 1px !important;
-  overflow: hidden;
+  height: 1px !important;
+  overflow: hidden !important;
+  // stylelint-enable declaration-no-important
 }
 
+img {
+  image-orientation: from-image;
+}
+
+.filecontent-container {
+  position: relative;
+  min-height: 200px;
+  margin-bottom: 20px;
+}
+.filecontent-container > .filecontent {
+  position: absolute;
+  max-width: 100%;
+  max-height: 100%;
+}
 
 //== Responsive autoscroll
 //
@@ -592,9 +608,9 @@ div#roadmap {
     }
   }
 
-  h2,
+  header > h3,
-  h3 {
+  h3.version {
-    display: inline;
+    margin-bottom: 0;
     padding-right: 0;
   }
 

src/sass/components/_forms.scss

@@ -7,6 +7,15 @@ form {
     padding: $table-condensed-cell-padding;
   }
 
+  fieldset {
+    > button,
+    > input,
+    > select {
+      margin-right: 5px;
+      margin-bottom: $line-height-computed / 2;
+    }
+  }
+
   label {
     line-height: $input-height-base;
     vertical-align: top;

src/sass/components/_icons.scss

@@ -426,6 +426,7 @@ div.projects h3 {
   &::before {
     width: 1em;
     margin-right: .5em;
+    transform: translateY(-.1em);
     color: $gray-700;
     text-align: center;
   }

src/sass/components/_issue.scss

@@ -670,6 +670,7 @@ span.private {
 
   div.changeset {
     margin-top: $line-height-computed / 2 + 2px * 2;
+    padding: 0;
     overflow: hidden;
     border: 1px solid $issue-border;
     border-radius: $panel-border-radius;

src/sass/components/_list.scss

@@ -50,13 +50,17 @@ table.list {
     }
 
     &.id,
+    &.issue_id,
+    &.legacy_id,
     &.parent,
     &.relations,
     &.tracker {
       width: 2%;
     }
 
-    &.id {
+    &.id,
+    &.issue_id,
+    &.legacy_id {
       font-weight: $font-weight-bold;
     }
 
@@ -81,10 +85,6 @@ table.list {
       }
     }
 
-    &.id {
-      text-align: right;
-    }
-
     &.activity,
     &.assigned_to,
     &.attachments,
@@ -108,6 +108,8 @@ table.list {
       text-align: left;
     }
 
+    &.id,
+    &.legacy_id,
     &.estimated_hours,
     &.float,
     &.int,
@@ -384,6 +386,8 @@ tr.entry {
 
 @if $color-trackers {
   tr.issue .id > a,
+  tr.issue .issue_id > a,
+  tr.issue .legacy_id > a,
   a.issue,
   .relations > span > a.issue,
   .parent > a.issue {
@@ -432,7 +436,8 @@ tr.entry {
     }
   }
 
-  tr.issue .id > a {
+  tr.issue .id > a,
+  tr.issue .legacy_id > a {
     display: block;
     padding: $tracker-list-padding;
 
@@ -442,6 +447,11 @@ tr.entry {
     }
   }
 
+  tr.issue .issue_id > a {
+    display: inline-block;
+    padding: $tracker-list-padding;
+  }
+
   @each $tracker-id, $tracker-colors in $tracker-colors-map {
     @include tracker(
       ".tracker-#{$tracker-id}",

src/sass/components/_progress.scss

@@ -60,8 +60,6 @@ p {
   }
 
   &.progress-info {
-    margin-top: -4px;
-    margin-bottom: 0;
     clear: left;
     color: $gray-700;
     font-size: 80%;

src/sass/components/_responsive.scss

@@ -44,11 +44,14 @@
         }
 
         .drdn-trigger {
+          @include text-overflow;
           display: block;
           height: $responsive-header-height;
           padding: 0;
           background-color: transparent;
           box-shadow: none;
+          font-size: $font-size-large;
+          font-weight: $font-weight-normal;
           line-height: $responsive-header-height;
 
           &::before {
@@ -70,6 +73,7 @@
 
         .drdn-content {
           top: $responsive-header-height;
+          font-size: $font-size-base;
         }
       }
     }
@@ -88,6 +92,10 @@
       background-color: $flyout-menu-bg;
       color: $flyout-menu-text;
 
+      .search-magnifier {
+        left: 18px;
+      }
+
       &__search {
         height: $responsive-header-height;
         padding: ($padding-side / 2);
@@ -99,11 +107,27 @@
         }
       }
 
+      &__avatar {
+        img.gravatar {
+          top: 0;
+        }
+      }
+
       a {
         &,
         &:hover,
         &:focus {
           color: $flyout-menu-link;
+
+          &::before,
+          span {
+            color: inherit !important; // stylelint-disable-line declaration-no-important
+          }
+        }
+
+        &.selected {
+          background-color: $flyout-menu-link-active-bg;
+          color: $flyout-menu-link-active;
         }
       }
 
@@ -118,20 +142,44 @@
         a {
           background-position: 8px center;
 
-          &,
+          &.additionals {
-          &:hover,
+            padding-left: 32px !important; // stylelint-disable-line declaration-no-important
-          &:focus {
+
             &::before {
-              color: $flyout-menu-link;
+              margin-right: $padding-small-vertical;
+              font-size: $fa-font-size-base;
+            }
+          }
         }
       }
 
-          &.selected {
+      #watchers {
-            background-color: $body-bg;
+        .contextual {
-            color: $text-color;
+          padding-top: $line-height-computed / 2;
+          padding-bottom: $line-height-computed / 2;
+        }
 
-            &::before {
+        .watchers {
-              color: $text-color;
+          li {
+            margin: ($line-height-computed / 2) 0 0;
+            padding: 0;
+
+            img.gravatar {
+              top: 0;
+            }
+
+            a {
+              height: auto;
+              border-top: 0;
+              line-height: initial;
+            }
+
+            .delete {
+              flex: 0 0 24px;
+              margin-left: auto;
+              float: none;
+              text-align: center;
+              text-overflow: initial;
             }
           }
         }
@@ -228,8 +276,25 @@
 
       label {
         display: inline-block;
+
+        input[type="checkbox"],
+        input[type="radio"] {
+          margin-top: $check-input-margin-btn-v;
         }
       }
+    }
+
+    #content > .contextual > span {
+      margin-bottom: 0;
+    }
+
+    #content > .contextual > a,
+    #content > .contextual .drdn,
+    p.buttons a {
+      display: inline-block;
+      margin: 0 2px 5px 0;
+      float: none;
+    }
 
     // For Redmine 4.0+
     #content > .contextual .drdn {
@@ -243,6 +308,8 @@
       .drdn-items {
         a {
           margin: 3px 0 0;
+          padding-top: $btn-padding-vertical;
+          padding-bottom: $btn-padding-vertical;
 
           &:first-child {
             margin-top: 0;
@@ -265,5 +332,35 @@
         float: none;
       }
     }
+
+    #issue-changesets {
+      div.changeset {
+        padding: 0;
+      }
+    }
+
+    #admin-index > #admin-menu li {
+      padding: 0;
+    }
+  }
+
+  // Tweaks for smartphones, touchscreens
+  @media (hover: none) and (pointer: coarse) {
+    .mobile-toggle-button::after {
+      margin-top: 0;
+    }
+
+    .query-columns {
+      span {
+        display: block;
+        margin-bottom: $line-height-computed / 2;
+      }
+
+      .buttons {
+        input[type="button"] {
+          display: inline-block;
+        }
+      }
+    }
   }
 }

src/sass/components/_simple-list.scss

@@ -105,10 +105,17 @@
   input,
   select {
     margin-right: 5px;
+    margin-bottom: $line-height-computed / 2;
   }
 
   label {
     @include check-inline;
+    line-height: $input-height-base;
+
+    input[type="checkbox"],
+    input[type="radio"] {
+      margin-top: $check-input-margin-btn-v;
+    }
   }
 
   p:last-child {

src/sass/mixins/_issues.scss

@@ -27,6 +27,7 @@
 
 @mixin tracker($parent, $background, $color) {
   tr#{$parent} .id > a,
+  tr#{$parent} .issue_id > a,
   a#{$parent},
   .relations > span > a#{$parent},
   .parent > a#{$parent} {