From: Shannon Sterz <s.sterz@proxmox.com>
To: yew-devel@lists.proxmox.com
Subject: [PATCH yew-widget-toolkit-assets 1/3] dropdown: add class for dropup mode
Date: Mon, 4 May 2026 16:39:09 +0200 [thread overview]
Message-ID: <20260504143911.288747-2-s.sterz@proxmox.com> (raw)
In-Reply-To: <20260504143911.288747-1-s.sterz@proxmox.com>
a dropup is a dropdown that is rendered above the corresponding input
element. in such scenarios reversing the column flex direction is
desirable for better ux. for example, if a `Combobox` specifies a
filter, this would now render the filter box closer to the dropdown's
input element instead of on top of the dropdown list.
this is part of the fix outlined in [1] and makes dropdowns more
adaptive respective to how they can be rendered. the `!important` is
needed to override `.pwt-flex-direction-column` as it also uses
`!important` already.
[1]:
https://git.proxmox.com/?p=proxmox-datacenter-manager.git;a=commit;f=ui/css/desktop-yew-style.scss;h=dafa21a3
Signed-off-by: Shannon Sterz <s.sterz@proxmox.com>
---
Notes:
this came up in peat which now also has a couple of really long
comboboxes. affecting ux detrimentally. so move the stop-gap here to
at least have a consistent experience.
scss/_dropdown.scss | 4 ++++
1 file changed, 4 insertions(+)
diff --git a/scss/_dropdown.scss b/scss/_dropdown.scss
index 671b872..ca113e2 100644
--- a/scss/_dropdown.scss
+++ b/scss/_dropdown.scss
@@ -15,3 +15,7 @@
.pwt-dropdown[data-show] {
display: flex;
}
+
+.pwt-dropup > .pwt-flex-direction-column {
+ flex-direction: column-reverse !important;
+}
--
2.47.3
next prev parent reply other threads:[~2026-05-04 14:39 UTC|newest]
Thread overview: 8+ messages / expand[flat|nested] mbox.gz Atom feed top
2026-05-04 14:39 [RFC yew-comp/yew-widget-toolkit/yew-widget-toolkit-assets 0/3] minor ui/ux tweaks for pwt and yew-comp Shannon Sterz
2026-05-04 14:39 ` Shannon Sterz [this message]
2026-05-04 14:39 ` [PATCH yew-widget-toolkit 2/3] dropdown/align: make the picker render above or below a dropdown Shannon Sterz
2026-05-04 14:39 ` [PATCH yew-comp 3/3] task_viewer/syslog: make padding margin to improve ux Shannon Sterz
2026-05-06 7:53 ` [RFC yew-comp/yew-widget-toolkit/yew-widget-toolkit-assets 0/3] minor ui/ux tweaks for pwt and yew-comp Dominik Csapak
2026-05-06 9:43 ` Shannon Sterz
2026-05-06 9:55 ` Dominik Csapak
2026-05-06 9:56 ` Superseded: " Shannon Sterz
Reply instructions:
You may reply publicly to this message via plain-text email
using any one of the following methods:
* Save the following mbox file, import it into your mail client,
and reply-to-all from there: mbox
Avoid top-posting and favor interleaved quoting:
https://en.wikipedia.org/wiki/Posting_style#Interleaved_style
* Reply using the --to, --cc, and --in-reply-to
switches of git-send-email(1):
git send-email \
--in-reply-to=20260504143911.288747-2-s.sterz@proxmox.com \
--to=s.sterz@proxmox.com \
--cc=yew-devel@lists.proxmox.com \
/path/to/YOUR_REPLY
https://kernel.org/pub/software/scm/git/docs/git-send-email.html
* If your mail client supports setting the In-Reply-To header
via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line
before the message body.
This is an external index of several public inboxes,
see mirroring instructions on how to clone and mirror
all data and code used by this external index.