Tiny general style compatibility

This commit is contained in:
aronmal 2023-01-14 16:28:40 +01:00
parent 3d21464165
commit a87b41d6c2
Signed by: aronmal
GPG key ID: 816B7707426FC612
2 changed files with 16 additions and 18 deletions

View file

@ -7,8 +7,6 @@ body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif; sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
} }
* { * {

View file

@ -18,37 +18,37 @@
} }
@mixin gradient-edge { @mixin gradient-edge {
&.left-top-corner { &.left-top-corner {
-webkit-mask-image: -webkit-gradient(linear, right bottom, mask-image: -webkit-gradient(linear, right bottom, left top, color-stop(0, rgba(0, 0, 0, 1)), color-stop(0.5, rgba(0, 0, 0, 0)));
left top, color-stop(0, rgba(0,0,0,1)), color-stop(0.5, rgba(0,0,0,0))); -webkit-mask-image: -webkit-gradient(linear, right bottom, left top, color-stop(0, rgba(0, 0, 0, 1)), color-stop(0.5, rgba(0, 0, 0, 0)));
} }
&.right-top-corner { &.right-top-corner {
-webkit-mask-image: -webkit-gradient(linear, left bottom, mask-image: -webkit-gradient(linear, left bottom, right top, color-stop(0, rgba(0, 0, 0, 1)), color-stop(0.5, rgba(0, 0, 0, 0)));
right top, color-stop(0, rgba(0,0,0,1)), color-stop(0.5, rgba(0,0,0,0))); -webkit-mask-image: -webkit-gradient(linear, left bottom, right top, color-stop(0, rgba(0, 0, 0, 1)), color-stop(0.5, rgba(0, 0, 0, 0)));
} }
&.left-bottom-corner { &.left-bottom-corner {
-webkit-mask-image: -webkit-gradient(linear, right top, mask-image: -webkit-gradient(linear, right top, left bottom, color-stop(0, rgba(0, 0, 0, 1)), color-stop(0.5, rgba(0, 0, 0, 0)));
left bottom, color-stop(0, rgba(0,0,0,1)), color-stop(0.5, rgba(0,0,0,0))); -webkit-mask-image: -webkit-gradient(linear, right top, left bottom, color-stop(0, rgba(0, 0, 0, 1)), color-stop(0.5, rgba(0, 0, 0, 0)));
} }
&.right-bottom-corner { &.right-bottom-corner {
-webkit-mask-image: -webkit-gradient(linear, left top, mask-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, rgba(0, 0, 0, 1)), color-stop(0.5, rgba(0, 0, 0, 0)));
right bottom, color-stop(0, rgba(0,0,0,1)), color-stop(0.5, rgba(0,0,0,0))); -webkit-mask-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, rgba(0, 0, 0, 1)), color-stop(0.5, rgba(0, 0, 0, 0)));
} }
&.left { &.left {
-webkit-mask-image: -webkit-gradient(linear, right top, mask-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 1)), to(rgba(0, 0, 0, 0)));
left top, from(rgba(0,0,0,1)), to(rgba(0,0,0,0))); -webkit-mask-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 1)), to(rgba(0, 0, 0, 0)));
} }
&.right { &.right {
-webkit-mask-image: -webkit-gradient(linear, left top, mask-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 1)), to(rgba(0, 0, 0, 0)));
right top, from(rgba(0,0,0,1)), to(rgba(0,0,0,0))); -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 1)), to(rgba(0, 0, 0, 0)));
} }
&.top { &.top {
-webkit-mask-image: -webkit-gradient(linear, left bottom, mask-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 1)), to(rgba(0, 0, 0, 0)));
left top, from(rgba(0,0,0,1)), to(rgba(0,0,0,0))); -webkit-mask-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 1)), to(rgba(0, 0, 0, 0)));
} }
&.bottom { &.bottom {
-webkit-mask-image: -webkit-gradient(linear, left top, mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 1)), to(rgba(0, 0, 0, 0)));
left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0))); -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 1)), to(rgba(0, 0, 0, 0)));
} }
} }