mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-16 12:50:38 +00:00
Merge pull request #87 from bigcapitalhq/BIG-412-inconsistent-style-of-quick-customer-vendor-drawer
fix(webapp): inconsistent style of quick customer/vendor drawer
This commit is contained in:
@@ -4,6 +4,7 @@ import intl from 'react-intl-universal';
|
||||
import classNames from 'classnames';
|
||||
import { Formik, Form } from 'formik';
|
||||
import { Intent } from '@blueprintjs/core';
|
||||
import styled from 'styled-components';
|
||||
|
||||
import { CLASSES } from '@/constants/classes';
|
||||
import { CreateCustomerForm, EditCustomerForm } from './CustomerForm.schema';
|
||||
@@ -104,9 +105,9 @@ function CustomerFormFormik({
|
||||
onSubmit={handleFormSubmit}
|
||||
>
|
||||
<Form>
|
||||
<div className={classNames(CLASSES.PAGE_FORM_HEADER_PRIMARY)}>
|
||||
<CustomerFormHeaderPrimary>
|
||||
<CustomerFormPrimarySection />
|
||||
</div>
|
||||
</CustomerFormHeaderPrimary>
|
||||
|
||||
<div className={'page-form__after-priamry-section'}>
|
||||
<CustomerFormAfterPrimarySection />
|
||||
@@ -123,4 +124,12 @@ function CustomerFormFormik({
|
||||
);
|
||||
}
|
||||
|
||||
export const CustomerFormHeaderPrimary = styled.div`
|
||||
padding: 10px 0 0;
|
||||
margin: 0 0 20px;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #e4e4e4;
|
||||
max-width: 1000px;
|
||||
`;
|
||||
|
||||
export default compose(withCurrentOrganization())(CustomerFormFormik);
|
||||
|
||||
@@ -4,12 +4,13 @@ import * as R from 'ramda';
|
||||
import styled from 'styled-components';
|
||||
|
||||
import { Card, DrawerLoading } from '@/components';
|
||||
|
||||
import {
|
||||
CustomerFormProvider,
|
||||
useCustomerFormContext,
|
||||
} from '@/containers/Customers/CustomerForm/CustomerFormProvider';
|
||||
import CustomerFormFormik from '@/containers/Customers/CustomerForm/CustomerFormFormik';
|
||||
import CustomerFormFormik, {
|
||||
CustomerFormHeaderPrimary,
|
||||
} from '@/containers/Customers/CustomerForm/CustomerFormFormik';
|
||||
|
||||
import withDrawerActions from '@/containers/Drawer/withDrawerActions';
|
||||
|
||||
@@ -55,12 +56,18 @@ export default R.compose(withDrawerActions)(QuickCustomerFormDrawer);
|
||||
|
||||
const CustomerFormCard = styled(Card)`
|
||||
margin: 15px;
|
||||
padding: 25px;
|
||||
margin-bottom: calc(15px + 65px);
|
||||
|
||||
${CustomerFormHeaderPrimary} {
|
||||
padding-top: 0;
|
||||
}
|
||||
.page-form {
|
||||
padding: 0;
|
||||
|
||||
&__floating-actions {
|
||||
margin-left: -36px;
|
||||
margin-right: -36px;
|
||||
margin-left: -41px;
|
||||
margin-right: -41px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
@@ -4,12 +4,13 @@ import * as R from 'ramda';
|
||||
import styled from 'styled-components';
|
||||
|
||||
import { Card, DrawerLoading } from '@/components';
|
||||
|
||||
import {
|
||||
VendorFormProvider,
|
||||
useVendorFormContext,
|
||||
} from '@/containers/Vendors/VendorForm/VendorFormProvider';
|
||||
import VendorFormFormik from '@/containers/Vendors/VendorForm/VendorFormFormik';
|
||||
import VendorFormFormik, {
|
||||
VendorFormHeaderPrimary,
|
||||
} from '@/containers/Vendors/VendorForm/VendorFormFormik';
|
||||
|
||||
import withDrawerActions from '@/containers/Drawer/withDrawerActions';
|
||||
import withDashboardActions from '@/containers/Dashboard/withDashboardActions';
|
||||
@@ -75,12 +76,18 @@ export default R.compose(
|
||||
|
||||
const VendorFormCard = styled(Card)`
|
||||
margin: 15px;
|
||||
padding: 25px;
|
||||
margin-bottom: calc(15px + 65px);
|
||||
|
||||
${VendorFormHeaderPrimary} {
|
||||
padding-top: 0;
|
||||
}
|
||||
.page-form {
|
||||
padding: 0;
|
||||
|
||||
&__floating-actions {
|
||||
margin-left: -36px;
|
||||
margin-right: -36px;
|
||||
margin-left: -41px;
|
||||
margin-right: -41px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
@@ -4,6 +4,7 @@ import intl from 'react-intl-universal';
|
||||
import { Formik, Form } from 'formik';
|
||||
import { Intent } from '@blueprintjs/core';
|
||||
import classNames from 'classnames';
|
||||
import styled from 'styled-components';
|
||||
|
||||
import { CLASSES } from '@/constants/classes';
|
||||
import { AppToaster } from '@/components';
|
||||
@@ -115,9 +116,9 @@ function VendorFormFormik({
|
||||
onSubmit={handleFormSubmit}
|
||||
>
|
||||
<Form>
|
||||
<div className={classNames(CLASSES.PAGE_FORM_HEADER_PRIMARY)}>
|
||||
<VendorFormHeaderPrimary>
|
||||
<VendorFormPrimarySection />
|
||||
</div>
|
||||
</VendorFormHeaderPrimary>
|
||||
|
||||
<div className={'page-form__after-priamry-section'}>
|
||||
<VendorFormAfterPrimarySection />
|
||||
@@ -134,4 +135,12 @@ function VendorFormFormik({
|
||||
);
|
||||
}
|
||||
|
||||
export const VendorFormHeaderPrimary = styled.div`
|
||||
padding: 10px 0 0;
|
||||
margin: 0 0 20px;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #e4e4e4;
|
||||
max-width: 1000px;
|
||||
`;
|
||||
|
||||
export default compose(withCurrentOrganization())(VendorFormFormik);
|
||||
|
||||
Reference in New Issue
Block a user