surajmandalcell / elementary-x

Transform your Linux system with an elegant Elementary OS theme and sleek macOS window controls, available in both light and dark mode.

Elementary X

Maintainer Needed! Please leave a comment in "Maintainer Needed!" issue if you're intrested

Fork of the Default Gtk+ Stylesheet for elementary OS with OS X window controls

The forked Gtk.CSS stylesheet with OS X window controls is designed specifically for elementary OS and its desktop environment: Pantheon. Since Gtk.CSS has changed quite a bit, this stylesheet only supports Gtk >= 3.22

Elementary-X is available in two variants

Dark Variant

Light Variant

(old screenshots)

More screenshots

Features

• Traffic lights window controls
• Re-designed widgets to look cool
• Always up to date with original elementary-os stylesheet

Installation

You'll need git to install this theme

1. Open terminal and execute the following

git clone https://github.com/surajmandalcell/elementary-x.git ~/.themes/elementary-x

2. Select this theme in tweak tool or execute the following

gsettings set org.gnome.desktop.interface gtk-theme "elementary-x"

3. Thats it you're done!

Note: To install it globally i.e. for situation when you run apps as root or specially SNAP packages move your theme to /usr/share/themes

Extras

• Refer here to see how to set DARK MODE
• The icon theme used is La Capitaine. (Use install_fixed_icons.sh to install a fixed version of icon theme for eos)
• The folder also includes plank themes! To install just use the install_plank_themes.sh script
• Chrome themes will be included soon..
• There are metacity and xfwm4 themes wich are for other desktop environment use.
• There is no gnome-shell theme as it is ment for elementary gala de.

TO-DO

Here is the link to the trello board for the project > board.

Contributing

This stylesheet doesn't need to be compiled. It is recommended to make a symbolic link from the source directory to "/usr/share/themes" for testing:

ln -s /path/to/your/branch /usr/share/themes/

Apps will need to be restarted or the system stylesheet will need to be changed for your changes to take effect.

You can also test changes live with Gtk Inspector. Make sure you have Gtk development libraries installed:

sudo apt install libgtk-3-dev

Open an app you wish to test your changes on. Open Gtk Inspector with the keyboard shortcut Shift + Ctrl + D, then navigate to the tab "Custom CSS". Your changes here will take immediate effect on the focused app.

Todo

• Merge elementary/stylesheet#381

elementary-x's Issues

File manager icons are dark not light.

The icons are dark instead of light like in the example picture for the dark theme.

Yellow line on some windows

I notice that some application like AppCenter and Tardis have an ugly yellow line below the title bar. How can I remove it? Thanks!

How to enable dark mode?

The forum you referred to isn't helping me

some app not showing the close, minimize, and full screen button

Some apps from my PC that is not showing any of those button are:

• visual studio code
• XAMPP
• vim
  there maybe other apps that has the same bug

Fix plank themes script

https://github.com/surajmandalcell/elementary-x/blob/master/install_plank_themes.sh
shit doesn't work :/ need to do it the long way

1. Clone the repo to tmp themes directory
   git clone https://github.com/surajmandalcell/plank-themes-x.git ~/.local/share/plank/themes/tmp
2. CD to themes
   ~/.local/share/plank/themes
3. copy themes from tmp to themes itself
   cp -r tmp/themes/* ../../../
4. delete tmp
   rm -rf tmp

Errors in elementaryX.css

Hello,

first of all really, really great theme, i really enjoy it 👍.

When using electron i noticed some GTK warnings (see console log fragment below), probably just minor code errors, i didnt want to withhold that from you.

(electron:21861): Gtk-WARNING **: Theme parsing error: elementaryX.css:1:122: Expected a valid selector

(electron:21861): Gtk-WARNING **: Theme parsing error: elementaryX.css:213:38: Expected ',' in color definition

(electron:21861): Gtk-WARNING **: Theme parsing error: elementaryX.css:213:39: Expected semicolon

(electron:21861): Gtk-WARNING **: Theme parsing error: elementaryX.css:213:41: Expected semicolon

(electron:21861): Gtk-WARNING **: Theme parsing error: elementaryX.css:213:43: Expected semicolon

(electron:21861): Gtk-WARNING **: Theme parsing error: elementaryX.css:218:38: Expected ',' in color definition

(electron:21861): Gtk-WARNING **: Theme parsing error: elementaryX.css:218:39: Expected semicolon

(electron:21861): Gtk-WARNING **: Theme parsing error: elementaryX.css:218:41: Expected semicolon

(electron:21861): Gtk-WARNING **: Theme parsing error: elementaryX.css:218:43: Expected semicolon

(electron:21861): Gtk-WARNING **: Theme parsing error: elementaryX.css:257:1: '/*' in comment block

Thanks again for this great theme, really appreciate your work.

some inconsistency in the space between in these buttons

Problems that do not take effect after modifying the code

.panel.maximized { background-color: #fff; }
elementary 5.1 This code will not take effect after changing black to white

Modify the font on the title bar of app windows

How do I modify the font on the title bar of app windows? The font-size is too small.

native pdf reader strange behaviour

Some parts of the application ( left bar and background ) disappear in the native pdf. Also is the only app ( so far ) that doesn't have the minimize, close and reduce button like osx

eOs Juno

Question: Juno and OSX buttons?

Love this theme, however, is it able to correctly theme the OSX style buttons on all apps including pantheon apps. From what I'm seeing the developers (specifically the designers) seem to have prevented this?

EDIT: I'm specifically referring to Juno Beta- not Loki

Maintainer Needed!

I've left elementary os thus I'm no longer developing this theme, if you are interested in developing the theme further or want to do some pull requests for fixes you're free to do so, I'll test it in vm and accept if valid.

Flatpak Support

Flatpak support is relatively easy and can be done by making two files. Although, there are button border issues with newer versions of GTK (elementary/stylesheet#291)

org.gtk.Gtk3theme.elementary-x.appdata.xml

<?xml version="1.0" encoding="UTF-8"?>
<component type="runtime">
  <id>org.gtk.Gtk3theme.elementary</id>
  <metadata_license>CC0-1.0</metadata_license>
  <name>elementary-x stylesheet</name>
  <summary>Original elementary theme with some tweaks and OS X window controls.</summary>
  <description>
    <p>Original elementary theme with some tweaks and OS X window controls.</p>
  </description>
  <url type="homepage">https://github.com/surajmandalcell/elementary-x</url>
</component>

org.gtk.Gtk3theme.elementary-x.json

{
  "id":"org.gtk.Gtk3theme.elementary-x",
  "branch": "3.22",
  "runtime": "org.gnome.Platform",
  "build-extension": true,
  "sdk": "org.gnome.Sdk",
  "runtime-version": "3.24",
  "appstream-compose": false,
  "separate-locales": false,
  "modules": [
    {
      "name": "elementary-x",
      "buildsystem": "simple",
      "build-commands": [
        "install -dm755 /usr/share/runtime/share/themes/elementary-x/gtk-3.0",
        "cp -aL gtk-3.22/* /usr/share/runtime/share/themes/elementary-x/gtk-3.0",
        "cp -a index.theme /usr/share/runtime/share/themes/elementary-x"
      ],
      "sources": [
        {
          "type": "git",
          "url": "git://github.com/surajmandalcell/elementary-x.git",
          "branch": "master"
        }
      ]
    },
    {
      "name": "appdata",
      "buildsystem": "simple",
      "build-commands": [
        "mkdir -p ${FLATPAK_DEST}/share/appdata",
        "cp org.gtk.Gtk3theme.elementary-x.appdata.xml ${FLATPAK_DEST}/share/appdata",
        "appstream-compose --basename=org.gtk.Gtk3theme.elementary-x --prefix=${FLATPAK_DEST} --origin=flatpak org.gtk.Gtk3theme.elementary-x"
      ],
      "sources": [
        {
          "type": "file",
          "path": "org.gtk.Gtk3theme.elementary-x.appdata.xml"
        }
      ]
    }
  ]
}

Compile/Install

flatpak install gnome org.gnome.Sdk 3.24
flatpak install gnome org.gnome.Platform 3.24
flatpak-builder --install build-dir org.gtk.Gtk3theme.elementary-x.json  --force-clean

A native style to bend Qt4 and Qt5 applications to look like they belong into Elementary OS

A native style to bend Qt4 and Qt5 applications to look like they belong into Elementary OS

https://github.com/FedoraQt/adwaita-qt

"Fix" for GNOME 3.28 Apps

GNOME 3.28 apps don't have .image-button in the buttons in the headerbar, causing borders.

This seems to "fix" it. by fix it, a work around.

.titlebar button:not(.titlebutton):not(.text-button):not(.radio),
.titlebar .button:not(.titlebutton):not(.text-button):not(.radio)
{
    padding: 3px;
    border-radius: 99px;
    border: 1px solid transparent;
    background-image: none;
    box-shadow: none;

}

How do I modify the transparency of the notification menu?

How to modify the transparency of the notification menu and right-click menu?

Sublime Text 3 missing style

Hei there, thank you so much for creating this nice theme.

I've installed this theme in Juno. But when i open sublime text, top menu and right click menu still using default elementary theme.

Is this a bug? or just happened in my PC? Thank you

Evolution: Grey message body

All the messages y Evolution has a grey body instead of white by default

Aligning window buttons to left like OSX in Juno

Hi, were you able to do this in Juno? Seems like the gsettings command are not working anymore.

Theme couldn't applied on Inkscape

Hi, looks like the theme couldn't applied to Inkscape. I used Inkscape 0.92, and other themes work fine on it. I want to try to change the Inkscape theme from the config, but I don't know how to do it. Could you help me, please.

Tab height incorrect

Hello,

Seems the tab height is incorrect in Elementary OS 6.1. This is both for light and dark themes

I find this in Terminal, Files and in Code where tabs are present.

I have attached some screenshot of the tab height in code

Here is a screenshot of the tab height in files

This is the default correct tab height

Merge still pending?

I noticed https://github.com/surajmandalcell/elementary-x#todo still lists Merge elementary/stylesheet#381 as a ToDo. Should I wait to install this theme until it completes?

Window borders are lighter or more transparent than original theme

I notice the original elementary theme in Juno, fully updated is darker than this theme.
It makes the window borders look blurry.

The table widgets also has darker and well defined borders too. See the Theme Settings section with the table below it.