mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-16 12:50:38 +00:00
wip
This commit is contained in:
@@ -19,8 +19,10 @@ const CardRoot = styled.div`
|
||||
|
||||
export const CardFooterActions = styled.div`
|
||||
--x-color-border: #e0e7ea;
|
||||
--x-color-border: rgba(255, 255, 255, 0.25);
|
||||
|
||||
.bp4-dark & {
|
||||
--x-color-border: rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
padding-top: 16px;
|
||||
border-top: 1px solid var(--x-color-border);
|
||||
margin-top: 30px;
|
||||
|
||||
@@ -23,27 +23,22 @@ export function DataTableEditable({
|
||||
const DatatableEditableRoot = styled.div`
|
||||
--x-table-background: #fff;
|
||||
--x-table-border: #d2dce2;
|
||||
|
||||
--x-table-background: var(--color-dark-gray1);
|
||||
--x-table-border: rgba(255, 255, 255, 0.1);
|
||||
|
||||
--x-table-head-border: #d2dce2;
|
||||
--x-table-head-background: #f2f3fb;
|
||||
|
||||
--x-table-head-background: var(--color-dark-gray2);
|
||||
--x-table-head-border: rgba(255, 255, 255, 0.1);
|
||||
|
||||
|
||||
|
||||
--x-table-head-text: #415060;
|
||||
--x-table-head-text: rgba(--color-light-gray1);
|
||||
|
||||
--x-color-table-body-input-text: #222;
|
||||
--x-color-table-body-input-text: var(--color-light-gray2);
|
||||
|
||||
--x-color-table-cell-border: #d8d8d8;
|
||||
--x-color-table-cell-border: rgba(255, 255, 255, 0.1);
|
||||
|
||||
|
||||
.bp4-dark & {
|
||||
--x-table-background: var(--color-dark-gray1);
|
||||
--x-table-border: rgba(255, 255, 255, 0.1);
|
||||
--x-table-head-background: var(--color-dark-gray2);
|
||||
--x-table-head-border: rgba(255, 255, 255, 0.1);
|
||||
--x-table-head-text: rgba(--color-light-gray1);
|
||||
--x-color-table-body-input-text: var(--color-light-gray2);
|
||||
--x-color-table-cell-border: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.bp4-form-group {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
@@ -2,11 +2,12 @@
|
||||
|
||||
.root {
|
||||
--x-color-background: var(--color-white);
|
||||
--x-color-background: transparent;
|
||||
|
||||
--x-color-border: var(--color-dark-gray1);
|
||||
--x-color-border: rgba(255, 255, 255, 0.2);
|
||||
|
||||
|
||||
:global(.bp4-dark) {
|
||||
--x-color-background: transparent;
|
||||
--x-color-border: var(--color-dark-gray1);
|
||||
}
|
||||
&:global(.bp4-navbar){
|
||||
background-color: var(--x-color-background);
|
||||
box-shadow: 0 1px 0 var(--x-color-border);
|
||||
|
||||
@@ -65,8 +65,10 @@ function SubTitle({ children }) {
|
||||
|
||||
const SubTitleHead = styled.div`
|
||||
--x-color-text: #666;
|
||||
--x-color-text: rgba(255, 255, 255, 0.6);
|
||||
|
||||
.bp4-dark & {
|
||||
--x-color-text: rgba(255, 255, 255, 0.6);
|
||||
}
|
||||
color: var(--x-color-text);
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
|
||||
@@ -22,10 +22,11 @@ const SelectButton = styled(Button)`
|
||||
--x-color-select-border: #ced4da;
|
||||
--x-color-select-caret: #8d8d8d;
|
||||
|
||||
--x-color-select-background: rgba(17, 20, 24, 0.3);
|
||||
--x-color-select-border: rgba(255, 255, 255, 0.15);
|
||||
--x-color-select-caret: rgba(255, 255, 255, 0.25);
|
||||
|
||||
.bp4-dark & {
|
||||
--x-color-select-background: rgba(17, 20, 24, 0.3);
|
||||
--x-color-select-border: rgba(255, 255, 255, 0.15);
|
||||
--x-color-select-caret: rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
outline: none;
|
||||
box-shadow: 0 0 0 transparent;
|
||||
border: 1px solid var(--x-color-select-border);
|
||||
|
||||
@@ -16,9 +16,10 @@ const FormTopBarRoot = styled(Navbar)`
|
||||
--color-form-topbar-background: #fff;
|
||||
--color-form-topbar-border: #c7d5db;
|
||||
|
||||
--color-form-topbar-background: var(--color-dark-gray1);
|
||||
--color-form-topbar-border: rgba(255, 255, 255, 0.15);
|
||||
|
||||
.bp4-dark & {
|
||||
--color-form-topbar-background: var(--color-dark-gray1);
|
||||
--color-form-topbar-border: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
height: 35px;
|
||||
padding: 0 20px;
|
||||
|
||||
|
||||
@@ -41,7 +41,9 @@ PageFormBody.displayName = 'PageFormBody';
|
||||
* Page form footer.
|
||||
* @returns {React.ReactNode}
|
||||
*/
|
||||
const PageFormFooter: FC<{ children: React.ReactNode } & SystemProps> = ({ children }) => {
|
||||
const PageFormFooter: FC<{ children: React.ReactNode } & SystemProps> = ({
|
||||
children,
|
||||
}) => {
|
||||
return <x.div>{children} </x.div>;
|
||||
};
|
||||
|
||||
@@ -51,9 +53,10 @@ const footerActionsStyle = `
|
||||
--x-color-background: #fff;
|
||||
--x-color-border: rgb(210, 221, 226);
|
||||
|
||||
--x-color-background: var(--color-dark-gray1);
|
||||
--x-color-border: rgba(255, 255, 255, 0.1);
|
||||
|
||||
.bp4-dark & {
|
||||
--x-color-background: var(--color-dark-gray1);
|
||||
--x-color-border: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
width: 100%;
|
||||
background: var(--x-color-background);
|
||||
padding: 14px 20px;
|
||||
|
||||
@@ -4,11 +4,11 @@
|
||||
--x-color-background: #fff;
|
||||
--x-color-border: #d2dce2;
|
||||
|
||||
--x-color-background: var(--color-dark-gray1);
|
||||
--x-color-border: rgba(255, 255, 255, 0.1);
|
||||
|
||||
:global(.bp4-dark) & {
|
||||
--x-color-background: var(--color-dark-gray1);
|
||||
--x-color-border: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
background-color: var(--x-color-background);
|
||||
border: 1px solid var(--x-color-border);
|
||||
padding: 10px;
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user