Skip to content

Commit

Permalink
Merge pull request #828 from TrustlessComputer/arch/new-home-1
Browse files Browse the repository at this point in the history 
update info
  • Loading branch information
@sigmar-const
sigmar-const authored Nov 14, 2024
2 parents a6294e5 + 5759db7 commit ce6b2b0
Show file tree
Hide file tree
Showing 6 changed files with 98 additions and 70 deletions.
4 changes: 4 additions & 0 deletions src/modules/landing/Componets/Chain/ItemChain/SectionBottom/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import Lines from '@/interactive/Lines';

type TSectionBottom = {
title: string;
desc: string;
link?: string;
data?: {
left: string;
Expand Down Expand Up @@ -46,6 +47,9 @@ export default function SectionBottom({
>
<Chars delay={delay}>{data.title}</Chars>
</h6>
<Chars delay={delay}>
<p className={s.sectionBottom_title_sub}>{data.desc}</p>
</Chars>
<Chars delay={delay}>
<p className={s.sectionBottom_title_sub}>
{!data?.link && !isLaunch && 'Coming soon'}
Expand Down
15 changes: 13 additions & 2 deletions src/modules/landing/Componets/Chain/ItemChain/SectionBottom/styles.module.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
gap: 20px;
min-height: 142px;
justify-content: center;
height: 100%;

&_title {
//display: flex;
Expand All @@ -20,11 +21,13 @@
&_isLaunch {
text-align: center;
padding: 0;

@include is-pc {
padding: 0 40px;
padding-bottom: 24px;
}
}

&_isYourChain {
text-align: left;
padding: 0;
Expand All @@ -43,8 +46,9 @@

&_sub {
line-height: 25.2px;
font-size: 18px;
font-size: 14px;
color: rgba(255, 255, 255, 0.7);
margin-top: 4px;

@include is-tablet {
font-size: 16px;
Expand All @@ -56,14 +60,17 @@
}
}
}

&_yourChain_desc {
color: #000000b2;
font-weight: 400;
font-size: 14px;
}

&__isYourChain {
gap: 12px;
}

&_listInfo {
display: flex;
flex-direction: column;
Expand All @@ -84,6 +91,7 @@
line-height: 1.4;
color: rgba(255, 255, 255, 0.7);
white-space: nowrap;

@include is-tablet {
font-size: 12px;
}
Expand Down Expand Up @@ -136,13 +144,16 @@
&__7D8AA7 {
background: #7d8aa7;
}

&__FFFFFF {
background: #fff;
}

&__B74D4D {
background: #b74d4d;
}

&__A459A6 {
background: #a459a6;
}
}
}
1 change: 1 addition & 0 deletions src/modules/landing/Componets/Chain/ItemChain/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ type TItemChain = {
title: string;
stud: number;
link?: string;
desc: string;
data?:
| {
left: string;
Expand Down
9 changes: 8 additions & 1 deletion src/modules/landing/Componets/Chain/ItemChain/styles.module.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,17 @@
flex: 1;
flex-shrink: 0;
cursor: pointer;
max-width: 450px;
min-width: 300px;
flex: 1;

&_inner {
display: flex;
flex-direction: column;
padding: 5px 6px;
background-color: #fff;
height: 100%;
align-self: stretch;
}

@include is-mobile {
Expand Down Expand Up @@ -44,18 +48,21 @@
width: 100%;
gap: unset;
}

.itemLaunch:first-child {
grid-column: span 2;
grid-column-start: 1;
}

.itemLaunch:nth-child(3n) {
grid-column: span 2;
grid-column-start: 2;

@include is-tablet {
grid-column-start: 1;
}

@include is-mobile {
grid-column-start: 1;
}
}
}
100 changes: 52 additions & 48 deletions src/modules/landing/Componets/Chain/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,21 +22,58 @@ import ContentSection from '../ContentSection';
import Lines from '@/interactive/Lines';

const DATA_CHAINS = [
// {
// img: chain_1,
// title: 'Alpha Chain',
// subTitle: '',
// stud: 1,
// link: 'https://alpha.wtf',
// data: [
// {
// left: 'Currency',
// right: 'BVM',
// icon: '/landing/svg/lego_icon_flat.svg',
// },
// {
// left: 'Use Case',
// right: 'SocialFi',
// icon: '/landing/svg/lego_icon_rect.svg',
// },
// {
// left: 'Rollups',
// right: 'Optimistic, Sovereign',
// icon: '/landing/svg/lego_icon_rollup.svg',
// },
// {
// left: 'Data Validity',
// right: 'Bitcoin Ordinals',
// icon: '/landing/svg/lego_icon_cube.svg',
// },
// {
// left: 'Data Availability',
// right: 'Polygon',
// icon: '/landing/svg/lego_icon_cube.svg',
// },
// ],

// bgTop: '35CCA6',
// bgBottom: '007659',
// },
{
img: chain_1,
title: 'Alpha Chain',
subTitle: '',
img: chain_4,
title: 'Eternal AI',
desc: 'A Bitcoin Layer 2 powering unstoppable AI.',
stud: 1,
link: 'https://alpha.wtf',
link: 'https://eternalai.org/',
data: [
{
left: 'Currency',
right: 'BVM',
right: 'EAI',
icon: '/landing/svg/lego_icon_flat.svg',
},
{
left: 'Use Case',
right: 'SocialFi',
right: 'Crypto x AI',
icon: '/landing/svg/lego_icon_rect.svg',
},
{
Expand All @@ -51,17 +88,17 @@ const DATA_CHAINS = [
},
{
left: 'Data Availability',
right: 'Polygon',
right: 'NearDA',
icon: '/landing/svg/lego_icon_cube.svg',
},
],

bgTop: '35CCA6',
bgBottom: '007659',
bgTop: 'FF9999',
bgBottom: 'B74D4D',
},
{
img: chain_2,
title: 'Naka Chain',
desc: 'A Bitcoin Layer 2 optimized for DeFi with extremely low gas fees.',
stud: 2,
link: 'https://nakachain.xyz/',
data: [
Expand Down Expand Up @@ -97,12 +134,13 @@ const DATA_CHAINS = [
{
img: chain_3,
title: 'Arcade Chain',
desc: 'A Bitcoin Layer 2 tailored for gaming with 2-second block times.',
stud: 3,
link: 'https://bitcoinarcade.xyz/',
data: [
{
left: 'Currency',
right: 'GAME',
right: 'BVM',
icon: '/landing/svg/lego_icon_flat.svg',
},
{
Expand All @@ -112,7 +150,7 @@ const DATA_CHAINS = [
},
{
left: 'Rollups',
right: 'Optimistic, Sovereign',
right: 'ZK, Sovereign',
icon: '/landing/svg/lego_icon_rollup.svg',
},
{
Expand All @@ -122,48 +160,14 @@ const DATA_CHAINS = [
},
{
left: 'Data Availability',
right: 'EigenDA',
right: 'Polygon',
icon: '/landing/svg/lego_icon_cube.svg',
},
],
bgTop: '4DBDE0',
bgBottom: '0074BB',
},
{
img: chain_4,
title: 'Eternal AI',
stud: 1,
link: 'https://eternalai.org/',
data: [
{
left: 'Currency',
right: 'AI',
icon: '/landing/svg/lego_icon_flat.svg',
},
{
left: 'Use Case',
right: 'Crypto x AI',
icon: '/landing/svg/lego_icon_rect.svg',
},
{
left: 'Rollups',
right: 'Optimistic, Sovereign',
icon: '/landing/svg/lego_icon_rollup.svg',
},
{
left: 'Data Validity',
right: 'Bitcoin Ordinals',
icon: '/landing/svg/lego_icon_cube.svg',
},
{
left: 'Data Availability',
right: 'NearDA',
icon: '/landing/svg/lego_icon_cube.svg',
},
],
bgTop: 'FF9999',
bgBottom: 'B74D4D',
},

// {
// img: chain_5,
// title: 'Swamps',
Expand Down
39 changes: 20 additions & 19 deletions src/modules/landing/Componets/Chain/styles.module.scss
View file
Original file line number Diff line number Diff line change
@@ -1,29 +1,30 @@
.listChains {
display: grid;
gap: 36px;
display: flex;
gap: 2%;
overflow: hidden;
justify-content: center;
flex-wrap: wrap;

@include is-mobile {
width: 100%;
padding: 0 20px;
gap: 8px;
// grid-template-columns: repeat(1, 1fr);
}
// @include is-mobile {
// width: 100%;
// padding: 0 20px;
// gap: 8px;
// // grid-template-columns: repeat(1, 1fr);
// }

@include is-tablet {
gap: 0;
grid-template-columns: repeat(1, 1fr);
}
// @include is-tablet {
// gap: 0;
// grid-template-columns: repeat(1, 1fr);
// }

@include is-pc {
gap: 10px;
grid-template-columns: repeat(2, 1fr);
}
// @include is-pc {
// gap: 10px;
// grid-template-columns: repeat(2, 1fr);
// }

@include is-pc-wide {
grid-template-columns: repeat(4, 1fr);
}
// @include is-pc-wide {
// grid-template-columns: repeat(4, 1fr);
// }
}

.chain {
Expand Down

0 comments on commit ce6b2b0

Please sign in to comment.