I am attempting to make the title as well as sub-title larger, yet it’s obtaining cuttoff by a max-width. I am utilizing tailwind-css.
I have actually attempted including bigger worth to the max-w home, as well as likewise attempted providing some divs extra padding yet it still obtains removed. I desire the message to be large sufficient to fill up 50% the display
Many Thanks!
import {FADE_IN_ANIMATION_SETTINGS} from "@/ lib/constants";.
import {AnimatePresence, activity} from "framer-motion";.
import {useSession} from "next-auth/react";.
import Picture from "next/image";.
import Web link from "next/link";.
import {ReactNode} from "respond";.
import useScroll from "@/ lib/hooks/use-scroll";.
import Meta from "./ meta";.
import {useSignInModal} from "./ sign-in-modal";.
import UserDropdown from "./ user-dropdown";.
export default feature Format( {
meta,.
kids,.
}: {
meta?: {
title?: "McMaster Blockchain Club";.
summary?: "The main site of the McMaster Blockchain Club";.
photo?: string;.
};.
kids: ReactNode;.
}) {
const {information: session, condition} = useSession();.
const {SignInModal, setShowSignInModal} = useSignInModal();.
const scrolled = useScroll( 50 );.
return (.
<>< >.
<< Meta {... meta}/>>.
<< SignInModal/>>.
<< div className=" taken care of h-screen w-full"/>>.
<< div.
className= {'taken care of top-0 w-full $ {
scrolled.
? "border-b border-gray-200 bg-white/50 backdrop-blur-xl".
: "bg-white/0".
} z-30 transition-all '}
>>.
<< div className=" mx-5 flex h-16 max-w-screen-xl items-center justify-between xl: mx-auto">>.
<< Web link href="/" className=" flex items-center font-display text-2xl">>.
<< Picture.
src="/ block-logo. png"
alt=" Blockchain Club logo design".
size=" 60"
elevation=" 60"
className=" mr-1 rounded-sm".
><> .
<< p>> McMaster Blockchain Club<.
<.
<< div>>.
<< AnimatePresence>>.
{! session && & & condition!== "loading"? (.
<< motion.button.
className=" rounded-full boundary border-black bg-black p-1.5 px-4 text-sm text-white transition-all hover: bg-white hover: text-black".
onClick= {() => > setShowSignInModal( real)}
{... FADE_IN_ANIMATION_SETTINGS}
>>.
Sign up with.
<.
): (.
<< UserDropdown/>>.
)}
<.
<.
<.
<.
<< primary className=" flex w-full flex-col items-center justify-center py-32">>.
{kids}
<.
<< div className=" outright w-full border-t border-gray-200 bg-white py-5 text-center">>.
<< p className=" text-gray-500">
> Developed by {""}
<< a.
className=" font-medium text-gray-800 underscore transition-colors".
href=" #"
target=" _ space"
rel=" noopener noreferrer".
>>.
College student (ADD web link to HREF).
<.
<.
<.
<.
);.
}
I attempted changing changing the max-width in the moms and dad divs yet having no good luck.
