Display more profiles on the profile drop-down list, v2 (fixed for lo…

…w 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 <[email protected]> * Update src/renderer/components/ft-profile-selector/ft-profile-selector.css Co-authored-by: PikachuEXE <[email protected]> * Update src/renderer/components/ft-profile-selector/ft-profile-selector.css Co-authored-by: PikachuEXE <[email protected]> --------- Co-authored-by: PikachuEXE <[email protected]>
FreeTubeApp · Nov 22, 2023 · 62e7b43 · 62e7b43
1 parent 7b8d360
commit 62e7b43
Showing 1 changed file with 16 additions and 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
@@ -27,16 +27,30 @@
   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);
 }
 
 .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 {