From 8f45736b1bd74679721cd311e9a2ed306d2395f2 Mon Sep 17 00:00:00 2001
From: Laurent Dinclaux <laurent@gecka.nc>
Date: Tue, 12 May 2026 17:02:32 +1100
Subject: [PATCH] fix(skins): keep menu links visible and align native select
 look
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The wrapper had width:100% which pushed the right-side menu links
(mail/contacts/settings/logout) out of #taskbar in Classic, and the
global custom select styling defeated Roundcube's native select
rendering — even when reset — because any background-image on a
<select> disables the native gradient/rounded corners.

- Scope the custom appearance/SVG-chevron CSS to Elastic and Larry
- Add a Classic-specific rule (width:auto, max-width, -2px nudge) that
  preserves Roundcube's native select look in #taskbar
- Drop the inline padding:0 imposed by the PHP renderer; let CSS own it
- Cap the Larry wrapper width to keep .button-logout in flow, and move
  the Larry-only styling out of the JS into the scoped CSS rule

Fixes #1
---
 ident_switch-switch.js |  7 +------
 ident_switch.css       | 38 ++++++++++++++++++++++++++++++++++++--
 ident_switch.php       |  2 +-
 3 files changed, 38 insertions(+), 9 deletions(-)

diff --git a/ident_switch-switch.js b/ident_switch-switch.js
index 88028a8..ffe42c2 100644
--- a/ident_switch-switch.js
+++ b/ident_switch-switch.js
@@ -57,7 +57,7 @@ $(function() {
 });
 
 /**
- * Place switcher in Larry skin: replace username in top-right corner.
+ * Place switcher in Larry skin: replace username in top-right corner of #topline.
  */
 function plugin_switchIdent_addCbLarry($wrapper, $sw) {
 	var $topRight = $('#topline .topright');
@@ -65,11 +65,6 @@ function plugin_switchIdent_addCbLarry($wrapper, $sw) {
 		return false;
 	}
 
-	$sw.css({
-		'font-weight': 'bold',
-		'text-overflow': 'ellipsis'
-	});
-
 	$topRight.find('.username').hide();
 	$topRight.prepend($wrapper);
 	return true;
diff --git a/ident_switch.css b/ident_switch.css
index 9628852..6c3a3a3 100644
--- a/ident_switch.css
+++ b/ident_switch.css
@@ -15,8 +15,12 @@
 	width: 100%;
 }
 
-/* Account switcher <select>: hide native arrow, show SVG chevron */
-.ident-switch-wrapper select {
+/* Account switcher <select>: hide native arrow, show SVG chevron.
+   Scoped to Elastic (.header-title.username) and Larry (#topline .topright) where
+   the switcher replaces a styled header label; Classic uses Roundcube's native
+   select rendering instead (see #taskbar rule below). */
+.header-title.username .ident-switch-wrapper select,
+#topline .topright .ident-switch-wrapper select {
 	cursor: pointer;
 	-webkit-appearance: none;
 	-moz-appearance: none;
@@ -53,6 +57,36 @@
 	display: none;
 }
 
+/* Larry skin: blend the <select> into the dark #topline header (Larry styles a
+   <span> here, not a <select>, so without these the native white control sticks
+   out on the dark background). */
+#topline .topright .ident-switch-wrapper {
+	width: auto;
+}
+#topline .topright .ident-switch-wrapper select {
+	background-color: transparent;
+	border: none;
+	box-shadow: none;
+	color: inherit;
+	font-weight: bold;
+	padding: 0 1.2em 0 0.25em;
+	text-overflow: ellipsis;
+}
+
+/* Classic skin: switcher is prepended inside #taskbar (right-aligned, nowrap, 24px tall).
+   Drop width:100% so it sits inline before the menu links instead of pushing them
+   off-screen. The select keeps Roundcube's default native rendering. */
+#taskbar > .ident-switch-wrapper {
+	width: auto;
+	vertical-align: middle;
+	margin-right: 8px;
+}
+#taskbar > .ident-switch-wrapper select {
+	max-width: 180px;
+	position: relative;
+	top: -2px;
+}
+
 /* Unread badge */
 .ident-switch-badge {
 	flex-shrink: 0;
diff --git a/ident_switch.php b/ident_switch.php
index e444876..f62c9de 100644
--- a/ident_switch.php
+++ b/ident_switch.php
@@ -222,7 +222,7 @@ class ident_switch extends rcube_plugin
 
         $select = new html_select([
             'id' => 'plugin-ident_switch-account',
-            'style' => 'display: none; padding: 0;',
+            'style' => 'display: none;',
             'onchange' => 'plugin_switchIdent_switch(this.value);',
         ]);
         $select->add($accNames, $accValues);