Skip to content

Instantly share code, notes, and snippets.

@robertlyall
Created December 15, 2014 12:57
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save robertlyall/a9db3a4ceee193583c45 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.4.7)
// Compass (v1.0.1)
// ----
@mixin vertical-gradient($start, $stop) {
background-color: $stop;
background-image:-webkit-gradient(linear, left top, left bottom, from($start), to($stop));
background-image:-moz-linear-gradient(top, $start, $stop);
};
@mixin box-shadow($h, $v, $b, $colour) {
-moz-box-shadow: $h $v $b $colour;
-webkit-box-shadow: $h $v $b $colour;
box-shadow: $h $v $b $colour;
}
@mixin button-style($padding:5px 10px) {
padding:$padding;
border:1px solid #ccc;
color:#333; text-decoration:none;
font-size:90%; font-weight:bold;
background:#fff;
@include vertical-gradient(#fff, #e7e7e7);
@include box-shadow(1px, 1px, 1px, #efefef);
&:hover { background:#e7e7e7; cursor:pointer;}
&:active { background:#dadada;}
}
.one{
@include button-style
}
.two{
@include button-style
}
.three{
@include button-style
}
.four{
@include button-style
}
.five{
@include button-style
}
.six{
@include button-style
}
.seven{
@include button-style
}
.eight{
@include button-style
}
.nine{
@include button-style
}
.asdasdasd{
@include button-style
}
.axxsxasx{
@include button-style
}
.qqwdqwqwe{
@include button-style
}
.asavsvasv{
@include button-style
}
.wqeqweqweqweqwe{
@include button-style
}
.asdasdasdasdasdasd{
@include button-style
}
.asdasdasdxxx{
@include button-style
}
.qweqwewqqq22{
@include button-style
}
.asdasdasdvva{
@include button-style
}
.asgagsagaxxxx{
@include button-style
}
.asdasdasdasdqqq{
@include button-style
}
.aasdasdasd{
@include button-style
}
.qwdqwdqwdqd{
@include button-style
}
.one {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.one:hover {
background: #e7e7e7;
cursor: pointer;
}
.one:active {
background: #dadada;
}
.two {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.two:hover {
background: #e7e7e7;
cursor: pointer;
}
.two:active {
background: #dadada;
}
.three {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.three:hover {
background: #e7e7e7;
cursor: pointer;
}
.three:active {
background: #dadada;
}
.four {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.four:hover {
background: #e7e7e7;
cursor: pointer;
}
.four:active {
background: #dadada;
}
.five {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.five:hover {
background: #e7e7e7;
cursor: pointer;
}
.five:active {
background: #dadada;
}
.six {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.six:hover {
background: #e7e7e7;
cursor: pointer;
}
.six:active {
background: #dadada;
}
.seven {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.seven:hover {
background: #e7e7e7;
cursor: pointer;
}
.seven:active {
background: #dadada;
}
.eight {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.eight:hover {
background: #e7e7e7;
cursor: pointer;
}
.eight:active {
background: #dadada;
}
.nine {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.nine:hover {
background: #e7e7e7;
cursor: pointer;
}
.nine:active {
background: #dadada;
}
.asdasdasd {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.asdasdasd:hover {
background: #e7e7e7;
cursor: pointer;
}
.asdasdasd:active {
background: #dadada;
}
.axxsxasx {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.axxsxasx:hover {
background: #e7e7e7;
cursor: pointer;
}
.axxsxasx:active {
background: #dadada;
}
.qqwdqwqwe {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.qqwdqwqwe:hover {
background: #e7e7e7;
cursor: pointer;
}
.qqwdqwqwe:active {
background: #dadada;
}
.asavsvasv {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.asavsvasv:hover {
background: #e7e7e7;
cursor: pointer;
}
.asavsvasv:active {
background: #dadada;
}
.wqeqweqweqweqwe {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.wqeqweqweqweqwe:hover {
background: #e7e7e7;
cursor: pointer;
}
.wqeqweqweqweqwe:active {
background: #dadada;
}
.asdasdasdasdasdasd {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.asdasdasdasdasdasd:hover {
background: #e7e7e7;
cursor: pointer;
}
.asdasdasdasdasdasd:active {
background: #dadada;
}
.asdasdasdxxx {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.asdasdasdxxx:hover {
background: #e7e7e7;
cursor: pointer;
}
.asdasdasdxxx:active {
background: #dadada;
}
.qweqwewqqq22 {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.qweqwewqqq22:hover {
background: #e7e7e7;
cursor: pointer;
}
.qweqwewqqq22:active {
background: #dadada;
}
.asdasdasdvva {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.asdasdasdvva:hover {
background: #e7e7e7;
cursor: pointer;
}
.asdasdasdvva:active {
background: #dadada;
}
.asgagsagaxxxx {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.asgagsagaxxxx:hover {
background: #e7e7e7;
cursor: pointer;
}
.asgagsagaxxxx:active {
background: #dadada;
}
.asdasdasdasdqqq {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.asdasdasdasdqqq:hover {
background: #e7e7e7;
cursor: pointer;
}
.asdasdasdasdqqq:active {
background: #dadada;
}
.aasdasdasd {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.aasdasdasd:hover {
background: #e7e7e7;
cursor: pointer;
}
.aasdasdasd:active {
background: #dadada;
}
.qwdqwdqwdqd {
padding: 5px 10px;
border: 1px solid #ccc;
color: #333;
text-decoration: none;
font-size: 90%;
font-weight: bold;
background: #fff;
background-color: #e7e7e7;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e7e7e7));
background-image: -moz-linear-gradient(top, #fff, #e7e7e7);
-moz-box-shadow: 1px 1px 1px #efefef;
-webkit-box-shadow: 1px 1px 1px #efefef;
box-shadow: 1px 1px 1px #efefef;
}
.qwdqwdqwdqd:hover {
background: #e7e7e7;
cursor: pointer;
}
.qwdqwdqwdqd:active {
background: #dadada;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment