diff --git a/astro.config.mjs b/astro.config.mjs index f645c6a..4027e6d 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -88,8 +88,6 @@ export default defineConfig({ { label: 'Customizing Shells', link: '/en/customization/shell' }, { label: 'Customizing Display Managers', link: '/en/customization/display-manager' }, { label: 'Customizing Terminal Tools', link: '/en/customization/terminal-tools' }, - { label: 'Customizing GNOME', link: '/en/customization/gnome' }, - { label: 'Customizing Hyprland', link: '/en/customization/hyprland' }, ], }, { diff --git a/src/content/docs/en/configuration/gnome.mdx b/src/content/docs/en/configuration/gnome.mdx index daa327e..07f47fe 100644 --- a/src/content/docs/en/configuration/gnome.mdx +++ b/src/content/docs/en/configuration/gnome.mdx @@ -88,6 +88,181 @@ By pressing `Super` key (i.e., `Windows` key), or by the Menu Dock on **Show App ![GNOME Application Grid](@assets/images/gnome-applications.png) +## Customization + +I you wish to change some GNOME elements in Athena OS, you can follow this guide to get the right steps and transform Athena according to your taste. + +GNOME is composed of several resources and we will discuss each one of them in order to tweak it as possible. + +### Customize Background + +Backgrounds are stored in `/usr/share/backgrounds/default/` folder. + +If you wish to change only the background, you can do it by different ways. + +The first one is to go to the top-right **power button** -> **gear icon** -> the Settings window appears -> **Appearance** -> click on **Add Picture...** and select your favourite background. + +![GNOME Settings Background](@assets/images/gnome-custom-background.png) + +Here you can change also if applying a light or dark theme. + +Another method is to use **GNOME Tweaks**. Go to the **App Grid** or press **Super** key two times, and search for **GNOME Tweaks** or **Tweaks**, usually it is inside the **Utilities** group and launch it. + +When the GNOME Tweaks is opened, move to **Appearance** tab and tweak your image and its adjustment under the **Background** section. + +![GNOME Tweaks Background](@assets/images/gnome-custom-tweaks-background.png) + +An additional method is by terminal. Run: +``` +gsettings set org.gnome.desktop.background picture-uri-dark background.png +gsettings set org.gnome.desktop.background picture-options stretched +``` +**stretched** is used to adjust the image in order to fill the entire screen. + +:::tip +If you are using a dark theme, use **picture-uri-dark**. If you are using a light theme, replace **picture-uri-dark** by **picture-uri** parameter. +::: + +### Customize Mouse Cursor + +If you wish to customize your **mouse pointer**, download one mouse cursor theme. Look at [GNOME Look](https://www.gnome-look.org/) and select **Cursors** category. + +Once downloaded, place the cursor folder in `/usr/share/icons/` to apply it at system-wide or `~/.local/share/icons/` to apply only for your user. Now, go to the **App Grid** or press **Super** key two times, and search for **GNOME Tweaks** or **Tweaks**, usually it is inside the **Utilities** group and launch it. + +When the GNOME Tweaks is opened, move to **Appearance** tab and select your cursor theme on **Cursor** field. + +![GNOME Tweaks Cursor](@assets/images/gnome-custom-cursor.png) + +You can apply a cursor theme also by terminal by running: +``` +gsettings set org.gnome.desktop.interface cursor-theme +``` +The cursor theme folder must always be stored in `/usr/share/icons/` or `~/.local/share/icons/` + +### Customize Icons + +If you wish to customize the **icon theme**, download one of it. Look at [GNOME Look](https://www.gnome-look.org/) and select **Full Icon Themes** category. + +Once downloaded, place the icon folder in `/usr/share/icons/` to apply it at system-wide or `~/.local/share/icons/` to apply only for your user. Now, go to the **App Grid** or press **Super** key two times, and search for **GNOME Tweaks** or **Tweaks**, usually it is inside the **Utilities** group and launch it. + +When the GNOME Tweaks is opened, move to **Appearance** tab and select your icon theme on **Icons** field. + +![GNOME Tweaks Icons](@assets/images/gnome-custom-icons.png) + +You can apply an icon theme also by terminal by running: +``` +gsettings set org.gnome.desktop.interface icon-theme +``` +The icon theme folder must always be stored in `/usr/share/icons/` or `~/.local/share/icons/` + +### Customize Theme + +If you wish to change the theme of top bar and the GTK windows, download one of it. Look at [GNOME Look](https://www.gnome-look.org/) and select **GTK3/4 Themes** category. Download only themes that are compatible with the actual installed version of GNOME. + +Once downloaded, place the theme folder in `/usr/share/themes/` to apply it at system-wide or `~/.local/share/themes/` to apply only for your user. Now, go to the **App Grid** or press **Super** key two times, and search for **GNOME Tweaks** or **Tweaks**, usually it is inside the **Utilities** group and launch it. + +When the GNOME Tweaks is opened, move to **Appearance** tab and select your theme on **Shell** (for top bar) and **Legacy Applications** (for GTK windows) fields. + +![GNOME Tweaks GTK](@assets/images/gnome-custom-theme.png) + +You can apply an theme also by terminal by running: +``` +gsettings set org.gnome.desktop.interface gtk-theme +gsettings set org.gnome.desktop.wm.preferences theme +gsettings set org.gnome.shell.extensions.user-theme name +``` +The theme folder must always be stored in `/usr/share/themes/` or `~/.local/share/themes/` + +If you wish to apply one of the complete themes prebuilt for Athena OS, you can use **athena-theme-tweak** and using the **-t** parameter. Here the output of the help command to show how Athena Theme Tweak must be used: +``` +List of arguments: + +-b, --browser set the current browser logo in Red Team menu +-c, --colored let's give some random colored output +-e, --emulator specify a terminal emulator to be set [alacritty|cool-retro-term|foot|gnome-terminal|kitty|konsole|urxvt|xterm] +-h, --help show this help message and exit +-l, --list list all available Athena themes +-t, --theme specify an Athena theme to be set [AkameGaKill|BlueEyesSamurai|Graphite|CyborgGruvbox|SweetDark|XXE] + + +Usage Examples: +athena-theme-tweak -l +athena-theme-tweak -e alacritty +athena-theme-tweak -t BlueEyesSamurai +athena-theme-tweak -b +``` +Once applied the new theme, if you are on Xorg, press **ALT + F2**, then type **r** and press **Enter** for restarting GNOME Shell and close and reopen the terminal. If you are on Wayland, logout or reboot the system. + +### Customize Fonts + +Usually the customization of fonts could be application-specific (for example for a terminal). By GNOME Tweaks, you can try to set your preferred font. Open GNOME Tweaks and move to **Fonts** section. + +![GNOME Fonts](@assets/images/gnome-custom-fonts.png) + +### GNOME Extensions + +In Athena OS, GNOME leverages on different GNOME Extensions that can be customized as you wish. Their settings can be accessed by clicking on **Logo Menu** on top-left in the top bar and then on **Extensions** or by the **App Grid** and search for **Extensions**. The Extensions window will list all the enabled and disabled GNOME extensions, and their settings can be managed by clicking on the related **Settings** button. + +![GNOME Extensions](@assets/images/gnome-custom-extensions.png) + +#### AppIndicator + +It shows tray icons on the top bar for supported running applications. + +![AppIndicator Settings](@assets/images/gnome-custom-appindicator.png) + +#### Arc Menu + +A highly-customizable application menu. + +![GNOME Arc Menu](@assets/images/gnome-arcmenu.png) + +By its settings, you can set several tweaks and change menu layout to make it like KDE, GNOME, XFCE menus and others. + +#### Desktop NG Icons + +This extension shows icons on desktop. You can customize its settings as you prefer. + +![Desktop NG Icons Settings](@assets/images/gnome-custom-desktopicons.png) + +#### Fly-Pie + +It is the base of [PWNage Menu](/en/resources/pwnage-menu/), [Blue Team Menu](/en/resources/blueteam-menu/) and [Red Team Menu](/en/resources/redteam-menu/). + +![Red Team Menu](@assets/images/redteam-menu.png) + +You can customize them or adding a new circular menu by accessing to its settings. + +![FlyPie Settings](@assets/images/gnome-custom-flypie.png) + +#### Logo Menu + +The top bar is characterized by a Linux logo icon on its left side. + +![GNOME Logo Menu](@assets/images/gnome-logomenu.png) + +You can customize it by accessing to its settings. + +![GNOME Logo Menu Settings](@assets/images/gnome-custom-logomenu.png) + +#### Top Bar Organizer + +It allows you to organize the position of the elements on the top bar. If you would like to change their position, just access to its settings. + +![Top Bar Organizer Settings](@assets/images/gnome-custom-topbarorganizer.png) + +#### Ubuntu Dock + +It is the base of [Payload to Dock](en/resources/payload-dock/). You can customize it by pinning and unpinning applications or changing its style by its settings. + +![Ubuntu Dock Settings](@assets/images/gnome-custom-dock.png) + +#### Vitals + +It monitors the physical parameters and resources of your system in a dynamic manner. You are free to customize it as you wish by its settings. + +![Vitals Settings](@assets/images/gnome-custom-vitals.png) + ## Keybindings Here are reported some useful **keybindings** set by default in Athena OS GNOME. diff --git a/src/content/docs/en/configuration/hyprland.mdx b/src/content/docs/en/configuration/hyprland.mdx index ee8e9f2..82c64a3 100644 --- a/src/content/docs/en/configuration/hyprland.mdx +++ b/src/content/docs/en/configuration/hyprland.mdx @@ -92,11 +92,39 @@ Edit the timeout value to change the trigger of lock screen and system suspend. At the end, reboot. -## Keybindings +## Customization + +At any time you can choose to customize the current environment or to use a different theme. + +### Customize Environment + +Hyprland leverages on several files for applying its current theme. These files are distributed mainly between: +* **~/.config/hypr**: containing all Hyprland configuration files (as keybindings, startup applications, background) +* **~/.config/eww**: containing all eww configuration files (as top bar, OSettings, ONotify) +* **~/.local/bin**: containing binaries used for this theme +* **~/.local/share**: containing icon theme and font + +Files in **~/.config/hypr** that you can customize are: +* **env.conf**: define environment variables to be used in Hyprland +* **execs.conf**: define the processes to start at Hyprland startup +* **keybindings.conf**: define the keybindings for launching applications and actions +* **hyprland.conf**: define several settings for Hyprland environment and invoke the previous configuration files above + +Customize them according to your needs. + +If you wish to change the Desktop background, rename your image as **wallpaper** and just replace **~/.config/eww/images/wallpaper/wallpaper** by your image file. + +### Customize Theme + +If you would like to change the entire theme of Hyprland and applying a different one, you need to search for different. Usually, Hyprland themes are distributed as **dotfiles**. Dotfiles are named in this manner because they are the usual folder in your home directory that start with **.** in their name. So, a Hyprland theme typically consists of a **.config** and **.local** folders, but they could have also more of them. + +For applying an Hyprland theme, you must copy the content of these folders in the related **dot folders** inside your home directory. If there is no error in Hyprland configuration, the theme should be applied automatically. + +### Keybindings In order to help you and not getting crazy, here are reported the **main keybindings** set by default in Athena OS Hyprland. -### Applications +#### Applications | Keybind | Description | | ------- | ----------- | @@ -106,7 +134,7 @@ In order to help you and not getting crazy, here are reported the **main keybind | **Super + W** | Open the Browser | | **Super + A** | Open ArmCord as Discord client | -### Actions +#### Actions | Keybind | Description | | ------- | ----------- | @@ -129,7 +157,7 @@ In order to help you and not getting crazy, here are reported the **main keybind | **Super + CTRL + TAB** | Toggle Compact Mode | | **Super + ALT + W** | Toggle Window Mode | -### Windows and Workspaces +#### Windows and Workspaces | Keybind | Description | | ------- | ----------- | diff --git a/src/content/docs/en/customization/gnome.mdx b/src/content/docs/en/customization/gnome.mdx deleted file mode 100644 index efa4c71..0000000 --- a/src/content/docs/en/customization/gnome.mdx +++ /dev/null @@ -1,181 +0,0 @@ ---- -title: Customizing GNOME -description: How to cuztomize GNOME environment in Athena OS. ---- -import ImageComponent from "@components/ImageComponent.astro"; -import ThemedImage from '@components/ThemedImage.astro'; - -I you wish to change some GNOME elements in Athena OS, you can follow this guide to get the right steps and transform Athena according to your taste. - -GNOME is composed of several resources and we will discuss each one of them in order to tweak it as possible. - -## Customize Background - -Backgrounds are stored in `/usr/share/backgrounds/default/` folder. - -If you wish to change only the background, you can do it by different ways. - -The first one is to go to the top-right **power button** -> **gear icon** -> the Settings window appears -> **Appearance** -> click on **Add Picture...** and select your favourite background. - -![GNOME Settings Background](@assets/images/gnome-custom-background.png) - -Here you can change also if applying a light or dark theme. - -Another method is to use **GNOME Tweaks**. Go to the **App Grid** or press **Super** key two times, and search for **GNOME Tweaks** or **Tweaks**, usually it is inside the **Utilities** group and launch it. - -When the GNOME Tweaks is opened, move to **Appearance** tab and tweak your image and its adjustment under the **Background** section. - -![GNOME Tweaks Background](@assets/images/gnome-custom-tweaks-background.png) - -An additional method is by terminal. Run: -``` -gsettings set org.gnome.desktop.background picture-uri-dark background.png -gsettings set org.gnome.desktop.background picture-options stretched -``` -**stretched** is used to adjust the image in order to fill the entire screen. - -:::tip -If you are using a dark theme, use **picture-uri-dark**. If you are using a light theme, replace **picture-uri-dark** by **picture-uri** parameter. -::: - -## Customize Mouse Cursor - -If you wish to customize your **mouse pointer**, download one mouse cursor theme. Look at [GNOME Look](https://www.gnome-look.org/) and select **Cursors** category. - -Once downloaded, place the cursor folder in `/usr/share/icons/` to apply it at system-wide or `~/.local/share/icons/` to apply only for your user. Now, go to the **App Grid** or press **Super** key two times, and search for **GNOME Tweaks** or **Tweaks**, usually it is inside the **Utilities** group and launch it. - -When the GNOME Tweaks is opened, move to **Appearance** tab and select your cursor theme on **Cursor** field. - -![GNOME Tweaks Cursor](@assets/images/gnome-custom-cursor.png) - -You can apply a cursor theme also by terminal by running: -``` -gsettings set org.gnome.desktop.interface cursor-theme -``` -The cursor theme folder must always be stored in `/usr/share/icons/` or `~/.local/share/icons/` - -## Customize Icons - -If you wish to customize the **icon theme**, download one of it. Look at [GNOME Look](https://www.gnome-look.org/) and select **Full Icon Themes** category. - -Once downloaded, place the icon folder in `/usr/share/icons/` to apply it at system-wide or `~/.local/share/icons/` to apply only for your user. Now, go to the **App Grid** or press **Super** key two times, and search for **GNOME Tweaks** or **Tweaks**, usually it is inside the **Utilities** group and launch it. - -When the GNOME Tweaks is opened, move to **Appearance** tab and select your icon theme on **Icons** field. - -![GNOME Tweaks Icons](@assets/images/gnome-custom-icons.png) - -You can apply an icon theme also by terminal by running: -``` -gsettings set org.gnome.desktop.interface icon-theme -``` -The icon theme folder must always be stored in `/usr/share/icons/` or `~/.local/share/icons/` - -## Customize Theme - -If you wish to change the theme of top bar and the GTK windows, download one of it. Look at [GNOME Look](https://www.gnome-look.org/) and select **GTK3/4 Themes** category. Download only themes that are compatible with the actual installed version of GNOME. - -Once downloaded, place the theme folder in `/usr/share/themes/` to apply it at system-wide or `~/.local/share/themes/` to apply only for your user. Now, go to the **App Grid** or press **Super** key two times, and search for **GNOME Tweaks** or **Tweaks**, usually it is inside the **Utilities** group and launch it. - -When the GNOME Tweaks is opened, move to **Appearance** tab and select your theme on **Shell** (for top bar) and **Legacy Applications** (for GTK windows) fields. - -![GNOME Tweaks GTK](@assets/images/gnome-custom-theme.png) - -You can apply an theme also by terminal by running: -``` -gsettings set org.gnome.desktop.interface gtk-theme -gsettings set org.gnome.desktop.wm.preferences theme -gsettings set org.gnome.shell.extensions.user-theme name -``` -The theme folder must always be stored in `/usr/share/themes/` or `~/.local/share/themes/` - -If you wish to apply one of the complete themes prebuilt for Athena OS, you can use **athena-theme-tweak** and using the **-t** parameter. Here the output of the help command to show how Athena Theme Tweak must be used: -``` -List of arguments: - --b, --browser set the current browser logo in Red Team menu --c, --colored let's give some random colored output --e, --emulator specify a terminal emulator to be set [alacritty|cool-retro-term|foot|gnome-terminal|kitty|konsole|urxvt|xterm] --h, --help show this help message and exit --l, --list list all available Athena themes --t, --theme specify an Athena theme to be set [AkameGaKill|BlueEyesSamurai|Graphite|CyborgGruvbox|SweetDark|XXE] - - -Usage Examples: -athena-theme-tweak -l -athena-theme-tweak -e alacritty -athena-theme-tweak -t BlueEyesSamurai -athena-theme-tweak -b -``` -Once applied the new theme, if you are on Xorg, press **ALT + F2**, then type **r** and press **Enter** for restarting GNOME Shell and close and reopen the terminal. If you are on Wayland, logout or reboot the system. - -## Customize Fonts - -Usually the customization of fonts could be application-specific (for example for a terminal). By GNOME Tweaks, you can try to set your preferred font. Open GNOME Tweaks and move to **Fonts** section. - -![GNOME Fonts](@assets/images/gnome-custom-fonts.png) - -## GNOME Extensions - -In Athena OS, GNOME leverages on different GNOME Extensions that can be customized as you wish. Their settings can be accessed by clicking on **Logo Menu** on top-left in the top bar and then on **Extensions** or by the **App Grid** and search for **Extensions**. The Extensions window will list all the enabled and disabled GNOME extensions, and their settings can be managed by clicking on the related **Settings** button. - -![GNOME Extensions](@assets/images/gnome-custom-extensions.png) - -### AppIndicator - -It shows tray icons on the top bar for supported running applications. - -![AppIndicator Settings](@assets/images/gnome-custom-appindicator.png) - -### Arc Menu - -A highly-customizable application menu. - -![GNOME Arc Menu](@assets/images/gnome-arcmenu.png) - -By its settings, you can set several tweaks and change menu layout to make it like KDE, GNOME, XFCE menus and others. - -### Desktop NG Icons - -This extension shows icons on desktop. You can customize its settings as you prefer. - -![Desktop NG Icons Settings](@assets/images/gnome-custom-desktopicons.png) - -### Fly-Pie - -It is the base of [PWNage Menu](/en/resources/pwnage-menu/), [Blue Team Menu](/en/resources/blueteam-menu/) and [Red Team Menu](/en/resources/redteam-menu/). - -![Red Team Menu](@assets/images/redteam-menu.png) - -You can customize them or adding a new circular menu by accessing to its settings. - -![FlyPie Settings](@assets/images/gnome-custom-flypie.png) - -### Logo Menu - -The top bar is characterized by a Linux logo icon on its left side. - -![GNOME Logo Menu](@assets/images/gnome-logomenu.png) - -You can customize it by accessing to its settings. - -![GNOME Logo Menu Settings](@assets/images/gnome-custom-logomenu.png) - -### Top Bar Organizer - -It allows you to organize the position of the elements on the top bar. If you would like to change their position, just access to its settings. - -![Top Bar Organizer Settings](@assets/images/gnome-custom-topbarorganizer.png) - -### Ubuntu Dock - -It is the base of [Payload to Dock](en/resources/payload-dock/). You can customize it by pinning and unpinning applications or changing its style by its settings. - -![Ubuntu Dock Settings](@assets/images/gnome-custom-dock.png) - -### Vitals - -It monitors the physical parameters and resources of your system in a dynamic manner. You are free to customize it as you wish by its settings. - -![Vitals Settings](@assets/images/gnome-custom-vitals.png) - - diff --git a/src/content/docs/en/customization/hyprland.mdx b/src/content/docs/en/customization/hyprland.mdx deleted file mode 100644 index 0218b6a..0000000 --- a/src/content/docs/en/customization/hyprland.mdx +++ /dev/null @@ -1,38 +0,0 @@ ---- -title: Customizing Hyprland -description: How to cuztomize Hyprland environment in Athena OS. ---- -import ImageComponent from "@components/ImageComponent.astro"; -import ThemedImage from '@components/ThemedImage.astro'; - -[Hyprland](https://wiki.archlinux.org/title/Hyprland) is a dynamic tiling Wayland compositor based on wlroots that doesn't sacrifice on its looks. - -In Athena OS, Hyprland is inspired on the wonderful work of [@end-4](https://github.com/end-4/dots-hyprland). - -At any time you can choose to customize the current environment or to use a different theme. - -## Customize Environment - -Hyprland leverages on several files for applying its current theme. These files are distributed mainly between: -* **~/.config/hypr**: containing all Hyprland configuration files (as keybindings, startup applications, background) -* **~/.config/eww**: containing all eww configuration files (as top bar, OSettings, ONotify) -* **~/.local/bin**: containing binaries used for this theme -* **~/.local/share**: containing icon theme and font - -Files in **~/.config/hypr** that you can customize are: -* **env.conf**: define environment variables to be used in Hyprland -* **execs.conf**: define the processes to start at Hyprland startup -* **keybindings.conf**: define the keybindings for launching applications and actions -* **hyprland.conf**: define several settings for Hyprland environment and invoke the previous configuration files above - -Customize them according to your needs. - -If you wish to change the Desktop background, rename your image as **wallpaper** and just replace **~/.config/eww/images/wallpaper/wallpaper** by your image file. - -## Customize Theme - -If you would like to change the entire theme of Hyprland and applying a different one, you need to search for different. Usually, Hyprland themes are distributed as **dotfiles**. Dotfiles are named in this manner because they are the usual folder in your home directory that start with **.** in their name. So, a Hyprland theme typically consists of a **.config** and **.local** folders, but they could have also more of them. - -For applying an Hyprland theme, you must copy the content of these folders in the related **dot folders** inside your home directory. If there is no error in Hyprland configuration, the theme should be applied automatically. - - \ No newline at end of file