2 * Angular Material Design
3 * https://github.com/angular/material
7 /* mixin definition ; sets LTR and RTL within the same style call */
9 box-sizing: border-box;
16 background-color: white;
18 -webkit-flex-direction: column;
19 -ms-flex-direction: column;
20 flex-direction: column; }
21 md-sidenav *, md-sidenav *:before, md-sidenav *:after {
22 box-sizing: border-box; }
25 md-sidenav.md-closed {
27 md-sidenav.md-closed-add, md-sidenav.md-closed-remove {
28 display: -webkit-flex;
31 /* this is required as of 1.3x to properly
32 apply all styling in a show/hide animation */
34 md-sidenav.md-closed-add.md-closed-add-active, md-sidenav.md-closed-remove.md-closed-remove-active {
35 transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); }
36 md-sidenav.md-locked-open-add, md-sidenav.md-locked-open-remove {
38 display: -webkit-flex;
41 -webkit-transform: translate3d(0, 0, 0);
42 transform: translate3d(0, 0, 0); }
43 md-sidenav.md-locked-open {
47 md-sidenav.md-locked-open, md-sidenav.md-locked-open.md-closed, md-sidenav.md-locked-open.md-closed.md-sidenav-left, md-sidenav.md-locked-open.md-closed, md-sidenav.md-locked-open.md-closed.md-sidenav-right, md-sidenav.md-locked-open-remove.md-closed {
49 display: -webkit-flex;
52 -webkit-transform: translate3d(0, 0, 0);
53 transform: translate3d(0, 0, 0); }
54 md-sidenav.md-locked-open-remove-active {
55 transition: width 0.3s cubic-bezier(0.55, 0, 0.55, 0.2), min-width 0.3s cubic-bezier(0.55, 0, 0.55, 0.2);
58 md-sidenav.md-closed.md-locked-open-add {
61 -webkit-transform: translate3d(0%, 0, 0);
62 transform: translate3d(0%, 0, 0); }
63 md-sidenav.md-closed.md-locked-open-add-active {
64 transition: width 0.3s cubic-bezier(0.55, 0, 0.55, 0.2), min-width 0.3s cubic-bezier(0.55, 0, 0.55, 0.2);
67 -webkit-transform: translate3d(0%, 0, 0);
68 transform: translate3d(0%, 0, 0); }
70 .md-sidenav-backdrop.md-locked-open {
73 .md-sidenav-left, md-sidenav {
76 -webkit-transform: translate3d(0%, 0, 0);
77 transform: translate3d(0%, 0, 0); }
78 .md-sidenav-left.md-closed, md-sidenav.md-closed {
79 -webkit-transform: translate3d(-100%, 0, 0);
80 transform: translate3d(-100%, 0, 0); }
85 -webkit-transform: translate3d(-100%, 0, 0);
86 transform: translate3d(-100%, 0, 0); }
87 .md-sidenav-right.md-closed {
88 -webkit-transform: translate3d(0%, 0, 0);
89 transform: translate3d(0%, 0, 0); }
91 @media (max-width: 360px) {
95 @media screen and (-ms-high-contrast: active) {
96 .md-sidenav-left, md-sidenav {
97 border-right: 1px solid #fff; }
99 border-left: 1px solid #fff; } }