mirror of
https://github.com/andrewgioia/mana.git
synced 2024-10-31 23:44:47 +00:00
Adds documentation for all watermarks and the LotR ability symbols, moves documentation site to docs folder on this branch
This commit is contained in:
parent
b67d98ee50
commit
2a553809b4
GPG Key ID:
FC09694A000800C8
14
CHANGELOG.md
14
CHANGELOG.md
@ -10,9 +10,21 @@ All notable changes to this project will be documented in this file.
|
||||
|
||||
## Versions
|
||||
|
||||
### [1.16.1] 2024-10-28 Watermark documentation
|
||||
|
||||
#### Added
|
||||
|
||||
* Watermark for Trump Katsumai added ([#114](https://github.com/andrewgioia/mana/issues/114))
|
||||
* Documentation now updated for that massive watermark project I abandoned :( All 90+ watermarks are in and on the icons page, finally back here and getting the repo up to speed again. ([#34](https://github.com/andrewgioia/mana/issues/34))
|
||||
* Documented Improvise, Ring Bearer, Amass Orcs, and The Ring Tempts You abilities. [#107](https://github.com/andrewgioia/mana/issues/107))
|
||||
|
||||
#### Changed
|
||||
|
||||
* Moved the documentation to the `./docs` folder like Keyrune, no more `gh-pages` branch.
|
||||
|
||||
### [1.16.0] 2023-09-20 Complete set of card watermarks
|
||||
|
||||
* **Added:** 90 watermarks added/aliased, nearing the complete set of all watermarks save for 2. ([#34](https://github.com/andrewgioia/mana/issues/34)
|
||||
* **Added:** 90 watermarks added/aliased, nearing the complete set of all watermarks save for 2. ([#34](https://github.com/andrewgioia/mana/issues/34))
|
||||
|
||||
### [1.15.9] 2023-09-10 WOE ability symbols, Haktos and Robber symbols, loyalty VI
|
||||
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
# Mana v1.16.0
|
||||
# Mana v1.16.1
|
||||
|
||||
## The Magic: the Gathering mana symbol font!
|
||||
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "mana",
|
||||
"homepage": "https://github.com/andrewgioia/mana",
|
||||
"version": "1.16.0",
|
||||
"version": "1.16.1",
|
||||
"authors": [
|
||||
"Andrew Gioia <andrew@gioia.email>"
|
||||
],
|
||||
|
||||
36
css/mana.css
36
css/mana.css
@ -1248,7 +1248,7 @@
|
||||
background: linear-gradient(135deg, #beb9b2 0%, #beb9b2 50%, #93b483 50%, #93b483 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#beb9b2", endColorstr="#93b483",GradientType=1 );
|
||||
}
|
||||
.ms-cost.ms-p::before, .ms-cost.ms-watermark-phyrexian::before, .ms-cost.ms-wp::before, .ms-cost.ms-up::before, .ms-cost.ms-bp::before, .ms-cost.ms-rp::before, .ms-cost.ms-gp::before, .ms-cost.ms-wup::before, .ms-cost.ms-wbp::before, .ms-cost.ms-ubp::before, .ms-cost.ms-urp::before, .ms-cost.ms-brp::before, .ms-cost.ms-bgp::before, .ms-cost.ms-rwp::before, .ms-cost.ms-rgp::before, .ms-cost.ms-gwp::before, .ms-cost.ms-gup::before {
|
||||
.ms-cost.ms-p::before, .ms-cost.ms-wp::before, .ms-cost.ms-up::before, .ms-cost.ms-bp::before, .ms-cost.ms-rp::before, .ms-cost.ms-gp::before, .ms-cost.ms-wup::before, .ms-cost.ms-wbp::before, .ms-cost.ms-ubp::before, .ms-cost.ms-urp::before, .ms-cost.ms-brp::before, .ms-cost.ms-bgp::before, .ms-cost.ms-rwp::before, .ms-cost.ms-rgp::before, .ms-cost.ms-gwp::before, .ms-cost.ms-gup::before {
|
||||
display: inline-block;
|
||||
-moz-transform: scale(1.2, 1.2);
|
||||
-webkit-transform: scale(1.2, 1.2);
|
||||
@ -1794,22 +1794,22 @@ span.ms-half > .ms-cost {
|
||||
.ms-duo.ms-multicolor::after {
|
||||
content: "\e986";
|
||||
}
|
||||
.ms-duo.ms-school-lorehold::after, .ms-duo.ms-watermark-lorehold::after {
|
||||
.ms-duo.ms-school-lorehold::after {
|
||||
content: "\e99b";
|
||||
}
|
||||
.ms-duo.ms-school-prismari::after, .ms-duo.ms-watermark-prismari::after {
|
||||
.ms-duo.ms-school-prismari::after {
|
||||
content: "\e99d";
|
||||
}
|
||||
.ms-duo.ms-school-quandrix::after, .ms-duo.ms-watermark-quandrix::after {
|
||||
.ms-duo.ms-school-quandrix::after {
|
||||
content: "\e99f";
|
||||
}
|
||||
.ms-duo.ms-school-silverquill::after, .ms-duo.ms-watermark-silverquill::after {
|
||||
.ms-duo.ms-school-silverquill::after {
|
||||
content: "\e9a1";
|
||||
}
|
||||
.ms-duo.ms-school-witherbloom::before, .ms-duo.ms-watermark-witherbloom::before {
|
||||
.ms-duo.ms-school-witherbloom::before {
|
||||
content: "\e9a3";
|
||||
}
|
||||
.ms-duo.ms-school-witherbloom::after, .ms-duo.ms-watermark-witherbloom::after {
|
||||
.ms-duo.ms-school-witherbloom::after {
|
||||
content: "\e9a4";
|
||||
}
|
||||
.ms-duo-color::before {
|
||||
@ -1823,34 +1823,34 @@ span.ms-half > .ms-cost {
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
.ms-duo-color.ms-school-lorehold::before, .ms-duo-color.ms-watermark-lorehold::before {
|
||||
.ms-duo-color.ms-school-lorehold::before {
|
||||
color: #a03731;
|
||||
}
|
||||
.ms-duo-color.ms-school-lorehold::after, .ms-duo-color.ms-watermark-lorehold::after {
|
||||
.ms-duo-color.ms-school-lorehold::after {
|
||||
color: #e4e8c7;
|
||||
}
|
||||
.ms-duo-color.ms-school-prismari::before, .ms-duo-color.ms-watermark-prismari::before {
|
||||
.ms-duo-color.ms-school-prismari::before {
|
||||
color: #a23431;
|
||||
}
|
||||
.ms-duo-color.ms-school-prismari::after, .ms-duo-color.ms-watermark-prismari::after {
|
||||
.ms-duo-color.ms-school-prismari::after {
|
||||
color: #322f5c;
|
||||
}
|
||||
.ms-duo-color.ms-school-quandrix::before, .ms-duo-color.ms-watermark-quandrix::before {
|
||||
.ms-duo-color.ms-school-quandrix::before {
|
||||
color: #352e5f;
|
||||
}
|
||||
.ms-duo-color.ms-school-quandrix::after, .ms-duo-color.ms-watermark-quandrix::after {
|
||||
.ms-duo-color.ms-school-quandrix::after {
|
||||
color: #519e52;
|
||||
}
|
||||
.ms-duo-color.ms-school-silverquill::before, .ms-duo-color.ms-watermark-silverquill::before {
|
||||
.ms-duo-color.ms-school-silverquill::before {
|
||||
color: #181616;
|
||||
}
|
||||
.ms-duo-color.ms-school-silverquill::after, .ms-duo-color.ms-watermark-silverquill::after {
|
||||
.ms-duo-color.ms-school-silverquill::after {
|
||||
color: #e5e9ca;
|
||||
}
|
||||
.ms-duo-color.ms-school-witherbloom::before, .ms-duo-color.ms-watermark-witherbloom::before {
|
||||
.ms-duo-color.ms-school-witherbloom::before {
|
||||
color: #2f312d;
|
||||
}
|
||||
.ms-duo-color.ms-school-witherbloom::after, .ms-duo-color.ms-watermark-witherbloom::after {
|
||||
.ms-duo-color.ms-school-witherbloom::after {
|
||||
color: #4f9b4f;
|
||||
}
|
||||
|
||||
@ -1969,7 +1969,7 @@ span.ms-half > .ms-cost {
|
||||
.ms-ci-wubr, .ms-ci-bruw, .ms-ci-brwu, .ms-ci-burw, .ms-ci-buwr, .ms-ci-bwru, .ms-ci-bwur, .ms-ci-rbuw, .ms-ci-rbwu, .ms-ci-rubw, .ms-ci-ruwb, .ms-ci-rwbu, .ms-ci-rwub, .ms-ci-ubrw, .ms-ci-ubwr, .ms-ci-urbw, .ms-ci-urwb, .ms-ci-uwbr, .ms-ci-uwrb, .ms-ci-wbru, .ms-ci-wbur, .ms-ci-wrbu, .ms-ci-wrub, .ms-ci-wurb, .ms-ci-yore {
|
||||
background: conic-gradient(#fff 45deg, #3b6ba0 45deg 135deg, #383431 135deg 225deg, #c6553e 225deg 315deg, #fff 315deg);
|
||||
}
|
||||
.ms-ci-wubrg, .ms-ci-rugbw, .ms-ci-rugwb, .ms-ci-ruwbg, .ms-ci-ruwgb, .ms-ci-rwbgu, .ms-ci-rwbug, .ms-ci-rwgbu, .ms-ci-rwgub, .ms-ci-rwubg, .ms-ci-rwugb, .ms-ci-ubgrw, .ms-ci-ubgwr, .ms-ci-ubrgw, .ms-ci-ubrwg, .ms-ci-ubwgr, .ms-ci-ubwrg, .ms-ci-ugbrw, .ms-ci-ugbwr, .ms-ci-ugrbw, .ms-ci-ugrwb, .ms-ci-ugwbr, .ms-ci-ugwrb, .ms-ci-urbgw, .ms-ci-urbwg, .ms-ci-urgbw, .ms-ci-urgwb, .ms-ci-urwbg, .ms-ci-urwgb, .ms-ci-uwbgr, .ms-ci-uwbrg, .ms-ci-uwgbr, .ms-ci-uwgrb, .ms-ci-uwrbg, .ms-ci-uwrgb, .ms-ci-wbgru, .ms-ci-wbgur, .ms-ci-wbrgu, .ms-ci-wbrug, .ms-ci-wbugr, .ms-ci-wburg, .ms-ci-wgbru, .ms-ci-wgbur, .ms-ci-wgrbu, .ms-ci-wgrub, .ms-ci-wgubr, .ms-ci-wgurb, .ms-ci-wrbgu, .ms-ci-wrbug, .ms-ci-wrgbu, .ms-ci-wrgub, .ms-ci-wrubg, .ms-ci-wrugb, .ms-ci-wubgr, .ms-ci-wugbr, .ms-ci-wugrb, .ms-ci-wurbg, .ms-ci-wurgb, .ms-ci-bgruw, .ms-ci-bgrwu, .ms-ci-bgurw, .ms-ci-bguwr, .ms-ci-bgwru, .ms-ci-bgwur, .ms-ci-brguw, .ms-ci-brgwu, .ms-ci-brugw, .ms-ci-bruwg, .ms-ci-brwgu, .ms-ci-brwug, .ms-ci-bugrw, .ms-ci-bugwr, .ms-ci-burgw, .ms-ci-burwg, .ms-ci-buwgr, .ms-ci-buwrg, .ms-ci-bwgru, .ms-ci-bwgur, .ms-ci-bwrgu, .ms-ci-bwrug, .ms-ci-bwugr, .ms-ci-bwurg, .ms-ci-gbruw, .ms-ci-gbrwu, .ms-ci-gburw, .ms-ci-gbuwr, .ms-ci-gbwru, .ms-ci-gbwur, .ms-ci-grbuw, .ms-ci-grbwu, .ms-ci-grubw, .ms-ci-gruwb, .ms-ci-grwbu, .ms-ci-grwub, .ms-ci-gubrw, .ms-ci-gubwr, .ms-ci-gurbw, .ms-ci-gurwb, .ms-ci-guwbr, .ms-ci-guwrb, .ms-ci-gwbru, .ms-ci-gwbur, .ms-ci-gwrbu, .ms-ci-gwrub, .ms-ci-gwubr, .ms-ci-gwurb, .ms-ci-rbguw, .ms-ci-rbgwu, .ms-ci-rbugw, .ms-ci-rbuwg, .ms-ci-rbwgu, .ms-ci-rbwug, .ms-ci-rgbuw, .ms-ci-rgbwu, .ms-ci-rgubw, .ms-ci-rguwb, .ms-ci-rgwbu, .ms-ci-rgwub, .ms-ci-rubgw, .ms-ci-rubwg, .ms-ci-5 {
|
||||
.ms-ci-wubrg, .ms-ci-bgruw, .ms-ci-bgrwu, .ms-ci-bgurw, .ms-ci-bguwr, .ms-ci-bgwru, .ms-ci-bgwur, .ms-ci-brguw, .ms-ci-brgwu, .ms-ci-brugw, .ms-ci-bruwg, .ms-ci-brwgu, .ms-ci-brwug, .ms-ci-bugrw, .ms-ci-bugwr, .ms-ci-burgw, .ms-ci-burwg, .ms-ci-buwgr, .ms-ci-buwrg, .ms-ci-bwgru, .ms-ci-bwgur, .ms-ci-bwrgu, .ms-ci-bwrug, .ms-ci-bwugr, .ms-ci-bwurg, .ms-ci-gbruw, .ms-ci-gbrwu, .ms-ci-gburw, .ms-ci-gbuwr, .ms-ci-gbwru, .ms-ci-gbwur, .ms-ci-grbuw, .ms-ci-grbwu, .ms-ci-grubw, .ms-ci-gruwb, .ms-ci-grwbu, .ms-ci-grwub, .ms-ci-gubrw, .ms-ci-gubwr, .ms-ci-gurbw, .ms-ci-gurwb, .ms-ci-guwbr, .ms-ci-guwrb, .ms-ci-gwbru, .ms-ci-gwbur, .ms-ci-gwrbu, .ms-ci-gwrub, .ms-ci-gwubr, .ms-ci-gwurb, .ms-ci-rbguw, .ms-ci-rbgwu, .ms-ci-rbugw, .ms-ci-rbuwg, .ms-ci-rbwgu, .ms-ci-rbwug, .ms-ci-rgbuw, .ms-ci-rgbwu, .ms-ci-rgubw, .ms-ci-rguwb, .ms-ci-rgwbu, .ms-ci-rgwub, .ms-ci-rubgw, .ms-ci-rubwg, .ms-ci-rugbw, .ms-ci-rugwb, .ms-ci-ruwbg, .ms-ci-ruwgb, .ms-ci-rwbgu, .ms-ci-rwbug, .ms-ci-rwgbu, .ms-ci-rwgub, .ms-ci-rwubg, .ms-ci-rwugb, .ms-ci-ubgrw, .ms-ci-ubgwr, .ms-ci-ubrgw, .ms-ci-ubrwg, .ms-ci-ubwgr, .ms-ci-ubwrg, .ms-ci-ugbrw, .ms-ci-ugbwr, .ms-ci-ugrbw, .ms-ci-ugrwb, .ms-ci-ugwbr, .ms-ci-ugwrb, .ms-ci-urbgw, .ms-ci-urbwg, .ms-ci-urgbw, .ms-ci-urgwb, .ms-ci-urwbg, .ms-ci-urwgb, .ms-ci-uwbgr, .ms-ci-uwbrg, .ms-ci-uwgbr, .ms-ci-uwgrb, .ms-ci-uwrbg, .ms-ci-uwrgb, .ms-ci-wbgru, .ms-ci-wbgur, .ms-ci-wbrgu, .ms-ci-wbrug, .ms-ci-wbugr, .ms-ci-wburg, .ms-ci-wgbru, .ms-ci-wgbur, .ms-ci-wgrbu, .ms-ci-wgrub, .ms-ci-wgubr, .ms-ci-wgurb, .ms-ci-wrbgu, .ms-ci-wrbug, .ms-ci-wrgbu, .ms-ci-wrgub, .ms-ci-wrubg, .ms-ci-wrugb, .ms-ci-wubgr, .ms-ci-wugbr, .ms-ci-wugrb, .ms-ci-wurbg, .ms-ci-wurgb, .ms-ci-5 {
|
||||
background: conic-gradient(#fff 36deg, #3b6ba0 36deg 108deg, #383431 108deg 180deg, #c6553e 180deg 252deg, #3d684b 252deg 324deg, #fff 324deg);
|
||||
}
|
||||
|
||||
|
||||
File diff suppressed because one or more lines are too long
2
css/mana.min.css
vendored
2
css/mana.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
1
docs/CNAME
Normal file
1
docs/CNAME
Normal file
@ -0,0 +1 @@
|
||||
mana.andrewgioia.com
|
||||
360
docs/assets/docs.css
Normal file
360
docs/assets/docs.css
Normal file
@ -0,0 +1,360 @@
|
||||
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700,700i');
|
||||
@font-face {
|
||||
font-family: 'Beleren';
|
||||
src: url( '../fonts/beleren.eot' );
|
||||
src: url( '../fonts/beleren.woff' ) format( 'woff' ),
|
||||
url( '../fonts/beleren.ttf' ) format( 'truetype' ),
|
||||
url( '../fonts/beleren.svg' ) format( 'svg' );
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
body {
|
||||
background: #fff;
|
||||
color: #333;
|
||||
font-family: "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans",
|
||||
Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 15px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
max-width: 1080px;
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #007185;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #263D41;
|
||||
}
|
||||
|
||||
section#banner {
|
||||
background: #b6c1b0;
|
||||
color: #555;
|
||||
padding: 12px 0;
|
||||
text-align: right;
|
||||
text-shadow: 0 1px 0 #bacec2;
|
||||
}
|
||||
|
||||
section#banner .item {
|
||||
display: inline-block;
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
section#banner .logo {
|
||||
color: #333;
|
||||
float: left;
|
||||
font-family: Beleren;
|
||||
font-size: 18px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
|
||||
header {
|
||||
background: #d3d8c1;
|
||||
border-bottom: 1px solid #adb7a7;
|
||||
color: #333;
|
||||
margin: 0;
|
||||
overflow-y: hidden;
|
||||
padding: 25px 0 15px;
|
||||
}
|
||||
|
||||
header.main {
|
||||
height: 272px;
|
||||
}
|
||||
|
||||
.bigicon {
|
||||
float: right;
|
||||
font-size: 364px;
|
||||
line-height: 200px;
|
||||
margin-top: -40px;
|
||||
text-shadow: 0 2px 0 #fff;
|
||||
}
|
||||
|
||||
header .vs {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 16px;
|
||||
line-height: 1.6em;
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
section.icons p {
|
||||
margin-left: 25px;
|
||||
}
|
||||
|
||||
ul {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
li {
|
||||
margin: 0 0 10px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #444;
|
||||
margin: 0;
|
||||
font-family: Beleren;
|
||||
font-size: 64px;
|
||||
font-weight: lighter;
|
||||
padding: 0 0 20px;
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
}
|
||||
|
||||
h1.sub {
|
||||
font-size: 48px;
|
||||
padding: 0 0 15px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
color: #444;
|
||||
font-family: Beleren;
|
||||
font-size: 30px;
|
||||
font-weight: lighter;
|
||||
margin: 0;
|
||||
padding: 0 0 30px;
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
}
|
||||
|
||||
h2.sub {
|
||||
font-size: 26px;
|
||||
padding: 0 0 20px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
color: #444;
|
||||
font-size: 19px;
|
||||
font-weight: normal;
|
||||
line-height: 1.6em;
|
||||
padding-bottom: 20px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
h4 {
|
||||
color: #61605B;
|
||||
font-family: Beleren;
|
||||
font-size: 24px;
|
||||
font-weight: lighter;
|
||||
margin: 15px 0 5px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
h5 {
|
||||
color: #555;
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
margin: 15px 0 5px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
main {
|
||||
margin: 0;
|
||||
padding: 20px 0 25px;
|
||||
}
|
||||
|
||||
main section.content {
|
||||
padding: 0 0 10px;
|
||||
}
|
||||
|
||||
blockquote,
|
||||
code {
|
||||
font-family: Inconsolate, 'Courier New', Courier, monospace;
|
||||
}
|
||||
|
||||
code {
|
||||
background: #F7EEF1;
|
||||
color: #BB073B;
|
||||
padding: 1px 3px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
background: #eee;
|
||||
border-bottom: 1px solid #d3d8c1;
|
||||
line-height: 1.4em;
|
||||
padding: 20px 20px 18px;
|
||||
margin: 20px 0 25px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.button {
|
||||
background: #008eae;
|
||||
border-bottom: 2px solid #166075;
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
font-size: 20px;
|
||||
padding: 10px 18px 9px;
|
||||
border-radius: 4px;
|
||||
text-shadow: 0 1px 0 #333;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
background: #00809F;
|
||||
border-bottom-color: #155A6E;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.button .ms {
|
||||
margin-right: 5px;
|
||||
position: relative;
|
||||
top: -2px;
|
||||
}
|
||||
|
||||
.button.vs {
|
||||
background: #666;
|
||||
border-bottom-color: #333;
|
||||
}
|
||||
|
||||
.button.vs:hover {
|
||||
background: #555;
|
||||
border-bottom-color: #222;
|
||||
}
|
||||
|
||||
.button.dl.float-right {
|
||||
margin-top: -10px;
|
||||
}
|
||||
|
||||
.icons {
|
||||
padding: 10px 0 5px;
|
||||
}
|
||||
|
||||
.icon {
|
||||
border-radius: 3px;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
width: 24.5%;
|
||||
}
|
||||
|
||||
.icon span {
|
||||
display: inline-block;
|
||||
padding: 9px 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.icon:hover {
|
||||
background: #eee;
|
||||
position: relative;
|
||||
margin-top: -4px;
|
||||
margin-bottom: -5px;
|
||||
}
|
||||
|
||||
.icon .ms {
|
||||
font-size: 22px;
|
||||
margin-right: 5px;
|
||||
margin-top: -2px;
|
||||
text-align: center;
|
||||
width: 32px;
|
||||
}
|
||||
|
||||
.icon:hover .ms {
|
||||
font-size: 32px;
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
}
|
||||
|
||||
.icon:hover .ms.ms-duo {
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.icon em {
|
||||
color: #999;
|
||||
font-size: 13px;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.icons.indicators .icon .ms {
|
||||
width: 22px;
|
||||
margin: -2px 10px 0 5px;
|
||||
}
|
||||
|
||||
.icons.indicators .icon:hover .ms {
|
||||
margin: 0 5px -1px 0;
|
||||
width: 32px;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.vectors {
|
||||
padding: 10px 0 0;
|
||||
}
|
||||
|
||||
.utf {
|
||||
display: inline-block;
|
||||
width: 25%;
|
||||
float: left;
|
||||
padding: 6px 0;
|
||||
}
|
||||
|
||||
.vectors.overflow .utf {
|
||||
overflow-x: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.utf.long {
|
||||
width: 33%;
|
||||
}
|
||||
|
||||
.utf i {
|
||||
display: inline-block;
|
||||
font-family: mana;
|
||||
font-style: normal;
|
||||
font-size: 1.25em;
|
||||
vertical-align: top;
|
||||
padding: 0 5px 0 0;
|
||||
text-align: center;
|
||||
width: 1.25em;
|
||||
}
|
||||
|
||||
.utf i.long {
|
||||
text-align: left;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.utf code {
|
||||
background-color: #f5f5f5;
|
||||
color: #555;
|
||||
margin-left: 3px;
|
||||
}
|
||||
|
||||
.example {
|
||||
font-size: 16px;
|
||||
padding: 15px 0 0;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.example .each {
|
||||
display: block;
|
||||
padding-top: 1px;
|
||||
padding-bottom: 7px;
|
||||
}
|
||||
|
||||
.explanation {
|
||||
margin-left: 200px;
|
||||
}
|
||||
|
||||
footer {
|
||||
border-top: 1px solid #eee;
|
||||
margin-top: 20px;
|
||||
padding: 10px 0 30px;
|
||||
}
|
||||
|
||||
.float-left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.float-right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.clear {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.e { color: #63A35C; }
|
||||
.a { color: #795DA3; }
|
||||
.v { color: #183691; }
|
||||
1
docs/assets/mana.min.css
vendored
Normal file
1
docs/assets/mana.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
docs/assets/mana.min.css.map
Normal file
1
docs/assets/mana.min.css.map
Normal file
File diff suppressed because one or more lines are too long
2
docs/assets/zepto.min.js
vendored
Normal file
2
docs/assets/zepto.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
295
docs/attributes.html
Normal file
295
docs/attributes.html
Normal file
@ -0,0 +1,295 @@
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="chrome=1" />
|
||||
<title>Attributes and Examples | Mana</title>
|
||||
<link rel="stylesheet" href="css/mana.min.css" />
|
||||
<link rel="stylesheet" href="css/main.css" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<section id="banner">
|
||||
<div class="wrapper">
|
||||
<a href="index.html" class="logo"><i class="ms ms-g" style="top:-2px;position:relative;"></i> Mana</a>
|
||||
<a href="index.html" class="item">Home</a>
|
||||
<a href="icons.html" class="item">Mana Icons</a>
|
||||
<a href="attributes.html" class="item">Attributes</a>
|
||||
<a href="https://github.com/andrewgioia/mana" class="item">GitHub Project</a>
|
||||
<span class="item">
|
||||
<iframe src="https://ghbtns.com/github-btn.html?user=andrewgioia&repo=mana&type=star&count=true" frameborder="0" scrolling="0" width="100px" height="20px" style="margin-bottom: -4px;"></iframe>
|
||||
</span>
|
||||
<span class="item">
|
||||
Created by
|
||||
<a href="https://andrewgioia.com">Andrew Gioia</a>
|
||||
</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<header>
|
||||
<div class="wrapper">
|
||||
<h1 class="sub">Mana & Card Icons</h1>
|
||||
<a class="dl button float-right" href="https://github.com/andrewgioia/mana/archive/master.zip">
|
||||
<i class="ms ms-instant"></i>
|
||||
Download
|
||||
</a>
|
||||
<h2 class="sub">Complete set of Magic mana and card symbol font icons</h2>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<div class="wrapper">
|
||||
<section>
|
||||
<h3><strong>Mana</strong> has some built in icon options to easily change the <strong>size and position</strong>, convert the mana symbols to the <strong>casting costs</strong>, and create planeswalker <strong>loyalty symbols</strong> with numbers. Take a look below at examples of each option with the class names to implement them.</h3>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>The Basic Icon</h4>
|
||||
<div class="example float-left">
|
||||
<span class="each">
|
||||
<i class="ms ms-u"></i> .ms-u
|
||||
</span>
|
||||
</div>
|
||||
<div class="explanation">
|
||||
<p>You can place Mana icons anywhere using the CSS classname prefix <code>ms</code> (for "mana symbol") and then the mana/card symbol's <a href="icons.html">suffix</a>.</p>
|
||||
<blockquote>
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-u"</span>></<span class="e">i</span>> <br />
|
||||
</blockquote>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Creating a Casting Cost</h4>
|
||||
<div class="example float-left">
|
||||
<span class="each">
|
||||
<i class="ms ms-g ms-cost"></i> .ms-cost
|
||||
</span>
|
||||
<span class="each">
|
||||
<i class="ms ms-r ms-cost ms-shadow"></i> + .ms-shadow
|
||||
</span>
|
||||
</div>
|
||||
<div class="explanation">
|
||||
<p>Add the <code>.ms-cost</code> class to create a casting cost circle around the symbol. Append the <code>.ms-shadow</code> class to add a drop shadow.</p>
|
||||
<blockquote>
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-g ms-cost"</span>></<span class="e">i</span>> <br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-r ms-cost ms-shadow"</span>></<span class="e">i</span>>
|
||||
</blockquote>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Split Casting Costs</h4>
|
||||
<div class="example float-left">
|
||||
<span class="each">
|
||||
<i class="ms ms-wu ms-split ms-cost"></i> .ms-wu
|
||||
</span>
|
||||
<span class="each">
|
||||
<i class="ms ms-2b ms-split ms-cost ms-shadow"></i> + .ms-shadow
|
||||
</span>
|
||||
</div>
|
||||
<div class="explanation">
|
||||
<p><strong>New:</strong> You no longer need the <code>.ms-split</code> class name, simply identifying a split or hybrid cost will now automatically handle the split styles.</p>
|
||||
<blockquote>
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-wu ms-cost"</span>></<span class="e">i</span>><br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-2b ms-cost ms-shadow"</span>></<span class="e">i</span>>
|
||||
</blockquote>
|
||||
<p>For backwards compatibility and full control you can still use create split and hybrid casting costs separately with the <code>.ms-split</code> class along with the 2-symbols' codes. This works for color pairs and the "2" with a color.</p>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Half Mana Casting Costs</h4>
|
||||
<div class="example float-left">
|
||||
<span class="each">
|
||||
<i class="ms ms-w ms-half ms-cost"></i></span> .ms-half
|
||||
</span>
|
||||
</div>
|
||||
<div class="explanation">
|
||||
<p>Even though there's only been <a href="http://magiccards.info/uh/en/16.html"><strike>one</strike></a> <a href="https://scryfall.com/card/unh/82/monss-goblin-waiters">two</a> of these ever printed you can still create them :P Half costs <a href="https://github.com/andrewgioia/Mana/issues/6">used to require a wrapping element</a> but as of v1.4.1 they are a regular single element:</p>
|
||||
<blockquote>
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-w ms-half ms-cost"</span>></<span class="e">i</span>><br />
|
||||
</blockquote>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Planeswalker Symbols</h4>
|
||||
<div class="example float-left">
|
||||
<span class="each">
|
||||
<i class="ms ms-loyalty-up ms-loyalty-3"></i> .ms-loyalty-up
|
||||
</span>
|
||||
<span class="each">
|
||||
<i class="ms ms-loyalty-down ms-loyalty-2"></i> .ms-loyalty-down
|
||||
</span>
|
||||
</div>
|
||||
<div class="explanation">
|
||||
<p>You can create planewalker loyalty symbols for the starting value, zero, and ticking up or down. The number that appears is based on a class you add, like <code>.ms-loyalty-4</code>. Currently numbers 0-20 are supported for start, up, and down.</p>
|
||||
<blockquote>
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-loyalty-up ms-loyalty-3"</span>></<span class="e">i</span>><br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-loyalty-down ms-loyalty-2"</span>></<span class="e">i</span>>
|
||||
</blockquote>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Saga Symbols</h4>
|
||||
<div class="example float-left">
|
||||
<span class="each">
|
||||
<i class="ms ms-saga ms-saga-1 ms-2x"></i> .ms-saga-1
|
||||
</span>
|
||||
<span class="each">
|
||||
<i class="ms ms-saga ms-saga-4 ms-2x"></i> .ms-saga-4
|
||||
</span>
|
||||
</div>
|
||||
<div class="explanation">
|
||||
<p>Saga symbols are supported natively up to V, even though only IV has ever been printed. The number that appears inside the hexagon is based on a class you add, like <code>.ms-saga-2</code>.</p>
|
||||
<blockquote>
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-saga ms-saga-1"</span>></<span class="e">i</span>><br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-saga ms-saga-4"</span>></<span class="e">i</span>>
|
||||
</blockquote>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Battle Symbols</h4>
|
||||
<div class="example float-left">
|
||||
<span class="each">
|
||||
<i class="ms ms-defense ms-defense-1 ms-2x"></i> .ms-defense
|
||||
</span>
|
||||
<span class="each">
|
||||
<i class="ms ms-defense ms-defense-outline ms-defense-3 ms-2x"></i> .ms-defense-outline
|
||||
</span>
|
||||
<span class="each">
|
||||
<i class="ms ms-defense ms-defense-print ms-defense-5 ms-2x"></i> .ms-defense-print
|
||||
</span>
|
||||
</div>
|
||||
<div class="explanation">
|
||||
<p>Battle cards have a unique defense box and values are supported from 0-20 using utility classes similar to Loyalty and Sagas, in the format <code>.ms-defense-2</code>.</p>
|
||||
<p>There are 3 variations of the symbol that you can display. The simplest is just the black background with a white number (<code>.ms-defense</code>). An outline version has a black border with black number and white inside (<code>.ms-defense-outline</code>). Finally the full "print" version uses 3 layers and mimics the way the defense box is printed on cards; use this with <code>.ms-defense-print</code>.</p>
|
||||
<blockquote>
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-defense ms-defense-1"</span>></<span class="e">i</span>><br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-defense ms-defense-outline ms-defense-3"</span>></<span class="e">i</span>><br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-defense ms-defense-print ms-defense-5"</span>></<span class="e">i</span>>
|
||||
</blockquote>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Increase the Symbol's Size</h4>
|
||||
<div class="example float-left">
|
||||
<span class="each">
|
||||
<i class="ms ms-r ms-2x"></i> .ms-2x
|
||||
</span>
|
||||
<span class="each">
|
||||
<i class="ms ms-r ms-3x"></i> .ms-3x
|
||||
</span>
|
||||
<span class="each">
|
||||
<i class="ms ms-r ms-4x"></i> .ms-4x
|
||||
</span>
|
||||
<span class="each">
|
||||
<i class="ms ms-r ms-5x"></i> .ms-5x
|
||||
</span>
|
||||
<span class="each">
|
||||
<i class="ms ms-r ms-6x"></i> .ms-6x
|
||||
</span>
|
||||
</div>
|
||||
<div class="explanation">
|
||||
<p>To conveniently increase the size of a mana or card symbol you can append the classes <code>ms-2x</code>, <code>ms-3x</code>, <code>ms-4x</code>, <code>ms-4x</code>, and <code>ms-6x</code>. These classes increase the size by a factor equal to class name number.</p>
|
||||
<blockquote>
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-r ms-2x"</span>></<span class="e">i</span>> ms-2x<br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-r ms-3x"</span>></<span class="e">i</span>> ms-3x<br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-r ms-4x"</span>></<span class="e">i</span>> ms-4x<br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-r ms-5x"</span>></<span class="e">i</span>> ms-5x<br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-r ms-6x"</span>></<span class="e">i</span>> ms-6x
|
||||
</blockquote>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Fixed Width</h4>
|
||||
<div class="example float-left">
|
||||
<span class="each"><i class="ms ms-planeswalker ms-fw"></i> Planeswalker</span>
|
||||
<span class="each"><i class="ms ms-land ms-fw"></i> Land</span>
|
||||
</div>
|
||||
<div class="explanation">
|
||||
<p>Some of the card symbols are variable width by default, if you put them in a list they may stack irregularly. To fix their width to a standard size, just append the class <code>.ms-fw</code> and the symbols will have a constant width and centered icon.</p>
|
||||
<blockquote>
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-planeswalker ms-fw"</span>></<span class="e">i</span>> Planeswalker symbol<br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-land ms-fw"</span>></<span class="e">i</span>> Land symbol
|
||||
</blockquote>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Dual-Layered Symbols</h4>
|
||||
<div class="example float-left">
|
||||
<span class="each"><i class="ms ms-2x ms-multicolor"></i> One layer</span>
|
||||
<span class="each"><i class="ms ms-2x ms-multicolor ms-duo"></i> Two layers</span>
|
||||
<span class="each"><i class="ms ms-2x ms-multicolor ms-duo ms-duo-color ms-grad"></i> Two with color</span>
|
||||
<span class="each"><i class="ms ms-2x ms-school-prismari ms-duo ms-duo-color"></i> Prismari</span>
|
||||
</div>
|
||||
<div class="explanation">
|
||||
<p>The <a href="https://mtg.gamepedia.com/Multicolored">multicolor symbol</a> has 2 layers and the only way to reliably achieve this is with 2 glyphs. Add <code>.ms-duo</code> and <code>.ms-multicolor</code> will add the background layer and knock out the foreground. If you add <code>.ms-duo-color</code> and optionally <code>.ms-grad</code> it will colorize it like the official symbol.</p>
|
||||
<blockquote>
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-multicolor"</span>></<span class="e">i</span>> One layer<br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-multicolor ms-duo"</span>></<span class="e">i</span>> Two layers<br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-multicolor ms-duo ms-duo-color ms-grad"</span>></<span class="e">i</span>> Complete multicolor symbol
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-school-prismari ms-duo ms-duo-color"</span>></<span class="e">i</span>> Prismari colored symbol
|
||||
</blockquote>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Arena Abilites and MODO Counters</h4>
|
||||
<div class="example float-left">
|
||||
<span class="each"><i class="ms ms-2x ms-ability-flying"></i> Evergreen ability</span>
|
||||
<span class="each"><i class="ms ms-2x ms-ability-adventure ms-mechanic"></i> Set-specific ability</span>
|
||||
<span class="each"><i class="ms ms-2x ms-counter-plus"></i> MODO counter</span>
|
||||
</div>
|
||||
<div class="explanation">
|
||||
<p>Mana has full Arena and Modo ability and counter coverage. You can apply the set-specific gold gradient that Arena uses on abilities with <code>.ms-mechanic</code>.</p>
|
||||
<blockquote>
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-ability-flying"</span>></<span class="e">i</span>> Evergreen ability<br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-ability-adventure ms-mechanic"</span>></<span class="e">i</span>> Set-specific ability<br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-counter-plus"</span>></<span class="e">i</span>> MODO counter
|
||||
</blockquote>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Card Color Indicators</h4>
|
||||
<div class="example float-left">
|
||||
<span class="each"><i class="ms ms-2x ms-ci ms-ci-1 ms-ci-g"></i> Green</span>
|
||||
<span class="each"><i class="ms ms-2x ms-ci ms-ci-2 ms-ci-rg"></i> Red/Green</span>
|
||||
<span class="each"><i class="ms ms-2x ms-ci ms-ci-3 ms-ci-gur"></i> Red/Green/Blue</span>
|
||||
</div>
|
||||
<div class="explanation">
|
||||
<p>Some cards use color indicator circles on their alternate faces to indicate that the card is still a certain color identity. Mana supports all 31 variations, though only about 10 different color combinations exist on cards currently.</p>
|
||||
<blockquote>
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-ci ms-ci-1 ms-ci-g"</span>></<span class="e">i</span>> Green<br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-ci ms-ci-2 ms-ci-rg"</span>></<span class="e">i</span>> Red/Green<br />
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-ci ms-ci-3 ms-ci-gur"</span>></<span class="e">i</span>> Red/Green/Blue<br />
|
||||
</blockquote>
|
||||
<p>To display these, use class <code>.ms-ci</code> and then <code>.ms-ci-X</code> where "X" is the number of colors in the identity. Then add the corresponding color class, like <code>.ms-ci-wug</code>.</p>
|
||||
<p>Importantly, the only SVGs used to display these are the borders, and there are 5 different border glyphs. The colors themselves are displayed using the <code>background: conic-gradient();</code> CSS attribute, which you can view the support for on <a href="https://caniuse.com/css-conic-gradients" target="blank">Can I Use</a>. TL;DR: it has almost universal practical browser support.</p>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="wrapper">
|
||||
<div class="float-left">
|
||||
<p>Made with ♥ by <a href="https://andrewgioia.com">Andrew Gioia</a></p>
|
||||
</div>
|
||||
<div class="float-right" style="text-align: right;">
|
||||
<p>
|
||||
All mana images and card symbols © <a href="http://magicthegathering.com">Wizards of the Coast</a><br />
|
||||
The Mana font is licensed under the the <a href="http://scripts.sil.org/OFL">SIL OFL 1.1</a><br />
|
||||
Mana CSS, LESS, and Sass files are licensed under the <a href="http://opensource.org/licenses/mit-license.html">MIT License</a><br />
|
||||
</p>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
361
docs/cheatsheet.html
Normal file
361
docs/cheatsheet.html
Normal file
@ -0,0 +1,361 @@
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="chrome=1" />
|
||||
<title>Icon Cheatsheet | Mana</title>
|
||||
<link rel="stylesheet" href="css/mana.min.css" />
|
||||
<link rel="stylesheet" href="css/main.css" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<section id="banner">
|
||||
<div class="wrapper">
|
||||
<a href="index.html" class="logo"><i class="ms ms-g" style="top:-2px;position:relative;"></i> Mana</a>
|
||||
<a href="index.html" class="item">Home</a>
|
||||
<a href="icons.html" class="item">Mana Icons</a>
|
||||
<a href="attributes.html" class="item">Attributes</a>
|
||||
<a href="http://github.com/andrewgioia/Mana" class="item">GitHub Project</a>
|
||||
<span class="item">
|
||||
<iframe src="https://ghbtns.com/github-btn.html?user=andrewgioia&repo=mana&type=star&count=true" frameborder="0" scrolling="0" width="100px" height="20px" style="margin-bottom: -4px;"></iframe>
|
||||
</span>
|
||||
<span class="item">
|
||||
Created by
|
||||
<a href="http://andrewgioia.com">Andrew Gioia</a>
|
||||
</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<header>
|
||||
<div class="wrapper">
|
||||
<h1 class="sub">Mana & Card Icons</h1>
|
||||
<a class="dl button float-right" href="https://github.com/andrewgioia/Mana/archive/master.zip">
|
||||
<i class="ms ms-instant"></i>
|
||||
Download
|
||||
</a>
|
||||
<h2 class="sub">The complete Mana copy-able reference</h2>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<div class="wrapper">
|
||||
<section>
|
||||
<h3>
|
||||
To use Mana on the desktop, install mana.otf, set it
|
||||
as the font in your application, then copy and paste the
|
||||
icons (not the unicode) directly from this page into
|
||||
your designs. The UTF8 representation is provided as
|
||||
a reference as well.
|
||||
</h3>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Icons, CSS Class, and Unicode</h4>
|
||||
<div class="vectors">
|
||||
<span class="utf"><i></i> ms-w <code>&#xe600;</code></span>
|
||||
<span class="utf"><i></i> ms-u <code>&#xe601;</code></span>
|
||||
<span class="utf"><i></i> ms-b <code>&#xe602;</code></span>
|
||||
<span class="utf"><i></i> ms-r <code>&#xe603;</code></span>
|
||||
<span class="utf"><i></i> ms-g <code>&#xe604;</code></span>
|
||||
<span class="utf"><i></i> ms-w-original <code>&#xe997;</code></span>
|
||||
<span class="utf"><i></i> ms-w-list <code>&#xe998;</code></span>
|
||||
<span class="utf"><i></i> ms-c <code>&#xe904;</code></span>
|
||||
<span class="utf"><i></i> ms-0 <code>&#xe605;</code></span>
|
||||
<span class="utf"><i></i> ms-1 <code>&#xe606;</code></span>
|
||||
<span class="utf"><i></i> ms-2 <code>&#xe607;</code></span>
|
||||
<span class="utf"><i></i> ms-3 <code>&#xe608;</code></span>
|
||||
<span class="utf"><i></i> ms-4 <code>&#xe609;</code></span>
|
||||
<span class="utf"><i></i> ms-5 <code>&#xe60a;</code></span>
|
||||
<span class="utf"><i></i> ms-6 <code>&#xe60b;</code></span>
|
||||
<span class="utf"><i></i> ms-7 <code>&#xe60c;</code></span>
|
||||
<span class="utf"><i></i> ms-8 <code>&#xe60d;</code></span>
|
||||
<span class="utf"><i></i> ms-9 <code>&#xe60e;</code></span>
|
||||
<span class="utf"><i></i> ms-10 <code>&#xe60f;</code></span>
|
||||
<span class="utf"><i></i> ms-11 <code>&#xe610;</code></span>
|
||||
<span class="utf"><i></i> ms-12 <code>&#xe611;</code></span>
|
||||
<span class="utf"><i></i> ms-13 <code>&#xe612;</code></span>
|
||||
<span class="utf"><i></i> ms-14 <code>&#xe613;</code></span>
|
||||
<span class="utf"><i></i> ms-15 <code>&#xe614;</code></span>
|
||||
<span class="utf"><i></i> ms-16 <code>&#xe62a;</code></span>
|
||||
<span class="utf"><i></i> ms-17 <code>&#xe62b;</code></span>
|
||||
<span class="utf"><i></i> ms-18 <code>&#xe62c;</code></span>
|
||||
<span class="utf"><i></i> ms-19 <code>&#xe62d;</code></span>
|
||||
<span class="utf"><i></i> ms-20 <code>&#xe62e;</code></span>
|
||||
<span class="utf"><i></i> ms-x <code>&#xe615;</code></span>
|
||||
<span class="utf"><i></i> ms-y <code>&#xe616;</code></span>
|
||||
<span class="utf"><i></i> ms-z <code>&#xe617;</code></span>
|
||||
<span class="utf"><i></i> ms-p <code>&#xe618;</code></span>
|
||||
<span class="utf"><i></i> ms-s <code>&#xe619;</code></span>
|
||||
<span class="utf"><i></i> ms-s-mtga <code>&#xe996;</code></span>
|
||||
<span class="utf"><i></i> ms-e <code>&#xe907;</code></span>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div class="vectors">
|
||||
<span class="utf"><i></i> ms-1-2 <code>&#xe902;</code></span>
|
||||
<span class="utf"><i></i> ms-acorn <code>&#xe929;</code></span>
|
||||
<span class="utf"><i></i> ms-artist-brush <code>&#xe923;</code></span>
|
||||
<span class="utf"><i></i> ms-artist-nib <code>&#xe924;</code></span>
|
||||
<span class="utf"><i></i> ms-chaos <code>&#xe61d;</code></span>
|
||||
<span class="utf"><i></i> ms-defense <code>&#xe9d7;</code></span>
|
||||
<span class="utf"><i></i> ms-defense-outline <code>&#xe9d8;</code></span>
|
||||
<span class="utf"><i></i> ms-infinity <code>&#xe903;</code></span>
|
||||
<span class="utf"><i></i> ms-level <code>&#xe9c7;</code></span>
|
||||
<span class="utf"><i></i> ms-level-border <code>&#xe9c8;</code></span>
|
||||
<span class="utf"><i></i> ms-loyalty-up <code>&#xe627;</code></span>
|
||||
<span class="utf"><i></i> ms-loyalty-down <code>&#xe625;</code></span>
|
||||
<span class="utf"><i></i> ms-loyalty-zero <code>&#xe626;</code></span>
|
||||
<span class="utf"><i></i> ms-loyalty-start <code>&#xe628;</code></span>
|
||||
<span class="utf"><i></i> ms-multicolor <code>&#xe985;</code></span>
|
||||
<span class="utf"><i></i> ms-power <code>&#xe921;</code></span>
|
||||
<span class="utf"><i></i> ms-saga <code>&#xe92a;</code></span>
|
||||
<span class="utf"><i></i> ms-tap <code>&#xe61a;</code></span>
|
||||
<span class="utf"><i></i> ms-tap-alt <code>&#xe61c;</code></span>
|
||||
<span class="utf"><i></i> ms-toughness <code>&#xe922;</code></span>
|
||||
<span class="utf"><i></i> ms-untap <code>&#xe61b;</code></span>
|
||||
<span class="utf"><i></i> ms-ci-1 <code>&#xe98a;</code></span>
|
||||
<span class="utf"><i></i> ms-ci-2 <code>&#xe98b;</code></span>
|
||||
<span class="utf"><i></i> ms-ci-3 <code>&#xe98c;</code></span>
|
||||
<span class="utf"><i></i> ms-ci-4 <code>&#xe98d;</code></span>
|
||||
<span class="utf"><i></i> ms-ci-5 <code>&#xe98e;</code></span>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div class="vectors">
|
||||
<span class="utf"><i style="width:auto;"></i> ms-100 <code>&#xe900;</code></span>
|
||||
<span class="utf long"><i class="long"></i> ms-1000000 <code>&#xe901;</code></span>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div class="vectors overflow">
|
||||
<span class="utf"><i></i> ms-artifact <code>&#xe61e;</code></span>
|
||||
<span class="utf"><i></i> ms-battle <code>&#xe9d1;</code></span>
|
||||
<span class="utf"><i></i> ms-battle-siege <code>&#xe9d2;</code></span>
|
||||
<span class="utf"><i></i> ms-conspiracy <code>&#xe972;</code></span>
|
||||
<span class="utf"><i></i> ms-creature <code>&#xe61f;</code></span>
|
||||
<span class="utf"><i></i> ms-enchantment <code>&#xe620;</code></span>
|
||||
<span class="utf"><i></i> ms-flashback <code>&#xe629;</code></span>
|
||||
<span class="utf"><i></i> ms-instant <code>&#xe621;</code></span>
|
||||
<span class="utf"><i></i> ms-land <code>&#xe622;</code></span>
|
||||
<span class="utf"><i></i> ms-multiple <code>&#xe925;</code></span>
|
||||
<span class="utf"><i></i> ms-phenomenon <code>&#xe96e;</code></span>
|
||||
<span class="utf"><i></i> ms-plane <code>&#xe96f;</code></span>
|
||||
<span class="utf"><i></i> ms-planeswalker <code>&#xe623;</code></span>
|
||||
<span class="utf"><i></i> ms-rarity <code>&#xe96c;</code></span>
|
||||
<span class="utf"><i></i> ms-scheme <code>&#xe970;</code></span>
|
||||
<span class="utf"><i></i> ms-sorcery <code>&#xe624;</code></span>
|
||||
<span class="utf"><i></i> ms-token <code>&#xe96d;</code></span>
|
||||
<span class="utf"><i></i> ms-tribal <code>&#xe925;</code></span>
|
||||
<span class="utf"><i></i> ms-vanguard <code>&#xe971;</code></span>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div class="vectors overflow">
|
||||
<span class="utf"><i></i> ms-dfc-night <code>&#xe905;</code></span>
|
||||
<span class="utf"><i></i> ms-dfc-day <code>&#xe906;</code></span>
|
||||
<span class="utf"><i></i> ms-dfc-spark <code>&#xe909;</code></span>
|
||||
<span class="utf"><i></i> ms-dfc-ignite <code>&#xe908;</code></span>
|
||||
<span class="utf"><i></i> ms-dfc-moon <code>&#xe90b;</code></span>
|
||||
<span class="utf"><i></i> ms-dfc-emrakul <code>&#xe90a;</code></span>
|
||||
<span class="utf"><i></i> ms-dfc-enchantment <code>&#xe920;</code></span>
|
||||
<span class="utf"><i></i> ms-dfc-lesson <code>&#xe98f;</code></span>
|
||||
<span class="utf"><i></i> ms-dfc-front <code>&#xe9d3;</code></span>
|
||||
<span class="utf"><i></i> ms-dfc-back <code>&#xe9d4;</code></span>
|
||||
<span class="utf"><i></i> ms-dfc-meld <code>&#xe9d5;</code></span>
|
||||
<span class="utf"><i></i> ms-dfc-facedown <code>&#xe9d6;</code></span>
|
||||
<span class="utf"><i></i> ms-dfc-modal-face <code>&#xe983;</code></span>
|
||||
<span class="utf"><i></i> ms-dfc-modal-back <code>&#xe984;</code></span>
|
||||
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div class="vectors overflow">
|
||||
<span class="utf"><i></i> ms-guild-azorius <code>&#xe90c;</code></span>
|
||||
<span class="utf"><i></i> ms-guild-boros <code>&#xe90d;</code></span>
|
||||
<span class="utf"><i></i> ms-guild-dimir <code>&#xe90e;</code></span>
|
||||
<span class="utf"><i></i> ms-guild-golgari <code>&#xe90f;</code></span>
|
||||
<span class="utf"><i></i> ms-guild-gruul <code>&#xe910;</code></span>
|
||||
<span class="utf"><i></i> ms-guild-izzet <code>&#xe911;</code></span>
|
||||
<span class="utf"><i></i> ms-guild-orzhov <code>&#xe912;</code></span>
|
||||
<span class="utf"><i></i> ms-guild-rakdos <code>&#xe913;</code></span>
|
||||
<span class="utf"><i></i> ms-guild-selesnya <code>&#xe914;</code></span>
|
||||
<span class="utf"><i></i> ms-guild-simic <code>&#xe915;</code></span>
|
||||
<span class="utf"><i></i> ms-clan-abzan <code>&#xe916;</code></span>
|
||||
<span class="utf"><i></i> ms-clan-jeskai <code>&#xe917;</code></span>
|
||||
<span class="utf"><i></i> ms-clan-mardu <code>&#xe918;</code></span>
|
||||
<span class="utf"><i></i> ms-clan-sultai <code>&#xe919;</code></span>
|
||||
<span class="utf"><i></i> ms-clan-temur <code>&#xe91a;</code></span>
|
||||
<span class="utf"><i></i> ms-clan-atarka <code>&#xe91b;</code></span>
|
||||
<span class="utf"><i></i> ms-clan-dromoka <code>&#xe91c;</code></span>
|
||||
<span class="utf"><i></i> ms-clan-ojutai <code>&#xe91d;</code></span>
|
||||
<span class="utf"><i></i> ms-clan-kolaghan <code>&#xe91e;</code></span>
|
||||
<span class="utf"><i></i> ms-clan-silumgar <code>&#xe91f;</code></span>
|
||||
<span class="utf"><i></i> ms-polis-setessa <code>&#xe926;</code></span>
|
||||
<span class="utf"><i></i> ms-polis-akros <code>&#xe927;</code></span>
|
||||
<span class="utf"><i></i> ms-polis-meletis <code>&#xe928;</code></span>
|
||||
<span class="utf"><i></i> ms-school-lorehold <code>&#xe99a;</code></span>
|
||||
<span class="utf"><i></i> ms-school-prismari <code>&#xe99c;</code></span>
|
||||
<span class="utf"><i></i> ms-school-quandrix <code>&#xe99e;</code></span>
|
||||
<span class="utf"><i></i> ms-school-silverquill <code>&#xe9a0;</code></span>
|
||||
<span class="utf"><i></i> ms-school-witherbloom <code>&#xe9a2;</code></span>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div class="vectors overflow">
|
||||
<span class="utf"><i></i> ms-ability-activated <code>&#xe947;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-adamant <code>&#xe974;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-adapt <code>&#xe975;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-addendum <code>&#xe976;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-adventure <code>&#xe948;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-afflict <code>&#xe977;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-afterlife <code>&#xe978;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-aftermath <code>&#xe979;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-alliance <code>&#xe9b5;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-amass <code>&#xe97a;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-ascend <code>&#xe94a;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-backup <code>&#xe9d9;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-bargain <code>&#xe9e2;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-blitz <code>&#xe9b4;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-boast <code>&#xe991;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-casualty <code>&#xe9b7;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-celebration <code>&#xe9e3;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-changeling <code>&#xe9a6;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-channel <code>&#xe9b1;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-cleave <code>&#xe9ad;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-companion <code>&#xe97b;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-constellation <code>&#xe97c;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-convoke <code>&#xe9da;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-convoke-original <code>&#xe949;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-corrupted <code>&#xe9c0;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-coven <code>&#xe9aa;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-d20 <code>&#xe999;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-day-night <code>&#xe9a8;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-daybound-nightbound <code>&#xe9a9;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-deathtouch <code>&#xe94b;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-decayed <code>&#xe9ac;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-defender <code>&#xe94c;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-devotion <code>&#xe97d;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-disturb <code>&#xe9ae;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-domain <code>&#xe9a7;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-double-strike <code>&#xe94d;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-dungeon <code>&#xe995;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-embalm <code>&#xe97e;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-enlist <code>&#xe9ba;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-enrage <code>&#xe9dc;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-enrage-original <code>&#xe94e;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-escape <code>&#xe969;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-eternalize <code>&#xe97f;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-exploit <code>&#xe9af;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-explore <code>&#xe94f;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-first-strike <code>&#xe950;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-flash <code>&#xe951;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-flying <code>&#xe952;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-for-mirrodin <code>&#xe9c1;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-foretell <code>&#xe990;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-haktos-the-unscarred <code>&#xe9e4;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-haste <code>&#xe953;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-hexproof <code>&#xe954;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-hexproof-black <code>&#xe955;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-hexproof-blue <code>&#xe956;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-hexproof-green <code>&#xe957;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-hexproof-red <code>&#xe958;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-hexproof-white <code>&#xe959;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-hideaway <code>&#xe9b8;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-incubate <code>&#xe9db;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-indestructible <code>&#xe95a;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-investigate <code>&#xe9ab;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-jumpstart <code>&#xe95b;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-kicker <code>&#xe989;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-landfall <code>&#xe988;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-learn <code>&#xe994;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-lifelink <code>&#xe95c;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-magecraft <code>&#xe993;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-meld <code>&#xe9bd;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-menace <code>&#xe95d;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-mentor <code>&#xe95e;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-mutate <code>&#xe980;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-ninjutsu <code>&#xe9b2;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-obscura <code>&#xe9b6;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-party <code>&#xe987;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-phyrexian <code>&#xe618;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-proliferate <code>&#xe981;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-prototype <code>&#xe9be;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-prowess <code>&#xe982;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-raid <code>&#xe95f;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-reach <code>&#xe960;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-read-ahead <code>&#xe9b9;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-reconfigure <code>&#xe9b3;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-revolt <code>&#xe961;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-riot <code>&#xe973;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-robber-of-the-rich <code>&#xe9e5;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-role-cursed <code>&#xe9e6;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-role-monster <code>&#xe9e7;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-role-royal <code>&#xe9e8;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-role-sorceror <code>&#xe9e9;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-role-wicked <code>&#xe9ea;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-role-young-hero <code>&#xe9eb;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-specialize <code>&#xe9bb;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-spectacle <code>&#xe96b;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-static <code>&#xe962;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-summoning-sickness <code>&#xe96a;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-surveil <code>&#xe963;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-toxic <code>&#xe9bf;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-training <code>&#xe9b0;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-trample <code>&#xe964;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-transform <code>&#xe965;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-triggered <code>&#xe966;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-unearth <code>&#xe9bc;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-undergrowth <code>&#xe967;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-vigilance <code>&#xe968;</code></span>
|
||||
<span class="utf"><i></i> ms-ability-ward <code>&#xe992;</code></span>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div class="vectors overflow">
|
||||
<span class="utf"><i></i> ms-counter-arrow <code>&#xe92b;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-brick <code>&#xe92c;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-charge <code>&#xe92d;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-damage <code>&#xe9dd;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-devotion <code>&#xe92e;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-doom <code>&#xe92f;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-echo <code>&#xe930;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-flame <code>&#xe931;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-flood <code>&#xe932;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-fungus <code>&#xe933;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-gold <code>&#xe934;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-ki <code>&#xe935;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-lore <code>&#xe936;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-loyalty <code>&#xe937;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-mining <code>&#xe938;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-minus <code>&#xe939;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-minus-uneven <code>&#xe943;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-muster <code>&#xe93a;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-paw <code>&#xe93b;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-pin <code>&#xe93c;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-plus <code>&#xe93d;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-plus-uneven <code>&#xe944;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-scream <code>&#xe93e;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-shield <code>&#xe9c3;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-skeleton <code>&#xe93f;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-skull <code>&#xe940;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-stun <code>&#xe9c2;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-slime <code>&#xe941;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-time <code>&#xe942;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-verse <code>&#xe945;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-void <code>&#xe9ec;</code></span>
|
||||
<span class="utf"><i></i> ms-counter-vortex <code>&#xe946;</code></span>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="wrapper">
|
||||
<div class="float-left">
|
||||
<p>Made with ♥ by <a href="https://andrewgioia.com">Andrew Gioia</a></p>
|
||||
</div>
|
||||
<div class="float-right" style="text-align: right;">
|
||||
<p>
|
||||
All mana images and card symbols © <a href="http://magicthegathering.com">Wizards of the Coast</a><br />
|
||||
The Mana font is licensed under the the <a href="http://scripts.sil.org/OFL">SIL OFL 1.1</a><br />
|
||||
Mana CSS, LESS, and Sass files are licensed under the <a href="http://opensource.org/licenses/mit-license.html">MIT License</a><br />
|
||||
</p>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
BIN
docs/favicon.ico
Normal file
BIN
docs/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
BIN
docs/fonts/beleren.eot
Executable file
BIN
docs/fonts/beleren.eot
Executable file
Binary file not shown.
BIN
docs/fonts/beleren.otf
Executable file
BIN
docs/fonts/beleren.otf
Executable file
Binary file not shown.
3634
docs/fonts/beleren.svg
Executable file
3634
docs/fonts/beleren.svg
Executable file
File diff suppressed because it is too large
Load Diff
|
After Width: | Height: | Size: 219 KiB |
BIN
docs/fonts/beleren.ttf
Executable file
BIN
docs/fonts/beleren.ttf
Executable file
Binary file not shown.
BIN
docs/fonts/beleren.woff
Executable file
BIN
docs/fonts/beleren.woff
Executable file
Binary file not shown.
BIN
docs/fonts/mana.eot
Normal file
BIN
docs/fonts/mana.eot
Normal file
Binary file not shown.
429
docs/fonts/mana.svg
Normal file
429
docs/fonts/mana.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.5 MiB |
BIN
docs/fonts/mana.ttf
Normal file
BIN
docs/fonts/mana.ttf
Normal file
Binary file not shown.
BIN
docs/fonts/mana.woff
Normal file
BIN
docs/fonts/mana.woff
Normal file
Binary file not shown.
BIN
docs/fonts/mana.woff2
Normal file
BIN
docs/fonts/mana.woff2
Normal file
Binary file not shown.
BIN
docs/fonts/mplantin.eot
Executable file
BIN
docs/fonts/mplantin.eot
Executable file
Binary file not shown.
1484
docs/fonts/mplantin.svg
Executable file
1484
docs/fonts/mplantin.svg
Executable file
File diff suppressed because it is too large
Load Diff
|
After Width: | Height: | Size: 206 KiB |
BIN
docs/fonts/mplantin.ttf
Executable file
BIN
docs/fonts/mplantin.ttf
Executable file
Binary file not shown.
BIN
docs/fonts/mplantin.woff
Executable file
BIN
docs/fonts/mplantin.woff
Executable file
Binary file not shown.
1195
docs/icons.html
Normal file
1195
docs/icons.html
Normal file
File diff suppressed because it is too large
Load Diff
107
docs/index.html
Normal file
107
docs/index.html
Normal file
@ -0,0 +1,107 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="chrome=1" />
|
||||
<title>Mana | Andrew Gioia</title>
|
||||
<link rel="stylesheet" href="assets/mana.min.css" />
|
||||
<link rel="stylesheet" href="assets/docs.css" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<section id="banner">
|
||||
<div class="wrapper">
|
||||
<a href="index.html" class="item">Home</a>
|
||||
<a href="icons.html" class="item">Mana Icons</a>
|
||||
<a href="attributes.html" class="item">Attributes</a>
|
||||
<a href="https://github.com/andrewgioia/Mana" class="item">GitHub Project</a>
|
||||
<span class="item">
|
||||
<iframe src="https://ghbtns.com/github-btn.html?user=andrewgioia&repo=mana&type=star&count=true" frameborder="0" scrolling="0" width="100px" height="20px" style="margin-bottom: -4px;"></iframe>
|
||||
</span>
|
||||
<span class="item">
|
||||
Created by
|
||||
<a href="http://andrewgioia.com">Andrew Gioia</a>
|
||||
</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<header class="main">
|
||||
<div class="wrapper">
|
||||
<div class="bigicon">
|
||||
<i class="ms ms-g"></i>
|
||||
</div>
|
||||
<h1>Mana</h1>
|
||||
<h2>Magic: the Gathering card symbol font</h2>
|
||||
<div class="actions">
|
||||
<a class="dl button" href="https://github.com/andrewgioia/mana/archive/master.zip">
|
||||
<i class="ms ms-instant"></i>
|
||||
Download
|
||||
</a>
|
||||
<a class="vs button" href="icons.html">
|
||||
<i class="ms ms-tap"></i>
|
||||
View Mana Icons
|
||||
</a>
|
||||
</div>
|
||||
<p>
|
||||
Current version 1.15.9 includes all known mana and card symbols up to Wilds of Eldraine.
|
||||
</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<div class="wrapper">
|
||||
<section>
|
||||
<h3><strong>Mana is a complete set of scalable vector icons for Magic mana (and other card) symbols.</strong> Drop them into your application, website, or custom cards (like this <i class="ms ms-cost ms-g"></i>) and control their size, color, drop shadow, or any dimension just as you would with text!</h3>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Using Mana</h4>
|
||||
<p>Each mana/card symbol has its own font character. Display them in a manner similar to <a href="https://fontawesome.io">Font Awesome</a> using the <code><i class="ms ..."></i></code> element. There are class names for each mana color (w, u, b, r, g, c) and for the various symbols that appear on cards (like tap). See the <a href="icons.html">full list</a> of available symbols.</p>
|
||||
<p>To use Mana, move the font files to your /fonts directory and include the <code>mana.css</code> stylesheet in your <code><head></code>:</p>
|
||||
<blockquote>
|
||||
<<span class="e">link</span> <span class="a">href</span>=<span class="v">"css/mana.css"</span> <span class="a">rel</span>=<span class="v">"stylesheet"</span> <span class="a">type</span>=<span class="v">"text/css"</span> />
|
||||
</blockquote>
|
||||
<p><strong>New!</strong> You can also now use Mana via CDN thanks to the amazing <a href="https://jsdelivr.com">jsDelivr</a> project! You can include the latest version in your project (and note the name is "mana-font"):</p>
|
||||
<blockquote>
|
||||
<<span class="e">link</span> <span class="a">href</span>=<span class="v">"//cdn.jsdelivr.net/npm/mana-font@latest/css/mana.css"</span> <span class="a">rel</span>=<span class="v">"stylesheet"</span> <span class="a">type</span>=<span class="v">"text/css"</span> />
|
||||
</blockquote>
|
||||
<p>Insert set symbol icons by using the <code>.ms</code> class and then the mana/symbol code class(es), such as <code>.ms-u</code> for blue mana: <i class="ms ms-u"></i></p>
|
||||
<blockquote>
|
||||
<<span class="e">i</span> <span class="a">class</span>=<span class="v">"ms ms-u"</span>></<span class="e">i</span>>
|
||||
</blockquote>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>Editing the Source</h4>
|
||||
<p>Feel free to edit the source files and compile Mana to fit your needs. All SVG glyphs are compiled into font files using the wonderful <a href="https://icomoon.io">IcoMoon</a> app. For styling, both LESS and Sass are included.</p>
|
||||
</section>
|
||||
<section class="content">
|
||||
<h4>License</h4>
|
||||
<p>Please review the following licenses for each component of Mana:</p>
|
||||
<ul>
|
||||
<li>All mana and card symbol images are copyright Wizards of the Coast (<a href="https://magicthegathering.com">http://magicthegathering.com</a>)</li>
|
||||
<li>The Mana font is licensed under the the SIL OFL 1.1 (<a href="https://scripts.sil.org/OFL">http://scripts.sil.org/OFL</a>)</li>
|
||||
<li>Mana CSS, LESS, and Sass files are licensed under the MIT License (<a href="https://opensource.org/licenses/mit-license.html">http://opensource.org/licenses/mit-license.html</a>)</li>
|
||||
</ul>
|
||||
<p>Attribution is <strong>greatly appreciated</strong> but not required!</p>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="wrapper">
|
||||
<div class="float-left">
|
||||
<p>Made with ♥ by <a href="https://andrewgioia.com">Andrew Gioia</a></p>
|
||||
</div>
|
||||
<div class="float-right" style="text-align: right;">
|
||||
<p>
|
||||
All mana images and card symbols © <a href="https://magicthegathering.com">Wizards of the Coast</a><br />
|
||||
The Mana font is licensed under the the <a href="https://scripts.sil.org/OFL">SIL OFL 1.1</a><br />
|
||||
Mana CSS, LESS, and Sass files are licensed under the <a href="https://opensource.org/licenses/mit-license.html">MIT License</a><br />
|
||||
</p>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
487
package-lock.json
generated
Normal file
487
package-lock.json
generated
Normal file
@ -0,0 +1,487 @@
|
||||
{
|
||||
"name": "mana-font",
|
||||
"version": "1.16.0",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "mana-font",
|
||||
"version": "1.16.0",
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"sass": "^1.80.4"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher/-/watcher-2.4.1.tgz",
|
||||
"integrity": "sha512-HNjmfLQEVRZmHRET336f20H/8kOozUGwk7yajvsonjNxbj2wBTK1WsQuHkD5yYh9RxFGL2EyDHryOihOwUoKDA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"detect-libc": "^1.0.3",
|
||||
"is-glob": "^4.0.3",
|
||||
"micromatch": "^4.0.5",
|
||||
"node-addon-api": "^7.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@parcel/watcher-android-arm64": "2.4.1",
|
||||
"@parcel/watcher-darwin-arm64": "2.4.1",
|
||||
"@parcel/watcher-darwin-x64": "2.4.1",
|
||||
"@parcel/watcher-freebsd-x64": "2.4.1",
|
||||
"@parcel/watcher-linux-arm-glibc": "2.4.1",
|
||||
"@parcel/watcher-linux-arm64-glibc": "2.4.1",
|
||||
"@parcel/watcher-linux-arm64-musl": "2.4.1",
|
||||
"@parcel/watcher-linux-x64-glibc": "2.4.1",
|
||||
"@parcel/watcher-linux-x64-musl": "2.4.1",
|
||||
"@parcel/watcher-win32-arm64": "2.4.1",
|
||||
"@parcel/watcher-win32-ia32": "2.4.1",
|
||||
"@parcel/watcher-win32-x64": "2.4.1"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-android-arm64": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-android-arm64/-/watcher-android-arm64-2.4.1.tgz",
|
||||
"integrity": "sha512-LOi/WTbbh3aTn2RYddrO8pnapixAziFl6SMxHM69r3tvdSm94JtCenaKgk1GRg5FJ5wpMCpHeW+7yqPlvZv7kg==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"android"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-darwin-arm64": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.4.1.tgz",
|
||||
"integrity": "sha512-ln41eihm5YXIY043vBrrHfn94SIBlqOWmoROhsMVTSXGh0QahKGy77tfEywQ7v3NywyxBBkGIfrWRHm0hsKtzA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"darwin"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-darwin-x64": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-x64/-/watcher-darwin-x64-2.4.1.tgz",
|
||||
"integrity": "sha512-yrw81BRLjjtHyDu7J61oPuSoeYWR3lDElcPGJyOvIXmor6DEo7/G2u1o7I38cwlcoBHQFULqF6nesIX3tsEXMg==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"darwin"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-freebsd-x64": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-freebsd-x64/-/watcher-freebsd-x64-2.4.1.tgz",
|
||||
"integrity": "sha512-TJa3Pex/gX3CWIx/Co8k+ykNdDCLx+TuZj3f3h7eOjgpdKM+Mnix37RYsYU4LHhiYJz3DK5nFCCra81p6g050w==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"freebsd"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-arm-glibc": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-glibc/-/watcher-linux-arm-glibc-2.4.1.tgz",
|
||||
"integrity": "sha512-4rVYDlsMEYfa537BRXxJ5UF4ddNwnr2/1O4MHM5PjI9cvV2qymvhwZSFgXqbS8YoTk5i/JR0L0JDs69BUn45YA==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-arm64-glibc": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-glibc/-/watcher-linux-arm64-glibc-2.4.1.tgz",
|
||||
"integrity": "sha512-BJ7mH985OADVLpbrzCLgrJ3TOpiZggE9FMblfO65PlOCdG++xJpKUJ0Aol74ZUIYfb8WsRlUdgrZxKkz3zXWYA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-arm64-musl": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-musl/-/watcher-linux-arm64-musl-2.4.1.tgz",
|
||||
"integrity": "sha512-p4Xb7JGq3MLgAfYhslU2SjoV9G0kI0Xry0kuxeG/41UfpjHGOhv7UoUDAz/jb1u2elbhazy4rRBL8PegPJFBhA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-x64-glibc": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-glibc/-/watcher-linux-x64-glibc-2.4.1.tgz",
|
||||
"integrity": "sha512-s9O3fByZ/2pyYDPoLM6zt92yu6P4E39a03zvO0qCHOTjxmt3GHRMLuRZEWhWLASTMSrrnVNWdVI/+pUElJBBBg==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-x64-musl": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-musl/-/watcher-linux-x64-musl-2.4.1.tgz",
|
||||
"integrity": "sha512-L2nZTYR1myLNST0O632g0Dx9LyMNHrn6TOt76sYxWLdff3cB22/GZX2UPtJnaqQPdCRoszoY5rcOj4oMTtp5fQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-win32-arm64": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-win32-arm64/-/watcher-win32-arm64-2.4.1.tgz",
|
||||
"integrity": "sha512-Uq2BPp5GWhrq/lcuItCHoqxjULU1QYEcyjSO5jqqOK8RNFDBQnenMMx4gAl3v8GiWa59E9+uDM7yZ6LxwUIfRg==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"win32"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-win32-ia32": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-win32-ia32/-/watcher-win32-ia32-2.4.1.tgz",
|
||||
"integrity": "sha512-maNRit5QQV2kgHFSYwftmPBxiuK5u4DXjbXx7q6eKjq5dsLXZ4FJiVvlcw35QXzk0KrUecJmuVFbj4uV9oYrcw==",
|
||||
"cpu": [
|
||||
"ia32"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"win32"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-win32-x64": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-win32-x64/-/watcher-win32-x64-2.4.1.tgz",
|
||||
"integrity": "sha512-+DvS92F9ezicfswqrvIRM2njcYJbd5mb9CUgtrHCHmvn7pPPa+nMDRu1o1bYYz/l5IB2NVGNJWiH7h1E58IF2A==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"win32"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/braces": {
|
||||
"version": "3.0.3",
|
||||
"resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
|
||||
"integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"fill-range": "^7.1.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/chokidar": {
|
||||
"version": "4.0.1",
|
||||
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-4.0.1.tgz",
|
||||
"integrity": "sha512-n8enUVCED/KVRQlab1hr3MVpcVMvxtZjmEa956u+4YijlmQED223XMSYj2tLuKvr4jcCTzNNMpQDUer72MMmzA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"readdirp": "^4.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 14.16.0"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://paulmillr.com/funding/"
|
||||
}
|
||||
},
|
||||
"node_modules/detect-libc": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz",
|
||||
"integrity": "sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"bin": {
|
||||
"detect-libc": "bin/detect-libc.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=0.10"
|
||||
}
|
||||
},
|
||||
"node_modules/fill-range": {
|
||||
"version": "7.1.1",
|
||||
"resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
|
||||
"integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"to-regex-range": "^5.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/immutable": {
|
||||
"version": "4.3.7",
|
||||
"resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.7.tgz",
|
||||
"integrity": "sha512-1hqclzwYwjRDFLjcFxOM5AYkkG0rpFPpr1RLPMEuGczoS7YA8gLhy8SWXYRAA/XwfEHpfo3cw5JGioS32fnMRw==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/is-extglob": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
|
||||
"integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/is-glob": {
|
||||
"version": "4.0.3",
|
||||
"resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
|
||||
"integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"is-extglob": "^2.1.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/is-number": {
|
||||
"version": "7.0.0",
|
||||
"resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
|
||||
"integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=0.12.0"
|
||||
}
|
||||
},
|
||||
"node_modules/micromatch": {
|
||||
"version": "4.0.8",
|
||||
"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
|
||||
"integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"braces": "^3.0.3",
|
||||
"picomatch": "^2.3.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8.6"
|
||||
}
|
||||
},
|
||||
"node_modules/node-addon-api": {
|
||||
"version": "7.1.1",
|
||||
"resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-7.1.1.tgz",
|
||||
"integrity": "sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/picomatch": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
|
||||
"integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=8.6"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/jonschlinkert"
|
||||
}
|
||||
},
|
||||
"node_modules/readdirp": {
|
||||
"version": "4.0.2",
|
||||
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.0.2.tgz",
|
||||
"integrity": "sha512-yDMz9g+VaZkqBYS/ozoBJwaBhTbZo3UNYQHNRw1D3UFQB8oHB4uS/tAODO+ZLjGWmUbKnIlOWO+aaIiAxrUWHA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">= 14.16.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "individual",
|
||||
"url": "https://paulmillr.com/funding/"
|
||||
}
|
||||
},
|
||||
"node_modules/sass": {
|
||||
"version": "1.80.4",
|
||||
"resolved": "https://registry.npmjs.org/sass/-/sass-1.80.4.tgz",
|
||||
"integrity": "sha512-rhMQ2tSF5CsuuspvC94nPM9rToiAFw2h3JTrLlgmNw1MH79v8Cr3DH6KF6o6r+8oofY3iYVPUf66KzC8yuVN1w==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@parcel/watcher": "^2.4.1",
|
||||
"chokidar": "^4.0.0",
|
||||
"immutable": "^4.0.0",
|
||||
"source-map-js": ">=0.6.2 <2.0.0"
|
||||
},
|
||||
"bin": {
|
||||
"sass": "sass.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/source-map-js": {
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
|
||||
"integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/to-regex-range": {
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
|
||||
"integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"is-number": "^7.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
11
package.json
11
package.json
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "mana-font",
|
||||
"version": "1.16.0",
|
||||
"version": "1.16.1",
|
||||
"description": "Magic: the Gathering mana symbol pictographic font",
|
||||
"main": "css/mana.css",
|
||||
"repository": {
|
||||
@ -22,12 +22,15 @@
|
||||
"sass": "sass sass/mana.scss css/mana.css --style=expanded",
|
||||
"sassmin": "sass sass/mana.scss css/mana.min.css --style compressed",
|
||||
"rename": "for f in `find fonts/*`; do mv -v \"$f\" \"`echo $f | tr '[A-Z]' '[a-z]'`\"; done",
|
||||
"build": "npm run -s sass && npm run -s sassmin"
|
||||
"build": "rsync -avzh ./fonts/mana* ./docs/fonts/ && npm run -s sass && npm run -s sassmin && rsync -avzh css/mana.min* ./docs/assets/"
|
||||
},
|
||||
"author": "Andrew Gioia <andrew@gioia.email>",
|
||||
"license": "MIT",
|
||||
"bugs": {
|
||||
"url": "https://github.com/andrewgioia/mana/issues"
|
||||
},
|
||||
"homepage": "https://mana.andrewgioia.com"
|
||||
}
|
||||
"homepage": "https://mana.andrewgioia.com",
|
||||
"devDependencies": {
|
||||
"sass": "^1.80.4"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,5 +1,9 @@
|
||||
@use "variables";
|
||||
@use "colors";
|
||||
@use "icons";
|
||||
|
||||
// color indicator convenience classes
|
||||
.#{$ms-prefix}-ci {
|
||||
.#{variables.$ms-prefix}-ci {
|
||||
|
||||
// 4 color
|
||||
&-ubgr,
|
||||
@ -25,7 +29,7 @@
|
||||
&-rgub,
|
||||
&-rubg,
|
||||
&-rugb {
|
||||
@extend .#{$ms-prefix}-ci-ubrg;
|
||||
@extend .#{variables.$ms-prefix}-ci-ubrg;
|
||||
}
|
||||
|
||||
&-bgrw,
|
||||
@ -51,7 +55,7 @@
|
||||
&-wgrb,
|
||||
&-wrbg,
|
||||
&-wrgb {
|
||||
@extend .#{$ms-prefix}-ci-brgw;
|
||||
@extend .#{variables.$ms-prefix}-ci-brgw;
|
||||
}
|
||||
|
||||
&-gruw,
|
||||
@ -77,7 +81,7 @@
|
||||
&-wrug,
|
||||
&-wugr,
|
||||
&-wurg {
|
||||
@extend .#{$ms-prefix}-ci-rgwu;
|
||||
@extend .#{variables.$ms-prefix}-ci-rgwu;
|
||||
}
|
||||
|
||||
&-bguw,
|
||||
@ -103,7 +107,7 @@
|
||||
&-wgub,
|
||||
&-wubg,
|
||||
&-wugb {
|
||||
@extend .#{$ms-prefix}-ci-gwub;
|
||||
@extend .#{variables.$ms-prefix}-ci-gwub;
|
||||
}
|
||||
|
||||
&-bruw,
|
||||
@ -129,7 +133,7 @@
|
||||
&-wrbu,
|
||||
&-wrub,
|
||||
&-wurb {
|
||||
@extend .#{$ms-prefix}-ci-wubr;
|
||||
@extend .#{variables.$ms-prefix}-ci-wubr;
|
||||
}
|
||||
|
||||
// 5 color
|
||||
@ -195,7 +199,7 @@
|
||||
&-rgwub,
|
||||
&-rubgw,
|
||||
&-rubwg {
|
||||
@extend .#{$ms-prefix}-ci-wubrg;
|
||||
@extend .#{variables.$ms-prefix}-ci-wubrg;
|
||||
}
|
||||
// breaking this up, editor was showing a warning with so many in a row
|
||||
&-rugbw,
|
||||
@ -255,38 +259,38 @@
|
||||
&-wugrb,
|
||||
&-wurbg,
|
||||
&-wurgb {
|
||||
@extend .#{$ms-prefix}-ci-wubrg;
|
||||
@extend .#{variables.$ms-prefix}-ci-wubrg;
|
||||
}
|
||||
}
|
||||
|
||||
// watermark aliases
|
||||
.#{$ms-prefix}-watermark {
|
||||
&-abzan { @extend .#{$ms-prefix}-clan-abzan; }
|
||||
&-atarka { @extend .#{$ms-prefix}-clan-atarka; }
|
||||
&-azorius { @extend .#{$ms-prefix}-guild-azorius; }
|
||||
&-boros { @extend .#{$ms-prefix}-guild-boros; }
|
||||
&-dimir { @extend .#{$ms-prefix}-guild-dimir; }
|
||||
&-dromoka { @extend .#{$ms-prefix}-clan-dromoka; }
|
||||
&-foretell { @extend .#{$ms-prefix}-ability-foretell; }
|
||||
&-golgari { @extend .#{$ms-prefix}-guild-golgari; }
|
||||
&-gruul { @extend .#{$ms-prefix}-guild-gruul; }
|
||||
&-izzet { @extend .#{$ms-prefix}-guild-izzet; }
|
||||
&-jeskai { @extend .#{$ms-prefix}-clan-jeskai; }
|
||||
&-kolaghan { @extend .#{$ms-prefix}-clan-kolaghan; }
|
||||
&-lorehold { @extend .#{$ms-prefix}-school-lorehold; }
|
||||
&-mardu { @extend .#{$ms-prefix}-clan-mardu; }
|
||||
&-ojutai { @extend .#{$ms-prefix}-clan-ojutai; }
|
||||
&-orzhov { @extend .#{$ms-prefix}-guild-orzhov; }
|
||||
&-phyrexian { @extend .#{$ms-prefix}-p; }
|
||||
&-planeswalker { @extend .#{$ms-prefix}-planeswalker; }
|
||||
&-prismari { @extend .#{$ms-prefix}-school-prismari; }
|
||||
&-quandrix { @extend .#{$ms-prefix}-school-quandrix; }
|
||||
&-rakdos { @extend .#{$ms-prefix}-guild-rakdos; }
|
||||
&-selesnya { @extend .#{$ms-prefix}-guild-selesnya; }
|
||||
&-silumgar { @extend .#{$ms-prefix}-clan-silumgar; }
|
||||
&-silverquill { @extend .#{$ms-prefix}-school-silverquill; }
|
||||
&-simic { @extend .#{$ms-prefix}-guild-simic; }
|
||||
&-sultai { @extend .#{$ms-prefix}-clan-sultai; }
|
||||
&-temur { @extend .#{$ms-prefix}-clan-temur; }
|
||||
&-witherbloom { @extend .#{$ms-prefix}-school-witherbloom; }
|
||||
.#{variables.$ms-prefix}-watermark {
|
||||
&-abzan { @extend .#{variables.$ms-prefix}-clan-abzan; }
|
||||
&-atarka { @extend .#{variables.$ms-prefix}-clan-atarka; }
|
||||
&-azorius { @extend .#{variables.$ms-prefix}-guild-azorius; }
|
||||
&-boros { @extend .#{variables.$ms-prefix}-guild-boros; }
|
||||
&-dimir { @extend .#{variables.$ms-prefix}-guild-dimir; }
|
||||
&-dromoka { @extend .#{variables.$ms-prefix}-clan-dromoka; }
|
||||
&-foretell { @extend .#{variables.$ms-prefix}-ability-foretell; }
|
||||
&-golgari { @extend .#{variables.$ms-prefix}-guild-golgari; }
|
||||
&-gruul { @extend .#{variables.$ms-prefix}-guild-gruul; }
|
||||
&-izzet { @extend .#{variables.$ms-prefix}-guild-izzet; }
|
||||
&-jeskai { @extend .#{variables.$ms-prefix}-clan-jeskai; }
|
||||
&-kolaghan { @extend .#{variables.$ms-prefix}-clan-kolaghan; }
|
||||
&-lorehold { @extend .#{variables.$ms-prefix}-school-lorehold; }
|
||||
&-mardu { @extend .#{variables.$ms-prefix}-clan-mardu; }
|
||||
&-ojutai { @extend .#{variables.$ms-prefix}-clan-ojutai; }
|
||||
&-orzhov { @extend .#{variables.$ms-prefix}-guild-orzhov; }
|
||||
&-phyrexian { @extend .#{variables.$ms-prefix}-p; }
|
||||
&-planeswalker { @extend .#{variables.$ms-prefix}-planeswalker; }
|
||||
&-prismari { @extend .#{variables.$ms-prefix}-school-prismari; }
|
||||
&-quandrix { @extend .#{variables.$ms-prefix}-school-quandrix; }
|
||||
&-rakdos { @extend .#{variables.$ms-prefix}-guild-rakdos; }
|
||||
&-selesnya { @extend .#{variables.$ms-prefix}-guild-selesnya; }
|
||||
&-silumgar { @extend .#{variables.$ms-prefix}-clan-silumgar; }
|
||||
&-silverquill { @extend .#{variables.$ms-prefix}-school-silverquill; }
|
||||
&-simic { @extend .#{variables.$ms-prefix}-guild-simic; }
|
||||
&-sultai { @extend .#{variables.$ms-prefix}-clan-sultai; }
|
||||
&-temur { @extend .#{variables.$ms-prefix}-clan-temur; }
|
||||
&-witherbloom { @extend .#{variables.$ms-prefix}-school-witherbloom; }
|
||||
}
|
||||
@ -1,6 +1,8 @@
|
||||
@use "variables";
|
||||
|
||||
// color indicator circles
|
||||
|
||||
.#{$ms-prefix}-ci {
|
||||
.#{variables.$ms-prefix}-ci {
|
||||
|
||||
// base styles
|
||||
border-radius: 100%;
|
||||
@ -10,7 +12,7 @@
|
||||
height: 1em;
|
||||
|
||||
// set the border color
|
||||
&::before { color: $ms-border-black; }
|
||||
&::before { color: variables.$ms-border-black; }
|
||||
|
||||
// borders based on number of colors in identity
|
||||
&-1::before { content: "\e98a"; }
|
||||
@ -20,47 +22,47 @@
|
||||
&-5::before { content: "\e98e"; }
|
||||
|
||||
// 1 color backgrounds
|
||||
&-w { background: $ms-white; }
|
||||
&-u { background: $ms-blue; }
|
||||
&-b { background: $ms-black; }
|
||||
&-r { background: $ms-red; }
|
||||
&-g { background: $ms-green; }
|
||||
&-w { background: variables.$ms-white; }
|
||||
&-u { background: variables.$ms-blue; }
|
||||
&-b { background: variables.$ms-black; }
|
||||
&-r { background: variables.$ms-red; }
|
||||
&-g { background: variables.$ms-green; }
|
||||
|
||||
// 2 color backgrounds
|
||||
&-wu,
|
||||
&-uw,
|
||||
&-azorius {
|
||||
background: conic-gradient(
|
||||
$ms-white 45deg,
|
||||
$ms-blue 45deg 225deg,
|
||||
$ms-white 225deg
|
||||
variables.$ms-white 45deg,
|
||||
variables.$ms-blue 45deg 225deg,
|
||||
variables.$ms-white 225deg
|
||||
);
|
||||
}
|
||||
&-wb,
|
||||
&-bw,
|
||||
&-orzhov {
|
||||
background: conic-gradient(
|
||||
$ms-white 45deg,
|
||||
$ms-black 45deg 225deg,
|
||||
$ms-white 225deg
|
||||
variables.$ms-white 45deg,
|
||||
variables.$ms-black 45deg 225deg,
|
||||
variables.$ms-white 225deg
|
||||
);
|
||||
}
|
||||
&-ub,
|
||||
&-bu,
|
||||
&-dimir {
|
||||
background: conic-gradient(
|
||||
$ms-blue 45deg,
|
||||
$ms-black 45deg 225deg,
|
||||
$ms-blue 225deg
|
||||
variables.$ms-blue 45deg,
|
||||
variables.$ms-black 45deg 225deg,
|
||||
variables.$ms-blue 225deg
|
||||
);
|
||||
}
|
||||
&-ur,
|
||||
&-ru,
|
||||
&-izzet {
|
||||
background: conic-gradient(
|
||||
$ms-blue 45deg,
|
||||
$ms-red 45deg 225deg,
|
||||
$ms-blue 225deg
|
||||
variables.$ms-blue 45deg,
|
||||
variables.$ms-red 45deg 225deg,
|
||||
variables.$ms-blue 225deg
|
||||
);
|
||||
}
|
||||
&-bg,
|
||||
@ -68,54 +70,54 @@
|
||||
&-golgari,
|
||||
&-rock {
|
||||
background: conic-gradient(
|
||||
$ms-black 45deg,
|
||||
$ms-green 45deg 225deg,
|
||||
$ms-black 225deg
|
||||
variables.$ms-black 45deg,
|
||||
variables.$ms-green 45deg 225deg,
|
||||
variables.$ms-black 225deg
|
||||
);
|
||||
}
|
||||
&-br,
|
||||
&-rb,
|
||||
&-rakdos {
|
||||
background: conic-gradient(
|
||||
$ms-black 45deg,
|
||||
$ms-red 45deg 225deg,
|
||||
$ms-black 225deg
|
||||
variables.$ms-black 45deg,
|
||||
variables.$ms-red 45deg 225deg,
|
||||
variables.$ms-black 225deg
|
||||
);
|
||||
}
|
||||
&-rw,
|
||||
&-wr,
|
||||
&-boros {
|
||||
background: conic-gradient(
|
||||
$ms-red 45deg,
|
||||
$ms-white 45deg 225deg,
|
||||
$ms-red 225deg
|
||||
variables.$ms-red 45deg,
|
||||
variables.$ms-white 45deg 225deg,
|
||||
variables.$ms-red 225deg
|
||||
);
|
||||
}
|
||||
&-rg,
|
||||
&-gr,
|
||||
&-gruul {
|
||||
background: conic-gradient(
|
||||
$ms-red 45deg,
|
||||
$ms-green 45deg 225deg,
|
||||
$ms-red 225deg
|
||||
variables.$ms-red 45deg,
|
||||
variables.$ms-green 45deg 225deg,
|
||||
variables.$ms-red 225deg
|
||||
);
|
||||
}
|
||||
&-gu,
|
||||
&-ug,
|
||||
&-simic {
|
||||
background: conic-gradient(
|
||||
$ms-green 45deg,
|
||||
$ms-blue 45deg 225deg,
|
||||
$ms-green 225deg
|
||||
variables.$ms-green 45deg,
|
||||
variables.$ms-blue 45deg 225deg,
|
||||
variables.$ms-green 225deg
|
||||
);
|
||||
}
|
||||
&-gw,
|
||||
&-wg,
|
||||
&-selesnya {
|
||||
background: conic-gradient(
|
||||
$ms-green 45deg,
|
||||
$ms-white 45deg 225deg,
|
||||
$ms-green 225deg
|
||||
variables.$ms-green 45deg,
|
||||
variables.$ms-white 45deg 225deg,
|
||||
variables.$ms-green 225deg
|
||||
);
|
||||
}
|
||||
|
||||
@ -128,10 +130,10 @@
|
||||
&-guw,
|
||||
&-bant {
|
||||
background: conic-gradient(
|
||||
$ms-blue 60deg,
|
||||
$ms-green 60deg 180deg,
|
||||
$ms-white 180deg 300deg,
|
||||
$ms-blue 300deg
|
||||
variables.$ms-blue 60deg,
|
||||
variables.$ms-green 60deg 180deg,
|
||||
variables.$ms-white 180deg 300deg,
|
||||
variables.$ms-blue 300deg
|
||||
);
|
||||
}
|
||||
&-ubw,
|
||||
@ -142,10 +144,10 @@
|
||||
&-wbu,
|
||||
&-esper {
|
||||
background: conic-gradient(
|
||||
$ms-black 60deg,
|
||||
$ms-white 60deg 180deg,
|
||||
$ms-blue 180deg 300deg,
|
||||
$ms-black 300deg
|
||||
variables.$ms-black 60deg,
|
||||
variables.$ms-white 60deg 180deg,
|
||||
variables.$ms-blue 180deg 300deg,
|
||||
variables.$ms-black 300deg
|
||||
);
|
||||
}
|
||||
&-bru,
|
||||
@ -156,10 +158,10 @@
|
||||
&-urb,
|
||||
&-grixis {
|
||||
background: conic-gradient(
|
||||
$ms-red 60deg,
|
||||
$ms-blue 60deg 180deg,
|
||||
$ms-black 180deg 300deg,
|
||||
$ms-red 300deg
|
||||
variables.$ms-red 60deg,
|
||||
variables.$ms-blue 60deg 180deg,
|
||||
variables.$ms-black 180deg 300deg,
|
||||
variables.$ms-red 300deg
|
||||
);
|
||||
}
|
||||
&-rgb,
|
||||
@ -170,10 +172,10 @@
|
||||
&-bgr,
|
||||
&-jund {
|
||||
background: conic-gradient(
|
||||
$ms-green 60deg,
|
||||
$ms-black 60deg 180deg,
|
||||
$ms-red 180deg 300deg,
|
||||
$ms-green 300deg
|
||||
variables.$ms-green 60deg,
|
||||
variables.$ms-black 60deg 180deg,
|
||||
variables.$ms-red 180deg 300deg,
|
||||
variables.$ms-green 300deg
|
||||
);
|
||||
}
|
||||
&-gwr,
|
||||
@ -184,10 +186,10 @@
|
||||
&-rwg,
|
||||
&-naya {
|
||||
background: conic-gradient(
|
||||
$ms-white 60deg,
|
||||
$ms-red 60deg 180deg,
|
||||
$ms-green 180deg 300deg,
|
||||
$ms-white 300deg
|
||||
variables.$ms-white 60deg,
|
||||
variables.$ms-red 60deg 180deg,
|
||||
variables.$ms-green 180deg 300deg,
|
||||
variables.$ms-white 300deg
|
||||
);
|
||||
}
|
||||
&-wbg,
|
||||
@ -200,10 +202,10 @@
|
||||
&-junk,
|
||||
&-necra {
|
||||
background: conic-gradient(
|
||||
$ms-black 60deg,
|
||||
$ms-green 60deg 180deg,
|
||||
$ms-white 180deg 300deg,
|
||||
$ms-black 300deg
|
||||
variables.$ms-black 60deg,
|
||||
variables.$ms-green 60deg 180deg,
|
||||
variables.$ms-white 180deg 300deg,
|
||||
variables.$ms-black 300deg
|
||||
);
|
||||
}
|
||||
&-urw,
|
||||
@ -215,10 +217,10 @@
|
||||
&-jeskai,
|
||||
&-raka {
|
||||
background: conic-gradient(
|
||||
$ms-red 60deg,
|
||||
$ms-white 60deg 180deg,
|
||||
$ms-blue 180deg 300deg,
|
||||
$ms-red 300deg
|
||||
variables.$ms-red 60deg,
|
||||
variables.$ms-white 60deg 180deg,
|
||||
variables.$ms-blue 180deg 300deg,
|
||||
variables.$ms-red 300deg
|
||||
);
|
||||
}
|
||||
&-bgu,
|
||||
@ -231,10 +233,10 @@
|
||||
&-bug,
|
||||
&-ana {
|
||||
background: conic-gradient(
|
||||
$ms-green 60deg,
|
||||
$ms-blue 60deg 180deg,
|
||||
$ms-black 180deg 300deg,
|
||||
$ms-green 300deg
|
||||
variables.$ms-green 60deg,
|
||||
variables.$ms-blue 60deg 180deg,
|
||||
variables.$ms-black 180deg 300deg,
|
||||
variables.$ms-green 300deg
|
||||
);
|
||||
}
|
||||
&-rwb,
|
||||
@ -246,10 +248,10 @@
|
||||
&-mardu,
|
||||
&-dega {
|
||||
background: conic-gradient(
|
||||
$ms-white 60deg,
|
||||
$ms-black 60deg 180deg,
|
||||
$ms-red 180deg 300deg,
|
||||
$ms-white 300deg
|
||||
variables.$ms-white 60deg,
|
||||
variables.$ms-black 60deg 180deg,
|
||||
variables.$ms-red 180deg 300deg,
|
||||
variables.$ms-white 300deg
|
||||
);
|
||||
}
|
||||
&-gur,
|
||||
@ -261,10 +263,10 @@
|
||||
&-temur,
|
||||
&-ceta {
|
||||
background: conic-gradient(
|
||||
$ms-blue 60deg,
|
||||
$ms-red 60deg 180deg,
|
||||
$ms-green 180deg 300deg,
|
||||
$ms-blue 300deg
|
||||
variables.$ms-blue 60deg,
|
||||
variables.$ms-red 60deg 180deg,
|
||||
variables.$ms-green 180deg 300deg,
|
||||
variables.$ms-blue 300deg
|
||||
);
|
||||
}
|
||||
|
||||
@ -272,51 +274,51 @@
|
||||
&-ubrg,
|
||||
&-glint {
|
||||
background: conic-gradient(
|
||||
$ms-blue 45deg,
|
||||
$ms-black 45deg 135deg,
|
||||
$ms-red 135deg 225deg,
|
||||
$ms-green 225deg 315deg,
|
||||
$ms-blue 315deg
|
||||
variables.$ms-blue 45deg,
|
||||
variables.$ms-black 45deg 135deg,
|
||||
variables.$ms-red 135deg 225deg,
|
||||
variables.$ms-green 225deg 315deg,
|
||||
variables.$ms-blue 315deg
|
||||
);
|
||||
}
|
||||
&-brgw,
|
||||
&-dune {
|
||||
background: conic-gradient(
|
||||
$ms-black 45deg,
|
||||
$ms-red 45deg 135deg,
|
||||
$ms-green 135deg 225deg,
|
||||
$ms-white 225deg 315deg,
|
||||
$ms-black 315deg
|
||||
variables.$ms-black 45deg,
|
||||
variables.$ms-red 45deg 135deg,
|
||||
variables.$ms-green 135deg 225deg,
|
||||
variables.$ms-white 225deg 315deg,
|
||||
variables.$ms-black 315deg
|
||||
);
|
||||
}
|
||||
&-rgwu,
|
||||
&-ink {
|
||||
background: conic-gradient(
|
||||
$ms-red 45deg,
|
||||
$ms-green 45deg 135deg,
|
||||
$ms-white 135deg 225deg,
|
||||
$ms-blue 225deg 315deg,
|
||||
$ms-red 315deg
|
||||
variables.$ms-red 45deg,
|
||||
variables.$ms-green 45deg 135deg,
|
||||
variables.$ms-white 135deg 225deg,
|
||||
variables.$ms-blue 225deg 315deg,
|
||||
variables.$ms-red 315deg
|
||||
);
|
||||
}
|
||||
&-gwub,
|
||||
&-witch {
|
||||
background: conic-gradient(
|
||||
$ms-green 45deg,
|
||||
$ms-white 45deg 135deg,
|
||||
$ms-blue 135deg 225deg,
|
||||
$ms-black 225deg 315deg,
|
||||
$ms-green 315deg
|
||||
variables.$ms-green 45deg,
|
||||
variables.$ms-white 45deg 135deg,
|
||||
variables.$ms-blue 135deg 225deg,
|
||||
variables.$ms-black 225deg 315deg,
|
||||
variables.$ms-green 315deg
|
||||
);
|
||||
}
|
||||
&-wubr,
|
||||
&-yore {
|
||||
background: conic-gradient(
|
||||
$ms-white 45deg,
|
||||
$ms-blue 45deg 135deg,
|
||||
$ms-black 135deg 225deg,
|
||||
$ms-red 225deg 315deg,
|
||||
$ms-white 315deg
|
||||
variables.$ms-white 45deg,
|
||||
variables.$ms-blue 45deg 135deg,
|
||||
variables.$ms-black 135deg 225deg,
|
||||
variables.$ms-red 225deg 315deg,
|
||||
variables.$ms-white 315deg
|
||||
);
|
||||
}
|
||||
|
||||
@ -324,12 +326,12 @@
|
||||
&-wubrg,
|
||||
&-5 {
|
||||
background: conic-gradient(
|
||||
$ms-white 36deg,
|
||||
$ms-blue 36deg 108deg,
|
||||
$ms-black 108deg 180deg,
|
||||
$ms-red 180deg 252deg,
|
||||
$ms-green 252deg 324deg,
|
||||
$ms-white 324deg
|
||||
variables.$ms-white 36deg,
|
||||
variables.$ms-blue 36deg 108deg,
|
||||
variables.$ms-black 108deg 180deg,
|
||||
variables.$ms-red 180deg 252deg,
|
||||
variables.$ms-green 252deg 324deg,
|
||||
variables.$ms-white 324deg
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -1,8 +1,10 @@
|
||||
@use "variables";
|
||||
|
||||
// base
|
||||
|
||||
.#{$ms-prefix} {
|
||||
.#{variables.$ms-prefix} {
|
||||
display: inline-block;
|
||||
font: normal normal normal $ms-font-size-base Mana;
|
||||
font: normal normal normal variables.$ms-font-size-base Mana;
|
||||
font-size: inherit;
|
||||
line-height: 1em;
|
||||
text-rendering: auto;
|
||||
|
||||
198
sass/_cost.scss
198
sass/_cost.scss
@ -1,8 +1,10 @@
|
||||
@use "variables";
|
||||
|
||||
// costs
|
||||
|
||||
.#{$ms-prefix}-cost {
|
||||
.#{variables.$ms-prefix}-cost {
|
||||
|
||||
background-color: $ms-base-colorless;
|
||||
background-color: variables.$ms-base-colorless;
|
||||
border-radius: 1em;
|
||||
color: #111;
|
||||
font-size: 0.95em;
|
||||
@ -12,53 +14,53 @@
|
||||
text-align: center;
|
||||
|
||||
// single costs
|
||||
&.#{$ms-prefix}-w,
|
||||
&.#{$ms-prefix}-wp {
|
||||
background-color: $ms-base-white;
|
||||
&.#{variables.$ms-prefix}-w,
|
||||
&.#{variables.$ms-prefix}-wp {
|
||||
background-color: variables.$ms-base-white;
|
||||
}
|
||||
&.#{$ms-prefix}-u,
|
||||
&.#{$ms-prefix}-up {
|
||||
background-color: $ms-base-blue;
|
||||
&.#{variables.$ms-prefix}-u,
|
||||
&.#{variables.$ms-prefix}-up {
|
||||
background-color: variables.$ms-base-blue;
|
||||
}
|
||||
&.#{$ms-prefix}-b,
|
||||
&.#{$ms-prefix}-bp {
|
||||
background-color: $ms-base-black;
|
||||
&.#{variables.$ms-prefix}-b,
|
||||
&.#{variables.$ms-prefix}-bp {
|
||||
background-color: variables.$ms-base-black;
|
||||
}
|
||||
&.#{$ms-prefix}-r,
|
||||
&.#{$ms-prefix}-rp {
|
||||
background-color: $ms-base-red;
|
||||
&.#{variables.$ms-prefix}-r,
|
||||
&.#{variables.$ms-prefix}-rp {
|
||||
background-color: variables.$ms-base-red;
|
||||
}
|
||||
&.#{$ms-prefix}-g,
|
||||
&.#{$ms-prefix}-gp {
|
||||
background-color: $ms-base-green;
|
||||
&.#{variables.$ms-prefix}-g,
|
||||
&.#{variables.$ms-prefix}-gp {
|
||||
background-color: variables.$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 {
|
||||
&.#{variables.$ms-prefix}-wu,
|
||||
&.#{variables.$ms-prefix}-wb,
|
||||
&.#{variables.$ms-prefix}-ub,
|
||||
&.#{variables.$ms-prefix}-ur,
|
||||
&.#{variables.$ms-prefix}-br,
|
||||
&.#{variables.$ms-prefix}-bg,
|
||||
&.#{variables.$ms-prefix}-rw,
|
||||
&.#{variables.$ms-prefix}-rg,
|
||||
&.#{variables.$ms-prefix}-gw,
|
||||
&.#{variables.$ms-prefix}-gu,
|
||||
&.#{variables.$ms-prefix}-2w,
|
||||
&.#{variables.$ms-prefix}-2u,
|
||||
&.#{variables.$ms-prefix}-2b,
|
||||
&.#{variables.$ms-prefix}-2r,
|
||||
&.#{variables.$ms-prefix}-2g,
|
||||
&.#{variables.$ms-prefix}-wup,
|
||||
&.#{variables.$ms-prefix}-wbp,
|
||||
&.#{variables.$ms-prefix}-ubp,
|
||||
&.#{variables.$ms-prefix}-urp,
|
||||
&.#{variables.$ms-prefix}-brp,
|
||||
&.#{variables.$ms-prefix}-bgp,
|
||||
&.#{variables.$ms-prefix}-rwp,
|
||||
&.#{variables.$ms-prefix}-rgp,
|
||||
&.#{variables.$ms-prefix}-gwp,
|
||||
&.#{variables.$ms-prefix}-gup {
|
||||
position: relative;
|
||||
width: 1.3em;
|
||||
height: 1.3em;
|
||||
@ -76,8 +78,8 @@
|
||||
left: 1.0em;
|
||||
}
|
||||
}
|
||||
&.#{$ms-prefix}-wu,
|
||||
&.#{$ms-prefix}-wup {
|
||||
&.#{variables.$ms-prefix}-wu,
|
||||
&.#{variables.$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+
|
||||
@ -87,8 +89,8 @@
|
||||
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 {
|
||||
&.#{variables.$ms-prefix}-wb,
|
||||
&.#{variables.$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+
|
||||
@ -98,8 +100,8 @@
|
||||
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 {
|
||||
&.#{variables.$ms-prefix}-ub,
|
||||
&.#{variables.$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+
|
||||
@ -109,8 +111,8 @@
|
||||
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 {
|
||||
&.#{variables.$ms-prefix}-ur,
|
||||
&.#{variables.$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+
|
||||
@ -120,8 +122,8 @@
|
||||
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 {
|
||||
&.#{variables.$ms-prefix}-br,
|
||||
&.#{variables.$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+
|
||||
@ -131,8 +133,8 @@
|
||||
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 {
|
||||
&.#{variables.$ms-prefix}-bg,
|
||||
&.#{variables.$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+
|
||||
@ -142,8 +144,8 @@
|
||||
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 {
|
||||
&.#{variables.$ms-prefix}-rw,
|
||||
&.#{variables.$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+
|
||||
@ -153,8 +155,8 @@
|
||||
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 {
|
||||
&.#{variables.$ms-prefix}-rg,
|
||||
&.#{variables.$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+
|
||||
@ -164,8 +166,8 @@
|
||||
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 {
|
||||
&.#{variables.$ms-prefix}-gw,
|
||||
&.#{variables.$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+
|
||||
@ -175,8 +177,8 @@
|
||||
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 {
|
||||
&.#{variables.$ms-prefix}-gu,
|
||||
&.#{variables.$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+
|
||||
@ -186,7 +188,7 @@
|
||||
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 {
|
||||
&.#{variables.$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+
|
||||
@ -196,7 +198,7 @@
|
||||
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 {
|
||||
&.#{variables.$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+
|
||||
@ -206,7 +208,7 @@
|
||||
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 {
|
||||
&.#{variables.$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+
|
||||
@ -216,7 +218,7 @@
|
||||
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 {
|
||||
&.#{variables.$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+
|
||||
@ -226,7 +228,7 @@
|
||||
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 {
|
||||
&.#{variables.$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+
|
||||
@ -238,22 +240,22 @@
|
||||
}
|
||||
|
||||
// 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 {
|
||||
&.#{variables.$ms-prefix}-p::before,
|
||||
&.#{variables.$ms-prefix}-wp::before,
|
||||
&.#{variables.$ms-prefix}-up::before,
|
||||
&.#{variables.$ms-prefix}-bp::before,
|
||||
&.#{variables.$ms-prefix}-rp::before,
|
||||
&.#{variables.$ms-prefix}-gp::before,
|
||||
&.#{variables.$ms-prefix}-wup::before,
|
||||
&.#{variables.$ms-prefix}-wbp::before,
|
||||
&.#{variables.$ms-prefix}-ubp::before,
|
||||
&.#{variables.$ms-prefix}-urp::before,
|
||||
&.#{variables.$ms-prefix}-brp::before,
|
||||
&.#{variables.$ms-prefix}-bgp::before,
|
||||
&.#{variables.$ms-prefix}-rwp::before,
|
||||
&.#{variables.$ms-prefix}-rgp::before,
|
||||
&.#{variables.$ms-prefix}-gwp::before,
|
||||
&.#{variables.$ms-prefix}-gup::before {
|
||||
display: inline-block;
|
||||
-moz-transform: scale( 1.2, 1.2 );
|
||||
-webkit-transform: scale( 1.2, 1.2 );
|
||||
@ -261,7 +263,7 @@
|
||||
}
|
||||
|
||||
// alternate tap
|
||||
&.#{$ms-prefix}-tap-alt::before {
|
||||
&.#{variables.$ms-prefix}-tap-alt::before {
|
||||
display: inline-block;
|
||||
-moz-transform: scale( 1.2, 1.2 );
|
||||
-webkit-transform: scale( 1.2, 1.2 );
|
||||
@ -271,7 +273,7 @@
|
||||
}
|
||||
|
||||
// snow mana
|
||||
&.#{$ms-prefix}-s {
|
||||
&.#{variables.$ms-prefix}-s {
|
||||
&::before {
|
||||
color: #fff;
|
||||
-webkit-text-stroke: 2px #fff;
|
||||
@ -294,15 +296,15 @@
|
||||
}
|
||||
|
||||
// tap symbols
|
||||
&.#{$ms-prefix}-untap {
|
||||
&.#{variables.$ms-prefix}-untap {
|
||||
background-color: #111;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
// shadow alternative
|
||||
&.#{$ms-prefix}-shadow {
|
||||
&.#{variables.$ms-prefix}-shadow {
|
||||
box-shadow: -0.06em 0.07em 0 #111, 0 0.06em 0 #111;
|
||||
&.#{$ms-prefix}-untap {
|
||||
&.#{variables.$ms-prefix}-untap {
|
||||
box-shadow: -0.06em 0.07em 0 #fff, 0 0.06em 0 #fff;
|
||||
}
|
||||
}
|
||||
@ -311,21 +313,21 @@
|
||||
|
||||
// split cost specifics
|
||||
|
||||
.#{$ms-prefix}-split {
|
||||
.#{variables.$ms-prefix}-split {
|
||||
position: relative;
|
||||
width: 1.3em;
|
||||
height: 1.3em;
|
||||
}
|
||||
.#{$ms-prefix}-split::before,
|
||||
.#{$ms-prefix}-split::after {
|
||||
.#{variables.$ms-prefix}-split::before,
|
||||
.#{variables.$ms-prefix}-split::after {
|
||||
font-size: 0.55em !important;
|
||||
position: absolute;
|
||||
}
|
||||
.#{$ms-prefix}-split::before {
|
||||
.#{variables.$ms-prefix}-split::before {
|
||||
top: -0.38em;
|
||||
left: 0.28em;
|
||||
}
|
||||
.#{$ms-prefix}-split::after {
|
||||
.#{variables.$ms-prefix}-split::after {
|
||||
top: 0.5em;
|
||||
left: 1.0em;
|
||||
}
|
||||
@ -333,18 +335,18 @@
|
||||
|
||||
// half costs specifics
|
||||
|
||||
span.#{$ms-prefix}-half { // legacy handling with <span> tag
|
||||
span.#{variables.$ms-prefix}-half { // legacy handling with <span> tag
|
||||
width: .675em;
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
margin-left: .675em;
|
||||
|
||||
> .#{$ms-prefix}-cost {
|
||||
> .#{variables.$ms-prefix}-cost {
|
||||
margin-left: -.675em;
|
||||
}
|
||||
}
|
||||
|
||||
.#{$ms-prefix}-half { // new single-element handling!
|
||||
.#{variables.$ms-prefix}-half { // new single-element handling!
|
||||
width: .675em;
|
||||
margin-left: .675em;
|
||||
overflow: hidden;
|
||||
@ -357,9 +359,9 @@ span.#{$ms-prefix}-half { // legacy handling with <span> tag
|
||||
|
||||
// un-set costs
|
||||
|
||||
.#{$ms-prefix}-100 {
|
||||
.#{variables.$ms-prefix}-100 {
|
||||
width: 2.4em;
|
||||
}
|
||||
.#{$ms-prefix}-1000000 {
|
||||
.#{variables.$ms-prefix}-1000000 {
|
||||
width: 5.4em;
|
||||
}
|
||||
@ -1,6 +1,8 @@
|
||||
@use "variables";
|
||||
|
||||
// double-faced specifics
|
||||
|
||||
.#{$ms-prefix}-dfc {
|
||||
.#{variables.$ms-prefix}-dfc {
|
||||
color: #111;
|
||||
border: .05em solid #111;
|
||||
border-radius: 2em;
|
||||
|
||||
@ -1,4 +1,6 @@
|
||||
.#{$ms-prefix}-duo {
|
||||
@use "variables";
|
||||
|
||||
.#{variables.$ms-prefix}-duo {
|
||||
|
||||
// base border styles
|
||||
&::after {
|
||||
@ -17,12 +19,12 @@
|
||||
color: #fff;
|
||||
|
||||
// multicolor symbol
|
||||
&.#{$ms-prefix}-multicolor::after {
|
||||
&.#{variables.$ms-prefix}-multicolor::after {
|
||||
content: "\e986";
|
||||
}
|
||||
|
||||
// strixhaven schools
|
||||
&.#{$ms-prefix}-school {
|
||||
&.#{variables.$ms-prefix}-school {
|
||||
&-lorehold::after {
|
||||
content: "\e99b";
|
||||
}
|
||||
@ -49,21 +51,21 @@
|
||||
&-color {
|
||||
// default outer color
|
||||
&::before {
|
||||
color: $ms-border-black;
|
||||
color: variables.$ms-border-black;
|
||||
}
|
||||
// multicolor
|
||||
&.#{$ms-prefix}-multicolor {
|
||||
&.#{variables.$ms-prefix}-multicolor {
|
||||
&::after {
|
||||
color: $ms-multicolor-flat;
|
||||
color: variables.$ms-multicolor-flat;
|
||||
}
|
||||
&.#{$ms-prefix}-grad::after {
|
||||
background: $ms-multicolor-grad;
|
||||
&.#{variables.$ms-prefix}-grad::after {
|
||||
background: variables.$ms-multicolor-grad;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
}
|
||||
// strixhaven schools
|
||||
&.#{$ms-prefix}-school {
|
||||
&.#{variables.$ms-prefix}-school {
|
||||
&-lorehold {
|
||||
&::before { color: #a03731; }
|
||||
&::after { color: #e4e8c7; }
|
||||
|
||||
@ -1,5 +1,7 @@
|
||||
.#{$ms-prefix}-mechanic {
|
||||
background: $ms-ability-grad;
|
||||
@use "variables";
|
||||
|
||||
.#{variables.$ms-prefix}-mechanic {
|
||||
background: variables.$ms-ability-grad;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
@ -1,6 +1,8 @@
|
||||
@use "variables";
|
||||
|
||||
// symbols
|
||||
|
||||
.#{$ms-prefix} {
|
||||
.#{variables.$ms-prefix} {
|
||||
|
||||
// resources
|
||||
&-w::before { content: "\e600"; }
|
||||
|
||||
@ -1,7 +1,9 @@
|
||||
@use "variables";
|
||||
|
||||
/**
|
||||
* planeswalker and other loyalty symbols */
|
||||
|
||||
.#{$ms-prefix}-loyalty {
|
||||
.#{variables.$ms-prefix}-loyalty {
|
||||
|
||||
// all
|
||||
&-up,
|
||||
@ -49,7 +51,7 @@
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
font-size: 0.5em;
|
||||
font-family: $ms-serif-font;
|
||||
font-family: variables.$ms-serif-font;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
line-height: 2.25em;
|
||||
@ -60,7 +62,7 @@
|
||||
content: "0";
|
||||
}
|
||||
&-up {
|
||||
&.#{$ms-prefix}-loyalty {
|
||||
&.#{variables.$ms-prefix}-loyalty {
|
||||
&-1::after { content: "+1"; }
|
||||
&-2::after { content: "+2"; }
|
||||
&-3::after { content: "+3"; }
|
||||
@ -86,7 +88,7 @@
|
||||
}
|
||||
}
|
||||
&-start {
|
||||
&.#{$ms-prefix}-loyalty {
|
||||
&.#{variables.$ms-prefix}-loyalty {
|
||||
&-1::after { content: "1"; }
|
||||
&-2::after { content: "2"; }
|
||||
&-3::after { content: "3"; }
|
||||
@ -115,7 +117,7 @@
|
||||
&::after {
|
||||
line-height: 2em;
|
||||
}
|
||||
&.#{$ms-prefix}-loyalty {
|
||||
&.#{variables.$ms-prefix}-loyalty {
|
||||
&-1::after { content: "-1"; }
|
||||
&-2::after { content: "-2"; }
|
||||
&-3::after { content: "-3"; }
|
||||
@ -151,7 +153,7 @@
|
||||
color: #111;
|
||||
}
|
||||
// correction for starting loyalty size
|
||||
&.#{$ms-prefix}-loyalty-start {
|
||||
&.#{variables.$ms-prefix}-loyalty-start {
|
||||
font-size: 1.6em;
|
||||
}
|
||||
}
|
||||
@ -159,7 +161,7 @@
|
||||
|
||||
// saga loyalty
|
||||
|
||||
.#{$ms-prefix}-saga {
|
||||
.#{variables.$ms-prefix}-saga {
|
||||
|
||||
// all
|
||||
color: #111;
|
||||
@ -174,7 +176,7 @@
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
font-size: 0.6em;
|
||||
font-family: $ms-serif-font;
|
||||
font-family: variables.$ms-serif-font;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
line-height: 2.0em;
|
||||
@ -193,7 +195,7 @@
|
||||
|
||||
// level card levels
|
||||
|
||||
.#{$ms-prefix}-level {
|
||||
.#{variables.$ms-prefix}-level {
|
||||
|
||||
// level numbers must be in a span for now unfortunately
|
||||
> span {
|
||||
@ -202,7 +204,7 @@
|
||||
left: 0;
|
||||
top: 0;
|
||||
color: #000;
|
||||
font-family: $ms-serif-font;
|
||||
font-family: variables.$ms-serif-font;
|
||||
width: 76%;
|
||||
text-align: center;
|
||||
line-height: 3.8;
|
||||
@ -224,7 +226,7 @@
|
||||
|
||||
// defense loyalty
|
||||
|
||||
.#{$ms-prefix}-defense {
|
||||
.#{variables.$ms-prefix}-defense {
|
||||
|
||||
color: #111;
|
||||
font-size: 1.5em;
|
||||
@ -258,7 +260,7 @@
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
font-size: 0.5em;
|
||||
font-family: $ms-serif-font;
|
||||
font-family: variables.$ms-serif-font;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
line-height: 2.25em;
|
||||
|
||||
@ -1,23 +1,25 @@
|
||||
@use "variables";
|
||||
|
||||
// fonts
|
||||
|
||||
@font-face {
|
||||
font-family: 'Mana';
|
||||
src:url( '#{$ms-font-path}/mana.eot?v=#{$ms-version}' );
|
||||
src:url( '#{$ms-font-path}/mana.eot?#iefix&v=#{$ms-version}') format( 'embedded-opentype' ),
|
||||
url( '#{$ms-font-path}/mana.woff?v=#{$ms-version}') format( 'woff' ),
|
||||
url( '#{$ms-font-path}/mana.ttf?v=#{$ms-version}') format( 'truetype' ),
|
||||
url( '#{$ms-font-path}/mana.svg?v=#{$ms-version}#mana') format( 'svg' );
|
||||
src:url( '#{variables.$ms-font-path}/mana.eot?v=#{variables.$ms-version}' );
|
||||
src:url( '#{variables.$ms-font-path}/mana.eot?#iefix&v=#{variables.$ms-version}') format( 'embedded-opentype' ),
|
||||
url( '#{variables.$ms-font-path}/mana.woff?v=#{variables.$ms-version}') format( 'woff' ),
|
||||
url( '#{variables.$ms-font-path}/mana.ttf?v=#{variables.$ms-version}') format( 'truetype' ),
|
||||
url( '#{variables.$ms-font-path}/mana.svg?v=#{variables.$ms-version}#mana') format( 'svg' );
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'MPlantin';
|
||||
src:url( '#{$ms-font-path}/mplantin.eot?v=#{$ms-version}' );
|
||||
src:url( '#{$ms-font-path}/mplantin.eot?#iefix&v=#{$ms-version}') format( 'embedded-opentype' ),
|
||||
url( '#{$ms-font-path}/mplantin.woff?v=#{$ms-version}') format( 'woff' ),
|
||||
url( '#{$ms-font-path}/mplantin.ttf?v=#{$ms-version}') format( 'truetype' ),
|
||||
url( '#{$ms-font-path}/mplantin.svg?v=#{$ms-version}#mplantin') format( 'svg' );
|
||||
src:url( '#{variables.$ms-font-path}/mplantin.eot?v=#{variables.$ms-version}' );
|
||||
src:url( '#{variables.$ms-font-path}/mplantin.eot?#iefix&v=#{variables.$ms-version}') format( 'embedded-opentype' ),
|
||||
url( '#{variables.$ms-font-path}/mplantin.woff?v=#{variables.$ms-version}') format( 'woff' ),
|
||||
url( '#{variables.$ms-font-path}/mplantin.ttf?v=#{variables.$ms-version}') format( 'truetype' ),
|
||||
url( '#{variables.$ms-font-path}/mplantin.svg?v=#{variables.$ms-version}#mplantin') format( 'svg' );
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
@ -1,15 +1,17 @@
|
||||
@use "variables";
|
||||
|
||||
// sizes
|
||||
|
||||
.#{$ms-prefix}-2x { font-size: 1.75em; }
|
||||
.#{$ms-prefix}-3x { font-size: 2.25em; }
|
||||
.#{$ms-prefix}-4x { font-size: 3.0em; }
|
||||
.#{$ms-prefix}-5x { font-size: 3.75em; }
|
||||
.#{$ms-prefix}-6x { font-size: 4.5em; }
|
||||
.#{variables.$ms-prefix}-2x { font-size: 1.75em; }
|
||||
.#{variables.$ms-prefix}-3x { font-size: 2.25em; }
|
||||
.#{variables.$ms-prefix}-4x { font-size: 3.0em; }
|
||||
.#{variables.$ms-prefix}-5x { font-size: 3.75em; }
|
||||
.#{variables.$ms-prefix}-6x { font-size: 4.5em; }
|
||||
|
||||
/*
|
||||
* Fixed width */
|
||||
|
||||
.#{$ms-prefix}-fw {
|
||||
.#{variables.$ms-prefix}-fw {
|
||||
width: 1em;
|
||||
text-align: center;
|
||||
}
|
||||
@ -1,12 +1,12 @@
|
||||
@import "variables";
|
||||
@import "path";
|
||||
@import "core";
|
||||
@import "icons";
|
||||
@import "cost";
|
||||
@import "loyalty";
|
||||
@import "dfc";
|
||||
@import "sizes";
|
||||
@import "duo";
|
||||
@import "colors";
|
||||
@import "extras";
|
||||
@import "aliases";
|
||||
@use "variables";
|
||||
@use "path";
|
||||
@use "core";
|
||||
@use "icons";
|
||||
@use "cost";
|
||||
@use "loyalty";
|
||||
@use "dfc";
|
||||
@use "sizes";
|
||||
@use "duo";
|
||||
@use "colors";
|
||||
@use "extras";
|
||||
@use "aliases";
|
||||
Loading…
Reference in New Issue
Block a user