Changing the theme colors

All Gurus once were Newbies
Forum rules
There are no such things as "stupid" questions. However if you think your question is a bit stupid, then this is the right place for you to post it. Please stick to easy to-the-point questions that you feel people can answer fast. For long and complicated questions prefer the other forums within the support section.
Before you post please read this

Changing the theme colors

Postby efest on Sat Nov 02, 2013 3:18 pm

I wonder if it is possible to change the theme colors?
I chose the theme ambiance minty, but just wanted to change the shadow color (orange to another color)!

Attached is a picture of what I want to change!
http://s22.postimg.org/sdpwwq8sx/Captur ... _06_47.png

I have Linux Mint 15 Olivia (Cinnamon)
efest
Level 1
Level 1
 
Posts: 4
Joined: Sat Nov 02, 2013 3:15 pm

Linux Mint is funded by ads and donations.
 

Re: Changing the theme colors

Postby kyphi on Sat Nov 02, 2013 6:27 pm

It is a css (cascading style sheet) file that you have to alter in order to change the highlighter colour. In your Home directory, press Ctrl+h to make your hidden files visible and locate the file .themes. Within you will find the stylesheet file that governs the behaviour and colours of the theme. Use the GIMP program to identify the colour. Locate the appropriate entry in the stylesheet and change to suit. Save before exit.

I suggest that before you start making any alterations that you save a copy of the theme so that you can restore it if things go awry. Good Luck!
kyphi
Level 5
Level 5
 
Posts: 570
Joined: Sat Jul 09, 2011 1:14 am
Location: Australia

Re: Changing the theme colors

Postby efest on Sat Nov 02, 2013 6:55 pm

that is the file "cinnamon.css or gdm.css" ?

anyone know where to change?
efest
Level 1
Level 1
 
Posts: 4
Joined: Sat Nov 02, 2013 3:15 pm

Re: Changing the theme colors

Postby efest on Tue Nov 05, 2013 9:44 am

can someone help me?
efest
Level 1
Level 1
 
Posts: 4
Joined: Sat Nov 02, 2013 3:15 pm

Re: Changing the theme colors

Postby caribriz on Tue Nov 05, 2013 11:56 pm

Hi efest,

I'm experimenting with themes myself (I'm no expert) - this is just what I did - try it if you like.

As kyphi has said, it's a good idea to work on a copy of the theme ...

Go to /home/your-user-name/.themes (click View > Show hidden files)
Click Ambiance Minty folder
Click Edit > Copy
Click Edit > Paste
Rename copy Ambiance-Minty-2

Open Ambiance-Minty-2 > cinnamon > cinnamon.css
Scroll down the file a little way to the section

Code: Select all
StScrollBar StButton#vhandle:hover
{
    background-gradient-direction: vertical;
    background-gradient-start:#f58254;
    background-gradient-end: #ea703f;
    box-shadow: inset 0px 1px 3px 0px rgba(0,0,0,0.3);
    border: 1px solid rgba(95,110,75,0.2);
}


Those are the colors you want to change throughout the file
#f58254 (light orange color)
#ea703f (darker orange color)

I changed it to blue, so used
#648fb3 for the lighter color
#446bae for the darker color
(Of course, change these to your choice.)

Click Search > Replace

In Search for: field, enter
#f58254

In Replace with:
#648fb3

Click Replace All

Do the same for the next color:
Search for: #ea703f
Replace with: #446bae
Click Replace All

Save the file > Close

Go to System Settings > Themes > choose Ambiance-Minty-2 > Apply theme

This should replace most of the orange color you wanted to replace in the theme.

LM15 Cinnamon Ambiance Minty edited.png


It doesn't change the color of the hot corner "ripple" or of the arrows (when you hover on them) in the calendar.
If you wanted to go further and change them, you would have to edit the image files in ~/.themes/Ambiance-Minty-2/cinnamon, in gimp.

Again, this is what I did - there may well be an easier way :lol:

Right-click corner-ripple-ltr.png > Open with GIMP Image Editor
Render Scalable Vector Graphics window opens, just click ok (don't know why this happens - it's a .png file ?, but anyway ...)
In the menubar, click Colors > Colourise ...

For my example, I moved the Hue slider from 180 to 209
Click ok
Click File > Overwrite corner-ripple-ltr.png > Close the file > click Close without Saving

Do the same steps for other image - corner-ripple-rtl.png

Restart cinnamon (press Alt+F2, press r, press enter) or logout/in to see the change in hot corner.

For the arrows in the calendar (hover), so you also need to do similar for the images:
calendar-arrow-left-hover.svg and calendar-arrow-right-hover.svg

Right-click calendar-arrow-left-hover.svg > click Open with > GIMP Image Editor
(note: these files should open with the Render Scalable Vector Graphics window as they are .svg files but they don't ????)
Again, click Colors > Colorise ... change Hue to 209
Click ok

This time (because GIMP can't save .svg files you need to do a workaround) -
click File > Export to (should already be in folder ~/.themes/Ambiance-Minty-2/cinnamon)
in Name: change end of name from .svg to .png so it reads
calendar-arrow-left-hover.png
click Export > again click Export
click Close > click Close without saving

Do the same steps with image: calendar-arrow-right-hover.svg

Close GIMP

Go back to ~/.themes/Ambiance-Minty-2/cinnamon
Rename the images:
calendar-arrow-left-hover.svg to calendar-arrow-left-hover-old.svg
and
calendar-arrow-right-hover.svg to calendar-arrow-right-hover-old.svg

Then, rename
calendar-arrow-left-hover.png to calendar-arrow-left-hover.svg
and
calendar-arrow-right-hover.png to calendar-arrow-right-hover.svg

It's a messy workaround, but the image names have to correspond to what's in the file cinnamon.css.

Restart cinnamon to see the changes.

If there are any more colors you want to change - you'll have to find and alter them similarly - that's all I changed.

EDIT: Note that the above is specific to the Ambiance Minty theme - other themes may be different.
Image
Desktop: C2D E6400 / Asus P5LD2SE / 2GB ram / Asus GeForce 210 / 320GB (WinXP) & 1TB (Mint - various)
Laptop: Asus A53E-SX1455V - i5 2450M / 4GB ram / Intel HD 3000 / 500GB (Win7/Mint 13 Cinnamon)
caribriz
Level 5
Level 5
 
Posts: 786
Joined: Mon Nov 28, 2011 7:43 am

Re: Changing the theme colors

Postby choochooal on Fri Dec 13, 2013 1:10 pm

Great ideas. I'm running mint 16 Cinnamon with Ambiance Minty and have found the items I'm looking for but am having issues with the desktop icon colors. Not so much the white normal display but when you try to edit the desktop icon text, it turns black in a transparent box. So if you have a dark wallpaper its impossible. Goes along with when you hover over panel items, the description pops up in black on transparent.

I've fixed the translucent to opaque in panel and menu and a few other minor issues, but these two items elude me. Any ideas.
choochooal
Level 1
Level 1
 
Posts: 5
Joined: Tue Jun 28, 2011 7:54 pm

Re: Changing the theme colors

Postby caribriz on Sat Dec 14, 2013 1:23 am

choochooal wrote:Great ideas. I'm running mint 16 Cinnamon with Ambiance Minty and have found the items I'm looking for but am having issues with the desktop icon colors. Not so much the white normal display but when you try to edit the desktop icon text, it turns black in a transparent box. So if you have a dark wallpaper its impossible. Goes along with when you hover over panel items, the description pops up in black on transparent.

I've fixed the translucent to opaque in panel and menu and a few other minor issues, but these two items elude me. Any ideas.


Hi choochooal - I've responded to this in your other thread:
http://forums.linuxmint.com/viewtopic.php?f=90&t=152878&p=795828#p795815
Image
Desktop: C2D E6400 / Asus P5LD2SE / 2GB ram / Asus GeForce 210 / 320GB (WinXP) & 1TB (Mint - various)
Laptop: Asus A53E-SX1455V - i5 2450M / 4GB ram / Intel HD 3000 / 500GB (Win7/Mint 13 Cinnamon)
caribriz
Level 5
Level 5
 
Posts: 786
Joined: Mon Nov 28, 2011 7:43 am

Linux Mint is funded by ads and donations.
 

Return to Newbie Questions

Who is online

Users browsing this forum: Google Adsense [Bot], polarvortex and 48 guests