scratch – Blame information for rev 63
?pathlinks?
Rev | Author | Line No. | Line |
---|---|---|---|
58 | office | 1 | // |
2 | // Responsive: Utility classes |
||
3 | // -------------------------------------------------- |
||
4 | |||
5 | |||
6 | // IE10 in Windows (Phone) 8 |
||
7 | // |
||
8 | // Support for responsive views via media queries is kind of borked in IE10, for |
||
9 | // Surface/desktop in split view and for Windows Phone 8. This particular fix |
||
10 | // must be accompanied by a snippet of JavaScript to sniff the user agent and |
||
11 | // apply some conditional CSS to *only* the Surface/desktop Windows 8. Look at |
||
12 | // our Getting Started page for more information on this bug. |
||
13 | // |
||
14 | // For more information, see the following: |
||
15 | // |
||
16 | // Issue: https://github.com/twbs/bootstrap/issues/10497 |
||
17 | // Docs: http://getbootstrap.com/getting-started/#support-ie10-width |
||
18 | // Source: http://timkadlec.com/2013/01/windows-phone-8-and-device-width/ |
||
19 | // Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/ |
||
20 | |||
21 | @-ms-viewport { |
||
22 | width: device-width; |
||
23 | } |
||
24 | |||
25 | |||
26 | // Visibility utilities |
||
27 | // Note: Deprecated .visible-xs, .visible-sm, .visible-md, and .visible-lg as of v3.2.0 |
||
28 | .visible-xs, |
||
29 | .visible-sm, |
||
30 | .visible-md, |
||
31 | .visible-lg { |
||
32 | .responsive-invisibility(); |
||
33 | } |
||
34 | |||
35 | .visible-xs-block, |
||
36 | .visible-xs-inline, |
||
37 | .visible-xs-inline-block, |
||
38 | .visible-sm-block, |
||
39 | .visible-sm-inline, |
||
40 | .visible-sm-inline-block, |
||
41 | .visible-md-block, |
||
42 | .visible-md-inline, |
||
43 | .visible-md-inline-block, |
||
44 | .visible-lg-block, |
||
45 | .visible-lg-inline, |
||
46 | .visible-lg-inline-block { |
||
47 | display: none !important; |
||
48 | } |
||
49 | |||
50 | .visible-xs { |
||
51 | @media (max-width: @screen-xs-max) { |
||
52 | .responsive-visibility(); |
||
53 | } |
||
54 | } |
||
55 | .visible-xs-block { |
||
56 | @media (max-width: @screen-xs-max) { |
||
57 | display: block !important; |
||
58 | } |
||
59 | } |
||
60 | .visible-xs-inline { |
||
61 | @media (max-width: @screen-xs-max) { |
||
62 | display: inline !important; |
||
63 | } |
||
64 | } |
||
65 | .visible-xs-inline-block { |
||
66 | @media (max-width: @screen-xs-max) { |
||
67 | display: inline-block !important; |
||
68 | } |
||
69 | } |
||
70 | |||
71 | .visible-sm { |
||
72 | @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { |
||
73 | .responsive-visibility(); |
||
74 | } |
||
75 | } |
||
76 | .visible-sm-block { |
||
77 | @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { |
||
78 | display: block !important; |
||
79 | } |
||
80 | } |
||
81 | .visible-sm-inline { |
||
82 | @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { |
||
83 | display: inline !important; |
||
84 | } |
||
85 | } |
||
86 | .visible-sm-inline-block { |
||
87 | @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { |
||
88 | display: inline-block !important; |
||
89 | } |
||
90 | } |
||
91 | |||
92 | .visible-md { |
||
93 | @media (min-width: @screen-md-min) and (max-width: @screen-md-max) { |
||
94 | .responsive-visibility(); |
||
95 | } |
||
96 | } |
||
97 | .visible-md-block { |
||
98 | @media (min-width: @screen-md-min) and (max-width: @screen-md-max) { |
||
99 | display: block !important; |
||
100 | } |
||
101 | } |
||
102 | .visible-md-inline { |
||
103 | @media (min-width: @screen-md-min) and (max-width: @screen-md-max) { |
||
104 | display: inline !important; |
||
105 | } |
||
106 | } |
||
107 | .visible-md-inline-block { |
||
108 | @media (min-width: @screen-md-min) and (max-width: @screen-md-max) { |
||
109 | display: inline-block !important; |
||
110 | } |
||
111 | } |
||
112 | |||
113 | .visible-lg { |
||
114 | @media (min-width: @screen-lg-min) { |
||
115 | .responsive-visibility(); |
||
116 | } |
||
117 | } |
||
118 | .visible-lg-block { |
||
119 | @media (min-width: @screen-lg-min) { |
||
120 | display: block !important; |
||
121 | } |
||
122 | } |
||
123 | .visible-lg-inline { |
||
124 | @media (min-width: @screen-lg-min) { |
||
125 | display: inline !important; |
||
126 | } |
||
127 | } |
||
128 | .visible-lg-inline-block { |
||
129 | @media (min-width: @screen-lg-min) { |
||
130 | display: inline-block !important; |
||
131 | } |
||
132 | } |
||
133 | |||
134 | .hidden-xs { |
||
135 | @media (max-width: @screen-xs-max) { |
||
136 | .responsive-invisibility(); |
||
137 | } |
||
138 | } |
||
139 | .hidden-sm { |
||
140 | @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { |
||
141 | .responsive-invisibility(); |
||
142 | } |
||
143 | } |
||
144 | .hidden-md { |
||
145 | @media (min-width: @screen-md-min) and (max-width: @screen-md-max) { |
||
146 | .responsive-invisibility(); |
||
147 | } |
||
148 | } |
||
149 | .hidden-lg { |
||
150 | @media (min-width: @screen-lg-min) { |
||
151 | .responsive-invisibility(); |
||
152 | } |
||
153 | } |
||
154 | |||
155 | |||
156 | // Print utilities |
||
157 | // |
||
158 | // Media queries are placed on the inside to be mixin-friendly. |
||
159 | |||
160 | // Note: Deprecated .visible-print as of v3.2.0 |
||
161 | .visible-print { |
||
162 | .responsive-invisibility(); |
||
163 | |||
164 | @media print { |
||
165 | .responsive-visibility(); |
||
166 | } |
||
167 | } |
||
168 | .visible-print-block { |
||
169 | display: none !important; |
||
170 | |||
171 | @media print { |
||
172 | display: block !important; |
||
173 | } |
||
174 | } |
||
175 | .visible-print-inline { |
||
176 | display: none !important; |
||
177 | |||
178 | @media print { |
||
179 | display: inline !important; |
||
180 | } |
||
181 | } |
||
182 | .visible-print-inline-block { |
||
183 | display: none !important; |
||
184 | |||
185 | @media print { |
||
186 | display: inline-block !important; |
||
187 | } |
||
188 | } |
||
189 | |||
190 | .hidden-print { |
||
191 | @media print { |
||
192 | .responsive-invisibility(); |
||
193 | } |
||
194 | } |