forked from MarcDiethelm/such.less
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy path60-setup.less
76 lines (60 loc) · 1.66 KB
/
60-setup.less
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
/**
* "such.less" CSS boilerplate framework
* 60-setup.less
* https://github.com/MarcDiethelm/such.less
* License: MIT
* Copyright 2014 Marc Diethelm, Simon Harte
*/
// Dependencies:
// - 00-variables.less
// - lib/wireframe.less
* {
.box-sizing();
}
html {
#type > .rendering('optimised');
font-size: 62.5%; // reset to 10px for linear rem usage
overflow-x: hidden;
overflow-y: scroll;
}
body {
// set default font style and color for the page
&:extend(.copy-default);
// set min-/max-width and center page
#layout > .content-boundaries(0, (@max-content-width + (@h-spacing*2))); // padding on both sides
#layout > .center();
// indicate current viewport, remove in production
.visual-viewports();
overflow: hidden;
background: @color-bg-body;
padding: 0 @h-spacing;
}
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// GRID
@grid-config: @max-content-width, @grid-type, @grid-gutter, @gutter-type, @grid-cols;
.grid-bundle(@config: @grid-config);
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// TYPOGRAPHY
.title-page {
#type > #title > .size('default');
@media @m-medium-up {
#type > #title > .size('page');
}
}
.title-default {
#type > #title > .size('default');
}
.copy-default {
#type > #copy > .size('small');
@media @m-medium-up {
#type > #copy > .size('default');
}
}
.copy-small {
#type > #copy > .size('small');
}
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// LINKS
a {
#type > #link > .style('default');
}