DavidJentes
/
websitedesign2025
1
0
Fork 0
Code

Make header text responsive

main
daviddgtnt 2025-01-27 13:18:33 -06:00
parent 3d4d53ab3c
commit eb3beb1994
4 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
_layouts/default.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body class="h-full"> <body class="h-full">
<header class="bg-livingstone-500 p-5 h-32 hover:h-56 transition-all duration-500 w-full fixed group"> <header class="bg-livingstone-500 p-5 h-32 hover:h-56 transition-all duration-500 w-full fixed group">
<h1 class="text-center text-5xl text-white p-7 font-bevan">David Livingstone</h1> <h1 class="text-center text-3xl sm:text-5xl text-white p-7 font-bevan">David Livingstone</h1>
<ul class="flex place-content-center place-items-center p-8 invisible group-hover:visible opacity-0 group-hover:opacity-100 transition-opacity duration-300 group-hover:duration-1000"> <ul class="flex place-content-center place-items-center p-8 invisible group-hover:visible opacity-0 group-hover:opacity-100 transition-opacity duration-300 group-hover:duration-1000">
<li><a href="/" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Home</a></li> <li><a href="/" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Home</a></li>
<li><a href="/blog" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Blog</a></li> <li><a href="/blog" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Blog</a></li>

4
_layouts/home.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body class="h-full"> <body class="h-full">
<header class="bg-livingstone-500 p-5 h-32 hover:h-56 transition-all duration-500 opacity-80 hover:opacity-100 w-full fixed group"> <header class="bg-livingstone-500 p-5 h-32 hover:h-56 transition-all duration-500 opacity-80 hover:opacity-100 w-full fixed group">
<h1 class="text-center text-5xl text-white p-7 font-bevan">David Livingstone</h1> <h1 class="text-center text-3xl sm:text-5xl text-white p-7 font-bevan">David Livingstone</h1>
<ul class="flex place-content-center place-items-center p-8 invisible group-hover:visible opacity-0 group-hover:opacity-100 transition-opacity duration-300 group-hover:duration-1000"> <ul class="flex place-content-center place-items-center p-8 invisible group-hover:visible opacity-0 group-hover:opacity-100 transition-opacity duration-300 group-hover:duration-1000">
<li><a href="/" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Home</a></li> <li><a href="/" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Home</a></li>
<li><a href="/blog" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Blog</a></li> <li><a href="/blog" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Blog</a></li>
@ -16,7 +16,7 @@
</ul> </ul>
</header> </header>
<div class="bg-cover bg-fixed bg-[url('/assets/img/canyon.jpg')] h-3/4 flex flex-col place-content-center place-items-center"> <div class="bg-cover bg-fixed bg-[url('/assets/img/canyon.jpg')] h-3/4 flex flex-col place-content-center place-items-center">
<h1 class="text-5xl text-white font-bevan p-10">Africa's greatest missionary</h1> <h1 class="text-5xl text-center text-white font-bevan p-10">Africa's greatest missionary</h1>
<h2 class="text-xl text-white font-baskerville"></h2> <h2 class="text-xl text-white font-baskerville"></h2>
</div> </div>
<main class="min-h-[83.333333%] max-w-5xl m-auto"> <main class="min-h-[83.333333%] max-w-5xl m-auto">

2
_layouts/noindent.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body class="h-full"> <body class="h-full">
<header class="bg-livingstone-500 p-5 h-32 hover:h-56 transition-all duration-500 w-full fixed group"> <header class="bg-livingstone-500 p-5 h-32 hover:h-56 transition-all duration-500 w-full fixed group">
<h1 class="text-center text-5xl text-white p-7 font-bevan">David Livingstone</h1> <h1 class="text-center text-3xl sm:text-5xl text-white p-7 font-bevan">David Livingstone</h1>
<ul class="flex place-content-center place-items-center p-8 invisible group-hover:visible opacity-0 group-hover:opacity-100 transition-opacity duration-300 group-hover:duration-1000"> <ul class="flex place-content-center place-items-center p-8 invisible group-hover:visible opacity-0 group-hover:opacity-100 transition-opacity duration-300 group-hover:duration-1000">
<li><a href="/" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Home</a></li> <li><a href="/" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Home</a></li>
<li><a href="/blog" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Blog</a></li> <li><a href="/blog" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Blog</a></li>

2
_layouts/post.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body class="h-full"> <body class="h-full">
<header class="bg-livingstone-500 p-5 h-32 hover:h-56 transition-all duration-500 w-full fixed group"> <header class="bg-livingstone-500 p-5 h-32 hover:h-56 transition-all duration-500 w-full fixed group">
<h1 class="text-center text-5xl text-white p-7 font-bevan">David Livingstone</h1> <h1 class="text-center text-3xl sm:text-5xl text-white p-7 font-bevan">David Livingstone</h1>
<ul class="flex place-content-center place-items-center p-8 invisible group-hover:visible opacity-0 group-hover:opacity-100 transition-opacity duration-300 group-hover:duration-1000"> <ul class="flex place-content-center place-items-center p-8 invisible group-hover:visible opacity-0 group-hover:opacity-100 transition-opacity duration-300 group-hover:duration-1000">
<li><a href="/" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Home</a></li> <li><a href="/" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Home</a></li>
<li><a href="/blog" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Blog</a></li> <li><a href="/blog" class="text-white bg-livingstone-400 p-5 mx-1 hover:bg-livingstone-100 hover:text-xl transition-all duration-500 rounded-full font-mplus2">Blog</a></li>