Skip to content

Commit 344cc00

Browse files
committed
buttonbar: support dropdowns in chonk
1 parent 223ccf8 commit 344cc00

File tree

2 files changed

+11
-42
lines changed

2 files changed

+11
-42
lines changed

static/app/components/actions/resolve.tsx

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -269,7 +269,7 @@ function ResolveActions({
269269
itemsHidden={shouldDisplayCta}
270270
items={items}
271271
trigger={(triggerProps, isOpen) => (
272-
<DropdownTrigger
272+
<Button
273273
{...triggerProps}
274274
size={size}
275275
priority={priority}
@@ -382,12 +382,6 @@ const ResolveButton = withChonk(
382382
`
383383
);
384384

385-
const DropdownTrigger = styled(Button)`
386-
box-shadow: none;
387-
border-radius: 0 ${p => p.theme.borderRadius} ${p => p.theme.borderRadius} 0;
388-
border-left: none;
389-
`;
390-
391385
/**
392386
* Used to hide the list items when prompting to set up releases
393387
*/

static/app/components/core/button/buttonBar.tsx

Lines changed: 10 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -33,29 +33,12 @@ const StyledButtonBar = styled('div')<{gap: ValidSize | 0; merged: boolean}>`
3333
z-index: 2;
3434
}
3535
36-
& > div:not(:last-child) > button {
37-
border-top-right-radius: 0;
38-
border-bottom-right-radius: 0;
39-
}
40-
41-
& > div:not(:first-child) > button {
42-
border-top-left-radius: 0;
43-
border-bottom-left-radius: 0;
44-
margin-left: -1px;
45-
}
46-
47-
& > div:not(:first-child):not(:last-child) > button {
48-
margin-left: -1px;
49-
}
50-
51-
& > .dropdown,
52-
& > button,
53-
& > input,
54-
& > a {
36+
& > * {
5537
position: relative;
5638
5739
/* First button is square on the right side */
58-
&:first-child:not(:last-child) {
40+
&:first-child:not(:last-child),
41+
&:first-child:not(:last-child) > button {
5942
border-top-right-radius: 0;
6043
border-bottom-right-radius: 0;
6144
@@ -66,7 +49,8 @@ const StyledButtonBar = styled('div')<{gap: ValidSize | 0; merged: boolean}>`
6649
}
6750
6851
/* Middle buttons are square */
69-
&:not(:last-child):not(:first-child) {
52+
&:not(:last-child):not(:first-child),
53+
&:not(:last-child):not(:first-child) > button {
7054
border-radius: 0;
7155
7256
& > .dropdown-actor > ${StyledButton} {
@@ -75,24 +59,14 @@ const StyledButtonBar = styled('div')<{gap: ValidSize | 0; merged: boolean}>`
7559
}
7660
7761
/* Middle buttons only need one border so we don't get a double line */
78-
&:first-child {
79-
& + .dropdown:not(:last-child),
80-
& + a:not(:last-child),
81-
& + input:not(:last-child),
82-
& + button:not(:last-child) {
83-
margin-left: -1px;
84-
}
62+
&:first-child + *:not(:last-child) {
63+
margin-left: -1px;
8564
}
8665
8766
/* Middle buttons only need one border so we don't get a double line */
8867
/* stylelint-disable-next-line no-duplicate-selectors */
89-
&:not(:last-child):not(:first-child) {
90-
& + .dropdown,
91-
& + button,
92-
& + input,
93-
& + a {
94-
margin-left: -1px;
95-
}
68+
&:not(:last-child):not(:first-child) + * {
69+
margin-left: -1px;
9670
}
9771
9872
/* Last button is square on the left side */
@@ -101,6 +75,7 @@ const StyledButtonBar = styled('div')<{gap: ValidSize | 0; merged: boolean}>`
10175
border-bottom-left-radius: 0;
10276
margin-left: -1px;
10377
78+
& > button,
10479
& > .dropdown-actor > ${StyledButton} {
10580
border-top-left-radius: 0;
10681
border-bottom-left-radius: 0;

0 commit comments

Comments
 (0)