fix: update view options not visible (#5232)

Co-authored-by: Vishal Sharma <makeavish786@gmail.com>
This commit is contained in:
Yunus M 2024-06-15 15:53:26 +05:30 committed by GitHub
parent f824aa17dc
commit fe87711b25
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 17 additions and 14 deletions

View File

@ -1,18 +1,27 @@
.explorer-options-container {
position: fixed;
bottom: 24px;
left: calc(50% + 240px);
transform: translate(calc(-50% - 120px), 0);
transition: left 0.2s linear;
display: flex;
gap: 16px;
background-color: transparent;
}
.hide-update { .hide-update {
left: calc(50% - 72px) !important; left: calc(50% - 72px) !important;
} }
.explorer-update { .explorer-update {
position: fixed; display: inline-flex;
bottom: 24px;
left: calc(50% - 352px);
display: flex;
align-items: center; align-items: center;
gap: 12px; gap: 12px;
padding: 10px 12px; padding: 10px 12px;
border-radius: 50px; border-radius: 50px;
border: 1px solid var(--bg-slate-400); border: 1px solid var(--bg-slate-400);
background: rgba(22, 24, 29, 0.6); background: rgba(22, 24, 29, 0.6);
box-shadow: 4px 4px 16px 4px rgba(0, 0, 0, 0.25);
backdrop-filter: blur(20px); backdrop-filter: blur(20px);
.action-icon { .action-icon {
@ -38,16 +47,10 @@
} }
.explorer-options { .explorer-options {
position: fixed;
bottom: 24px;
left: calc(50% + 240px);
padding: 10px 12px; padding: 10px 12px;
transform: translate(calc(-50% - 120px), 0);
transition: left 0.2s linear;
border: 1px solid var(--bg-slate-400); border: 1px solid var(--bg-slate-400);
border-radius: 50px; border-radius: 50px;
background: rgba(22, 24, 29, 0.6); background: rgba(22, 24, 29, 0.6);
box-shadow: 4px 4px 16px 4px rgba(0, 0, 0, 0.25);
backdrop-filter: blur(20px); backdrop-filter: blur(20px);
cursor: default; cursor: default;
@ -124,7 +127,7 @@
.app-content { .app-content {
&.collapsed { &.collapsed {
.explorer-options { .explorer-options-container {
left: calc(50% + 72px); left: calc(50% + 72px);
} }
} }

View File

@ -289,7 +289,7 @@ function ExplorerOptions({
const isEditDeleteSupported = allowedRoles.includes(role as string); const isEditDeleteSupported = allowedRoles.includes(role as string);
return ( return (
<> <div className="explorer-options-container">
{isQueryUpdated && !isExplorerOptionHidden && ( {isQueryUpdated && !isExplorerOptionHidden && (
<div <div
className={cx( className={cx(
@ -493,7 +493,7 @@ function ExplorerOptions({
onExport={onExport} onExport={onExport}
/> />
</Modal> </Modal>
</> </div>
); );
} }