Commit 30ec20d2 authored by Romain Courteaud's avatar Romain Courteaud

[erp5_web_renderjs_ui] Do not show panel by default

Default hidding transform will not be visible when page loads
parent b8714fdf
...@@ -454,11 +454,12 @@ div[data-gadget-scope='panel'] { ...@@ -454,11 +454,12 @@ div[data-gadget-scope='panel'] {
} }
@media only screen and (max-width: 28em), only screen and (min-width: 28em) and (max-width: 62em) { @media only screen and (max-width: 28em), only screen and (min-width: 28em) and (max-width: 62em) {
div[data-gadget-scope='panel'] { div[data-gadget-scope='panel'] {
left: -18em;
transition: transform 200ms ease-out; transition: transform 200ms ease-out;
transform: translate3d(-110%, 0, 0); transform: translate3d(0, 0, 0);
} }
div[data-gadget-scope='panel'].visible { div[data-gadget-scope='panel'].visible {
transform: translate3d(0, 0, 0); transform: translate3d(18em, 0, 0);
} }
} }
div[data-gadget-scope='panel'] div[data-role="header"] { div[data-gadget-scope='panel'] div[data-role="header"] {
...@@ -531,24 +532,24 @@ div[data-gadget-scope='editor_panel'] { ...@@ -531,24 +532,24 @@ div[data-gadget-scope='editor_panel'] {
} }
@media only screen and (min-width: 62em) { @media only screen and (min-width: 62em) {
div[data-gadget-scope='editor_panel'] { div[data-gadget-scope='editor_panel'] {
left: 0; left: -18em;
transition: transform 200ms ease-out; transition: transform 200ms ease-out;
transform: translate3d(-110%, 0, 0); transform: translate3d(0, 0, 0);
box-shadow: 5px 0 5px rgba(0, 0, 0, 0.15); box-shadow: 5px 0 5px rgba(0, 0, 0, 0.15);
} }
div[data-gadget-scope='editor_panel'].visible { div[data-gadget-scope='editor_panel'].visible {
transform: translate3d(0, 0, 0); transform: translate3d(18em, 0, 0);
} }
} }
@media only screen and (max-width: 28em), only screen and (min-width: 28em) and (max-width: 62em) { @media only screen and (max-width: 28em), only screen and (min-width: 28em) and (max-width: 62em) {
div[data-gadget-scope='editor_panel'] { div[data-gadget-scope='editor_panel'] {
right: 0; right: -18em;
transition: transform 200ms ease-out; transition: transform 200ms ease-out;
transform: translate3d(110%, 0, 0); transform: translate3d(0, 0, 0);
box-shadow: -5px 0 5px rgba(0, 0, 0, 0.15); box-shadow: -5px 0 5px rgba(0, 0, 0, 0.15);
} }
div[data-gadget-scope='editor_panel'].visible { div[data-gadget-scope='editor_panel'].visible {
transform: translate3d(0, 0, 0); transform: translate3d(-18em, 0, 0);
} }
} }
div[data-gadget-scope='editor_panel'] div[data-role="header"] { div[data-gadget-scope='editor_panel'] div[data-role="header"] {
......
...@@ -236,7 +236,7 @@ ...@@ -236,7 +236,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>952.54616.41887.5956</string> </value> <value> <string>952.54661.65508.46148</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -254,7 +254,7 @@ ...@@ -254,7 +254,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1469621979.64</float> <float>1469624180.63</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -519,10 +519,11 @@ div[data-gadget-scope='panel'] { ...@@ -519,10 +519,11 @@ div[data-gadget-scope='panel'] {
z-index: 2000; z-index: 2000;
@media @smartphone, @tablet { @media @smartphone, @tablet {
left: -@panelwidth - 1em;
transition: transform 200ms ease-out; transition: transform 200ms ease-out;
transform: translate3d(-110%, 0, 0); transform: translate3d(0, 0, 0);
&.visible { &.visible {
transform: translate3d(0, 0, 0); transform: translate3d(@panelwidth + 1em, 0, 0);
} }
} }
...@@ -609,20 +610,20 @@ div[data-gadget-scope='editor_panel'] { ...@@ -609,20 +610,20 @@ div[data-gadget-scope='editor_panel'] {
z-index: 3000; z-index: 3000;
@media @desktop { @media @desktop {
left: 0; left: -@panelwidth - 1em;
transition: transform 200ms ease-out; transition: transform 200ms ease-out;
transform: translate3d(-110%, 0, 0); transform: translate3d(0, 0, 0);
&.visible { &.visible {
transform: translate3d(0, 0, 0); transform: translate3d(@panelwidth + 1em, 0, 0);
} }
box-shadow: 5px 0 5px rgba(0,0,0,.15); box-shadow: 5px 0 5px rgba(0,0,0,.15);
} }
@media @smartphone, @tablet { @media @smartphone, @tablet {
right: 0; right: -@panelwidth - 1em;
transition: transform 200ms ease-out; transition: transform 200ms ease-out;
transform: translate3d(110%, 0, 0); transform: translate3d(0, 0, 0);
&.visible { &.visible {
transform: translate3d(0, 0, 0); transform: translate3d(-@panelwidth - 1em, 0, 0);
} }
box-shadow: -5px 0 5px rgba(0,0,0,.15); box-shadow: -5px 0 5px rgba(0,0,0,.15);
} }
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment