Me suis trompé j'avais mis des liens

config/waybar/style.css

@@ -0,0 +1,226 @@
+@define-color fg #F5F5F5;
+@define-color bg #1F1F28;
+@define-color bordercolor #C8C093;
+@define-color highlight #D59C5C;
+@define-color disabled #A5A5A5;
+@define-color alert #E67E80;
+@define-color activegreen #26A65B;
+
+* {
+  min-height: 0;
+  font-family: "JetBrainsMono Nerd Font", Roboto, Helvetica, Arial, sans-serif;
+  font-size: 16px;
+}
+
+window#waybar {
+  color: @fg;
+  background: @bg;
+  border-radius: 10px;
+  transition-property: background-color;
+  transition-duration: 0.5s;
+  border: 2px solid @bordercolor;
+}
+
+button {
+  /* Use box-shadow instead of border so the text isn't offset */
+  box-shadow: inset 0 -3px transparent;
+  /* Avoid rounded borders under each button name */
+  border: none;;
+  border-radius: 0px;
+  padding: 0px 5px;
+  margin: 15px 0px;
+}
+
+/* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */
+button:hover {
+  background: inherit;
+  box-shadow: inset 0 -3px transparent;
+}
+
+#workspaces button {
+  color: @fg;
+  margin-left: 10px;
+}
+
+#workspaces button.urgent {
+  color: @alert;
+}
+#workspaces button.empty {
+  color: @bordercolor;
+}
+
+#workspaces button.active {
+  color: @highlight;
+}
+
+/*River Tags/Workspaces*/
+#tags {
+  border-radius: 0px;
+  padding: 0px 5px;
+}
+
+#tags button {
+  color: @bordercolor;
+  background: @bg;
+
+  /*If you need round border icons*/
+  border-radius: 0px;
+  padding: 0px 0px;
+  margin: 5px 0px;
+}
+
+#tags button.occupied {
+  color: @fg;
+}
+
+#tags button.focused {
+  color: @highlight;
+}
+
+#tags button.urgent {
+  color: @alert;
+}
+
+#clock,
+#cava,
+#battery,
+#cpu,
+#memory,
+#disk,
+#temperature,
+#language,
+#backlight,
+#backlight-slider,
+#network,
+#pulseaudio,
+#wireplumber,
+#custom-media,
+#taskbar,
+#tray,
+#tray menu,
+#tray > .needs-attention,
+#tray > .passive,
+#tray > .active,
+#mode,
+#scratchpad,
+#custom-notification,
+#custom-wifi,
+#custom-kdeconnect,
+#custom-bluetooth,
+#custom-power,
+#custom-separator,
+#idle_inhibitor,
+#window,
+#mpd {
+  padding: 0px 10px;
+  margin: 0px 5px;
+  color: @bordercolor;
+}
+
+#custom-notification,
+#custom-wifi,
+#custom-kdeconnect,
+#custom-bluetooth,
+#custom-power,
+#idle_inhibitor {
+  color: @bg;
+}
+
+#clock,
+#custom-group {
+  color: @bg;
+  background-color: @bordercolor;
+  margin: 10px;
+  padding: 0px 15px;
+  border-radius: 5px;
+}
+
+#custom-separator {
+  padding: 0px;
+  margin: 0px;
+  color: @disabled;
+}
+
+#custom-power {
+  color: @alert;
+}
+
+
+#tray {
+  /*background-color: @bordercolor;*/
+  border: 1px solid @bordercolor;
+  margin: 10px;
+  padding: 0px 15px;
+  border-radius: 5px;
+}
+
+#network.disconnected,
+#pulseaudio.muted,
+#wireplumber.muted {
+  color: @alert;
+}
+
+#battery.charging,
+#battery.plugged {
+  color: @activegreen;
+}
+
+label:focus {
+  background-color: @bg;
+}
+
+#battery.critical:not(.charging) {
+  background-color: @alert;
+  color: @fg;
+  animation-name: blink;
+  animation-duration: 0.5s;
+  animation-timing-function: linear;
+  animation-iteration-count: infinite;
+  animation-direction: alternate;
+}
+
+#tray > .passive {
+  background-color: red;
+  color: @bg;
+} 
+#tray menu {
+  background-color: @bg;
+  border: 1px solid @bordercolor;
+  color: @bordercolor;
+  border-radius: 10px;
+  padding: 5px;
+}
+#tray menuitem {
+  background-color: @bg;
+  color: @bordercolor;
+  border-radius: 3px;
+  border: 1px solid transparent;
+}
+#tray menuitem:hover {
+  background-color: #000000;
+  border: 1px solid @bordercolor;
+}
+
+/*
+#tray menu {
+  background-color: @bg;
+  border: 1px solid @bordercolor;
+  color: @bordercolor;
+  border-radius: 10px;
+  padding: 5px;
+}
+
+#tray menuitem {
+  background-color: @bg;
+  color: @bordercolor;
+  border-radius: 3px;
+  padding: 5px 10px;
+}
+
+#tray menuitem:hover {
+  background-color: #000000;
+  border: 1px solid @bordercolor;
+}
+*/
+
+