mirror of
https://github.com/maputnik/editor.git
synced 2025-12-25 15:40:00 +00:00
134 lines
8.6 KiB
HTML
134 lines
8.6 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Maputnik</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="manifest" href="/maputnik/assets/manifest-BrZzkYP9.json">
|
|
<link rel="icon" href="/maputnik/assets/favicon-DBn6BKLx.ico" type="image/x-icon" />
|
|
<style>
|
|
html {
|
|
background-color: rgb(28, 31, 36);
|
|
}
|
|
|
|
.loading {
|
|
text-align: center;
|
|
position: absolute;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
top: 0;
|
|
left: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.loading__logo img {
|
|
width: 200px;
|
|
height: 200px;
|
|
}
|
|
|
|
.loading__text {
|
|
font-family: sans-serif;
|
|
color: white;
|
|
font-size: 1.2em;
|
|
padding-bottom: 2em;
|
|
}
|
|
|
|
</style>
|
|
<script type="module" crossorigin src="/maputnik/assets/index-dMaYDQz2.js"></script>
|
|
<link rel="stylesheet" crossorigin href="/maputnik/assets/index-vOMA9Lgt.css">
|
|
</head>
|
|
<body>
|
|
<!-- From <https://github.com/hail2u/color-blindness-emulation> -->
|
|
<svg
|
|
aria-hidden="true"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
version="1.1">
|
|
<defs>
|
|
<filter id="protanopia">
|
|
<feColorMatrix
|
|
in="SourceGraphic"
|
|
type="matrix"
|
|
values="0.567, 0.433, 0, 0, 0
|
|
0.558, 0.442, 0, 0, 0
|
|
0, 0.242, 0.758, 0, 0
|
|
0, 0, 0, 1, 0"/>
|
|
</filter>
|
|
<filter id="protanomaly">
|
|
<feColorMatrix
|
|
in="SourceGraphic"
|
|
type="matrix"
|
|
values="0.817, 0.183, 0, 0, 0
|
|
0.333, 0.667, 0, 0, 0
|
|
0, 0.125, 0.875, 0, 0
|
|
0, 0, 0, 1, 0"/>
|
|
</filter>
|
|
<filter id="deuteranopia">
|
|
<feColorMatrix
|
|
in="SourceGraphic"
|
|
type="matrix"
|
|
values="0.625, 0.375, 0, 0, 0
|
|
0.7, 0.3, 0, 0, 0
|
|
0, 0.3, 0.7, 0, 0
|
|
0, 0, 0, 1, 0"/>
|
|
</filter>
|
|
<filter id="deuteranomaly">
|
|
<feColorMatrix
|
|
in="SourceGraphic"
|
|
type="matrix"
|
|
values="0.8, 0.2, 0, 0, 0
|
|
0.258, 0.742, 0, 0, 0
|
|
0, 0.142, 0.858, 0, 0
|
|
0, 0, 0, 1, 0"/>
|
|
</filter>
|
|
<filter id="tritanopia">
|
|
<feColorMatrix
|
|
in="SourceGraphic"
|
|
type="matrix"
|
|
values="0.95, 0.05, 0, 0, 0
|
|
0, 0.433, 0.567, 0, 0
|
|
0, 0.475, 0.525, 0, 0
|
|
0, 0, 0, 1, 0"/>
|
|
</filter>
|
|
<filter id="tritanomaly">
|
|
<feColorMatrix
|
|
in="SourceGraphic"
|
|
type="matrix"
|
|
values="0.967, 0.033, 0, 0, 0
|
|
0, 0.733, 0.267, 0, 0
|
|
0, 0.183, 0.817, 0, 0
|
|
0, 0, 0, 1, 0"/>
|
|
</filter>
|
|
<filter id="achromatopsia">
|
|
<feColorMatrix
|
|
in="SourceGraphic"
|
|
type="matrix"
|
|
values="0.299, 0.587, 0.114, 0, 0
|
|
0.299, 0.587, 0.114, 0, 0
|
|
0.299, 0.587, 0.114, 0, 0
|
|
0, 0, 0, 1, 0"/>
|
|
</filter>
|
|
<filter id="achromatomaly">
|
|
<feColorMatrix
|
|
in="SourceGraphic"
|
|
type="matrix"
|
|
values="0.618, 0.320, 0.062, 0, 0
|
|
0.163, 0.775, 0.062, 0, 0
|
|
0.163, 0.320, 0.516, 0, 0
|
|
0, 0, 0, 1, 0"/>
|
|
</filter>
|
|
</defs>
|
|
</svg>
|
|
|
|
<div id="app"></div>
|
|
<div class="loading">
|
|
<div class="loading__logo">
|
|
<img inline src="data:image/svg+xml,%253csvg%2520xmlns='http://www.w3.org/2000/svg'%2520xmlns:xlink='http://www.w3.org/1999/xlink'%2520width='1200'%2520height='1200'%2520viewBox='0%25200%2520100%2520100'%253e%253cstyle%253e@keyframes%2520circle-anim{0%2525,40%2525{fill-opacity:0}60%2525,to{fill-opacity:1}}.circle0,.circle1,.circle2,.circle3,.circle4,.circle5{stroke-opacity:0;animation-name:circle-anim;will-change:transform;animation-timing-function:east-in-out;animation-duration:800ms;animation-iteration-count:infinite;animation-direction:alternate}.circle0{animation-delay:100ms}.circle1{animation-delay:200ms}.circle2{animation-delay:300ms}.circle3{animation-delay:400ms}.circle4{animation-delay:500ms}.circle5{animation-delay:600ms}%253c/style%253e%253cg%2520class='map'%2520stroke='%2523000'%253e%253cuse%2520xlink:href='%2523ref-1--map__main'%2520fill='%25234eba6f'%253e%253c/use%253e%253cuse%2520xlink:href='%2523ref-1--map__line1'%2520fill='none'%253e%253c/use%253e%253cuse%2520xlink:href='%2523ref-1--map__line2'%2520fill='none'%253e%253c/use%253e%253cuse%2520xlink:href='%2523ref-1--map__line3'%2520fill='none'%253e%253c/use%253e%253c/g%253e%253cg%2520class='palette'%253e%253cuse%2520xlink:href='%2523ref-1--palette__main'%2520fill='%2523fff'%2520stroke='%2523000'%253e%253c/use%253e%253cuse%2520xlink:href='%2523ref-1--palette__inner'%2520fill='none'%2520stroke='%2523000'%253e%253c/use%253e%253cuse%2520class='circle5'%2520xlink:href='%2523ref-1--palette__circle5'%2520fill='%2523f7c44c'%253e%253c/use%253e%253cuse%2520class='circle4'%2520xlink:href='%2523ref-1--palette__circle4'%2520fill='%25234eba6f'%253e%253c/use%253e%253cuse%2520class='circle3'%2520xlink:href='%2523ref-1--palette__circle3'%2520fill='%2523f7c44c'%253e%253c/use%253e%253cuse%2520class='circle2'%2520xlink:href='%2523ref-1--palette__circle2'%2520fill='%25234eba6f'%253e%253c/use%253e%253cuse%2520class='circle1'%2520xlink:href='%2523ref-1--palette__circle1'%2520fill='%2523f7c44c'%253e%253c/use%253e%253cuse%2520class='circle0'%2520xlink:href='%2523ref-1--palette__circle0'%2520fill='%25234eba6f'%253e%253c/use%253e%253c/g%253e%253cg%2520class='brush'%2520stroke='%2523000'%253e%253cuse%2520xlink:href='%2523ref-1--brush__bottom'%2520fill='%2523f7c44c'%253e%253c/use%253e%253cuse%2520xlink:href='%2523ref-1--brush__top'%2520fill='%2523fff'%253e%253c/use%253e%253c/g%253e%253cdefs%253e%253cpath%2520id='ref-1--map__main'%2520stroke-width='2.366'%2520stroke-linejoin='round'%2520d='M18.84%25207.717l15.44%25207.542%252015.75-7.762%252015.7%25207.857L81.005%25207.67%252096.31%252054.052%252073.598%252062.12%252050.93%252053.872l-25.1%25208.066-22.668-8.066z'%253e%253c/path%253e%253cpath%2520id='ref-1--map__line1'%2520d='M65.556%252015.07l7.647%252046.838'%2520stroke-width='1.104'%253e%253c/path%253e%253cpath%2520id='ref-1--map__line2'%2520d='M50.261%25207.422l.717%252046.6'%2520stroke-width='1.104'%253e%253c/path%253e%253cpath%2520id='ref-1--map__line3'%2520d='M34.011%252015.07l-8.603%252046.6'%2520stroke-width='1.104'%253e%253c/path%253e%253cpath%2520id='ref-1--palette__main'%2520stroke-width='2.3'%2520d='M47.352%252030.887c7.993.226%252016.934%25209.725%252017.954%252015.25%25201.02%25205.527-.743%252011.125-4.298%252013.875-3.554%25202.75-8.6%25202.905-8.723%25208.302-.097%25204.237%25208.457%25208.5%25208.088%252015.653-.406%25207.857-15.508%252013.15-30.943%25206.102-8.556-3.906-14.249-13.653-13.385-26.238C16.833%252052.334%252022.32%252043.658%252027.382%252039c5.977-5.503%252011.977-8.337%252019.97-8.112z'%253e%253c/path%253e%253ccircle%2520id='ref-1--palette__inner'%2520stroke-width='2.3'%2520cx='41.873'%2520cy='61.901'%2520r='6.389'%253e%253c/circle%253e%253ccircle%2520id='ref-1--palette__circle5'%2520cy='44.56'%2520cx='54.347'%2520r='4.336'%253e%253c/circle%253e%253ccircle%2520id='ref-1--palette__circle4'%2520cx='40.443'%2520cy='41.555'%2520r='4.336'%253e%253c/circle%253e%253ccircle%2520id='ref-1--palette__circle3'%2520r='4.336'%2520cy='51.102'%2520cx='29.651'%253e%253c/circle%253e%253ccircle%2520id='ref-1--palette__circle2'%2520cx='25.293'%2520cy='65.836'%2520r='4.336'%253e%253c/circle%253e%253ccircle%2520id='ref-1--palette__circle1'%2520r='4.336'%2520cy='79.326'%2520cx='32.764'%253e%253c/circle%253e%253ccircle%2520id='ref-1--palette__circle0'%2520cx='46.669'%2520cy='80.571'%2520r='4.336'%253e%253c/circle%253e%253cpath%2520id='ref-1--brush__bottom'%2520d='M76.333%252089.333c-1.645-9.794-4.375-35.26-4.32-37.887.056-2.627%25202.52-4.34%25205.36-4.317%25202.842.022%25205.098%25201.87%25205.314%25204.27.107%25201.2-1.576%252028.06-2.318%252037.844-.332%25204.374-3.31%25204.413-4.036.09z'%2520stroke-width='2.3'%2520stroke-linejoin='round'%253e%253c/path%253e%253cpath%2520id='ref-1--brush__top'%2520stroke-linejoin='round'%2520stroke-width='2.3'%2520d='M77.184%252026.428s-5.621%25207.02-5.621%252011.978c0%25204.957%25202.206%25206.878%25205.81%25206.878%25203.606%25200%25205.148-1.708%25205.29-6.736.142-5.028-5.479-12.12-5.479-12.12z'%253e%253c/path%253e%253c/defs%253e%253c/svg%253e" />
|
|
</div>
|
|
<div class="loading__text">Loading…</div>
|
|
</div>
|
|
</body>
|
|
</html>
|