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
| /* Fractal SVG */ |
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
| /* flex muscles */ | |
| .flex { display:flex;flex-direction:column; align-items:flex-end } | |
| .item { } | |
| body { font:1.6em/1 HelveticaNeue-CondensedBold } | |
| * { outline:1px solid; margin:0; padding:0; list-style:none; padding:0 .3em } |
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
| /* video */ | |
| iframe { border:0; float:left; margin:0 1em; width:521px; height:322px } | |
| [target=playing] { display:block; padding:.6em 0; | |
| background:#222222; color:#98b8ca; text-decoration:none } | |
| body { font:14px/1.2 HelveticaNeue-Light,Segoe UI,Helvetica; | |
| max-width:843px; margin:1em auto; background:black} |
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 your center */ | |
| html, body { height:100%; margin:0; text-align:center } | |
| body:before { content:''; vertical-align:middle; background:red; height:100%; display:inline-block } | |
| :target { background:red } |
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
| /* progress vs meter | |
| What you see is a "live" view as rendered by your browser, no styles added */ | |
| @charset 'UTF-8'; | |
| /* styles for this demo */ | |
| /* skin */ | |
| body > * { max-width:600px; display:block; margin:1em auto; color:rgba(255,255,255,.9) } | |
| h1 { font-size:1.6em } | |
| a { color:#6bf; white-space:nowrap } |
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
| /* Profile */ | |
| @charset "UTF-8"; | |
| @import url(http://fonts.googleapis.com/css?family=Vollkorn:400italic,400); | |
| html { padding:0 1ex } | |
| body { font:100%/1.6 Vollkorn; margin:auto; max-width:55em } | |
| a { text-decoration:none; color:inherit } | |
| a[href^="//"]:after { content:'→'} | |
| h1 { font:400 italic 161%/1 Vollkorn } |
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
| /* minimal svg exploration */ | |
| svg * { stroke:#70d5dd; fill:#dd524b } |
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
| /* radios are menus */ | |
| menu { border:1px solid; border-radius:2px; | |
| padding:0; margin:2px 0; overflow:hidden } | |
| menu a, menu:before, | |
| menu label { display:inline-block; cursor:pointer; | |
| padding:.6em 1.6em; margin:0; color:inherit; text-decoration:none } | |
| menu label { margin:2px; border-radius:2px; float:left } | |
| menu a:not([href]){ text-decoration:line-through } | |
| menu a:first-child, menu a[href]:hover, menu a[href]:active, | |
| :checked + label, menu label:hover, menu label:active { |
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
| /* solar */ | |
| html { height: 100%; | |
| background: hsla(200,100%,50%,1) radial-gradient(circle, | |
| hsl(200,100%,100%) /* noon */, | |
| hsla(35,100%,50%,.6) 38% /* sunrise, sunset */, | |
| hsla(280,100%,38%,.6) 95% /* dawn, dusk */, | |
| rgba(0,0,0,.9) /* midnight */) } |
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
| /* OpenGov 311 */ | |
| @import url(http://fonts.googleapis.com/css?family=Istok+Web:700); | |
| a { font:700 100%/1 Istok Web; zoom:1; | |
| display:table-cell; border:2px solid #fff; width:60px; height:60px; | |
| vertical-align:middle; text-align:center; padding:3px; | |
| color:hsla(200,20%,20%,1); | |
| text-shadow:1px 1px 1px hsla(200,30%,70%,1); | |
| background:linear-gradient(137deg,hsl(200,90%,60%),hsl(200,90%,80%)); | |
| box-shadow: | |
| -1px -1px 3px hsla(200,30%,30%,.2) inset, |