mirror of
https://github.com/hydralauncher/hydra.git
synced 2025-01-23 13:34:54 +03:00
background
This commit is contained in:
parent
c6da57995d
commit
fc8e62cdea
@ -82,6 +82,7 @@
|
||||
"@electron-toolkit/tsconfig": "^1.0.1",
|
||||
"@swc/core": "^1.4.16",
|
||||
"@types/auto-launch": "^5.0.5",
|
||||
"@types/color": "^3.0.6",
|
||||
"@types/jsdom": "^21.1.6",
|
||||
"@types/lodash-es": "^4.17.12",
|
||||
"@types/node": "^20.12.7",
|
||||
|
@ -63,6 +63,7 @@ export function SidebarProfile() {
|
||||
|
||||
{userDetails && runningGame && (
|
||||
<img
|
||||
alt={runningGame.title}
|
||||
width={24}
|
||||
style={{ borderRadius: 4 }}
|
||||
src={runningGame.iconUrl}
|
||||
|
@ -43,5 +43,12 @@ export const buildGameDetailsPath = (
|
||||
return `/game/${game.shop}/${game.objectID}?${searchParams.toString()}`;
|
||||
};
|
||||
|
||||
export const darkenColor = (color: string, amount: number) =>
|
||||
new Color(color).darken(amount).toString();
|
||||
export const darkenColor = (
|
||||
color: string,
|
||||
amount: number,
|
||||
alpha: number = 1
|
||||
) => {
|
||||
const newColor = new Color(color).darken(amount).alpha(alpha).toString();
|
||||
console.log(color, newColor);
|
||||
return newColor;
|
||||
};
|
||||
|
@ -36,8 +36,7 @@ export function useUserDetails() {
|
||||
format: "hex",
|
||||
});
|
||||
|
||||
const profileBackground = `linear-gradient(135deg, ${darkenColor(output as string, 0.6)}, ${darkenColor(output as string, 0.8)})`;
|
||||
|
||||
const profileBackground = `linear-gradient(135deg, ${darkenColor(output as string, 0.6)}, ${darkenColor(output as string, 0.8, 0.9)})`;
|
||||
dispatch(setProfileBackground(profileBackground));
|
||||
|
||||
window.localStorage.setItem(
|
||||
@ -45,7 +44,8 @@ export function useUserDetails() {
|
||||
JSON.stringify({ ...userDetails, profileBackground })
|
||||
);
|
||||
} else {
|
||||
dispatch(setProfileBackground(null));
|
||||
const profileBackground = `#151515e6`;
|
||||
dispatch(setProfileBackground(profileBackground));
|
||||
|
||||
window.localStorage.setItem("userDetails", JSON.stringify(userDetails));
|
||||
}
|
||||
|
@ -104,6 +104,17 @@ export function UserContent({
|
||||
position: "relative",
|
||||
}}
|
||||
>
|
||||
{runningGame && (
|
||||
<div
|
||||
style={{
|
||||
background: `url(${steamUrlBuilder.libraryHero(runningGame.objectID)})`,
|
||||
position: "absolute",
|
||||
inset: 0,
|
||||
backgroundSize: "cover",
|
||||
}}
|
||||
></div>
|
||||
)}
|
||||
|
||||
<div
|
||||
style={{
|
||||
background: profileContentBoxBackground,
|
||||
@ -111,17 +122,6 @@ export function UserContent({
|
||||
inset: 0,
|
||||
}}
|
||||
></div>
|
||||
{runningGame && (
|
||||
<div
|
||||
style={{
|
||||
background: `url(${steamUrlBuilder.libraryHero(runningGame.objectID)})`,
|
||||
position: "absolute",
|
||||
inset: 0,
|
||||
opacity: 0.1,
|
||||
backgroundSize: "cover",
|
||||
}}
|
||||
></div>
|
||||
)}
|
||||
|
||||
<div className={styles.profileAvatarContainer}>
|
||||
{userProfile.profileImageUrl ? (
|
||||
|
@ -133,7 +133,6 @@ export interface RunningGame {
|
||||
objectID: string;
|
||||
shop: GameShop;
|
||||
sessionStartTimestamp: number;
|
||||
cover: string;
|
||||
}
|
||||
|
||||
export interface DownloadProgress {
|
||||
|
19
yarn.lock
19
yarn.lock
@ -1251,6 +1251,25 @@
|
||||
"@types/node" "*"
|
||||
"@types/responselike" "^1.0.0"
|
||||
|
||||
"@types/color-convert@*":
|
||||
version "2.0.3"
|
||||
resolved "https://registry.yarnpkg.com/@types/color-convert/-/color-convert-2.0.3.tgz#e93f5c991eda87a945058b47044f5f0008b0dce9"
|
||||
integrity sha512-2Q6wzrNiuEvYxVQqhh7sXM2mhIhvZR/Paq4FdsQkOMgWsCIkKvSGj8Le1/XalulrmgOzPMqNa0ix+ePY4hTrfg==
|
||||
dependencies:
|
||||
"@types/color-name" "*"
|
||||
|
||||
"@types/color-name@*":
|
||||
version "1.1.4"
|
||||
resolved "https://registry.yarnpkg.com/@types/color-name/-/color-name-1.1.4.tgz#e002611ff627347818d440a05e81650e9a4053b8"
|
||||
integrity sha512-hulKeREDdLFesGQjl96+4aoJSHY5b2GRjagzzcqCfIrWhe5vkCqIvrLbqzBaI1q94Vg8DNJZZqTR5ocdWmWclg==
|
||||
|
||||
"@types/color@^3.0.6":
|
||||
version "3.0.6"
|
||||
resolved "https://registry.yarnpkg.com/@types/color/-/color-3.0.6.tgz#29c27a99d4de2975e1676712679a0bd7f646a3fb"
|
||||
integrity sha512-NMiNcZFRUAiUUCCf7zkAelY8eV3aKqfbzyFQlXpPIEeoNDbsEHGpb854V3gzTsGKYj830I5zPuOwU/TP5/cW6A==
|
||||
dependencies:
|
||||
"@types/color-convert" "*"
|
||||
|
||||
"@types/conventional-commits-parser@^5.0.0":
|
||||
version "5.0.0"
|
||||
resolved "https://registry.yarnpkg.com/@types/conventional-commits-parser/-/conventional-commits-parser-5.0.0.tgz#8c9d23e0b415b24b91626d07017303755d542dc8"
|
||||
|
Loading…
Reference in New Issue
Block a user