/* * __ __ _ ____ _ _ * \ \ / /_ _ _ _| |__ __ _ _ __ / ___|| |_ _ _| | ___ * \ \ /\ / / _` | | | | '_ \ / _` | '__| \___ \| __| | | | |/ _ \ * \ V V / (_| | |_| | |_) | (_| | | ___) | |_| |_| | | __/ * \_/\_/ \__,_|\__, |_.__/ \__,_|_| |____/ \__|\__, |_|\___| * |___/ |___/ * * by Stephan Raabe (2023) * ----------------------------------------------------- */ /* ----------------------------------------------------- * Import Pywal colors * ----------------------------------------------------- */ /* @import 'style-light.css'; */ @define-color backgroundlight #FFFFFF; @define-color backgrounddark #FFFFFF; @define-color workspacesbackground1 #FFFFFF; @define-color workspacesbackground2 #CCCCCC; @define-color bordercolor #FFFFFF; @define-color textcolor1 #000000; @define-color textcolor2 #000000; @define-color textcolor3 #FFFFFF; @define-color iconcolor #FFFFFF; /* ----------------------------------------------------- * General * ----------------------------------------------------- */ * { font-family: "Fira Sans semibold", FontAwesome, Roboto, Helvetica, Arial, sans-serif; border: none; border-radius: 0px; } window#waybar { background-color: rgba(0,0,0,0.4); border-bottom: 0px solid #ffffff; /* color: #FFFFFF; */ transition-property: background-color; transition-duration: .5s; } /* ----------------------------------------------------- * Workspaces * ----------------------------------------------------- */ #workspaces { margin: 3px 7px 3px 3px; border: 0px; font-size: 14px; color: @textcolor1; } #workspaces button { border: 0px; margin:4px 5px 4px 0px; padding:0px 4px 0px 4px; color: @textcolor3; transition: all 0.5s ease-in-out; } #workspaces button.active { color: @textcolor1; background: @workspacesbackground2; } #workspaces button:hover { color: @textcolor1; background: @workspacesbackground2; border-radius: 15px; } /* ----------------------------------------------------- * Tooltips * ----------------------------------------------------- */ tooltip { border-radius: 10px; background-color: @backgroundlight; opacity:0.8; padding:20px; margin:0px; } tooltip label { color: @textcolor2; } /* ----------------------------------------------------- * Window * ----------------------------------------------------- */ #window { margin: 0px 15px 0px 0px; border-radius: 12px; color:@textcolor; font-size:14px; font-weight:normal; } window#waybar.empty #window { background-color:transparent; } /* ----------------------------------------------------- * Modules * ----------------------------------------------------- */ .modules-left > widget:first-child > #workspaces { margin-left: 0; } .modules-right > widget:last-child > #workspaces { margin-right: 0; } /* ----------------------------------------------------- * Custom Quicklinks * ----------------------------------------------------- */ #custom-brave, #custom-browser, #custom-keybindings, #custom-outlook, #custom-filemanager, #custom-teams, #custom-chatgpt, #custom-calculator, #custom-windowsvm, #custom-cliphist, #custom-wallpaper, #custom-settings, #custom-wallpaper, #custom-system, #custom-waybarthemes { margin-right: 23px; font-size: 14px; font-weight: bold; color: @iconcolor; } #custom-waybarthemes,#custom-system { margin-right:15px; } #custom-ml4w-welcome { margin-right: 15px; background-image: url("../assets/ml4w-icon-20.png"); background-repeat: no-repeat; background-position: center; padding-right: 24px; } /* ----------------------------------------------------- * Idle Inhibator * ----------------------------------------------------- */ #idle_inhibitor { margin-right: 15px; font-size: 16px; font-weight: bold; color: @iconcolor; } #idle_inhibitor.activated { margin-right: 15px; font-size: 14px; font-weight: bold; color: #dc2f2f; } /* ----------------------------------------------------- * Custom Modules * ----------------------------------------------------- */ #custom-appmenuicon { font-size: 20px; color: @textcolor; margin: 0px 15px 0px 10px; } /* ----------------------------------------------------- * Custom Exit * ----------------------------------------------------- */ #custom-exit { margin: 0px 20px 0px 0px; padding:0px; font-size:16px; color: @iconcolor; } /* ----------------------------------------------------- * Custom Updates * ----------------------------------------------------- */ #custom-updates { font-size: 14px; color: @textcolor; border-radius: 15px; margin: 0px 15px 0px 0px; } #custom-updates.green { } #custom-updates.yellow { color: #ff9a3c; } #custom-updates.red { color: #dc2f2f; } /* ----------------------------------------------------- * Custom Youtube * ----------------------------------------------------- */ #custom-youtube { background-color: @backgroundlight; font-size: 14px; color: @textcolor2; border-radius: 15px; margin: 0px 15px 0px 0px; } /* ----------------------------------------------------- * Hardware Group * ----------------------------------------------------- */ #disk,#memory,#cpu,#language { margin:0px; padding:0px; font-size:14px; color:@iconcolor; } #language { margin-right:10px; } /* ----------------------------------------------------- * Clock * ----------------------------------------------------- */ #clock { font-size: 15px; color: @textcolor; margin: 0px 15px 0px 0px; } /* ----------------------------------------------------- * Pulseaudio * ----------------------------------------------------- */ #pulseaudio { font-size: 14px; color: @textcolor; border-radius: 15px; margin: 0px 15px 0px 0px; } #pulseaudio.muted { color: @textcolor; } /* ----------------------------------------------------- * Network * ----------------------------------------------------- */ #network { font-size: 14px; color: @textcolor; border-radius: 15px; margin: 0px 15px 0px 0px; } #network.ethernet { color: @textcolor; } #network.wifi { color: @textcolor; } /* ----------------------------------------------------- * Bluetooth * ----------------------------------------------------- */ #bluetooth, #bluetooth.on, #bluetooth.connected { font-size: 14px; color: @textcolor; border-radius: 15px; margin: 10px 15px 10px 0px; } #bluetooth.off { background-color: transparent; padding: 0px; margin: 0px; } /* ----------------------------------------------------- * Battery * ----------------------------------------------------- */ #battery { font-size: 14px; color: @textcolor; border-radius: 15px; margin: 10px 15px 10px 0px; } #battery.charging, #battery.plugged { color: @textcolor; } @keyframes blink { to { background-color: @backgroundlight; color: @textcolor2; } } #battery.critical:not(.charging) { color: #f53c3c; animation-name: blink; animation-duration: 0.5s; animation-timing-function: linear; animation-iteration-count: infinite; animation-direction: alternate; } /* ----------------------------------------------------- * Tray * ----------------------------------------------------- */ #tray { margin:0px 10px 0px 0px; } #tray > .passive { -gtk-icon-effect: dim; } #tray > .needs-attention { -gtk-icon-effect: highlight; background-color: #eb4d4b; } /* ----------------------------------------------------- * Other * ----------------------------------------------------- */ label:focus { background-color: #000000; } #backlight { background-color: #90b1b1; }