mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-19 14:20:31 +00:00
feat: style dropdown arrow of html and list select.
This commit is contained in:
@@ -3,12 +3,11 @@ import {Button} from '@blueprintjs/core';
|
|||||||
import {Select} from '@blueprintjs/select';
|
import {Select} from '@blueprintjs/select';
|
||||||
|
|
||||||
export default function SelectList(props) {
|
export default function SelectList(props) {
|
||||||
const {buttonLabel, ...rest} = props;
|
const { buttonLabel, ...rest } = props;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Select {...rest}>
|
<Select {...rest}>
|
||||||
<Button
|
<Button
|
||||||
rightIcon="caret-down"
|
|
||||||
fill={true}>
|
fill={true}>
|
||||||
{ buttonLabel }
|
{ buttonLabel }
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
@@ -27,7 +27,6 @@ import { FormattedMessage as T, FormattedHTMLMessage } from 'react-intl';
|
|||||||
|
|
||||||
|
|
||||||
function AccountsChart({
|
function AccountsChart({
|
||||||
|
|
||||||
// #withDashboard
|
// #withDashboard
|
||||||
changePageTitle,
|
changePageTitle,
|
||||||
|
|
||||||
@@ -135,14 +134,17 @@ function AccountsChart({
|
|||||||
});
|
});
|
||||||
}, [inactiveAccount, requestInactiveAccount]);
|
}, [inactiveAccount, requestInactiveAccount]);
|
||||||
|
|
||||||
|
// Handle activate account click.
|
||||||
const handleActivateAccount = useCallback((account) => {
|
const handleActivateAccount = useCallback((account) => {
|
||||||
setActivateAccount(account);
|
setActivateAccount(account);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Handle activate account alert cancel.
|
||||||
const handleCancelActivateAccount = useCallback(() => {
|
const handleCancelActivateAccount = useCallback(() => {
|
||||||
setActivateAccount(false);
|
setActivateAccount(false);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Handle activate account confirm.
|
||||||
const handleConfirmAccountActivate = useCallback(() => {
|
const handleConfirmAccountActivate = useCallback(() => {
|
||||||
requestActivateAccount(activateAccount.id).then(() => {
|
requestActivateAccount(activateAccount.id).then(() => {
|
||||||
setActivateAccount(false);
|
setActivateAccount(false);
|
||||||
@@ -163,10 +165,12 @@ function AccountsChart({
|
|||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Handle accounts bulk delete button click.,
|
||||||
const handleBulkDelete = useCallback((accountsIds) => {
|
const handleBulkDelete = useCallback((accountsIds) => {
|
||||||
setBulkDelete(accountsIds);
|
setBulkDelete(accountsIds);
|
||||||
}, [setBulkDelete]);
|
}, [setBulkDelete]);
|
||||||
|
|
||||||
|
// Handle confirm accounts bulk delete.
|
||||||
const handleConfirmBulkDelete = useCallback(() => {
|
const handleConfirmBulkDelete = useCallback(() => {
|
||||||
requestDeleteBulkAccounts(bulkDelete).then(() => {
|
requestDeleteBulkAccounts(bulkDelete).then(() => {
|
||||||
setBulkDelete(false);
|
setBulkDelete(false);
|
||||||
@@ -180,6 +184,7 @@ function AccountsChart({
|
|||||||
});
|
});
|
||||||
}, [requestDeleteBulkAccounts, bulkDelete]);
|
}, [requestDeleteBulkAccounts, bulkDelete]);
|
||||||
|
|
||||||
|
// Handle cancel accounts bulk delete.
|
||||||
const handleCancelBulkDelete = useCallback(() => {
|
const handleCancelBulkDelete = useCallback(() => {
|
||||||
setBulkDelete(false);
|
setBulkDelete(false);
|
||||||
}, []);
|
}, []);
|
||||||
|
|||||||
12
client/src/containers/Media/withMediaActions.js
Normal file
12
client/src/containers/Media/withMediaActions.js
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
import {connect} from 'react-redux';
|
||||||
|
import {
|
||||||
|
submitMedia,
|
||||||
|
deleteMedia,
|
||||||
|
} from 'store/media/media.actions';
|
||||||
|
|
||||||
|
export const mapDispatchToProps = (dispatch) => ({
|
||||||
|
requestSubmitMedia: (form, config) => dispatch(submitMedia({ form, config })),
|
||||||
|
requestDeleteMedia: (ids) => dispatch(deleteMedia({ ids })),
|
||||||
|
});
|
||||||
|
|
||||||
|
export default connect(null, mapDispatchToProps);
|
||||||
@@ -94,18 +94,43 @@ $form-check-input-indeterminate-bg-image: url("data:image/svg+xml,<svg xmlns='ht
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.bp3-datepicker-caption select{
|
|
||||||
|
.#{$ns}-html-select{
|
||||||
|
.bp3-icon-double-caret-vertical{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.bp3-datepicker-caption select{
|
||||||
&,
|
&,
|
||||||
&:hover{
|
&:hover{
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Dropdown arrow to html select and select list.
|
||||||
|
.#{$ns}-html-select::after,
|
||||||
|
.form-group--select-list .#{$ns}-button::after{
|
||||||
|
content: '';
|
||||||
|
display: inline-block;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-left: 4px solid transparent;
|
||||||
|
border-right: 4px solid transparent;
|
||||||
|
border-top: 5px solid #8d8d8d;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 50%;
|
||||||
|
margin-top: -2px;
|
||||||
|
margin-right: 12px;
|
||||||
|
border-radius: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
.form-group--select-list{
|
.form-group--select-list{
|
||||||
|
|
||||||
.#{$ns}-icon-caret-down{
|
.#{$ns}-button{
|
||||||
color: #8D8D8D;
|
color: #8D8D8D;
|
||||||
|
position: relative;
|
||||||
|
padding-right: 25px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.bp3-fill{
|
&.bp3-fill{
|
||||||
|
|||||||
Reference in New Issue
Block a user