theme-compiler/tests/resources/scss/mixins.scss


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

//asfdasdf

@mixin font-settings {
	font-family: arial;
	font-size: 16px;
	font-weight: bold;
}

@mixin rounded-borders ($thickness, $radius : 3px) {
	border: $thickness solid black;
	-webkit-border-radius: $radius;
	-moz-border-radius: $radius;
	border-radius: $radius;
}

$mixinVar : 1px;

.main {
	@include rounded-borders($mixinVar);
	@include font-settings;
	@include main-details(14px);
}

.footer {
	@include rounded-borders(2px, 10px);
}

@mixin layout {
	.header {
		width: 100%;
	}
	.main {
		width: 100%;
		height: 100%;
	}
	
	.footer {
		width: 100%;
	}
	@media print {
		.v-view {
			overflow: visible;
		}
	}
	@include font-settings;
}

@mixin main-details($size){
	.details {
		font: {
			size : $size;
			weight: bold;
		}
	}
}

.banner {
	@include fontType(1px solid black, $color : red);
}

@mixin fontType($border, $color : black){
	border : $border;
	font-color: $color;
}

@include interpolation(interpolation);

@mixin interpolation($interpolation){
	.#{$interpolation}-test {
		font-size: 14px;
	}
}

@include layout;