ColdBreeze/ColdBreeze-chat-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: remove hover effects in mobile

Browse Source
This commit is contained in:
Tristan Yang
2023-02-20 12:54:45 +08:00
parent 567b3714bc
commit 053c7d9402
27 changed files with 46 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/common/component/AddEntriesMenu.tsx
+1 -1
View File
@@ -42,7 +42,7 @@ export default function AddEntriesMenu() {
setChannelModalVisible(false);
};
const itemClass = "rounded flex items-center gap-2 text-sm font-semibold cursor-pointer px-2 py-2.5 hover:bg-gray-800/20 dark:hover:bg-gray-200/20";
const itemClass = "rounded flex items-center gap-2 text-sm font-semibold cursor-pointer px-2 py-2.5 md:hover:bg-gray-800/20 md:dark:hover:bg-gray-200/20";
const iconClass = "w-5 h-5 dark:fill-gray-300";
return (
<>
src/common/component/ChannelModal/index.tsx
+1 -1
View File
@@ -114,7 +114,7 @@ const ChannelModal: FC<Props> = ({ personal = false, closeModal }) => {
<li
key={uid}
data-uid={uid}
className="cursor-pointer flex items-center px-4 rounded hover:bg-gray-500/10"
className="cursor-pointer flex items-center px-4 rounded md:hover:bg-gray-500/10"
onClick={loginUid == uid ? undefined : toggleCheckMember}
>
<StyledCheckbox
src/common/component/ForwardModal/index.tsx
+2 -2
View File
@@ -95,7 +95,7 @@ const ForwardModal: FC<IProps> = ({ mids, closeModal }) => {
key={gid}
data-type="channel"
data-id={gid}
className="cursor-pointer flex items-center px-4 rounded hover:bg-gray-600/10"
className="cursor-pointer flex items-center px-4 rounded md:hover:bg-gray-600/10"
onClick={toggleCheck}
>
<StyledCheckbox readOnly checked={checked} name="cb" id="cb" />
@@ -112,7 +112,7 @@ const ForwardModal: FC<IProps> = ({ mids, closeModal }) => {
key={uid}
data-id={uid}
data-type="user"
className="cursor-pointer flex items-center px-4 rounded hover:bg-gray-600/10"
className="cursor-pointer flex items-center px-4 rounded md:hover:bg-gray-600/10"
onClick={toggleCheck}
>
<StyledCheckbox readOnly checked={checked} name="cb" id="cb" />
src/common/component/InviteModal/AddMembers.tsx
+1 -1
View File
@@ -82,7 +82,7 @@ const AddMembers: FC<Props> = ({ cid = 0, closeModal }) => {
<li
key={uid}
data-uid={uid}
className="cursor-pointer flex items-center px-2 py-1 rounded-lg hover:bg-slate-400/20"
className="cursor-pointer flex items-center px-2 py-1 rounded-lg md:hover:bg-slate-400/20"
onClick={added ? undefined : toggleCheckMember}
>
<StyledCheckbox
src/common/component/ManageMembers/index.tsx
+1 -1
View File
@@ -73,7 +73,7 @@ const ManageMembers: FC<Props> = ({ cid }) => {
const canRemoveFromChannel =
channel && channel.owner == loginUser?.uid && loginUser?.uid != uid;
return (
<li key={uid} className="w-full flex items-center justify-between px-3 py-2 rounded-md hover:bg-slate-50 dark:hover:bg-gray-800">
<li key={uid} className="w-full flex items-center justify-between px-3 py-2 rounded-md md:hover:bg-slate-50 md:dark:hover:bg-gray-800">
<div className="flex gap-4">
<User compact uid={uid} interactive={false} />
<div className="flex flex-col">
src/common/component/Message/Commands.tsx
+6 -15
View File
@@ -82,16 +82,7 @@ const Commands: FC<Props> = ({ context = "user", contextId = 0, mid = 0, toggleE
toast.error("Added Favorites Failed!");
}
};
// const StyledCmds = styled.ul`
// > .picker {
// position: absolute;
// left: -10px;
// top: 0;
// transform: translateX(-100%);
// }
// `;
const cmdClass = `flex cursor-pointer p-1 md:hover:bg-gray-100 md:dark:hover:bg-gray-800`;
return (
<>
<ul
@@ -105,27 +96,27 @@ const Commands: FC<Props> = ({ context = "user", contextId = 0, mid = 0, toggleE
trigger="click"
content={<ReactionPicker mid={mid} hidePicker={hideAll} />}
>
<li className="flex cursor-pointer p-1 hover:bg-gray-100 dark:hover:bg-gray-800">
<li className={cmdClass}>
<Tooltip placement="top" tip={t("action.add_reaction")}>
<img src={reactIcon} className="toggler w-6 h-6" alt="icon emoji" />
</Tooltip>
</li>
</Tippy>
{canEdit && (
<li className="flex cursor-pointer p-1 hover:bg-gray-100 dark:hover:bg-gray-800" onClick={toggleEditMessage}>
<li className={cmdClass} onClick={toggleEditMessage}>
<Tooltip placement="top" tip={t("action.edit")}>
<img src={editIcon} className="w-6 h-6" alt="icon edit" />
</Tooltip>
</li>
)}
{canReply && (
<li className="flex cursor-pointer p-1 hover:bg-gray-100 dark:hover:bg-gray-800" onClick={handleReply}>
<li className={cmdClass} onClick={handleReply}>
<Tooltip placement="top" tip={t("action.reply")}>
<img src={replyIcon} className="w-6 h-6" alt="icon reply" />
</Tooltip>
</li>
)}
<li className="flex cursor-pointer p-1 hover:bg-gray-100 dark:hover:bg-gray-800" onClick={handleAddFav}>
<li className={cmdClass} onClick={handleAddFav}>
<Tooltip placement="top" tip={t("action.add_to_fav")}>
<IconBookmark className="fill-slate-500 w-6 h-6" />
</Tooltip>
@@ -166,7 +157,7 @@ const Commands: FC<Props> = ({ context = "user", contextId = 0, mid = 0, toggleE
/>
}
>
<li className="flex cursor-pointer p-1 hover:bg-gray-100 dark:hover:bg-gray-800">
<li className="flex cursor-pointer p-1 md:hover:bg-gray-100 md:dark:hover:bg-gray-800">
<Tooltip placement="top" tip={t("more")}>
<img src={moreIcon} alt="icon more" />
</Tooltip>
src/common/component/Message/FavoredMessage.tsx
+1 -1
View File
@@ -22,7 +22,7 @@ const FavoredMessage: FC<Props> = ({ id = "" }) => {
{messages.map((msg, idx) => {
const { user = {}, download, content, content_type, properties, thumbnail } = msg;
return (
<div className="w-full relative flex items-start gap-3 px-2 py-1 my-2 rounded-lg dark:hover:bg-gray-800" key={idx}>
<div className="w-full relative flex items-start gap-3 px-2 py-1 my-2 rounded-lg md:dark:hover:bg-gray-800" key={idx}>
{user && (
<div className="shrink-0 w-10 h-10 flex">
<Avatar width={40} height={40} className="rounded-full object-cover" src={user.avatar} name={user.name} />
src/common/component/Message/Reaction.tsx
+2 -2
View File
@@ -65,7 +65,7 @@ const Reaction: FC<Props> = ({ mid, reactions = null, readOnly = false }) => {
return uids.length > 0 ? (
<span
onClick={readOnly ? undefined : handleReact.bind(null, reaction)}
className={`cursor-pointer rounded-md relative flex items-center gap-1 p-1 hover:bg-cyan-100 ${reacted ? "shadow-[inset_0_0_0_1px_#06aed4] bg-cyan-200" : ""}`}
className={`cursor-pointer rounded-md relative flex items-center gap-1 p-1 md:hover:bg-cyan-100 ${reacted ? "shadow-[inset_0_0_0_1px_#06aed4] bg-cyan-200" : ""}`}
key={reaction}
>
<Tippy
@@ -93,7 +93,7 @@ const Reaction: FC<Props> = ({ mid, reactions = null, readOnly = false }) => {
trigger="click"
content={<ReactionPicker mid={mid} hidePicker={hideAll} />}
>
<button className="invisible group-hover:visible w-6 h-6 bg-cyan-100 hover:bg-cyan-200 rounded-md flex-center">
<button className="invisible group-hover:visible w-6 h-6 bg-cyan-100 md:hover:bg-cyan-200 rounded-md flex-center">
<IconAddEmoji className={'w-4 h-4'} />
</button>
</Tippy>
src/common/component/Message/ReactionPicker.tsx
+1 -1
View File
@@ -28,7 +28,7 @@ const ReactionPicker: FC<Props> = ({ mid, hidePicker }) => {
reactionData[emoji] && reactionData[emoji].findIndex((id) => id == currUid) > -1;
return (
<li
className={`flex-center cursor-pointer rounded-lg p-4 hover:bg-gray-50 w-4 h-4 ${reacted ? "bg-gray-50" : ""}`}
className={`flex-center cursor-pointer rounded-lg p-4 md:hover:bg-gray-50 w-4 h-4 ${reacted ? "bg-gray-50" : ""}`}
key={emoji}
onClick={handleReact.bind(null, emoji)}
>
src/common/component/Message/index.tsx
+1 -1
View File
@@ -96,7 +96,7 @@ const Message: FC<IProps> = ({
onContextMenu={readOnly ? undefined : handleContextMenuEvent}
data-msg-mid={mid}
ref={inviewRef}
className={clsx(`group w-full relative flex items-start gap-2 md:gap-4 px-1 md:px-2 py-1 my-2 rounded-lg dark:hover:bg-gray-800 hover:bg-gray-100`,
className={clsx(`group w-full relative flex items-start gap-2 md:gap-4 px-1 md:px-2 py-1 my-2 rounded-lg md:dark:hover:bg-gray-800 md:hover:bg-gray-100`,
readOnly && "hover:bg-transparent",
showExpire && "bg-red-200",
pinInfo && "bg-cyan-50 dark:bg-cyan-800 pt-7"
src/common/component/StyledSettingContainer.tsx
+1 -1
View File
@@ -41,7 +41,7 @@ const StyledSettingContainer: FC<PropsWithChildren<Props>> = ({
<ul key={title} data-title={title} className="flex flex-col gap-0.5 mb-5 md:mb-9 before:md:pl-3 before:content-[attr(data-title)] before:font-bold before:text-xs before:text-gray-400">
{items.map(({ name, title }) => {
return (
<li key={name} className={clsx(`md:text-sm font-semibold text-gray-600 whitespace-nowrap dark:text-gray-200 md:rounded hover:bg-stone-200 dark:hover:bg-slate-500/20`, name == nav?.name && "bg-stone-200 dark:bg-slate-500/20")}>
<li key={name} className={clsx(`md:text-sm font-semibold text-gray-600 whitespace-nowrap dark:text-gray-200 md:rounded md:hover:bg-stone-200 md:dark:hover:bg-slate-500/20`, name == nav?.name && "bg-stone-200 dark:bg-slate-500/20")}>
<NavLink to={`${pathPrefix}/${name}`} className="block md:px-3 py-1">{title}</NavLink>
</li>
);
src/common/component/UsersModal.tsx
+1 -1
View File
@@ -33,7 +33,7 @@ const UsersModal: FC<Props> = ({ closeModal }) => {
{users.map((u) => {
const { uid = 0 } = u || {};
return (
<li key={uid} className="cursor-pointer px-2 hover:bg-gray-600/10">
<li key={uid} className="cursor-pointer px-2 md:hover:bg-gray-600/10">
<NavLink className={'w-full'} onClick={closeModal} to={`/chat/dm/${uid}`}>
<User uid={uid} interactive={false} />
</NavLink>
src/common/component/Version.tsx
+2 -1
View File
@@ -1,6 +1,7 @@
import dayjs from "dayjs";
import { FC, useState } from "react";
import { useTranslation } from "react-i18next";
import { Ring } from "@uiball/loaders";
import { useGetServerVersionQuery } from "../../app/services/server";
import Button from "./styled/Button";
import { unregister } from '../../serviceWorkerRegistration';
@@ -28,7 +29,7 @@ const Version: FC<Props> = () => {
</strong>
</li>
<li>
<Button disabled={syncing} onClick={handleSync}>{t("sync")}</Button>
<Button disabled={syncing} onClick={handleSync}> {syncing ? <Ring size={18} color="#fff" /> : t("sync")}</Button>
</li>
</ul>
);
src/common/component/styled/Button.tsx
+2 -2
View File
@@ -10,14 +10,14 @@ const StyledButton = ({ children, className = '', ...rest }: Props) => {
const isSmall = className.includes('small');
const isMini = className.includes('mini');
const isFull = className.includes('flex');
return <button className={clsx(`text-sm text-white bg-primary-400 break-keep shadow rounded-lg px-3.5 py-2.5 hover:bg-primary-500 active:bg-primary-500 disabled:bg-gray-300`,
return <button className={clsx(`text-sm text-white bg-primary-400 break-keep shadow rounded-lg px-3.5 py-2.5 md:hover:bg-primary-500 active:bg-primary-500 disabled:bg-gray-300`,
isFull && "w-full",
isGhost && "!text-gray-600 dark:!text-gray-100 !border !border-solid !border-gray-300 !bg-transparent",
isCancel && "!bg-transparent !text-black dark:!text-gray-50 !border !border-solid !border-gray-200",
isSmall && "!py-2",
noBorder && "!shadow-none !border-none",
isMini && "!px-2.5 !py-1 !text-xs",
isDanger && "!bg-red-500 disabled:!bg-gray-300 hover:!bg-red-500/80 active:bg-red-700",
isDanger && "!bg-red-500 disabled:!bg-gray-300 md:hover:!bg-red-500/80 active:bg-red-700",
className
)} {...rest}>
{children}
src/routes/chat/GuestBlankPlaceholder.tsx
+2 -2
View File
@@ -21,8 +21,8 @@ const GuestBlankPlaceholder = () => {
navigateTo("/login");
};
return (
<section className="flex flex-col items-center">
<h2 className="text-3xl text-gray-600 dark:text-gray-50 font-bold text-center">{t("welcome", { name: serverName })}</h2>
<section className="flex flex-col items-center text-center">
<h2 className="text-3xl text-gray-600 dark:text-gray-50 font-bold">{t("welcome", { name: serverName })}</h2>
<div className="flex flex-col gap-2">
<span className="text-gray-400 dark:text-gray-200 my-3 text-sm">{t("guest_login_tip")}</span>
<div className="w-44 h-44 self-center mb-4">
src/routes/chat/GuestSessionList/Session.tsx
+1 -1
View File
@@ -39,7 +39,7 @@ const Session: FC<IProps> = ({ id, mid }) => {
return (
<li className="session">
<NavLink className={({ isActive: linkActive }) => clsx(`nav flex gap-2 rounded-lg p-2 w-full hover:bg-gray-500/20`, linkActive && "bg-gray-500/20")} to={`/chat/channel/${id}`}>
<NavLink className={({ isActive: linkActive }) => clsx(`nav flex gap-2 rounded-lg p-2 w-full md:hover:bg-gray-500/20`, linkActive && "bg-gray-500/20")} to={`/chat/channel/${id}`}>
<div className="flex bg-slate-50 rounded-full">
<Avatar width={40} height={40} className="icon" type="channel" name={name} src={icon} />
</div>
src/routes/chat/Layout/Operations.tsx
+4 -4
View File
@@ -55,17 +55,17 @@ const Operations: FC<Props> = ({ context, id }) => {
});
const canDel = canDelete(mids);
// const
const optClass = `p-2 bg-slate-100 rounded md:hover:bg-slate-300`;
return (
<>
<div className="relative p-4 flex-center gap-8 shadow-md">
<button className="p-2 bg-slate-100 rounded hover:bg-slate-300" onClick={toggleForwardModal}>
<button className={optClass} onClick={toggleForwardModal}>
<IconForward />
</button>
<button className="p-2 bg-slate-100 rounded hover:bg-slate-300" onClick={handleFav}>
<button className={optClass} onClick={handleFav}>
<IconBookmark />
</button>
<button className="p-2 bg-slate-100 rounded hover:bg-slate-300" disabled={!canDel} onClick={toggleDeleteModal.bind(null, false)}>
<button className={optClass} disabled={!canDel} onClick={toggleDeleteModal.bind(null, false)}>
<IconDelete />
</button>
<IconClose className="cursor-pointer absolute right-5 top-1/2 -translate-y-1/2" onClick={handleClose} />
src/routes/chat/SessionList/Session.tsx
+2 -2
View File
@@ -109,7 +109,7 @@ const Session: FC<IProps> = ({
>
<NavLink
ref={drop}
className={({ isActive: linkActive }) => clsx(`nav flex gap-2 rounded-lg p-2 w-full hover:bg-gray-500/20`, isActive && "shadow-[inset_0_0_0_2px_#52edff]", linkActive && "bg-gray-500/20")}
className={({ isActive: linkActive }) => clsx(`nav flex gap-2 rounded-lg p-2 w-full md:hover:bg-gray-500/20`, isActive && "shadow-[inset_0_0_0_2px_#52edff]", linkActive && "bg-gray-500/20")}
to={type == "user" ? `/chat/dm/${id}` : `/chat/channel/${id}`}
onContextMenu={handleContextMenuEvent}
>
@@ -142,7 +142,7 @@ const Session: FC<IProps> = ({
<div className="flex items-center justify-between">
<span className={clsx("text-xs text-gray-500 dark:text-gray-400 truncate", unreads > 0 ? `w-36` : ``)}>{renderPreviewMessage(previewMsg)}</span>
{unreads > 0 && (
<strong className={clsx(`text-white h-5 min-w-[20px] bg-primary-400 font-bold text-[10px] rounded-[10px] flex-center`, unreads > 99 && 'w-1.5 h-1.5 p-0 min-w-[unset]', muted && "bg-gray-500")}>
<strong className={clsx(`text-white h-5 min-w-[20px] bg-primary-400 font-bold text-[10px] rounded-[10px] flex-center`, unreads > 99 && 'w-1.5 !h-1.5 p-0 min-w-[unset]', muted && "bg-gray-500")}>
{unreads > 99 ? null : unreads}
</strong>
)}
src/routes/favs/index.tsx
+1 -1
View File
@@ -125,7 +125,7 @@ function FavsPage() {
return (
<li
key={f}
className={clsx(f == filter && 'bg-[rgba(116,_127,_141,_0.2)]', `cursor-pointer flex items-center gap-2 p-2 rounded-lg hover:bg-[rgba(116,_127,_141,_0.2)]`)}
className={clsx(f == filter && 'bg-[rgba(116,_127,_141,_0.2)]', `cursor-pointer flex items-center gap-2 p-2 rounded-lg md:hover:bg-[rgba(116,_127,_141,_0.2)]`)}
onClick={handleFilter.bind(null, f as filter)}
>
{icon}
src/routes/home/index.tsx
+5 -5
View File
@@ -48,7 +48,7 @@ function HomePage() {
// 有点绕
const chatNav = isChatHomePath ? "/chat" : chatPath || "/chat";
const userNav = userPath || "/users";
const linkClass = `flex items-center gap-2.5 px-3 py-2 font-semibold text-sm text-gray-600 rounded-lg hover:bg-gray-800/10`;
const linkClass = `flex items-center gap-2.5 px-3 py-2 font-semibold text-sm text-gray-600 rounded-lg md:hover:bg-gray-800/10`;
return (
<>
<Manifest />
@@ -59,7 +59,7 @@ function HomePage() {
{loginUid && <User uid={loginUid} />}
<nav className="flex flex-col gap-1 px-3 py-6">
<NavLink
className={({ isActive }) => `${linkClass} ${(isActive || isChattingPage) ? "bg-primary-400 hover:bg-primary-400" : ""}`}
className={({ isActive }) => `${linkClass} ${(isActive || isChattingPage) ? "bg-primary-400 md:hover:bg-primary-400" : ""}`}
to={chatNav}
>
{({ isActive }) => {
@@ -68,21 +68,21 @@ function HomePage() {
</Tooltip>;
}}
</NavLink>
<NavLink className={({ isActive }) => `${linkClass} ${isActive ? 'bg-primary-400 hover:bg-primary-400' : ""}`} to={userNav}>
<NavLink className={({ isActive }) => `${linkClass} ${isActive ? 'bg-primary-400 md:hover:bg-primary-400' : ""}`} to={userNav}>
{({ isActive }) => {
return <Tooltip tip={t("members")}>
<UserIcon className={isActive ? "fill-white" : ""} />
</Tooltip>;
}}
</NavLink>
<NavLink className={({ isActive }) => `${linkClass} ${isActive ? 'bg-primary-400 hover:bg-primary-400' : ""}`} to={"/favs"}>
<NavLink className={({ isActive }) => `${linkClass} ${isActive ? 'bg-primary-400 md:hover:bg-primary-400' : ""}`} to={"/favs"}>
{({ isActive }) => {
return <Tooltip tip={t("favs")}>
<FavIcon className={isActive ? "fill-white" : ""} />
</Tooltip>;
}}
</NavLink>
<NavLink className={({ isActive }) => `${linkClass} ${isActive ? 'bg-primary-400 hover:bg-primary-400' : ""}`} to={"/files"}>
<NavLink className={({ isActive }) => `${linkClass} ${isActive ? 'bg-primary-400 md:hover:bg-primary-400' : ""}`} to={"/files"}>
{({ isActive }) => {
return <Tooltip tip={t("files")}>
<FolderIcon className={isActive ? "fill-white" : ""} />
src/routes/onboarding/index.tsx
+1 -1
View File
@@ -22,7 +22,7 @@ const Navigator = () => {
<div className="hidden md:flex absolute top-5 w-full justify-center gap-2 z-10">
{steps.map((stepToRender, indexToRender) => {
const clickable = canJumpTo.includes(stepToRender.name);
const itemClass = clsx(`text-sm text-gray-600`, clickable && "cursor-pointer hover:text-gray-500", indexToRender === activeStep && "font-bold text-black", indexToRender >= activeStep && "text-gray-400");
const itemClass = clsx(`text-sm text-gray-600`, clickable && "cursor-pointer md:hover:text-gray-500", indexToRender === activeStep && "font-bold text-black", indexToRender >= activeStep && "text-gray-400");
const nodeCls = `${itemClass}`;
return (
<React.Fragment key={indexToRender}>
src/routes/onboarding/steps/invite-link.tsx
+1 -1
View File
@@ -20,7 +20,7 @@ export default function InviteLink() {
<span className="text-sm text-gray-500 mb-2 font-semibold">{t("last_desc")}</span>
<div className="w-full md:w-[400px] rounded shadow-md flex border border-solid border-gray-100">
<StyledInput className="large !border-none !shadow-none" readOnly placeholder="Generating" value={link} />
<StyledButton onClick={copyLink} className="ghost small border_less !px-2 hover:!text-primary-600">
<StyledButton onClick={copyLink} className="ghost small border_less !px-2 md:hover:!text-primary-600">
{linkCopied ? "Copied" : ct("action.copy")}
</StyledButton>
</div>
src/routes/setting/BotConfig/TestAPIKeyModal.tsx
+2 -2
View File
@@ -62,7 +62,7 @@ const TestAPIKeyModal = ({ closeModal }: Props) => {
>
{key ? (data ? <ul className="divide-y-2">
{data.map(({ gid, name, is_public }) => {
return <li key={gid} className={clsx("py-1 px-2 text-gray-500 cursor-pointer hover:bg-slate-50", gid == currCid ? 'bg-slate-100' : "")} onClick={handleSetChannel.bind(null, gid)}>
return <li key={gid} className={clsx("py-1 px-2 text-gray-500 cursor-pointer md:hover:bg-slate-50", gid == currCid ? 'bg-slate-100' : "")} onClick={handleSetChannel.bind(null, gid)}>
# {name} {!is_public ? "🔒" : ""}
</li>;
})}
@@ -73,7 +73,7 @@ const TestAPIKeyModal = ({ closeModal }: Props) => {
<Textarea ref={msgInputRef} placeholder='Input Something...' />
<ul className='flex gap-1'>
{Object.entries(MessageTypes).map(([key, value]) => {
return <li onClick={handleSetMsgType.bind(null, key)} className={clsx("py-1 px-2 text-gray-500 cursor-pointer hover:bg-slate-50", msgType == key ? 'bg-slate-100' : "")} key={key}>{value}</li>;
return <li onClick={handleSetMsgType.bind(null, key)} className={clsx("py-1 px-2 text-gray-500 cursor-pointer md:hover:bg-slate-50", msgType == key ? 'bg-slate-100' : "")} key={key}>{value}</li>;
})}
</ul>
<Button className='mini' onClick={handleSend} >Send</Button>
src/routes/setting/BotConfig/index.tsx
+1 -1
View File
@@ -85,7 +85,7 @@ export default function BotConfig() {
<tbody>
{bots.map(bot => {
const { uid, name, avatar } = bot;
return <tr key={uid} className="bg-white dark:bg-gray-800 border-b dark:border-b-gray-500 transition duration-300 ease-in-out hover:bg-gray-100">
return <tr key={uid} className="bg-white dark:bg-gray-800 border-b dark:border-b-gray-500 transition duration-300 ease-in-out md:hover:bg-gray-100">
<td className="px-4 py-2">
<AvatarUploader uid={uid} url={avatar} uploadImage={updateAvatar} name={name} size={56} />
</td>
src/routes/setting/License/LicensePriceListModal.tsx
+1 -1
View File
@@ -133,7 +133,7 @@ const LicensePriceListModal: FC<Props> = ({ closeModal }) => {
</div>
}
>
<button onClick={togglePopUpVisible} className="text-sm text-white bg-primary-400 break-keep shadow rounded-lg px-3.5 py-2.5 hover:bg-primary-500 active:bg-primary-500 disabled:bg-gray-300"> {t("license.renew")}</button>
<button onClick={togglePopUpVisible} className="text-sm text-white bg-primary-400 break-keep shadow rounded-lg px-3.5 py-2.5 md:hover:bg-primary-500 active:bg-primary-500 disabled:bg-gray-300"> {t("license.renew")}</button>
{/* <Button >
{t("license.renew")}
</Button> */}
src/routes/setting/Widget.tsx
+1 -1
View File
@@ -5,7 +5,7 @@ import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
import { vscDarkPlus } from 'react-syntax-highlighter/dist/esm/styles/prism';
const Row = ({ paramKey, paramDefault, remarks }: { paramKey: string, paramDefault: string | number, remarks: string }) => {
return <tr className="bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-50 border-b transition duration-300 ease-in-out hover:bg-gray-100">
return <tr className="bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-50 border-b transition duration-300 ease-in-out md:hover:bg-gray-100">
<td className="px-6 py-4 whitespace-nowrap text-sm font-medium">
{paramKey}
</td>
src/routes/users/index.tsx
+1 -1
View File
@@ -36,7 +36,7 @@ function UsersPage() {
<nav className="flex flex-col md:gap-1">
{users.map(({ uid }) => {
return (
<NavLink key={uid} className={({ isActive }) => `rounded-md hover:bg-gray-500/10 ${isActive ? "bg-gray-500/10" : ""}`} to={`/users/${uid}`}>
<NavLink key={uid} className={({ isActive }) => `rounded-md md:hover:bg-gray-500/10 ${isActive ? "bg-gray-500/10" : ""}`} to={`/users/${uid}`}>
<User uid={uid} enableContextMenu={true} />
</NavLink>
);