GithubProxy/coai
1
0
Fork 0
mirror of https://github.com/coaidev/coai.git synced 2025-06-01 11:20:26 +09:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix badge css

Browse Source
This commit is contained in:
Zhang Minghan 2023-10-25 15:25:14 +08:00
parent 9c9d1cc65d
commit 8f600d5c7d
3 changed files with 32 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
app/src/assets/ui.less
View File

@ -38,7 +38,7 @@
border-color: hsl(var(--border-hover));
color: hsl(var(--background));
.badge {
.select-element.badge {
&.badge-default {
background: hsl(var(--background)) !important;
color: hsl(var(--text));
@ -49,25 +49,25 @@
}
}
}
.badge {
user-select: none;
transition: .2s;
padding-left: 0.45rem;
padding-right: 0.45rem;
&.badge-default {
background: hsl(var(--primary)) !important;
&:hover {
background: hsl(var(--primary)) !important;
}
}
&.badge-gold {
color: rgb(164, 128, 0) !important;
background: rgb(255, 231, 145) !important;
}
}
}
}
.select-element.badge {
user-select: none;
transition: .2s;
padding-left: 0.45rem;
padding-right: 0.45rem;
&.badge-default {
background: hsl(var(--primary)) !important;
&:hover {
background: hsl(var(--primary)) !important;
}
}
&.badge-gold {
color: rgb(164, 128, 0) !important;
background: rgb(255, 231, 145) !important;
}
}

2
app/src/components/SelectGroup.tsx
View File

@ -33,7 +33,7 @@ function GroupSelectItem(props: SelectItemProps) {
<>
{props.value}
{props.badge && (
<Badge className={`badge ml-1 badge-${props.badge.variant}`}>
<Badge className={`select-element badge ml-1 badge-${props.badge.variant}`}>
{props.badge.name}
</Badge>
)}

18
app/src/utils.ts
View File

@ -1,18 +1,20 @@
import React, { useEffect } from "react";
import { FileObject } from "./components/FileProvider.tsx";
export let mobile =
window.innerWidth <= 468 ||
window.innerHeight <= 468 ||
navigator.userAgent.includes("Mobile");
export let mobile = isMobile();
window.addEventListener("resize", () => {
mobile =
window.innerWidth <= 468 ||
window.innerHeight <= 468 ||
navigator.userAgent.includes("Mobile");
mobile = isMobile();
});
export function isMobile(): boolean {
return (
(document.documentElement.clientWidth || window.innerWidth) <= 668 ||
(document.documentElement.clientHeight || window.innerHeight) <= 468 ||
navigator.userAgent.includes("Mobile")
);
}
export function useEffectAsync<T>(effect: () => Promise<T>, deps?: any[]) {
return useEffect(() => {
effect().catch((err) =>