Merge pull request #15 from camalot/develop

- added gear icon. added range of images for search image.
- added min file to zip. Added lint check. updated readme.
- fixed the popup notification when building. 
- fixed the build image in the menu
- fixed the pulse of 'even rows'
- Merge branch 'develop' into topic/separation	
- Merge pull request #14 from camalot/topic/separation
- Merge branch 'master' into develop

README.md

@@ -1,5 +1,9 @@
 # jenkins-dark [![Build status](https://ci.appveyor.com/api/projects/status/14lnufroy4v83xjk?svg=true)](https://ci.appveyor.com/project/camalot/jenkins-dark-stylish)
-A stylish for Jenkins to give a dark theme
+A stylish for Jenkins to give a dark theme.
+
+```
+NOTE: This has not been tested with Jenkins 2.x.
+```
 
 You will need to add the domains that you want this to apply to yourself.
 

appveyor.yml

@@ -8,7 +8,9 @@ install:
 - cmd: npm install -g less
 - cmd: npm install -g less-plugin-clean-css
 build_script:
-- cmd: lessc --no-color jenkins-dark.less ./dist/jenkins-dark.css
+- cmd: lessc --lint jenkins-dark.less
+- cmd: lessc jenkins-dark.less ./dist/jenkins-dark.css
+- cmd: lessc --clean-css jenkins-dark.less ./dist/jenkins-dark.min.css
 - ps: Compress-Archive -Path ${env:APPVEYOR_BUILD_FOLDER}/dist/*.css -DestinationPath ./dist/${env:APPVEYOR_PROJECT_NAME}-${env:APPVEYOR_BUILD_VERSION}.zip
 artifacts:
 - path: dist/jenkins-dark.css

jenkins-dark.less

@@ -188,7 +188,7 @@
         border: solid 1px @background-black;
         border-radius: 0;
         box-shadow: none;
-        background: #3a3a3a @search-box-image-24 3px center no-repeat !important;
+        background: #3a3a3a @search-image-16 3px center no-repeat !important;
         padding: 4px 3px 4px 25px !important;
         color: @text-light;
     }

parts/_dashboard.less

@@ -23,7 +23,7 @@ table#computers {
         vertical-align: middle;
       }
     }
-
+    &.stripped-odd tr:nth-child(even),
     &.stripped tr {
       &.job-status-red-anime,
       &.job-status-yellow-anime,

parts/_icons.less

@@ -46,6 +46,98 @@ img.icon-hourglass {
     }
   }
 }
+.icon-search {
+  &.icon-xlg {
+    content: @search-image-48;
+  }
+  &.icon-lg {
+    content: @search-image-32;
+  }
+  &.icon-md {
+    content: @search-image-24;
+  }
+  &.icon-sm {
+    content: @search-image-16;
+  }
+}
+
+img[src$="search.png"] {
+  &[width="48"] {
+    content: @search-image-48;
+  }
+  &[width="32"] {
+    content: @search-image-32;
+  }
+  &[width="24"] {
+    content: @search-image-24;
+  }
+  &[width="16"] {
+    content: @search-image-16;
+  }
+}
+
+.icon-save {
+  &.icon-xlg {
+    content: @save-image-48;
+  }
+  &.icon-lg {
+    content: @save-image-32;
+  }
+  &.icon-md {
+    content: @save-image-24;
+  }
+  &.icon-sm {
+    content: @save-image-16;
+  }
+}
+img[src$="save.png"] {
+  &[width="48"] {
+    content: @save-image-48;
+  }
+  &[width="32"] {
+    content: @save-image-32;
+  }
+  &[width="24"] {
+    content: @save-image-24;
+  }
+  &[width="16"] {
+    content: @save-image-16;
+  }
+}
+
+.icon-clock-anime,
+.icon-clock {
+  &.icon-xlg {
+    content: @gear-image-48;
+  }
+  &.icon-lg {
+    content: @gear-image-32;
+  }
+  &.icon-md {
+    content: @gear-image-24;
+  }
+  &.icon-sm {
+    content: @gear-image-16;
+  }
+}
+img[src$="clock.png"] {
+  &[width="48"] {
+    content: @gear-image-48;
+  }
+  &[width="32"] {
+    content: @gear-image-32;
+  }
+  &[width="24"] {
+    content: @gear-image-24;
+  }
+  &[width="16"] {
+    content: @gear-image-16;
+  }
+}
+
+.icon-clock-anime {
+  .spinning-build-image();
+}
 
 img[src$="/images/atom.gif"] {
   .rss-image();
@@ -82,7 +174,6 @@ img[src$="/images/atom.gif"] {
 /* swap out the animation images for new ones */
 img.icon-yellow-anime {
   .spinning-build-image();
-  opacity: .8;
   &.icon-xlg {
     content: @spinner-yellow-image-48;
   }
@@ -97,8 +188,24 @@ img.icon-yellow-anime {
   }
 }
 
+img[src$="yellow_anime.gif"] {
+  vertical-align: text-top;
+  .spinning-build-image();
+  &[width="48"] {
+    content: @spinner-yellow-image-48;
+  }
+  &[width="32"] {
+    content: @spinner-yellow-image-32;
+  }
+  &[width="24"] {
+    content: @spinner-yellow-image-24;
+  }
+  &[width="16"] {
+    content: @spinner-yellow-image-16;
+  }
+}
+
 img.icon-yellow {
-  opacity: .8;
   &.icon-xlg {
     content: @yellow-image-48;
   }
@@ -112,10 +219,26 @@ img.icon-yellow {
     content: @yellow-image-16;
   }
 }
+
+img[src$="yellow.png"] {
+  vertical-align: text-top;
+  &[width="48"] {
+    content: @yellow-image-48;
+  }
+  &[width="32"] {
+    content: @yellow-image-32;
+  }
+  &[width="24"] {
+    content: @yellow-image-24;
+  }
+  &[width="16"] {
+    content: @yellow-image-16;
+  }
+}
+
 /* swap out the animation images for new ones */
 img.icon-blue-anime {
   .spinning-build-image();
-  opacity: .8;
   &.icon-xlg {
     content: @spinner-green-image-48;
   }
@@ -129,8 +252,24 @@ img.icon-blue-anime {
     content: @spinner-green-image-16;
   }
 }
+img[src$="blue_anime.gif"] {
+  vertical-align: text-top;
+  .spinning-build-image();
+  &[width="48"] {
+    content: @spinner-green-image-48;
+  }
+  &[width="32"] {
+    content: @spinner-green-image-32;
+  }
+  &[width="24"] {
+    content: @spinner-green-image-24;
+  }
+  &[width="16"] {
+    content: @spinner-green-image-16;
+  }
+}
+
 img.icon-blue {
-  opacity: .8;
   &.icon-xlg {
     content: @green-image-48;
   }
@@ -144,10 +283,24 @@ img.icon-blue {
     content: @green-image-16;
   }
 }
+img[src$="blue.png"] {
+  vertical-align: text-top;
+  &[width="48"] {
+    content: @green-image-48;
+  }
+  &[width="32"] {
+    content: @green-image-32;
+  }
+  &[width="24"] {
+    content: @green-image-24;
+  }
+  &[width="16"] {
+    content: @green-image-16;
+  }
+}
 /* swap out the animation images for new ones */
 img.icon-red-anime {
   .spinning-build-image();
-  opacity: .6;
   &.icon-xlg {
     content: @spinner-red-image-48;
   }
@@ -161,8 +314,23 @@ img.icon-red-anime {
     content: @spinner-red-image-16;
   }
 }
+img[src$="red_anime.gif"] {
+  vertical-align: text-top;
+  .spinning-build-image();
+  &[width="48"] {
+    content: @spinner-red-image-48;
+  }
+  &[width="32"] {
+    content: @spinner-red-image-32;
+  }
+  &[width="24"] {
+    content: @spinner-red-image-24;
+  }
+  &[width="16"] {
+    content: @spinner-red-image-16;
+  }
+}
 img.icon-red {
-  opacity: .8;
   &.icon-xlg {
     content: @red-image-48;
   }
@@ -176,12 +344,26 @@ img.icon-red {
     content: @red-image-16;
   }
 }
+img[src$="red.png"] {
+  vertical-align: text-top;
+  &[width="48"] {
+    content: @red-image-48;
+  }
+  &[width="32"] {
+    content: @red-image-32;
+  }
+  &[width="24"] {
+    content: @red-image-24;
+  }
+  &[width="16"] {
+    content: @red-image-16;
+  }
+}
 /* swap out the animation images for new ones */
 img {
   &.icon-grey-anime,
   &.icon-nobuilt-anime {
     .spinning-build-image();
-    opacity: .8;
     &.icon-xlg {
       content: @spinner-grey-image-48;
     }
@@ -196,10 +378,26 @@ img {
     }
   }
 }
+img[src$="nobuilt_anime.gif"]
+img[src$="grey_anime.gif"] {
+  vertical-align: text-top;
+  .spinning-build-image();
+  &[width="48"] {
+    content: @spinner-grey-image-48;
+  }
+  &[width="32"] {
+    content: @spinner-grey-image-32;
+  }
+  &[width="24"] {
+    content: @spinner-grey-image-24;
+  }
+  &[width="16"] {
+    content: @spinner-grey-image-16;
+  }
+}
 img {
   &.icon-grey,
   &.icon-nobuilt {
-    opacity: .8;
     &.icon-xlg {
       content: @grey-image-48;
     }
@@ -214,7 +412,22 @@ img {
     }
   }
 }
-
+img[src$="nobuilt.png"],
+img[src$="grey.png"] {
+  vertical-align: text-top;
+  &[width="48"] {
+    content: @grey-image-48;
+  }
+  &[width="32"] {
+    content: @grey-image-32;
+  }
+  &[width="24"] {
+    content: @grey-image-24;
+  }
+  &[width="16"] {
+    content: @grey-image-16;
+  }
+}
 // weather
 img.icon-health-00to19 {
   &.icon-xlg {
@@ -320,3 +533,8 @@ img[src$='/24x24/accept.png'] {
 img[src$='/48x48/accept.png'] {
   content: @success-image-48;
 }
+
+
+td > img {
+  vertical-align: middle !important;
+}

parts/_notifications.less

@@ -8,6 +8,28 @@ p.info {
   color: @text-light;
 }
 
+#hoverNotification {
+  background-color: darken(@background-light, 20%);
+  border: solid 1px darken(@background-light, 30%);
+  color: @text-light;
+}
+
+.call-to-action {
+  display: block;
+  text-align: center;
+  font-size: 1.6em;
+  background-color: @blue;
+  border: solid 1px darken(@blue,20%);
+  border-radius: 0;
+
+  a {
+    color: @text-dark;
+    font-weight: bold;
+    text-decoration: underline;
+    text-decoration-color: @text-dark;
+  }
+}
+
 .warning {
     border: solid 1px darken(@background-warning, 10%);
     margin: 5px 10px;