refactor: Adjust floating panel positioning and styling by removing absolute positioning, adding backdrop blur, and refining width and margin properties.

This commit is contained in:
2025-11-28 20:53:44 +01:00
parent 41555bb57d
commit d7811b7c7a
+10 -15
View File
@@ -67,22 +67,18 @@
.panel-floating-region { .panel-floating-region {
position: sticky; position: sticky;
top: 0.5rem;
display: flex;
justify-content: center;
pointer-events: none; pointer-events: none;
z-index: 20000; z-index: 20000;
height: 0; height: 0;
width: calc(100% - 2rem); width: 100%;
margin: 0 1rem; display: flex;
justify-content: center;
} }
.panel-floating { .panel-floating {
position: absolute; background: color-mix(in oklch, var(--surface) 70%, transparent);
top: 0; backdrop-filter: blur(12px);
left: 50%; -webkit-backdrop-filter: blur(12px);
transform: translateX(-50%);
background: color-mix(in oklch, var(--surface) 100%, transparent);
border: 1px solid color-mix(in oklch, var(--border) 95%, transparent); border: 1px solid color-mix(in oklch, var(--border) 95%, transparent);
padding: 0.45rem 0.85rem; padding: 0.45rem 0.85rem;
border-radius: 1rem; border-radius: 1rem;
@@ -91,17 +87,16 @@
color: var(--fg); color: var(--fg);
box-shadow: 0 6px 24px color-mix(in oklch, var(--shadow-soft) 55%, transparent); box-shadow: 0 6px 24px color-mix(in oklch, var(--shadow-soft) 55%, transparent);
pointer-events: auto; pointer-events: auto;
display: inline-flex; display: flex;
min-height: 1.5rem;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
flex-wrap: nowrap; flex-wrap: nowrap;
gap: 0.75rem; gap: 0.75rem;
z-index: 950000; z-index: 950000;
width: auto; margin: 0 1rem;
max-width: min(640px, calc(100% - 2rem));
margin: 0 auto;
min-width: 0;
overflow: visible; overflow: visible;
flex: 0 1 auto;
} }
.documents-main--overlay-detail .panel-floating-region { .documents-main--overlay-detail .panel-floating-region {