diff --git a/modules/icons/index.js b/modules/icons/index.js index 06339d6..f22fd66 100644 --- a/modules/icons/index.js +++ b/modules/icons/index.js @@ -1,197 +1,198 @@ export const substitutes = { - "transmission-gtk": "transmission", - "blueberry.py": "blueberry", - Caprine: "facebook-messenger", - "com.raggesilver.BlackBox-symbolic": "terminal-symbolic", - "org.wezfurlong.wezterm-symbolic": "terminal-symbolic", - "audio-headset-bluetooth": "audio-headphones-symbolic", - "audio-card-analog-usb": "audio-speakers-symbolic", - "audio-card-analog-pci": "audio-card-symbolic", - "preferences-system": "emblem-system-symbolic", - "com.github.Aylur.ags-symbolic": "controls-symbolic", - "com.github.Aylur.ags": "controls-symbolic", + "transmission-gtk": "transmission", + "blueberry.py": "blueberry", + Caprine: "facebook-messenger", + "com.raggesilver.BlackBox-symbolic": "terminal-symbolic", + "org.wezfurlong.wezterm-symbolic": "terminal-symbolic", + "audio-headset-bluetooth": "audio-headphones-symbolic", + "audio-card-analog-usb": "audio-speakers-symbolic", + "audio-card-analog-pci": "audio-card-symbolic", + "preferences-system": "emblem-system-symbolic", + "com.github.Aylur.ags-symbolic": "controls-symbolic", + "com.github.Aylur.ags": "controls-symbolic", }; export default { - missing: "image-missing-symbolic", - nix: { - nix: "nix-snowflake-symbolic", - }, - app: { - terminal: "terminal-symbolic", - }, - fallback: { - executable: "application-x-executable", - notification: "dialog-information-symbolic", - video: "video-x-generic-symbolic", - audio: "audio-x-generic-symbolic", - }, - ui: { - close: "window-close-symbolic", - colorpicker: "color-select-symbolic", - info: "info-symbolic", - link: "external-link-symbolic", - lock: "system-lock-screen-symbolic", - menu: "open-menu-symbolic", - refresh: "view-refresh-symbolic", - search: "system-search-symbolic", - settings: "emblem-system-symbolic", - themes: "preferences-desktop-theme-symbolic", - tick: "object-select-symbolic", - time: "hourglass-symbolic", - toolbars: "toolbars-symbolic", - warning: "dialog-warning-symbolic", - avatar: "avatar-default-symbolic", - arrow: { - right: "pan-end-symbolic", - left: "pan-start-symbolic", - down: "pan-down-symbolic", - up: "pan-up-symbolic", + missing: "image-missing-symbolic", + nix: { + nix: "nix-snowflake-symbolic", }, - }, - audio: { - mic: { - muted: "microphone-disabled-symbolic", - low: "microphone-sensitivity-low-symbolic", - medium: "microphone-sensitivity-medium-symbolic", - high: "microphone-sensitivity-high-symbolic", + app: { + terminal: "terminal-symbolic", }, - volume: { - muted: "audio-volume-muted-symbolic", - low: "audio-volume-low-symbolic", - medium: "audio-volume-medium-symbolic", - high: "audio-volume-high-symbolic", - overamplified: "audio-volume-overamplified-symbolic", + fallback: { + executable: "application-x-executable", + notification: "dialog-information-symbolic", + video: "video-x-generic-symbolic", + audio: "audio-x-generic-symbolic", }, - type: { - headset: "audio-headphones-symbolic", - speaker: "audio-speakers-symbolic", - card: "audio-card-symbolic", + ui: { + close: "window-close-symbolic", + colorpicker: "color-select-symbolic", + info: "info-symbolic", + link: "external-link-symbolic", + lock: "system-lock-screen-symbolic", + menu: "open-menu-symbolic", + refresh: "view-refresh-symbolic", + search: "system-search-symbolic", + settings: "emblem-system-symbolic", + themes: "preferences-desktop-theme-symbolic", + tick: "object-select-symbolic", + time: "hourglass-symbolic", + toolbars: "toolbars-symbolic", + warning: "dialog-warning-symbolic", + avatar: "avatar-default-symbolic", + arrow: { + right: "pan-end-symbolic", + left: "pan-start-symbolic", + down: "pan-down-symbolic", + up: "pan-up-symbolic", + }, }, - mixer: "mixer-symbolic", - }, - powerprofile: { - balanced: "power-profile-balanced-symbolic", - "power-saver": "power-profile-power-saver-symbolic", - performance: "power-profile-performance-symbolic", - }, - asusctl: { - profile: { - Balanced: "power-profile-balanced-symbolic", - Quiet: "power-profile-power-saver-symbolic", - Performance: "power-profile-performance-symbolic", + audio: { + mic: { + muted: "microphone-disabled-symbolic", + low: "microphone-sensitivity-low-symbolic", + medium: "microphone-sensitivity-medium-symbolic", + high: "microphone-sensitivity-high-symbolic", + }, + volume: { + muted: "audio-volume-muted-symbolic", + low: "audio-volume-low-symbolic", + medium: "audio-volume-medium-symbolic", + high: "audio-volume-high-symbolic", + overamplified: "audio-volume-overamplified-symbolic", + }, + type: { + headset: "audio-headphones-symbolic", + speaker: "audio-speakers-symbolic", + card: "audio-card-symbolic", + }, + mixer: "mixer-symbolic", }, - mode: { - Integrated: "processor-symbolic", - Hybrid: "controller-symbolic", + powerprofile: { + balanced: "power-profile-balanced-symbolic", + "power-saver": "power-profile-power-saver-symbolic", + performance: "power-profile-performance-symbolic", }, - }, - battery: { - charging: "battery-flash-symbolic", - warning: "battery-empty-symbolic", - }, - bluetooth: { - enabled: "bluetooth-active-symbolic", - disabled: "bluetooth-disabled-symbolic", - }, - brightness: { - indicator: "display-brightness-symbolic", - keyboard: "keyboard-brightness-symbolic", - screen: "display-brightness-symbolic", - }, - powermenu: { - sleep: "weather-clear-night-symbolic", - reboot: "system-reboot-symbolic", - logout: "system-log-out-symbolic", - shutdown: "system-shutdown-symbolic", - }, - recorder: { - recording: "media-record-symbolic", - }, - notifications: { - noisy: "org.gnome.Settings-notifications-symbolic", - silent: "notifications-disabled-symbolic", - message: "chat-bubbles-symbolic", - }, - trash: { - full: "user-trash-full-symbolic", - empty: "user-trash-symbolic", - }, - mpris: { - shuffle: { - enabled: "media-playlist-shuffle-symbolic", - disabled: "media-playlist-consecutive-symbolic", + asusctl: { + profile: { + Balanced: "power-profile-balanced-symbolic", + Quiet: "power-profile-power-saver-symbolic", + Performance: "power-profile-performance-symbolic", + }, + mode: { + Integrated: "processor-symbolic", + Hybrid: "controller-symbolic", + }, }, - loop: { - none: "media-playlist-repeat-symbolic", - track: "media-playlist-repeat-song-symbolic", - playlist: "media-playlist-repeat-symbolic", + battery: { + charging: "battery-flash-symbolic", + warning: "battery-empty-symbolic", + }, + bluetooth: { + enabled: "bluetooth-active-symbolic", + disabled: "bluetooth-disabled-symbolic", + }, + brightness: { + indicator: "display-brightness-symbolic", + keyboard: "keyboard-brightness-symbolic", + screen: "display-brightness-symbolic", + }, + powermenu: { + sleep: "weather-clear-night-symbolic", + reboot: "system-reboot-symbolic", + logout: "system-log-out-symbolic", + shutdown: "system-shutdown-symbolic", + }, + recorder: { + recording: "media-record-symbolic", + }, + notifications: { + noisy: "org.gnome.Settings-notifications-symbolic", + silent: "notifications-disabled-symbolic", + message: "chat-bubbles-symbolic", + }, + trash: { + full: "user-trash-full-symbolic", + empty: "user-trash-symbolic", + }, + mpris: { + shuffle: { + enabled: "media-playlist-shuffle-symbolic", + disabled: "media-playlist-consecutive-symbolic", + }, + loop: { + none: "media-playlist-repeat-symbolic", + track: "media-playlist-repeat-song-symbolic", + playlist: "media-playlist-repeat-symbolic", + }, + playing: "media-playback-pause-symbolic", + paused: "media-playback-start-symbolic", + stopped: "media-playback-start-symbolic", + prev: "media-skip-backward-symbolic", + next: "media-skip-forward-symbolic", + }, + system: { + cpu: "org.gnome.SystemMonitor-symbolic", + ram: "drive-harddisk-solidstate-symbolic", + temp: "temperature-symbolic", + }, + color: { + dark: "dark-mode-symbolic", + light: "light-mode-symbolic", + }, + weather: { + sunny: "weather-clear-symbolic", + clear: "weather-clear-night-symbolic", + partly_cloudy: "weather-few-clouds-symbolic", + partly_cloudy_night: "weather-few-clouds-night-symbolic", + cloudy: "weather-overcast-symbolic", + overcast: "weather-overcast-symbolic", + mist: "weather-overcast-symbolic", + patchy_rain_nearby: "weather-showers-scattered-symbolic", + patchy_rain_possible: "weather-showers-scattered-symbolic", + patchy_snow_possible: "weather-snow-symbolic", + patchy_sleet_possible: "weather-snow-symbolic", + patchy_freezing_drizzle_possible: "weather-showers-scattered-symbolic", + thundery_outbreaks_possible: "weather-overcast-symbolic", + blowing_snow: "weather-snow-symbolic", + blizzard: "weather-snow-symbolic", + fog: "weather-fog-symbolic", + freezing_fog: "weather-fog-symbolic", + patchy_light_drizzle: "weather-showers-scattered-symbolic", + light_drizzle: "weather-showers-symbolic", + freezing_drizzle: "weather-showers-symbolic", + heavy_freezing_drizzle: "weather-showers-symbolic", + patchy_light_rain: "weather-showers-scattered-symbolic", + light_rain: "weather-showers-symbolic", + moderate_rain_at_times: "weather-showers-symbolic", + moderate_rain: "weather-showers-symbolic", + heavy_rain_at_times: "weather-showers-symbolic", + heavy_rain: "weather-showers-symbolic", + light_freezing_rain: "weather-showers-symbolic", + moderate_or_heavy_freezing_rain: "weather-showers-symbolic", + light_sleet: "weather-snow-symbolic", + moderate_or_heavy_sleet: "weather-snow-symbolic", + patchy_light_snow: "weather-snow-symbolic", + light_snow: "weather-snow-symbolic", + patchy_moderate_snow: "weather-snow-symbolic", + moderate_snow: "weather-snow-symbolic", + patchy_heavy_snow: "weather-snow-symbolic", + heavy_snow: "weather-snow-symbolic", + ice_pellets: "weather-showers-symbolic", + light_rain_shower: "weather-showers-symbolic", + moderate_or_heavy_rain_shower: "weather-showers-symbolic", + torrential_rain_shower: "weather-showers-symbolic", + light_sleet_showers: "weather-showers-symbolic", + moderate_or_heavy_sleet_showers: "weather-showers-symbolic", + light_snow_showers: "weather-snow-symbolic", + moderate_or_heavy_snow_showers: "weather-snow-symbolic", + light_showers_of_ice_pellets: "weather-showers-symbolic", + moderate_or_heavy_showers_of_ice_pellets: "weather-showers-symbolic", + patchy_light_rain_with_thunder: "weather-showers-scattered-symbolic", + moderate_or_heavy_rain_with_thunder: "weather-showers-symbolic", + patchy_light_snow_with_thunder: "weather-snow-symbolic", + moderate_or_heavy_snow_with_thunder: "weather-snow-symbolic", }, - playing: "media-playback-pause-symbolic", - paused: "media-playback-start-symbolic", - stopped: "media-playback-start-symbolic", - prev: "media-skip-backward-symbolic", - next: "media-skip-forward-symbolic", - }, - system: { - cpu: "org.gnome.SystemMonitor-symbolic", - ram: "drive-harddisk-solidstate-symbolic", - temp: "temperature-symbolic", - }, - color: { - dark: "dark-mode-symbolic", - light: "light-mode-symbolic", - }, - weather: { - sunny: "weather-clear-symbolic", - clear: "weather-clear-night-symbolic", - partly_cloudy: "weather-few-clouds-symbolic", - partly_cloudy_night: "weather-few-clouds-night-symbolic", - cloudy: "weather-overcast-symbolic", - overcast: "weather-overcast-symbolic", - mist: "weather-overcast-symbolic", - patchy_rain_possible: "weather-showers-scattered-symbolic", - patchy_snow_possible: "weather-snow-symbolic", - patchy_sleet_possible: "weather-snow-symbolic", - patchy_freezing_drizzle_possible: "weather-showers-scattered-symbolic", - thundery_outbreaks_possible: "weather-overcast-symbolic", - blowing_snow: "weather-snow-symbolic", - blizzard: "weather-snow-symbolic", - fog: "weather-fog-symbolic", - freezing_fog: "weather-fog-symbolic", - patchy_light_drizzle: "weather-showers-scattered-symbolic", - light_drizzle: "weather-showers-symbolic", - freezing_drizzle: "weather-showers-symbolic", - heavy_freezing_drizzle: "weather-showers-symbolic", - patchy_light_rain: "weather-showers-scattered-symbolic", - light_rain: "weather-showers-symbolic", - moderate_rain_at_times: "weather-showers-symbolic", - moderate_rain: "weather-showers-symbolic", - heavy_rain_at_times: "weather-showers-symbolic", - heavy_rain: "weather-showers-symbolic", - light_freezing_rain: "weather-showers-symbolic", - moderate_or_heavy_freezing_rain: "weather-showers-symbolic", - light_sleet: "weather-snow-symbolic", - moderate_or_heavy_sleet: "weather-snow-symbolic", - patchy_light_snow: "weather-snow-symbolic", - light_snow: "weather-snow-symbolic", - patchy_moderate_snow: "weather-snow-symbolic", - moderate_snow: "weather-snow-symbolic", - patchy_heavy_snow: "weather-snow-symbolic", - heavy_snow: "weather-snow-symbolic", - ice_pellets: "weather-showers-symbolic", - light_rain_shower: "weather-showers-symbolic", - moderate_or_heavy_rain_shower: "weather-showers-symbolic", - torrential_rain_shower: "weather-showers-symbolic", - light_sleet_showers: "weather-showers-symbolic", - moderate_or_heavy_sleet_showers: "weather-showers-symbolic", - light_snow_showers: "weather-snow-symbolic", - moderate_or_heavy_snow_showers: "weather-snow-symbolic", - light_showers_of_ice_pellets: "weather-showers-symbolic", - moderate_or_heavy_showers_of_ice_pellets: "weather-showers-symbolic", - patchy_light_rain_with_thunder: "weather-showers-scattered-symbolic", - moderate_or_heavy_rain_with_thunder: "weather-showers-symbolic", - patchy_light_snow_with_thunder: "weather-snow-symbolic", - moderate_or_heavy_snow_with_thunder: "weather-snow-symbolic", - }, }; diff --git a/modules/menus/calendar/weather/hourly/icon/index.js b/modules/menus/calendar/weather/hourly/icon/index.js index d5ce499..ceeac30 100644 --- a/modules/menus/calendar/weather/hourly/icon/index.js +++ b/modules/menus/calendar/weather/hourly/icon/index.js @@ -1,28 +1,28 @@ import icons from "../../../../../icons/index.js"; export const HourlyIcon = (theWeather, getNextEpoch) => { - return Widget.Icon({ - class_name: "hourly-weather-icon", - icon: theWeather.bind("value").as((w) => { - if (!Object.keys(w).length) { - return "-"; - } + return Widget.Icon({ + class_name: "hourly-weather-icon", + icon: theWeather.bind("value").as((w) => { + if (!Object.keys(w).length) { + return "-"; + } - const nextEpoch = getNextEpoch(w); - const weatherAtEpoch = w.forecast.forecastday[0].hour.find( - (h) => h.time_epoch === nextEpoch, - ); + const nextEpoch = getNextEpoch(w); + const weatherAtEpoch = w.forecast.forecastday[0].hour.find( + (h) => h.time_epoch === nextEpoch, + ); - let iconQuery = weatherAtEpoch?.condition.text - .trim() - .toLowerCase() - .replaceAll(" ", "_"); + let iconQuery = weatherAtEpoch?.condition.text + .trim() + .toLowerCase() + .replaceAll(" ", "_"); - if (!weatherAtEpoch?.isDay && iconQuery === "partly_cloudy") { - iconQuery = "partly_cloudy_night"; - } + if (!weatherAtEpoch?.isDay && iconQuery === "partly_cloudy") { + iconQuery = "partly_cloudy_night"; + } - return icons.weather[iconQuery]; - }), - }); + return icons.weather[iconQuery]; + }), + }); }; diff --git a/options.ts b/options.ts index 26ecc39..09a8c7d 100644 --- a/options.ts +++ b/options.ts @@ -164,7 +164,7 @@ const options = mkOptions(OPTIONS, { }, iconbuttons: { passive: opt(colors.text), - active: opt(colors.pink) + active: opt(colors.lavender) }, progressbar: { foreground: opt(colors.lavender), diff --git a/scss/style/menus/calendar.scss b/scss/style/menus/calendar.scss index faef24a..cd64906 100644 --- a/scss/style/menus/calendar.scss +++ b/scss/style/menus/calendar.scss @@ -6,8 +6,8 @@ min-width: 27em; min-height: 6em; background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-clock-background-color); - border: 0.13em solid if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-clock-border-color); - border-radius: 0.7em; + border: $bar-menus-border-size solid if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-clock-border-color); + border-radius: $bar-menus-border-radius; margin-right: 0.5em; } @@ -42,17 +42,21 @@ background-color: transparent; color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-clock-calendar-yearmonth); } + &.button { color: $text; font-weight: 900; font-size: 900em; } + &:hover { color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-clock-calendar-paginator); } + &.highlight { color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-clock-calendar-weekdays); } + &:indeterminate { color: transparentize(if($bar-menus-monochrome, $bar-menus-text, $bar-menus-menu-clock-calendar-days), 0.65); } @@ -68,6 +72,7 @@ font-size: 4em; color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-clock-time-time); } + .clock-content-period { font-size: 1.75em; margin-bottom: 1.35em; @@ -79,9 +84,11 @@ .calendar-menu-item-container.clock { margin-bottom: 0.65em; } + .calendar-menu-item-container.calendar { margin-bottom: 0.65em; } + .calendar-menu-item-container.weather { margin-bottom: 0em; } @@ -117,15 +124,19 @@ .calendar-menu-weather.today.temp.label.icon.weather-color.red { color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-clock-weather-thermometer-extremelyhot); } + .calendar-menu-weather.today.temp.label.icon.weather-color.orange { color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-clock-weather-thermometer-hot); } + .calendar-menu-weather.today.temp.label.icon.weather-color.lavender { color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-clock-weather-thermometer-moderate); } + .calendar-menu-weather.today.temp.label.icon.weather-color.blue { color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-clock-weather-thermometer-cold); } + .calendar-menu-weather.today.temp.label.icon.weather-color.sky { color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-clock-weather-thermometer-extremelycold); } diff --git a/scss/style/menus/dashboard.scss b/scss/style/menus/dashboard.scss index c8c6e82..437c3f4 100644 --- a/scss/style/menus/dashboard.scss +++ b/scss/style/menus/dashboard.scss @@ -2,341 +2,376 @@ @import '../../variables'; .dashboard-content-items { - margin-left: 0.50em; - min-width: 28.5em; - background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-dashboard-background-color); - border: 0.13em solid if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-dashboard-border-color); - border-radius: 0.7em; + margin-left: 0.50em; + min-width: 28.5em; + background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-dashboard-background-color); + border: $bar-menus-border-size solid if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-dashboard-border-color); + border-radius: $bar-menus-border-radius; + + button { + border-radius: 0.4em; + } + + .dashboard-card { + background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-dashboard-card-color); + margin: 1.3em; + border-radius: $bar-menus-card_radius; + padding: 1.5em; + } + + .profile-picture-container { + margin-right: 0.65em; + margin-bottom: 0.65em; + + .profile-picture { + font-size: 7.5em; + } + + .profile-name { + font-size: 1.5em; + color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-profile-name); + margin-top: 0.75em; + } + } + + .power-menu-container { + margin-left: 0em; + margin-bottom: 0.65em; + + .dashboard-button { + min-width: 3em; + min-height: 2.5em; + + &:not(:last-child) { + margin-bottom: 0.75em; + } + + image { + color: $base; + font-size: 1.5em; + } + + &.shutdown { + background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-shutdown); + } + + &.restart { + background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-restart); + } + + &.lock { + background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-logout); + } + + &.sleep { + background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-sleep); + } + + &:hover { + &.shutdown { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-shutdown), 0.5); + } + + &.restart { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-restart), 0.5); + } + + &.lock { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-logout), 0.5); + } + + &.sleep { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-sleep), 0.5); + } + } + + } + } + + .shortcuts-container { + .dashboard-card { + padding: 1.5em; + + button { + min-height: 2.5em; + min-width: 2.5em; + } + } + + .card-button-left-section { + margin-right: 1.5em; + } + + .top-button { + margin-bottom: 1.5em; + } + + .container { + margin-top: 0em; + margin-bottom: 0.65em; + + &.most-used { + margin-right: 0em; + } + + &.utilities { + margin-left: 0.65em; + } + + button { + background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-shortcuts-background); + color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-dashboard-shortcuts-text); + min-height: 3em; + + &.discord { + label { + margin-right: 0.15em; + } + } + + label { + font-size: 1.5em; + } + + &.record.active { + background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-shortcuts-recording); + + &:hover { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-shortcuts-recording), 0.5); + } + } + + &:hover { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-shortcuts-background), 0.5); + } + } + } + } + + .controls-container { + margin-bottom: 0.65em; + + &.dashboard-card { + margin-top: 0em; + } button { - border-radius: 0.4em; + padding: 0em; + min-height: 3em; + + label { + color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-dashboard-controls-wifi-text); + font-size: 1.6em; + } + + &:not(:last-child) { + margin-right: 1em; + } + + &.wifi { + background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-wifi-background); + } + + &.bluetooth { + background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-bluetooth-background); + } + + &.notifications { + background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-notifications-background); + } + + &.playback { + background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-volume-background); + } + + &.input { + background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-input-background); + } + + &.wifi:hover { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-wifi-background), 0.5); + } + + &.bluetooth:hover { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-bluetooth-background), 0.5); + } + + &.notifications:hover { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-notifications-background), 0.5); + } + + &.playback:hover { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-volume-background), 0.5); + } + + &.input:hover { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-input-background), 0.5); + } + + &.disabled { + background: if($bar-menus-monochrome, $bar-menus-buttons-disabled, $bar-menus-menu-dashboard-controls-disabled); + + &.wifi:hover { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-wifi-background), 0.5); + } + + &.bluetooth:hover { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-bluetooth-background), 0.5); + } + + &.notifications:hover { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-notifications-background), 0.5); + } + + &.playback:hover { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-volume-background), 0.5); + } + + &.input:hover { + background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-input-background), 0.5); + } + } + } + } + + .directories-container { + &.dashboard-card { + margin-top: 0em; + margin-bottom: 0.65em; + padding-left: 1.5em; + padding-right: 0em; } - .dashboard-card { - background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-dashboard-card-color); - margin: 1.3em; - border-radius: 0.4em; - padding: 1.5em; + .directory-link { + padding: 0.5em 0em; + min-width: 9em; + + &:last-child { + margin-bottom: 0em; + } + + label { + font-size: 1.3em; + } + + &.right.top { + color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-right-top-color); + } + + &.right.middle { + color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-right-middle-color); + } + + &.right.bottom { + color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-right-bottom-color); + } + + &.left.top { + color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-left-top-color); + } + + &.left.middle { + color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-left-middle-color); + } + + &.left.bottom { + color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-left-bottom-color); + } + + &:hover { + opacity: 0.5; + } + } + } + + .stats-container { + margin-top: 0em; + + .stat { + label { + margin-right: 1em; + font-size: 1.5em; + } + + &.cpu label { + color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-cpu-icon); + } + + &.ram label { + color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-ram-icon); + } + + &.gpu label { + color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-gpu-icon); + } + + &.storage label { + color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-disk-icon); + } + + .stats-bar { + levelbar * { + transition: 200ms; + } + + trough { + min-height: 1.05em; + } + + block { + border-radius: 0.4em; + + &.empty { + background: if($bar-menus-monochrome, $bar-menus-progressbar-background, $bar-menus-menu-dashboard-monitors-bar_background); + } + + &.filled { + padding-left: 0.85em; + } + } + } + + &.cpu .stats-bar block.filled { + background: if($bar-menus-monochrome, $bar-menus-progressbar-foreground, $bar-menus-menu-dashboard-monitors-cpu-bar); + } + + &.ram .stats-bar block.filled { + background: if($bar-menus-monochrome, $bar-menus-progressbar-foreground, $bar-menus-menu-dashboard-monitors-ram-bar); + } + + &.gpu .stats-bar block.filled { + background: if($bar-menus-monochrome, $bar-menus-progressbar-foreground, $bar-menus-menu-dashboard-monitors-gpu-bar); + } + + &.storage .stats-bar block.filled { + background: if($bar-menus-monochrome, $bar-menus-progressbar-foreground, $bar-menus-menu-dashboard-monitors-disk-bar); + } } - .profile-picture-container { - margin-right: 0.65em; - margin-bottom: 0.65em; - .profile-picture { - font-size: 7.5em; - } - .profile-name { - font-size: 1.5em; - color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-profile-name); - margin-top: 0.75em; - } - } - - .power-menu-container { - margin-left: 0em; - margin-bottom: 0.65em; - - .dashboard-button { - min-width: 3em; - min-height: 2.5em; - - &:not(:last-child) { - margin-bottom: 0.75em; - } - - image { - color: $base; - font-size: 1.5em; - } - - &.shutdown { - background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-shutdown); - } - &.restart { - background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-restart); - } - &.lock { - background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-logout); - } - &.sleep { - background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-sleep); - } - - &:hover { - &.shutdown { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-shutdown), 0.5); - } - &.restart { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-restart), 0.5); - } - &.lock { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-logout), 0.5); - } - &.sleep { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-powermenu-sleep), 0.5); - } - } - - } - } - - .shortcuts-container { - .dashboard-card { - padding: 1.5em; - button { - min-height: 2.5em; - min-width: 2.5em; - } - } - - .card-button-left-section { - margin-right: 1.5em; - } - - .top-button { - margin-bottom: 1.5em; - } - - .container { - margin-top: 0em; - margin-bottom: 0.65em; - - &.most-used { - margin-right: 0em; - } - &.utilities { - margin-left: 0.65em; - } - - button { - background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-shortcuts-background); - color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-dashboard-shortcuts-text); - min-height: 3em; - - &.discord { - label { - margin-right: 0.15em; - } - } - - label { - font-size: 1.5em; - } - - &.record.active { - background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-shortcuts-recording); - - &:hover { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-shortcuts-recording), 0.5); - } - } - - &:hover { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-shortcuts-background), 0.5); - } - } - } - } - - .controls-container { - margin-bottom: 0.65em; - &.dashboard-card { - margin-top: 0em; - } - - button { - padding: 0em; - min-height: 3em; - - label { - color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-dashboard-controls-wifi-text); - font-size: 1.6em; - } - - &:not(:last-child) { - margin-right: 1em; - } - - &.wifi { - background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-wifi-background); - } - &.bluetooth { - background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-bluetooth-background); - } - &.notifications { - background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-notifications-background); - } - &.playback { - background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-volume-background); - } - &.input { - background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-input-background); - } - &.wifi:hover { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-wifi-background), 0.5); - } - &.bluetooth:hover { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-bluetooth-background), 0.5); - } - &.notifications:hover { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-notifications-background), 0.5); - } - &.playback:hover { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-volume-background), 0.5); - } - &.input:hover { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-input-background), 0.5); - } - &.disabled { - background: if($bar-menus-monochrome, $bar-menus-buttons-disabled, $bar-menus-menu-dashboard-controls-disabled); - &.wifi:hover { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-wifi-background), 0.5); - } - &.bluetooth:hover { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-bluetooth-background), 0.5); - } - &.notifications:hover { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-notifications-background), 0.5); - } - &.playback:hover { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-volume-background), 0.5); - } - &.input:hover { - background: transparentize(if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-controls-input-background), 0.5); - } - } - } - } - - .directories-container { - &.dashboard-card { - margin-top: 0em; - margin-bottom: 0.65em; - padding-left: 1.5em; - padding-right: 0em; - } - - .directory-link { - padding: 0.5em 0em; - min-width: 9em; - - &:last-child { - margin-bottom: 0em; - } - - label { - font-size: 1.3em; - } - - &.right.top { - color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-right-top-color); - } - &.right.middle { - color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-right-middle-color); - } - &.right.bottom { - color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-right-bottom-color); - } - &.left.top { - color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-left-top-color); - } - &.left.middle { - color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-left-middle-color); - } - &.left.bottom { - color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-dashboard-directories-left-bottom-color); - } - - &:hover { - opacity: 0.5; - } - } - } - - .stats-container { - margin-top: 0em; - - .stat { - label { - margin-right: 1em; - font-size: 1.5em; - } - - &.cpu label{ - color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-cpu-icon); - } - &.ram label{ - color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-ram-icon); - } - &.gpu label{ - color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-gpu-icon); - } - &.storage label{ - color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-dashboard-monitors-disk-icon); - } - - .stats-bar { - levelbar * { - transition: 200ms; - } - - trough { - min-height: 1.05em; - } - - block { - border-radius: 0.4em; - - &.empty { - background: if($bar-menus-monochrome, $bar-menus-progressbar-background, $bar-menus-menu-dashboard-monitors-bar_background); - } - - &.filled { - padding-left: 0.85em; - } - } - } - - &.cpu .stats-bar block.filled { - background: if($bar-menus-monochrome, $bar-menus-progressbar-foreground, $bar-menus-menu-dashboard-monitors-cpu-bar); - } - - &.ram .stats-bar block.filled { - background: if($bar-menus-monochrome, $bar-menus-progressbar-foreground, $bar-menus-menu-dashboard-monitors-ram-bar); - } - - &.gpu .stats-bar block.filled { - background: if($bar-menus-monochrome, $bar-menus-progressbar-foreground, $bar-menus-menu-dashboard-monitors-gpu-bar); - } - - &.storage .stats-bar block.filled { - background: if($bar-menus-monochrome, $bar-menus-progressbar-foreground, $bar-menus-menu-dashboard-monitors-disk-bar); - } - } - - .stat-value { - margin-bottom: 0.75em; - font-size: 0.9em; - &.cpu { - color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-cpu-label); - } - - &.ram { - color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-ram-label); - } - - &.gpu { - color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-gpu-label); - } - - &.storage { - color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-disk-label); - } - } + .stat-value { + margin-bottom: 0.75em; + font-size: 0.9em; + + &.cpu { + color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-cpu-label); + } + + &.ram { + color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-ram-label); + } + + &.gpu { + color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-gpu-label); + } + + &.storage { + color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-dashboard-monitors-disk-label); + } } + } } .dropdown.recording { - color: red; - background-color: if($bar-menus-monochrome, $bar-menus-dropdownmenu-background, $bar-menus-dropdownmenu-background); + color: red; + background-color: if($bar-menus-monochrome, $bar-menus-dropdownmenu-background, $bar-menus-dropdownmenu-background); } diff --git a/scss/style/menus/notifications.scss b/scss/style/menus/notifications.scss index 8bfd2e4..bece9ac 100644 --- a/scss/style/menus/notifications.scss +++ b/scss/style/menus/notifications.scss @@ -6,8 +6,8 @@ min-width: 30.6em; min-height: 48em; background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-notifications-background); - border: 0.13em solid if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-notifications-border); - border-radius: 0.7em; + border: $bar-menus-border-size solid if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-notifications-border); + border-radius: $bar-menus-border-radius; margin-right: 0.45em; .window-content.notificationsmenu-window { @@ -40,10 +40,12 @@ .notification-card-content-container { margin-bottom: 0.65em; + &:last-child { margin-bottom: 1em; } } + .notification-card-content { margin-bottom: 0.25em; } @@ -109,6 +111,7 @@ .bell { font-size: 10em; } + .message { font-size: 1.5em; } @@ -125,6 +128,6 @@ } &:hover { - background: transparentize($notification-close_button-background ,0.5); + background: transparentize($notification-close_button-background , 0.5); } } diff --git a/scss/variables.scss b/scss/variables.scss index c2f6ae0..5ade2bb 100644 --- a/scss/variables.scss +++ b/scss/variables.scss @@ -62,10 +62,10 @@ $bar-buttons-notifications-background: #242438; $bar-buttons-notifications-hover: #45475a; $bar-buttons-notifications-icon: #b4befe; $bar-buttons-notifications-total: #b4befe; -$bar-menus-monochrome: false; +$bar-menus-monochrome: true; $bar-menus-background: #11111b; $bar-menus-cards: #1e1e2e; -$bar-menus-card_radius: 0.4em; +$bar-menus-card_radius: 0em; $bar-menus-border-size: 0.13em; $bar-menus-border-radius: 0.7em; $bar-menus-border-color: #313244; @@ -85,7 +85,7 @@ $bar-menus-buttons-active: #f5c2e7; $bar-menus-buttons-disabled: #585b70; $bar-menus-buttons-text: #11111b; $bar-menus-iconbuttons-passive: #cdd6f4; -$bar-menus-iconbuttons-active: #f5c2e7; +$bar-menus-iconbuttons-active: #b4befe; $bar-menus-progressbar-foreground: #b4befe; $bar-menus-progressbar-background: #45475a; $bar-menus-slider-primary: #b4befe;