Skip to content

Jorg3Lucas/jenkins-modern-themes

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

image

Beautify your Jenkins with the Material Design theme!

Website: https://jorg3lucas.github.io/jenkins-modern-themes

So you love Jenkins but hate its ugly user interface and icons... Me too! Introducing Jenkins Modern Themes. You can turn your favorite frog CI tool into a handsome prince in few steps! Install this Jenkins Theme!

Features

  • Just one small css file (35K)
  • Embed minified SVG images
  • Multiple ways to install

Screenshots

Screenshot jenkins-modern-themes main Screenshot jenkins-modern-themes legend Screenshot jenkins-modern-themes console Screenshot jenkins-modern-themes history

Installation

Using this GitHub page (recommended) (auto-updated)

  1. Choose your color: image

  2. Replace {{your-color-name}} in the URL by the chosen color: https://raw.githack.com/Jorg3Lucas/jenkins-modern-themes/main/dist/modern-{{your-color-name}}.css

  3. Install Jenkins Simple Theme Plugin

  4. Click Manage Jenkins

  5. Click Configure System and scroll down to Theme

  6. Set the CSS field to the generated URL.

  7. Click Save

Using your Jenkins Hosting

  1. Follow the step 1 and 2 of the previous method

  2. Download the generated URL

  3. Upload the downloaded file to your web server

  4. Follow the steps 3 to 7 of the previous method using your uploaded file as URL in step 6

Using Stylish (only you will be able to see the awesome theme)

  1. Follow the step 1 and 2 of the previous method

  2. Copy the content of the file downloaded file

  3. Install the Stylish Chrome extension

  4. Go to Stylish options and click in Write new style

  5. Paste the theme css in the code box

  6. Click in Specify and set your jenkins domain

  7. Click in Save

  8. Go to your Jenkins website and enable the theme in the Stylish Chrome toolbar icon

Development

CSS file are minified and compressed with Grunt. If you have Node & yarn installed, you can build everything with:

yarn install
yarn test

This will generate the following file:

  • dist/modern-light.css

Compatibility

  • Jenkins 2.222 and above

If you are experiencing issues please let me know! Also, feel free to contribute!

Thanks to