FWIW: I didn't produce the content present here. I've just copy-pasted it from somewhere over the Internet, but I cannot remember exactly the original source. I was also not able to find the author's name, so I cannot give him/her the proper credit.
| /* modernizr-test.js | |
| * Daniel Ott | |
| * 3 March 2011 | |
| * Custom Tests using Modernizr's addTest API | |
| */ | |
| /* iOS | |
| * There may be times when we need a quick way to reference whether iOS is in play or not. | |
| * While a primative means, will be helpful for that. | |
| */ |
| %body | |
| %article | |
| .countdown | |
| %span Time left: | |
| .days{"data-unit" => "day"} | |
| .hours{"data-unit" => "hrs"} | |
| .minutes{"data-unit" => "min"} | |
| .seconds{"data-unit" => "sec"} |
| def t_meta(meta) | |
| path = request.path_info.gsub(/^(.*)\//, "") | |
| translation_path = "t.head.#{meta}.#{path} | t.head.#{meta}.#{params[:locale]}" | |
| eval translation_path | |
| end |
| html { | |
| font-size: 62.5%; | |
| } | |
| .element { | |
| @include rem-fallback(padding, 50, 30); | |
| @include rem-fallback(margin, 120, auto); | |
| } |
| .no-backgroundsize { | |
| .logo.elavon { @include bg-size(partners/elavon, png); } | |
| .logo.fitnesspoint { @include bg-size(partners/fitnesspoint, jpg); } | |
| .logo.inote { @include bg-size(partners/inote, png); } | |
| } |
| @mixin respond-to($media, $direction: max) { | |
| @if $media == mobile { | |
| @media only screen and (max-width: 320px) { @content; } | |
| } | |
| @else if $media == tablet { | |
| @media only screen and (min-width: 768px) { @content; } | |
| } | |
| @else if $media == desktop { | |
| @media only screen and (min-width: 1024px) { @content; } | |
| } |
| @mixin support($browser) { | |
| @if $browser == mozilla { | |
| @media only screen and (min--moz-device-pixel-ratio:0) { @content; } | |
| } | |
| @if $browser == webkit { | |
| @media only screen and (min-webkit-device-pixel-ratio:0) { @content; } | |
| } | |
| } |
| @mixin animation ($name, $duration: 1s, $effect: linear, $delay: 0, $play-count: infinite, $direction: normal) { | |
| -webkit-animation: $name $duration $effect $delay $play-count $direction; | |
| -webkit-animation-fill-mode: forwards; /* this prevents the animation from restarting! */ | |
| -moz-animation: $name $duration $effect $delay $play-count $direction; | |
| -moz-animation-fill-mode: forwards; /* this prevents the animation from restarting! */ | |
| -o-animation: $name $duration $effect $delay $play-count $direction; | |
| -o-animation-fill-mode: forwards; /* this prevents the animation from restarting! */ |
