2023-05-16 12:46:14 -04:00
|
|
|
@mixin chat-height($inset: 0px) {
|
2023-05-15 09:53:18 -04:00
|
|
|
// desktop and mobile
|
2024-01-30 08:18:00 -05:00
|
|
|
// -1px is for the bottom border of the chat navbar
|
2024-02-01 04:24:44 -05:00
|
|
|
$base-height: calc(
|
2024-10-31 09:50:01 -04:00
|
|
|
var(--composer-vh, 1vh) * 100 - var(--main-outlet-offset, 0px) - 1px -
|
|
|
|
$inset
|
2023-05-15 09:53:18 -04:00
|
|
|
);
|
|
|
|
|
2024-02-01 04:24:44 -05:00
|
|
|
height: calc($base-height - var(--composer-height, 0px));
|
|
|
|
|
2023-05-15 09:53:18 -04:00
|
|
|
// mobile with keyboard opened
|
2024-02-01 04:24:44 -05:00
|
|
|
html.keyboard-visible & {
|
|
|
|
height: calc($base-height);
|
2023-05-15 09:53:18 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
// ipad
|
2024-02-01 04:24:44 -05:00
|
|
|
html.footer-nav-ipad & {
|
|
|
|
height: calc($base-height - var(--composer-height, 0px));
|
|
|
|
}
|
|
|
|
|
|
|
|
// PWA/HUB without keyboard
|
|
|
|
html.footer-nav-visible:not(.keyboard-visible) & {
|
2024-11-07 21:16:15 -05:00
|
|
|
height: calc(
|
|
|
|
$base-height - var(--composer-height, 0px) - var(--footer-nav-height, 0px)
|
|
|
|
);
|
2023-05-15 09:53:18 -04:00
|
|
|
}
|
|
|
|
}
|