mirror of
https://github.com/zen-browser/www.git
synced 2025-07-07 17:05:32 +02:00
fix: update theme colors and improve button styles; update dependencies
This commit is contained in:
mr. M
parent
382263cb85
commit
a68cd34785
14 changed files with 1067 additions and 2978 deletions
|
|
@ -12,18 +12,18 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@astrojs/check": "^0.9.4",
|
||||
"@astrojs/cloudflare": "^12.2.0",
|
||||
"@astrojs/react": "^4.1.4",
|
||||
"@astrojs/cloudflare": "^12.2.1",
|
||||
"@astrojs/react": "^4.2.0",
|
||||
"@astrojs/rss": "^4.0.11",
|
||||
"@astrojs/sitemap": "^3.2.1",
|
||||
"@astrojs/tailwind": "^5.1.4",
|
||||
"@astrojs/tailwind": "^6.0.0",
|
||||
"@fontsource/bricolage-grotesque": "^5.1.0",
|
||||
"@fortawesome/fontawesome-svg-core": "^6.7.1",
|
||||
"@fortawesome/free-brands-svg-icons": "^6.7.1",
|
||||
"@fortawesome/free-solid-svg-icons": "^6.7.1",
|
||||
"@types/react": "^19.0.1",
|
||||
"@types/react-dom": "^19.0.2",
|
||||
"astro": "^5.1.6",
|
||||
"astro": "^5.2.5",
|
||||
"astro-navbar": "^2.3.7",
|
||||
"autoprefixer": "10.4.14",
|
||||
"date-fns": "^4.1.0",
|
||||
|
|
|
|||
3802
pnpm-lock.yaml
generated
3802
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load diff
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 49 KiB After Width: | Height: | Size: 4.5 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 64 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 60 KiB |
|
|
@ -17,14 +17,14 @@ const {
|
|||
{...extra}
|
||||
href={href}
|
||||
class:list={[
|
||||
'transition-bg flex items-center justify-center gap-2 rounded-full px-6 py-2 transition-transform duration-200',
|
||||
'transition-bg flex items-center justify-center gap-2 rounded-xl px-6 py-4 transition-transform duration-150 hover:scale-[1.02]',
|
||||
className,
|
||||
isPrimary
|
||||
? 'border-2 border-dark bg-dark text-paper hover:bg-paper hover:text-dark'
|
||||
? 'border-dark bg-dark text-paper shadow-lg'
|
||||
: isAlert
|
||||
? 'bg-red-300 text-dark'
|
||||
: !isBordered
|
||||
? 'border-2 border-dark hover:bg-dark hover:text-paper'
|
||||
? 'bg-[rgba(0,0,0,.05)]'
|
||||
: '!transition-bg border-2 border-dark hover:bg-dark hover:text-paper hover:shadow-sm',
|
||||
]}
|
||||
>
|
||||
|
|
@ -35,14 +35,14 @@ const {
|
|||
id={id}
|
||||
{...extra}
|
||||
class:list={[
|
||||
'flex items-center justify-center gap-2 rounded-full px-6 py-2 transition-transform duration-200',
|
||||
'transition-bg flex items-center justify-center gap-2 rounded-lg px-6 py-3 transition-transform duration-150 hover:scale-[1.02]',
|
||||
className,
|
||||
isPrimary
|
||||
? 'bg-dark text-paper'
|
||||
? 'border-dark bg-dark text-paper shadow-md'
|
||||
: isAlert
|
||||
? 'bg-red-300 text-dark'
|
||||
: !isBordered
|
||||
? 'border-2 border-dark hover:bg-dark hover:text-paper'
|
||||
? ''
|
||||
: '!transition-bg border-2 border-dark hover:bg-dark hover:text-paper hover:shadow-sm',
|
||||
]}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -53,7 +53,7 @@ import Video from './Video.astro'
|
|||
muted
|
||||
playsinline
|
||||
preload="none"
|
||||
class="rounded-xl border-4 border-white object-cover shadow"
|
||||
class="rounded-3xl object-cover shadow-md"
|
||||
/>
|
||||
</div>
|
||||
<div class="long-feature xl:!flex-row-reverse">
|
||||
|
|
@ -73,7 +73,7 @@ import Video from './Video.astro'
|
|||
muted
|
||||
playsinline
|
||||
preload="none"
|
||||
class="rounded-xl border-4 border-white object-cover shadow"
|
||||
class="rounded-3xl object-cover shadow-md"
|
||||
/>
|
||||
</div>
|
||||
<div class="long-feature">
|
||||
|
|
@ -95,7 +95,7 @@ import Video from './Video.astro'
|
|||
muted
|
||||
playsinline
|
||||
preload="none"
|
||||
class="rounded-xl border-4 border-white object-cover shadow"
|
||||
class="rounded-3xl object-cover shadow-md"
|
||||
/>
|
||||
</div>
|
||||
<div class="long-feature xl:!flex-row-reverse">
|
||||
|
|
@ -116,7 +116,7 @@ import Video from './Video.astro'
|
|||
muted
|
||||
playsinline
|
||||
preload="none"
|
||||
class="rounded-xl border-4 border-white object-cover shadow"
|
||||
class="rounded-3xl object-cover shadow-md"
|
||||
/>
|
||||
</div>
|
||||
<div class="long-feature">
|
||||
|
|
@ -135,7 +135,7 @@ import Video from './Video.astro'
|
|||
muted
|
||||
playsinline
|
||||
preload="none"
|
||||
class="rounded-xl border-4 border-white object-cover shadow"
|
||||
class="rounded-3xl object-cover shadow-md"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -3,8 +3,7 @@ import Title from '../components/Title.astro'
|
|||
import Description from '../components/Description.astro'
|
||||
import Button from '../components/Button.astro'
|
||||
import { Image } from 'astro:assets'
|
||||
import myImage from '../assets/browsers.png'
|
||||
import myImageLight from '../assets/browsers-light.png'
|
||||
import myImage from '../assets/browser.png'
|
||||
import { ArrowRight } from 'lucide-astro'
|
||||
import { motion } from 'motion/react'
|
||||
import { getTitleAnimation } from '../animations'
|
||||
|
|
@ -22,7 +21,7 @@ function getHeroTitleAnimation() {
|
|||
|
||||
<header
|
||||
id="header"
|
||||
class="flex w-full flex-col items-center gap-[20%] py-32 pb-16 text-center md:pb-32 lg:gap-[15%] lg:pb-16"
|
||||
class="flex w-full flex-col items-center gap-[20%] py-32 text-center lg:gap-[25%]"
|
||||
>
|
||||
<div class="flex h-full flex-col items-center justify-center">
|
||||
<Title
|
||||
|
|
@ -68,13 +67,7 @@ function getHeroTitleAnimation() {
|
|||
<Image
|
||||
src={myImage}
|
||||
alt="Zen browser"
|
||||
class="mx-auto mb-24 hidden dark:block"
|
||||
loading="eager"
|
||||
/>
|
||||
<Image
|
||||
src={myImageLight}
|
||||
alt="Zen browser"
|
||||
class="mx-auto mb-24 block dark:hidden"
|
||||
class="mx-4 lg:mx-auto lg:w-3/4 mb-24 shadow-md rounded-3xl dark:opacity-80"
|
||||
loading="eager"
|
||||
/>
|
||||
</motion.span>
|
||||
|
|
|
|||
|
|
@ -21,96 +21,98 @@ import { ThemeSwitch } from 'free-astro-components'
|
|||
>
|
||||
<Astronav>
|
||||
<MenuItems
|
||||
class="relative mx-auto flex w-full gap-2 bg-paper p-2 lg:w-fit lg:gap-20"
|
||||
class="relative mx-auto flex w-full gap-2 bg-paper p-2 lg:w-3/4 lg:min-w-fit"
|
||||
>
|
||||
<a class="mr-3 flex items-center gap-2 text-lg font-bold" href="/">
|
||||
<a class="flex items-center gap-2 text-lg font-bold" href="/">
|
||||
<Logo class="text-dark" />
|
||||
<span class="hidden lg:block">zen browser</span>
|
||||
</a>
|
||||
<div class="flex items-center gap-6 text-xs sm:text-sm lg:text-base">
|
||||
<Dropdown class="group">
|
||||
<button class="flex items-center">
|
||||
<span>Getting Started</span>
|
||||
<ChevronDown
|
||||
class="size-4 transform transition-transform duration-200 group-open:rotate-180 md:ml-2"
|
||||
/>
|
||||
</button>
|
||||
<DropdownItems>
|
||||
<div
|
||||
class="navbar-dropdown left-0 right-1/4 top-16 w-full lg:w-fit"
|
||||
>
|
||||
<a class="dropdown-item bg-dark/5 row-span-2" href="/mods">
|
||||
<div class="dropdown-title">Zen Mods</div>
|
||||
<div class="dropdown-description">
|
||||
Customize your browsing experience with Zen Mods.
|
||||
</div>
|
||||
<Button isPrimary class="mt-auto">
|
||||
Try Zen Mods
|
||||
<ArrowRight class="size-4" />
|
||||
</Button>
|
||||
</a>
|
||||
<a class="dropdown-item" href="/release-notes">
|
||||
<div class="dropdown-title">Release Notes</div>
|
||||
<div class="dropdown-description">
|
||||
Stay up to date with the latest features and improvements.
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item" href="https://discord.gg/zen-browser">
|
||||
<div class="dropdown-title">Discord</div>
|
||||
<div class="dropdown-description">
|
||||
Join our community on Discord to chat with other Zen users!
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</DropdownItems>
|
||||
</Dropdown>
|
||||
<Dropdown class="group">
|
||||
<button class="flex items-center">
|
||||
<span>Useful Links</span>
|
||||
<ChevronDown
|
||||
class="size-4 transform transition-transform duration-200 group-open:rotate-180 md:ml-2"
|
||||
/>
|
||||
</button>
|
||||
<DropdownItems>
|
||||
<div
|
||||
class="navbar-dropdown left-0 top-16 w-full !grid-cols-1 gap-1 lg:left-1/3 lg:right-1/4 lg:w-fit"
|
||||
>
|
||||
<a class="dropdown-item" href="/donate">
|
||||
<div class="dropdown-title">Donate ❤️</div>
|
||||
<div class="dropdown-description">
|
||||
Support the development of Zen Browser with a donation.
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item" href="/about">
|
||||
<div class="dropdown-title">About Us 🌟</div>
|
||||
<div class="dropdown-description">
|
||||
Learn more about the team behind Zen Browser.
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item" href="https://docs.zen-browser.app">
|
||||
<div class="dropdown-title">Documentation</div>
|
||||
<div class="dropdown-description">
|
||||
Learn how to use Zen Browser with our documentation.
|
||||
</div>
|
||||
</a>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="https://github.com/zen-browser"
|
||||
target="_blank"
|
||||
<div class="flex mx-auto">
|
||||
<div class="flex items-center gap-6 text-xs sm:text-sm lg:text-base">
|
||||
<Dropdown class="group">
|
||||
<button class="flex items-center">
|
||||
<span>Getting Started</span>
|
||||
<ChevronDown
|
||||
class="size-4 transform transition-transform duration-200 group-open:rotate-180 md:ml-2"
|
||||
/>
|
||||
</button>
|
||||
<DropdownItems>
|
||||
<div
|
||||
class="navbar-dropdown left-0 right-1/4 top-16 w-full lg:w-fit"
|
||||
>
|
||||
<div class="dropdown-title">GitHub</div>
|
||||
<div class="dropdown-description">
|
||||
Contribute to the development of Zen Browser on GitHub.
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</DropdownItems>
|
||||
</Dropdown>
|
||||
<a class="hidden items-center lg:block" href="/mods">
|
||||
<span>Mods</span>
|
||||
</a>
|
||||
<a class="dropdown-item bg-dark/5 row-span-2" href="/mods">
|
||||
<div class="dropdown-title">Zen Mods</div>
|
||||
<div class="dropdown-description">
|
||||
Customize your browsing experience with Zen Mods.
|
||||
</div>
|
||||
<Button isPrimary class="mt-auto">
|
||||
Try Zen Mods
|
||||
<ArrowRight class="size-4" />
|
||||
</Button>
|
||||
</a>
|
||||
<a class="dropdown-item" href="/release-notes">
|
||||
<div class="dropdown-title">Release Notes</div>
|
||||
<div class="dropdown-description">
|
||||
Stay up to date with the latest features and improvements.
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item" href="https://discord.gg/zen-browser">
|
||||
<div class="dropdown-title">Discord</div>
|
||||
<div class="dropdown-description">
|
||||
Join our community on Discord to chat with other Zen users!
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</DropdownItems>
|
||||
</Dropdown>
|
||||
<Dropdown class="group">
|
||||
<button class="flex items-center">
|
||||
<span>Useful Links</span>
|
||||
<ChevronDown
|
||||
class="size-4 transform transition-transform duration-200 group-open:rotate-180 md:ml-2"
|
||||
/>
|
||||
</button>
|
||||
<DropdownItems>
|
||||
<div
|
||||
class="navbar-dropdown left-0 top-16 w-full !grid-cols-1 gap-1 lg:left-1/3 lg:right-1/4 lg:w-fit"
|
||||
>
|
||||
<a class="dropdown-item" href="/donate">
|
||||
<div class="dropdown-title">Donate ❤️</div>
|
||||
<div class="dropdown-description">
|
||||
Support the development of Zen Browser with a donation.
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item" href="/about">
|
||||
<div class="dropdown-title">About Us 🌟</div>
|
||||
<div class="dropdown-description">
|
||||
Learn more about the team behind Zen Browser.
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item" href="https://docs.zen-browser.app">
|
||||
<div class="dropdown-title">Documentation</div>
|
||||
<div class="dropdown-description">
|
||||
Learn how to use Zen Browser with our documentation.
|
||||
</div>
|
||||
</a>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="https://github.com/zen-browser"
|
||||
target="_blank"
|
||||
>
|
||||
<div class="dropdown-title">GitHub</div>
|
||||
<div class="dropdown-description">
|
||||
Contribute to the development of Zen Browser on GitHub.
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</DropdownItems>
|
||||
</Dropdown>
|
||||
<a class="hidden items-center lg:block" href="/mods">
|
||||
<span>Mods</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ml-auto flex gap-2">
|
||||
<div class="flex gap-2 lg:gap-4 items-center">
|
||||
<div id="theme-switcher" class="ml-auto md:mr-2">
|
||||
<ThemeSwitch label="" class="px-1 py-2" />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -108,12 +108,12 @@ import Footer from '../components/Footer.astro'
|
|||
|
||||
:root {
|
||||
--zen-paper: #f2f0e3;
|
||||
--zen-dark: #202020;
|
||||
--zen-dark: #2e2e2e;
|
||||
--zen-muted: rgba(0, 0, 0, 0.05);
|
||||
|
||||
&[data-theme='dark'] {
|
||||
--zen-paper: #202020;
|
||||
--zen-dark: #f2f0e3;
|
||||
--zen-paper: #1f1f1f;
|
||||
--zen-dark: #d1cfc0;
|
||||
--zen-muted: rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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",
|
||||
|
|
@ -2211,4 +2201,4 @@
|
|||
"workflowId": 13146940435,
|
||||
"date": "05/02/2025"
|
||||
}
|
||||
]
|
||||
]
|
||||
|
|
|
|||
|
|
@ -4,4 +4,4 @@
|
|||
"extra": "",
|
||||
"fixes": [],
|
||||
"features": []
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue