[solved] editing themes

Please post suggestions for improvement of Cinnamon here
https://github.com/linuxmint/Cinnamon
Post Reply
callmejoe
Level 2
Level 2
Posts: 85
Joined: Fri Mar 11, 2016 11:43 pm

[solved] editing themes

Post by callmejoe » Sun Apr 22, 2018 11:39 am

i'm on mInt 18.3, using mint-y dark theme. is there an easy way to increase the size of the min,max,close buttons on the window?

also, i know this isn't part of the theme, but the window scroll bars have always been too narrow for my liking. not sure if that is just the way it is in cinnamon or not. any quick setting exist to widen them?

thanks
Last edited by callmejoe on Thu Apr 26, 2018 4:16 pm, edited 1 time in total.

MinorThreat
Level 1
Level 1
Posts: 9
Joined: Wed May 17, 2017 7:56 pm

Re: editing themes

Post by MinorThreat » Sun Apr 22, 2018 12:28 pm

I just started to tweak this theme as well and have been following this guide http://www.dedoimedo.com/computers/gnom ... theme.html. I'm not sure about the buttons yet, but -GtkRange-slider-width: 13; controls the width of the scroll bar. I'm new at this, so there might be an easier way to do this; so far it's been trial and error.

User avatar
roblm
Level 9
Level 9
Posts: 2703
Joined: Sun Feb 24, 2013 2:41 pm

Re: editing themes

Post by roblm » Mon Apr 23, 2018 2:05 pm

callmejoe wrote:i'm on mInt 18.3, using mint-y dark theme. is there an easy way to increase the size of the min,max,close buttons on the window?
I agree that those buttons are ridiculously small. Also, a gray color is being used more often instead of black. To the Linux developers that are involved in this design, I would say this: just wait until you start experiencing failing vision as you grow older.

Here is one solution. The icons used for the close, maximize and minimize buttons in the Mint-Y-Dark theme are found in /usr/share/themes/Mint-Y-Dark/metacity-1, and are named close-icon.svg, max-icon.svg, and min-icon.svg. They are in the SVG graphics format (scalable vector graphics) and 16x16 pixels in size.

If you look at the close-icon in the picture below, the icon itself is 16x16 pixels but the image of the X is only 6x6 pixels. What is needed is a full 16x16 pixel X image.

close-icon-default.png
close-icon-default.png (4.29 KiB) Viewed 1210 times

If you look at the picture below, the 3 buttons on the left bar are the default buttons. The middle bar shows the custom buttons I created using GIMP and Inkscape. The bar on the right shows an optional maximize button using a plus sign:

min-max-close buttons-dark-2.png

First create 3 new 16x16 pixel icons in GIMP with the same names. Then open them in Inkscape and save them in the SVG format in the Pictures folder.

Open the File Manager, right click on the Pictures folder and select Open as Root. Select the 3 new icons and Copy them. Click File System in the column on the left side and go to /usr/share/themes/Mint-Y-Dark/metacity-1. Right click on the close-icon.svg, max-icon.svg, and min-icon.svg icons and rename them one at a time. For example, rename close-icon.svg to close-iconxxx.svg. Then paste the 3 new icons you previously copied. Close the File Manager and restart Cinnamon by pressing Alt+F2, then type the letter r and press ENTER.

You can download my custom icons from imgur, at this link: https://imgur.com/a/0uO0uRg

They are in the PNG format because Imgur won’t accept the SVG format. You will have to open them in Inkscape and save them as .svg files. Use this command in the Terminal to install Inkscape: sudo apt install inkscape.


EDITED:

After some more testing, the icons in PNG format don’t have to be converted to SVG format. You can just rename the icons with the .svg extension. The only apparent problems I’ve found so far is that you can’t left click on it, to see the icon. You have to right click on it and select Open With > GIMP. You also won’t be able to access the pixel size or the actual graphics format info when the icon is right clicked and Properties > Image is selected. Just the file size.

There is an advantage of just renaming the icons. When Inkscape converts the icon format, often the pixel size of the icon is increased by 4 pixels, which is not good in this situation. I’m still not sure why this doesn’t happen all the time. Going above 16 pixels will prevent all of the icon from being displayed and it looks like some of the top and bottom were cut off. Inkscape can scale the icons back to the correct size but it’s not as easy to do as using GIMP. I don’t think most users want this added complexity.

callmejoe
Level 2
Level 2
Posts: 85
Joined: Fri Mar 11, 2016 11:43 pm

Re: editing themes

Post by callmejoe » Wed Apr 25, 2018 8:48 pm

roblm wrote:
Mon Apr 23, 2018 2:05 pm

I agree that those buttons are ridiculously small. Also, a gray color is being used more often instead of black. To the Linux developers that are involved in this design, I would say this: just wait until you start experiencing failing vision as you grow older.
wow that is impressive how you figured out all that. i guess there really is no easy way to change them like i thought there would be.

User avatar
smurphos
Level 7
Level 7
Posts: 1587
Joined: Fri Sep 05, 2014 12:18 am
Location: Britisher...

Re: editing themes

Post by smurphos » Thu Apr 26, 2018 1:34 am

I guess the easy way is to just choose a different Metacity-1 theme (Window Borders). One of the best features of Cinnamon theming is you can mix and match in this way.
Of the defaults available Atlanta has got nice big buttons - it colorises based on the GTK (Controls) theme. If it doesn't look right when first selected hit Ctrl-Alt-Del to restart cinnamon.

User avatar
catweazel
Level 17
Level 17
Posts: 7490
Joined: Fri Oct 12, 2012 9:44 pm
Location: Australian Antarctic Territory

Re: editing themes

Post by catweazel » Thu Apr 26, 2018 2:45 am

roblm wrote:
Mon Apr 23, 2018 2:05 pm
To the Linux developers that are involved in this design, I would say this: just wait until you start experiencing failing vision as you grow older.
Themes are like washing machines, dish washers and light fittings. Those that design them never install them.
¡uʍop ǝpısdn sı buıɥʇʎɹǝʌǝ os ɐıןɐɹʇsnɐ ɯoɹɟ ɯ,ı

User avatar
smurphos
Level 7
Level 7
Posts: 1587
Joined: Fri Sep 05, 2014 12:18 am
Location: Britisher...

Re: editing themes

Post by smurphos » Thu Apr 26, 2018 3:15 am

catweazel wrote:
Thu Apr 26, 2018 2:45 am
Themes are like washing machines, dish washers and light fittings. Those that design them never install them.
Objection! :)

One of my own themes is my daily driver....

User avatar
catweazel
Level 17
Level 17
Posts: 7490
Joined: Fri Oct 12, 2012 9:44 pm
Location: Australian Antarctic Territory

Re: editing themes

Post by catweazel » Thu Apr 26, 2018 3:33 am

smurphos wrote:
Thu Apr 26, 2018 3:15 am
catweazel wrote:
Thu Apr 26, 2018 2:45 am
Themes are like washing machines, dish washers and light fittings. Those that design them never install them.
Objection! :)

One of my own themes is my daily driver....
:lol:
¡uʍop ǝpısdn sı buıɥʇʎɹǝʌǝ os ɐıןɐɹʇsnɐ ɯoɹɟ ɯ,ı

callmejoe
Level 2
Level 2
Posts: 85
Joined: Fri Mar 11, 2016 11:43 pm

Re: editing themes

Post by callmejoe » Thu Apr 26, 2018 4:15 pm

smurphos wrote:
Thu Apr 26, 2018 1:34 am
I guess the easy way is to just choose a different Metacity-1 theme (Window Borders). One of the best features of Cinnamon theming is you can mix and match in this way.
Of the defaults available Atlanta has got nice big buttons - it colorises based on the GTK (Controls) theme. If it doesn't look right when first selected hit Ctrl-Alt-Del to restart cinnamon.
you know i didnt even bother trying that. i was using the mint -y dark theme, so when i first looked at the window borders if it didnt say dark or look dark i didnt try it. but they all seem to conform to my dark theme.

simple enough. thanks!

User avatar
smurphos
Level 7
Level 7
Posts: 1587
Joined: Fri Sep 05, 2014 12:18 am
Location: Britisher...

Re: [solved] editing themes

Post by smurphos » Fri Apr 27, 2018 1:45 am

Yeah - you need to experiment with them. Some third party ones will be fixed colours, but most are set up to get colours from the GTK theme. Results can and will vary depending on the exact combination, but unless you have a ton of extra themes installed it doesn't take long to quickly run through them and see how they look with any particular GTK theme. High Contrast for window-borders is another big visible button theme that looks quite nice with Mint-Y-Dark and other dark themes. It's horrible on light themes.

Caltrop
Level 2
Level 2
Posts: 79
Joined: Mon Aug 07, 2017 12:00 pm

Re: editing themes

Post by Caltrop » Tue Jul 10, 2018 10:21 pm

been mucking about with this theme as well

I do not understand why this has to be so complicated

it is mind boggling all the directories & the /usr/share/themes/Mint-Y-Dark/gtk-3.0/gtk.css is nearly 4000 lines of code :o

I am also at a loss as to why there is not a gui theme editor/creator program :?
but hard-core linux users prefer the terminal & thousands of lines of code

one reason I quit the firefox browser
could not get the dark theme colors working right with firefox
or firefox working right with the dark theme

seems like ALL OS's do not like dark themes
never could get dark themes working with windows but here I am now in linux land

then there are the applications that just do not follow theme settings and do their own thang
the new virtualbox 5.2 is one

User avatar
smurphos
Level 7
Level 7
Posts: 1587
Joined: Fri Sep 05, 2014 12:18 am
Location: Britisher...

Re: editing themes

Post by smurphos » Tue Jul 10, 2018 11:21 pm

Caltrop wrote:
Tue Jul 10, 2018 10:21 pm
I am also at a loss as to why there is not a gui theme editor/creator program :?
Take a look here - viewtopic.php?f=211&t=252178&hilit=oomox
Caltrop wrote:
Tue Jul 10, 2018 10:21 pm
one reason I quit the firefox browser
could not get the dark theme colors working right with firefox
or firefox working right with the dark theme
Take a look here - viewtopic.php?f=18&t=266585&hilit=firefox
Caltrop wrote:
Tue Jul 10, 2018 10:21 pm
then there are the applications that just do not follow theme settings and do their own thang
the new virtualbox 5.2 is one
I'm pretty sure that for 18.x users it's because of the QT version VBOX 5.2 uses, On Mint 19 it respects the system theme.

Post Reply

Return to “Cinnamon”