pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[IMP] website: review 's_hr' snippet

Browse Source 
To fit the general look&like of the left panel, the size elements should be
handled with an input to allow full control.

Part of https://github.com/odoo/odoo/pull/42937
task-2088157
task-2152191
This commit is contained in:
Romain Derie
2020-01-24 13:02:01 +00:00
committed by qsm-odoo
parent 7572cc150d
commit ca7bb63ebd
2 changed files with 16 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/website/static/src/snippets/s_hr/000.scss
+1 -15
View File
@@ -4,21 +4,7 @@
hr {
padding: 0;
border: 0;
border-top-color: inherit;
border-top: 1px solid inherit;
margin: 0;
}
// Style
.s_hr_dashed { border-top-style: dashed; }
.s_hr_double { border-top-style: double; }
.s_hr_dotted { border-top-style: dotted; }
.s_hr_solid { border-top-style: solid; }
// Thickness
$count: 5;
$base-width: 1px;
@while $count > 0 {
.s_hr_#{$base-width * $count} {
border-top-width: $base-width * $count;
}
$count: $count - 1;
}
}
addons/website/views/snippets/s_hr.xml
+15 -16
View File
@@ -3,28 +3,27 @@
<template id="s_hr" name="Separator">
<div class="s_hr text-left pt32 pb32">
<hr class="s_hr_1px s_hr_solid border-600 w-100 mx-auto"/>
<hr class="border-600 w-100 mx-auto" style="border-top-width: 1px; border-top-style: solid;"/>
</div>
</template>
<template id="s_hr_options" inherit_id="website.snippet_options">
<xpath expr="." position="inside">
<div data-selector=".s_hr" data-target="hr">
<we-colorpicker string="Color"
data-select-style="true"
data-css-property="border-color"
data-color-prefix="border-"
data-excluded="transparent_grayscale"/>
<we-select string="Thickness">
<t t-foreach="range(1,6)" t-as="s_hr_thickness">
<we-button t-attf-data-select-class="s_hr_{{s_hr_thickness}}px"><t t-esc="s_hr_thickness"/>px</we-button>
</t>
</we-select>
<we-select string="Style">
<we-button data-select-class="s_hr_solid">Solid</we-button>
<we-button data-select-class="s_hr_dashed">Dashed</we-button>
<we-button data-select-class="s_hr_dotted">Dotted</we-button>
<we-button data-select-class="s_hr_double">Double</we-button>
<we-row string="Thickness" class="o_we_inline">
<we-colorpicker
data-select-style="true"
data-css-property="border-color"
data-color-prefix="border-"
data-excluded="transparent_grayscale"/>
<we-input data-unit="px" data-select-style="1px"
data-css-property="border-top-width"/>
</we-row>
<we-select string="Style" data-css-property="border-top-style">
<we-button data-select-style="solid">Solid</we-button>
<we-button data-select-style="dashed">Dashed</we-button>
<we-button data-select-style="dotted">Dotted</we-button>
<we-button data-select-style="double">Double</we-button>
</we-select>
<we-select string="Width">
<we-button data-select-class="w-25">25%</we-button>