open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

remove all other uses of 'btn'

Browse Source
This commit is contained in:
Sinclair Chen 2022-10-12 11:49:28 -07:00
parent f9b0f0c813
commit e6054c1d06
19 changed files with 88 additions and 161 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
web/components/answers/answer-bet-panel.tsx
View File

@ -126,7 +126,10 @@ export function AnswerBetPanel(props: {
</div>
{!isModal && (
<button className="btn-ghost btn-circle" onClick={closePanel}>
<button
className="hover:bg-greyscale-2 rounded-full"
onClick={closePanel}
>
<XIcon
className="mx-auto h-8 w-8 text-gray-500"
aria-hidden="true"

7
web/components/answers/answer-resolve-panel.tsx
View File

@ -10,6 +10,7 @@ import { ChooseCancelSelector } from '../yes-no-selector'
import { ResolveConfirmationButton } from '../confirmation-button'
import { removeUndefinedProps } from 'common/util/object'
import { BETTOR, PAST_BETS } from 'common/user'
import { Button } from '../button'
export function AnswerResolvePanel(props: {
isAdmin: boolean
@ -109,14 +110,14 @@ export function AnswerResolvePanel(props: {
)}
>
{resolveOption && (
<button
className="btn btn-ghost"
<Button
color="gray-white"
onClick={() => {
setResolveOption(undefined)
}}
>
Clear
</button>
</Button>
)}
<ResolveConfirmationButton

12
web/components/answers/create-answer-panel.tsx
View File

@ -197,17 +197,15 @@ export function CreateAnswerPanel(props: { contract: FreeResponseContract }) {
</>
)}
{user ? (
<button
className={clsx(
'btn mt-2',
canSubmit ? 'btn-outline' : 'btn-disabled',
isSubmitting && 'loading'
)}
<Button
color="green"
size="lg"
loading={isSubmitting}
disabled={!canSubmit}
onClick={withTracking(submitAnswer, 'submit answer')}
>
Submit
</button>
</Button>
) : (
text && (
<Button

2
web/components/contract/comment-bounty-dialog.tsx
View File

@ -64,7 +64,7 @@ export function CommentBountyDialog(props: {
<Row className={'items-center gap-2'}>
<Button
className={clsx('ml-2', isLoading && 'btn-disabled')}
className="ml-2"
onClick={submit}
disabled={isLoading}
color={'blue'}

5
web/components/create-post.tsx
View File

@ -93,9 +93,10 @@ export function CreatePost(props: { group?: Group }) {
<Button
type="submit"
loading={isSubmitting}
color="green"
size="xl"
disabled={isSubmitting || !isValid || upload.isLoading}
loading={isSubmitting}
disabled={!isValid || upload.isLoading}
onClick={async () => {
setIsSubmitting(true)
await savePost(title)

42
web/components/groups/edit-group-button.tsx
View File

@ -11,6 +11,7 @@ import { FilterSelectUsers } from 'web/components/filter-select-users'
import { User } from 'common/user'
import { useMemberIds } from 'web/hooks/use-group'
import { Input } from '../input'
import { Button } from '../button'
export function EditGroupButton(props: { group: Group; className?: string }) {
const { group, className } = props
@ -40,14 +41,14 @@ export function EditGroupButton(props: { group: Group; className?: string }) {
return (
<div className={clsx('flex p-1', className)}>
<div
className={clsx(
'btn-ghost cursor-pointer whitespace-nowrap rounded-md p-1 text-sm text-gray-700'
)}
<Button
size="sm"
color="gray-white"
className="whitespace-nowrap"
onClick={() => updateOpen(!open)}
>
<PencilIcon className="inline h-4 w-4" /> Edit
</div>
</Button>
<Modal open={open} setOpen={updateOpen}>
<div className="h-full rounded-md bg-white p-8">
<div className="form-control w-full">
@ -77,8 +78,9 @@ export function EditGroupButton(props: { group: Group; className?: string }) {
</div>
<div className="modal-action">
<label
htmlFor="edit"
<Button
color="red"
size="xs"
onClick={() => {
if (confirm('Are you sure you want to delete this group?')) {
deleteGroup(group)
@ -86,30 +88,24 @@ export function EditGroupButton(props: { group: Group; className?: string }) {
router.replace('/groups')
}
}}
className={clsx(
'btn btn-sm btn-outline mr-auto self-center hover:border-red-500 hover:bg-red-500'
)}
>
Delete
</label>
<label
htmlFor="edit"
className={'btn'}
</Button>
<Button
color="gray-white"
size="xs"
onClick={() => updateOpen(false)}
>
Cancel
</label>
<label
className={clsx(
'btn',
saveDisabled ? 'btn-disabled' : 'btn-primary',
isSubmitting && 'loading'
)}
htmlFor="edit"
</Button>
<Button
color="green"
disabled={saveDisabled}
loading={isSubmitting}
onClick={onSubmit}
>
Save
</label>
</Button>
</div>
</div>
</Modal>

7
web/components/groups/group-overview.tsx
View File

@ -116,10 +116,7 @@ export function GroupPosts(props: { posts: Post[]; group: Group }) {
</Col>
<Col>
{user && (
<Button
className="btn-md"
onClick={() => setShowCreatePost(!showCreatePost)}
>
<Button onClick={() => setShowCreatePost(!showCreatePost)}>
Add a Post
</Button>
)}
@ -432,7 +429,7 @@ export function GroupAbout(props: {
<CopyLinkButton
url={shareUrl}
tracking="copy group share link"
buttonClassName="btn-md rounded-l-none"
buttonClassName="rounded-l-none"
toastClassName={'-left-28 mt-1'}
/>
</Col>

19
web/components/numeric-bet-panel.tsx
View File

@ -20,6 +20,7 @@ import { Row } from './layout/row'
import { Spacer } from './layout/spacer'
import { BetSignUpPrompt } from './sign-up-prompt'
import { track } from 'web/lib/service/analytics'
import { Button } from './button'
export function NumericBetPanel(props: {
contract: NumericContract
@ -108,7 +109,7 @@ function NumericBuyPanel(props: {
})
}
const betDisabled = isSubmitting || !betAmount || !bucketChoice || error
const betDisabled = isSubmitting || !betAmount || !bucketChoice || !!error
const { newBet, newPool, newTotalShares, newTotalBets } = getNumericBetsInfo(
value ?? 0,
@ -195,16 +196,14 @@ function NumericBuyPanel(props: {
<Spacer h={8} />
{user && (
<button
className={clsx(
'btn flex-1',
betDisabled ? 'btn-disabled' : 'btn-primary',
isSubmitting ? 'loading' : ''
)}
onClick={betDisabled ? undefined : submitBet}
<Button
disabled={betDisabled}
color="green"
loading={isSubmitting}
onClick={submitBet}
>
{isSubmitting ? 'Submitting...' : 'Submit'}
</button>
Submit
</Button>
)}
{wasSubmitted && <div className="mt-4">Bet submitted!</div>}

9
web/components/referrals-button.tsx
View File

@ -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}
/>
<Row className={'mt-0 justify-end'}>
<button
<Button
className={
referredBy.length === 0
? 'hidden'
: 'btn btn-primary btn-md my-2 w-24 normal-case'
referredBy.length === 0 ? 'hidden' : 'my-2 w-24'
}
disabled={referredBy.length === 0 || isSubmitting}
onClick={() => {
@ -114,7 +113,7 @@ function ReferralsDialog(props: {
}}
>
Save
</button>
</Button>
</Row>
<span className={'text-warning'}>
{referredBy.length > 0 &&

1
web/components/resolution-panel.tsx
View File

@ -72,7 +72,6 @@ export function ResolutionPanel(props: {
className="mx-auto my-2"
selected={outcome}
onSelect={setOutcome}
btnClassName={isSubmitting ? 'btn-disabled' : ''}
/>
<Spacer h={4} />
<div>

59
web/components/sell-button.tsx
View File

@ -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 (
<Col className={'items-center'}>
<button
className={clsx(
'btn-sm w-24 gap-1',
// from the yes-no-selector:
'inline-flex items-center justify-center rounded-3xl border-2 p-2',
sharesOutcome === 'NO'
? 'hover:bg-primary-focus border-primary hover:border-primary-focus text-primary hover:text-white'
: 'border-red-400 text-red-500 hover:border-red-500 hover:bg-red-500 hover:text-white'
)}
onClick={() => setShowSellModal(true)}
>
Sell{' '}
{isPseudoNumeric
? { YES: 'HIGH', NO: 'LOW' }[sharesOutcome]
: sharesOutcome}
</button>
<div className={'mt-1 w-24 text-center text-sm text-gray-500'}>
{'(' + Math.floor(shares) + ' shares)'}
</div>
{showSellModal && (
<SellSharesModal
className={panelClassName}
contract={contract}
user={user}
userBets={userBets ?? []}
shares={shares}
sharesOutcome={sharesOutcome}
setOpen={setShowSellModal}
/>
)}
</Col>
)
}
return <div />
}

4
web/components/yes-no-selector.tsx
View File

@ -101,7 +101,7 @@ export function YesNoCancelSelector(props: {
<Button
color={selected === 'MKT' ? 'blue' : 'gray'}
onClick={() => onSelect('MKT')}
className={clsx(btnClassName, 'btn-sm')}
className={btnClassName}
>
PROB
</Button>
@ -109,7 +109,7 @@ export function YesNoCancelSelector(props: {
<Button
color={selected === 'CANCEL' ? 'yellow' : 'gray'}
onClick={() => onSelect('CANCEL')}
className={clsx(btnClassName, 'btn-sm')}
className={btnClassName}
>
N/A
</Button>

4
web/pages/[username]/[contractSlug].tsx
View File

@ -248,10 +248,10 @@ export function ContractPageContent(
ogCardProps={ogCardProps}
/>
)}
<Col className="w-full justify-between rounded border-0 border-gray-100 bg-white py-6 pl-1 pr-2 sm:px-2 md:px-6 md:py-8">
<Col className="w-full justify-between rounded bg-white py-6 pl-1 pr-2 sm:px-2 md:px-6 md:py-8">
{backToHome && (
<button
className="btn btn-sm mb-4 items-center gap-2 self-start border-0 border-gray-700 bg-white normal-case text-gray-700 hover:bg-white hover:text-gray-700 lg:hidden"
className="mb-4 items-center gap-2 self-start bg-white text-gray-700 lg:hidden"
onClick={backToHome}
>
<ArrowLeftIcon className="h-5 w-5 text-gray-700" />

5
web/pages/admin.tsx
View File

@ -11,6 +11,7 @@ import { useAdmin } from 'web/hooks/use-admin'
import { contractPath } from 'web/lib/firebase/contracts'
import { redirectIfLoggedOut } from 'web/lib/firebase/server-auth'
import { firestoreConsolePath } from 'common/envs/constants'
import { Button } from 'web/components/button'
export const getServerSideProps = redirectIfLoggedOut('/')
@ -107,9 +108,7 @@ function UsersTable() {
limit: 25,
}}
/>
<button className="btn" onClick={exportCsv}>
Export emails to CSV
</button>
<Button onClick={exportCsv}>Export emails to CSV</Button>
</>
)
}

26
web/pages/charity/[charitySlug].tsx
View File

@ -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}
</div>
<button
<Button
color="indigo"
onClick={() => setOpen(!open)}
className={clsx(
'btn btn-link capitalize-none my-3 normal-case text-indigo-700',
hideExpander && 'invisible'
)}
className={clsx('my-3', hideExpander && 'invisible')}
>
{open ? 'Hide' : 'Read more'}
</button>
</Button>
</>
)
}
@ -175,7 +174,7 @@ function DonationBox(props: {
const [isSubmitting, setIsSubmitting] = useState(false)
const [error, setError] = useState<string | undefined>()
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: {
<Spacer h={8} />
{user && (
<button
<Button
type="submit"
className={clsx(
'btn w-full',
donateDisabled ? 'btn-disabled' : 'btn-primary',
isSubmitting && 'loading'
)}
color="green"
className="w-full"
disabled={donateDisabled}
loading={isSubmitting}
>
Donate
</button>
</Button>
)}
</form>
</div>

12
web/pages/create.tsx
View File

@ -519,20 +519,18 @@ export function NewContract(props: {
)}
</div>
<button
<Button
type="submit"
className={clsx(
'btn btn-primary normal-case',
isSubmitting && 'loading disabled'
)}
disabled={isSubmitting || !isValid || upload.isLoading}
color="green"
loading={isSubmitting}
disabled={!isValid || upload.isLoading}
onClick={(e) => {
e.preventDefault()
submit()
}}
>
{isSubmitting ? 'Creating...' : 'Create question'}
</button>
</Button>
</Row>
<Spacer h={6} />

9
web/pages/profile.tsx
View File

@ -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: {
<Col className="max-w-lg rounded bg-white p-6 shadow-md sm:mx-auto">
<Row className="justify-between">
<Title className="!mt-0" text="Edit Profile" />
<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

2
web/pages/referrals.tsx
View File

@ -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'}
/>

19
web/pages/twitch.tsx
View File

@ -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>
)}
</>