| Matteo Scandolo | e6393f0 | 2016-05-23 14:27:52 -0700 | [diff] [blame] | 1 | xos-side-panel .xos-side-panel-content { |
| 2 | position: fixed; |
| 3 | width: 30%; |
| 4 | height: 100%; |
| 5 | padding: 25px; |
| 6 | background: #fff; |
| 7 | overflow: scroll; } |
| 8 | xos-side-panel .xos-side-panel-content.right { |
| 9 | border-left: 1px solid #555555; |
| 10 | top: 0; |
| 11 | right: 0; |
| 12 | visibility: hidden; |
| 13 | box-shadow: -10px 0px 20px -8px rgba(0, 0, 0, 0.75); } |
| 14 | xos-side-panel .xos-side-panel-content.right.out { |
| 15 | animation: 0.5s slideOutRight ease-in-out; |
| 16 | visibility: visible; } |
| 17 | xos-side-panel .xos-side-panel-content.right.in { |
| 18 | animation: 0.5s slideInRight ease-in-out; |
| 19 | visibility: visible; } |
| 20 | |
| 21 | @keyframes slideInRight { |
| 22 | from { |
| 23 | transform: translate3d(100%, 0, 0); |
| 24 | visibility: visible; } |
| 25 | to { |
| 26 | transform: translate3d(0, 0, 0); } } |
| 27 | |
| 28 | @keyframes slideOutRight { |
| 29 | from { |
| 30 | transform: translate3d(0, 0, 0); } |
| 31 | to { |
| 32 | visibility: hidden; |
| 33 | transform: translate3d(100%, 0, 0); } } |