Fix: Dropdown width issue fixes by using fit-content (#2048)
* Dropdown width issue fixes by using fit-content * Review fixes * Review fixes * Review fixes * Review fixes Co-authored-by: Nithin David Thomas <webofnithin@gmail.com>
This commit is contained in:
parent
28fb6469a3
commit
98f4a2f6f3
5 changed files with 12 additions and 3 deletions
|
@ -1,6 +1,7 @@
|
||||||
.dropdown-pane {
|
.dropdown-pane {
|
||||||
@include elegant-card;
|
@include elegant-card;
|
||||||
@include border-light;
|
@include border-light;
|
||||||
|
width: fit-content;
|
||||||
z-index: 999;
|
z-index: 999;
|
||||||
|
|
||||||
&.dropdown-pane--open {
|
&.dropdown-pane--open {
|
||||||
|
|
|
@ -67,12 +67,15 @@
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: var(--color-background-light);
|
||||||
|
}
|
||||||
|
|
||||||
.dropdown-pane {
|
.dropdown-pane {
|
||||||
bottom: 6rem;
|
bottom: 6rem;
|
||||||
display: block;
|
display: block;
|
||||||
left: 5rem;
|
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
width: 80%;
|
width: fit-content;
|
||||||
}
|
}
|
||||||
|
|
||||||
.active {
|
.active {
|
||||||
|
|
|
@ -170,6 +170,7 @@ export default {
|
||||||
.status-change {
|
.status-change {
|
||||||
.dropdown-pane {
|
.dropdown-pane {
|
||||||
top: -132px;
|
top: -132px;
|
||||||
|
right: var(--space-normal);
|
||||||
}
|
}
|
||||||
|
|
||||||
.status-items {
|
.status-items {
|
||||||
|
|
|
@ -80,3 +80,8 @@ export default {
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.dropdown-pane {
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
|
@ -112,7 +112,6 @@ export default {
|
||||||
.dropdown-pane {
|
.dropdown-pane {
|
||||||
right: var(--space-minus-small);
|
right: var(--space-minus-small);
|
||||||
top: 48px;
|
top: 48px;
|
||||||
width: auto;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.icon {
|
.icon {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue