Custom CSS/Theme for 1.2.8

[empiror]

As a new user, I really love the power and functionality of MantisBT, and the addition of timetracking is a great bonus feature. However, when introducing to colleagues the first impression is that the design is quite garish. I did a bit of work on the CSS using randallj's post as a good starting point. I have used CSS3 gradients, border radii and box shadows to soften the look and feel without the use of any background images (apart from randallj's search button). A few screenshots below demonstrate the changes and the needed files are in the zipped attachment.

I look forward to the theming ability that is rumoured for version 1.3, but in the meantime I hope this is useful for someone out there.

screen1.png (30.66 KiB) Viewed 54854 times

screen3.png (28.42 KiB) Viewed 54854 times

[atrol]

Thanks for your contribution.
I started to collect some information around this topic.
http://www.mantisbt.org/forums/viewtopi ... =4&t=20127

[empiror]

I have made a few further changes to the theme including the use of a few open source Google fonts (Oswald and Open Sans), an updated favicon, the addition of themed buttons and I applied internal borders to some of the tables. Again, all the necessary files are attached in a zip file.

screen1.jpg (116.74 KiB) Viewed 54825 times

screen2.jpg (133.62 KiB) Viewed 54825 times

[atrol]

Nice look.

I want to write some warnings for users who don't know what is affected by the changes.

You are not longer able to run MantisBT in a pure intranet scenario.
Connection to internet is mandatory when using the changed html_api.php.

Whenever updating MantisBT to a version > 1.2.8 do not copy the attached files over the ones which were delivered by MantisBT.
You have to apply the changes to the newer versions that come with MantisBT.
If you use the attached files after updating you might not get all bug fixes and enhancements.
Maybe you will get issues because something in MantisBT has been changed which is not compatible with the changes in the attached files.

[mykbaker]

Wow, this is really good! Can't the fonts be downloaded from googleapis.com and included directly? As long as the link can be broken to an external site I say this should immediately become the look for 1.2.x. Why wait for 1.3 to get something everyone wants?

[kelson]

What do you think about a plugin which swaps all the CSS attributes by using a javascript script ?
In my opinion, the bootstrap Twitter is the most efficient CSS framework, therefore I will use this one in my skinning plugin.

Let's me show you the result.

[dimasdwika]

Hi,

just wondering, how do you integrate with twitter bootstrap?

and which plugin is that? seems that's what I'm looking for.


Cheers,

[lukesky333]

@kelson:

could you tell me, which style/theme/css you are using on this image? its very cool and i want to use it too (if possible).

thanks,
~lukesky

[goeck]

Hey,

just installed Mantis, coming from Traq and TheBugGenie. Now I found the bootstrap theme... I can't download it, Links is broken. Could somebody supply it somewhere else? I really want this UI!

Thanks in advance.

Cheers
Stefan

[kelson]

Sorry everyone who has downloaded it.
I didn't verify if everything was OK in the plugin.

I am back at my office, so, here are the correct plugins.

[Louisvdw]

I updated the custom theme from the opening post to include all the changes from the latest MantisBT release (V1.2.15)

[jolienai]

Hi kelson,
I use version 1.2.15 and how do I use the theme?

[dharmalingam]

Themes not working. Do you have any other themes.

[dharmalingam]

i need Theme for mantis 1.2.17

[maximkletsov]

What do you think about a plugin which swaps all the CSS attributes by using a javascript script ?
In my opinion, the bootstrap Twitter is the most efficient CSS framework, therefore I will use this one in my skinning plugin.

Let's me show you the result.

Hi there!
I really appreciate your work.
What about to make a new skin based on new version of bootstrap?
Looking forward to it!