summaryrefslogtreecommitdiff
path: root/addons/website/views/snippets/s_popup.xml
blob: 6dd329f42b3825ca78e893c5d0539f0d7009477e (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
<?xml version="1.0" encoding="utf-8"?>
<odoo>

<template id="s_popup" name="Popup">
    <div class="s_popup o_snippet_invisible" data-vcss="001">
        <div class="modal fade s_popup_middle"
             style="background-color: var(--black-50) !important;"
             data-show-after="5000"
             data-display="afterDelay"
             data-consents-duration="7"
             data-focus="false"
             data-backdrop="false"
             tabindex="-1"
             role="dialog">
            <div class="modal-dialog d-flex">
                <div class="modal-content oe_structure">
                    <div class="s_popup_close js_close_popup o_we_no_overlay o_not_editable" aria-label="Close">×</div>
                    <section class="s_banner oe_img_bg pt96 pb96"
                             data-snippet="s_banner"
                             style="background-image: url('/web/image/website.s_popup_default_image');">
                        <div class="container">
                            <div class="row s_nb_column_fixed">
                                <div class="col-lg-10 offset-lg-1 text-center o_cc o_cc1 jumbotron pt48 pb48">
                                    <h2><font style="font-size: 62px;">Win $20</font></h2>
                                    <p class="lead">Check out now and get $20 off your first order.</p>
                                    <a href="#" class="btn btn-primary mb-2">New customer</a>
                                </div>
                            </div>
                        </div>
                    </section>
                </div>
            </div>
        </div>
    </div>
</template>

<template id="s_popup_options" inherit_id="website.snippet_options">
    <xpath expr="." position="inside">
        <t t-set="base_popup_options">
            <we-select string="Position" data-dependencies="layout_popup_opt"> <!-- When cookie configuration only display this for popup mode -->
                <we-button data-select-class="s_popup_top" data-name="position_top">Top</we-button>
                <we-button data-select-class="s_popup_middle" data-name="position_middle">Middle</we-button>
                <we-button data-select-class="s_popup_bottom" data-name="position_bottom">Bottom</we-button>
            </we-select>
            <we-select string="Size" data-apply-to=".modal-dialog" data-name="s_popup_size_opt">
                <we-button data-select-class="modal-sm">Small</we-button>
                <we-button data-select-class="" data-name="s_popup_size_md">Medium</we-button>
                <we-button data-select-class="modal-lg">Large</we-button>
                <we-button data-select-class="modal-xl">Extra Large</we-button>
                <we-button data-select-class="s_popup_size_full" data-name="s_popup_size_full">Full</we-button>
            </we-select>
            <we-row string="Backdrop">
                <we-checkbox data-name="popup_backdrop_opt"
                             data-select-class="s_popup_no_backdrop|"
                             data-set-backdrop="true"
                             data-no-preview="true"/>
                <we-colorpicker data-dependencies="popup_backdrop_opt"
                                data-select-style="true"
                                data-css-property="background-color"
                                data-color-prefix="bg-"
                                data-css-compatible="true"/>
            </we-row>
        </t>
        <t t-set="extra_popup_options">
            <we-colorpicker string="Close Button Color"
                            data-select-style="true"
                            data-css-property="color"
                            data-color-prefix="text-"
                            data-apply-to=".s_popup_close"/>
            <we-select string="Display" data-attribute-name="display" data-attribute-default-value="always">
                <we-button data-select-data-attribute="afterDelay" data-name="show_delay">Delay</we-button>
                <we-button data-select-data-attribute="mouseExit">On Exit</we-button>
            </we-select>
            <we-input string="⌙ Delay"
                      title="Automatically opens the pop-up if the user stays on a page longer than the specified time."
                      data-select-data-attribute=""
                      data-attribute-name="showAfter"
                      data-unit="s"
                      data-save-unit="ms"
                      data-dependencies="show_delay"/>
            <t t-set="unit_popup_duration">days</t>
            <we-input string="Hide For" title="Once the user closes the popup, it won't be shown again for that period of time." t-attf-data-select-data-attribute="7#{unit_popup_duration}" data-attribute-name="consentsDuration" t-att-data-unit="unit_popup_duration"/>
            <we-select string="Show on" data-no-preview="true">
                <we-button data-move-block="moveToBody">This page</we-button>
                <we-button data-move-block="moveToFooter">All pages</we-button>
            </we-select>
        </t>
        <div data-js="SnippetPopup" data-selector=".s_popup" data-exclude="#website_cookies_bar" data-target=".modal">
            <t t-raw="base_popup_options"/>
            <t t-raw="extra_popup_options"/>
        </div>
        <div data-js="SnippetPopup" data-selector=".s_popup#website_cookies_bar" data-target=".modal">
            <t t-raw="base_popup_options"/>
        </div>
    </xpath>
</template>

<template id="assets_snippet_s_popup_css_000" inherit_id="website.assets_frontend" active="False">
    <xpath expr="//link[last()]" position="after">
        <link rel="stylesheet" type="text/scss" href="/website/static/src/snippets/s_popup/000.scss"/>
    </xpath>
</template>
<template id="assets_snippet_s_popup_css_001" inherit_id="website.assets_frontend">
    <xpath expr="//link[last()]" position="after">
        <link rel="stylesheet" type="text/scss" href="/website/static/src/snippets/s_popup/001.scss"/>
    </xpath>
</template>

<template id="assets_snippet_s_popup_js_000" inherit_id="website.assets_frontend">
    <xpath expr="//script[last()]" position="after">
        <script type="text/javascript" src="/website/static/src/snippets/s_popup/000.js"/>
    </xpath>
</template>

</odoo>