improvements

This commit is contained in:
Jing Hua 2023-03-04 12:06:10 +08:00
parent 60401a491e
commit ae835c1791
5 changed files with 37 additions and 15 deletions

View file

@ -19,7 +19,7 @@
/> />
<meta name="twitter:title" content="ChatGPTFreeApp" /> <meta name="twitter:title" content="ChatGPTFreeApp" />
<meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:card" content="summary_large_image" />
<title>ChatGPT Free</title> <title>Free ChatGPT</title>
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>

View file

@ -314,6 +314,7 @@ const EditView = ({
<button <button
className='btn relative btn-primary mr-2' className='btn relative btn-primary mr-2'
onClick={() => { onClick={() => {
if (_content === '') return;
const updatedMessages: MessageInterface[] = JSON.parse( const updatedMessages: MessageInterface[] = JSON.parse(
JSON.stringify(messages) JSON.stringify(messages)
); );

View file

@ -60,7 +60,7 @@ const NewMessageButton = ({ messageIndex }: { messageIndex: number }) => {
}; };
return ( return (
<div className='h-0 relative' key={messageIndex}> <div className='h-0 w-0 relative' key={messageIndex}>
<div <div
className='absolute top-0 right-0 translate-x-1/2 translate-y-[-50%] text-gray-600 dark:text-white cursor-pointer bg-gray-200 dark:bg-gray-600/80 rounded-full p-1 text-sm hover:bg-gray-300 dark:hover:bg-gray-800/80 transition-bg duration-200' className='absolute top-0 right-0 translate-x-1/2 translate-y-[-50%] text-gray-600 dark:text-white cursor-pointer bg-gray-200 dark:bg-gray-600/80 rounded-full p-1 text-sm hover:bg-gray-300 dark:hover:bg-gray-800/80 transition-bg duration-200'
onClick={addMessage} onClick={addMessage}

View file

@ -107,7 +107,7 @@ const ConfigMenu = () => {
</div> </div>
<input <input
type='text' type='text'
className='text-white p-3 text-sm border-none bg-gray-600 rounded-md p-0 m-0 w-full mr-0 h-8 focus:outline-none' className='text-gray-800 dark:text-white p-3 text-sm border-none bg-gray-200 dark:bg-gray-600 rounded-md p-0 m-0 w-full mr-0 h-8 focus:outline-none'
value={_apiKey} value={_apiKey}
onChange={(e) => { onChange={(e) => {
_setApiKey(e.target.value); _setApiKey(e.target.value);
@ -132,6 +132,13 @@ const ConfigMenu = () => {
here here
</a> </a>
</div> </div>
<div className='min-w-fit text-gray-900 dark:text-gray-300 text-sm mt-4'>
We prioritize the security of your API key and handle it with
utmost care. Your key is exclusively stored on your browser and
never shared with any third-party entity. It is solely used for
the intended purpose of accessing the OpenAI API and not for any
other unauthorized use.
</div>
</div> </div>
<div className='flex items-center justify-center p-6 gap-4'> <div className='flex items-center justify-center p-6 gap-4'>

View file

@ -12,17 +12,30 @@ const getOppositeTheme = (theme: Theme): Theme => {
} }
}; };
const ThemeSwitcher = () => { const ThemeSwitcher = () => {
const [theme, setTheme] = useState<Theme>('dark'); const [theme, setTheme] = useState<Theme>();
const switchTheme = () => { const switchTheme = () => {
setTheme(getOppositeTheme(theme)); setTheme(getOppositeTheme(theme!));
}; };
useEffect(() => { useEffect(() => {
const _theme = localStorage.getItem('theme');
if (_theme === 'light' || _theme === 'dark') {
setTheme(_theme);
} else {
setTheme('dark');
}
}, []);
useEffect(() => {
if (theme) {
document.documentElement.className = theme; document.documentElement.className = theme;
localStorage.setItem('theme', theme);
}
}, [theme]); }, [theme]);
return ( return (
theme && (
<a <a
className='flex py-3 px-3 items-center gap-3 rounded-md hover:bg-gray-500/10 transition-colors duration-200 text-white cursor-pointer text-sm' className='flex py-3 px-3 items-center gap-3 rounded-md hover:bg-gray-500/10 transition-colors duration-200 text-white cursor-pointer text-sm'
onClick={switchTheme} onClick={switchTheme}
@ -32,6 +45,7 @@ const ThemeSwitcher = () => {
getOppositeTheme(theme).slice(1)}{' '} getOppositeTheme(theme).slice(1)}{' '}
mode mode
</a> </a>
)
); );
}; };