| <html> | |
| <head> | |
| <title>Awwe Tab</title> | |
| <link rel="stylesheet" type="text/css" href="styles.css" /> | |
| </head> | |
| <body> | |
| <main class="main"> | |
| <h1 class="greeting">HELLO WORLD!</h1> | |
| </main> | |
| <script type="text/javascript" src="script.js"></script> |
| { | |
| "manifest_version": 2, | |
| "name": "Awwe", | |
| "description": "Makes the new tab some cute pups!", | |
| "version": "0.0.1", | |
| "permissions": [ | |
| "storage" | |
| ], | |
| "chrome_url_overrides": { | |
| "newtab": "newtab.html" |
| var juicer = { | |
| fruit: "oranges", | |
| amount: 5, | |
| juice: function(){ | |
| alert( "You have juiced " + this.amount +" "+ this.fruit ); | |
| } | |
| }; | |
| // Calling juicer.juice(): | |
| // -> "You have juiced 5 oranges" |
| // For brevity, vendor prefixes have been removed. | |
| // This does not work as expected; instead of a smooth transition | |
| // what you get is a hard swap from one gradient to the next | |
| .super-cool-background-that-SHOULD-animate-on-hover { | |
| background: linear-gradient( #fff, #ccc ); | |
| transition: all 0.45s; | |
| &:hover{ | |
| background: linear-gradient( #ccc, #fff ); | |
| } | |
| } |
| .gradient-animation( @start, @end, @transTime ){ | |
| background-size: 100%; | |
| background-image: linear-gradient(@start, @end); | |
| position: relative; | |
| z-index: 100; | |
| &:before { | |
| background-image: linear-gradient(@end, @start); | |
| content: ''; | |
| display: block; | |
| height: 100%; |
Just a fluid Christmas grid! A Festivus for the rest of us!
Dope icons from here: http://www.flaticon.com/packs/merry-christmas-line
Christmas Colors based on Adam Lindqvist's Pen: http://codepen.io/adamlindqvist/pen/EaPeJg
A Pen by Dave Lunny on CodePen.
Just a dumb little dead-simple photo enlarger thingy, done purely with CSS3/LESS.
A Pen by Dave Lunny on CodePen.
