CodeCow/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2026-07-03 21:10:12 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

popover: Fix too wide popup on narrow viewport.

Browse Source 
Fixes #36141.
This commit is contained in:
Therese Selberg 2025-09-22 15:39:43 +02:00 committed by Tim Abbott
parent bff08e6bb8
commit e5c0d06481
2 changed files with 22 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
web/styles/zulip.css
View File

@ -298,16 +298,23 @@ p.n-margin {
}
}
#feedback_container {
display: none;
#feedback-container-content-wrapper {
position: fixed;
left: 50%;
transform: translateX(-50%);
width: 400px;
top: 0;
left: calc(50vw - 220px);
max-width: calc(100% - 20px);
padding: 15px;
background-color: var(--color-background-modal);
border-radius: 5px;
box-shadow: 0 0 30px hsl(0deg 0% 0% / 25%);
box-sizing: border-box;
}
#feedback_container {
display: none;
position: fixed;
width: 100%;
z-index: 110;
@container app (width < $cq_md_min) {

20
web/templates/feedback_container.hbs
View File

@ -1,11 +1,13 @@
<div class="float-header">
<h3 class="light no-margin small-line-height float-left feedback_title"></h3>
<div class="feedback-button-container">
{{#if has_undo_button}}
{{> components/action_button intent="neutral" attention="quiet" custom_classes="feedback_undo"}}
{{/if}}
{{> ./components/icon_button intent="neutral" custom_classes="exit-me" icon="close"}}
<div id="feedback-container-content-wrapper">
<div class="float-header">
<h3 class="light no-margin small-line-height float-left feedback_title"></h3>
<div class="feedback-button-container">
{{#if has_undo_button}}
{{> components/action_button intent="neutral" attention="quiet" custom_classes="feedback_undo"}}
{{/if}}
{{> ./components/icon_button intent="neutral" custom_classes="exit-me" icon="close"}}
</div>
<div class="float-clear"></div>
</div>
<div class="float-clear"></div>
<p class="n-margin feedback_content"></p>
</div>
<p class="n-margin feedback_content"></p>