breakpoint 1.1 → 1.1.1

Sign up to get free protection for your applications and to get access to all the features.
data/CHANGELOG.markdown CHANGED
@@ -1,5 +1,8 @@
1
1
  # Changelog
2
2
 
3
+ ## 1.1.1 - July 30, 2012
4
+ * Added (forgot to include the first time) the ability to query the media type using `breakpoint-get-context('media')`
5
+
3
6
 
4
7
  ## 1.1 - July 29, 2012
5
8
  * Added function `breakpoint-get-context($feature)` to allow users to get the current media query context
data/README.markdown CHANGED
@@ -10,7 +10,7 @@ Breakpoint makes the following assumptions:
10
10
  * A single value query is assumed to be against the `min-width` feature. This can be overwritten by adding the feature you'd like to query against or by changing the provided default variable.
11
11
  * A two value query is assumed to be against the `min-width`/`max-width` feature pair. This can be overwritten by adding the feature you'd like to query against or by changing the provided default variable.
12
12
 
13
- Breakpoint also allows you to get the context of your media queries from your code, allowing you to write dynamic mixins based on their media query context.
13
+ Breakpoint also allows you to get the [context of your media queries](https://github.com/canarymason/breakpoint#media-query-context) from your code, allowing you to write dynamic mixins based on their media query context.
14
14
 
15
15
  If you'd prefer the semantic awesomeness of string names to identify your queries as opposed to variables, or want to dynamically generate media queries, check out [Respond-To](https://github.com/snugug/respond-to); a string based naming API for Breakpoint.
16
16
 
@@ -47,9 +47,14 @@ Breakpoint provides a few default options that you can change.
47
47
  * `$breakpoint-default-feature` - Defaults to 'min-width'. If you write a breakpoint with only a number, this is the feature that is used.
48
48
  * `$breakpoint-default-pair` - Defaults to 'width'. If you write a breakpoint with two numbers but do not specify the feature, this is the feature that is used.
49
49
  * `$breakpoint-to-ems` - Defaults to 'false'. If set to true, all pt/px/percent numbers will be converted to em units for better, more accessable media queries.
50
+ * `$breakpoint-prefixes` - Defines the prefixes to write for prefixed media features. Defaults to `'webkit' 'moz'`.
51
+ * `$breakpoint-prefixed-queries` - Defines what queries should be prefixed. Defaults to `'device-pixel-ratio' 'min-device-pixel-ratio' 'max-device-pixel-ratio'`.
50
52
 
51
- ### Usage
53
+ PLEASE NOTE! If you're a savvy reader, you'll have noticed that we've not included `-o-device-pixel-ratio` as a prefixed option, and we would encourage you not to either. Opera has decided that [their implementation should be written as a fraction, not as a decimal](http://dev.opera.com/articles/view/an-introduction-to-meta-viewport-and-viewport/#device-pixel-ratio), and we are currently not prepared to support automatic conversion of decimals to fractions. This leaves us in the position of either supporting only fractions for unprefixed `device-pixel-ratio`, which is counter to the way the two largest browsers support the query, or suggesting that if you want to use `-o-device-pixel-ratio` that you write a separate media query for it, and we've chosen the later.
52
54
 
55
+ ## Using Breakpoint
56
+
57
+ First, we set up our breakpoint variables.
53
58
 
54
59
  ```scss
55
60
  // create $breakpoint variables like so
@@ -71,9 +76,6 @@ $breakpoint-mono: monochrome;
71
76
  $breakpoint-hi-rez: 2 device-pixel-ratio;
72
77
  ```
73
78
 
74
-
75
- ## Using Breakpoint
76
-
77
79
  Call the mixin and pass one of your breakpoint variables. You can also call it with a la carte arguments.
78
80
 
79
81
  ```scss
@@ -204,7 +206,13 @@ Example generated CSS
204
206
  }
205
207
  }
206
208
 
207
- @media (resolution: 192dpi) {
209
+ @media (-webkit-device-pixel-ratio: 2) {
210
+ .omgdpr {
211
+ content: 'hi resolutions';
212
+ }
213
+ }
214
+
215
+ @media (-moz-device-pixel-ratio: 2) {
208
216
  .omgdpr {
209
217
  content: 'hi resolutions';
210
218
  }
data/lib/breakpoint.rb CHANGED
@@ -3,7 +3,7 @@ require 'compass'
3
3
  Compass::Frameworks.register("breakpoint", :path => "#{File.dirname(__FILE__)}/..")
4
4
 
5
5
  module Breakpoint
6
- VERSION = "1.1"
6
+ VERSION = "1.1.1"
7
7
  DATE = "2012-07-29"
8
8
  end
9
9
 
@@ -38,6 +38,9 @@ $breakpoint-prefixed-queries: 'device-pixel-ratio' 'min-device-pixel-ratio' 'max
38
38
 
39
39
  // Reset Context
40
40
  @include TXkgcmVzZXQhIEdvIGF3YXkh;
41
+
42
+ // Set Media Context
43
+ $context: U2V0IHlvdXIgb3duIGRhbW4gY29udGV4dHMh('media', $media);
41
44
 
42
45
  // Initialize Query String
43
46
  @if $media != 'all' {
metadata CHANGED
@@ -5,7 +5,8 @@ version: !ruby/object:Gem::Version
5
5
  segments:
6
6
  - 1
7
7
  - 1
8
- version: "1.1"
8
+ - 1
9
+ version: 1.1.1
9
10
  platform: ruby
10
11
  authors:
11
12
  - Mason Wendell