Add motoki0805

contributors/motoki0805.html

@@ -0,0 +1,64 @@
+<article class="custom-card">
+  <h3>motoki0805</h3>
+  <p>Software engineer skilled in JavaScript, PHP, and modern web frameworks. Passionate about building scalable applications and contributing to open-source projects.</p>
+
+  <h4>Programming languages I use</h4>
+  <section class="container">
+    <div class="badge" style="background-color: #f7df1e; color: black; border: 1px solid #d4c01a;">
+      JavaScript
+    </div>
+    <div class="badge" style="background-color: #777bb4; color: white; box-shadow: 2px 2px 5px rgba(0,0,0,0.2);">
+      PHP
+    </div>
+  </section>
+
+  <h4>Tools & Frameworks I use</h4>
+  <section class="container">
+    <img class="icon" src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/jquery/jquery-original-wordmark.svg" title="jQuery" />
+    <img class="icon" src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/react/react-original-wordmark.svg" title="React" />
+    <img class="icon" src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/nextjs/nextjs-original-wordmark.svg" style="background-color: white; border-radius: 4px;" title="Next.js" />
+    <img class="icon" src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/laravel/laravel-original.svg" title="Laravel" />
+    <img class="icon" src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/git/git-original.svg" title="Git" />
+  </section>
+</article>
+
+<style>
+  body {
+    font-family: sans-serif;
+    margin: 0;
+    padding: 1rem;
+    background-color: #fff;
+  }
+  .custom-card {
+    border: 2px solid #60faa3;
+    border-radius: 1rem;
+    padding: 1rem;
+    transition: transform 0.3s ease, box-shadow 0.3s ease;
+  }
+
+  .custom-card:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 10px 20px rgba(0,0,0,0.15);
+    background-color: #f0fff4;
+  }
+  .container {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 1rem;
+    align-items: center;
+  }
+  .badge {
+    padding: 0.5rem 1rem;
+    border-radius: 0.25rem;
+    font-weight: bold;
+    font-size: 0.9rem;
+  }
+  .icon {
+    width: 2.5rem;
+    height: 2.5rem;
+    transition: transform 0.2s;
+  }
+  .icon:hover {
+    transform: scale(1.2);
+  }
+</style>