chore: Update marketplace page layout and styles

This commit is contained in:
Mauro Balades
2024-08-18 02:03:34 +02:00
parent 184e8696ef
commit 446fa3b108
4 changed files with 18 additions and 4 deletions

View File

@@ -3,6 +3,7 @@ import React from "react";
import ThemesSearch from "./themes-search";
import { getAllThemes, getThemesFromSearch, ZenTheme } from "@/lib/themes";
import ThemeCard from "./theme-card";
import { Button } from "./ui/button";
export default function MarketplacePage() {
const [searchInput, setSearchInput] = React.useState("");
@@ -15,8 +16,15 @@ export default function MarketplacePage() {
return (
<div className="flex flex-col w-full mx-auto p-5 lg:w-1/2 lg:p-0 items-center justify-center h-full mt-36">
<div className="mx-auto w-full text-center">
<h1 className="text-4xl lg:text-7xl font-bold">Themes Marketplace</h1>
<h1 className="text-4xl lg:text-7xl font-bold">Themes Shop</h1>
<ThemesSearch input={searchInput} setInput={setSearchInput} />
<div className="w-full mt-4 flex items-start">
<Button
onClick={() => window.open("https://docs.zen-browser.app/themes-store/themes-marketplace-submission-guidelines#themes-store-submission-guidelines", "_blank")}
className="text-muted"
>Submit a theme</Button>
</div>
<hr className="w-full border-muted mt-4" />
</div>
<div className="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-8 mt-10 w-full">
{getThemesFromSearch(themes, searchInput).map((theme) => (