@rileybathurst/paddle 1.1.2 → 1.1.3

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@rileybathurst/paddle",
   "private": false,
-  "version": "1.1.2",
+  "version": "1.1.3",
   "type": "module",
   "scripts": {
     "dev": "vite",

package/src/PaddleComposition.tsx

@@ -19,7 +19,7 @@ const DefaultPaddler = ({ sport, defaultKayaker, defaultPaddleboarder }: default
       <GatsbyImage
         image={defaultPaddleboarder.image.localFile.childImageSharp.gatsbyImageData}
         alt={defaultPaddleboarder.image.alternativeText || "Paddleboarder"}
-        className="img__wrapped paddler"
+        className=" paddler"
       />
     )
   }
@@ -27,7 +27,7 @@ const DefaultPaddler = ({ sport, defaultKayaker, defaultPaddleboarder }: default
     <GatsbyImage
       image={defaultKayaker.image.localFile.childImageSharp.gatsbyImageData}
       alt={defaultKayaker.image.alternativeText || "Kayaker"}
-      className="img__wrapped paddler"
+      className=" paddler"
     />
   )
 }
@@ -54,20 +54,20 @@ export const PaddleComposition = ({ sport, image, defaultKayaker, defaultPaddleb
       <GatsbyImage
         image={waterTexture.image.localFile.childImageSharp.gatsbyImageData}
         alt={waterTexture.image.alternativeText || "Water Texture"}
-        className="img__wrapped texture-1"
+        className="texture-1"
       />
 
       <GatsbyImage
         image={sandTexture.image.localFile.childImageSharp.gatsbyImageData}
         alt={sandTexture.image.alternativeText || "Sand Texture"}
-        className='img__wrapped texture-2'
+        className="texture-2"
       />
 
       {image ?
         <GatsbyImage
           image={image.localFile.childImageSharp.gatsbyImageData}
           alt={image.alternativeText || "Composition Image"}
-          className="img__wrapped paddler"
+          className=" paddler"
         />
         : <DefaultPaddler
           sport={sport}

package/src/styles/layout.css

@@ -394,6 +394,12 @@ header {
     max-width: 100%;
   }
 
+  /* * img__wrapped */
+  > * {
+    border-radius: 0.25rem;
+    box-shadow: var(--penumbra);
+  }
+
   > img {
     display: block;
   }
@@ -427,13 +433,13 @@ header {
     height: calc(100% - 4px);
   }
 
-  .t1 {
+  .texture-1 {
     grid-column: 1/5;
     grid-row: 1/3;
     aspect-ratio: 16/9;
   }
 
-  .t2 {
+  .texture-2 {
     grid-column: 2/6;
     grid-row: 2/4;
     aspect-ratio: 16/9;