From 93d5ace34a7fbcb92dfaf9b6174f4cae8aa97190 Mon Sep 17 00:00:00 2001 From: Brieuc-brd Date: Fri, 17 Sep 2021 09:46:16 +0000 Subject: [PATCH] [IMP] web_editor: add device shapes for images This commit adds a new category of image shapes: Devices. The purpose is to give the possibility to add images in device mockups with the image shapes. To use it correctly the image needs to be in a specific ratio depending on the shape. To help the user to have the perfect render, an average resolution is shown when hovering the thumbnail of the shape. task-2666049 closes odoo/odoo#79068 Related: odoo/design-themes#525 Signed-off-by: Quentin Smetz (qsm) --- .../image_shapes/devices/browser_01.svg | 20 ++ .../image_shapes/devices/browser_02.svg | 57 ++++ .../image_shapes/devices/browser_03.svg | 50 +++ .../devices/galaxy_3d_landscape_01.svg | 176 +++++++++++ .../devices/galaxy_3d_landscape_02.svg | 205 ++++++++++++ .../devices/galaxy_3d_portrait_01.svg | 96 ++++++ .../devices/galaxy_3d_portrait_02.svg | 128 ++++++++ .../devices/galaxy_front_landscape.svg | 116 +++++++ .../devices/galaxy_front_portrait.svg | 116 +++++++ .../image_shapes/devices/imac_3d_01.svg | 76 +++++ .../image_shapes/devices/imac_3d_02.svg | 76 +++++ .../image_shapes/devices/imac_front.svg | 85 +++++ .../devices/ipad_3d_landscape_01.svg | 292 ++++++++++++++++++ .../devices/ipad_3d_landscape_02.svg | 276 +++++++++++++++++ .../devices/ipad_3d_portrait_01.svg | 279 +++++++++++++++++ .../devices/ipad_3d_portrait_02.svg | 287 +++++++++++++++++ .../devices/ipad_front_landscape.svg | 56 ++++ .../devices/ipad_front_portrait.svg | 56 ++++ .../devices/iphone_3d_landscape_01.svg | 171 ++++++++++ .../devices/iphone_3d_landscape_02.svg | 157 ++++++++++ .../devices/iphone_3d_portrait_01.svg | 184 +++++++++++ .../devices/iphone_3d_portrait_02.svg | 169 ++++++++++ .../devices/iphone_front_landscape.svg | 61 ++++ .../devices/iphone_front_portrait.svg | 62 ++++ .../image_shapes/devices/macbook_3d_01.svg | 176 +++++++++++ .../image_shapes/devices/macbook_3d_02.svg | 158 ++++++++++ .../image_shapes/devices/macbook_front.svg | 98 ++++++ .../static/src/scss/wysiwyg_snippets.scss | 27 ++ addons/web_editor/views/snippets.xml | 29 ++ 29 files changed, 3739 insertions(+) create mode 100644 addons/web_editor/static/image_shapes/devices/browser_01.svg create mode 100644 addons/web_editor/static/image_shapes/devices/browser_02.svg create mode 100644 addons/web_editor/static/image_shapes/devices/browser_03.svg create mode 100644 addons/web_editor/static/image_shapes/devices/galaxy_3d_landscape_01.svg create mode 100644 addons/web_editor/static/image_shapes/devices/galaxy_3d_landscape_02.svg create mode 100644 addons/web_editor/static/image_shapes/devices/galaxy_3d_portrait_01.svg create mode 100644 addons/web_editor/static/image_shapes/devices/galaxy_3d_portrait_02.svg create mode 100644 addons/web_editor/static/image_shapes/devices/galaxy_front_landscape.svg create mode 100644 addons/web_editor/static/image_shapes/devices/galaxy_front_portrait.svg create mode 100644 addons/web_editor/static/image_shapes/devices/imac_3d_01.svg create mode 100644 addons/web_editor/static/image_shapes/devices/imac_3d_02.svg create mode 100644 addons/web_editor/static/image_shapes/devices/imac_front.svg create mode 100644 addons/web_editor/static/image_shapes/devices/ipad_3d_landscape_01.svg create mode 100644 addons/web_editor/static/image_shapes/devices/ipad_3d_landscape_02.svg create mode 100644 addons/web_editor/static/image_shapes/devices/ipad_3d_portrait_01.svg create mode 100644 addons/web_editor/static/image_shapes/devices/ipad_3d_portrait_02.svg create mode 100644 addons/web_editor/static/image_shapes/devices/ipad_front_landscape.svg create mode 100644 addons/web_editor/static/image_shapes/devices/ipad_front_portrait.svg create mode 100644 addons/web_editor/static/image_shapes/devices/iphone_3d_landscape_01.svg create mode 100644 addons/web_editor/static/image_shapes/devices/iphone_3d_landscape_02.svg create mode 100644 addons/web_editor/static/image_shapes/devices/iphone_3d_portrait_01.svg create mode 100644 addons/web_editor/static/image_shapes/devices/iphone_3d_portrait_02.svg create mode 100644 addons/web_editor/static/image_shapes/devices/iphone_front_landscape.svg create mode 100644 addons/web_editor/static/image_shapes/devices/iphone_front_portrait.svg create mode 100644 addons/web_editor/static/image_shapes/devices/macbook_3d_01.svg create mode 100644 addons/web_editor/static/image_shapes/devices/macbook_3d_02.svg create mode 100644 addons/web_editor/static/image_shapes/devices/macbook_front.svg diff --git a/addons/web_editor/static/image_shapes/devices/browser_01.svg b/addons/web_editor/static/image_shapes/devices/browser_01.svg new file mode 100644 index 00000000000..9bc83278ef3 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/browser_01.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/browser_02.svg b/addons/web_editor/static/image_shapes/devices/browser_02.svg new file mode 100644 index 00000000000..56ef5be5e07 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/browser_02.svg @@ -0,0 +1,57 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/browser_03.svg b/addons/web_editor/static/image_shapes/devices/browser_03.svg new file mode 100644 index 00000000000..4930d8501c9 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/browser_03.svg @@ -0,0 +1,50 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/galaxy_3d_landscape_01.svg b/addons/web_editor/static/image_shapes/devices/galaxy_3d_landscape_01.svg new file mode 100644 index 00000000000..4ec5827dedd --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/galaxy_3d_landscape_01.svg @@ -0,0 +1,176 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/galaxy_3d_landscape_02.svg b/addons/web_editor/static/image_shapes/devices/galaxy_3d_landscape_02.svg new file mode 100644 index 00000000000..42dd1596407 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/galaxy_3d_landscape_02.svg @@ -0,0 +1,205 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/galaxy_3d_portrait_01.svg b/addons/web_editor/static/image_shapes/devices/galaxy_3d_portrait_01.svg new file mode 100644 index 00000000000..0caa0f3ed0a --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/galaxy_3d_portrait_01.svg @@ -0,0 +1,96 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/galaxy_3d_portrait_02.svg b/addons/web_editor/static/image_shapes/devices/galaxy_3d_portrait_02.svg new file mode 100644 index 00000000000..ff4b969ac4e --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/galaxy_3d_portrait_02.svg @@ -0,0 +1,128 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/galaxy_front_landscape.svg b/addons/web_editor/static/image_shapes/devices/galaxy_front_landscape.svg new file mode 100644 index 00000000000..e0e35917ff1 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/galaxy_front_landscape.svg @@ -0,0 +1,116 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/galaxy_front_portrait.svg b/addons/web_editor/static/image_shapes/devices/galaxy_front_portrait.svg new file mode 100644 index 00000000000..f108c244519 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/galaxy_front_portrait.svg @@ -0,0 +1,116 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/imac_3d_01.svg b/addons/web_editor/static/image_shapes/devices/imac_3d_01.svg new file mode 100644 index 00000000000..9faad884be5 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/imac_3d_01.svg @@ -0,0 +1,76 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/imac_3d_02.svg b/addons/web_editor/static/image_shapes/devices/imac_3d_02.svg new file mode 100644 index 00000000000..c85c7490c88 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/imac_3d_02.svg @@ -0,0 +1,76 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/imac_front.svg b/addons/web_editor/static/image_shapes/devices/imac_front.svg new file mode 100644 index 00000000000..7150cc4b15e --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/imac_front.svg @@ -0,0 +1,85 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/ipad_3d_landscape_01.svg b/addons/web_editor/static/image_shapes/devices/ipad_3d_landscape_01.svg new file mode 100644 index 00000000000..50fa99e05a5 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/ipad_3d_landscape_01.svg @@ -0,0 +1,292 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/ipad_3d_landscape_02.svg b/addons/web_editor/static/image_shapes/devices/ipad_3d_landscape_02.svg new file mode 100644 index 00000000000..93939e5df91 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/ipad_3d_landscape_02.svg @@ -0,0 +1,276 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/ipad_3d_portrait_01.svg b/addons/web_editor/static/image_shapes/devices/ipad_3d_portrait_01.svg new file mode 100644 index 00000000000..46e81f5cdc8 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/ipad_3d_portrait_01.svg @@ -0,0 +1,279 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/ipad_3d_portrait_02.svg b/addons/web_editor/static/image_shapes/devices/ipad_3d_portrait_02.svg new file mode 100644 index 00000000000..2b127e61703 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/ipad_3d_portrait_02.svg @@ -0,0 +1,287 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/ipad_front_landscape.svg b/addons/web_editor/static/image_shapes/devices/ipad_front_landscape.svg new file mode 100644 index 00000000000..35785c099dd --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/ipad_front_landscape.svg @@ -0,0 +1,56 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/ipad_front_portrait.svg b/addons/web_editor/static/image_shapes/devices/ipad_front_portrait.svg new file mode 100644 index 00000000000..da228de523f --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/ipad_front_portrait.svg @@ -0,0 +1,56 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/iphone_3d_landscape_01.svg b/addons/web_editor/static/image_shapes/devices/iphone_3d_landscape_01.svg new file mode 100644 index 00000000000..9b1773591ec --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/iphone_3d_landscape_01.svg @@ -0,0 +1,171 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/iphone_3d_landscape_02.svg b/addons/web_editor/static/image_shapes/devices/iphone_3d_landscape_02.svg new file mode 100644 index 00000000000..c9ed5489155 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/iphone_3d_landscape_02.svg @@ -0,0 +1,157 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/iphone_3d_portrait_01.svg b/addons/web_editor/static/image_shapes/devices/iphone_3d_portrait_01.svg new file mode 100644 index 00000000000..a12ac0a5bb5 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/iphone_3d_portrait_01.svg @@ -0,0 +1,184 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/iphone_3d_portrait_02.svg b/addons/web_editor/static/image_shapes/devices/iphone_3d_portrait_02.svg new file mode 100644 index 00000000000..f3a519e89d3 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/iphone_3d_portrait_02.svg @@ -0,0 +1,169 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/iphone_front_landscape.svg b/addons/web_editor/static/image_shapes/devices/iphone_front_landscape.svg new file mode 100644 index 00000000000..2245df38bd2 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/iphone_front_landscape.svg @@ -0,0 +1,61 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/iphone_front_portrait.svg b/addons/web_editor/static/image_shapes/devices/iphone_front_portrait.svg new file mode 100644 index 00000000000..3890ba5bbe5 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/iphone_front_portrait.svg @@ -0,0 +1,62 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/macbook_3d_01.svg b/addons/web_editor/static/image_shapes/devices/macbook_3d_01.svg new file mode 100644 index 00000000000..3020ee86c1b --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/macbook_3d_01.svg @@ -0,0 +1,176 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/macbook_3d_02.svg b/addons/web_editor/static/image_shapes/devices/macbook_3d_02.svg new file mode 100644 index 00000000000..040e0c41784 --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/macbook_3d_02.svg @@ -0,0 +1,158 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/image_shapes/devices/macbook_front.svg b/addons/web_editor/static/image_shapes/devices/macbook_front.svg new file mode 100644 index 00000000000..09a4fda7d7a --- /dev/null +++ b/addons/web_editor/static/image_shapes/devices/macbook_front.svg @@ -0,0 +1,98 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss index 63e5894d384..3f3c521e4fb 100644 --- a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss +++ b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss @@ -2308,6 +2308,33 @@ we-select.o_we_shape_menu { max-width: 0; } } + +// Add average resolutions for the category "Devices" in image shapes. +we-button[data-img-size] { + position: relative; + + &::before, &::after { + padding: 0 6px; + background: $o-we-color-success; + color: white; + text-align: center; + } + &::before { + font-family: "FontAwesome" !important; + content: "\f065"; + @include o-position-absolute(0, 0, inherit, inherit); + } + &::after { + content: attr(data-img-size); + @include o-position-absolute(0, 0, inherit, 0); + transform: translateX(100%); + transition: 0.2s ease all; + } + &:hover::after { + transform: translateX(0%); + } +} + we-button:hover .o_we_shape_animated_label > span { max-width: 150px; transition: max-width 0.5s ease 0s; diff --git a/addons/web_editor/views/snippets.xml b/addons/web_editor/views/snippets.xml index 5b7316880a2..e731131493b 100644 --- a/addons/web_editor/views/snippets.xml +++ b/addons/web_editor/views/snippets.xml @@ -512,6 +512,35 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +