Add rofi theme scaffolding
Themes are structured in two parts: layout and colorschemes. Both can be set independently from each other. Layouts can make use of anchored color values (@background, @background-focus,.. look at colorscheme files for all available values). Colorscheme files then translate the values into actual colorcodes. That way, the colorscheme for all layouts can be changed with one setting, or independently of each other. Layouts try to specify some often used structures for rofi menus - right now there is a horizontal list and a fullscreen options selection (which can make use of icon fonts). Any global theme changes should be done in settings.rasi. Any global function changes can still be done in config.rasi. A rofi-powermenu has been added as an example of using the theming structure. The powermenu script loads rofi with the powermenu.rasi theme enabled. The powermenu theme loads the fullscreen options layout, which in turn loads the vertical list layout, which loads settings, which sets the correct colors. Idea and original structure from: https://gitlab.com/vahnrr/rofi-menus
This commit is contained in:
parent
264e095224
commit
199fbdae4d
7 changed files with 190 additions and 5 deletions
|
@ -1,5 +1,19 @@
|
||||||
configuration {
|
configuration {
|
||||||
modi: "window,run,ssh,drun,combi,keys,calc";
|
show-icons: true;
|
||||||
|
icon-theme: "Paper";
|
||||||
|
theme: "themes/settings.rasi";
|
||||||
|
cycle: true;
|
||||||
|
hide-scrollbar: true;
|
||||||
|
disable-history: false;
|
||||||
|
modi: "drun";
|
||||||
|
display-drun: "apps";
|
||||||
|
columns: 2;
|
||||||
|
pid: "/run/user/1000/rofi.pid";
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ALL OPTIONS */
|
||||||
|
/* configuration { */
|
||||||
|
/* modi: "window,run,ssh,drun,combi,keys,calc"; */
|
||||||
/* width: 50;*/
|
/* width: 50;*/
|
||||||
/* lines: 15;*/
|
/* lines: 15;*/
|
||||||
/* columns: 1;*/
|
/* columns: 1;*/
|
||||||
|
@ -43,7 +57,7 @@ configuration {
|
||||||
/* filter: ;*/
|
/* filter: ;*/
|
||||||
/* separator-style: "dash";*/
|
/* separator-style: "dash";*/
|
||||||
/* hide-scrollbar: false;*/
|
/* hide-scrollbar: false;*/
|
||||||
fullscreen: false;
|
/* fullscreen: false; */
|
||||||
/* fake-transparency: false;*/
|
/* fake-transparency: false;*/
|
||||||
/* dpi: -1;*/
|
/* dpi: -1;*/
|
||||||
/* threads: 0;*/
|
/* threads: 0;*/
|
||||||
|
@ -53,7 +67,7 @@ configuration {
|
||||||
/* window-format: "{w} {c} {t}";*/
|
/* window-format: "{w} {c} {t}";*/
|
||||||
/* click-to-exit: true;*/
|
/* click-to-exit: true;*/
|
||||||
/* show-match: true;*/
|
/* show-match: true;*/
|
||||||
theme: "dmenu";
|
/* theme: "dmenu"; */
|
||||||
/* color-normal: ;*/
|
/* color-normal: ;*/
|
||||||
/* color-urgent: ;*/
|
/* color-urgent: ;*/
|
||||||
/* color-active: ;*/
|
/* color-active: ;*/
|
||||||
|
@ -62,7 +76,7 @@ configuration {
|
||||||
/* combi-hide-mode-prefix: false;*/
|
/* combi-hide-mode-prefix: false;*/
|
||||||
/* matching-negate-char: '-' /* unsupported */;*/
|
/* matching-negate-char: '-' /* unsupported */;*/
|
||||||
/* cache-dir: ;*/
|
/* cache-dir: ;*/
|
||||||
pid: "/run/user/1000/rofi.pid";
|
/* pid: "/run/user/1000/rofi.pid"; */
|
||||||
/* display-window: ;*/
|
/* display-window: ;*/
|
||||||
/* display-windowcd: ;*/
|
/* display-windowcd: ;*/
|
||||||
/* display-run: ;*/
|
/* display-run: ;*/
|
||||||
|
@ -143,4 +157,4 @@ configuration {
|
||||||
/* me-select-entry: "MousePrimary";*/
|
/* me-select-entry: "MousePrimary";*/
|
||||||
/* me-accept-entry: "MouseDPrimary";*/
|
/* me-accept-entry: "MouseDPrimary";*/
|
||||||
/* me-accept-custom: "Control+MouseDPrimary";*/
|
/* me-accept-custom: "Control+MouseDPrimary";*/
|
||||||
}
|
/* } */
|
||||||
|
|
37
.config/rofi/modes/rofi-powermenu
Executable file
37
.config/rofi/modes/rofi-powermenu
Executable file
|
@ -0,0 +1,37 @@
|
||||||
|
#!/usr/bin/sh
|
||||||
|
|
||||||
|
rofi_command="rofi -theme themes/powermenu.rasi"
|
||||||
|
|
||||||
|
### Options ###
|
||||||
|
power_off=""
|
||||||
|
reboot=""
|
||||||
|
lock=""
|
||||||
|
suspend_btn="鈴"
|
||||||
|
logout_btn=""
|
||||||
|
# Variable passed to rofi
|
||||||
|
|
||||||
|
chosen="$(printf "%s\n%s\n%s\n%s\n%s" "$power_off" "$reboot" "$lock" "$suspend_btn" "$logout_btn" | $rofi_command -dmenu -selected-row 2)"
|
||||||
|
case $chosen in
|
||||||
|
$power_off)
|
||||||
|
printf "poweroff"
|
||||||
|
# systemctl poweroff
|
||||||
|
;;
|
||||||
|
$reboot)
|
||||||
|
printf "reboot"
|
||||||
|
# systemctl reboot
|
||||||
|
;;
|
||||||
|
$lock)
|
||||||
|
printf "lock"
|
||||||
|
# light-locker-command -l
|
||||||
|
;;
|
||||||
|
$suspend_btn)
|
||||||
|
printf "suspend"
|
||||||
|
# mpc -q pause
|
||||||
|
# amixer set Master mute
|
||||||
|
# systemctl suspend
|
||||||
|
;;
|
||||||
|
$logout_btn)
|
||||||
|
printf "logout_btn"
|
||||||
|
# i3-msg exit
|
||||||
|
;;
|
||||||
|
esac
|
11
.config/rofi/themes/colorschemes/gruvbox-dark.rasi
Normal file
11
.config/rofi/themes/colorschemes/gruvbox-dark.rasi
Normal file
|
@ -0,0 +1,11 @@
|
||||||
|
* {
|
||||||
|
accent: #83a598; // anything which should be accented
|
||||||
|
background: #282828; // rofi background color
|
||||||
|
background-nofocus: #282828;// bg of items not focused
|
||||||
|
background-focus: #1d2021; // bg of item focused
|
||||||
|
foreground: #ebdbb2; // rofi foreground color
|
||||||
|
foreground-nofocus: #ebdbb2;// fg of items not focused
|
||||||
|
foreground-focus: #83a598; // fg of items focused
|
||||||
|
on: #83a598; // color to signify something is turned on
|
||||||
|
off: #fb4934; // color to signify something is turned off
|
||||||
|
}
|
28
.config/rofi/themes/layouts/list-horizontal.rasi
Normal file
28
.config/rofi/themes/layouts/list-horizontal.rasi
Normal file
|
@ -0,0 +1,28 @@
|
||||||
|
/**
|
||||||
|
* Settings for a general purpose
|
||||||
|
* horizontal options list menu:
|
||||||
|
*/
|
||||||
|
@import "../settings.rasi"
|
||||||
|
* {
|
||||||
|
background-color: @background;
|
||||||
|
text-color: @foreground;
|
||||||
|
font: @text-font;
|
||||||
|
}
|
||||||
|
#window {
|
||||||
|
children: [ horibox ];
|
||||||
|
}
|
||||||
|
#horibox {
|
||||||
|
children: [ listview ];
|
||||||
|
}
|
||||||
|
#listview {
|
||||||
|
layout: horizontal;
|
||||||
|
}
|
||||||
|
#element {
|
||||||
|
padding: @option-element-padding;
|
||||||
|
background-color: @background-nofocus;
|
||||||
|
text-color: @foreground-nofocus;
|
||||||
|
}
|
||||||
|
#element.selected {
|
||||||
|
background-color: @background-focus;
|
||||||
|
text-color: @foreground-focus;
|
||||||
|
}
|
|
@ -0,0 +1,41 @@
|
||||||
|
/**
|
||||||
|
* Settings for a general purpose full screen
|
||||||
|
* horizontal options screen. The options will
|
||||||
|
* make use of icons.
|
||||||
|
* Px values for 1920x1080 screens.
|
||||||
|
*
|
||||||
|
* Depending on how many options your list
|
||||||
|
* should display, choose the corresponding padding and spacing
|
||||||
|
* for window and listview from below and add it to your
|
||||||
|
* specific theme.
|
||||||
|
*/
|
||||||
|
|
||||||
|
@import "list-horizontal.rasi"
|
||||||
|
* {
|
||||||
|
/* General */
|
||||||
|
icon-font: "Iosevka 48";
|
||||||
|
font: @icon-font;
|
||||||
|
inputbar-margin: 4px 4px;
|
||||||
|
prompt-padding: 16px 20px;
|
||||||
|
entry-padding: 18px 16px 16px 0px;
|
||||||
|
list-element-padding: 20px;
|
||||||
|
list-element-margin: @inputbar-margin;
|
||||||
|
list-element-border: 0px 0px 0px 8px;
|
||||||
|
list-8-window-padding: 219px 360px;
|
||||||
|
/**
|
||||||
|
* Values bellow are 'no-padding' ones for Iosevka icons in this size.
|
||||||
|
* If you use a different sized font, you will have to find your own
|
||||||
|
* padding and spacing values.
|
||||||
|
* -12px 0px -19px -96px */
|
||||||
|
option-element-padding: 88px 100px 81px 4px;
|
||||||
|
option-3-window-padding: 415px 446px;
|
||||||
|
option-3-listview-spacing: 140px;
|
||||||
|
option-5-window-padding: 415px 183px;
|
||||||
|
option-5-listview-spacing: 77px;
|
||||||
|
option-6-listview-spacing: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#window {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
14
.config/rofi/themes/powermenu.rasi
Normal file
14
.config/rofi/themes/powermenu.rasi
Normal file
|
@ -0,0 +1,14 @@
|
||||||
|
/**
|
||||||
|
* This theme is intended for a 5 items wide menu on a 1920x1080 pixels resolution.
|
||||||
|
* You may have to tweak values such as the window padding if you have a different resolution.
|
||||||
|
*/
|
||||||
|
|
||||||
|
@import "layouts/options-horizontal-fullscreen.rasi"
|
||||||
|
|
||||||
|
#window {
|
||||||
|
padding: @option-5-window-padding;
|
||||||
|
}
|
||||||
|
#listview {
|
||||||
|
spacing: @option-5-listview-spacing;
|
||||||
|
lines: 5;
|
||||||
|
}
|
40
.config/rofi/themes/settings.rasi
Normal file
40
.config/rofi/themes/settings.rasi
Normal file
|
@ -0,0 +1,40 @@
|
||||||
|
/**
|
||||||
|
* Changing this file allows all other theme files to be affected since
|
||||||
|
* they all get their default settings from here.
|
||||||
|
* Idea cribbed from: https://gitlab.com/vahnrr/rofi-menus
|
||||||
|
*
|
||||||
|
* Structure (what goes where) should be set in specific theme files, which pull from more general layouts/ files
|
||||||
|
* Color (what has which accent) can be added with colorschemes/ files, and then set globally from here
|
||||||
|
*
|
||||||
|
* if a layout needs a *very* specific colorscheme it can also be set in the layouts/theme files
|
||||||
|
* but try to keep the two separated as much as possible, so we can adjust global options easily from here
|
||||||
|
*/
|
||||||
|
|
||||||
|
@import "colorschemes/gruvbox-dark.rasi"
|
||||||
|
|
||||||
|
* {
|
||||||
|
/* General */
|
||||||
|
text-font: "Iosevka Nerd Font";
|
||||||
|
text-font-mono: "Iosevka Nerd Font";
|
||||||
|
icon-font: "Iosevka Nerd Font";
|
||||||
|
icon-font-small: "Iosevka Nerd Font";
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* In case rofi gets started without a specific theme
|
||||||
|
* try to match the imported theme colors as best we
|
||||||
|
* can to any general purpose.
|
||||||
|
*/
|
||||||
|
* {
|
||||||
|
background-color: @background;
|
||||||
|
text-color: @foreground;
|
||||||
|
font: @text-font;
|
||||||
|
}
|
||||||
|
#element {
|
||||||
|
background-color: @background-nofocus;
|
||||||
|
text-color: @foreground-nofocus;
|
||||||
|
}
|
||||||
|
#element.selected {
|
||||||
|
background-color: @background-focus;
|
||||||
|
text-color: @foreground-focus;
|
||||||
|
}
|
Loading…
Reference in a new issue