39 lines
1.4 KiB
TypeScript
39 lines
1.4 KiB
TypeScript
"use client";
|
|
|
|
import Image from "next/image";
|
|
|
|
export default function Component() {
|
|
return (
|
|
<div className="w-full bg-linear-gradient">
|
|
<div
|
|
className="flex justify-between items-end m-auto max-w-7xl h-20 px-3 /* small */
|
|
md:px-3 md:h-calc-2 /* middle */
|
|
xl:max-w-7xl xl:h-96 /* xlarge */
|
|
"
|
|
>
|
|
<h1
|
|
className="self-center text-center text-lg leading-normal font-bold w-full /* small */
|
|
md:text-left md:text-calc-1 md:w-2/5 /* middle */
|
|
xl:text-left xl:text-4xl xl:leading-normal xl:w-2/5 /* xlarge */
|
|
"
|
|
// style={{ fontSize: 'calc((100vw - 8px) / 1024 * 36)' }}
|
|
>
|
|
Free, official online office tutorials by WPS Academy
|
|
</h1>
|
|
<div
|
|
className="hidden
|
|
md:flex md:h-calc-1 /* midle */
|
|
xl:h-80 xl:w-3/5 /* xlarge */
|
|
"
|
|
>
|
|
<Image
|
|
className="w-full h-full"
|
|
src="https://res-academy.cache.wpscdn.com/images/57a4a45ff9748ff9cdef334582053ed9.png"
|
|
alt={"big img"}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|