mirrors/TidGi-Desktop
1
Fork 0
mirror of https://github.com/tiddly-gittly/TidGi-Desktop.git synced 2026-03-06 22:10:57 -08:00
Code Issues Projects Releases Packages Wiki Activity

fix: center the workspace reload icon

Browse source
This commit is contained in:
linonetwo 2024-04-17 18:37:57 +08:00
parent ff98a81cf4
commit 77f5ddaeec
2 changed files with 16 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/pages/Main/PageIconAndSelector/PageSelectorBase.tsx
View file

@ -56,6 +56,10 @@ const Avatar = styled.div<IAvatarProps>`
font-weight: 500;
text-transform: uppercase;
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
${is('$large')`
height: 44px;
width: 44px;
@ -140,7 +144,7 @@ export function PageSelectorBase({
const [shortPageName, shortPageNameSetter] = useState<string>(t('Loading'));
useEffect(() => {
void window.service.native.path('basename', pageName).then((baseName) => {
shortPageNameSetter(baseName === undefined ? t('WorkspaceSelector.BadWorkspacePath') : baseName);
shortPageNameSetter(baseName ?? t('WorkspaceSelector.BadWorkspacePath'));
});
}, [pageName, t]);
return (

16
src/pages/Main/WorkspaceIconAndSelector/WorkspaceSelectorBase.tsx
View file

@ -9,7 +9,7 @@ import is from 'typescript-styled-is';
import { getAssetsFileUrl } from '@/helpers/url';
import { Tooltip } from '@mui/material';
import defaultIcon from '../../images/default-icon.png';
import defaultIcon from '../../../images/default-icon.png';
Promise.config({ cancellation: true });
@ -51,8 +51,8 @@ from {background-color: #dddddd;}
to {background-color: #eeeeee}
`;
interface IAvatarProps {
$addAvatar: boolean;
$highlightAdd: boolean;
$addAvatar?: boolean;
$highlightAdd?: boolean;
$large?: boolean;
$transparent?: boolean;
}
@ -65,6 +65,10 @@ const Avatar = styled.div<IAvatarProps>`
font-weight: 500;
text-transform: uppercase;
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
${is('$large')`
height: 44px;
width: 44px;
@ -76,7 +80,7 @@ const Avatar = styled.div<IAvatarProps>`
border-radius: 0;
`}
&${({ $highlightAdd, $addAvatar }) => ($highlightAdd && $addAvatar ? '' : ':hover')}, &:hover {
&${({ $highlightAdd, $addAvatar }) => (($highlightAdd && $addAvatar) ? '' : ':hover')}, &:hover {
background-color: ${({ theme }) => theme.palette.background.default};
animation: ${backgroundColorShift} 5s infinite;
animation-direction: alternate;
@ -175,7 +179,9 @@ export function WorkspaceSelectorBase({
if (loading) {
icon = (
<Tooltip title={<span>{t('Dialog.Restarting')}</span>}>
<RestartAltIcon />
<Avatar>
<RestartAltIcon />
</Avatar>
</Tooltip>
);
}