diff --git a/site/filters.json b/site/filters.json index de5138e..691f0a0 100644 --- a/site/filters.json +++ b/site/filters.json @@ -17,7 +17,7 @@ }, { "name": "Ashby", - "is_done": false, + "is_done": true, "usage": "ashby" }, { @@ -203,4 +203,4 @@ ], "images": ["atx", "bike", "cacti", "lakegeneva", "tahoe"] -} \ No newline at end of file +} diff --git a/source/scss/ashby.scss b/source/scss/ashby.scss new file mode 100644 index 0000000..d830158 --- /dev/null +++ b/source/scss/ashby.scss @@ -0,0 +1,41 @@ +/* + * + * Ashby + * + */ + +@import 'shared'; +// mixin to extend ashby filter +// @mixin ashby +// @param $filters... {filter} - Zero to many css filters to be added +// @example +// img { +// @include ashby; +// } +// or +// img { +// @include ashby(blur(2px)); +// } +// or +// img { +// @include ashby(blur(2px)) { +// /*...*/ +// }; +// } +@mixin ashby($filters...) { + @extend %filter-base; + filter: contrast(0.78) brightness(1.1) saturate(1.3) sepia(0.12) $filters; + + &::after { + background-color: rgba(255, 179, 105, 0.247059); + mix-blend-mode: darken; + } + + @content; +} + +//ashby Instagram filter +%ashby, +.ashby { + @include ashby; +} diff --git a/source/scss/cssgram.scss b/source/scss/cssgram.scss index a328cb9..9415085 100644 --- a/source/scss/cssgram.scss +++ b/source/scss/cssgram.scss @@ -21,4 +21,8 @@ @import 'slumber'; @import 'brannan'; @import 'valencia'; -@import 'kelvin'; \ No newline at end of file +<<<<<<< HEAD +<<<<<<< HEAD +@import 'ashby'; +======= +@import 'kelvin';