@smbcloud / fatapp-web / commits / d0ade27

add msstore link

Seto committed Jan 23, 2026 at 15:16 UTC d0ade27cb2807e1145604ef7491eeb7231d943db
9 files changed +171 -19
src/components/layout/Header.astro
+119 -19
@@ -5,7 +5,8 @@ import { Image } from 'astro:assets'
5 ---
6
7 <header class="mb-7">
8 - <nav class="flex justify-between items-center">
8 + <nav class="flex flex-col gap-4 sm:flex-row sm:justify-between sm:items-center">
9 + <!-- Logo Section -->
10 <div class="relative flex items-center gap-2">
11 {
12 SITE.favicon && (
@@ -18,26 +19,125 @@ import { Image } from 'astro:assets'
19 >{SITE.title}</a
20 >
21 </div>
21 - <div class="flex items-center gap-4">
22 - <div class="flex flex-col gap-2 md:flex-row">
23 - <a href="https://apps.apple.com/se/app/fat-4-5-star-restaurants/id6754181320">
24 - <Image
25 - src="/images/Download_on_the_App_Store_Badge_US-UK_RGB_blk_092917.svg"
26 - alt="FatApp Apple AppStore download badge"
27 - width="150"
28 - height="50"
29 - />
30 - </a>
31 - <a href="https://play.google.com/store/apps/details?id=xyz.smbcloud.FatApp">
32 - <Image
33 - src="/images/GetItOnGooglePlay_Badge_Web_color_English.png"
34 - alt="FatApp Google Play download badge"
35 - width="150"
36 - height="50"
37 - />
22 +
23 + <!-- Download Links & Theme Toggle Section -->
24 + <div class="flex flex-col sm:flex-row items-start sm:items-center gap-3 sm:gap-4">
25 + <!-- Store Badges Container -->
26 + <div class="store-badges-container">
27 + <!-- Mobile: Compact View -->
28 + <div class="flex items-center gap-2 sm:hidden">
29 + <a
30 + href="https://apps.apple.com/se/app/fat-4-5-star-restaurants/id6754181320"
31 + class="store-badge-link"
32 + aria-label="Download on the App Store"
33 + >
34 + <Image
35 + src="/images/Download_on_the_App_Store_Badge_US-UK_RGB_blk_092917.svg"
36 + alt="Download on the App Store"
37 + width="120"
38 + height="40"
39 + class="h-9 w-auto"
40 + />
41 + </a>
42 + <a
43 + href="https://play.google.com/store/apps/details?id=xyz.smbcloud.FatApp"
44 + class="store-badge-link"
45 + aria-label="Get it on Google Play"
46 + >
47 + <Image
48 + src="/images/GetItOnGooglePlay_Badge_Web_color_English.png"
49 + alt="Get it on Google Play"
50 + width="120"
51 + height="40"
52 + class="h-9 w-auto"
53 + />
54 + </a>
55 + </div>
56 +
57 + <!-- Tablet & Desktop: Full View -->
58 + <div class="hidden sm:flex items-center gap-2 lg:gap-3">
59 + <a
60 + href="https://apps.apple.com/se/app/fat-4-5-star-restaurants/id6754181320"
61 + class="store-badge-link transition-transform hover:scale-105 active:scale-95"
62 + aria-label="Download on the App Store"
63 + >
64 + <Image
65 + src="/images/Download_on_the_App_Store_Badge_US-UK_RGB_blk_092917.svg"
66 + alt="Download on the App Store"
67 + width="135"
68 + height="45"
69 + class="h-10 w-auto md:h-11"
70 + />
71 + </a>
72 + <a
73 + href="https://play.google.com/store/apps/details?id=xyz.smbcloud.FatApp"
74 + class="store-badge-link transition-transform hover:scale-105 active:scale-95"
75 + aria-label="Get it on Google Play"
76 + >
77 + <Image
78 + src="/images/GetItOnGooglePlay_Badge_Web_color_English.png"
79 + alt="Get it on Google Play"
80 + width="135"
81 + height="45"
82 + class="h-10 w-auto md:h-11"
83 + />
84 + </a>
85 + <a
86 + href="https://apps.microsoft.com/detail/xp9d0tqvt066f6?referrer=appbadge&mode=direct"
87 + class="store-badge-link transition-transform hover:scale-105 active:scale-95"
88 + aria-label="Get it from Microsoft"
89 + >
90 + <Image
91 + src="https://get.microsoft.com/images/en-us%20dark.svg"
92 + alt="Get it from Microsoft"
93 + width="135"
94 + height="45"
95 + class="h-10 w-auto md:h-11"
96 + />
97 + </a>
98 + </div>
99 +
100 + <!-- Mobile: Microsoft Store Link (text only to save space) -->
101 + <a
102 + href="https://apps.microsoft.com/detail/xp9d0tqvt066f6?referrer=appbadge&mode=direct"
103 + class="text-xs text-gray-600 dark:text-gray-400 hover:text-food-orange dark:hover:text-food-orange transition-colors sm:hidden mt-1"
104 + aria-label="Also available on Microsoft Store"
105 + >
106 + Also on Microsoft Store →
107 </a>
108 </div>
40 - <ThemeToggle />
109 +
110 + <!-- Theme Toggle -->
111 + <div class="self-end sm:self-auto">
112 + <ThemeToggle />
113 + </div>
114 </div>
115 </nav>
116 </header>
117 +
118 +<style>
119 + .store-badge-link {
120 + display: inline-flex;
121 + align-items: center;
122 + border-radius: 0.375rem;
123 + overflow: hidden;
124 + }
125 +
126 + .store-badge-link:focus-visible {
127 + outline: 2px solid var(--color-food-orange, #ff6b35);
128 + outline-offset: 2px;
129 + }
130 +
131 + .store-badges-container {
132 + display: flex;
133 + flex-direction: column;
134 + gap: 0.25rem;
135 + }
136 +
137 + @media (min-width: 640px) {
138 + .store-badges-container {
139 + flex-direction: row;
140 + gap: 0;
141 + }
142 + }
143 +</style>
src/content/posts/_assets/copy-code.png
Binary files a/src/content/posts/_assets/copy-code.png and /dev/null differ
src/content/posts/_assets/date-on-left.png
Binary files a/src/content/posts/_assets/date-on-left.png and /dev/null differ
src/content/posts/_assets/hikari.jpg
Binary files a/src/content/posts/_assets/hikari.jpg and /dev/null differ
src/content/posts/_assets/reading-time.png
Binary files a/src/content/posts/_assets/reading-time.png and /dev/null differ
src/content/posts/_assets/theme-toggle.png
Binary files a/src/content/posts/_assets/theme-toggle.png and /dev/null differ
src/content/posts/_assets/toc.png
Binary files a/src/content/posts/_assets/toc.png and /dev/null differ
src/content/posts/_assets/tr-808.png
Binary files a/src/content/posts/_assets/tr-808.png and /dev/null differ
src/content/posts/microsoft-store-launch.md new
+52
@@ -0,0 +1,52 @@
1 +---
2 +title: Fat Now Available on Microsoft Store
3 +pubDate: 2026-01-08
4 +---
5 +
6 +# Fat Now Available on Microsoft Store! 🎉
7 +
8 +We're excited to announce that the **Fat app** is now available on the Microsoft Store, bringing our premium restaurant discovery experience to Windows devices and Xbox!
9 +
10 +## Download Now
11 +
12 +Get the Fat app on your Microsoft devices:
13 +
14 +**[Get it from Microsoft](https://apps.microsoft.com/detail/xp9d0tqvt066f6?referrer=appbadge&mode=direct)**
15 +
16 +## What is Fat?
17 +
18 +Fat helps you discover the best restaurants in your area - exclusively featuring establishments with **4.5+ star ratings**. No more scrolling through mediocre options. With Fat, every restaurant recommendation is guaranteed to be exceptional.
19 +
20 +## Features
21 +
22 +- 🌟 **Only 4.5+ Star Restaurants** - Quality guaranteed
23 +- 📍 **Location-Based Search** - Find great restaurants near you
24 +- 🗺️ **Interactive Maps** - See restaurants on a map view
25 +- 💻 **Native Windows Experience** - Optimized for Windows 10 and 11
26 +- 🔍 **Smart Filters** - Find exactly what you're looking for
27 +- 🎮 **Xbox Support** - Discover restaurants from your console
28 +- ⌨️ **Keyboard & Mouse** - Full desktop support for easy navigation
29 +
30 +## Perfect for Windows Users
31 +
32 +Whether you're planning your next meal from your desktop, laptop, or Surface device, Fat on Windows offers a seamless experience with:
33 +
34 +- **Large screen optimization** - Make the most of your display
35 +- **Desktop notifications** - Stay updated on new restaurant discoveries
36 +- **Keyboard shortcuts** - Navigate quickly and efficiently
37 +- **Multi-window support** - Browse while you work
38 +
39 +## Available Everywhere
40 +
41 +Fat is now available on all major platforms:
42 +- **iOS** - [Download on the App Store](https://apps.apple.com/se/app/fat-4-5-star-restaurants/id6754181320)
43 +- **Android Mobile & TV** - [Download on Google Play](https://play.google.com/store/apps/details?id=xyz.smbcloud.FatApp)
44 +- **Windows & Xbox** - [Get it from Microsoft](https://apps.microsoft.com/detail/xp9d0tqvt066f6?referrer=appbadge&mode=direct)
45 +
46 +## Get Started
47 +
48 +Download Fat today from the Microsoft Store and start discovering the best restaurants in your city. Whether you're on your Windows PC, Surface, or Xbox, we can't wait to help you find your next amazing dining experience!
49 +
50 +---
51 +
52 +Have feedback or suggestions? We'd love to hear from you! [Contact us](/contact) or follow us on social media.