Add parallax to floaty homepage cards (#524)

* Add parallax to floaty homepage cards

* Add firefox fix and restore model mouse tracking

* Add overflow-x hidden for safety

app/web/src/layouts/MainLayout/MainLayout.css

@@ -0,0 +1,3 @@
+.preserve-3d-for-children * {
+  transform-style: preserve-3d;
+}

app/web/src/layouts/MainLayout/MainLayout.js

@@ -15,6 +15,7 @@ import { isBrowser } from '@redwoodjs/prerender/browserUtils'
 import Svg from 'src/components/Svg'
 import { ImageFallback } from 'src/components/ImageUploader'
 import useUser from 'src/helpers/hooks/useUser'
+import './MainLayout.css'
 
 let previousSubmission = ''
 
@@ -69,7 +70,10 @@ const MainLayout = ({ children, shouldRemoveFooterInIde }) => {
     }
   }, [hash, client])
   return (
-    <div className="min-h-screen flex flex-col ch-scrollbar">
+    <div
+      className="h-full flex flex-col ch-scrollbar overflow-y-scroll preserve-3d-for-children overflow-x-hidden"
+      style={{ perspective: '1px', perspectiveOrigin: 'top center' }}
+    >
       <header id="cadhub-main-header">
         <nav className="flex justify-between h-16 sm:px-4 bg-ch-gray-900">
           <ul className="flex items-center">