mirror of
https://github.com/philomena-dev/philomena.git
synced 2024-12-25 02:18:00 +01:00
8d47f56917
* Build assets using webpack * Change webpack bundling method, add path aliases, restore deploy script * Remove babel dependencies * Add buble rollup plugin and always attach promise polyfill to window * Fix object formatting for buble rollup plugin config * Remove reference to setImmediate from promise polyfill
38 lines
770 B
SCSS
38 lines
770 B
SCSS
@mixin transform-n-animation($type, $dur, $delta) {
|
|
transform: $delta;
|
|
animation: $type $dur ease-in-out;
|
|
}
|
|
|
|
#burger.open {
|
|
display: block !important;
|
|
@include transform-n-animation(slidein, 0.4s, translate(0, 0));
|
|
}
|
|
|
|
#burger.close {
|
|
display: none;
|
|
}
|
|
|
|
// content sliding open
|
|
#container.open {
|
|
@include transform-n-animation(open, 0.4s, translate(210px, 0));
|
|
}
|
|
|
|
@keyframes open {
|
|
0.00% { transform: translate(0, 0); }
|
|
100% { transform: translate(210px, 0); }
|
|
}
|
|
|
|
// content closing
|
|
#container.close {
|
|
animation: close 0.3s ease-in-out;
|
|
}
|
|
|
|
@keyframes close {
|
|
0.00% { transform: translate(210px, 0); }
|
|
100% { transform: translate(0, 0); }
|
|
}
|
|
|
|
@keyframes slidein {
|
|
0.00% { transform: translate(-200px, 0); }
|
|
100% { transform: translate(0, 0); }
|
|
}
|