discourse/plugins/chat/assets/stylesheets/common/chat-height-mixin.scss
Joffrey JAFFEUX 4b15ba405c
FIX: moves chat height computation to a mixin (#21555)
This commit also removes safe-area-inset-bottom when keyboard is displayed to avoid having a taller than needed space between composer and replying indicator.
2023-05-15 15:53:18 +02:00

40 lines
1.1 KiB
SCSS

@mixin chat-height {
// desktop and mobile
height: calc(
var(--chat-vh, 1vh) * 100 - var(--header-offset, 0px) -
var(--chat-draft-header-height, 0px) -
var(--chat-direct-message-creator-height, 0px) -
env(safe-area-inset-bottom)
);
// mobile with keyboard opened
.keyboard-visible & {
height: calc(
var(--chat-vh, 1vh) * 100 - var(--header-offset, 0px) -
var(--chat-draft-header-height, 0px) -
var(--chat-direct-message-creator-height, 0px)
);
}
// ipad
.footer-nav-ipad & {
height: calc(
var(--chat-vh, 1vh) * 100 - var(--header-offset, 0px) -
var(--footer-nav-height, 0px) - var(--chat-draft-header-height, 0px) -
var(--chat-direct-message-creator-height, 0px) -
env(safe-area-inset-bottom)
);
}
// ipad with keyboard opened
.keyboard-visible & {
.footer-nav-ipad & {
height: calc(
var(--chat-vh, 1vh) * 100 - var(--header-offset, 0px) -
var(--footer-nav-height, 0px) - var(--chat-draft-header-height, 0px) -
var(--chat-direct-message-creator-height, 0px)
);
}
}
}