Skip to content

Instantly share code, notes, and snippets.

View AllThingsSmitty's full-sized avatar

Matt Smith AllThingsSmitty

View GitHub Profile
@AllThingsSmitty
AllThingsSmitty / css-not.scss
Last active November 28, 2018 16:16
Use CSS :not() instead of applying and unapplying borders on navigations
.nav-tab {
...
// instead of putting it on
border-right: 1px solid #424242;
&:last-child {
border-right: 0; // and then taking it off
}
// use CSS not() to only apply to the elements you want
&:not(:last-child) {
border-right: 1px solid #424242;
@AllThingsSmitty
AllThingsSmitty / gwen.py
Created June 2, 2015 15:10
Hollaback console
print "This s**t is bananas"
for a in "bananas":
print a
@AllThingsSmitty
AllThingsSmitty / comments.scss
Created May 12, 2015 15:06
Different types of comments used in Sass
/*
This is for multiline comments
It will output into your CSS depending on your mode.
If you are using the compressed mode, this will be removed.
*/
/* This can be used for inline comments */
/*!
This is for multiline comments.
@AllThingsSmitty
AllThingsSmitty / responsive-font-size.css
Created May 12, 2015 15:01
Font size based on viewport size
/* base font size + viewport height + viewport width */
h1 {
font-size: calc(2rem + 4vh + 4vw);
}
/* responsive font-size responsive */
html {
font-size: calc(100% + .2vh + .2vw);
}
@AllThingsSmitty
AllThingsSmitty / script-loaded.js
Created May 5, 2015 13:25
Check if any given script has loaded
var myScript = document.createElement('script');
myScript.src = 'http://code.jquery.com/jquery-2.1.4.min.js';
myScript.onload = function() {
console.log('jQuery loaded.');
};
document.body.appendChild(myScript);
@AllThingsSmitty
AllThingsSmitty / tooltip.scss
Last active September 25, 2015 04:15
Super simple CSS tooltips
@import url(http://fonts.googleapis.com/css?family=Roboto:400,500,600,700);
$pink: #e91e63;
$paper: #efefef;
$clouds: #ecf0f1;
$cubic: cubic-bezier(.64,.09,.08,1);
html, body {
background: $clouds;
height: 100%;
@AllThingsSmitty
AllThingsSmitty / parallax.scss
Created April 16, 2015 15:51
Landscape parallax using only CSS
// edit these
$farColor: #ffe4c7;
$nearColor: #2f4645;
$layer: 7; // make sure it is +1 the number of layered divs in the HTML
$perspective: 1;
.bg {
background-color: $farColor;
height: 100%;
position: absolute;

###1. How best to set line-height Q. You want text on your website to be double-spaced by default. Which of the following line-height values is the best way to achieve this?

200%

2em

2

double

@AllThingsSmitty
AllThingsSmitty / append-child.js
Last active August 29, 2015 14:19
Quick tip about using appendChild() and insertBefore()
// When using appendChild() or insertBefore() on an element that's already been added to the document, the element will be removed from its place and put into the new place
var b1 = document.querySelector('.box1'),
b2 = document.querySelector('.box2'),
el = document.createElement('div'),
t;
b1.appendChild(el);
t = window.setTimeout(function () {
b2.appendChild(el);
clearTimeout(t);
@AllThingsSmitty
AllThingsSmitty / prime.js
Created April 12, 2015 16:14
Determine if a number is prime
// Return zero if the number isn't prime
function isPrime(value) {
for (var i = 2; i < value; i++) {
if (value % i === 0) {
return false;
}
}
return true;
}