[REF] website: move s_hr snippet to dedicated files

This commit is contained in:
qsm-odoo
2019-12-18 01:37:11 +01:00
5 changed files with 75 additions and 68 deletions
+1
View File
@@ -42,6 +42,7 @@
'views/snippets/s_share.xml',
'views/snippets/s_rating.xml',
'views/snippets/s_btn.xml',
'views/snippets/s_hr.xml',
'views/website_views.xml',
'views/website_visitor_views.xml',
'views/res_config_settings_views.xml',
@@ -912,32 +912,6 @@ table.table_desc tr td {
}
// HR
.s_hr {
line-height: 0;
hr {
padding: 0;
border: 0;
border-top-color: 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;
}
}
//
// Layout
//
@@ -0,0 +1,24 @@
.s_hr {
line-height: 0;
hr {
padding: 0;
border: 0;
border-top-color: 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;
}
}
+50
View File
@@ -0,0 +1,50 @@
<?xml version="1.0" encoding="utf-8"?>
<odoo>
<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"/>
</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-select>
<we-select string="Width">
<we-button data-select-class="w-25">25%</we-button>
<we-button data-select-class="w-50">50%</we-button>
<we-button data-select-class="w-75">75%</we-button>
<we-button data-select-class="w-100">100%</we-button>
</we-select>
<we-select string="Alignment">
<we-button data-select-class="mr-auto">Left</we-button>
<we-button data-select-class="mx-auto">Center</we-button>
<we-button data-select-class="ml-auto">Right</we-button>
</we-select>
</div>
</xpath>
</template>
<template id="assets_snippet_s_hr_css_000" inherit_id="website.assets_frontend">
<xpath expr="//link[last()]" position="after">
<link rel="stylesheet" type="text/scss" href="/website/static/src/snippets/s_hr/000.scss"/>
</xpath>
</template>
</odoo>
@@ -1,12 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<odoo>
<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"/>
</div>
</template>
<template id="s_facebook_page" name="Facebook Page">
<div class="o_facebook_page">
<div class="o_facebook_alert alert alert-info" role="status">
@@ -693,16 +687,6 @@
data-color-prefix="bg-"/>
</div>
<!-- COLOR | .s_hr -->
<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"/>
</div>
<!-- COLOR | .s_cards -->
<div data-selector=".s_card, .accordion .card">
<we-colorpicker string="Color"
@@ -729,32 +713,6 @@
</we-select>
</div>
<!-- STYLES | .s_hr -->
<div data-selector=".s_hr" data-target="hr">
<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-select>
<we-select string="Width">
<we-button data-select-class="w-25">25%</we-button>
<we-button data-select-class="w-50">50%</we-button>
<we-button data-select-class="w-75">75%</we-button>
<we-button data-select-class="w-100">100%</we-button>
</we-select>
<we-select string="Alignment">
<we-button data-select-class="mr-auto">Left</we-button>
<we-button data-select-class="mx-auto">Center</we-button>
<we-button data-select-class="ml-auto">Right</we-button>
</we-select>
</div>
<!-- Carousel | .s_carousel | .s_quotes_carousel -->
<div data-js="Carousel"
data-selector="section"