@@ -3,11 +3,11 @@ import React from 'react';
33
44const OurTeam = ( ) => {
55 return (
6- < div className = 'w-full max-w-7xl mx-auto px-4 sm:px-6 md:px-8 lg:px-12' >
6+ < div className = 'mx-auto w-full max-w-7xl px-4 sm:px-6 md:px-8 lg:px-12' >
77 { /* Header Section */ }
8- < div className = 'text-center mb-12 md:mb-16 lg:mb-20' >
8+ < div className = 'mb-12 text-center md:mb-16 lg:mb-20' >
99 < p
10- className = 'text-sm md:text-base font-medium bg-clip-text text-transparent w-fit mx-auto mb-4 '
10+ className = 'mx-auto mb-4 w-fit bg-clip-text text-sm font-medium text-transparent md:text-base '
1111 style = { {
1212 backgroundImage :
1313 'linear-gradient(272.61deg, #A7F95080 13.84%, #3AE6B2 73.28%)' ,
@@ -16,11 +16,11 @@ const OurTeam = () => {
1616 Our Team
1717 </ p >
1818
19- < h1 className = 'text-white text-center text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-normal leading-tight mb-4 ' >
19+ < h1 className = 'mb-4 text-center text-2xl leading-tight font-normal text-white sm:text-3xl md:text-4xl lg:text-5xl' >
2020 Meet the Brains Behind Boundless
2121 </ h1 >
2222 < p
23- className = 'bg-clip-text text-transparent text- center text-sm sm:text-base md: text-lg max-w-xs sm:max-w-md md:max-w-lg lg :max-w-2xl mx-auto leading-relaxed '
23+ className = 'mx-auto max-w-xs bg-clip-text text-center text-sm leading-relaxed text-transparent sm: max-w-md sm:text-base md:max-w-lg md:text-lg lg :max-w-2xl'
2424 style = { {
2525 backgroundImage :
2626 'linear-gradient(93.2deg, #B5B5B5 15.93%, #FFFFFF 73.28%)' ,
@@ -32,29 +32,29 @@ const OurTeam = () => {
3232 </ div >
3333
3434 { /* Team Members Grid */ }
35- < div className = 'grid grid-cols-1 lg:grid-cols-2 gap-8 md:gap-12 lg:gap-16 xl:gap-20' >
35+ < div className = 'grid grid-cols-1 gap-8 md:gap-12 lg:grid-cols-2 lg:gap-16 xl:gap-20' >
3636 { /* Team Member 1 */ }
37- < div className = 'flex flex-col sm:flex-row items-center sm:items-start gap-4 md:gap-6 w-full ' >
38- < div className = 'bg-[#D9D9D9] w-48 h-48 sm:w-56 sm:h-56 md :w-60 md:h-60 lg :w-64 lg:h-64 xl :w-72 xl:h-72 rounded-xl cursor-pointer transition duration-300 hover:scale-105 flex-shrink-0 ' > </ div >
39- < div className = 'text-center sm:text-left flex-1 w-full ' >
40- < h3 className = 'font-medium text-xl md:text-2xl text-white mb-2 ' >
37+ < div className = 'flex w-full flex-col items-center gap-4 sm:flex-row sm:items-start md:gap-6' >
38+ < div className = 'h-48 w-48 flex-shrink-0 cursor-pointer rounded-xl bg-[#D9D9D9] transition duration-300 hover:scale-105 sm:h-56 sm :w-56 md:h-60 md :w-60 lg:h-64 lg :w-64 xl:h-72 xl:w-72 ' > </ div >
39+ < div className = 'w-full flex-1 text-center sm:text-left' >
40+ < h3 className = 'mb-2 text-xl font-medium text-white md:text-2xl ' >
4141 Collins Ikechukwu
4242 </ h3 >
43- < p className = 'font-medium italic text-[#B5B5B5] text-sm md:text-base mb-4 md:mb-6 ' >
43+ < p className = 'mb-4 text-sm font-medium text-[#B5B5B5] italic md:mb-6 md:text-base ' >
4444 Blockchain Developer
4545 </ p >
4646 < hr
47- className = 'w-full h-[1px] border-0 mb-4 md:mb-6'
47+ className = 'mb-4 h-[1px] w-full border-0 md:mb-6'
4848 style = { {
4949 background :
5050 'radial-gradient(113.1% 103.23% at 45.52% -1.51%, rgba(255, 255, 255, 0.4704) 0%, rgba(255, 255, 255, 0.0784) 100%)' ,
5151 } }
5252 />
53- < p className = 'text-[#B5B5B5] text-sm md:text-base leading-relaxed mb-6 md:mb-8' >
53+ < p className = 'mb-6 text-sm leading-relaxed text-[#B5B5B5] md:mb-8 md:text-base ' >
5454 A skilled blockchain developer with a focus on decentralized
5555 finance and smart contract solutions.
5656 </ p >
57- < div className = 'flex items-center justify-center sm:justify-start gap-3 md:gap-4' >
57+ < div className = 'flex items-center justify-center gap-3 sm:justify-start md:gap-4' >
5858 < div
5959 style = { {
6060 border : '1px solid' ,
@@ -64,7 +64,7 @@ const OurTeam = () => {
6464 width : '40px' ,
6565 height : '40px' ,
6666 } }
67- className = 'flex items-center justify-center cursor-pointer transition duration-300 hover:scale-105'
67+ className = 'flex cursor-pointer items-center justify-center transition duration-300 hover:scale-105'
6868 >
6969 < Image
7070 src = { '/linkedin.svg' }
@@ -82,7 +82,7 @@ const OurTeam = () => {
8282 width : '40px' ,
8383 height : '40px' ,
8484 } }
85- className = 'flex items-center justify-center cursor-pointer transition duration-300 hover:scale-105'
85+ className = 'flex cursor-pointer items-center justify-center transition duration-300 hover:scale-105'
8686 >
8787 < Image src = { '/X.svg' } alt = 'X' width = { 20 } height = { 20 } />
8888 </ div >
@@ -91,27 +91,27 @@ const OurTeam = () => {
9191 </ div >
9292
9393 { /* Team Member 2 */ }
94- < div className = 'flex flex-col sm:flex-row items-center sm:items-start gap-4 md:gap-6 w-full ' >
95- < div className = 'bg-[#D9D9D9] w-48 h-48 sm:w-56 sm:h-56 md :w-60 md:h-60 lg :w-64 lg:h-64 xl :w-72 xl:h-72 rounded-xl cursor-pointer transition duration-300 hover:scale-105 flex-shrink-0 ' > </ div >
96- < div className = 'text-center sm:text-left flex-1 w-full ' >
97- < h3 className = 'font-medium text-xl md:text-2xl text-white mb-2 ' >
94+ < div className = 'flex w-full flex-col items-center gap-4 sm:flex-row sm:items-start md:gap-6' >
95+ < div className = 'h-48 w-48 flex-shrink-0 cursor-pointer rounded-xl bg-[#D9D9D9] transition duration-300 hover:scale-105 sm:h-56 sm :w-56 md:h-60 md :w-60 lg:h-64 lg :w-64 xl:h-72 xl:w-72 ' > </ div >
96+ < div className = 'w-full flex-1 text-center sm:text-left' >
97+ < h3 className = 'mb-2 text-xl font-medium text-white md:text-2xl ' >
9898 Nnaji Benjamin
9999 </ h3 >
100- < p className = 'font-medium italic text-[#B5B5B5] text-sm md:text-base mb-4 md:mb-6 ' >
100+ < p className = 'mb-4 text-sm font-medium text-[#B5B5B5] italic md:mb-6 md:text-base ' >
101101 Full-Stack & Blockchain Developer
102102 </ p >
103103 < hr
104- className = 'w-full h-[1px] border-0 mb-4 md:mb-6'
104+ className = 'mb-4 h-[1px] w-full border-0 md:mb-6'
105105 style = { {
106106 background :
107107 'radial-gradient(113.1% 103.23% at 45.52% -1.51%, rgba(255, 255, 255, 0.4704) 0%, rgba(255, 255, 255, 0.0784) 100%)' ,
108108 } }
109109 />
110- < p className = 'text-[#B5B5B5] text-sm md:text-base leading-relaxed mb-6 md:mb-8' >
110+ < p className = 'mb-6 text-sm leading-relaxed text-[#B5B5B5] md:mb-8 md:text-base ' >
111111 A versatile full-stack and blockchain developer with strong
112112 experience across Web3 platforms.
113113 </ p >
114- < div className = 'flex items-center justify-center sm:justify-start gap-3 md:gap-4' >
114+ < div className = 'flex items-center justify-center gap-3 sm:justify-start md:gap-4' >
115115 < div
116116 style = { {
117117 border : '1px solid' ,
@@ -121,7 +121,7 @@ const OurTeam = () => {
121121 width : '40px' ,
122122 height : '40px' ,
123123 } }
124- className = 'flex items-center justify-center cursor-pointer transition duration-300 hover:scale-105'
124+ className = 'flex cursor-pointer items-center justify-center transition duration-300 hover:scale-105'
125125 >
126126 < Image
127127 src = { '/linkedin.svg' }
@@ -139,7 +139,7 @@ const OurTeam = () => {
139139 width : '40px' ,
140140 height : '40px' ,
141141 } }
142- className = 'flex items-center justify-center cursor-pointer transition duration-300 hover:scale-105'
142+ className = 'flex cursor-pointer items-center justify-center transition duration-300 hover:scale-105'
143143 >
144144 < Image src = { '/X.svg' } alt = 'X' width = { 20 } height = { 20 } />
145145 </ div >
0 commit comments