From da48706bd7750fd3b69055beda46996f30d01c19 Mon Sep 17 00:00:00 2001
From: "Carlos A. Cabrera" <cacabrer@adobe.com>
Date: Tue, 26 Nov 2019 19:54:14 -0600
Subject: [PATCH] style fixes

---
 package.json                               |  2 +-
 src/components/ProductItem/ProductItem.tsx |  8 ++++-
 src/theme/colors.ts                        | 34 +++++++++++-----------
 3 files changed, 25 insertions(+), 19 deletions(-)

diff --git a/package.json b/package.json
index 677b80d..411bd0b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@pmet-public/luma-ui",
-  "version": "1.0.0-beta.6",
+  "version": "1.0.0-beta.7",
   "description": "Luma React UI LIbrary",
   "repository": "https://github.com/PMET-public/luma-ui.git",
   "author": "Carlos A. Cabrera @fnhhipster",
diff --git a/src/components/ProductItem/ProductItem.tsx b/src/components/ProductItem/ProductItem.tsx
index 5d4d7e4..b1266b8 100644
--- a/src/components/ProductItem/ProductItem.tsx
+++ b/src/components/ProductItem/ProductItem.tsx
@@ -63,7 +63,13 @@ export const ProductItem: Component<ProductItemProps> & CompoundComponent = ({
 
 ProductItem.Skeleton = props => {
     return (
-        <ContentLoader height={810} width={600} primaryColor="#f3f3f3" secondaryColor="#e6e6e6" {...props}>
+        <ContentLoader
+            height={810}
+            width={600}
+            primaryColor="rgba(204, 204, 204, 0.25)"
+            secondaryColor="rgba(204, 204, 204, 0.35)"
+            {...props}
+        >
             <rect x="16" y="762" rx="4" ry="4" width="60%" height="16" />
             <rect x="16" y="787" rx="4" ry="4" width="30%" height="15" />
             <rect x="0" y="0" rx="5" ry="5" width="600" height="750" />
diff --git a/src/theme/colors.ts b/src/theme/colors.ts
index 2bcb87e..f300932 100644
--- a/src/theme/colors.ts
+++ b/src/theme/colors.ts
@@ -64,13 +64,13 @@ export const light = {
     onAccent10: 'rgba(250, 250, 250, 0.10)',
     onAccent5: 'rgba(250, 250, 250, 0.05)',
 
-    error: '#ffffff',
+    error: 'rgba(255, 255, 255, 1)',
     onError: '#ef5350',
 
-    warning: '#ffffff',
+    warning: 'rgba(255, 255, 255, 1)',
     onWarning: '#f57c00',
 
-    notice: '#ffffff',
+    notice: 'rgba(255, 255, 255, 1)',
     onNotice: '#039be5',
 
     graySurface: '#e9e9e9',
@@ -81,7 +81,7 @@ export const light = {
  */
 export const dark = {
     background: '#222222',
-    onBackground: '#ffffff',
+    onBackground: 'rgba(255, 255, 255, 1)',
 
     surface: 'rgba(34, 34, 34, 1)',
     surface90: 'rgba(34, 34, 34, 0.90)',
@@ -129,13 +129,13 @@ export const dark = {
     onSecondary10: 'rgba(250, 250, 250, 0.10)',
     onSecondary5: 'rgba(250, 250, 250, 0.05)',
 
-    accent: 'rgba(161, 74, 36, 1)',
-    accent75: 'rgba(161, 74, 36, 0.75)',
-    accent50: 'rgba(161, 74, 36, 0.5)',
-    accent25: 'rgba(161, 74, 36, 0.25)',
-    accent15: 'rgba(161, 74, 36, 0.15)',
-    accent10: 'rgba(161, 74, 36, 0.10)',
-    accent5: 'rgba(161, 74, 36, 0.05)',
+    accent: 'rgba(38, 169, 265, 1)',
+    accent75: 'rgba(38, 169, 265, 0.75)',
+    accent50: 'rgba(38, 169, 265, 0.5)',
+    accent25: 'rgba(38, 169, 265, 0.25)',
+    accent15: 'rgba(38, 169, 265, 0.15)',
+    accent10: 'rgba(38, 169, 265, 0.10)',
+    accent5: 'rgba(38, 169, 265, 0.05)',
     onAccent: 'rgba(250, 250, 250, 1)',
     onAccent75: 'rgba(250, 250, 250, 0.75)',
     onAccent50: 'rgba(250, 250, 250, 0.5)',
@@ -144,14 +144,14 @@ export const dark = {
     onAccent10: 'rgba(250, 250, 250, 0.10)',
     onAccent5: 'rgba(250, 250, 250, 0.05)',
 
-    error: '#ef5350',
-    onError: '#ffffff',
+    error: '#222222',
+    onError: '#ef5350',
 
-    warning: '#f57c00',
-    onWarning: '#ffffff',
+    warning: '#222222',
+    onWarning: '#f57c00',
 
-    notice: '#039be5',
-    onNotice: '#ffffff',
+    notice: '#222222',
+    onNotice: '#039be5',
 
     graySurface: '#333',
 }