Everything so far in v4 to-date, including icons and infrastructure up to just before Urza's Saga

This commit is contained in:
Andrew Gioia 2023-02-22 16:00:57 -05:00
parent 01e3348f1b
commit 694483ff73
94 changed files with 19911 additions and 0 deletions

324
demo/demo.css Normal file
View File

@ -0,0 +1,324 @@
:root {
--bg-body: #fff;
--bg-hover: #f2f1f1;
--bg-content: #e0dfde;
--bg-accent: #d2d1cf;
--bg-border: #000;
--bg-button: #fff;
--bg-active: #d2d1cf;
--icon-default: #131417;
--link-default: #0060e4;
--text-default: #000;
--text-accent: #8e8d88;
--text-contrast: #fff;
--svg-border: #fff;
--rgba-fg: rgba(255,255,255,0.916667);
--rgba-modal: rgba(0, 0, 0, 0.75);
}
:root[data-mode=dark] {
--bg-body: #202124;
--bg-hover: #131417;
--bg-content: #3a3a3a;
--bg-accent: #8e8d88;
--bg-border: #575754;
--bg-button: #18191b;
--bg-active: #29c9ff;
--icon-default: #000;
--link-default: #29c9ff;
--text-default: #fff;
--text-accent: #d2d1cf;
--text-contrast: #ddd;
--svg-border: #575754;
--rgba-fg: rgba(0,0,0,0.9);
--rgba-modal: rgba(0, 0, 0, 0.5);
}
html {
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 16px;
}
body {
align-items: center;
background: var(--bg-body);
color: var(--text-default);
display: flex;
flex-direction: column;
margin: 0;
transition: background 100ms ease-in-out, color 100ms ease-in-out;
}
h1 {
font-size: 2rem;
margin: 0;
}
h1 > span {
color: var(--text-accent);
padding-left: 0.25rem;
}
h2 {
font-size: 1.5rem;
}
p {
font-size: 1.125rem;
line-height: 1.625rem;
}
a {
color: var(--link-default);
}
header,
footer {
padding: 2.5vw 0 2vw;
width: 92vw;
max-width: 1600px;
}
nav {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 1.5rem;
}
main {
background: var(--bg-content);
padding: 1.5vw 0;
transition: background 100ms ease-in-out;
display: flex;
flex-direction: column;
width: 100%;
align-items: center;
align-content: stretch;
}
footer {
padding-bottom: 2.5vw;
}
footer p {
font-size: 1rem;
margin: 0;
}
footer p:first-child {
margin-bottom: 0.5rem;
}
section {
display: flex;
width: 92vw;
max-width: 1600px;
}
aside {
flex-shrink: 0;
width: 33vw;
}
content {
width: 100%;
padding: max(1vw, 0.5rem) max(4vw, 2rem);
}
article {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
column-gap: max(2vw, 1rem);
row-gap: max(2vw, 1rem);
margin: 0 0 max(2vw, 2rem);
width: 100%;
}
figure {
display: inline-flex;
align-items: center;
margin: 0;
flex-direction: column;
}
figure .ss {
font-size: max(7.5vw, 2rem);
}
figure.glyph .ss-border::after,
figure.glyph .ss-inner::marker {
color: var(--border-default);
}
figure.glyph .ss-border::before,
figure.glyph .ss-inner::before {
visibility: hidden;
}
figcaption {
padding-top: 1rem;
text-align: center;
}
menu {
display: flex;
align-items: stretch;
margin: 0;
padding: 0;
}
#mode {
display: flex;
align-items: stretch;
margin-right: 1rem;
border: 0.2rem solid var(--bg-accent);
border-radius: 2rem;
transition: border-color 100ms ease-in-out;
}
#mode:hover {
border-color: var(--text-accent);
}
#mode sub,
#mode sup {
width: 2.25rem;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
font-size: 0;
}
#mode sub {
border-radius: 2rem 0 0 2rem;
padding-left: 0.5rem;
}
#mode sub::before {
font-family: keyrune;
font-size: 1.25rem;
content: "\e024";
}
#mode sup {
border-radius: 0 2rem 2rem 0;
padding-right: 0.5rem;
}
#mode sup::before {
font-family: keyrune;
font-size: 1.25rem;
content: "\e012";
}
#mode .on {
background: var(--bg-content);
border-radius: 2rem;
padding: 0 0.5rem;
box-shadow: inset 0 0 0 2px var(--bg-body);
}
#preview {
position: relative;
cursor: pointer;
}
#preview .ss {
color: var(--text-default);
position: absolute;
top: -1px;
left: 1.25rem;
font-size: 1.5rem;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
width: 2.625rem;
background: transparent;
z-index: -1;
}
#preview select {
background: transparent;
color: var(--text-default);
height: 2.75rem;
border: 0.2rem solid var(--bg-accent);
border-radius: 2rem;
padding: 0 3rem 0 4.125rem;
font-size: 1rem;
-webkit-appearance: none;
appearance: none;
outline: none;
grid-area: select;
cursor: pointer;
width: 100%;
transition: border-color 100ms ease-in-out;
}
#preview::after {
content: "";
width: 1rem;
height: 0.625rem;
background-color: var(--bg-accent);
clip-path: polygon(100% 0%, 0 0%, 50% 100%);
position: absolute;
top: 1.15rem;
right: 1.15rem;
}
#preview:hover select {
border-color: var(--text-accent);
}
.span-3 {
grid-column: 1/4;
}
.ss {
color: var(--icon-default);
}
.text-white {
color: var(--text-contrast);
}
.text-black {
color: var(--text-default);
}
@media (max-width: 768px) {
header,
section,
footer {
width: 88vw;
}
nav {
flex-direction: column;
align-items: flex-start;
}
h1 {
margin: 0.5rem 0 1rem;
}
section {
flex-direction: column;
}
content {
padding: max(1vw, 0.5rem) 0;
}
aside {
width: 92vw;
}
}
@media (min-width: 769px) {
figure {
padding: 0 max(1vw, 1rem);
}
}
@media (min-width: 1280px) {
html {
font-size: 17px;
}
aside {
width: 28vw;
}
}
@media (min-width: 1440px) {
html {
font-size: 18px;
}
aside {
width: 25vw;
}
}
/*# sourceMappingURL=demo.css.map */

1
demo/demo.css.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"sourceRoot":"","sources":["../scss/demo.scss"],"names":[],"mappings":"AAGA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIR;EACI;EAEA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;;AAEA;EACI;EACA;;;AAIR;EACI;;;AAGJ;EACI;EACA;;;AAGJ;EACI;;;AAGJ;AAAA;EAEI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;AAEA;EACI;EACA;;AAEA;EACI;;;AAKZ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAIA;AAAA;EAEI;;AAGJ;AAAA;EAEI;;;AAKZ;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;AAAA;EAEI;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;;AAEA;EACI;EACA;EACA;;AAIR;EACI;EACA;;AAEA;EACI;EACA;EACA;;AAIR;EACI;EACA;EACA;EACA;;;AAIR;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;;;AAIR;EACI;;;AAGJ;EACI;;;AAIA;EACI;;AAEJ;EACI;;;AAIR;EACI;AAAA;AAAA;IAGI;;;EAEJ;IACI;IACA;;;EAEJ;IACI;;;EAEJ;IACI;;;EAEJ;IACI;;;EAEJ;IACI;;;AAIR;EACI;IACI;;;AAIR;EACI;IACI;;;EAEJ;IACI;;;AAGR;EACI;IACI;;;EAEJ;IACI","file":"demo.css"}

237
demo/index.html Normal file
View File

@ -0,0 +1,237 @@
<!DOCTYPE html>
<html data-mode="">
<head>
<title>Keyrune v4</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="../dist/css/keyrune.css"></head>
<link rel="stylesheet" href="./demo.css"></head>
<script src="./sets.js" ></script>
</head>
<body data-set="arn">
<header>
<nav>
<h1>Keyrune v4 <span>Demo</span></h1>
<menu>
<div id="mode">
<sub>Dark</sub>
<sup>Light</sup>
</div>
<div id="preview">
<i class="ss ss-arn"></i>
<select id="select">
<optgroup label="Expansions">
<option value="arn" selected="selected">
Arabian Nights
</option>
</optgroup>
</select>
</div>
</menu>
</nav>
<p>
Complete Magic: the Gathering set symbol pictographic font. Each symbol in v4 has been redrawn and normalized with 3 glyphs for the base rarity symbol, the border, and an optional fixed white layer that some symbols have. Use the demo tool here to see a detailed view by set, or <a href="all.html">view the full set at once</a>.
</p>
</header>
<main>
<section>
<aside>
<h2>
Symbol layers
</h2>
<p>
Each set symbol has 2 layers, the base symbol and a border, with an optional 3rd layer when there's a fixed white portion.
</p>
</aside>
<content>
<article>
<figure>
<i class="ss ss-arn" id="one"></i>
<figcaption>Symbol</figcaption>
</figure>
<figure class="glyph">
<i class="ss ss-arn ss-border text-black"></i>
<figcaption>Border</figcaption>
</figure>
<figure class="glyph">
<i class="ss ss-arn ss-inner"></i>
<figcaption>Inner</figcaption>
</figure>
</article>
</content>
</section>
<section>
<aside>
<h2>
Border styles
</h2>
<p>
Default and common rarity borders are white, and other rarities are black. Built-in classes let you override these as well, which you can see in the rarities below.
</p>
</aside>
<content>
<article>
<figure>
<i class="ss ss-arn"></i>
<figcaption>No border</figcaption>
</figure>
<figure>
<i class="ss ss-arn ss-border"></i>
<figcaption>White border</figcaption>
</figure>
<figure>
<i class="ss ss-arn ss-border ss-rarity-rare"></i>
<figcaption>Black border</figcaption>
</figure>
</article>
</content>
</section>
<section>
<aside>
<h2>
Rarities
</h2>
<p>
Common, uncommon, rare, mythic, and time-shifted rarity classes add color to the symbol glyph. Gradients are an optional class to more closely resemble the printed version in modern sets.
</p>
<p>
Many of the very early set symbols <a href="https://scryfall.com/card/arn/76/library-of-alexandria">had no border</a> or <a href="https://scryfall.com/card/usg/321/gaeas-cradle">always used a white border</a>. While Keyrune applies the <abbr title="White border and black symbol at common, black border and colored symbols at other rarities">modern configuration</abbr> to all sets, it supports all border and color permutations.
</aside>
<content>
<article>
<figure>
<i class="ss ss-arn ss-border"></i>
<figcaption>Common</figcaption>
</figure>
<figure>
<i class="ss ss-arn ss-border ss-inner"></i>
<figcaption>Complete common</figcaption>
</figure>
<figure>
<i class="ss ss-arn ss-inner"></i>
<figcaption>Common with inner but no border</figcaption>
</figure>
</article>
<article>
<figure>
<i class="ss ss-arn ss-border ss-rarity-uncommon"></i>
<figcaption>Uncommon</figcaption>
</figure>
<figure>
<i class="ss ss-arn ss-border ss-rarity-uncommon ss-rarity-gradient"></i>
<figcaption>Gradient uncommon</figcaption>
</figure>
<figure>
<i class="ss ss-arn ss-border ss-inner ss-rarity-uncommon ss-rarity-gradient"></i>
<figcaption>Complete uncommon</figcaption>
</figure>
</article>
<article>
<figure>
<i class="ss ss-arn ss-border ss-rarity-rare"></i>
<figcaption>Rare</figcaption>
</figure>
<figure>
<i class="ss ss-arn ss-border ss-rarity-rare ss-rarity-gradient"></i>
<figcaption>Gradient rare</figcaption>
</figure>
<figure>
<i class="ss ss-arn ss-border ss-inner ss-rarity-rare ss-rarity-gradient"></i>
<figcaption>Complete rare</figcaption>
</figure>
</article>
<article>
<figure>
<i class="ss ss-arn ss-border ss-rarity-mythic"></i>
<figcaption>Mythic</figcaption>
</figure>
<figure>
<i class="ss ss-arn ss-border ss-rarity-mythic ss-rarity-gradient"></i>
<figcaption>Gradient mythic</figcaption>
</figure>
<figure>
<i class="ss ss-arn ss-border ss-inner ss-rarity-mythic ss-rarity-gradient"></i>
<figcaption>Complete mythic</figcaption>
</figure>
</article>
<article>
<figure>
<i class="ss ss-arn ss-border ss-rarity-mythic ss-border-white"></i>
<figcaption>Mythic with white border</figcaption>
</figure>
<figure>
<i class="ss ss-arn ss-rarity-rare ss-rarity-gradient ss-inner"></i>
<figcaption>Gradient rare with inner only</figcaption>
</figure>
<figure>
<i class="ss ss-arn ss-white"></i>
<figcaption>White set symbol</figcaption>
</figure>
</article>
</content>
</section>
</main>
<footer>
<p>Copyright &copy; 2020 Andrew Gioia</p>
<p>
Keyrune websites: <a href="https://github.com/andrewgioia/keyrune">GitHub project</a>, <a href="https://git.gioia.cloud/andrew/keyrune">Gitea backup repo</a>, and <a href="https://keyrune.andrewgioia.com">Documentation and demo</a>
</p>
</footer>
</body>
<script type="text/javascript">
//
// populate the select box with the available sets, pulled from sets.json
let select = document.getElementById('select');
let html = "";
let selected = "";
for (var group in sets) {
html += '<optgroup label="' + group + '">'
for (var set in sets[group]) {
selected = (set == 'arn') ? ' selected="selected"' : '';
html += '<option value="' + set + '"'+selected+'>' + sets[group][set] + '</option>'
}
html += '</optgroup>'
}
document.getElementById("select").innerHTML = html;
//
// change the icons everywhere if a set is selected
select.addEventListener('change', (event) => {
let currentset = document.body.dataset.set;
let currentclass = 'ss-'+currentset;
let newset = event.target.value;
let newclass = 'ss-'+newset;
let icons = document.querySelectorAll('.'+currentclass);
for(var i = 0; i < icons.length; i++) {
icons[i].classList.replace(currentclass, newclass);
}
document.body.dataset.set = newset;
});
//
// dark/light mode
let sup = document.getElementById('mode').querySelector('sup');
let sub = document.getElementById('mode').querySelector('sub');
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.documentElement.dataset.mode = 'dark';
sub.classList.add('on');
}
sup.addEventListener('click', function (event) {
document.documentElement.dataset.mode = 'light';
sup.classList.add('on');
sub.classList.remove('on');
});
sub.addEventListener('click', function (event) {
document.documentElement.dataset.mode = 'dark';
sub.classList.add('on');
sup.classList.remove('on');
});
</script>
</html>

69
demo/sets.js Normal file
View File

@ -0,0 +1,69 @@
sets = {
"Core": {
"lea": "Alpha",
"leb": "Beta",
"2ed": "Unlimited",
"3ed": "Revised",
"4ed": "Fourth Edition",
"5ed": "Fifth Edition",
"6ed": "Sixth Edition",
},
"Expansion": {
"arn": "Arabian Nights",
"atq": "Antiquities",
"leg": "Legends",
"drk": "The Dark",
"fem": "Fallen Empires",
"ice": "Ice Age",
"hml": "Homelands",
"all": "Alliances",
"mir": "Mirage",
"vis": "Visions",
"wth": "Weatherlight",
"tmp": "Tempest",
"sth": "Stronghold",
"exo": "Exodus",
},
"Command": {
"pvan": "Vanguard",
},
"Reprint": {
"sum": "Summer Magic",
"fbb": "Foreign Black Border",
"4bb": "4th Edition Black Border",
"chr": "Chronicles",
"ren": "Renaissance",
"rin": "Rinascimento",
},
"Supplemental": {},
"Digital": {
"past": "Astral Cards",
},
"Beginner": {
"itp": "Introductory 2-Player Set",
"por": "Portal",
"p02": "Portal Second Age"
},
"Premium": {
"ced": "Collectors' Edition",
"cei": "Intl. Collectors' Edition",
},
"Promo": {
"pdrc": "Dragon Con",
"phpr": "HarperPrism Book Promos",
"pmei": "Media Inserts",
"pmtg": "MTG Logo Promos",
},
"Standalone": {
"ugl": "Unglued",
},
"Unofficial": {
"palp": "Asia Pacific Land Program",
},
"Alternative": {
"legchr": "Legends (Chronicles)",
"pgc98": "Gen Con 1998 Oversized Promo",
"po": "Portal (Gatherer)",
"wl": "Weatherlight (Gatherer)",
}
}

598
dist/css/keyrune.css vendored Normal file
View File

@ -0,0 +1,598 @@
:root {
--border-default: #fff;
--border-contrast: #131417;
--rarity-default: #131417;
--inner-default: #fff;
}
:root[data-mode=dark] {
--border-default: #ddd;
--border-contrast: #000;
--rarity-default: #000;
--inner-default: #fff;
}
@font-face {
font-family: "keyrune";
src: url("../font/keyrune.eot?4.0.38");
src: url("../font/keyrune.eot?4.0.38#iefix") format("embedded-opentype"), url("../font/keyrune.woff2?4.0.38") format("woff2"), url("../font/keyrune.ttf?4.0.38") format("truetype"), url("../font/keyrune.woff?4.0.38") format("woff"), url("../font/keyrune.svg?4.0.38#keyrune") format("svg");
font-weight: normal;
font-style: normal;
font-display: block;
}
.ss {
font-family: "keyrune" !important;
color: var(--icon-default);
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
position: relative;
text-transform: none;
line-height: 1;
display: inline-flex;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.ss-lea::before {
content: "\e000";
}
.ss-lea.ss-border::after {
content: "\e001";
}
.ss-lea.ss-inner::marker {
content: "\e002";
}
.ss-leb::before {
content: "\e003";
}
.ss-leb.ss-border::after {
content: "\e004";
}
.ss-leb.ss-inner::marker {
content: "\e005";
}
.ss-2ed::before {
content: "\e006";
}
.ss-2ed.ss-border::after {
content: "\e007";
}
.ss-2ed.ss-inner::marker {
content: "\e008";
}
.ss-ced::before {
content: "\e009";
}
.ss-ced.ss-border::after {
content: "\e00a";
}
.ss-ced.ss-inner::marker {
content: "\e00b";
}
.ss-cei::before {
content: "\e00c";
}
.ss-cei.ss-border::after {
content: "\e00d";
}
.ss-cei.ss-inner::marker {
content: "\e00e";
}
.ss-arn::before {
content: "\e00f";
}
.ss-arn.ss-border::after {
content: "\e010";
}
.ss-arn.ss-inner::marker {
content: "\e011";
}
.ss-atq::before {
content: "\e012";
}
.ss-atq.ss-border::after {
content: "\e013";
}
.ss-atq.ss-inner::marker {
content: "\f8ff";
}
.ss-3ed::before {
content: "\e015";
}
.ss-3ed.ss-border::after {
content: "\e016";
}
.ss-3ed.ss-inner::marker {
content: "\e017";
}
.ss-fbb::before {
content: "\e018";
}
.ss-fbb.ss-border::after {
content: "\e019";
}
.ss-fbb.ss-inner::marker {
content: "\e01a";
}
.ss-leg::before {
content: "\e01b";
}
.ss-leg.ss-border::after {
content: "\e01c";
}
.ss-leg.ss-inner::marker {
content: "\e01d";
}
.ss-sum::before {
content: "\e01e";
}
.ss-sum.ss-border::after {
content: "\e01f";
}
.ss-sum.ss-inner::marker {
content: "\f8ff";
}
.ss-pdrc::before {
content: "\e021";
}
.ss-pdrc.ss-border::after {
content: "\e022";
}
.ss-pdrc.ss-inner::marker {
content: "\f8ff";
}
.ss-drk::before {
content: "\e024";
}
.ss-drk.ss-border::after {
content: "\e025";
}
.ss-drk.ss-inner::marker {
content: "\f8ff";
}
.ss-phpr::before {
content: "\e027";
}
.ss-phpr.ss-border::after {
content: "\e028";
}
.ss-phpr.ss-inner::marker {
content: "\f8ff";
}
.ss-fem::before {
content: "\e02a";
}
.ss-fem.ss-border::after {
content: "\e02b";
}
.ss-fem.ss-inner::marker {
content: "\f8ff";
}
.ss-pmei::before {
content: "\e02d";
}
.ss-pmei.ss-border::after {
content: "\e02e";
}
.ss-pmei.ss-inner::marker {
content: "\f8ff";
}
.ss-pleaf::before {
content: "\e02d";
}
.ss-pleaf.ss-border::after {
content: "\e02e";
}
.ss-pleaf.ss-inner::marker {
content: "\f8ff";
}
.ss-pmtg::before {
content: "\e030";
}
.ss-pmtg.ss-border::after {
content: "\e031";
}
.ss-pmtg.ss-inner::marker {
content: "\f8ff";
}
.ss-plgm::before {
content: "\e030";
}
.ss-plgm.ss-border::after {
content: "\e031";
}
.ss-plgm.ss-inner::marker {
content: "\f8ff";
}
.ss-parl::before {
content: "\e030";
}
.ss-parl.ss-border::after {
content: "\e031";
}
.ss-parl.ss-inner::marker {
content: "\f8ff";
}
.ss-4ed::before {
content: "\e033";
}
.ss-4ed.ss-border::after {
content: "\e034";
}
.ss-4ed.ss-inner::marker {
content: "\f8ff";
}
.ss-4bb::before {
content: "\e036";
}
.ss-4bb.ss-border::after {
content: "\e037";
}
.ss-4bb.ss-inner::marker {
content: "\f8ff";
}
.ss-ice::before {
content: "\e039";
}
.ss-ice.ss-border::after {
content: "\e03a";
}
.ss-ice.ss-inner::marker {
content: "\e03b";
}
.ss-chr::before {
content: "\e03c";
}
.ss-chr.ss-border::after {
content: "\e03d";
}
.ss-chr.ss-inner::marker {
content: "\f8ff";
}
.ss-ren::before {
content: "\e03f";
}
.ss-ren.ss-border::after {
content: "\e040";
}
.ss-ren.ss-inner::marker {
content: "\f8ff";
}
.ss-rin::before {
content: "\e042";
}
.ss-rin.ss-border::after {
content: "\e043";
}
.ss-rin.ss-inner::marker {
content: "\f8ff";
}
.ss-hml::before {
content: "\e045";
}
.ss-hml.ss-border::after {
content: "\e046";
}
.ss-hml.ss-inner::marker {
content: "\e047";
}
.ss-all::before {
content: "\e048";
}
.ss-all.ss-border::after {
content: "\e049";
}
.ss-all.ss-inner::marker {
content: "\e04a";
}
.ss-mir::before {
content: "\e04b";
}
.ss-mir.ss-border::after {
content: "\e04c";
}
.ss-mir.ss-inner::marker {
content: "\f8ff";
}
.ss-itp::before {
content: "\e04e";
}
.ss-itp.ss-border::after {
content: "\e04f";
}
.ss-itp.ss-inner::marker {
content: "\f8ff";
}
.ss-vis::before {
content: "\e051";
}
.ss-vis.ss-border::after {
content: "\e052";
}
.ss-vis.ss-inner::marker {
content: "\e053";
}
.ss-5ed::before {
content: "\e054";
}
.ss-5ed.ss-border::after {
content: "\e055";
}
.ss-5ed.ss-inner::marker {
content: "\f8ff";
}
.ss-past::before {
content: "\e057";
}
.ss-past.ss-border::after {
content: "\e058";
}
.ss-past.ss-inner::marker {
content: "\f8ff";
}
.ss-por::before {
content: "\e05a";
}
.ss-por.ss-border::after {
content: "\e05b";
}
.ss-por.ss-inner::marker {
content: "\e05c";
}
.ss-pvan::before {
content: "\e05d";
}
.ss-pvan.ss-border::after {
content: "\e05e";
}
.ss-pvan.ss-inner::marker {
content: "\f8ff";
}
.ss-van::before {
content: "\e05d";
}
.ss-van.ss-border::after {
content: "\e05e";
}
.ss-van.ss-inner::marker {
content: "\f8ff";
}
.ss-wth::before {
content: "\e060";
}
.ss-wth.ss-border::after {
content: "\e061";
}
.ss-wth.ss-inner::marker {
content: "\e062";
}
.ss-tmp::before {
content: "\e063";
}
.ss-tmp.ss-border::after {
content: "\e064";
}
.ss-tmp.ss-inner::marker {
content: "\f8ff";
}
.ss-sth::before {
content: "\e066";
}
.ss-sth.ss-border::after {
content: "\e067";
}
.ss-sth.ss-inner::marker {
content: "\f8ff";
}
.ss-exo::before {
content: "\e069";
}
.ss-exo.ss-border::after {
content: "\e06a";
}
.ss-exo.ss-inner::marker {
content: "\f8ff";
}
.ss-p02::before {
content: "\e06c";
}
.ss-p02.ss-border::after {
content: "\e06d";
}
.ss-p02.ss-inner::marker {
content: "\f8ff";
}
.ss-ugl::before {
content: "\e06f";
}
.ss-ugl.ss-border::after {
content: "\e070";
}
.ss-ugl.ss-inner::marker {
content: "\f8ff";
}
.ss-palp::before {
content: "\e072";
}
.ss-palp.ss-border::after {
content: "\e073";
}
.ss-palp.ss-inner::marker {
content: "\f8ff";
}
.ss-6ed::before {
content: "\e07e";
}
.ss-6ed.ss-border::after {
content: "\e07f";
}
.ss-6ed.ss-inner::marker {
content: "\f8ff";
}
.ss-legchr::before {
content: "\f8f6";
}
.ss-legchr.ss-border::after {
content: "\f8f5";
}
.ss-legchr.ss-inner::marker {
content: "\f8ff";
}
.ss-leg2::before {
content: "\f8f6";
}
.ss-leg2.ss-border::after {
content: "\f8f5";
}
.ss-leg2.ss-inner::marker {
content: "\f8ff";
}
.ss-pgc98::before {
content: "\f8f4";
}
.ss-pgc98.ss-border::after {
content: "\f8f3";
}
.ss-pgc98.ss-inner::marker {
content: "\f8ff";
}
.ss-po::before {
content: "\f8f2";
}
.ss-po.ss-border::after {
content: "\f8f1";
}
.ss-po.ss-inner::marker {
content: "\f8f0";
}
.ss-por2::before {
content: "\f8f2";
}
.ss-por2.ss-border::after {
content: "\f8f1";
}
.ss-por2.ss-inner::marker {
content: "\f8f0";
}
.ss-wl::before {
content: "\f8ef";
}
.ss-wl.ss-border::after {
content: "\f8ee";
}
.ss-wl.ss-inner::marker {
content: "\f8ff";
}
.ss-wth2::before {
content: "\f8ef";
}
.ss-wth2.ss-border::after {
content: "\f8ee";
}
.ss-wth2.ss-inner::marker {
content: "\f8ff";
}
.ss.ss-border::after {
color: var(--border-default);
position: absolute;
left: 0;
}
.ss.ss-border.ss-rarity-common-alt::after, .ss.ss-border.ss-rarity-uncommon::after, .ss.ss-border.ss-rarity-rare::after, .ss.ss-border.ss-rarity-mythic::after, .ss.ss-border.ss-rarity-foil::after, .ss.ss-border.ss-border-black::after {
color: var(--border-contrast);
}
.ss.ss-border-white::after {
color: var(--border-default) !important;
}
.ss.ss-inner {
display: list-item;
list-style-position: inside;
}
.ss.ss-inner::before {
position: absolute;
left: 0;
}
.ss.ss-inner::marker {
color: var(--inner-default);
}
.ss.ss-inner::before, .ss.ss-inner::after, .ss.ss-inner::marker {
left: 50%;
transform: translateX(-50%);
}
.ss.ss-rarity-common::before {
color: #131417;
}
.ss.ss-rarity-common.ss-rarity-gradient::before {
background: linear-gradient(90deg, #131417 0%, #131417 50%, #131417 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ss.ss-rarity-common-alt::before {
color: #fff;
}
.ss.ss-rarity-common-alt.ss-rarity-gradient::before {
background: linear-gradient(90deg, 0%, 50%, 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ss.ss-rarity-uncommon::before {
color: #707883;
}
.ss.ss-rarity-uncommon.ss-rarity-gradient::before {
background: linear-gradient(90deg, #4d6572 0%, #c3dfeb 50%, #4d6572 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ss.ss-rarity-rare::before {
color: #b7a066;
}
.ss.ss-rarity-rare.ss-rarity-gradient::before {
background: linear-gradient(90deg, #7f6f43 0%, #d9c287 50%, #7f6f43 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ss.ss-rarity-mythic::before {
color: #bf4427;
}
.ss.ss-rarity-mythic.ss-rarity-gradient::before {
background: linear-gradient(90deg, #ac392e 0%, #eb9d3d 50%, #ac392e 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ss.ss-rarity-foil::before {
color: #00afc9;
}
.ss.ss-rarity-foil.ss-rarity-gradient::before {
background: linear-gradient(135deg, #ea8d66 0%, #ea8d66 15%, #fdef8a 28%, #8bcc93 42%, #a6dced 55%, #6f75aa 68%, #e599c2 84%, #e599c2 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ss.ss-fw {
width: 1.75em;
display: list-item;
list-style-position: inside;
text-align: center;
}
.ss.ss-fw:not(.ss-inner) {
list-style: none;
}
.ss.ss-fw.ss-border:not(.ss-inner)::after {
left: 50%;
transform: translateX(-50%);
}
.ss.ss-white::before, .ss.ss-white::after, .ss.ss-white::marker {
color: #fff;
}
/*# sourceMappingURL=keyrune.css.map */

1
dist/css/keyrune.css.map vendored Normal file
View File

@ -0,0 +1 @@
{"version":3,"sourceRoot":"","sources":["../../src/scss/_media.scss","../../src/scss/keyrune.scss","../../src/scss/_helpers.scss"],"names":[],"mappings":"AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;;ACLR;EACI;EACA;EACA;EAKA;EACA;EACA;;AAIJ;EAGI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;;ACjCA;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;ADmDA;EACI;EACA;EACA;;AAIJ;EAMI;;AAIJ;EACI;;AAMR;EAGI;EACA;;AAGA;EACI;EACA;;AAIJ;EACI;;AAIJ;EAGI;EACA;;AAWI;EACI;;AAGJ;EACI;EAKA;EACA;EACA;EACA;;AAbJ;EACI;;AAGJ;EACI;EAKA;EACA;EACA;EACA;;AAbJ;EACI;;AAGJ;EACI;EAKA;EACA;EACA;EACA;;AAbJ;EACI;;AAGJ;EACI;EAKA;EACA;EACA;EACA;;AAbJ;EACI;;AAGJ;EACI;EAKA;EACA;EACA;EACA;;AAOR;EACI;;AAEJ;EACI;EAUA;EACA;EACA;EACA;;AAMZ;EAGI;EACA;EACA;EACA;;AAGA;EACI;;AAIJ;EACI;EACA;;AAMJ;EAGI","file":"keyrune.css"}

BIN
dist/font/keyrune.eot vendored Normal file

Binary file not shown.

136
dist/font/keyrune.svg vendored Normal file

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 324 KiB

BIN
dist/font/keyrune.ttf vendored Normal file

Binary file not shown.

BIN
dist/font/keyrune.woff vendored Normal file

Binary file not shown.

BIN
dist/font/keyrune.woff2 vendored Normal file

Binary file not shown.

1550
docs/assets/css/docs.css Normal file

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

598
docs/assets/css/keyrune.css Normal file
View File

@ -0,0 +1,598 @@
:root {
--border-default: #fff;
--border-contrast: #131417;
--rarity-default: #131417;
--inner-default: #fff;
}
:root[data-mode=dark] {
--border-default: #ddd;
--border-contrast: #000;
--rarity-default: #000;
--inner-default: #fff;
}
@font-face {
font-family: "keyrune";
src: url("../font/keyrune.eot?4.0.38");
src: url("../font/keyrune.eot?4.0.38#iefix") format("embedded-opentype"), url("../font/keyrune.woff2?4.0.38") format("woff2"), url("../font/keyrune.ttf?4.0.38") format("truetype"), url("../font/keyrune.woff?4.0.38") format("woff"), url("../font/keyrune.svg?4.0.38#keyrune") format("svg");
font-weight: normal;
font-style: normal;
font-display: block;
}
.ss {
font-family: "keyrune" !important;
color: var(--icon-default);
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
position: relative;
text-transform: none;
line-height: 1;
display: inline-flex;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.ss-lea::before {
content: "\e000";
}
.ss-lea.ss-border::after {
content: "\e001";
}
.ss-lea.ss-inner::marker {
content: "\e002";
}
.ss-leb::before {
content: "\e003";
}
.ss-leb.ss-border::after {
content: "\e004";
}
.ss-leb.ss-inner::marker {
content: "\e005";
}
.ss-2ed::before {
content: "\e006";
}
.ss-2ed.ss-border::after {
content: "\e007";
}
.ss-2ed.ss-inner::marker {
content: "\e008";
}
.ss-ced::before {
content: "\e009";
}
.ss-ced.ss-border::after {
content: "\e00a";
}
.ss-ced.ss-inner::marker {
content: "\e00b";
}
.ss-cei::before {
content: "\e00c";
}
.ss-cei.ss-border::after {
content: "\e00d";
}
.ss-cei.ss-inner::marker {
content: "\e00e";
}
.ss-arn::before {
content: "\e00f";
}
.ss-arn.ss-border::after {
content: "\e010";
}
.ss-arn.ss-inner::marker {
content: "\e011";
}
.ss-atq::before {
content: "\e012";
}
.ss-atq.ss-border::after {
content: "\e013";
}
.ss-atq.ss-inner::marker {
content: "\f8ff";
}
.ss-3ed::before {
content: "\e015";
}
.ss-3ed.ss-border::after {
content: "\e016";
}
.ss-3ed.ss-inner::marker {
content: "\e017";
}
.ss-fbb::before {
content: "\e018";
}
.ss-fbb.ss-border::after {
content: "\e019";
}
.ss-fbb.ss-inner::marker {
content: "\e01a";
}
.ss-leg::before {
content: "\e01b";
}
.ss-leg.ss-border::after {
content: "\e01c";
}
.ss-leg.ss-inner::marker {
content: "\e01d";
}
.ss-sum::before {
content: "\e01e";
}
.ss-sum.ss-border::after {
content: "\e01f";
}
.ss-sum.ss-inner::marker {
content: "\f8ff";
}
.ss-pdrc::before {
content: "\e021";
}
.ss-pdrc.ss-border::after {
content: "\e022";
}
.ss-pdrc.ss-inner::marker {
content: "\f8ff";
}
.ss-drk::before {
content: "\e024";
}
.ss-drk.ss-border::after {
content: "\e025";
}
.ss-drk.ss-inner::marker {
content: "\f8ff";
}
.ss-phpr::before {
content: "\e027";
}
.ss-phpr.ss-border::after {
content: "\e028";
}
.ss-phpr.ss-inner::marker {
content: "\f8ff";
}
.ss-fem::before {
content: "\e02a";
}
.ss-fem.ss-border::after {
content: "\e02b";
}
.ss-fem.ss-inner::marker {
content: "\f8ff";
}
.ss-pmei::before {
content: "\e02d";
}
.ss-pmei.ss-border::after {
content: "\e02e";
}
.ss-pmei.ss-inner::marker {
content: "\f8ff";
}
.ss-pleaf::before {
content: "\e02d";
}
.ss-pleaf.ss-border::after {
content: "\e02e";
}
.ss-pleaf.ss-inner::marker {
content: "\f8ff";
}
.ss-pmtg::before {
content: "\e030";
}
.ss-pmtg.ss-border::after {
content: "\e031";
}
.ss-pmtg.ss-inner::marker {
content: "\f8ff";
}
.ss-plgm::before {
content: "\e030";
}
.ss-plgm.ss-border::after {
content: "\e031";
}
.ss-plgm.ss-inner::marker {
content: "\f8ff";
}
.ss-parl::before {
content: "\e030";
}
.ss-parl.ss-border::after {
content: "\e031";
}
.ss-parl.ss-inner::marker {
content: "\f8ff";
}
.ss-4ed::before {
content: "\e033";
}
.ss-4ed.ss-border::after {
content: "\e034";
}
.ss-4ed.ss-inner::marker {
content: "\f8ff";
}
.ss-4bb::before {
content: "\e036";
}
.ss-4bb.ss-border::after {
content: "\e037";
}
.ss-4bb.ss-inner::marker {
content: "\f8ff";
}
.ss-ice::before {
content: "\e039";
}
.ss-ice.ss-border::after {
content: "\e03a";
}
.ss-ice.ss-inner::marker {
content: "\e03b";
}
.ss-chr::before {
content: "\e03c";
}
.ss-chr.ss-border::after {
content: "\e03d";
}
.ss-chr.ss-inner::marker {
content: "\f8ff";
}
.ss-ren::before {
content: "\e03f";
}
.ss-ren.ss-border::after {
content: "\e040";
}
.ss-ren.ss-inner::marker {
content: "\f8ff";
}
.ss-rin::before {
content: "\e042";
}
.ss-rin.ss-border::after {
content: "\e043";
}
.ss-rin.ss-inner::marker {
content: "\f8ff";
}
.ss-hml::before {
content: "\e045";
}
.ss-hml.ss-border::after {
content: "\e046";
}
.ss-hml.ss-inner::marker {
content: "\e047";
}
.ss-all::before {
content: "\e048";
}
.ss-all.ss-border::after {
content: "\e049";
}
.ss-all.ss-inner::marker {
content: "\e04a";
}
.ss-mir::before {
content: "\e04b";
}
.ss-mir.ss-border::after {
content: "\e04c";
}
.ss-mir.ss-inner::marker {
content: "\f8ff";
}
.ss-itp::before {
content: "\e04e";
}
.ss-itp.ss-border::after {
content: "\e04f";
}
.ss-itp.ss-inner::marker {
content: "\f8ff";
}
.ss-vis::before {
content: "\e051";
}
.ss-vis.ss-border::after {
content: "\e052";
}
.ss-vis.ss-inner::marker {
content: "\e053";
}
.ss-5ed::before {
content: "\e054";
}
.ss-5ed.ss-border::after {
content: "\e055";
}
.ss-5ed.ss-inner::marker {
content: "\f8ff";
}
.ss-past::before {
content: "\e057";
}
.ss-past.ss-border::after {
content: "\e058";
}
.ss-past.ss-inner::marker {
content: "\f8ff";
}
.ss-por::before {
content: "\e05a";
}
.ss-por.ss-border::after {
content: "\e05b";
}
.ss-por.ss-inner::marker {
content: "\e05c";
}
.ss-pvan::before {
content: "\e05d";
}
.ss-pvan.ss-border::after {
content: "\e05e";
}
.ss-pvan.ss-inner::marker {
content: "\f8ff";
}
.ss-van::before {
content: "\e05d";
}
.ss-van.ss-border::after {
content: "\e05e";
}
.ss-van.ss-inner::marker {
content: "\f8ff";
}
.ss-wth::before {
content: "\e060";
}
.ss-wth.ss-border::after {
content: "\e061";
}
.ss-wth.ss-inner::marker {
content: "\e062";
}
.ss-tmp::before {
content: "\e063";
}
.ss-tmp.ss-border::after {
content: "\e064";
}
.ss-tmp.ss-inner::marker {
content: "\f8ff";
}
.ss-sth::before {
content: "\e066";
}
.ss-sth.ss-border::after {
content: "\e067";
}
.ss-sth.ss-inner::marker {
content: "\f8ff";
}
.ss-exo::before {
content: "\e069";
}
.ss-exo.ss-border::after {
content: "\e06a";
}
.ss-exo.ss-inner::marker {
content: "\f8ff";
}
.ss-p02::before {
content: "\e06c";
}
.ss-p02.ss-border::after {
content: "\e06d";
}
.ss-p02.ss-inner::marker {
content: "\f8ff";
}
.ss-ugl::before {
content: "\e06f";
}
.ss-ugl.ss-border::after {
content: "\e070";
}
.ss-ugl.ss-inner::marker {
content: "\f8ff";
}
.ss-palp::before {
content: "\e072";
}
.ss-palp.ss-border::after {
content: "\e073";
}
.ss-palp.ss-inner::marker {
content: "\f8ff";
}
.ss-6ed::before {
content: "\e07e";
}
.ss-6ed.ss-border::after {
content: "\e07f";
}
.ss-6ed.ss-inner::marker {
content: "\f8ff";
}
.ss-legchr::before {
content: "\f8f6";
}
.ss-legchr.ss-border::after {
content: "\f8f5";
}
.ss-legchr.ss-inner::marker {
content: "\f8ff";
}
.ss-leg2::before {
content: "\f8f6";
}
.ss-leg2.ss-border::after {
content: "\f8f5";
}
.ss-leg2.ss-inner::marker {
content: "\f8ff";
}
.ss-pgc98::before {
content: "\f8f4";
}
.ss-pgc98.ss-border::after {
content: "\f8f3";
}
.ss-pgc98.ss-inner::marker {
content: "\f8ff";
}
.ss-po::before {
content: "\f8f2";
}
.ss-po.ss-border::after {
content: "\f8f1";
}
.ss-po.ss-inner::marker {
content: "\f8f0";
}
.ss-por2::before {
content: "\f8f2";
}
.ss-por2.ss-border::after {
content: "\f8f1";
}
.ss-por2.ss-inner::marker {
content: "\f8f0";
}
.ss-wl::before {
content: "\f8ef";
}
.ss-wl.ss-border::after {
content: "\f8ee";
}
.ss-wl.ss-inner::marker {
content: "\f8ff";
}
.ss-wth2::before {
content: "\f8ef";
}
.ss-wth2.ss-border::after {
content: "\f8ee";
}
.ss-wth2.ss-inner::marker {
content: "\f8ff";
}
.ss.ss-border::after {
color: var(--border-default);
position: absolute;
left: 0;
}
.ss.ss-border.ss-rarity-common-alt::after, .ss.ss-border.ss-rarity-uncommon::after, .ss.ss-border.ss-rarity-rare::after, .ss.ss-border.ss-rarity-mythic::after, .ss.ss-border.ss-rarity-foil::after, .ss.ss-border.ss-border-black::after {
color: var(--border-contrast);
}
.ss.ss-border-white::after {
color: var(--border-default) !important;
}
.ss.ss-inner {
display: list-item;
list-style-position: inside;
}
.ss.ss-inner::before {
position: absolute;
left: 0;
}
.ss.ss-inner::marker {
color: var(--inner-default);
}
.ss.ss-inner::before, .ss.ss-inner::after, .ss.ss-inner::marker {
left: 50%;
transform: translateX(-50%);
}
.ss.ss-rarity-common::before {
color: #131417;
}
.ss.ss-rarity-common.ss-rarity-gradient::before {
background: linear-gradient(90deg, #131417 0%, #131417 50%, #131417 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ss.ss-rarity-common-alt::before {
color: #fff;
}
.ss.ss-rarity-common-alt.ss-rarity-gradient::before {
background: linear-gradient(90deg, 0%, 50%, 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ss.ss-rarity-uncommon::before {
color: #707883;
}
.ss.ss-rarity-uncommon.ss-rarity-gradient::before {
background: linear-gradient(90deg, #4d6572 0%, #c3dfeb 50%, #4d6572 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ss.ss-rarity-rare::before {
color: #b7a066;
}
.ss.ss-rarity-rare.ss-rarity-gradient::before {
background: linear-gradient(90deg, #7f6f43 0%, #d9c287 50%, #7f6f43 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ss.ss-rarity-mythic::before {
color: #bf4427;
}
.ss.ss-rarity-mythic.ss-rarity-gradient::before {
background: linear-gradient(90deg, #ac392e 0%, #eb9d3d 50%, #ac392e 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ss.ss-rarity-foil::before {
color: #00afc9;
}
.ss.ss-rarity-foil.ss-rarity-gradient::before {
background: linear-gradient(135deg, #ea8d66 0%, #ea8d66 15%, #fdef8a 28%, #8bcc93 42%, #a6dced 55%, #6f75aa 68%, #e599c2 84%, #e599c2 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ss.ss-fw {
width: 1.75em;
display: list-item;
list-style-position: inside;
text-align: center;
}
.ss.ss-fw:not(.ss-inner) {
list-style: none;
}
.ss.ss-fw.ss-border:not(.ss-inner)::after {
left: 50%;
transform: translateX(-50%);
}
.ss.ss-white::before, .ss.ss-white::after, .ss.ss-white::marker {
color: #fff;
}
/*# sourceMappingURL=keyrune.css.map */

View File

@ -0,0 +1 @@
{"version":3,"sourceRoot":"","sources":["../../src/scss/_media.scss","../../src/scss/keyrune.scss","../../src/scss/_helpers.scss"],"names":[],"mappings":"AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;;ACLR;EACI;EACA;EACA;EAKA;EACA;EACA;;AAIJ;EAGI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;;ACjCA;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;AAVR;EACI;;AAGA;EACI;;AAIJ;EACI;;ADmDA;EACI;EACA;EACA;;AAIJ;EAMI;;AAIJ;EACI;;AAMR;EAGI;EACA;;AAGA;EACI;EACA;;AAIJ;EACI;;AAIJ;EAGI;EACA;;AAWI;EACI;;AAGJ;EACI;EAKA;EACA;EACA;EACA;;AAbJ;EACI;;AAGJ;EACI;EAKA;EACA;EACA;EACA;;AAbJ;EACI;;AAGJ;EACI;EAKA;EACA;EACA;EACA;;AAbJ;EACI;;AAGJ;EACI;EAKA;EACA;EACA;EACA;;AAbJ;EACI;;AAGJ;EACI;EAKA;EACA;EACA;EACA;;AAOR;EACI;;AAEJ;EACI;EAUA;EACA;EACA;EACA;;AAMZ;EAGI;EACA;EACA;EACA;;AAGA;EACI;;AAIJ;EACI;EACA;;AAMJ;EAGI","file":"keyrune.css"}

BIN
docs/assets/font/beleren.eot Executable file

Binary file not shown.

BIN
docs/assets/font/beleren.otf Executable file

Binary file not shown.

3634
docs/assets/font/beleren.svg Executable file

File diff suppressed because it is too large Load Diff

After

Width:  |  Height:  |  Size: 219 KiB

BIN
docs/assets/font/beleren.ttf Executable file

Binary file not shown.

BIN
docs/assets/font/beleren.woff Executable file

Binary file not shown.

Binary file not shown.

Binary file not shown.

5
docs/assets/js/first.js Normal file
View File

@ -0,0 +1,5 @@
(function () {
var mode = localStorage.getItem("mode");
if (mode === "dark") document.documentElement.dataset.mode = 'dark';
else if (mode === "light") document.documentElement.dataset.mode = 'light';
})();

316
docs/assets/js/glitz.js Normal file
View File

@ -0,0 +1,316 @@
//
// toggle non-rarity classes for icon instances on icons page
function iconsToggleClass(classnames, label, off) {
if (off) {
$('#icons i.ss').each(function(index, icon) {
$(icon).removeClass(classnames);
});
$('details div.icon i').removeClass(classnames);
$('#preview-extras-modal label[for="extras_'+label+'"]').removeClass('checked');
} else {
$('#icons i.ss').each(function(index, icon) {
$(icon).toggleClass(classnames);
});
$('details div.icon i').toggleClass(classnames);
$('#preview-extras-modal label[for="extras_'+label+'"]').toggleClass('checked');
}
}
//
// rarity toggle handling on icons page
function iconsChangeRarity(rarity) {
// change each icon in the results
$('#icons i.ss').each(function(index, icon) {
$(icon).removeClass('ss-rarity-common ss-rarity-uncommon ss-rarity-rare ss-rarity-mythic ss-rarity-foil');
$(icon).addClass('ss-rarity-'+rarity);
});
// change the modal
$('#icon-rarity-modal label').removeClass('checked');
$('#icon-rarity-modal label[for="rarity_'+rarity+'"]').addClass('checked');
$('details div.icon i').removeClass('ss-rarity-common ss-rarity-uncommon ss-rarity-rare ss-rarity-mythic ss-rarity-foil');
$('details div.icon i').addClass('ss-rarity-'+rarity);
// for commons, disable the gradient
if (rarity == "common") {
$('#extras_gradient').attr('disabled', 'disabled').prop('checked', false);
$('label[for="extras_gradient"]').attr('disabled', 'disabled').addClass('disabled');
iconsToggleClass('ss-rarity-gradient', 'gradient', true);
} else {
$('#extras_gradient').attr('disabled', null);
$('label[for="extras_gradient"]').attr('disabled', null).removeClass('disabled');
}
}
//
// get the current values of all icon page menu items
function getIconDisplaySettings() {
let classes = '';
classes += $('#icon-rarity input:checked').data('class');
$('#icon-extras input:checked').each(function(index, extra) {
classes += ' '+$(extra).data('class');
});
return classes;
}
//
// icon search filtering
function filterIcons(q) {
// define some empty variables
let code = '';
let tags = Object;
let group = '';
let parent = '';
// set the URL to show the param
if (q.length > 0) {
window.history.replaceState({'q':q,}, "Set icon search results", '?q='+q);
$('#search svg.clear').removeClass('hidden');
} else {
window.history.replaceState({'q':'',}, "Set icons", '/sets');
$('#search svg.clear').addClass('hidden');
}
// iterate over each icon and show/hide along with its parent group
$('#icons figure').each(function() {
code = $(this).data('code');
tags = $(this).data('tags');
group = $(this).data('order');
parent = $('.set-group[data-id="'+group+'"]');
// show/hide icons based on query index
if (code.indexOf(q) >= 0 || Object.values(tags).indexOf(q) >= 0) {
$(this).removeClass('hidden');
} else {
$(this).addClass('hidden');
}
// poll for group's non-hidden count and hide it if there are none
if (parent.children().children().children('figure:not(.hidden)').length == 0) {
parent.addClass('hidden');
} else {
parent.removeClass('hidden');
}
});
// if there are 0 results, show something
if ($('#icons .set-group:not(.hidden)').length == 0) {
$('#search-empty').removeClass('hidden');
} else {
$('#search-empty').addClass('hidden');
}
}
function outputAliases(aliases) {
let html = '<table class="aliases">';
aliases.forEach(function(alias, index) {
html += '<tr><td class="code">'+alias.code+'</td><td class="set"><span title="'+alias.name+' ('+alias.release+')">'+alias.name+'</span></td></tr>';
});
return html+'</table>';
}
//
// icons page modal handling
function openModal(icon) {
// get the data vars from the figure that was clicked
let code = icon.data('code');
let name = icon.data('name');
let tags = icon.data('tags');
let tagp = '';
let tagc = '';
let group = icon.data('group');
let rarity = (icon.data('rarity')) ? icon.data('rarity') : 'n/a';
let border = (icon.data('border')) ? icon.data('border') : 'n/a';
let inner = (icon.data('inner')) ? icon.data('inner') : 'n/a';
let version = icon.data('version');
let classes = getIconDisplaySettings();
// format any aliases into spans
let aliases = (icon.data('aliases') == false)
? 'none'
: outputAliases(Object.values(icon.data('aliases')));
// format the tags into spans
tags.forEach(function(item, index) {
// check if we're linking to a card with [[card]]
const re = /\[\[(.*?)\]\]/g;
if (item.match(re)) {
tagc = item.substring(2, item.length -2).split("|");
tagp = tagp+'<a href="https://scryfall.com/search?q=set:'+tagc[1]+' '+tagc[0]+'" target="blank" class="card">'+tagc[0]+'</a>';
// otherwise link to search
} else {
tagp = tagp+'<a href="?q='+item+'">'+item+'</a>';
}
});
// update the fields
$('details div.icon i').attr('class', 'ss ss-'+code+' '+classes);
$('details div.table h2.name').html(name);
$('details div.table h3.class').html(code);
$('details div.table span.group').html(group);
$('details div.table li.rarity span').html(rarity);
$('details div.table li.rarity i').html('&#x'+rarity);
$('details div.table li.border').attr('class', 'border '+icon.data('border')+'');
$('details div.table li.border span').html(border);
$('details div.table li.border i').html('&#x'+border);
$('details div.table li.inner').attr('class', 'inner '+icon.data('inner')+'');
$('details div.table li.inner span').html(inner);
$('details div.table li.inner i').html('&#x'+inner);
$('details div.table span.version').html(version);
$('details div.table span.aliases').html(aliases);
$('details div.tags').html(tagp);
// specific function bindings
$('#copy-unicode').on('click', function() {
navigator.clipboard.writeText(rarity).then(function() {
$('#copy-unicode em').html('Unicode copied!').animate('fadeup', 1200, 'ease-in-out');
}, function(err) {
$('#copy-unicode em').html('Error copying').animate('fadeup', 1200, 'ease-in-out');
});
});
$('#copy-glyph').on('click', function() {
navigator.clipboard.writeText($('details div.table li.rarity i').html()).then(function() {
$('#copy-glyph em').html('SVG copied!').animate('fadeup', 1200, 'ease-in-out');
}, function(err) {
$('#copy-glyph em').html('Error copying').animate('fadeup', 1200, 'ease-in-out');
});
});
$('#download-svg').on('click', function() {
$('#download-svg em').html('Coming soon!').animate('fadeup', 1200, 'ease-in-out');
});
// show the modal
window.history.replaceState({'i':code,}, "Set icon details", '?i='+code);
$('object').addClass('active');
}
function closeModal() {
$('object').removeClass('active');
window.history.replaceState({'q':'',}, "Set icons", '/sets');
}
//
// onload interactions
Zepto(function($){
//
// mobile nav
$('header').on('click', '#toggle-nav', function(e) {
$('nav').toggleClass('mobile');
$('#toggle-nav-svg').toggleClass('closed');
});
//
// dark/light mode
let toggle = $('#switch');
let cookie = localStorage.getItem('mode');
if (cookie) {
if (cookie == 'dark') {
document.documentElement.dataset.mode = 'dark';
toggle.prop('checked', 'checked');
} else if (cookie == 'light') {
document.documentElement.dataset.mode = 'light';
toggle.prop('checked', false);
}
}
else if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.documentElement.dataset.mode = 'dark';
toggle.prop('checked', 'checked');
localStorage.setItem('mode', 'dark');
} else {
localStorage.setItem('mode', 'light');
}
toggle.on('change', function() {
if (toggle.prop('checked')) {
document.documentElement.dataset.mode = 'dark';
localStorage.setItem('mode', 'dark');
} else {
document.documentElement.dataset.mode = 'light';
localStorage.setItem('mode', 'light');
}
});
//
// filter icons if we have a ?q=, modal if we have an ?i=
let url = new URLSearchParams(window.location.search);
if (url.get('q')) {
filterIcons(url.get('q'));
$('#icon-filter').val(url.get('q'));
}
if (url.get('i')) {
let icon = $('figure[data-code="'+url.get('i')+'"]');
if (icon) {
openModal(icon);
}
}
//
// live icon filter via search box
$('#icon-filter').on('input', function() {
filterIcons($(this).val());
});
//
// icon filter clear button
$('.search-link').on('click', function(e) {
e.preventDefault();
filterIcons($(this).data('q'));
$('#icon-filter').val($(this).data('q'));
});
//
// icon display menus
$('#icon-menu').on('change', 'input[type=radio][name="density"]', function() {
$('#icons').data('density', $(this).val());
});
$('#icon-menu').on('change', 'input[type=radio][name="rarity"]', function() {
iconsChangeRarity($(this).val());
});
$('#icon-menu').on('change', 'input[type=checkbox][name="border"]', function() {
iconsToggleClass('ss-border', 'border');
});
$('#icon-menu').on('change', 'input[type=checkbox][name="inner"]', function() {
iconsToggleClass('ss-inner', 'inner');
});
$('#icon-menu').on('change', 'input[type=checkbox][name="gradient"]', function() {
iconsToggleClass('ss-rarity-gradient', 'gradient');
});
$('#icon-menu').on('change', 'input[type=checkbox][name="transparent"]', function() {
$('#icons figure').each(function(index, figure) {
$(figure).toggleClass('checkerboard');
});
});
//
// icon modal
$('#icons').on('click', 'figure', function() {
openModal($(this));
});
$('object').on('click', '.close', function(e) {
e.preventDefault();
closeModal();
})
});

123
docs/assets/js/zepto.fx.js Normal file
View File

@ -0,0 +1,123 @@
// Zepto.js
// (c) 2010-2016 Thomas Fuchs
// Zepto.js may be freely distributed under the MIT license.
;(function($, undefined){
var prefix = '', eventPrefix,
vendors = { Webkit: 'webkit', Moz: '', O: 'o' },
testEl = document.createElement('div'),
supportedTransforms = /^((translate|rotate|scale)(X|Y|Z|3d)?|matrix(3d)?|perspective|skew(X|Y)?)$/i,
transform,
transitionProperty, transitionDuration, transitionTiming, transitionDelay,
animationName, animationDuration, animationTiming, animationDelay,
cssReset = {}
function dasherize(str) { return str.replace(/([A-Z])/g, '-$1').toLowerCase() }
function normalizeEvent(name) { return eventPrefix ? eventPrefix + name : name.toLowerCase() }
if (testEl.style.transform === undefined) $.each(vendors, function(vendor, event){
if (testEl.style[vendor + 'TransitionProperty'] !== undefined) {
prefix = '-' + vendor.toLowerCase() + '-'
eventPrefix = event
return false
}
})
transform = prefix + 'transform'
cssReset[transitionProperty = prefix + 'transition-property'] =
cssReset[transitionDuration = prefix + 'transition-duration'] =
cssReset[transitionDelay = prefix + 'transition-delay'] =
cssReset[transitionTiming = prefix + 'transition-timing-function'] =
cssReset[animationName = prefix + 'animation-name'] =
cssReset[animationDuration = prefix + 'animation-duration'] =
cssReset[animationDelay = prefix + 'animation-delay'] =
cssReset[animationTiming = prefix + 'animation-timing-function'] = ''
$.fx = {
off: (eventPrefix === undefined && testEl.style.transitionProperty === undefined),
speeds: { _default: 400, fast: 200, slow: 600 },
cssPrefix: prefix,
transitionEnd: normalizeEvent('TransitionEnd'),
animationEnd: normalizeEvent('AnimationEnd')
}
$.fn.animate = function(properties, duration, ease, callback, delay){
if ($.isFunction(duration))
callback = duration, ease = undefined, duration = undefined
if ($.isFunction(ease))
callback = ease, ease = undefined
if ($.isPlainObject(duration))
ease = duration.easing, callback = duration.complete, delay = duration.delay, duration = duration.duration
if (duration) duration = (typeof duration == 'number' ? duration :
($.fx.speeds[duration] || $.fx.speeds._default)) / 1000
if (delay) delay = parseFloat(delay) / 1000
return this.anim(properties, duration, ease, callback, delay)
}
$.fn.anim = function(properties, duration, ease, callback, delay){
var key, cssValues = {}, cssProperties, transforms = '',
that = this, wrappedCallback, endEvent = $.fx.transitionEnd,
fired = false
if (duration === undefined) duration = $.fx.speeds._default / 1000
if (delay === undefined) delay = 0
if ($.fx.off) duration = 0
if (typeof properties == 'string') {
// keyframe animation
cssValues[animationName] = properties
cssValues[animationDuration] = duration + 's'
cssValues[animationDelay] = delay + 's'
cssValues[animationTiming] = (ease || 'linear')
endEvent = $.fx.animationEnd
} else {
cssProperties = []
// CSS transitions
for (key in properties)
if (supportedTransforms.test(key)) transforms += key + '(' + properties[key] + ') '
else cssValues[key] = properties[key], cssProperties.push(dasherize(key))
if (transforms) cssValues[transform] = transforms, cssProperties.push(transform)
if (duration > 0 && typeof properties === 'object') {
cssValues[transitionProperty] = cssProperties.join(', ')
cssValues[transitionDuration] = duration + 's'
cssValues[transitionDelay] = delay + 's'
cssValues[transitionTiming] = (ease || 'linear')
}
}
wrappedCallback = function(event){
if (typeof event !== 'undefined') {
if (event.target !== event.currentTarget) return // makes sure the event didn't bubble from "below"
$(event.target).unbind(endEvent, wrappedCallback)
} else
$(this).unbind(endEvent, wrappedCallback) // triggered by setTimeout
fired = true
$(this).css(cssReset)
callback && callback.call(this)
}
if (duration > 0){
this.bind(endEvent, wrappedCallback)
// transitionEnd is not always firing on older Android phones
// so make sure it gets fired
setTimeout(function(){
if (fired) return
wrappedCallback.call(that)
}, ((duration + delay) * 1000) + 25)
}
// trigger page reflow so new elements can animate
this.size() && this.get(0).clientLeft
this.css(cssValues)
if (duration <= 0) setTimeout(function() {
that.each(function(){ wrappedCallback.call(this) })
}, 0)
return this
}
testEl = null
})(Zepto)

2
docs/assets/js/zepto.js Normal file

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 300 300" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;"><path id="path4289" d="M148.297,183.556c2.126,9.257 3.119,18.611 2.962,27.926c-0.113,6.628 -0.793,12.496 -1.682,17.44c11.486,-18.717 22.221,-36.402 26.871,-44.555l1.116,-1.958l2.047,0.942c9.805,4.506 26.646,9.351 44.493,9.42c11.475,0.04 22.002,-1.851 31.295,-5.633c10.898,-4.434 20.073,-11.486 27.272,-20.959c6.498,-8.548 9.884,-18.355 10.068,-29.153c0.145,-8.744 -1.782,-18.18 -5.741,-28.041c-5.546,-13.821 -13.582,-24.655 -16.442,-28.283l-111.738,40.597l-0.341,0.123l-4.336,1.577l4.336,-1.577l-33.637,12.221c9.6,13.133 16.683,26.933 21.069,41.059c0.418,1.347 0.807,2.691 1.174,4.04c0.437,1.604 0.845,3.207 1.214,4.814" style="fill:#1abc9c;fill-rule:nonzero;"/><path id="path4291" d="M113.039,131.968l-2.044,-2.682l40.724,-14.796c-2.126,-9.252 -3.126,-18.612 -2.962,-27.923c0.112,-6.625 0.793,-12.495 1.679,-17.439c-11.482,18.717 -22.221,36.402 -26.87,44.552l-1.119,1.959l-2.042,-0.94c-9.808,-4.509 -26.647,-9.353 -44.496,-9.422c-11.476,-0.042 -22.002,1.856 -31.294,5.638c-10.894,4.434 -20.07,11.482 -27.274,20.953c-6.496,8.548 -9.883,18.356 -10.064,29.155c-0.148,8.744 1.781,18.177 5.741,28.04c5.541,13.821 13.579,24.654 16.443,28.287l107.096,-38.916c-0.386,-1.419 -0.794,-2.838 -1.233,-4.249c-4.514,-14.539 -12.015,-28.744 -22.285,-42.217" style="fill:#2980b9;fill-rule:nonzero;"/><path id="path4293" d="M11.494,124.96c18.024,-23.711 43.934,-28.6 62.496,-28.531c17.447,0.067 34.001,4.518 44.475,8.962c6.612,-11.4 21.4,-35.58 35.178,-57.949c0.008,-0.011 0.017,-0.026 0.023,-0.04c11.76,-19.078 22.759,-36.804 27.336,-44.178c-4.692,-0.985 -9.469,-1.743 -14.316,-2.279c-4.036,-0.366 -8.617,-0.681 -13.608,-0.868c-1.027,-0.02 -2.046,-0.077 -3.079,-0.077c-82.436,0 -149.319,66.48 -149.999,148.738c0.192,1.403 0.398,2.801 0.631,4.192c0.901,-10.266 4.545,-19.659 10.863,-27.97" style="fill:#3498db;fill-rule:nonzero;"/><path id="path4295" d="M300,151.259c-0.193,-1.4 -0.398,-2.799 -0.633,-4.191c-0.902,10.264 -4.545,19.657 -10.862,27.968c-18.026,23.71 -43.934,28.603 -62.496,28.533c-17.446,-0.066 -33.999,-4.518 -44.471,-8.966c-6.605,11.386 -21.36,35.513 -35.124,57.852c-0.015,0.029 -0.032,0.057 -0.049,0.081c-11.77,19.106 -22.788,36.861 -27.372,44.239c4.676,0.982 9.436,1.735 14.261,2.271c4.082,0.373 8.726,0.692 13.787,0.878c0.988,0.018 1.966,0.076 2.958,0.076c82.441,0 149.323,-66.482 150.001,-148.741" style="fill:#17a085;fill-rule:nonzero;"/></svg>

After

Width:  |  Height:  |  Size: 2.7 KiB

147
docs/assets/svg/echomtg.svg Normal file
View File

@ -0,0 +1,147 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 25.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 432.19 119.34" style="enable-background:new 0 0 432.19 119.34;" xml:space="preserve">
<style type="text/css">
.Arched_x0020_Green{fill:url(#SVGID_1_);stroke:#FFFFFF;stroke-width:0.25;stroke-miterlimit:1;}
.st0{fill:#6F757F;}
.st1{fill:#36363F;}
.st2{fill:#414042;}
.st3{fill:url(#SVGID_2_);}
.st4{fill:url(#SVGID_3_);}
.st5{fill:url(#SVGID_4_);}
.st6{fill:#FFF1C2;}
.st7{fill:#698F3D;}
.st8{fill:#25262D;}
.st9{fill:#9E2827;}
.st10{fill:#261617;}
.st11{fill:#287CA8;}
.st12{fill:#00A651;}
.st13{fill:#BE1E2D;}
.st14{fill:#58595B;}
.st15{fill:#44C8F5;}
.st16{fill:#FFF685;}
.st17{fill:#FEE499;}
.st18{fill:#FFFFFF;}
.st19{fill:#FFF9AE;}
.st20{fill:#1C75BC;}
.st21{fill:#006838;}
.st22{fill:#C85248;}
.st23{fill:#4C525F;}
.st24{fill:url(#SVGID_5_);}
.st25{filter:url(#Adobe_OpacityMaskFilter);}
.st26{opacity:0.75;mask:url(#SVGID_6_);}
.st27{fill:url(#SVGID_7_);}
.st28{filter:url(#Adobe_OpacityMaskFilter_1_);}
.st29{opacity:0.75;mask:url(#SVGID_8_);}
.st30{fill:url(#SVGID_9_);}
.st31{filter:url(#Adobe_OpacityMaskFilter_2_);}
.st32{opacity:0.75;mask:url(#SVGID_10_);}
.st33{fill:url(#SVGID_11_);}
.st34{fill:url(#SVGID_12_);}
.st35{filter:url(#Adobe_OpacityMaskFilter_3_);}
.st36{opacity:0.75;mask:url(#SVGID_13_);}
.st37{fill:url(#SVGID_14_);}
.st38{fill:url(#SVGID_15_);}
.st39{filter:url(#Adobe_OpacityMaskFilter_4_);}
.st40{opacity:0.75;mask:url(#SVGID_16_);}
.st41{fill:url(#SVGID_17_);}
.st42{fill:url(#SVGID_18_);}
.st43{filter:url(#Adobe_OpacityMaskFilter_5_);}
.st44{opacity:0.75;mask:url(#SVGID_19_);}
.st45{fill:url(#SVGID_20_);}
.st46{fill:url(#SVGID_21_);}
.st47{filter:url(#Adobe_OpacityMaskFilter_6_);}
.st48{opacity:0.75;mask:url(#SVGID_22_);}
.st49{fill:url(#SVGID_23_);}
.st50{filter:url(#Adobe_OpacityMaskFilter_7_);}
.st51{opacity:0.75;mask:url(#SVGID_24_);}
.st52{fill:url(#SVGID_25_);}
.st53{filter:url(#Adobe_OpacityMaskFilter_8_);}
.st54{opacity:0.75;mask:url(#SVGID_26_);}
.st55{fill:url(#SVGID_27_);}
.st56{filter:url(#Adobe_OpacityMaskFilter_9_);}
.st57{opacity:0.75;mask:url(#SVGID_28_);}
.st58{fill:url(#SVGID_29_);}
.st59{filter:url(#Adobe_OpacityMaskFilter_10_);}
.st60{opacity:0.75;mask:url(#SVGID_30_);}
.st61{fill:url(#SVGID_31_);}
.st62{filter:url(#Adobe_OpacityMaskFilter_11_);}
.st63{opacity:0.75;mask:url(#SVGID_32_);}
.st64{fill:url(#SVGID_33_);}
.st65{fill:url(#SVGID_34_);}
.st66{filter:url(#Adobe_OpacityMaskFilter_12_);}
.st67{opacity:0.75;mask:url(#SVGID_35_);}
.st68{fill:url(#SVGID_36_);}
.st69{fill:url(#SVGID_37_);}
.st70{filter:url(#Adobe_OpacityMaskFilter_13_);}
.st71{opacity:0.75;mask:url(#SVGID_38_);}
.st72{stroke:#FFFFFF;stroke-width:0.75;stroke-miterlimit:10;}
.st73{fill:#6F7375;}
.st74{fill:#6D6E71;}
.st75{fill:none;stroke:#414042;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;}
.st76{fill:#2E2E3A;}
.st77{fill:#1169B4;}
.st78{fill:#73BF44;}
.st79{fill:#D72252;}
.st80{fill:#A9489B;}
.st81{fill:#0C8BCC;}
.st82{fill:#EBE728;}
</style>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="-489.8315" y1="2225.9177" x2="-489.1244" y2="2225.2107">
<stop offset="0" style="stop-color:#20AC4B"/>
<stop offset="0.9831" style="stop-color:#19361A"/>
</linearGradient>
<g>
<g>
<path class="st18" d="M17.88,56.46c-0.24,1.78-0.48,3.45-0.48,4.99c0,12.36,8.68,20.68,18.06,20.68c5.94,0,10.58-2.38,15.09-7.73
l1.31,1.43c-4.99,6.3-12.48,12.24-21.15,12.24c-11.65,0-20.68-10.58-20.68-24.36c0-12.6,8.44-25.43,22.94-25.43
c16.04,0,15.69,11.53,19.61,15.45v2.73H17.88z M42.6,53.37c-1.31-7.72-6.06-12.83-11.77-12.83c-3.92,0-9.86,1.78-12.6,12.83H42.6z
"/>
<path class="st18" d="M105.24,75.72c-4.99,7.96-11.53,12.36-21.04,12.36c-14.26,0-19.97-13.55-19.97-22.94
c0-14.86,12.24-26.86,27.33-26.86c7.49,0,13.31,2.97,13.31,6.77c0,2.02-1.55,3.56-3.45,3.56c-5.82,0-7.25-7.25-13.91-7.25
c-8.2,0-15.33,9.75-15.33,21.15c0,11.88,7.13,20.68,16.76,20.68c5.7,0,10.22-2.61,14.5-8.56L105.24,75.72z"/>
<path class="st18" d="M128.54,77.26c0,5.59,1.55,7.13,7.72,7.13v2.26h-23.77v-2.26c6.54-0.36,8.08-2.61,8.08-9.15V18.32
c0-2.62-0.48-3.57-2.97-3.92l-5.11-0.71v-2.02l14.14-4.87h1.9v38.98c7.84-4.63,13.55-7.49,19.61-7.49
c9.15,0,13.19,5.7,13.19,17.71c0,10.81-0.24,17.47-0.59,23.89c0.24,3.21,2.02,4.52,9.03,4.52v2.26h-25.67v-2.26
c3.09,0,5.35-0.59,6.66-1.9c2.14-2.14,2.61-7.25,2.61-24.96c0-12.72-6.89-14.38-10.82-14.38c-3.92,0-8.2,1.9-14.02,5.59V77.26z"/>
<path class="st18" d="M251.68,77.03c0,6.18,1.66,7.37,8.32,7.37v2.26h-24.72v-2.26c6.89,0,8.44-3.09,8.44-9.15V51.95
c0-4.64-0.71-5.7-3.45-6.06l-4.64-0.59v-2.02l14.26-4.99h1.78v9.51c8.56-6.06,16.4-9.51,21.16-9.51c5.82,0,10.1,3.68,11.29,9.51
c7.96-4.99,15.21-9.51,21.04-9.51c8.56,0,11.88,6.54,11.88,17.95c0,7.61,0,15.57-0.36,22.82c0,2.5,1.43,5.35,6.3,5.35h3.8v2.26
h-26.74v-2.26h1.07c3.45,0,4.99-0.59,6.06-1.66c1.78-1.78,1.9-8.68,1.9-16.88v-9.27c0-9.15-3.09-13.55-8.91-13.55
c-3.68,0-8.44,1.78-15.81,6.66v27.34c0,5.94,1.43,7.37,7.37,7.37v2.26h-24.36v-2.26c6.66,0,9.03-2.38,9.03-9.15V53.26
c0-7.49-4.63-10.22-8.79-10.22c-3.33,0-7.84,1.55-15.93,6.89V77.03z"/>
<path class="st18" d="M360.79,39.59l-1.9,5.23h-15.09v27.69c0,7.49,5.35,9.98,7.84,9.98c2.61,0,4.99-2.02,7.25-5.94l1.9,1.78
c-2.85,6.18-7.49,9.75-12.95,9.75c-7.01,0-12-5.82-12-13.79V44.82h-5.47v-1.9c4.64-2.26,8.68-7.73,11.41-15.09h2.02v11.77H360.79z
"/>
<path class="st18" d="M422.47,49.33c-1.78-0.12-7.37-0.59-11.88-1.43c0.71,1.31,2.02,3.8,2.02,7.61c0,8.79-7.61,17.23-20.8,17.23
c-2.26,0-3.33-0.24-5.47-0.95c-1.9,2.02-7.25,3.33-7.25,6.06c0,2.97,5.11,4.16,17,4.28c13.43,0.12,18.06,0.71,21.63,4.28
c2.85,2.85,3.57,5.82,3.57,8.32c0,7.73-10.46,19.61-32.45,19.61c-12.36,0-18.3-5.47-18.3-11.29c0-6.89,7.25-7.96,12.72-14.62
c-6.42-0.59-11.29-4.64-11.29-8.44c0-5.47,7.96-5.7,12.12-8.79c-7.25-2.85-11.41-7.96-11.41-14.74c0-10.22,9.15-18.18,20.92-18.18
c5.47,0,10.1,1.66,13.31,4.75c5.35,0,10.34-0.59,15.57-1.19V49.33z M395.5,111.02c10.1,0,19.61-6.66,19.61-14.14
c0-4.4-3.68-6.66-7.96-7.01c-3.09-0.36-18.06-0.47-21.51-0.95c-3.33,3.92-7.72,5.58-7.72,10.22
C377.91,104.72,385.75,111.02,395.5,111.02z M392.17,40.54c-4.52,0-11.53,2.49-11.53,13.55c0,7.01,3.57,16.4,12.6,16.4
c6.89,0,11.41-5.7,11.41-13.9C404.65,46.36,399.42,40.54,392.17,40.54z"/>
</g>
<g>
<path class="st12" d="M214.09,44.71c11.56,1.34,22.03,18.79,16.75,30.96c0.62-7.28-1.26-14.16-6.99-19.48
c-2.36-2.19-7.57-4.14-10.38-7.6C212.39,47.26,212.12,44.74,214.09,44.71z"/>
</g>
<g>
<path class="st13" d="M189.09,44.75c5.68-10.16,25.8-13.13,35.02-3.58c-6.48-3.37-13.56-4.27-20.67-1.02
c-2.93,1.34-6.73,5.4-11,6.67C190.8,47.3,188.36,46.58,189.09,44.75z"/>
</g>
<g>
<path class="st73" d="M179.62,69.79c-8.03-8.43-4.9-28.53,6.95-34.51c-5.13,5.19-8.1,11.69-7.1,19.45
c0.41,3.2,3.17,8.02,3.11,12.48C182.57,68.91,181.16,71.03,179.62,69.79z"/>
</g>
<g>
<path class="st15" d="M203.8,86.06c-10.04,5.9-28.9-1.71-32.03-14.61c3.89,6.18,9.54,10.54,17.32,11.33
c3.21,0.33,8.53-1.26,12.86-0.19C203.61,82.99,205.36,84.85,203.8,86.06z"/>
</g>
<g>
<path class="st17" d="M224.04,67.98c2.89,11.28-9.64,27.29-22.9,26.73c7.02-2.03,12.77-6.25,15.68-13.51
c1.2-2.99,1.15-8.55,3.37-12.41C221.05,67.31,223.31,66.15,224.04,67.98z"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 7.3 KiB

View File

@ -0,0 +1,31 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="200" height="70" viewBox="0, 0, 200, 70">
<g id="Background">
<rect x="0" y="0" width="200" height="70" fill="#000000" fill-opacity="0"/>
</g>
<g id="Layer_1">
<path d="M12.845,44.843 L13.182,45.146 z M13.651,45.558 L13.273,45.226 z" fill="#626161"/>
<path d="M12.896,68.994 L12.93,69.034 L12.93,69.034 z" fill="#626161"/>
<g>
<path d="M49.199,31.01 L43.317,29.375 L43.317,29.015 C43.314,28.345 42.77,27.803 42.1,27.803 L30.41,27.803 C29.741,27.803 29.198,28.346 29.198,29.015 L29.198,29.381 L23.317,31.01 C23.006,31.096 22.743,31.301 22.584,31.581 C22.426,31.861 22.385,32.192 22.471,32.502 L27.204,49.582 C27.348,50.097 27.812,50.459 28.347,50.474 C28.457,50.472 28.566,50.457 28.673,50.428 L36.281,48.307 L43.843,50.399 C43.949,50.429 44.059,50.444 44.169,50.445 C44.37,50.443 44.568,50.388 44.741,50.285 C45.021,50.127 45.227,49.864 45.312,49.553 L50.045,32.473 C50.209,31.837 49.833,31.186 49.199,31.01 z M30.079,28.987 C30.079,28.803 30.227,28.655 30.41,28.655 L42.1,28.655 C42.284,28.655 42.434,28.803 42.437,28.987 L42.437,46.707 C42.434,46.891 42.284,47.038 42.1,47.038 L30.41,47.038 C30.227,47.038 30.079,46.89 30.079,46.707 L30.079,28.987 z M28.467,49.565 C28.38,49.588 28.287,49.576 28.21,49.53 C28.133,49.488 28.077,49.415 28.055,49.33 L23.322,32.239 C23.298,32.154 23.308,32.063 23.351,31.986 C23.394,31.908 23.466,31.851 23.551,31.828 L29.198,30.267 L29.198,46.712 C29.198,47.382 29.741,47.924 30.41,47.924 L34.332,47.924 z M49.199,32.239 L44.466,49.302 C44.444,49.388 44.386,49.461 44.306,49.502 C44.231,49.548 44.14,49.56 44.055,49.536 L38.19,47.907 L42.1,47.907 C42.77,47.907 43.314,47.365 43.317,46.695 L43.317,30.261 L48.965,31.828 C49.14,31.88 49.244,32.061 49.199,32.239 z" fill="#FFFFFF"/>
<path d="M49.199,31.01 L43.317,29.375 L43.317,29.015 C43.314,28.345 42.77,27.803 42.1,27.803 L30.41,27.803 C29.741,27.803 29.198,28.346 29.198,29.015 L29.198,29.381 L23.317,31.01 C23.006,31.096 22.743,31.301 22.584,31.581 C22.426,31.861 22.385,32.192 22.471,32.502 L27.204,49.582 C27.348,50.097 27.812,50.459 28.347,50.474 C28.457,50.472 28.566,50.457 28.673,50.428 L36.281,48.307 L43.843,50.399 C43.949,50.429 44.059,50.444 44.169,50.445 C44.37,50.443 44.568,50.388 44.741,50.285 C45.021,50.127 45.227,49.864 45.312,49.553 L50.045,32.473 C50.209,31.837 49.833,31.186 49.199,31.01 z M30.079,28.987 C30.079,28.803 30.227,28.655 30.41,28.655 L42.1,28.655 C42.284,28.655 42.434,28.803 42.437,28.987 L42.437,46.707 C42.434,46.891 42.284,47.038 42.1,47.038 L30.41,47.038 C30.227,47.038 30.079,46.89 30.079,46.707 L30.079,28.987 z M28.467,49.565 C28.38,49.588 28.287,49.576 28.21,49.53 C28.133,49.488 28.077,49.415 28.055,49.33 L23.322,32.239 C23.298,32.154 23.308,32.063 23.351,31.986 C23.394,31.908 23.466,31.851 23.551,31.828 L29.198,30.267 L29.198,46.712 C29.198,47.382 29.741,47.924 30.41,47.924 L34.332,47.924 z M49.199,32.239 L44.466,49.302 C44.444,49.388 44.386,49.461 44.306,49.502 C44.231,49.548 44.14,49.56 44.055,49.536 L38.19,47.907 L42.1,47.907 C42.77,47.907 43.314,47.365 43.317,46.695 L43.317,30.261 L48.965,31.828 C49.14,31.88 49.244,32.061 49.199,32.239 z" fill-opacity="0" stroke="#C2BDBD" stroke-width="0.04" stroke-miterlimit="10"/>
</g>
<path d="M22.876,69.457 L56.413,69.457 L56.619,69.457 C57.058,69.427 57.487,69.312 57.882,69.12 L57.882,69.12 C58.231,68.948 58.548,68.718 58.82,68.44 C60.689,65.993 60.437,57.722 58.197,47.135 C55.138,49.771 51.817,52.389 48.319,54.932 C44.392,57.79 40.448,60.391 36.601,62.678 C32.238,65.343 27.645,67.612 22.876,69.457 z" fill="#EE7A11"/>
<path d="M51.492,20.018 C53.052,23.756 54.521,27.74 55.859,31.879 C57.345,36.452 58.591,41.025 59.563,45.369 C60.743,50.349 61.475,55.424 61.752,60.534 L61.752,60.586 L72.161,28.724 L72.161,28.689 C72.179,28.639 72.194,28.587 72.207,28.535 L72.207,28.501 C72.31,28.045 72.328,27.574 72.258,27.112 C72.196,26.738 72.073,26.376 71.892,26.043 C71.793,25.896 71.68,25.758 71.555,25.631 C70.995,25.084 70.353,24.626 69.652,24.276 L69.326,24.111 C69.109,24.002 68.874,23.894 68.634,23.785 L68.32,23.648 L67.72,23.379 C66.411,22.88 65.075,22.454 63.718,22.104 L63.05,21.939 L62.404,21.779 L61.38,21.55 C60.997,21.464 60.603,21.384 60.203,21.304 L59.483,21.167 L58.339,20.961 L57.076,20.721 C56.202,20.584 55.293,20.452 54.367,20.332 L53.669,20.241 L52.235,20.075 z" fill="#EF8616"/>
<path d="M14.451,69.103 C15.28,69.411 17.383,69.64 22.259,67.874 C26.503,66.244 30.601,64.257 34.509,61.935 C31.079,59.837 27.546,57.493 24.048,54.949 C20.133,52.091 16.446,49.165 13.09,46.221 L13.045,46.181 L12.553,45.741 L12.399,45.609 L12.016,45.266 L11.884,45.146 L11.387,44.695 L11.307,44.62 L10.895,44.243 L10.752,44.112 L10.375,43.763 L10.261,43.66 L9.798,43.22 L9.689,43.117 L9.323,42.768 L9.186,42.637 L8.809,42.271 L8.729,42.197 L8.272,41.762 L8.152,41.648 L7.843,41.299 L7.7,41.191 L7.288,40.779 L7.288,40.779 L6.877,40.356 L6.751,40.23 L6.448,39.916 L6.334,39.796 L6.059,39.504 L5.888,39.321 L5.556,38.967 L5.414,38.818 L5.122,38.504 L5.031,38.401 L4.67,38.001 L4.585,37.904 L4.31,37.589 L4.196,37.469 C4.105,37.355 4.007,37.252 3.916,37.144 L3.847,37.064 L3.516,36.675 L3.43,36.572 L3.184,36.275 L3.127,36.155 L2.841,35.806 L2.841,35.772 L2.538,35.394 L2.453,35.286 L2.355,35.154 L12.799,67.165 C13.085,68.019 13.703,68.722 14.514,69.114 z" fill="#E75412"/>
<path d="M36.184,17.554 C39.893,17.554 43.552,17.68 47.044,17.926 C47.827,17.977 48.622,18.04 49.388,18.109 L50.211,18.183 L50.914,18.252 C51.411,18.297 51.914,18.355 52.406,18.406 L53.858,18.577 L54.573,18.669 C55.51,18.795 56.436,18.926 57.328,19.069 L58.642,19.286 L59.786,19.498 L60.523,19.641 L61.729,19.886 L62.775,20.127 L63.444,20.287 L64.136,20.464 C64.501,20.555 64.862,20.658 65.21,20.755 L38.241,1.109 L38.127,1.029 L38.127,1.029 L38.059,0.983 C37.92,0.895 37.777,0.815 37.63,0.743 L37.63,0.743 L37.55,0.709 L37.487,0.709 L37.304,0.64 L37.253,0.64 L37.03,0.577 L36.972,0.577 L36.91,0.577 L36.732,0.543 L36.504,0.543 L35.932,0.543 L35.732,0.543 L35.652,0.543 L35.652,0.543 L35.509,0.589 L35.463,0.589 L35.343,0.634 L35.303,0.634 L35.138,0.709 L35.138,0.709 L34.989,0.783 L34.932,0.812 L34.795,0.892 L34.749,0.892 L34.566,1.006 L34.52,1.006 L34.366,1.115 L34.309,1.155 L34.137,1.28 L34.103,1.309 L33.897,1.475 L33.846,1.52 L33.68,1.658 L33.623,1.715 C33.548,1.772 33.48,1.841 33.411,1.903 L33.411,1.903 L33.194,2.109 L33.131,2.172 L32.96,2.349 L32.851,2.429 C32.777,2.504 32.697,2.584 32.622,2.669 L32.588,2.704 L32.388,2.927 L32.279,3.001 C32.217,3.07 32.154,3.138 32.097,3.212 L32.039,3.275 L31.799,3.561 L31.742,3.63 L31.554,3.864 L31.479,3.956 L31.279,4.213 L31.233,4.276 L30.988,4.596 L30.919,4.687 L30.73,4.944 L30.53,5.225 L30.422,5.379 L30.422,5.379 L30.164,5.745 L30.084,5.859 L29.896,6.139 L29.822,6.248 C29.736,6.379 29.65,6.505 29.57,6.636 L29.524,6.699 L29.307,7.042 L29.227,7.168 L29.027,7.482 L28.958,7.591 L28.701,8.014 L28.638,8.117 L28.433,8.454 L28.347,8.597 C28.278,8.717 28.21,8.837 28.135,8.957 L28.084,9.054 C28.032,9.134 27.987,9.22 27.935,9.306 L27.678,9.752 C27.638,9.832 27.592,9.912 27.546,9.992 L27.461,10.14 L27.221,10.575 L27.221,10.626 C27.135,10.786 27.043,10.946 26.958,11.112 L26.872,11.266 C26.809,11.392 26.746,11.512 26.678,11.632 L26.598,11.792 C26.506,11.958 26.42,12.124 26.335,12.295 L26.289,12.387 C26.209,12.53 26.135,12.678 26.06,12.821 L25.975,12.998 L25.774,13.393 L25.694,13.542 C25.609,13.719 25.523,13.896 25.432,14.073 L25.363,14.216 C25.294,14.353 25.231,14.496 25.163,14.633 L25.071,14.822 L24.866,15.256 L24.797,15.394 C24.711,15.576 24.62,15.765 24.534,15.965 L24.454,16.137 L24.26,16.554 L24.168,16.754 C24.094,16.92 24.02,17.086 23.94,17.251 L23.9,17.343 L23.637,17.914 L23.591,18.023 L26.449,17.817 L29.141,17.674 L32.788,17.554 L32.8,18.435 L32.8,17.583 L33.514,17.583 L36.201,17.583 z" fill="#F3981E"/>
<path d="M0.086,27.066 C0.086,27.1 0.086,27.14 0.086,27.18 L0.086,27.226 C0.089,27.268 0.089,27.31 0.086,27.352 L0.086,27.398 C0.086,27.455 0.086,27.512 0.086,27.575 L0.086,27.575 C0.086,27.626 0.086,27.683 0.086,27.735 L0.086,27.798 L0.12,27.952 L0.12,28.003 L0.172,28.221 L0.172,28.272 L0.223,28.449 L0.223,28.518 L0.292,28.712 L0.292,28.758 C0.326,28.838 0.355,28.924 0.389,29.004 L0.389,29.072 L0.475,29.267 L0.509,29.347 C0.543,29.427 0.578,29.507 0.618,29.587 L0.618,29.587 L0.755,29.867 L0.795,29.947 L0.903,30.158 L0.949,30.244 C1.001,30.341 1.052,30.439 1.109,30.536 L1.109,30.57 L1.264,30.833 L1.315,30.93 L1.458,31.164 L1.504,31.244 L1.704,31.553 L1.744,31.627 L1.915,31.885 L1.978,31.982 C2.035,32.073 2.098,32.159 2.155,32.245 L2.207,32.319 L2.435,32.651 L2.498,32.742 L2.687,32.999 L2.761,33.108 L2.99,33.411 L3.024,33.457 L3.287,33.811 L3.367,33.914 C3.441,34 3.51,34.091 3.579,34.183 L3.664,34.291 Q3.802,34.474 3.956,34.651 L3.956,34.686 L4.236,35.029 L4.327,35.143 L4.568,35.423 L4.842,35.583 L5.162,35.966 L5.231,36.04 L5.499,36.355 L5.608,36.475 L5.877,36.783 L5.957,36.875 L6.311,37.264 L6.402,37.366 L6.688,37.675 L6.803,37.795 C6.905,37.915 7.014,38.03 7.123,38.144 L7.3,38.327 C7.386,38.424 7.477,38.515 7.569,38.613 L7.677,38.727 L7.974,39.036 L8.094,39.161 L8.5,39.573 L8.5,39.573 L8.9,39.973 L9.026,40.099 L9.346,40.419 L9.466,40.539 L9.901,40.962 L9.975,41.031 L10.347,41.396 L10.484,41.522 L10.838,41.865 L10.947,41.968 L11.41,42.397 L11.518,42.5 L11.89,42.843 L12.033,42.98 L12.433,43.351 L12.519,43.426 L13.005,43.866 L13.102,43.952 L13.136,43.803 L13.216,43.477 C13.256,43.323 13.29,43.168 13.33,43.014 L13.422,42.62 L13.525,42.22 L13.61,41.871 C13.651,41.722 13.685,41.568 13.725,41.414 L13.816,41.065 L13.936,40.608 L14.028,40.247 L14.148,39.796 L14.245,39.424 C14.285,39.276 14.331,39.127 14.371,38.973 L14.474,38.601 C14.514,38.447 14.554,38.298 14.599,38.15 L14.702,37.772 L14.834,37.315 L14.937,36.943 L15.074,36.475 L15.182,36.103 L15.32,35.646 L15.434,35.263 C15.474,35.114 15.52,34.971 15.565,34.823 L15.703,34.44 C15.748,34.297 15.794,34.154 15.834,34.017 L15.966,33.594 C16.023,33.405 16.086,33.217 16.143,33.022 L16.234,32.736 L16.509,31.879 L16.989,30.439 L17.332,29.427 C17.555,28.764 17.8,28.066 18.052,27.357 L18.624,25.786 C18.698,25.574 18.778,25.363 18.858,25.145 L19.487,23.499 L19.692,22.962 L20.081,21.979 C20.138,21.83 20.201,21.681 20.264,21.527 L20.373,21.253 L20.55,20.818 L20.704,20.447 L20.847,20.092 L21.419,18.698 L21.682,18.097 L21.767,17.892 C21.836,17.749 21.899,17.6 21.962,17.457 L22.053,17.257 C22.139,17.057 22.23,16.857 22.316,16.685 L22.316,16.685 L22.351,16.611 C22.431,16.44 22.505,16.268 22.585,16.102 L22.676,15.902 L22.871,15.474 L22.956,15.296 C23.042,15.108 23.134,14.919 23.219,14.725 L23.288,14.582 C23.357,14.433 23.431,14.29 23.499,14.142 L23.591,13.947 L23.797,13.53 L23.871,13.381 C23.957,13.199 24.048,13.021 24.134,12.844 L24.214,12.684 C24.283,12.553 24.351,12.415 24.414,12.284 L24.505,12.107 C24.586,11.958 24.66,11.81 24.734,11.661 L24.786,11.569 C24.871,11.398 24.963,11.226 25.054,11.055 L25.14,10.895 L25.334,10.523 L25.42,10.363 C25.512,10.198 25.603,10.032 25.689,9.866 L25.723,9.809 L25.963,9.369 L26.055,9.214 C26.123,9.094 26.186,8.974 26.255,8.86 L26.335,8.723 C26.42,8.563 26.512,8.408 26.598,8.254 L26.678,8.145 C26.746,8.02 26.821,7.9 26.889,7.78 L26.981,7.631 L27.186,7.282 L27.249,7.179 L27.518,6.745 L27.592,6.631 C27.661,6.522 27.729,6.413 27.792,6.305 L27.878,6.168 C27.958,6.053 28.032,5.933 28.107,5.819 L28.152,5.75 C28.238,5.619 28.324,5.482 28.415,5.35 L28.49,5.236 L28.49,5.202 L20.007,11.364 L1.412,24.9 L1.275,25.002 L1.224,25.048 C1.194,25.07 1.167,25.095 1.144,25.122 L1.081,25.174 L1.001,25.248 L0.961,25.294 L0.961,25.294 L0.892,25.368 L0.841,25.425 C0.821,25.453 0.8,25.48 0.778,25.505 L0.732,25.563 L0.669,25.643 L0.629,25.706 L0.572,25.791 L0.532,25.854 L0.48,25.934 L0.423,26.043 L0.372,26.14 L0.372,26.191 C0.372,26.191 0.372,26.254 0.326,26.283 L0.326,26.334 C0.304,26.367 0.285,26.401 0.269,26.437 L0.269,26.494 C0.269,26.494 0.269,26.552 0.269,26.586 L0.269,26.643 C0.267,26.673 0.267,26.704 0.269,26.734 L0.269,26.786 C0.269,26.832 0.269,26.866 0.269,26.894 L0.269,26.952 C0.202,26.979 0.14,27.017 0.086,27.066 z" fill="#F7A808"/>
<path d="M87.574,47.181 L83.464,47.181 L83.464,45.906 L93.073,45.906 L93.073,47.181 L88.969,47.181 L88.969,58.139 L87.574,58.139 z" fill="#ED7A05"/>
<path d="M100.904,45.906 L106.163,45.906 C107.438,45.84 108.687,46.279 109.639,47.13 C110.253,47.78 110.584,48.648 110.559,49.542 L110.559,49.576 C110.559,51.605 109.158,52.794 107.238,53.143 L110.993,58.139 L109.278,58.139 L105.729,53.383 L102.236,53.383 L102.236,58.139 L100.859,58.139 z M106.049,52.143 C107.884,52.143 109.193,51.2 109.193,49.628 L109.193,49.593 C109.193,48.09 108.049,47.181 106.066,47.181 L102.293,47.181 L102.293,52.16 z" fill="#ED7A05"/>
<path d="M123.3,45.821 L124.592,45.821 L130.165,58.139 L128.679,58.139 L127.25,54.904 L120.591,54.904 L119.133,58.139 L117.716,58.139 z M126.73,53.646 L123.952,47.427 L121.134,53.646 z" fill="#ED7A05"/>
<path d="M137.819,45.906 L142.066,45.906 C145.908,45.906 148.566,48.547 148.566,51.988 L148.566,52.023 C148.566,55.452 145.908,58.139 142.066,58.139 L137.819,58.139 z M139.197,47.181 L139.197,56.864 L142.055,56.864 C145.147,56.864 147.119,54.766 147.119,52.057 L147.119,52.023 C147.119,49.313 145.147,47.181 142.055,47.181 z" fill="#ED7A05"/>
<path d="M156.723,45.906 L165.566,45.906 L165.566,47.164 L158.1,47.164 L158.1,51.343 L164.777,51.343 L164.777,52.6 L158.1,52.6 L158.1,56.881 L165.651,56.881 L165.651,58.139 L156.723,58.139 z" fill="#ED7A05"/>
<path d="M173.671,45.906 L178.93,45.906 C180.205,45.838 181.454,46.278 182.405,47.13 C183.028,47.777 183.367,48.644 183.349,49.542 L183.349,49.576 C183.349,51.605 181.954,52.794 180.027,53.143 L183.783,58.139 L182.068,58.139 L178.524,53.383 L175.026,53.383 L175.026,58.139 L173.648,58.139 z M178.816,52.143 C180.65,52.143 181.965,51.2 181.965,49.628 L181.965,49.593 C181.965,48.09 180.822,47.181 178.833,47.181 L175.06,47.181 L175.06,52.16 z" fill="#ED7A05"/>
<path d="M190.739,56.356 L191.597,55.344 C192.706,56.456 194.216,57.074 195.787,57.059 C197.433,57.059 198.513,56.19 198.513,54.984 L198.513,54.949 C198.513,53.806 197.902,53.166 195.335,52.623 C192.523,52.011 191.225,51.102 191.225,49.096 L191.225,49.056 C191.225,47.135 192.94,45.724 195.227,45.724 C196.796,45.677 198.327,46.212 199.525,47.227 L198.725,48.29 C197.746,47.436 196.491,46.965 195.192,46.964 C193.603,46.964 192.592,47.838 192.592,48.936 L192.592,48.97 C192.592,50.114 193.22,50.771 195.913,51.348 C198.605,51.926 199.914,52.937 199.914,54.806 L199.914,54.841 C199.914,56.939 198.165,58.299 195.735,58.299 C193.881,58.322 192.09,57.626 190.739,56.356 z" fill="#ED7A05"/>
<path d="M83.464,17.966 L91.541,17.966 L96.503,26.106 L101.47,17.966 L109.541,17.966 L109.541,41.133 L101.83,41.133 L101.83,29.65 L96.503,37.87 L96.371,37.87 L91.044,29.633 L91.044,41.133 L83.464,41.133 z" fill="#B3B3B3"/>
<path d="M123.575,17.8 L131.251,17.8 L141.015,41.133 L132.606,41.133 L131.383,38.018 L123.277,38.018 L122.083,41.133 L113.811,41.133 z M129.462,32.525 L127.347,26.9 L125.227,32.525 z" fill="#B3B3B3"/>
<path d="M145.279,17.966 L152.527,17.966 L160.77,28.192 L160.77,17.966 L168.446,17.966 L168.446,41.133 L161.587,41.133 L152.961,30.439 L152.961,41.128 L145.279,41.128 z" fill="#B3B3B3"/>
<path d="M182.48,17.8 L190.156,17.8 L199.914,41.133 L191.511,41.133 L190.288,38.018 L182.177,38.018 L180.988,41.133 L172.716,41.133 z M188.367,32.525 L186.252,26.9 L184.132,32.525 z" fill="#B3B3B3"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 15 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 9.7 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" version="1.0" width="80" viewBox="0 0 5000 3500" fill="#97d1fb"><g><path d="M1950 3374c-177-47-300-179-361-384-20-69-22-105-29-465-9-431-13-464-73-532-40-45-94-70-174-79l-63-7v-424l64-5c83-7 150-39 182-88 52-78 56-107 64-530 8-435 10-450 76-588 23-47 55-93 92-130C1828 41 1936 0 2097 0h93v377l-51 6c-87 11-147 66-181 169-6 19-14 183-18 393-9 385-16 445-64 552-14 30-39 72-56 93-34 43-110 95-155 106l-29 7 37 13c84 29 164 109 206 206 47 109 54 176 61 548 4 197 11 369 17 386 32 95 73 131 168 147l65 11v376l-92-1c-51 0-118-7-148-15zM105 3168.756zM2720 3202v-188l65-11c95-16 136-52 168-147 6-17 13-189 17-386 7-372 14-439 61-548 42-97 122-177 206-206l37-13-29-7c-45-11-121-63-155-106-17-21-42-63-56-93-48-107-55-167-64-552-4-210-12-374-18-393-34-103-94-158-181-169l-51-6V0h93c161 0 269 41 369 142 37 37 69 83 92 130 66 138 68 153 76 588 8 423 12 452 64 530 32 49 99 81 182 88l64 5v424l-62 7c-81 9-135 34-175 79-60 68-64 101-73 532-7 360-9 396-29 465-34 115-85 202-156 269-100 93-203 131-357 131h-88v-188z"/><path d="M690 1690V350h570v330H980v2030h280v320H690V1690zM3650 2870v-160h280V680h-280V350h570v2680h-570v-160zM321 2496l-105-71-107-342L1 1741l108-395c59-218 110-398 112-400s49-33 104-70l100-66 3 440c1 242 1 637 0 879l-3 439-104-72zM4480 1689V808l29 19c187 120 181 115 196 168 8 28 57 207 109 398l95 348-108 342-107 342-107 73-107 73v-882z"/></g></svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="480" height="480"><path fill-opacity="0" d="M0 0h480v480H0z"/><path d="M76.084 233.472c32.743.6 66.086 9.848 90.981 31.943 38.842 32.943 56.938 85.032 59.388 134.772-41.791 2.449-81.733-20.196-106.478-52.889-24.995-32.893-38.142-73.285-43.891-113.826zm238.65 29.993c24.395-21.245 57.239-29.043 88.932-29.293-7.549 55.138-30.794 112.026-77.384 145.319-20.696 15.847-47.24 21.446-72.885 20.546 2-50.889 20.246-104.078 61.337-136.572zM0 326.652c27.944-5.799 58.338-8.798 85.932-.5 15.647 16.247 26.045 37.043 43.191 51.99 16.797 16.746 39.642 24.444 61.137 33.243-51.089 2.049-105.328-6.299-147.519-37.143C25.095 361.895 11.498 344.749 0 326.652zm396.517-1.199c27.245-7.149 55.939-4.15 83.483-.5-13.047 29.693-40.492 50.339-68.486 65.036-38.292 16.997-80.883 24.245-122.724 22.295 25.345-11.547 52.889-21.595 71.185-43.69 13.197-13.498 20.696-32.594 36.542-43.141zM240.411 67.406c.468.762.529 1.643.711 2.479.75 4.43 1.038 8.908 1.421 13.372l2.401 35.691c1.421 19.446 3.038 38.91 6.225 58.204 1.558 9.105 3.403 18.213 6.553 27.006l12.486.949c2.058-5.379 3.069-11.012 4.128-16.599.939-5.221 1.732-10.465 2.466-15.713 2.828-20.498 4.799-41.078 6.936-61.639.486-4.236.804-8.497 1.59-12.7.394.909.484 1.888.66 2.841.459 2.877.806 5.766 1.157 8.655l6.991 57.641c1.288 8.797 2.705 17.584 4.594 26.299 1.275 5.692 2.635 11.404 4.932 16.855 3.865 1.043 7.7 2.188 11.416 3.595 1.164-2.36 2.04-4.825 2.864-7.293 2.077-6.414 3.516-12.974 4.775-19.545 2.709-14.178 4.308-28.494 6.425-42.744.559-3.25.932-6.557 2.092-9.694.57 1.344.734 2.784 1 4.189 1.027 6.436 1.723 12.908 2.455 19.374l2.128 21.073.09-.323c-.011.989.101 1.972.214 2.955l4.608 50.844c-10.891 3.646-21.19 8.651-30.606 14.706-12.598 8.107-23.565 18.13-32.655 29.309-9.476 11.662-16.98 24.56-22.363 38.106-6.77 17.051-10.589 34.923-12.65 52.876-.666 5.513-1.076 11.045-1.709 16.558-.23 1.472-.27 3.025-1.072 4.365h-.396c-.735-.991-.78-2.215-.987-3.346-.486-3.658-.756-7.335-1.137-11.002-.957-9.885-2.317-19.748-4.403-29.5-3.423-15.951-8.598-31.704-16.674-46.322-9.236-16.766-21.947-32.137-37.875-44.402-11.808-9.102-25.384-16.435-40.031-21.356l6.637-70.769c.842-7.656 1.642-15.32 2.831-22.94.247-1.39.441-2.798.903-4.145l.245.037c.962 2.756 1.343 5.641 1.833 8.484l4.739 33.101c1.416 8.825 3.013 17.644 5.445 26.301 1.095 3.764 2.288 7.526 4.025 11.105 3.716-1.417 7.56-2.548 11.422-3.605 1.442-3.397 2.48-6.914 3.408-10.445 1.407-5.477 2.52-11.008 3.515-16.555 4.04-22.895 6.403-45.985 9.033-69.032l1.556-12.425c.226-1.31.349-2.646.831-3.908.521 2.885.804 5.798 1.138 8.703l6.436 58.702c1.212 9.283 2.504 18.566 4.369 27.768.838 3.884 1.664 7.796 3.166 11.53l12.475-.913c3.117-8.667 4.943-17.645 6.492-26.622 1.696-10.048 2.903-20.157 3.923-30.276 1.721-17.256 2.816-34.554 3.928-51.847.541-7.656.95-15.326 1.874-22.956.239-1.697.437-3.416 1.016-5.057z"/></svg>

After

Width:  |  Height:  |  Size: 2.8 KiB

30
docs/assets/svg/scg.svg Normal file
View File

@ -0,0 +1,30 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="400" height="50" viewBox="0, 0, 400, 50">
<g id="Background">
<rect x="0" y="0" width="400" height="50" fill="#000000" fill-opacity="0"/>
</g>
<g id="#aacce3ff">
<path d="M25.285,2.069 C25.564,1.478 25.928,0.935 26.316,0.407 C28.557,4.838 30.371,9.464 32.349,14.011 L32.206,14.223 C32.067,14.429 31.782,14.848 31.639,15.057 C29.919,10.823 28.184,6.592 26.219,2.467 C25.803,3.261 25.43,4.077 25.084,4.905 C23.189,9.149 21.348,13.419 19.801,17.805 C19.406,18.278 18.824,18.494 18.217,18.479 C12.933,18.827 7.653,19.173 2.393,19.801 C5.481,23.21 9.197,25.968 12.66,28.973 C13.728,29.826 14.759,31.012 16.24,30.997 C16.106,31.066 15.839,31.212 15.703,31.285 C15.399,31.27 15.096,31.257 14.793,31.245 C14.526,31.894 14.226,32.525 13.944,33.165 C14.016,32.625 14.08,32.082 14.15,31.543 C10.689,28.488 6.985,25.71 3.637,22.525 C2.445,21.366 1.147,20.326 -0,19.122 C1.811,18.97 3.603,18.658 5.408,18.457 C7.355,18.403 9.275,18.048 11.211,17.878 C13.668,17.793 16.124,17.763 18.584,17.729 C19.728,15.555 20.398,13.177 21.402,10.938 C22.576,7.929 23.947,5.005 25.285,2.069 z" fill="#AACCE3"/>
<path d="M25.084,4.905 C25.43,4.077 25.803,3.261 26.219,2.467 C28.184,6.592 29.919,10.823 31.639,15.057 C32.07,16.17 32.473,17.296 32.877,18.421 C36.359,18.418 39.807,18.961 43.283,19.064 C45.47,19.264 47.645,19.598 49.841,19.707 C49.781,19.774 49.665,19.913 49.608,19.98 C48.519,20.344 47.421,20.684 46.344,21.075 C37.948,23.899 29.489,26.541 21.078,29.322 C19.458,29.859 17.799,30.287 16.24,30.997 C14.759,31.012 13.728,29.826 12.66,28.973 C9.197,25.968 5.481,23.21 2.393,19.801 C7.653,19.173 12.933,18.827 18.217,18.479 C18.824,18.494 19.406,18.278 19.801,17.805 C21.135,18.673 22.761,18.4 24.259,18.403 C26.425,18.327 28.618,18.615 30.75,18.112 C29.228,17.924 27.699,17.82 26.173,17.687 C26.116,13.128 26.273,8.566 26.107,4.01 C25.761,4.305 25.415,4.596 25.084,4.905 z" fill="#215382"/>
<path d="M31.515,35.31 C33.322,33.93 35.103,32.489 37.081,31.355 C38.1,34.627 38.913,37.961 39.683,41.3 C40.162,43.518 40.76,45.723 40.942,47.995 C40.669,47.855 40.396,47.715 40.126,47.576 C39.977,46.739 39.683,45.929 39.143,45.265 C37.863,43.602 36.668,41.88 35.406,40.202 C34.141,38.543 33.11,36.687 31.515,35.31 z" fill="#215382"/>
<path d="M25.084,4.905 C25.415,4.596 25.761,4.305 26.107,4.01 C26.273,8.566 26.116,13.128 26.173,17.687 C27.699,17.82 29.228,17.924 30.75,18.112 C28.618,18.615 26.425,18.327 24.259,18.403 C22.761,18.4 21.135,18.673 19.801,17.805 C21.348,13.419 23.189,9.149 25.084,4.905 z" fill="#112A45"/>
<path d="M26.668,38.862 C28.266,37.654 29.968,36.587 31.515,35.31 C33.11,36.687 34.141,38.543 35.406,40.202 C36.668,41.88 37.863,43.603 39.143,45.265 C39.683,45.929 39.977,46.739 40.126,47.576 C35.558,45.14 31.251,42.256 26.877,39.502 C26.825,39.341 26.719,39.019 26.668,38.862 z" fill="#112A45"/>
<path d="M66.048,13.389 C67.597,12.713 69.323,12.943 70.967,12.898 C73.982,12.761 76.846,14.211 79.108,16.104 C77.953,18.084 76.624,19.956 75.438,21.915 C73.791,20.863 72.147,19.404 70.045,19.613 C68.601,19.601 66.572,20.487 66.824,22.225 C66.727,23.08 66.873,24.066 67.782,24.409 C70.703,25.534 73.97,25.792 76.67,27.484 C78.526,28.758 80.079,30.62 80.555,32.865 C81.028,35.1 80.986,37.573 79.855,39.614 C78.523,41.995 76.081,43.7 73.412,44.221 C71.795,44.364 70.167,44.303 68.547,44.297 C66.415,44.343 64.391,43.478 62.532,42.52 C61.255,41.74 59.857,41.027 58.926,39.823 C59.108,39.195 59.499,38.664 59.842,38.115 C60.776,36.708 61.564,35.198 62.662,33.905 C64.804,36.15 67.81,37.8 70.986,37.588 C71.777,37.591 72.532,37.29 73.2,36.887 C73.967,36.311 74.04,35.225 73.758,34.382 C73.218,33.114 71.726,32.798 70.54,32.446 C67.425,31.658 63.973,30.948 61.768,28.403 C59.799,26.137 59.535,22.931 59.996,20.083 C60.661,16.995 63.111,14.454 66.048,13.389 z" fill="#C1E3F7"/>
<path d="M172.151,13.365 C174.035,12.673 176.073,12.958 178.036,12.901 C181.123,12.743 183.984,14.229 186.477,15.897 C185.482,17.845 184.199,19.631 183.01,21.46 C182.91,21.488 182.71,21.539 182.61,21.563 C181.581,21.139 180.705,20.396 179.625,20.086 C176.558,18.94 172.973,19.883 170.607,22.073 C168.132,24.405 167.128,28.179 168.232,31.409 C169.06,34.124 171.335,36.305 174.02,37.166 C176.546,38.037 179.443,37.642 181.663,36.156 C182.088,35.938 182.74,35.331 183.128,35.919 C184.254,37.715 185.479,39.453 186.486,41.319 C184.002,43.011 181.126,44.479 178.036,44.309 C175.912,44.258 173.698,44.546 171.684,43.718 C167.265,42.286 163.646,38.765 161.929,34.473 C161.517,33.366 161.116,32.225 161.141,31.027 C161.11,29.004 161.038,26.969 161.241,24.955 C162.497,19.525 166.822,14.969 172.151,13.365 z" fill="#C1E3F7"/>
<path d="M260.999,25.546 C262.106,19.322 267.332,14.056 273.569,12.964 C275.598,12.867 277.639,12.843 279.668,12.98 C281.995,13.386 284.154,14.466 286.056,15.843 C285.104,17.924 283.787,19.834 282.416,21.66 C280.712,20.487 278.749,19.461 276.62,19.586 C271.909,19.376 267.596,23.584 267.624,28.285 C267.442,31.788 269.732,35.131 272.847,36.602 C274.576,37.482 276.584,37.327 278.458,37.19 C279.292,37.008 280.399,36.817 280.687,35.871 C280.675,35.407 280.575,34.952 280.49,34.5 C279.847,34.491 279.204,34.479 278.567,34.473 C278.497,32.243 278.537,30.011 278.54,27.778 C281.497,27.766 284.458,27.763 287.415,27.781 C287.439,31.825 287.4,35.871 287.436,39.914 C282.771,44.546 275.122,45.623 269.328,42.55 C265.109,40.402 261.961,36.286 261.029,31.646 C260.866,29.62 260.899,27.575 260.999,25.546 z" fill="#C1E3F7"/>
<path d="M380.573,21.215 C381.538,18.579 383.901,16.61 386.555,15.809 C390.831,14.593 395.748,15.888 398.806,19.134 C397.416,21.084 396.431,23.347 394.744,25.07 C393.631,23.599 392.014,22.255 390.07,22.322 C389.036,22.264 387.768,22.473 387.204,23.438 C387.055,24.257 387.131,25.091 387.176,25.916 C390.079,27.235 393.446,27.351 396.136,29.186 C400.295,31.676 401.22,37.933 398.308,41.704 C397.113,43.293 395.308,44.37 393.403,44.876 C388.984,46.232 384.18,44.667 380.543,42.056 C380.173,41.722 379.524,41.513 379.533,40.933 C379.427,40.315 379.891,39.826 380.167,39.32 C381.11,37.852 381.971,36.323 383.039,34.937 C384.723,36.69 386.928,38.222 389.448,38.225 C390.628,38.219 392.06,38.443 392.873,37.36 C393.076,36.475 393.061,35.21 392.063,34.828 C389.624,33.757 386.861,33.605 384.504,32.307 C382.008,31.042 380.1,28.427 380.127,25.57 C380.142,24.114 379.957,22.586 380.573,21.215 z" fill="#C1E3F7"/>
<path d="M354.979,16.889 C362.759,16.886 370.542,16.862 378.326,16.901 C377.403,18.894 376.035,20.629 374.904,22.501 C374.498,23.019 374.173,23.875 373.409,23.878 C369.584,23.89 365.759,23.884 361.934,23.875 C361.922,24.864 361.928,25.849 361.955,26.838 C365.984,26.944 370.015,26.844 374.043,26.89 C374.125,29.207 374.082,31.524 374.064,33.842 C370.018,33.881 365.974,33.857 361.928,33.857 C361.922,34.861 361.928,35.865 361.962,36.866 C366.008,36.96 370.06,36.851 374.109,36.923 C375.529,39.153 377.039,41.325 378.329,43.633 C376.387,44.039 374.419,43.739 372.468,43.684 C370.548,43.8 368.622,43.954 366.705,43.766 C364.582,43.554 362.456,43.757 360.336,43.836 C358.495,43.648 356.644,44.012 354.821,43.633 C354.703,35.589 354.806,27.542 354.764,19.498 C354.74,18.624 354.809,17.751 354.979,16.889 z" fill="#C1E3F7"/>
<path d="M308.596,17.202 C310.907,16.701 313.288,16.932 315.633,16.886 C315.696,25.819 315.651,34.749 315.657,43.681 C313.397,43.724 311.134,43.633 308.878,43.73 C308.963,42.271 308.945,40.809 308.878,39.35 C305.226,39.365 301.577,39.329 297.928,39.368 C297.934,39.49 297.949,39.726 297.955,39.844 C298.022,41.127 297.776,42.398 297.719,43.681 C295.401,43.697 293.087,43.69 290.773,43.681 C290.636,41.164 291.082,38.671 291.361,36.177 C292.126,31.646 293.824,27.172 296.83,23.641 C299.815,20.186 304.07,17.845 308.596,17.202 M301.798,28.6 C300.943,29.714 300.012,30.927 300,32.398 C302.951,32.371 305.908,32.507 308.857,32.334 C308.99,29.698 308.89,27.056 308.899,24.418 C306.039,24.594 303.591,26.48 301.798,28.6 z" fill="#C1E3F7"/>
<path d="M319.291,21.924 C319.33,20.232 319.136,18.518 319.536,16.853 C325.403,16.868 331.354,19.191 335.279,23.632 C336.677,22.479 337.914,21.124 339.483,20.183 C342.355,18.379 345.692,17.132 349.116,17.147 C349.871,17.126 350.63,17.12 351.391,17.123 C351.382,26.004 351.439,34.885 351.361,43.766 C349.037,44.006 346.72,43.624 344.396,43.654 C344.415,38.161 344.424,32.671 344.393,27.178 C342.131,27.287 340.32,28.889 338.755,30.366 C337.384,31.615 336.477,33.253 335.245,34.618 C333.962,32.434 332.276,30.517 330.332,28.901 C329.188,27.706 327.617,26.959 325.943,27.141 C325.876,32.707 326.03,38.273 325.867,43.839 C323.68,43.933 321.511,43.639 319.327,43.666 C319.242,36.42 319.318,29.171 319.291,21.924 z" fill="#C1E3F7"/>
<path d="M78.917,23.872 C80.288,21.654 81.72,19.48 83.082,17.259 C89.9,17.247 96.722,17.193 103.541,17.287 C102.964,18.879 101.875,20.195 100.999,21.621 C100.429,22.485 99.955,23.447 99.149,24.123 C97.596,24.263 96.03,24.148 94.471,24.178 C94.438,30.76 94.493,37.345 94.447,43.927 C92.127,43.933 89.803,44.006 87.486,43.875 C87.465,37.312 87.565,30.745 87.434,24.184 C85.178,24.181 82.918,24.181 80.661,24.187 C80.064,24.196 79.469,24.096 78.917,23.872 z" fill="#C1E3F7"/>
<path d="M104.693,23.456 C107.887,19.828 112.616,17.772 117.372,17.271 C119.201,17.22 121.036,17.19 122.865,17.25 C123.268,17.581 123.235,18.109 123.241,18.579 C123.226,26.471 123.235,34.363 123.238,42.256 C123.232,42.893 123.114,43.521 123.026,44.148 C120.857,44.233 118.685,44.167 116.517,44.194 C116.592,42.586 116.532,40.976 116.332,39.38 C113.441,39.304 110.55,39.389 107.66,39.32 C106.923,39.402 105.964,39.126 105.385,39.687 C104.757,40.909 104.884,42.353 104.769,43.687 C102.682,43.903 100.583,43.875 98.49,43.778 C98.33,41.537 98.621,39.308 98.93,37.093 C99.312,34.036 100.183,31.033 101.584,28.285 C102.437,26.562 103.616,25.036 104.693,23.456 M107.059,32.668 C110.059,32.774 113.065,32.695 116.071,32.707 C116.077,30.026 116.107,27.348 116.049,24.666 C111.845,25.343 108.467,28.755 107.059,32.668 z" fill="#C1E3F7"/>
<path d="M126.981,17.311 C129.947,17.247 132.914,17.311 135.88,17.281 C137.576,17.268 139.311,17.217 140.955,17.711 C142.647,18.178 144.185,19.07 145.587,20.111 C147.282,21.563 148.265,23.69 148.677,25.852 C149.181,29.419 148.802,33.469 146.217,36.211 C145.881,36.699 145.047,37.193 145.45,37.867 C146.636,39.911 148.049,41.816 149.202,43.885 C147.446,44.455 145.577,44.085 143.77,44.194 C142.799,44.118 141.574,44.491 140.867,43.618 C139.987,42.504 139.366,41.218 138.607,40.026 C137.036,39.32 135.259,39.696 133.602,39.753 C133.605,41.14 133.599,42.523 133.566,43.909 C131.37,43.954 129.171,43.957 126.975,43.909 C126.923,35.043 126.92,26.174 126.981,17.311 M133.645,28.294 C133.66,29.607 133.587,30.924 133.672,32.237 C133.76,32.349 133.933,32.577 134.018,32.689 C135.45,32.762 136.887,32.716 138.325,32.719 C139.972,32.789 141.722,31.564 141.816,29.835 C141.856,28.252 142.159,26.341 140.803,25.182 C138.895,23.532 136.187,24.372 133.906,24.154 C133.496,25.5 133.669,26.911 133.645,28.294 z" fill="#C1E3F7"/>
<path d="M190.308,17.235 C192.543,17.223 194.779,17.223 197.014,17.235 C197.072,26.134 197.008,35.034 197.048,43.933 C196.001,44.279 194.894,44.188 193.814,44.197 C192.631,44.179 191.424,44.291 190.28,43.933 C190.314,35.034 190.256,26.134 190.308,17.235 z" fill="#C1E3F7"/>
<path d="M201.537,21.475 C202.477,20.059 203.281,18.551 204.354,17.226 C211.146,17.29 217.94,17.174 224.731,17.281 C223.931,19.128 222.617,20.675 221.61,22.401 C221.182,23.007 220.879,23.775 220.2,24.145 C218.72,24.242 217.233,24.157 215.75,24.175 C215.404,25.828 215.589,27.527 215.547,29.204 C215.52,34.036 215.608,38.871 215.507,43.7 L215.344,43.912 C213.09,43.997 210.833,43.936 208.58,43.915 C208.531,37.336 208.595,30.757 208.543,24.175 C205.768,24.184 202.996,24.196 200.22,24.163 C200.338,23.135 201,22.319 201.537,21.475 z" fill="#C1E3F7"/>
<path d="M227.313,17.229 C229.484,17.256 231.656,17.168 233.825,17.256 L234.007,17.444 C234.122,19.649 233.967,21.861 234.061,24.066 C234.161,25.61 234.896,27.223 236.403,27.845 C238.444,28.904 241.177,27.448 241.593,25.24 C241.708,22.58 241.593,19.913 241.647,17.253 C243.956,17.208 246.267,17.22 248.575,17.25 C248.627,19.716 248.587,22.185 248.605,24.654 C248.715,28.767 246.015,32.704 242.254,34.294 C241.726,34.482 241.28,34.952 241.317,35.546 C241.289,38.361 241.335,41.182 241.302,44 C239.093,44.367 236.837,44.145 234.607,44.158 C234.383,42.82 234.31,41.467 234.513,40.123 C234.565,38.282 234.301,36.447 234.34,34.603 C230.237,33.205 227.064,29.052 227.291,24.651 C227.3,22.176 227.267,19.704 227.313,17.229 z" fill="#C1E3F7"/>
<path d="M21.078,29.322 C29.489,26.541 37.948,23.899 46.344,21.075 C46.499,21.205 46.805,21.46 46.957,21.588 C40.178,26.644 33.022,31.166 25.864,35.662 C21.778,38.043 17.787,40.612 13.528,42.677 L13.516,42.365 C14.192,38.661 15.221,35.022 15.703,31.285 C15.839,31.212 16.106,31.066 16.24,30.997 C17.799,30.287 19.458,29.859 21.078,29.322 z" fill="#C1E3F7"/>
<path d="M31.639,15.057 C31.782,14.848 32.067,14.429 32.206,14.223 C32.716,15.127 33.004,16.128 33.444,17.065 C33.671,17.608 34.345,17.733 34.869,17.757 C36.896,17.802 38.925,17.799 40.948,17.881 C44.694,18.282 48.44,18.594 52.165,19.146 C49.134,22.51 45.522,25.282 42.152,28.294 C40.963,29.398 39.58,30.272 38.364,31.342 C38.218,31.904 38.4,32.48 38.543,33.023 C39.823,37.488 40.848,42.019 41.773,46.569 C42.046,47.552 42.07,48.577 42.067,49.59 C36.896,47.048 32.027,43.915 27.174,40.815 C26.832,40.651 26.513,40.311 26.107,40.369 C25.154,40.794 24.329,41.443 23.45,41.995 C19.716,44.382 15.894,46.633 12.036,48.814 C11.435,49.156 10.78,49.378 10.128,49.593 C10.777,45.701 11.666,41.852 12.554,38.009 C13.015,36.396 13.255,34.706 13.944,33.165 C14.226,32.525 14.526,31.894 14.793,31.245 C15.096,31.257 15.399,31.27 15.703,31.285 C15.22,35.022 14.192,38.661 13.516,42.365 C13.434,41.792 13.334,41.221 13.237,40.654 C12.56,42.872 12.042,45.137 11.778,47.443 C16.279,45.334 20.395,42.508 24.569,39.826 C25.245,39.35 26.094,39.308 26.877,39.502 C31.251,42.256 35.558,45.14 40.126,47.576 C40.396,47.715 40.669,47.855 40.942,47.995 C40.76,45.723 40.162,43.518 39.683,41.3 C38.913,37.961 38.1,34.627 37.081,31.355 C37.748,30.533 38.443,29.723 39.289,29.077 C41.521,27.381 43.629,25.531 45.713,23.659 C47.014,22.437 48.595,21.491 49.608,19.98 C49.665,19.913 49.781,19.774 49.841,19.707 C47.645,19.598 45.47,19.264 43.283,19.064 C39.807,18.961 36.359,18.418 32.877,18.421 C32.473,17.296 32.07,16.17 31.639,15.057 z" fill="#B3D7EE"/>
<path d="M46.344,21.075 C47.421,20.684 48.519,20.344 49.608,19.98 C48.595,21.491 47.014,22.437 45.713,23.659 C43.629,25.531 41.521,27.381 39.289,29.077 C38.443,29.723 37.748,30.533 37.081,31.355 C35.103,32.489 33.323,33.93 31.515,35.31 C29.968,36.587 28.266,37.654 26.668,38.862 C26.719,39.019 26.825,39.341 26.877,39.502 C26.094,39.308 25.245,39.35 24.569,39.826 C20.395,42.508 16.279,45.334 11.778,47.443 C12.042,45.137 12.56,42.872 13.237,40.654 C13.334,41.221 13.434,41.792 13.516,42.365 L13.528,42.677 C17.787,40.612 21.778,38.043 25.864,35.662 C33.022,31.166 40.177,26.644 46.957,21.588 C46.805,21.46 46.499,21.205 46.344,21.075 z" fill="#97C3E4"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 15 KiB

View File

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg x="0" y="0" width="550" height="550" viewBox="0 0 550 550" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<path id="questionmark" d="M431,-17c0,0,-45,0,-79,29c0,0,-34,29,-34,82c0,0,0,47,33,79c0,0,33,32,80,32c0,0,47,0,80,-32c0,0,32,-32,32,-79c0,0,0,-52,-34,-82c0,0,-34,-29,-78,-29Zm-8,290c0,0,-39,0,-65,26c0,0,-27,25,-27,75c0,0,0,63,20,109c0,0,19,46,51,80c0,0,32,35,87,83c0,0,47,42,69,63c0,0,21,21,36,48c0,0,14,26,14,56c0,0,0,60,-44,101c0,0,-45,41,-115,41c0,0,-82,0,-121,-41c0,0,-38,-42,-65,-123c0,0,-26,-84,-96,-84c0,0,-42,0,-71,30c0,0,-29,29,-29,64c0,0,0,71,46,143c0,0,45,73,133,121c0,0,87,48,203,48c0,0,108,0,191,-40c0,0,83,-40,128,-109c0,0,46,-69,46,-149c0,0,0,-64,-26,-112c0,0,-26,-47,-61,-82c0,0,-36,-35,-128,-117c0,0,-25,-23,-40,-41c0,0,-16,-17,-23,-32c0,0,-8,-14,-12,-29c0,0,-4,-14,-12,-51c0,0,-14,-78,-89,-78Z" transform="scale(0.001,-0.001)"/>
</defs>
<path d="M76.6,120.1l130.6,-35C223.3,80.8,231.5,78.6,241,79c10.5,.9,20,6.4,26,15c5.1,8,7.3,16.2,11.7,32.7l68.8,256.7c4.3,16.1,6.5,24.3,6.1,33.8c-.9,10.5,-6.4,20,-15,26c-8,5.1,-16.2,7.3,-32.6,11.7L175.7,489.8c-16.2,4.4,-24.4,6.6,-33.8,6.1c-10.5,-.9,-20,-6.4,-26.1,-15c-5.1,-8,-7.3,-16.2,-11.7,-32.6L35.3,191.6C31,175.4,28.8,167.2,29.2,157.8c1,-10.5,6.5,-20,15.1,-26.1c8,-5.1,16.2,-7.3,32.6,-11.7Z" fill="#D3D3D3"/>
<path d="M207.4,96.1H342.6c16.7,0,25.2,0,34.2,2.8c9.9,3.6,17.7,11.4,21.3,21.3c2.9,9,2.9,17.5,2.9,34.5V420.5c0,16.7,0,25.2,-2.9,34.3c-3.6,9.8,-11.4,17.6,-21.3,21.2c-9,2.9,-17.5,2.9,-34.5,2.9H207.4c-16.7,0,-25.2,0,-34.2,-2.9c-9.9,-3.6,-17.7,-11.4,-21.3,-21.2C149,445.7,149,437.2,149,420.2V154.5c0,-16.8,0,-25.3,2.9,-34.3c3.6,-9.9,11.4,-17.7,21.3,-21.3c9,-2.8,17.5,-2.8,34.5,-2.8Z" fill="#808080"/>
<path d="M341.5,85.1l130.6,35c16.1,4.3,24.3,6.5,32.3,11.6c8.6,6.1,14.1,15.6,15,26.1c.5,9.4,-1.7,17.6,-6.1,34L444.5,448.6c-4.3,16.1,-6.5,24.3,-11.6,32.3c-6.1,8.6,-15.6,14.1,-26.1,15c-9.4,.5,-17.7,-1.7,-34.1,-6.1L242.5,454.9c-16.2,-4.4,-24.4,-6.6,-32.4,-11.7c-8.6,-6,-14.1,-15.5,-15,-26c-.5,-9.5,1.7,-17.7,6.1,-34.1L270,126.4C274.4,110.2,276.6,102,281.7,94c6,-8.6,15.5,-14.1,26,-15c9.5,-.4,17.7,1.8,34.1,6.2Z" fill="#282828"/>
<use xlink:href="#questionmark" transform="matrix(227,60.8,-60.8,227,223.2,371.6)" fill="#FFFFFF"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,84 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="360" height="78" viewBox="0, 0, 360, 78">
<g id="Background">
<rect x="0" y="0" width="360" height="78" fill="#000000" fill-opacity="0"/>
</g>
<defs>
<linearGradient id="Gradient_1" gradientUnits="userSpaceOnUse" x1="222.559" y1="0.5" x2="222.559" y2="77.5">
<stop offset="0" stop-color="#FFFFFF"/>
<stop offset="1" stop-color="#ADADAD"/>
</linearGradient>
<clipPath id="Clip_1">
<path d="M189.034,27.968 L221.927,39.126 L201.26,67.168 C192.256,60.163 187.524,50.356 187.237,39 C187.22,36.02 187.638,33.063 188.349,30.173 C188.533,29.425 188.806,28.703 189.034,27.968 z"/>
</clipPath>
<filter id="InnerShadow_2">
<feGaussianBlur in="SourceAlpha" stdDeviation="1.5"/>
<feOffset dx="0" dy="1" result="offsetblur"/>
<feFlood flood-color="#000000"/>
<feComposite in2="offsetblur" operator="in"/>
</filter>
<clipPath id="Clip_3">
<path d="M256.164,28.229 C257.409,31.686 257.788,35.352 257.88,39 C257.824,50.049 252.933,59.679 244.478,66.656 L224.196,39.091 L256.164,28.229 z"/>
</clipPath>
<filter id="InnerShadow_4">
<feGaussianBlur in="SourceAlpha" stdDeviation="1.5"/>
<feOffset dx="0" dy="3" result="offsetblur"/>
<feFlood flood-color="#000000"/>
<feComposite in2="offsetblur" operator="in"/>
</filter>
<clipPath id="Clip_5">
<path d="M222.34,3.684 L222.34,37.808 L189.476,26.627 C195.01,12.714 207.357,4.063 222.34,3.684 z"/>
</clipPath>
<filter id="InnerShadow_6">
<feGaussianBlur in="SourceAlpha" stdDeviation="1.5"/>
<feOffset dx="1" dy="2" result="offsetblur"/>
<feFlood flood-color="#000000"/>
<feComposite in2="offsetblur" operator="in"/>
</filter>
<clipPath id="Clip_7">
<path d="M223.697,3.707 C235.506,3.958 246.662,10.631 252.767,20.684 C254.303,23.214 254.605,24.18 255.754,26.91 L223.721,37.794 L223.697,3.707 z"/>
</clipPath>
<filter id="InnerShadow_8">
<feGaussianBlur in="SourceAlpha" stdDeviation="1.5"/>
<feOffset dx="-1" dy="2" result="offsetblur"/>
<feFlood flood-color="#000000"/>
<feComposite in2="offsetblur" operator="in"/>
</filter>
</defs>
<g id="Layer_1">
<g>
<path d="M222.559,0.5 C243.822,0.5 261.059,17.737 261.059,39 C261.059,60.263 243.822,77.5 222.559,77.5 C201.296,77.5 184.059,60.263 184.059,39 C184.059,17.737 201.296,0.5 222.559,0.5 z" fill="url(#Gradient_1)"/>
<path d="M223.074,39.696 L243.49,67.441 C237.181,72.048 230.325,74.125 222.559,74.322 C214.981,74.281 208.563,72.126 202.321,67.91 L223.074,39.696 z" fill="#FF0A28"/>
<g>
<path d="M189.034,27.968 L221.927,39.127 L201.26,67.168 C192.256,60.163 187.524,50.356 187.237,39 C187.22,36.02 187.638,33.063 188.349,30.173 C188.533,29.425 188.806,28.703 189.034,27.968 z" fill="#45BD06"/>
<path d="M183.236,22.968 L225.927,22.968 L225.927,72.168 L183.236,72.168 z M189.034,27.968 C188.806,28.703 188.533,29.425 188.349,30.173 C187.638,33.063 187.22,36.02 187.237,39 C187.524,50.356 192.256,60.163 201.26,67.168 L221.927,39.126 L189.034,27.968 z" clip-path="url(#Clip_1)" filter="url(#InnerShadow_2)" fill="rgba(0,0,0,0.25)"/>
</g>
<g>
<path d="M256.164,28.229 C257.409,31.686 257.788,35.352 257.88,39 C257.824,50.049 252.933,59.679 244.478,66.656 L224.196,39.091 L256.164,28.229 z" fill="#121212"/>
<path d="M220.196,21.229 L261.88,21.229 L261.88,73.656 L220.196,73.656 z M256.164,28.229 L224.196,39.091 L244.478,66.656 C252.933,59.679 257.824,50.049 257.88,39 C257.788,35.352 257.409,31.686 256.164,28.229 z" clip-path="url(#Clip_3)" filter="url(#InnerShadow_4)" fill="rgba(0,0,0,1)"/>
</g>
<g>
<path d="M222.34,3.684 L222.34,37.808 L189.476,26.627 C195.01,12.714 207.357,4.063 222.34,3.684 z" fill="#EBE9E9"/>
<path d="M184.476,-2.316 L227.34,-2.316 L227.34,43.808 L184.476,43.808 z M222.34,3.684 C207.357,4.063 195.01,12.714 189.476,26.627 L222.34,37.808 L222.34,3.684 z" clip-path="url(#Clip_5)" filter="url(#InnerShadow_6)" fill="rgba(0,0,0,0.25)"/>
</g>
<g>
<path d="M223.697,3.707 C235.506,3.958 246.662,10.631 252.767,20.684 C254.303,23.214 254.605,24.18 255.754,26.91 L223.721,37.794 L223.697,3.707 z" fill="#037ABA"/>
<path d="M218.697,-2.293 L260.754,-2.293 L260.754,43.794 L218.697,43.794 z M223.697,3.707 L223.721,37.794 L255.754,26.91 C254.605,24.18 254.303,23.214 252.767,20.684 C246.662,10.631 235.506,3.958 223.697,3.707 z" clip-path="url(#Clip_7)" filter="url(#InnerShadow_8)" fill="rgba(0,0,0,0.256)"/>
</g>
</g>
<g>
<path d="M1.706,18.945 C10.218,18.943 18.732,18.939 27.244,18.948 C27.211,21.164 27.271,23.381 27.213,25.598 C24.31,25.577 21.407,25.602 18.504,25.584 C18.498,36.745 18.498,47.904 18.504,59.063 C15.815,59.07 13.125,59.066 10.436,59.066 C10.44,47.906 10.434,36.749 10.438,25.592 C7.535,25.592 4.63,25.586 1.725,25.594 C1.692,23.377 1.727,21.162 1.706,18.945 z" fill="#FFFFFF"/>
<path d="M38.566,18.937 C41.887,18.954 45.208,18.937 48.529,18.943 C52.039,32.322 55.585,45.689 59.097,59.066 C56.292,59.057 53.486,59.086 50.682,59.051 C50.233,56.774 49.689,54.517 49.212,52.248 C49.105,51.698 48.983,51.154 48.875,50.606 C45.322,50.592 41.771,50.604 38.218,50.6 C37.624,53.415 36.934,56.211 36.408,59.038 C33.592,59.099 30.774,59.053 27.956,59.063 C31.522,45.696 35,32.305 38.566,18.937 M42.218,31.834 C41.342,35.87 40.481,39.906 39.618,43.943 C42.237,43.943 44.854,43.946 47.473,43.943 C46.254,38.362 45.038,32.776 43.891,27.18 L43.812,27.046 C43.767,26.613 43.661,26.19 43.465,25.8 C43.135,27.827 42.587,29.813 42.218,31.834 z" fill="#FFFFFF"/>
<path d="M61.975,18.948 C66.288,18.939 70.599,18.945 74.912,18.943 C77.024,18.883 79.21,18.989 81.152,19.914 C83.887,21.083 85.792,23.702 86.517,26.552 C87.351,29.871 87.325,33.526 85.966,36.703 C84.83,39.468 82.326,41.529 79.492,42.343 C76.442,43.352 73.197,42.948 70.048,43.031 C70.04,48.375 70.042,53.719 70.046,59.063 C67.358,59.07 64.669,59.066 61.979,59.066 C61.979,45.691 61.988,32.32 61.975,18.948 M70.044,24.888 C70.038,28.951 70.05,33.015 70.04,37.078 C71.386,37.074 72.731,37.095 74.077,37.07 C75.581,37.039 77.115,36.357 77.955,35.068 C79.034,33.44 79.111,31.372 78.897,29.488 C78.717,27.988 78.071,26.4 76.686,25.648 C74.657,24.529 72.257,24.984 70.044,24.888 z" fill="#FFFFFF"/>
<path d="M90.96,18.948 C95.818,18.941 100.677,18.941 105.535,18.948 C108.436,18.941 111.442,20.037 113.339,22.312 C115.399,24.74 116.097,28.055 116.045,31.178 C116.045,34.288 115.123,37.557 112.871,39.785 C110.674,41.972 107.533,42.887 104.51,43.018 C102.686,43.045 100.86,43.025 99.033,43.029 C99.023,48.375 99.029,53.719 99.029,59.066 C96.342,59.066 93.652,59.068 90.962,59.066 C90.965,45.691 90.971,32.32 90.96,18.948 M99.025,37.078 C100.435,37.068 101.847,37.107 103.257,37.06 C104.736,36.985 106.212,36.255 107.005,34.968 C108.079,33.232 108.119,31.061 107.821,29.098 C107.597,27.673 106.866,26.227 105.531,25.571 C103.518,24.552 101.195,24.981 99.031,24.888 C99.021,28.951 99.035,33.015 99.025,37.078 z" fill="#FFFFFF"/>
<path d="M119.941,18.948 C127.391,18.937 134.839,18.946 142.289,18.943 C142.276,21.16 142.299,23.377 142.276,25.594 C137.522,25.588 132.766,25.59 128.012,25.592 C128.01,28.728 128.021,31.863 128.006,34.999 C132.493,35.007 136.982,34.995 141.471,35.005 C141.454,37.224 141.475,39.443 141.46,41.66 C136.976,41.658 132.493,41.656 128.01,41.662 C128.014,45.237 128.014,48.815 128.01,52.39 C130.663,52.444 133.311,52.382 135.965,52.411 C136.804,52.323 137.642,52.519 138.483,52.434 C139.442,52.365 140.407,52.371 141.365,52.43 C141.866,52.398 142.367,52.44 142.868,52.486 C142.862,54.676 142.862,56.865 142.868,59.057 C135.228,59.078 127.588,59.061 119.948,59.066 C119.946,45.694 119.956,32.32 119.941,18.948 z" fill="#FFFFFF"/>
<path d="M147.268,18.95 C151.999,18.941 156.728,18.937 161.46,18.952 C164.661,18.991 168.031,20.087 170.137,22.623 C172.491,25.469 173.185,29.263 173.522,32.849 C173.775,36.726 173.806,40.626 173.475,44.502 C173.113,48.058 172.493,51.779 170.379,54.753 C168.913,56.824 166.599,58.163 164.147,58.67 C162.793,58.982 161.397,59.072 160.012,59.066 C155.766,59.066 151.519,59.068 147.272,59.066 C147.272,45.694 147.283,32.322 147.268,18.95 M155.352,24.888 C155.345,34.291 155.358,43.693 155.345,53.096 C157.37,53.015 159.447,53.328 161.426,52.784 C162.971,52.371 164.048,51 164.557,49.533 C165.454,46.992 165.46,44.26 165.621,41.599 C165.646,39.72 165.64,37.841 165.63,35.962 C165.481,33.553 165.456,31.082 164.652,28.78 C164.141,27.309 163.108,25.925 161.613,25.381 C159.615,24.619 157.437,24.969 155.352,24.888 z" fill="#FFFFFF"/>
</g>
<g>
<path d="M282.709,18.47 C285.879,17.951 289.225,18.015 292.275,19.111 C294.992,20.116 297.124,22.384 298.147,25.091 C299.578,28.706 299.797,32.662 299.915,36.509 C299.965,40.64 299.992,44.805 299.278,48.889 C298.808,51.589 297.911,54.339 296.031,56.387 C294.159,58.448 291.408,59.458 288.699,59.729 C286.372,59.938 283.991,59.894 281.713,59.323 C279.454,58.744 277.322,57.471 275.945,55.548 C274.365,53.35 273.62,50.666 273.245,48.012 C272.74,44.509 272.721,40.963 272.746,37.432 C272.837,33.412 272.959,29.283 274.355,25.468 C275.23,23.028 276.895,20.822 279.229,19.636 C280.312,19.051 281.502,18.695 282.709,18.47 M282.326,26.32 C281.221,28.458 281.026,30.929 280.941,33.294 C280.695,37.036 280.806,40.799 280.877,44.547 L280.958,44.682 C280.989,46.989 281.212,49.38 282.208,51.491 C282.875,52.985 284.48,53.937 286.099,53.864 C287.569,53.989 289.165,53.487 290.041,52.229 C291.399,50.293 291.503,47.828 291.733,45.553 C291.89,41.103 291.9,36.642 291.714,32.192 C291.459,29.958 291.331,27.522 289.925,25.658 C289.045,24.478 287.513,24.03 286.099,24.145 C284.554,24.068 283.032,24.937 282.326,26.32 z" fill="#FFFFFF"/>
<path d="M304.253,18.959 C306.951,18.932 309.651,18.949 312.351,18.951 C312.33,28.239 312.347,37.527 312.343,46.814 C312.374,48.622 312.434,50.56 313.409,52.143 C314.158,53.343 315.581,53.92 316.956,53.891 C318.256,53.929 319.649,53.522 320.465,52.439 C321.625,50.899 321.703,48.872 321.759,47.02 C321.759,37.663 321.772,28.308 321.753,18.951 C324.447,18.945 327.141,18.943 329.834,18.953 C329.826,27.127 329.832,35.3 329.83,43.476 C329.816,45.98 329.944,48.516 329.431,50.985 C328.898,53.618 327.47,56.125 325.24,57.658 C322.161,59.796 318.252,60.025 314.639,59.752 C312.183,59.481 309.661,58.754 307.796,57.05 C305.851,55.337 304.87,52.781 304.499,50.262 C304.164,47.524 304.276,44.763 304.259,42.013 C304.255,34.327 304.268,26.643 304.253,18.959 z" fill="#FFFFFF"/>
<path d="M332.762,18.951 C341.272,18.945 349.784,18.943 358.294,18.951 C358.265,21.168 358.316,23.385 358.267,25.601 C355.362,25.581 352.457,25.606 349.552,25.589 C349.55,36.748 349.55,47.907 349.552,59.067 C346.866,59.071 344.179,59.069 341.493,59.069 C341.498,47.912 341.491,36.752 341.496,25.595 C338.591,25.595 335.688,25.589 332.785,25.599 C332.741,23.382 332.785,21.166 332.762,18.951 z" fill="#FFFFFF"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 11 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 38 KiB

View File

@ -0,0 +1,13 @@
<svg width="238" height="38" viewBox="0 0 238 38" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.0588 8.49174L20.5506 0L29.0423 8.49174H23.94V23.6106C23.94 26.2706 23.332 28.2086 22.116 29.4246C20.9253 30.6152 19 31.2106 16.34 31.2106H7.60001C4.94 31.2106 3.002 30.6152 1.786 29.4246C0.595337 28.2086 0 26.2706 0 23.6106V4.23058H6.84V23.6106C6.84 25.1306 7.60001 25.8906 9.12 25.8906H14.82C16.34 25.8906 17.1 25.1306 17.1 23.6106V8.49174H12.0588Z" fill="white"/>
<path d="M39.33 15.8206C37.9873 15.8206 36.4673 16.0739 34.77 16.5806V30.8306H28.12V10.6906H34.01L34.39 12.5906C35.5807 11.8052 36.7967 11.2352 38.038 10.8806C39.3047 10.5006 40.3687 10.3106 41.23 10.3106H42.94C44.6627 10.3106 46.0433 10.8299 47.082 11.8686C48.1207 12.9072 48.64 14.2879 48.64 16.0106V30.8306H41.99V17.1506C41.99 16.7706 41.8633 16.4539 41.61 16.2006C41.3567 15.9473 41.04 15.8206 40.66 15.8206H39.33Z" fill="white"/>
<path d="M58.8956 31.2106C61.2516 31.2106 63.6582 31.0839 66.1155 30.8306V25.8906H61.1756C60.7955 25.8906 60.4789 25.7639 60.2256 25.5106C59.9722 25.2572 59.8456 24.9406 59.8456 24.5606V15.8206H64.5956V10.6906H59.8456V6.13057H53.9556L53.1956 10.6906H50.9155V15.8206H53.1956V25.5106C53.1956 27.2332 53.7149 28.6139 54.7535 29.6526C55.7922 30.6912 57.1729 31.2106 58.8956 31.2106Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M68.9997 11.0706C73.6357 10.5639 77.8157 10.3106 81.5397 10.3106C83.2624 10.3106 84.643 10.8299 85.6817 11.8686C86.7204 12.9072 87.2397 14.2879 87.2397 16.0106V30.8306H81.3497L80.9697 28.9306C79.779 29.7159 78.5504 30.2986 77.2837 30.6786C76.0424 31.0332 74.991 31.2106 74.1297 31.2106H72.7997C71.077 31.2106 69.6964 30.6912 68.6577 29.6526C67.619 28.6139 67.0997 27.2332 67.0997 25.5106V23.8006C67.0997 22.0779 67.619 20.6973 68.6577 19.6586C69.6964 18.6199 71.077 18.1006 72.7997 18.1006H80.5897V16.5806C80.5897 16.2006 80.463 15.8839 80.2097 15.6306C79.9564 15.3772 79.6397 15.2506 79.2597 15.2506C77.613 15.2506 75.789 15.3266 73.7877 15.4786C71.8117 15.6306 70.2157 15.7446 68.9997 15.8206V11.0706ZM76.0297 25.8906C77.3724 25.8906 78.8924 25.6372 80.5897 25.1306V22.8506H75.0797C74.6997 22.8506 74.383 22.9772 74.1297 23.2306C73.8764 23.4839 73.7497 23.8006 73.7497 24.1806V24.5606C73.7497 24.9406 73.8764 25.2572 74.1297 25.5106C74.383 25.7639 74.6997 25.8906 75.0797 25.8906H76.0297Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M97.2993 37.2906V30.8306H105.089C106.989 30.8306 108.471 30.2986 109.535 29.2346C110.625 28.1452 111.169 26.6506 111.169 24.7506V16.0106C111.169 14.2879 110.65 12.9072 109.611 11.8686C108.573 10.8299 107.192 10.3106 105.469 10.3106H103.759C102.898 10.3106 101.834 10.5006 100.567 10.8806C99.326 11.2352 98.11 11.8052 96.9193 12.5906L96.5393 10.6906H90.6493V37.2906H97.2993ZM97.2993 16.5806C98.9966 16.0739 100.517 15.8206 101.859 15.8206H103.189C103.569 15.8206 103.886 15.9473 104.139 16.2006C104.393 16.4539 104.519 16.7706 104.519 17.1506V24.1806C104.519 25.1939 104.013 25.7006 102.999 25.7006H97.2993V16.5806Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M121.235 30.8306V37.2906H114.585V10.6906H120.475L120.855 12.5906C122.046 11.8052 123.262 11.2352 124.503 10.8806C125.77 10.5006 126.833 10.3106 127.695 10.3106H129.405C131.128 10.3106 132.508 10.8299 133.547 11.8686C134.586 12.9072 135.105 14.2879 135.105 16.0106V24.7506C135.105 26.6506 134.56 28.1452 133.471 29.2346C132.407 30.2986 130.925 30.8306 129.025 30.8306H121.235ZM125.795 15.8206C124.452 15.8206 122.932 16.0739 121.235 16.5806V25.7006H126.935C127.948 25.7006 128.455 25.1939 128.455 24.1806V17.1506C128.455 16.7706 128.328 16.4539 128.075 16.2006C127.822 15.9473 127.505 15.8206 127.125 15.8206H125.795Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M143.84 31.2106C147.818 31.2106 152.251 30.9572 157.14 30.4506V25.7006C152.302 26.0806 148.628 26.2706 146.12 26.2706C145.74 26.2706 145.424 26.1439 145.17 25.8906C144.917 25.6372 144.79 25.3206 144.79 24.9406V23.4206H157.9V16.3906C157.9 14.4906 157.356 13.0086 156.266 11.9446C155.202 10.8552 153.72 10.3106 151.82 10.3106H144.22C142.32 10.3106 140.826 10.8552 139.736 11.9446C138.672 13.0086 138.14 14.4906 138.14 16.3906V25.5106C138.14 27.2332 138.66 28.6139 139.698 29.6526C140.737 30.6912 142.118 31.2106 143.84 31.2106ZM144.79 16.5806C144.79 15.5672 145.297 15.0606 146.31 15.0606H149.73C150.744 15.0606 151.25 15.5672 151.25 16.5806V18.6706H144.79V16.5806Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M175.556 30.8306L175.176 28.9306C173.985 29.7159 172.756 30.2986 171.49 30.6786C170.248 31.0332 169.197 31.2106 168.336 31.2106H166.626C164.903 31.2106 163.522 30.6912 162.484 29.6526C161.445 28.6139 160.926 27.2332 160.926 25.5106V16.7706C160.926 14.8706 161.458 13.3886 162.522 12.3246C163.611 11.2352 165.106 10.6906 167.006 10.6906H174.796V4.23058H181.446V30.8306H175.556ZM170.236 25.7006C171.578 25.7006 173.098 25.4473 174.796 24.9406V15.8206H169.096C168.082 15.8206 167.576 16.3272 167.576 17.3406V24.3706C167.576 24.7506 167.702 25.0672 167.956 25.3206C168.209 25.5739 168.526 25.7006 168.906 25.7006H170.236Z" fill="white"/>
<path d="M191.321 25.1306H184.481V30.8306H191.321V25.1306Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M207.48 29.3106C205.023 29.8172 202.869 30.0706 201.02 30.0706H199.69C197.967 30.0706 196.587 29.5512 195.548 28.5126C194.509 27.4739 193.99 26.0932 193.99 24.3706V16.7706C193.99 14.8706 194.522 13.3886 195.586 12.3246C196.675 11.2352 198.17 10.6906 200.07 10.6906H214.13V31.9706C214.13 33.6932 213.611 35.0739 212.572 36.1126C211.533 37.1512 210.153 37.6706 208.43 37.6706C204.453 37.6706 200.019 37.4173 195.13 36.9106V31.9706C199.969 32.3506 203.642 32.5406 206.15 32.5406C206.53 32.5406 206.847 32.4139 207.1 32.1606C207.353 31.9072 207.48 31.5906 207.48 31.2106V29.3106ZM202.92 24.9406C204.516 24.9406 206.036 24.8139 207.48 24.5606V15.8206H202.16C201.147 15.8206 200.64 16.3272 200.64 17.3406V23.6106C200.64 23.9906 200.767 24.3073 201.02 24.5606C201.273 24.8139 201.59 24.9406 201.97 24.9406H202.92Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M224.584 30.0706C226.434 30.0706 228.587 29.8172 231.044 29.3106V31.2106C231.044 31.5906 230.918 31.9072 230.664 32.1606C230.411 32.4139 230.094 32.5406 229.714 32.5406C227.206 32.5406 223.533 32.3506 218.694 31.9706V36.9106C223.584 37.4173 228.017 37.6706 231.994 37.6706C233.717 37.6706 235.098 37.1512 236.136 36.1126C237.175 35.0739 237.694 33.6932 237.694 31.9706V10.6906H223.634C221.734 10.6906 220.24 11.2352 219.15 12.3246C218.086 13.3886 217.554 14.8706 217.554 16.7706V24.3706C217.554 26.0932 218.074 27.4739 219.112 28.5126C220.151 29.5512 221.532 30.0706 223.254 30.0706H224.584ZM231.044 24.5606C229.6 24.8139 228.08 24.9406 226.484 24.9406H225.534C225.154 24.9406 224.838 24.8139 224.584 24.5606C224.331 24.3073 224.204 23.9906 224.204 23.6106V17.3406C224.204 16.3272 224.711 15.8206 225.724 15.8206H231.044V24.5606Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 6.8 KiB

21
docs/assets/svg/yours.svg Normal file

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 14 KiB

355
docs/index.html Normal file
View File

@ -0,0 +1,355 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Keyrune</title>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
<meta name="color-scheme" content="light dark">
<meta name="generator" content="Hand crafted">
<script type="text/javascript" src='/assets/js/first.js'></script>
<link rel="stylesheet" type="text/css" href='/assets/css/docs.css'>
<link rel="stylesheet" type="text/css" href='/assets/css/keyrune.css'>
<script type="text/javascript" src='/assets/js/zepto.js'></script>
<script type="text/javascript" src='/assets/js/zepto.fx.js'></script>
<script type="text/javascript" src='/assets/js/glitz.js'></script>
<script async defer src="https://buttons.github.io/buttons.js"></script>
</head>
<body>
<header>
<mark class="flex flex-row flex-align-center flex-justify-start">
<a href="/" class="flex flex-row flex-align-center flex-justify-start mr-1">
<i class="ss ss-leg relative mr-2"></i>
<span>Keyrune</span>
</a>
<a href="https://github.com/andrewgioia/keyrune/archive/refs/heads/master.zip" target="blank">
<b>4.0.0</b>
</a>
</mark>
<a href="javascript:;" data-nav="mobile" id="toggle-nav">
<svg id="toggle-nav-svg" aria-hidden="true" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="4" y1="6" x2="20" y2="6" class="line top"></line>
<line x1="4" y1="12" x2="20" y2="12" class="line mid"></line>
<line x1="4" y1="18" x2="20" y2="18" class="line bot"></line>
</svg>
</a>
<nav>
<a href="sets">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polygon points="12 2 2 7 12 12 22 7 12 2"></polygon>
<polyline points="2 17 12 22 22 17"></polyline>
<polyline points="2 12 12 17 22 12"></polyline>
</svg>
<span>
Sets
</span>
</a>
<a href="docs">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path>
<path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path>
</svg>
<span>
Documentation
</span>
</a>
<a href="examples">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M15 4V2"></path>
<path d="M15 16v-2"></path>
<path d="M8 9h2"></path>
<path d="M20 9h2"></path>
<path d="M17.8 11.8 19 13"></path>
<path d="M15 9h0"></path>
<path d="M17.8 6.2 19 5"></path>
<path d="m3 21 9-9"></path>
<path d="M12.2 6.2 11 5"></path>
</svg>
<span>
Examples
</span>
</a>
<a href="https://github.com/andrewgioia/keyrune" target="blank">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4"></path>
<path d="M9 18c-4.51 2-5-2-7-2"></path>
</svg>
<span>
GitHub
</span>
</a>
<div id="mode" class="ml-2">
<input class="toggle" type="checkbox" id="switch" />
<label class="toggle" for="switch"></label>
</div>
</nav>
</header>
<main aria-role="main">
<aside>
<h1>
Keyrune.css
</h1>
<p class="big">
Keyrune is a complete SVG-based icon library and toolkit for Magic: the Gathering set symbols. <span class="hidden xs:inline">Use them on your website just like any icon font, or print them outfor great looking card dividers and storage labels.</span>
</p>
<div class="flex flex-align-center flex-justify-center w-full mt-12 flex-col sm:flex-row">
<a href="https://github.com/andrewgioia/keyrune/latest" class="button mx-2 flex flex-justify-center mb-4">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-3">
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
<polyline points="7 10 12 15 17 10"></polyline>
<line x1="12" y1="15" x2="12" y2="3"></line>
</svg>
<span>
Download v4.0.0
</span>
</a>
<a href="docs/guide" class="button flex flex-justify-center mx-2 mb-4">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-3 top-px relative">
<path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"></path>
<path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"></path>
</svg>
<span>
<span class="hidden xs:inline">Read the getting started guide</span>
<span class="xs:hidden">Getting started guide</span>
</span>
</a>
</div>
</aside>
<dialog id="explode" class="relative overflow-hidden">
<div class="explode-inner flex flex-col flex-align-center flex-justify-center flex-shrink-0 relative">
<div class="isometric explode">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 436 480" class="border">
<path fill="none" d="M0 0h436v480H0z"/>
<path fill="var(--svg-border)" d="m436 54-30.889 71.493-24.754 17.454-13.483 17.014h-36.468l2.265 5.003 14.321 15.122 16.317 43.101v67.7l-32.99 17.18h-7.18l-31.851 20.266-34.909 18.207h-14.285l-32.244 24.227-35.145 18.308h-14.432l-32.285 24.266-24.229 12.607H72.7V223.144l16.356-43.092 14.282-15.121 2.253-4.97H68.68l-13.112-17.078-24.672-17.466L0 54h436zm-18.254 11.998H18.264l22.309 51.569 23.407 16.571 10.615 13.825h49.609l-10.767 23.748-14.014 14.838-14.724 38.795V413.95h16.126l20.746-10.795 34.695-26.078h15.501l31.665-16.495 34.657-26.04h15.349l31.845-16.609 34.363-21.864h7.736l23.929-12.461v-58.226l-14.687-38.795-14.052-14.838-10.767-23.786h49.268l10.956-13.825 23.408-16.505 22.309-51.635z"/>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 436 480" class="rarity">
<path fill="none" d="M0 0h436v480H0z"/>
<path fill="var(--rarity-default)" d="M357.087 141.571h-48.198c-1.704-3.702-2.926-6.401-2.926-6.401H130.046s-1.297 2.813-2.926 6.401H78.961l-8.579-10.766L87.36 113.42h261.29l16.978 17.385-8.541 10.766zm-39.95 33.767 14.279 15.056H104.593l14.242-15.056h198.302zm-35.292 137.188V249.5l7.14-9.545h21.637l7.14 9.545.038 40.168-35.955 22.858zm-81.85 42.583V249.5l7.139-9.545h21.637l7.14 9.545.038 78.603-35.954 27.006zm-81.823 42.573V249.5l7.14-9.545h21.599l7.177 9.545.038 121.138-35.954 27.044zM18.264 65.998l22.309 51.569 23.408 16.571 10.614 13.825h49.609l-10.766 23.748-14.015 14.838-14.724 38.795V413.95h16.126l20.747-10.795 34.694-26.078h15.501l31.665-16.495 34.657-26.04h15.349l31.845-16.609 34.363-21.864h7.736l23.929-12.461v-58.226l-14.687-38.795-14.052-14.838-10.766-23.786h49.267l10.956-13.825 23.408-16.505 22.309-51.635H18.264z"/>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 436 480" class="inner">
<path fill="none" d="M0 0h436v480H0z"/>
<path fill="var(--inner-default)" d="m146.911 239.955 7.177 9.545.038 121.138-35.954 27.044V249.5l7.14-9.545h21.599zm81.86 0h-21.637l-7.139 9.545v105.609l35.954-27.006-.038-78.603-7.14-9.545zm81.851 0h-21.637l-7.14 9.545v63.026l35.954-22.858-.037-40.168-7.14-9.545zm6.515-64.617 14.279 15.056H104.593l14.242-15.056h198.302zM130.046 135.17h175.917c.416.917.834 1.833 2.926 6.401h48.198l8.541-10.766-16.978-17.385H87.36l-16.978 17.385 8.579 10.766h48.159c1.629-3.588 2.926-6.401 2.926-6.401z"/>
</svg>
</div>
</div>
<div class="explode-text pb-6">
<h2 class="mt-10 mb-7">
Redrawn and refactored with full set coverage
</h2>
<p class="big">
Version 4 represents hundreds of hours of labor-of-love, with <strong>re-drawn, normalized glyphs</strong> for accurate sizing and <strong>multi-layer support</strong> for <em>every</em> set symbol!
</p>
<p class="big">
Style the rarity, border, and inner layers separately and perfectly, all with cross-browser <a href="examples">plug'n'play CSS classes</a>.
</p>
</div>
</dialog>
<article class="mt-16 mb-16">
<h2 class="mb-0 text-center">
<span style="box-shadow: -.1rem .1rem 0 #000, 0 .1rem 0 #000; background-color: #beb9b2; border-radius: 1rem; color: #111; width: 1.75rem; height: 1.75rem; display: inline-flex; align-items: center; justify-content: center;">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 32 32">
<title>3</title>
<path fill="#444" d="M11.824 17.025l-0.807-1.508 0.535-0.323c2.070-1.258 3.961-2.532 5.676-3.825s2.571-2.766 2.571-4.419c0-1.111-0.412-2.045-1.234-2.799-0.824-0.757-1.789-1.134-2.898-1.134-2.576 0-5.294 1.6-8.157 4.796l-1.342-1.024c2.981-4.526 6.626-6.79 10.936-6.79 1.903 0 3.518 0.467 4.849 1.401 1.508 1.043 2.262 2.461 2.262 4.257 0 1.292-0.54 2.55-1.616 3.77-0.611 0.719-1.69 1.653-3.233 2.802l-0.646 0.485c0.287-0.036 0.629-0.054 1.024-0.054 1.975 0 3.599 0.755 4.875 2.263s1.913 3.268 1.913 5.278c0 3.413-1.438 6.267-4.31 8.566-2.659 2.155-5.73 3.231-9.213 3.231-3.196 0-5.71-0.699-7.543-2.1l0.972-1.348c2.155 1.043 4.112 1.563 5.872 1.563 2.549 0 4.82-0.844 6.813-2.532 1.995-1.688 2.99-3.788 2.99-6.302 0-1.653-0.502-3.062-1.508-4.23-1.006-1.166-2.317-1.75-3.933-1.75-1.474 0.001-3.089 0.575-4.849 1.724z"></path>
</svg>
</span>,
<span style="box-shadow: -.1rem .1rem 0 #000, 0 .1rem 0 #000; background-color: #beb9b2; border-radius: 1rem; color: #111; width: 1.75rem; height: 1.75rem; display: inline-flex; align-items: center; justify-content: center;">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 32 32">
<title>tap</title>
<path fill="#444" d="M27.263 16.227h-12.874l4.714-3.355c-1.751-1.39-3.778-2.084-6.073-2.084-1.148 0-1.936 0.219-2.356 0.656-0.423 0.439-0.635 1.232-0.635 2.379 0 3.173 1.632 6.558 4.895 10.153l-3.715 3.762c-4.323-5.258-6.482-9.956-6.482-14.097 0-2.477 0.746-4.451 2.242-5.916 1.495-1.465 3.485-2.198 5.96-2.198 3.022 0 6.316 1.15 9.883 3.445l2.763-4.713 1.678 11.967z"></path>
</svg>
</span>: Draw 6 new features.
</h2>
<h2 class="mt-2 mb-16 text-center">You have no maximum hand size for the rest of the game.</h2>
<div class="grid grid-cols-6 grid-gap-x-8 grid-gap-y-12">
<div class="feature flex flex-col flex-align-center flex-justify-start text-center">
<svg width="80" height="80" viewBox="0 0 460 460" xmlns="http://www.w3.org/2000/svg" class="p-2">
<g transform="translate(-60 -58)" fill="none" fill-rule="evenodd">
<circle fill="#000" opacity="1" cx="290" cy="288" r="230"></circle>
<path d="M343.058 89.985c-109.36-29.303-221.77 35.597-251.073 144.957-29.303 109.36 35.597 221.77 144.957 251.073 109.36 29.303 221.77-35.597 251.073-144.957 29.303-109.36-35.597-221.77-144.957-251.073zM256.342 451.95l.276.71c1.172 3.187 3.562 5.776 6.644 7.2 3.082 1.422 6.603 1.562 9.788.387l48.355-17.774c3.184-1.175 6.706-1.035 9.787.388 3.082 1.424 5.472 4.013 6.644 7.2l.19.56c2.105 5.852-.304 12.37-5.71 15.448-93.23 22.17-187.912-30.724-217.912-121.736s14.67-189.84 102.81-227.453c5.144.502 9.544 3.91 11.32 8.762 2.578 6.977 10.317 10.55 17.3 7.99l15.73-5.803c3.186-1.176 6.707-1.036 9.79.387 3.08 1.423 5.47 4.012 6.643 7.198l.19.56c1.174 3.185 1.034 6.706-.39 9.788-1.422 3.082-4.01 5.472-7.197 6.644l-109.46 40.366c-3.187 1.172-5.777 3.562-7.2 6.644-1.422 3.082-1.562 6.603-.388 9.788l.19.56c1.172 3.186 3.562 5.775 6.643 7.198 3.082 1.423 6.603 1.563 9.788.388l80.06-29.483c3.184-1.174 6.705-1.034 9.787.388 3.082 1.423 5.472 4.013 6.644 7.2l.19.56c1.173 3.184 1.034 6.705-.39 9.787-1.422 3.08-4.01 5.47-7.197 6.643l-127.814 47.08c-3.186 1.17-5.776 3.56-7.2 6.643-1.42 3.082-1.56 6.603-.387 9.788l.19.56c1.172 3.186 3.562 5.775 6.643 7.198 3.08 1.423 6.602 1.563 9.787.388L297.72 226.4c3.184-1.175 6.705-1.036 9.787.387 3.082 1.423 5.472 4.012 6.644 7.198l.467 1.27c1.174 3.186 1.035 6.707-.388 9.79-1.424 3.08-4.014 5.47-7.2 6.643l-113 41.54c-3.187 1.172-5.777 3.562-7.2 6.644-1.422 3.08-1.562 6.603-.387 9.787l.19.56c1.17 3.185 3.56 5.775 6.643 7.198 3.08 1.423 6.603 1.562 9.787.388l51.798-19.06c3.186-1.174 6.707-1.034 9.79.39 3.08 1.422 5.47 4.01 6.643 7.197l.19.56c1.174 3.185 1.034 6.706-.39 9.788-1.422 3.083-4.01 5.473-7.197 6.644l-89.085 32.754c-3.185 1.17-5.774 3.56-7.197 6.643-1.423 3.083-1.562 6.604-.388 9.79l.19.56c1.17 3.185 3.56 5.775 6.643 7.197 3.082 1.423 6.603 1.563 9.788.388L304.563 336.3c3.185-1.173 6.706-1.034 9.788.39 3.083 1.422 5.473 4.01 6.644 7.197l.19.56c1.174 3.185 1.035 6.706-.388 9.788s-4.013 5.472-7.198 6.644l-74.954 27.54c-3.186 1.17-5.776 3.56-7.2 6.643-1.422 3.082-1.56 6.603-.387 9.788l.19.56c1.172 3.187 3.562 5.777 6.643 7.2 3.082 1.422 6.603 1.562 9.788.387l94.147-34.537c3.185-1.175 6.706-1.035 9.788.388s5.472 4.012 6.644 7.198c2.428 6.58-.893 13.887-7.447 16.384l-86.903 33.168c-3.18 1.18-5.764 3.574-7.18 6.658-1.414 3.083-1.547 6.603-.367 9.784l-.018-.09z" fill="#FFF"></path>
</g>
</svg>
<h3 class="mt-8 mb-4">Full Scryfall set code coverage</h3>
<p class="m-0">Every set officially recognized by <a href="https://https://scryfall.com/sets" target="blank">Scryfall</a> is aliased to the appropriate symbol, including all of their custom codes for promos, cubes, etc.</p>
</div>
<div class="feature flex flex-col flex-align-center flex-justify-start text-center">
<i class="ss ss-4bb ss-border" style="font-size: 6rem;"></i>
<h3 class="mt-8 mb-4">More unofficial set symbols</h3>
<p class="m-0">All of the missing <a href="sets/unofficial">convenience symbols</a> for popular but unofficial "sets" are now available, with some new fun ones 😜.</p>
</div>
<div class="feature flex flex-col flex-align-center flex-justify-start text-center">
<i class="ss ss-arn ss-border ss-inner" style="font-size: 6rem;"></i>
<h3 class="mt-8 mb-4">Set symbol size normalization!</h3>
<p class="m-0">When every glyph was squared off, Arabian Nights was too thin and Tempest too big. Now every symbol is relatively sized!</p>
</div>
<div class="feature flex flex-col flex-align-center flex-justify-start text-center">
<i class="ss ss-leg ss-rarity ss-border ss-rarity-mythic ss-rarity-gradient" style="font-size: 6rem;"></i>
<h3 class="mt-8 mb-4">Three targetable layers</h3>
<p class="m-0">In an icon font first, border, rarity, and inner layers are targetable via <code>::before</code>, <code>::after</code>, and <code>::marker</code> pseudo-elements.</p>
</div>
<div class="feature flex flex-col flex-align-center flex-justify-start text-center">
<i class="ss ss-atq ss-border" style="font-size: 6rem;"></i>
<h3 class="mt-8 mb-4">Overlays for print variations</h3>
<p class="m-0">Booster fun, box topper, pre-release, and some other print variations now have easy overlays if your project needs to differentiate.</p>
</div>
<div class="feature flex flex-col flex-align-center flex-justify-start text-center">
<svg width="80" height="80" viewBox="0, 0, 120, 120" xmlns="http://www.w3.org/2000/svg" class="p-2">
<path d="M5.041,0.631 C6.662,-0.21 8.686,-0.207 10.304,0.644 C11.51,1.181 12.408,2.179 13.323,3.097 C22.062,11.839 30.797,20.587 39.536,29.333 C40.23,30.027 40.95,30.695 41.573,31.456 C41.516,25.317 41.564,19.174 41.548,13.035 C41.548,9.466 45.212,6.518 48.698,7.196 C51.668,7.564 53.977,10.39 53.935,13.354 C53.967,24.44 53.935,35.53 53.951,46.616 C54.044,49.877 50.917,52.614 47.748,52.525 C36.787,52.538 25.828,52.518 14.867,52.534 C12.757,52.656 10.608,51.553 9.495,49.756 C8.6,48.422 8.322,46.737 8.574,45.167 C9.047,42.392 11.663,40.157 14.487,40.141 C20.575,40.137 26.663,40.128 32.751,40.147 C23.018,30.506 13.348,20.795 3.647,11.123 C2.438,9.93 1.498,8.369 1.418,6.64 C1.236,4.142 2.755,1.642 5.041,0.631 z" fill="var(--text-default)"/>
<path d="M110.277,0.388 C113.506,-0.926 117.497,1.252 118.357,4.583 C119.086,6.956 118.053,9.514 116.314,11.167 C106.58,20.821 96.917,30.545 87.145,40.153 C93.221,40.112 99.296,40.15 105.368,40.134 C108.409,40.073 111.198,42.625 111.444,45.647 C112,49.043 109.097,52.451 105.679,52.528 C94.276,52.544 82.87,52.499 71.471,52.55 C68.535,52.263 66.08,49.545 66.086,46.59 C66.035,35.402 66.08,24.21 66.064,13.019 C66.073,9.495 69.661,6.572 73.118,7.18 C76.037,7.506 78.397,10.208 78.438,13.131 C78.486,19.219 78.47,25.307 78.445,31.395 C87.558,22.221 96.719,13.092 105.854,3.941 C107.223,2.643 108.428,1.031 110.277,0.388 z" fill="var(--text-accent)"/>
<path d="M8.606,72.19 C9.147,69.475 11.733,67.33 14.506,67.32 C25.601,67.311 36.7,67.323 47.796,67.314 C51.035,67.346 53.961,70.227 53.926,73.495 C53.967,84.574 53.945,95.654 53.938,106.734 C53.993,110.347 50.379,113.397 46.827,112.783 C43.895,112.393 41.506,109.688 41.554,106.714 C41.551,100.668 41.525,94.621 41.57,88.574 C31.971,98.302 22.257,107.917 12.619,117.609 C11.382,118.932 9.687,119.972 7.832,119.988 C5.086,120.099 2.473,118.123 1.687,115.514 C0.932,113.257 1.731,110.686 3.449,109.087 C13.284,99.293 23.056,89.425 32.943,79.679 C27.021,79.746 21.096,79.688 15.174,79.711 C13.067,79.756 10.835,78.876 9.645,77.073 C8.625,75.688 8.277,73.866 8.606,72.19 z" fill="var(--text-accent)"/>
<path d="M68.376,68.759 C69.642,67.633 71.416,67.39 73.047,67.394 C83.922,67.41 94.8,67.381 105.675,67.406 C108.828,67.49 111.498,70.355 111.501,73.485 C111.607,75.874 110.12,78.262 107.926,79.218 C106.35,80.024 104.527,79.855 102.817,79.867 C97.621,79.826 92.421,79.861 87.225,79.794 C96.454,89 105.669,98.215 114.888,107.431 C116.218,108.812 117.884,110.062 118.357,112.026 C119.479,115.671 116.528,119.84 112.716,119.978 C110.469,120.189 108.448,118.856 107.022,117.238 C97.464,107.587 87.823,98.017 78.304,88.325 C78.352,94.036 78.307,99.75 78.326,105.461 C78.422,107.181 78.163,109.017 77.035,110.392 C75.122,113.049 71.033,113.637 68.433,111.642 C66.895,110.51 65.92,108.62 65.933,106.705 C65.917,95.734 65.933,84.76 65.926,73.789 C65.853,71.832 66.885,69.971 68.376,68.759 z" fill="var(--text-default)"/>
</svg>
<h3 class="mt-8 mb-4">Smaller SVG code</h3>
<p class="m-0">In addition to the redraw, each SVG has been optimized for file size to help reduce the overall weight of the font and library.</p>
</div>
</div>
</article>
<section class="flex flex-col flex-align-center mt-12 pt-24 pb-12 bg-black w-full text-white angle-top relative">
<h2 class="mb-8 px-4 text-center w-wide">
See Keyrune in the wild at these fine locations!
</h2>
<div class="flex flex-wrap flex-align-center flex-justify-center pb-4 w-wide">
<a href="https://mtgjson.com" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/mtgjson.svg" width="80">
</a>
<a href="https://tappedout.net" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/tappedout.svg" width="220">
</a>
<a href="https://tcgplayer.com" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/tcgplayer.svg" width="180">
</a>
<a href="https://whatsinstandard.com" target="blank" class="user bubble mx-8 my-2">
<img src="assets/svg/standard.svg" width="80">
</a>
<a href="https://untapped.gg" target="blank" class="user bubble mx-8 my-4 pt-2 px-2">
<img src="assets/svg/untapped.svg" width="200">
</a>
<a href="https://manatraders.com" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/manatraders.svg" width="160">
</a>
<a href="https://mtgaassistant.com" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/mtgaassistant.svg" width="72">
</a>
<a href="https://starcitygames.com/magic-the-gathering-cards-the-unofficial-ultimate-collectors-guide-ben-bleiweiss-non-autographed/" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/scg.svg" width="300">
</a>
<a href="https://cardsphere.com" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/cardsphere.svg" width="64">
</a>
<a href="https://echomtg.com" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/echomtg.svg" width="200">
</a>
<a href="https://github.com/andrewgioia/keyrune" target="blank" class="user bubble mx-8 my-4 pt-2">
<img src="assets/svg/yours.svg" width="150">
</a>
</div>
</section>
</main>
<footer class="border">
<div class="w-wide flex flex-col sm:flex-row">
<div class="w-full sm:w-1/5 flex flex-col">
<h4 class="mt-0 mb-4">
Keyrune.css
</h4>
<p class="mt-1 mb-6 pr-12 relative top-px">
An MTG icon font built with &hearts; by <a href="https://andrewgioia.com">Andrew Gioia</a>.
</p>
<a href="https://www.jsdelivr.com/package/npm/keyrune" class="mb-4">
<img src="https://data.jsdelivr.com/v1/package/npm/keyrune/badge">
</a>
<a class="github-button" href="https://github.com/andrewgioia/keyrune" data-icon="octicon-star" data-show-count="true" aria-label="Star andrewgioia/keyrune on GitHub" class="mb-8">
Star
</a>
</div>
<div class="w-full sm:w-1/5 flex flex-col">
<h5 class="mt-1 mb-4">
Project
</h5>
<menu class="flex flex-row flex-wrap sm:list mb-8 mt-1">
<li class="flex flex-row flex-align-center flex-justify-start">
<i class="ss ss-leg ss-white w-4 mr-2"></i>
<a href="/" class="mr-4">Overview</a>
</li>
<li class="flex flex-row flex-align-center flex-justify-start">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="top-px relative w-4 mr-2">
<polygon points="12 2 2 7 12 12 22 7 12 2"></polygon>
<polyline points="2 17 12 22 22 17"></polyline>
<polyline points="2 12 12 17 22 12"></polyline>
</svg>
<a href="/sets" class="mr-4">Set symbols</a>
</li>
<li class="flex flex-row flex-align-center flex-justify-start">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="top-px relative w-4 mr-2">
<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path>
<path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path>
</svg>
<a href="/docs" class="mr-4">Documentation</a>
</li>
<li class="flex flex-row flex-align-center flex-justify-start">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="top-px relative w-4 mr-2">
<path d="M15 4V2"></path>
<path d="M15 16v-2"></path>
<path d="M8 9h2"></path>
<path d="M20 9h2"></path>
<path d="M17.8 11.8 19 13"></path>
<path d="M15 9h0"></path>
<path d="M17.8 6.2 19 5"></path>
<path d="m3 21 9-9"></path>
<path d="M12.2 6.2 11 5"></path>
</svg>
<a href="https://andrewgioia.keyrune.com/examples" class="mr-4">Examples</a>
</li>
<li class="flex flex-row flex-align-center flex-justify-start">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="top-px relative w-4 mr-2">
<path d="M6 20h4"></path>
<path d="M14 10h4"></path>
<path d="M6 14h2v6"></path>
<path d="M14 4h2v6"></path>
<rect x="6" y="4" width="4" height="6"></rect>
<rect x="14" y="14" width="4" height="6"></rect>
</svg>
<a href="/cheatsheet" class="mr-4">Cheatsheet</a>
</li>
<li class="flex flex-row flex-align-center flex-justify-start">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="top-px relative w-4 mr-2">
<path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4"></path>
<path d="M9 18c-4.51 2-5-2-7-2"></path>
</svg>
<a href="https://github.com/andrewgioia/keyrune" target="blank" class="mr-4">GitHub project</a>
</li>
<li class="flex flex-row flex-align-center flex-justify-start">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="top-px relative w-4 mr-2">
<path d="m5.784 5.309-.956-.001c-2.112 0-3.825 1.68-3.825 3.754-.001 2.073 1.711 3.754 3.823 3.754l.956.001zm17.211 8.252c-.459 3.456-3.625 5.131-5.738 5.131l-5.737-.002c-2.112 0-4.681-1.581-5.736-5.133l.002-8.248 17.211.003zm-8.833-5.155V5.308zm-.638.134a1 1 0 0 0-1.366.366l-1.928 3.34a1 1 0 0 0 .366 1.366l3.34 1.928a1 1 0 0 0 1.366-.366l1.928-3.34a1 1 0 0 0-.366-1.366l-3.34-1.928z"></path>
</svg>
<a href="https://git.gioia.cloud/andrew/keyrune" target="blank" class="mr-4">Gitea mirror</a>
</li>
</menu>
</div>
<div class="w-full sm:w-3/5">
<h5 class="mt-1">
Licensing and terms of use
</h5>
<p>
Keyrune is free, unofficial "Fan Content" permitted under the Wizards of the Coast <a href="https://company.wizards.com/en/legal/fancontentpolicy" target="blank">Fan Content Policy</a>. The Magic: the Gathering&trade; set symbols themselves are copyright Wizards of the Coast, LLC, a subsidiary of Hasbro, Inc. Keyrune is not produced by, endorsed by, supported by, or affiliated with Wizards of the Coast, and I develop and distribute this project solely as a resource to enable other Fan Content.
</p>
<p>
The Keyrune font is licensed under the <a href="http://scripts.sil.org/OFL" target="blank">SIL OFL 1.1</a>. Please review the terms of that license for attribution, distribution, incorporation, and bundling requirements.
</p>
<p>
The source code and other project files, including CSS, SCSS, and his website, are licensed separately under the <a href="https://opensource.org/licenses/GPL-3.0" target="blank">GPL 3.0 License</a>. You're free to share or modify any of the source code or this website's design so long as you also distribute your project under the same license.
</p>
</div>
</div>
</footer>
</body>
</html>

1371
docs/sets/index.html Normal file

File diff suppressed because it is too large Load Diff

View File

14
docs/src/config.yaml Normal file
View File

@ -0,0 +1,14 @@
baseURL: https://keyrune4.lan
disableKinds:
- taxonomy
- term
- RSS
- sitemap
enableInlineShortcodes: true
languageCode: en-us
markup:
goldmark:
renderer:
unsafe: true
publishDir: ../
title: Keyrune

167
docs/src/content/_index.md Normal file
View File

@ -0,0 +1,167 @@
---
title: Keyrune
description: "Complete Magic: the Gathering set symbol icon font"
footer: border
---
<aside>
<h1>
Keyrune.css
</h1>
<p class="big">
Keyrune is a complete SVG-based icon library and toolkit for Magic: the Gathering set symbols. <span class="hidden xs:inline">Use them on your website just like any icon font, or print them outfor great looking card dividers and storage labels.</span>
</p>
<div class="flex flex-align-center flex-justify-center w-full mt-12 flex-col sm:flex-row">
<a href="https://github.com/andrewgioia/keyrune/latest" class="button mx-2 flex flex-justify-center mb-4">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-3">
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
<polyline points="7 10 12 15 17 10"></polyline>
<line x1="12" y1="15" x2="12" y2="3"></line>
</svg>
<span>
Download v{{% data/version %}}
</span>
</a>
<a href="docs/guide" class="button flex flex-justify-center mx-2 mb-4">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-3 top-px relative">
<path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"></path>
<path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"></path>
</svg>
<span>
<span class="hidden xs:inline">Read the getting started guide</span>
<span class="xs:hidden">Getting started guide</span>
</span>
</a>
</div>
</aside>
<dialog id="explode" class="relative overflow-hidden">
<div class="explode-inner flex flex-col flex-align-center flex-justify-center flex-shrink-0 relative">
<div class="isometric explode">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 436 480" class="border">
<path fill="none" d="M0 0h436v480H0z"/>
<path fill="var(--svg-border)" d="m436 54-30.889 71.493-24.754 17.454-13.483 17.014h-36.468l2.265 5.003 14.321 15.122 16.317 43.101v67.7l-32.99 17.18h-7.18l-31.851 20.266-34.909 18.207h-14.285l-32.244 24.227-35.145 18.308h-14.432l-32.285 24.266-24.229 12.607H72.7V223.144l16.356-43.092 14.282-15.121 2.253-4.97H68.68l-13.112-17.078-24.672-17.466L0 54h436zm-18.254 11.998H18.264l22.309 51.569 23.407 16.571 10.615 13.825h49.609l-10.767 23.748-14.014 14.838-14.724 38.795V413.95h16.126l20.746-10.795 34.695-26.078h15.501l31.665-16.495 34.657-26.04h15.349l31.845-16.609 34.363-21.864h7.736l23.929-12.461v-58.226l-14.687-38.795-14.052-14.838-10.767-23.786h49.268l10.956-13.825 23.408-16.505 22.309-51.635z"/>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 436 480" class="rarity">
<path fill="none" d="M0 0h436v480H0z"/>
<path fill="var(--rarity-default)" d="M357.087 141.571h-48.198c-1.704-3.702-2.926-6.401-2.926-6.401H130.046s-1.297 2.813-2.926 6.401H78.961l-8.579-10.766L87.36 113.42h261.29l16.978 17.385-8.541 10.766zm-39.95 33.767 14.279 15.056H104.593l14.242-15.056h198.302zm-35.292 137.188V249.5l7.14-9.545h21.637l7.14 9.545.038 40.168-35.955 22.858zm-81.85 42.583V249.5l7.139-9.545h21.637l7.14 9.545.038 78.603-35.954 27.006zm-81.823 42.573V249.5l7.14-9.545h21.599l7.177 9.545.038 121.138-35.954 27.044zM18.264 65.998l22.309 51.569 23.408 16.571 10.614 13.825h49.609l-10.766 23.748-14.015 14.838-14.724 38.795V413.95h16.126l20.747-10.795 34.694-26.078h15.501l31.665-16.495 34.657-26.04h15.349l31.845-16.609 34.363-21.864h7.736l23.929-12.461v-58.226l-14.687-38.795-14.052-14.838-10.766-23.786h49.267l10.956-13.825 23.408-16.505 22.309-51.635H18.264z"/>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 436 480" class="inner">
<path fill="none" d="M0 0h436v480H0z"/>
<path fill="var(--inner-default)" d="m146.911 239.955 7.177 9.545.038 121.138-35.954 27.044V249.5l7.14-9.545h21.599zm81.86 0h-21.637l-7.139 9.545v105.609l35.954-27.006-.038-78.603-7.14-9.545zm81.851 0h-21.637l-7.14 9.545v63.026l35.954-22.858-.037-40.168-7.14-9.545zm6.515-64.617 14.279 15.056H104.593l14.242-15.056h198.302zM130.046 135.17h175.917c.416.917.834 1.833 2.926 6.401h48.198l8.541-10.766-16.978-17.385H87.36l-16.978 17.385 8.579 10.766h48.159c1.629-3.588 2.926-6.401 2.926-6.401z"/>
</svg>
</div>
</div>
<div class="explode-text pb-6">
<h2 class="mt-10 mb-7">
Redrawn and refactored with full set coverage
</h2>
<p class="big">
Version 4 represents hundreds of hours of labor-of-love, with <strong>re-drawn, normalized glyphs</strong> for accurate sizing and <strong>multi-layer support</strong> for <em>every</em> set symbol!
</p>
<p class="big">
Style the rarity, border, and inner layers separately and perfectly, all with cross-browser <a href="examples">plug'n'play CSS classes</a>.
</p>
</div>
</dialog>
<article class="mt-16 mb-16">
<h2 class="mb-0 text-center">
<span style="box-shadow: -.1rem .1rem 0 #000, 0 .1rem 0 #000; background-color: #beb9b2; border-radius: 1rem; color: #111; width: 1.75rem; height: 1.75rem; display: inline-flex; align-items: center; justify-content: center;">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 32 32">
<title>3</title>
<path fill="#444" d="M11.824 17.025l-0.807-1.508 0.535-0.323c2.070-1.258 3.961-2.532 5.676-3.825s2.571-2.766 2.571-4.419c0-1.111-0.412-2.045-1.234-2.799-0.824-0.757-1.789-1.134-2.898-1.134-2.576 0-5.294 1.6-8.157 4.796l-1.342-1.024c2.981-4.526 6.626-6.79 10.936-6.79 1.903 0 3.518 0.467 4.849 1.401 1.508 1.043 2.262 2.461 2.262 4.257 0 1.292-0.54 2.55-1.616 3.77-0.611 0.719-1.69 1.653-3.233 2.802l-0.646 0.485c0.287-0.036 0.629-0.054 1.024-0.054 1.975 0 3.599 0.755 4.875 2.263s1.913 3.268 1.913 5.278c0 3.413-1.438 6.267-4.31 8.566-2.659 2.155-5.73 3.231-9.213 3.231-3.196 0-5.71-0.699-7.543-2.1l0.972-1.348c2.155 1.043 4.112 1.563 5.872 1.563 2.549 0 4.82-0.844 6.813-2.532 1.995-1.688 2.99-3.788 2.99-6.302 0-1.653-0.502-3.062-1.508-4.23-1.006-1.166-2.317-1.75-3.933-1.75-1.474 0.001-3.089 0.575-4.849 1.724z"></path>
</svg>
</span>,
<span style="box-shadow: -.1rem .1rem 0 #000, 0 .1rem 0 #000; background-color: #beb9b2; border-radius: 1rem; color: #111; width: 1.75rem; height: 1.75rem; display: inline-flex; align-items: center; justify-content: center;">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 32 32">
<title>tap</title>
<path fill="#444" d="M27.263 16.227h-12.874l4.714-3.355c-1.751-1.39-3.778-2.084-6.073-2.084-1.148 0-1.936 0.219-2.356 0.656-0.423 0.439-0.635 1.232-0.635 2.379 0 3.173 1.632 6.558 4.895 10.153l-3.715 3.762c-4.323-5.258-6.482-9.956-6.482-14.097 0-2.477 0.746-4.451 2.242-5.916 1.495-1.465 3.485-2.198 5.96-2.198 3.022 0 6.316 1.15 9.883 3.445l2.763-4.713 1.678 11.967z"></path>
</svg>
</span>: Draw 6 new features.
</h2>
<h2 class="mt-2 mb-16 text-center">You have no maximum hand size for the rest of the game.</h2>
<div class="grid grid-cols-6 grid-gap-x-8 grid-gap-y-12">
<div class="feature flex flex-col flex-align-center flex-justify-start text-center">
<svg width="80" height="80" viewBox="0 0 460 460" xmlns="http://www.w3.org/2000/svg" class="p-2">
<g transform="translate(-60 -58)" fill="none" fill-rule="evenodd">
<circle fill="#000" opacity="1" cx="290" cy="288" r="230"></circle>
<path d="M343.058 89.985c-109.36-29.303-221.77 35.597-251.073 144.957-29.303 109.36 35.597 221.77 144.957 251.073 109.36 29.303 221.77-35.597 251.073-144.957 29.303-109.36-35.597-221.77-144.957-251.073zM256.342 451.95l.276.71c1.172 3.187 3.562 5.776 6.644 7.2 3.082 1.422 6.603 1.562 9.788.387l48.355-17.774c3.184-1.175 6.706-1.035 9.787.388 3.082 1.424 5.472 4.013 6.644 7.2l.19.56c2.105 5.852-.304 12.37-5.71 15.448-93.23 22.17-187.912-30.724-217.912-121.736s14.67-189.84 102.81-227.453c5.144.502 9.544 3.91 11.32 8.762 2.578 6.977 10.317 10.55 17.3 7.99l15.73-5.803c3.186-1.176 6.707-1.036 9.79.387 3.08 1.423 5.47 4.012 6.643 7.198l.19.56c1.174 3.185 1.034 6.706-.39 9.788-1.422 3.082-4.01 5.472-7.197 6.644l-109.46 40.366c-3.187 1.172-5.777 3.562-7.2 6.644-1.422 3.082-1.562 6.603-.388 9.788l.19.56c1.172 3.186 3.562 5.775 6.643 7.198 3.082 1.423 6.603 1.563 9.788.388l80.06-29.483c3.184-1.174 6.705-1.034 9.787.388 3.082 1.423 5.472 4.013 6.644 7.2l.19.56c1.173 3.184 1.034 6.705-.39 9.787-1.422 3.08-4.01 5.47-7.197 6.643l-127.814 47.08c-3.186 1.17-5.776 3.56-7.2 6.643-1.42 3.082-1.56 6.603-.387 9.788l.19.56c1.172 3.186 3.562 5.775 6.643 7.198 3.08 1.423 6.602 1.563 9.787.388L297.72 226.4c3.184-1.175 6.705-1.036 9.787.387 3.082 1.423 5.472 4.012 6.644 7.198l.467 1.27c1.174 3.186 1.035 6.707-.388 9.79-1.424 3.08-4.014 5.47-7.2 6.643l-113 41.54c-3.187 1.172-5.777 3.562-7.2 6.644-1.422 3.08-1.562 6.603-.387 9.787l.19.56c1.17 3.185 3.56 5.775 6.643 7.198 3.08 1.423 6.603 1.562 9.787.388l51.798-19.06c3.186-1.174 6.707-1.034 9.79.39 3.08 1.422 5.47 4.01 6.643 7.197l.19.56c1.174 3.185 1.034 6.706-.39 9.788-1.422 3.083-4.01 5.473-7.197 6.644l-89.085 32.754c-3.185 1.17-5.774 3.56-7.197 6.643-1.423 3.083-1.562 6.604-.388 9.79l.19.56c1.17 3.185 3.56 5.775 6.643 7.197 3.082 1.423 6.603 1.563 9.788.388L304.563 336.3c3.185-1.173 6.706-1.034 9.788.39 3.083 1.422 5.473 4.01 6.644 7.197l.19.56c1.174 3.185 1.035 6.706-.388 9.788s-4.013 5.472-7.198 6.644l-74.954 27.54c-3.186 1.17-5.776 3.56-7.2 6.643-1.422 3.082-1.56 6.603-.387 9.788l.19.56c1.172 3.187 3.562 5.777 6.643 7.2 3.082 1.422 6.603 1.562 9.788.387l94.147-34.537c3.185-1.175 6.706-1.035 9.788.388s5.472 4.012 6.644 7.198c2.428 6.58-.893 13.887-7.447 16.384l-86.903 33.168c-3.18 1.18-5.764 3.574-7.18 6.658-1.414 3.083-1.547 6.603-.367 9.784l-.018-.09z" fill="#FFF"></path>
</g>
</svg>
<h3 class="mt-8 mb-4">Full Scryfall set code coverage</h3>
<p class="m-0">Every set officially recognized by <a href="https://https://scryfall.com/sets" target="blank">Scryfall</a> is aliased to the appropriate symbol, including all of their custom codes for promos, cubes, etc.</p>
</div>
<div class="feature flex flex-col flex-align-center flex-justify-start text-center">
<i class="ss ss-4bb ss-border" style="font-size: 6rem;"></i>
<h3 class="mt-8 mb-4">More unofficial set symbols</h3>
<p class="m-0">All of the missing <a href="sets/unofficial">convenience symbols</a> for popular but unofficial "sets" are now available, with some new fun ones 😜.</p>
</div>
<div class="feature flex flex-col flex-align-center flex-justify-start text-center">
<i class="ss ss-arn ss-border ss-inner" style="font-size: 6rem;"></i>
<h3 class="mt-8 mb-4">Set symbol size normalization!</h3>
<p class="m-0">When every glyph was squared off, Arabian Nights was too thin and Tempest too big. Now every symbol is relatively sized!</p>
</div>
<div class="feature flex flex-col flex-align-center flex-justify-start text-center">
<i class="ss ss-leg ss-rarity ss-border ss-rarity-mythic ss-rarity-gradient" style="font-size: 6rem;"></i>
<h3 class="mt-8 mb-4">Three targetable layers</h3>
<p class="m-0">In an icon font first, border, rarity, and inner layers are targetable via <code>::before</code>, <code>::after</code>, and <code>::marker</code> pseudo-elements.</p>
</div>
<div class="feature flex flex-col flex-align-center flex-justify-start text-center">
<i class="ss ss-atq ss-border" style="font-size: 6rem;"></i>
<h3 class="mt-8 mb-4">Overlays for print variations</h3>
<p class="m-0">Booster fun, box topper, pre-release, and some other print variations now have easy overlays if your project needs to differentiate.</p>
</div>
<div class="feature flex flex-col flex-align-center flex-justify-start text-center">
<svg width="80" height="80" viewBox="0, 0, 120, 120" xmlns="http://www.w3.org/2000/svg" class="p-2">
<path d="M5.041,0.631 C6.662,-0.21 8.686,-0.207 10.304,0.644 C11.51,1.181 12.408,2.179 13.323,3.097 C22.062,11.839 30.797,20.587 39.536,29.333 C40.23,30.027 40.95,30.695 41.573,31.456 C41.516,25.317 41.564,19.174 41.548,13.035 C41.548,9.466 45.212,6.518 48.698,7.196 C51.668,7.564 53.977,10.39 53.935,13.354 C53.967,24.44 53.935,35.53 53.951,46.616 C54.044,49.877 50.917,52.614 47.748,52.525 C36.787,52.538 25.828,52.518 14.867,52.534 C12.757,52.656 10.608,51.553 9.495,49.756 C8.6,48.422 8.322,46.737 8.574,45.167 C9.047,42.392 11.663,40.157 14.487,40.141 C20.575,40.137 26.663,40.128 32.751,40.147 C23.018,30.506 13.348,20.795 3.647,11.123 C2.438,9.93 1.498,8.369 1.418,6.64 C1.236,4.142 2.755,1.642 5.041,0.631 z" fill="var(--text-default)"/>
<path d="M110.277,0.388 C113.506,-0.926 117.497,1.252 118.357,4.583 C119.086,6.956 118.053,9.514 116.314,11.167 C106.58,20.821 96.917,30.545 87.145,40.153 C93.221,40.112 99.296,40.15 105.368,40.134 C108.409,40.073 111.198,42.625 111.444,45.647 C112,49.043 109.097,52.451 105.679,52.528 C94.276,52.544 82.87,52.499 71.471,52.55 C68.535,52.263 66.08,49.545 66.086,46.59 C66.035,35.402 66.08,24.21 66.064,13.019 C66.073,9.495 69.661,6.572 73.118,7.18 C76.037,7.506 78.397,10.208 78.438,13.131 C78.486,19.219 78.47,25.307 78.445,31.395 C87.558,22.221 96.719,13.092 105.854,3.941 C107.223,2.643 108.428,1.031 110.277,0.388 z" fill="var(--text-accent)"/>
<path d="M8.606,72.19 C9.147,69.475 11.733,67.33 14.506,67.32 C25.601,67.311 36.7,67.323 47.796,67.314 C51.035,67.346 53.961,70.227 53.926,73.495 C53.967,84.574 53.945,95.654 53.938,106.734 C53.993,110.347 50.379,113.397 46.827,112.783 C43.895,112.393 41.506,109.688 41.554,106.714 C41.551,100.668 41.525,94.621 41.57,88.574 C31.971,98.302 22.257,107.917 12.619,117.609 C11.382,118.932 9.687,119.972 7.832,119.988 C5.086,120.099 2.473,118.123 1.687,115.514 C0.932,113.257 1.731,110.686 3.449,109.087 C13.284,99.293 23.056,89.425 32.943,79.679 C27.021,79.746 21.096,79.688 15.174,79.711 C13.067,79.756 10.835,78.876 9.645,77.073 C8.625,75.688 8.277,73.866 8.606,72.19 z" fill="var(--text-accent)"/>
<path d="M68.376,68.759 C69.642,67.633 71.416,67.39 73.047,67.394 C83.922,67.41 94.8,67.381 105.675,67.406 C108.828,67.49 111.498,70.355 111.501,73.485 C111.607,75.874 110.12,78.262 107.926,79.218 C106.35,80.024 104.527,79.855 102.817,79.867 C97.621,79.826 92.421,79.861 87.225,79.794 C96.454,89 105.669,98.215 114.888,107.431 C116.218,108.812 117.884,110.062 118.357,112.026 C119.479,115.671 116.528,119.84 112.716,119.978 C110.469,120.189 108.448,118.856 107.022,117.238 C97.464,107.587 87.823,98.017 78.304,88.325 C78.352,94.036 78.307,99.75 78.326,105.461 C78.422,107.181 78.163,109.017 77.035,110.392 C75.122,113.049 71.033,113.637 68.433,111.642 C66.895,110.51 65.92,108.62 65.933,106.705 C65.917,95.734 65.933,84.76 65.926,73.789 C65.853,71.832 66.885,69.971 68.376,68.759 z" fill="var(--text-default)"/>
</svg>
<h3 class="mt-8 mb-4">Smaller SVG code</h3>
<p class="m-0">In addition to the redraw, each SVG has been optimized for file size to help reduce the overall weight of the font and library.</p>
</div>
</div>
</article>
<section class="flex flex-col flex-align-center mt-12 pt-24 pb-12 bg-black w-full text-white angle-top relative">
<h2 class="mb-8 px-4 text-center w-wide">
See Keyrune in the wild at these fine locations!
</h2>
<div class="flex flex-wrap flex-align-center flex-justify-center pb-4 w-wide">
<a href="https://mtgjson.com" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/mtgjson.svg" width="80">
</a>
<a href="https://tappedout.net" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/tappedout.svg" width="220">
</a>
<a href="https://tcgplayer.com" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/tcgplayer.svg" width="180">
</a>
<a href="https://whatsinstandard.com" target="blank" class="user bubble mx-8 my-2">
<img src="assets/svg/standard.svg" width="80">
</a>
<a href="https://untapped.gg" target="blank" class="user bubble mx-8 my-4 pt-2 px-2">
<img src="assets/svg/untapped.svg" width="200">
</a>
<a href="https://manatraders.com" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/manatraders.svg" width="160">
</a>
<a href="https://mtgaassistant.com" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/mtgaassistant.svg" width="72">
</a>
<a href="https://starcitygames.com/magic-the-gathering-cards-the-unofficial-ultimate-collectors-guide-ben-bleiweiss-non-autographed/" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/scg.svg" width="300">
</a>
<a href="https://cardsphere.com" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/cardsphere.svg" width="64">
</a>
<a href="https://echomtg.com" target="blank" class="user bubble mx-8 my-4 pt-1">
<img src="assets/svg/echomtg.svg" width="200">
</a>
<a href="https://github.com/andrewgioia/keyrune" target="blank" class="user bubble mx-8 my-4 pt-2">
<img src="assets/svg/yours.svg" width="150">
</a>
</div>
</section>

View File

@ -0,0 +1,166 @@
---
title: Set Icons
description: "Complete Magic: the Gathering set symbol icon font"
modal: true
---
<aside>
<form id="search" action="/sets" method="get" class="mt-8 flex flex-col flex-align-center">
<div class="input-wrapper w-full relative flex flex-row">
<input id="icon-filter" name="q" type="text" value="" placeholder="Search for a set symbol...">
<button class="button hidden md:block" type="submit">
Search
</button>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="clear hidden search-link" data-q="">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="search">
<circle cx="11" cy="11" r="8"></circle>
<line x1="21" y1="21" x2="16.65" y2="16.65"></line>
</svg>
</div>
<span class="flex flex-row flex-align-center flex-justify-between w-full mt-4">
<span class="search-left">Version {{% data/version %}} contains {{% data/count %}} <span class="hidden sm:inline">unique</span> icons.</span>
<span class="search-right hidden md:inline pr-8">Try <a href="?q=leg" class="search-link" data-q="leg">LEG</a> or <a href="?q=dragon" class="search-link" data-q="dragon">Dragon</a>!</span>
</span>
</form>
</aside>
<section id="icon-menu" class="mt-12 flex flex-row flex-justify-between w-wide">
<div class="flex flex-row flex-justify-start w-full">
<menu id="icon-rarity" class="flex flex-row group">
<li>
<input type="radio" name="rarity" value="common" id="rarity_common" data-class="ss-rarity-common" autocomplete="off" checked>
<label for="rarity_common" class="left">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 480 480" fill="#000">
<path d="M76.084 233.472c32.743.6 66.086 9.848 90.981 31.943 38.842 32.943 56.938 85.032 59.388 134.772-41.791 2.449-81.733-20.196-106.478-52.889-24.995-32.893-38.142-73.285-43.891-113.826zM314.734 263.465c24.395-21.245 57.239-29.043 88.932-29.293-7.549 55.138-30.794 112.026-77.384 145.319-20.696 15.847-47.24 21.446-72.885 20.546 2-50.889 20.246-104.078 61.337-136.572z"/>
<path d="M0 326.652c27.944-5.799 58.338-8.798 85.932-.5 15.647 16.247 26.045 37.043 43.191 51.99 16.797 16.746 39.642 24.444 61.137 33.243-51.089 2.049-105.328-6.299-147.519-37.143C25.095 361.895 11.498 344.749 0 326.652zM396.517 325.453c27.245-7.149 55.939-4.15 83.483-.5-13.047 29.693-40.492 50.339-68.486 65.036-38.292 16.997-80.883 24.245-122.724 22.295 25.345-11.547 52.889-21.595 71.185-43.69 13.197-13.498 20.696-32.594 36.542-43.141zM240.411 67.406c9.095 113.171 14.161 127.959 17.311 136.752 4.164.275 8.331.546 12.486.949 2.058-5.379 1.543-5.816 4.128-16.599 5.504-22.959 10.206-85.849 10.992-90.052 4.049 30.719 6.02 49.969 8.808 69.137 1.288 8.797 2.705 17.584 4.594 26.299 1.275 5.692 2.635 11.404 4.932 16.855 3.865 1.043 7.7 2.188 11.416 3.595 1.164-2.36 2.04-4.825 2.864-7.293 2.077-6.414 3.516-12.974 4.775-19.545 7.193-45.814 7.357-49.301 8.517-52.438 7.511 64.209 9.074 81.156 10.495 98.112-10.891 3.646-21.19 8.651-30.606 14.706-12.598 8.107-23.565 18.13-32.655 29.309a145.967 145.967 0 0 0-22.363 38.106c-6.77 17.051-10.589 34.923-12.65 52.876-.666 5.513-1.076 11.045-1.709 16.558-.23 1.472-.27 3.025-1.072 4.365h-.396c-.735-.991-.78-2.215-.987-3.346-.486-3.658-.756-7.335-1.137-11.002-.957-9.885-2.317-19.748-4.403-29.5-3.423-15.951-8.598-31.704-16.674-46.322-9.236-16.766-21.947-32.137-37.875-44.403a137.479 137.479 0 0 0-40.031-21.355c2.022-23.601 4.16-47.2 6.637-70.769 3.795-27.076 3.918-27.058 3.979-27.048 3.582 19.723 4.793 30.573 6.572 41.585 1.416 8.825 3.013 17.644 5.445 26.301 1.095 3.764 2.288 7.526 4.025 11.105 3.716-1.417 7.594-2.43 11.422-3.605 1.391-.426 1.498-.045 3.408-10.445 4.93-26.846 14.804-103.264 14.935-101.92 7.466 76.397 9.956 86.065 11.82 95.266.838 3.884 1.787 7.703 3.289 11.437 4.156-.331 8.311-.668 12.475-.913 3.117-8.667 4.899-15.997 6.008-25.038 9.434-76.926 11.085-113.454 11.225-111.72z"/>
</svg>
</label>
</li>
<li>
<input type="radio" name="rarity" value="uncommon" id="rarity_uncommon" data-class="ss-rarity-uncommon" autocomplete="off">
<label for="rarity_uncommon" class="center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 480 480" fill="#707883">
<path d="M76.084 233.472c32.743.6 66.086 9.848 90.981 31.943 38.842 32.943 56.938 85.032 59.388 134.772-41.791 2.449-81.733-20.196-106.478-52.889-24.995-32.893-38.142-73.285-43.891-113.826zM314.734 263.465c24.395-21.245 57.239-29.043 88.932-29.293-7.549 55.138-30.794 112.026-77.384 145.319-20.696 15.847-47.24 21.446-72.885 20.546 2-50.889 20.246-104.078 61.337-136.572z"/>
<path d="M0 326.652c27.944-5.799 58.338-8.798 85.932-.5 15.647 16.247 26.045 37.043 43.191 51.99 16.797 16.746 39.642 24.444 61.137 33.243-51.089 2.049-105.328-6.299-147.519-37.143C25.095 361.895 11.498 344.749 0 326.652zM396.517 325.453c27.245-7.149 55.939-4.15 83.483-.5-13.047 29.693-40.492 50.339-68.486 65.036-38.292 16.997-80.883 24.245-122.724 22.295 25.345-11.547 52.889-21.595 71.185-43.69 13.197-13.498 20.696-32.594 36.542-43.141zM240.411 67.406c9.095 113.171 14.161 127.959 17.311 136.752 4.164.275 8.331.546 12.486.949 2.058-5.379 1.543-5.816 4.128-16.599 5.504-22.959 10.206-85.849 10.992-90.052 4.049 30.719 6.02 49.969 8.808 69.137 1.288 8.797 2.705 17.584 4.594 26.299 1.275 5.692 2.635 11.404 4.932 16.855 3.865 1.043 7.7 2.188 11.416 3.595 1.164-2.36 2.04-4.825 2.864-7.293 2.077-6.414 3.516-12.974 4.775-19.545 7.193-45.814 7.357-49.301 8.517-52.438 7.511 64.209 9.074 81.156 10.495 98.112-10.891 3.646-21.19 8.651-30.606 14.706-12.598 8.107-23.565 18.13-32.655 29.309a145.967 145.967 0 0 0-22.363 38.106c-6.77 17.051-10.589 34.923-12.65 52.876-.666 5.513-1.076 11.045-1.709 16.558-.23 1.472-.27 3.025-1.072 4.365h-.396c-.735-.991-.78-2.215-.987-3.346-.486-3.658-.756-7.335-1.137-11.002-.957-9.885-2.317-19.748-4.403-29.5-3.423-15.951-8.598-31.704-16.674-46.322-9.236-16.766-21.947-32.137-37.875-44.403a137.479 137.479 0 0 0-40.031-21.355c2.022-23.601 4.16-47.2 6.637-70.769 3.795-27.076 3.918-27.058 3.979-27.048 3.582 19.723 4.793 30.573 6.572 41.585 1.416 8.825 3.013 17.644 5.445 26.301 1.095 3.764 2.288 7.526 4.025 11.105 3.716-1.417 7.594-2.43 11.422-3.605 1.391-.426 1.498-.045 3.408-10.445 4.93-26.846 14.804-103.264 14.935-101.92 7.466 76.397 9.956 86.065 11.82 95.266.838 3.884 1.787 7.703 3.289 11.437 4.156-.331 8.311-.668 12.475-.913 3.117-8.667 4.899-15.997 6.008-25.038 9.434-76.926 11.085-113.454 11.225-111.72z"/>
</svg>
</label>
</li>
<li>
<input type="radio" name="rarity" value="rare" id="rarity_rare" data-class="ss-rarity-rare" autocomplete="off">
<label for="rarity_rare" class="center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 480 480" fill="#b7a066">
<path d="M76.084 233.472c32.743.6 66.086 9.848 90.981 31.943 38.842 32.943 56.938 85.032 59.388 134.772-41.791 2.449-81.733-20.196-106.478-52.889-24.995-32.893-38.142-73.285-43.891-113.826zM314.734 263.465c24.395-21.245 57.239-29.043 88.932-29.293-7.549 55.138-30.794 112.026-77.384 145.319-20.696 15.847-47.24 21.446-72.885 20.546 2-50.889 20.246-104.078 61.337-136.572z"/>
<path d="M0 326.652c27.944-5.799 58.338-8.798 85.932-.5 15.647 16.247 26.045 37.043 43.191 51.99 16.797 16.746 39.642 24.444 61.137 33.243-51.089 2.049-105.328-6.299-147.519-37.143C25.095 361.895 11.498 344.749 0 326.652zM396.517 325.453c27.245-7.149 55.939-4.15 83.483-.5-13.047 29.693-40.492 50.339-68.486 65.036-38.292 16.997-80.883 24.245-122.724 22.295 25.345-11.547 52.889-21.595 71.185-43.69 13.197-13.498 20.696-32.594 36.542-43.141zM240.411 67.406c9.095 113.171 14.161 127.959 17.311 136.752 4.164.275 8.331.546 12.486.949 2.058-5.379 1.543-5.816 4.128-16.599 5.504-22.959 10.206-85.849 10.992-90.052 4.049 30.719 6.02 49.969 8.808 69.137 1.288 8.797 2.705 17.584 4.594 26.299 1.275 5.692 2.635 11.404 4.932 16.855 3.865 1.043 7.7 2.188 11.416 3.595 1.164-2.36 2.04-4.825 2.864-7.293 2.077-6.414 3.516-12.974 4.775-19.545 7.193-45.814 7.357-49.301 8.517-52.438 7.511 64.209 9.074 81.156 10.495 98.112-10.891 3.646-21.19 8.651-30.606 14.706-12.598 8.107-23.565 18.13-32.655 29.309a145.967 145.967 0 0 0-22.363 38.106c-6.77 17.051-10.589 34.923-12.65 52.876-.666 5.513-1.076 11.045-1.709 16.558-.23 1.472-.27 3.025-1.072 4.365h-.396c-.735-.991-.78-2.215-.987-3.346-.486-3.658-.756-7.335-1.137-11.002-.957-9.885-2.317-19.748-4.403-29.5-3.423-15.951-8.598-31.704-16.674-46.322-9.236-16.766-21.947-32.137-37.875-44.403a137.479 137.479 0 0 0-40.031-21.355c2.022-23.601 4.16-47.2 6.637-70.769 3.795-27.076 3.918-27.058 3.979-27.048 3.582 19.723 4.793 30.573 6.572 41.585 1.416 8.825 3.013 17.644 5.445 26.301 1.095 3.764 2.288 7.526 4.025 11.105 3.716-1.417 7.594-2.43 11.422-3.605 1.391-.426 1.498-.045 3.408-10.445 4.93-26.846 14.804-103.264 14.935-101.92 7.466 76.397 9.956 86.065 11.82 95.266.838 3.884 1.787 7.703 3.289 11.437 4.156-.331 8.311-.668 12.475-.913 3.117-8.667 4.899-15.997 6.008-25.038 9.434-76.926 11.085-113.454 11.225-111.72z"/>
</svg>
</label>
</li>
<li>
<input type="radio" name="rarity" value="mythic" id="rarity_mythic" data-class="ss-rarity-mythic" autocomplete="off">
<label for="rarity_mythic" class="center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 480 480" fill="#bf4427">
<path d="M76.084 233.472c32.743.6 66.086 9.848 90.981 31.943 38.842 32.943 56.938 85.032 59.388 134.772-41.791 2.449-81.733-20.196-106.478-52.889-24.995-32.893-38.142-73.285-43.891-113.826zM314.734 263.465c24.395-21.245 57.239-29.043 88.932-29.293-7.549 55.138-30.794 112.026-77.384 145.319-20.696 15.847-47.24 21.446-72.885 20.546 2-50.889 20.246-104.078 61.337-136.572z"/>
<path d="M0 326.652c27.944-5.799 58.338-8.798 85.932-.5 15.647 16.247 26.045 37.043 43.191 51.99 16.797 16.746 39.642 24.444 61.137 33.243-51.089 2.049-105.328-6.299-147.519-37.143C25.095 361.895 11.498 344.749 0 326.652zM396.517 325.453c27.245-7.149 55.939-4.15 83.483-.5-13.047 29.693-40.492 50.339-68.486 65.036-38.292 16.997-80.883 24.245-122.724 22.295 25.345-11.547 52.889-21.595 71.185-43.69 13.197-13.498 20.696-32.594 36.542-43.141zM240.411 67.406c9.095 113.171 14.161 127.959 17.311 136.752 4.164.275 8.331.546 12.486.949 2.058-5.379 1.543-5.816 4.128-16.599 5.504-22.959 10.206-85.849 10.992-90.052 4.049 30.719 6.02 49.969 8.808 69.137 1.288 8.797 2.705 17.584 4.594 26.299 1.275 5.692 2.635 11.404 4.932 16.855 3.865 1.043 7.7 2.188 11.416 3.595 1.164-2.36 2.04-4.825 2.864-7.293 2.077-6.414 3.516-12.974 4.775-19.545 7.193-45.814 7.357-49.301 8.517-52.438 7.511 64.209 9.074 81.156 10.495 98.112-10.891 3.646-21.19 8.651-30.606 14.706-12.598 8.107-23.565 18.13-32.655 29.309a145.967 145.967 0 0 0-22.363 38.106c-6.77 17.051-10.589 34.923-12.65 52.876-.666 5.513-1.076 11.045-1.709 16.558-.23 1.472-.27 3.025-1.072 4.365h-.396c-.735-.991-.78-2.215-.987-3.346-.486-3.658-.756-7.335-1.137-11.002-.957-9.885-2.317-19.748-4.403-29.5-3.423-15.951-8.598-31.704-16.674-46.322-9.236-16.766-21.947-32.137-37.875-44.403a137.479 137.479 0 0 0-40.031-21.355c2.022-23.601 4.16-47.2 6.637-70.769 3.795-27.076 3.918-27.058 3.979-27.048 3.582 19.723 4.793 30.573 6.572 41.585 1.416 8.825 3.013 17.644 5.445 26.301 1.095 3.764 2.288 7.526 4.025 11.105 3.716-1.417 7.594-2.43 11.422-3.605 1.391-.426 1.498-.045 3.408-10.445 4.93-26.846 14.804-103.264 14.935-101.92 7.466 76.397 9.956 86.065 11.82 95.266.838 3.884 1.787 7.703 3.289 11.437 4.156-.331 8.311-.668 12.475-.913 3.117-8.667 4.899-15.997 6.008-25.038 9.434-76.926 11.085-113.454 11.225-111.72z"/>
</svg>
</label>
</li>
<li>
<input type="radio" name="rarity" value="foil" id="rarity_foil" data-class="ss-rarity-foil" autocomplete="off">
<label for="rarity_foil" class="right">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 480 480" fill="#00afc9" class="foil">
<path d="M76.084 233.472c32.743.6 66.086 9.848 90.981 31.943 38.842 32.943 56.938 85.032 59.388 134.772-41.791 2.449-81.733-20.196-106.478-52.889-24.995-32.893-38.142-73.285-43.891-113.826zM314.734 263.465c24.395-21.245 57.239-29.043 88.932-29.293-7.549 55.138-30.794 112.026-77.384 145.319-20.696 15.847-47.24 21.446-72.885 20.546 2-50.889 20.246-104.078 61.337-136.572z"/>
<path d="M0 326.652c27.944-5.799 58.338-8.798 85.932-.5 15.647 16.247 26.045 37.043 43.191 51.99 16.797 16.746 39.642 24.444 61.137 33.243-51.089 2.049-105.328-6.299-147.519-37.143C25.095 361.895 11.498 344.749 0 326.652zM396.517 325.453c27.245-7.149 55.939-4.15 83.483-.5-13.047 29.693-40.492 50.339-68.486 65.036-38.292 16.997-80.883 24.245-122.724 22.295 25.345-11.547 52.889-21.595 71.185-43.69 13.197-13.498 20.696-32.594 36.542-43.141zM240.411 67.406c9.095 113.171 14.161 127.959 17.311 136.752 4.164.275 8.331.546 12.486.949 2.058-5.379 1.543-5.816 4.128-16.599 5.504-22.959 10.206-85.849 10.992-90.052 4.049 30.719 6.02 49.969 8.808 69.137 1.288 8.797 2.705 17.584 4.594 26.299 1.275 5.692 2.635 11.404 4.932 16.855 3.865 1.043 7.7 2.188 11.416 3.595 1.164-2.36 2.04-4.825 2.864-7.293 2.077-6.414 3.516-12.974 4.775-19.545 7.193-45.814 7.357-49.301 8.517-52.438 7.511 64.209 9.074 81.156 10.495 98.112-10.891 3.646-21.19 8.651-30.606 14.706-12.598 8.107-23.565 18.13-32.655 29.309a145.967 145.967 0 0 0-22.363 38.106c-6.77 17.051-10.589 34.923-12.65 52.876-.666 5.513-1.076 11.045-1.709 16.558-.23 1.472-.27 3.025-1.072 4.365h-.396c-.735-.991-.78-2.215-.987-3.346-.486-3.658-.756-7.335-1.137-11.002-.957-9.885-2.317-19.748-4.403-29.5-3.423-15.951-8.598-31.704-16.674-46.322-9.236-16.766-21.947-32.137-37.875-44.403a137.479 137.479 0 0 0-40.031-21.355c2.022-23.601 4.16-47.2 6.637-70.769 3.795-27.076 3.918-27.058 3.979-27.048 3.582 19.723 4.793 30.573 6.572 41.585 1.416 8.825 3.013 17.644 5.445 26.301 1.095 3.764 2.288 7.526 4.025 11.105 3.716-1.417 7.594-2.43 11.422-3.605 1.391-.426 1.498-.045 3.408-10.445 4.93-26.846 14.804-103.264 14.935-101.92 7.466 76.397 9.956 86.065 11.82 95.266.838 3.884 1.787 7.703 3.289 11.437 4.156-.331 8.311-.668 12.475-.913 3.117-8.667 4.899-15.997 6.008-25.038 9.434-76.926 11.085-113.454 11.225-111.72z"/>
</svg>
</label>
</li>
</menu>
<menu id="icon-extras" class="hidden md:flex flex-row">
<li>
<input type="checkbox" name="border" value="border" id="extras_border" data-class="ss-border" autocomplete="off">
<label for="extras_border" class="mr-2">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="10"></circle>
</svg>
</label>
</li>
<li>
<input type="checkbox" name="inner" value="inner" id="extras_inner" data-class="ss-inner" autocomplete="off">
<label for="extras_inner" class="mr-2">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="4"></circle>
</svg>
</label>
</li>
<li>
<input type="checkbox" name="gradient" value="gradient" id="extras_gradient" data-class="ss-rarity-gradient" autocomplete="off" disabled="disabled">
<label for="extras_gradient" class="disabled" disabled="disabled">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M5.5,3.5 L19.5,3.5 C20.605,3.5 21.5,4.395 21.5,5.5 L21.5,19.5 C21.5,20.605 20.605,21.5 19.5,21.5 L5.5,21.5 C4.395,21.5 3.5,20.605 3.5,19.5 L3.5,5.5 C3.5,4.395 4.395,3.5 5.5,3.5 z"></path>
<path d="M16.344,21.5 L21.5,16.344"></path>
<path d="M12.344,21.5 L21.5,12.344"></path>
<path d="M7.344,21.5 L21.5,7.344"></path>
<path d="M3.656,18.188 L18.344,3.5"></path>
</svg>
</label>
</li>
</menu>
</div>
<div class="hidden md:flex flex-row flex-justify-end">
<menu id="icon-transparent" class="flex flex-row">
<li>
<input type="checkbox" name="transparent" value="true" id="transparent" autocomplete="off" checked>
<label for="transparent" class="mr-4">
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="currentColor">
<path d="M19,2 C20.657,2 22,3.343 22,5 L22,19 C22,20.657 20.657,22 19,22 L5,22 C3.343,22 2,20.657 2,19 L2,5 C2,3.343 3.343,2 5,2 L19,2 z M4,14.667 L9.333,14.667 L9.333,20 L14.667,20 L14.667,14.667 L20,14.667 L20,9.333 L14.667,9.333 L14.667,4 L9.333,4 L9.333,9.333 L4,9.333 L4,14.667 z M14.667,9.333 L14.667,14.667 L9.333,14.667 L9.333,9.333 L14.667,9.333 z"></path>
</svg>
</label>
</li>
</menu>
<menu id="icon-density" class="flex flex-row group">
<li>
<input type="radio" name="density" value="roomy" id="size_roomy" autocomplete="off" checked>
<label for="size_roomy" class="left">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect x="3" y="3" width="7" height="7"></rect>
<rect x="14" y="3" width="7" height="7"></rect>
<rect x="14" y="14" width="7" height="7"></rect>
<rect x="3" y="14" width="7" height="7"></rect>
</svg>
</label>
</li>
<li>
<input type="radio" name="density" value="normal" id="size_normal" autocomplete="off">
<label for="size_normal" class="center">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect>
<line x1="3" y1="9" x2="21" y2="9"></line>
<line x1="3" y1="15" x2="21" y2="15"></line>
<line x1="9" y1="3" x2="9" y2="21"></line>
<line x1="15" y1="3" x2="15" y2="21"></line>
</svg>
</label>
</li>
<li>
<input type="radio" name="density" value="dense" id="size_dense" autocomplete="off">
<label for="size_dense" class="right">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="8" y1="6" x2="21" y2="6"></line>
<line x1="8" y1="12" x2="21" y2="12"></line>
<line x1="8" y1="18" x2="21" y2="18"></line>
<line x1="3" y1="6" x2="3.01" y2="6"></line>
<line x1="3" y1="12" x2="3.01" y2="12"></line>
<line x1="3" y1="18" x2="3.01" y2="18"></line>
</svg>
</label>
</li>
</menu>
</div>
</section>
<section id="results" class="bg-content mt-8 pt-8 pb-16 flex flex-col flex-align-center">
<div id="icons" class="w-wide" data-density="roomy">
{{% icons %}}
</div>
</section>

View File

@ -0,0 +1,6 @@
{
"author": "Andrew Gioia",
"git": "https://git.gioia.cloud/andrew/keyrune",
"name": "Keyrune",
"version": "4.0.0"
}

1100
docs/src/data/sets.json Normal file

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,29 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>{{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
<meta name="color-scheme" content="light dark">
<meta name="generator" content="Hand crafted">
<script type="text/javascript" src='{{ "assets/js/first.js" | relURL }}'></script>
<link rel="stylesheet" type="text/css" href='{{ "assets/css/docs.css" | relURL }}'>
<link rel="stylesheet" type="text/css" href='{{ "assets/css/keyrune.css" | relURL }}'>
<script type="text/javascript" src='{{ "assets/js/zepto.js" | relURL }}'></script>
<script type="text/javascript" src='{{ "assets/js/zepto.fx.js" | relURL }}'></script>
<script type="text/javascript" src='{{ "assets/js/glitz.js" | relURL }}'></script>
<script async defer src="https://buttons.github.io/buttons.js"></script>
</head>
<body>
{{ block "header" . }}
{{ end }}
{{ block "main" . }}
{{ end }}
{{ block "footer" . }}
{{ end }}
{{ block "modal" . }}
{{ end }}
</body>
</html>

View File

@ -0,0 +1,19 @@
{{ define "header" }}
{{ partial "header.html" . }}
{{ end }}
{{ define "main" }}
<main aria-role="main">
{{ .Content }}
</main>
{{ end }}
{{ define "footer" }}
{{ partial "footer.html" . }}
{{ end }}
{{ define "modal" }}
{{ if isset .Params "modal" }}
{{ partial "modal.html" . }}
{{ end }}
{{ end }}

View File

@ -0,0 +1,13 @@
{{ define "header" }}
{{ partial "header.html" . }}
{{ end }}
{{ define "main" }}
<main aria-role="main">
{{ .Content }}
</main>
{{ end }}
{{ define "footer" }}
{{ partial "footer.html" . }}
{{ end }}

View File

@ -0,0 +1,96 @@
<footer{{ with .Params.footer }} class="{{.}}"{{end}}>
<div class="w-wide flex flex-col sm:flex-row">
<div class="w-full sm:w-1/5 flex flex-col">
<h4 class="mt-0 mb-4">
Keyrune.css
</h4>
<p class="mt-1 mb-6 pr-12 relative top-px">
An MTG icon font built with &hearts; by <a href="https://andrewgioia.com">Andrew Gioia</a>.
</p>
<a href="https://www.jsdelivr.com/package/npm/keyrune" class="mb-4">
<img src="https://data.jsdelivr.com/v1/package/npm/keyrune/badge">
</a>
<a class="github-button" href="https://github.com/andrewgioia/keyrune" data-icon="octicon-star" data-show-count="true" aria-label="Star andrewgioia/keyrune on GitHub" class="mb-8">
Star
</a>
</div>
<div class="w-full sm:w-1/5 flex flex-col">
<h5 class="mt-1 mb-4">
Project
</h5>
<menu class="flex flex-row flex-wrap sm:list mb-8 mt-1">
<li class="flex flex-row flex-align-center flex-justify-start">
<i class="ss ss-leg ss-white w-4 mr-2"></i>
<a href="/" class="mr-4">Overview</a>
</li>
<li class="flex flex-row flex-align-center flex-justify-start">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="top-px relative w-4 mr-2">
<polygon points="12 2 2 7 12 12 22 7 12 2"></polygon>
<polyline points="2 17 12 22 22 17"></polyline>
<polyline points="2 12 12 17 22 12"></polyline>
</svg>
<a href="/sets" class="mr-4">Set symbols</a>
</li>
<li class="flex flex-row flex-align-center flex-justify-start">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="top-px relative w-4 mr-2">
<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path>
<path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path>
</svg>
<a href="/docs" class="mr-4">Documentation</a>
</li>
<li class="flex flex-row flex-align-center flex-justify-start">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="top-px relative w-4 mr-2">
<path d="M15 4V2"></path>
<path d="M15 16v-2"></path>
<path d="M8 9h2"></path>
<path d="M20 9h2"></path>
<path d="M17.8 11.8 19 13"></path>
<path d="M15 9h0"></path>
<path d="M17.8 6.2 19 5"></path>
<path d="m3 21 9-9"></path>
<path d="M12.2 6.2 11 5"></path>
</svg>
<a href="https://andrewgioia.keyrune.com/examples" class="mr-4">Examples</a>
</li>
<li class="flex flex-row flex-align-center flex-justify-start">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="top-px relative w-4 mr-2">
<path d="M6 20h4"></path>
<path d="M14 10h4"></path>
<path d="M6 14h2v6"></path>
<path d="M14 4h2v6"></path>
<rect x="6" y="4" width="4" height="6"></rect>
<rect x="14" y="14" width="4" height="6"></rect>
</svg>
<a href="/cheatsheet" class="mr-4">Cheatsheet</a>
</li>
<li class="flex flex-row flex-align-center flex-justify-start">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="top-px relative w-4 mr-2">
<path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4"></path>
<path d="M9 18c-4.51 2-5-2-7-2"></path>
</svg>
<a href="https://github.com/andrewgioia/keyrune" target="blank" class="mr-4">GitHub project</a>
</li>
<li class="flex flex-row flex-align-center flex-justify-start">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="top-px relative w-4 mr-2">
<path d="m5.784 5.309-.956-.001c-2.112 0-3.825 1.68-3.825 3.754-.001 2.073 1.711 3.754 3.823 3.754l.956.001zm17.211 8.252c-.459 3.456-3.625 5.131-5.738 5.131l-5.737-.002c-2.112 0-4.681-1.581-5.736-5.133l.002-8.248 17.211.003zm-8.833-5.155V5.308zm-.638.134a1 1 0 0 0-1.366.366l-1.928 3.34a1 1 0 0 0 .366 1.366l3.34 1.928a1 1 0 0 0 1.366-.366l1.928-3.34a1 1 0 0 0-.366-1.366l-3.34-1.928z"></path>
</svg>
<a href="https://git.gioia.cloud/andrew/keyrune" target="blank" class="mr-4">Gitea mirror</a>
</li>
</menu>
</div>
<div class="w-full sm:w-3/5">
<h5 class="mt-1">
Licensing and terms of use
</h5>
<p>
Keyrune is free, unofficial "Fan Content" permitted under the Wizards of the Coast <a href="https://company.wizards.com/en/legal/fancontentpolicy" target="blank">Fan Content Policy</a>. The Magic: the Gathering&trade; set symbols themselves are copyright Wizards of the Coast, LLC, a subsidiary of Hasbro, Inc. Keyrune is not produced by, endorsed by, supported by, or affiliated with Wizards of the Coast, and I develop and distribute this project solely as a resource to enable other Fan Content.
</p>
<p>
The Keyrune font is licensed under the <a href="http://scripts.sil.org/OFL" target="blank">SIL OFL 1.1</a>. Please review the terms of that license for attribution, distribution, incorporation, and bundling requirements.
</p>
<p>
The source code and other project files, including CSS, SCSS, and his website, are licensed separately under the <a href="https://opensource.org/licenses/GPL-3.0" target="blank">GPL 3.0 License</a>. You're free to share or modify any of the source code or this website's design so long as you also distribute your project under the same license.
</p>
</div>
</div>
</footer>

View File

@ -0,0 +1,70 @@
<header>
<mark class="flex flex-row flex-align-center flex-justify-start">
<a href="/" class="flex flex-row flex-align-center flex-justify-start mr-1">
<i class="ss ss-leg relative mr-2"></i>
<span>{{ .Site.Title }}</span>
</a>
<a href="https://github.com/andrewgioia/keyrune/archive/refs/heads/master.zip" target="blank">
<b>{{ .Site.Data.project.version }}</b>
</a>
</mark>
<a href="javascript:;" data-nav="mobile" id="toggle-nav">
<svg id="toggle-nav-svg" aria-hidden="true" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="4" y1="6" x2="20" y2="6" class="line top"></line>
<line x1="4" y1="12" x2="20" y2="12" class="line mid"></line>
<line x1="4" y1="18" x2="20" y2="18" class="line bot"></line>
</svg>
</a>
<nav>
<a href="sets">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polygon points="12 2 2 7 12 12 22 7 12 2"></polygon>
<polyline points="2 17 12 22 22 17"></polyline>
<polyline points="2 12 12 17 22 12"></polyline>
</svg>
<span>
Sets
</span>
</a>
<a href="docs">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path>
<path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path>
</svg>
<span>
Documentation
</span>
</a>
<a href="examples">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M15 4V2"></path>
<path d="M15 16v-2"></path>
<path d="M8 9h2"></path>
<path d="M20 9h2"></path>
<path d="M17.8 11.8 19 13"></path>
<path d="M15 9h0"></path>
<path d="M17.8 6.2 19 5"></path>
<path d="m3 21 9-9"></path>
<path d="M12.2 6.2 11 5"></path>
</svg>
<span>
Examples
</span>
</a>
<a href="https://github.com/andrewgioia/keyrune" target="blank">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4"></path>
<path d="M9 18c-4.51 2-5-2-7-2"></path>
</svg>
<span>
GitHub
</span>
</a>
<div id="mode" class="ml-2">
<input class="toggle" type="checkbox" id="switch" />
<label class="toggle" for="switch"></label>
</div>
</nav>
</header>

View File

@ -0,0 +1,159 @@
<object id="icon">
<details open disabled>
<summary tabindex="-1">
<span class="name">Set name</span>
</summary>
<div class="details">
<a href="sets" class="close">
<svg xmlns="http://www.w3.org/2000/svg" width="36" height="36" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>
</svg>
</a>
<div class="table flex flex-col p-8 w-full">
<div class="flex flex-col justify-start">
<h2 class="name mt-0 mb-4">
Set name
</h2>
<h3 class="class mt-0 mb-6">
Set code
</h3>
<div class="grid grid-cols-6">
<div class="grid-span-2 flex flex-col mb-6">
<label>Added</label>
<span class="version"></span>
</div>
<div class="grid-span-4 flex flex-col mb-6">
<label>Group</label>
<span class="group"></span>
</div>
<div class="grid-span-2 flex flex-col mb-4">
<label>Glyphs</label>
<ul class="glyphs m-0">
<li class="rarity">
<i></i>
<span class="ml-2"></span>
</li>
<li class="border">
<i></i>
<span class="ml-2"></span>
</li>
<li class="inner">
<i></i>
<span class="ml-2"></span>
</li>
</ul>
</div>
<div class="grid-span-4 flex flex-col mb-4">
<label class="aliases">Aliases</label>
<span class="aliases"></span>
</div>
</div>
<div class="actions flex flex-row flex-align-center flex-justify-start mt-2 mb-4">
<a href="javascript:;" id="copy-unicode" class="action-button unicode mr-6 flex-inline flex-align-center">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
<path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path>
</svg>
<span class="text-sm ml-2">Copy unicode</span>
<em>Unicode copied!</em>
</a>
<a href="javascript:;" id="copy-glyph" class="action-button glyph mr-6 flex-inline flex-align-center" data-tooltip="SVG copied!">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polyline points="16 18 22 12 16 6"></polyline>
<polyline points="8 6 2 12 8 18"></polyline>
</svg>
<span class="text-sm ml-2">Copy SVG</span>
<em>SVG copied!</em>
</a>
<a href="javascript:;" id="download-svg" class="action-button download flex-inline flex-align-center">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
<polyline points="7 10 12 15 17 10"></polyline>
<line x1="12" y1="15" x2="12" y2="3"></line>
</svg>
<span class="text-sm ml-2">Download</span>
<em>SVG downloaded!</em>
</a>
</div>
</div>
<div class="tags">
Tags
</div>
</div>
<div class="icon checkerboard flex flex-col flex-shrink-0">
<i class="ss"></i>
<div id="icon-controls" class="icon-controls flex flex-row flex-align-center flex-justify-center flex-shrink-0">
<menu id="icon-rarity-modal" class="flex flex-row group mr-2">
<li>
<label for="rarity_common" class="small left checked">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewbox="0 0 480 480" fill="#000">
<path d="M76.084 233.472c32.743.6 66.086 9.848 90.981 31.943 38.842 32.943 56.938 85.032 59.388 134.772-41.791 2.449-81.733-20.196-106.478-52.889-24.995-32.893-38.142-73.285-43.891-113.826zM314.734 263.465c24.395-21.245 57.239-29.043 88.932-29.293-7.549 55.138-30.794 112.026-77.384 145.319-20.696 15.847-47.24 21.446-72.885 20.546 2-50.889 20.246-104.078 61.337-136.572z"/>
<path d="M0 326.652c27.944-5.799 58.338-8.798 85.932-.5 15.647 16.247 26.045 37.043 43.191 51.99 16.797 16.746 39.642 24.444 61.137 33.243-51.089 2.049-105.328-6.299-147.519-37.143C25.095 361.895 11.498 344.749 0 326.652zM396.517 325.453c27.245-7.149 55.939-4.15 83.483-.5-13.047 29.693-40.492 50.339-68.486 65.036-38.292 16.997-80.883 24.245-122.724 22.295 25.345-11.547 52.889-21.595 71.185-43.69 13.197-13.498 20.696-32.594 36.542-43.141zM240.411 67.406c9.095 113.171 14.161 127.959 17.311 136.752 4.164.275 8.331.546 12.486.949 2.058-5.379 1.543-5.816 4.128-16.599 5.504-22.959 10.206-85.849 10.992-90.052 4.049 30.719 6.02 49.969 8.808 69.137 1.288 8.797 2.705 17.584 4.594 26.299 1.275 5.692 2.635 11.404 4.932 16.855 3.865 1.043 7.7 2.188 11.416 3.595 1.164-2.36 2.04-4.825 2.864-7.293 2.077-6.414 3.516-12.974 4.775-19.545 7.193-45.814 7.357-49.301 8.517-52.438 7.511 64.209 9.074 81.156 10.495 98.112-10.891 3.646-21.19 8.651-30.606 14.706-12.598 8.107-23.565 18.13-32.655 29.309a145.967 145.967 0 0 0-22.363 38.106c-6.77 17.051-10.589 34.923-12.65 52.876-.666 5.513-1.076 11.045-1.709 16.558-.23 1.472-.27 3.025-1.072 4.365h-.396c-.735-.991-.78-2.215-.987-3.346-.486-3.658-.756-7.335-1.137-11.002-.957-9.885-2.317-19.748-4.403-29.5-3.423-15.951-8.598-31.704-16.674-46.322-9.236-16.766-21.947-32.137-37.875-44.403a137.479 137.479 0 0 0-40.031-21.355c2.022-23.601 4.16-47.2 6.637-70.769 3.795-27.076 3.918-27.058 3.979-27.048 3.582 19.723 4.793 30.573 6.572 41.585 1.416 8.825 3.013 17.644 5.445 26.301 1.095 3.764 2.288 7.526 4.025 11.105 3.716-1.417 7.594-2.43 11.422-3.605 1.391-.426 1.498-.045 3.408-10.445 4.93-26.846 14.804-103.264 14.935-101.92 7.466 76.397 9.956 86.065 11.82 95.266.838 3.884 1.787 7.703 3.289 11.437 4.156-.331 8.311-.668 12.475-.913 3.117-8.667 4.899-15.997 6.008-25.038 9.434-76.926 11.085-113.454 11.225-111.72z"/>
</svg>
</label>
</li>
<li>
<label for="rarity_uncommon" class="small center">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewbox="0 0 480 480" fill="#707883">
<path d="M76.084 233.472c32.743.6 66.086 9.848 90.981 31.943 38.842 32.943 56.938 85.032 59.388 134.772-41.791 2.449-81.733-20.196-106.478-52.889-24.995-32.893-38.142-73.285-43.891-113.826zM314.734 263.465c24.395-21.245 57.239-29.043 88.932-29.293-7.549 55.138-30.794 112.026-77.384 145.319-20.696 15.847-47.24 21.446-72.885 20.546 2-50.889 20.246-104.078 61.337-136.572z"/>
<path d="M0 326.652c27.944-5.799 58.338-8.798 85.932-.5 15.647 16.247 26.045 37.043 43.191 51.99 16.797 16.746 39.642 24.444 61.137 33.243-51.089 2.049-105.328-6.299-147.519-37.143C25.095 361.895 11.498 344.749 0 326.652zM396.517 325.453c27.245-7.149 55.939-4.15 83.483-.5-13.047 29.693-40.492 50.339-68.486 65.036-38.292 16.997-80.883 24.245-122.724 22.295 25.345-11.547 52.889-21.595 71.185-43.69 13.197-13.498 20.696-32.594 36.542-43.141zM240.411 67.406c9.095 113.171 14.161 127.959 17.311 136.752 4.164.275 8.331.546 12.486.949 2.058-5.379 1.543-5.816 4.128-16.599 5.504-22.959 10.206-85.849 10.992-90.052 4.049 30.719 6.02 49.969 8.808 69.137 1.288 8.797 2.705 17.584 4.594 26.299 1.275 5.692 2.635 11.404 4.932 16.855 3.865 1.043 7.7 2.188 11.416 3.595 1.164-2.36 2.04-4.825 2.864-7.293 2.077-6.414 3.516-12.974 4.775-19.545 7.193-45.814 7.357-49.301 8.517-52.438 7.511 64.209 9.074 81.156 10.495 98.112-10.891 3.646-21.19 8.651-30.606 14.706-12.598 8.107-23.565 18.13-32.655 29.309a145.967 145.967 0 0 0-22.363 38.106c-6.77 17.051-10.589 34.923-12.65 52.876-.666 5.513-1.076 11.045-1.709 16.558-.23 1.472-.27 3.025-1.072 4.365h-.396c-.735-.991-.78-2.215-.987-3.346-.486-3.658-.756-7.335-1.137-11.002-.957-9.885-2.317-19.748-4.403-29.5-3.423-15.951-8.598-31.704-16.674-46.322-9.236-16.766-21.947-32.137-37.875-44.403a137.479 137.479 0 0 0-40.031-21.355c2.022-23.601 4.16-47.2 6.637-70.769 3.795-27.076 3.918-27.058 3.979-27.048 3.582 19.723 4.793 30.573 6.572 41.585 1.416 8.825 3.013 17.644 5.445 26.301 1.095 3.764 2.288 7.526 4.025 11.105 3.716-1.417 7.594-2.43 11.422-3.605 1.391-.426 1.498-.045 3.408-10.445 4.93-26.846 14.804-103.264 14.935-101.92 7.466 76.397 9.956 86.065 11.82 95.266.838 3.884 1.787 7.703 3.289 11.437 4.156-.331 8.311-.668 12.475-.913 3.117-8.667 4.899-15.997 6.008-25.038 9.434-76.926 11.085-113.454 11.225-111.72z"/>
</svg>
</label>
</li>
<li>
<label for="rarity_rare" class="small center">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewbox="0 0 480 480" fill="#b7a066">
<path d="M76.084 233.472c32.743.6 66.086 9.848 90.981 31.943 38.842 32.943 56.938 85.032 59.388 134.772-41.791 2.449-81.733-20.196-106.478-52.889-24.995-32.893-38.142-73.285-43.891-113.826zM314.734 263.465c24.395-21.245 57.239-29.043 88.932-29.293-7.549 55.138-30.794 112.026-77.384 145.319-20.696 15.847-47.24 21.446-72.885 20.546 2-50.889 20.246-104.078 61.337-136.572z"/>
<path d="M0 326.652c27.944-5.799 58.338-8.798 85.932-.5 15.647 16.247 26.045 37.043 43.191 51.99 16.797 16.746 39.642 24.444 61.137 33.243-51.089 2.049-105.328-6.299-147.519-37.143C25.095 361.895 11.498 344.749 0 326.652zM396.517 325.453c27.245-7.149 55.939-4.15 83.483-.5-13.047 29.693-40.492 50.339-68.486 65.036-38.292 16.997-80.883 24.245-122.724 22.295 25.345-11.547 52.889-21.595 71.185-43.69 13.197-13.498 20.696-32.594 36.542-43.141zM240.411 67.406c9.095 113.171 14.161 127.959 17.311 136.752 4.164.275 8.331.546 12.486.949 2.058-5.379 1.543-5.816 4.128-16.599 5.504-22.959 10.206-85.849 10.992-90.052 4.049 30.719 6.02 49.969 8.808 69.137 1.288 8.797 2.705 17.584 4.594 26.299 1.275 5.692 2.635 11.404 4.932 16.855 3.865 1.043 7.7 2.188 11.416 3.595 1.164-2.36 2.04-4.825 2.864-7.293 2.077-6.414 3.516-12.974 4.775-19.545 7.193-45.814 7.357-49.301 8.517-52.438 7.511 64.209 9.074 81.156 10.495 98.112-10.891 3.646-21.19 8.651-30.606 14.706-12.598 8.107-23.565 18.13-32.655 29.309a145.967 145.967 0 0 0-22.363 38.106c-6.77 17.051-10.589 34.923-12.65 52.876-.666 5.513-1.076 11.045-1.709 16.558-.23 1.472-.27 3.025-1.072 4.365h-.396c-.735-.991-.78-2.215-.987-3.346-.486-3.658-.756-7.335-1.137-11.002-.957-9.885-2.317-19.748-4.403-29.5-3.423-15.951-8.598-31.704-16.674-46.322-9.236-16.766-21.947-32.137-37.875-44.403a137.479 137.479 0 0 0-40.031-21.355c2.022-23.601 4.16-47.2 6.637-70.769 3.795-27.076 3.918-27.058 3.979-27.048 3.582 19.723 4.793 30.573 6.572 41.585 1.416 8.825 3.013 17.644 5.445 26.301 1.095 3.764 2.288 7.526 4.025 11.105 3.716-1.417 7.594-2.43 11.422-3.605 1.391-.426 1.498-.045 3.408-10.445 4.93-26.846 14.804-103.264 14.935-101.92 7.466 76.397 9.956 86.065 11.82 95.266.838 3.884 1.787 7.703 3.289 11.437 4.156-.331 8.311-.668 12.475-.913 3.117-8.667 4.899-15.997 6.008-25.038 9.434-76.926 11.085-113.454 11.225-111.72z"/>
</svg>
</label>
</li>
<li>
<label for="rarity_mythic" class="small center">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewbox="0 0 480 480" fill="#bf4427">
<path d="M76.084 233.472c32.743.6 66.086 9.848 90.981 31.943 38.842 32.943 56.938 85.032 59.388 134.772-41.791 2.449-81.733-20.196-106.478-52.889-24.995-32.893-38.142-73.285-43.891-113.826zM314.734 263.465c24.395-21.245 57.239-29.043 88.932-29.293-7.549 55.138-30.794 112.026-77.384 145.319-20.696 15.847-47.24 21.446-72.885 20.546 2-50.889 20.246-104.078 61.337-136.572z"/>
<path d="M0 326.652c27.944-5.799 58.338-8.798 85.932-.5 15.647 16.247 26.045 37.043 43.191 51.99 16.797 16.746 39.642 24.444 61.137 33.243-51.089 2.049-105.328-6.299-147.519-37.143C25.095 361.895 11.498 344.749 0 326.652zM396.517 325.453c27.245-7.149 55.939-4.15 83.483-.5-13.047 29.693-40.492 50.339-68.486 65.036-38.292 16.997-80.883 24.245-122.724 22.295 25.345-11.547 52.889-21.595 71.185-43.69 13.197-13.498 20.696-32.594 36.542-43.141zM240.411 67.406c9.095 113.171 14.161 127.959 17.311 136.752 4.164.275 8.331.546 12.486.949 2.058-5.379 1.543-5.816 4.128-16.599 5.504-22.959 10.206-85.849 10.992-90.052 4.049 30.719 6.02 49.969 8.808 69.137 1.288 8.797 2.705 17.584 4.594 26.299 1.275 5.692 2.635 11.404 4.932 16.855 3.865 1.043 7.7 2.188 11.416 3.595 1.164-2.36 2.04-4.825 2.864-7.293 2.077-6.414 3.516-12.974 4.775-19.545 7.193-45.814 7.357-49.301 8.517-52.438 7.511 64.209 9.074 81.156 10.495 98.112-10.891 3.646-21.19 8.651-30.606 14.706-12.598 8.107-23.565 18.13-32.655 29.309a145.967 145.967 0 0 0-22.363 38.106c-6.77 17.051-10.589 34.923-12.65 52.876-.666 5.513-1.076 11.045-1.709 16.558-.23 1.472-.27 3.025-1.072 4.365h-.396c-.735-.991-.78-2.215-.987-3.346-.486-3.658-.756-7.335-1.137-11.002-.957-9.885-2.317-19.748-4.403-29.5-3.423-15.951-8.598-31.704-16.674-46.322-9.236-16.766-21.947-32.137-37.875-44.403a137.479 137.479 0 0 0-40.031-21.355c2.022-23.601 4.16-47.2 6.637-70.769 3.795-27.076 3.918-27.058 3.979-27.048 3.582 19.723 4.793 30.573 6.572 41.585 1.416 8.825 3.013 17.644 5.445 26.301 1.095 3.764 2.288 7.526 4.025 11.105 3.716-1.417 7.594-2.43 11.422-3.605 1.391-.426 1.498-.045 3.408-10.445 4.93-26.846 14.804-103.264 14.935-101.92 7.466 76.397 9.956 86.065 11.82 95.266.838 3.884 1.787 7.703 3.289 11.437 4.156-.331 8.311-.668 12.475-.913 3.117-8.667 4.899-15.997 6.008-25.038 9.434-76.926 11.085-113.454 11.225-111.72z"/>
</svg>
</label>
<label for="rarity_foil" class="small right">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewbox="0 0 480 480" fill="#00afc9">
<path d="M76.084 233.472c32.743.6 66.086 9.848 90.981 31.943 38.842 32.943 56.938 85.032 59.388 134.772-41.791 2.449-81.733-20.196-106.478-52.889-24.995-32.893-38.142-73.285-43.891-113.826zM314.734 263.465c24.395-21.245 57.239-29.043 88.932-29.293-7.549 55.138-30.794 112.026-77.384 145.319-20.696 15.847-47.24 21.446-72.885 20.546 2-50.889 20.246-104.078 61.337-136.572z"/>
<path d="M0 326.652c27.944-5.799 58.338-8.798 85.932-.5 15.647 16.247 26.045 37.043 43.191 51.99 16.797 16.746 39.642 24.444 61.137 33.243-51.089 2.049-105.328-6.299-147.519-37.143C25.095 361.895 11.498 344.749 0 326.652zM396.517 325.453c27.245-7.149 55.939-4.15 83.483-.5-13.047 29.693-40.492 50.339-68.486 65.036-38.292 16.997-80.883 24.245-122.724 22.295 25.345-11.547 52.889-21.595 71.185-43.69 13.197-13.498 20.696-32.594 36.542-43.141zM240.411 67.406c9.095 113.171 14.161 127.959 17.311 136.752 4.164.275 8.331.546 12.486.949 2.058-5.379 1.543-5.816 4.128-16.599 5.504-22.959 10.206-85.849 10.992-90.052 4.049 30.719 6.02 49.969 8.808 69.137 1.288 8.797 2.705 17.584 4.594 26.299 1.275 5.692 2.635 11.404 4.932 16.855 3.865 1.043 7.7 2.188 11.416 3.595 1.164-2.36 2.04-4.825 2.864-7.293 2.077-6.414 3.516-12.974 4.775-19.545 7.193-45.814 7.357-49.301 8.517-52.438 7.511 64.209 9.074 81.156 10.495 98.112-10.891 3.646-21.19 8.651-30.606 14.706-12.598 8.107-23.565 18.13-32.655 29.309a145.967 145.967 0 0 0-22.363 38.106c-6.77 17.051-10.589 34.923-12.65 52.876-.666 5.513-1.076 11.045-1.709 16.558-.23 1.472-.27 3.025-1.072 4.365h-.396c-.735-.991-.78-2.215-.987-3.346-.486-3.658-.756-7.335-1.137-11.002-.957-9.885-2.317-19.748-4.403-29.5-3.423-15.951-8.598-31.704-16.674-46.322-9.236-16.766-21.947-32.137-37.875-44.403a137.479 137.479 0 0 0-40.031-21.355c2.022-23.601 4.16-47.2 6.637-70.769 3.795-27.076 3.918-27.058 3.979-27.048 3.582 19.723 4.793 30.573 6.572 41.585 1.416 8.825 3.013 17.644 5.445 26.301 1.095 3.764 2.288 7.526 4.025 11.105 3.716-1.417 7.594-2.43 11.422-3.605 1.391-.426 1.498-.045 3.408-10.445 4.93-26.846 14.804-103.264 14.935-101.92 7.466 76.397 9.956 86.065 11.82 95.266.838 3.884 1.787 7.703 3.289 11.437 4.156-.331 8.311-.668 12.475-.913 3.117-8.667 4.899-15.997 6.008-25.038 9.434-76.926 11.085-113.454 11.225-111.72z"/>
</svg>
</label>
</li>
</menu>
<menu id="preview-extras-modal" class="flex flex-row">
<li>
<label for="extras_border" class="small mr-1">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="10"></circle>
</svg>
</label>
</li>
<li>
<label for="extras_inner" class="small mr-1">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="4"></circle>
</svg>
</label>
</li>
<li>
<label for="extras_gradient" class="small disabled" disabled="disabled">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M5.5,3.5 L19.5,3.5 C20.605,3.5 21.5,4.395 21.5,5.5 L21.5,19.5 C21.5,20.605 20.605,21.5 19.5,21.5 L5.5,21.5 C4.395,21.5 3.5,20.605 3.5,19.5 L3.5,5.5 C3.5,4.395 4.395,3.5 5.5,3.5 z"></path>
<path d="M16.344,21.5 L21.5,16.344"></path>
<path d="M12.344,21.5 L21.5,12.344"></path>
<path d="M7.344,21.5 L21.5,7.344"></path>
<path d="M3.656,18.188 L18.344,3.5"></path>
</svg>
</label>
</li>
</menu>
</div>
</div>
</div>
</details>
</object>

View File

@ -0,0 +1,8 @@
{{- $scratch := newScratch -}}
{{- $scratch.Set "count" 0 -}}
{{- range $groups := .Site.Data.sets -}}
{{- range $sets := $groups.sets -}}
{{- $scratch.Add "count" 1 -}}
{{- end -}}
{{- end -}}
{{ $scratch.Get "count" }}

View File

@ -0,0 +1 @@
{{ .Site.Data.project.version }}

View File

@ -0,0 +1,46 @@
{{- range sort .Site.Data.sets "order" "asc" -}}
{{- if isset . "sets" -}}
{{- $group := . -}}
<div class="set-group" data-id="{{ $group.order }}" data-count="{{ len $group.sets }} ">
<div class="set-group-info sticky">
<h2 class="my-4 pr-8">
{{ .name }}
</h2>
<p class="mb-6 pr-8">
{{ .description }}
</p>
</div>
<div class="set-group-icons">
<div class="set-group-grid grid pt-2">
{{- range $index, $set := sort $group.sets "release" "asc" -}}
<figure
class="grid-span-1 checkerboard"
data-code="{{ $set.code }}"
data-name="{{ $set.name }}"
data-tags="{{ $set.tags | jsonify }}"
data-order="{{ $group.order }}"
data-group="{{ $group.name }}"
data-rarity="{{ $set.rarity }}"
data-border="{{ $set.border }}"
data-inner="{{ $set.inner }}"
data-version="{{ $set.version }}"
data-aliases="{{ $set.aliases | jsonify }}"
>
<i class="ss ss-rarity-common ss-{{ $set.code }} ss-fw"></i>
<span class="icon-code">{{ $set.code }}</span>
<span class="icon-name">{{ $set.display }}</span>
</figure>
{{- end -}}
</div>
</div>
</div>
{{- end -}}
{{- end -}}
<div id="search-empty" class="flex flex-col w-full text-center pt-8 hidden">
<p class="big mb-0">
No set symbols matched your search!
</p>
<p>
<a href="/sets" class="clear search-link" data-q="">Clear it</a> or try a cool one like <a href="?q=tmp" class="search-link" data-q="tmp">TMP</a> 😎
</p>
</div>

View File

@ -0,0 +1,145 @@
aside {
margin-top: 1rem;
text-align: center;
width: min(91.66667%, 900px);
> p.big {
font-size: 1.2rem;
line-height: 2rem;
padding: 0 0.5rem;
}
}
@media only screen and (min-width: 768px) {
aside > p.big {
font-size: 1.3rem;
padding: 0;
}
}
dialog {
background: var(--bg-content);
border: none;
border-radius: 1.5rem;
color: var(--text-default);
padding: 0;
width: calc(100% - 3rem);
}
@media only screen and (min-width: 768px) {
dialog {
border-radius: 2rem;
width: min(91.6667%, 1440px);
}
}
#explode {
display: flex;
flex-direction: column;
margin-top: 3rem;
> div.explode-inner {
width: 100%;
}
> div.explode-text {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
}
@media only screen and (min-width: 1025px) {
#explode {
flex-direction: row;
margin-top: 6rem;
> div.explode-inner {
width: 50%;
}
> div.explode-text {
padding-left: 0;
padding-right: 3rem;
}
}
}
//
// isometric icon
div.isometric {
align-self: stretch;
display: flex;
font-family: keyrune;
height: 12rem;
justify-content: center;
margin: 0;
perspective: 50rem;
position: relative;
width: 100%;
svg {
position: absolute;
&.border {
z-index: 1;
}
&.rarity {
z-index: 2;
}
&.inner {
z-index: 3;
}
}
&.explode {
svg.border {
animation: explode-border 16s ease-in-out infinite;
}
svg.rarity {
animation: explode-rarity 16s ease-in-out infinite;
}
svg.inner {
animation: explode-inner 16s ease-in-out infinite;
}
}
}
@keyframes explode-border {
0%, 40%, 100% {
transform: scale(1.4);
}
50%, 90% {
transform: translateX(-20%) translateY(-4%) rotateY(37.5deg) scale(1);
}
}
@keyframes explode-rarity {
0%, 40%, 100% {
transform: scale(1.4);
}
50%, 90% {
transform: translateX(2.5%) translateY(2.5%) rotateY(37.5deg) scale(1);
}
}
@keyframes explode-inner {
0%, 40%, 100% {
transform: scale(1.4);
}
50%, 90% {
transform: translateX(25%) translateY(10%) rotateY(37.5deg) scale(1);
}
}
@media only screen and (min-width: 1025px) {
div.isometric {
height: 100%;
}
}
//
// features
.feature {
grid-column: span 6 / span 6;
}
@media only screen and (min-width: 768px) {
.feature { grid-column: span 3 / span 3; }
}
@media only screen and (min-width: 1025px) {
.feature { grid-column: span 2 / span 2; }
}

View File

@ -0,0 +1,394 @@
$keyrune-ui: (
"black": (
"100": "#ddd",
"300": "#3a3a3a",
"500": "#202124",
"600": "#18191b",
"700": "#131417",
"900": "#000",
),
"blue": (
"300": "#29c9ff", //#74c0fc
"500": "#0060e4",
),
"tan": (
"100": "#f2f1f1",
"300": "#e0dfde",
"500": "#d2d1cf",
"700": "#8e8d88",
"900": "#575754",
),
"white": "#fff",
);
$keyrune-ui-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji,
Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
:root {
--bg-body: #{map.get($keyrune-ui, "white")}; // default page background
--bg-hover: #{map.get($keyrune-ui, "tan", "100")}; // slightly darker page accent
--bg-content: #{map.get($keyrune-ui, "tan", "300")}; // contrast background for white boxes
--bg-accent: #{map.get($keyrune-ui, "tan", "500")}; // slightly darker content accent
--bg-border: #{map.get($keyrune-ui, "black", "900")}; // top border
--bg-button: #{map.get($keyrune-ui, "white")}; // button background
--bg-active: #{map.get($keyrune-ui, "tan", "500")}; // button active state background
--icon-default: #{map.get($keyrune-ui, "black", "700")}; // default .ss rarity color
--link-default: #{map.get($keyrune-ui, "blue", "500")}; // primary brand color
--text-default: #{map.get($keyrune-ui, "black", "900")}; // default body text color
--text-accent: #{map.get($keyrune-ui, "tan", "700")}; // alternate body text color
--text-contrast: #{map.get($keyrune-ui, "white")}; // opposite of body text color
--svg-border: #{map.get($keyrune-ui, "white")}; // exploding svg border color
--rgba-fg: rgba(255,255,255,0.916667);
--rgba-modal: rgba(0, 0, 0, 0.75);
&[data-mode="dark"] {
--bg-body: #{map.get($keyrune-ui, "black", "500")};
--bg-hover: #{map.get($keyrune-ui, "black", "700")};
--bg-content: #{map.get($keyrune-ui, "black", "300")};
--bg-accent: #{map.get($keyrune-ui, "tan", "700")};
--bg-border: #{map.get($keyrune-ui, "tan", "900")};
--bg-button: #{map.get($keyrune-ui, "black", "600")};
--bg-active: #{map.get($keyrune-ui, "blue", "300")};
--icon-default: #{map.get($keyrune-ui, "black", "900")};
--link-default: #{map.get($keyrune-ui, "blue", "300")};
--text-default: #{map.get($keyrune-ui, "white")};
--text-accent: #{map.get($keyrune-ui, "tan", "500")};
--text-contrast: #{map.get($keyrune-ui, "black", "100")};
--svg-border: #{map.get($keyrune-ui, "tan", "900")};
--rgba-fg: rgba(0,0,0,0.9);
--rgba-modal: rgba(0, 0, 0, 0.5);
}
}
@font-face {
font-family: 'Beleren';
src: url( '../font/beleren.eot' );
src: url( '../font/beleren.woff' ) format( 'woff' ),
url( '../font/beleren.ttf' ) format( 'truetype' ),
url( '../font/beleren.svg' ) format( 'svg' );
font-weight: normal;
font-style: normal;
}
html {
font-family: #{$keyrune-ui-font-family};
font-size: 16px;
}
body {
align-items: center;
background: var(--bg-body);
border-top: 5px solid var(--bg-border);
color: var(--text-default);
display: flex;
flex-direction: column;
margin: 0;
//transition: background 100ms ease-in-out, color 100ms ease-in-out;
}
header {
align-items: center;
display: flex;
flex-direction: row;
height: 5rem;
justify-content: space-between;
width: 100%;
mark {
background: transparent;
color: var(--text-default);
flex-shrink: 0;
font-family: Beleren;
font-size: 1.5rem;
margin-left: 1.5rem;
i {
color: var(--text-default) !important;
}
b {
border: 0.1rem solid var(--text-default);
border-radius: 0.35rem;
font-family: #{$keyrune-ui-font-family};
font-size: 0.75rem;
font-weight: normal;
margin: 0 0 0 0.5rem;
padding: 0.2rem 0.4rem;
position: relative;
top: -0.2rem;
}
}
menu {
flex-grow: 1;
}
#toggle-nav {
position: absolute;
right: 1.5rem;
z-index: 20;
svg {
.line {
opacity: 1;
transform: rotate(0) translateY(0) translateX(0);
transform-origin: 1em 1em;
transition: transform 0.3s ease-in-out, opacity 0.2s ease-in-out;
&.top {
transform-origin: 6px 6px;
}
&.bot {
transform-origin: 3px 17px;
}
}
&.closed {
.line.top {
transform: rotate(45deg) scale(1.1);
}
.line.mid {
opacity: 0;
}
.line.bot {
transform: rotate(-45deg) scale(1.1);
}
}
}
}
nav {
transform: translateY(-100%);
flex-direction: column;
margin-right: 2.5rem;
> a {
align-items: center;
color: var(--text-default);
display: flex;
margin: 0 1rem;
> svg {
margin-right: 0.5rem;
}
> span {
text-decoration: underline transparent;
transition: text-decoration 150ms ease-in-out;
-webkit-text-underline-position: from-font;
text-underline-position: under-font;
}
&:hover span {
text-decoration-color: var(--text-default);
}
}
&.mobile {
background: var(--rgba-fg);
position: fixed;
top: 0;
left: 0;
padding-top: 1rem;
padding-bottom: 2.5rem;
width: 100%;
z-index: 10;
border-radius: 0 0 2rem 2rem;
transform: translateY(0);
transition: transform 200ms ease-in-out;
> a {
font-size: 1.75rem;
padding: 0.5rem 1rem;
> span {
padding-left: 0.5rem;
}
}
#hide-nav {
right: 0;
position: absolute;
top: 1rem;
}
#mode {
margin-top: 1rem;
text-align: center;
label.toggle {
height: 2.5rem;
width: 8rem;
border-radius: 1.5rem;
&::after {
font-size: 1.33rem;
width: 3rem;
height: 2.1rem;
}
}
input.toggle:checked + label::after {
left: calc(100% - 0.25rem);
}
}
}
}
}
@media only screen and (min-width: 768px) {
#toggle-nav {
display: none;
}
header {
mark {
margin-left: 2.5rem;
}
nav {
display: flex;
flex-direction: row;
transform: none;
}
}
}
main {
align-items: center;
display: flex;
flex-direction: column;
width: 100%;
}
section {
width: 100%;
}
article {
display: flex;
flex-direction: column;
width: min(83.3333%, 1200px);
}
footer {
background-color: #{map.get($keyrune-ui, "black", "700")};
color: #{map.get($keyrune-ui, "white")};
display: flex;
justify-content: center;
padding: 3rem 0;
width: 100%;
&.border {
border-top: 1px solid #{map.get($keyrune-ui, "black", "300")};
}
menu {
li {
margin-bottom: 0.5rem;
}
}
iframe html body {
background: var(--bg-body);
}
}
//
// dark/light toggle
#mode {
height: 2rem;
input.toggle {
height: 0;
width: 0;
visibility: hidden;
&:checked + label {
background: var(--bg-body);
&::after {
content: "\e024";
left: calc(100% - 0.2rem);
transform: translateX(-100%);
}
}
}
label.toggle {
cursor: pointer;
width: 4rem;
height: 1.75rem;
border: 2px solid var(--bg-accent);
display: inline-flex;
border-radius: 1rem;
position: relative;
transition: border-color 150ms ease-in-out;
&:hover {
border-color: var(--text-accent);
}
&::after {
content: "\e012";
color: var(--text-default);
font-family: keyrune;
position: absolute;
display: flex;
align-items: center;
justify-content: center;
top: 0.2rem;
left: 0.2rem;
width: 1.75rem;
height: 1.35rem;
background: var(--bg-content);
border-radius: 1rem;
transition: all 300ms ease-in-out;
}
&:active::after {
width: 2rem;
}
}
}
:root[data-mode="dark"] {
#mode label::after {
content: "\e024";
left: calc(100% - 0.2rem);
transform: translateX(-100%);
}
}
//
// design stuff
.angle {
&-top {
&::before {
content: '';
display: block;
height: 4rem;
background: var(--bg-body);
position: absolute;
top: 0;
width: 100%;
clip-path: polygon(0% 0%, 100% 0, 100% 0, 0% 100%);
}
}
}
.checkerboard {
background-image:
linear-gradient(45deg, var(--bg-hover) 25%, transparent 25%),
linear-gradient(45deg, transparent 75%, var(--bg-hover) 75%),
linear-gradient(45deg, transparent 75%, var(--bg-hover) 75%),
linear-gradient(45deg, var(--bg-hover) 25%, transparent 25%);
background-size: 1.5rem 1.5rem;
background-position: 0 0, 0 0, -0.75rem -0.75rem, 0.75rem 0.75rem;
}
.bg {
&-accent { background-color: var(--bg-accent); }
&-black { background-color: #{map.get($keyrune-ui, "black", "700")}; }
&-content { background-color: var(--bg-content); }
}

View File

@ -0,0 +1,646 @@
//
// icon menu buttons
menu {
list-style: none;
margin: 0;
padding: 0;
li {
display: flex;
margin: 0;
}
input[type="radio"],
input[type="checkbox"] {
height: 0;
width: 0;
visibility: hidden;
position: absolute;
}
label {
align-items: center;
cursor: pointer;
display: flex;
height: 3rem;
justify-content: center;
margin: 0 0.25rem;
width: 3.25rem;
background: var(--bg-button);
border: 1px solid #{map.get($keyrune-ui, "black", "900")};
border-radius: 0.625rem;
box-shadow: 2px 2px 0 0 #{map.get($keyrune-ui, "black", "900")};
position: relative;
&.small {
height: 2.5rem;
width: 2.75rem;
}
&:hover:not(.disabled) {
background: var(--bg-hover);
}
&.disabled,
&[disabled="disabled"] {
cursor: not-allowed;
opacity: 0.33;
}
}
input[type="radio"]:checked + label,
input[type="checkbox"]:checked + label,
label.checked {
background: var(--bg-active);
box-shadow: none;
color: #{map.get($keyrune-ui, "black", "900")};
top: 2px;
left: 2px;
}
&.group {
&#icon-rarity {
margin: 0 auto;
}
label {
margin: 0;
&.left {
border-radius: 0.625rem 0 0 0.625rem;
}
&.center {
border-radius: 0;
}
&.right {
border-radius: 0 0.625rem 0.625rem 0;
}
}
}
}
:root[data-mode="dark"] {
menu input#rarity_foil:checked + label svg,
menu label.checked svg.foil {
fill: #{map.get($keyrune-ui, "black", "900")};
}
menu input#rarity_common:not(:checked) + label svg {
fill: #{map.get($keyrune-ui, "white")};
}
}
@media only screen and (min-width: 1025px) {
menu.group#icon-rarity {
margin: 0 1rem 0 0;
}
}
//
// icon grid
#icons {
.set {
&-group {
display: flex;
flex-direction: column;
&-info {
background: var(--bg-content);
z-index: 20;
}
&-grid {
gap: 1rem;
grid-template-columns: repeat(2, minmax(0, 1fr));
margin-bottom: 1.5rem;
}
&.hidden {
display: none;
}
}
}
figure {
align-items: center;
background-color: var(--bg-body);
border-radius: 1rem;
cursor: pointer;
display: flex;
flex-direction: column;
justify-content: flex-start;
margin: 0;
padding: 0;
width: 100%;
&:hover {
background-color: var(--bg-hover);
animation: hover 200ms;
}
> .ss {
font-size: 3rem;
margin: 1rem 0;
&.ss-rarity-common:not(.ss-inner)::before {
color: var(--text-default) !important;
}
}
> span {
margin: 0 0.5rem 1.25rem;
&.icon-code {
display: none;
}
&.icon-name {
line-height: 1.33rem;
}
}
&.hidden {
display: none;
}
}
&[data-density="roomy"] {
figure > span.icon-name {
text-align: center;
}
}
&[data-density="normal"] {
div.grid {
gap: 1.5rem;
margin-bottom: 3rem;
}
div.sticky {
padding-bottom: 2rem;
}
figure {
> .ss {
font-size: 2.25rem;
margin: 1rem 0 0.75rem;
}
> span.icon-name {
display: none;
}
> span.icon-code {
display: inline;
margin: 0 0.5rem 1rem;
}
}
}
&[data-density="dense"] {
div.grid {
gap: 1rem;
margin-bottom: 2rem;
}
div.sticky {
padding-bottom: 1rem;
}
figure {
flex-direction: row;
> .ss {
font-size: 1.5rem;
margin: 1rem;
}
> span.icon-name {
display: none;
}
> span.icon-code {
display: inline;
margin: 1rem 1rem 1rem 0;
}
}
}
}
@keyframes hover {
0% {
background-color: var(--bg-body);
}
100% {
background-color: var(--bg-hover);
}
}
@media only screen and (min-width: 1025px) {
#icons .set {
&-group {
flex-direction: row;
&-info {
width: 20%;
padding-bottom: 3rem;
}
&-icons {
width: 80%;
}
&-grid {
grid-template-columns: repeat(6, minmax(0, 1fr));
gap: 2rem;
margin-bottom: 4rem;
}
}
}
}
// common dark mode needs to be true black
:root[data-mode="dark"] {
#icons figure .ss.ss-rarity-common.ss-inner::before {
color: #000 !important;
}
#icons figure .ss.ss-rarity-common.ss-border:not(.ss-inner)::after {
color: #000 !important;
}
}
//
// search box
form {
.input-wrapper {
svg {
position: absolute;
top: 1.25rem;
&.search {
left: 1.5rem;
}
&.clear {
cursor: pointer;
right: 8.5rem;
}
}
}
input[type="text"] {
align-self: stretch;
background: var(--bg-body);
border: 0.15rem solid var(--text-default);
box-shadow: inset 0 0.25rem 0 0 var(--bg-hover);
height: 3.6rem;
border-radius: 2rem;
color: var(--text-default);
font-size: 1.25rem;
padding: 0 2rem 0 3.5rem;
width: calc(100% - 5.5rem);
&::placeholder {
color: var(--bg-accent);
font-size: 1.25rem;
}
&:focus {
outline: none;
box-shadow: inset 0 0.25rem 0 0 var(--bg-hover),
0 0 0 1px var(--bg-body),
0 0 0 0.25rem #{map.get($keyrune-ui, "blue", "300")};
}
}
button.button {
border-color: var(--text-default);
border-radius: 0 2rem 2rem 0;
box-shadow: inset 0 0.25rem 0 0 var(--bg-hover);
cursor: pointer;
height:100%;
padding-right: 1.75rem;
position: absolute;
top: 0;
right: 0;
&:active,
&:focus {
left: auto;
top: 0;
right: 0;
box-shadow: inset 0 0.25rem 0 0 var(--bg-content);
}
}
.search-left {
width: 100%;
text-align: center;
}
}
@media only screen and (min-width: 769px) {
form .search-left {
width: auto;
text-align: left;
padding-left: 2rem;
}
}
//
// icon details modal
object {
width: 100vw;
height: 100vh;
padding: 0;
margin: 0;
position: fixed;
top: 0;
left: 0;
background: var(--rgba-modal);
//backdrop-filter: blur(0.5rem);
display: flex;
align-items: center;
justify-content: center;
visibility: hidden;
transition: visibility 200ms ease-in-out;
z-index: 100;
details {
background: var(--rgba-fg); //rgba(242,241,241,0.85);
box-shadow: 0 0 12rem 0 var(--icon-default);
display: flex;
flex-direction: column;
border-radius: 1.5rem;
position: relative;
opacity: 0;
transform: scale(1.1) translateY(0);
transition: opacity 200ms ease-in-out, transform 200ms ease-in-out;
overflow: hidden;
width: 91.66667vw;
summary {
//background: var(--bg-body);
//border-bottom: 1px solid var(--bg-accent);
display: none;
pointer-events: none;
}
.details {
display: flex;
flex-direction: column;
}
.close {
position: absolute;
top: 1.5rem;
right: 1.2rem;
z-index: 10;
}
.icon {
background-color: var(--bg-body);
//border-left: 1px solid var(--text-accent);
align-items: center;
display: flex;
justify-content: space-between;
padding: 2rem 0.5rem 1rem;
i.ss {
color: var(--text-default);
font-size: 8em;
line-height: 1.75ex;
padding-bottom: 1.5rem;
&.ss-rarity-common:not(.ss-inner)::before {
color: var(--text-default) !important;
}
}
&-controls {
display: none;
}
}
h3 {
background: #f4d4e9;
color: #df3ea2;
border: 1px solid #ed73be;
display: inline-flex;
align-self: flex-start;
padding: 2px 5px;
border-radius: 0.33rem;
}
.table {
justify-content: space-between;
font-size: 1.1rem;
label {
font-size: 1rem;
font-weight: bold;
margin-bottom: 0.25rem;
text-transform: uppercase;
&.aliases {
margin-bottom: 0.1rem;
}
}
.class,
.rarity,
.border,
.inner,
.aliases > span {
font-family: monospace;
}
ul.glyphs {
list-style: none;
margin: 0;
padding: 0;
li {
align-items: center;
display: flex;
flex-direction: row;
justify-content: flex-start;
i {
font-family: keyrune;
font-style: normal;
text-align: center;
width: 1.75em;
}
&.false {
display: none;
}
}
i {
font-size: 1.2rem;
width: 1.75em;
&::before,
&::after,
&::marker {
color: var(--text-default);
}
}
}
table.aliases {
border-spacing: 0;
width: 100%;
td.code {
font-family: monospace;
font-size: 1rem;
padding-right: 0.5rem;
}
td.set {
font-size: 1rem;
position: relative;
width: 100%;
&::before {
content: '&nbsp;';
visibility: hidden;
}
span {
position: absolute;
left: 0;
right: 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
.actions {
display: none;
a.action-button {
position: relative;
span {
text-decoration: underline transparent;
transition: text-decoration 150ms ease-in-out;
-webkit-text-underline-position: from-font;
text-underline-position: under-font;
}
&:hover span {
text-decoration-color: var(--text-default);
}
em {
font-style: normal;
display: flex;
width: auto;
margin: 0 auto;
background: var(--text-default);
position: absolute;
top: 0;
left: 50%;
white-space: nowrap;
min-height: 1.5rem;
color: var(--bg-body);
transform: translateX(-50%) translateY(-50%);
margin-top: -1rem;
opacity: 0;
font-size: 1rem;
padding: 0.25rem 0.75rem;
align-items: center;
justify-content: center;
border-radius: 0.5rem;
}
}
}
}
.tags {
display: flex;
font-size: 0.9rem;
margin-left: -2px;
padding: 0.5rem 0 0;
a {
background: var(--text-default);
border-radius: 2rem;
color: var(--bg-body);
margin: 0 0.5rem 0 0;
padding: 0.25rem 1rem 0.3rem;
&.card {
position: relative;
padding-left: 40px;
&::before {
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0' y='0' width='25.2' height='36' viewBox='0 0 70 100'%3E%3Cg id='Layer_1'%3E%3Cpath d='M10 0 L60 0 C65.523 0 70 4.477 70 10 L70 90 C70 95.523 65.523 100 60 100 L10 100 C4.477 100 0 95.523 0 90 L0 10 C0 4.477 4.477 0 10 0 z' fill='%23191511'/%3E%3Cpath d='M9.638 5.533 L60.362 5.533 C62.572 5.533 64.362 7.375 64.362 9.648 L64.362 90.353 C64.362 92.625 62.572 94.467 60.362 94.467 L9.638 94.467 C7.428 94.467 5.638 92.625 5.638 90.353 L5.638 9.648 C5.638 7.375 7.428 5.533 9.638 5.533 z' fill='%2351765C'/%3E%3Cpath d='M11.5 57.388 L58.5 57.388 L58.5 88.388 L11.5 88.388 L11.5 57.388 z' fill='%23B89A82'/%3E%3Cpath d='M11.5 23.798 L58.5 23.798 L58.5 50.464 L11.5 50.464 L11.5 23.798 z' fill='%2362A5C0'/%3E%3Cpath d='M23.002 37.274 C22.158 35.902 19.11 32.575 19.693 29.21 C25.668 37.92 34.696 38.018 44.438 37.62 C41.357 38.74 37.543 40.962 33.44 40.532 C31.004 44.713 28.025 42.796 23.736 42.796 C21.054 43.974 17.834 43.413 14.841 43.605 C16.593 43.381 17.422 41.732 18.853 41.107 C20.734 40.285 23.163 40.39 25.191 39.399' fill='%23B54048'/%3E%3Cpath d='M31.826 38.669 C30.084 38.669 28.672 37.656 28.672 36.407 C28.672 35.159 30.084 34.146 31.826 34.146 C33.568 34.146 34.98 35.159 34.98 36.407 C34.98 37.656 33.568 38.669 31.826 38.669 z' fill='%23B54048'/%3E%3Cpath d='M11.5 10.798 L58.5 10.798 L58.5 23.798 L11.5 23.798 L11.5 10.798 z' fill='%2380C2DD'/%3E%3Cpath d='M44.78 18.389 C-26.121 27.703 92.917 29.765 45.03 18.389' fill='%2335666C'/%3E%3C/g%3E%3C/svg%3E");
content: '';
display: block;
width: 25.2px;
height: 36px;
position: absolute;
top: 0;
left: 0;
transition: transform 150ms ease-in-out;
transform: rotate(-20deg) translateY(-3px) translateX(6px);
}
&:hover::before {
transform: rotate(-30deg) translateY(-3px) translateX(6px) scale(1.04);
}
}
}
}
}
&.active {
visibility: visible;
details {
opacity: 1;
transform: scale(1) translateY(-3rem);
}
}
}
@keyframes fadeup {
0% {
opacity: 0;
transform: translateX(-50%) translateY(-50%);
}
30%, 70% {
opacity: 1;
transform: translateX(-50%) translateY(-75%);
}
100% {
opacity: 0;
transform: translateX(-50%) translateY(-120%);
}
}
@media only screen and (min-width: 1025px) {
object details {
width: calc(16 * 2 * 16px * 1.75 + 2rem);
.details {
flex-direction: row;
min-width: 50%;
}
.icon {
width: calc(16 * 16px * 1.75);
i.ss {
font-size: 16em;
}
&-controls {
display: flex;
padding: 0 0 2rem;
}
}
.table {
.actions {
display: flex;
}
}
}
}

View File

@ -0,0 +1,155 @@
h1 {
font-family: Beleren;
font-size: 3rem;
font-weight: 600;
}
h2 {
font-size: 1.5rem;
}
@media only screen and (min-width: 1025px) {
h2 {
font-size: 1.75rem;
}
}
h3 {
font-size: 1.25rem;
font-weight: 600;
}
h4 {
font-family: Beleren;
font-size: 1.4rem;
font-weight: 600;
}
h5 {
font-size: 1.1rem;
font-weight: 600;
text-transform: uppercase;
}
p,
li,
span {
font-weight: 500;
line-height: 1.6rem;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
> a {
text-decoration: underline;
-webkit-text-underline-position: from-font;
text-underline-position: from-font;
&[target="blank"] {
&::after {
content: "\2197";
display: inline-block;
//font-family: keyrune;
margin-left: 0.1rem;
position: relative;
text-decoration: none;
top: 0;
transition: top 100ms ease-in-out;
}
&:hover::after {
top: -3px;
}
}
}
&.big {
font-size: 1.15rem;
font-weight: 400;
line-height: 1.875rem;
}
}
@media only screen and (min-width: 1025px) {
p.big {
font-size: 1.3rem;
line-height: 2rem;
}
}
a,
button {
color: inherit;
text-decoration: none;
&.button {
background: var(--bg-button);
border: 2px solid #{map.get($keyrune-ui, "black", "900")};
border-radius: 0.625rem;
box-shadow: 3px 3px 0 0 #{map.get($keyrune-ui, "black", "900")};
color: var(--text-default);
font-size: 1.25rem;
padding: 0.75rem 1.5rem 0.8rem;
position: relative;
//transition: background 125ms ease-in-out;
&:focus,
&:active {
box-shadow: none;
top: 3px;
left: 3px;
}
&:hover {
background: var(--bg-hover);
}
}
&.bubble {
position: relative;
> img,
> svg {
position: relative;
z-index: 1;
}
&::before {
content: '';
display: block;
position: absolute;
width: calc(100% + 2rem);
height: calc(100% + 2rem);
border-radius: 1rem;
background: #{map.get($keyrune-ui, "black", "500")};
top: -1rem;
left: -1rem;
z-index: 0;
transform: scale(0.5);
transition: opacity 100ms ease-in-out;
opacity: 0;
}
&:hover::before {
opacity: 1;
animation: bubble 200ms ease-in-out;
transform: scale(1);
}
&.light {
&::before {
background: var(--bg-hover);
}
&::before {
}
}
}
}
@keyframes bubble {
0% {
transform: scale(0.5);
}
80% {
transform: scale(1.1);
}
100% {
transform: scale(1);
}
}

View File

@ -0,0 +1,317 @@
.flex {
display: flex;
&-align {
&-center { align-items: center; }
&-start { align-items: flex-start; }
}
&-col {
flex-direction: column;
}
&-inline {
display: inline-flex;
}
&-justify {
&-between { justify-content: space-between; }
&-center { justify-content: center; }
&-end { justify-content: flex-end; }
&-start { justify-content: flex-start; }
}
&-row {
flex-direction: row;
}
&-shrink {
&-0 { flex-shrink: 0; }
}
&-wrap {
flex-wrap: wrap;
}
}
@media only screen and (min-width: 768px) {
.sm-flex-row { flex-direction: row; }
}
.grid {
display: grid;
&-cols {
&-1 {
grid-template-columns: repeat(1, minmax(0, 1fr));
}
&-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
&-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
&-4 {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
&-5 {
grid-template-columns: repeat(5, minmax(0, 1fr));
}
&-6 {
grid-template-columns: repeat(6, minmax(0, 1fr));
}
}
&-gap {
&-4 { gap: 1rem; }
&-8 { gap: 2rem; }
&-x {
&-4 { column-gap: 1rem; }
&-8 { column-gap: 2rem; }
&-12 { column-gap: 3rem; }
}
&-y {
&-4 { row-gap: 1rem; }
&-8 { row-gap: 2rem; }
&-12 { row-gap: 3rem; }
}
}
&-span {
&-1 { grid-column: span 1 / span 1; }
&-2 { grid-column: span 2 / span 2; }
&-3 { grid-column: span 3 / span 3; }
&-4 { grid-column: span 4 / span 4; }
&-5 { grid-column: span 5 / span 5; }
&-6 { grid-column: span 6 / span 6; }
}
}
.hidden {
display: none;
}
.m {
&-0 { margin: 0; }
&b {
&-0 { margin-bottom: 0; }
&-1 { margin-bottom: 0.25rem; }
&-2 { margin-bottom: 0.5rem; }
&-3 { margin-bottom: 0.75rem; }
&-4 { margin-bottom: 1rem; }
&-6 { margin-bottom: 1.5rem; }
&-7 { margin-bottom: 1.75rem; }
&-8 { margin-bottom: 2rem; }
&-12 { margin-bottom: 3rem; }
&-16 { margin-bottom: 4rem; }
}
&l {
&-1 { margin-left: 0.25rem; }
&-2 { margin-left: 0.5rem; }
&-4 { margin-left: 1rem; }
}
&r {
&-1 { margin-right: 0.25rem; }
&-2 { margin-right: 0.5rem; }
&-3 { margin-right: 0.75rem; }
&-4 { margin-right: 1rem; }
&-6 { margin-right: 1.5rem; }
}
&t {
&-0 { margin-top: 0; }
&-1 { margin-top: 0.25rem; }
&-2 { margin-top: 0.5rem; }
&-3 { margin-top: 0.75rem; }
&-4 { margin-top: 1rem; }
&-8 { margin-top: 2rem; }
&-10 { margin-top: 2.5rem; }
&-12 { margin-top: 3rem; }
&-16 { margin-top: 4rem; }
&-20 { margin-top: 5rem; }
&-24 { margin-top: 6rem; }
}
&x {
&-2 {
margin-left: 0.5rem;
margin-right: 0.5rem;
}
&-4 {
margin-left: 1rem;
margin-right: 1rem;
}
&-8 {
margin-left: 2rem;
margin-right: 2rem;
}
}
&y {
&-2 {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
&-4 {
margin-top: 1rem;
margin-bottom: 1rem;
}
}
}
.overflow {
&-hidden {
overflow: hidden;
}
}
.p {
&-2 { padding: 0.5rem; }
&-4 { padding: 1rem; }
&-8 { padding: 2rem; }
&b {
&-2 { padding-bottom: 0.5rem; }
&-4 { padding-bottom: 1rem; }
&-6 { padding-bottom: 1.5rem; }
&-12 { padding-bottom: 3rem; }
&-16 { padding-bottom: 4rem; }
}
&l {
&-4 { padding-left: 1rem; }
&-8 { padding-left: 2rem; }
&-12 { padding-left: 3rem; }
}
&r {
&-8 { padding-right: 2rem; }
&-12 { padding-right: 3rem; }
}
&t {
&-1 { padding-top: 0.25rem; }
&-2 { padding-top: 0.5rem; }
&-8 { padding-top: 2rem; }
&-24 { padding-top: 6rem; }
}
&x {
&-2 {
padding-left: 0.5rem;
padding-right: 0.5rem;
}
&-4 {
padding-left: 1rem;
padding-right: 1rem;
}
&-6 {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
&-8 {
padding-left: 2rem;
padding-right: 2rem;
}
&-12 {
padding-left: 3rem;
padding-right: 3rem;
}
}
&y {
&-4 {
padding-top: 1rem;
padding-bottom: 1rem;
}
&-8 {
padding-top: 2rem;
padding-bottom: 2rem;
}
&-12 {
padding-top: 3rem;
padding-bottom: 3rem;
}
}
}
.relative {
position: relative;
}
.sticky {
height: 0%;
position: sticky;
top: 0;
}
.text {
&-center { text-align: center; }
&-sm { font-size: 0.9rem; }
&-white { color: #fff; }
}
.top {
&-px { top: 1px; }
}
.w {
&-4 { width: 1rem; }
&-6 { width: 1.5rem; }
&-1\/5 { width: 20%; }
&-1\/4 { width: 25%; }
&-2\/5 { width: 40%; }
&-1\/2 { width: 50%; }
&-3\/5 { width: 60%; }
&-3\/4 { width: 75%; }
&-4\/5 { width: 80%; }
&-11\/12 { width: min(91.6667%, 1440px); }
&-full { width: 100%; }
&-wide {
width: calc(100% - 3rem);
}
}
@media only screen and (min-width: 768px) {
.w-wide {
width: min(91.66667%, 1440px);
}
}
//
// all other media queries
@media only screen and (min-width: 512px) {
.xs\:inline {
display: inline;
}
.xs\:hidden {
display: none;
}
}
@media only screen and (min-width: 768px) {
.sm\:inline {
display: inline;
}
.sm\:hidden {
display: none;
}
.sm\:flex-row {
flex-direction: row;
}
.sm\:w-1\/5 {
width: 20%;
}
.sm\:w-3\/5 {
width: 60%;
}
.sm\:w-3\/5 {
width: 60%;
}
.sm\:list {
display: list-item;
list-style: none;
}
}
@media only screen and (min-width: 1025px) {
.md\:block {
display: block;
}
.md\:flex {
display: flex;
}
.md\:inline {
display: inline;
}
}

View File

@ -0,0 +1,6 @@
@use "sass:map";
@import "utils";
@import "layout";
@import "type";
@import "home";
@import "sets";

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

Binary file not shown.

Binary file not shown.

File diff suppressed because it is too large Load Diff

After

Width:  |  Height:  |  Size: 219 KiB

Binary file not shown.

Binary file not shown.

View File

@ -0,0 +1,5 @@
(function () {
var mode = localStorage.getItem("mode");
if (mode === "dark") document.documentElement.dataset.mode = 'dark';
else if (mode === "light") document.documentElement.dataset.mode = 'light';
})();

View File

@ -0,0 +1,316 @@
//
// toggle non-rarity classes for icon instances on icons page
function iconsToggleClass(classnames, label, off) {
if (off) {
$('#icons i.ss').each(function(index, icon) {
$(icon).removeClass(classnames);
});
$('details div.icon i').removeClass(classnames);
$('#preview-extras-modal label[for="extras_'+label+'"]').removeClass('checked');
} else {
$('#icons i.ss').each(function(index, icon) {
$(icon).toggleClass(classnames);
});
$('details div.icon i').toggleClass(classnames);
$('#preview-extras-modal label[for="extras_'+label+'"]').toggleClass('checked');
}
}
//
// rarity toggle handling on icons page
function iconsChangeRarity(rarity) {
// change each icon in the results
$('#icons i.ss').each(function(index, icon) {
$(icon).removeClass('ss-rarity-common ss-rarity-uncommon ss-rarity-rare ss-rarity-mythic ss-rarity-foil');
$(icon).addClass('ss-rarity-'+rarity);
});
// change the modal
$('#icon-rarity-modal label').removeClass('checked');
$('#icon-rarity-modal label[for="rarity_'+rarity+'"]').addClass('checked');
$('details div.icon i').removeClass('ss-rarity-common ss-rarity-uncommon ss-rarity-rare ss-rarity-mythic ss-rarity-foil');
$('details div.icon i').addClass('ss-rarity-'+rarity);
// for commons, disable the gradient
if (rarity == "common") {
$('#extras_gradient').attr('disabled', 'disabled').prop('checked', false);
$('label[for="extras_gradient"]').attr('disabled', 'disabled').addClass('disabled');
iconsToggleClass('ss-rarity-gradient', 'gradient', true);
} else {
$('#extras_gradient').attr('disabled', null);
$('label[for="extras_gradient"]').attr('disabled', null).removeClass('disabled');
}
}
//
// get the current values of all icon page menu items
function getIconDisplaySettings() {
let classes = '';
classes += $('#icon-rarity input:checked').data('class');
$('#icon-extras input:checked').each(function(index, extra) {
classes += ' '+$(extra).data('class');
});
return classes;
}
//
// icon search filtering
function filterIcons(q) {
// define some empty variables
let code = '';
let tags = Object;
let group = '';
let parent = '';
// set the URL to show the param
if (q.length > 0) {
window.history.replaceState({'q':q,}, "Set icon search results", '?q='+q);
$('#search svg.clear').removeClass('hidden');
} else {
window.history.replaceState({'q':'',}, "Set icons", '/sets');
$('#search svg.clear').addClass('hidden');
}
// iterate over each icon and show/hide along with its parent group
$('#icons figure').each(function() {
code = $(this).data('code');
tags = $(this).data('tags');
group = $(this).data('order');
parent = $('.set-group[data-id="'+group+'"]');
// show/hide icons based on query index
if (code.indexOf(q) >= 0 || Object.values(tags).indexOf(q) >= 0) {
$(this).removeClass('hidden');
} else {
$(this).addClass('hidden');
}
// poll for group's non-hidden count and hide it if there are none
if (parent.children().children().children('figure:not(.hidden)').length == 0) {
parent.addClass('hidden');
} else {
parent.removeClass('hidden');
}
});
// if there are 0 results, show something
if ($('#icons .set-group:not(.hidden)').length == 0) {
$('#search-empty').removeClass('hidden');
} else {
$('#search-empty').addClass('hidden');
}
}
function outputAliases(aliases) {
let html = '<table class="aliases">';
aliases.forEach(function(alias, index) {
html += '<tr><td class="code">'+alias.code+'</td><td class="set"><span title="'+alias.name+' ('+alias.release+')">'+alias.name+'</span></td></tr>';
});
return html+'</table>';
}
//
// icons page modal handling
function openModal(icon) {
// get the data vars from the figure that was clicked
let code = icon.data('code');
let name = icon.data('name');
let tags = icon.data('tags');
let tagp = '';
let tagc = '';
let group = icon.data('group');
let rarity = (icon.data('rarity')) ? icon.data('rarity') : 'n/a';
let border = (icon.data('border')) ? icon.data('border') : 'n/a';
let inner = (icon.data('inner')) ? icon.data('inner') : 'n/a';
let version = icon.data('version');
let classes = getIconDisplaySettings();
// format any aliases into spans
let aliases = (icon.data('aliases') == false)
? 'none'
: outputAliases(Object.values(icon.data('aliases')));
// format the tags into spans
tags.forEach(function(item, index) {
// check if we're linking to a card with [[card]]
const re = /\[\[(.*?)\]\]/g;
if (item.match(re)) {
tagc = item.substring(2, item.length -2).split("|");
tagp = tagp+'<a href="https://scryfall.com/search?q=set:'+tagc[1]+' '+tagc[0]+'" target="blank" class="card">'+tagc[0]+'</a>';
// otherwise link to search
} else {
tagp = tagp+'<a href="?q='+item+'">'+item+'</a>';
}
});
// update the fields
$('details div.icon i').attr('class', 'ss ss-'+code+' '+classes);
$('details div.table h2.name').html(name);
$('details div.table h3.class').html(code);
$('details div.table span.group').html(group);
$('details div.table li.rarity span').html(rarity);
$('details div.table li.rarity i').html('&#x'+rarity);
$('details div.table li.border').attr('class', 'border '+icon.data('border')+'');
$('details div.table li.border span').html(border);
$('details div.table li.border i').html('&#x'+border);
$('details div.table li.inner').attr('class', 'inner '+icon.data('inner')+'');
$('details div.table li.inner span').html(inner);
$('details div.table li.inner i').html('&#x'+inner);
$('details div.table span.version').html(version);
$('details div.table span.aliases').html(aliases);
$('details div.tags').html(tagp);
// specific function bindings
$('#copy-unicode').on('click', function() {
navigator.clipboard.writeText(rarity).then(function() {
$('#copy-unicode em').html('Unicode copied!').animate('fadeup', 1200, 'ease-in-out');
}, function(err) {
$('#copy-unicode em').html('Error copying').animate('fadeup', 1200, 'ease-in-out');
});
});
$('#copy-glyph').on('click', function() {
navigator.clipboard.writeText($('details div.table li.rarity i').html()).then(function() {
$('#copy-glyph em').html('SVG copied!').animate('fadeup', 1200, 'ease-in-out');
}, function(err) {
$('#copy-glyph em').html('Error copying').animate('fadeup', 1200, 'ease-in-out');
});
});
$('#download-svg').on('click', function() {
$('#download-svg em').html('Coming soon!').animate('fadeup', 1200, 'ease-in-out');
});
// show the modal
window.history.replaceState({'i':code,}, "Set icon details", '?i='+code);
$('object').addClass('active');
}
function closeModal() {
$('object').removeClass('active');
window.history.replaceState({'q':'',}, "Set icons", '/sets');
}
//
// onload interactions
Zepto(function($){
//
// mobile nav
$('header').on('click', '#toggle-nav', function(e) {
$('nav').toggleClass('mobile');
$('#toggle-nav-svg').toggleClass('closed');
});
//
// dark/light mode
let toggle = $('#switch');
let cookie = localStorage.getItem('mode');
if (cookie) {
if (cookie == 'dark') {
document.documentElement.dataset.mode = 'dark';
toggle.prop('checked', 'checked');
} else if (cookie == 'light') {
document.documentElement.dataset.mode = 'light';
toggle.prop('checked', false);
}
}
else if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.documentElement.dataset.mode = 'dark';
toggle.prop('checked', 'checked');
localStorage.setItem('mode', 'dark');
} else {
localStorage.setItem('mode', 'light');
}
toggle.on('change', function() {
if (toggle.prop('checked')) {
document.documentElement.dataset.mode = 'dark';
localStorage.setItem('mode', 'dark');
} else {
document.documentElement.dataset.mode = 'light';
localStorage.setItem('mode', 'light');
}
});
//
// filter icons if we have a ?q=, modal if we have an ?i=
let url = new URLSearchParams(window.location.search);
if (url.get('q')) {
filterIcons(url.get('q'));
$('#icon-filter').val(url.get('q'));
}
if (url.get('i')) {
let icon = $('figure[data-code="'+url.get('i')+'"]');
if (icon) {
openModal(icon);
}
}
//
// live icon filter via search box
$('#icon-filter').on('input', function() {
filterIcons($(this).val());
});
//
// icon filter clear button
$('.search-link').on('click', function(e) {
e.preventDefault();
filterIcons($(this).data('q'));
$('#icon-filter').val($(this).data('q'));
});
//
// icon display menus
$('#icon-menu').on('change', 'input[type=radio][name="density"]', function() {
$('#icons').data('density', $(this).val());
});
$('#icon-menu').on('change', 'input[type=radio][name="rarity"]', function() {
iconsChangeRarity($(this).val());
});
$('#icon-menu').on('change', 'input[type=checkbox][name="border"]', function() {
iconsToggleClass('ss-border', 'border');
});
$('#icon-menu').on('change', 'input[type=checkbox][name="inner"]', function() {
iconsToggleClass('ss-inner', 'inner');
});
$('#icon-menu').on('change', 'input[type=checkbox][name="gradient"]', function() {
iconsToggleClass('ss-rarity-gradient', 'gradient');
});
$('#icon-menu').on('change', 'input[type=checkbox][name="transparent"]', function() {
$('#icons figure').each(function(index, figure) {
$(figure).toggleClass('checkerboard');
});
});
//
// icon modal
$('#icons').on('click', 'figure', function() {
openModal($(this));
});
$('object').on('click', '.close', function(e) {
e.preventDefault();
closeModal();
})
});

View File

@ -0,0 +1,123 @@
// Zepto.js
// (c) 2010-2016 Thomas Fuchs
// Zepto.js may be freely distributed under the MIT license.
;(function($, undefined){
var prefix = '', eventPrefix,
vendors = { Webkit: 'webkit', Moz: '', O: 'o' },
testEl = document.createElement('div'),
supportedTransforms = /^((translate|rotate|scale)(X|Y|Z|3d)?|matrix(3d)?|perspective|skew(X|Y)?)$/i,
transform,
transitionProperty, transitionDuration, transitionTiming, transitionDelay,
animationName, animationDuration, animationTiming, animationDelay,
cssReset = {}
function dasherize(str) { return str.replace(/([A-Z])/g, '-$1').toLowerCase() }
function normalizeEvent(name) { return eventPrefix ? eventPrefix + name : name.toLowerCase() }
if (testEl.style.transform === undefined) $.each(vendors, function(vendor, event){
if (testEl.style[vendor + 'TransitionProperty'] !== undefined) {
prefix = '-' + vendor.toLowerCase() + '-'
eventPrefix = event
return false
}
})
transform = prefix + 'transform'
cssReset[transitionProperty = prefix + 'transition-property'] =
cssReset[transitionDuration = prefix + 'transition-duration'] =
cssReset[transitionDelay = prefix + 'transition-delay'] =
cssReset[transitionTiming = prefix + 'transition-timing-function'] =
cssReset[animationName = prefix + 'animation-name'] =
cssReset[animationDuration = prefix + 'animation-duration'] =
cssReset[animationDelay = prefix + 'animation-delay'] =
cssReset[animationTiming = prefix + 'animation-timing-function'] = ''
$.fx = {
off: (eventPrefix === undefined && testEl.style.transitionProperty === undefined),
speeds: { _default: 400, fast: 200, slow: 600 },
cssPrefix: prefix,
transitionEnd: normalizeEvent('TransitionEnd'),
animationEnd: normalizeEvent('AnimationEnd')
}
$.fn.animate = function(properties, duration, ease, callback, delay){
if ($.isFunction(duration))
callback = duration, ease = undefined, duration = undefined
if ($.isFunction(ease))
callback = ease, ease = undefined
if ($.isPlainObject(duration))
ease = duration.easing, callback = duration.complete, delay = duration.delay, duration = duration.duration
if (duration) duration = (typeof duration == 'number' ? duration :
($.fx.speeds[duration] || $.fx.speeds._default)) / 1000
if (delay) delay = parseFloat(delay) / 1000
return this.anim(properties, duration, ease, callback, delay)
}
$.fn.anim = function(properties, duration, ease, callback, delay){
var key, cssValues = {}, cssProperties, transforms = '',
that = this, wrappedCallback, endEvent = $.fx.transitionEnd,
fired = false
if (duration === undefined) duration = $.fx.speeds._default / 1000
if (delay === undefined) delay = 0
if ($.fx.off) duration = 0
if (typeof properties == 'string') {
// keyframe animation
cssValues[animationName] = properties
cssValues[animationDuration] = duration + 's'
cssValues[animationDelay] = delay + 's'
cssValues[animationTiming] = (ease || 'linear')
endEvent = $.fx.animationEnd
} else {
cssProperties = []
// CSS transitions
for (key in properties)
if (supportedTransforms.test(key)) transforms += key + '(' + properties[key] + ') '
else cssValues[key] = properties[key], cssProperties.push(dasherize(key))
if (transforms) cssValues[transform] = transforms, cssProperties.push(transform)
if (duration > 0 && typeof properties === 'object') {
cssValues[transitionProperty] = cssProperties.join(', ')
cssValues[transitionDuration] = duration + 's'
cssValues[transitionDelay] = delay + 's'
cssValues[transitionTiming] = (ease || 'linear')
}
}
wrappedCallback = function(event){
if (typeof event !== 'undefined') {
if (event.target !== event.currentTarget) return // makes sure the event didn't bubble from "below"
$(event.target).unbind(endEvent, wrappedCallback)
} else
$(this).unbind(endEvent, wrappedCallback) // triggered by setTimeout
fired = true
$(this).css(cssReset)
callback && callback.call(this)
}
if (duration > 0){
this.bind(endEvent, wrappedCallback)
// transitionEnd is not always firing on older Android phones
// so make sure it gets fired
setTimeout(function(){
if (fired) return
wrappedCallback.call(that)
}, ((duration + delay) * 1000) + 25)
}
// trigger page reflow so new elements can animate
this.size() && this.get(0).clientLeft
this.css(cssValues)
if (duration <= 0) setTimeout(function() {
that.each(function(){ wrappedCallback.call(this) })
}, 0)
return this
}
testEl = null
})(Zepto)

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 300 300" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;"><path id="path4289" d="M148.297,183.556c2.126,9.257 3.119,18.611 2.962,27.926c-0.113,6.628 -0.793,12.496 -1.682,17.44c11.486,-18.717 22.221,-36.402 26.871,-44.555l1.116,-1.958l2.047,0.942c9.805,4.506 26.646,9.351 44.493,9.42c11.475,0.04 22.002,-1.851 31.295,-5.633c10.898,-4.434 20.073,-11.486 27.272,-20.959c6.498,-8.548 9.884,-18.355 10.068,-29.153c0.145,-8.744 -1.782,-18.18 -5.741,-28.041c-5.546,-13.821 -13.582,-24.655 -16.442,-28.283l-111.738,40.597l-0.341,0.123l-4.336,1.577l4.336,-1.577l-33.637,12.221c9.6,13.133 16.683,26.933 21.069,41.059c0.418,1.347 0.807,2.691 1.174,4.04c0.437,1.604 0.845,3.207 1.214,4.814" style="fill:#1abc9c;fill-rule:nonzero;"/><path id="path4291" d="M113.039,131.968l-2.044,-2.682l40.724,-14.796c-2.126,-9.252 -3.126,-18.612 -2.962,-27.923c0.112,-6.625 0.793,-12.495 1.679,-17.439c-11.482,18.717 -22.221,36.402 -26.87,44.552l-1.119,1.959l-2.042,-0.94c-9.808,-4.509 -26.647,-9.353 -44.496,-9.422c-11.476,-0.042 -22.002,1.856 -31.294,5.638c-10.894,4.434 -20.07,11.482 -27.274,20.953c-6.496,8.548 -9.883,18.356 -10.064,29.155c-0.148,8.744 1.781,18.177 5.741,28.04c5.541,13.821 13.579,24.654 16.443,28.287l107.096,-38.916c-0.386,-1.419 -0.794,-2.838 -1.233,-4.249c-4.514,-14.539 -12.015,-28.744 -22.285,-42.217" style="fill:#2980b9;fill-rule:nonzero;"/><path id="path4293" d="M11.494,124.96c18.024,-23.711 43.934,-28.6 62.496,-28.531c17.447,0.067 34.001,4.518 44.475,8.962c6.612,-11.4 21.4,-35.58 35.178,-57.949c0.008,-0.011 0.017,-0.026 0.023,-0.04c11.76,-19.078 22.759,-36.804 27.336,-44.178c-4.692,-0.985 -9.469,-1.743 -14.316,-2.279c-4.036,-0.366 -8.617,-0.681 -13.608,-0.868c-1.027,-0.02 -2.046,-0.077 -3.079,-0.077c-82.436,0 -149.319,66.48 -149.999,148.738c0.192,1.403 0.398,2.801 0.631,4.192c0.901,-10.266 4.545,-19.659 10.863,-27.97" style="fill:#3498db;fill-rule:nonzero;"/><path id="path4295" d="M300,151.259c-0.193,-1.4 -0.398,-2.799 -0.633,-4.191c-0.902,10.264 -4.545,19.657 -10.862,27.968c-18.026,23.71 -43.934,28.603 -62.496,28.533c-17.446,-0.066 -33.999,-4.518 -44.471,-8.966c-6.605,11.386 -21.36,35.513 -35.124,57.852c-0.015,0.029 -0.032,0.057 -0.049,0.081c-11.77,19.106 -22.788,36.861 -27.372,44.239c4.676,0.982 9.436,1.735 14.261,2.271c4.082,0.373 8.726,0.692 13.787,0.878c0.988,0.018 1.966,0.076 2.958,0.076c82.441,0 149.323,-66.482 150.001,-148.741" style="fill:#17a085;fill-rule:nonzero;"/></svg>

After

Width:  |  Height:  |  Size: 2.7 KiB

View File

@ -0,0 +1,147 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 25.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 432.19 119.34" style="enable-background:new 0 0 432.19 119.34;" xml:space="preserve">
<style type="text/css">
.Arched_x0020_Green{fill:url(#SVGID_1_);stroke:#FFFFFF;stroke-width:0.25;stroke-miterlimit:1;}
.st0{fill:#6F757F;}
.st1{fill:#36363F;}
.st2{fill:#414042;}
.st3{fill:url(#SVGID_2_);}
.st4{fill:url(#SVGID_3_);}
.st5{fill:url(#SVGID_4_);}
.st6{fill:#FFF1C2;}
.st7{fill:#698F3D;}
.st8{fill:#25262D;}
.st9{fill:#9E2827;}
.st10{fill:#261617;}
.st11{fill:#287CA8;}
.st12{fill:#00A651;}
.st13{fill:#BE1E2D;}
.st14{fill:#58595B;}
.st15{fill:#44C8F5;}
.st16{fill:#FFF685;}
.st17{fill:#FEE499;}
.st18{fill:#FFFFFF;}
.st19{fill:#FFF9AE;}
.st20{fill:#1C75BC;}
.st21{fill:#006838;}
.st22{fill:#C85248;}
.st23{fill:#4C525F;}
.st24{fill:url(#SVGID_5_);}
.st25{filter:url(#Adobe_OpacityMaskFilter);}
.st26{opacity:0.75;mask:url(#SVGID_6_);}
.st27{fill:url(#SVGID_7_);}
.st28{filter:url(#Adobe_OpacityMaskFilter_1_);}
.st29{opacity:0.75;mask:url(#SVGID_8_);}
.st30{fill:url(#SVGID_9_);}
.st31{filter:url(#Adobe_OpacityMaskFilter_2_);}
.st32{opacity:0.75;mask:url(#SVGID_10_);}
.st33{fill:url(#SVGID_11_);}
.st34{fill:url(#SVGID_12_);}
.st35{filter:url(#Adobe_OpacityMaskFilter_3_);}
.st36{opacity:0.75;mask:url(#SVGID_13_);}
.st37{fill:url(#SVGID_14_);}
.st38{fill:url(#SVGID_15_);}
.st39{filter:url(#Adobe_OpacityMaskFilter_4_);}
.st40{opacity:0.75;mask:url(#SVGID_16_);}
.st41{fill:url(#SVGID_17_);}
.st42{fill:url(#SVGID_18_);}
.st43{filter:url(#Adobe_OpacityMaskFilter_5_);}
.st44{opacity:0.75;mask:url(#SVGID_19_);}
.st45{fill:url(#SVGID_20_);}
.st46{fill:url(#SVGID_21_);}
.st47{filter:url(#Adobe_OpacityMaskFilter_6_);}
.st48{opacity:0.75;mask:url(#SVGID_22_);}
.st49{fill:url(#SVGID_23_);}
.st50{filter:url(#Adobe_OpacityMaskFilter_7_);}
.st51{opacity:0.75;mask:url(#SVGID_24_);}
.st52{fill:url(#SVGID_25_);}
.st53{filter:url(#Adobe_OpacityMaskFilter_8_);}
.st54{opacity:0.75;mask:url(#SVGID_26_);}
.st55{fill:url(#SVGID_27_);}
.st56{filter:url(#Adobe_OpacityMaskFilter_9_);}
.st57{opacity:0.75;mask:url(#SVGID_28_);}
.st58{fill:url(#SVGID_29_);}
.st59{filter:url(#Adobe_OpacityMaskFilter_10_);}
.st60{opacity:0.75;mask:url(#SVGID_30_);}
.st61{fill:url(#SVGID_31_);}
.st62{filter:url(#Adobe_OpacityMaskFilter_11_);}
.st63{opacity:0.75;mask:url(#SVGID_32_);}
.st64{fill:url(#SVGID_33_);}
.st65{fill:url(#SVGID_34_);}
.st66{filter:url(#Adobe_OpacityMaskFilter_12_);}
.st67{opacity:0.75;mask:url(#SVGID_35_);}
.st68{fill:url(#SVGID_36_);}
.st69{fill:url(#SVGID_37_);}
.st70{filter:url(#Adobe_OpacityMaskFilter_13_);}
.st71{opacity:0.75;mask:url(#SVGID_38_);}
.st72{stroke:#FFFFFF;stroke-width:0.75;stroke-miterlimit:10;}
.st73{fill:#6F7375;}
.st74{fill:#6D6E71;}
.st75{fill:none;stroke:#414042;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;}
.st76{fill:#2E2E3A;}
.st77{fill:#1169B4;}
.st78{fill:#73BF44;}
.st79{fill:#D72252;}
.st80{fill:#A9489B;}
.st81{fill:#0C8BCC;}
.st82{fill:#EBE728;}
</style>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="-489.8315" y1="2225.9177" x2="-489.1244" y2="2225.2107">
<stop offset="0" style="stop-color:#20AC4B"/>
<stop offset="0.9831" style="stop-color:#19361A"/>
</linearGradient>
<g>
<g>
<path class="st18" d="M17.88,56.46c-0.24,1.78-0.48,3.45-0.48,4.99c0,12.36,8.68,20.68,18.06,20.68c5.94,0,10.58-2.38,15.09-7.73
l1.31,1.43c-4.99,6.3-12.48,12.24-21.15,12.24c-11.65,0-20.68-10.58-20.68-24.36c0-12.6,8.44-25.43,22.94-25.43
c16.04,0,15.69,11.53,19.61,15.45v2.73H17.88z M42.6,53.37c-1.31-7.72-6.06-12.83-11.77-12.83c-3.92,0-9.86,1.78-12.6,12.83H42.6z
"/>
<path class="st18" d="M105.24,75.72c-4.99,7.96-11.53,12.36-21.04,12.36c-14.26,0-19.97-13.55-19.97-22.94
c0-14.86,12.24-26.86,27.33-26.86c7.49,0,13.31,2.97,13.31,6.77c0,2.02-1.55,3.56-3.45,3.56c-5.82,0-7.25-7.25-13.91-7.25
c-8.2,0-15.33,9.75-15.33,21.15c0,11.88,7.13,20.68,16.76,20.68c5.7,0,10.22-2.61,14.5-8.56L105.24,75.72z"/>
<path class="st18" d="M128.54,77.26c0,5.59,1.55,7.13,7.72,7.13v2.26h-23.77v-2.26c6.54-0.36,8.08-2.61,8.08-9.15V18.32
c0-2.62-0.48-3.57-2.97-3.92l-5.11-0.71v-2.02l14.14-4.87h1.9v38.98c7.84-4.63,13.55-7.49,19.61-7.49
c9.15,0,13.19,5.7,13.19,17.71c0,10.81-0.24,17.47-0.59,23.89c0.24,3.21,2.02,4.52,9.03,4.52v2.26h-25.67v-2.26
c3.09,0,5.35-0.59,6.66-1.9c2.14-2.14,2.61-7.25,2.61-24.96c0-12.72-6.89-14.38-10.82-14.38c-3.92,0-8.2,1.9-14.02,5.59V77.26z"/>
<path class="st18" d="M251.68,77.03c0,6.18,1.66,7.37,8.32,7.37v2.26h-24.72v-2.26c6.89,0,8.44-3.09,8.44-9.15V51.95
c0-4.64-0.71-5.7-3.45-6.06l-4.64-0.59v-2.02l14.26-4.99h1.78v9.51c8.56-6.06,16.4-9.51,21.16-9.51c5.82,0,10.1,3.68,11.29,9.51
c7.96-4.99,15.21-9.51,21.04-9.51c8.56,0,11.88,6.54,11.88,17.95c0,7.61,0,15.57-0.36,22.82c0,2.5,1.43,5.35,6.3,5.35h3.8v2.26
h-26.74v-2.26h1.07c3.45,0,4.99-0.59,6.06-1.66c1.78-1.78,1.9-8.68,1.9-16.88v-9.27c0-9.15-3.09-13.55-8.91-13.55
c-3.68,0-8.44,1.78-15.81,6.66v27.34c0,5.94,1.43,7.37,7.37,7.37v2.26h-24.36v-2.26c6.66,0,9.03-2.38,9.03-9.15V53.26
c0-7.49-4.63-10.22-8.79-10.22c-3.33,0-7.84,1.55-15.93,6.89V77.03z"/>
<path class="st18" d="M360.79,39.59l-1.9,5.23h-15.09v27.69c0,7.49,5.35,9.98,7.84,9.98c2.61,0,4.99-2.02,7.25-5.94l1.9,1.78
c-2.85,6.18-7.49,9.75-12.95,9.75c-7.01,0-12-5.82-12-13.79V44.82h-5.47v-1.9c4.64-2.26,8.68-7.73,11.41-15.09h2.02v11.77H360.79z
"/>
<path class="st18" d="M422.47,49.33c-1.78-0.12-7.37-0.59-11.88-1.43c0.71,1.31,2.02,3.8,2.02,7.61c0,8.79-7.61,17.23-20.8,17.23
c-2.26,0-3.33-0.24-5.47-0.95c-1.9,2.02-7.25,3.33-7.25,6.06c0,2.97,5.11,4.16,17,4.28c13.43,0.12,18.06,0.71,21.63,4.28
c2.85,2.85,3.57,5.82,3.57,8.32c0,7.73-10.46,19.61-32.45,19.61c-12.36,0-18.3-5.47-18.3-11.29c0-6.89,7.25-7.96,12.72-14.62
c-6.42-0.59-11.29-4.64-11.29-8.44c0-5.47,7.96-5.7,12.12-8.79c-7.25-2.85-11.41-7.96-11.41-14.74c0-10.22,9.15-18.18,20.92-18.18
c5.47,0,10.1,1.66,13.31,4.75c5.35,0,10.34-0.59,15.57-1.19V49.33z M395.5,111.02c10.1,0,19.61-6.66,19.61-14.14
c0-4.4-3.68-6.66-7.96-7.01c-3.09-0.36-18.06-0.47-21.51-0.95c-3.33,3.92-7.72,5.58-7.72,10.22
C377.91,104.72,385.75,111.02,395.5,111.02z M392.17,40.54c-4.52,0-11.53,2.49-11.53,13.55c0,7.01,3.57,16.4,12.6,16.4
c6.89,0,11.41-5.7,11.41-13.9C404.65,46.36,399.42,40.54,392.17,40.54z"/>
</g>
<g>
<path class="st12" d="M214.09,44.71c11.56,1.34,22.03,18.79,16.75,30.96c0.62-7.28-1.26-14.16-6.99-19.48
c-2.36-2.19-7.57-4.14-10.38-7.6C212.39,47.26,212.12,44.74,214.09,44.71z"/>
</g>
<g>
<path class="st13" d="M189.09,44.75c5.68-10.16,25.8-13.13,35.02-3.58c-6.48-3.37-13.56-4.27-20.67-1.02
c-2.93,1.34-6.73,5.4-11,6.67C190.8,47.3,188.36,46.58,189.09,44.75z"/>
</g>
<g>
<path class="st73" d="M179.62,69.79c-8.03-8.43-4.9-28.53,6.95-34.51c-5.13,5.19-8.1,11.69-7.1,19.45
c0.41,3.2,3.17,8.02,3.11,12.48C182.57,68.91,181.16,71.03,179.62,69.79z"/>
</g>
<g>
<path class="st15" d="M203.8,86.06c-10.04,5.9-28.9-1.71-32.03-14.61c3.89,6.18,9.54,10.54,17.32,11.33
c3.21,0.33,8.53-1.26,12.86-0.19C203.61,82.99,205.36,84.85,203.8,86.06z"/>
</g>
<g>
<path class="st17" d="M224.04,67.98c2.89,11.28-9.64,27.29-22.9,26.73c7.02-2.03,12.77-6.25,15.68-13.51
c1.2-2.99,1.15-8.55,3.37-12.41C221.05,67.31,223.31,66.15,224.04,67.98z"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 7.3 KiB

View File

@ -0,0 +1,31 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="200" height="70" viewBox="0, 0, 200, 70">
<g id="Background">
<rect x="0" y="0" width="200" height="70" fill="#000000" fill-opacity="0"/>
</g>
<g id="Layer_1">
<path d="M12.845,44.843 L13.182,45.146 z M13.651,45.558 L13.273,45.226 z" fill="#626161"/>
<path d="M12.896,68.994 L12.93,69.034 L12.93,69.034 z" fill="#626161"/>
<g>
<path d="M49.199,31.01 L43.317,29.375 L43.317,29.015 C43.314,28.345 42.77,27.803 42.1,27.803 L30.41,27.803 C29.741,27.803 29.198,28.346 29.198,29.015 L29.198,29.381 L23.317,31.01 C23.006,31.096 22.743,31.301 22.584,31.581 C22.426,31.861 22.385,32.192 22.471,32.502 L27.204,49.582 C27.348,50.097 27.812,50.459 28.347,50.474 C28.457,50.472 28.566,50.457 28.673,50.428 L36.281,48.307 L43.843,50.399 C43.949,50.429 44.059,50.444 44.169,50.445 C44.37,50.443 44.568,50.388 44.741,50.285 C45.021,50.127 45.227,49.864 45.312,49.553 L50.045,32.473 C50.209,31.837 49.833,31.186 49.199,31.01 z M30.079,28.987 C30.079,28.803 30.227,28.655 30.41,28.655 L42.1,28.655 C42.284,28.655 42.434,28.803 42.437,28.987 L42.437,46.707 C42.434,46.891 42.284,47.038 42.1,47.038 L30.41,47.038 C30.227,47.038 30.079,46.89 30.079,46.707 L30.079,28.987 z M28.467,49.565 C28.38,49.588 28.287,49.576 28.21,49.53 C28.133,49.488 28.077,49.415 28.055,49.33 L23.322,32.239 C23.298,32.154 23.308,32.063 23.351,31.986 C23.394,31.908 23.466,31.851 23.551,31.828 L29.198,30.267 L29.198,46.712 C29.198,47.382 29.741,47.924 30.41,47.924 L34.332,47.924 z M49.199,32.239 L44.466,49.302 C44.444,49.388 44.386,49.461 44.306,49.502 C44.231,49.548 44.14,49.56 44.055,49.536 L38.19,47.907 L42.1,47.907 C42.77,47.907 43.314,47.365 43.317,46.695 L43.317,30.261 L48.965,31.828 C49.14,31.88 49.244,32.061 49.199,32.239 z" fill="#FFFFFF"/>
<path d="M49.199,31.01 L43.317,29.375 L43.317,29.015 C43.314,28.345 42.77,27.803 42.1,27.803 L30.41,27.803 C29.741,27.803 29.198,28.346 29.198,29.015 L29.198,29.381 L23.317,31.01 C23.006,31.096 22.743,31.301 22.584,31.581 C22.426,31.861 22.385,32.192 22.471,32.502 L27.204,49.582 C27.348,50.097 27.812,50.459 28.347,50.474 C28.457,50.472 28.566,50.457 28.673,50.428 L36.281,48.307 L43.843,50.399 C43.949,50.429 44.059,50.444 44.169,50.445 C44.37,50.443 44.568,50.388 44.741,50.285 C45.021,50.127 45.227,49.864 45.312,49.553 L50.045,32.473 C50.209,31.837 49.833,31.186 49.199,31.01 z M30.079,28.987 C30.079,28.803 30.227,28.655 30.41,28.655 L42.1,28.655 C42.284,28.655 42.434,28.803 42.437,28.987 L42.437,46.707 C42.434,46.891 42.284,47.038 42.1,47.038 L30.41,47.038 C30.227,47.038 30.079,46.89 30.079,46.707 L30.079,28.987 z M28.467,49.565 C28.38,49.588 28.287,49.576 28.21,49.53 C28.133,49.488 28.077,49.415 28.055,49.33 L23.322,32.239 C23.298,32.154 23.308,32.063 23.351,31.986 C23.394,31.908 23.466,31.851 23.551,31.828 L29.198,30.267 L29.198,46.712 C29.198,47.382 29.741,47.924 30.41,47.924 L34.332,47.924 z M49.199,32.239 L44.466,49.302 C44.444,49.388 44.386,49.461 44.306,49.502 C44.231,49.548 44.14,49.56 44.055,49.536 L38.19,47.907 L42.1,47.907 C42.77,47.907 43.314,47.365 43.317,46.695 L43.317,30.261 L48.965,31.828 C49.14,31.88 49.244,32.061 49.199,32.239 z" fill-opacity="0" stroke="#C2BDBD" stroke-width="0.04" stroke-miterlimit="10"/>
</g>
<path d="M22.876,69.457 L56.413,69.457 L56.619,69.457 C57.058,69.427 57.487,69.312 57.882,69.12 L57.882,69.12 C58.231,68.948 58.548,68.718 58.82,68.44 C60.689,65.993 60.437,57.722 58.197,47.135 C55.138,49.771 51.817,52.389 48.319,54.932 C44.392,57.79 40.448,60.391 36.601,62.678 C32.238,65.343 27.645,67.612 22.876,69.457 z" fill="#EE7A11"/>
<path d="M51.492,20.018 C53.052,23.756 54.521,27.74 55.859,31.879 C57.345,36.452 58.591,41.025 59.563,45.369 C60.743,50.349 61.475,55.424 61.752,60.534 L61.752,60.586 L72.161,28.724 L72.161,28.689 C72.179,28.639 72.194,28.587 72.207,28.535 L72.207,28.501 C72.31,28.045 72.328,27.574 72.258,27.112 C72.196,26.738 72.073,26.376 71.892,26.043 C71.793,25.896 71.68,25.758 71.555,25.631 C70.995,25.084 70.353,24.626 69.652,24.276 L69.326,24.111 C69.109,24.002 68.874,23.894 68.634,23.785 L68.32,23.648 L67.72,23.379 C66.411,22.88 65.075,22.454 63.718,22.104 L63.05,21.939 L62.404,21.779 L61.38,21.55 C60.997,21.464 60.603,21.384 60.203,21.304 L59.483,21.167 L58.339,20.961 L57.076,20.721 C56.202,20.584 55.293,20.452 54.367,20.332 L53.669,20.241 L52.235,20.075 z" fill="#EF8616"/>
<path d="M14.451,69.103 C15.28,69.411 17.383,69.64 22.259,67.874 C26.503,66.244 30.601,64.257 34.509,61.935 C31.079,59.837 27.546,57.493 24.048,54.949 C20.133,52.091 16.446,49.165 13.09,46.221 L13.045,46.181 L12.553,45.741 L12.399,45.609 L12.016,45.266 L11.884,45.146 L11.387,44.695 L11.307,44.62 L10.895,44.243 L10.752,44.112 L10.375,43.763 L10.261,43.66 L9.798,43.22 L9.689,43.117 L9.323,42.768 L9.186,42.637 L8.809,42.271 L8.729,42.197 L8.272,41.762 L8.152,41.648 L7.843,41.299 L7.7,41.191 L7.288,40.779 L7.288,40.779 L6.877,40.356 L6.751,40.23 L6.448,39.916 L6.334,39.796 L6.059,39.504 L5.888,39.321 L5.556,38.967 L5.414,38.818 L5.122,38.504 L5.031,38.401 L4.67,38.001 L4.585,37.904 L4.31,37.589 L4.196,37.469 C4.105,37.355 4.007,37.252 3.916,37.144 L3.847,37.064 L3.516,36.675 L3.43,36.572 L3.184,36.275 L3.127,36.155 L2.841,35.806 L2.841,35.772 L2.538,35.394 L2.453,35.286 L2.355,35.154 L12.799,67.165 C13.085,68.019 13.703,68.722 14.514,69.114 z" fill="#E75412"/>
<path d="M36.184,17.554 C39.893,17.554 43.552,17.68 47.044,17.926 C47.827,17.977 48.622,18.04 49.388,18.109 L50.211,18.183 L50.914,18.252 C51.411,18.297 51.914,18.355 52.406,18.406 L53.858,18.577 L54.573,18.669 C55.51,18.795 56.436,18.926 57.328,19.069 L58.642,19.286 L59.786,19.498 L60.523,19.641 L61.729,19.886 L62.775,20.127 L63.444,20.287 L64.136,20.464 C64.501,20.555 64.862,20.658 65.21,20.755 L38.241,1.109 L38.127,1.029 L38.127,1.029 L38.059,0.983 C37.92,0.895 37.777,0.815 37.63,0.743 L37.63,0.743 L37.55,0.709 L37.487,0.709 L37.304,0.64 L37.253,0.64 L37.03,0.577 L36.972,0.577 L36.91,0.577 L36.732,0.543 L36.504,0.543 L35.932,0.543 L35.732,0.543 L35.652,0.543 L35.652,0.543 L35.509,0.589 L35.463,0.589 L35.343,0.634 L35.303,0.634 L35.138,0.709 L35.138,0.709 L34.989,0.783 L34.932,0.812 L34.795,0.892 L34.749,0.892 L34.566,1.006 L34.52,1.006 L34.366,1.115 L34.309,1.155 L34.137,1.28 L34.103,1.309 L33.897,1.475 L33.846,1.52 L33.68,1.658 L33.623,1.715 C33.548,1.772 33.48,1.841 33.411,1.903 L33.411,1.903 L33.194,2.109 L33.131,2.172 L32.96,2.349 L32.851,2.429 C32.777,2.504 32.697,2.584 32.622,2.669 L32.588,2.704 L32.388,2.927 L32.279,3.001 C32.217,3.07 32.154,3.138 32.097,3.212 L32.039,3.275 L31.799,3.561 L31.742,3.63 L31.554,3.864 L31.479,3.956 L31.279,4.213 L31.233,4.276 L30.988,4.596 L30.919,4.687 L30.73,4.944 L30.53,5.225 L30.422,5.379 L30.422,5.379 L30.164,5.745 L30.084,5.859 L29.896,6.139 L29.822,6.248 C29.736,6.379 29.65,6.505 29.57,6.636 L29.524,6.699 L29.307,7.042 L29.227,7.168 L29.027,7.482 L28.958,7.591 L28.701,8.014 L28.638,8.117 L28.433,8.454 L28.347,8.597 C28.278,8.717 28.21,8.837 28.135,8.957 L28.084,9.054 C28.032,9.134 27.987,9.22 27.935,9.306 L27.678,9.752 C27.638,9.832 27.592,9.912 27.546,9.992 L27.461,10.14 L27.221,10.575 L27.221,10.626 C27.135,10.786 27.043,10.946 26.958,11.112 L26.872,11.266 C26.809,11.392 26.746,11.512 26.678,11.632 L26.598,11.792 C26.506,11.958 26.42,12.124 26.335,12.295 L26.289,12.387 C26.209,12.53 26.135,12.678 26.06,12.821 L25.975,12.998 L25.774,13.393 L25.694,13.542 C25.609,13.719 25.523,13.896 25.432,14.073 L25.363,14.216 C25.294,14.353 25.231,14.496 25.163,14.633 L25.071,14.822 L24.866,15.256 L24.797,15.394 C24.711,15.576 24.62,15.765 24.534,15.965 L24.454,16.137 L24.26,16.554 L24.168,16.754 C24.094,16.92 24.02,17.086 23.94,17.251 L23.9,17.343 L23.637,17.914 L23.591,18.023 L26.449,17.817 L29.141,17.674 L32.788,17.554 L32.8,18.435 L32.8,17.583 L33.514,17.583 L36.201,17.583 z" fill="#F3981E"/>
<path d="M0.086,27.066 C0.086,27.1 0.086,27.14 0.086,27.18 L0.086,27.226 C0.089,27.268 0.089,27.31 0.086,27.352 L0.086,27.398 C0.086,27.455 0.086,27.512 0.086,27.575 L0.086,27.575 C0.086,27.626 0.086,27.683 0.086,27.735 L0.086,27.798 L0.12,27.952 L0.12,28.003 L0.172,28.221 L0.172,28.272 L0.223,28.449 L0.223,28.518 L0.292,28.712 L0.292,28.758 C0.326,28.838 0.355,28.924 0.389,29.004 L0.389,29.072 L0.475,29.267 L0.509,29.347 C0.543,29.427 0.578,29.507 0.618,29.587 L0.618,29.587 L0.755,29.867 L0.795,29.947 L0.903,30.158 L0.949,30.244 C1.001,30.341 1.052,30.439 1.109,30.536 L1.109,30.57 L1.264,30.833 L1.315,30.93 L1.458,31.164 L1.504,31.244 L1.704,31.553 L1.744,31.627 L1.915,31.885 L1.978,31.982 C2.035,32.073 2.098,32.159 2.155,32.245 L2.207,32.319 L2.435,32.651 L2.498,32.742 L2.687,32.999 L2.761,33.108 L2.99,33.411 L3.024,33.457 L3.287,33.811 L3.367,33.914 C3.441,34 3.51,34.091 3.579,34.183 L3.664,34.291 Q3.802,34.474 3.956,34.651 L3.956,34.686 L4.236,35.029 L4.327,35.143 L4.568,35.423 L4.842,35.583 L5.162,35.966 L5.231,36.04 L5.499,36.355 L5.608,36.475 L5.877,36.783 L5.957,36.875 L6.311,37.264 L6.402,37.366 L6.688,37.675 L6.803,37.795 C6.905,37.915 7.014,38.03 7.123,38.144 L7.3,38.327 C7.386,38.424 7.477,38.515 7.569,38.613 L7.677,38.727 L7.974,39.036 L8.094,39.161 L8.5,39.573 L8.5,39.573 L8.9,39.973 L9.026,40.099 L9.346,40.419 L9.466,40.539 L9.901,40.962 L9.975,41.031 L10.347,41.396 L10.484,41.522 L10.838,41.865 L10.947,41.968 L11.41,42.397 L11.518,42.5 L11.89,42.843 L12.033,42.98 L12.433,43.351 L12.519,43.426 L13.005,43.866 L13.102,43.952 L13.136,43.803 L13.216,43.477 C13.256,43.323 13.29,43.168 13.33,43.014 L13.422,42.62 L13.525,42.22 L13.61,41.871 C13.651,41.722 13.685,41.568 13.725,41.414 L13.816,41.065 L13.936,40.608 L14.028,40.247 L14.148,39.796 L14.245,39.424 C14.285,39.276 14.331,39.127 14.371,38.973 L14.474,38.601 C14.514,38.447 14.554,38.298 14.599,38.15 L14.702,37.772 L14.834,37.315 L14.937,36.943 L15.074,36.475 L15.182,36.103 L15.32,35.646 L15.434,35.263 C15.474,35.114 15.52,34.971 15.565,34.823 L15.703,34.44 C15.748,34.297 15.794,34.154 15.834,34.017 L15.966,33.594 C16.023,33.405 16.086,33.217 16.143,33.022 L16.234,32.736 L16.509,31.879 L16.989,30.439 L17.332,29.427 C17.555,28.764 17.8,28.066 18.052,27.357 L18.624,25.786 C18.698,25.574 18.778,25.363 18.858,25.145 L19.487,23.499 L19.692,22.962 L20.081,21.979 C20.138,21.83 20.201,21.681 20.264,21.527 L20.373,21.253 L20.55,20.818 L20.704,20.447 L20.847,20.092 L21.419,18.698 L21.682,18.097 L21.767,17.892 C21.836,17.749 21.899,17.6 21.962,17.457 L22.053,17.257 C22.139,17.057 22.23,16.857 22.316,16.685 L22.316,16.685 L22.351,16.611 C22.431,16.44 22.505,16.268 22.585,16.102 L22.676,15.902 L22.871,15.474 L22.956,15.296 C23.042,15.108 23.134,14.919 23.219,14.725 L23.288,14.582 C23.357,14.433 23.431,14.29 23.499,14.142 L23.591,13.947 L23.797,13.53 L23.871,13.381 C23.957,13.199 24.048,13.021 24.134,12.844 L24.214,12.684 C24.283,12.553 24.351,12.415 24.414,12.284 L24.505,12.107 C24.586,11.958 24.66,11.81 24.734,11.661 L24.786,11.569 C24.871,11.398 24.963,11.226 25.054,11.055 L25.14,10.895 L25.334,10.523 L25.42,10.363 C25.512,10.198 25.603,10.032 25.689,9.866 L25.723,9.809 L25.963,9.369 L26.055,9.214 C26.123,9.094 26.186,8.974 26.255,8.86 L26.335,8.723 C26.42,8.563 26.512,8.408 26.598,8.254 L26.678,8.145 C26.746,8.02 26.821,7.9 26.889,7.78 L26.981,7.631 L27.186,7.282 L27.249,7.179 L27.518,6.745 L27.592,6.631 C27.661,6.522 27.729,6.413 27.792,6.305 L27.878,6.168 C27.958,6.053 28.032,5.933 28.107,5.819 L28.152,5.75 C28.238,5.619 28.324,5.482 28.415,5.35 L28.49,5.236 L28.49,5.202 L20.007,11.364 L1.412,24.9 L1.275,25.002 L1.224,25.048 C1.194,25.07 1.167,25.095 1.144,25.122 L1.081,25.174 L1.001,25.248 L0.961,25.294 L0.961,25.294 L0.892,25.368 L0.841,25.425 C0.821,25.453 0.8,25.48 0.778,25.505 L0.732,25.563 L0.669,25.643 L0.629,25.706 L0.572,25.791 L0.532,25.854 L0.48,25.934 L0.423,26.043 L0.372,26.14 L0.372,26.191 C0.372,26.191 0.372,26.254 0.326,26.283 L0.326,26.334 C0.304,26.367 0.285,26.401 0.269,26.437 L0.269,26.494 C0.269,26.494 0.269,26.552 0.269,26.586 L0.269,26.643 C0.267,26.673 0.267,26.704 0.269,26.734 L0.269,26.786 C0.269,26.832 0.269,26.866 0.269,26.894 L0.269,26.952 C0.202,26.979 0.14,27.017 0.086,27.066 z" fill="#F7A808"/>
<path d="M87.574,47.181 L83.464,47.181 L83.464,45.906 L93.073,45.906 L93.073,47.181 L88.969,47.181 L88.969,58.139 L87.574,58.139 z" fill="#ED7A05"/>
<path d="M100.904,45.906 L106.163,45.906 C107.438,45.84 108.687,46.279 109.639,47.13 C110.253,47.78 110.584,48.648 110.559,49.542 L110.559,49.576 C110.559,51.605 109.158,52.794 107.238,53.143 L110.993,58.139 L109.278,58.139 L105.729,53.383 L102.236,53.383 L102.236,58.139 L100.859,58.139 z M106.049,52.143 C107.884,52.143 109.193,51.2 109.193,49.628 L109.193,49.593 C109.193,48.09 108.049,47.181 106.066,47.181 L102.293,47.181 L102.293,52.16 z" fill="#ED7A05"/>
<path d="M123.3,45.821 L124.592,45.821 L130.165,58.139 L128.679,58.139 L127.25,54.904 L120.591,54.904 L119.133,58.139 L117.716,58.139 z M126.73,53.646 L123.952,47.427 L121.134,53.646 z" fill="#ED7A05"/>
<path d="M137.819,45.906 L142.066,45.906 C145.908,45.906 148.566,48.547 148.566,51.988 L148.566,52.023 C148.566,55.452 145.908,58.139 142.066,58.139 L137.819,58.139 z M139.197,47.181 L139.197,56.864 L142.055,56.864 C145.147,56.864 147.119,54.766 147.119,52.057 L147.119,52.023 C147.119,49.313 145.147,47.181 142.055,47.181 z" fill="#ED7A05"/>
<path d="M156.723,45.906 L165.566,45.906 L165.566,47.164 L158.1,47.164 L158.1,51.343 L164.777,51.343 L164.777,52.6 L158.1,52.6 L158.1,56.881 L165.651,56.881 L165.651,58.139 L156.723,58.139 z" fill="#ED7A05"/>
<path d="M173.671,45.906 L178.93,45.906 C180.205,45.838 181.454,46.278 182.405,47.13 C183.028,47.777 183.367,48.644 183.349,49.542 L183.349,49.576 C183.349,51.605 181.954,52.794 180.027,53.143 L183.783,58.139 L182.068,58.139 L178.524,53.383 L175.026,53.383 L175.026,58.139 L173.648,58.139 z M178.816,52.143 C180.65,52.143 181.965,51.2 181.965,49.628 L181.965,49.593 C181.965,48.09 180.822,47.181 178.833,47.181 L175.06,47.181 L175.06,52.16 z" fill="#ED7A05"/>
<path d="M190.739,56.356 L191.597,55.344 C192.706,56.456 194.216,57.074 195.787,57.059 C197.433,57.059 198.513,56.19 198.513,54.984 L198.513,54.949 C198.513,53.806 197.902,53.166 195.335,52.623 C192.523,52.011 191.225,51.102 191.225,49.096 L191.225,49.056 C191.225,47.135 192.94,45.724 195.227,45.724 C196.796,45.677 198.327,46.212 199.525,47.227 L198.725,48.29 C197.746,47.436 196.491,46.965 195.192,46.964 C193.603,46.964 192.592,47.838 192.592,48.936 L192.592,48.97 C192.592,50.114 193.22,50.771 195.913,51.348 C198.605,51.926 199.914,52.937 199.914,54.806 L199.914,54.841 C199.914,56.939 198.165,58.299 195.735,58.299 C193.881,58.322 192.09,57.626 190.739,56.356 z" fill="#ED7A05"/>
<path d="M83.464,17.966 L91.541,17.966 L96.503,26.106 L101.47,17.966 L109.541,17.966 L109.541,41.133 L101.83,41.133 L101.83,29.65 L96.503,37.87 L96.371,37.87 L91.044,29.633 L91.044,41.133 L83.464,41.133 z" fill="#B3B3B3"/>
<path d="M123.575,17.8 L131.251,17.8 L141.015,41.133 L132.606,41.133 L131.383,38.018 L123.277,38.018 L122.083,41.133 L113.811,41.133 z M129.462,32.525 L127.347,26.9 L125.227,32.525 z" fill="#B3B3B3"/>
<path d="M145.279,17.966 L152.527,17.966 L160.77,28.192 L160.77,17.966 L168.446,17.966 L168.446,41.133 L161.587,41.133 L152.961,30.439 L152.961,41.128 L145.279,41.128 z" fill="#B3B3B3"/>
<path d="M182.48,17.8 L190.156,17.8 L199.914,41.133 L191.511,41.133 L190.288,38.018 L182.177,38.018 L180.988,41.133 L172.716,41.133 z M188.367,32.525 L186.252,26.9 L184.132,32.525 z" fill="#B3B3B3"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 15 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 9.7 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" version="1.0" width="80" viewBox="0 0 5000 3500" fill="#97d1fb"><g><path d="M1950 3374c-177-47-300-179-361-384-20-69-22-105-29-465-9-431-13-464-73-532-40-45-94-70-174-79l-63-7v-424l64-5c83-7 150-39 182-88 52-78 56-107 64-530 8-435 10-450 76-588 23-47 55-93 92-130C1828 41 1936 0 2097 0h93v377l-51 6c-87 11-147 66-181 169-6 19-14 183-18 393-9 385-16 445-64 552-14 30-39 72-56 93-34 43-110 95-155 106l-29 7 37 13c84 29 164 109 206 206 47 109 54 176 61 548 4 197 11 369 17 386 32 95 73 131 168 147l65 11v376l-92-1c-51 0-118-7-148-15zM105 3168.756zM2720 3202v-188l65-11c95-16 136-52 168-147 6-17 13-189 17-386 7-372 14-439 61-548 42-97 122-177 206-206l37-13-29-7c-45-11-121-63-155-106-17-21-42-63-56-93-48-107-55-167-64-552-4-210-12-374-18-393-34-103-94-158-181-169l-51-6V0h93c161 0 269 41 369 142 37 37 69 83 92 130 66 138 68 153 76 588 8 423 12 452 64 530 32 49 99 81 182 88l64 5v424l-62 7c-81 9-135 34-175 79-60 68-64 101-73 532-7 360-9 396-29 465-34 115-85 202-156 269-100 93-203 131-357 131h-88v-188z"/><path d="M690 1690V350h570v330H980v2030h280v320H690V1690zM3650 2870v-160h280V680h-280V350h570v2680h-570v-160zM321 2496l-105-71-107-342L1 1741l108-395c59-218 110-398 112-400s49-33 104-70l100-66 3 440c1 242 1 637 0 879l-3 439-104-72zM4480 1689V808l29 19c187 120 181 115 196 168 8 28 57 207 109 398l95 348-108 342-107 342-107 73-107 73v-882z"/></g></svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="480" height="480"><path fill-opacity="0" d="M0 0h480v480H0z"/><path d="M76.084 233.472c32.743.6 66.086 9.848 90.981 31.943 38.842 32.943 56.938 85.032 59.388 134.772-41.791 2.449-81.733-20.196-106.478-52.889-24.995-32.893-38.142-73.285-43.891-113.826zm238.65 29.993c24.395-21.245 57.239-29.043 88.932-29.293-7.549 55.138-30.794 112.026-77.384 145.319-20.696 15.847-47.24 21.446-72.885 20.546 2-50.889 20.246-104.078 61.337-136.572zM0 326.652c27.944-5.799 58.338-8.798 85.932-.5 15.647 16.247 26.045 37.043 43.191 51.99 16.797 16.746 39.642 24.444 61.137 33.243-51.089 2.049-105.328-6.299-147.519-37.143C25.095 361.895 11.498 344.749 0 326.652zm396.517-1.199c27.245-7.149 55.939-4.15 83.483-.5-13.047 29.693-40.492 50.339-68.486 65.036-38.292 16.997-80.883 24.245-122.724 22.295 25.345-11.547 52.889-21.595 71.185-43.69 13.197-13.498 20.696-32.594 36.542-43.141zM240.411 67.406c.468.762.529 1.643.711 2.479.75 4.43 1.038 8.908 1.421 13.372l2.401 35.691c1.421 19.446 3.038 38.91 6.225 58.204 1.558 9.105 3.403 18.213 6.553 27.006l12.486.949c2.058-5.379 3.069-11.012 4.128-16.599.939-5.221 1.732-10.465 2.466-15.713 2.828-20.498 4.799-41.078 6.936-61.639.486-4.236.804-8.497 1.59-12.7.394.909.484 1.888.66 2.841.459 2.877.806 5.766 1.157 8.655l6.991 57.641c1.288 8.797 2.705 17.584 4.594 26.299 1.275 5.692 2.635 11.404 4.932 16.855 3.865 1.043 7.7 2.188 11.416 3.595 1.164-2.36 2.04-4.825 2.864-7.293 2.077-6.414 3.516-12.974 4.775-19.545 2.709-14.178 4.308-28.494 6.425-42.744.559-3.25.932-6.557 2.092-9.694.57 1.344.734 2.784 1 4.189 1.027 6.436 1.723 12.908 2.455 19.374l2.128 21.073.09-.323c-.011.989.101 1.972.214 2.955l4.608 50.844c-10.891 3.646-21.19 8.651-30.606 14.706-12.598 8.107-23.565 18.13-32.655 29.309-9.476 11.662-16.98 24.56-22.363 38.106-6.77 17.051-10.589 34.923-12.65 52.876-.666 5.513-1.076 11.045-1.709 16.558-.23 1.472-.27 3.025-1.072 4.365h-.396c-.735-.991-.78-2.215-.987-3.346-.486-3.658-.756-7.335-1.137-11.002-.957-9.885-2.317-19.748-4.403-29.5-3.423-15.951-8.598-31.704-16.674-46.322-9.236-16.766-21.947-32.137-37.875-44.402-11.808-9.102-25.384-16.435-40.031-21.356l6.637-70.769c.842-7.656 1.642-15.32 2.831-22.94.247-1.39.441-2.798.903-4.145l.245.037c.962 2.756 1.343 5.641 1.833 8.484l4.739 33.101c1.416 8.825 3.013 17.644 5.445 26.301 1.095 3.764 2.288 7.526 4.025 11.105 3.716-1.417 7.56-2.548 11.422-3.605 1.442-3.397 2.48-6.914 3.408-10.445 1.407-5.477 2.52-11.008 3.515-16.555 4.04-22.895 6.403-45.985 9.033-69.032l1.556-12.425c.226-1.31.349-2.646.831-3.908.521 2.885.804 5.798 1.138 8.703l6.436 58.702c1.212 9.283 2.504 18.566 4.369 27.768.838 3.884 1.664 7.796 3.166 11.53l12.475-.913c3.117-8.667 4.943-17.645 6.492-26.622 1.696-10.048 2.903-20.157 3.923-30.276 1.721-17.256 2.816-34.554 3.928-51.847.541-7.656.95-15.326 1.874-22.956.239-1.697.437-3.416 1.016-5.057z"/></svg>

After

Width:  |  Height:  |  Size: 2.8 KiB

View File

@ -0,0 +1,30 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="400" height="50" viewBox="0, 0, 400, 50">
<g id="Background">
<rect x="0" y="0" width="400" height="50" fill="#000000" fill-opacity="0"/>
</g>
<g id="#aacce3ff">
<path d="M25.285,2.069 C25.564,1.478 25.928,0.935 26.316,0.407 C28.557,4.838 30.371,9.464 32.349,14.011 L32.206,14.223 C32.067,14.429 31.782,14.848 31.639,15.057 C29.919,10.823 28.184,6.592 26.219,2.467 C25.803,3.261 25.43,4.077 25.084,4.905 C23.189,9.149 21.348,13.419 19.801,17.805 C19.406,18.278 18.824,18.494 18.217,18.479 C12.933,18.827 7.653,19.173 2.393,19.801 C5.481,23.21 9.197,25.968 12.66,28.973 C13.728,29.826 14.759,31.012 16.24,30.997 C16.106,31.066 15.839,31.212 15.703,31.285 C15.399,31.27 15.096,31.257 14.793,31.245 C14.526,31.894 14.226,32.525 13.944,33.165 C14.016,32.625 14.08,32.082 14.15,31.543 C10.689,28.488 6.985,25.71 3.637,22.525 C2.445,21.366 1.147,20.326 -0,19.122 C1.811,18.97 3.603,18.658 5.408,18.457 C7.355,18.403 9.275,18.048 11.211,17.878 C13.668,17.793 16.124,17.763 18.584,17.729 C19.728,15.555 20.398,13.177 21.402,10.938 C22.576,7.929 23.947,5.005 25.285,2.069 z" fill="#AACCE3"/>
<path d="M25.084,4.905 C25.43,4.077 25.803,3.261 26.219,2.467 C28.184,6.592 29.919,10.823 31.639,15.057 C32.07,16.17 32.473,17.296 32.877,18.421 C36.359,18.418 39.807,18.961 43.283,19.064 C45.47,19.264 47.645,19.598 49.841,19.707 C49.781,19.774 49.665,19.913 49.608,19.98 C48.519,20.344 47.421,20.684 46.344,21.075 C37.948,23.899 29.489,26.541 21.078,29.322 C19.458,29.859 17.799,30.287 16.24,30.997 C14.759,31.012 13.728,29.826 12.66,28.973 C9.197,25.968 5.481,23.21 2.393,19.801 C7.653,19.173 12.933,18.827 18.217,18.479 C18.824,18.494 19.406,18.278 19.801,17.805 C21.135,18.673 22.761,18.4 24.259,18.403 C26.425,18.327 28.618,18.615 30.75,18.112 C29.228,17.924 27.699,17.82 26.173,17.687 C26.116,13.128 26.273,8.566 26.107,4.01 C25.761,4.305 25.415,4.596 25.084,4.905 z" fill="#215382"/>
<path d="M31.515,35.31 C33.322,33.93 35.103,32.489 37.081,31.355 C38.1,34.627 38.913,37.961 39.683,41.3 C40.162,43.518 40.76,45.723 40.942,47.995 C40.669,47.855 40.396,47.715 40.126,47.576 C39.977,46.739 39.683,45.929 39.143,45.265 C37.863,43.602 36.668,41.88 35.406,40.202 C34.141,38.543 33.11,36.687 31.515,35.31 z" fill="#215382"/>
<path d="M25.084,4.905 C25.415,4.596 25.761,4.305 26.107,4.01 C26.273,8.566 26.116,13.128 26.173,17.687 C27.699,17.82 29.228,17.924 30.75,18.112 C28.618,18.615 26.425,18.327 24.259,18.403 C22.761,18.4 21.135,18.673 19.801,17.805 C21.348,13.419 23.189,9.149 25.084,4.905 z" fill="#112A45"/>
<path d="M26.668,38.862 C28.266,37.654 29.968,36.587 31.515,35.31 C33.11,36.687 34.141,38.543 35.406,40.202 C36.668,41.88 37.863,43.603 39.143,45.265 C39.683,45.929 39.977,46.739 40.126,47.576 C35.558,45.14 31.251,42.256 26.877,39.502 C26.825,39.341 26.719,39.019 26.668,38.862 z" fill="#112A45"/>
<path d="M66.048,13.389 C67.597,12.713 69.323,12.943 70.967,12.898 C73.982,12.761 76.846,14.211 79.108,16.104 C77.953,18.084 76.624,19.956 75.438,21.915 C73.791,20.863 72.147,19.404 70.045,19.613 C68.601,19.601 66.572,20.487 66.824,22.225 C66.727,23.08 66.873,24.066 67.782,24.409 C70.703,25.534 73.97,25.792 76.67,27.484 C78.526,28.758 80.079,30.62 80.555,32.865 C81.028,35.1 80.986,37.573 79.855,39.614 C78.523,41.995 76.081,43.7 73.412,44.221 C71.795,44.364 70.167,44.303 68.547,44.297 C66.415,44.343 64.391,43.478 62.532,42.52 C61.255,41.74 59.857,41.027 58.926,39.823 C59.108,39.195 59.499,38.664 59.842,38.115 C60.776,36.708 61.564,35.198 62.662,33.905 C64.804,36.15 67.81,37.8 70.986,37.588 C71.777,37.591 72.532,37.29 73.2,36.887 C73.967,36.311 74.04,35.225 73.758,34.382 C73.218,33.114 71.726,32.798 70.54,32.446 C67.425,31.658 63.973,30.948 61.768,28.403 C59.799,26.137 59.535,22.931 59.996,20.083 C60.661,16.995 63.111,14.454 66.048,13.389 z" fill="#C1E3F7"/>
<path d="M172.151,13.365 C174.035,12.673 176.073,12.958 178.036,12.901 C181.123,12.743 183.984,14.229 186.477,15.897 C185.482,17.845 184.199,19.631 183.01,21.46 C182.91,21.488 182.71,21.539 182.61,21.563 C181.581,21.139 180.705,20.396 179.625,20.086 C176.558,18.94 172.973,19.883 170.607,22.073 C168.132,24.405 167.128,28.179 168.232,31.409 C169.06,34.124 171.335,36.305 174.02,37.166 C176.546,38.037 179.443,37.642 181.663,36.156 C182.088,35.938 182.74,35.331 183.128,35.919 C184.254,37.715 185.479,39.453 186.486,41.319 C184.002,43.011 181.126,44.479 178.036,44.309 C175.912,44.258 173.698,44.546 171.684,43.718 C167.265,42.286 163.646,38.765 161.929,34.473 C161.517,33.366 161.116,32.225 161.141,31.027 C161.11,29.004 161.038,26.969 161.241,24.955 C162.497,19.525 166.822,14.969 172.151,13.365 z" fill="#C1E3F7"/>
<path d="M260.999,25.546 C262.106,19.322 267.332,14.056 273.569,12.964 C275.598,12.867 277.639,12.843 279.668,12.98 C281.995,13.386 284.154,14.466 286.056,15.843 C285.104,17.924 283.787,19.834 282.416,21.66 C280.712,20.487 278.749,19.461 276.62,19.586 C271.909,19.376 267.596,23.584 267.624,28.285 C267.442,31.788 269.732,35.131 272.847,36.602 C274.576,37.482 276.584,37.327 278.458,37.19 C279.292,37.008 280.399,36.817 280.687,35.871 C280.675,35.407 280.575,34.952 280.49,34.5 C279.847,34.491 279.204,34.479 278.567,34.473 C278.497,32.243 278.537,30.011 278.54,27.778 C281.497,27.766 284.458,27.763 287.415,27.781 C287.439,31.825 287.4,35.871 287.436,39.914 C282.771,44.546 275.122,45.623 269.328,42.55 C265.109,40.402 261.961,36.286 261.029,31.646 C260.866,29.62 260.899,27.575 260.999,25.546 z" fill="#C1E3F7"/>
<path d="M380.573,21.215 C381.538,18.579 383.901,16.61 386.555,15.809 C390.831,14.593 395.748,15.888 398.806,19.134 C397.416,21.084 396.431,23.347 394.744,25.07 C393.631,23.599 392.014,22.255 390.07,22.322 C389.036,22.264 387.768,22.473 387.204,23.438 C387.055,24.257 387.131,25.091 387.176,25.916 C390.079,27.235 393.446,27.351 396.136,29.186 C400.295,31.676 401.22,37.933 398.308,41.704 C397.113,43.293 395.308,44.37 393.403,44.876 C388.984,46.232 384.18,44.667 380.543,42.056 C380.173,41.722 379.524,41.513 379.533,40.933 C379.427,40.315 379.891,39.826 380.167,39.32 C381.11,37.852 381.971,36.323 383.039,34.937 C384.723,36.69 386.928,38.222 389.448,38.225 C390.628,38.219 392.06,38.443 392.873,37.36 C393.076,36.475 393.061,35.21 392.063,34.828 C389.624,33.757 386.861,33.605 384.504,32.307 C382.008,31.042 380.1,28.427 380.127,25.57 C380.142,24.114 379.957,22.586 380.573,21.215 z" fill="#C1E3F7"/>
<path d="M354.979,16.889 C362.759,16.886 370.542,16.862 378.326,16.901 C377.403,18.894 376.035,20.629 374.904,22.501 C374.498,23.019 374.173,23.875 373.409,23.878 C369.584,23.89 365.759,23.884 361.934,23.875 C361.922,24.864 361.928,25.849 361.955,26.838 C365.984,26.944 370.015,26.844 374.043,26.89 C374.125,29.207 374.082,31.524 374.064,33.842 C370.018,33.881 365.974,33.857 361.928,33.857 C361.922,34.861 361.928,35.865 361.962,36.866 C366.008,36.96 370.06,36.851 374.109,36.923 C375.529,39.153 377.039,41.325 378.329,43.633 C376.387,44.039 374.419,43.739 372.468,43.684 C370.548,43.8 368.622,43.954 366.705,43.766 C364.582,43.554 362.456,43.757 360.336,43.836 C358.495,43.648 356.644,44.012 354.821,43.633 C354.703,35.589 354.806,27.542 354.764,19.498 C354.74,18.624 354.809,17.751 354.979,16.889 z" fill="#C1E3F7"/>
<path d="M308.596,17.202 C310.907,16.701 313.288,16.932 315.633,16.886 C315.696,25.819 315.651,34.749 315.657,43.681 C313.397,43.724 311.134,43.633 308.878,43.73 C308.963,42.271 308.945,40.809 308.878,39.35 C305.226,39.365 301.577,39.329 297.928,39.368 C297.934,39.49 297.949,39.726 297.955,39.844 C298.022,41.127 297.776,42.398 297.719,43.681 C295.401,43.697 293.087,43.69 290.773,43.681 C290.636,41.164 291.082,38.671 291.361,36.177 C292.126,31.646 293.824,27.172 296.83,23.641 C299.815,20.186 304.07,17.845 308.596,17.202 M301.798,28.6 C300.943,29.714 300.012,30.927 300,32.398 C302.951,32.371 305.908,32.507 308.857,32.334 C308.99,29.698 308.89,27.056 308.899,24.418 C306.039,24.594 303.591,26.48 301.798,28.6 z" fill="#C1E3F7"/>
<path d="M319.291,21.924 C319.33,20.232 319.136,18.518 319.536,16.853 C325.403,16.868 331.354,19.191 335.279,23.632 C336.677,22.479 337.914,21.124 339.483,20.183 C342.355,18.379 345.692,17.132 349.116,17.147 C349.871,17.126 350.63,17.12 351.391,17.123 C351.382,26.004 351.439,34.885 351.361,43.766 C349.037,44.006 346.72,43.624 344.396,43.654 C344.415,38.161 344.424,32.671 344.393,27.178 C342.131,27.287 340.32,28.889 338.755,30.366 C337.384,31.615 336.477,33.253 335.245,34.618 C333.962,32.434 332.276,30.517 330.332,28.901 C329.188,27.706 327.617,26.959 325.943,27.141 C325.876,32.707 326.03,38.273 325.867,43.839 C323.68,43.933 321.511,43.639 319.327,43.666 C319.242,36.42 319.318,29.171 319.291,21.924 z" fill="#C1E3F7"/>
<path d="M78.917,23.872 C80.288,21.654 81.72,19.48 83.082,17.259 C89.9,17.247 96.722,17.193 103.541,17.287 C102.964,18.879 101.875,20.195 100.999,21.621 C100.429,22.485 99.955,23.447 99.149,24.123 C97.596,24.263 96.03,24.148 94.471,24.178 C94.438,30.76 94.493,37.345 94.447,43.927 C92.127,43.933 89.803,44.006 87.486,43.875 C87.465,37.312 87.565,30.745 87.434,24.184 C85.178,24.181 82.918,24.181 80.661,24.187 C80.064,24.196 79.469,24.096 78.917,23.872 z" fill="#C1E3F7"/>
<path d="M104.693,23.456 C107.887,19.828 112.616,17.772 117.372,17.271 C119.201,17.22 121.036,17.19 122.865,17.25 C123.268,17.581 123.235,18.109 123.241,18.579 C123.226,26.471 123.235,34.363 123.238,42.256 C123.232,42.893 123.114,43.521 123.026,44.148 C120.857,44.233 118.685,44.167 116.517,44.194 C116.592,42.586 116.532,40.976 116.332,39.38 C113.441,39.304 110.55,39.389 107.66,39.32 C106.923,39.402 105.964,39.126 105.385,39.687 C104.757,40.909 104.884,42.353 104.769,43.687 C102.682,43.903 100.583,43.875 98.49,43.778 C98.33,41.537 98.621,39.308 98.93,37.093 C99.312,34.036 100.183,31.033 101.584,28.285 C102.437,26.562 103.616,25.036 104.693,23.456 M107.059,32.668 C110.059,32.774 113.065,32.695 116.071,32.707 C116.077,30.026 116.107,27.348 116.049,24.666 C111.845,25.343 108.467,28.755 107.059,32.668 z" fill="#C1E3F7"/>
<path d="M126.981,17.311 C129.947,17.247 132.914,17.311 135.88,17.281 C137.576,17.268 139.311,17.217 140.955,17.711 C142.647,18.178 144.185,19.07 145.587,20.111 C147.282,21.563 148.265,23.69 148.677,25.852 C149.181,29.419 148.802,33.469 146.217,36.211 C145.881,36.699 145.047,37.193 145.45,37.867 C146.636,39.911 148.049,41.816 149.202,43.885 C147.446,44.455 145.577,44.085 143.77,44.194 C142.799,44.118 141.574,44.491 140.867,43.618 C139.987,42.504 139.366,41.218 138.607,40.026 C137.036,39.32 135.259,39.696 133.602,39.753 C133.605,41.14 133.599,42.523 133.566,43.909 C131.37,43.954 129.171,43.957 126.975,43.909 C126.923,35.043 126.92,26.174 126.981,17.311 M133.645,28.294 C133.66,29.607 133.587,30.924 133.672,32.237 C133.76,32.349 133.933,32.577 134.018,32.689 C135.45,32.762 136.887,32.716 138.325,32.719 C139.972,32.789 141.722,31.564 141.816,29.835 C141.856,28.252 142.159,26.341 140.803,25.182 C138.895,23.532 136.187,24.372 133.906,24.154 C133.496,25.5 133.669,26.911 133.645,28.294 z" fill="#C1E3F7"/>
<path d="M190.308,17.235 C192.543,17.223 194.779,17.223 197.014,17.235 C197.072,26.134 197.008,35.034 197.048,43.933 C196.001,44.279 194.894,44.188 193.814,44.197 C192.631,44.179 191.424,44.291 190.28,43.933 C190.314,35.034 190.256,26.134 190.308,17.235 z" fill="#C1E3F7"/>
<path d="M201.537,21.475 C202.477,20.059 203.281,18.551 204.354,17.226 C211.146,17.29 217.94,17.174 224.731,17.281 C223.931,19.128 222.617,20.675 221.61,22.401 C221.182,23.007 220.879,23.775 220.2,24.145 C218.72,24.242 217.233,24.157 215.75,24.175 C215.404,25.828 215.589,27.527 215.547,29.204 C215.52,34.036 215.608,38.871 215.507,43.7 L215.344,43.912 C213.09,43.997 210.833,43.936 208.58,43.915 C208.531,37.336 208.595,30.757 208.543,24.175 C205.768,24.184 202.996,24.196 200.22,24.163 C200.338,23.135 201,22.319 201.537,21.475 z" fill="#C1E3F7"/>
<path d="M227.313,17.229 C229.484,17.256 231.656,17.168 233.825,17.256 L234.007,17.444 C234.122,19.649 233.967,21.861 234.061,24.066 C234.161,25.61 234.896,27.223 236.403,27.845 C238.444,28.904 241.177,27.448 241.593,25.24 C241.708,22.58 241.593,19.913 241.647,17.253 C243.956,17.208 246.267,17.22 248.575,17.25 C248.627,19.716 248.587,22.185 248.605,24.654 C248.715,28.767 246.015,32.704 242.254,34.294 C241.726,34.482 241.28,34.952 241.317,35.546 C241.289,38.361 241.335,41.182 241.302,44 C239.093,44.367 236.837,44.145 234.607,44.158 C234.383,42.82 234.31,41.467 234.513,40.123 C234.565,38.282 234.301,36.447 234.34,34.603 C230.237,33.205 227.064,29.052 227.291,24.651 C227.3,22.176 227.267,19.704 227.313,17.229 z" fill="#C1E3F7"/>
<path d="M21.078,29.322 C29.489,26.541 37.948,23.899 46.344,21.075 C46.499,21.205 46.805,21.46 46.957,21.588 C40.178,26.644 33.022,31.166 25.864,35.662 C21.778,38.043 17.787,40.612 13.528,42.677 L13.516,42.365 C14.192,38.661 15.221,35.022 15.703,31.285 C15.839,31.212 16.106,31.066 16.24,30.997 C17.799,30.287 19.458,29.859 21.078,29.322 z" fill="#C1E3F7"/>
<path d="M31.639,15.057 C31.782,14.848 32.067,14.429 32.206,14.223 C32.716,15.127 33.004,16.128 33.444,17.065 C33.671,17.608 34.345,17.733 34.869,17.757 C36.896,17.802 38.925,17.799 40.948,17.881 C44.694,18.282 48.44,18.594 52.165,19.146 C49.134,22.51 45.522,25.282 42.152,28.294 C40.963,29.398 39.58,30.272 38.364,31.342 C38.218,31.904 38.4,32.48 38.543,33.023 C39.823,37.488 40.848,42.019 41.773,46.569 C42.046,47.552 42.07,48.577 42.067,49.59 C36.896,47.048 32.027,43.915 27.174,40.815 C26.832,40.651 26.513,40.311 26.107,40.369 C25.154,40.794 24.329,41.443 23.45,41.995 C19.716,44.382 15.894,46.633 12.036,48.814 C11.435,49.156 10.78,49.378 10.128,49.593 C10.777,45.701 11.666,41.852 12.554,38.009 C13.015,36.396 13.255,34.706 13.944,33.165 C14.226,32.525 14.526,31.894 14.793,31.245 C15.096,31.257 15.399,31.27 15.703,31.285 C15.22,35.022 14.192,38.661 13.516,42.365 C13.434,41.792 13.334,41.221 13.237,40.654 C12.56,42.872 12.042,45.137 11.778,47.443 C16.279,45.334 20.395,42.508 24.569,39.826 C25.245,39.35 26.094,39.308 26.877,39.502 C31.251,42.256 35.558,45.14 40.126,47.576 C40.396,47.715 40.669,47.855 40.942,47.995 C40.76,45.723 40.162,43.518 39.683,41.3 C38.913,37.961 38.1,34.627 37.081,31.355 C37.748,30.533 38.443,29.723 39.289,29.077 C41.521,27.381 43.629,25.531 45.713,23.659 C47.014,22.437 48.595,21.491 49.608,19.98 C49.665,19.913 49.781,19.774 49.841,19.707 C47.645,19.598 45.47,19.264 43.283,19.064 C39.807,18.961 36.359,18.418 32.877,18.421 C32.473,17.296 32.07,16.17 31.639,15.057 z" fill="#B3D7EE"/>
<path d="M46.344,21.075 C47.421,20.684 48.519,20.344 49.608,19.98 C48.595,21.491 47.014,22.437 45.713,23.659 C43.629,25.531 41.521,27.381 39.289,29.077 C38.443,29.723 37.748,30.533 37.081,31.355 C35.103,32.489 33.323,33.93 31.515,35.31 C29.968,36.587 28.266,37.654 26.668,38.862 C26.719,39.019 26.825,39.341 26.877,39.502 C26.094,39.308 25.245,39.35 24.569,39.826 C20.395,42.508 16.279,45.334 11.778,47.443 C12.042,45.137 12.56,42.872 13.237,40.654 C13.334,41.221 13.434,41.792 13.516,42.365 L13.528,42.677 C17.787,40.612 21.778,38.043 25.864,35.662 C33.022,31.166 40.177,26.644 46.957,21.588 C46.805,21.46 46.499,21.205 46.344,21.075 z" fill="#97C3E4"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 15 KiB

View File

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg x="0" y="0" width="550" height="550" viewBox="0 0 550 550" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<path id="questionmark" d="M431,-17c0,0,-45,0,-79,29c0,0,-34,29,-34,82c0,0,0,47,33,79c0,0,33,32,80,32c0,0,47,0,80,-32c0,0,32,-32,32,-79c0,0,0,-52,-34,-82c0,0,-34,-29,-78,-29Zm-8,290c0,0,-39,0,-65,26c0,0,-27,25,-27,75c0,0,0,63,20,109c0,0,19,46,51,80c0,0,32,35,87,83c0,0,47,42,69,63c0,0,21,21,36,48c0,0,14,26,14,56c0,0,0,60,-44,101c0,0,-45,41,-115,41c0,0,-82,0,-121,-41c0,0,-38,-42,-65,-123c0,0,-26,-84,-96,-84c0,0,-42,0,-71,30c0,0,-29,29,-29,64c0,0,0,71,46,143c0,0,45,73,133,121c0,0,87,48,203,48c0,0,108,0,191,-40c0,0,83,-40,128,-109c0,0,46,-69,46,-149c0,0,0,-64,-26,-112c0,0,-26,-47,-61,-82c0,0,-36,-35,-128,-117c0,0,-25,-23,-40,-41c0,0,-16,-17,-23,-32c0,0,-8,-14,-12,-29c0,0,-4,-14,-12,-51c0,0,-14,-78,-89,-78Z" transform="scale(0.001,-0.001)"/>
</defs>
<path d="M76.6,120.1l130.6,-35C223.3,80.8,231.5,78.6,241,79c10.5,.9,20,6.4,26,15c5.1,8,7.3,16.2,11.7,32.7l68.8,256.7c4.3,16.1,6.5,24.3,6.1,33.8c-.9,10.5,-6.4,20,-15,26c-8,5.1,-16.2,7.3,-32.6,11.7L175.7,489.8c-16.2,4.4,-24.4,6.6,-33.8,6.1c-10.5,-.9,-20,-6.4,-26.1,-15c-5.1,-8,-7.3,-16.2,-11.7,-32.6L35.3,191.6C31,175.4,28.8,167.2,29.2,157.8c1,-10.5,6.5,-20,15.1,-26.1c8,-5.1,16.2,-7.3,32.6,-11.7Z" fill="#D3D3D3"/>
<path d="M207.4,96.1H342.6c16.7,0,25.2,0,34.2,2.8c9.9,3.6,17.7,11.4,21.3,21.3c2.9,9,2.9,17.5,2.9,34.5V420.5c0,16.7,0,25.2,-2.9,34.3c-3.6,9.8,-11.4,17.6,-21.3,21.2c-9,2.9,-17.5,2.9,-34.5,2.9H207.4c-16.7,0,-25.2,0,-34.2,-2.9c-9.9,-3.6,-17.7,-11.4,-21.3,-21.2C149,445.7,149,437.2,149,420.2V154.5c0,-16.8,0,-25.3,2.9,-34.3c3.6,-9.9,11.4,-17.7,21.3,-21.3c9,-2.8,17.5,-2.8,34.5,-2.8Z" fill="#808080"/>
<path d="M341.5,85.1l130.6,35c16.1,4.3,24.3,6.5,32.3,11.6c8.6,6.1,14.1,15.6,15,26.1c.5,9.4,-1.7,17.6,-6.1,34L444.5,448.6c-4.3,16.1,-6.5,24.3,-11.6,32.3c-6.1,8.6,-15.6,14.1,-26.1,15c-9.4,.5,-17.7,-1.7,-34.1,-6.1L242.5,454.9c-16.2,-4.4,-24.4,-6.6,-32.4,-11.7c-8.6,-6,-14.1,-15.5,-15,-26c-.5,-9.5,1.7,-17.7,6.1,-34.1L270,126.4C274.4,110.2,276.6,102,281.7,94c6,-8.6,15.5,-14.1,26,-15c9.5,-.4,17.7,1.8,34.1,6.2Z" fill="#282828"/>
<use xlink:href="#questionmark" transform="matrix(227,60.8,-60.8,227,223.2,371.6)" fill="#FFFFFF"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,84 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="360" height="78" viewBox="0, 0, 360, 78">
<g id="Background">
<rect x="0" y="0" width="360" height="78" fill="#000000" fill-opacity="0"/>
</g>
<defs>
<linearGradient id="Gradient_1" gradientUnits="userSpaceOnUse" x1="222.559" y1="0.5" x2="222.559" y2="77.5">
<stop offset="0" stop-color="#FFFFFF"/>
<stop offset="1" stop-color="#ADADAD"/>
</linearGradient>
<clipPath id="Clip_1">
<path d="M189.034,27.968 L221.927,39.126 L201.26,67.168 C192.256,60.163 187.524,50.356 187.237,39 C187.22,36.02 187.638,33.063 188.349,30.173 C188.533,29.425 188.806,28.703 189.034,27.968 z"/>
</clipPath>
<filter id="InnerShadow_2">
<feGaussianBlur in="SourceAlpha" stdDeviation="1.5"/>
<feOffset dx="0" dy="1" result="offsetblur"/>
<feFlood flood-color="#000000"/>
<feComposite in2="offsetblur" operator="in"/>
</filter>
<clipPath id="Clip_3">
<path d="M256.164,28.229 C257.409,31.686 257.788,35.352 257.88,39 C257.824,50.049 252.933,59.679 244.478,66.656 L224.196,39.091 L256.164,28.229 z"/>
</clipPath>
<filter id="InnerShadow_4">
<feGaussianBlur in="SourceAlpha" stdDeviation="1.5"/>
<feOffset dx="0" dy="3" result="offsetblur"/>
<feFlood flood-color="#000000"/>
<feComposite in2="offsetblur" operator="in"/>
</filter>
<clipPath id="Clip_5">
<path d="M222.34,3.684 L222.34,37.808 L189.476,26.627 C195.01,12.714 207.357,4.063 222.34,3.684 z"/>
</clipPath>
<filter id="InnerShadow_6">
<feGaussianBlur in="SourceAlpha" stdDeviation="1.5"/>
<feOffset dx="1" dy="2" result="offsetblur"/>
<feFlood flood-color="#000000"/>
<feComposite in2="offsetblur" operator="in"/>
</filter>
<clipPath id="Clip_7">
<path d="M223.697,3.707 C235.506,3.958 246.662,10.631 252.767,20.684 C254.303,23.214 254.605,24.18 255.754,26.91 L223.721,37.794 L223.697,3.707 z"/>
</clipPath>
<filter id="InnerShadow_8">
<feGaussianBlur in="SourceAlpha" stdDeviation="1.5"/>
<feOffset dx="-1" dy="2" result="offsetblur"/>
<feFlood flood-color="#000000"/>
<feComposite in2="offsetblur" operator="in"/>
</filter>
</defs>
<g id="Layer_1">
<g>
<path d="M222.559,0.5 C243.822,0.5 261.059,17.737 261.059,39 C261.059,60.263 243.822,77.5 222.559,77.5 C201.296,77.5 184.059,60.263 184.059,39 C184.059,17.737 201.296,0.5 222.559,0.5 z" fill="url(#Gradient_1)"/>
<path d="M223.074,39.696 L243.49,67.441 C237.181,72.048 230.325,74.125 222.559,74.322 C214.981,74.281 208.563,72.126 202.321,67.91 L223.074,39.696 z" fill="#FF0A28"/>
<g>
<path d="M189.034,27.968 L221.927,39.127 L201.26,67.168 C192.256,60.163 187.524,50.356 187.237,39 C187.22,36.02 187.638,33.063 188.349,30.173 C188.533,29.425 188.806,28.703 189.034,27.968 z" fill="#45BD06"/>
<path d="M183.236,22.968 L225.927,22.968 L225.927,72.168 L183.236,72.168 z M189.034,27.968 C188.806,28.703 188.533,29.425 188.349,30.173 C187.638,33.063 187.22,36.02 187.237,39 C187.524,50.356 192.256,60.163 201.26,67.168 L221.927,39.126 L189.034,27.968 z" clip-path="url(#Clip_1)" filter="url(#InnerShadow_2)" fill="rgba(0,0,0,0.25)"/>
</g>
<g>
<path d="M256.164,28.229 C257.409,31.686 257.788,35.352 257.88,39 C257.824,50.049 252.933,59.679 244.478,66.656 L224.196,39.091 L256.164,28.229 z" fill="#121212"/>
<path d="M220.196,21.229 L261.88,21.229 L261.88,73.656 L220.196,73.656 z M256.164,28.229 L224.196,39.091 L244.478,66.656 C252.933,59.679 257.824,50.049 257.88,39 C257.788,35.352 257.409,31.686 256.164,28.229 z" clip-path="url(#Clip_3)" filter="url(#InnerShadow_4)" fill="rgba(0,0,0,1)"/>
</g>
<g>
<path d="M222.34,3.684 L222.34,37.808 L189.476,26.627 C195.01,12.714 207.357,4.063 222.34,3.684 z" fill="#EBE9E9"/>
<path d="M184.476,-2.316 L227.34,-2.316 L227.34,43.808 L184.476,43.808 z M222.34,3.684 C207.357,4.063 195.01,12.714 189.476,26.627 L222.34,37.808 L222.34,3.684 z" clip-path="url(#Clip_5)" filter="url(#InnerShadow_6)" fill="rgba(0,0,0,0.25)"/>
</g>
<g>
<path d="M223.697,3.707 C235.506,3.958 246.662,10.631 252.767,20.684 C254.303,23.214 254.605,24.18 255.754,26.91 L223.721,37.794 L223.697,3.707 z" fill="#037ABA"/>
<path d="M218.697,-2.293 L260.754,-2.293 L260.754,43.794 L218.697,43.794 z M223.697,3.707 L223.721,37.794 L255.754,26.91 C254.605,24.18 254.303,23.214 252.767,20.684 C246.662,10.631 235.506,3.958 223.697,3.707 z" clip-path="url(#Clip_7)" filter="url(#InnerShadow_8)" fill="rgba(0,0,0,0.256)"/>
</g>
</g>
<g>
<path d="M1.706,18.945 C10.218,18.943 18.732,18.939 27.244,18.948 C27.211,21.164 27.271,23.381 27.213,25.598 C24.31,25.577 21.407,25.602 18.504,25.584 C18.498,36.745 18.498,47.904 18.504,59.063 C15.815,59.07 13.125,59.066 10.436,59.066 C10.44,47.906 10.434,36.749 10.438,25.592 C7.535,25.592 4.63,25.586 1.725,25.594 C1.692,23.377 1.727,21.162 1.706,18.945 z" fill="#FFFFFF"/>
<path d="M38.566,18.937 C41.887,18.954 45.208,18.937 48.529,18.943 C52.039,32.322 55.585,45.689 59.097,59.066 C56.292,59.057 53.486,59.086 50.682,59.051 C50.233,56.774 49.689,54.517 49.212,52.248 C49.105,51.698 48.983,51.154 48.875,50.606 C45.322,50.592 41.771,50.604 38.218,50.6 C37.624,53.415 36.934,56.211 36.408,59.038 C33.592,59.099 30.774,59.053 27.956,59.063 C31.522,45.696 35,32.305 38.566,18.937 M42.218,31.834 C41.342,35.87 40.481,39.906 39.618,43.943 C42.237,43.943 44.854,43.946 47.473,43.943 C46.254,38.362 45.038,32.776 43.891,27.18 L43.812,27.046 C43.767,26.613 43.661,26.19 43.465,25.8 C43.135,27.827 42.587,29.813 42.218,31.834 z" fill="#FFFFFF"/>
<path d="M61.975,18.948 C66.288,18.939 70.599,18.945 74.912,18.943 C77.024,18.883 79.21,18.989 81.152,19.914 C83.887,21.083 85.792,23.702 86.517,26.552 C87.351,29.871 87.325,33.526 85.966,36.703 C84.83,39.468 82.326,41.529 79.492,42.343 C76.442,43.352 73.197,42.948 70.048,43.031 C70.04,48.375 70.042,53.719 70.046,59.063 C67.358,59.07 64.669,59.066 61.979,59.066 C61.979,45.691 61.988,32.32 61.975,18.948 M70.044,24.888 C70.038,28.951 70.05,33.015 70.04,37.078 C71.386,37.074 72.731,37.095 74.077,37.07 C75.581,37.039 77.115,36.357 77.955,35.068 C79.034,33.44 79.111,31.372 78.897,29.488 C78.717,27.988 78.071,26.4 76.686,25.648 C74.657,24.529 72.257,24.984 70.044,24.888 z" fill="#FFFFFF"/>
<path d="M90.96,18.948 C95.818,18.941 100.677,18.941 105.535,18.948 C108.436,18.941 111.442,20.037 113.339,22.312 C115.399,24.74 116.097,28.055 116.045,31.178 C116.045,34.288 115.123,37.557 112.871,39.785 C110.674,41.972 107.533,42.887 104.51,43.018 C102.686,43.045 100.86,43.025 99.033,43.029 C99.023,48.375 99.029,53.719 99.029,59.066 C96.342,59.066 93.652,59.068 90.962,59.066 C90.965,45.691 90.971,32.32 90.96,18.948 M99.025,37.078 C100.435,37.068 101.847,37.107 103.257,37.06 C104.736,36.985 106.212,36.255 107.005,34.968 C108.079,33.232 108.119,31.061 107.821,29.098 C107.597,27.673 106.866,26.227 105.531,25.571 C103.518,24.552 101.195,24.981 99.031,24.888 C99.021,28.951 99.035,33.015 99.025,37.078 z" fill="#FFFFFF"/>
<path d="M119.941,18.948 C127.391,18.937 134.839,18.946 142.289,18.943 C142.276,21.16 142.299,23.377 142.276,25.594 C137.522,25.588 132.766,25.59 128.012,25.592 C128.01,28.728 128.021,31.863 128.006,34.999 C132.493,35.007 136.982,34.995 141.471,35.005 C141.454,37.224 141.475,39.443 141.46,41.66 C136.976,41.658 132.493,41.656 128.01,41.662 C128.014,45.237 128.014,48.815 128.01,52.39 C130.663,52.444 133.311,52.382 135.965,52.411 C136.804,52.323 137.642,52.519 138.483,52.434 C139.442,52.365 140.407,52.371 141.365,52.43 C141.866,52.398 142.367,52.44 142.868,52.486 C142.862,54.676 142.862,56.865 142.868,59.057 C135.228,59.078 127.588,59.061 119.948,59.066 C119.946,45.694 119.956,32.32 119.941,18.948 z" fill="#FFFFFF"/>
<path d="M147.268,18.95 C151.999,18.941 156.728,18.937 161.46,18.952 C164.661,18.991 168.031,20.087 170.137,22.623 C172.491,25.469 173.185,29.263 173.522,32.849 C173.775,36.726 173.806,40.626 173.475,44.502 C173.113,48.058 172.493,51.779 170.379,54.753 C168.913,56.824 166.599,58.163 164.147,58.67 C162.793,58.982 161.397,59.072 160.012,59.066 C155.766,59.066 151.519,59.068 147.272,59.066 C147.272,45.694 147.283,32.322 147.268,18.95 M155.352,24.888 C155.345,34.291 155.358,43.693 155.345,53.096 C157.37,53.015 159.447,53.328 161.426,52.784 C162.971,52.371 164.048,51 164.557,49.533 C165.454,46.992 165.46,44.26 165.621,41.599 C165.646,39.72 165.64,37.841 165.63,35.962 C165.481,33.553 165.456,31.082 164.652,28.78 C164.141,27.309 163.108,25.925 161.613,25.381 C159.615,24.619 157.437,24.969 155.352,24.888 z" fill="#FFFFFF"/>
</g>
<g>
<path d="M282.709,18.47 C285.879,17.951 289.225,18.015 292.275,19.111 C294.992,20.116 297.124,22.384 298.147,25.091 C299.578,28.706 299.797,32.662 299.915,36.509 C299.965,40.64 299.992,44.805 299.278,48.889 C298.808,51.589 297.911,54.339 296.031,56.387 C294.159,58.448 291.408,59.458 288.699,59.729 C286.372,59.938 283.991,59.894 281.713,59.323 C279.454,58.744 277.322,57.471 275.945,55.548 C274.365,53.35 273.62,50.666 273.245,48.012 C272.74,44.509 272.721,40.963 272.746,37.432 C272.837,33.412 272.959,29.283 274.355,25.468 C275.23,23.028 276.895,20.822 279.229,19.636 C280.312,19.051 281.502,18.695 282.709,18.47 M282.326,26.32 C281.221,28.458 281.026,30.929 280.941,33.294 C280.695,37.036 280.806,40.799 280.877,44.547 L280.958,44.682 C280.989,46.989 281.212,49.38 282.208,51.491 C282.875,52.985 284.48,53.937 286.099,53.864 C287.569,53.989 289.165,53.487 290.041,52.229 C291.399,50.293 291.503,47.828 291.733,45.553 C291.89,41.103 291.9,36.642 291.714,32.192 C291.459,29.958 291.331,27.522 289.925,25.658 C289.045,24.478 287.513,24.03 286.099,24.145 C284.554,24.068 283.032,24.937 282.326,26.32 z" fill="#FFFFFF"/>
<path d="M304.253,18.959 C306.951,18.932 309.651,18.949 312.351,18.951 C312.33,28.239 312.347,37.527 312.343,46.814 C312.374,48.622 312.434,50.56 313.409,52.143 C314.158,53.343 315.581,53.92 316.956,53.891 C318.256,53.929 319.649,53.522 320.465,52.439 C321.625,50.899 321.703,48.872 321.759,47.02 C321.759,37.663 321.772,28.308 321.753,18.951 C324.447,18.945 327.141,18.943 329.834,18.953 C329.826,27.127 329.832,35.3 329.83,43.476 C329.816,45.98 329.944,48.516 329.431,50.985 C328.898,53.618 327.47,56.125 325.24,57.658 C322.161,59.796 318.252,60.025 314.639,59.752 C312.183,59.481 309.661,58.754 307.796,57.05 C305.851,55.337 304.87,52.781 304.499,50.262 C304.164,47.524 304.276,44.763 304.259,42.013 C304.255,34.327 304.268,26.643 304.253,18.959 z" fill="#FFFFFF"/>
<path d="M332.762,18.951 C341.272,18.945 349.784,18.943 358.294,18.951 C358.265,21.168 358.316,23.385 358.267,25.601 C355.362,25.581 352.457,25.606 349.552,25.589 C349.55,36.748 349.55,47.907 349.552,59.067 C346.866,59.071 344.179,59.069 341.493,59.069 C341.498,47.912 341.491,36.752 341.496,25.595 C338.591,25.595 335.688,25.589 332.785,25.599 C332.741,23.382 332.785,21.166 332.762,18.951 z" fill="#FFFFFF"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 11 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 38 KiB

View File

@ -0,0 +1,13 @@
<svg width="238" height="38" viewBox="0 0 238 38" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.0588 8.49174L20.5506 0L29.0423 8.49174H23.94V23.6106C23.94 26.2706 23.332 28.2086 22.116 29.4246C20.9253 30.6152 19 31.2106 16.34 31.2106H7.60001C4.94 31.2106 3.002 30.6152 1.786 29.4246C0.595337 28.2086 0 26.2706 0 23.6106V4.23058H6.84V23.6106C6.84 25.1306 7.60001 25.8906 9.12 25.8906H14.82C16.34 25.8906 17.1 25.1306 17.1 23.6106V8.49174H12.0588Z" fill="white"/>
<path d="M39.33 15.8206C37.9873 15.8206 36.4673 16.0739 34.77 16.5806V30.8306H28.12V10.6906H34.01L34.39 12.5906C35.5807 11.8052 36.7967 11.2352 38.038 10.8806C39.3047 10.5006 40.3687 10.3106 41.23 10.3106H42.94C44.6627 10.3106 46.0433 10.8299 47.082 11.8686C48.1207 12.9072 48.64 14.2879 48.64 16.0106V30.8306H41.99V17.1506C41.99 16.7706 41.8633 16.4539 41.61 16.2006C41.3567 15.9473 41.04 15.8206 40.66 15.8206H39.33Z" fill="white"/>
<path d="M58.8956 31.2106C61.2516 31.2106 63.6582 31.0839 66.1155 30.8306V25.8906H61.1756C60.7955 25.8906 60.4789 25.7639 60.2256 25.5106C59.9722 25.2572 59.8456 24.9406 59.8456 24.5606V15.8206H64.5956V10.6906H59.8456V6.13057H53.9556L53.1956 10.6906H50.9155V15.8206H53.1956V25.5106C53.1956 27.2332 53.7149 28.6139 54.7535 29.6526C55.7922 30.6912 57.1729 31.2106 58.8956 31.2106Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M68.9997 11.0706C73.6357 10.5639 77.8157 10.3106 81.5397 10.3106C83.2624 10.3106 84.643 10.8299 85.6817 11.8686C86.7204 12.9072 87.2397 14.2879 87.2397 16.0106V30.8306H81.3497L80.9697 28.9306C79.779 29.7159 78.5504 30.2986 77.2837 30.6786C76.0424 31.0332 74.991 31.2106 74.1297 31.2106H72.7997C71.077 31.2106 69.6964 30.6912 68.6577 29.6526C67.619 28.6139 67.0997 27.2332 67.0997 25.5106V23.8006C67.0997 22.0779 67.619 20.6973 68.6577 19.6586C69.6964 18.6199 71.077 18.1006 72.7997 18.1006H80.5897V16.5806C80.5897 16.2006 80.463 15.8839 80.2097 15.6306C79.9564 15.3772 79.6397 15.2506 79.2597 15.2506C77.613 15.2506 75.789 15.3266 73.7877 15.4786C71.8117 15.6306 70.2157 15.7446 68.9997 15.8206V11.0706ZM76.0297 25.8906C77.3724 25.8906 78.8924 25.6372 80.5897 25.1306V22.8506H75.0797C74.6997 22.8506 74.383 22.9772 74.1297 23.2306C73.8764 23.4839 73.7497 23.8006 73.7497 24.1806V24.5606C73.7497 24.9406 73.8764 25.2572 74.1297 25.5106C74.383 25.7639 74.6997 25.8906 75.0797 25.8906H76.0297Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M97.2993 37.2906V30.8306H105.089C106.989 30.8306 108.471 30.2986 109.535 29.2346C110.625 28.1452 111.169 26.6506 111.169 24.7506V16.0106C111.169 14.2879 110.65 12.9072 109.611 11.8686C108.573 10.8299 107.192 10.3106 105.469 10.3106H103.759C102.898 10.3106 101.834 10.5006 100.567 10.8806C99.326 11.2352 98.11 11.8052 96.9193 12.5906L96.5393 10.6906H90.6493V37.2906H97.2993ZM97.2993 16.5806C98.9966 16.0739 100.517 15.8206 101.859 15.8206H103.189C103.569 15.8206 103.886 15.9473 104.139 16.2006C104.393 16.4539 104.519 16.7706 104.519 17.1506V24.1806C104.519 25.1939 104.013 25.7006 102.999 25.7006H97.2993V16.5806Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M121.235 30.8306V37.2906H114.585V10.6906H120.475L120.855 12.5906C122.046 11.8052 123.262 11.2352 124.503 10.8806C125.77 10.5006 126.833 10.3106 127.695 10.3106H129.405C131.128 10.3106 132.508 10.8299 133.547 11.8686C134.586 12.9072 135.105 14.2879 135.105 16.0106V24.7506C135.105 26.6506 134.56 28.1452 133.471 29.2346C132.407 30.2986 130.925 30.8306 129.025 30.8306H121.235ZM125.795 15.8206C124.452 15.8206 122.932 16.0739 121.235 16.5806V25.7006H126.935C127.948 25.7006 128.455 25.1939 128.455 24.1806V17.1506C128.455 16.7706 128.328 16.4539 128.075 16.2006C127.822 15.9473 127.505 15.8206 127.125 15.8206H125.795Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M143.84 31.2106C147.818 31.2106 152.251 30.9572 157.14 30.4506V25.7006C152.302 26.0806 148.628 26.2706 146.12 26.2706C145.74 26.2706 145.424 26.1439 145.17 25.8906C144.917 25.6372 144.79 25.3206 144.79 24.9406V23.4206H157.9V16.3906C157.9 14.4906 157.356 13.0086 156.266 11.9446C155.202 10.8552 153.72 10.3106 151.82 10.3106H144.22C142.32 10.3106 140.826 10.8552 139.736 11.9446C138.672 13.0086 138.14 14.4906 138.14 16.3906V25.5106C138.14 27.2332 138.66 28.6139 139.698 29.6526C140.737 30.6912 142.118 31.2106 143.84 31.2106ZM144.79 16.5806C144.79 15.5672 145.297 15.0606 146.31 15.0606H149.73C150.744 15.0606 151.25 15.5672 151.25 16.5806V18.6706H144.79V16.5806Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M175.556 30.8306L175.176 28.9306C173.985 29.7159 172.756 30.2986 171.49 30.6786C170.248 31.0332 169.197 31.2106 168.336 31.2106H166.626C164.903 31.2106 163.522 30.6912 162.484 29.6526C161.445 28.6139 160.926 27.2332 160.926 25.5106V16.7706C160.926 14.8706 161.458 13.3886 162.522 12.3246C163.611 11.2352 165.106 10.6906 167.006 10.6906H174.796V4.23058H181.446V30.8306H175.556ZM170.236 25.7006C171.578 25.7006 173.098 25.4473 174.796 24.9406V15.8206H169.096C168.082 15.8206 167.576 16.3272 167.576 17.3406V24.3706C167.576 24.7506 167.702 25.0672 167.956 25.3206C168.209 25.5739 168.526 25.7006 168.906 25.7006H170.236Z" fill="white"/>
<path d="M191.321 25.1306H184.481V30.8306H191.321V25.1306Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M207.48 29.3106C205.023 29.8172 202.869 30.0706 201.02 30.0706H199.69C197.967 30.0706 196.587 29.5512 195.548 28.5126C194.509 27.4739 193.99 26.0932 193.99 24.3706V16.7706C193.99 14.8706 194.522 13.3886 195.586 12.3246C196.675 11.2352 198.17 10.6906 200.07 10.6906H214.13V31.9706C214.13 33.6932 213.611 35.0739 212.572 36.1126C211.533 37.1512 210.153 37.6706 208.43 37.6706C204.453 37.6706 200.019 37.4173 195.13 36.9106V31.9706C199.969 32.3506 203.642 32.5406 206.15 32.5406C206.53 32.5406 206.847 32.4139 207.1 32.1606C207.353 31.9072 207.48 31.5906 207.48 31.2106V29.3106ZM202.92 24.9406C204.516 24.9406 206.036 24.8139 207.48 24.5606V15.8206H202.16C201.147 15.8206 200.64 16.3272 200.64 17.3406V23.6106C200.64 23.9906 200.767 24.3073 201.02 24.5606C201.273 24.8139 201.59 24.9406 201.97 24.9406H202.92Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M224.584 30.0706C226.434 30.0706 228.587 29.8172 231.044 29.3106V31.2106C231.044 31.5906 230.918 31.9072 230.664 32.1606C230.411 32.4139 230.094 32.5406 229.714 32.5406C227.206 32.5406 223.533 32.3506 218.694 31.9706V36.9106C223.584 37.4173 228.017 37.6706 231.994 37.6706C233.717 37.6706 235.098 37.1512 236.136 36.1126C237.175 35.0739 237.694 33.6932 237.694 31.9706V10.6906H223.634C221.734 10.6906 220.24 11.2352 219.15 12.3246C218.086 13.3886 217.554 14.8706 217.554 16.7706V24.3706C217.554 26.0932 218.074 27.4739 219.112 28.5126C220.151 29.5512 221.532 30.0706 223.254 30.0706H224.584ZM231.044 24.5606C229.6 24.8139 228.08 24.9406 226.484 24.9406H225.534C225.154 24.9406 224.838 24.8139 224.584 24.5606C224.331 24.3073 224.204 23.9906 224.204 23.6106V17.3406C224.204 16.3272 224.711 15.8206 225.724 15.8206H231.044V24.5606Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 6.8 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 14 KiB

BIN
src/font/keyrune.eot Normal file

Binary file not shown.

136
src/font/keyrune.svg Normal file

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 324 KiB

BIN
src/font/keyrune.ttf Normal file

Binary file not shown.

BIN
src/font/keyrune.woff Normal file

Binary file not shown.

BIN
src/font/keyrune.woff2 Normal file

Binary file not shown.

25
src/scss/_aliases.scss Normal file
View File

@ -0,0 +1,25 @@
$keyrune-aliases: (
legchr: ("leg2"),
wl: ("wth2"),
pmei: ("pleaf"), // legacy support
pmtg: ("plgm", "parl"), // originally was plgm, but upgrading this to pmtg b/c of its ubiquity
po: ("por2"),
pvan: ("van"), // legacy support
);
$keyrune-complete-aliases: (
past: ("pmic"),
//
// shooting star
pmei: ("o90p", "pcel", "olep"),
//
// m in circle
pmtg: ("ptc", "rqs", "pred", "wc97", "jgp", "wc98"),
//
// expansion tokens
exo: ("pexo"),
sth: ("psth"),
tmp: ("ptmp"),
ugl: ("tugl"),
vis: ("mgb")
);

25
src/scss/_helpers.scss Normal file
View File

@ -0,0 +1,25 @@
//
// output the correct glyphs for the 3 layers' pseudoelements
//
@mixin layers($layers) {
&::before {
content: glyph-content(map-get($layers, rarity));
}
&.#{$keyrune-prefix}-border {
&::after {
content: glyph-content(map-get($layers, border));
}
}
&.#{$keyrune-prefix}-inner {
&::marker {
content: glyph-content(map-get($layers, inner));
}
}
}
//
// correctly parse the glyph's unicode for css
//
@function glyph_content($glyph) {
@return unquote("\"#{$glyph}\"");
}

15
src/scss/_media.scss Normal file
View File

@ -0,0 +1,15 @@
@use "sass:map";
:root {
--border-default: #{map.get($keyrune-colors, "white")};
--border-contrast: #{map.get($keyrune-colors, "black", "700")};
--rarity-default: #{map.get($keyrune-colors, "black", "700")};
--inner-default: #{map.get($keyrune-colors, "white")};
&[data-mode='dark'] {
--border-default: #{map.get($keyrune-colors, "black", "100")};
--border-contrast: #{map.get($keyrune-colors, "black", "900")};
--rarity-default: #{map.get($keyrune-colors, "black", "900")};
--inner-default: #{map.get($keyrune-colors, "white")};
}
}

281
src/scss/_variables.scss Normal file
View File

@ -0,0 +1,281 @@
// core
$keyrune-font-family: "keyrune" !default;
$keyrune-font-path: "../font" !default;
$keyrune-prefix: "ss" !default;
$keyrune-version: "4.0.38" !default;
// build options
$keyrune-include-aliases: true;
//
$keyrune-colors: (
"black": (
"100": "#ddd",
"300": "#3a3a3a", // old "#4e4d4b",
"500": "#202124", // old "#393735",
"700": "#131417", // old "#282828",
"900": "#000",
),
"white": "#fff",
);
// rarity colors
$keyrune-rarities: (
"common": (
"solid": "#131417",
"left": "#131417",
"center": "#131417",
"right": "#131417",
),
"common-alt": (
"solid": "#fff",
),
"uncommon": (
"solid": "#707883",
"left": "#4d6572",
"center": "#c3dfeb",
"right": "#4d6572",
),
"rare": (
"solid": "#b7a066",
"left": "#7f6f43",
"center": "#d9c287",
"right": "#7f6f43",
),
"mythic": (
"solid": "#bf4427",
"left": "#ac392e",
"center": "#eb9d3d",
"right": "#ac392e",
)
);
// set symbols
$keyrune-sets: (
lea: (
rarity: "\e000",
border: "\e001",
inner: "\e002",
print: 3
),
leb: (
rarity: "\e003",
border: "\e004",
inner: "\e005",
),
2ed: (
rarity: "\e006",
border: "\e007",
inner: "\e008",
),
ced: (
rarity: "\e009",
border: "\e00a",
inner: "\e00b",
),
cei: (
rarity: "\e00c",
border: "\e00d",
inner: "\e00e",
),
arn: (
rarity: "\e00f",
border: "\e010",
inner: "\e011",
),
atq: (
rarity: "\e012",
border: "\e013",
inner: "\f8ff", // empty
),
3ed: (
rarity: "\e015",
border: "\e016",
inner: "\e017",
),
fbb: (
rarity: "\e018",
border: "\e019",
inner: "\e01a",
),
leg: (
rarity: "\e01b",
border: "\e01c",
inner: "\e01d",
),
sum: (
rarity: "\e01e",
border: "\e01f",
inner: "\f8ff", // empty
),
pdrc: (
rarity: "\e021",
border: "\e022",
inner: "\f8ff", // empty
),
drk: (
rarity: "\e024",
border: "\e025",
inner: "\f8ff", // empty
),
phpr: (
rarity: "\e027",
border: "\e028",
inner: "\f8ff", // empty
),
fem: (
rarity: "\e02a",
border: "\e02b",
inner: "\f8ff", // empty
),
pmei: (
rarity: "\e02d",
border: "\e02e",
inner: "\f8ff", // empty
),
pmtg: (
rarity: "\e030",
border: "\e031",
inner: "\f8ff", // empty
),
4ed: (
rarity: "\e033",
border: "\e034",
inner: "\f8ff", // empty
),
4bb: (
rarity: "\e036",
border: "\e037",
inner: "\f8ff", // empty
),
ice: (
rarity: "\e039",
border: "\e03a",
inner: "\e03b",
),
chr: (
rarity: "\e03c",
border: "\e03d",
inner: "\f8ff", // empty
),
ren: (
rarity: "\e03f",
border: "\e040",
inner: "\f8ff", // empty
),
rin: (
rarity: "\e042",
border: "\e043",
inner: "\f8ff", // empty
),
hml: (
rarity: "\e045",
border: "\e046",
inner: "\e047",
),
all: (
rarity: "\e048",
border: "\e049",
inner: "\e04a",
),
mir: (
rarity: "\e04b",
border: "\e04c",
inner: "\f8ff", // empty
),
itp: (
rarity: "\e04e",
border: "\e04f",
inner: "\f8ff", // empty
),
vis: (
rarity: "\e051",
border: "\e052",
inner: "\e053", // empty
),
5ed: (
rarity: "\e054",
border: "\e055",
inner: "\f8ff", // empty
),
past: (
rarity: "\e057",
border: "\e058",
inner: "\f8ff", // empty
),
por: (
rarity: "\e05a",
border: "\e05b",
inner: "\e05c",
),
pvan: (
rarity: "\e05d",
border: "\e05e",
inner: "\f8ff", // empty
),
wth: (
rarity: "\e060",
border: "\e061",
inner: "\e062",
),
tmp: (
rarity: "\e063",
border: "\e064",
inner: "\f8ff", // empty
),
sth: (
rarity: "\e066",
border: "\e067",
inner: "\f8ff", // empty
),
exo: (
rarity: "\e069",
border: "\e06a",
inner: "\f8ff", // empty
),
p02: (
rarity: "\e06c",
border: "\e06d",
inner: "\f8ff", // empty
),
ugl: (
rarity: "\e06f",
border: "\e070",
inner: "\f8ff", // empty
),
palp: (
rarity: "\e072",
border: "\e073",
inner: "\f8ff", // empty
),
//
// ...
//
6ed: (
rarity: "\e07e",
border: "\e07f",
inner: "\f8ff", // empty
),
//
// backwards from the end for alternatives/oddities
legchr: (
rarity: "\f8f6",
border: "\f8f5",
inner: "\f8ff", // em
),
pgc98: (
rarity: "\f8f4",
border: "\f8f3",
inner: "\f8ff", // em
),
po: (
rarity: "\f8f2",
border: "\f8f1",
inner: "\f8f0",
),
wl: (
rarity: "\f8ef",
border: "\f8ee",
inner: "\f8ff", // empty
),
);

195
src/scss/keyrune.scss Normal file
View File

@ -0,0 +1,195 @@
@use "sass:map";
@import "variables";
@import "aliases";
@import "helpers";
@import "media";
@font-face {
font-family: '#{$keyrune-font-family}';
src: url('#{$keyrune-font-path}/#{$keyrune-font-family}.eot?#{$keyrune-version}');
src: url('#{$keyrune-font-path}/#{$keyrune-font-family}.eot?#{$keyrune-version}#iefix') format('embedded-opentype'),
url('#{$keyrune-font-path}/#{$keyrune-font-family}.woff2?#{$keyrune-version}') format('woff2'),
url('#{$keyrune-font-path}/#{$keyrune-font-family}.ttf?#{$keyrune-version}') format('truetype'),
url('#{$keyrune-font-path}/#{$keyrune-font-family}.woff?#{$keyrune-version}') format('woff'),
url('#{$keyrune-font-path}/#{$keyrune-font-family}.svg?#{$keyrune-version}##{$keyrune-font-family}') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
// default styles and set symbol definitions
.#{$keyrune-prefix} {
// base styles
font-family: '#{$keyrune-font-family}' !important;
color: var(--icon-default);
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
position: relative;
text-transform: none;
line-height: 1;
display: inline-flex;
// better font rendering
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
// ::before is the symbol layer
// ::after is the border layer
// ::marker is the (experimental) inner layer
@each $set, $layers in $keyrune-sets {
&-#{$set} {
@include layers($layers);
}
// check for aliases and assign the same glyphs
@if ($keyrune-include-aliases) {
@if map-get($keyrune-aliases, $set) {
@each $alias in map-get($keyrune-aliases, $set) {
&-#{$alias} {
@include layers($layers);
}
}
}
}
}
// accessory features
&.#{$keyrune-prefix} {
// border
&-border {
// default and common border styles
&::after {
color: var(--border-default);
position: absolute;
left: 0;
}
// rarities > common have a black border
&.#{$keyrune-prefix}-rarity-common-alt::after,
&.#{$keyrune-prefix}-rarity-uncommon::after,
&.#{$keyrune-prefix}-rarity-rare::after,
&.#{$keyrune-prefix}-rarity-mythic::after,
&.#{$keyrune-prefix}-rarity-foil::after,
&.#{$keyrune-prefix}-border-black::after {
color: var(--border-contrast);
}
// convenience class to force a white border
&-white::after {
color: var(--border-default) !important;
}
}
// inner
// requires advanced positional styles for glyphs taller than they are wide
&-inner {
// must be list-item for this to appear
display: list-item;
list-style-position: inside;
// set symbol must be absolutely positioned
&::before {
position: absolute;
left: 0;
}
// inner color
&::marker {
color: var(--inner-default);
}
// position via transforms for everything until there's a better way
&::before,
&::after,
&::marker {
left: 50%;
transform: translateX(-50%);
}
}
// rarity colors
&-rarity {
// rarity loop
@each $rarity, $colors in $keyrune-rarities {
&-#{$rarity} {
// set the symbol's color
&::before {
color: #{map.get($colors, solid)};
}
// gradient alternative
&.#{$keyrune-prefix}-rarity-gradient::before {
background: linear-gradient(
90deg,
#{map.get($colors, left)} 0%,
#{map.get($colors, center)} 50%,
#{map.get($colors, right)} 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
}
}
// special foil case
&-foil {
&::before {
color: #00afc9;
}
&.#{$keyrune-prefix}-rarity-gradient::before {
background: linear-gradient(
135deg,
#ea8d66 0%,
#ea8d66 15%,
#fdef8a 28%,
#8bcc93 42%,
#a6dced 55%,
#6f75aa 68%,
#e599c2 84%,
#e599c2 100%);
color: transparent;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
}
}
// fixed width
&-fw {
// set the width to the largest symbole, ARN, at 1.75em
width: 1.75em;
display: list-item;
list-style-position: inside;
text-align: center;
// if there is no inner, we need to hide the marker
&:not(.#{$keyrune-prefix}-inner) {
list-style: none;
}
// correction when there's a border and no inner
&.#{$keyrune-prefix}-border:not(.#{$keyrune-prefix}-inner)::after {
left: 50%;
transform: translateX(-50%);
}
}
// colors
&-white {
&::before,
&::after,
&::marker {
color: #{map.get($keyrune-colors, "white")};
}
}
}
}