roundabout,
created on Sunday, 11 May 2025, 14:27:45 (1746973665),
received on Sunday, 11 May 2025, 14:27:47 (1746973667)
Author identity: vlad <vlad.muntoiu@gmail.com>
9f54daed981a47522250c523f413ff2c6a01ed30
CHANGELOG.md
@@ -1,29 +1,8 @@
## 20210322
## 2025-05-11
* Rename to Charta.
* Change colour schemes.
* Add support for `GtkWindowControls` used by libAdwaita.
* Add support for [gPanthera](https://roundabout-host.com/roundabout/gpanthera)'s tabs
(I am the developer of gPanthera).
- Add support for GTK 4
- Add support for gnome-shell 40
- Update color scheme
- Make dark theme darker
- Update scrollbar slider colors
- gtk3: Change background/surface rule
- gtk3: Drop undershoot styling
- gtk3/assistant: Change highlighted label style in sidebar
- gtk3: Tone down hover overlay in some widgets
- gtk3: Drop transparency from overlay scrollbars
- gtk3: Change the direction of the expander arrow
- gtk3/combobox: Update the arrow button style
- gtk3: Make checked flat button blue
- gtk3/pathbar: Make checked button's text/ink color blue
- gtk3: Update stacksidebar style
- gtk3: Update notebook style
- gtk3: Update .keycap style
- gtk3: Update focus entry style
- cinnamon & gnome-shell: Revamp drop shadows
- gnome-shell: Update app folder icon style
- meson: Allow specifying micro version in the build option `gnome_shell_version`
- meson: Avoid copying configured SCSS files to current_source_dir()
- Other various minor improvements and fixes
## Older versions
See https://github.com/nana-4/materia-theme/releases for older changes.
See <https://github.com/nana-4/materia-theme/releases> for changes done during Materia.
HACKING.md
@@ -21,9 +21,9 @@ right place for a drive by stylesheet fix:
File | Description
:-- | :--
`_theme.scss` | Variables to allow easier definition of widget sizing/styling.
`_color-palette.scss` | Material Design color palette definitions. We don't recommend editing this unless Google updates the color scheme.
`_theme-color.scss` | Global color definitions. We keep the number of defined colors to a necessary minimum. It covers both the light variant and the dark variant.
`_public-colors.scss` | SCSS colors exported through GTK to allow for 3rd party apps color mixing.
`_color-palette.scss` | Material Design colour palette definitions. We don't recommend editing this unless Google updates the colour scheme.
`_theme-color.scss` | Global colour definitions. We keep the number of defined colours to a necessary minimum. It covers both the light variant and the dark variant.
`_public-colors.scss` | SCSS colours exported through GTK to allow for 3rd party apps colour mixing.
`_drawing.scss` | Drawing helper mixings/functions to allow easier definition of widget drawing under specific context.
`_common.scss` | Actual definitions of style for each widget. This is where you are likely to add/remove your changes.
@@ -33,26 +33,24 @@ to generate the final CSS files.
### SVG
In Materia, to keep it maintainable, SVG files are basically edited on
text-based. So if you just want to change the colors of SVG files, it is
recommended to use a **text editor** instead of a image editor.
In Materia, to keep it maintainable, SVG files are edited as XML. So if
you just want to change the colours of SVG files, it is recommended to use a
**text editor** instead of a vector editor.
Several SVG files are used to render the PNG assets. Once you make your changes
to the SVG files, run the `./render-assets.sh` script to render the PNG assets.
## How to change the color scheme
## How to change the colour scheme
### Script
To easily change the color scheme, you can use the `change_color.sh` script (or
To easily change the colour scheme, you can use the `change_color.sh` script (or
just use the [oomox](https://github.com/themix-project/oomox) app).
> Originally, `change_color.sh` and `scripts/*.sh` were implemented for oomox,
but you can also run it on the command line without the app.
> Note: This script doesn't support Chrome extensions for now.
For example, to change the color scheme to the previous Flat-Plat, run the
For example, to change the colour scheme to the previous Flat-Plat, run the
script as follows:
For `bash`:
@@ -69,8 +67,8 @@ For `fish`:
### Manual
If you want to change the color scheme in more detail, edit the files where
colors are defined.
If you want to change the colour scheme in more detail, edit the files where
colours are defined.
#### SCSS
@@ -87,7 +85,7 @@ colors are defined.
- `src/xfwm4/xfwm4{,-dark,-light}/*.svg`
- `src/chrome/chrome-scrollbar{,-dark}/icons/*.svg`
> Note: Do not forget to run `./render-assets.sh` after changing the colors of
> Note: Do not forget to run `./render-assets.sh` after changing the colours of
`src/gtk-3.0/assets.svg` and `src/gtk-2.0/assets{,-dark}.svg`.
#### Misc
@@ -97,8 +95,8 @@ colors are defined.
- `src/xfwm4/xfwm4{,-dark,-light}/themerc`
- `src/chrome/chrome-theme{,-dark,-light}/manifest.json`
> Note: The colors of `manifest.json` are defined in RGB format, so you need to
convert your colors from HEX format to RGB format.
> Note: The colours of `manifest.json` are defined in RGB format, so you need to
convert your colours from HEX format to RGB format.
After all the steps, run `meson install` to rebuild the themes.
README.md
@@ -1,15 +1,18 @@
<img src="images/materia-logo.svg" alt="materia-logo" align="right" />
# Materia
# Charta
Materia is a [Material Design](https://material.io) theme for GNOME/GTK based desktop environments.
Charta is a theme for GTK-based desktop environments, forked from Materia.
It is inspired from the old [Material Design](https://m2.material.io)
(not Material 3, which is very different).
It supports GTK 2, GTK 3, GTK 4, GNOME Shell, Budgie, Cinnamon, MATE, Unity, Xfce, LightDM, GDM, Chrome theme, etc.
It supports GTK 2, GTK 3, GTK 4, GNOME Shell, Budgie, Cinnamon, MATE, Unity
and Xfce.
## Previews
## Features
@@ -17,20 +20,11 @@ Supports **ripple animations** for GTK 3 and 4:
**3 color variants** and **2 size variants** are available:
**3 color variants** and **2 size variants** are available: standard, dark
and light, each with a compact option.
**Materia** | **standard** | **compact**
:-: | :-: | :-:
**standard** | ![Materia][1] | ![Materia-compact][2]
**dark** | ![Materia-dark][3] | ![Materia-dark-compact][4]
**light** | ![Materia-light][5] | ![Materia-light-compact][6]
[1]: images/Materia.png?raw=true
[2]: images/Materia-compact.png?raw=true
[3]: images/Materia-dark.png?raw=true
[4]: images/Materia-dark-compact.png?raw=true
[5]: images/Materia-light.png?raw=true
[6]: images/Materia-light-compact.png?raw=true
More colour options will be coming soon, including a more traditional dark
theme.
## Supported Toolkits and Desktops
@@ -46,35 +40,17 @@ Supports **ripple animations** for GTK 3 and 4:
## Unsupported Apps and Desktops
- elementary apps
* elementary apps
> Because they are based on [their own stylesheet](https://github.com/elementary/stylesheet) that conflicts with GTK standards.
- Downstream customized GNOME sessions
* Downstream customised GNOME sessions
> E.g. "Ubuntu" session, "Pop" session. To properly use Materia on GNOME Shell, please install `gnome-session` and then switch to "GNOME" or "GNOME on Xorg" session from your display manager.
* libAdwaita apps
> Because they only actually support GNOME. Many widgets do look correct in libAdwaita, but more work is needed, and a patch for libAdwaita to allow changing the theme.
## Installation
### Distro Packages
<!-- For contributors, please add your package alphabetically. -->
Distro | Package Name | Annotation
--- | --- | ---
Arch Linux | `materia-gtk-theme` | [Link](https://www.archlinux.org/packages/community/any/materia-gtk-theme/)
Debian 10 or later | `materia-gtk-theme` | [Link](https://packages.debian.org/materia-gtk-theme)
Fedora | `materia-gtk-theme` | [Link](https://src.fedoraproject.org/rpms/materia-gtk-theme)
Solus | `materia-gtk-theme` | [Link](https://dev.getsol.us/source/materia-gtk-theme/)
Ubuntu 18.04 or later | `materia-gtk-theme` | [Link](https://packages.ubuntu.com/materia-gtk-theme)
> NOTE: Distro packages could be outdated and incompatible with your desktop environment. You can check the latest version [here](https://github.com/nana-4/materia-theme/releases).
### Flatpak
All 6 variants are available via Flathub:
```
flatpak remote-add --if-not-exists flathub https://dl.flathub.org/repo/flathub.flatpakrepo
flatpak install flathub org.gtk.Gtk3theme.Materia{,-dark,-light}{,-compact}
```
There are currently no distro packages or Flatpaks. If anyone is interested in maintaining some,
contact me.
### Manual Installation
@@ -84,53 +60,37 @@ See [`INSTALL.md`](INSTALL.md) for details.
### Font
- Use a font family including **Medium** weight (e.g. [Roboto](https://github.com/google/roboto) or [M+](https://mplus-fonts.osdn.jp)) to properly display the theme.
- Set the font size to `9.75` (= 13px at 96dpi) or `10.5` (= 14px at 96dpi).
### Chrome Extensions
To improve the appearance of Chrome, you can install our Chrome extensions as follows:
1. Open the `/usr/share/themes/Materia<-variant>/chrome` folder in your file manager.
2. Drag and drop the `.crx` files into the Chrome's Extensions page (`chrome://extensions`).
### GDM Theme
You can change the GDM (lock/login screen) theme by replacing the default GNOME Shell theme.
See [`INSTALL_GDM_THEME.md`](INSTALL_GDM_THEME.md) for details.
## Customization
* Use a font family including **Medium** weight (e.g. [Roboto](https://github.com/google/roboto) or [M+](https://mplus-fonts.osdn.jp)) to properly display the theme.
* Set the font size to `9.75` (= 13px at 96dpi) or `10.5` (= 14px at 96dpi).
Materia can be customized with GUI application, [**oomox theme designer**](https://github.com/themix-project/oomox).
## Customisation
Materia also allows you to change the color scheme relatively easily in other ways. See [`HACKING.md`](HACKING.md#how-to-change-the-color-scheme) for details.
The colour scheme can be modified relatively easily, as in Materia. See [`HACKING.md`](HACKING.md#how-to-change-the-color-scheme) for details.
## Contributing
If you find bugs or have suggestions, please report it to the [issue tracker](https://github.com/nana-4/materia-theme/issues). Any contribution would be much appreciated.
If you find bugs or have suggestions, please report them to the [issue tracker](https://roundabout-host.com/roundabout/charta-gtk-theme). Any contribution would be much appreciated.
Todo list can be found at [`TODO.md`](TODO.md).
## Related Projects
- [**Materia KDE**](https://github.com/PapirusDevelopmentTeam/materia-kde) by @PapirusDevelopmentTeam
- [**Materia VSCode Theme**](https://marketplace.visualstudio.com/items?itemName=m-thorsen.vscode-materia) by @m-thorsen
- [**Materia Kolorizer**](https://github.com/DarthWound/materia-kolorizer) by @DarthWound
- [**oomox theme designer**](https://github.com/themix-project/oomox) by @themix-project
If you are porting the Charta theme to other applications, please let me know so I can add it here.
## License
Materia is distributed under the terms of the GNU General Public License, version 2 or later. See the [`COPYING`](COPYING) file for details.
Charta, like Materia, is distributed under the terms of the GNU General Public License, version 2 or later. See the [`COPYING`](COPYING) file for details.
## Acknowledgments
- Materia is based on [Adwaita](HACKING.md#upstream-theme-sources) by GNOME.
- Design and specifications are based on Google's [Material Design](https://material.io).
- The included symbolic icons are based on [Material Design icons](https://github.com/google/material-design-icons) by Google.
- The Chrome scrollbar extension was forked from [Adwaita-chrome-scrollbar](https://github.com/gnome-integration-team/chrome-gnome-scrollbar) by GNOME Integration Team.
- Yauhen Kirylau (@actionless) who is oomox author polished scripts and supported Materia with [oomox](https://github.com/themix-project/oomox).
- @n3oxmind who helped improve the installation script we had.
- @smurphos who made and provided the Cinnamon theme for Materia.
- Our Meson code is heavily influenced by @monday15's [lounge-gtk-theme](https://github.com/monday15/lounge-gtk-theme).
* Charta is a recent fork of [Materia](https://github.com/nana-4/materia-theme)
by nana-4, which is in turn based on [Adwaita](HACKING.md#upstream-theme-sources),
the default theme of GTK 3.
* Design and specifications are based on Google's [Material Design 1](https://m1.material.io)
and [Material Design 2](https://m2.material.io).
* The various icons are based on [Material Design icons](https://github.com/google/material-design-icons) by Google.
* @n3oxmind who helped improve the installation script we had.
* @smurphos who made and provided the Cinnamon theme for Materia.
* Our Meson code is heavily influenced by @monday15's [lounge-gtk-theme](https://github.com/monday15/lounge-gtk-theme).
Also thank you to all contributors and upstream developers.