Skip to content

Commit 8658c86

Browse files
ScreenTechnicalsScreenTechnicals
committed
minor path bug fixed
1 parent 22740af commit 8658c86

File tree

6 files changed

+222
-52
lines changed

6 files changed

+222
-52
lines changed

‎public/static/logo2.png‎

55 KB
Loading

‎ui/banner/BlankRasaBanner1.tsx‎

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
import {
2+
Box,
3+
Image,
4+
Text,
5+
Heading,
6+
Button,
7+
useColorModeValue,
8+
} from '@chakra-ui/react';
9+
import React from 'react';
10+
11+
const BlankRasaBanner1 = () => {
12+
const bg = useColorModeValue('light', '#171717');
13+
const pColor = useColorModeValue('#616B74', 'gray.200');
14+
const btnColor = useColorModeValue('white', '#171717');
15+
const imgColor = useColorModeValue('invert(0)', 'invert(1)');
16+
const bgBoxShadowDesktop = useColorModeValue(
17+
'0px 8px 16px -5px rgba(0, 0, 0, 0.10)',
18+
'0px 8px 16px -5px rgba(6, 252, 153, 0.10)',
19+
);
20+
21+
return (
22+
<Box
23+
bg={ bg }
24+
boxShadow={ bgBoxShadowDesktop }
25+
borderRadius="md"
26+
pt={ 5 }
27+
px={ 5 }
28+
pb={ 7 }
29+
mt={ 8 }
30+
w={ [ 'full', '40%' ] }
31+
>
32+
<Image
33+
src="/static/logo2.png"
34+
w={ [ '100px' ] } // Responsive image size
35+
h={ [ '100px' ] }
36+
filter={ imgColor }
37+
alt="logo2"
38+
/>
39+
<Box>
40+
<Heading as="h2" size="md" mt={ 3 } mb={ 2 } fontWeight="bold">
41+
Blank Rasa
42+
</Heading>
43+
<Text fontSize="sm" color={ pColor }>
44+
A platform for discovering and trading NFTs on Canto. Features
45+
collections such as CantoLongneck, Shnoises and more
46+
</Text>
47+
</Box>
48+
49+
<a
50+
href="https://www.blankrasa.com"
51+
target="_blank"
52+
referrerPolicy="no-referrer"
53+
>
54+
<Button
55+
bg="transparent"
56+
color="green.500"
57+
_hover={{
58+
bg: 'green.500',
59+
color: btnColor,
60+
}}
61+
fontWeight="medium"
62+
colorScheme="green.500"
63+
p={ 4 }
64+
mt={ [ 3 ] }
65+
width="100%"
66+
fontSize="sm"
67+
variant="outline"
68+
borderWidth="1.5px"
69+
>
70+
Explore More
71+
</Button>
72+
</a>
73+
</Box>
74+
);
75+
};
76+
77+
export default BlankRasaBanner1;

‎ui/banner/BlankRasaBanner2.tsx‎

Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
import {
2+
Box,
3+
Flex,
4+
Image,
5+
Text,
6+
Button,
7+
useColorModeValue,
8+
} from '@chakra-ui/react';
9+
import React from 'react';
10+
11+
const BlankRasaBanner2 = () => {
12+
const bg = useColorModeValue('light', '#171717');
13+
const pColor = useColorModeValue('#616B74', 'gray.200');
14+
const btnColor = useColorModeValue('white', '#171717');
15+
const bgBoxShadowDesktop = useColorModeValue(
16+
'0px 8px 16px -5px rgba(0, 0, 0, 0.10)',
17+
'0px 8px 16px -5px rgba(6, 252, 153, 0.10)',
18+
);
19+
const imgColor = useColorModeValue('invert(0)', 'invert(1)');
20+
21+
return (
22+
<Box
23+
bg={ bg }
24+
boxShadow={ bgBoxShadowDesktop }
25+
borderRadius="md"
26+
p={ 5 }
27+
display="flex"
28+
alignItems={ [ '', 'center' ] }
29+
justifyContent="space-between"
30+
flexDirection={ [ 'column', 'row' ] }
31+
>
32+
<Flex
33+
flexDirection={ [ 'column', 'row' ] }
34+
alignItems={ [ '', 'center' ] }
35+
gap={ 5 }
36+
>
37+
<Image
38+
src="/static/logo2.png"
39+
w={ [ '90px', '100px' ] }
40+
h={ [ '90px', '100px' ] }
41+
alt="logo2"
42+
filter={ imgColor }
43+
/>
44+
<Box w={ [ '100%', '50%' ] }>
45+
{ /* <Heading as="h2" size="md" mb={ 2 } fontWeight="bold">
46+
Blank Rasa
47+
</Heading> */ }
48+
<Text fontSize="20px" fontWeight="bold" mb={ 2 }>
49+
Blank Rasa
50+
</Text>
51+
<Text fontSize="14px" color={ pColor }>
52+
A platform for discovering and trading NFTs on Canto. Features
53+
collections such as CantoLongneck, Shnoises and more
54+
</Text>
55+
</Box>
56+
</Flex>
57+
<a
58+
href="https://www.blankrasa.com"
59+
target="_blank"
60+
referrerPolicy="no-referrer"
61+
>
62+
<Button
63+
bg="transparent"
64+
color="green.500"
65+
_hover={{
66+
bg: 'green.500',
67+
color: btnColor,
68+
}}
69+
fontWeight="medium"
70+
colorScheme="green.500"
71+
p={ 4 }
72+
mt={ [ 3 ] }
73+
width={ [ '100%', '270px' ] }
74+
fontSize="sm"
75+
variant="outline"
76+
borderWidth="1.5px"
77+
>
78+
Explore More
79+
</Button>
80+
</a>
81+
</Box>
82+
);
83+
};
84+
85+
export default BlankRasaBanner2;

‎ui/pages/Home.tsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { Box, Heading, Flex, LightMode } from '@chakra-ui/react';
22
import React from 'react';
33

44
import config from 'configs/app';
5+
import BlankRasaBanner1 from 'ui/banner/BlankRasaBanner1';
56
import ChainIndicators from 'ui/home/indicators/ChainIndicators';
67
import LatestBlocks from 'ui/home/LatestBlocks';
78
import Stats from 'ui/home/Stats';
@@ -40,7 +41,10 @@ const Home = () => {
4041
</LightMode>
4142
</Box>
4243
<Stats/>
43-
<ChainIndicators/>
44+
<Flex flexDirection={ [ 'column', 'row' ] } alignItems={ [ 'start' ] } gap={ 5 }>
45+
<ChainIndicators/>
46+
<BlankRasaBanner1/>
47+
</Flex>
4448
<AdBanner mt={{ base: 6, lg: 8 }} mx="auto" display="flex" justifyContent="center"/>
4549
<Flex mt={ 8 } direction={{ base: 'column', lg: 'row' }} columnGap={ 12 } rowGap={ 8 }>
4650
<LatestBlocks/>

‎ui/shared/Page/PageTitle.tsx‎

Lines changed: 54 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import React from 'react';
44

55
import eastArrowIcon from 'icons/arrows/east.svg';
66
import useIsMobile from 'lib/hooks/useIsMobile';
7+
import BlankRasaBanner2 from 'ui/banner/BlankRasaBanner2';
78
import TextAd from 'ui/shared/ad/TextAd';
89
import LinkInternal from 'ui/shared/LinkInternal';
910

@@ -90,59 +91,62 @@ const PageTitle = ({ title, contentAfter, withTextAd, backLink, className, isLoa
9091
}, [ updatedTruncateState ]);
9192

9293
return (
93-
<Flex
94-
className={ className }
95-
mb={ 6 }
96-
flexDir="row"
97-
flexWrap="wrap"
98-
rowGap={ 3 }
99-
columnGap={ 3 }
100-
alignItems="center"
101-
>
102-
<Flex h={{ base: 'auto', lg: isLoading ? 10 : 'auto' }} maxW="100%" alignItems="center">
103-
{ backLink && <BackLink { ...backLink } isLoading={ isLoading }/> }
104-
{ beforeTitle }
105-
<Skeleton
106-
isLoaded={ !isLoading }
107-
overflow="hidden"
108-
>
109-
<Tooltip
110-
label={ title }
111-
isOpen={ tooltip.isOpen }
112-
bgColor="bg_base" color="text" borderWidth="1px" borderColor="divider"
113-
onClose={ tooltip.onClose }
114-
maxW={{ base: 'calc(100vw - 32px)', lg: '500px' }}
115-
closeOnScroll={ isMobile ? true : false }
116-
isDisabled={ !isTextTruncated }
94+
<>
95+
<BlankRasaBanner2/>
96+
<Flex
97+
className={ className }
98+
mb={ 6 }
99+
flexDir="row"
100+
flexWrap="wrap"
101+
rowGap={ 3 }
102+
columnGap={ 3 }
103+
alignItems="center"
104+
>
105+
<Flex h={{ base: 'auto', lg: isLoading ? 10 : 'auto' }} maxW="100%" alignItems="center">
106+
{ backLink && <BackLink { ...backLink } isLoading={ isLoading }/> }
107+
{ beforeTitle }
108+
<Skeleton
109+
isLoaded={ !isLoading }
110+
overflow="hidden"
117111
>
118-
<Heading
119-
ref={ headingRef }
120-
as="h1"
121-
size="lg"
122-
whiteSpace="normal"
123-
wordBreak="break-all"
124-
style={{
125-
WebkitLineClamp: TEXT_MAX_LINES,
126-
WebkitBoxOrient: 'vertical',
127-
display: '-webkit-box',
128-
}}
129-
overflow="hidden"
130-
textOverflow="ellipsis"
131-
onMouseEnter={ tooltip.onOpen }
132-
onMouseLeave={ tooltip.onClose }
133-
onClick={ isMobile ? tooltip.onToggle : undefined }
112+
<Tooltip
113+
label={ title }
114+
isOpen={ tooltip.isOpen }
115+
bgColor="bg_base" color="text" borderWidth="1px" borderColor="divider"
116+
onClose={ tooltip.onClose }
117+
maxW={{ base: 'calc(100vw - 32px)', lg: '500px' }}
118+
closeOnScroll={ isMobile ? true : false }
119+
isDisabled={ !isTextTruncated }
134120
>
135-
<span ref={ textRef }>
136-
{ title }
137-
</span>
138-
</Heading>
139-
</Tooltip>
140-
</Skeleton>
141-
{ afterTitle }
121+
<Heading
122+
ref={ headingRef }
123+
as="h1"
124+
size="lg"
125+
whiteSpace="normal"
126+
wordBreak="break-all"
127+
style={{
128+
WebkitLineClamp: TEXT_MAX_LINES,
129+
WebkitBoxOrient: 'vertical',
130+
display: '-webkit-box',
131+
}}
132+
overflow="hidden"
133+
textOverflow="ellipsis"
134+
onMouseEnter={ tooltip.onOpen }
135+
onMouseLeave={ tooltip.onClose }
136+
onClick={ isMobile ? tooltip.onToggle : undefined }
137+
>
138+
<span ref={ textRef }>
139+
{ title }
140+
</span>
141+
</Heading>
142+
</Tooltip>
143+
</Skeleton>
144+
{ afterTitle }
145+
</Flex>
146+
{ contentAfter }
147+
{ withTextAd && <TextAd order={{ base: -1, lg: 100 }} mb={{ base: 6, lg: 0 }} ml="auto" w={{ base: '100%', lg: 'auto' }}/> }
142148
</Flex>
143-
{ contentAfter }
144-
{ withTextAd && <TextAd order={{ base: -1, lg: 100 }} mb={{ base: 6, lg: 0 }} ml="auto" w={{ base: '100%', lg: 'auto' }}/> }
145-
</Flex>
149+
</>
146150
);
147151
};
148152

‎ui/shared/layout/components/Content.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ interface Props {
77

88
const Content = ({ children }: Props) => {
99
return (
10-
<Box pt={{ base: 0, lg: '52px' }} as="main">
10+
<Box pt={{ base: 0, lg: '25px' }} as="main">
1111
{ children }
1212
</Box>
1313
);

0 commit comments

Comments
 (0)