From d9f57b7daa40135a8a689338cd9e965d71ff660d Mon Sep 17 00:00:00 2001 From: Sinclair Chen Date: Wed, 12 Oct 2022 12:27:17 -0700 Subject: [PATCH] Remove all daisy buttons (#1036) * Tweak limit order UI and fix button * Style all follow/unfollow buttons blue also get rid of highlight-blue button * remove all other uses of 'btn' * Style group follow button like user follow * lint and format --- web/components/amount-input.tsx | 3 +- web/components/answers/answer-bet-panel.tsx | 5 +- .../answers/answer-resolve-panel.tsx | 7 ++- .../answers/create-answer-panel.tsx | 12 ++-- web/components/bet-panel.tsx | 8 +-- web/components/button.tsx | 11 ++-- .../contract/comment-bounty-dialog.tsx | 3 +- web/components/create-post.tsx | 5 +- web/components/follow-button.tsx | 14 ++--- web/components/following-button.tsx | 33 ----------- web/components/groups/edit-group-button.tsx | 42 ++++++------- web/components/groups/group-overview.tsx | 7 +-- web/components/groups/groups-button.tsx | 10 ++-- web/components/numeric-bet-panel.tsx | 19 +++--- web/components/referrals-button.tsx | 9 ++- web/components/resolution-panel.tsx | 1 - web/components/sell-button.tsx | 59 ------------------- web/components/user-page.tsx | 2 +- web/components/yes-no-selector.tsx | 4 +- web/pages/[username]/[contractSlug].tsx | 4 +- web/pages/admin.tsx | 5 +- web/pages/charity/[charitySlug].tsx | 26 ++++---- web/pages/create.tsx | 13 ++-- web/pages/group/[...slugs]/index.tsx | 9 +-- web/pages/profile.tsx | 9 ++- web/pages/referrals.tsx | 2 +- web/pages/twitch.tsx | 19 ++---- 27 files changed, 109 insertions(+), 232 deletions(-) delete mode 100644 web/components/sell-button.tsx diff --git a/web/components/amount-input.tsx b/web/components/amount-input.tsx index 8cd43369..a7eb3a8e 100644 --- a/web/components/amount-input.tsx +++ b/web/components/amount-input.tsx @@ -47,9 +47,8 @@ export function AmountInput(props: { {!isModal && ( - + )} )} {user ? ( - + ) : ( text && ( - ) + if (!user || isFollowing === undefined) return <> if (isFollowing) { return (
@@ -77,8 +78,9 @@ export function EditGroupButton(props: { group: Group; className?: string }) {
- -
diff --git a/web/components/groups/group-overview.tsx b/web/components/groups/group-overview.tsx index 4a3b5802..1e8f7ee7 100644 --- a/web/components/groups/group-overview.tsx +++ b/web/components/groups/group-overview.tsx @@ -116,10 +116,7 @@ export function GroupPosts(props: { posts: Post[]; group: Group }) { {user && ( - )} @@ -432,7 +429,7 @@ export function GroupAbout(props: { diff --git a/web/components/groups/groups-button.tsx b/web/components/groups/groups-button.tsx index 814efd81..321ec625 100644 --- a/web/components/groups/groups-button.tsx +++ b/web/components/groups/groups-button.tsx @@ -125,9 +125,9 @@ export function JoinOrLeaveGroupButton(props: { if (isMember) { return ( + Submit + )} {wasSubmitted &&
Bet submitted!
} diff --git a/web/components/referrals-button.tsx b/web/components/referrals-button.tsx index 9a548031..3d2d8e43 100644 --- a/web/components/referrals-button.tsx +++ b/web/components/referrals-button.tsx @@ -12,6 +12,7 @@ import { FilterSelectUsers } from 'web/components/filter-select-users' import { getUser, updateUser } from 'web/lib/firebase/users' import { TextButton } from 'web/components/text-button' import { UserLink } from 'web/components/user-link' +import { Button } from './button' export function ReferralsButton(props: { user: User @@ -89,11 +90,9 @@ function ReferralsDialog(props: { maxUsers={1} /> - + {referredBy.length > 0 && diff --git a/web/components/resolution-panel.tsx b/web/components/resolution-panel.tsx index f39284a5..2befb1fd 100644 --- a/web/components/resolution-panel.tsx +++ b/web/components/resolution-panel.tsx @@ -72,7 +72,6 @@ export function ResolutionPanel(props: { className="mx-auto my-2" selected={outcome} onSelect={setOutcome} - btnClassName={isSubmitting ? 'btn-disabled' : ''} />
diff --git a/web/components/sell-button.tsx b/web/components/sell-button.tsx deleted file mode 100644 index 51c88442..00000000 --- a/web/components/sell-button.tsx +++ /dev/null @@ -1,59 +0,0 @@ -import { BinaryContract, PseudoNumericContract } from 'common/contract' -import { User } from 'common/user' -import { useUserContractBets } from 'web/hooks/use-user-bets' -import { useState } from 'react' -import { Col } from './layout/col' -import clsx from 'clsx' -import { SellSharesModal } from './sell-modal' - -export function SellButton(props: { - contract: BinaryContract | PseudoNumericContract - user: User | null | undefined - sharesOutcome: 'YES' | 'NO' | undefined - shares: number - panelClassName?: string -}) { - const { contract, user, sharesOutcome, shares, panelClassName } = props - const userBets = useUserContractBets(user?.id, contract.id) - const [showSellModal, setShowSellModal] = useState(false) - const { mechanism, outcomeType } = contract - const isPseudoNumeric = outcomeType === 'PSEUDO_NUMERIC' - - if (sharesOutcome && user && mechanism === 'cpmm-1') { - return ( - - -
- {'(' + Math.floor(shares) + ' shares)'} -
- {showSellModal && ( - - )} - - ) - } - return
-} diff --git a/web/components/user-page.tsx b/web/components/user-page.tsx index e722547c..b1380bfe 100644 --- a/web/components/user-page.tsx +++ b/web/components/user-page.tsx @@ -95,7 +95,7 @@ export function UserPage(props: { user: User }) { )} -
+
{user.name} diff --git a/web/components/yes-no-selector.tsx b/web/components/yes-no-selector.tsx index 69bf47f0..e38faeb4 100644 --- a/web/components/yes-no-selector.tsx +++ b/web/components/yes-no-selector.tsx @@ -101,7 +101,7 @@ export function YesNoCancelSelector(props: { @@ -109,7 +109,7 @@ export function YesNoCancelSelector(props: { diff --git a/web/pages/[username]/[contractSlug].tsx b/web/pages/[username]/[contractSlug].tsx index da66fc8a..3d894500 100644 --- a/web/pages/[username]/[contractSlug].tsx +++ b/web/pages/[username]/[contractSlug].tsx @@ -248,10 +248,10 @@ export function ContractPageContent( ogCardProps={ogCardProps} /> )} - + {backToHome && ( + ) } diff --git a/web/pages/charity/[charitySlug].tsx b/web/pages/charity/[charitySlug].tsx index 89d2d3a3..73bc677f 100644 --- a/web/pages/charity/[charitySlug].tsx +++ b/web/pages/charity/[charitySlug].tsx @@ -23,6 +23,7 @@ import { Donation } from 'web/components/charity/feed-items' import { manaToUSD } from 'common/util/format' import { track } from 'web/lib/service/analytics' import { SEO } from 'web/components/SEO' +import { Button } from 'web/components/button' export default function CharityPageWrapper() { const router = useRouter() @@ -126,15 +127,13 @@ function Blurb({ text }: { text: string }) { > {text}
- + ) } @@ -175,7 +174,7 @@ function DonationBox(props: { const [isSubmitting, setIsSubmitting] = useState(false) const [error, setError] = useState() - const donateDisabled = isSubmitting || !amount || error + const donateDisabled = isSubmitting || !amount || !!error const onSubmit: React.FormEventHandler = async (e) => { if (!user || donateDisabled) return @@ -230,16 +229,15 @@ function DonationBox(props: { {user && ( - + )}
diff --git a/web/pages/create.tsx b/web/pages/create.tsx index ca6c5ffe..47169c29 100644 --- a/web/pages/create.tsx +++ b/web/pages/create.tsx @@ -1,6 +1,5 @@ import router, { useRouter } from 'next/router' import { useEffect, useState } from 'react' -import clsx from 'clsx' import dayjs from 'dayjs' import { Spacer } from 'web/components/layout/spacer' import { getUserAndPrivateUser } from 'web/lib/firebase/users' @@ -519,20 +518,18 @@ export function NewContract(props: { )}
- + diff --git a/web/pages/group/[...slugs]/index.tsx b/web/pages/group/[...slugs]/index.tsx index 918b8225..7d66a437 100644 --- a/web/pages/group/[...slugs]/index.tsx +++ b/web/pages/group/[...slugs]/index.tsx @@ -386,14 +386,9 @@ function JoinGroupButton(props: { return (
- +
) } diff --git a/web/pages/profile.tsx b/web/pages/profile.tsx index c3d4335c..f85ff0c8 100644 --- a/web/pages/profile.tsx +++ b/web/pages/profile.tsx @@ -3,11 +3,13 @@ import { PrivateUser, User } from 'common/user' import { cleanDisplayName, cleanUsername } from 'common/util/clean-username' import Link from 'next/link' import React, { useState } from 'react' +import { buttonClass } from 'web/components/button' import { ConfirmationButton } from 'web/components/confirmation-button' import { ExpandingInput } from 'web/components/expanding-input' import { Input } from 'web/components/input' import { Col } from 'web/components/layout/col' import { Row } from 'web/components/layout/row' +import { LoadingIndicator } from 'web/components/loading-indicator' import { Page } from 'web/components/page' import { SEO } from 'web/components/SEO' import { SiteLink } from 'web/components/site-link' @@ -129,14 +131,17 @@ export default function ProfilePage(props: { - <SiteLink className="btn btn-primary" href={`/${user.username}`}> + <SiteLink + className={buttonClass('md', 'green')} + href={`/${user.username}`} + > Done </SiteLink> </Row> <Col className="gap-4"> <Row className="items-center gap-4"> {avatarLoading ? ( - <button className="btn btn-ghost btn-lg btn-circle loading"></button> + <LoadingIndicator /> ) : ( <> <img diff --git a/web/pages/referrals.tsx b/web/pages/referrals.tsx index 46b7b7b0..0b1248d6 100644 --- a/web/pages/referrals.tsx +++ b/web/pages/referrals.tsx @@ -50,7 +50,7 @@ export default function ReferralsPage() { <CopyLinkButton url={url} tracking="copy referral link" - buttonClassName="btn-md rounded-l-none" + buttonClassName="rounded-l-none" toastClassName={'-left-28 mt-1'} /> diff --git a/web/pages/twitch.tsx b/web/pages/twitch.tsx index 2331fa1c..8f57b7e4 100644 --- a/web/pages/twitch.tsx +++ b/web/pages/twitch.tsx @@ -121,7 +121,7 @@ function TwitchPlaysManifoldMarkets(props: { <Button size="xl" color="green" - className="btn-disabled my-4 self-center !border-none" + className="my-4 self-center !border-none" > Account connected: {twitchUser} </Button> @@ -331,25 +331,18 @@ function BotConnectButton(props: { <Button color="red" onClick={updateBotConnected(false)} - className={clsx(loading && '!btn-disabled', 'border-none')} + loading={loading} > - {loading ? ( - <LoadingIndicator spinnerClassName="!h-5 !w-5 border-white !border-2" /> - ) : ( - 'Remove bot from channel' - )} + Remove bot from channel </Button> ) : ( <Button color="green" onClick={updateBotConnected(true)} - className={clsx(loading && '!btn-disabled', 'border-none')} + loading={loading} + className="border-none" > - {loading ? ( - <LoadingIndicator spinnerClassName="!h-5 !w-5 border-white !border-2" /> - ) : ( - 'Add bot to your channel' - )} + Add bot to your channel </Button> )} </>