hjg
2025-01-24 f9ff55a8b66ceda8411f2cc47e21d3de0b966949
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
.sidebar.sidebar-fixed {
    position: fixed;
    top: auto;
    float: none !important;
    
    z-index: @zindex-sidebar-fixed;//???!
    
    &:before {
        height: 5000px;
        top: auto;
        bottom: auto;
    }
}
 
//for sidebar scroll style 2, touch device
.sidebar-scroll-native {
  overflow-y: scroll !important;
  overflow-x: hidden;
}
 
 //android's default browser has a problem with "top: auto" when fixed
 body.mob-safari {
     .sidebar.sidebar-fixed {
        top: @navbar-min-height;
     }
     @media (max-width: @screen-topbar-down) {
        .navbar-fixed-top:not(.navbar-collapse) + .main-container .sidebar-fixed {
            top: (@navbar-min-height * 2);
        }
     }
     //also when .navbar is fixed, .responsive sidebar becomes automatically fixed
     @media (max-width: @grid-float-breakpoint-max) {
        .navbar-fixed-top + .main-container .sidebar.responsive {
            top: @navbar-min-height;
        }
     }
     @media (max-width: @screen-topbar-down) {
        .navbar-fixed-top + .main-container .sidebar.responsive {
            top: (@navbar-min-height * 2);
        }
     }
 }
 
/**
//http://updates.html5rocks.com/2012/09/Stacking-Changes-Coming-to-position-fixed-elements
//webkit & Chrome22+ special case
//webkit is not following the standard specs as of Chrome22+
@media screen and (-webkit-min-device-pixel-ratio:0) {
    //like it happens in Firefox&IE, we expect when we set "z-index:auto" for fixed position .sidebar,
    //the child .submenu elements "z-index" is independent
    //and for example a "z-index:1031" .submenu appears on top of a fixed .navbar with "z-index:1030"
    //and a "z-index:1010" .popover appears on top of ".sidebar" but below ".submenu"
    //but webkit defines a new stacking context on "fixed" position elements(.sidebar here)
    //and the above doesn't happen, in fact .submenu inside fixed .sidebar with "z-index:auto" will appear below everything
    //so we set a good(?) "z-index" for .sidebar, but still it's not as good as standard specs (such as in Firefox)
    //and we may need other workarounds!
    //and you may change it based on your needs
 
    //it's possible have standard functionality in Chrome by going to:
    //chrome://flags/#fixed-position-creates-stacking-context
    //changing "Fixed position elements create stacking contexts" to "Disabled"
    //and removing the following rules
    //and assignning a higher "@submenu-zindex"
 
    .sidebar.sidebar-fixed {
        z-index: @zindex-sidebar-fixed;//???!
        
        &::before {
            height: 5000px;
            top: auto;
            bottom: auto;
        }
    }
}
*/
 
 
 
 
//************************************************************************************
//remove the following to disable fixed sidebar (style1 - default) on smaller devices
//if you also want to disable fixed breadcrumbs on smalelr devices, refer to breadcrumbs.less
 
@media only screen and (max-width: @grid-float-breakpoint-max) {
 .responsive.sidebar-fixed {
    left: auto;
    margin-left: auto;
 }
 
 //if `.menu-toggler` button is inside `fixed .navbar` let sidebar become fixed as well
 .navbar-fixed-top + .main-container > .responsive {
    position: fixed;
    left: auto;
    margin-left: auto;
    //-moz-backface-visibility: hidden;
 }
 //but if `.menu-toggler` button is inside .main-container, then `fixed .navbar` should have no effect
 .navbar-fixed-top + .main-container > .menu-toggler + .responsive {
    position: absolute;
    left: (@sidebar-width);
    margin-left: -(@sidebar-width);
    //-moz-backface-visibility: visible;
 }
 //unless specified as fixed
 .navbar-fixed-top + .main-container > .menu-toggler + .responsive.sidebar-fixed {
     position: fixed;
    left: auto;
    margin-left: auto;
    //-moz-backface-visibility: hidden;
 }
}
 
@media only screen and (max-width: @grid-float-breakpoint-max) {
 .sidebar.responsive.sidebar-fixed {
         position: fixed;
        left: auto;
        margin-left: auto;
 }
 .main-container .menu-toggler.fixed {
    position: fixed;
    left: auto;
    z-index: @zindex-sidebar-fixed - 1;
    //-moz-backface-visibility: hidden;
 }
 
 //for responsive style # 2
 //becuase ".sidebar.responsive-max" is "position: relative" & "margin-left: -190px"
 .sidebar.sidebar-fixed.responsive-max {
    position: fixed;
    left: auto;
    margin-left: auto;
 }
}