[SOLVED] Editing window border themes

Style your desktop
Forum rules
Before you post read how to get help. Topics in this forum are automatically closed 6 months after creation.
Locked
dollyp
Level 3
Level 3
Posts: 139
Joined: Sun Jul 24, 2011 4:50 pm

[SOLVED] Editing window border themes

Post by dollyp »

I am currently using the Jade-1-blue window border theme, which I got with a whole selection of old ones from this forum some time ago.

I am happy with the window border theme except for the top bar, which is the same colour for both active and inactive windows. I've tried looking through all the files in the Cinnamon directory within the theme but have been unable to locate any entries for this. Could someone with more knowledge than me point me in the right direction where these colour definitions are stored?

Many thanks
David
Last edited by LockBot on Wed Dec 28, 2022 7:16 am, edited 2 times in total.
Reason: Topic automatically closed 6 months after creation. New replies are no longer allowed.
User avatar
sebastjava
Level 5
Level 5
Posts: 709
Joined: Wed Jun 28, 2017 8:01 pm
Location: Montréal, Québec, Canada
Contact:

Re: Editing window border themes

Post by sebastjava »

As far as i know, the window borders are not in the cinnamon/ directory. The file you need to edit is: ~/.themes/Jade-1-Blue/metacity-1/metacity-theme-3.xml

I did some tests —and succeeded— but it was far more complex than expected.

Primo, there are gradients there, so i had to quickly and approximately pick 3 different shades of blue:

Code: Select all

#0080CC #0069A8 #008FE5
This way, you could just search and replace these with your preferred values.

Secondo, i had troubles because there are lots of styles which were duplicates made this way: <include name="... So i had to copy-paste the complete definition in order to be able to change the color values.

SHORT STORY
I did it all, quickly. I checked this 30 seconds. There is quite possibly something i forgot somewhere. But it should be a good starting point, at least. In fact, it looks all right, at first sight.

This is from the most recent Jade-1-blue installed directly from the Spices available in Menu > Preferences > Themes > Add/Remove. I did quite a bunch of edits in ~/.themes/Jade-1-Blue/metacity-1/metacity-theme-3.xml. I am including a copy of this file here. Just replace this file with this edit and try it...

I couldn’t just copy the file here because it is too big, so here is my Google Drive Share:
https://drive.google.com/file/d/1mimLz- ... sp=sharing
If this looks scary, you could use Sublime text editor to check exactly what got changed...
The future Linux Mint Forums is here.
Self-Appointed Benevolent Designer on Linux Mint Cinnamon.
Image
User avatar
sebastjava
Level 5
Level 5
Posts: 709
Joined: Wed Jun 28, 2017 8:01 pm
Location: Montréal, Québec, Canada
Contact:

Re: Editing window border themes

Post by sebastjava »

I guess my preceding post is quite messy, hard to understand. I will try to describe my method so you can do this all by yourself, or check on my file sent on this preceding post.
  • Install the latest version of Jade-1-blue directly from the Spices available in Menu > Preferences > Themes > Add/Remove.
  • Open ~/.themes/Jade-1-Blue/metacity-1/metacity-theme-3.xml
  • Search for all occurrences of #384248. Where this value is part of a "focused" element, change it to some blue color. And where this new blue color is part of a gradient, change the second color accordingly. Example:

    Code: Select all

    <draw_ops name="entire_background_focused">
      <gradient type="vertical" x="0" y="25" width="width" height="height/5">
        <color value="#384248" />
        <color value="#2d373d" />
      </gradient>
      <rectangle color="#2d373d" filled="true" x="0" y="height/5" width="width" height="height"/>
    </draw_ops>
    can be changed to:

    Code: Select all

    <draw_ops name="entire_background_focused">
      <gradient type="vertical" x="0" y="25" width="width" height="height/5">
        <color value="#0080CC" />
        <color value="#0069A8" />
      </gradient>
      <rectangle color="#0069A8" filled="true" x="0" y="height/5" width="width" height="height"/>
    </draw_ops>
  • Next, there is another kind of problem encountered from line 150. Some unfocused elements are defined as the same as the focused ones, like this:

    Code: Select all

    <draw_ops name="max_entire_background_unfocused">
    	<include name="max_entire_background_focused" />
    </draw_ops>
    So you will need to redefine them with a copy-paste from the source, this way:

    Code: Select all

    <draw_ops name="max_entire_background_unfocused">
    	<rectangle color="#384248" x="0" y="0" width="width" height="height" filled="true" />
    </draw_ops>
    You must copy-paste the entire definition. This example is just one line long, but it can be 2, 3, or 4 lines long. So now you can set different color values to differentiate those unfocused elements from the focused ones.
  • Note: you will also see some focused elements defined from some other focused elements, or some unfocused elements defined from some other unfocused elements. Leave these like that, you don’t have to care about these.
Hey, this is not as big as it may look. Based on searching for all #384248 occurrences, this editing stops before line 210. I don’t remember doing anything past this line. You quite possibly find this way too confusing. It would be so much more simple if i could just find a way to compare my edited metacity-theme-3.xml with the origin file and show you only the differences, but i failed in finding a good method for this. So i suggest you do this download from my GoogleDrive and try to compare lines 1 to 210...
The future Linux Mint Forums is here.
Self-Appointed Benevolent Designer on Linux Mint Cinnamon.
Image
dollyp
Level 3
Level 3
Posts: 139
Joined: Sun Jul 24, 2011 4:50 pm

Re: Editing window border themes

Post by dollyp »

Many thanks for your reply sebastjava. I would never have found that part to edit.

Today I have taken the easy way out and copied the file. It does EXACTLY what I wanted by creating the different colour for the active window. It gives me a starting point to refine the colours somewhat over the coming days and your comprehensive instructions will help.

Again, many thanks.
David

P.S. I noticed you've changed the bar text to centre. Great. That would probably have been my next question!
User avatar
sebastjava
Level 5
Level 5
Posts: 709
Joined: Wed Jun 28, 2017 8:01 pm
Location: Montréal, Québec, Canada
Contact:

Re: Editing window border themes

Post by sebastjava »

dollyp wrote: Wed Feb 17, 2021 11:34 am [...] P.S. I noticed you've changed the bar text to centre. Great. That would probably have been my next question!
I did not change this text alignment. I guess this improvement comes from downloading the latest Jade-1-blue from Mint Spices. I downloaded this latest version, made some edits, and then made it available to you.

Also, i noticed i forgot one little detail: this thin grey line on top of some focused windows. It is slightly annoying. I think this comes from line color="#546060". You could try to search and replace all these and change it to some appropriate blue tone for all the focused elements, leaving the unfocused ones untouched.

EDIT: i checked this. Tested. You only have to change line 121 in Jade-1-Blue/metacity-1/metacity-theme-3.xml

For all these kinds of edits, you should use a simple text editor like Xed. Avoid any big word processor like LibreOffice.
The future Linux Mint Forums is here.
Self-Appointed Benevolent Designer on Linux Mint Cinnamon.
Image
User avatar
sebastjava
Level 5
Level 5
Posts: 709
Joined: Wed Jun 28, 2017 8:01 pm
Location: Montréal, Québec, Canada
Contact:

Re: [SOLVED] Editing window border themes

Post by sebastjava »

EDIT: i was talking about some line color="#212121" but now i checked and tested it: the value to search and replace is #546060. And that’s only on line 121, leaving the unfocused one unchanged.
The future Linux Mint Forums is here.
Self-Appointed Benevolent Designer on Linux Mint Cinnamon.
Image
Locked

Return to “Themes, Icons & Wallpaper”