LLM/DocsGPT
1
0
Fork 0
mirror of https://github.com/arc53/DocsGPT.git synced 2025-11-29 08:33:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

added the 3 cards in hero section with gradient border also its responsive

Browse Source
This commit is contained in:
Lokendra Kushwah
2023-10-20 23:24:56 +05:30
parent 641e75b8a8
commit ae13e557a7
3 changed files with 116 additions and 110 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/Hero.tsx
View File

@@ -17,9 +17,9 @@ export default function Hero({ className = '' }: { className?: string }) {
Start by entering your query in the input field below and we will do the
rest!
</p>
<div className="sections mt-1 flex flex-wrap items-center justify-center gap-1 sm:gap-1 md:gap-0 ">
<div className=" rounded-[50px] bg-gradient-to-l from-[#6EE7B7]/70 via-[#3B82F6] to-[#9333EA]/50 p-1 md:rounded-tr-none md:rounded-br-none">
<div className="h-full rounded-[45px] bg-white p-6 md:rounded-tr-none md:rounded-br-none">
<div className="sections mt-8 flex flex-wrap items-center justify-center sm:gap-1 md:gap-0 ">
<div className="mr-4 mb-4 h-[224px] rounded-[25px] bg-gradient-to-l from-[#6EE7B7]/70 via-[#3B82F6] to-[#9333EA]/50 p-1">
<div className="h-full rounded-[21px] bg-white p-6">
<img
src="/message-text.svg"
alt="lock"
@@ -35,8 +35,8 @@ export default function Hero({ className = '' }: { className?: string }) {
</div>
</div>
<div className=" rounded-[50px] bg-gradient-to-r from-[#6EE7B7]/70 via-[#3B82F6] to-[#9333EA]/50 p-1 md:rounded-none md:py-1 md:px-0">
<div className="rounded-[45px] bg-white px-6 py-4 md:rounded-none">
<div className="mr-4 mb-4 rounded-[25px] bg-gradient-to-l from-[#6EE7B7]/70 via-[#3B82F6] to-[#9333EA]/50 p-1">
<div className="h-full rounded-[21px] bg-white p-6">
<img src="/lock.svg" alt="lock" className="h-[24px] w-[24px]" />
<h2 className="mt-2 mb-3 text-lg font-bold">Secure Data Storage</h2>
<p className=" w-[250px] text-xs text-gray-500">
@@ -47,8 +47,8 @@ export default function Hero({ className = '' }: { className?: string }) {
</p>
</div>
</div>
<div className=" rounded-[50px] bg-gradient-to-l from-[#6EE7B7]/80 via-[#3B82F6] to-[#9333EA]/50 p-1 md:rounded-tl-none md:rounded-bl-none">
<div className="rounded-[45px] bg-white p-6 px-6 lg:rounded-tl-none lg:rounded-bl-none">
<div className="mb-4 rounded-[25px] bg-gradient-to-l from-[#6EE7B7]/70 via-[#3B82F6] to-[#9333EA]/50 p-1">
<div className="h-full rounded-[21px] bg-white p-6">
<img
src="/message-programming.svg"
alt="lock"