Merge branch 'main' into mobile-theme-preset-carousel

Author: arpan-adhikary26

app/components/CustomizeCTA.test.tsx

@@ -141,6 +141,46 @@ describe('CustomizeCTA', () => {
       expect(decorativeIcon).toBeTruthy();
     });
   });
+  describe('responsive rendering', () => {
+    it('uses responsive flex layout classes', () => {
+      const { container } = render(<CustomizeCTA />);
+
+      const layoutContainer = container.querySelector('.flex.flex-col.md\\:flex-row');
+
+      expect(layoutContainer).toBeTruthy();
+    });
+
+    it('uses responsive text alignment classes', () => {
+      const { container } = render(<CustomizeCTA />);
+
+      const contentContainer = container.querySelector('.text-center.md\\:text-left');
+
+      expect(contentContainer).toBeTruthy();
+    });
+
+    it('uses responsive heading sizing classes', () => {
+      render(<CustomizeCTA />);
+
+      const heading = screen.getByRole('heading', {
+        level: 2,
+        name: 'Want to fine-tune your monolith?',
+      });
+
+      expect(heading.className).toContain('text-2xl');
+      expect(heading.className).toContain('md:text-3xl');
+    });
+
+    it('uses responsive button padding classes', () => {
+      render(<CustomizeCTA />);
+
+      const link = screen.getByRole('link');
+
+      const button = link.querySelector('span');
+
+      expect(button?.className).toContain('px-4');
+      expect(button?.className).toContain('md:px-7');
+    });
+  });
 
   describe('responsive breakpoints', () => {
     it('renders all layout structure elements across viewports', () => {

app/customize/components/ExportPanel.tsx

@@ -171,7 +171,7 @@ export function ExportPanel({
                 ? 'Add a GitHub username to enable image downloads'
                 : format === 'action'
                   ? 'Download is not available in GitHub Action mode'
-                  : 'Download custom monolith layout as an image'
+                  : `Download badge as commitpulse-${username}.svg`
             }
             className={`relative inline-flex items-center gap-2 px-4 py-2 rounded-xl text-xs font-bold transition-all duration-200 ${
               !hasUsername || isDownloading || format === 'action'

app/page.tsx

@@ -13,6 +13,7 @@ import { Footer } from '@/app/components/Footer';
 
 import { FeatureCard, FeatureCardsSection } from '@/components/FeatureCards';
 import { DiscordButton } from '@/components/DiscordButton';
+import { WallOfLove } from '@/components/WallOfLove';
 
 const Icons = {
   Github: () => (
@@ -181,6 +182,11 @@ export default function LandingPage() {
                     </button>
                   ) : null}
                 </div>
+                {mounted && username.length === 0 && (
+                  <p className="text-amber-500 text-xs mt-1 self-start pl-1">
+                    Please enter a GitHub username to copy your badge link.
+                  </p>
+                )}
                 {username.length === 39 && (
                   <p className="text-red-500 text-xs mt-1 self-start pl-1">
                     GitHub username limit reached (39 characters maximum)
@@ -373,6 +379,9 @@ export default function LandingPage() {
             desc="Sophisticated 3D projection formulas turn 2D data into digital architecture."
           />
         </FeatureCardsSection>
+
+        <WallOfLove />
+
         <Footer />
       </main>
     </div>