Skip to content

Instantly share code, notes, and snippets.

💭
🐺⚔️🛡️🐲🏹❄️🔥

Daniel Mascena danielmascena

💭
🐺⚔️🛡️🐲🏹❄️🔥
Block or report user

Report or block danielmascena

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View css-selectors.md

CSS Selectors Cheatsheet

Element selectors

Element -- selects all h2 elements on the page

h2 {
    foo: bar;
@danielmascena
danielmascena / README.md
Created Apr 10, 2017 — forked from addyosmani/README.md
108 byte CSS Layout Debugger
View README.md

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

@danielmascena
danielmascena / dabblet.css
Last active Mar 15, 2017
Hidden checkboxes
View dabblet.css
/* Hidden checkboxes */
#btnControl { display: none;}
#btnControl:checked + label > img {
transform: scale(.5) rotate(360deg);
}
img {transition: transform .5s linear;}
@danielmascena
danielmascena / dabblet.css
Created Dec 29, 2016
The first commented line is your dabblet’s title
View dabblet.css
/**
* The first commented line is your dabblet’s title
*/
#fundo {
background: url(http://i.imgur.com/UZKEjzG.png) -800px center;
height: 300px;
width: 1000px;
position: relative;
animation: rolling-position 10s infinite linear;
@danielmascena
danielmascena / dabblet.css
Created Dec 19, 2016
The first commented line is your dabblet’s title
View dabblet.css
/**
* The first commented line is your dabblet’s title
*/
#fundo {
background: url(http://i.imgur.com/UZKEjzG.png) -800px center;
height: 300px;
width: 1000px;
position: relative;
animation: rolling-position 10s infinite linear;
@danielmascena
danielmascena / dabblet.css
Last active Dec 16, 2016
The first commented line is your dabblet’s title
View dabblet.css
/**
* The first commented line is your dabblet’s title
*/
:root {
--xis: calc(100% - 60%);
}
#fundo {
background: url(http://i.imgur.com/UZKEjzG.png) -800px center;
height: 300px;
width: 1000px;
@danielmascena
danielmascena / dabblet.css
Last active Dec 16, 2016
The first commented line is your dabblet’s title
View dabblet.css
/**
* The first commented line is your dabblet’s title
*/
#fundo {
background: url(http://i.imgur.com/UZKEjzG.png) -800px center;
height: 300px;
width: 1000px;
animation: rolling-position 10s infinite linear;
}
@danielmascena
danielmascena / dabblet.css
Last active Dec 15, 2016
The first commented line is your dabblet’s title
View dabblet.css
/**
* The first commented line is your dabblet’s title
*/
#fundo {
background: url(http://i.imgur.com/UZKEjzG.png) 0px center;
height: 300px;
width: 1000px;
}
View SassMeister-input-HTML.html
<div class="container">
<div class="row">
<div class="col-sm-12 col-md-6 col-lg-3"><p>1</p></div>
<div class="col-sm-12 col-md-6 col-lg-3"><p>1</p></div>
<div class="col-sm-12 col-md-6 col-lg-3"><p>1</p></div>
<div class="col-sm-12 col-md-6 col-lg-3"><p>1</p></div>
</div>
</div>
@danielmascena
danielmascena / 0_reuse_code.js
Created Oct 25, 2015
Here are some things you can do with Gists in GistBox.
View 0_reuse_code.js
// Use Gists to store code you would like to remember later on
console.log(window); // log the "window" object to the console
You can’t perform that action at this time.