Filter bar fix
This commit is contained in:
+4
-9
@@ -107,9 +107,9 @@ const DeckManager = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="w-full flex flex-col bg-[color:var(--color-background)]">
|
<div className="w-full flex flex-col bg-[color:var(--color-background)]">
|
||||||
<div className="w-full max-w-6xl mx-auto px-4 py-10">
|
<div className="w-full max-w-[1200px] mx-auto px-4 py-10">
|
||||||
{/* Filters */}
|
{/* Filters */}
|
||||||
<div className="flex flex-col md:flex-row gap-4 justify-between items-center mb-10 bg-[color:var(--color-surface)]/80 backdrop-blur-lg rounded-2xl px-6 py-4 shadow-lg">
|
<div className="flex flex-col md:flex-row gap-3 justify-between items-center mb-10 bg-[color:var(--color-surface)]/80 backdrop-blur-lg rounded-2xl px-6 py-4 shadow-lg">
|
||||||
<div className="flex gap-2 items-center w-full md:w-auto">
|
<div className="flex gap-2 items-center w-full md:w-auto">
|
||||||
<SearchBox
|
<SearchBox
|
||||||
value={search}
|
value={search}
|
||||||
@@ -249,7 +249,7 @@ const DeckManager = () => {
|
|||||||
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-8 mt-8">
|
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-8 mt-8">
|
||||||
{/* Create New Deck (Mockup) */}
|
{/* Create New Deck (Mockup) */}
|
||||||
<div
|
<div
|
||||||
onClick={() => navigate('/deck-creator')}
|
onClick={() => navigate("/deck-creator")}
|
||||||
className="flex flex-col items-center justify-center h-48 bg-[color:var(--color-card)] border-2 border-dashed border-[color:var(--color-success)] rounded-2xl cursor-pointer hover:bg-[color:var(--color-success)]/20 transition-all duration-200 shadow-lg"
|
className="flex flex-col items-center justify-center h-48 bg-[color:var(--color-card)] border-2 border-dashed border-[color:var(--color-success)] rounded-2xl cursor-pointer hover:bg-[color:var(--color-success)]/20 transition-all duration-200 shadow-lg"
|
||||||
>
|
>
|
||||||
<FaPlus style={{ color: "var(--color-success)" }} className="text-5xl mb-2" />
|
<FaPlus style={{ color: "var(--color-success)" }} className="text-5xl mb-2" />
|
||||||
@@ -296,12 +296,7 @@ const DeckManager = () => {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Deck Info Popup */}
|
{/* Deck Info Popup */}
|
||||||
{selectedDeck && (
|
{selectedDeck && <DeckInfoPopUp deck={selectedDeck} onClose={() => setSelectedDeck(null)} />}
|
||||||
<DeckInfoPopUp
|
|
||||||
deck={selectedDeck}
|
|
||||||
onClose={() => setSelectedDeck(null)}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
// src/pages/Decks/DeckManagerPage.jsx
|
// src/pages/Decks/DeckManagerPage.jsx
|
||||||
// Deck Management Page (with Navbar, no Footer)
|
// Deck Management Page (with Navbar, no Footer)
|
||||||
|
|
||||||
import DeckManager from "../../components/Landingpage/DeckManager.jsx"
|
import DeckManager from "../../components/DeckCreator/DeckManager.jsx"
|
||||||
import Navbar from "../../components/Navbar/Navbar.jsx"
|
import Navbar from "../../components/Navbar/Navbar.jsx"
|
||||||
|
|
||||||
export default function DeckManagerPage() {
|
export default function DeckManagerPage() {
|
||||||
|
|||||||
Reference in New Issue
Block a user