diff --git a/style.scss b/style.scss index 26e9bfd..2711ab7 100644 --- a/style.scss +++ b/style.scss @@ -1,115 +1,2 @@ // https://gitlab.gnome.org/GNOME/gtk/-/blob/gtk-3-24/gtk/theme/Adwaita/_colors-public.scss -@use "./widget/modules/Media/Media.scss"; -@use "./widget/modules/Powermenu/PowerMenu.scss"; - -$fg-color: #{"@theme_fg_color"}; -$bg-color: #{"@theme_bg_color"}; - -$bg: #212223; -$fg: #f1f1f1; -$accent: #{"@theme_accent_color"}; -$radius: 20px; - -window.Bar { - background: transparent; - color: $fg-color; - font-weight: bold; - - > centerbox { - background: transparent; - border-radius: 20px; - margin: 2px 5px 0 5px; - } - - .Menubutton { - all: unset; - background-color: black; - border-radius: 25px; - &:hover label { - transition: 300ms; - background-color: gray; - } - label { - transition: 300ms; - padding: 5px 15px 5px 9px; - border-radius: $radius; - border: 1pt solid black; - } - } - - .RoudedBlock { - background-color: black; - border-radius: 25px; - transition: 300ms; - } - - .Time { - padding: 0 15px; - } - - .SysTray { - all: unset; - border-radius: 25px; - background-color: transparent; - - button { - all: unset; - padding: 5px 7px; - border-radius: 25px; - border: 1pt solid black; - transition: 300ms; - &:hover { - background-color: gray; - } - } - } - - .Cpu { - padding: 0 5px; - } - - .Ram { - padding: 0 5px; - } - - .Storage { - padding: 0 15px 0 5px; - } - - .Focused { - padding: 0 15px 0 5px; - transition: 300ms; - } - - .Workspaces { - button { - all: unset; - background-color: black; - border-radius: 25px; - - &:hover label { - background-color: gray; - border-color: black; - color: white; - } - - &:active label { - background-color: white; - color: black; - } - } - - label { - transition: 300ms; - padding: 5px 15px; - border-radius: $radius; - border: 1pt solid transparent; - } - - .focused label { - background-color: white; - color: black; - border-color: $accent; - } - } -} +@use "./widget/Bar.scss"; diff --git a/widget/Bar.scss b/widget/Bar.scss new file mode 100644 index 0000000..be19482 --- /dev/null +++ b/widget/Bar.scss @@ -0,0 +1,35 @@ +@use "./widget/modules/modules.scss"; + +window.Bar { + background: transparent; + color: #{"@theme_fg_color"}; + font-weight: bold; + + > centerbox { + background: transparent; + border-radius: 20px; + margin: 2px 5px 0 5px; + } + + .Menubutton { + all: unset; + background-color: black; + border-radius: 25px; + &:hover label { + transition: 300ms; + background-color: gray; + } + label { + transition: 300ms; + padding: 5px 15px 5px 9px; + border-radius: 20px; + border: 1pt solid black; + } + } + + .RoudedBlock { + background-color: black; + border-radius: 25px; + transition: 300ms; + } +} diff --git a/widget/modules/Cpu/Cpu.scss b/widget/modules/Cpu/Cpu.scss new file mode 100644 index 0000000..dfdd79e --- /dev/null +++ b/widget/modules/Cpu/Cpu.scss @@ -0,0 +1,3 @@ +.Cpu { + padding: 0 5px; +} diff --git a/widget/modules/FocusedClient/FocusedClient.scss b/widget/modules/FocusedClient/FocusedClient.scss new file mode 100644 index 0000000..da5691e --- /dev/null +++ b/widget/modules/FocusedClient/FocusedClient.scss @@ -0,0 +1,4 @@ +.Focused { + padding: 0 15px 0 5px; + transition: 300ms; +} diff --git a/widget/modules/FocusedClient.tsx b/widget/modules/FocusedClient/FocusedClient.tsx similarity index 100% rename from widget/modules/FocusedClient.tsx rename to widget/modules/FocusedClient/FocusedClient.tsx diff --git a/widget/modules/Ram/Ram.scss b/widget/modules/Ram/Ram.scss new file mode 100644 index 0000000..0cd726f --- /dev/null +++ b/widget/modules/Ram/Ram.scss @@ -0,0 +1,3 @@ +.Ram { + padding: 0 5px; +} diff --git a/widget/modules/Storage/Storage.scss b/widget/modules/Storage/Storage.scss new file mode 100644 index 0000000..befc1b6 --- /dev/null +++ b/widget/modules/Storage/Storage.scss @@ -0,0 +1,3 @@ +.Storage { + padding: 0 15px 0 5px; +} diff --git a/widget/modules/SysTray/SysTray.scss b/widget/modules/SysTray/SysTray.scss new file mode 100644 index 0000000..3960a9d --- /dev/null +++ b/widget/modules/SysTray/SysTray.scss @@ -0,0 +1,16 @@ +.SysTray { + all: unset; + border-radius: 25px; + background-color: transparent; + + button { + all: unset; + padding: 5px 7px; + border-radius: 25px; + border: 1pt solid black; + transition: 300ms; + &:hover { + background-color: gray; + } + } +} diff --git a/widget/modules/SysTray.tsx b/widget/modules/SysTray/SysTray.tsx similarity index 100% rename from widget/modules/SysTray.tsx rename to widget/modules/SysTray/SysTray.tsx diff --git a/widget/modules/Time/Time.scss b/widget/modules/Time/Time.scss new file mode 100644 index 0000000..41468f1 --- /dev/null +++ b/widget/modules/Time/Time.scss @@ -0,0 +1,3 @@ +.Time { + padding: 0 15px; +} diff --git a/widget/modules/Time.tsx b/widget/modules/Time/Time.tsx similarity index 100% rename from widget/modules/Time.tsx rename to widget/modules/Time/Time.tsx diff --git a/widget/modules/Workspaces/Workspaces.scss b/widget/modules/Workspaces/Workspaces.scss new file mode 100644 index 0000000..7b2c1a6 --- /dev/null +++ b/widget/modules/Workspaces/Workspaces.scss @@ -0,0 +1,31 @@ +.Workspaces { + button { + all: unset; + background-color: black; + border-radius: 25px; + + &:hover label { + background-color: gray; + border-color: black; + color: white; + } + + &:active label { + background-color: white; + color: black; + } + } + + label { + transition: 300ms; + padding: 5px 15px; + border-radius: 20px; + border: 1pt solid transparent; + } + + .focused label { + background-color: white; + color: black; + border-color: #{"@theme_accent_color"}; + } +} diff --git a/widget/modules/Workspaces.tsx b/widget/modules/Workspaces/Workspaces.tsx similarity index 100% rename from widget/modules/Workspaces.tsx rename to widget/modules/Workspaces/Workspaces.tsx diff --git a/widget/modules/export.ts b/widget/modules/export.ts index 009853f..f82430c 100644 --- a/widget/modules/export.ts +++ b/widget/modules/export.ts @@ -1,12 +1,12 @@ import BatteryLevel from "./Battery"; import Cpu from "./Cpu/Cpu"; -import FocusedClient from "./FocusedClient"; +import FocusedClient from "./FocusedClient/FocusedClient"; import PowerMenu from "./Powermenu/PowerMenu"; import Ram from "./Ram/Ram"; import Storage from "./Storage/Storage"; -import SysTray from "./SysTray"; -import Time from "./Time"; -import Workspaces from "./Workspaces"; +import SysTray from "./SysTray/SysTray"; +import Time from "./Time/Time"; +import Workspaces from "./Workspaces/Workspaces"; import Media from "./Media/Media"; import LauncherButton from "./LauncherButton"; import PowerMenuButton from "./PowerMenuButton"; diff --git a/widget/modules/modules.scss b/widget/modules/modules.scss new file mode 100644 index 0000000..cb8abc5 --- /dev/null +++ b/widget/modules/modules.scss @@ -0,0 +1,9 @@ +@use "./Media/Media.scss"; +@use "./Powermenu/PowerMenu.scss"; +@use "./Cpu/Cpu.scss"; +@use "./Ram/Ram.scss"; +@use "./Time/Time.scss"; +@use "./SysTray/SysTray.scss"; +@use "./Storage/Storage.scss"; +@use "./Workspaces/Workspaces.scss"; +@use "./FocusedClient/FocusedClient.scss";