123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107 |
-
- @import "../../themes/ionic.globals";
-
- // Split Pane
- // --------------------------------------------------
-
- $split-pane-side-min-width: 270px !default;
- $split-pane-side-max-width: 28% !default;
-
- .split-pane {
- @include position(0, 0, 0, 0);
-
- position: absolute;
-
- display: flex;
-
- flex-direction: row;
- flex-wrap: nowrap;
-
- contain: strict;
- }
-
- .split-pane-side:not(ion-menu) {
- display: none;
- }
-
- .split-pane-visible >.split-pane-side,
- .split-pane-visible >.split-pane-main {
- @include position(0, 0, 0, 0);
-
- // scss-lint:disable ImportantRule
- position: relative;
-
- z-index: 0;
-
- flex: 1;
-
- box-shadow: none !important;
- }
-
- .split-pane-visible >.split-pane-side {
- flex-shrink: 0;
-
- order: -1;
- }
-
- .split-pane-visible >.split-pane-main,
- .split-pane-visible >ion-nav.split-pane-side,
- .split-pane-visible >ion-tabs.split-pane-side,
- .split-pane-visible >ion-menu.menu-enabled {
- display: block;
- }
-
- .split-pane-visible >ion-split-pane.split-pane-side,
- .split-pane-visible >ion-split-pane.split-pane-main {
- display: flex;
- }
-
- .split-pane-visible >ion-menu.menu-enabled {
- >.menu-inner {
- @include position-horizontal(0, 0);
-
- // scss-lint:disable ImportantRule
- width: auto;
-
- box-shadow: none !important;
- transform: none !important;
- }
-
- >.ion-backdrop {
- // scss-lint:disable ImportantRule
- display: hidden !important;
- }
- }
-
- .split-pane-visible >.split-pane-side[side=start] {
- @include multi-dir() {
- order: -1;
- }
- }
-
- .split-pane-visible >.split-pane-side[side=end] {
- @include multi-dir() {
- order: 1;
- }
- }
-
- .split-pane-visible >.split-pane-side[side=left] {
- @include ltr() {
- order: -1;
- }
-
- @include rtl() {
- order: 1;
- }
- }
-
- .split-pane-visible >.split-pane-side[side=right] {
- @include ltr() {
- order: 1;
- }
-
- @include rtl() {
- order: -1;
- }
- }
|