1@import '../lib/font-awesome/less/font-awesome';
2
3
4
5@tablet: ~"only screen and (min-device-width : 768px) and (max-device-width : 1024px)";
6@small-window: ~"only screen and (max-width: 1024px)";
7@small-list: ~"only screen and (max-width: 341px)";
8@highres: ~"(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi)";
9
10
11
12@dotted: 1px dotted @anthrazit;
13
14
15
16.bg-gradient(@color-start, @color-end, @color-default) {
17    .diagonal-gradient (@color-start, @color-end, @color-default);
18}
19
20.bg-gradient(@color, @lightenBy) {
21    .diagonal-gradient (lighten(@color, @lightenBy + 3%), lighten(@color, @lightenBy - 3%), lighten(@color, @lightenBy));
22}
23
24.bg-gradient() {
25    .bg-gradient(@primary, 49%);
26}
27
28
29/**
30 * Gives lists a custom bullet point
31 */
32.bullet-icon() {
33    .bullet-icon("\e080");
34}
35.bullet-icon(@content) {
36    .bullet-icon(@content, before, auto, auto, auto, -1.5em);
37}
38.bullet-icon(@content, before, @topPos, @rightPos, @bottomPos, @leftPos) {
39    position: relative;
40    &:before {
41        .bullet-icon-content(@content, @topPos, @rightPos, @bottomPos, @leftPos);
42    }
43}
44.bullet-icon(@content, after, @topPos, @rightPos, @bottomPos, @leftPos) {
45    position: relative;
46    &:after {
47        .bullet-icon-content(@content, @topPos, @rightPos, @bottomPos, @leftPos);
48    }
49}
50.bullet-icon-content(@content, @topPos, @rightPos, @bottomPos, @leftPos) {
51    position: absolute;
52    top: @topPos;
53    left: @leftPos;
54    right: @rightPos;
55    bottom: @bottomPos;
56    font-family: 'Glyphicons Halflings';
57    content: @content;
58    -webkit-font-smoothing: antialiased;
59    font-style: normal;
60    font-weight: normal;
61    display: block;
62    font-size: .8em;
63}
64
65
66/**
67 * used for less and more links (especially collapsed search result lists and code examples
68 */
69.anim-link(@symbol) {
70	font-size: 1.5em;
71	line-height: .65em;
72	padding: 0 0 0.65em 0;
73
74	text-align: center;
75	.bullet-icon("@{symbol}", before, 1em, auto, auto, 5em);
76	.bullet-icon("@{symbol}", after, 1em, 5em, auto, auto);
77	&:before, &:after {
78		opacity: 0;
79		font-size: 0.3em;
80		.transition(opacity .5s);
81	}
82
83	&:hover {
84		text-decoration: none;
85		&:before, &:after { opacity: 1; .animation(animation2 .3s linear 0s infinite alternate); }
86	}
87}
88
89.more-link() {
90	.anim-link("\e114");
91	&:before, &:after { margin-top: .8em; }
92}
93
94.less-link() {
95	.anim-link("\e113");
96	&:before, &:after { margin-top: -.8em; }
97}
98
99
100
101.box {
102	border: 1px solid rgba(0,0,0,.2);
103	.bg-gradient(@anthrazit, 85%);
104	.border-radius(4px);
105	.box-shadow(inset 0 1px 2px rgba(0, 0, 0, .05));
106}
107
108
109
110.glyphicon() {
111	.glyphicon("\e107");
112}
113
114.glyphicon(@content) {
115	font-family: 'Glyphicons Halflings';
116	font-style: normal;
117	font-weight: normal;
118	line-height: 1;
119    -webkit-font-smoothing: antialiased;
120	-moz-osx-font-smoothing: grayscale;
121	content: @content;
122}
123
124
125
126.fontAwesome() {
127    .fontAwesome("\f071");
128}
129
130.fontAwesome(@content) {
131    font-family: FontAwesome;
132    font-style: normal;
133    font-weight: normal;
134    line-height: 1;
135    -webkit-font-smoothing: antialiased;
136    -moz-osx-font-smoothing: grayscale;
137    content: @content;
138}