From 69c3ec119b0c3e0df707b3c8c07535ee352358b4 Mon Sep 17 00:00:00 2001 From: camalot Date: Fri, 27 May 2016 19:20:11 -0500 Subject: [PATCH 1/9] log the 'exceptions, but dont throw. git reports as exceptions for some reason --- appveyor.yml | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/appveyor.yml b/appveyor.yml index cbce801..a4794b2 100644 --- a/appveyor.yml +++ b/appveyor.yml @@ -130,6 +130,5 @@ after_deploy: & git push origin gh-pages; } } catch [Exception] { - "$_.Exception.GetType().FullName, $_.Exception.Message" | Write-Error; - throw; + "$_.Exception.GetType().FullName, $_.Exception.Message" | Write-Warning; } From c3d254ad71d2098cef3d5bcf24ca1ab39b964711 Mon Sep 17 00:00:00 2001 From: camalot Date: Sun, 29 May 2016 20:37:49 -0500 Subject: [PATCH 2/9] fixed some colors when running as plugin. had to set !important. Added some 2.x styles. --- README.md | 17 ++++++++++- jenkins-dark.less | 18 ++++++------ parts/_dialogs.less | 60 +++++++++++++++++++++++++++++++++++++++ parts/_notifications.less | 6 ++-- 4 files changed, 88 insertions(+), 13 deletions(-) create mode 100644 parts/_dialogs.less diff --git a/README.md b/README.md index 4730b25..0db2256 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,7 @@ A theme for Jenkins to give a dark look. ``` -NOTE: This has not been tested with Jenkins 2.x. +NOTE: Tested with both Jenkins version 1.6xx+ and 2.x ``` You will need to add the domains that you want this to apply to yourself if you use the Stylish plugin. @@ -15,6 +15,7 @@ You will need to add the domains that you want this to apply to yourself if you - Click `Configure System` and scroll to `Theme` section - Specify the URL of `http://camalot.github.io/jenkins-dark-stylish/jenkins-dark.min.css` for the CSS - Click `Save` +- Profit! ### Native Jenkins Plugin - Download the [latest release hpi file](https://github.com/camalot/jenkins-dark-stylish/releases/latest) @@ -41,6 +42,20 @@ _NOTE: these steps may be slightly different for FireFox version of Stylish_ - Add your domains that you want this to apply to - Profit! +### Install the plugin via chef and the jenkins-cookbook + +``` +jenkins_dark_theme_version = '1.0.105' +jenkins_dark_source = "https://github.com/camalot/jenkins-dark-stylish/releases/download/jenkins-dark-stylish-#{jenkins_dark_theme_version}/jenkins-dark-stylish-#{jenkins_dark_theme_version}.hpi" + +jenkins_plugin 'jenkins-dark-theme' do + action [:install] + source jenkins_dark_source +end +``` +- Profit! + + ## Screenshots ![Jenkins Menu](http://i.imgur.com/7nL7lLg.png) diff --git a/jenkins-dark.less b/jenkins-dark.less index 326f448..0aa84a4 100644 --- a/jenkins-dark.less +++ b/jenkins-dark.less @@ -12,8 +12,6 @@ @import url('./parts/_scrollbar.less'); #main-panel, -.bottom-sticker-inner, -.top-sticker-inner, body, html { background: @background-dark; @@ -41,7 +39,8 @@ a, a:link, a:visited { text-decoration: none; - color: @blue; + /* this is !important because there are places that it is set to black inline and no available selector. */ + color: @blue !important; outline: none; } .setting-input, @@ -73,10 +72,8 @@ footer { @import url( './parts/_notifications.less'); @import url( './parts/_wtf.less'); @import url( './parts/_code-editor.less'); -.bottom-sticker-edge { - /* hide the shadow on the bottom panel */ - display: none; -} +@import url('./parts/_dialogs.less'); + #menuSelector { -webkit-filter: invert(100%); } @@ -104,13 +101,16 @@ footer { } .section-header { margin: 5px; + margin-bottom: 5px; + margin-top: 5px; padding: 10px; + padding-bottom: 10px; font-size: 3em; background-color: @blue; color: @text-light; text-transform: uppercase; - border: none; - border-bottom: none; + border: none !important; + border-bottom: none !important; } @import url("./parts/_breadcrumbs.less"); @import url("./parts/_side-panel.less"); diff --git a/parts/_dialogs.less b/parts/_dialogs.less new file mode 100644 index 0000000..abeb78e --- /dev/null +++ b/parts/_dialogs.less @@ -0,0 +1,60 @@ +@import url( './_variables.less'); + + +.bottom-sticker-inner, +.top-sticker-inner { + background: @background-dark !important; + color: @text-light !important; + + border-radius: 0 !important; + border: 0 !important; +} + +#bottom-sticker { + left: 250px !important; + right: 0 !important; +} + +.bottom-sticker-edge { + /* hide the shadow on the bottom panel */ + display: none !important; +} + +#jenkins { + .jenkins-config { + background: @background-dark !important; + color: @text-light !important; + border: 0 !important; + table.config-table { + background: @background-dark !important; + color: @text-light !important; + } + } +} + + +.jenkins-config-widgets { + background: @background-dark !important; + border: 0 !important; + + .form-config.tabBarFrame { + border: 0 !important; + .tabBar { + + .tab { + border: 0; + border-bottom: solid lighten(@background-333,10%) 6px; + border-radius: 0 !important; + background-color: @background-333; + &:hover { + background-color: darken(@blue,10%); + border-bottom: solid darken(@blue,15%) 6px; + } + &.active { + background-color: @white; + border-bottom: solid @blue 6px; + } + } + } + } +} diff --git a/parts/_notifications.less b/parts/_notifications.less index 41e44ff..1da71b5 100644 --- a/parts/_notifications.less +++ b/parts/_notifications.less @@ -68,9 +68,9 @@ p.info { } .help { - border-color: @background-black; - background-color: @background-555; - color: @text-light; + border-color: @background-black !important; + background-color: @background-555 !important; + color: @text-light !important; padding-left: 56px; background-image: @help-image-48; background-repeat: no-repeat; From 19ddc191d11db05d7b8038ca667a36249b0c12cd Mon Sep 17 00:00:00 2001 From: camalot Date: Sun, 29 May 2016 20:57:40 -0500 Subject: [PATCH 3/9] fixed help sections in jenkins 2.x --- parts/_notifications.less | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/parts/_notifications.less b/parts/_notifications.less index 1da71b5..5ac018d 100644 --- a/parts/_notifications.less +++ b/parts/_notifications.less @@ -55,7 +55,7 @@ p.info { display: block; background-color: @background-error; color: @text-light; - background-image: @error-image-48; + background-image: @error-image-48 !important; min-height: 50px; vertical-align: middle; form { @@ -72,7 +72,7 @@ p.info { background-color: @background-555 !important; color: @text-light !important; padding-left: 56px; - background-image: @help-image-48; + background-image: @help-image-48 !important; background-repeat: no-repeat; background-position: 4px center; .from-plugin { From 058c1cf4aeb592a469d24eb96a16be06a233a039 Mon Sep 17 00:00:00 2001 From: camalot Date: Mon, 30 May 2016 10:16:03 -0500 Subject: [PATCH 4/9] trying to get the css to actually load in --- README.md | 4 ++-- .../com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly | 4 +++- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 0db2256..dc7868c 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,7 @@ A theme for Jenkins to give a dark look. ``` -NOTE: Tested with both Jenkins version 1.6xx+ and 2.x +NOTE: Tested with both Jenkins version 1.6xx+ and 2.x (some things on 2.x are not styled properly yet.) ``` You will need to add the domains that you want this to apply to yourself if you use the Stylish plugin. @@ -42,7 +42,7 @@ _NOTE: these steps may be slightly different for FireFox version of Stylish_ - Add your domains that you want this to apply to - Profit! -### Install the plugin via chef and the jenkins-cookbook +### Install the plugin via chef and the [jenkins-cookbook](https://supermarket.chef.io/cookbooks/jenkins) ``` jenkins_dark_theme_version = '1.0.105' diff --git a/plugin/src/main/resources/com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly b/plugin/src/main/resources/com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly index ece186c..09886f0 100644 --- a/plugin/src/main/resources/com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly +++ b/plugin/src/main/resources/com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly @@ -1,4 +1,6 @@ - + + + From d7a1b23c556017ba13bd7d090031940f3a879bcc Mon Sep 17 00:00:00 2001 From: camalot Date: Mon, 30 May 2016 16:44:51 -0500 Subject: [PATCH 5/9] reverted that change, it caused problems --- .../com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/plugin/src/main/resources/com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly b/plugin/src/main/resources/com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly index 09886f0..fcb2614 100644 --- a/plugin/src/main/resources/com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly +++ b/plugin/src/main/resources/com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly @@ -1,6 +1,4 @@ - - - + From 4057c8ad05328d6608f05c3f9a210c22768af383 Mon Sep 17 00:00:00 2001 From: camalot Date: Mon, 30 May 2016 16:53:16 -0500 Subject: [PATCH 6/9] try adding l:layout with l:header --- .../bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/plugin/src/main/resources/com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly b/plugin/src/main/resources/com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly index fcb2614..122b77b 100644 --- a/plugin/src/main/resources/com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly +++ b/plugin/src/main/resources/com/bit13/jenkins/JenkinsDarkThemeDecorator/header.jelly @@ -1,4 +1,8 @@ - + + + + + From fea61f6e19df4c0c870ea1d9b188efb054766487 Mon Sep 17 00:00:00 2001 From: camalot Date: Mon, 30 May 2016 17:42:07 -0500 Subject: [PATCH 7/9] setting some importance on items for 2.x --- jenkins-dark.less | 7 ++++--- parts/_dialogs.less | 3 ++- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/jenkins-dark.less b/jenkins-dark.less index 0aa84a4..551ea75 100644 --- a/jenkins-dark.less +++ b/jenkins-dark.less @@ -10,6 +10,7 @@ } @import url( './parts/_keyframes.less'); @import url('./parts/_scrollbar.less'); +@import url('./parts/_dialogs.less'); #main-panel, body, @@ -47,6 +48,7 @@ a:visited { input[type='password']:hover, input[type='text']:hover { border-color: #4183C4; + } .setting-input, input[type='password'], @@ -56,8 +58,8 @@ input[type='text'] { color: @text-light; background-color: #3a3a3a; outline: none; - padding: 6px 5px 4px; - border-radius: 0; + padding: 6px 5px 4px !important; + border-radius: 0 !important; box-shadow: none; } footer { @@ -72,7 +74,6 @@ footer { @import url( './parts/_notifications.less'); @import url( './parts/_wtf.less'); @import url( './parts/_code-editor.less'); -@import url('./parts/_dialogs.less'); #menuSelector { -webkit-filter: invert(100%); diff --git a/parts/_dialogs.less b/parts/_dialogs.less index abeb78e..cc05800 100644 --- a/parts/_dialogs.less +++ b/parts/_dialogs.less @@ -36,7 +36,8 @@ .jenkins-config-widgets { background: @background-dark !important; border: 0 !important; - + border-radius: 0 !important; + .form-config.tabBarFrame { border: 0 !important; .tabBar { From c0f17c13600da5612a6e345d8a73956e50cdf556 Mon Sep 17 00:00:00 2001 From: camalot Date: Tue, 31 May 2016 21:52:49 -0500 Subject: [PATCH 8/9] added style for disabled jobs --- parts/_dashboard.less | 12 ++++++++++++ parts/_icons.less | 3 +++ 2 files changed, 15 insertions(+) diff --git a/parts/_dashboard.less b/parts/_dashboard.less index b7c93d2..1191b9d 100644 --- a/parts/_dashboard.less +++ b/parts/_dashboard.less @@ -7,6 +7,7 @@ table#computers { } .dashboard { table#projectstatus { + .job-status-disabled, .job-status-red-anime, .job-status-yellow-anime, .job-status-green-anime, @@ -26,6 +27,17 @@ table#computers { vertical-align: middle; } } + + .job-status-disabled { + color: darken(@text-light,10%) !important; + text-decoration: line-through; + opacity: 0.5; + a { + color: darken(@text-light,10%) !important; + text-decoration: line-through; + } + } + &.stripped-odd tr:nth-child(even), &.stripped tr { &.job-status-red-anime, diff --git a/parts/_icons.less b/parts/_icons.less index 51d466d..9211048 100644 --- a/parts/_icons.less +++ b/parts/_icons.less @@ -405,6 +405,7 @@ img[src$="grey_anime.gif"] { img { &.icon-grey, &.icon-aborted, + &.icon-disabled, &.icon-nobuilt { &.icon-xlg { content: @grey-image-48; @@ -421,6 +422,7 @@ img { } } img[src$="aborted.png"], +img[src$="disabled.png"], img[src$="nobuilt.png"], img[src$="grey.png"] { vertical-align: text-top; @@ -437,6 +439,7 @@ img[src$="grey.png"] { content: @grey-image-16; } } + // weather img.icon-health-00to19 { &.icon-xlg { From 26a8aecaaa98a39f88f617a69c275f198a170437 Mon Sep 17 00:00:00 2001 From: camalot Date: Wed, 15 Jun 2016 21:51:50 -0500 Subject: [PATCH 9/9] added additional lookups for icons --- parts/_icons.less | 88 +++++++++++++++++++++++------------------------ 1 file changed, 44 insertions(+), 44 deletions(-) diff --git a/parts/_icons.less b/parts/_icons.less index 9211048..f592a94 100644 --- a/parts/_icons.less +++ b/parts/_icons.less @@ -66,16 +66,16 @@ img[src$="artifactory-icon.png"][height="16px"] { } img[src$="search.png"] { - &[width="48"] { + &[width="48"], &[src*="/48x48/"] { content: @search-image-48; } - &[width="32"] { + &[width="32"], &[src*="/32x32/"] { content: @search-image-32; } - &[width="24"] { + &[width="24"], &[src*="/24x24/"] { content: @search-image-24; } - &[width="16"] { + &[width="16"], &[src*="/16x16/"] { content: @search-image-16; } } @@ -95,16 +95,16 @@ img[src$="search.png"] { } } img[src$="save.png"] { - &[width="48"] { + &[width="48"], &[src*="/48x48/"] { content: @save-image-48; } - &[width="32"] { + &[width="32"], &[src*="/32x32/"] { content: @save-image-32; } - &[width="24"] { + &[width="24"], &[src*="/24x24/"] { content: @save-image-24; } - &[width="16"] { + &[width="16"], &[src*="/16x16/"] { content: @save-image-16; } } @@ -125,16 +125,16 @@ img[src$="save.png"] { } } img[src$="clock.png"] { - &[width="48"] { + &[width="48"], &[src*="/48x48/"] { content: @gear-image-48; } - &[width="32"] { + &[width="32"], &[src*="/32x32/"] { content: @gear-image-32; } - &[width="24"] { + &[width="24"], &[src*="/24x24/"] { content: @gear-image-24; } - &[width="16"] { + &[width="16"], &[src*="/16x16/"] { content: @gear-image-16; } } @@ -196,16 +196,16 @@ img.icon-yellow-anime { img[src$="yellow_anime.gif"] { vertical-align: text-top; .spinning-build-image(); - &[width="48"] { + &[width="48"], &[src*="/48x48/"] { content: @spinner-yellow-image-48; } - &[width="32"] { + &[width="32"], &[src*="/32x32/"] { content: @spinner-yellow-image-32; } - &[width="24"] { + &[width="24"], &[src*="/24x24/"] { content: @spinner-yellow-image-24; } - &[width="16"] { + &[width="16"], &[src*="/16x16/"] { content: @spinner-yellow-image-16; } } @@ -227,16 +227,16 @@ img.icon-yellow { img[src$="yellow.png"] { vertical-align: text-top; - &[width="48"] { + &[width="48"], &[src*="/16x16/"] { content: @yellow-image-48; } - &[width="32"] { + &[width="32"], &[src*="/32x32/"] { content: @yellow-image-32; } - &[width="24"] { + &[width="24"], &[src*="/24x24/"] { content: @yellow-image-24; } - &[width="16"] { + &[width="16"], &[src*="/16x16/"] { content: @yellow-image-16; } } @@ -260,16 +260,16 @@ img.icon-blue-anime { img[src$="blue_anime.gif"] { vertical-align: text-top; .spinning-build-image(); - &[width="48"] { + &[width="48"], &[src*="/48x48/"] { content: @spinner-green-image-48; } - &[width="32"] { + &[width="32"], &[src*="/32x32/"] { content: @spinner-green-image-32; } - &[width="24"] { + &[width="24"], &[src*="/24x24/"] { content: @spinner-green-image-24; } - &[width="16"] { + &[width="16"], &[src*="/16x16/"] { content: @spinner-green-image-16; } } @@ -290,16 +290,16 @@ img.icon-blue { } img[src$="blue.png"] { vertical-align: text-top; - &[width="48"] { + &[width="48"], &[src*="/48x48/"] { content: @green-image-48; } - &[width="32"] { + &[width="32"], &[src*="/32x32/"] { content: @green-image-32; } - &[width="24"] { + &[width="24"], &[src*="/24x24/"] { content: @green-image-24; } - &[width="16"] { + &[width="16"], &[src*="/16x16/"] { content: @green-image-16; } } @@ -322,16 +322,16 @@ img.icon-red-anime { img[src$="red_anime.gif"] { vertical-align: text-top; .spinning-build-image(); - &[width="48"] { + &[width="48"], &[src*="/48x48/"] { content: @spinner-red-image-48; } - &[width="32"] { + &[width="32"], &[src*="/32x32/"] { content: @spinner-red-image-32; } - &[width="24"] { + &[width="24"], &[src*="/24x24/"] { content: @spinner-red-image-24; } - &[width="16"] { + &[width="16"], &[src*="/16x16/"] { content: @spinner-red-image-16; } } @@ -351,16 +351,16 @@ img.icon-red { } img[src$="red.png"] { vertical-align: text-top; - &[width="48"] { + &[width="48"], &[src*="/48x48/"] { content: @red-image-48; } - &[width="32"] { + &[width="32"], &[src*="/32x32/"] { content: @red-image-32; } - &[width="24"] { + &[width="24"], &[src*="/24x24/"] { content: @red-image-24; } - &[width="16"] { + &[width="16"], &[src*="/16x16/"] { content: @red-image-16; } } @@ -389,16 +389,16 @@ img[src$="nobuilt_anime.gif"], img[src$="grey_anime.gif"] { vertical-align: text-top; .spinning-build-image(); - &[width="48"] { + &[width="48"], &[src*="/48x48/"] { content: @spinner-grey-image-48; } - &[width="32"] { + &[width="32"], &[src*="/32x32/"] { content: @spinner-grey-image-32; } - &[width="24"] { + &[width="24"], &[src*="/24x24/"] { content: @spinner-grey-image-24; } - &[width="16"] { + &[width="16"], &[src*="/16x16/"] { content: @spinner-grey-image-16; } } @@ -426,16 +426,16 @@ img[src$="disabled.png"], img[src$="nobuilt.png"], img[src$="grey.png"] { vertical-align: text-top; - &[width="48"] { + &[width="48"], &[src*="/48x48/"] { content: @grey-image-48; } - &[width="32"] { + &[width="32"], &[src*="/32x32/"] { content: @grey-image-32; } - &[width="24"] { + &[width="24"], &[src*="/24x24/"] { content: @grey-image-24; } - &[width="16"] { + &[width="16"], &[src*="/16x16/"] { content: @grey-image-16; } }