Skip to content

Instantly share code, notes, and snippets.

View ahmadmilzam's full-sized avatar

Ahmad Milzam ahmadmilzam

5 followers · 7 following
View GitHub Profile
@ahmadmilzam
ahmadmilzam / SCSS.md
Created August 14, 2014 15:58 — forked from jareware/SCSS.md

⇐ back to the gist-blog at jrw.fi

Advanced SCSS

Or, 16 cool things you may not have known your stylesheets could do. I'd rather have kept it to a nice round number like 10, but they just kept coming. Sorry.

I've been using SCSS/SASS for most of my styling work since 2009, and I'm a huge fan of Compass (by the great @chriseppstein). It really helped many of us through the darkest cross-browser crap. Even though browsers are increasingly playing nice with CSS, another problem has become very topical: managing the complexity in stylesheets as our in-browser apps get larger and larger. SCSS is an indispensable tool for dealing with this.

This isn't an introduction to the language by a long shot; many things probably won't make sense unless you have some SCSS under your belt already. That said, if you're not yet comfy with the basics, check out the aweso

@ahmadmilzam
ahmadmilzam / gist:88965c8a12c9937679a8
Created August 14, 2014 15:59 — forked from toddmotto/gist:6183415
├── mixins/
│ │── _vendor.scss
│ │── _position.scss
│ └── _background-image.scss
├── modules/
│ │── _normalize.scss
│ │── _clearfix.scss
│ │── _variables.scss
│ │── _app.scss
| │── _buttons.scss
@ahmadmilzam
ahmadmilzam / gist:4a8bac5f8f2b5f25e94d
Created August 14, 2014 16:39 — forked from toddmotto/gist:5477991
google.maps.event.addDomListener(window, 'resize', function() {
var center = map.getCenter()
google.maps.event.trigger(map, "resize")
map.setCenter(center)
})
@ahmadmilzam
ahmadmilzam / scroll.easing.js
Last active August 29, 2015 14:08 — forked from dezinezync/scroll.easing.js
function scrollTo(Y, duration, easingFunction, callback) {
var start = Date.now(),
elem = document.documentElement.scrollTop?document.documentElement:document.body,
from = elem.scrollTop;
if(from === Y) {
callback();
return; /* Prevent scrolling to the Y point if already there */
}
@ahmadmilzam
ahmadmilzam / box-shadow.html
Last active August 29, 2015 14:10 — forked from ocean90/box-shadow.html
<!DOCTYPE html>
<html>
<head>
<title>Box Shadow</title>
<style>
.box {
height: 150px;
width: 300px;
margin: 20px;
@ahmadmilzam
ahmadmilzam / scroll.easing.js
Last active August 29, 2015 14:10 — forked from dezinezync/scroll.easing.js
function scrollTo(Y, duration, easingFunction, callback) {
var start = Date.now(),
elem = document.documentElement.scrollTop?document.documentElement:document.body,
from = elem.scrollTop;
if(from === Y) {
callback();
return; /* Prevent scrolling to the Y point if already there */
}
@ahmadmilzam
ahmadmilzam / box-shadow.html
Last active August 29, 2015 14:11 — forked from ocean90/box-shadow.html
<!DOCTYPE html>
<html>
<head>
<title>Box Shadow</title>
<style>
.box {
height: 150px;
width: 300px;
margin: 20px;
@ahmadmilzam
ahmadmilzam / Readme.md
Last active August 29, 2015 14:12 — forked from sillero/Readme.md
@ahmadmilzam
ahmadmilzam / select-reset.scss
Last active August 29, 2015 14:12 — forked from sillero/select-reset.scss
/*
Tested on
(Windows 7)
Chrome, Firefox
(Android 4.1)
Android Browser, Chrome, Firefox
(iOS 6.1.3)
Safari
*/
@ahmadmilzam
ahmadmilzam / umd-script-boilerplate.js
Last active August 29, 2015 14:12 — forked from cferdinandi/umd-script-boilerplate.js
/**
*
* Name v0.0.1
* Description, by Chris Ferdinandi.
* http://gomakethings.com
*
* Free to use under the MIT License.
* http://gomakethings.com/mit/
*
*/