| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
1 |
// |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
2 |
// Scaffolding |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
3 |
// -------------------------------------------------- |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
4 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
5 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
6 |
// Reset the box-sizing |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
7 |
// |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
8 |
// Heads up! This reset may cause conflicts with some third-party widgets. |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
9 |
// For recommendations on resolving such conflicts, see |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
10 |
// http://getbootstrap.com/getting-started/#third-box-sizing |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
11 |
* { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
12 |
.box-sizing(border-box); |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
13 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
14 |
*:before, |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
15 |
*:after { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
16 |
.box-sizing(border-box); |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
17 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
18 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
19 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
20 |
// Body reset |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
21 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
22 |
html { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
23 |
font-size: 10px; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
24 |
-webkit-tap-highlight-color: rgba(0,0,0,0); |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
25 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
26 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
27 |
body { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
28 |
font-family: @font-family-base; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
29 |
font-size: @font-size-base; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
30 |
line-height: @line-height-base; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
31 |
color: @text-color; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
32 |
background-color: @body-bg; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
33 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
34 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
35 |
// Reset fonts for relevant elements |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
36 |
input, |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
37 |
button, |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
38 |
select, |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
39 |
textarea { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
40 |
font-family: inherit; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
41 |
font-size: inherit; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
42 |
line-height: inherit; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
43 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
44 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
45 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
46 |
// Links |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
47 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
48 |
a { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
49 |
color: @link-color; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
50 |
text-decoration: none; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
51 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
52 |
&:hover, |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
53 |
&:focus { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
54 |
color: @link-hover-color; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
55 |
text-decoration: @link-hover-decoration; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
56 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
57 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
58 |
&:focus { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
59 |
.tab-focus(); |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
60 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
61 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
62 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
63 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
64 |
// Figures |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
65 |
// |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
66 |
// We reset this here because previously Normalize had no `figure` margins. This |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
67 |
// ensures we don't break anyone's use of the element. |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
68 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
69 |
figure { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
70 |
margin: 0; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
71 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
72 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
73 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
74 |
// Images |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
75 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
76 |
img { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
77 |
vertical-align: middle; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
78 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
79 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
80 |
// Responsive images (ensure images don't scale beyond their parents) |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
81 |
.img-responsive { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
82 |
.img-responsive(); |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
83 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
84 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
85 |
// Rounded corners |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
86 |
.img-rounded { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
87 |
border-radius: @border-radius-large; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
88 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
89 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
90 |
// Image thumbnails |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
91 |
// |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
92 |
// Heads up! This is mixin-ed into thumbnails.less for `.thumbnail`. |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
93 |
.img-thumbnail { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
94 |
padding: @thumbnail-padding; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
95 |
line-height: @line-height-base; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
96 |
background-color: @thumbnail-bg; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
97 |
border: 1px solid @thumbnail-border; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
98 |
border-radius: @thumbnail-border-radius; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
99 |
.transition(all .2s ease-in-out); |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
100 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
101 |
// Keep them at most 100% wide |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
102 |
.img-responsive(inline-block); |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
103 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
104 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
105 |
// Perfect circle |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
106 |
.img-circle { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
107 |
border-radius: 50%; // set radius in percents |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
108 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
109 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
110 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
111 |
// Horizontal rules |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
112 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
113 |
hr { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
114 |
margin-top: @line-height-computed; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
115 |
margin-bottom: @line-height-computed; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
116 |
border: 0; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
117 |
border-top: 1px solid @hr-border; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
118 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
119 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
120 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
121 |
// Only display content to screen readers |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
122 |
// |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
123 |
// See: http://a11yproject.com/posts/how-to-hide-content/ |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
124 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
125 |
.sr-only { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
126 |
position: absolute; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
127 |
width: 1px; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
128 |
height: 1px; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
129 |
margin: -1px; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
130 |
padding: 0; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
131 |
overflow: hidden; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
132 |
clip: rect(0,0,0,0); |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
133 |
border: 0; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
134 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
135 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
136 |
// Use in conjunction with .sr-only to only display content when it's focused. |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
137 |
// Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1 |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
138 |
// Credit: HTML5 Boilerplate |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
139 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
140 |
.sr-only-focusable { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
141 |
&:active, |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
142 |
&:focus { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
143 |
position: static; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
144 |
width: auto; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
145 |
height: auto; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
146 |
margin: 0; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
147 |
overflow: visible; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
148 |
clip: auto; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
149 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
150 |
} |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
151 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
152 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
153 |
// iOS "clickable elements" fix for role="button" |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
154 |
// |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
155 |
// Fixes "clickability" issue (and more generally, the firing of events such as focus as well) |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
156 |
// for traditionally non-focusable elements with role="button" |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
157 |
// see https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
158 |
// Upstream patch for normalize.css submitted: https://github.com/necolas/normalize.css/pull/379 - remove this fix once that is merged |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
159 |
|
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
160 |
[role="button"] { |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
161 |
cursor: pointer; |
| f8deb5b9 |
Poul Sander |
2022-01-15 13:55 |
162 |
} |