cask 0.2.0
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.
- checksums.yaml +7 -0
- data/.gitignore +18 -0
- data/.hound.yml +3 -0
- data/.scss-lint.yml +237 -0
- data/CONTRIBUTING.md +61 -0
- data/Gemfile +4 -0
- data/Gulpfile.js +41 -0
- data/LICENSE +21 -0
- data/README.md +54 -0
- data/Rakefile +1 -0
- data/app/assets/stylesheets/_cask.scss +12 -0
- data/app/assets/stylesheets/_variables.scss +31 -0
- data/app/assets/stylesheets/functions/_all.scss +5 -0
- data/app/assets/stylesheets/functions/_grid-calc.scss +13 -0
- data/app/assets/stylesheets/functions/_grid-column-ratio.scss +11 -0
- data/app/assets/stylesheets/functions/_grid-parse-column-count.scss +13 -0
- data/app/assets/stylesheets/mixins/_all.scss +8 -0
- data/app/assets/stylesheets/mixins/_grid-column.scss +17 -0
- data/app/assets/stylesheets/mixins/_grid-gutter.scss +17 -0
- data/app/assets/stylesheets/mixins/_grid-is-zero-error.scss +7 -0
- data/app/assets/stylesheets/mixins/_grid-push.scss +15 -0
- data/app/assets/stylesheets/mixins/_grid-row.scss +11 -0
- data/app/assets/stylesheets/mixins/_grid-shift.scss +16 -0
- data/bin/console +6 -0
- data/bin/setup +2 -0
- data/cask.gemspec +27 -0
- data/contrib/stylesheets/_example.scss +200 -0
- data/contrib/stylesheets/base/_base.scss +15 -0
- data/contrib/stylesheets/base/_buttons.scss +35 -0
- data/contrib/stylesheets/base/_forms.scss +90 -0
- data/contrib/stylesheets/base/_lists.scss +19 -0
- data/contrib/stylesheets/base/_tables.scss +24 -0
- data/contrib/stylesheets/base/_typography.scss +48 -0
- data/contrib/stylesheets/base/_variables.scss +43 -0
- data/contrib/stylesheets/styles.scss +11 -0
- data/contrib/views/index.haml +149 -0
- data/lib/cask.rb +19 -0
- data/lib/cask/engine.rb +5 -0
- data/lib/cask/version.rb +3 -0
- data/package.json +36 -0
- metadata +125 -0
data/Rakefile
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
require "bundler/gem_tasks"
|
@@ -0,0 +1,31 @@
|
|
1
|
+
// Grid Settings
|
2
|
+
// ============================================================
|
3
|
+
|
4
|
+
// ========= Grid Variables =========
|
5
|
+
|
6
|
+
$text-direction: ltr;
|
7
|
+
|
8
|
+
@if $text-direction == ltr {
|
9
|
+
$default-float: left !global;
|
10
|
+
$opposite-direction: right !global;
|
11
|
+
} @else if $text-direction == rtl {
|
12
|
+
$default-float: right !global;
|
13
|
+
$opposite-direction: left !global;
|
14
|
+
}
|
15
|
+
|
16
|
+
$grid-row-width: 80rem !default;
|
17
|
+
$grid-gutter: 1.25rem !default;
|
18
|
+
$grid-total-columns: 12 !default;
|
19
|
+
|
20
|
+
// ========= Media Queries =========
|
21
|
+
|
22
|
+
$small-screen: 768px !default;
|
23
|
+
$medium-screen: 1280px !default;
|
24
|
+
$large-screen: 1440px !default;
|
25
|
+
|
26
|
+
$screen: "only screen" !default;
|
27
|
+
$small: "only screen and (min-width: #{$small-screen})" !default;
|
28
|
+
$medium: "only screen and (min-width:#{$medium-screen})" !default;
|
29
|
+
$large: "only screen and (min-width:#{$large-screen})" !default;
|
30
|
+
$landscape: "only screen and (orientation: landscape)" !default;
|
31
|
+
$portrait: "only screen and (orientation: portrait)" !default;
|
@@ -0,0 +1,13 @@
|
|
1
|
+
// Calculates the width of a column for grid-column() and other mixins
|
2
|
+
|
3
|
+
@function grid-calc($columns, $collapse:false) {
|
4
|
+
$_column-ratio: grid-column-ratio($columns);
|
5
|
+
|
6
|
+
@if $collapse {
|
7
|
+
$_grid-gutter-affordance: (-$grid-gutter) + ($grid-gutter * $_column-ratio);
|
8
|
+
@return unquote("#{percentage($_column-ratio)} - #{$_grid-gutter-affordance}");
|
9
|
+
} @else {
|
10
|
+
$_grid-gutter-affordance: $grid-gutter + ($grid-gutter * $_column-ratio);
|
11
|
+
@return unquote("#{percentage($_column-ratio)} - #{$_grid-gutter-affordance}");
|
12
|
+
}
|
13
|
+
}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
// Calculates the ratio of a given column over its container.
|
2
|
+
|
3
|
+
@function grid-column-ratio($columns) {
|
4
|
+
@if length($columns) > 1 {
|
5
|
+
@return nth($columns, 1) / grid-parse-column-count($columns);
|
6
|
+
} @if $columns {
|
7
|
+
@return $columns / $grid-total-columns;
|
8
|
+
} @else {
|
9
|
+
@return 1;
|
10
|
+
}
|
11
|
+
}
|
@@ -0,0 +1,13 @@
|
|
1
|
+
// Parses the total number of columns from `$columns`
|
2
|
+
@function grid-parse-column-count($span) {
|
3
|
+
|
4
|
+
@if length($span) == 3 {
|
5
|
+
$_total-columns: nth($span, 3);
|
6
|
+
@return $_total-columns;
|
7
|
+
} @else if length($span) == 2 {
|
8
|
+
$_total-columns: nth($span, 2);
|
9
|
+
@return $_total-columns;
|
10
|
+
} @else if length($span) >= 3 {
|
11
|
+
@error "`$column` had #{$span} values but should have no greater than 3";
|
12
|
+
}
|
13
|
+
}
|
@@ -0,0 +1,17 @@
|
|
1
|
+
// Specifies the number of columns an element should span.
|
2
|
+
|
3
|
+
@mixin grid-column(
|
4
|
+
$columns: false,
|
5
|
+
$collapse: false,
|
6
|
+
$center: false
|
7
|
+
) {
|
8
|
+
@include grid-gutter($collapse: $collapse, $center: $center);
|
9
|
+
|
10
|
+
@if $center {
|
11
|
+
float: none;
|
12
|
+
} @else {
|
13
|
+
float: $default-float;
|
14
|
+
}
|
15
|
+
|
16
|
+
width: calc(#{grid-calc($columns, $collapse)});
|
17
|
+
}
|
@@ -0,0 +1,17 @@
|
|
1
|
+
// Specifies what a column's margins should be.
|
2
|
+
|
3
|
+
@mixin grid-gutter(
|
4
|
+
$collapse: false,
|
5
|
+
$center: false
|
6
|
+
) {
|
7
|
+
@if $center {
|
8
|
+
margin-#{$default-float}: auto;
|
9
|
+
margin-#{$opposite-direction}: auto;
|
10
|
+
} @else if $collapse {
|
11
|
+
margin-#{$default-float}: 0;
|
12
|
+
margin-#{$opposite-direction}: -($grid-gutter);
|
13
|
+
} @else {
|
14
|
+
margin-#{$default-float}: $grid-gutter;
|
15
|
+
margin-#{$opposite-direction}: 0;
|
16
|
+
}
|
17
|
+
}
|
@@ -0,0 +1,15 @@
|
|
1
|
+
// Push columns away from their container.
|
2
|
+
|
3
|
+
@mixin grid-push(
|
4
|
+
$push: false
|
5
|
+
) {
|
6
|
+
@if $push {
|
7
|
+
$_grid-gutter-affordance: $grid-gutter * $push;
|
8
|
+
$_margin-value: calc(#{unquote(grid-calc($push))} + #{$_grid-gutter-affordance});
|
9
|
+
} @else {
|
10
|
+
$_margin-value: $grid-gutter;
|
11
|
+
}
|
12
|
+
|
13
|
+
@include grid-is-zero-error(grid-push, $push);
|
14
|
+
margin-#{$default-float}: $_margin-value;
|
15
|
+
}
|
@@ -0,0 +1,16 @@
|
|
1
|
+
// Shift columns and reorder them within their container.
|
2
|
+
|
3
|
+
@mixin grid-shift(
|
4
|
+
$shift: false
|
5
|
+
) {
|
6
|
+
@if $shift == 0 {
|
7
|
+
@error grid-is-zero-error(grid-shift);
|
8
|
+
}
|
9
|
+
|
10
|
+
@if $shift {
|
11
|
+
$_shift-value: calc(#{unquote(grid-calc($shift))} + #{$grid-gutter});
|
12
|
+
#{$default-float}: $_shift-value;
|
13
|
+
}
|
14
|
+
|
15
|
+
position: relative;
|
16
|
+
}
|
data/bin/console
ADDED
data/bin/setup
ADDED
data/cask.gemspec
ADDED
@@ -0,0 +1,27 @@
|
|
1
|
+
# coding: utf-8
|
2
|
+
lib = File.expand_path('../lib', __FILE__)
|
3
|
+
$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
|
4
|
+
require 'cask/version'
|
5
|
+
|
6
|
+
Gem::Specification.new do |spec|
|
7
|
+
spec.name = "cask"
|
8
|
+
spec.version = Cask::VERSION
|
9
|
+
spec.platform = Gem::Platform::RUBY
|
10
|
+
spec.authors = ["Will H McMahan"]
|
11
|
+
spec.email = ["will@mcmahan.me"]
|
12
|
+
|
13
|
+
spec.summary = %q{A simple relible float based grid system}
|
14
|
+
spec.description = %q{A simple relible float based grid system}
|
15
|
+
spec.homepage = "http://whmii.github.io/cask"
|
16
|
+
spec.license = "MIT"
|
17
|
+
|
18
|
+
spec.files = `git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
|
19
|
+
spec.bindir = "exe"
|
20
|
+
spec.executables = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
|
21
|
+
spec.require_paths = ["lib"]
|
22
|
+
|
23
|
+
spec.add_dependency "bourbon", ">= 4.0"
|
24
|
+
|
25
|
+
spec.add_development_dependency "bundler", "~> 1.10"
|
26
|
+
spec.add_development_dependency "rake", "~> 10.0"
|
27
|
+
end
|
@@ -0,0 +1,200 @@
|
|
1
|
+
// Example Styles
|
2
|
+
// =======================================
|
3
|
+
|
4
|
+
.header {
|
5
|
+
@include grid-row();
|
6
|
+
margin-bottom: 1em;
|
7
|
+
|
8
|
+
.title {
|
9
|
+
background-color: $base-font-color;
|
10
|
+
color: white;
|
11
|
+
font-size: 6.25rem;
|
12
|
+
margin-bottom: 0;
|
13
|
+
padding-bottom: 0.5rem;
|
14
|
+
text-align: center;
|
15
|
+
|
16
|
+
small {
|
17
|
+
display: block;
|
18
|
+
font-size: 1rem;
|
19
|
+
line-height: 1.5;
|
20
|
+
margin-bottom: 1rem;
|
21
|
+
}
|
22
|
+
|
23
|
+
a {
|
24
|
+
color: white;
|
25
|
+
|
26
|
+
&.contact {
|
27
|
+
margin: 0 0.75em;
|
28
|
+
}
|
29
|
+
}
|
30
|
+
}
|
31
|
+
|
32
|
+
.description li {
|
33
|
+
border-bottom: $base-border;
|
34
|
+
padding: $small-spacing;
|
35
|
+
}
|
36
|
+
|
37
|
+
@media #{$small} {
|
38
|
+
display: flex;
|
39
|
+
|
40
|
+
.title {
|
41
|
+
@include grid-column($columns: 6);
|
42
|
+
}
|
43
|
+
|
44
|
+
.description {
|
45
|
+
@include grid-column($columns: 6);
|
46
|
+
}
|
47
|
+
}
|
48
|
+
}
|
49
|
+
|
50
|
+
.example {
|
51
|
+
|
52
|
+
.section-title {
|
53
|
+
@include grid-row($max-width: null);
|
54
|
+
background-color: whitesmoke;
|
55
|
+
line-height: 4;
|
56
|
+
text-align: center;
|
57
|
+
white-space: nowrap;
|
58
|
+
}
|
59
|
+
|
60
|
+
.row {
|
61
|
+
@include grid-row();
|
62
|
+
background-color: $medium-gray;
|
63
|
+
margin-bottom: 1em;
|
64
|
+
padding-bottom: em(2);
|
65
|
+
padding-top: em(2);
|
66
|
+
}
|
67
|
+
|
68
|
+
.content {
|
69
|
+
background-color: $light-gray;
|
70
|
+
display: block;
|
71
|
+
line-height: 6em;
|
72
|
+
text-align: center;
|
73
|
+
white-space: nowrap;
|
74
|
+
}
|
75
|
+
|
76
|
+
.content-label {
|
77
|
+
color: $base-background-color;
|
78
|
+
display: block;
|
79
|
+
font-family: $monospace-font-family;
|
80
|
+
-webkit-font-smoothing: antialiased;
|
81
|
+
line-height: 1.5em;
|
82
|
+
text-align: center;
|
83
|
+
white-space: nowrap;
|
84
|
+
|
85
|
+
&::after {
|
86
|
+
border-color: $light-gray;
|
87
|
+
border-style: solid;
|
88
|
+
border-width: 1px 1px 0;
|
89
|
+
content: "";
|
90
|
+
display: block;
|
91
|
+
height: 1.5em;
|
92
|
+
margin: 0 3px;
|
93
|
+
}
|
94
|
+
}
|
95
|
+
|
96
|
+
[class^="col-"] {
|
97
|
+
border-left: $base-border;
|
98
|
+
border-right: $base-border;
|
99
|
+
}
|
100
|
+
|
101
|
+
.col-12 {
|
102
|
+
|
103
|
+
@media #{$small} {
|
104
|
+
@include grid-column($columns: 12);
|
105
|
+
}
|
106
|
+
}
|
107
|
+
|
108
|
+
.col-6 {
|
109
|
+
|
110
|
+
@media #{$small} {
|
111
|
+
@include grid-column($columns: 6);
|
112
|
+
}
|
113
|
+
}
|
114
|
+
|
115
|
+
.col-6-center {
|
116
|
+
|
117
|
+
@media #{$small} {
|
118
|
+
@include grid-column($columns: 6, $center: true);
|
119
|
+
}
|
120
|
+
}
|
121
|
+
|
122
|
+
.col-6-collapse {
|
123
|
+
|
124
|
+
@media #{$small} {
|
125
|
+
@include grid-column($columns: 6, $collapse: true);
|
126
|
+
}
|
127
|
+
}
|
128
|
+
|
129
|
+
.col-4 {
|
130
|
+
|
131
|
+
@media #{$small} {
|
132
|
+
@include grid-column($columns: 4);
|
133
|
+
}
|
134
|
+
}
|
135
|
+
|
136
|
+
.col-3 {
|
137
|
+
|
138
|
+
@media #{$small} {
|
139
|
+
@include grid-column($columns: 3);
|
140
|
+
}
|
141
|
+
}
|
142
|
+
|
143
|
+
.col-2 {
|
144
|
+
|
145
|
+
@media #{$small} {
|
146
|
+
@include grid-column($columns: 2);
|
147
|
+
}
|
148
|
+
}
|
149
|
+
|
150
|
+
.col-1 {
|
151
|
+
|
152
|
+
@media #{$small} {
|
153
|
+
@include grid-column($columns: 1);
|
154
|
+
}
|
155
|
+
}
|
156
|
+
|
157
|
+
.col-5-push {
|
158
|
+
|
159
|
+
@media #{$small} {
|
160
|
+
@include grid-column($columns: 5);
|
161
|
+
@include grid-push($push: 2);
|
162
|
+
}
|
163
|
+
}
|
164
|
+
|
165
|
+
.col-4-shift-1 {
|
166
|
+
|
167
|
+
@media #{$small} {
|
168
|
+
@include grid-column($columns: 4);
|
169
|
+
@include grid-shift($shift: 4);
|
170
|
+
}
|
171
|
+
}
|
172
|
+
|
173
|
+
.col-4-shift-2 {
|
174
|
+
|
175
|
+
@media #{$small} {
|
176
|
+
@include grid-column($columns: 4);
|
177
|
+
@include grid-shift($shift: -4);
|
178
|
+
}
|
179
|
+
}
|
180
|
+
|
181
|
+
.col-2-of-5 {
|
182
|
+
@include grid-column($columns: 2 of 5);
|
183
|
+
}
|
184
|
+
|
185
|
+
.col-3-of-5 {
|
186
|
+
@include grid-column($columns: 3 of 5);
|
187
|
+
}
|
188
|
+
}
|
189
|
+
|
190
|
+
@media #{$screen} {}
|
191
|
+
|
192
|
+
@media #{$small} {}
|
193
|
+
|
194
|
+
@media #{$medium} {}
|
195
|
+
|
196
|
+
@media #{$large} {}
|
197
|
+
|
198
|
+
@media #{$landscape} {}
|
199
|
+
|
200
|
+
@media #{$portrait} {}
|
@@ -0,0 +1,15 @@
|
|
1
|
+
// Bitters 1.1.0
|
2
|
+
// http://bitters.bourbon.io
|
3
|
+
// Copyright 2013-2015 thoughtbot, inc.
|
4
|
+
// MIT License
|
5
|
+
|
6
|
+
@import "variables";
|
7
|
+
|
8
|
+
// Neat Settings -- uncomment if using Neat -- must be imported before Neat
|
9
|
+
// @import "grid-settings";
|
10
|
+
|
11
|
+
@import "buttons";
|
12
|
+
@import "forms";
|
13
|
+
@import "lists";
|
14
|
+
@import "tables";
|
15
|
+
@import "typography";
|