-
Notifications
You must be signed in to change notification settings - Fork 4
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #61 from RobinNagpal/dawood/insurance-images
Added life insurance related images
- Loading branch information
Showing
8 changed files
with
33 additions
and
177 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -11,6 +11,10 @@ import { CircleBackground } from './CircleBackground'; | |
import { Container } from './Container'; | ||
import { PhoneFrame } from './PhoneFrame'; | ||
import { DiageoLogo, LaravelLogo, MirageLogo, ReversableLogo, StatamicLogo, StaticKitLogo, TransistorLogo, TupleLogo } from './StockLogos'; | ||
import Image from 'next/image'; | ||
import Tidbits from '@/images/lifeInsure/images/tidbits.png'; | ||
import Quizzes from '@/images/lifeInsure/images/quiz.png'; | ||
import Shorts from '@/images/lifeInsure/images/shorts.png'; | ||
|
||
const MotionAppScreenHeader = motion(AppScreen.Header); | ||
const MotionAppScreenBody = motion(AppScreen.Body); | ||
|
@@ -155,26 +159,12 @@ function InviteScreen(props: ScreenProps) { | |
return ( | ||
<AppScreen className="w-full"> | ||
<MotionAppScreenHeader {...(props.animated ? headerAnimation : {})}> | ||
<AppScreen.Title>Invite people</AppScreen.Title> | ||
<AppScreen.Subtitle> | ||
Get tips <span className="">5s sooner</span> for every invite. | ||
</AppScreen.Subtitle> | ||
<AppScreen.Title>Step-by-Step Tidbits</AppScreen.Title> | ||
<AppScreen.Subtitle>Each tidbit crafted for better learning</AppScreen.Subtitle> | ||
</MotionAppScreenHeader> | ||
|
||
<MotionAppScreenBody {...(props.animated ? { ...bodyAnimation, custom: props.custom } : {})}> | ||
<div className="px-4 py-6"> | ||
<div className="space-y-6"> | ||
{[ | ||
{ label: 'Full name', value: 'Albert H. Wiggin' }, | ||
{ label: 'Email address', value: '[email protected]' }, | ||
].map((field) => ( | ||
<div key={field.label}> | ||
<div className="text-sm">{field.label}</div> | ||
<div className="mt-2 border-b border-gray-200 pb-2 text-sm">{field.value}</div> | ||
</div> | ||
))} | ||
</div> | ||
<div className="mt-6 rounded-lg bg-cyan-500 px-3 py-2 text-center text-sm font-semibold">Invite person</div> | ||
</div> | ||
<Image src={Tidbits} alt="Tidbits" /> | ||
</MotionAppScreenBody> | ||
</AppScreen> | ||
); | ||
|
@@ -184,81 +174,11 @@ function StocksScreen(props: ScreenProps) { | |
return ( | ||
<AppScreen className="w-full"> | ||
<MotionAppScreenHeader {...(props.animated ? headerAnimation : {})}> | ||
<AppScreen.Title>Stocks</AppScreen.Title> | ||
<AppScreen.Subtitle>March 9, 2022</AppScreen.Subtitle> | ||
<AppScreen.Title>Short Videos</AppScreen.Title> | ||
<AppScreen.Subtitle>1 minute videos to summarize the concepts</AppScreen.Subtitle> | ||
</MotionAppScreenHeader> | ||
<MotionAppScreenBody {...(props.animated ? { ...bodyAnimation, custom: props.custom } : {})}> | ||
<div className="divide-y divide-gray-100"> | ||
{[ | ||
{ | ||
name: 'Laravel', | ||
price: '4,098.01', | ||
change: '+4.98%', | ||
color: '#F9322C', | ||
logo: LaravelLogo, | ||
}, | ||
{ | ||
name: 'Tuple', | ||
price: '5,451.10', | ||
change: '-3.38%', | ||
color: '#5A67D8', | ||
logo: TupleLogo, | ||
}, | ||
{ | ||
name: 'Transistor', | ||
price: '4,098.41', | ||
change: '+6.25%', | ||
color: '#2A5B94', | ||
logo: TransistorLogo, | ||
}, | ||
{ | ||
name: 'Diageo', | ||
price: '250.65', | ||
change: '+1.25%', | ||
color: '#3320A7', | ||
logo: DiageoLogo, | ||
}, | ||
{ | ||
name: 'StaticKit', | ||
price: '250.65', | ||
change: '-3.38%', | ||
color: '#2A3034', | ||
logo: StaticKitLogo, | ||
}, | ||
{ | ||
name: 'Statamic', | ||
price: '5,040.85', | ||
change: '-3.11%', | ||
color: '#0EA5E9', | ||
logo: StatamicLogo, | ||
}, | ||
{ | ||
name: 'Mirage', | ||
price: '140.44', | ||
change: '+9.09%', | ||
color: '#16A34A', | ||
logo: MirageLogo, | ||
}, | ||
{ | ||
name: 'Reversable', | ||
price: '550.60', | ||
change: '-1.25%', | ||
color: '#8D8D8D', | ||
logo: ReversableLogo, | ||
}, | ||
].map((stock) => ( | ||
<div key={stock.name} className="flex items-center gap-4 px-4 py-3"> | ||
<div className="flex-none rounded-full" style={{ backgroundColor: stock.color }}> | ||
<stock.logo className="h-10 w-10" /> | ||
</div> | ||
<div className="flex-auto text-sm">{stock.name}</div> | ||
<div className="flex-none text-right"> | ||
<div className="text-sm font-medium">{stock.price}</div> | ||
<div className={clsx('text-xs leading-5', stock.change.startsWith('+') ? '' : '')}>{stock.change}</div> | ||
</div> | ||
</div> | ||
))} | ||
</div> | ||
<Image src={Shorts} alt="Shorts" /> | ||
</MotionAppScreenBody> | ||
</AppScreen> | ||
); | ||
|
@@ -268,37 +188,11 @@ function InvestScreen(props: ScreenProps) { | |
return ( | ||
<AppScreen className="w-full"> | ||
<MotionAppScreenHeader {...(props.animated ? headerAnimation : {})}> | ||
<AppScreen.Title>Buy $LA</AppScreen.Title> | ||
<AppScreen.Subtitle> | ||
<span className="">$34.28</span> per share | ||
</AppScreen.Subtitle> | ||
<AppScreen.Title>Interactive Quizzes</AppScreen.Title> | ||
<AppScreen.Subtitle>Each tidbit is followed by a quick quiz</AppScreen.Subtitle> | ||
</MotionAppScreenHeader> | ||
<MotionAppScreenBody {...(props.animated ? { ...bodyAnimation, custom: props.custom } : {})}> | ||
<div className="px-4 py-6"> | ||
<div className="space-y-4"> | ||
{[ | ||
{ label: 'Number of shares', value: '100' }, | ||
{ | ||
label: 'Current market price', | ||
value: ( | ||
<div className="flex"> | ||
$34.28 | ||
<svg viewBox="0 0 24 24" fill="none" className="h-6 w-6"> | ||
<path d="M17 15V7H9M17 7 7 17" stroke="#06B6D4" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" /> | ||
</svg> | ||
</div> | ||
), | ||
}, | ||
{ label: 'Estimated cost', value: '$3,428.00' }, | ||
].map((item) => ( | ||
<div key={item.label} className="flex justify-between border-b border-gray-100 pb-4"> | ||
<div className="text-sm">{item.label}</div> | ||
<div className="text-sm font-semibold">{item.value}</div> | ||
</div> | ||
))} | ||
<div className="rounded-lg bg-cyan-500 px-3 py-2 text-center text-sm font-semibold">Buy shares</div> | ||
</div> | ||
</div> | ||
<Image src={Quizzes} alt="Quizzes" /> | ||
</MotionAppScreenBody> | ||
</AppScreen> | ||
); | ||
|
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2ef8e60
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Successfully deployed to the following URLs:
dodao-ui – ./
makerchat.org
kleros.dodao.io
thendc.academy
dodao.academy
lifeinsure.tips
aave.academy
dodao.io
academy.dodao.io
arbitrumchat.org
fuse.university
balancer.academy
cryptogelato.com
uniswapbot.click
compound.education
optimismchat.org
arbitrum.education
uniswap.university
creditunion.academy
empowerher.academy
optimism.university
y-tau-beryl.vercel.app
www.dodao.io
www.aave.academy
www.dodao.academy
www.fuse.university
www.makerchat.org
www.lifeinsure.tips
www.thendc.academy
www.arbitrumchat.org
www.balancer.academy
www.cryptogelato.com
www.optimismchat.org
www.uniswapbot.click
www.arbitrum.education
www.empowerher.academy
www.compound.education
dodao-ui-git-main-robinnagpal-s-team.vercel.app
www.uniswap.university
www.creditunion.academy
dodao-ui-robinnagpal-s-team.vercel.app
www.optimism.university