interface: handle transparency correctly

This commit is contained in:
Liam Fitzgerald 2020-07-31 13:16:21 +10:00
parent bddf9bfdba
commit 17f5250a84
9 changed files with 100 additions and 51 deletions

View File

@ -1376,21 +1376,35 @@
"integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg=="
},
"@reach/auto-id": {
"version": "0.10.1",
"resolved": "https://registry.npmjs.org/@reach/auto-id/-/auto-id-0.10.1.tgz",
"integrity": "sha512-xGFW2v+L39M/mafdW7v+NhhsjT1LBnQJCGj64dm37T4IGNgAexlfMkRRwsqHOvuVvV38mR114YOy0xrlkqduRQ==",
"version": "0.10.5",
"resolved": "https://registry.npmjs.org/@reach/auto-id/-/auto-id-0.10.5.tgz",
"integrity": "sha512-we4/bwjFxJ3F+2eaddQ1HltbKvJ7AB8clkN719El7Zugpn/vOjfPMOVUiBqTmPGLUvkYrq4tpuFwLvk2HyOVHg==",
"requires": {
"@reach/utils": "^0.10.1",
"tslib": "^1.11.1"
"@reach/utils": "0.10.5",
"tslib": "^2.0.0"
},
"dependencies": {
"tslib": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.0.tgz",
"integrity": "sha512-lTqkx847PI7xEDYJntxZH89L2/aXInsyF2luSafe/+0fHOMjlBNXdH6th7f70qxLDhul7KZK0zC8V5ZIyHl0/g=="
}
}
},
"@reach/descendants": {
"version": "0.10.1",
"resolved": "https://registry.npmjs.org/@reach/descendants/-/descendants-0.10.1.tgz",
"integrity": "sha512-Wh6VnCCDwqK/07GBx259fQsVGGwb+IT17GP3LYPtabo2L/t9Mw5oIiAkXZ6VVvw7zGpQGfm9cZYBxdYCbQOwuA==",
"version": "0.10.5",
"resolved": "https://registry.npmjs.org/@reach/descendants/-/descendants-0.10.5.tgz",
"integrity": "sha512-8HhN4DwS/HsPQ+Ym/Ft/XJ1spXBYdE8hqpnbYR9UcU7Nx3oDbTIdhjA6JXXt23t5avYIx2jRa8YHCtVKSHuiwA==",
"requires": {
"@reach/utils": "^0.10.1",
"tslib": "^1.11.1"
"@reach/utils": "0.10.5",
"tslib": "^2.0.0"
},
"dependencies": {
"tslib": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.0.tgz",
"integrity": "sha512-lTqkx847PI7xEDYJntxZH89L2/aXInsyF2luSafe/+0fHOMjlBNXdH6th7f70qxLDhul7KZK0zC8V5ZIyHl0/g=="
}
}
},
"@reach/disclosure": {
@ -1430,53 +1444,81 @@
}
},
"@reach/menu-button": {
"version": "0.10.1",
"resolved": "https://registry.npmjs.org/@reach/menu-button/-/menu-button-0.10.1.tgz",
"integrity": "sha512-GqROR7McvLdNdLe70a7aNSZaRmqttSqGdnOVkLs4NiihX1FFOw/k5CCTWmN6WEKLayVV/r4WaP/lUDdMa8w7nA==",
"version": "0.10.5",
"resolved": "https://registry.npmjs.org/@reach/menu-button/-/menu-button-0.10.5.tgz",
"integrity": "sha512-PQzFzexk9K7Q5qTGmXcg3qYp+F36H0MaeyzybR5t4lB1e56nAh1u/C2bocwpHssIoy25xOR8Nu+LVMVf6k6cUw==",
"requires": {
"@reach/auto-id": "^0.10.1",
"@reach/descendants": "^0.10.1",
"@reach/popover": "^0.10.1",
"@reach/utils": "^0.10.1",
"@reach/auto-id": "0.10.5",
"@reach/descendants": "0.10.5",
"@reach/popover": "0.10.5",
"@reach/utils": "0.10.5",
"prop-types": "^15.7.2",
"tslib": "^1.11.1"
"tslib": "^2.0.0"
},
"dependencies": {
"tslib": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.0.tgz",
"integrity": "sha512-lTqkx847PI7xEDYJntxZH89L2/aXInsyF2luSafe/+0fHOMjlBNXdH6th7f70qxLDhul7KZK0zC8V5ZIyHl0/g=="
}
}
},
"@reach/observe-rect": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@reach/observe-rect/-/observe-rect-1.1.0.tgz",
"integrity": "sha512-kE+jvoj/OyJV24C03VvLt5zclb9ArJi04wWXMMFwQvdZjdHoBlN4g0ZQFjyy/ejPF1Z/dpUD5dhRdBiUmIGZTA=="
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@reach/observe-rect/-/observe-rect-1.2.0.tgz",
"integrity": "sha512-Ba7HmkFgfQxZqqaeIWWkNK0rEhpxVQHIoVyW1YDSkGsGIXzcaW4deC8B0pZrNSSyLTdIk7y+5olKt5+g0GmFIQ=="
},
"@reach/popover": {
"version": "0.10.1",
"resolved": "https://registry.npmjs.org/@reach/popover/-/popover-0.10.1.tgz",
"integrity": "sha512-CDRYWnCUfvn2WlTDVlDmWOV3TD0zYeJSfsd6daq2bqUX1+1jRddm3x/nk2Na6Fn8Nm9pjYUvatE+noin9iVvDw==",
"version": "0.10.5",
"resolved": "https://registry.npmjs.org/@reach/popover/-/popover-0.10.5.tgz",
"integrity": "sha512-S+qWIsjrN1yMpHjgELhjpdGc4Q3q1plJtXBGGQRxUAjmCUA/5OY7t5w5C8iqMNAEBwCvYXKvK/pLcXFxxLykSw==",
"requires": {
"@reach/portal": "^0.10.1",
"@reach/rect": "^0.10.1",
"@reach/utils": "^0.10.1",
"@reach/portal": "0.10.5",
"@reach/rect": "0.10.5",
"@reach/utils": "0.10.5",
"tabbable": "^4.0.0",
"tslib": "^1.11.1"
"tslib": "^2.0.0"
},
"dependencies": {
"tslib": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.0.tgz",
"integrity": "sha512-lTqkx847PI7xEDYJntxZH89L2/aXInsyF2luSafe/+0fHOMjlBNXdH6th7f70qxLDhul7KZK0zC8V5ZIyHl0/g=="
}
}
},
"@reach/portal": {
"version": "0.10.1",
"resolved": "https://registry.npmjs.org/@reach/portal/-/portal-0.10.1.tgz",
"integrity": "sha512-axap4IxA0xgsxluqyeyVuGZrStqaZ81iyiHmXFn+D+bjDNdd29colHm5GEB5mjGnkqktcXWyx5DQ+aRHIyGEkQ==",
"version": "0.10.5",
"resolved": "https://registry.npmjs.org/@reach/portal/-/portal-0.10.5.tgz",
"integrity": "sha512-K5K8gW99yqDPDCWQjEfSNZAbGOQWSx5AN2lpuR1gDVoz4xyWpTJ0k0LbetYJTDVvLP/InEcR7AU42JaDYDCXQw==",
"requires": {
"@reach/utils": "^0.10.1",
"tslib": "^1.11.1"
"@reach/utils": "0.10.5",
"tslib": "^2.0.0"
},
"dependencies": {
"tslib": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.0.tgz",
"integrity": "sha512-lTqkx847PI7xEDYJntxZH89L2/aXInsyF2luSafe/+0fHOMjlBNXdH6th7f70qxLDhul7KZK0zC8V5ZIyHl0/g=="
}
}
},
"@reach/rect": {
"version": "0.10.1",
"resolved": "https://registry.npmjs.org/@reach/rect/-/rect-0.10.1.tgz",
"integrity": "sha512-jM172ZMUpdv4WeMjdO+A9Yg5doXWCq8SzRgk7Q7dK9x1y4czOmY0zanwYxDVs83r+mn0+QINnEDNcScpsOPAfQ==",
"version": "0.10.5",
"resolved": "https://registry.npmjs.org/@reach/rect/-/rect-0.10.5.tgz",
"integrity": "sha512-JBKs2HniYecq5zLO6UFReX28SUBPM3n0aizdNgHuvwZmDcTfNV4jsuJYQLqJ+FbCQsrSHkBxKZqWpfGXY9bUEg==",
"requires": {
"@reach/observe-rect": "^1.1.0",
"@reach/utils": "^0.10.1",
"@reach/observe-rect": "1.2.0",
"@reach/utils": "0.10.5",
"prop-types": "^15.7.2",
"tslib": "^1.11.1"
"tslib": "^2.0.0"
},
"dependencies": {
"tslib": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.0.tgz",
"integrity": "sha512-lTqkx847PI7xEDYJntxZH89L2/aXInsyF2luSafe/+0fHOMjlBNXdH6th7f70qxLDhul7KZK0zC8V5ZIyHl0/g=="
}
}
},
"@reach/tabs": {
@ -1527,13 +1569,20 @@
}
},
"@reach/utils": {
"version": "0.10.1",
"resolved": "https://registry.npmjs.org/@reach/utils/-/utils-0.10.1.tgz",
"integrity": "sha512-YzwZWVK+rSiUATNVtK7H2/ZkT/GhNKmkRjnj3hnVhSYLGxY9uQdfc+npetOqkh4hTAOXiErDa64ybVClR3h0TA==",
"version": "0.10.5",
"resolved": "https://registry.npmjs.org/@reach/utils/-/utils-0.10.5.tgz",
"integrity": "sha512-5E/xxQnUbmpI/LrufBAOXjunl96DnqX6B4zC2MO2KH/dRzLug5gM5VuOwV26egsp0jvsSPxojwciOhS43px3qw==",
"requires": {
"@types/warning": "^3.0.0",
"tslib": "^1.11.1",
"tslib": "^2.0.0",
"warning": "^4.0.3"
},
"dependencies": {
"tslib": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.0.tgz",
"integrity": "sha512-lTqkx847PI7xEDYJntxZH89L2/aXInsyF2luSafe/+0fHOMjlBNXdH6th7f70qxLDhul7KZK0zC8V5ZIyHl0/g=="
}
}
},
"@styled-system/background": {

View File

@ -6,7 +6,7 @@
"dependencies": {
"@babel/runtime": "^7.10.5",
"@reach/disclosure": "^0.10.5",
"@reach/menu-button": "^0.10.18",
"@reach/menu-button": "^0.10.5",
"@reach/tabs": "^0.10.5",
"@tlon/indigo-light": "^1.0.3",
"@tlon/indigo-react": "^1.1.15",

View File

View File

@ -29,7 +29,7 @@ function darkColors(dark) {
background = '#333';
} else {
text = '#000000';
background = '#ffffff00';
background = '#ffffff';
}
}
@ -401,7 +401,7 @@ export default class ClockTile extends React.Component {
renderWrapper(child) {
return (
<Tile>
<Tile transparent>
{child}
</Tile>
);

View File

@ -4,7 +4,7 @@ import React from 'react';
export default class Tile extends React.Component {
render() {
const { transparent } = this.props;
const bgClasses = transparent ? ' ' : 'bg-white bg-gray0-d ';
const bgClasses = transparent ? ' ' : ' bg-white bg-gray0-d ';
return (
<div className={"fl ma2 overflow-hidden" + bgClasses}
style={{ height: '126px', width: '126px' }}>

View File

@ -23,7 +23,7 @@ export class Skeleton extends Component {
return (
<div className={'absolute w-100 ' + popoutWindow} style={{ height: 'calc(100% - 45px)' }}>
<div className={'cf w-100 h-100 flex ' + popoutBorder}>
<div className={'bg-white bg-gray0-d cf w-100 h-100 flex ' + popoutBorder}>
<ChannelsSidebar
active={props.active}
popout={popout}
@ -37,7 +37,7 @@ export class Skeleton extends Component {
listening={props.listening}
api={props.api}
/>
<div className={'h-100 w-100 flex-auto relative bg-white bg-gray0-d' + rightPanelHide} style={{
<div className={'h-100 w-100 flex-auto relative ' + rightPanelHide} style={{
flexGrow: 1
}}
>

View File

@ -20,7 +20,7 @@ export class Skeleton extends Component {
return (
<div className={'w-100 h-100 ' + popoutWindow}>
<div className={'cf w-100 h-100 flex ' + popoutBorder}>
<div className={'bg-white bg-gray0-d cf w-100 h-100 flex ' + popoutBorder}>
<Sidebar
popout={popout}
sidebarShown={props.sidebarShown}
@ -33,7 +33,7 @@ export class Skeleton extends Component {
selectedGroups={props.selectedGroups}
api={this.props.api}
/>
<div className={'bg-white bg-gray0-d h-100 w-100 relative white-d flex-auto ' + rightPanelHide} style={{
<div className={'h-100 w-100 relative white-d flex-auto ' + rightPanelHide} style={{
flexGrow: 1
}}
>

View File

View File