mindy 0.1.1 → 0.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/lib/mindy.rb +2 -2
- data/stylesheets/mindy/grid/_grid.scss +27 -37
- data/stylesheets/mindy/utils/_mixins.scss +9 -0
- metadata +3 -3
data/lib/mindy.rb
CHANGED
|
@@ -3,34 +3,30 @@
|
|
|
3
3
|
|
|
4
4
|
// Default 978px grid
|
|
5
5
|
// -------------------------
|
|
6
|
-
$gridFluid:
|
|
7
|
-
|
|
6
|
+
$gridFluid: false;
|
|
8
7
|
$gridColumns: 12 !default;
|
|
9
8
|
$gridColumnWidth: 54px !default;
|
|
10
9
|
$gridGutterWidth: 30px !default;
|
|
11
|
-
$
|
|
10
|
+
$gridWidth: 978px !default;
|
|
12
11
|
|
|
13
|
-
|
|
14
|
-
@if $gridFluid == true {
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
} @else {
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
12
|
+
@mixin generateGrid($gridFluid) {
|
|
13
|
+
@if $gridFluid == true {
|
|
14
|
+
$gridWidth: ($gridColumns * $gridColumnWidth) + ($gridGutterWidth * ($gridColumns - 1)) !default;
|
|
15
|
+
$gridColumnWidth: percentage($gridColumnWidth/$gridWidth);
|
|
16
|
+
$gridGutterWidth: percentage($gridGutterWidth/$gridWidth);
|
|
17
|
+
} @else {
|
|
18
|
+
@if $gridWidth == 1378px { $gridColumns: 16; $gridColumnWidth: 58; $gridGutterWidth: 30; }
|
|
19
|
+
@else if $gridWidth == 1218px { $gridColumns: 16; $gridColumnWidth: 48; $gridGutterWidth: 30; }
|
|
20
|
+
@else if $gridWidth == 748px { $gridColumns: 12; $gridColumnWidth: 44; $gridGutterWidth: 20; }
|
|
21
|
+
@else if $gridWidth == 300px { $gridColumns: 8; $gridColumnWidth: 27; $gridGutterWidth: 12; }
|
|
22
|
+
}
|
|
23
23
|
}
|
|
24
24
|
|
|
25
25
|
// column mixin
|
|
26
26
|
@mixin column($n,$first:false) {
|
|
27
27
|
@include float-left;
|
|
28
28
|
|
|
29
|
-
@
|
|
30
|
-
@include grid-fluid-column($n);
|
|
31
|
-
} @else {
|
|
32
|
-
@include grid-column($n);
|
|
33
|
-
}
|
|
29
|
+
@include grid-column($n);
|
|
34
30
|
|
|
35
31
|
@if $first == true {
|
|
36
32
|
margin-left: 0;
|
|
@@ -40,16 +36,15 @@ $gridRowWidth: 978px !default;
|
|
|
40
36
|
}
|
|
41
37
|
|
|
42
38
|
// print layout styles
|
|
43
|
-
@mixin grid(
|
|
39
|
+
@mixin grid() {
|
|
40
|
+
@include generateGrid($gridFluid);
|
|
41
|
+
|
|
44
42
|
.column {
|
|
45
|
-
//float: left;
|
|
46
43
|
@include float-left;
|
|
47
44
|
|
|
45
|
+
margin-left: $gridGutterWidth;
|
|
48
46
|
@if $gridFluid == true {
|
|
49
|
-
*margin-left: $gridGutterWidth - (.5 / $
|
|
50
|
-
margin-left: $gridGutterWidth;
|
|
51
|
-
} @else {
|
|
52
|
-
margin-left: $gridGutterWidth;
|
|
47
|
+
*margin-left: $gridGutterWidth - (.5 / $gridWidth * 100px * 1%);
|
|
53
48
|
}
|
|
54
49
|
|
|
55
50
|
&:last-child {
|
|
@@ -65,11 +60,12 @@ $gridRowWidth: 978px !default;
|
|
|
65
60
|
}
|
|
66
61
|
|
|
67
62
|
// base mixins
|
|
68
|
-
@mixin layout(
|
|
63
|
+
@mixin layout() {
|
|
64
|
+
//@debug "$gridFluid is #{$gridFluid}";
|
|
69
65
|
@if $gridFluid == true {
|
|
70
66
|
width: 100%;
|
|
71
67
|
} @else {
|
|
72
|
-
width: $
|
|
68
|
+
width: $gridWidth;
|
|
73
69
|
margin-left: auto;
|
|
74
70
|
margin-right: auto;
|
|
75
71
|
}
|
|
@@ -79,14 +75,10 @@ $gridRowWidth: 978px !default;
|
|
|
79
75
|
@mixin grid-generate-column($gridFluid, $gridColumns, $gridColumnWidth, $gridGutterWidth) {
|
|
80
76
|
@while $gridColumns > 0 {
|
|
81
77
|
.column#{$gridColumns} {
|
|
82
|
-
|
|
78
|
+
@extend .column;
|
|
83
79
|
}
|
|
84
80
|
.column#{$gridColumns} {
|
|
85
|
-
@
|
|
86
|
-
@include grid-fluid-column($gridColumns, $gridColumnWidth, $gridGutterWidth);
|
|
87
|
-
} @else {
|
|
88
|
-
@include grid-column($gridColumns, $gridColumnWidth, $gridGutterWidth);
|
|
89
|
-
}
|
|
81
|
+
@include grid-column($gridColumns, $gridColumnWidth, $gridGutterWidth);
|
|
90
82
|
}
|
|
91
83
|
$gridColumns: $gridColumns - 1;
|
|
92
84
|
}
|
|
@@ -94,9 +86,7 @@ $gridRowWidth: 978px !default;
|
|
|
94
86
|
|
|
95
87
|
@mixin grid-column($gridColumns, $gridColumnWidth, $gridGutterWidth) {
|
|
96
88
|
width: ($gridColumnWidth * $gridColumns) + ($gridGutterWidth * ($gridColumns - 1));
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
width: ($gridColumnWidth * $gridColumns) + ($gridGutterWidth * ($gridColumns - 1));
|
|
101
|
-
*width: ($gridColumnWidth * $gridColumns) + ($gridGutterWidth * ($gridColumns - 1)) - (.5 / $gridRowWidth * 100px * 1%);
|
|
89
|
+
@if $gridFluid == true {
|
|
90
|
+
*width: ($gridColumnWidth * $gridColumns) + ($gridGutterWidth * ($gridColumns - 1)) - (.5 / $gridWidth * 100px * 1%);
|
|
91
|
+
}
|
|
102
92
|
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
@import "compass/css3";
|
|
2
|
+
@import "compass/utilities";
|
|
2
3
|
|
|
3
4
|
// Add percentage of white to a color
|
|
4
5
|
@function tint($color, $percent){
|
|
@@ -91,4 +92,12 @@
|
|
|
91
92
|
&:after {
|
|
92
93
|
clear: both;
|
|
93
94
|
}
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.float-right {
|
|
98
|
+
@include float-right;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.float-left {
|
|
102
|
+
@include float-left;
|
|
94
103
|
}
|
metadata
CHANGED
|
@@ -5,8 +5,8 @@ version: !ruby/object:Gem::Version
|
|
|
5
5
|
segments:
|
|
6
6
|
- 0
|
|
7
7
|
- 1
|
|
8
|
-
-
|
|
9
|
-
version: 0.1.
|
|
8
|
+
- 2
|
|
9
|
+
version: 0.1.2
|
|
10
10
|
platform: ruby
|
|
11
11
|
authors:
|
|
12
12
|
- Falaleev Maxim
|
|
@@ -14,7 +14,7 @@ autorequire:
|
|
|
14
14
|
bindir: bin
|
|
15
15
|
cert_chain: []
|
|
16
16
|
|
|
17
|
-
date: 2012-09-
|
|
17
|
+
date: 2012-09-28 00:00:00 +04:00
|
|
18
18
|
default_executable:
|
|
19
19
|
dependencies:
|
|
20
20
|
- !ruby/object:Gem::Dependency
|