Merge pull request #28 from MeMMa137/frontend

Add missing shop imgs

Author: MeMMa137

app/assets/stylesheets/application.css

@@ -467,7 +467,7 @@ h1, h2, h3, h4, h5, h6 {
    position: absolute;
    bottom: 0;
    left: 0;
-   width: clamp(800px, 20vw, 280px);
+   width: clamp(150px, 20vw, 280px);
    z-index: 2;
 }
 

app/views/layouts/application.html.erb

@@ -20,5 +20,9 @@
     <% end %>
 
     <%= yield %>
+    <% unless content_for?(:page) && yield(:page) == 'signin' %>
+      <img src="/images/img_2180.png" alt="bottom-left decoration" class="corner-img corner-img--left">
+      <img src="/images/untitled_artwork.png" alt="bottom-right decoration" class="corner-img corner-img--right">
+    <% end %>
   </body>
 </html>

app/views/pages/shop.html.erb

@@ -61,11 +61,25 @@
               'https://files.slack.com/files-pri/T09V59WQY1E-F0A6W5FN41Y/vecteezy_3d-monitor-for-office_53739745.png?pub_secret=6a16537f48',
               'https://files.slack.com/files-pri/T09V59WQY1E-F0A6EN1NVP1/vecteezy_sleek-black-computer-monitor-with-vibrant-red-abstract_56609224.png?pub_secret=5e30e2cd74'
             ] if cat == 'Monitor' %>
+            <% images_for_headphones = [
+              'https://files.slack.com/files-pri/T09V59WQY1E-F0A75HW036Y/vecteezy_sleek-white-wireless-headphones-premium-audio-bluetooth_55130517.png?pub_secret=51ed82f735',
+              'https://files.slack.com/files-pri/T09V59WQY1E-F0A6VJMSHLK/vecteezy_modern-silver-headphones-for-audiophiles_51767617.png?pub_secret=c9009d25e9',
+              'https://files.slack.com/files-pri/T09V59WQY1E-F0A6VJMAZRR/vecteezy_headphone-png-with-ai-generated_26773824.png?pub_secret=7edb592517',
+              'https://files.slack.com/files-pri/T09V59WQY1E-F0A6ZUNQC8N/vecteezy_3d-gaming-headphone_53295526.png?pub_secret=72d6d1c41a'
+            ] if cat == 'Headphones' %>
+            <% images_for_webcam = [
+              'https://files.slack.com/files-pri/T09V59WQY1E-F0A7W9U4HU0/vecteezy_ai-generated-security-camera-on-transparent-background-ai_39213084.png?pub_secret=0ec47b5d57',
+              'https://files.slack.com/files-pri/T09V59WQY1E-F0A75J7CTDJ/vecteezy_high-definition-webcam-modern-design-sleek-silver-black_67821519.png?pub_secret=22c6d549e5',
+              'https://files.slack.com/files-pri/T09V59WQY1E-F0A6VK098QK/vecteezy_sleek-modern-webcam-for-conferencing-and-streaming_60580277.png?pub_secret=02494c1a84',
+              'https://files.slack.com/files-pri/T09V59WQY1E-F0A6ZV27UQN/vecteezy_camera-with-lens_54402726.png?pub_secret=6527a83f20'
+            ] if cat == 'Webcam' %>
             <% variants.each_with_index do |(label_text, key), variant_idx| %>
               <% img_src = (
                 (cat == 'Keyboard' && images_for_keyboard && images_for_keyboard[variant_idx]) ||
                 (cat == 'Mouse' && images_for_mouse && images_for_mouse[variant_idx]) ||
                 (cat == 'Monitor' && images_for_monitor && images_for_monitor[variant_idx]) ||
+                (cat == 'Headphones' && images_for_headphones && images_for_headphones[variant_idx]) ||
+                (cat == 'Webcam' && images_for_webcam && images_for_webcam[variant_idx]) ||
                 '/images/signin/hackclub.svg'
               ) %>
               <% amount_map = { 'standard' => 50, 'quality' => 110, 'advanced' => 170, 'professional' => 230 } %>

public/images/img_2168.png

@@ -671,7 +671,7 @@ a.project-row:hover {
 .shop-variant__thumb img {
   width: 100%;
   height: 100%;
-  object-fit: cover;
+  object-fit: contain;
 }
 .shop-variant__meta {
   display: flex;
@@ -1012,6 +1012,25 @@ a.project-row:hover {
   }
 }
 
+/* Global corner images */
+.corner-img {
+  position: fixed;
+  bottom: 0;
+  z-index: 5;
+  pointer-events: none;
+  user-select: none;
+}
+.corner-img--left {
+  left: 0;
+  width: clamp(120px, 14vw, 220px);
+  height: auto;
+}
+.corner-img--right {
+  right: 0;
+  width: clamp(120px, 16vw, 260px);
+  height: auto;
+}
+
 /* Respect reduced motion */
 @media (prefers-reduced-motion: reduce) {
   * {