fix: icon text work with status text
This commit is contained in:
parent
e091c591f6
commit
4e5a29c5d4
|
@ -4,7 +4,7 @@ export type TextElement = {
|
||||||
text: string
|
text: string
|
||||||
bold?: boolean
|
bold?: boolean
|
||||||
italic?: boolean
|
italic?: boolean
|
||||||
weight?: 'regular' | 'medium' | 'bold'
|
weight?: 'regular' | 'medium' | 'semibold'
|
||||||
}
|
}
|
||||||
|
|
||||||
type FormattedTextProps = {
|
type FormattedTextProps = {
|
||||||
|
|
|
@ -1,12 +1,13 @@
|
||||||
import { Paragraph, XStack } from 'tamagui'
|
import { XStack } from 'tamagui'
|
||||||
import Icon from './Icon'
|
import Icon from './Icon'
|
||||||
|
import { Text } from '@status-im/components'
|
||||||
|
|
||||||
type IconTextProps = {
|
type IconTextProps = {
|
||||||
icon: string
|
icon: string
|
||||||
children: string
|
children: string
|
||||||
}
|
}
|
||||||
|
|
||||||
const IconText = ({ icon, children, ...props }: IconTextProps) => {
|
const IconText = ({ icon, children }: IconTextProps) => {
|
||||||
return (
|
return (
|
||||||
<XStack
|
<XStack
|
||||||
style={{
|
style={{
|
||||||
|
@ -15,9 +16,9 @@ const IconText = ({ icon, children, ...props }: IconTextProps) => {
|
||||||
space={'$2'}
|
space={'$2'}
|
||||||
>
|
>
|
||||||
<Icon src={icon} />
|
<Icon src={icon} />
|
||||||
<Paragraph {...props} color={'#000000'} fontWeight={'bold'}>
|
<Text size={11} color={'#000000'} weight={"medium"} >
|
||||||
{children}
|
{children}
|
||||||
</Paragraph>
|
</Text>
|
||||||
</XStack>
|
</XStack>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import LayoutComponent from './LayoutComponent'
|
import LayoutComponent from './LayoutComponent'
|
||||||
import './LandingPage.css'
|
import './LandingPage.css'
|
||||||
import QuickStartBar from './QuickStartBar'
|
import QuickStartBar from './QuickStartBar'
|
||||||
import NodesLogo from './NodesLogo'
|
import IconText from './IconText'
|
||||||
|
|
||||||
function LandingPage() {
|
function LandingPage() {
|
||||||
return (
|
return (
|
||||||
|
@ -15,6 +15,7 @@ function LandingPage() {
|
||||||
function Content() {
|
function Content() {
|
||||||
return (
|
return (
|
||||||
<div className="container-inner landing-page">
|
<div className="container-inner landing-page">
|
||||||
|
<IconText icon="src/assets/nodes-app-icon.png">Quick Start</IconText>
|
||||||
<header>
|
<header>
|
||||||
<div>
|
<div>
|
||||||
<div>
|
<div>
|
||||||
|
@ -24,7 +25,6 @@ function Content() {
|
||||||
nodes<span className="beta">BETA</span>
|
nodes<span className="beta">BETA</span>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<NodesLogo />
|
|
||||||
</header>
|
</header>
|
||||||
<article className="content">
|
<article className="content">
|
||||||
<div className="avatar">
|
<div className="avatar">
|
||||||
|
|
Loading…
Reference in New Issue