LinuxQuestions.org
Help answer threads with 0 replies.
Go Back   LinuxQuestions.org > Blogs > linux-related notes
User Name
Password

Notices


Just annotations of little "how to's", so I know I can find how to do something I've already done when I need to do it again, in case I don't remember anymore, which is not unlikely. Hopefully they can be useful to others, but I can't guarantee that it will work, or that it won't even make things worse.
Rate this Entry

Copy-and-pasted "tweaks" to a GTK3 port of the "Mist" theme

Posted 07-13-2017 at 01:20 PM by the dsc
Updated 08-17-2017 at 05:32 PM by the dsc (code is closed with /code not /quote)

Nothing fancy, just some boxes and arrow(s) that were missing. I believe the port was this one:

https://github.com/mkoskar/gtk-theme-mist

The copy and pasted things were bits from the Albatross theme

https://www.gnome-look.org/content/s...content=123952
https://github.com/shimmerproject/Albatross

(Alongside with its "assets" folder linked within Mist's)

Both are GPL so I guess that's not illegal or anything...

So, I just copied these bits from Albatross' gtk-contained.css and added to Mist's widgets.css:

Code:
/**********************************************/



/*************************
 * Check and Radio items *
 *************************/
check,
treeview.check {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-unchecked.png"), url("assets/checkbox-unchecked@2.png")); }

.osd check {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-unchecked-dark.png"), url("assets/checkbox-unchecked-dark@2.png")); }

.view check:selected, iconview check:selected, .nautilus-window notebook check:selected,
.nautilus-window notebook > stack:not(:only-child) searchbar check:selected, .nemo-window notebook check:selected,
treeview.check:selected,
row:selected check,
infobar check {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-checkbox-unchecked.png"), url("assets/selected-checkbox-unchecked@2.png")); }

check:hover,
treeview.check:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-unchecked-hover.png"), url("assets/checkbox-unchecked-hover@2.png")); }

.osd check:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-unchecked-hover-dark.png"), url("assets/checkbox-unchecked-hover-dark@2.png")); }

.view check:hover:selected, iconview check:hover:selected, .nautilus-window notebook check:hover:selected, .nemo-window notebook check:hover:selected,
treeview.check:hover:selected,
row:selected check:hover,
infobar check:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-checkbox-unchecked-hover.png"), url("assets/selected-checkbox-unchecked-hover@2.png")); }

check:disabled,
treeview.check:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-unchecked-insensitive.png"), url("assets/checkbox-unchecked-insensitive@2.png")); }

.osd check:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-unchecked-insensitive-dark.png"), url("assets/checkbox-unchecked-insensitive-dark@2.png")); }

.view check:disabled:selected, iconview check:disabled:selected, .nautilus-window notebook check:disabled:selected, .nemo-window notebook check:disabled:selected,
treeview.check:disabled:selected,
row:selected check:disabled,
infobar check:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-checkbox-unchecked-insensitive.png"), url("assets/selected-checkbox-unchecked-insensitive@2.png")); }

check:indeterminate,
treeview.check:indeterminate {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-mixed.png"), url("assets/checkbox-mixed@2.png")); }

.osd check:indeterminate {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-mixed-dark.png"), url("assets/checkbox-mixed-dark@2.png")); }

.view check:indeterminate:selected, iconview check:indeterminate:selected, .nautilus-window notebook check:indeterminate:selected, .nemo-window notebook check:indeterminate:selected,
treeview.check:indeterminate:selected,
row:selected check:indeterminate,
infobar check:indeterminate {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-checkbox-mixed.png"), url("assets/selected-checkbox-mixed@2.png")); }

check:indeterminate:hover,
treeview.check:indeterminate:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-mixed-hover.png"), url("assets/checkbox-mixed-hover@2.png")); }

.osd check:indeterminate:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-mixed-hover-dark.png"), url("assets/checkbox-mixed-hover-dark@2.png")); }

.view check:indeterminate:hover:selected, iconview check:indeterminate:hover:selected, .nautilus-window notebook check:indeterminate:hover:selected, .nemo-window notebook check:indeterminate:hover:selected,
treeview.check:indeterminate:hover:selected,
row:selected check:indeterminate:hover,
infobar check:indeterminate:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-checkbox-mixed-hover.png"), url("assets/selected-checkbox-mixed-hover@2.png")); }

check:indeterminate:disabled,
treeview.check:indeterminate:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-mixed-insensitive.png"), url("assets/checkbox-mixed-insensitive@2.png")); }

.osd check:indeterminate:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-mixed-insensitive-dark.png"), url("assets/checkbox-mixed-insensitive-dark@2.png")); }

.view check:indeterminate:disabled:selected, iconview check:indeterminate:disabled:selected, .nautilus-window notebook check:indeterminate:disabled:selected, .nemo-window notebook check:indeterminate:disabled:selected,
treeview.check:indeterminate:disabled:selected,
row:selected check:indeterminate:disabled,
infobar check:indeterminate:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-checkbox-mixed-insensitive.png"), url("assets/selected-checkbox-mixed-insensitive@2.png")); }

check:checked,
treeview.check:checked {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked.png"), url("assets/checkbox-checked@2.png")); }

.osd check:checked {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-dark.png"), url("assets/checkbox-checked-dark@2.png")); }

.view check:checked:selected, iconview check:checked:selected, .nautilus-window notebook check:checked:selected, .nemo-window notebook check:checked:selected,
treeview.check:checked:selected,
row:selected check:checked,
infobar check:checked {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-checkbox-checked.png"), url("assets/selected-checkbox-checked@2.png")); }

check:checked:hover,
treeview.check:checked:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-hover.png"), url("assets/checkbox-checked-hover@2.png")); }

.osd check:checked:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-hover-dark.png"), url("assets/checkbox-checked-hover-dark@2.png")); }

.view check:checked:hover:selected, iconview check:checked:hover:selected, .nautilus-window notebook check:checked:hover:selected, .nemo-window notebook check:checked:hover:selected,
treeview.check:checked:hover:selected,
row:selected check:checked:hover,
infobar check:checked:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-checkbox-checked-hover.png"), url("assets/selected-checkbox-checked-hover@2.png")); }

check:checked:disabled,
treeview.check:checked:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-insensitive.png"), url("assets/checkbox-checked-insensitive@2.png")); }

.osd check:checked:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-insensitive-dark.png"), url("assets/checkbox-checked-insensitive-dark@2.png")); }

.view check:checked:disabled:selected, iconview check:checked:disabled:selected, .nautilus-window notebook check:checked:disabled:selected, .nemo-window notebook check:checked:disabled:selected,
treeview.check:checked:disabled:selected,
row:selected check:checked:disabled,
infobar check:checked:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-checkbox-checked-insensitive.png"), url("assets/selected-checkbox-checked-insensitive@2.png")); }

radio,
treeview.radio {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-unchecked.png"), url("assets/radio-unchecked@2.png")); }

.osd radio {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-unchecked-dark.png"), url("assets/radio-unchecked-dark@2.png")); }

.view radio:selected, iconview radio:selected, .nautilus-window notebook radio:selected,
.nautilus-window notebook > stack:not(:only-child) searchbar radio:selected, .nemo-window notebook radio:selected,
treeview.radio:selected,
row:selected radio,
infobar radio {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-radio-unchecked.png"), url("assets/selected-radio-unchecked@2.png")); }

radio:hover,
treeview.radio:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-unchecked-hover.png"), url("assets/radio-unchecked-hover@2.png")); }

.osd radio:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-unchecked-hover-dark.png"), url("assets/radio-unchecked-hover-dark@2.png")); }

.view radio:hover:selected, iconview radio:hover:selected, .nautilus-window notebook radio:hover:selected, .nemo-window notebook radio:hover:selected,
treeview.radio:hover:selected,
row:selected radio:hover,
infobar radio:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-radio-unchecked-hover.png"), url("assets/selected-radio-unchecked-hover@2.png")); }

radio:disabled,
treeview.radio:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-unchecked-insensitive.png"), url("assets/radio-unchecked-insensitive@2.png")); }

.osd radio:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-unchecked-insensitive-dark.png"), url("assets/radio-unchecked-insensitive-dark@2.png")); }

.view radio:disabled:selected, iconview radio:disabled:selected, .nautilus-window notebook radio:disabled:selected, .nemo-window notebook radio:disabled:selected,
treeview.radio:disabled:selected,
row:selected radio:disabled,
infobar radio:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-radio-unchecked-insensitive.png"), url("assets/selected-radio-unchecked-insensitive@2.png")); }

radio:indeterminate,
treeview.radio:indeterminate {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-mixed.png"), url("assets/radio-mixed@2.png")); }

.osd radio:indeterminate {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-mixed-dark.png"), url("assets/radio-mixed-dark@2.png")); }

.view radio:indeterminate:selected, iconview radio:indeterminate:selected, .nautilus-window notebook radio:indeterminate:selected, .nemo-window notebook radio:indeterminate:selected,
treeview.radio:indeterminate:selected,
row:selected radio:indeterminate,
infobar radio:indeterminate {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-radio-mixed.png"), url("assets/selected-radio-mixed@2.png")); }

radio:indeterminate:hover,
treeview.radio:indeterminate:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-mixed-hover.png"), url("assets/radio-mixed-hover@2.png")); }

.osd radio:indeterminate:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-mixed-hover-dark.png"), url("assets/radio-mixed-hover-dark@2.png")); }

.view radio:indeterminate:hover:selected, iconview radio:indeterminate:hover:selected, .nautilus-window notebook radio:indeterminate:hover:selected, .nemo-window notebook radio:indeterminate:hover:selected,
treeview.radio:indeterminate:hover:selected,
row:selected radio:indeterminate:hover,
infobar radio:indeterminate:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-radio-mixed-hover.png"), url("assets/selected-radio-mixed-hover@2.png")); }

radio:indeterminate:disabled,
treeview.radio:indeterminate:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-mixed-insensitive.png"), url("assets/radio-mixed-insensitive@2.png")); }

.osd radio:indeterminate:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-mixed-insensitive-dark.png"), url("assets/radio-mixed-insensitive-dark@2.png")); }

.view radio:indeterminate:disabled:selected, iconview radio:indeterminate:disabled:selected, .nautilus-window notebook radio:indeterminate:disabled:selected, .nemo-window notebook radio:indeterminate:disabled:selected,
treeview.radio:indeterminate:disabled:selected,
row:selected radio:indeterminate:disabled,
infobar radio:indeterminate:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-radio-mixed-insensitive.png"), url("assets/selected-radio-mixed-insensitive@2.png")); }

radio:checked,
treeview.radio:checked {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-checked.png"), url("assets/radio-checked@2.png")); }

.osd radio:checked {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-checked-dark.png"), url("assets/radio-checked-dark@2.png")); }

.view radio:checked:selected, iconview radio:checked:selected, .nautilus-window notebook radio:checked:selected, .nemo-window notebook radio:checked:selected,
treeview.radio:checked:selected,
row:selected radio:checked,
infobar radio:checked {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-radio-checked.png"), url("assets/selected-radio-checked@2.png")); }

radio:checked:hover,
treeview.radio:checked:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-checked-hover.png"), url("assets/radio-checked-hover@2.png")); }

.osd radio:checked:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-checked-hover-dark.png"), url("assets/radio-checked-hover-dark@2.png")); }

.view radio:checked:hover:selected, iconview radio:checked:hover:selected, .nautilus-window notebook radio:checked:hover:selected, .nemo-window notebook radio:checked:hover:selected,
treeview.radio:checked:hover:selected,
row:selected radio:checked:hover,
infobar radio:checked:hover {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-radio-checked-hover.png"), url("assets/selected-radio-checked-hover@2.png")); }

radio:checked:disabled,
treeview.radio:checked:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-checked-insensitive.png"), url("assets/radio-checked-insensitive@2.png")); }

.osd radio:checked:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/radio-checked-insensitive-dark.png"), url("assets/radio-checked-insensitive-dark@2.png")); }

.view radio:checked:disabled:selected, iconview radio:checked:disabled:selected, .nautilus-window notebook radio:checked:disabled:selected, .nemo-window notebook radio:checked:disabled:selected,
treeview.radio:checked:disabled:selected,
row:selected radio:checked:disabled,
infobar radio:checked:disabled {
  -gtk-icon-source: -gtk-scaled(url("assets/selected-radio-checked-insensitive.png"), url("assets/selected-radio-checked-insensitive@2.png")); }

.view.content-view.check:not(list), iconview.content-view.check:not(list), .nautilus-window notebook.content-view.check:not(list),
.nautilus-window notebook > stack:not(:only-child) searchbar.content-view.check:not(list), .nemo-window notebook.content-view.check:not(list) {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-selectionmode.png"), url("assets/checkbox-selectionmode@2.png"));
  background-color: transparent; }

.view.content-view.check:checked:not(list), iconview.content-view.check:checked:not(list), .nautilus-window notebook.content-view.check:checked:not(list),
.nautilus-window notebook > stack:not(:only-child) searchbar.content-view.check:checked:not(list), .nemo-window notebook.content-view.check:checked:not(list) {
  -gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-selectionmode.png"), url("assets/checkbox-checked-selectionmode@2.png"));
  background-color: transparent; }

checkbutton.text-button, radiobutton.text-button {
  padding: 2px 0;
  outline-offset: 0; }
checkbutton label:not(:only-child):first-child, radiobutton label:not(:only-child):first-child {
  margin-left: 4px; }
checkbutton label:not(:only-child):last-child, radiobutton label:not(:only-child):last-child {
  margin-right: 4px; }

check,
radio {
  min-width: 16px;
  min-height: 16px;
  margin: 0 2px; }
  check:only-child, menu menuitem check,
  radio:only-child, menu menuitem
  radio {
    margin: 0; }
    
    
    combobox arrow
{
  -gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
  min-height: 16px;
  min-width: 16px;
}

The effect it has is that some checkboxes are now visible even when they're not ticked, and there's also a dropdown menu arrow, I have in mind specifically those you click to drop down a "history" of text fields, that is now visible. Before that there was no icon and the button itself had only two pixels or so, I guess.

I'm not a GTK theme technician of any sort, or even someone who really understands much of css, that's essentially a frankensteinian butcher job. Perhaps a "flatter " icon set would go better with Mist, but it's quite a hassle to test GTK3 themes, for me at least, without Gnome3, so, that will do it for now.

I'm sorry if it sucks.



I wish I could figure out how to change the fore and background color of selected texts in "entry" fields. As it is now, it's barely noticeable.
Posted in Uncategorized
Views 581 Comments 0
« Prev     Main     Next »
Total Comments 0

Comments

 

  



All times are GMT -5. The time now is 10:29 PM.

Main Menu
Advertisement
Advertisement
My LQ
Write for LQ
LinuxQuestions.org is looking for people interested in writing Editorials, Articles, Reviews, and more. If you'd like to contribute content, let us know.
Main Menu
Syndicate
RSS1  Latest Threads
RSS1  LQ News
Twitter: @linuxquestions
Facebook: linuxquestions Google+: linuxquestions
Open Source Consulting | Domain Registration