Arc-theme: :minimize,close layout uses maximize icon instead of minimize one

[timorei]

That is indeed a minimize button and works as such. The one in the back is a firefox (non-csd)
It happens in all CSD windows:

[bilelmoussaoui]

I can confirm this too

[crutchcorn]

Experiencing the same issue

[horst3180]

This is a problem with the way the custom window buttons are implemented in the theme. Sadly Gtk 3.14 has some limitations which makes them only work correctly for some button layouts.

For elementary OS you might want to have a look at this http://www.webupd8.org/2015/04/tune-up-elementary-os-03-freya-with.html
Changing the button layout with elementary-tweaks to Windows, Close Only or OS X will work.

In Gnome you can change the button layout with

gsettings set org.gnome.settings-daemon.plugins.xsettings overrides "{'Gtk/DecorationLayout': <':minimize,maximize,close'>}"

or

gsettings set org.gnome.settings-daemon.plugins.xsettings overrides "{'Gtk/DecorationLayout': <'close,maximize,minimize:'>}"

The first command will make the button layout windows-like and the second will make it osx-like.

There's nothing else I can do about this. The good news is, that everything works fine with Gtk 3.16.
I should probably mention this in the README.

[timorei]

I'm actually sporting a little script for switching button position, just to make sure I don't forget one of the options.

#!/bin/bash

#some apps read this for their tabs
gsettings set org.gnome.settings-daemon.plugins.xsettings overrides "{'Gtk/DecorationLayout': <'"$1"'>}"

#elementary os
gsettings set org.pantheon.desktop.gala.appearance button-layout "'"$1"'"

#default for all gnome apps
gsettings set org.gnome.desktop.wm.preferences button-layout "'"$1"'"

#some apps just refuse to not use gnome-shell settings
gsettings set org.gnome.shell.overrides button-layout "'"$1"'"

#metacity settings for i.e. chrome
gconftool-2 --set --type=String /apps/metacity/general/button_layout $1

[timorei]

So - since I didn't get it fixed in your theme's source (sorry, I suck, I would have wished I could give you a patch :/ ) - and since I never use a maximize button (double-clicking the titlebar is enough) - I created some scripts to update my stuff for elementary os with the :minimize,close layout ONLY:

To add a better shadow to the gtk3 windows:
arc_shadow

.window-frame {
    box-shadow: 0 0 0 1px alpha (#000, 0.1),
                0 12px 30px -6px alpha (#000, 0.80);

    margin: 8px;
}

To update arc to the version from the git, copy it to the location and reapply the shadow from the file above:
rearc.sh

#!/bin/bash
# update theme from git repository.
sudo chown -R username:username /usr/share/themes
cd /home/username/arc-theme/
git pull
./autogen.sh --prefix=/usr/
rm -r /usr/share/themes/Arc
sudo make install
sudo chown -R username:username /usr/share/themes
cat /home/username/arc-shadow >> /usr/share/themes/Arc/gtk-3.0/gtk.css

To replace all maximize buttons with the minimize ones. This means there will just be no maximize graphics left to be displayed. So DON'T DO THIS IF YOU WANT A MAXIMIZE BUTTON!
rearc_buttons.sh

#!/bin/bash
# I'm not using a maximize button anyways (double tap titlebar instead)
# this fixes the buttons for me.
cd /usr/share/themes/Arc/gtk-3.0/assets

rm titlebutton-max.png
ln -s titlebutton-min.png titlebutton-max.png

rm [email protected]
ln -s [email protected] [email protected]

rm [email protected]
ln -s [email protected] [email protected]

rm titlebutton-max-active.png
ln -s titlebutton-min-active.png titlebutton-max-active.png

rm [email protected]
ln -s [email protected] [email protected]

rm titlebutton-max-backdrop.png
ln -s titlebutton-min-backdrop.png titlebutton-max-backdrop.png

rm [email protected]
ln -s [email protected] [email protected]

rm titlebutton-max-hover.png
ln -s titlebutton-min-hover.png titlebutton-max-hover.png

cd /usr/share/themes/Arc/metacity-1
rm max_unfocused.svg
ln -s min_unfocused.svg max_unfocused.svg

Maybe this helps someone else? I'll take another look at the parts of the themes source, see if I find the right place where the button thing gets messed up. Is it possible that the graphics are chosen by their position relative to the right? (css :last, n-th ...) or something like that?

[horst3180]

@timorei Your are right, the button images are chosen by the button position. I will try to explain how the theme does this and why this causes problems.

This is the section in _common.scss that draws the window buttons

.header-bar, .titlebar,
.header-bar.selection-mode, .titlebar.selection-mode {

...

  // Minimize

  .right .button.titlebutton:nth-last-child(3),
  .right:dir(rtl) .button.titlebutton:nth-child(3),
  .left .button.titlebutton:nth-child(3),
  .left:dir(rtl) .button.titlebutton:nth-last-child(3) {
    background-image: -gtk-scaled(url('assets/titlebutton-min.png'),url('assets/[email protected]'));

    &:hover, &:backdrop:hover { background-image: -gtk-scaled(url('assets/titlebutton-min-hover.png'),url('assets/[email protected]')); }
    &:active:hover { background-image: -gtk-scaled(url('assets/titlebutton-min-active.png'),url('assets/[email protected]')); }
    &:backdrop { background-image: -gtk-scaled(url('assets/titlebutton-min-backdrop.png'),url('assets/[email protected]')); }
}

  // Maximize

  .right .button.titlebutton:nth-last-child(2),
  .right:dir(rtl) .button.titlebutton:nth-child(2),
  .left .button.titlebutton:nth-child(2),
  .left:dir(rtl) .button.titlebutton:nth-last-child(2) {
    background-image: -gtk-scaled(url('assets/titlebutton-max.png'),url('assets/[email protected]'));

    &:hover, &:backdrop:hover { background-image: -gtk-scaled(url('assets/titlebutton-max-hover.png'),url('assets/[email protected]')); }
    &:active:hover { background-image: -gtk-scaled(url('assets/titlebutton-max-active.png'),url('assets/[email protected]')); }
    &:backdrop { background-image: -gtk-scaled(url('assets/titlebutton-max-backdrop.png'),url('assets/[email protected]')); }
}

  // Close

  .right .button.titlebutton:last-child,
  .right:dir(rtl) .button.titlebutton:first-child,
  .left .button.titlebutton:first-child,
  .left:dir(rtl) .button.titlebutton:last-child {
    background-image: -gtk-scaled(url('assets/titlebutton-close.png'),url('assets/[email protected]'));

    &:hover, &:backdrop:hover { background-image: -gtk-scaled(url('assets/titlebutton-close-hover.png'),url('assets/[email protected]')); }
    &:active:hover { background-image: -gtk-scaled(url('assets/titlebutton-close-active.png'),url('assets/[email protected]')); }
    &:backdrop { background-image: -gtk-scaled(url('assets/titlebutton-close-backdrop.png'),url('assets/[email protected]')); }
  }
}

I made some images to illustrate this

This is the only way to get custom titlebuttons, since the maximize,minimize,close buttons don't have specific style classes in Gtk 3.14 and below.

In Gtk 3.16 however I can target the buttons individually because they have .close, .maxmimize and .minimize styleclasses. That is much simpler than the code above and works with every button layout.

[timorei]

Ah - great. Thanks. So for freya I'll stick to my crude overwrite approach. And should it update to 3.16 I can stop doing that.

Thanks for the great theme, dude!