frontend-shopify/react-editor-shopify
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update default styles and components

Browse Source
This commit is contained in:
Rami Bitar
2026-05-10 15:49:28 -04:00
parent 383a593c42
commit 0a1fbd62bb
13 changed files with 144 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
components/commerce/shop-header.tsx
View File

@@ -11,11 +11,11 @@ const CartIcon: React.FC = () => {
return (
<button
onClick={toggleCart}
className="relative p-1 text-black hover:text-gray-600 transition-colors"
className="relative p-1 text-foreground hover:text-muted-foreground transition-colors"
>
<i className="ri-shopping-cart-line text-xl"></i>
{itemCount > 0 && (
<span className="absolute -top-1 -right-1 bg-black text-white text-[10px] rounded-full w-4 h-4 flex items-center justify-center font-semibold">
<span className="absolute -top-1 -right-1 bg-primary text-primary-foreground text-[10px] rounded-full w-4 h-4 flex items-center justify-center font-semibold">
{itemCount > 99 ? '99+' : itemCount}
</span>
)}
@@ -25,11 +25,11 @@ const CartIcon: React.FC = () => {
const Header: React.FC = () => {
return (
<nav className="bg-white shadow-sm sticky top-0 z-30 h-14">
<nav className="bg-background shadow-sm sticky top-0 z-30 h-14">
<div className="container mx-auto px-4 h-full">
<div className="flex justify-between items-center h-full">
{/* Logo */}
<Link to="/" className="text-lg font-bold text-black font-heading">
<Link to="/" className="text-lg font-bold text-foreground font-heading">
{config.brand.logo.url ? (
<img
src={config.brand.logo.url}
@@ -45,13 +45,13 @@ const Header: React.FC = () => {
<div className="flex items-center space-x-6">
<Link
to="/"
className="text-sm text-black hover:text-gray-600 font-medium transition-colors"
className="text-sm text-foreground hover:text-muted-foreground font-medium transition-colors"
>
Products
</Link>
<Link
to="/collections"
className="text-sm text-black hover:text-gray-600 font-medium transition-colors"
className="text-sm text-foreground hover:text-muted-foreground font-medium transition-colors"
>
Collections
</Link>