In this post, we will turn
into this
This guide will mostly about awm's widgeting system, if you wanna learn about other things about awm, check out this guide by Stella. I am assuming you are using awesome-git and know thebasics of lua. The code for this can be found in this repo. Let's just start with no bullshit.
Quick Setup
- Ensure you are using awesome-git.
- First remove the default rc.lua and replace it with this modularized config.
- Add your wallpaper to theme/wall.jpg
- Edit the contents of theme/init.lua
01-- Theme handling library
02local beautiful = require('beautiful')
03-- Standard awesome library
04local gears = require('gears')
05
06local theme = {}
07theme.wallpaper = gears.filesystem.get_configuration_dir() .. 'theme/wall.jpg'
08
09-- Themes define colors, icons, font and wallpapers.
10beautiful.init(gears.filesystem.get_themes_dir() .. 'default/theme.lua')
11beautiful.init(theme)
- Add in colors, fonts and some gaps
01local theme = {}
02
03theme.sans = "Lexend"
04theme.font = "Lexend"
05theme.mono = "Iosevka Nerd Font"
06
07theme.bg = "#181818"
08theme.altbg = "#212121"
09theme.fg = "#f8f8f8"
10theme.comment = "#585858"
11theme.red = "#ab4642"
12theme.blue = "#7cafc2"
13theme.green = "#a1b56c"
14theme.yellow = "#f7ca88"
15theme.magenta = "#ba8baf"
16theme.cyan = "#86c1b9"
17
18theme.useless_gap = 5
- Create a helpers.lua file
01local beautiful = require("beautiful")
02local gears = require("gears")
03
04local helpers = {}
05
06helpers.rrect = function(radius)
07 radius = radius or dpi(4)
08 return function(cr, width, height)
09 gears.shape.rounded_rect(cr, width, height, radius)
10 end
11end
12
13helpers.addHover = function(element, bg, hbg)
14 element:connect_signal('mouse::enter', function(self)
15 self.bg = hbg
16 end)
17 element:connect_signal('mouse::leave', function(self)
18 self.bg = bg
19 end)
20end
21
22helpers.colorizeText = function(txt, fg)
23 if fg == "" then
24 fg = "#ffffff"
25 end
26
27 return "<span foreground='" .. fg .. "'>" .. txt .. "</span>"
28end
29
30return helpers
And now if you will restart awm, you will get something bland and tiny like this
Looks bad, but a perfect canvas for us to work on.
Pro tip: Testing
If you do not want to restart your wm everytime to test a change, you can use Xephyr to test it. According to the arch wiki: 'Xephyr is a nested X server that runs as an X application.'
1$ Xephyr -br -ac -noreset -screen 800x600 :1
2$ DISPLAY=:1 awesome
The Bar
First lets remove everything from bar and delete every file in ui/wibar/module except ui/wibar/module/init.lua
01 -- ...
02 s.mypromptbox = awful.widget.prompt() -- Create a promptbox.
03
04 -- Create the wibox
05 s.mywibox = awful.wibar({
06 position = 'top',
07 height = 50,
08 -- width = 1920, -- it will automatically strech
09 screen = s,
10 widget = {
11 layout = wibox.layout.align.horizontal,
12 {
13 widget = wibox.container.place,
14 valign = "center",
15 },
16 nil,
17 {
18 widget = wibox.container.place,
19 valign = "center",
20 },
21 {
22 layout = wibox.layout.fixed.horizontal,
23 module.launcher(),
24 module.taglist(s),
25 s.mypromptbox
26 },
27 -- Middle widgets.
28 module.tasklist(s),
29 -- Right widgets.
30 {
31 layout = wibox.layout.fixed.horizontal,
32 awful.widget.keyboardlayout(), -- Keyboard map indicator and switcher.
33 wibox.widget.systray(),
34 wibox.widget.textclock(), -- Create a textclock widget.
35 module.layoutbox(s)
36 }
37 }
38 })
`wibox.container.place` is used to set the `valign` and `halign` properties on widgets. `halign` can be set to left, center and right while `valign` can be set to top, bottom and center.
wibox.layout.align
takes in exactly 3 elements, first for the left, then the center and then the right, as we do not want anything in the center of the bar, we will put nil
there.
We have also increased that height of the r to 50px.
```lua title="ui/wibar/module/init.lua" del={4-7} -- Return a table containing all r modules, with a name attached -- to each. return { launcher = require(... .. '.launcher'), taglist = require(... .. '.taglist'), tasklist = require(... .. '.tasklist'), layoutbox = require(... .. '.layoutbox') } ```
Right Side
First of all, let's create a module for showing time in the bar. Let us create the file
01local wibox = require("wibox")
02local beautiful = require("beautiful")
03local helpers = require("helpers")
04
05return wibox.widget {
06 {
07 font = beautiful.sans .. '12',
08 format = "%I : %M",
09 widget = wibox.widget.textclock
10 },
11 widget = wibox.container.place,
12 valign = "center"
13}
Awm has a built in widget called wibox.widget.textclock
to display the time. Now:
1return {
2 time = require(... .. ".time")
3}
And the last step to add it to the bar.
01 widget = {
02 layout = wibox.layout.align.horizontal,
03 {
04 widget = wibox.container.place,
05 valign = "center",
06 },
07 nil,
08 {
09 {
10 {
11 module.time,
12 spacing = 10,
13 layout = wibox.layout.fixed.horizontal,
14 },
15 widget = wibox.container.place,
16 valign = "center",
17 },
18 widget = wibox.container.margin,
19 margins = {
20 top = 3,
21 bottom = 3,
22 left = 15,
23 right = 15,
24 },
25 },
26 }
27
As I will have multiple modules on the right side of my bar, I have wrapped it in a wibox.layout.fixed.horizontal
, which is essentially a horizontal line, also I have wrapped the entire right section in a wibox.container.margin
to the section some margin.
Test/Restart awm to see a tiny clock on the right.
Making the clock look better.
Well we got our clock, but it still looks a bit boring. So let us make the hour bolder and blue in color and also give it a background color as well.
For this we will use the helpers.colorizeText()
from our helper functions. It takes the text and a color.
1local time = wibox.widget {
2 {
3 font = beautiful.sans .. " Light 14",
4 format = "<b>" .. helpers.colorizeText("%I", beautiful.blue) .. "</b>" .. " : " .. helpers.colorizeText("%M", beautiful.fg),
5 widget = wibox.widget.textclock
6 },
7 widget = wibox.container.place,
8 valign = "center"
9}
format in textclock and markup in textbox allows the use of Pango markup so, <b> and < /b> gives bold text.
Now modifying what we return we get:
01return wibox.widget {
02 {
03 {
04 time,
05 spacing = 15,
06 layout = wibox.layout.fixed.horizontal,
07 },
08 widget = wibox.container.margin,
09 margins = {
10 top = 5,
11 left = 10,
12 bottom = 5,
13 right = 10,
14 },
15 },
16 shape = helpers.rrect(3),
17 widget = wibox.container.background,
18 bg = beautiful.altbg,
19}
This is just a background widget, which uses one of our helper functions to give a suble rounded rectangle. Inside this background widget, we have a container for margin, which is 5, and inside the margin container their is the time which is placed in a horizontal layout.
Wifi and Bluetooth Symbols
First, install svg icons of wifi connected, disconnected and bluetooh connected and disconnected from any icon set you want. My choice is Phosphor Icons. Now we will define them in the theme/init.lua
file and also recolour them to white.
01theme.wallpaper = gears.filesystem.get_configuration_dir() .. 'theme/wall.jpg'
02
03theme.iconpath = gears.filesystem.get_configuration_dir() .. "theme/icons/"
04
05theme.wifi_connected = gears.color.recolor_image(theme.iconpath .. "wifi-connected.svg", theme.fg)
06theme.wifi_disconnected = gears.color.recolor_image(theme.iconpath .. "wifi-disconnected.svg", theme.comment)
07
08theme.bluetooth_on = gears.color.recolor_image(theme.iconpath .. "bluetooth-on.svg", theme.fg)
09theme.bluetooth_off = gears.color.recolor_image(theme.iconpath .. "bluetooth-off.svg", theme.comment)
10
11-- Themes define colors, icons, font and wallpapers.
12beautiful.init(theme)
Before using these images, we need some sort of signal to indicate whether wifi/blueooth is on or not. Here is how to make one for wifi.
01local awful = require('awful')
02local gears = require('gears')
03
04-- Network Fetching and Signal Emitting
05---------------------------------------
06local function emit_network_status()
07 awful.spawn.easy_async_with_shell(
08 "bash -c 'nmcli networking connectivity check'", function(stdout)
09 local status = not stdout:match("none") -- boolean
10 awesome.emit_signal('signal::network', status)
11 end)
12end
13
14-- Refreshing
15-------------
16gears.timer {
17 timeout = 2,
18 call_now = true,
19 autostart = true,
20 callback = function()
21 emit_network_status()
22 end
23}
The code above is fairly easy to understand, every 2 seconds, a function is called which executes the following process bash -c 'nmcli networking connectivity check'
. If the output of the command does not has none
in it, it emits a signal called signal::network
with the value true, if the output of the command has none
in it, the value is false.
Now lets make one for bluetooth
01local awful = require('awful')
02local gears = require('gears')
03
04local function emit_bluetooth_status()
05 awful.spawn.easy_async_with_shell(
06 "bash -c 'bluetoothctl show | grep -i powered:'", function(stdout)
07 local status = stdout:match("yes") -- boolean
08 awesome.emit_signal('signal::bluetooth', status)
09 end)
10end
11
12gears.timer {
13 timeout = 2,
14 call_now = true,
15 autostart = true,
16 callback = function()
17 emit_bluetooth_status()
18 end
19}
And now to call them in the main file
01-- Allows all signals to be connected and/or emitted.
02return {
03 client = require(... .. '.client'),
04 -- NOTE: The `tag` file must be loaded before the `screen` one so that
05 -- the correct layouts defined in `config.user` are appended to the tags
06 -- upon creation.
07 tag = require(... .. '.tag'),
08 screen = require(... .. '.screen'),
09 wifi = require(... .. '.wifi'),
10 bluetooth = require(... .. '.bluetooth'),
11}
We can now finally start creating the actual widgets. Let's create two image boxes
01local wifi = wibox.widget {
02 {
03 forced_height = 18,
04 forced_width = 18,
05 image = beautiful.wifi_connected,
06 widget = wibox.widget.imagebox,
07 id = "image",
08 },
09 widget = wibox.container.place,
10 valign = "center",
11}
12
13local bluetooth = wibox.widget {
14 {
15 forced_height = 18,
16 forced_width = 18,
17 image = beautiful.bluetooth_on,
18 widget = wibox.widget.imagebox,
19 id = "image",
20 },
21 widget = wibox.container.place,
22 valign = "center",
23}
You will notice their is an id
prop in the imagebox widget in both of them, we will see in the next step as to how to use them to change the image. Now we would like to connect to the signals we just made so to change the image. For that we would use awesome.connect_signal
.
01awesome.connect_signal("signal::network", function(val)
02 if val then
03 wifi:get_children_by_id("image")[1].image = beautiful.wifi_connected
04 else
05 wifi:get_children_by_id("image")[1].image = beautiful.wifi_disconnected
06 end
07end)
08
09awesome.connect_signal("signal::bluetooth", function(val)
10 if val then
11 bluetooth:get_children_by_id("image")[1].image = beautiful.bluetooth_on
12 else
13 bluetooth:get_children_by_id("image")[1].image = beautiful.bluetooth_off
14 end
15end)
We cannot directly access the imagebox element of wifi/bluetooth, to do that we need to use get_children_by_id(id)
which returns an array of all elements with that id.
Progress bars
The next thing we will be making would be a ttery and a volume indicator. Let us create a new file for that called ui/wibar/module/progress.lua
and also include it in the module/init.lua
file
1return {
2 time = require(... .. ".time"),
3 progress = require(... .. ".progress"),
4 }
We should also just create a sic progress file and we will add elements in them later.
01local wibox = require("wibox")
02local helpers = require("helpers")
03local beautiful = require("beautiful")
04local awful = require("awful")
05
06return wibox.widget {
07 {
08 spacing = 20,
09 layout = wibox.layout.fixed.horizontal,
10 },
11 widget = wibox.container.place,
12 valign = "center",
13}
and then also add this to the bar.
1 -- ...
2 {
3 module.time,
4 module.progress,
5 spacing = 10,
6 layout = wibox.layout.fixed.horizontal,
7 },
8 -- ...
Services for Battery and Volume
For battery, we will read the file /sys/class/power_supply/BAT0/capacity
to get the charge of laptop and /sys/class/power_supply/BAT0/status
to get the status of charging of laptop. And then we refresh it like the other signals with gears.timer
.
01local battery_script =
02"bash -c 'echo $(cat /sys/class/power_supply/BAT0/capacity) echo $(cat /sys/class/power_supply/BAT0/status)'"
03
04local function battery_emit()
05 awful.spawn.easy_async_with_shell(
06 ttery_script, function(stdout)
07 local level = string.match(stdout:match('(%d+)'), '(%d+)')
08 local level_int = tonumber(level) -- integer
09 local power = not stdout:match('Discharging') -- boolean
10 awesome.emit_signal('signal::ttery', level_int, power)
11 end)
12end
13
14-- Refreshing
15-------------
16gears.timer {
17 timeout = 20,
18 call_now = true,
19 autostart = true,
20 callback = function()
21 battery_emit()
22 end
23}
For volume, I will be using the program pamixer to get the level. You are free to use your own program.
01local awful = require('awful')
02local gears = require('gears')
03
04local function volume_emit()
05 awful.spawn.easy_async_with_shell(
06 "sh -c 'pamixer --get-volume'", function(stdout)
07 local volume_int = tonumber(stdout) -- integer
08 awesome.emit_signal('signal::volume', volume_int) -- integer
09 end)
10end
11
12gears.timer {
13 timeout = 1,
14 call_now = true,
15 autostart = true,
16 callback = function()
17 volume_emit()
18 end
19}
Finally, inlclude these in your init.lua
1 -- ...
2 wifi = require(... .. '.wifi'),
3 bluetooth = require(... .. '.bluetooth'),
4 battery = require(... .. '.battery'),
5 volume = require(... .. '.volume'),
6}
Using the services
For battery we will use the in builtin widget wibox.widget.progressbar
. If we closely see the shape of your battery, it is actually a horizontal layout with progress as the battery and a little stick as the bulb. To recreate that in awm, we can do
01local battery = wibox.widget {
02 {
03 {
04 bg = beautiful.fg .. "99",
05 forced_height = 10,
06 forced_width = 2,
07 shape = helpers.rrect(10),
08 widget = wibox.container.background,
09 },
10 widget = wibox.container.place,
11 valign = "center",
12 },
13 {
14 {
15 max_value = 100,
16 value = 69,
17 id = "prog",
18 forced_height = 22,
19 forced_width = 45,
20 paddings = 3,
21 border_color = beautiful.fg .. "99",
22 background_color = beautiful.altbg,
23 bar_shape = helpers.rrect(3),
24 color = beautiful.green,
25 border_width = 1.25,
26 shape = helpers.rrect(5),
27 widget = wibox.widget.progressbar
28 },
29 direction = 'south',
30 layout = wibox.container.rotate,
31
32 },
33 spacing = 3,
34 layout = wibox.layout.fixed.horizontal
35}
36awesome.connect_signal("signal::battery", function(value)
37 local b = battery:get_children_by_id("prog")[1]
38 b.value = value
39end)
At this point, I think the code is self explantory. The progress bar on default goes from left to right, to make it go right to left, we use wibox.container.rotate
and set the direction to "south", whihch essentially rotates it by 180 degrees.
For volume, we will be using circular progress bars. This is also an inbuilt widget in awesome called arcchart, here is how we will implement it.
01local volume = wibox.widget {
02 {
03 max_value = 100,
04 value = 69,
05 id = "prog",
06 forced_height = 23,
07 forced_width = 23,
08 bg = beautiful.altbg,
09 bar_shape = helpers.rrect(3),
10 colors = { beautiful.blue },
11 border_width = 0,
12 thickness = 3.2,
13 shape = helpers.rrect(5),
14 widget = wibox.container.arcchart
15 },
16 widget = wibox.container.place,
17 valign = "center",
18}
19awesome.connect_signal("signal::volume", function(value)
20 local v = volume:get_children_by_id("prog")[1]
21 v.value = value
22end)
And now let us add them into the widget we return
01return wibox.widget {
02 {
03 battery,
04 volume,
05 spacing = 20,
06 layout = wibox.layout.fixed.horizontal,
07 },
08 widget = wibox.container.place,
09 valign = "center",
10}
Quick Profile Picture
Also let us add a profile picture at the end of our bar. Since we may use it multiple times on many widgets, it is best to define it in the theme itself.
1theme.wallpaper = gears.filesystem.get_configuration_dir() .. 'theme/wall.jpg'
2theme.pfp = gears.filesystem.get_configuration_dir() .. 'theme/pfp.jpeg'
3
4theme.iconpath = gears.filesystem.get_configuration_dir() .. "theme/icons/"
Let us define the widget at ui/wibar/module/profile.lua
. Here instead of shape
,we will be using clip_shape
to make our images rounded.
01local wibox = require("wibox")
02local helpers = require("helpers")
03local beautiful = require("beautiful")
04
05
06return wibox.widget {
07 {
08 forced_height = 30,
09 forced_width = 30,
10 image = beautiful.pfp,
11 clip_shape = helpers.rrect(100),
12 widget = wibox.widget.imagebox,
13 },
14 widget = wibox.container.place,
15 valign = "center",
16}
I will leave it as task for you to add it to the end of the bar. Now lets add a systray to wrap up the right side of our bar.
1local wibox = require("wibox")
2return wibox.widget {
3 {
4 base_size = 22,
5 widget = wibox.widget.systray,
6 },
7 widget = wibox.container.place,
8 valign = "center",
9}
Yup, that is basically it, it is that easy to create a systray. And from now I will leave it upto you to add these modules into the bar.
This is how out bar looks right now.
Left Side
Launcher Button
Lets create a launcher that can be later used to open the appmenu, dashboard, whatever you want. It is basically circle in a circle, To create it
01local wibox = require("wibox")
02local helpers = require("helpers")
03local beautiful = require("beautiful")
04
05return wibox.widget {
06 {
07 {
08 forced_height = 22,
09 forced_width = 22,
10 shape = helpers.rrect(100),
11 widget = wibox.container.background,
12 bg = beautiful.blue .. '33'
13 },
14 widget = wibox.container.margin,
15 margins = 6,
16 },
17 shape = helpers.rrect(100),
18 widget = wibox.container.background,
19 bg = beautiful.altbg
20}
Be Sure to add it to the LEFT SIDE of the bar.
Taglist
First configure the tags in config/user.lua
, I'm going to numbers 5 tags. Clone this folder from my repo called mods/animation in module/animation
. It is going to help up with animations. The taglist uses some colors from our theme/init.lua
to color the taglist. As we do not need text, we will only set the background colors
1-- ...
2theme.taglist_bg_focus = theme.blue
3theme.taglist_bg_empty = theme.comment
4theme.taglist_bg_occupied = theme.comment
5theme.taglist_bg_urgent = theme.red
6-- ...
How the animation module work?
01local animation = require("module.animation")
02
03-- making a new animation
04local anim = animation:new({
05 duration = 0.15, -- how long the animation should be
06 easing = animation.easing.linear, -- timing function, see module/animation/tween.lua
07 -- what do to on update
08 update = function(_, pos)
09 print(pos)
10 some_random_element.forced_width = pos -- this animation changed the width of some element
11 end,
12})
13
14-- to make an animation work
15anim:set(100) -- Make the width 100
16
17anim:set(30) -- make it 30
Now let us actually create the taglist. The file will return a function that takes in screen
as a parameter.
01local awful = require("awful")
02local wibox = require("wibox")
03local gears = require("gears")
04local helpers = require("helpers")
05local animation = require("module.animation")
06local beautiful = require("beautiful")
07return function(s)
08 local taglist = awful.widget.taglist {
09
10 -- THIS IS THE LAYOUT OF ALL TAGS, YOU CAN SET IT TO
11 -- WHATEVER YOU WANT, HORIZONTAL, VERTICAL, GRID
12 layout = {
13 spacing = 8,
14 layout = wibox.layout.fixed.horizontal,
15 },
16 -- THIS IS THE SHAPE OF EACH INDIVIDUAL TAG
17 style = {
18 shape = helpers.rrect(9)
19 },
20 screen = s,
21 filter = awful.widget.taglist.filter.all,
22 -- ADDING CLICK EVENTS
23 -- LEFT CLICK GOES TO THE TAG
24 buttons = {
25 awful.button({}, 1, function(t) t:view_only() end),
26 },
27
28 -- THE ACTUAL WIDGET FOR EACH TAG
29 -- THE 'background_role' USES THE BACKGROUND COLOR WE JUST SPECIFIED IN THEME/INIT.LUA
30 widget_template = {
31 {
32 valign = 'center',
33 id = 'background_role',
34 shape = helpers.rrect(1),
35 widget = wibox.container.background,
36 forced_width = 18,
37 forced_height = 10,
38 },
39 widget = wibox.container.place,
40 -- THIS RUNS WHEN 1 TIME AT THE START
41 create_callback = function(self, tag)
42 -- CREATING A NEW ANIMATION THAT CHANGES THE WIDTH
43 self.taganim = animation:new({
44 duration = 0.15,
45 easing = animation.easing.linear,
46 update = function(_, pos)
47 self:get_children_by_id('background_role')[1].forced_width = pos
48 end,
49 })
50 self.update = function()
51 if tag.selected then
52 self.taganim:set(45)
53 elseif #tag:clients() > 0 then
54 self.taganim:set(30)
55 else
56 self.taganim:set(15)
57 end
58 end
59
60 self.update()
61 end,
62 -- FUNCTION TO RUN ON EVERY TIME THE TAG CHANGES
63 update_callback = function(self)
64 self.update()
65 end,
66 }
67 }
68 -- WRAPPING THE TAGLIST IN A BOX
69 local widget = {
70 {
71 taglist,
72 widget = wibox.container.margin,
73 left = 10,
74 right = 10,
75 top = 3,
76 bottom = 3,
77 },
78 shape = helpers.rrect(10),
79 widget = wibox.container.background,
80 bg = beautiful.altbg,
81 }
82
83 return widget
84end
Now you know a lot of things already, so I will be giving you the challenge to create a layout box by yourself. No worries, if you cannot do it, It would be in the repo. Here are some things additional things that would be used:
If you successfully did it, we would be left with a bar like this:
Bonus: Titlebars
The titlebars look bad, do let us make them look good and minimal at the same time. But first we will need to download icons. I will once again use phosphor for this, you are allowed to use your own icons. Then we need to add them in our theme.lua
01theme.titlebar_close_button_normal = gears.color.recolor_image(theme.iconpath .. "close.svg",
02 theme.comment)
03theme.titlebar_close_button_focus = gears.color.recolor_image(theme.iconpath .. "close.svg",
04 theme.red)
05
06theme.titlebar_maximized_button_normal_inactive = gears.color.recolor_image(
07 theme.iconpath .. "maximize.svg",
08 theme.comment)
09theme.titlebar_maximized_button_focus_inactive = gears.color.recolor_image(
10 theme.iconpath .. "maximize.svg",
11 theme.blue)
12theme.titlebar_maximized_button_normal_active = gears.color.recolor_image(
13 theme.iconpath .. "maximize.svg",
14 theme.comment)
15theme.titlebar_maximized_button_focus_active = gears.color.recolor_image(
16 theme.iconpath .. "maximize.svg",
17 theme.blue)
Now let us edit modify the existing titlebar in ui/titlebar/normal.lua
01local awful = require('awful')
02local wibox = require('wibox')
03
04--- The titlebar to be used on normal clients.
05return function(c)
06 -- Buttons for the titlebar.
07 local buttons = {
08 awful.button(nil, 1, function()
09 c:activate({ context = 'titlebar', action = 'mouse_move' })
10 end),
11 awful.button(nil, 3, function()
12 c:activate({ context = 'titlebar', action = 'mouse_resize' })
13 end)
14 }
15
16 -- Draws the client titlebar at the default position (top) and size.
17 awful.titlebar(c, {size=40}).widget = wibox.widget({
18 layout = wibox.layout.align.horizontal,
19 -- Left
20 {
21 layout = wibox.layout.fixed.horizontal,
22 {
23 awful.titlebar.widget.iconwidget(c),
24 widget = wibox.container.margin,
25 margins = 8,
26 },
27 buttons = buttons
28 },
29 -- Middle
30 {
31 layout = wibox.layout.flex.horizontal,
32 { -- Title
33 widget = awful.titlebar.widget.titlewidget(c),
34 halign = 'center'
35 },
36 buttons = buttons
37 },
38 nil,
39 -- Right
40 {
41 {
42 layout = wibox.layout.fixed.horizontal,
43 spacing = 10,
44 awful.titlebar.widget.floatingbutton(c),
45 awful.titlebar.widget.maximizedbutton(c),
46 awful.titlebar.widget.stickybutton(c),
47 awful.titlebar.widget.ontopbutton(c),
48 awful.titlebar.widget.closebutton(c)
49 },
50 widget = wibox.container.margin,
51 margins = 8,
52 }
53 })
54end
Restart the WM and you get some rather good looking titlebars! And your basic tutorial is complete.
This could be a series but these are very time consuming and energy draining tasks. But it could be one series. Thanks for reading this, I hope it made your awesome journey easier.
Credits
- gw for their starter config. (give him a follow, great guy)
- naina_ on unixporn discord from whom this rice is loosely copied.