From 61baffd295a604baa8560cc0175b3bfcf0e24dfe Mon Sep 17 00:00:00 2001
From: Radiquum <kentai.waah@gmail.com>
Date: Mon, 25 Aug 2025 07:30:10 +0500
Subject: [PATCH] anix/: add buttons to discovery page

---
 app/components/Discovery/InterestingCarousel.tsx |  4 ++--
 app/pages/Discover.tsx                           | 15 +++++++++++++++
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/app/components/Discovery/InterestingCarousel.tsx b/app/components/Discovery/InterestingCarousel.tsx
index 7740c8f..d6c4c41 100644
--- a/app/components/Discovery/InterestingCarousel.tsx
+++ b/app/components/Discovery/InterestingCarousel.tsx
@@ -37,7 +37,7 @@ export const InterestingCarousel = () => {
       <Swiper
         modules={[Navigation]}
         spaceBetween={8}
-        slidesPerView={3}
+        slidesPerView={"auto"}
         direction={"horizontal"}
         rewind={true}
         navigation={{
@@ -60,7 +60,7 @@ export const InterestingCarousel = () => {
               style={{ maxWidth: "fit-content" }}
             >
               <Link href={`/release/${item.action}`}>
-                <div className="relative w-[480px] h-[270px] rounded-lg overflow-hidden">
+                <div className="relative w-[300px] md:w-[480px] aspect-video rounded-lg overflow-hidden">
                   <Image
                     src={item.image}
                     alt=""
diff --git a/app/pages/Discover.tsx b/app/pages/Discover.tsx
index 068f412..7f6faf1 100644
--- a/app/pages/Discover.tsx
+++ b/app/pages/Discover.tsx
@@ -1,10 +1,25 @@
 "use client";
 import { InterestingCarousel } from "#/components/Discovery/InterestingCarousel";
+import { Button } from "flowbite-react";
 
 export const DiscoverPage = () => {
   return (
     <>
       <InterestingCarousel />
+      <div className="grid grid-cols-2 gap-4 my-4 lg:grid-cols-4">
+        <Button size="xl" color="yellow">
+          <span className="flex-shrink-0 inline-block w-8 h-8 mr-2 iconify mdi--fire"></span><span>Популярное</span>
+        </Button>
+        <Button size="xl" color="blue">
+          <span className="flex-shrink-0 inline-block w-8 h-8 mr-2 iconify mdi--calendar-month"></span><span>Расписание</span>
+        </Button>
+        <Button size="xl" color="purple">
+          <span className="flex-shrink-0 inline-block w-8 h-8 mr-2 iconify mdi--collections-bookmark"></span><span>Коллекции</span>
+        </Button>
+        <Button size="xl" color="green">
+          <span className="flex-shrink-0 inline-block w-8 h-8 mr-2 iconify mdi--mixer-settings"></span><span>Фильтр</span>
+        </Button>
+      </div>
     </>
   );
 };