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
| /* ATA concept w24 */ | |
| /* header */ | |
| header { display:flex; align-items:center } | |
| header > * { margin:1rem } | |
| #profile { border:1px solid white; border-radius:5rem; | |
| width:45px } | |
| #map:target +header #back, | |
| #map:not(:target) +header :not(#back) { | |
| display:none } |
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
| /* ATA concept w24 */ | |
| /* primary actions */ | |
| nav { position:absolute; bottom:.3rem; left:0; right:0; | |
| display:flex; justify-content:center; align-items:center } | |
| nav label { line-height:1.27rem; width:4rem; text-align:center; | |
| padding:8px; margin:0 .3rem; border-radius:3px } | |
| nav label:before { display:block } |
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
| /* ATA concept w23 */ | |
| /* primary actions */ | |
| nav { position:absolute; bottom:.3rem; left:0; right:0; | |
| display:flex; justify-content:center; align-items:center } | |
| nav a { line-height:1.27rem; width:4rem; text-align:center; | |
| padding:8px; margin:0 .3rem; border-radius:3px } | |
| nav a:before { display:block } |
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
| /* Layers */ | |
| html, body, figure { height:100vh } | |
| body { background:linear-gradient(to bottom,rgb(32,111,181),white) } | |
| figure { position:absolute !important; | |
| top:0; bottom:0; left:0; right:0; z-index:-1; | |
| box-shadow:0 10px 100px rgb(32,111,181); | |
| transform:rotateX(30deg); transform-origin:center bottom } | |
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
| {"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"} |
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
| /* Layers */ |
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
| /* svg data flow */ | |
| path { stroke:red; stroke-width:1ex; | |
| animation:rotate 10s infinite } | |
| @keyframes rotate {50%{transform:rotateX(180deg)}} | |
| svg { position:absolute; top:0; left:0; width:100%; height:100%; | |
| transform:rotateX(180deg) } | |
| body { position:relative; width:100%; height:0; padding-bottom:56.25%; | |
| overflow:visible } | |
| *{background:rgba(255,0,0,.3)} |
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
| /* Oracle */ | |
| html { background:#ea1b22; | |
| animation:fadein 6s cubic-bezier(1,0,1,1) } | |
| @keyframes fadein { | |
| from, 70% { background:white }} | |
| html:hover { animation:strobeA 50ms infinite,strobeB 80ms infinite } | |
| @keyframes strobeA { to { background:#ea1b22 }} | |
| @keyframes strobeB { to { background:rgba(234,27,34,.9) }} | |
| path { animation:trace 5s cubic-bezier(1,0,1,0); |
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
| <meta http-equiv=refresh content="0;URL=https://leanpub.com/javascriptallongesix/read"> |
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
| data:text/html,<body style="padding-bottom:56.25%;background:#000;position:relative;height:0;overflow:hidden;margin:0"><iframe style="position:absolute;top:0;left:0;width:100%;height:100%;border:0" src="https://www.youtube.com/embed/CKvMmtclUBA" allowfullscreen></iframe> |