CSS-Tricks GitHub Organization | CSS-Tricks

There is now an “organization” on GitHub for CSS-Tricks. This is a great feature of GitHub and a perfect fit for us.

Why this is good

There is a larger core group of people that can work on any CSS-Tricks related demo.
It is easier to find CSS-Tricks demos in one consolidated place on GitHub.
Any admin can give new people who have interest in contributing to a particular demo access to do that.

What we could use

Let us know if you see a demo that doesn’t have a GitHub repo but you think should.
Let us know about 404’s if you see a link to a repo that has been moved and we forgot to change link.
Let us know if you have interest in contributing to any particular demo. Best bet = submit pull request for a change. If it’s awesome, we’ll just give you direct access.

Special thanks to Mottie for heading this up.

Comments

Marshal

# August 20, 2012

Is there any way to “follow” the organization? Or do members have to be aproved?

Jessica

# August 20, 2012

Is it possible to follow an organization? I can’t seem to find the magic button that would allow me to do this.

Mike

# August 20, 2012

I found a post doing a google search to get around this. You need to hack your way into following organizations. I found it at this post here: http://www.ailis.de/~k/archives/71-How-to-follow-an-organization-on-GitHub.html
Just open the console in google chrome and put this line of javascript:

$.post(“https://github.com/users/follow?target=CSS-Tricks”);

you must be logged into github for this to work. It worked for me and says I am now following CSS-Tricks. Weird tat we have to do this but it seems to work for now.

Chris Coyier

# August 20, 2012

Not that I’d discourage following the organization, but for your own sake, I think it’s probably best just to follow the repos that actually interest you than the whole kit’n’kaboodle.

Motti Horesh

# August 20, 2012

Sounds cool, I would like to contribute!

Chris Coyier

Permalink to comment# August 22, 2012

Cool! There is information on the best way to proceed doing that in the article.

Bob Jonson

# August 21, 2012

How can I become a member of the organization cause I would like to help contribute?

Diseño de Pagina Web

# August 21, 2012

Muy buenooo!!!

Jesus Liñan

# August 21, 2012

Oh!! excellent great contribution!!! :)

Subash Pathak

# August 21, 2012

Sorry Chris i didn’t find a place to paste this would you like to add this to your snippets section…


//Modern Css3 Sass Mixin Library
//Author Subash Pathak
//License USE AS YOUR WISH
//Checked In Sass 3.2.1
//Ie 10 -ms-linear-gradient and -ms-animation -ms-transition blah,blah,blah are not included because they will go away in final version of ie10


@mixin _prefix-linear-gradient($pos, $stops...) {
	background-image: -webkit-linear-gradient($pos,$stops);
	background-image: -moz-linear-gradient($pos,$stops);
	background-image: -o-linear-gradient($pos,$stops);
}

@mixin linear-gradient($pos, $stops...) {
	$pos: "#{$pos}";
	@if      ($pos == "to top"          )   { @include _prefix-linear-gradient(bottom, $stops);          }
	@else if ($pos == "to bottom"       )   { @include _prefix-linear-gradient(top, $stops);             }
	@else if ($pos == "to left"         )   { @include _prefix-linear-gradient(right, $stops);           }
	@else if ($pos == "to right"        )   { @include _prefix-linear-gradient(left, $stops);            }
	@else if ($pos == "to top right"    )   { @include _prefix-linear-gradient(bottom left, $stops);     }
	@else if ($pos == "to top left"     )   { @include _prefix-linear-gradient(bottom right, $stops);    }
	@else if ($pos == "to bottom right" )   { @include _prefix-linear-gradient(top left, $stops);        }
	@else if ($pos == "to bottom left"  )   { @include _prefix-linear-gradient(top right, $stops);       }
	@else                                   { @include _prefix-linear-gradient(unquote($pos), $stops);   }
	background-image: linear-gradient(unquote($pos), $stops);
}

@mixin prefix($prop, $value, $prefixes...) {
	@each $prefix in $prefixes {
		-#{$prefix}-#{$prop}: $value;
	}
	#{$prop}: $value;
}

@mixin ie7($prop, $value) {
	*#{$prop}: $value;
}

@mixin box-shadow($shadows...) {
	@include prefix(box-shadow, ($shadows), webkit, moz);
}

@mixin border-image ($args...) {
	@include prefix(border-image, ($args), webkit, moz, o);
}

@mixin transform($args...) {
	@include prefix(transform, ($args), webkit, moz, ms, o);
}

@mixin perspective($perspective) {
	@include prefix(perspective, ($perspective), webkit, moz);
	@include prefix(transform-style, preserve-3d, webkit, moz);
}

@mixin transition($args...) {
	@include prefix(transition, ($args), webkit, moz, o);
}

@mixin animation($args...) {
	@include prefix(animation, ($args), webkit, moz, o);
}

@mixin box-sizing($args...) {
	@include prefix(box-sizing, ($args), webkit, moz);
}

@mixin background-clip($args...) {
	@include prefix(background-clip, ($args), webkit, moz);
}

@mixin background-size($args...) {
	@include prefix(background-clip, ($args), webkit, moz);
}

@mixin user-select($args...) {
	@include prefix(user-select ($args), webkit, moz, ms, o);
}

@mixin opacity($alpha) {
	$ie-opacity: $alpha*100;
	opacity: $alpha;
	filter: unquote("alpha(opacity=#{$ie-opacity})");
}

@mixin size($width, $height) {
	width: $width;
	height: $height;
}

@mixin size-square($size) {
	@include size($size, $size);
}

@mixin multiple-columns($count, $gap) {
	@include prefix(column-count, ($count), webkit, moz, ms, o);
	@include prefix(column-gap, ($gap), webkit, moz, ms, o);
}

@mixin appearance($args...) {
	@include prefix(appearance, ($args), webkit, moz, ms, o);
}

@mixin keyframes {
	@-moz-keyframes { @content; }
	@-o-keyframes { @content; }
	@-webkit-keyframes { @content; }
	@keyframes { @content; }
}

@mixin clearfix {
	*zoom: 1;
	&:after {
		content: "";
		visibility: hidden;
		display: block;
		clear: both;
	}
}

@mixin embed-font($family, $url, $svgid:$family, $weight:normal, $style:normal) {
	@font-face {
		font-family: $family;
		src: url('#{$url}.eot');
		src: url('#{$url}.eot#iefix') format('embedded-opentype'),
			 url('#{$url}.woff') format('woff'),
			 url('#{$url}.ttf') format('truetype'),
			 url('#{$url}.svg##{$svgid}') format('svg');
		font-weight: $weight;
		font-style: $style;
	}
}

Bob Jonson

# August 22, 2012

Can somebody please invite me not the orginization! I submitted a pull request on the View Source Button a couple of days ago and nobody has looked at it, I would really like to join the orginization.

Chris Coyier

Permalink to comment# August 22, 2012

Sorry about that Bob. I didn’t get a notification for that one somehow. I commented on it now.

Taufik Nurrohman

# August 23, 2012

Oh, so I already knew early from his blog :)

Muminul Haque

# August 23, 2012

That is really great idea. Want to be member of this organization.

emmy sam

# August 23, 2012

my question is same like bob, but i did;t find any answer above. so admin its little bit hard for you

This comment thread is closed. If you have important information to share, please contact us.