css fix

Phoenix-NSEC · Apr 22, 2024 · 07342bd · 07342bd
1 parent 71b3cd7
commit 07342bd
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 14 deletions.
diff --git a/src/components/GalleryGrid.jsx b/src/components/GalleryGrid.jsx
@@ -51,11 +51,11 @@ const GridCard = ({ image, mb, grow }) => {
     console.log(image);
     return (
         <>
-            <a href="ve" className={`group relative flex flex-col overflow-hidden rounded-lg px-4 pb-4 pt-40 ${mb ? "mb-4" : ""} ${grow ? "flex-grow" : ""}`}>
+            <div className={`group relative flex flex-col overflow-hidden rounded-lg px-4 pb-4 pt-40 ${mb ? "mb-4" : ""} ${grow ? "flex-grow" : ""}`}>
                 <img src={image.url} alt="img" className="absolute inset-0 h-full w-full object-cover group-hover:scale-105 transition-transform duration-500 ease-in-out" />
                 <div className="absolute inset-0 bg-gradient-to-b from-gray-900/25 to-gray-900/5"></div>
                 <h5 className="z-10 text-lg font-medium text-white absolute bottom-0 left-0 p-2 md:text-xl">{image.caption}</h5>
-            </a>
+            </div>
         </>
     )
 }
diff --git a/src/pages/Clubs/Wing.jsx b/src/pages/Clubs/Wing.jsx
@@ -22,12 +22,11 @@ const Wing = () => {
 
             {/* cover image */}
             <div className='mt-4 md:px-60'>
-                <a href="cv"
+                <div
                     className="w-full h-56 relative group overflow-hidden flex rounded-lg"
-                >
-                    <img src={coverImage} alt="img" className="h-full w-full absolute inset-0 object-cover object-center group-hover:scale-105 transition-transform duration-500 ease-in-out" />
+                > <img src={coverImage} alt="img" className="absolute w-full h-full inset-0 object-cover object-center group-hover:scale-105 transition-transform duration-500 ease-in-out" />
                     <div className="absolute inset-0 bg-gradient-to-b from-gray-900/25 to-gray-900/5"></div>
-                </a>
+                </div>
             </div>
 
             <div className="wing-body px-10 md:px-60">
@@ -82,7 +81,7 @@ const MemberCard = ({ name, designation, socials }) => {
         <style>
             {`
             .our-team {
-            padding: 20px 0 55px;
+            padding: 30px 0 60px;
             margin-bottom: 20px;
             background-color: #f7f5ec;
             text-align: center;
@@ -92,9 +91,9 @@ const MemberCard = ({ name, designation, socials }) => {
 
             .our-team .picture {
             display: inline-block;
-            height: 130px;
-            width: 130px;
-            margin-bottom: 20px;
+            height: 150px;
+            width: 150px;
+            margin-bottom: 30px;
             z-index: 1;
             position: relative;
             }
@@ -146,6 +145,7 @@ const MemberCard = ({ name, designation, socials }) => {
             .our-team .social {
             display: flex;
             justify-content: center;
+            align-items: center;
             gap: 1rem;
             width: 100%;
             background-color: #1369ce;
@@ -175,7 +175,7 @@ const MemberCard = ({ name, designation, socials }) => {
         `}
         </style>
 
-        <div className="our-team rounded-xl w-full md:w-[15rem] flex-shrink-0 border-t-2 border-l-2 border-t-sky-300 border-l-sky-300 shadow-lg shadow-blue-300">
+        <div className="our-team rounded-lg w-[15rem] flex-shrink-0 border-t-2 border-l-2 border-t-sky-300 border-l-sky-300 shadow-lg shadow-blue-300">
             <div className="picture">
                 <img className="img-fluid" alt='img' src="https://picsum.photos/130/130?image=1027" />
             </div>
@@ -184,9 +184,9 @@ const MemberCard = ({ name, designation, socials }) => {
                 <h4 className="title text-[#4e5052]">{designation}</h4>
             </div>
             <ul className="social">
-                <li ><a href={socials.insta} aria-hidden="true"><AiFillInstagram size={"1.5rem"} /></a></li>
-                <li><a href={socials.github} aria-hidden="true"><FaGithub size={"1.5rem"} /></a></li>
-                <li><a href={socials.linkedin} aria-hidden="true"><FaLinkedinIn size={"1.5rem"} /></a></li>
+                <li ><a href={socials.insta} aria-hidden="true"><AiFillInstagram size={"1.2rem"} /></a></li>
+                <li><a href={socials.github} aria-hidden="true"><FaGithub size={"1.2rem"} /></a></li>
+                <li><a href={socials.linkedin} aria-hidden="true"><FaLinkedinIn size={"1.2rem"} /></a></li>
             </ul>
         </div>
     </>)