Style tweaks

This commit is contained in:
Aria Minaei 2021-07-22 22:01:58 +02:00
parent 1444c61d64
commit ab7ed34f96

View file

@ -2,7 +2,6 @@ import type {ReactElement} from 'react'
import React from 'react' import React from 'react'
import styled from 'styled-components' import styled from 'styled-components'
import {Tooltip, TooltipReference} from '@theatre/studio/uiComponents/Tooltip' import {Tooltip, TooltipReference} from '@theatre/studio/uiComponents/Tooltip'
import {lighten, darken} from 'polished'
import type {ButtonProps} from 'reakit' import type {ButtonProps} from 'reakit'
import {useTooltipState} from 'reakit' import {useTooltipState} from 'reakit'
import {Button} from 'reakit' import {Button} from 'reakit'
@ -20,18 +19,22 @@ export const TheButton = styled(TooltipReference)`
outline: none; outline: none;
&:hover { &:hover {
background-color: ${lighten(0.02, '#313131')}; background-color: #1a1d23;
color: white; color: white;
border-color: #4f5661;
} }
&.selected { &.selected {
background-color: ${darken(0.1, '#313131')}; background-color: #1a1d23;
color: white; color: white;
&:hover {
border-color: #272a2d;
}
} }
color: #c0c0c0; color: #c0c0c0;
background-color: #313131; background-color: #222427;
border: 1px solid #272727; border: 1px solid #272a2d;
border-radius: 3px; border-radius: 3px;
box-shadow: 1px 1px 0px #0000001c; box-shadow: 1px 1px 0px #0000001c;
` `