playground
/
ratchet
mirror of https://github.com/twbs/ratchet.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

adding two different gradient mixins. may and more later as needed.

pull/535/head
connors 11 years ago
parent
fba29ee4eb
commit
8b3ed350f2
4 changed files with 14 additions and 12 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      docs/assets/css/docs.css
  2. 2
      docs/assets/css/docs.min.css
  3. 9
      sass/docs.scss
  4. 13
      sass/mixins.scss

2
docs/assets/css/docs.css
Unescape View File

@ -64,7 +64,7 @@ body {
background-image: -ms-linear-gradient(45deg, #0a1855 0%, #da0024 100%); background-image: -ms-linear-gradient(45deg, #0a1855 0%, #da0024 100%);
background-image: -o-linear-gradient(45deg, #0a1855 0%, #da0024 100%); background-image: -o-linear-gradient(45deg, #0a1855 0%, #da0024 100%);
background-image: linear-gradient(45deg, #0a1855 0%, #da0024 100%); background-image: linear-gradient(45deg, #0a1855 0%, #da0024 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0a1855', endColorstr='#da0024', GradientType=1 ); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$color-form', endColorstr='$color-to', GradientType=1 );
} }
.docs-header { .docs-header {

2
docs/assets/css/docs.min.css vendored
View File

File diff suppressed because one or more lines are too long

9
sass/docs.scss
Unescape View File

@ -63,14 +63,7 @@ body {
.docs-header, .docs-header,
.docs-sub-header { .docs-sub-header {
position: relative; position: relative;
background-color: #0a1855; @include directional-gradient(#0a1855,#da0024)
background-image: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#0a1855), color-stop(100%,#da0024));
background-image: -webkit-linear-gradient(45deg, #0a1855 0%, #da0024 100%);
background-image: -moz-linear-gradient(45deg, #0a1855 0%, #da0024 100%);
background-image: -ms-linear-gradient(45deg, #0a1855 0%, #da0024 100%);
background-image: -o-linear-gradient(45deg, #0a1855 0%, #da0024 100%);
background-image: linear-gradient(45deg, #0a1855 0%, #da0024 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0a1855', endColorstr='#da0024', GradientType=1 );
} }
.docs-header { .docs-header {
height: 100vh; height: 100vh;

13
sass/mixins.scss
Unescape View File

@ -37,7 +37,7 @@
} }
// Gradients // Gradients
@mixin gradient($color-form, $color-to) { @mixin linear-gradient($color-form, $color-to) {
background-color: $color-form; // Old browsers background-color: $color-form; // Old browsers
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,$color-form), color-stop(100%,$color-to)); // Chrome, Safari4+ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,$color-form), color-stop(100%,$color-to)); // Chrome, Safari4+
background-image: -webkit-linear-gradient(top, $color-form 0%, $color-to 100%); // Chrome10+, Safari5.1+ background-image: -webkit-linear-gradient(top, $color-form 0%, $color-to 100%); // Chrome10+, Safari5.1+
@ -46,7 +46,16 @@
background-image: -o-linear-gradient(top, $color-form 0%, $color-to 100%); // Opera 11.10+ background-image: -o-linear-gradient(top, $color-form 0%, $color-to 100%); // Opera 11.10+
background-image: linear-gradient(to bottom, $color-form 0%, $color-to 100%); // W3C background-image: linear-gradient(to bottom, $color-form 0%, $color-to 100%); // W3C
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$color-form', endColorstr='$color-to', GradientType=0 ); // IE6-9 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$color-form', endColorstr='$color-to', GradientType=0 ); // IE6-9
}
@mixin directional-gradient($color-form, $color-to, $deg: 45deg) {
background-color: $color-form; // Old browsers
background-image: -webkit-gradient(linear, left bottom, right top, color-stop(0%,$color-form), color-stop(100%,$color-to)); // Chrome, Safari4+
background-image: -webkit-linear-gradient(45deg, $color-form 0%, $color-to 100%); // Chrome10+, Safari5.1+
background-image: -moz-linear-gradient(45deg, $color-form 0%, $color-to 100%); // FF3.6+
background-image: -ms-linear-gradient(45deg, $color-form 0%, $color-to 100%); // IE10+
background-image: -o-linear-gradient(45deg, $color-form 0%, $color-to 100%); // Opera 11.10+
background-image: linear-gradient(45deg, $color-form 0%, $color-to 100%); // W3C
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$color-form', endColorstr='$color-to', GradientType=1 ); // IE6-9
} }

Write Preview
Loading…
Cancel
Save