More tweaks to the prop editors

This commit is contained in:
Aria Minaei 2021-07-16 11:21:11 +02:00
parent 022016b574
commit 77f96e2082
3 changed files with 7 additions and 8 deletions

View file

@ -19,8 +19,8 @@ const Container = styled.div`
inset: 1px 0 2px; inset: 1px 0 2px;
display: block; display: block;
content: ' '; content: ' ';
background-color: #2525252b; background-color: transparent;
border: 1px solid #1c2123; border: 1px solid transparent;
z-index: -2; z-index: -2;
box-sizing: border-box; box-sizing: border-box;
border-radius: 1px; border-radius: 1px;
@ -31,7 +31,6 @@ const Container = styled.div`
&.editingViaKeyboard { &.editingViaKeyboard {
&:after { &:after {
background-color: #10101042; background-color: #10101042;
/* background-color: ${darken(0.2, theme.panel.bg)}; */
border-color: #00000059; border-color: #00000059;
} }
} }

View file

@ -1,5 +1,3 @@
import {theme} from '@theatre/studio/css'
import {darken, lighten} from 'polished'
import React, {useCallback} from 'react' import React, {useCallback} from 'react'
import styled from 'styled-components' import styled from 'styled-components'
import {CgSelect} from 'react-icons/all' import {CgSelect} from 'react-icons/all'
@ -19,6 +17,7 @@ const IconContainer = styled.div`
display: flex; display: flex;
align-items: center; align-items: center;
color: #6b7280; color: #6b7280;
pointer-events: none;
` `
const Select = styled.select` const Select = styled.select`
@ -39,8 +38,8 @@ const Select = styled.select`
&:hover, &:hover,
&:focus { &:focus {
background-color: ${darken(0.9, theme.panel.bg)}; background-color: #10101042;
border: 1px solid ${lighten(0.1, theme.panel.bg)}; border-color: #00000059;
} }
` `

View file

@ -20,7 +20,7 @@ const Label = styled.label`
justify-content: center; justify-content: center;
flex-grow: 1; flex-grow: 1;
color: #a7a7a7; color: #a7a7a7;
border: 1px solid #1c2123; border: 1px solid transparent;
box-sizing: border-box; box-sizing: border-box;
border-right-width: 0px; border-right-width: 0px;
@ -29,6 +29,7 @@ const Label = styled.label`
} }
${Container}:hover > & { ${Container}:hover > & {
border-color: #1c2123;
/* background-color: #373748; */ /* background-color: #373748; */
/* color: ${darken(0.1, 'white')}; */ /* color: ${darken(0.1, 'white')}; */
} }