aravind/glink-website
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Home page done

Browse Source
This commit is contained in:
Aravind142857
2023-06-29 01:52:47 -05:00
parent f1950ca6bb
commit 80b9b2e048
3 changed files with 133 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
public/home.html
View File

@@ -5,8 +5,8 @@
<title>Home</title>
<link rel="stylesheet" href="css/output.css">
</head>
<body>
<main class="m-10 h-96">
<body >
<main class="m-10 h-auto w-auto">
<nav class="flex items-center lg:justify-between sm:justify-center flex-wrap bg-gray-500 p-6 shadow-lg shadow-black/50 sticky top-4 opacity-100 mb-24"> <!--dark:bg-black-->
<div class="block lg:hidden cursor-pointer flex:none mr-4" id="HamburgerInactive">
<button id="btn" class="flex flex-col items-center px-3 py-[0.4375rem] border rounded text-teal-200 border-teal-400">
@@ -89,8 +89,8 @@
});
</script>
</nav>
<div class="flex lg:flex-row flex-col w-full mb-24">
<div class="h-96 w-auto flex flex-col flex-grow">
<div class="flex lg:flex-row flex-col w-full mb-24 justify-center items-center">
<div class="h-96 lg:w-auto sm:w-full flex flex-col flex-grow">
<div class="w-full flex items-center justify-center mb-6 border-8 border-black">
<h1 class="text-4xl md:text-5xl lg:text-6xl">Lorem ipsum dolor</h1>
</div>
@@ -100,35 +100,45 @@
</p>
</div>
</div>
<img class="w-auto flex-grow-0 h-96" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTGpfMagCsgrJkELG_GOjtxqssEPXd-3vr2PmPdaB-0Y5Rp-bv1VOouyoXmG2QxZWHpdYI&usqp=CAU">
<img class="w-auto flex-grow-0 h-96 w-96" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTGpfMagCsgrJkELG_GOjtxqssEPXd-3vr2PmPdaB-0Y5Rp-bv1VOouyoXmG2QxZWHpdYI&usqp=CAU">
</div>
<div class="flex lg:flex-col h-96 flex-col w-full mb-24 border-8 border-black">
<div class="flex lg:flex-col h-auto flex-col w-full mb-24 border-8 border-black">
<div class="w-full justify-center items-center flex border-8 border-black">
<p class="text-4xl md:text-5xl lg:text-6xl">
How it works
</p>
</div>
<div class="flex lg:flex-row flex-col justify-between items-center h-full w-full">
<div class="flex flex-col items-center lg:h-full lg:w-1/3 lg:m-0 w-full m-5">
<img src="" alt="pic1" class="bg-black flex-grow m-5">
<div class="flex lg:flex-row flex-col justify-between items-center h-auto w-auto mx-5 mb-5">
<div class="flex flex-col items-center h-full lg:w-1/3 w-full">
<img src="" alt="pic2" class="bg-black flex-grow m-5 w-full rounded">
<p class="text-xl">
Step 1
</p>
</div>
<div class="flex flex-col items-center h-full w-1/3">
<img src="" alt="pic2" class="bg-black flex-grow m-5">
<div class="flex flex-col items-center h-full lg:w-1/3 w-full">
<img src="" alt="pic2" class="bg-black flex-grow m-5 w-full rounded">
<p class="text-xl">
Step 2
</p>
</div>
<div class="flex flex-col items-center h-full w-1/3">
<img src="" alt="pic3" class="bg-black flex-grow m-5">
<p class="text-xl">
Step 3
</p>
<div class="flex flex-col items-center h-full lg:w-1/3 w-full">
<img src="" alt="pic2" class="bg-black flex-grow m-5 w-full rounded">
<p class="text-xl">
Step 3
</p>
</div>
</div>
</div>
<div class="w-full border-8 border-black flex flex-col items-center justify-center">
<div class="border-4 border-black w-auto h-auto mt-8 text-4xl md:text-5xl lg:text-6xl flex flex-wrap">
Why?
</div>
<div class="border-4 border-black h-auto mt-4 lg:mx-8 max-w-md sm:flex-grow-0 mb-4 ">
<p class="text-lg md:text-xl lg:text-2xl">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A ab delectus dolor, dolorem dolorum et facilis, illum ipsam, natus nobis nulla quam repellat saepe! Aperiam doloremque harum laudantium repellendus tempora!
</p>
</div>
</div>
</main>
</body>
</html>