Browse Source

fix(ai-chat): move FAB above Ghostfolio's own bottom buttons

Raised bottom from 1.5rem to 5.5rem and reduced size slightly so the
Ask AI button no longer overlaps the Add Account / Add Transaction FABs
that Ghostfolio renders at the bottom-right of the screen.

Co-authored-by: Cursor <cursoragent@cursor.com>
pull/6453/head
Priyanka Punukollu 1 month ago
parent
commit
881252b7e0
  1. 21
      apps/client/src/app/components/ai-chat/ai-chat.component.scss

21
apps/client/src/app/components/ai-chat/ai-chat.component.scss

@ -4,26 +4,29 @@
.ai-fab {
position: fixed;
bottom: 1.5rem;
right: 1.5rem;
// Positioned high enough to clear Ghostfolio's own bottom FABs
// (Add Account / Add Transaction sit at ~1.5rem).
bottom: 5.5rem;
right: 1.25rem;
z-index: 1200;
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.75rem 1.25rem;
gap: 0.4rem;
padding: 0.55rem 0.9rem;
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
color: #fff;
border: none;
border-radius: 2rem;
box-shadow: 0 4px 20px rgba(99, 102, 241, 0.45);
box-shadow: 0 4px 14px rgba(99, 102, 241, 0.4);
cursor: pointer;
font-size: 0.9rem;
font-size: 0.8rem;
font-weight: 600;
transition: transform 0.2s ease, box-shadow 0.2s ease;
white-space: nowrap;
&:hover {
transform: translateY(-2px);
box-shadow: 0 6px 24px rgba(99, 102, 241, 0.55);
box-shadow: 0 6px 20px rgba(99, 102, 241, 0.55);
}
&:active {
@ -32,7 +35,7 @@
&--open {
border-radius: 50%;
padding: 0.85rem;
padding: 0.7rem;
background: #6366f1;
.ai-fab__label {
@ -41,7 +44,7 @@
}
&__icon {
font-size: 1.2rem;
font-size: 1rem;
line-height: 1;
}

Loading…
Cancel
Save