shadow

neuland · Jun 5, 2024 · a6e02ef · a6e02ef
1 parent 9767c74
commit a6e02ef
Showing 1 changed file with 21 additions and 6 deletions.
diff --git a/src/components/MFExample.astro b/src/components/MFExample.astro
@@ -11,22 +11,37 @@ const { lib3 } = Astro.props;
   <p class="pb-3 font-bold text-xs">{title}</p>
   <div class="custom_shadow">
     <div class="flex h-28 pb-3 space-x-1">
-      <div class="basis-1/3 p-3 border border-slate-300 rounded-lg bg-white drop-shadow-md">
+      <div
+        class="basis-1/3 p-3 border border-slate-300 rounded-lg bg-white drop-shadow-md"
+      >
         <img src={lib1} typeof="foaf:Image" class="m-auto size-6" />
       </div>
-      <div class="basis-1/3 p-3 border border-slate-300 rounded-lg bg-white drop-shadow-md">
+      <div
+        class="basis-1/3 p-3 border border-slate-300 rounded-lg bg-white drop-shadow-md"
+      >
         <img src={lib2} typeof="foaf:Image" class="m-auto size-6" />
       </div>
-      <div class="basis-1/3 p-3 border border-slate-300 rounded-lg bg-white drop-shadow-md">
+      <div
+        class="basis-1/3 p-3 border border-slate-300 rounded-lg bg-white drop-shadow-md"
+      >
         <img src={lib3} typeof="foaf:Image" class="m-auto size-6" />
       </div>
     </div>
-    <div class="p-1 border border-slate-300 rounded-lg text-center bg-white drop-shadow-md">{integration}</div>
+    <div
+      class="p-1 border border-slate-300 rounded-lg text-center bg-white drop-shadow-md"
+    >
+      {integration}
+    </div>
     <!--<p class="p-1 border border-slate-300 rounded-lg text-center bg-white">{rendering}</p>-->
   </div>
 </section>
+
 <style>
   .custom_shadow {
-    filter: drop-shadow(0px 0px 30px rgba(255, 90, 85, 0.4));
+    filter: drop-shadow(-3px -3px 4px rgba(255, 255, 255, 0.6))
+      drop-shadow(0px 4px 30px rgba(255, 90, 85, 0.2))
+      drop-shadow(3px 8px 2px #e5e5e5) drop-shadow(2px 4px 2px #e5e5e5)
+      drop-shadow(2px 2px 2px #e7e7e7);
+    transform: translateZ(0);
   }
-</style>
+</style>