Skip to content

Commit

Permalink
Update of global styles for themes
Browse files Browse the repository at this point in the history
  • Loading branch information
kkosiorowska committed Nov 17, 2023
1 parent 2325e13 commit 404d3c9
Show file tree
Hide file tree
Showing 3 changed files with 24 additions and 1 deletion.
7 changes: 7 additions & 0 deletions dapp/src/theme/Button.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,18 @@ import { mode } from "@chakra-ui/theme-tools"
import type { StyleFunctionProps } from "@chakra-ui/styled-system"

const Button = {
baseStyle: {
rounded: "none",
},
variants: {
solid: (props: StyleFunctionProps) => ({
backgroundColor: mode("black", "purple")(props),
color: "white",
}),
outline: (props: StyleFunctionProps) => ({
color: mode("black", "grey.80")(props),
borderColor: mode("black", "grey.50")(props),
}),
},
}

Expand Down
12 changes: 11 additions & 1 deletion dapp/src/theme/index.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,19 @@
import { extendTheme } from "@chakra-ui/react"
import { StyleFunctionProps, extendTheme } from "@chakra-ui/react"
import { mode } from "@chakra-ui/theme-tools"
import Button from "./Button"
import { colors } from "./utils"

const defaultTheme = {
colors,
styles: {
global: (props: StyleFunctionProps) => ({
"html, body, #root, #root > div": {
backgroundColor: mode("lightGrey", "darkGrey")(props),
color: mode("black", "grey.80")(props),
minHeight: "100vh",
},
}),
},
components: {
Button,
},
Expand Down
6 changes: 6 additions & 0 deletions dapp/src/theme/utils/colors.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,10 @@ export const colors = {
white: "#FFF",
black: "#000",
purple: "#7D00FF",
grey: {
50: "rgba(255, 255, 255, 0.50)",
80: "rgba(255, 255, 255, 0.80)",
},
lightGrey: "#ECECEC",
darkGrey: "#1A1B1D",
}

0 comments on commit 404d3c9

Please sign in to comment.