mirror of https://github.com/andrewgioia/mana.git
365 lines
19 KiB
SCSS
365 lines
19 KiB
SCSS
// costs
|
|
|
|
.#{$ms-prefix}-cost {
|
|
|
|
background-color: $ms-base-colorless;
|
|
border-radius: 1em;
|
|
color: #111;
|
|
font-size: 0.95em;
|
|
width: 1.3em;
|
|
height: 1.3em;
|
|
line-height: 1.35em;
|
|
text-align: center;
|
|
|
|
// single costs
|
|
&.#{$ms-prefix}-w,
|
|
&.#{$ms-prefix}-wp {
|
|
background-color: $ms-base-white;
|
|
}
|
|
&.#{$ms-prefix}-u,
|
|
&.#{$ms-prefix}-up {
|
|
background-color: $ms-base-blue;
|
|
}
|
|
&.#{$ms-prefix}-b,
|
|
&.#{$ms-prefix}-bp {
|
|
background-color: $ms-base-black;
|
|
}
|
|
&.#{$ms-prefix}-r,
|
|
&.#{$ms-prefix}-rp {
|
|
background-color: $ms-base-red;
|
|
}
|
|
&.#{$ms-prefix}-g,
|
|
&.#{$ms-prefix}-gp {
|
|
background-color: $ms-base-green;
|
|
}
|
|
|
|
// split costs
|
|
&.#{$ms-prefix}-wu,
|
|
&.#{$ms-prefix}-wb,
|
|
&.#{$ms-prefix}-ub,
|
|
&.#{$ms-prefix}-ur,
|
|
&.#{$ms-prefix}-br,
|
|
&.#{$ms-prefix}-bg,
|
|
&.#{$ms-prefix}-rw,
|
|
&.#{$ms-prefix}-rg,
|
|
&.#{$ms-prefix}-gw,
|
|
&.#{$ms-prefix}-gu,
|
|
&.#{$ms-prefix}-2w,
|
|
&.#{$ms-prefix}-2u,
|
|
&.#{$ms-prefix}-2b,
|
|
&.#{$ms-prefix}-2r,
|
|
&.#{$ms-prefix}-2g,
|
|
&.#{$ms-prefix}-wup,
|
|
&.#{$ms-prefix}-wbp,
|
|
&.#{$ms-prefix}-ubp,
|
|
&.#{$ms-prefix}-urp,
|
|
&.#{$ms-prefix}-brp,
|
|
&.#{$ms-prefix}-bgp,
|
|
&.#{$ms-prefix}-rwp,
|
|
&.#{$ms-prefix}-rgp,
|
|
&.#{$ms-prefix}-gwp,
|
|
&.#{$ms-prefix}-gup {
|
|
position: relative;
|
|
width: 1.3em;
|
|
height: 1.3em;
|
|
&::before,
|
|
&::after {
|
|
font-size: 0.55em !important;
|
|
position: absolute;
|
|
}
|
|
&::before {
|
|
top: -0.38em;
|
|
left: 0.28em;
|
|
}
|
|
&::after {
|
|
top: 0.5em;
|
|
left: 1.0em;
|
|
}
|
|
}
|
|
&.#{$ms-prefix}-wu,
|
|
&.#{$ms-prefix}-wup {
|
|
background: #edf2b0; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #edf2b0 0%, #edf2b0 50%, #a6c1dd 50%, #a6c1dd 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#edf2b0), color-stop(50%,#edf2b0), color-stop(50%,#a6c1dd), color-stop(100%,#a6c1dd)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #edf2b0 0%,#edf2b0 50%,#a6c1dd 50%,#a6c1dd 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #edf2b0 0%,#edf2b0 50%,#a6c1dd 50%,#a6c1dd 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #edf2b0 0%,#edf2b0 50%,#a6c1dd 50%,#a6c1dd 100%); // IE10+
|
|
background: linear-gradient(135deg, #edf2b0 0%,#edf2b0 50%,#a6c1dd 50%,#a6c1dd 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#edf2b0', endColorstr='#a6c1dd',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-wb,
|
|
&.#{$ms-prefix}-wbp {
|
|
background: #edf2b0; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #edf2b0 0%, #edf2b0 50%, #9c9188 50%, #9c9188 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#edf2b0), color-stop(50%,#edf2b0), color-stop(50%,#9c9188), color-stop(100%,#9c9188)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #edf2b0 0%,#edf2b0 50%,#9c9188 50%,#9c9188 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #edf2b0 0%,#edf2b0 50%,#9c9188 50%,#9c9188 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #edf2b0 0%,#edf2b0 50%,#9c9188 50%,#9c9188 100%); // IE10+
|
|
background: linear-gradient(135deg, #edf2b0 0%,#edf2b0 50%,#9c9188 50%,#9c9188 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#edf2b0', endColorstr='#9c9188',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-ub,
|
|
&.#{$ms-prefix}-ubp {
|
|
background: #a6c1dd; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #a6c1dd 0%, #a6c1dd 50%, #9c9188 50%, #9c9188 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#a6c1dd), color-stop(50%,#a6c1dd), color-stop(50%,#9c9188), color-stop(100%,#9c9188)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #a6c1dd 0%,#a6c1dd 50%,#9c9188 50%,#9c9188 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #a6c1dd 0%,#a6c1dd 50%,#9c9188 50%,#9c9188 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #a6c1dd 0%,#a6c1dd 50%,#9c9188 50%,#9c9188 100%); // IE10+
|
|
background: linear-gradient(135deg, #a6c1dd 0%,#a6c1dd 50%,#9c9188 50%,#9c9188 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6c1dd', endColorstr='#9c9188',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-ur,
|
|
&.#{$ms-prefix}-urp {
|
|
background: #a6c1dd; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #a6c1dd 0%, #a6c1dd 50%, #db8664 50%, #db8664 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#a6c1dd), color-stop(50%,#a6c1dd), color-stop(50%,#db8664), color-stop(100%,#db8664)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #a6c1dd 0%,#a6c1dd 50%,#db8664 50%,#db8664 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #a6c1dd 0%,#a6c1dd 50%,#db8664 50%,#db8664 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #a6c1dd 0%,#a6c1dd 50%,#db8664 50%,#db8664 100%); // IE10+
|
|
background: linear-gradient(135deg, #a6c1dd 0%,#a6c1dd 50%,#db8664 50%,#db8664 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6c1dd', endColorstr='#db8664',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-br,
|
|
&.#{$ms-prefix}-brp {
|
|
background: #aca29a; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #aca29a 0%, #aca29a 50%, #db8664 50%, #db8664 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#aca29a), color-stop(50%,#aca29a), color-stop(50%,#db8664), color-stop(100%,#db8664)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #aca29a 0%,#aca29a 50%,#db8664 50%,#db8664 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #aca29a 0%,#aca29a 50%,#db8664 50%,#db8664 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #aca29a 0%,#aca29a 50%,#db8664 50%,#db8664 100%); // IE10+
|
|
background: linear-gradient(135deg, #aca29a 0%,#aca29a 50%,#db8664 50%,#db8664 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aca29a', endColorstr='#db8664',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-bg,
|
|
&.#{$ms-prefix}-bgp {
|
|
background: #aca29a; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #aca29a 0%, #aca29a 50%, #93b483 50%, #93b483 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#aca29a), color-stop(50%,#aca29a), color-stop(50%,#93b483), color-stop(100%,#93b483)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #aca29a 0%,#aca29a 50%,#93b483 50%,#93b483 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #aca29a 0%,#aca29a 50%,#93b483 50%,#93b483 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #aca29a 0%,#aca29a 50%,#93b483 50%,#93b483 100%); // IE10+
|
|
background: linear-gradient(135deg, #aca29a 0%,#aca29a 50%,#93b483 50%,#93b483 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aca29a', endColorstr='#93b483',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-rw,
|
|
&.#{$ms-prefix}-rwp {
|
|
background: #db8664; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #db8664 0%, #db8664 50%, #edf2b0 50%, #edf2b0 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#db8664), color-stop(50%,#db8664), color-stop(50%,#edf2b0), color-stop(100%,#edf2b0)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #db8664 0%,#db8664 50%,#edf2b0 50%,#edf2b0 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #db8664 0%,#db8664 50%,#edf2b0 50%,#edf2b0 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #db8664 0%,#db8664 50%,#edf2b0 50%,#edf2b0 100%); // IE10+
|
|
background: linear-gradient(135deg, #db8664 0%,#db8664 50%,#edf2b0 50%,#edf2b0 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#db8664', endColorstr='#edf2b0',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-rg,
|
|
&.#{$ms-prefix}-rgp {
|
|
background: #db8664; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #db8664 0%, #db8664 50%, #93b483 50%, #93b483 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#db8664), color-stop(50%,#db8664), color-stop(50%,#93b483), color-stop(100%,#93b483)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #db8664 0%,#db8664 50%,#93b483 50%,#93b483 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #db8664 0%,#db8664 50%,#93b483 50%,#93b483 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #db8664 0%,#db8664 50%,#93b483 50%,#93b483 100%); // IE10+
|
|
background: linear-gradient(135deg, #db8664 0%,#db8664 50%,#93b483 50%,#93b483 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#db8664', endColorstr='#93b483',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-gw,
|
|
&.#{$ms-prefix}-gwp {
|
|
background: #93b483; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #93b483 0%, #93b483 50%, #edf2b0 50%, #edf2b0 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#93b483), color-stop(50%,#93b483), color-stop(50%,#edf2b0), color-stop(100%,#edf2b0)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #93b483 0%,#93b483 50%,#edf2b0 50%,#edf2b0 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #93b483 0%,#93b483 50%,#edf2b0 50%,#edf2b0 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #93b483 0%,#93b483 50%,#edf2b0 50%,#edf2b0 100%); // IE10+
|
|
background: linear-gradient(135deg, #93b483 0%,#93b483 50%,#edf2b0 50%,#edf2b0 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#93b483', endColorstr='#edf2b0',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-gu,
|
|
&.#{$ms-prefix}-gup {
|
|
background: #93b483; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #93b483 0%, #93b483 50%, #b5cde3 50%, #b5cde3 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#93b483), color-stop(50%,#93b483), color-stop(50%,#b5cde3), color-stop(100%,#b5cde3)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #93b483 0%,#93b483 50%,#b5cde3 50%,#b5cde3 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #93b483 0%,#93b483 50%,#b5cde3 50%,#b5cde3 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #93b483 0%,#93b483 50%,#b5cde3 50%,#b5cde3 100%); // IE10+
|
|
background: linear-gradient(135deg, #93b483 0%,#93b483 50%,#b5cde3 50%,#b5cde3 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#93b483', endColorstr='#b5cde3',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-2w {
|
|
background: #beb9b2; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #beb9b2 0%, #beb9b2 50%, #edf2b0 50%, #edf2b0 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#beb9b2), color-stop(50%,#beb9b2), color-stop(50%,#edf2b0), color-stop(100%,#edf2b0)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#edf2b0 50%,#edf2b0 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#edf2b0 50%,#edf2b0 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#edf2b0 50%,#edf2b0 100%); // IE10+
|
|
background: linear-gradient(135deg, #beb9b2 0%,#beb9b2 50%,#edf2b0 50%,#edf2b0 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#beb9b2', endColorstr='#edf2b0',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-2u {
|
|
background: #beb9b2; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #beb9b2 0%, #beb9b2 50%, #b5cde3 50%, #b5cde3 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#beb9b2), color-stop(50%,#beb9b2), color-stop(50%,#b5cde3), color-stop(100%,#b5cde3)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#b5cde3 50%,#b5cde3 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#b5cde3 50%,#b5cde3 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#b5cde3 50%,#b5cde3 100%); // IE10+
|
|
background: linear-gradient(135deg, #beb9b2 0%,#beb9b2 50%,#b5cde3 50%,#b5cde3 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#beb9b2', endColorstr='#b5cde3',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-2b {
|
|
background: #beb9b2; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #beb9b2 0%, #beb9b2 50%, #9c9188 50%, #9c9188 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#beb9b2), color-stop(50%,#beb9b2), color-stop(50%,#9c9188), color-stop(100%,#9c9188)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#9c9188 50%,#9c9188 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#9c9188 50%,#9c9188 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#9c9188 50%,#9c9188 100%); // IE10+
|
|
background: linear-gradient(135deg, #beb9b2 0%,#beb9b2 50%,#9c9188 50%,#9c9188 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#beb9b2', endColorstr='#9c9188',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-2r {
|
|
background: #beb9b2; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #beb9b2 0%, #beb9b2 50%, #db8664 50%, #db8664 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#beb9b2), color-stop(50%,#beb9b2), color-stop(50%,#db8664), color-stop(100%,#db8664)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#db8664 50%,#db8664 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#db8664 50%,#db8664 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#db8664 50%,#db8664 100%); // IE10+
|
|
background: linear-gradient(135deg, #beb9b2 0%,#beb9b2 50%,#db8664 50%,#db8664 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#beb9b2', endColorstr='#db8664',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
&.#{$ms-prefix}-2g {
|
|
background: #beb9b2; // Old browsers
|
|
background: -moz-linear-gradient(-45deg, #beb9b2 0%, #beb9b2 50%, #93b483 50%, #93b483 100%); // FF3.6+
|
|
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#beb9b2), color-stop(50%,#beb9b2), color-stop(50%,#93b483), color-stop(100%,#93b483)); // Chrome,Safari4+
|
|
background: -webkit-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#93b483 50%,#93b483 100%); // Chrome10+,Safari5.1+
|
|
background: -o-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#93b483 50%,#93b483 100%); // Opera 11.10+
|
|
background: -ms-linear-gradient(-45deg, #beb9b2 0%,#beb9b2 50%,#93b483 50%,#93b483 100%); // IE10+
|
|
background: linear-gradient(135deg, #beb9b2 0%,#beb9b2 50%,#93b483 50%,#93b483 100%); // W3C
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#beb9b2', endColorstr='#93b483',GradientType=1 ); // IE6-9 fallback on horizontal gradient
|
|
}
|
|
|
|
// phyrexian mana size increases
|
|
&.#{$ms-prefix}-p::before,
|
|
&.#{$ms-prefix}-wp::before,
|
|
&.#{$ms-prefix}-up::before,
|
|
&.#{$ms-prefix}-bp::before,
|
|
&.#{$ms-prefix}-rp::before,
|
|
&.#{$ms-prefix}-gp::before,
|
|
&.#{$ms-prefix}-wup::before,
|
|
&.#{$ms-prefix}-wbp::before,
|
|
&.#{$ms-prefix}-ubp::before,
|
|
&.#{$ms-prefix}-urp::before,
|
|
&.#{$ms-prefix}-brp::before,
|
|
&.#{$ms-prefix}-bgp::before,
|
|
&.#{$ms-prefix}-rwp::before,
|
|
&.#{$ms-prefix}-rgp::before,
|
|
&.#{$ms-prefix}-gwp::before,
|
|
&.#{$ms-prefix}-gup::before {
|
|
display: inline-block;
|
|
-moz-transform: scale( 1.2, 1.2 );
|
|
-webkit-transform: scale( 1.2, 1.2 );
|
|
transform: scale( 1.2, 1.2 );
|
|
}
|
|
|
|
// alternate tap
|
|
&.#{$ms-prefix}-tap-alt::before {
|
|
display: inline-block;
|
|
-moz-transform: scale( 1.2, 1.2 );
|
|
-webkit-transform: scale( 1.2, 1.2 );
|
|
transform: scale( 1.2, 1.2 );
|
|
padding-left: .06em;
|
|
padding-bottom: 0.10em;
|
|
}
|
|
|
|
// snow mana
|
|
&.#{$ms-prefix}-s {
|
|
&::before {
|
|
color: #fff;
|
|
-webkit-text-stroke: 2px #fff;
|
|
font-size: 0.85em;
|
|
top: -0.05em;
|
|
position: relative;
|
|
display: inline-block;
|
|
}
|
|
&::after {
|
|
//text-shadow: -1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, 1px 1px 0 #fff;
|
|
content: "\e619";
|
|
position: absolute;
|
|
color: #333;
|
|
margin-left: -0.9em;
|
|
font-size: 1.1em;
|
|
}
|
|
&-mtga::before {
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
// tap symbols
|
|
&.#{$ms-prefix}-untap {
|
|
background-color: #111;
|
|
color: #fff;
|
|
}
|
|
|
|
// shadow alternative
|
|
&.#{$ms-prefix}-shadow {
|
|
box-shadow: -0.06em 0.07em 0 #111, 0 0.06em 0 #111;
|
|
&.#{$ms-prefix}-untap {
|
|
box-shadow: -0.06em 0.07em 0 #fff, 0 0.06em 0 #fff;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
// split cost specifics
|
|
|
|
.#{$ms-prefix}-split {
|
|
position: relative;
|
|
width: 1.3em;
|
|
height: 1.3em;
|
|
}
|
|
.#{$ms-prefix}-split::before,
|
|
.#{$ms-prefix}-split::after {
|
|
font-size: 0.55em !important;
|
|
position: absolute;
|
|
}
|
|
.#{$ms-prefix}-split::before {
|
|
top: -0.38em;
|
|
left: 0.28em;
|
|
}
|
|
.#{$ms-prefix}-split::after {
|
|
top: 0.5em;
|
|
left: 1.0em;
|
|
}
|
|
|
|
|
|
// half costs specifics
|
|
|
|
span.#{$ms-prefix}-half { // legacy handling with <span> tag
|
|
width: .675em;
|
|
overflow: hidden;
|
|
display: inline-block;
|
|
margin-left: .675em;
|
|
|
|
> .#{$ms-prefix}-cost {
|
|
margin-left: -.675em;
|
|
}
|
|
}
|
|
|
|
.#{$ms-prefix}-half { // new single-element handling!
|
|
width: .675em;
|
|
margin-left: .675em;
|
|
overflow: hidden;
|
|
border-radius: 0 1em 1em 0;
|
|
&::before {
|
|
margin-left: -.65em;
|
|
}
|
|
}
|
|
|
|
|
|
// un-set costs
|
|
|
|
.#{$ms-prefix}-100 {
|
|
width: 2.4em;
|
|
}
|
|
.#{$ms-prefix}-1000000 {
|
|
width: 5.4em;
|
|
} |