diff --git a/components/common/DialogFooter/index.module.scss b/components/common/DialogFooter/index.module.scss
index 1470f420..9f29d949 100644
--- a/components/common/DialogFooter/index.module.scss
+++ b/components/common/DialogFooter/index.module.scss
@@ -11,6 +11,7 @@
justify-content: space-between;
padding: ($unit * 1.5) ($unit * $multiplier) $unit-3x;
position: sticky;
+ transition: box-shadow 0.1s ease-out, border-top 0.1s ease-out;
.left,
.right {
diff --git a/components/party/EditPartyModal/index.module.scss b/components/party/EditPartyModal/index.module.scss
index 229e15ba..b8d757c3 100644
--- a/components/party/EditPartyModal/index.module.scss
+++ b/components/party/EditPartyModal/index.module.scss
@@ -9,7 +9,6 @@
display: flex;
flex-direction: column;
flex-grow: 1;
- gap: $unit-2x;
height: 100%;
overflow: hidden;
diff --git a/components/party/EditPartyModal/index.tsx b/components/party/EditPartyModal/index.tsx
index d75daa39..cd2afe07 100644
--- a/components/party/EditPartyModal/index.tsx
+++ b/components/party/EditPartyModal/index.tsx
@@ -246,16 +246,21 @@ const EditPartyModal = ({
const calculateFooterShadow = debounce(() => {
const boxShadowBase = '0 -2px 8px'
- const scrollable = document.querySelector(`.${styles.scrollValue}`)
+ const scrollable = document.querySelector(`.${styles.scrollable}`)
const footer = footerRef
if (footer && footer.current) {
- if (scrollable && scrollable.clientHeight >= scrollable.scrollHeight) {
+ if (scrollable) {
+ if (scrollable.clientHeight >= scrollable.scrollHeight) {
+ footer.current.style.boxShadow = `${boxShadowBase} rgba(0, 0, 0, 0)`
+ footer.current.style.borderTopColor = `rgba(0, 0, 0, 0)`
+ } else {
+ footer.current.style.boxShadow = `${boxShadowBase} rgba(0, 0, 0, 0.16)`
+ footer.current.style.borderTopColor = `rgba(0, 0, 0, 0.24)`
+ }
+ } else {
footer.current.style.boxShadow = `${boxShadowBase} rgba(0, 0, 0, 0)`
footer.current.style.borderTopColor = `rgba(0, 0, 0, 0)`
- } else {
- footer.current.style.boxShadow = `${boxShadowBase} rgba(0, 0, 0, 0.16)`
- footer.current.style.borderTopColor = `rgba(0, 0, 0, 0.24)`
}
}
}, 100)
@@ -566,8 +571,6 @@ const EditPartyModal = ({
{props.children}