LESA/custum-hyprpanel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implemented majority of dashboard

Browse Source
This commit is contained in:
Jas Singh
2024-07-08 01:13:26 -07:00
parent eee68e8acf
commit 251a4da2bc
11 changed files with 891 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
README.md
View File

@@ -1,15 +1,14 @@
# Starter Config
if suggestions don't work, first make sure
you have TypeScript LSP working in your editor
if you do not want typechecking only suggestions
```json
// tsconfig.json
"checkJs": false
Requirements:
```
pipewire
bluez
bluez-utils
grimblast
gpu-screen-recorder
nmcli
networkmanager
dart-sass
brightnessctl
python
python-gpustat
```
types are symlinked to:
/usr/share/com.github.Aylur.ags/types

34
modules/menus/dashboard/controls/index.js
View File

@@ -1,30 +1,44 @@
const Controls = () => {
return Widget.Box({
class_name: "controls-container",
class_name: "dashboard-card controls-container",
hpack: "fill",
vpack: "fill",
expand: true,
children: [
Widget.Button({
class_name: "dashboard-button airplane-mode",
}),
Widget.Separator({
hpack: "center",
vexpand: true,
vertical: true,
class_name: "menu-separator dashboard-controls",
}),
Widget.Button({
expand: true,
class_name: "dashboard-button wifi",
child: Widget.Label({
label: "󰤨",
}),
}),
Widget.Button({
expand: true,
class_name: "dashboard-button bluetooth",
child: Widget.Label({
label: "󰂯",
}),
}),
Widget.Button({
expand: true,
class_name: "dashboard-button notifications",
child: Widget.Label({
label: "󰂚",
}),
}),
Widget.Button({
expand: true,
class_name: "dashboard-button playback",
child: Widget.Label({
label: "󰕾",
}),
}),
Widget.Button({
expand: true,
class_name: "dashboard-button input",
child: Widget.Label({
label: "󰍬",
}),
}),
],
});

26
modules/menus/dashboard/profile/index.js
View File

@@ -1,6 +1,12 @@
import icons from '../../../icons/index.js';
import icons from "../../../icons/index.js";
import powermenu from "../../power/helpers/actions.js";
const Profile = () => {
const handleClick = (action) => {
App.closeWindow("dashboardmenu");
return powermenu.action(action);
}
return Widget.Box({
class_name: "profiles-container",
hpack: "fill",
@@ -14,13 +20,13 @@ const Profile = () => {
Widget.Icon({
hpack: "center",
class_name: "profile-picture",
icon: `${App.configDir}/assets/21210205.png`
icon: `${App.configDir}/assets/21210205.png`,
}),
Widget.Label({
hpack: "center",
class_name: "profile-name",
label: "Jaskir Linux"
})
label: "Jaskir Linux",
}),
],
}),
Widget.Box({
@@ -30,27 +36,31 @@ const Profile = () => {
children: [
Widget.Button({
class_name: "dashboard-button shutdown",
on_clicked: () => handleClick("shutdown"),
tooltip_text: "Shut Down",
vexpand: true,
child: Widget.Icon(icons.powermenu.shutdown)
child: Widget.Icon(icons.powermenu.shutdown),
}),
Widget.Button({
class_name: "dashboard-button restart",
on_clicked: () => handleClick("reboot"),
tooltip_text: "Restart",
vexpand: true,
child: Widget.Icon(icons.powermenu.reboot)
child: Widget.Icon(icons.powermenu.reboot),
}),
Widget.Button({
class_name: "dashboard-button lock",
on_clicked: () => handleClick("logout"),
tooltip_text: "Log Out",
vexpand: true,
child: Widget.Icon(icons.powermenu.logout)
child: Widget.Icon(icons.powermenu.logout),
}),
Widget.Button({
class_name: "dashboard-button sleep",
on_clicked: () => handleClick("sleep"),
tooltip_text: "Sleep",
vexpand: true,
child: Widget.Icon(icons.powermenu.sleep)
child: Widget.Icon(icons.powermenu.sleep),
}),
],
}),

100
modules/menus/dashboard/shortcuts/index.js
View File

@@ -1,38 +1,114 @@
const Shortcuts = () => {
const handleClick = (action) => {
App.closeWindow("dashboardmenu");
Utils.execAsync(action)
.then(res => res)
.catch(err => err);
}
return Widget.Box({
class_name: "shortcuts-container",
hpack: "fill",
hexpand: true,
children: [
Widget.Box({
class_name: "most-used-container",
class_name: "container most-used dashboard-card",
hexpand: true,
children: [
Widget.Box({
class_name: "card-button-left-section",
vertical: true,
hexpand: true,
children: [
Widget.Button({
class_name: "dashboard-button edge",
class_name: "dashboard-button edge top-button",
on_primary_click: () => handleClick("microsoft-edge-stable"),
child: Widget.Label({
class_name: "button-label",
label: "󰇩",
}),
}),
Widget.Button({
class_name: "dashboard-button spotify",
on_primary_click: () => handleClick("spotify-launcher"),
child: Widget.Label({
class_name: "button-label",
label: "",
}),
Widget.Button({
class_name: "dashboard-button discord",
}),
Widget.Button({
class_name: "dashboard-button search",
}),
],
}),
Widget.Box({
class_name: "utilities-container",
vertical: true,
hexpand: true,
children: [
Widget.Button({
class_name: "dashboard-button utility",
class_name: "dashboard-button discord top-button",
on_primary_click: () => handleClick("discord"),
child: Widget.Label({
class_name: "button-label",
label: "",
}),
}),
Widget.Button({
class_name: "dashboard-button utility",
class_name: "dashboard-button search",
on_primary_click: () => handleClick("rofi -show drun"),
child: Widget.Label({
class_name: "button-label",
label: "",
}),
}),
],
}),
],
}),
Widget.Box({
class_name: "container utilities dashboard-card",
hexpand: true,
children: [
Widget.Box({
class_name: "card-button-left-section",
vertical: true,
hexpand: true,
children: [
Widget.Button({
class_name: "dashboard-button colorpicker top-button",
on_primary_click: () => handleClick("hyprpicker"),
child: Widget.Label({
class_name: "button-label",
label: "",
}),
}),
Widget.Button({
class_name: "dashboard-button utility",
class_name: "dashboard-button settings",
on_primary_click: () => handleClick('bash -c "kitty -e nvim $HOME/.config/hypr/hyprland.conf"'),
child: Widget.Label({
class_name: "button-label",
label: "󰒓",
}),
}),
],
}),
Widget.Box({
vertical: true,
hexpand: true,
children: [
Widget.Button({
class_name: "dashboard-button snapshot top-button",
on_primary_click: () => handleClick("grimblast --notify copysave area"),
child: Widget.Label({
class_name: "button-label",
label: "󰄀",
}),
}),
Widget.Button({
class_name: "dashboard-button utility",
class_name: "dashboard-button record",
on_primary_click: () => handleClick("rofi -show drun"),
child: Widget.Label({
class_name: "button-label",
label: "󰑊",
}),
}),
],
}),
],
}),

224
modules/menus/dashboard/stats/index.js
View File

@@ -1,18 +1,232 @@
const Stats = () => {
const divide = ([total, free]) => free / total;
const formatSizeInGB = (sizeInKB) =>
Number((sizeInKB / 1024 ** 2).toFixed(2));
const cpu = Variable(0, {
poll: [
2000,
"top -b -n 1",
(out) => {
if (typeof out !== "string") {
return 0;
}
const cpuOut = out.split("\n").find((line) => line.includes("Cpu(s)"));
if (cpuOut === undefined) {
return 0;
}
return divide([100, cpuOut.split(/\s+/)[1].replace(",", ".")]);
},
],
});
const ram = Variable(
{ total: 0, used: 0, percentage: 0 },
{
poll: [
2000,
"free",
(out) => {
if (typeof out !== "string") {
return { total: 0, used: 0, percentage: 0 };
}
const ramOut = out.split("\n").find((line) => line.includes("Mem:"));
if (ramOut === undefined) {
return { total: 0, used: 0, percentage: 0 };
}
const [totalRam, usedRam] = ramOut
.split(/\s+/)
.splice(1, 2)
.map(Number);
return {
percentage: divide([totalRam, usedRam]),
total: formatSizeInGB(totalRam),
used: formatSizeInGB(usedRam),
};
},
],
},
);
const gpu = Variable(0, {
poll: [
2000,
"gpustat --json",
(out) => {
if (typeof out !== "string") {
return 0;
}
try {
const data = JSON.parse(out);
const totalGpu = 100;
const usedGpu =
data.gpus.reduce((acc, gpu) => acc + gpu["utilization.gpu"], 0) /
data.gpus.length;
return divide([totalGpu, usedGpu]);
} catch (e) {
console.error("Error getting GPU stats:", e);
return 0;
}
},
],
});
const storage = Variable(
{ total: 0, used: 0, percentage: 0 },
{
poll: [
2000,
"df -B1 /",
(out) => {
if (typeof out !== "string") {
return { total: 0, used: 0, percentage: 0 };
}
const dfOut = out.split("\n").find((line) => line.startsWith("/"));
if (dfOut === undefined) {
return { total: 0, used: 0, percentage: 0 };
}
const parts = dfOut.split(/\s+/);
const size = parseInt(parts[1], 10);
const used = parseInt(parts[2], 10);
const sizeInGB = formatSizeInGB(size);
const usedInGB = formatSizeInGB(used);
return {
total: Math.floor(sizeInGB / 1000),
used: Math.floor(usedInGB / 1000),
percentage: divide([size, used]),
};
},
],
},
);
return Widget.Box({
class_name: "stats-container",
class_name: "dashboard-card stats-container",
vertical: true,
vpack: "fill",
hpack: "fill",
expand: true,
children: [
Widget.Box({
class_name: "stat-cpu",
vertical: true,
children: [
Widget.Box({
class_name: "stat cpu",
hexpand: true,
vpack: "center",
children: [
Widget.Label({
label: "",
}),
Widget.LevelBar({
class_name: "stats-bar",
hexpand: true,
vpack: "center",
bar_mode: "continuous",
max_value: 1,
value: cpu.bind("value"),
}),
],
}),
Widget.Label({
hpack: "end",
class_name: "stat-value cpu",
label: cpu.bind("value").as((v) => `${Math.floor(v * 100)}%`),
}),
],
}),
Widget.Box({
class_name: "stat-ram",
vertical: true,
children: [
Widget.Box({
class_name: "stat ram",
vpack: "center",
hexpand: true,
children: [
Widget.Label({
label: "",
}),
Widget.LevelBar({
class_name: "stats-bar",
hexpand: true,
vpack: "center",
value: ram.bind("value").as((v) => v.percentage),
}),
],
}),
Widget.Label({
hpack: "end",
class_name: "stat-value ram",
label: ram.bind("value").as((v) => `${v.used}/${v.total} GB`),
}),
],
}),
Widget.Box({
class_name: "stat-gpu",
vertical: true,
children: [
Widget.Box({
class_name: "stat gpu",
hexpand: true,
vpack: "center",
children: [
Widget.Label({
label: "󰢮",
}),
Widget.LevelBar({
class_name: "stats-bar",
hexpand: true,
vpack: "center",
value: gpu.bind("value"),
}),
],
}),
Widget.Label({
hpack: "end",
class_name: "stat-value gpu",
label: gpu.bind("value").as((v) => `${Math.floor(v * 100)}%`),
}),
],
}),
Widget.Box({
class_name: "stat-storage",
vertical: true,
children: [
Widget.Box({
class_name: "stat storage",
hexpand: true,
vpack: "center",
children: [
Widget.Label({
label: "󰋊",
}),
Widget.LevelBar({
class_name: "stats-bar",
hexpand: true,
vpack: "center",
value: storage.bind("value").as((v) => v.percentage),
}),
],
}),
Widget.Label({
hpack: "end",
class_name: "stat-value storage",
label: storage.bind("value").as((v) => `${v.used}/${v.total} GB`),
}),
],
}),
],
});

21
modules/menus/network/wifi/WirelessAPs.js
View File

@@ -32,7 +32,9 @@ const renderWAPs = (self, network, staging, connecting) => {
// Sometimes the network service will yield a "this._device is undefined" when
// trying to access the "access_points" property. So we must validate that
// it's not 'undefined'
let WAPs = network.wifi["access_points"] !== undefined
let WAPs =
Object.hasOwnProperty.call(network.wifi, "access_points") &&
network.wifi["access_points"] !== undefined
? network.wifi["access-points"]
: [];
@@ -42,10 +44,10 @@ const renderWAPs = (self, network, staging, connecting) => {
if (!Object.hasOwnProperty.call(dedupMap, item.ssid)) {
dedupMap[item.ssid] = item;
}
})
});
return Object.keys(dedupMap).map(itm => dedupMap[itm]);
}
return Object.keys(dedupMap).map((itm) => dedupMap[itm]);
};
WAPs = dedupeWAPs();
@@ -64,11 +66,9 @@ const renderWAPs = (self, network, staging, connecting) => {
return false;
};
const filteredWAPs = WAPs.filter(
(ap) => {
return ap.ssid !== "Unknown" && !isInStaging(ap)
},
).sort((a, b) => {
const filteredWAPs = WAPs.filter((ap) => {
return ap.ssid !== "Unknown" && !isInStaging(ap);
}).sort((a, b) => {
if (network.wifi.ssid === a.ssid) {
return -1;
}
@@ -165,7 +165,8 @@ const renderWAPs = (self, network, staging, connecting) => {
Widget.Revealer({
hpack: "end",
vpack: "start",
reveal_child: ap.bssid === connecting.value || isDisconnecting(ap),
reveal_child:
ap.bssid === connecting.value || isDisconnecting(ap),
child: Widget.Spinner({
vpack: "start",
class_name: "spinner wap",

198
scss/menus/dashboard.scss
View File

@@ -1,11 +1,15 @@
@import "../colors";
.dashboard-content-items {
min-width: 30em;
min-width: 26.5em;
background: $crust;
border: 0.13em solid $surface0;
border-radius: 0.7em;
button {
border-radius: 0.4em;
}
.dashboard-card {
background: $base;
margin: 1.3em;
@@ -15,7 +19,7 @@
.profile-picture-container {
.profile-picture {
font-size: 10em;
font-size: 7.5em;
}
.profile-name {
font-size: 1.5em;
@@ -28,12 +32,11 @@
margin-left: 0em;
.dashboard-button {
min-width: 2.5em;
min-width: 3em;
min-height: 2.5em;
border-radius: 0.4em;
&:not(:last-child) {
margin-bottom: 1em;
margin-bottom: 0.75em;
}
image {
@@ -61,4 +64,189 @@
}
}
.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;
&.most-used {
margin-right: 0em;
}
button {
background: $lavender;
color: $base;
min-height: 3em;
label {
font-size: 1.5em;
}
&.record.active {
background: $red;
}
&:hover {
background: $pink;
}
}
}
}
.controls-container {
&.dashboard-card {
margin-top: 0em;
// padding: 1em;
}
button {
background: $red;
padding: 0em;
min-height: 3em;
label {
color: $base;
font-size: 1.6em;
}
&:not(:last-child) {
margin-right: 1em;
}
&.wifi {
background: $mauve;
}
&.bluetooth {
background: $sky;
}
&.notifications {
background: $yellow;
}
&.playback {
background: $maroon;
}
&.input {
background: $pink;
}
&:hover {
background: $surface2;
}
&.disabled {
background: $surface2;
&.wifi:hover {
background: $mauve;
}
&.bluetooth:hover {
background: $sky;
}
&.notifications:hover {
background: $yellow;
}
&.playback:hover {
background: $maroon;
}
&.input:hover {
background: $pink;
}
}
}
}
.stats-container {
margin-top: 0em;
.stat {
label {
margin-right: 1em;
font-size: 1.5em;
}
&.cpu label{
color: $maroon;
}
&.ram label{
color: $yellow;
}
&.gpu label{
color: $green;
}
&.storage label{
color: $pink;
}
.stats-bar {
levelbar * {
transition: 200ms;
}
trough {
min-height: 1.2em;
}
block {
border-radius: 0.4em;
&.empty {
background: $surface1;
}
&.filled {
padding-left: 0.85em;
}
}
}
&.cpu .stats-bar block.filled {
background: $maroon;
}
&.ram .stats-bar block.filled {
background: $yellow;
}
&.gpu .stats-bar block.filled {
background: $green;
}
&.storage .stats-bar block.filled {
background: $pink;
}
}
.stat-value {
margin-bottom: 0.75em;
font-size: 0.9em;
&.cpu {
color: $maroon;
}
&.ram {
color: $yellow;
}
&.gpu {
color: $green;
}
&.storage {
color: $pink;
}
}
}
}

4
scss/menus/menu.scss
View File

@@ -94,13 +94,13 @@ tooltip label {
background: $crust;
border: .13em solid $surface0;
border-radius: .7rem;
min-width: 275px;
min-width: 400px;
color: $text;
}
.menu-items-container {
border-radius: 0.4em;
min-width: 275px;
min-width: 400px;
}
.menu-section-container {

91
services/screen_record.sh Normal file
View File

@@ -0,0 +1,91 @@
#!/bin/bash
outputDir="$HOME/Videos"
checkRecording() {
if pgrep -x "gpu-screen-recorder" > /dev/null; then
return 0
else
return 1
fi
}
startRecording() {
if checkRecording; then
echo "A recording is already in progress."
exit 1
fi
if [ -z "$2" ]; then
echo "Usage: $0 start {screen|window} [screen_name|window_id]"
exit 1
fi
mode="$2"
target="$3"
outputFile="recording_$(date +%Y-%m-%d_%H-%M-%S).mp4"
outputPath="$outputDir/$outputFile"
mkdir -p "$outputDir"
case "$mode" in
screen)
if [ -z "$target" ]; then
echo "Usage: $0 start screen [screen_name]"
exit 1
fi
gpu-screen-recorder -w "$target" -f 60 -a "$(pactl get-default-sink).monitor" -o "$outputPath" &
;;
window)
if [ -z "$target" ]; then
echo "Usage: $0 start window [window_id]"
exit 1
fi
gpu-screen-recorder -w "$target" -f 60 -a "$(pactl get-default-sink).monitor" -o "$outputPath" &
;;
*)
echo "Invalid mode. Use 'screen' or 'window'."
exit 1
;;
esac
echo "Recording started. Output will be saved to $outputPath"
}
stopRecording() {
if ! checkRecording; then
echo "No recording is in progress."
exit 1
fi
pkill -SIGINT gpu-screen-recorder
recentFile=$(ls -t "$outputDir"/recording_*.mp4 | head -n 1)
notify-send "Recording stopped" "Your recording has been saved." \
-i video-x-generic \
-a "Screen Recorder" \
-t 10000 \
-u normal \
--action="open_directory=xdg-open $outputDir" \
--action="play_recording=xdg-open $recentFile"
echo "Recording stopped. Output saved to $recentFile"
}
case "$1" in
start)
startRecording "$@"
;;
stop)
stopRecording
;;
status)
if checkRecording; then
echo "A recording is in progress."
else
echo "No recording is in progress."
fi
;;
*)
echo "Usage: $0 {start {screen|window} [screen_name|window_id]|stop|status}"
exit 1
;;
esac

228
style.css
View File

@@ -654,6 +654,18 @@ tooltip label {
margin-top: 2.8em;
}
@keyframes spin {
to {
-gtk-icon-transform: rotate(1turn);
}
}
image.spinning {
animation-name: spin;
animation-duration: 1s;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
window#powermenu,
window#verification {
background-color: rgba(0, 0, 0, 0.4);
@@ -851,6 +863,12 @@ window#powermenu .powermenu.box {
.menu-items-container.network .menu-label {
color: #cba6f7;
}
.menu-items-container.network .menu-icon-button.network {
margin: 1em;
}
.menu-items-container.network .menu-icon-button.network:hover {
color: #cba6f7;
}
.menu-items-container.network .network-icon {
font-size: 1.3em;
min-width: 1em;
@@ -927,17 +945,6 @@ window#powermenu .powermenu.box {
font-size: 0.8em;
margin-bottom: 0em;
}
@keyframes spin {
to {
-gtk-icon-transform: rotate(1turn);
}
}
.menu-items-container.bluetooth button.search image.spinning {
animation-name: spin;
animation-duration: 1s;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
.menu-items-container.bluetooth button.search image {
color: #cdd6f4;
}
@@ -1308,6 +1315,205 @@ window#powermenu .powermenu.box {
margin-bottom: 0.2em;
}
.dashboard-content-items {
min-width: 26.5em;
background: #11111b;
border: 0.13em solid #313244;
border-radius: 0.7em;
}
.dashboard-content-items button {
border-radius: 0.4em;
}
.dashboard-content-items .dashboard-card {
background: #1e1e2e;
margin: 1.3em;
border-radius: 0.4em;
padding: 1.5em;
}
.dashboard-content-items .profile-picture-container .profile-picture {
font-size: 7.5em;
}
.dashboard-content-items .profile-picture-container .profile-name {
font-size: 1.5em;
color: #f5c2e7;
margin-top: 0.75em;
}
.dashboard-content-items .power-menu-container {
margin-left: 0em;
}
.dashboard-content-items .power-menu-container .dashboard-button {
min-width: 3em;
min-height: 2.5em;
}
.dashboard-content-items .power-menu-container .dashboard-button:not(:last-child) {
margin-bottom: 0.75em;
}
.dashboard-content-items .power-menu-container .dashboard-button image {
color: #1e1e2e;
font-size: 1.5em;
}
.dashboard-content-items .power-menu-container .dashboard-button.shutdown {
background: #f38ba8;
}
.dashboard-content-items .power-menu-container .dashboard-button.restart {
background: #fab387;
}
.dashboard-content-items .power-menu-container .dashboard-button.lock {
background: #a6e3a1;
}
.dashboard-content-items .power-menu-container .dashboard-button.sleep {
background: #89dceb;
}
.dashboard-content-items .power-menu-container .dashboard-button:hover {
background: #cba6f7;
}
.dashboard-content-items .shortcuts-container .dashboard-card {
padding: 1.5em;
}
.dashboard-content-items .shortcuts-container .dashboard-card button {
min-height: 2.5em;
min-width: 2.5em;
}
.dashboard-content-items .shortcuts-container .card-button-left-section {
margin-right: 1.5em;
}
.dashboard-content-items .shortcuts-container .top-button {
margin-bottom: 1.5em;
}
.dashboard-content-items .shortcuts-container .container {
margin-top: 0em;
}
.dashboard-content-items .shortcuts-container .container.most-used {
margin-right: 0em;
}
.dashboard-content-items .shortcuts-container .container button {
background: #b4befe;
color: #1e1e2e;
min-height: 3em;
}
.dashboard-content-items .shortcuts-container .container button label {
font-size: 1.5em;
}
.dashboard-content-items .shortcuts-container .container button.record.active {
background: #f38ba8;
}
.dashboard-content-items .shortcuts-container .container button:hover {
background: #f5c2e7;
}
.dashboard-content-items .controls-container.dashboard-card {
margin-top: 0em;
}
.dashboard-content-items .controls-container button {
background: #f38ba8;
padding: 0em;
min-height: 3em;
}
.dashboard-content-items .controls-container button label {
color: #1e1e2e;
font-size: 1.6em;
}
.dashboard-content-items .controls-container button:not(:last-child) {
margin-right: 1em;
}
.dashboard-content-items .controls-container button.wifi {
background: #cba6f7;
}
.dashboard-content-items .controls-container button.bluetooth {
background: #89dceb;
}
.dashboard-content-items .controls-container button.notifications {
background: #f9e2af;
}
.dashboard-content-items .controls-container button.playback {
background: #eba0ac;
}
.dashboard-content-items .controls-container button.input {
background: #f5c2e7;
}
.dashboard-content-items .controls-container button:hover {
background: #585b70;
}
.dashboard-content-items .controls-container button.disabled {
background: #585b70;
}
.dashboard-content-items .controls-container button.disabled.wifi:hover {
background: #cba6f7;
}
.dashboard-content-items .controls-container button.disabled.bluetooth:hover {
background: #89dceb;
}
.dashboard-content-items .controls-container button.disabled.notifications:hover {
background: #f9e2af;
}
.dashboard-content-items .controls-container button.disabled.playback:hover {
background: #eba0ac;
}
.dashboard-content-items .controls-container button.disabled.input:hover {
background: #f5c2e7;
}
.dashboard-content-items .stats-container {
margin-top: 0em;
}
.dashboard-content-items .stats-container .stat label {
margin-right: 1em;
font-size: 1.5em;
}
.dashboard-content-items .stats-container .stat.cpu label {
color: #eba0ac;
}
.dashboard-content-items .stats-container .stat.ram label {
color: #f9e2af;
}
.dashboard-content-items .stats-container .stat.gpu label {
color: #a6e3a1;
}
.dashboard-content-items .stats-container .stat.storage label {
color: #f5c2e7;
}
.dashboard-content-items .stats-container .stat .stats-bar levelbar * {
transition: 200ms;
}
.dashboard-content-items .stats-container .stat .stats-bar trough {
min-height: 1.2em;
}
.dashboard-content-items .stats-container .stat .stats-bar block {
border-radius: 0.4em;
}
.dashboard-content-items .stats-container .stat .stats-bar block.empty {
background: #45475a;
}
.dashboard-content-items .stats-container .stat .stats-bar block.filled {
padding-left: 0.85em;
}
.dashboard-content-items .stats-container .stat.cpu .stats-bar block.filled {
background: #eba0ac;
}
.dashboard-content-items .stats-container .stat.ram .stats-bar block.filled {
background: #f9e2af;
}
.dashboard-content-items .stats-container .stat.gpu .stats-bar block.filled {
background: #a6e3a1;
}
.dashboard-content-items .stats-container .stat.storage .stats-bar block.filled {
background: #f5c2e7;
}
.dashboard-content-items .stats-container .stat-value {
margin-bottom: 0.75em;
font-size: 0.9em;
}
.dashboard-content-items .stats-container .stat-value.cpu {
color: #eba0ac;
}
.dashboard-content-items .stats-container .stat-value.ram {
color: #f9e2af;
}
.dashboard-content-items .stats-container .stat-value.gpu {
color: #a6e3a1;
}
.dashboard-content-items .stats-container .stat-value.storage {
color: #f5c2e7;
}
.notification-card-container {
margin-top: 3.5rem;
}

2
style.css.map
View File

File diff suppressed because one or more lines are too long