From 62e7b439db1684ac86b0be95e7b689bd2df6be63 Mon Sep 17 00:00:00 2001 From: CelularBat <105959781+CelularBat@users.noreply.github.com> Date: Wed, 22 Nov 2023 16:14:54 +0000 Subject: [PATCH] Display more profiles on the profile drop-down list, v2 (fixed for low res, fixed linter) (#4359) * Update ft-profile-selector.css Fixed for low res, fixed linter complains * Update comment to max-block-size * comment to max-block-size fixed typo * Update ft-profile-selector.css adjust for screen with horizontal navbar (mobile) * Update src/renderer/components/ft-profile-selector/ft-profile-selector.css Co-authored-by: PikachuEXE * Update src/renderer/components/ft-profile-selector/ft-profile-selector.css Co-authored-by: PikachuEXE * Update src/renderer/components/ft-profile-selector/ft-profile-selector.css Co-authored-by: PikachuEXE --------- Co-authored-by: PikachuEXE --- .../ft-profile-selector.css | 18 ++++++++++++++++-- 1 file changed, 16 insertions(+), 2 deletions(-) diff --git a/src/renderer/components/ft-profile-selector/ft-profile-selector.css b/src/renderer/components/ft-profile-selector/ft-profile-selector.css index 94ee6e91d..49d63c22a 100644 --- a/src/renderer/components/ft-profile-selector/ft-profile-selector.css +++ b/src/renderer/components/ft-profile-selector/ft-profile-selector.css @@ -27,7 +27,7 @@ inset-block-start: 60px; inset-inline-end: 10px; min-inline-size: 250px; - block-size: 400px; + block-size: auto; padding: 5px; background-color: var(--card-bg-color); box-shadow: 0 0 4px var(--scrollbar-color-hover); @@ -35,8 +35,22 @@ .profileWrapper { margin-block-start: 60px; - block-size: 340px; + block-size: auto; overflow-y: auto; + /* + profile list max height: 90% of window size - 100 px. It's scaled to be 340px on 800x600 resolution. + Offset of 100px is to compensate for the fixed size of elements above the list, which takes more screen space on lower resolutions + */ + max-block-size: calc(90vh - 100px); + min-block-size: 340px; +} + +/* Navbar changes position to horizontal with this media rule. +Height adjust for profile list so it won't cover navbar. */ +@media only screen and (max-width: 680px){ + .profileWrapper { + max-block-size: calc(95vh - 180px); + } } .profile {