mirror of
https://github.com/zen-browser/www.git
synced 2025-07-08 09:20:00 +02:00
chore(app): sort tailwind classes consistently across all files
The changes are focused on reordering Tailwind CSS classes consistently across multiple component files, improving code readability and maintainability.
This commit is contained in:
Shintaro Jokagi
parent
550b9e7f3c
commit
225bd6faa7
16 changed files with 137 additions and 157 deletions
|
|
@ -11,7 +11,8 @@
|
|||
"wellKnown": "https://cheff.dev/.well-known/funding-manifest-urls"
|
||||
}
|
||||
},
|
||||
"projects": [{
|
||||
"projects": [
|
||||
{
|
||||
"guid": "zen-browser",
|
||||
"name": "Zen",
|
||||
"description": "Zen is a beautiful, fast, and productive web browser. It is designed to be packed with features that make it easy to use and navigate. Zen is built on the latest Firefox engine, providing speed, privacy, and security.",
|
||||
|
|
@ -24,7 +25,8 @@
|
|||
},
|
||||
"licenses": ["MPL-2.0"],
|
||||
"tags": ["browser", "web", "desktop", "open-source"]
|
||||
}],
|
||||
}
|
||||
],
|
||||
"funding": {
|
||||
"channels": [
|
||||
{
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ const {
|
|||
|
||||
<section
|
||||
id="Community"
|
||||
class="relative flex w-full flex-col items-center text-start md:text-center lg:py-36 gap-6 py-12"
|
||||
class="relative flex w-full flex-col items-center gap-6 py-12 text-start md:text-center lg:py-36"
|
||||
>
|
||||
<Description class="mb-2 text-6xl font-bold">
|
||||
<motion.span client:load {...getTitleAnimation(0.2)}>
|
||||
|
|
@ -39,9 +39,7 @@ const {
|
|||
>
|
||||
{community.description}
|
||||
</motion.p>
|
||||
<div
|
||||
class="flex w-full flex-wrap gap-3 sm:gap-10 md:justify-center"
|
||||
>
|
||||
<div class="flex w-full flex-wrap gap-3 sm:gap-10 md:justify-center">
|
||||
<motion.span client:load {...getTitleAnimation(0.8)}>
|
||||
<Button class:list={['px-4']} href="https://github.com/zen-browser">
|
||||
<Github class="size-4" />
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ const descriptions = Object.values(features.featureTabs).map(
|
|||
|
||||
<section
|
||||
id="Features"
|
||||
class="relative flex w-full flex-col text-start lg:py-36 py-12"
|
||||
class="relative flex w-full flex-col py-12 text-start lg:py-36"
|
||||
>
|
||||
<Description class="mb-2 text-6xl font-bold">
|
||||
<motion.span client:load {...getTitleAnimation(0.2)}>
|
||||
|
|
@ -48,9 +48,7 @@ const descriptions = Object.values(features.featureTabs).map(
|
|||
<motion.p client:load {...getTitleAnimation(0.6)} className="lg:w-1/2">
|
||||
{features.description}
|
||||
</motion.p>
|
||||
<div
|
||||
class="mt-6 flex flex-col gap-6 lg:flex-row lg:justify-between lg:gap-2"
|
||||
>
|
||||
<div class="mt-6 flex flex-col gap-6 lg:flex-row lg:justify-between lg:gap-2">
|
||||
<div class="flex w-full flex-col lg:w-1/3">
|
||||
<!-- Mobile tabs -->
|
||||
<div class="flex gap-2 overflow-x-auto overflow-y-clip lg:hidden">
|
||||
|
|
|
|||
|
|
@ -15,11 +15,13 @@ const {
|
|||
|
||||
<footer
|
||||
id="footer"
|
||||
class="relative flex w-full flex-col gap-16 overflow-hidden border-t border-dark bg-dark px-4 py-12 text-paper lg:p-24 items-center"
|
||||
class="relative flex w-full flex-col items-center gap-16 overflow-hidden border-t border-dark bg-dark px-4 py-12 text-paper lg:p-24"
|
||||
role="contentinfo"
|
||||
aria-label="Site footer"
|
||||
>
|
||||
<div class="flex w-full flex-col items-start justify-between gap-12 container">
|
||||
<div
|
||||
class="container flex w-full flex-col items-start justify-between gap-12"
|
||||
>
|
||||
<section
|
||||
class="w-full text-center lg:w-1/2 lg:text-left"
|
||||
aria-labelledby="footer-title"
|
||||
|
|
|
|||
|
|
@ -200,13 +200,13 @@ export default function ModsList({ allMods, locale }: ModsListProps) {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 w-full place-items-start gap-12 md:grid-cols-2 xl:grid-cols-3 py-6">
|
||||
<div className="grid w-full grid-cols-1 place-items-start gap-12 py-6 md:grid-cols-2 xl:grid-cols-3">
|
||||
{paginatedMods.length > 0 ? (
|
||||
paginatedMods.map((mod) => (
|
||||
<a
|
||||
key={mod.id}
|
||||
href={`/mods/${mod.id}`}
|
||||
className="flex flex-col w-full gap-4 border-transparent transition-colors duration-100 hover:opacity-90"
|
||||
className="flex w-full flex-col gap-4 border-transparent transition-colors duration-100 hover:opacity-90"
|
||||
>
|
||||
<div className="relative mb-0 block aspect-[1.85/1] h-48 overflow-hidden rounded-md border-2 border-dark object-cover shadow-md">
|
||||
<img
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ const {
|
|||
<!-- Desktop Navigation -->
|
||||
<Astronav>
|
||||
<MenuItems
|
||||
class="relative z-20 grid w-full grid-cols-2 items-center gap-2 bg-paper py-3 lg:grid lg:grid-cols-[auto_1fr_auto] lg:py-6 container"
|
||||
class="container relative z-20 grid w-full grid-cols-2 items-center gap-2 bg-paper py-3 lg:grid lg:grid-cols-[auto_1fr_auto] lg:py-6"
|
||||
>
|
||||
<a
|
||||
class="flex items-center gap-2 text-lg font-bold"
|
||||
|
|
|
|||
|
|
@ -21,9 +21,7 @@ const {
|
|||
<section id="sponsors" class:list={['py-12', !showSponsors && 'hidden']}>
|
||||
<div class="mx-auto flex flex-col text-center">
|
||||
<motion.span client:load {...getTitleAnimation(0.2)}>
|
||||
<Description class="mb-2 text-6xl font-bold"
|
||||
>Our Sponsors</Description
|
||||
>
|
||||
<Description class="mb-2 text-6xl font-bold">Our Sponsors</Description>
|
||||
</motion.span>
|
||||
<motion.span client:load {...getTitleAnimation(0.4)}>
|
||||
<Description set:html={sponsors.description} />
|
||||
|
|
|
|||
|
|
@ -15,10 +15,10 @@ const {
|
|||
|
||||
<Layout title={notFound.title}>
|
||||
<main
|
||||
class="flex min-h-[70vh] container flex-col items-center justify-center gap-6 py-24 text-center"
|
||||
class="container flex min-h-[70vh] flex-col items-center justify-center gap-6 py-24 text-center"
|
||||
>
|
||||
<Title class="text-7xl font-bold text-coral md:text-9xl">404</Title>
|
||||
<div class="flex flex-col gap-4 items-center">
|
||||
<div class="flex flex-col items-center gap-4">
|
||||
<Description class="text-xl md:text-2xl">
|
||||
{notFound.title}
|
||||
</Description>
|
||||
|
|
|
|||
|
|
@ -14,18 +14,18 @@ const {
|
|||
---
|
||||
|
||||
<Layout title={layout.donate.title} description={layout.donate.description}>
|
||||
<main class="pb-52 pt-36 container">
|
||||
<div
|
||||
class="flex flex-col items-center justify-center gap-12"
|
||||
>
|
||||
<div class="lg:text-center flex flex-col gap-4">
|
||||
<main class="container pb-52 pt-36">
|
||||
<div class="flex flex-col items-center justify-center gap-12">
|
||||
<div class="flex flex-col gap-4 lg:text-center">
|
||||
<Description class="text-6xl font-bold">{donate.title}</Description>
|
||||
<Description class="max-w-3xl">
|
||||
{donate.description}
|
||||
</Description>
|
||||
</div>
|
||||
<div class="grid grid-cols-1 lg:grid-cols-[1fr_1px_1fr] gap-12 text-center max-w-5xl">
|
||||
<div class="flex flex-col gap-4 items-center">
|
||||
<div
|
||||
class="grid max-w-5xl grid-cols-1 gap-12 text-center lg:grid-cols-[1fr_1px_1fr]"
|
||||
>
|
||||
<div class="flex flex-col items-center gap-4">
|
||||
<div class="text-6xl font-bold">{donate.patreon.title}</div>
|
||||
<Description>
|
||||
{donate.patreon.description}
|
||||
|
|
@ -40,16 +40,12 @@ const {
|
|||
</Button>
|
||||
</div>
|
||||
<hr class="hidden h-72 w-[1px] bg-dark opacity-15 lg:block" />
|
||||
<div class="flex flex-col gap-4 items-center">
|
||||
<div class="flex flex-col items-center gap-4">
|
||||
<div class="text-6xl font-bold">{donate.koFi.title}</div>
|
||||
<Description>
|
||||
{donate.koFi.description}
|
||||
</Description>
|
||||
<Button
|
||||
href="https://ko-fi.com/zen_browser"
|
||||
isPrimary
|
||||
class="w-fit"
|
||||
>
|
||||
<Button href="https://ko-fi.com/zen_browser" isPrimary class="w-fit">
|
||||
{donate.koFi.button}
|
||||
<ArrowRight class="size-4" />
|
||||
</Button>
|
||||
|
|
|
|||
|
|
@ -18,8 +18,8 @@ const allMods = (await getAllMods()) || []
|
|||
---
|
||||
|
||||
<Layout title={layout.mods.title}>
|
||||
<main class="mt-32 container 2xl:mt-32 flex flex-col gap-10">
|
||||
<header class="flex w-full flex-col border-dark gap-8">
|
||||
<main class="container mt-32 flex flex-col gap-10 2xl:mt-32">
|
||||
<header class="flex w-full flex-col gap-8 border-dark">
|
||||
<Description class="text-6xl font-bold">{mods.title}</Description>
|
||||
<Description class="max-w-3xl">
|
||||
{mods.description}
|
||||
|
|
|
|||
|
|
@ -22,11 +22,11 @@ const {
|
|||
|
||||
<Layout title={layout.releaseNotes.title}>
|
||||
<main
|
||||
class="flex h-full min-h-[1000px] flex-1 flex-col items-center justify-center py-4 container"
|
||||
class="container flex h-full min-h-[1000px] flex-1 flex-col items-center justify-center py-4"
|
||||
>
|
||||
<div
|
||||
id="release-notes"
|
||||
class="py-42 flex min-h-screen flex-col justify-center w-full"
|
||||
class="py-42 flex min-h-screen w-full flex-col justify-center"
|
||||
>
|
||||
<Description class="mt-48 text-4xl font-bold">Release Notes</Description>
|
||||
<p
|
||||
|
|
|
|||
|
|
@ -13,9 +13,7 @@ const {
|
|||
---
|
||||
|
||||
<Layout title={layout.welcome.title} description={layout.welcome.description}>
|
||||
<main
|
||||
class="container"
|
||||
>
|
||||
<main class="container">
|
||||
<Features
|
||||
title1={welcome.title[0]}
|
||||
title2={welcome.title[1]}
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@ if (
|
|||
)}
|
||||
>
|
||||
<main
|
||||
class="container flex xl:min-h-[calc(100vh-12rem)] xl:mt-22 flex-col gap-12 py-12 xl:grid xl:grid-cols-[2fr_3fr]"
|
||||
class="xl:mt-22 container flex flex-col gap-12 py-12 xl:grid xl:min-h-[calc(100vh-12rem)] xl:grid-cols-[2fr_3fr]"
|
||||
>
|
||||
<div class="flex flex-col gap-8">
|
||||
<div>
|
||||
|
|
@ -54,7 +54,7 @@ if (
|
|||
<div>
|
||||
<Fragment set:html={whatsNewText[0].replace(/\n/g, '<br>')} />
|
||||
</div>
|
||||
<ul class="hidden list-disc flex-col gap-2 xl:flex xl:container">
|
||||
<ul class="hidden list-disc flex-col gap-2 xl:container xl:flex">
|
||||
<a
|
||||
href="https://github.com/zen-browser/desktop/issues/new/choose"
|
||||
target="_blank"
|
||||
|
|
|
|||
|
|
@ -363,9 +363,7 @@
|
|||
"version": "1.0.0-a.13",
|
||||
"date": "05/08/2024",
|
||||
"extra": "This is a smaller release to fix some bugs and improve some small details.\n\nIm going to try doing more frequent releases from now on, see how it goes.",
|
||||
"features": [
|
||||
"Allow to remember sidebar width even after collapsing it."
|
||||
],
|
||||
"features": ["Allow to remember sidebar width even after collapsing it."],
|
||||
"fixes": [
|
||||
{
|
||||
"description": "Task Manager Icon Missing in Flatpak Version",
|
||||
|
|
@ -921,9 +919,7 @@
|
|||
"image": true,
|
||||
"workflowId": 11000317603,
|
||||
"extra": "This update addresses some significant issues with the previous release.\n\nWe appreciate your patience and support!",
|
||||
"features": [
|
||||
"Added a new system for handling keyboard shortcuts"
|
||||
],
|
||||
"features": ["Added a new system for handling keyboard shortcuts"],
|
||||
"fixes": [
|
||||
{
|
||||
"description": "The New Tab button is not visible",
|
||||
|
|
@ -980,9 +976,7 @@
|
|||
"Enabled container tabs by default",
|
||||
"Improved Expand Tabs on Hover layout"
|
||||
],
|
||||
"themeChanges": [
|
||||
"Toggle inputs will not use the themed tertiary color"
|
||||
],
|
||||
"themeChanges": ["Toggle inputs will not use the themed tertiary color"],
|
||||
"breakingChanges": [
|
||||
"The keyboard shortcuts will be overriden by the defaults ones in this update"
|
||||
],
|
||||
|
|
@ -1279,9 +1273,7 @@
|
|||
"issue": 2156
|
||||
}
|
||||
],
|
||||
"breakingChanges": [
|
||||
"Removed Show Expand Button option from settings"
|
||||
],
|
||||
"breakingChanges": ["Removed Show Expand Button option from settings"],
|
||||
"themeChanges": [
|
||||
"The variable '--zen-main-browser-background' will now contain the generated gradient",
|
||||
"Added the 'unread' attribute for background tabs that haven't been accessed yet"
|
||||
|
|
@ -1384,9 +1376,7 @@
|
|||
"description": "Fixed wrong aligment on glance action buttons"
|
||||
}
|
||||
],
|
||||
"features": [
|
||||
"No new features, sorry"
|
||||
]
|
||||
"features": ["No new features, sorry"]
|
||||
},
|
||||
{
|
||||
"version": "1.0.1-a.17",
|
||||
|
|
@ -2456,9 +2446,7 @@
|
|||
"version": "1.10.3b",
|
||||
"image": false,
|
||||
"extra": "Terribly sorry for the frequent updates, this emergency release simply updates Firefox, fixing a critical vulnerability in chromium's sandboxing system. You can read more here:\n\n<a href='https://cyberinsider.com/firefox-says-its-vulnerable-to-chromes-zero-day-used-in-espionage-attacks/'>https://cyberinsider.com/firefox-says-its-vulnerable-to-chromes-zero-day-used-in-espionage-attacks/</a>",
|
||||
"features": [
|
||||
"Updated Firefox to 136.0.4"
|
||||
],
|
||||
"features": ["Updated Firefox to 136.0.4"],
|
||||
"workflowId": 14109635630,
|
||||
"date": "27/03/2025"
|
||||
},
|
||||
|
|
|
|||
|
|
@ -5,10 +5,10 @@ export default {
|
|||
theme: {
|
||||
container: {
|
||||
screens: {
|
||||
sm: "100%",
|
||||
md: "100%",
|
||||
lg: "1024px",
|
||||
xl: "1280px",
|
||||
sm: '100%',
|
||||
md: '100%',
|
||||
lg: '1024px',
|
||||
xl: '1280px',
|
||||
},
|
||||
padding: {
|
||||
DEFAULT: '1rem',
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue