crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-07-23 04:36:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

Normalizing Style Sheets

Browse Source
This commit is contained in:
Belen Curcio
2020-10-15 16:00:11 -03:00
parent a0e5448210
commit ab45e28813
18 changed files with 77 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
components/cart/CartItem/CartItem.module.css
View File

@@ -1,6 +1,6 @@
.quantity {
appearance: textfield;
@apply w-8 border-gray-300 border mx-3 rounded text-center text-sm text-black;
@apply w-8 border-accents-2 border mx-3 rounded text-center text-sm text-black;
}
.quantity::-webkit-outer-spin-button,

4
components/cart/CartItem/CartItem.tsx
View File

@@ -60,7 +60,7 @@ const CartItem = ({
<div className="w-12 h-12 bg-violet relative overflow-hidden">
<img className={s.productImage} src={item.image_url} />
</div>
<div className="flex-1 flex flex-col justify-between text-primary">
<div className="flex-1 flex flex-col justify-between text-base">
<span className="font-bold mb-3">{item.name}</span>
<div className="flex items-center">
<button type="button" onClick={() => increaseQuantity(-1)}>
@@ -80,7 +80,7 @@ const CartItem = ({
</button>
</div>
</div>
<div className="flex flex-col justify-between space-y-2 text-primary">
<div className="flex flex-col justify-between space-y-2 text-base">
<span>{price}</span>
<button
className="flex justify-end"

2
components/cart/CartSidebarView/CartSidebarView.tsx
View File

@@ -92,7 +92,7 @@ const CartSidebarView: FC = () => {
) : (
<>
<div className="px-4 sm:px-6 flex-1">
<h2 className="pt-1 pb-4 text-2xl leading-7 font-bold text-primary tracking-wide">
<h2 className="pt-1 pb-4 text-2xl leading-7 font-bold text-base tracking-wide">
My Cart
</h2>
<ul className="py-6 space-y-6 sm:py-0 sm:space-y-0 sm:divide-y sm:divide-gray-200 border-t border-gray-200">

2
components/core/Featurebar/Featurebar.tsx
View File

@@ -10,7 +10,7 @@ interface Props {
const Featurebar: FC<Props> = ({ title, description, className }) => {
const rootClassName = cn(
'hidden py-2 px-6 bg-primary-accent text-primary text-sm text-gray-600 md:flex flex-row justify-center items-center font-medium border-b border-primary-accent',
'hidden py-2 px-6 bg-primary-accent text-base text-sm text-gray-600 md:flex flex-row justify-center items-center font-medium border-b border-primary-accent',
className
)
return (

2
components/core/Navbar/Navbar.module.css
View File

@@ -1,3 +1,3 @@
.link {
@apply group text-primary inline-flex items-center text-base leading-6 font-medium hover:text-secondary focus:outline-none focus:text-secondary transition ease-in-out duration-100 cursor-pointer;
@apply group text-base inline-flex items-center text-base leading-6 font-medium hover:text-accents-8 focus:outline-none focus:text-accents-8 transition ease-in-out duration-100 cursor-pointer;
}

2
components/core/Searchbar/Searchbar.tsx
View File

@@ -17,7 +17,7 @@ const Searchbar: FC<Props> = ({ className }) => {
return (
<div
className={cn(
'relative rounded-lg text-sm bg-primary-accent text-primary w-full',
'relative rounded-lg text-sm bg-primary-accent text-base w-full',
className
)}
>

4
components/core/UserNav/UserNav.module.css
View File

@@ -6,10 +6,10 @@
}
.item {
@apply mr-6 cursor-pointer relative transition ease-in-out duration-100 text-primary;
@apply mr-6 cursor-pointer relative transition ease-in-out duration-100 text-base;
&:hover {
@apply text-secondary;
@apply text-accents-8;
}
&:last-child {

2
components/core/UserNav/UserNav.tsx
View File

@@ -29,7 +29,7 @@ const UserNav: FC<Props> = ({ className }) => {
>
<Bag />
{itemsCount > 0 && (
<span className="bg-black h-4 w-4 absolute rounded-full right-3 top-3 text-white flex items-center justify-center font-bold text-xs">
<span className="bg-secondary text-base h-4 w-4 absolute rounded-full right-3 top-3 flex items-center justify-center font-bold text-xs">
{itemsCount}
</span>
)}

8
components/product/ProductCard/ProductCard.module.css
View File

@@ -9,7 +9,7 @@
& .productTitle,
& .productPrice,
& .wishlistButton {
@apply bg-black text-white;
@apply bg-secondary text-secondary;
}
&:nth-child(6n + 1) .productTitle,
@@ -66,7 +66,7 @@
}
.productTitle {
@apply p-3 h-14 bg-primary text-primary font-bold text-xl truncate leading-8 inline-flex;
@apply p-3 h-14 bg-primary text-base font-bold text-xl truncate leading-8 inline-flex;
max-width: calc(100% - 50px);
@screen lg {
@@ -75,9 +75,9 @@
}
.productPrice {
@apply px-3 py-1 pb-2 bg-primary text-primary font-semibold inline-block text-sm leading-6;
@apply px-3 py-1 pb-2 bg-primary text-base font-semibold inline-block text-sm leading-6;
}
.wishlistButton {
@apply w-10 h-10 flex items-center justify-center bg-primary text-primary font-semibold inline-block text-xs leading-6 cursor-pointer;
@apply w-10 h-10 flex items-center justify-center bg-primary text-base font-semibold inline-block text-xs leading-6 cursor-pointer;
}

6
components/product/Swatch/Swatch.module.css
View File

@@ -1,15 +1,15 @@
.root {
@apply h-12 w-12 bg-primary text-primary rounded-full mr-3 inline-flex
@apply h-12 w-12 bg-primary text-base rounded-full mr-3 inline-flex
items-center justify-center cursor-pointer transition duration-75 ease-in-out
p-0 shadow-none border-gray-200 border box-border;
}
.active.size {
@apply border-secondary border-2;
@apply border-accents-2 border-2;
}
.root:hover {
@apply transform scale-110 bg-primary-hover;
@apply transform scale-110 bg-hover;
}
.colorViolet {

4
components/ui/Button/Button.module.css
View File

@@ -1,12 +1,12 @@
.root {
@apply text-secondary cursor-pointer inline-flex px-10 rounded-sm leading-6
@apply text-accents-8 cursor-pointer inline-flex px-10 rounded-sm leading-6
bg-secondary transition ease-in-out duration-150 shadow-sm font-semibold
text-center justify-center uppercase py-4 uppercase text-center focus:outline-none
border border-transparent items-center;
}
.root:hover {
@apply bg-primary-accent text-primary border border-secondary;
@apply bg-primary-2 text-base border border-secondary;
}
.root:focus {

2
components/ui/Sidebar/Sidebar.tsx
View File

@@ -73,7 +73,7 @@ const Sidebar: FC<Props> = ({ className, children, show = true, close }) => {
leaveTo="translate-x-full"
>
<div className="h-full w-screen max-w-lg">
<div className="h-full flex flex-col text-primary bg-primary-accent shadow-xl overflow-y-auto">
<div className="h-full flex flex-col text-base bg-primary-accent shadow-xl overflow-y-auto">
{children}
</div>
</div>