From 6fc6f075726e2eb86705910903eb618f6d76408d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?M=C3=A9ven=20Car?= <meven.car@collabora.com>
Date: Mon, 6 May 2024 17:17:51 +0200
Subject: [PATCH] UI: improve combobox appearence
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Since f7491e1f62de5401529db40b8b899e5c0563badc all combobox started
having a with and min-width of 100px, this wasn't meant to be.
Restrict this width setting to .jsDialog.

Add 5 px left padding to combobox, this looks better.

Set the font combobox width to 5em instead of 50px.

Signed-off-by: Méven Car <meven.car@collabora.com>
Change-Id: I0f0247471376e4633f3bbffab89285e16f78cde9
---
 browser/css/jsdialogs.css   | 4 ++--
 browser/css/notebookbar.css | 5 ++++-
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/browser/css/jsdialogs.css b/browser/css/jsdialogs.css
index e108eed4cf..1914a656fa 100644
--- a/browser/css/jsdialogs.css
+++ b/browser/css/jsdialogs.css
@@ -753,8 +753,6 @@ input[type='number']:hover::-webkit-outer-spin-button {
 	-webkit-appearance: none;
 	-moz-appearance: none;
 	appearance: none;
-	min-width: 100px;
-	width: 100%;
 	height: 28px;
 	line-height: normal;
 	font-size: var(--default-font-size);
@@ -768,6 +766,8 @@ input[type='number']:hover::-webkit-outer-spin-button {
 .jsdialog-window .ui-combobox,
 .jsdialog-window .ui-timefield {
 	height: 32px;/* Use the same height as in .jsdialog.ui-edit */
+	min-width: 100px;
+	width: 100%;
 }
 
 .ui-listbox option {
diff --git a/browser/css/notebookbar.css b/browser/css/notebookbar.css
index 0e64cdebd9..8be85a9f33 100644
--- a/browser/css/notebookbar.css
+++ b/browser/css/notebookbar.css
@@ -379,12 +379,15 @@ button.ui-tab.notebookbar {
 }
 
 #fontsizecombobox.notebookbar {
-	width: 50px !important;
+	width: 5em;
 }
 
 .notebookbar.ui-combobox * {
 	line-height: 22px;
 }
+.ui-combobox-content {
+	padding-inline: 5px;
+}
 
 /* Styles preview */