doot/TAO
1
0
Fork 0
mirror of https://github.com/smolgrrr/TAO.git synced 2024-09-20 09:21:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

UI work

Browse Source
This commit is contained in:
smolgrrr 2023-11-20 01:00:57 +11:00
parent cfda0b75f8
commit 1e8280d492
5 changed files with 14 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
client/src/components/Forms/PostFormCard.tsx
View File

@ -187,17 +187,11 @@ const NewNoteCard = ({
}} }}
> >
<input type="hidden" name="MAX_FILE_SIZE" defaultValue={2.5 * 1024 * 1024} /> <input type="hidden" name="MAX_FILE_SIZE" defaultValue={2.5 * 1024 * 1024} />
<div <div className="px-4 flex flex-col rounded-lg">
id="togglePostFormLink"
className="text-lg text-neutral-500 text-center mb-2 font-semibold"
>
{tagType === 'Reply' ? 'Reply to thread' : 'Start New Thread'}
</div>
<div className="px-4 pt-4 flex flex-col bg-neutral-900 rounded-lg">
<textarea <textarea
name="com" name="com"
wrap="soft" wrap="soft"
className="shadow-lg w-full px-4 py-3 h-28 rounded-md outline-none focus:outline-none bg-neutral-800 border border-neutral-700 text-white placeholder:text-neutral-500" className="shadow-lg w-full px-4 py-3 h-28 rounded-md outline-none focus:outline-none bg-black border border-neutral-700 text-white placeholder:text-neutral-500"
placeholder="Shitpost here..." placeholder="Shitpost here..."
value={comment} value={comment}
onChange={(e) => setComment(e.target.value)} onChange={(e) => setComment(e.target.value)}
@ -267,7 +261,7 @@ const NewNoteCard = ({
</div> </div>
<button <button
type="submit" type="submit"
className={`h-9 inline-flex items-center justify-center px-4 rounded-lg text-white font-medium text-sm ${doingWorkProp || uploadingFile ? 'bg-blue-900 cursor-not-allowed' : 'bg-blue-500 hover:bg-blue-600'}`} className={`bg-black border h-9 inline-flex items-center justify-center px-4 rounded-lg text-white font-medium text-sm ${doingWorkProp || uploadingFile ? 'cursor-not-allowed' : ''}`}
disabled={doingWorkProp || uploadingFile} disabled={doingWorkProp || uploadingFile}
> >
Submit Submit

4
client/src/components/Header/Header.tsx
View File

@ -10,8 +10,8 @@ export default function Header() {
<a href="/"> <a href="/">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<img src="/icon.png" className="h-12" alt="logo" /> <img src="/icon.png" className="h-12" alt="logo" />
<span className="font-semibold text-white text-sm"> <span className="font-semibold text-white">
The Wired {'>'}.. Wired
</span> </span>
</div> </div>
</a> </a>

10
client/src/components/Home.tsx
View File

@ -55,7 +55,7 @@ const Home = () => {
<div className="w-full px-4 sm:px-0 sm:max-w-xl mx-auto my-2"> <div className="w-full px-4 sm:px-0 sm:max-w-xl mx-auto my-2">
<NewNoteCard /> <NewNoteCard />
</div> </div>
<div className="flex items-center justify-center w-full py-4 z-2"> <div className="flex w-full px-8 z-2">
<label htmlFor="toggleB" className="flex items-center cursor-pointer"> <label htmlFor="toggleB" className="flex items-center cursor-pointer">
<div className="relative"> <div className="relative">
<input <input
@ -65,11 +65,11 @@ const Home = () => {
checked={sortByTime} checked={sortByTime}
onChange={toggleSort} onChange={toggleSort}
/> />
<div className="block bg-gray-600 w-10 h-6 rounded-full"></div> <div className="block bg-gray-600 w-8 h-4 rounded-full"></div>
<div className={`dot absolute left-1 top-1 bg-white w-4 h-4 rounded-full transition ${sortByTime ? 'transform translate-x-full bg-blue-400' : '' }`} ></div> <div className={`dot absolute left-1 top-0.5 bg-white w-3 h-3 rounded-full transition ${sortByTime ? 'transform translate-x-full bg-blue-400' : '' }`} ></div>
</div> </div>
<div className={`ml-3 text-neutral-500 font-medium ${sortByTime ? 'text-neutral-500' : ''}`}> <div className={`ml-2 text-neutral-500 text-sm ${sortByTime ? 'text-neutral-500' : ''}`}>
{sortByTime ? 'Sort by recent' : 'Sort by PoW'} {sortByTime ? 'Time' : 'PoW'}
</div> </div>
</label> </label>
</div> </div>

2
client/src/components/Modals/CardContainer.tsx
View File

@ -2,7 +2,7 @@ import { PropsWithChildren } from "react";
export default function CardContainer({ children }: PropsWithChildren) { export default function CardContainer({ children }: PropsWithChildren) {
return ( return (
<div className="card break-inside-avoid mb-4 bg-gradient-to-r from-black to-neutral-900 h-min"> <div className="card break-inside-avoid mb-4 h-min">
<div className="card-body">{children}</div> <div className="card-body">{children}</div>
</div> </div>
); );

7
client/src/components/Settings.tsx
View File

@ -37,7 +37,7 @@ const Settings = () => {
type="number" type="number"
value={filterDifficulty} value={filterDifficulty}
onChange={e => setFilterDifficulty(e.target.value)} onChange={e => setFilterDifficulty(e.target.value)}
className="w-full px-3 py-2 border rounded-md text-black" className="w-full px-3 py-2 border rounded-md bg-black"
/> />
</div> </div>
@ -52,11 +52,11 @@ const Settings = () => {
type="number" type="number"
value={difficulty} value={difficulty}
onChange={e => setDifficulty(e.target.value)} onChange={e => setDifficulty(e.target.value)}
className="w-full px-3 py-2 border rounded-md text-black" className="w-full px-3 py-2 border rounded-md bg-black"
/> />
</div> </div>
</div> </div>
<button className="bg-gradient-to-r from-blue-900 to-cyan-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded"> <button className="bg-black border text-white font-bold py-2 px-4 rounded">
Save Settings Save Settings
</button> </button>
</form> </form>
@ -80,7 +80,6 @@ const Settings = () => {
</div> </div>
</div> </div>
</div> </div>
<img className="block sm:hidden h-20 mx-auto mt-auto" src="/pepe.png"/>
</div> </div>
); );