sass-mediaqueries-rails 1.2.3

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 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: []