In this document I am using Sass's SCSS syntax. You can choose to use the indented syntax in sass, if you prefer it, it has no functional differences from the SCSS syntax.
For Less, I'm using the JavaScript version because this is what they suggest on the website. The ruby version may be different.
| # ---------------------------------------------------------------------- | |
| # Webfont access | |
| # ---------------------------------------------------------------------- | |
| # allow access from all domains for webfonts | |
| # alternatively you could only whitelist | |
| # your subdomains like "sub.domain.com" | |
| <FilesMatch "\.(ttf|otf|eot|woff|font.css)$"> | |
| <IfModule mod_headers.c> |
| <div id="fb-root"></div> | |
| <script> | |
| (function() { | |
| window.fbAsyncInit = function() { | |
| FB.Event.subscribe('edge.create', function(response) { | |
| _gaq.push(['_trackSocial', 'facebook', 'like', response]); | |
| }); | |
| FB.Event.subscribe('edge.remove', function(response) { | |
| _gaq.push(['_trackSocial', 'facebook', 'unlike', response]); | |
| }); |
| (function(){ | |
| var event_names = { | |
| "click" : "" , | |
| "tweet" : "", | |
| "retweet" : "source_tweet_id", | |
| "follow" : "screen_name", | |
| "favorite" : "tweet_id" | |
| }; | |
| for(var event_name in event_names) |
| // http://paulirish.com/2011/requestanimationframe-for-smart-animating/ | |
| // http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating | |
| // requestAnimationFrame polyfill by Erik Möller. fixes from Paul Irish and Tino Zijdel | |
| // MIT license | |
| (function() { | |
| var lastTime = 0; | |
| var vendors = ['ms', 'moz', 'webkit', 'o']; |
| # Apache configuration file | |
| # httpd.apache.org/docs/2.2/mod/quickreference.html | |
| # Note .htaccess files are an overhead, this logic should be in your Apache | |
| # config if possible: httpd.apache.org/docs/2.2/howto/htaccess.html | |
| # Techniques in here adapted from all over, including: | |
| # Kroc Camen: camendesign.com/.htaccess | |
| # perishablepress.com/press/2006/01/10/stupid-htaccess-tricks/ | |
| # Sample .htaccess file of CMS MODx: modxcms.com | |
| # This is the free sample of .htaccess from 6GO s.r.l. | |
| # @author Claudio Ludovico Panetta (@Ludo237) |
| // shim layer with setTimeout fallback | |
| window.requestAnimFrame = (function(){ | |
| return window.requestAnimationFrame || | |
| window.webkitRequestAnimationFrame || | |
| window.mozRequestAnimationFrame || | |
| function( callback ){ | |
| window.setTimeout(callback, 1000 / 60); | |
| }; | |
| })(); |
| # Turn on Expires and set default to 0 | |
| ExpiresActive On | |
| ExpiresDefault A0 | |
| # Set up caching on media files for 1 year (forever?) | |
| <FilesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$"> | |
| ExpiresDefault A29030400 | |
| Header append Cache-Control "public" | |
| </FilesMatch> | |
| <html> | |
| <head> | |
| <title>Select styles with CSS only</title> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <style> | |
| body { | |
| background-color: #fff; | |
| font-family: helvetica, sans-serif; | |
| margin: 4% 10% | |
| } |
