abner/for-legacy-web
1
0
Fork 1
mirror of https://github.com/stoatchat/for-legacy-web.git synced 2026-03-08 01:45:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

Use tabWidth 4 without actual tabs.

Browse Source
This commit is contained in:
Paul
2021-07-05 11:25:20 +01:00
parent a9ce64c9fe
commit 14809f1989
180 changed files with 16619 additions and 16622 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
src/components/ui/Button.tsx
View File

@@ -1,71 +1,71 @@
import styled, { css } from "styled-components";
interface Props {
readonly contrast?: boolean;
readonly error?: boolean;
readonly contrast?: boolean;
readonly error?: boolean;
}
export default styled.button<Props>`
z-index: 1;
padding: 8px;
font-size: 16px;
text-align: center;
font-family: inherit;
z-index: 1;
padding: 8px;
font-size: 16px;
text-align: center;
font-family: inherit;
transition: 0.2s ease opacity;
transition: 0.2s ease background-color;
transition: 0.2s ease opacity;
transition: 0.2s ease background-color;
background: var(--primary-background);
color: var(--foreground);
background: var(--primary-background);
color: var(--foreground);
border-radius: 6px;
cursor: pointer;
border: none;
border-radius: 6px;
cursor: pointer;
border: none;
&:hover {
background: var(--secondary-header);
}
&:hover {
background: var(--secondary-header);
}
&:disabled {
background: var(--primary-background);
}
&:disabled {
background: var(--primary-background);
}
&:active {
background: var(--secondary-background);
}
&:active {
background: var(--secondary-background);
}
${(props) =>
props.contrast &&
css`
padding: 4px 8px;
background: var(--secondary-header);
${(props) =>
props.contrast &&
css`
padding: 4px 8px;
background: var(--secondary-header);
&:hover {
background: var(--primary-header);
}
&:hover {
background: var(--primary-header);
}
&:disabled {
background: var(--secondary-header);
}
&:disabled {
background: var(--secondary-header);
}
&:active {
background: var(--secondary-background);
}
`}
&:active {
background: var(--secondary-background);
}
`}
${(props) =>
props.error &&
css`
color: white;
background: var(--error);
${(props) =>
props.error &&
css`
color: white;
background: var(--error);
&:hover {
filter: brightness(1.2);
background: var(--error);
}
&:hover {
filter: brightness(1.2);
background: var(--error);
}
&:disabled {
background: var(--error);
}
`}
&:disabled {
background: var(--error);
}
`}
`;