sass-mediaqueries-rails 1.2.3

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml ADDED
@@ -0,0 +1,15 @@
1
+ ---
2
+ !binary "U0hBMQ==":
3
+ metadata.gz: !binary |-
4
+ Y2I5YTNkMmYzOGFkZjAxZWZhYzI1YmMyZGYyMjY4OWU1MWJmMGU5Mw==
5
+ data.tar.gz: !binary |-
6
+ MGUwMmU3ZjE0MWU0ZjY5MDNjODU5MjE4ZjlkMWRmN2U1YjVlY2Y1Zg==
7
+ !binary "U0hBNTEy":
8
+ metadata.gz: !binary |-
9
+ MDAzYjRhZjU1OWE0ZGZkMzAxNmRjMzg1MTFiZTA1OTc4ZjY2ZWNmMWM3ZWZj
10
+ NTJmMzAyMzU3ZGU1ZjBmYmFjMmVmNDFjNjNmYTcxMTllMmUwOTI1M2QxMTlk
11
+ YzM1YWZkMzdiOGQyYTU4NDRkZDdiYjg5OTE1NThkNDM0NmEzMWY=
12
+ data.tar.gz: !binary |-
13
+ ZGFmNTAwNjU2OWExOWUwY2E5MGQyMGE0OGY5MGVlMzc0NDM0N2Y3YTAwZmIz
14
+ Y2Q4NGZmNGZjMTZlZmY3M2UyMTMwYzMyN2JiODhiMmI4OWI2ZDlmNjUwNGVh
15
+ M2JlNzc5NzNlYmUzN2U5ZjdjNWE2OTc2OTIwOGYzZjM2ZGNkOTQ=
data/MIT-LICENSE ADDED
@@ -0,0 +1,22 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2013 Rafal Bromirski
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining
6
+ a copy of this software and associated documentation files (the
7
+ "Software"), to deal in the Software without restriction, including
8
+ without limitation the rights to use, copy, modify, merge, publish,
9
+ distribute, sublicense, and/or sell copies of the Software, and to
10
+ permit persons to whom the Software is furnished to do so, subject to
11
+ the following conditions:
12
+
13
+ The above copyright notice and this permission notice shall be
14
+ included in all copies or substantial portions of the Software.
15
+
16
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
17
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
18
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
19
+ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
20
+ LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
21
+ OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
22
+ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,29 @@
1
+ # Sass::Mediaqueries::Rails
2
+
3
+ TODO: Write a gem description
4
+
5
+ ## Installation
6
+
7
+ Add this line to your application's Gemfile:
8
+
9
+ gem 'sass-mediaqueries-rails'
10
+
11
+ And then execute:
12
+
13
+ $ bundle
14
+
15
+ Or install it yourself as:
16
+
17
+ $ gem install sass-mediaqueries-rails
18
+
19
+ ## Usage
20
+
21
+ TODO: Write usage instructions here
22
+
23
+ ## Contributing
24
+
25
+ 1. Fork it
26
+ 2. Create your feature branch (`git checkout -b my-new-feature`)
27
+ 3. Commit your changes (`git commit -am 'Add some feature'`)
28
+ 4. Push to the branch (`git push origin my-new-feature`)
29
+ 5. Create new Pull Request
@@ -0,0 +1,273 @@
1
+ // ---------------------------------------------------------------------------------------------------------------------
2
+ //
3
+ // Author: Rafal Bromirski
4
+ // www: http://paranoida.com/
5
+ // twitter: http://twitter.com/paranoida
6
+ // dribbble: http://dribbble.com/paranoida
7
+ //
8
+ // Licensed under a MIT License
9
+ //
10
+ // ---------------------------------------------------------------------------------------------------------------------
11
+ //
12
+ // Requirements:
13
+ // Sass 3.2.0+
14
+ //
15
+ // Version:
16
+ // 1.2.3 // developed on 10/03/2013
17
+ //
18
+ // Mixins:
19
+ // @ min-screen(width) // shortcut for @media screen and (min-width ...)
20
+ // @ max-screen(width) // shortcut for @media screen and (max-width ...)
21
+ // @ screen(min-width, max-width) // shortcut for @media screen and (min-width ...) and (max-width ...)
22
+ // ---
23
+ // @ min-screen-height(height) // shortcut for @media screen and (min-height ...)
24
+ // @ max-screen-height(height) // shortcut for @media screen and (max-height ...)
25
+ // @ screen-height(min-height, max-height) // shortcut for @media screen and (min-height ...) and (max-height ...)
26
+ // ---
27
+ // @ iphone3 // only iPhone (2, 3G, 3GS) landscape & portrait
28
+ // @ iphone3-landscape // only iPhone (2, 3G, 3GS) only landscape
29
+ // @ iphone3-portrait // only iPhone (2, 3G, 3GS) only portrait
30
+ // ---
31
+ // @ iphone4 // only iPhone (4, 4S) landscape & portrait
32
+ // @ iphone4-landscape // only iPhone (4, 4S) only landscape
33
+ // @ iphone4-portrait // only iPhone (4, 4S) only portrait
34
+ // ---
35
+ // @ iphone5 // only iPhone (5) landscape & portrait
36
+ // @ iphone5-landscape // only iPhone (5) only landscape
37
+ // @ iphone5-portrait // only iPhone (5) only portrait
38
+ // ---
39
+ // @ ipad // all iPads (1, 2, 3, 4, Mini) landscape & portrait
40
+ // @ ipad-landscape // all iPads (1, 2, 3, 4, Mini) only landscape
41
+ // @ ipad-portrait // all iPads (1, 2, 3, 4, Mini) only portrait
42
+ // ---
43
+ // @ ipad-retina // only iPad (3, 4) landscape & portrait
44
+ // @ ipad-retina-landscape // only iPad (3, 4) only landscape
45
+ // @ ipad-retina-portrait // only iPad (3, 4) only portrait
46
+ // ---
47
+ // @ hdpi(ratio) // devices with hidpi displays (default ratio: 1.3)
48
+ //
49
+ // ---------------------------------------------------------------------------------------------------------------------
50
+
51
+ // ---------------------------------------------------------------------------------------------------------------------
52
+ // --- screen ----------------------------------------------------------------------------------------------------------
53
+ // ---------------------------------------------------------------------------------------------------------------------
54
+
55
+ @mixin screen($res-min, $res-max)
56
+ {
57
+ @media screen and ( min-width: $res-min ) and ( max-width: $res-max )
58
+ {
59
+ @content;
60
+ }
61
+ }
62
+
63
+ @mixin max-screen($res)
64
+ {
65
+ @media screen and ( max-width: $res )
66
+ {
67
+ @content;
68
+ }
69
+ }
70
+
71
+ @mixin min-screen($res)
72
+ {
73
+ @media screen and ( min-width: $res )
74
+ {
75
+ @content;
76
+ }
77
+ }
78
+
79
+ @mixin screen-height($res-min, $res-max)
80
+ {
81
+ @media screen and ( min-height: $res-min ) and ( max-height: $res-max )
82
+ {
83
+ @content;
84
+ }
85
+ }
86
+
87
+ @mixin max-screen-height($res)
88
+ {
89
+ @media screen and ( max-height: $res )
90
+ {
91
+ @content;
92
+ }
93
+ }
94
+
95
+ @mixin min-screen-height($res)
96
+ {
97
+ @media screen and ( min-height: $res )
98
+ {
99
+ @content;
100
+ }
101
+ }
102
+
103
+ // ---------------------------------------------------------------------------------------------------------------------
104
+ // --- hdpi ------------------------------------------------------------------------------------------------------------
105
+ // ---------------------------------------------------------------------------------------------------------------------
106
+
107
+ // Based on bourbon hidpi-media-queries file (https://github.com/thoughtbot/bourbon/blob/master/app/assets/stylesheets/css3/_hidpi-media-query.scss)
108
+ // HiDPI mixin. Default value set to 1.3 to target Google Nexus 7 (http://bjango.com/articles/min-device-pixel-ratio/)
109
+
110
+ @mixin hdpi($ratio: 1.3)
111
+ {
112
+ @media only screen and (-webkit-min-device-pixel-ratio: $ratio),
113
+ only screen and (min--moz-device-pixel-ratio: $ratio),
114
+ only screen and (-o-min-device-pixel-ratio: #{$ratio}/1),
115
+ only screen and (min-resolution: #{round($ratio*96)}dpi),
116
+ only screen and (min-resolution: #{$ratio}dppx)
117
+ {
118
+ @content;
119
+ }
120
+ }
121
+
122
+ // ---------------------------------------------------------------------------------------------------------------------
123
+ // --- iphone ----------------------------------------------------------------------------------------------------------
124
+ // ---------------------------------------------------------------------------------------------------------------------
125
+
126
+ @mixin iphone3
127
+ {
128
+ @media only screen and (min-device-width: 320px) and (max-device-width: 480px)
129
+ and (-webkit-device-pixel-ratio: 1)
130
+ {
131
+ @content;
132
+ }
133
+ }
134
+
135
+ @mixin iphone3-portrait
136
+ {
137
+ @media only screen and (min-device-width: 320px) and (max-device-width: 480px)
138
+ and (-webkit-device-pixel-ratio: 1) and (orientation:portrait)
139
+ {
140
+ @content;
141
+ }
142
+ }
143
+
144
+ @mixin iphone3-landscape
145
+ {
146
+ @media only screen and (min-device-width: 320px) and (max-device-width: 480px)
147
+ and (-webkit-device-pixel-ratio: 1) and (orientation:landscape)
148
+ {
149
+ @content;
150
+ }
151
+ }
152
+
153
+ // ---------------------------------------------------------------------------------------------------------------------
154
+ // --- iphone-retina ---------------------------------------------------------------------------------------------------
155
+ // ---------------------------------------------------------------------------------------------------------------------
156
+
157
+ @mixin iphone4
158
+ {
159
+ @media only screen and (min-device-width: 320px) and (max-device-width: 480px)
160
+ and (-webkit-device-pixel-ratio: 2) and (device-aspect-ratio: 2/3)
161
+ {
162
+ @content;
163
+ }
164
+ }
165
+
166
+ @mixin iphone4-portrait
167
+ {
168
+ @media only screen and (min-device-width: 320px) and (max-device-width: 480px)
169
+ and (-webkit-device-pixel-ratio: 2) and (device-aspect-ratio: 2/3) and (orientation:portrait)
170
+ {
171
+ @content;
172
+ }
173
+ }
174
+
175
+ @mixin iphone4-landscape
176
+ {
177
+ @media only screen and (min-device-width: 320px) and (max-device-width: 480px)
178
+ and (-webkit-device-pixel-ratio: 2) and (device-aspect-ratio: 2/3) and (orientation:landscape)
179
+ {
180
+ @content;
181
+ }
182
+ }
183
+
184
+ // ---------------------------------------------------------------------------------------------------------------------
185
+ // --- iphone-5 --------------------------------------------------------------------------------------------------------
186
+ // ---------------------------------------------------------------------------------------------------------------------
187
+
188
+ @mixin iphone5
189
+ {
190
+ @media only screen and (min-device-width: 320px) and (max-device-width: 568px)
191
+ and (-webkit-device-pixel-ratio: 2) and (device-aspect-ratio: 40/71)
192
+ {
193
+ @content;
194
+ }
195
+ }
196
+
197
+ @mixin iphone5-portrait
198
+ {
199
+ @media only screen and (min-device-width: 320px) and (max-device-width: 568px)
200
+ and (-webkit-device-pixel-ratio: 2) and (device-aspect-ratio: 40/71) and (orientation:portrait)
201
+
202
+ {
203
+ @content;
204
+ }
205
+ }
206
+
207
+ @mixin iphone5-landscape
208
+ {
209
+ @media only screen and (min-device-width: 320px) and (max-device-width: 568px)
210
+ and (-webkit-device-pixel-ratio: 2) and (device-aspect-ratio: 40/71) and (orientation:landscape)
211
+ {
212
+ @content;
213
+ }
214
+ }
215
+
216
+ // ---------------------------------------------------------------------------------------------------------------------
217
+ // --- ipads (all) -----------------------------------------------------------------------------------------------------
218
+ // ---------------------------------------------------------------------------------------------------------------------
219
+
220
+ @mixin ipad
221
+ {
222
+ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px)
223
+ {
224
+ @content;
225
+ }
226
+ }
227
+
228
+ @mixin ipad-portrait
229
+ {
230
+ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait)
231
+ {
232
+ @content;
233
+ }
234
+ }
235
+
236
+ @mixin ipad-landscape
237
+ {
238
+ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:landscape)
239
+ {
240
+ @content;
241
+ }
242
+ }
243
+
244
+ // ---------------------------------------------------------------------------------------------------------------------
245
+ // --- ipad-retina -----------------------------------------------------------------------------------------------------
246
+ // ---------------------------------------------------------------------------------------------------------------------
247
+
248
+ @mixin ipad-retina
249
+ {
250
+ @media screen and (min-device-width: 768px) and (max-device-width: 1024px)
251
+ and (-webkit-device-pixel-ratio: 2)
252
+ {
253
+ @content;
254
+ }
255
+ }
256
+
257
+ @mixin ipad-retina-portrait
258
+ {
259
+ @media screen and (min-device-width: 768px) and (max-device-width: 1024px)
260
+ and (-webkit-device-pixel-ratio: 2) and (orientation:portrait)
261
+ {
262
+ @content;
263
+ }
264
+ }
265
+
266
+ @mixin ipad-retina-landscape
267
+ {
268
+ @media screen and (min-device-width: 768px) and (max-device-width: 1024px)
269
+ and (-webkit-device-pixel-ratio: 2) and (orientation:landscape)
270
+ {
271
+ @content;
272
+ }
273
+ }
@@ -0,0 +1,4 @@
1
+ require "sass-mediaqueries-rails/engine"
2
+
3
+ module SassMediaqueriesRails
4
+ end
@@ -0,0 +1,5 @@
1
+ module SassMediaqueriesRails
2
+ class Engine < Rails::Engine
3
+ isolate_namespace SassMediaqueriesRails
4
+ end
5
+ end
@@ -0,0 +1,3 @@
1
+ module SassMediaqueriesRails
2
+ VERSION = "1.2.3"
3
+ end
metadata ADDED
@@ -0,0 +1,65 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: sass-mediaqueries-rails
3
+ version: !ruby/object:Gem::Version
4
+ version: 1.2.3
5
+ platform: ruby
6
+ authors:
7
+ - Rafal Bromirski
8
+ autorequire:
9
+ bindir: bin
10
+ cert_chain: []
11
+ date: 2013-03-20 00:00:00.000000000 Z
12
+ dependencies:
13
+ - !ruby/object:Gem::Dependency
14
+ name: sass
15
+ requirement: !ruby/object:Gem::Requirement
16
+ requirements:
17
+ - - ! '>='
18
+ - !ruby/object:Gem::Version
19
+ version: 3.2.0
20
+ type: :runtime
21
+ prerelease: false
22
+ version_requirements: !ruby/object:Gem::Requirement
23
+ requirements:
24
+ - - ! '>='
25
+ - !ruby/object:Gem::Version
26
+ version: 3.2.0
27
+ description: It is a collection of useful media queries mixins for Sass. Great extension
28
+ for compass or bourbon.
29
+ email: rafal.bromirski@gmail.com
30
+ executables: []
31
+ extensions: []
32
+ extra_rdoc_files: []
33
+ files:
34
+ - app/assets/stylesheets/_media-queries.scss
35
+ - lib/sass-mediaqueries-rails/engine.rb
36
+ - lib/sass-mediaqueries-rails/version.rb
37
+ - lib/sass-mediaqueries-rails.rb
38
+ - MIT-LICENSE
39
+ - README.md
40
+ homepage: http://paranoida.github.com/sass-mediaqueries-rails
41
+ licenses:
42
+ - MIT
43
+ metadata: {}
44
+ post_install_message:
45
+ rdoc_options: []
46
+ require_paths:
47
+ - lib
48
+ required_ruby_version: !ruby/object:Gem::Requirement
49
+ requirements:
50
+ - - ! '>='
51
+ - !ruby/object:Gem::Version
52
+ version: '0'
53
+ required_rubygems_version: !ruby/object:Gem::Requirement
54
+ requirements:
55
+ - - ! '>='
56
+ - !ruby/object:Gem::Version
57
+ version: '0'
58
+ requirements: []
59
+ rubyforge_project:
60
+ rubygems_version: 2.0.3
61
+ signing_key:
62
+ specification_version: 4
63
+ summary: It is a collection of useful media queries mixins for Sass. Great extension
64
+ for compass or bourbon.
65
+ test_files: []