matrix-art

commit a83e161098980cada061d7a2625f4119d7847c33
parent 2eb908695a96260a8f5c3ea7e86fd9f439818e5a
Author: MTRNord <mtrnord1@gmail.com>
Date:   Wed,  5 Jan 2022 13:40:30 +0100

Fix mobile page header

Diffstat:
M
components/Header.tsx
 | 
2
+-
M
pages/Home.tsx
 | 
4
++--
M
pages/profile/[userid].tsx
 | 
4
++--

3 files changed, 5 insertions(+), 5 deletions(-)
diff --git a/components/Header.tsx b/components/Header.tsx
@@ -7,7 +7,7 @@ export default class Header extends Component {
     render() {
         return (
             <>
-                <header className='bg-[#f8f8f8] dark:bg-[#06070D] flex fixed top-0 left-0 right-0 bottom-0 lg:h-20 h-54 z-[100] items-center lg:flex-row flex-col'>
+                <header className='bg-[#f8f8f8] dark:bg-[#06070D] flex fixed top-0 left-0 right-0 bottom-0 lg:h-20 h-52 z-[100] items-center lg:flex-row flex-col shadow-black drop-shadow-xl'>
                     <span className='flex items-center h-full lg:mx-10 my-4 text-gray-900 dark:text-gray-200 font-bold'><Link href="/">Matrix Art</Link></span>
                     <div className='flex flex-1 items-center lg:flex-row flex-col'>
                         <div className='flex grow-[1] h-full relative items-center'>
diff --git a/pages/Home.tsx b/pages/Home.tsx
@@ -138,8 +138,8 @@ export default class Home extends Component<Props, State>{
                         <meta property="og:type" content="website" key="og-type" />
                     </Head>
                     <Header></Header>
-                    <main className='h-full lg:pt-20 pt-56 z-0'>
-                        <div className='z-[100] sticky lg:top-20 top-56 bg-[#fefefe]/[.95] dark:bg-[#14181E]/[.95]'>
+                    <main className='h-full lg:pt-20 pt-52 z-0'>
+                        <div className='z-[100] sticky lg:top-20 top-52 bg-[#fefefe]/[.95] dark:bg-[#14181E]/[.95]'>
                             <div className='h-16 px-10 w-full relative grid grid-cols-[1fr_auto_1fr] items-center' id='section-grid'>
                                 <h1 className='text-xl text-gray-900 dark:text-gray-200 font-bold'>Home</h1>
                             </div>
diff --git a/pages/profile/[userid].tsx b/pages/profile/[userid].tsx
@@ -183,7 +183,7 @@ class Profile extends Component<Props, State> {
                                 </div>
                                 <div className="w-full bg-transparent">
                                     <div className="pt-5">
-                                        <div className="flex">
+                                        <div className="flex flex-col-reverse lg:flex-row">
                                             <div className="mr-16 overflow-hidden pb-4 flex-[auto]">
                                                 <div>
                                                     <section className="pb-4 block">
@@ -201,7 +201,7 @@ class Profile extends Component<Props, State> {
                                                     </section>
                                                 </div>
                                             </div>
-                                            <div className="w-[37.5rem] flex-none">
+                                            <div className="lg:w-[37.5rem] w-full flex-none">
                                                 <div>
                                                     <section className="pb-4 block">
                                                         <div className="w-full flex items-center mt-8 mb-4">