eww replacement of waybar

This commit is contained in:
samantha42
2026-04-20 20:37:54 +02:00
parent a240874719
commit 52fa42698f
14 changed files with 591 additions and 119 deletions

View File

@@ -1,48 +1,186 @@
* { all: unset; }
// ─────────────────────────────────────────────
// Palette — tweak these to match your theme
// ─────────────────────────────────────────────
$bg: rgba(0, 0, 0, 0.35);
$bg-surface: rgba(0, 0, 0, 0.35);
$border: rgba(255, 255, 255, 0);
$text: #cdd6f4;
$subtext: #6c7086;
$accent: #89b4fa;
$accent2: #cba6f7;
$green: #a6e3a1;
$yellow: #f9e2af;
$red: #f38ba8;
.volume-overlay {
background: rgba(15, 15, 20, 0.92);
border: 1px solid rgba(255,255,255,0.08);
border-radius: 12px;
padding: 16px;
backdrop-filter: blur(20px);
color: #e0e0e0;
font-family: "JetBrains Mono", monospace;
// ─────────────────────────────────────────────
// Reset / Base
// ─────────────────────────────────────────────
* {
all: unset;
font-family: "JetBrains Mono", "Iosevka", monospace;
font-size: 12px;
color: $text;
}
.header {
margin-bottom: 4px;
.header-icon { font-size: 18px; color: #33ccff; }
.header-title { font-size: 14px; font-weight: bold; color: #fff; }
// ─────────────────────────────────────────────
// Window margin (replaces calc() in geometry)
// ─────────────────────────────────────────────
.eww-bar {
margin: 8px 10px 0 10px;
}
.divider {
background: rgba(255,255,255,0.07);
min-height: 1px;
margin: 4px 0;
}
.sink-row {
padding: 4px 0;
.app-name { font-size: 12px; color: #aaa; min-width: 120px; }
.app-vol { font-size: 12px; color: #33ccff; margin-left: auto; }
.app-icon { font-size: 14px; color: #666; }
}
.vol-slider {
min-height: 20px;
trough { background: rgba(255,255,255,0.1); border-radius: 4px; min-height: 4px; }
highlight { background: linear-gradient(90deg, #33ccff, #00ff99); border-radius: 4px; }
slider { background: #fff; border-radius: 50%; min-width: 12px; min-height: 12px; }
}
.mute-btn {
margin-top: 8px;
background: rgba(255,255,255,0.06);
// ─────────────────────────────────────────────
// Bar root
// ─────────────────────────────────────────────
.bar-left{
background: $bg;
border-radius: 8px;
padding: 8px;
font-size: 13px;
color: #aaa;
&:hover { background: rgba(255,255,255,0.12); }
&.muted { color: #ff5555; background: rgba(255,85,85,0.1); }
padding: 0 10px;
min-height: 24px;
}
.bar-right, .bar-center {
border-radius: 8px;
padding: 0 10px;
min-height: 24px;
}
.bar-left { border-radius: 8px 8px 8px 8px; }
.bar-center { border-radius: 8px; }
.bar-right { border-radius: 8px 8px 8px 8px; }
// ─────────────────────────────────────────────
// Workspaces
// ─────────────────────────────────────────────
.workspaces {
padding: 0 2px;
}
.workspace-btn {
background: transparent;
border-radius: 5px;
color: $subtext;
font-weight: bold;
font-size: 11px;
padding: 2px 7px;
margin: 2px 0px;
transition: all 200ms ease;
&:hover {
background: rgba(137, 180, 250, 0.12);
color: $accent;
}
&.active {
background: rgba(23, 142, 21, 0.778);
color: $accent;
}
&.urgent {
background: rgba(207, 42, 89, 0.732);
color: $red;
}
}
// ─────────────────────────────────────────────
// Window title
// ─────────────────────────────────────────────
.window-title {
padding-left: 4px;
color: $subtext;
.window-icon {
font-size: 11px;
color: $accent2;
margin-right: 4px;
}
.window-text {
font-size: 11px;
}
}
// ─────────────────────────────────────────────
// Clock
// ─────────────────────────────────────────────
.clock {
padding: 0px 16px;
background: rgba(0, 0, 0, 0.35);
border-radius: 8px;
.clock-time {
font-weight: bold;
font-size: 12px;
color: $text;
letter-spacing: 0.04em;
}
.clock-sep {
color: $border;
}
.clock-date {
font-size: 11px;
color: $subtext;
}
}
// ─────────────────────────────────────────────
// Center buttons (logout / settings)
// ─────────────────────────────────────────────
.center-btn {
background: rgba(0, 0, 0, 0.35);
border-radius: 8px;
color: $subtext;
font-size: 13px;
padding: 0px 16px;
transition: all 150ms ease;
&:hover {
color: $accent;
background: rgba(137, 180, 250, 0.10);
}
}
// ─────────────────────────────────────────────
// Stat pills (cpu / mem / battery / network / volume)
// ─────────────────────────────────────────────
.stat-pill {
background: $bg-surface;
border-radius: 6px;
border: 1px solid $border;
padding: 2px 8px;
color: $text;
.stat-icon {
font-size: 12px;
color: $accent;
}
.stat-value {
font-size: 11px;
}
&.clickable {
transition: background 150ms ease;
&:hover {
background: rgba(137, 180, 250, 0.14);
}
}
&.charging .stat-icon { color: $green; }
&.warning .stat-icon { color: $yellow; }
&.critical .stat-icon { color: $red; }
}
// ─────────────────────────────────────────────
// Theme toggle
// ─────────────────────────────────────────────
.theme-btn {
.theme-icon {
font-size: 13px;
color: $accent2;
}
}

View File

@@ -1,49 +1,217 @@
(defpoll volume :interval "1s"
"wpctl get-volume @DEFAULT_AUDIO_SINK@ | awk '{printf \"%d\", $2*100}'")
;;; ─────────────────────────────────────────────
;;; Variables
;;; ─────────────────────────────────────────────
(defpoll muted :interval "1s"
"wpctl get-volume @DEFAULT_AUDIO_SINK@ | grep -c MUTED || echo 0")
(deflisten workspaces-dp2
:initial "[]"
"bash ~/.config/eww/scripts/get-workspaces.sh DP-2")
(defpoll sink-inputs :interval "2s"
"~/.config/eww/scripts/get-sinks.sh")
(deflisten workspaces-hdmi
:initial "[]"
"bash ~/.config/eww/scripts/get-workspaces.sh HDMI-A-1")
(defwidget volume-overlay []
(box :class "volume-overlay" :orientation "v" :spacing 12 :space-evenly false
(box :class "header" :orientation "h" :space-evenly false :spacing 8
(label :class "header-icon" :text "󰕾")
(label :class "header-title" :text "Volume Mixer"))
(deflisten active-window-dp2
:initial ""
"bash ~/.config/eww/scripts/get-active-window.sh DP-2")
(box :class "sink-row" :orientation "v" :spacing 4
(box :orientation "h" :space-evenly false :spacing 8
(label :class "app-icon" :text "󰓃")
(label :class "app-name" :text "Master")
(label :class "app-vol" :text "${volume}%"))
(scale :class "vol-slider master-slider"
:min 0 :max 100 :value volume
:onchange "wpctl set-volume @DEFAULT_AUDIO_SINK@ {}%"))
(deflisten active-window-hdmi
:initial ""
"bash ~/.config/eww/scripts/get-active-window.sh HDMI-A-1")
(box :class "divider")
(defpoll clock-time
:interval "1s"
"date '+%H:%M:%S'")
(for sink in sink-inputs
(box :class "sink-row" :orientation "v" :spacing 4
(box :orientation "h" :space-evenly false :spacing 8
(label :class "app-icon" :text "󰓃")
(label :class "app-name" :text {sink.name})
(label :class "app-vol" :text "${sink.volume}%"))
(scale :class "vol-slider"
:min 0 :max 100 :value {sink.volume}
:onchange "wpctl set-volume ${sink.id} {}%")))
(defpoll clock-date
:interval "1s"
"date '+%A, %B %d %Y'")
(button :class "mute-btn ${muted == "1" ? "muted" : ""}"
:onclick "wpctl set-mute @DEFAULT_AUDIO_SINK@ toggle"
(label :text "${muted == "1" ? "󰝟 Muted" : "󰕾 Mute"}"))))
(defpoll cpu-usage
:interval "2s"
"top -bn1 | grep 'Cpu(s)' | awk '{print int($2+$4)}'")
(defwindow volume-mixer
:monitor 0
:geometry (geometry :x "0px" :y "40px"
:width "280px"
:anchor "top right")
:stacking "overlay"
:exclusive false
(volume-overlay))
(defpoll mem-used
:interval "2s"
"free -g --si | awk '/Mem:/{printf \"%.1f\", $3}'")
(defpoll network-info
:interval "5s"
"bash ~/.config/eww/scripts/get-network.sh")
(defpoll volume-info
:interval "1s"
"bash ~/.config/eww/scripts/get-volume.sh")
(defpoll theme-info
:interval "2s"
"bash ~/.config/eww/scripts/get-theme.sh")
;;; ─────────────────────────────────────────────
;;; Helper Widgets
;;; ─────────────────────────────────────────────
(defwidget workspace-btn [id label active urgent output]
(button
:class {active ? "workspace-btn active" : urgent ? "workspace-btn urgent" : "workspace-btn"}
:onclick "hyprctl dispatch workspace ${id}"
:width 32
label))
(defwidget workspaces-widget [workspaces]
(box
:class "workspaces"
:orientation "h"
:spacing 2
(for ws in workspaces
(workspace-btn
:id {ws.id}
:label {ws.label}
:active {ws.active}
:urgent {ws.urgent}
:output {ws.output}))))
(defwidget window-widget [title]
(box
:class "window-title"
:orientation "h"
:space-evenly false
(label
:class "window-text"
:text {title}
:limit-width 20)))
(defwidget clock-widget []
(box
:class "clock"
:orientation "h"
:spacing 2
(label :text clock-time :class "clock-time")
))
(defwidget cpu-widget []
(box
:class "stat-pill"
:orientation "h"
:spacing 4
(label :text "${cpu-usage}%" :class "stat-value")))
(defwidget mem-widget []
(box
:class "stat-pill"
:orientation "h"
:spacing 4
(label :text "${mem-used}G" :class "stat-value")))
(defwidget network-widget []
(box
:class "stat-pill"
:orientation "h"
:spacing 4
(label :text {network-info == "offline" ? "Offline" :
network-info =~ "^wifi:.*" ? "${network-info}" :
"${network-info}"}
:class "stat-value"
:limit-width 20)))
(defwidget volume-widget [on-click]
(button
:class "stat-pill clickable"
:onclick on-click
(box
:orientation "h"
:spacing 4
(label
:text {volume-info =~ "^muted.*" ? "󰝟" :
volume-info =~ "^[0-9]" && volume-info < "34" ? "󰕿" :
volume-info =~ "^[0-9]" && volume-info < "67" ? "󰖀" : "󰕾"}
:class "stat-icon")
(label
:text {volume-info =~ "^muted.*" ? "Muted" : "${volume-info}%"}
:class "stat-value"))))
(defwidget theme-widget []
(button
:class "stat-pill clickable theme-btn"
:onclick "bash $HOME/.config/hypr/theme-cycle.sh next"
:onrightclick "bash $HOME/.config/hypr/theme-cycle.sh auto"
(label :text theme-info :class "theme-icon")))
(defwidget logout-btn []
(button
:class "center-btn"
:onclick "your-logout-command"
(label :text "󰍃")))
(defwidget settings-btn []
(button
:class "center-btn"
:onclick "your-settings-command"
(label :text "󰒓")))
;;; ─────────────────────────────────────────────
;;; Bar for DP-2 (workspaces 15)
;;; ─────────────────────────────────────────────
(defwidget bar-dp2 []
(centerbox
:orientation "h"
(box :class "bar-left" :orientation "h" :spacing 2 :space-evenly false :halign "start"
(workspaces-widget :workspaces workspaces-dp2)
(window-widget :title active-window-dp2))
(box :class "bar-center" :orientation "h" :spacing 12 :space-evenly false
(logout-btn)
(clock-widget)
(settings-btn))
(box :class "bar-right" :orientation "h" :spacing 6 :space-evenly false :halign "end"
(theme-widget)
(volume-widget :on-click "bash ~/.config/eww/scripts/toggle-mixer.sh")
(network-widget)
(cpu-widget)
(mem-widget))))
(defwindow bar-dp2
:monitor 0
:geometry (geometry
:x "10px"
:y "8px"
:width "1900px"
:height "24px"
:anchor "top center")
:exclusive true
:layer "top"
:namespace "eww-bar"
(bar-dp2))
;;; ─────────────────────────────────────────────
;;; Bar for HDMI-A-1 (workspaces 610)
;;; ─────────────────────────────────────────────
(defwidget bar-hdmi []
(centerbox
:orientation "h"
(box :class "bar-left" :orientation "h" :spacing 8 :space-evenly false :max-width 300
(workspaces-widget :workspaces workspaces-hdmi)
(window-widget :title active-window-hdmi))
(box :class "bar-center" :orientation "h" :spacing 12 :space-evenly false
(logout-btn)
(clock-widget)
(settings-btn))
(box :class "bar-right" :orientation "h" :spacing 6 :space-evenly false :halign "end"
(theme-widget)
(volume-widget :on-click "pavucontrol")
(network-widget)
(cpu-widget)
(mem-widget))))
(defwindow bar-hdmi
:monitor 1
:geometry (geometry
:x "10px"
:y "8px"
:width "1900px"
:height "24px"
:anchor "top center")
:exclusive true
:layer "top"
:namespace "eww-bar"
(bar-hdmi))

View File

@@ -0,0 +1,24 @@
#!/usr/bin/env bash
OUTPUT="${1:-DP-2}"
emit() {
local monitor title
monitor=$(hyprctl monitors -j 2>/dev/null \
| jq -r ".[] | select(.name==\"$OUTPUT\") | .activeWorkspace.id")
title=$(hyprctl clients -j 2>/dev/null \
| jq -r ".[] | select(.workspace.id==$monitor and .focusHistoryID==0) | .title" \
| head -n1)
printf '%s\n' "${title:-}"
}
emit
socat -u "UNIX-CONNECT:/tmp/hypr/${HYPRLAND_INSTANCE_SIGNATURE}/.socket2.sock" - \
| stdbuf -oL grep -E "^(activewindow|focusedmon|workspace|closewindow)>" \
| while IFS= read -r _; do
sleep 0.05
emit
done

View File

@@ -0,0 +1,26 @@
#!/usr/bin/env bash
# Outputs one of:
# offline
# wifi:<signal>%
# eth:<ip>
# Check ethernet first
ETH=$(ip -o link show | awk '$9=="UP" && $2!="lo:" {print $2}' | grep -v "^wl" | head -1 | tr -d ':')
if [[ -n "$ETH" ]]; then
IP=$(ip -4 addr show "$ETH" 2>/dev/null | awk '/inet /{print $2}' | cut -d/ -f1 | head -1)
if [[ -n "$IP" ]]; then
echo "eth:${IP}"
exit 0
fi
fi
# Check wifi
WIFI=$(ip -o link show | awk '$9=="UP" && $2~/^wl/ {print $2}' | tr -d ':' | head -1)
if [[ -n "$WIFI" ]]; then
SIGNAL=$(awk "/${WIFI}/{print int(\$3*100/70)}" /proc/net/wireless 2>/dev/null | head -1)
[[ -z "$SIGNAL" ]] && SIGNAL="?"
echo "wifi:${SIGNAL}%"
exit 0
fi
echo "offline"

14
eww/scripts/get-theme.sh Normal file
View File

@@ -0,0 +1,14 @@
#!/usr/bin/env bash
# Wraps your existing theme-cycle.sh to extract a display icon for eww.
# theme-cycle.sh status returns JSON like: {"text":"...","class":"...","tooltip":"..."}
# We parse the "text" field and emit it directly.
RAW=$(bash "$HOME/.config/hypr/theme-cycle.sh" status 2>/dev/null)
# If it's JSON, extract text field
if echo "$RAW" | jq -e . >/dev/null 2>&1; then
echo "$RAW" | jq -r '.text // "󰔎"'
else
# Plain text fallback
echo "${RAW:-󰔎}"
fi

21
eww/scripts/get-volume.sh Normal file
View File

@@ -0,0 +1,21 @@
#!/usr/bin/env bash
# Outputs either:
# muted
# <0-100> (integer volume)
SINK=$(pactl get-default-sink 2>/dev/null)
if [[ -z "$SINK" ]]; then
echo "muted"
exit 0
fi
INFO=$(pactl get-sink-volume "$SINK" 2>/dev/null)
MUTED=$(pactl get-sink-mute "$SINK" 2>/dev/null | awk '{print $2}')
if [[ "$MUTED" == "yes" ]]; then
echo "muted"
exit 0
fi
VOL=$(echo "$INFO" | grep -oP '\d+(?=%)' | head -1)
echo "${VOL:-0}"

38
eww/scripts/get-workspaces.sh Executable file
View File

@@ -0,0 +1,38 @@
#!/usr/bin/env bash
OUTPUT="${1:-DP-2}"
if [[ "$OUTPUT" == "DP-2" ]]; then
IDS=(1 2 3 4 5)
else
IDS=(6 7 8 9 10)
fi
emit() {
local active urgent result
active=$(hyprctl activeworkspace -j 2>/dev/null | jq -r '.id')
urgent=$(hyprctl clients -j 2>/dev/null \
| jq -r '[.[] | select(.urgent==true) | .workspace.id] | unique | .[]')
result="["
for id in "${IDS[@]}"; do
local is_active="false"
local is_urgent="false"
[[ "$id" == "$active" ]] && is_active="true"
grep -qx "$id" <<< "$urgent" && is_urgent="true"
result+="{\"id\":$id,\"label\":\"$id\",\"active\":$is_active,\"urgent\":$is_urgent,\"output\":\"$OUTPUT\"},"
done
printf '%s\n' "${result%,}]"
}
# emit once on start
emit
# listen for events and re-emit
socat -u "UNIX-CONNECT:/tmp/hypr/${HYPRLAND_INSTANCE_SIGNATURE}/.socket2.sock" - \
| stdbuf -oL grep -E "^(workspace|focusedmon|activewindow|urgent|createworkspace|destroyworkspace)>" \
| while IFS= read -r _; do
sleep 0.05
emit
done

21
eww/scripts/launch.sh Normal file
View File

@@ -0,0 +1,21 @@
#!/usr/bin/env bash
EWW="eww -c $HOME/.config/eww"
$EWW kill 2>/dev/null
sleep 0.5
declare -A BAR_MAP=(
["DP-2"]="bar-dp2"
["HDMI-A-1"]="bar-hdmi"
)
while IFS= read -r line; do
id=$(echo "$line" | awk '{print $1}')
name=$(echo "$line" | awk '{print $2}')
bar_name="${BAR_MAP[$name]}"
if [[ -z "$bar_name" ]]; then
echo "Warning: no bar mapped for monitor '$name'"
continue
fi
echo "Opening $bar_name on $name (index $id)"
$EWW open "$bar_name"
done < <(hyprctl monitors -j | jq -r '.[] | "\(.id) \(.name)"')

View File

@@ -316,14 +316,12 @@ windowrule {
}
# env stuff
exec-once = waybar --style ~/.config/waybar/style.css
#exec-once = waybar --style ~/.config/waybar/style.css
exec-once = ~/.config/eww/scipts/launch.sh
exec-once = hyprpaper
exec-once = ~/.config/hypr/theme-cycle.sh
exec-once = [workspace 1 silent] firefox
exec-once = [workspace 10 silent] firefox --new-instance
#rules
windowrule {
name = firefox-to-ws2
match:class = ^(firefox)$
@@ -337,24 +335,24 @@ windowrule {
}
windowrule {
name = vesktop-to-ws6
match:class = ^(vesktop)$
workspace = 4 silent
}
windowrule {
name = vesktop-to-ws6
match:class = ^(vesktop)$
workspace = 4 silent
}
windowrule {
name = steam-to-ws7
match:class = ^(steam)$
name = spotify-to-ws6
match:class = ^(spotify)$
workspace = 6 silent
}
windowrule {
name = vesktop-to-ws4
match:class = ^(vesktop)$
workspace = 4 silent
}
windowrule {
name = steam-to-ws5
match:class = ^(steam)$
workspace = 5 silent
}
windowrule {
name = firefox-to-ws10
match:class = ^(firefox)$
@@ -366,3 +364,14 @@ windowrule {
match:class = ^(eww)$
float = yes
}
#launch apps
exec-once = [workspace 1 silent] firefox
exec-once = [workspace 10 silent] firefox --new-instance
exec-once = code
exec-once = vesktop
exec-once = steam
exec-once = spotify

View File

@@ -1,11 +1,6 @@
#!/usr/bin/env bash
# Reload Waybar if running, otherwise start it
if pgrep -x waybar >/dev/null; then
killall -SIGUSR2 waybar
else
setsid waybar &>/dev/null &
fi
pgrep -x eww >/dev/null && eww kill; bash ~/.config/eww/scripts/launch.sh
# Restart hyprpaper
pkill hyprpaper 2>/dev/null

View File

@@ -12,14 +12,14 @@ apply_day() {
for mon in "${MONITORS[@]}"; do
hyprctl hyprpaper wallpaper "$mon,$DAY_WALL" &>/dev/null
done
sh ~/.config/waybar/switch-theme.sh day
#sh ~/.config/waybar/switch-theme.sh day
}
apply_night() {
for mon in "${MONITORS[@]}"; do
hyprctl hyprpaper wallpaper "$mon,$NIGHT_WALL" &>/dev/null
done
sh ~/.config/waybar/switch-theme.sh night
#sh ~/.config/waybar/switch-theme.sh night
}
wait_for_hyprpaper() {

View File

@@ -9,7 +9,7 @@
"margin-left": 10,
"margin-right": 10,
"modules-left": ["hyprland/workspaces", "hyprland/window"],
"modules-center": ["clock"],
"modules-center": ["custom/logout","clock", "custom/settings"],
"modules-right": ["custom/theme", "pulseaudio", "network", "cpu", "memory", "battery", "tray"],
"hyprland/workspaces": {
"format": "{icon}",
@@ -26,8 +26,9 @@
},
"hyprland/window": { "format": " {}", "max-length": 20, "separate-outputs": true },
"clock": {
"format": "{:%H:%M, %A, %B %d %Y}",
"format-alt": "{:%H:%M}",
"interval": 1,
"format": "{:%H:%M:%S}",
"format-alt": "{:%H:%M, %A, %B %d %Y}",
"tooltip-format": "<big>{:%Y %B}</big>\n<tt><small>{calendar}</small></tt>"
},
"cpu": { "format": "{usage}%", "tooltip": true, "interval": 2 },
@@ -52,6 +53,14 @@
"format-icons": { "headphone": "󰋋", "default": ["󰕿", "󰖀", "󰕾"] },
"on-click": "~/.config/eww/scripts/toggle-mixer.sh"
},
"custom/settings": {
"format": "󰒓",
"on-click": "your-settings-command"
},
"custom/logout": {
"format": "󰍃",
"on-click": "your-logout-command"
},
"custom/theme": {
"exec": "$HOME/.config/hypr/theme-cycle.sh status",
@@ -85,7 +94,7 @@
"margin-left": 10,
"margin-right": 10,
"modules-left": ["hyprland/workspaces", "hyprland/window"],
"modules-center": ["clock"],
"modules-center": ["custom/logout","clock", "custom/settings"],
"modules-right": ["custom/theme", "pulseaudio", "network", "cpu", "memory", "battery", "tray"],
"hyprland/workspaces": {
"format": "{icon}",
@@ -102,8 +111,9 @@
},
"hyprland/window": { "format": " {}", "max-length": 50, "separate-outputs": true },
"clock": {
"format": "{:%H:%M, %A, %B %d %Y}",
"format-alt": "{:%H:%M}",
"interval": 1,
"format": "{:%H:%M:%S}",
"format-alt": "{:%H:%M, %A, %B %d %Y}",
"tooltip-format": "<big>{:%Y %B}</big>\n<tt><small>{calendar}</small></tt>"
},
"cpu": { "format": "{usage}%", "tooltip": true, "interval": 2 },
@@ -129,6 +139,14 @@
"on-click": "pavucontrol"
},
"custom/settings": {
"format": "󰒓",
"on-click": "your-settings-command"
},
"custom/logout": {
"format": "󰍃",
"on-click": "your-logout-command"
},
"custom/theme": {
"exec": "$HOME/.config/hypr/theme-cycle.sh status",

View File

@@ -138,7 +138,7 @@ window#waybar {
background: rgba(255, 255, 255, 0.5);
}
#custom-theme {
#custom-theme, #custom-settings, #custom-logout {
color: #ffffff;
padding: 1px 14px;
font-weight: bold;

View File

@@ -129,7 +129,7 @@ window#waybar {
background: rgba(255, 255, 255, 0.5);
}
#custom-theme {
#custom-theme, #custom-settings, #custom-logout {
color: #ffffff;
padding: 1px 14px;
font-weight: bold;