Updated weather and power button icons to use text-icons rather than system icons. (#232)
* Replace weather and power icons with nerdfont icons. * Update power icons for power dropdown menu.
This commit is contained in:
@@ -1,32 +1,41 @@
|
||||
import { Weather } from "lib/types/weather.js";
|
||||
import { Variable } from "types/variable.js";
|
||||
import icons from "../../../../../icons/index.js";
|
||||
import { weatherIcons } from "modules/icons/weather.js";
|
||||
|
||||
export const HourlyIcon = (theWeather: Variable<Weather>, getNextEpoch: any) => {
|
||||
return Widget.Icon({
|
||||
class_name: "hourly-weather-icon",
|
||||
icon: theWeather.bind("value").as((w) => {
|
||||
if (!Object.keys(w).length) {
|
||||
return "-";
|
||||
}
|
||||
const getIconQuery = (wthr: Weather) => {
|
||||
|
||||
const nextEpoch = getNextEpoch(w);
|
||||
const weatherAtEpoch = w.forecast.forecastday[0].hour.find(
|
||||
(h) => h.time_epoch === nextEpoch,
|
||||
);
|
||||
const nextEpoch = getNextEpoch(wthr);
|
||||
const weatherAtEpoch = wthr.forecast.forecastday[0].hour.find(
|
||||
(h) => h.time_epoch === nextEpoch,
|
||||
);
|
||||
|
||||
let iconQuery = weatherAtEpoch?.condition.text
|
||||
.trim()
|
||||
.toLowerCase()
|
||||
.replaceAll(" ", "_")
|
||||
|| "warning"
|
||||
;
|
||||
let iconQuery = weatherAtEpoch?.condition.text
|
||||
.trim()
|
||||
.toLowerCase()
|
||||
.replaceAll(" ", "_")
|
||||
|| "warning"
|
||||
;
|
||||
|
||||
if (!weatherAtEpoch?.is_day && iconQuery === "partly_cloudy") {
|
||||
iconQuery = "partly_cloudy_night";
|
||||
}
|
||||
if (!weatherAtEpoch?.is_day && iconQuery === "partly_cloudy") {
|
||||
iconQuery = "partly_cloudy_night";
|
||||
}
|
||||
return iconQuery;
|
||||
}
|
||||
|
||||
return icons.weather[iconQuery];
|
||||
}),
|
||||
});
|
||||
return Widget.Box({
|
||||
hpack: "center",
|
||||
child: theWeather.bind("value").as((w) => {
|
||||
let weatherIcn = "-";
|
||||
|
||||
const iconQuery = getIconQuery(w);
|
||||
weatherIcn = weatherIcons[iconQuery];
|
||||
return Widget.Label({
|
||||
hpack: "center",
|
||||
class_name: "hourly-weather-icon txt-icon",
|
||||
label: weatherIcn,
|
||||
});
|
||||
})
|
||||
|
||||
})
|
||||
};
|
||||
|
||||
@@ -1,19 +1,17 @@
|
||||
import { Weather } from "lib/types/weather";
|
||||
import { Variable } from "types/variable";
|
||||
import { getWeatherStatusIcon } from "globals/weather.js";
|
||||
import { getWeatherStatusTextIcon } from "globals/weather.js";
|
||||
|
||||
export const TodayIcon = (theWeather: Variable<Weather>) => {
|
||||
return Widget.Box({
|
||||
vpack: "center",
|
||||
hpack: "start",
|
||||
class_name: "calendar-menu-weather today icon container",
|
||||
children: [
|
||||
Widget.Icon({
|
||||
class_name: "calendar-menu-weather today icon",
|
||||
icon: theWeather.bind("value").as((v) => {
|
||||
return getWeatherStatusIcon(v);
|
||||
}),
|
||||
child: Widget.Label({
|
||||
class_name: "calendar-menu-weather today icon txt-icon",
|
||||
label: theWeather.bind("value").as((w) => {
|
||||
return getWeatherStatusTextIcon(w);
|
||||
}),
|
||||
],
|
||||
});
|
||||
})
|
||||
})
|
||||
};
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
import icons from "../../../icons/index.js";
|
||||
import powermenu from "../../power/helpers/actions.js";
|
||||
import { PowerOptions } from "lib/types/options.js";
|
||||
import GdkPixbuf from "gi://GdkPixbuf";
|
||||
@@ -25,6 +24,13 @@ const Profile = () => {
|
||||
}
|
||||
};
|
||||
|
||||
const getIconForButton = (txtIcon: string) => {
|
||||
return Widget.Label({
|
||||
className: "txt-icon",
|
||||
label: txtIcon
|
||||
})
|
||||
}
|
||||
|
||||
return Widget.Box({
|
||||
class_name: "profiles-container",
|
||||
hpack: "fill",
|
||||
@@ -69,30 +75,30 @@ const Profile = () => {
|
||||
on_clicked: () => handleClick("shutdown"),
|
||||
tooltip_text: "Shut Down",
|
||||
vexpand: true,
|
||||
child: Widget.Icon(icons.powermenu.shutdown),
|
||||
child: getIconForButton("")
|
||||
}),
|
||||
Widget.Button({
|
||||
class_name: "dashboard-button restart",
|
||||
on_clicked: () => handleClick("reboot"),
|
||||
tooltip_text: "Restart",
|
||||
vexpand: true,
|
||||
child: Widget.Icon(icons.powermenu.reboot),
|
||||
child: getIconForButton("")
|
||||
}),
|
||||
Widget.Button({
|
||||
class_name: "dashboard-button lock",
|
||||
on_clicked: () => handleClick("logout"),
|
||||
tooltip_text: "Log Out",
|
||||
vexpand: true,
|
||||
child: Widget.Icon(icons.powermenu.logout),
|
||||
child: getIconForButton("")
|
||||
}),
|
||||
Widget.Button({
|
||||
class_name: "dashboard-button sleep",
|
||||
on_clicked: () => handleClick("sleep"),
|
||||
tooltip_text: "Sleep",
|
||||
vexpand: true,
|
||||
child: Widget.Icon(icons.powermenu.sleep),
|
||||
child: getIconForButton("")
|
||||
}),
|
||||
],
|
||||
]
|
||||
}),
|
||||
],
|
||||
});
|
||||
|
||||
@@ -23,6 +23,13 @@ export const PowerButton = (action: PowerOptions) => {
|
||||
}
|
||||
};
|
||||
|
||||
const powerIconMap = {
|
||||
shutdown: "",
|
||||
reboot: "",
|
||||
logout: "",
|
||||
sleep: "",
|
||||
};
|
||||
|
||||
return Widget.Button({
|
||||
className: showLabel.bind("value").as(shwLbl => {
|
||||
return `power-menu-button ${action} ${!shwLbl ? "no-label" : ""}`;
|
||||
@@ -33,9 +40,9 @@ export const PowerButton = (action: PowerOptions) => {
|
||||
children: showLabel.bind("value").as(shwLbl => {
|
||||
if (shwLbl) {
|
||||
return [
|
||||
Widget.Icon({
|
||||
icon: icons.powermenu[action],
|
||||
className: `power-button-icon ${action}-icon`,
|
||||
Widget.Label({
|
||||
label: powerIconMap[action],
|
||||
className: `power-button-icon ${action}-icon txt-icon`,
|
||||
}),
|
||||
Widget.Label({
|
||||
hpack: "center",
|
||||
@@ -46,9 +53,9 @@ export const PowerButton = (action: PowerOptions) => {
|
||||
];
|
||||
}
|
||||
return [
|
||||
Widget.Icon({
|
||||
icon: icons.powermenu[action],
|
||||
className: `power-button-icon ${action}-icon no-label`,
|
||||
Widget.Label({
|
||||
label: powerIconMap[action],
|
||||
className: `power-button-icon ${action}-icon no-label txt-icon`,
|
||||
}),
|
||||
];
|
||||
}),
|
||||
|
||||
Reference in New Issue
Block a user