A Pen by Joseph Turner on CodePen.
Joseph Turner joseph-turner
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Find colors (hex, rgb(a), hsl(a)) | |
| #[a-fA-F0-9]{3,6}(\s|$|;)|(rgb|hsl)(a)?\((.*)\) |
Taken from Todd Parker in JSBin
A Pen by Joseph Turner on CodePen.
joseph-turner
/ flexbox-mixin.scss
Created
May 29, 2013 22:21
Flexbox SASS mixin (Compass required) Implementation based on Chris Coyier's article:
Using Flexbox: Mixing Old and New for the Best Browser Support (http://css-tricks.com/using-flexbox/)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // ================================================================== | |
| // Flexbox | |
| // | |
| // Implementation based on Chris Coyier's article: | |
| // Using Flexbox: Mixing Old and New for the Best Browser Support || http://css-tricks.com/using-flexbox/ | |
| // ================================================================== | |
| // Flexbox Context (applied to container element of flex items) | |
| @mixin flex-display { | |
| @include experimental-value(display, box, -moz, -webkit, not -o, -ms, not -khtml, official); // Old |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <body> | |
| <div class="filler-content"> | |
| <p>body filler content...</p> | |
| <p>more content...</p> | |
| <p>more content...</p> | |
| </div> | |
| <footer> | |
joseph-turner
/ analytics.js
Created
April 15, 2013 16:58
New analytics.js snippet. More detailed control at: https://developers.google.com/analytics/devguides/collection/analyticsjs/
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- Google Analytics --> | |
| <script> | |
| (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ | |
| (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), | |
| m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) | |
| })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); | |
| ga('create', 'UA-XXXX-Y'); | |
| ga('send', 'pageview'); |
joseph-turner
/ google-cdn.jquery.html
Created
April 15, 2013 16:48
Loading jQuery from google with local fallback.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> | |
| <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.9.1.min.js"><\/script>')</script> |
joseph-turner
/ multi-border.scss
Last active
December 16, 2015 04:09
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Mixin for multiple borders | |
| $default-inner-border-width: 5px !default; | |
| $default-inner-border-color: red !default; | |
| $default-middle-border-width: 5px !default; | |
| $default-middle-border-color: green !default; | |
| $default-outer-border-width: 5px !default; | |
| $default-outer-border-color: blue !default; | |
| @mixin multi-border( | |
| $inner-border-width: $default-inner-border-width, | |
| $inner-border-color: $default-inner-border-color, |
joseph-turner
/ quotes.scss
Last active
December 16, 2015 04:09
[CSS Tricks](http://css-tricks.com/almanac/properties/q/quotes/)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| q { | |
| quotes: "“" "”" "‘" "’"; | |
| &:before { | |
| content: open-quote; | |
| } | |
| &:after { | |
| content: close-quote; | |
| } |
joseph-turner
/ clearfix.scss
Last active
December 16, 2015 03:59
— forked from Usse/clearfix.scss
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Clearfix (add or extend this class on elements containing floated elements) | |
| .cf { | |
| zoom: 1; | |
| &:before, | |
| &:after { | |
| content: ''; | |
| display: table; | |
| } | |
| &:after { | |
| clear: both; |