Merge pull request #109 from apeunit/ft/typography-default-behavior

Feat: Typography classes and assets naming

components/sections/Hero.jsx

@@ -2,7 +2,7 @@ import Image from "next/image";
 import { Heading } from "../ui/Typography";
 import heroBall from "/public/assets/images/hero-ball.webp";
 import heroPrism from "/public/assets/images/hero-prism.webp";
-import downArrow from "/public/assets/images/downArrow.webp";
+import downArrow from "/public/assets/images/down-arrow.webp";
 import underlineTop from "/public/assets/images/underline-top.webp";
 
 const Hero = () => {

components/sections/OurWork.jsx

@@ -6,7 +6,7 @@ const OurWork = () => {
   return (
     <div className="flex flex-col w-full mt-9.75 md:mt-30.25 mb-2.75 md:mb-16">
       <div>
-        <Heading className="xl:ml-11.25 ml-0" type='two'>Our Work</Heading>
+        <Heading className="xl:ml-11.25 ml-0" type='two'>Our work</Heading>
       </div>
       <div className="space-y-6 md:mt-8.25 mt-4">
         {projects.map((project, index) => (

components/ui/Typography.jsx

@@ -1,18 +1,16 @@
-import classNames from "classnames";
+export const Heading = ({ children, className, type = "default" }) => {
+
+  const classes = {
+    one:`font-medium md:font-normal md:text-14.75 text-7.25 md:leading-22 leading-11 -tracking-0.02 ${className}`,
+    two:`font-normal md:text-11.75 md:leading-14.75 leading-7.15 text-6.5 text-white -tracking-0.015 md:-tracking-0.02 ${className}`,
+    three:`font-normal md:text-9.5 md:leading-12.25 leading-9 text-5.75 -tracking-0.015 ${className}`,
+    four: `font-normal leading-7.5 md:leading-9.5 text-xl md:text-3xl -tracking-0.015 ${className}`,
+    default:`font-normal text-white text-6.5 md:text-11.75 ${className}`
+  }[type]
 
-export const Heading = ({ children, className, type }) => {
   return (
     <div
-      className={classNames({
-        [`font-medium md:font-normal md:text-14.75 text-7.25 md:leading-22 leading-11 -tracking-0.02 ${className}`]:
-          type === "one",
-        [`font-normal md:text-11.75 md:leading-14.75 leading-7.15 text-6.5 text-white -tracking-0.015 md:-tracking-0.02 ${className}`]:
-          type === "two",
-        [`font-normal md:text-9.5 md:leading-12.25 leading-9 text-5.75 -tracking-0.015 ${className}`]:
-          type === "three",
-        [`font-normal leading-7.5 md:leading-9.5 text-xl md:text-3xl -tracking-0.015 ${className}`]:
-          type === "four",
-      })}
+      className={classes}
     >
       {children}
     </div>

data/logos.js

@@ -1,7 +1,7 @@
 const logos = [
     {
         id: 1,
-        source: '/assets/images/CELO.svg',
+        source: '/assets/images/celo.svg',
         Width: '120',
         Height: '59',
         link: 'https://celo.org/',
@@ -17,7 +17,7 @@ const logos = [
     },
     {
         id: 3,
-        source: '/assets/images/Tezos.svg',
+        source: '/assets/images/tezos.svg',
         Width: '109',
         Height: '59',
         link: 'https://tezos.com/',

data/projects.js

@@ -12,7 +12,7 @@ const projects = [
     id: 2,
     title: "Lab3",
     description: "A web3 knowledge exchange community for music makers",
-    image: "/assets/images/Lab3.jpg",
+    image: "/assets/images/lab3.jpg",
     imageAlt: "Lab 3",
     visitLink: "http://lab3.space/"
   },

data/socialMedias.js

@@ -8,7 +8,7 @@ const socialMedias = [
         content: "Facebook",
     },
     {
-        link: "https://de.linkedin.com/company/ape-unit",
+        link: "https://www.linkedin.com/company/apeunit/",
         content: "Linkedin",
     },
 ]

tailwind.config.js

@@ -8,7 +8,7 @@ module.exports = {
     extend: {
       backgroundImage: {
         unit8: "url('/assets/images/unit8-project.svg')",
-        lab3: "url('/assets/images/Lab3.jpg')",
+        lab3: "url('/assets/images/lab3.jpg')",
       },
       colors: {
         primary: {