a bunch of small css things
This commit is contained in:
parent
cffd591186
commit
ffd9f22d19
5 changed files with 12 additions and 13 deletions
|
@ -36,12 +36,11 @@ const Header = styled(BaseHeader)`
|
|||
/*box-shadow: 0 3px 4px -1px rgba(0, 0, 0, 0.48);*/
|
||||
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
background: rgba(255, 255, 255, 0.65);
|
||||
backdrop-filter: blur(2px);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
|
||||
background: rgba(255, 255, 255, 0);
|
||||
backdrop-filter: blur(0px);
|
||||
|
||||
&.descendant-is-selected {
|
||||
background: rgba(255, 255, 255, 1);
|
||||
background: rgba(255, 255, 255, 0);
|
||||
}
|
||||
|
||||
${pointerEventsAutoInNormalMode};
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
export const COLOR_POPOVER_BACK = 'rgba(26, 28, 30, 0.97);'
|
||||
export const COLOR_POPOVER_BACK = 'rgba(156, 156, 156, 0.97);'
|
||||
|
||||
export const COLOR_BASE = '#272B2F'
|
||||
|
||||
export const COLOR_FOCUS_OUTLINE = '#0A4540'
|
||||
export const COLOR_FOCUS_OUTLINE = '#ffffff'
|
||||
|
|
|
@ -5,7 +5,7 @@ import React from 'react'
|
|||
import styled from 'styled-components'
|
||||
import PopoverArrow from './PopoverArrow'
|
||||
|
||||
export const popoverBackgroundColor = transparentize(0.05, `#2a2a31`)
|
||||
export const popoverBackgroundColor = transparentize(0.08, `#999999`)
|
||||
|
||||
const Container = styled.div`
|
||||
position: absolute;
|
||||
|
@ -15,7 +15,7 @@ const Container = styled.div`
|
|||
|
||||
background: var(--popover-bg);
|
||||
|
||||
color: white;
|
||||
color: black;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
cursor: default;
|
||||
|
|
|
@ -14,22 +14,22 @@ const MenuContainer = styled.ul`
|
|||
position: absolute;
|
||||
min-width: ${minWidth}px;
|
||||
z-index: 10000;
|
||||
background: ${transparentize(0.2, '#111')};
|
||||
background: ${transparentize(0.2, '#9c9c9c')};
|
||||
backdrop-filter: blur(2px);
|
||||
color: white;
|
||||
color: black;
|
||||
list-style-type: none;
|
||||
padding: 2px 0;
|
||||
margin: 0;
|
||||
border-radius: 1px;
|
||||
cursor: default;
|
||||
${pointerEventsAutoInNormalMode};
|
||||
border-radius: 3px;
|
||||
border-radius: 0px;
|
||||
`
|
||||
|
||||
const MenuTitle = styled.div`
|
||||
padding: 4px 10px;
|
||||
border-bottom: 1px solid #6262626d;
|
||||
color: #adadadb3;
|
||||
color: #ffffff;
|
||||
font-size: 11px;
|
||||
font-weight: 500;
|
||||
`
|
||||
|
|
|
@ -29,7 +29,7 @@ const ItemContainer = styled.li<{enabled: boolean}>`
|
|||
|
||||
&:hover:after {
|
||||
background-color: ${(props) =>
|
||||
props.enabled ? 'rgba(63, 174, 191, 0.75)' : 'initial'};
|
||||
props.enabled ? 'rgba(133, 133, 133, 0.75)' : 'initial'};
|
||||
}
|
||||
`
|
||||
|
||||
|
|
Loading…
Reference in a new issue