add video and images

martincham · Oct 11, 2024 · af9f408 · af9f408
1 parent abd49c4
commit af9f408
Show file tree

Hide file tree

Showing 6 changed files with 22 additions and 6 deletions.
diff --git a/public/HQPictures/Hubris/hubris.mp4 b/public/HQPictures/Hubris/hubris.mp4
diff --git a/public/HQPictures/Hubris/hubris.ogg b/public/HQPictures/Hubris/hubris.ogg
diff --git a/public/HQPictures/Hubris/hubrisVideoSmallest.mov b/public/HQPictures/Hubris/hubrisVideoSmallest.mov
diff --git a/src/pages/art/Hubris.tsx b/src/pages/art/Hubris.tsx
@@ -5,6 +5,16 @@ const Hubris: React.FC = () => {
   return (
     <div className="container mx-auto p-6">
       <section className="container mx-auto py-2">
+        <video
+          controls
+          autoPlay
+          loop
+          className="w-full h-auto max-w-screen object-contain pb-4"
+        >
+          <source src="/HQPictures/Hubris/hubris.mp4" type="video/mp4" />
+          <source src="/HQPictures/Hubris/hubris.ogg" type="video/ogg" />
+          Your browser does not support the video tag.
+        </video>
         <img
           src="/HQPictures/Hubris/hubrisBlur.webp"
           alt="Hubris"

diff --git a/src/pages/art/Tofu.tsx b/src/pages/art/Tofu.tsx
@@ -10,20 +10,20 @@ const Tofu: React.FC = () => {
           controls
           autoPlay
           loop
-          className="w-full h-auto max-w-[500px]  object-contain"
+          className="w-full h-auto max-w-[500px]  object-contain mb-4"
         >
           <source src="/HQPictures/Tofu/tofu.mp4" type="video/mp4" />
           <source src="/HQPictures/Tofu/tofu.ogg" type="video/ogg" />
           Your browser does not support the video tag.
         </video>
-        <Separator className="my-4" />
-        <a>Tofu. 2021. Mixed media.</a>
-        <Separator className="my-4" />
+
         <img
           src="/HQPictures/Tofu/tofuDrip.webp"
           alt="Tofu"
           className="w-full h-auto max-w-[500px]  object-contain"
         />
+        <Separator className="my-4" />
+        <a>Tofu. 2021. Mixed media.</a>
       </section>
     </div>
   );

diff --git a/src/pages/dev/HubrisDev.tsx b/src/pages/dev/HubrisDev.tsx
@@ -12,11 +12,17 @@ const HubrisDev: React.FC = () => {
           pedestal to control the movement of the weight and to synchronize
           through BluetoothLowEnergy.
         </a>
+        <Separator className="my-2" />
+        <img
+          src="/HQPictures/Hubris/insideHubris.webp"
+          alt="Hubris interior"
+          className="w-full h-auto max-w-screen max-h-[800px] object-contain"
+        />
 
         <Separator className="my-2" />
         {/* GitHub Card */}
-        <div className="mx-auto flex  flex-col items-center justify-center gap-6 p-4 sm:p-6 lg:p-8">
-          <div className="grid w-full gap-6 sm:grid-cols-1 md:grid-cols-2 xl:grid-cols-3">
+        <div className="mx-auto flex  flex-col items-center justify-center gap-6  sm:p-6 lg:p-8">
+          <div className="grid w-full gap-6 sm:grid-cols-1 md:grid-cols-2 xl:grid-cols-2">
             <GitHubCard
               repoName="Hubris Robotics"
               description="C++ Arduino code for synchronized pedestal sculpture.."