diff options
author | Maxime Quandalle <maxime@quandalle.com> | 2015-06-09 17:41:55 +0200 |
---|---|---|
committer | Maxime Quandalle <maxime@quandalle.com> | 2015-06-09 17:41:55 +0200 |
commit | 0b6c229b6cec2329752013393e83ebd122e3d2eb (patch) | |
tree | 557c1df1d21509e0ce337bd738fc74d154696667 /client/components | |
parent | 270236363abbfec7ae50a4545721d19ac37fcfe0 (diff) | |
download | wekan-0b6c229b6cec2329752013393e83ebd122e3d2eb.tar.gz wekan-0b6c229b6cec2329752013393e83ebd122e3d2eb.tar.bz2 wekan-0b6c229b6cec2329752013393e83ebd122e3d2eb.zip |
Define the popup translation in the stylesheet, not in the JS code
This allows us to autoprexfix the property, which is needed for Safari
support (see http://caniuse.com/#feat=transforms2d).
Fixes #178.
Diffstat (limited to 'client/components')
-rw-r--r-- | client/components/main/popup.styl | 10 | ||||
-rw-r--r-- | client/components/main/popup.tpl.jade | 2 |
2 files changed, 9 insertions, 3 deletions
diff --git a/client/components/main/popup.styl b/client/components/main/popup.styl index ce40fc83..550f80f1 100644 --- a/client/components/main/popup.styl +++ b/client/components/main/popup.styl @@ -1,5 +1,7 @@ @import 'nib' +$popupWidth = 300px + .pop-over background: #fff border-radius: 3px @@ -7,13 +9,13 @@ border-bottom-color: #c2c2c2 box-shadow: 0 1px 6px rgba(0, 0, 0, .3) position: absolute - width: 300px + width: $popupWidth z-index: 99999 margin-top: 5px hr margin: 4px -10px - width: 300px + width: $popupWidth input[type="text"], input[type="email"], @@ -118,6 +120,10 @@ .at-result background: #b2dfdb + for depth in (1..6) + .popup-container-depth-{depth} + transform: translateX(- depth * $popupWidth) + .select-members-list margin-bottom: 8px diff --git a/client/components/main/popup.tpl.jade b/client/components/main/popup.tpl.jade index e6cc982a..1add6033 100644 --- a/client/components/main/popup.tpl.jade +++ b/client/components/main/popup.tpl.jade @@ -13,7 +13,7 @@ //- We display the all stack of popup content next to each other and move the "window" by translating .content-container inside .content-wrapper. - .content-container(style="transform:translateX({{containerTranslation}}px)") + .content-container(class="popup-container-depth-{{depth}}") each stack //- XXX We need a better way to express the "is the last element" condition. |