You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
145 lines
8.7 KiB
145 lines
8.7 KiB
<?xml version="1.0" encoding="utf-8"?>
|
|
<odoo>
|
|
<template id="no-js_fallback" inherit_id="website.layout">
|
|
<xpath expr="//head" position="inside">
|
|
<noscript id="o_animate-no-js_fallback">
|
|
<style type="text/css">
|
|
.o_animate {
|
|
/* If no js - force elements rendering */
|
|
visibility:visible;
|
|
|
|
/* If browser support css animations support - reset animation */
|
|
-webkit-animation-name: none-dummy;
|
|
animation-name: none-dummy;
|
|
}
|
|
</style>
|
|
</noscript>
|
|
</xpath>
|
|
</template>
|
|
|
|
<template id="o_animate_options" inherit_id="website.snippet_options">
|
|
<xpath expr="." position="inside">
|
|
<t t-set="o_animate_elements" t-value="['.o_animable', 'section', 'img', '.fa', '[class^=\'col-md\']', '.btn']"/>
|
|
<t t-set="o_animate_selector" t-value="', '.join(o_animate_elements)"/>
|
|
<div data-js="o_animate"
|
|
t-att-data-selector="o_animate_selector"
|
|
data-exclude=".o_not-animable">
|
|
<we-collapse-area class="o_anim_li">
|
|
<we-toggler><i class="fa fa-fw fa-bolt"/> Animate</we-toggler>
|
|
<we-collapse>
|
|
<we-button data-select-class="">Disable animation</we-button>
|
|
<we-divider/>
|
|
<we-collapse-area class="o_anim_entrance-fading_li">
|
|
<we-toggler>Fading</we-toggler>
|
|
<we-collapse>
|
|
<we-button data-select-class="o_anim_fade_in">Fade In</we-button>
|
|
<we-button data-select-class="o_anim_fade_in_down">Fade In-Down</we-button>
|
|
<we-button data-select-class="o_anim_fade_in_left">Fade In-Left</we-button>
|
|
<we-button data-select-class="o_anim_fade_in_right">Fade In-Right</we-button>
|
|
<we-button data-select-class="o_anim_fade_in_up">Fade In-Up</we-button>
|
|
</we-collapse>
|
|
</we-collapse-area>
|
|
<we-collapse-area class="o_anim_entrance-bounce_li">
|
|
<we-toggler>Bouncing</we-toggler>
|
|
<we-collapse>
|
|
<we-button data-select-class="o_anim_bounce_in">Bounce In</we-button>
|
|
<we-button data-select-class="o_anim_bounce_in_down">Bounce In-Down</we-button>
|
|
<we-button data-select-class="o_anim_bounce_in_left">Bounce In-Left</we-button>
|
|
<we-button data-select-class="o_anim_bounce_in_right">Bounce In-Right</we-button>
|
|
</we-collapse>
|
|
</we-collapse-area>
|
|
<we-collapse-area class="o_anim_entrance-rotate_li">
|
|
<we-toggler>Rotating</we-toggler>
|
|
<we-collapse>
|
|
<we-button data-select-class="o_anim_rotate_in">Rotate In</we-button>
|
|
<we-button data-select-class="o_anim_rotate_in_down_left">Rotate In-Down-Left</we-button>
|
|
<we-button data-select-class="o_anim_rotate_in_down_right">Rotate In-Down-Right</we-button>
|
|
</we-collapse>
|
|
</we-collapse-area>
|
|
<we-collapse-area class="o_anim_effects-rotate_li">
|
|
<we-toggler>Zoom</we-toggler>
|
|
<we-collapse>
|
|
<we-button data-select-class="o_anim_zoom_in">Zoom In</we-button>
|
|
<we-button data-select-class="o_anim_zoom_in_down">Zoom In-Down</we-button>
|
|
<we-button data-select-class="o_anim_zoom_in_left">Zoom In-Left</we-button>
|
|
<we-button data-select-class="o_anim_zoom_in_right">Zoom In-Right</we-button>
|
|
</we-collapse>
|
|
</we-collapse-area>
|
|
<we-collapse-area class="o_anim_effects-attention_li">
|
|
<we-toggler>Attention Seekers</we-toggler>
|
|
<we-collapse>
|
|
<we-button data-select-class="o_anim_flash">Flash</we-button>
|
|
<we-button data-select-class="o_anim_pulse">Pulse</we-button>
|
|
<we-button data-select-class="o_anim_shake">Shake</we-button>
|
|
<we-button data-select-class="o_anim_tada">Tada</we-button>
|
|
</we-collapse>
|
|
</we-collapse-area>
|
|
<we-collapse-area class="o_anim_effects-flippers_li">
|
|
<we-toggler>Flippers</we-toggler>
|
|
<we-collapse>
|
|
<we-button data-select-class="o_anim_flip_in_x">Flip-In-X</we-button>
|
|
<we-button data-select-class="o_anim_flip_in_y">Flip-In-Y</we-button>
|
|
</we-collapse>
|
|
</we-collapse-area>
|
|
</we-collapse>
|
|
</we-collapse-area>
|
|
</div>
|
|
<div data-js="o_animate_duration"
|
|
t-att-data-selector="o_animate_selector"
|
|
data-exclude=".o_not-animable">
|
|
<we-collapse-area class="d-none"> <!-- Visible only if an animation is active (js) -->
|
|
<we-toggler><i class="fa fa-fw fa-hourglass-half"/> Animation Duration</we-toggler>
|
|
<we-collapse class="o_anim_ul_timing">
|
|
<span class="timeline duration">
|
|
<span>
|
|
<span simulate="delay"/>
|
|
</span>
|
|
<span>
|
|
<span simulate="duration"/>
|
|
</span>
|
|
</span>
|
|
<we-button data-select-class="o_anim_dur500">500ms</we-button>
|
|
<we-button data-select-class="">1000ms (default)</we-button>
|
|
<we-button data-select-class="o_anim_dur1500">1500ms</we-button>
|
|
<we-button data-select-class="o_anim_dur2000">2000ms</we-button>
|
|
<we-button data-select-class="o_anim_dur2500">2500ms</we-button>
|
|
<we-button data-select-class="o_anim_dur3000">3000ms</we-button>
|
|
</we-collapse>
|
|
</we-collapse-area>
|
|
</div>
|
|
<div data-js="o_animate_delay"
|
|
t-att-data-selector="o_animate_selector"
|
|
data-exclude=".o_not-animable">
|
|
<we-collapse-area class="d-none"> <!-- Visible only if an animation is active (js) -->
|
|
<we-toggler><i class="fa fa-fw fa-clock-o"/> Animation Delay</we-toggler>
|
|
<we-collapse class="o_anim_ul_timing">
|
|
<span class="timeline delay">
|
|
<span>
|
|
<span simulate="delay"/>
|
|
</span>
|
|
<span>
|
|
<span simulate="duration"/>
|
|
</span>
|
|
</span>
|
|
<we-button data-select-class="">No delay (default)</we-button>
|
|
<we-button data-select-class="o_anim_del500">500ms</we-button>
|
|
<we-button data-select-class="o_anim_del1000">1000ms</we-button>
|
|
<we-button data-select-class="o_anim_del1500">1500ms</we-button>
|
|
<we-button data-select-class="o_anim_del2000">2000ms</we-button>
|
|
<we-button data-select-class="o_anim_del2500">2500ms</we-button>
|
|
</we-collapse>
|
|
</we-collapse-area>
|
|
</div>
|
|
<div data-js="o_animate_options"
|
|
t-att-data-selector="o_animate_selector"
|
|
data-exclude=".o_not-animable">
|
|
<we-collapse-area class="d-none"> <!-- Visible only if an animation is active (js) -->
|
|
<we-toggler><i class="fa fa-fw fa-cogs"/> Animation Options</we-toggler>
|
|
<we-collapse class="o_anim_ul_options">
|
|
<we-button data-toggle-class="o_animate_both_scroll">Each time it becomes visible</we-button>
|
|
</we-collapse>
|
|
</we-collapse-area>
|
|
</div>
|
|
</xpath>
|
|
</template>
|
|
</odoo>
|