cherry-styled-components 0.1.6 → 0.1.7

package/dist/cherry.js

@@ -21972,6 +21972,7 @@ const Ga1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty(
 `, Ka1 = W.input`
   ${v1};
   display: inline-block;
+  background: ${({ theme: t }) => t.colors.light};
   border: solid 2px ${({ theme: t }) => t.colors.grayLight};
   box-shadow: 0 0 0 0px ${({ theme: t }) => t.colors.primaryLight};
   transition: all 0.3s ease;

package/dist/cherry.umd.cjs

@@ -873,6 +873,7 @@ To pass a single animation please supply them in simple values, e.g. animation('
 `,xq=Z.input`
   ${l1};
   display: inline-block;
+  background: ${({theme:t})=>t.colors.light};
   border: solid 2px ${({theme:t})=>t.colors.grayLight};
   box-shadow: 0 0 0 0px ${({theme:t})=>t.colors.primaryLight};
   transition: all 0.3s ease;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cherry-styled-components",
-  "version": "0.1.6",
+  "version": "0.1.7",
   "description": "Cherry is a design system for the modern web. Designed in Figma, built in React using Typescript.",
   "private": false,
   "type": "module",

package/src/lib/button.tsx

@@ -127,9 +127,7 @@ export const buttonStyles = (
     box-shadow: 0 0 0 0px ${theme.colors.error};
 
     &:hover {
-      background: ${$outline
-        ? "transparent"
-        : darken(0.1, theme.colors.error)};
+      background: ${$outline ? "transparent" : darken(0.1, theme.colors.error)};
       border-color: ${darken(0.1, theme.colors.error)};
       ${$outline && `color: ${darken(0.1, theme.colors.error)}`};
     }

package/src/lib/input.tsx

@@ -230,6 +230,7 @@ const StyledIconWrapper = styled.span<InputProps>`
 const StyledRadioCheckboxInput = styled.input<InputProps>`
   ${resetButton};
   display: inline-block;
+  background: ${({ theme }) => theme.colors.light};
   border: solid 2px ${({ theme }) => theme.colors.grayLight};
   box-shadow: 0 0 0 0px ${({ theme }) => theme.colors.primaryLight};
   transition: all 0.3s ease;