Skip to content

Commit

Permalink
Fixed incorrect theme colors for toast popups and game card menu buttons
Browse files Browse the repository at this point in the history 
Fixed text sizing for card menu, automate menu, and settings menu buttons
Made the game banner images a little darker when using the dark theme
Improved the page tabs on the settings screen
Improved event logging messages
  • Loading branch information
@zevnda
zevnda committed Aug 24, 2024
1 parent 8505011 commit bb8d7e7
Show file tree
Hide file tree
Showing 20 changed files with 184 additions and 156 deletions.
8 changes: 4 additions & 4 deletions components/Header.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,11 +73,11 @@ export default function Header({ userSummary, inputValue, setInputValue, setIsQu
<ThemeSwitch />
<ExtLink href={`https://steamcommunity.com/profiles/${userSummary.steamId}`}>
<div className='flex items-center gap-2 h-full p-2'>
<div className='text-end'>
<p className='font-medium'>
<div className='text-end max-w-[180px]'>
<p className='font-medium truncate'>
{userSummary.personaName}
</p>
<p className='text-xs text-neutral-400'>
<p className='text-xs text-neutral-400 truncate'>
{userSummary.steamId}
</p>
</div>
Expand All @@ -95,7 +95,7 @@ export default function Header({ userSummary, inputValue, setInputValue, setIsQu
<div className='flex justify-center items-center hover:bg-titlehover w-[28px] h-full cursor-pointer' onClick={windowToggleMaximize}>
<BiWindows fontSize={12} />
</div>
<div className='flex justify-center items-center hover:bg-red-500 w-[28px] h-full rounded-tr-xl cursor-pointer' onClick={windowClose}>
<div className='flex justify-center items-center hover:bg-red-500 w-[28px] h-full rounded-tr-[8px] cursor-pointer' onClick={windowClose}>
<IoClose />
</div>
</div>
Expand Down
4 changes: 3 additions & 1 deletion components/Setup.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,10 @@ import ExtLink from './ExtLink';
import { invoke } from '@tauri-apps/api/tauri';
import { Slide, ToastContainer, toast } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';
import { useTheme } from 'next-themes';

export default function Setup({ setUserSummary }) {
const { theme } = useTheme();
const [isLoading, setIsLoading] = useState(false);
const [steamId, setSteamId] = useState(null);

Expand Down Expand Up @@ -84,7 +86,7 @@ export default function Setup({ setUserSummary }) {
</div>
</motion.div>
</div>
<ToastContainer toastStyle={{ fontSize: 12 }} position='bottom-right' theme='dark' transition={Slide} pauseOnFocusLoss={false} pauseOnHover={false} autoClose={5000} />
<ToastContainer toastStyle={{ fontSize: 12 }} position='bottom-right' theme={theme} transition={Slide} pauseOnFocusLoss={false} pauseOnHover={false} autoClose={5000} />
</React.Fragment >
);
}
2 changes: 1 addition & 1 deletion components/TitleBar.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ export default function TitleBar() {
<div className='flex justify-center items-center hover:bg-titlehover w-[28px] h-full cursor-pointer' onClick={windowToggleMaximize}>
<BiWindows fontSize={12} />
</div>
<div className='flex justify-center items-center hover:bg-red-500 w-[28px] h-full rounded-tr-xl cursor-pointer' onClick={windowClose}>
<div className='flex justify-center items-center hover:bg-red-500 w-[28px] h-full rounded-tr-[8px] cursor-pointer' onClick={windowClose}>
<IoClose />
</div>
</div>
Expand Down
4 changes: 2 additions & 2 deletions components/UpdateScreen.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ export default function UpdateScreen() {

return (
<React.Fragment>
<div className='flex justify-between items-center w-screen h-[62px] bg-sgi rounded-tr-[10px] rounded-tl-xl' data-tauri-drag-region>
<div className='flex justify-between items-center w-screen h-[62px] bg-sgi rounded-tr-[8px] rounded-tl-lg' data-tauri-drag-region>
<div className='flex items-center gap-1 px-2 bg-sgi h-full w-[62px] rounded-tl-[10px]'>
<BiSolidLeaf className='text-offwhite' fontSize={40} />
</div>
Expand All @@ -69,7 +69,7 @@ export default function UpdateScreen() {
<div className='flex justify-center items-center hover:bg-titlehover w-[28px] h-full cursor-pointer' onClick={windowToggleMaximize}>
<BiWindows fontSize={12} />
</div>
<div className='flex justify-center items-center hover:bg-red-500 w-[28px] h-full rounded-tr-xl cursor-pointer' onClick={windowClose}>
<div className='flex justify-center items-center hover:bg-red-500 w-[28px] h-full rounded-tr-[8px] cursor-pointer' onClick={windowClose}>
<IoClose />
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion components/Window.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,8 +30,8 @@ export default function Window() {
allGames: false
},
achievementUnlocker: {
idle: true,
interval: [30, 130],
idle: false
}
};
updateLaunchedStats('launched');
Expand Down
52 changes: 30 additions & 22 deletions components/gameslist/Achievements.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,13 @@ import 'react-toastify/dist/ReactToastify.css';
import { FaUnlockAlt, FaLock, FaInfoCircle } from 'react-icons/fa';
import { IoIosClose, IoMdArrowRoundBack } from 'react-icons/io';
import { RiSearchLine } from 'react-icons/ri';
import ExtLink from '../ExtLink';
import { TiWarning } from 'react-icons/ti';
import { MdSort } from 'react-icons/md';
import { unlockAchievement } from '@/utils/utils';
import { useTheme } from 'next-themes';

export default function Achievements({ steamId, appId, setShowAchievements }) {
const { theme } = useTheme();
let [isLoading, setIsLoading] = useState(true);
let [achievementList, setAchievementList] = useState([]);
let [userAchievements, setUserAchievements] = useState([]);
Expand Down Expand Up @@ -175,7 +176,7 @@ export default function Achievements({ steamId, appId, setShowAchievements }) {
<div className='flex justify-between items-center mb-4'>
<Button
size='sm'
className='w-fit font-semibold bg-[#F4F4F5] dark:bg-[#27272A] hover:bg-[#e4e4e4] dark:hover:bg-[#2e2e2e] border border-border hover:border-borderhover rounded-sm duration-50'
className='w-fit bg-[#f7f7f7] dark:bg-[#181818] hover:!bg-titlebar border border-inputborder rounded-sm duration-50'
startContent={<IoMdArrowRoundBack fontSize={18} />}
onClick={handleClick}
>
Expand Down Expand Up @@ -206,6 +207,7 @@ export default function Achievements({ steamId, appId, setShowAchievements }) {
items={sortOptions}
className='w-[200px]'
classNames={{
listbox: ['p-0'],
value: ['text-xs'],
trigger: ['bg-input border border-inputborder data-[hover=true]:!bg-titlebar data-[open=true]:!bg-titlebar duration-100 rounded-sm'],
popoverContent: ['bg-base border border-border rounded']
Expand All @@ -219,17 +221,12 @@ export default function Achievements({ steamId, appId, setShowAchievements }) {
</div>

{achievementsUnavailable && showAlertOne !== 'false' && (
<div className='flex justify-between items-center w-full p-2 bg-red-100 border border-red-300 rounded my-2'>
<div className='flex justify-between items-center w-full p-1 bg-red-100 border border-red-300 rounded my-2'>
<div className='flex items-center gap-2 text-xs font-semibold text-red-400'>
<TiWarning fontSize={18} />
<p>Either this game has no achievements or your &quot;Game details&quot; setting might be set to private in your privacy settings. You can still unlock achievements but the changes won&apos;t be reflected here.</p>
<p>Either this game has no achievements or your &quot;Game details&quot; setting might be set to private in your Steam privacy settings. You can still unlock achievements but the changes won&apos;t be reflected here.</p>
</div>
<div className='flex items-center gap-2'>
<ExtLink href={`https://steamcommunity.com/profiles/${steamId}/edit/settings`}>
<Button color='primary' size='sm' className='text-offwhite dark:text-black font-medium rounded-sm'>
Change Account Privacy
</Button>
</ExtLink>
<Button
isIconOnly
size='sm'
Expand All @@ -242,11 +239,11 @@ export default function Achievements({ steamId, appId, setShowAchievements }) {
)}

{showAlertTwo !== 'false' && (
<div className='flex justify-between items-center w-full p-2 bg-blue-100 border border-blue-300 rounded my-2'>
<div className='flex justify-between items-center w-full p-1 bg-blue-100 border border-blue-300 rounded my-2'>
<div className='flex justify-between items-center w-full gap-2 text-xs font-semibold text-blue-400'>
<div className='flex items-center gap-2'>
<FaInfoCircle fontSize={18} />
<p>Please note that unlocking/locking achievements is instant but may take up to 5 minutes to be reflected on this page. Check your Steam game achievements for real-time changes.</p>
<p>Please note that unlocking/locking achievements is instant but may take up to 5 minutes to be reflected on this page. Check your game&apos;s achievements page on Steam for real-time changes.</p>
</div>
<Button
isIconOnly
Expand All @@ -271,19 +268,30 @@ export default function Achievements({ steamId, appId, setShowAchievements }) {
</Button>
</div>
) : (
<Button
size='sm'
isLoading={btnLoading}
isDisabled={!achievementList || inputValue.length > 0}
className='bg-sgi font-semibold text-offwhite rounded-sm'
onClick={() => { handleUnlockAll(1); }}
>
Unlock all achievements
</Button>
<React.Fragment>
{!achievementsUnavailable && (
<Button
size='sm'
isLoading={btnLoading}
isDisabled={!achievementList || inputValue.length > 0}
className='bg-sgi font-semibold text-offwhite rounded-sm'
onClick={() => { handleUnlockAll(1); }}
>
Unlock all achievements
</Button>
)}
</React.Fragment>
)}
</div>

<div className='grid grid-cols-1 gap-4 max-h-[405px] p-2 w-full border border-border rounded overflow-y-auto'>
<div className='grid grid-cols-1 gap-4 max-h-[430px] p-2 w-full border border-border rounded overflow-y-auto'>
{achievementsUnavailable && (
<div className='flex justify-center items-center w-full'>
<p className='text-xs'>
No achievements found
</p>
</div>
)}
{achievementList && achievementList.map((item) => {
const isUnlocked = userAchievementsMap.get(item.name) || false;
const percentage = percentageMap.get(item.name);
Expand Down Expand Up @@ -333,7 +341,7 @@ export default function Achievements({ steamId, appId, setShowAchievements }) {
</div>
</div>
</div>
<ToastContainer toastStyle={{ fontSize: 12 }} position='bottom-right' theme='dark' transition={Slide} pauseOnFocusLoss={false} pauseOnHover={false} autoClose={5000} />
<ToastContainer toastStyle={{ fontSize: 12 }} position='bottom-right' theme={theme} transition={Slide} pauseOnFocusLoss={false} pauseOnHover={false} autoClose={5000} />
</React.Fragment>
);
}
13 changes: 8 additions & 5 deletions components/gameslist/Automate.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,11 @@ import { FaAward } from 'react-icons/fa';
import { Slide, ToastContainer, toast } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';
import { invoke } from '@tauri-apps/api/tauri';
import { useTheme } from 'next-themes';

export default function Automate({ setActivePage }) {
const { theme } = useTheme();

const startCardFarming = async () => {
const steamRunning = await invoke('check_status');
const steamCookies = JSON.parse(localStorage.getItem('steamCookies')) || {};
Expand Down Expand Up @@ -52,7 +55,7 @@ export default function Automate({ setActivePage }) {

return (
<React.Fragment>
<Dropdown classNames={{ content: ['rounded p-0'] }}>
<Dropdown classNames={{ content: ['rounded p-0 bg-base border border-border'] }}>
<DropdownTrigger>
<Button size='sm' className='bg-sgi rounded-full'>
<div className='flex items-center gap-1 text-offwhite'>
Expand All @@ -70,27 +73,27 @@ export default function Automate({ setActivePage }) {
startContent={<IoGameController />}
onClick={startCardFarming}
>
Start card farming
<p className='text-xs'>Start card farming</p>
</DropdownItem>
<DropdownItem
className='rounded'
key='achiements'
startContent={<FaAward />}
onClick={startAchievementUnlocker}
>
Start achievement unlocker
<p className='text-xs'>Start achievement unlocker</p>
</DropdownItem>
<DropdownItem
className='rounded'
key='settings'
startContent={<IoSettings />}
onClick={() => setActivePage('settings')}
>
Change settings
<p className='text-xs'>Change settings</p>
</DropdownItem>
</DropdownMenu>
</Dropdown>
<ToastContainer toastStyle={{ fontSize: 12 }} position='bottom-right' theme='dark' transition={Slide} pauseOnFocusLoss={false} pauseOnHover={false} autoClose={5000} />
<ToastContainer toastStyle={{ fontSize: 12 }} position='bottom-right' theme={theme} transition={Slide} pauseOnFocusLoss={false} pauseOnHover={false} autoClose={5000} />
</React.Fragment>
);
}
Loading

0 comments on commit bb8d7e7

Please sign in to comment.