New Onboarding (#2596)
* Add round and square buttons
* Allow some style for buttons, add icons
* Change text selection color
* Center button text, whoops
* Outer layout, some primitive updates
* WIP
* onboarding feed prefs (#2590)
* add `style` to toggle label to modify text style
* Revert "add `style` to toggle label to modify text style"
This reverts commit 8f4b517b85.
* following feed prefs
* remove unnecessary memo
* reusable divider component
* org imports
* add finished screen
* Theme SelectedAccountCard
* Require at least 3 interests
* Placeholder save logic
* WIP algo feeds
* Improve lineHeight handling, add RichText, improve Link by adding InlineLink
* Inherit lineHeight in heading comps
* Algo feeds mostly good
* Topical feeds ish
* Layout cleanup
* Improve button styles
* moderation prefs for onboarding (#2594)
* WIP algo feeds
* modify controlalbelgroup typing for easy .map()
* adjust padding on button
* add moderation screen
* add moderation screen
* add moderation screen
---------
Co-authored-by: Eric Bailey <git@esb.lol>
* Fix toggle button styles
* A11y props on outer portal
* Put it all on red
* New data shape
* Handle mock data
* Bulk write (not yet)
* Remove interests validation
* Clean up interests
* i18n layout and first step
* Clean up suggested follows screen
* Clean up following step
* Clean up algo feeds step
* Clean up topical feeds
* Add skeleton for feed card
* WIP moderation step
* cleanup moderation styles (#2605)
* cleanup moderation styles
* fix(?) toggle button group styles
* adjust toggle to fit any screen
* Some more cleanup
* Icons
* ToggleButton tweaks
* Reset
* Hook up data
* Better suggestions
* Bulk write
* Some logging
* Use new api
* Concat topical feeds
* Metrics
* Disable links in RichText, feedcards
* Tweak primary feed cards
* Update metrics
* Fix layout shift
* Fix ToggleButton again, whoops
* Error state
* Bump api package, ensure interests are saved
* Better fix for autofill
* i18n, button positions
* Remove unused export
* Add default prefs object
* Fix overflow in user cards
* Add 2 lines of bios to suggested accounts cards
* Nits
* Don't resolve facets by default
* Update storybook
* Disable flag for now
* Remove age dialog from moderations step
* Improvements and tweaks to new onboarding
---------
Co-authored-by: Hailey <153161762+haileyok@users.noreply.github.com>
Co-authored-by: Paul Frazee <pfrazee@gmail.com>
This commit is contained in:
Eric Bailey
@@ -11,6 +11,7 @@ import {
|
||||
} from '#/components/Button'
|
||||
import {H1} from '#/components/Typography'
|
||||
import {ArrowTopRight_Stroke2_Corner0_Rounded as ArrowTopRight} from '#/components/icons/ArrowTopRight'
|
||||
import {ChevronLeft_Stroke2_Corner0_Rounded as ChevronLeft} from '#/components/icons/Chevron'
|
||||
import {Globe_Stroke2_Corner0_Rounded as Globe} from '#/components/icons/Globe'
|
||||
|
||||
export function Buttons() {
|
||||
@@ -91,14 +92,16 @@ export function Buttons() {
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={[a.flex_wrap, a.gap_md, a.align_start]}>
|
||||
<Button
|
||||
variant="gradient"
|
||||
color="gradient_sky"
|
||||
size="large"
|
||||
label="Link out">
|
||||
<ButtonText>Link out</ButtonText>
|
||||
<ButtonIcon icon={ArrowTopRight} />
|
||||
<ButtonIcon icon={ArrowTopRight} position="right" />
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
@@ -107,7 +110,7 @@ export function Buttons() {
|
||||
size="small"
|
||||
label="Link out">
|
||||
<ButtonText>Link out</ButtonText>
|
||||
<ButtonIcon icon={ArrowTopRight} />
|
||||
<ButtonIcon icon={ArrowTopRight} position="right" />
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
@@ -115,8 +118,86 @@ export function Buttons() {
|
||||
color="gradient_sky"
|
||||
size="small"
|
||||
label="Link out">
|
||||
<ButtonIcon icon={Globe} />
|
||||
<ButtonText>See the world</ButtonText>
|
||||
<ButtonText>Link xxxxxx</ButtonText>
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
variant="gradient"
|
||||
color="gradient_sky"
|
||||
size="small"
|
||||
label="Link out">
|
||||
<ButtonIcon icon={Globe} position="left" />
|
||||
<ButtonText>Link out</ButtonText>
|
||||
</Button>
|
||||
</View>
|
||||
|
||||
<View style={[a.flex_row, a.gap_md, a.align_start]}>
|
||||
<Button
|
||||
variant="solid"
|
||||
color="primary"
|
||||
size="large"
|
||||
shape="round"
|
||||
label="Link out">
|
||||
<ButtonIcon icon={ChevronLeft} />
|
||||
</Button>
|
||||
<Button
|
||||
variant="gradient"
|
||||
color="gradient_sunset"
|
||||
size="small"
|
||||
shape="round"
|
||||
label="Link out">
|
||||
<ButtonIcon icon={ChevronLeft} />
|
||||
</Button>
|
||||
<Button
|
||||
variant="outline"
|
||||
color="primary"
|
||||
size="large"
|
||||
shape="round"
|
||||
label="Link out">
|
||||
<ButtonIcon icon={ChevronLeft} />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
color="primary"
|
||||
size="small"
|
||||
shape="round"
|
||||
label="Link out">
|
||||
<ButtonIcon icon={ChevronLeft} />
|
||||
</Button>
|
||||
</View>
|
||||
|
||||
<View style={[a.flex_row, a.gap_md, a.align_start]}>
|
||||
<Button
|
||||
variant="solid"
|
||||
color="primary"
|
||||
size="large"
|
||||
shape="square"
|
||||
label="Link out">
|
||||
<ButtonIcon icon={ChevronLeft} />
|
||||
</Button>
|
||||
<Button
|
||||
variant="gradient"
|
||||
color="gradient_sunset"
|
||||
size="small"
|
||||
shape="square"
|
||||
label="Link out">
|
||||
<ButtonIcon icon={ChevronLeft} />
|
||||
</Button>
|
||||
<Button
|
||||
variant="outline"
|
||||
color="primary"
|
||||
size="large"
|
||||
shape="square"
|
||||
label="Link out">
|
||||
<ButtonIcon icon={ChevronLeft} />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
color="primary"
|
||||
size="small"
|
||||
shape="square"
|
||||
label="Link out">
|
||||
<ButtonIcon icon={ChevronLeft} />
|
||||
</Button>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
Reference in New Issue
Block a user