scaffolding.less 1.91 KB
Newer Older
1
//
2
// Scaffolding
3
// --------------------------------------------------
Jacob Thornton's avatar
Jacob Thornton committed
4

5

Mark Otto's avatar
Mark Otto committed
6
7
8
// Reset the box-sizing
// -------------------------

9
10
11
*,
*:before,
*:after {
Mark Otto's avatar
Mark Otto committed
12
  .box-sizing(border-box);
Mark Otto's avatar
Mark Otto committed
13
14
15
}


16
// Body reset
17
// -------------------------
Jacob Thornton's avatar
Jacob Thornton committed
18

19
20
21
22
23
html {
  font-size: 62.5%;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}

Jacob Thornton's avatar
Jacob Thornton committed
24
body {
25
26
  padding-left:  (@grid-gutter-width / 2);
  padding-right: (@grid-gutter-width / 2);
Mark Otto's avatar
Mark Otto committed
27
  font-family: @font-family-base;
Mark Otto's avatar
Mark Otto committed
28
  font-size: @font-size-base;
Mark Otto's avatar
Mark Otto committed
29
  line-height: @line-height-base;
Mark Otto's avatar
Mark Otto committed
30
  color: @text-color;
31
  background-color: @body-bg;
32
33
}

Chris Rebert's avatar
Chris Rebert committed
34
// Reset fonts for relevant elements
35
36
37
38
input,
button,
select,
textarea {
Mark Otto's avatar
Mark Otto committed
39
40
41
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
Jacob Thornton's avatar
Jacob Thornton committed
42
43
}

44
45
46
47
48
49
50
51
// Reset unusual Firefox-on-Android default style, see https://github.com/necolas/normalize.css/issues/214
button,
input,
select[multiple],
textarea {
  background-image: none;
}

52

53
// Links
54
// -------------------------
Jacob Thornton's avatar
Jacob Thornton committed
55
56

a {
Mark Otto's avatar
Mark Otto committed
57
  color: @link-color;
Jacob Thornton's avatar
Jacob Thornton committed
58
  text-decoration: none;
59
}
60
61
a:hover,
a:focus {
62
  color: @link-hover-color;
63
  text-decoration: underline;
Jacob Thornton's avatar
Jacob Thornton committed
64
}
Mark Otto's avatar
Mark Otto committed
65
66
67
a:focus {
  .tab-focus();
}
68
69
70
71
72


// Images
// -------------------------

Mark Otto's avatar
Mark Otto committed
73
img {
Mark Otto's avatar
Mark Otto committed
74
75
76
77
  vertical-align: middle;
}

// Responsive images (ensure images don't scale beyond their parents)
78
79
.img-responsive {
  .img-responsive();
Mark Otto's avatar
Mark Otto committed
80
81
}

Mark Otto's avatar
Mark Otto committed
82
// Rounded corners
83
.img-rounded {
84
  border-radius: @border-radius-large;
85
86
}

87
// Image thumbnails
88
// See thumbnails.less for `.img-thumbnail`
89

Mark Otto's avatar
Mark Otto committed
90
// Perfect circle
91
.img-circle {
92
  border-radius: 50%; // set radius in percents
93
}
94
95
96
97
98
99
100
101
102
103
104
105


// Horizontal rules
// -------------------------

hr {
  margin-top:    @line-height-computed;
  margin-bottom: @line-height-computed;
  border: 0;
  border-top: 1px solid @hr-border;
}

106
107
108
109
110
// Only display content to screen readers
// See: http://a11yproject.com/posts/how-to-hide-content/
// -------------------------

.sr-only {
Mark Otto's avatar
Mark Otto committed
111
112
  position: absolute;
  width: 1px;
113
114
115
  height: 1px;
  margin: -1px;
  padding: 0;
Mark Otto's avatar
Mark Otto committed
116
117
118
  overflow: hidden;
  clip: rect(0 0 0 0);
  border: 0;
119
}