Skip to content
Snippets Groups Projects
Commit 712249a3 authored by Ryan Du's avatar Ryan Du
Browse files

header resize

parent d0be83b5
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
src/layouts/PageLayoutComp.tsx
+ 4
− 4
View file @ 712249a3
......@@ -39,7 +39,7 @@ const Layout = ({ children, header, title }: LayoutProps) => {
<body className="w-screen">
{header}
<div
className={`bg-cover absolute w-screen left-0 top-0 p-0 m-0 z-10 h-1/3`}
className={`bg-cover absolute w-screen left-0 top-0 p-0 m-0 z-10 h-1/2`}
style={{
background: `linear-gradient(to bottom, rgba(255, 255, 255, 0) 36.46%, #FFFFFF 100%), url(${header})`,
backgroundSize: "cover",
......@@ -60,15 +60,15 @@ const Layout = ({ children, header, title }: LayoutProps) => {
</div>
<div className="flex justify-center w-full items-center">
<div className="w-full m-5 max-w-3xl ">
<p className="font-serif text-6xl z-30 absolute top-1/3 -translate-y-1/2 lg:-translate-x-20 sm:text-5xl md:text-4xl">
<p className="font-serif font-bold z-30 absolute top-1/2 -translate-y-1/2 lg:-translate-x-20 text-5xl sm:text-6xl md:text-7xl">
{title}
</p>
<div className="absolute top-1/3 translate-y-20 h-32 lg:-translate-x-20 lg:border-l-2 border-gray-900 z-50"></div>
<div className="absolute top-1/2 translate-y-20 h-32 lg:-translate-x-20 lg:border-l-2 border-gray-900 z-50"></div>
<div
className={
styling + "mt-[33vh] break-words grow sm:mt-[28vh] md:mt-[23vh]"
styling + "mt-[50vh] break-words grow sm:mt-[44vh] md:mt-[40vh]"
}
>
{children}
......
src/layouts/PageLayoutCompPDF.tsx
+ 3
− 3
View file @ 712249a3
......@@ -39,7 +39,7 @@ const Layout = ({ children, header, title }: LayoutProps) => {
<body className="w-screen">
{header}
<div
className={`bg-cover absolute w-screen left-0 top-0 p-0 m-0 z-10 h-1/3 `}
className={`bg-cover absolute w-screen left-0 top-0 p-0 m-0 z-10 h-1/2 `}
style={{
background: `linear-gradient(to bottom, rgba(255, 255, 255, 0) 36.46%, #FFFFFF 100%), url(${header})`,
backgroundSize: "cover",
......@@ -60,10 +60,10 @@ const Layout = ({ children, header, title }: LayoutProps) => {
</div>
<div className="flex justify-center w-full items-center">
<div className="w-full m-5 max-w-5xl ">
<p className="font-serif text-6xl z-30 absolute top-1/3 -translate-y-1/2 ">
<p className="font-serif text-5xl sm:text-6xl md:text-7xl font-bold z-30 absolute top-1/2 -translate-y-1/2 ">
{title}
</p>
<div className={styling + "mt-[33vh] break-words grow"}>
<div className={styling + "mt-[50vh] break-words grow"}>
{children}
</div>
</div>
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment