coop-cloud-chaos-patchs/outline
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

slightly nicer color definitions (#1705)

Browse Source
This commit is contained in:
Nan Yu
2020-12-07 08:56:07 -08:00
committed by GitHub
parent 3f9f1f0bed
commit 63d926e196
2 changed files with 15 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
app/components/DropToImport.js
View File

@ -5,7 +5,7 @@ import { observer, inject } from "mobx-react";
import * as React from "react"; import * as React from "react";
import Dropzone from "react-dropzone"; import Dropzone from "react-dropzone";
import { withRouter, type RouterHistory, type Match } from "react-router-dom"; import { withRouter, type RouterHistory, type Match } from "react-router-dom";
import styled from "styled-components"; import styled, { css } from "styled-components";
import DocumentsStore from "stores/DocumentsStore"; import DocumentsStore from "stores/DocumentsStore";
import UiStore from "stores/UiStore"; import UiStore from "stores/UiStore";
import LoadingIndicator from "components/LoadingIndicator"; import LoadingIndicator from "components/LoadingIndicator";
@ -100,15 +100,18 @@ class DropToImport extends React.Component<Props> {
const DropzoneContainer = styled("div")` const DropzoneContainer = styled("div")`
border-radius: 4px; border-radius: 4px;
background: ${({ isDragActive, theme }) =>
isDragActive && theme.slateDark} !important; ${({ isDragActive, theme }) =>
a { isDragActive &&
color: ${({ isDragActive, theme }) => css`
isDragActive && theme.white} !important; background: ${theme.slateDark};
} a {
svg { color: ${theme.white} !important;
fill: ${({ isDragActive, theme }) => isDragActive && theme.white}; }
} svg {
fill: ${theme.white};
}
`}
`; `;
export default inject("documents", "ui")(withRouter(DropToImport)); export default inject("documents", "ui")(withRouter(DropToImport));

3
shared/styles/theme.js
View File

@ -2,6 +2,7 @@
import { darken, lighten } from "polished"; import { darken, lighten } from "polished";
const colors = { const colors = {
transparent: "transparent",
almostBlack: "#111319", almostBlack: "#111319",
lightBlack: "#2F3336", lightBlack: "#2F3336",
almostWhite: "#E6E6E6", almostWhite: "#E6E6E6",
@ -183,7 +184,7 @@ export const dark = {
placeholder: colors.slateDark, placeholder: colors.slateDark,
sidebarBackground: colors.veryDarkBlue, sidebarBackground: colors.veryDarkBlue,
sidebarItemBackground: colors.veryDarkBlue, sidebarItemBackground: colors.transparent,
sidebarText: colors.slate, sidebarText: colors.slate,
shadow: "rgba(0, 0, 0, 0.6)", shadow: "rgba(0, 0, 0, 0.6)",