From ccfcc27dcdebac6781e68efff08183e30cf9921b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nicolas=20=C3=89vrard?= Date: Fri, 6 Dec 2024 16:43:43 +0100 Subject: [PATCH 1/2] Set selection size according to its content [CUSTOM] Fix PCLAS-1233 --- sao/src/theme/coog/sao.less | 8 ++++++-- sao/src/view/form.js | 3 +++ 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/sao/src/theme/coog/sao.less b/sao/src/theme/coog/sao.less index 857358cc99..9004101980 100644 --- a/sao/src/theme/coog/sao.less +++ b/sao/src/theme/coog/sao.less @@ -686,8 +686,12 @@ div.form-item.form-float:has(+ div.form-item.form-label) { } } -div.form-selection select.form-control { - padding: 0px 5px 0px 5px; +div.form-selection { + max-width: 30ch; + + select.form-control { + padding: 0px 5px 0px 5px; + } } div.form-text { diff --git a/sao/src/view/form.js b/sao/src/view/form.js index 37bb70143b..2312fa9755 100644 --- a/sao/src/view/form.js +++ b/sao/src/view/form.js @@ -2719,6 +2719,7 @@ function hide_x2m_body(widget) { }); }, set_selection: function(selection, help) { + let width = 0; var select = this.select; select.empty(); for (const e of selection) { @@ -2727,7 +2728,9 @@ function hide_x2m_body(widget) { 'text': e[1], 'title': help[e[0]], })); + width = Math.max(width, e[1].length); } + this.el.css('width', `${width + 2}ch`); }, display_update_selection: function() { var record = this.record; From ff722ef3a6c33cb8b11d9e92d883fc1423bf9b99 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nicolas=20=C3=89vrard?= Date: Thu, 19 Dec 2024 16:18:35 +0100 Subject: [PATCH 2/2] Don't overflow select tag arrow with the option text https://bugs.tryton.org/13765 --- sao/src/sao.less | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/sao/src/sao.less b/sao/src/sao.less index 557b806ee7..948116ddf1 100644 --- a/sao/src/sao.less +++ b/sao/src/sao.less @@ -881,6 +881,18 @@ img.icon { } } + .form-selection { + select.form-control { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + + // size is fixed by the theme + border-right: 13px solid transparent; + background-position: right -13px center; + } + } + @media screen and (min-width: @screen-sm-min) { .form-reference { > .input-sm, > .input-group {