[FIX] web,website,point_of_sale: settings' header alignment

This commit is a follow-up of odoo/odoo@bb819f6a5c.

Even if the fix above worked around having the settinggs header's
content out of screen on smaller screen, the solution was ugly and was
meant to be improved later on.

This commit reworks the HeaderSetting's template and simplifies it to
properly fix this issue.

closes odoo/odoo#110530

X-original-commit: 0ab079664e380e5e77440e290ec604e3830108bb
Signed-off-by: Adrien Dieudonné (adr) <adr@odoo.com>
This commit is contained in:
Pierre Paridans
2023-01-20 21:56:45 +01:00
parent 49c94a3773
commit 93790839b6
4 changed files with 21 additions and 27 deletions
@@ -20,8 +20,8 @@
<app data-string="Point of sale" string="Point of Sale" name="point_of_sale" groups="point_of_sale.group_pos_manager">
<setting type="header" string="Point of Sale">
<field name="pos_config_id" class="col" options="{'no_open': True, 'no_create': True}" title="Settings on this page will apply to this point of sale."/>
<button name="action_pos_config_create_new" type="object" string="+ New Shop" class="col btn-link ms-2 text-nowrap" style="line-height: 0.5;"/>
<field name="pos_config_id" options="{'no_open': True, 'no_create': True}" title="Settings on this page will apply to this point of sale."/>
<button name="action_pos_config_create_new" type="object" string="+ New Shop" class="btn btn-link"/>
</setting>
<div class="o_view_nocontent" attrs="{'invisible': [('pos_config_id', '!=', False)]}">
@@ -1,19 +1,13 @@
<?xml version="1.0" encoding="UTF-8"?>
<templates xml:space="preserve">
<t t-name="web.HeaderSetting" owl="1">
<div class="app_settings_header row my-0 ms-0 mw-100 bg-warning bg-opacity-25">
<div class="col-xs-12 col-md-6 ms-0 o_setting_box">
<div class="o_setting_right_pane border-start-0 ms-0 ps-0">
<div class="content-group">
<div class="row flex-row flex-nowrap mt8 align-items-center">
<label class="o_form_label col ps-0 text-nowrap" t-att-for="props.fieldId" >
<t t-esc="labelString"/>
</label>
<t t-slot="fieldSlot"/>
<t t-slot="default"/>
</div>
</div>
</div>
<div class="app_settings_header d-flex flex-column flex-md-row align-items-baseline gap-1 gap-md-5 py-3 bg-warning bg-opacity-25">
<label class="o_form_label" t-att-for="props.fieldId">
<t t-esc="labelString"/>
</label>
<div class="input-group align-items-baseline w-auto o_field_highlight">
<t t-slot="fieldSlot"/>
<t t-slot="default"/>
</div>
</div>
</t>
@@ -74,7 +74,7 @@ QUnit.module("SettingsFormView", (hooks) => {
<app string="CRM" name="crm">
<setting type="header" string="Foo">
<field name="foo" title="Foo?."/>
<button name="nameAction" type="object" string="Button" class="col-auto btn-link ms-2 text-nowrap" style="line-height: 0.5;"/>
<button name="nameAction" type="object" string="Button" class="btn btn-link"/>
</setting>
<block title="Title of group Bar">
<setting help="this is bar" documentation="/applications/technical/web/settings/this_is_a_test.html">
@@ -137,7 +137,7 @@ QUnit.module("SettingsFormView", (hooks) => {
);
assert.containsOnce(
target,
".app_settings_block:not(.d-none) .app_settings_header .o_setting_box"
".app_settings_block:not(.d-none) .app_settings_header"
);
const docLinks = [...target.querySelectorAll(".o_setting_box a")];
assert.strictEqual(docLinks.length, 2);
@@ -159,7 +159,7 @@ QUnit.module("SettingsFormView", (hooks) => {
);
assert.containsNone(
target,
".app_settings_block:not(.d-none) .app_settings_header .o_setting_box"
".app_settings_block:not(.d-none) .app_settings_header"
);
await editSearch(target, "b");
@@ -184,7 +184,7 @@ QUnit.module("SettingsFormView", (hooks) => {
);
assert.containsOnce(
target,
".app_settings_block:not(.d-none) .app_settings_header .o_setting_box"
".app_settings_block:not(.d-none) .app_settings_header"
);
await editSearch(target, "Big");
@@ -203,7 +203,7 @@ QUnit.module("SettingsFormView", (hooks) => {
);
assert.containsOnce(
target,
".app_settings_block:not(.d-none) .app_settings_header .o_setting_box"
".app_settings_block:not(.d-none) .app_settings_header"
);
await editSearch(target, "Manage Us");
@@ -222,7 +222,7 @@ QUnit.module("SettingsFormView", (hooks) => {
);
assert.containsOnce(
target,
".app_settings_block:not(.d-none) .app_settings_header .o_setting_box"
".app_settings_block:not(.d-none) .app_settings_header"
);
await editSearch(target, "group Bar");
@@ -236,7 +236,7 @@ QUnit.module("SettingsFormView", (hooks) => {
);
assert.containsOnce(
target,
".app_settings_block:not(.d-none) .app_settings_header .o_setting_box"
".app_settings_block:not(.d-none) .app_settings_header"
);
await editSearch(target, "different");
@@ -250,7 +250,7 @@ QUnit.module("SettingsFormView", (hooks) => {
);
assert.containsOnce(
target,
".app_settings_block:not(.d-none) .app_settings_header .o_setting_box"
".app_settings_block:not(.d-none) .app_settings_header"
);
await editSearch(target, "bx");
@@ -262,7 +262,7 @@ QUnit.module("SettingsFormView", (hooks) => {
);
assert.containsNone(
target,
".app_settings_block:not(.d-none) .app_settings_header .o_setting_box"
".app_settings_block:not(.d-none) .app_settings_header"
);
await editSearch(target, "Fo");
@@ -281,7 +281,7 @@ QUnit.module("SettingsFormView", (hooks) => {
);
assert.containsOnce(
target,
".app_settings_block:not(.d-none) .app_settings_header .o_setting_box"
".app_settings_block:not(.d-none) .app_settings_header"
);
await editSearch(target, "Hide");
@@ -300,7 +300,7 @@ QUnit.module("SettingsFormView", (hooks) => {
);
assert.containsNone(
target,
".app_settings_block:not(.d-none) .app_settings_header .o_setting_box"
".app_settings_block:not(.d-none) .app_settings_header"
);
});
@@ -22,7 +22,7 @@
<app data-string="Website" string="Website" name="website" groups="website.group_website_designer">
<setting type="header" string="Settings of Website">
<field name="website_id" options="{'no_open': True, 'no_create': True}" title="Settings on this page will apply to this website"/>
<button name="action_website_create_new" type="object" string="+ New Website" class="col-auto btn-link ms-2 text-nowrap" style="line-height: 0.5;"/>
<button name="action_website_create_new" type="object" string="+ New Website" class="btn btn-link"/>
</setting>
<block title="Website Info" id="website_info_settings">
<setting>