mirror of
https://github.com/PretendoNetwork/website.git
synced 2026-03-21 17:24:28 -05:00
640 lines
34 KiB
Handlebars
640 lines
34 KiB
Handlebars
<link rel="stylesheet" href="/assets/css/miieditor.css" />
|
|
<div class="miieditor-wrapper">
|
|
|
|
<svg class="logotype" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 39.876" preserveAspectRatio="xMinYMin meet">
|
|
<g id="logo_type" data-name="logo type" transform="translate(-553 -467)">
|
|
<g id="logo" transform="translate(553 467)">
|
|
<rect id="XMLID_158_" width="39.876" height="39.876" fill="#9d6ff3" opacity="0" />
|
|
<g id="XMLID_6_" transform="translate(8.222 1.418)">
|
|
<path id="XMLID_15_"
|
|
d="M69.149,28.312c-1.051.553-.129,2.139.922,1.585a12.365,12.365,0,0,1,8.794-.571,10.829,10.829,0,0,1,6.342,4.166c.645,1,2.231.074,1.585-.922C83.308,27.169,74.7,25.436,69.149,28.312Z"
|
|
transform="translate(-64.246 -23.389)" fill="#9d6ff3" />
|
|
<path id="XMLID_14_"
|
|
d="M82.64,14.608A15.565,15.565,0,0,0,73.5,8.45a17.535,17.535,0,0,0-12.647.9c-1.051.553-.129,2.139.922,1.585,3.411-1.788,7.6-1.714,11.209-.719,3.1.848,6.268,2.544,8.038,5.309C81.681,16.543,83.267,15.622,82.64,14.608Z"
|
|
transform="translate(-57.476 -7.693)" fill="#9d6ff3" />
|
|
<path id="XMLID_9_"
|
|
d="M55.68,47.8a10.719,10.719,0,0,0-6.71,2.3H45.983A1.336,1.336,0,0,0,44.6,51.376V75.84a1.431,1.431,0,0,0,1.383,1.383h3.023a1.367,1.367,0,0,0,1.309-1.383V68.392A10.993,10.993,0,1,0,55.68,47.8Zm0,17.182a6.213,6.213,0,1,1,6.213-6.213A6.216,6.216,0,0,1,55.68,64.982Z"
|
|
transform="translate(-44.6 -40.406)" fill="#9d6ff3" />
|
|
</g>
|
|
</g>
|
|
<text id="Pretendo" transform="translate(593 492)" fill="#fff" font-size="17"
|
|
font-family="Poppins-Bold, Poppins" font-weight="700">
|
|
<tspan x="0" y="0">Pretendo</tspan>
|
|
</text>
|
|
</g>
|
|
</svg>
|
|
|
|
<div class="mii-img-wrapper">
|
|
<img id="mii-img" draggable="false" />
|
|
<div class="shadow"></div>
|
|
</div>
|
|
|
|
<div class="params-wrapper">
|
|
<div class="tabs">
|
|
<button class="tabbtn active" id="faceTypeButton">
|
|
face
|
|
</button>
|
|
<button class="tabbtn" id="hairTypeButton">
|
|
hair
|
|
</button>
|
|
<button class="tabbtn" id="eyebrowTypeButton">
|
|
eyebrow
|
|
</button>
|
|
<button class="tabbtn" id="eyeTypeButton">
|
|
eye
|
|
</button>
|
|
<button class="tabbtn" id="noseTypeButton">
|
|
nose
|
|
</button>
|
|
<button class="tabbtn" id="mouthTypeButton">
|
|
mouth
|
|
</button>
|
|
<button class="tabbtn" id="glassesTypeButton">
|
|
glasses
|
|
</button>
|
|
<button class="tabbtn" id="facialHairTypeButton">
|
|
facialHair
|
|
</button>
|
|
<button class="tabbtn" id="moleEnableButton">
|
|
mole
|
|
</button>
|
|
<button class="tabbtn" id="sizeButton">
|
|
size
|
|
</button>
|
|
<button class="tabbtn" id="miiscButton">
|
|
miisc
|
|
</button>
|
|
</div>
|
|
<form class="params">
|
|
<div class="tab active" id="faceTypeTab">
|
|
<div class="subtabs">
|
|
<button class="subtabbtn active" id="faceTypeSubButton">
|
|
faceType
|
|
</button>
|
|
<button class="subtabbtn" id="faceMakeupSubButton">
|
|
faceMakeup
|
|
</button>
|
|
<button class="subtabbtn" id="faceWrinklesSubButton">
|
|
faceWrinkles
|
|
</button>
|
|
</div>
|
|
|
|
<fieldset class="subtab active" id="faceType">
|
|
{{#each editorToHex.face}}
|
|
<input type="radio" name="faceType" id="faceType{{this}}" value="{{this}}" />
|
|
<label for="faceType{{this}}">{{this}}</label>
|
|
{{/each}}
|
|
</fieldset>
|
|
|
|
<fieldset id="faceColor" class="color">
|
|
<input type="radio" name="faceColor" id="faceColor0" value="0" />
|
|
<label for="faceColor0" style="background: #FFCE98 !important;" ></label>
|
|
<input type="radio" name="faceColor" id="faceColor1" value="1" />
|
|
<label for="faceColor1" style="background: #FFBA64 !important;" ></label>
|
|
<input type="radio" name="faceColor" id="faceColor2" value="2" />
|
|
<label for="faceColor2" style="background: #FF7C3E !important;" ></label>
|
|
<input type="radio" name="faceColor" id="faceColor3" value="3" />
|
|
<label for="faceColor3" style="background: #FFB184 !important;" ></label>
|
|
<input type="radio" name="faceColor" id="faceColor4" value="4" />
|
|
<label for="faceColor4" style="background: #CA5326 !important;" ></label>
|
|
<input type="radio" name="faceColor" id="faceColor5" value="5" />
|
|
<label for="faceColor5" style="background: #752E17 !important;" ></label>
|
|
</fieldset>
|
|
|
|
<fieldset id="faceMakeup" class="subtab">
|
|
<input type="radio" name="faceMakeup" id="faceMakeup0" value="0" />
|
|
<label for="faceMakeup0">0</label>
|
|
<input type="radio" name="faceMakeup" id="faceMakeup1" value="1" />
|
|
<label for="faceMakeup1">1</label>
|
|
<input type="radio" name="faceMakeup" id="faceMakeup2" value="2" />
|
|
<label for="faceMakeup2">2</label>
|
|
<input type="radio" name="faceMakeup" id="faceMakeup3" value="3" />
|
|
<label for="faceMakeup3">3</label>
|
|
<input type="radio" name="faceMakeup" id="faceMakeup4" value="4" />
|
|
<label for="faceMakeup4">4</label>
|
|
<input type="radio" name="faceMakeup" id="faceMakeup5" value="5" />
|
|
<label for="faceMakeup5">5</label>
|
|
<input type="radio" name="faceMakeup" id="faceMakeup6" value="6" />
|
|
<label for="faceMakeup6">6</label>
|
|
<input type="radio" name="faceMakeup" id="faceMakeup7" value="7" />
|
|
<label for="faceMakeup7">7</label>
|
|
<input type="radio" name="faceMakeup" id="faceMakeup8" value="8" />
|
|
<label for="faceMakeup8">8</label>
|
|
<input type="radio" name="faceMakeup" id="faceMakeup9" value="9" />
|
|
<label for="faceMakeup9">9</label>
|
|
<input type="radio" name="faceMakeup" id="faceMakeup10" value="10" />
|
|
<label for="faceMakeup10">10</label>
|
|
<input type="radio" name="faceMakeup" id="faceMakeup11" value="11" />
|
|
<label for="faceMakeup11">11</label>
|
|
</fieldset>
|
|
|
|
<fieldset id="faceWrinkles" class="subtab">
|
|
<input type="radio" name="faceWrinkles" id="faceWrinkles0" value="0" />
|
|
<label for="faceWrinkles0">0</label>
|
|
<input type="radio" name="faceWrinkles" id="faceWrinkles1" value="1" />
|
|
<label for="faceWrinkles1">1</label>
|
|
<input type="radio" name="faceWrinkles" id="faceWrinkles2" value="2" />
|
|
<label for="faceWrinkles2">2</label>
|
|
<input type="radio" name="faceWrinkles" id="faceWrinkles3" value="3" />
|
|
<label for="faceWrinkles3">3</label>
|
|
<input type="radio" name="faceWrinkles" id="faceWrinkles4" value="4" />
|
|
<label for="faceWrinkles4">4</label>
|
|
<input type="radio" name="faceWrinkles" id="faceWrinkles5" value="5" />
|
|
<label for="faceWrinkles5">5</label>
|
|
<input type="radio" name="faceWrinkles" id="faceWrinkles6" value="6" />
|
|
<label for="faceWrinkles6">6</label>
|
|
<input type="radio" name="faceWrinkles" id="faceWrinkles7" value="7" />
|
|
<label for="faceWrinkles7">7</label>
|
|
<input type="radio" name="faceWrinkles" id="faceWrinkles8" value="8" />
|
|
<label for="faceWrinkles8">8</label>
|
|
<input type="radio" name="faceWrinkles" id="faceWrinkles9" value="9" />
|
|
<label for="faceWrinkles9">9</label>
|
|
<input type="radio" name="faceWrinkles" id="faceWrinkles10" value="10" />
|
|
<label for="faceWrinkles10">10</label>
|
|
<input type="radio" name="faceWrinkles" id="faceWrinkles11" value="11" />
|
|
<label for="faceWrinkles11">11</label>
|
|
</fieldset>
|
|
|
|
</div>
|
|
|
|
<div class="tab" id="hairTypeTab">
|
|
<fieldset id="hairType" class="has-subpages active">
|
|
{{#each editorToHex.hairs}}
|
|
<div class="subpage">
|
|
{{#each this}}
|
|
<input type="radio" name="hairType" id="hairType{{this}}" value="{{this}}" />
|
|
<label for="hairType{{this}}">{{this}}</label>
|
|
{{/each}}
|
|
<div class="pagination">
|
|
<button class="previous page-btn index-{{@index}} {{#if @first }}disabled{{/if}}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="34.875" height="34.875" viewBox="0 0 34.875 34.875">
|
|
<path id="Icon_awesome-arrow-alt-circle-right" data-name="Icon awesome-arrow-alt-circle-right" d="M18,.563A17.438,17.438,0,1,0,35.438,18,17.434,17.434,0,0,0,18,.563Zm8.156,20.531H18v4.985a.844.844,0,0,1-1.441.6L8.522,18.6a.836.836,0,0,1,0-1.188l8.037-8.086a.844.844,0,0,1,1.441.6v4.985h8.156A.846.846,0,0,1,27,15.75v4.5A.846.846,0,0,1,26.156,21.094Z" transform="translate(-0.563 -0.563)" fill="#9d6ff3"/>
|
|
</svg>
|
|
</button>
|
|
<span>
|
|
<span class="current-page-index">{{@index}}</span>
|
|
/ 11
|
|
</span>
|
|
<button class="next page-btn index-{{@index}} {{#if @last }}disabled{{/if}}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" style="pointer-events: none;"="34.875" height="34.875" viewBox="0 0 34.875 34.875">
|
|
<path id="Icon_awesome-arrow-alt-circle-right" data-name="Icon awesome-arrow-alt-circle-right" d="M18,.563A17.438,17.438,0,1,1,.563,18,17.434,17.434,0,0,1,18,.563ZM9.844,21.094H18v4.985a.844.844,0,0,0,1.441.6L27.478,18.6a.836.836,0,0,0,0-1.188L19.441,9.323a.844.844,0,0,0-1.441.6v4.985H9.844A.846.846,0,0,0,9,15.75v4.5A.846.846,0,0,0,9.844,21.094Z" transform="translate(-0.563 -0.563)" fill="#9d6ff3"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
{{/each}}
|
|
</fieldset>
|
|
|
|
<fieldset id="hairColor" class="color">
|
|
<input type="radio" name="hairColor" id="hairColor0" value="0" />
|
|
<label for="hairColor0" style="background: #0A0A09 !important;" ></label>
|
|
<input type="radio" name="hairColor" id="hairColor1" value="1" />
|
|
<label for="hairColor1" style="background: #562D1B !important;" ></label>
|
|
<input type="radio" name="hairColor" id="hairColor2" value="2" />
|
|
<label for="hairColor2" style="background: #772314 !important;" ></label>
|
|
<input type="radio" name="hairColor" id="hairColor3" value="3" />
|
|
<label for="hairColor3" style="background: #9C481E !important;" ></label>
|
|
<input type="radio" name="hairColor" id="hairColor4" value="4" />
|
|
<label for="hairColor4" style="background: #988B8D !important;" ></label>
|
|
<input type="radio" name="hairColor" id="hairColor5" value="5" />
|
|
<label for="hairColor5" style="background: #664C1A !important;" ></label>
|
|
<input type="radio" name="hairColor" id="hairColor6" value="6" />
|
|
<label for="hairColor6" style="background: #AA6822 !important;" ></label>
|
|
<input type="radio" name="hairColor" id="hairColor7" value="7" />
|
|
<label for="hairColor7" style="background: #FEB454 !important;" ></label>
|
|
</fieldset>
|
|
</div>
|
|
|
|
<div class="tab" id="eyebrowTypeTab">
|
|
<div class="subtabs">
|
|
<button class="subtabbtn active" id="eyebrowTypeSubButton">
|
|
eyebrowType
|
|
</button>
|
|
<button class="subtabbtn" id="eyebrowPositionSubButton">
|
|
eyebrowPosition
|
|
</button>
|
|
</div>
|
|
<fieldset id="eyebrowType" class="subtab has-subpages active">
|
|
{{#each editorToHex.eyebrows}}
|
|
<div class="subpage">
|
|
{{#each this}}
|
|
<input type="radio" name="eyebrowType" id="eyebrowType{{this}}" value="{{this}}" />
|
|
<label for="eyebrowType{{this}}">{{this}}</label>
|
|
{{/each}}
|
|
<div class="pagination">
|
|
<button class="previous page-btn index-{{@index}} {{#if @first }}disabled{{/if}}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="34.875" height="34.875" viewBox="0 0 34.875 34.875">
|
|
<path id="Icon_awesome-arrow-alt-circle-right" data-name="Icon awesome-arrow-alt-circle-right" d="M18,.563A17.438,17.438,0,1,0,35.438,18,17.434,17.434,0,0,0,18,.563Zm8.156,20.531H18v4.985a.844.844,0,0,1-1.441.6L8.522,18.6a.836.836,0,0,1,0-1.188l8.037-8.086a.844.844,0,0,1,1.441.6v4.985h8.156A.846.846,0,0,1,27,15.75v4.5A.846.846,0,0,1,26.156,21.094Z" transform="translate(-0.563 -0.563)" fill="#9d6ff3"/>
|
|
</svg>
|
|
</button>
|
|
<span class="current-page-index">{{@index}}</span> / 2
|
|
<button class="next page-btn index-{{@index}} {{#if @last }}disabled{{/if}}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" style="pointer-events: none;"="34.875" height="34.875" viewBox="0 0 34.875 34.875">
|
|
<path id="Icon_awesome-arrow-alt-circle-right" data-name="Icon awesome-arrow-alt-circle-right" d="M18,.563A17.438,17.438,0,1,1,.563,18,17.434,17.434,0,0,1,18,.563ZM9.844,21.094H18v4.985a.844.844,0,0,0,1.441.6L27.478,18.6a.836.836,0,0,0,0-1.188L19.441,9.323a.844.844,0,0,0-1.441.6v4.985H9.844A.846.846,0,0,0,9,15.75v4.5A.846.846,0,0,0,9.844,21.094Z" transform="translate(-0.563 -0.563)" fill="#9d6ff3"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
{{/each}}
|
|
</fieldset>
|
|
|
|
<fieldset id="eyebrowPosition" class="subtab has-sliders">
|
|
<input type="range" class="invert" name="eyebrowVertical" id="eyebrowVertical" min="3" max="18" />
|
|
<label for="eyebrowVertical">eyebrowVertical</label>
|
|
<input type="range" name="eyebrowHorizontal" id="eyebrowHorizontal" min="0" max="12" />
|
|
<label for="eyebrowHorizontal">eyebrowHorizontal</label>
|
|
<input type="range" name="eyebrowRotation" id="eyebrowRotation" min="0" max="11" />
|
|
<label for="eyebrowRotation">eyebrowRotation</label>
|
|
<input type="range" name="eyebrowSize" id="eyebrowSize" min="0" max="8" />
|
|
<label for="eyebrowSize">eyebrowSize</label>
|
|
<input type="range" name="eyebrowStretch" id="eyebrowStretch" min="0" max="6" />
|
|
<label for="eyebrowStretch">eyebrowStretch</label>
|
|
</fieldset>
|
|
|
|
<fieldset id="eyebrowColor" class="color">
|
|
<input type="radio" name="eyebrowColor" id="eyebrowColor0" value="0" />
|
|
<label for="eyebrowColor0" style="background: #0A0A09 !important;" ></label>
|
|
<input type="radio" name="eyebrowColor" id="eyebrowColor1" value="1" />
|
|
<label for="eyebrowColor1" style="background: #562D1B !important;" ></label>
|
|
<input type="radio" name="eyebrowColor" id="eyebrowColor2" value="2" />
|
|
<label for="eyebrowColor2" style="background: #772314 !important;" ></label>
|
|
<input type="radio" name="eyebrowColor" id="eyebrowColor3" value="3" />
|
|
<label for="eyebrowColor3" style="background: #9C481E !important;" ></label>
|
|
<input type="radio" name="eyebrowColor" id="eyebrowColor4" value="4" />
|
|
<label for="eyebrowColor4" style="background: #988B8D !important;" ></label>
|
|
<input type="radio" name="eyebrowColor" id="eyebrowColor5" value="5" />
|
|
<label for="eyebrowColor5" style="background: #664C1A !important;" ></label>
|
|
<input type="radio" name="eyebrowColor" id="eyebrowColor6" value="6" />
|
|
<label for="eyebrowColor6" style="background: #AA6822 !important;" ></label>
|
|
<input type="radio" name="eyebrowColor" id="eyebrowColor7" value="7" />
|
|
<label for="eyebrowColor7" style="background: #FEB454 !important;" ></label>
|
|
</fieldset>
|
|
</div>
|
|
|
|
<div class="tab" id="eyeTypeTab">
|
|
<div class="subtabs">
|
|
<button class="subtabbtn active" id="eyeTypeSubButton">
|
|
eyeType
|
|
</button>
|
|
<button class="subtabbtn" id="eyePositionSubButton">
|
|
eyePosition
|
|
</button>
|
|
</div>
|
|
<fieldset id="eyeType" class="subtab has-subpages active">
|
|
{{#each editorToHex.eyes}}
|
|
<div class="subpage">
|
|
{{#each this}}
|
|
<input type="radio" name="eyeType" id="eyeType{{this}}" value="{{this}}" />
|
|
<label for="eyeType{{this}}">{{this}}</label>
|
|
{{/each}}
|
|
<div class="pagination">
|
|
<button class="previous page-btn index-{{@index}} {{#if @first }}disabled{{/if}}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="34.875" height="34.875" viewBox="0 0 34.875 34.875">
|
|
<path id="Icon_awesome-arrow-alt-circle-right" data-name="Icon awesome-arrow-alt-circle-right" d="M18,.563A17.438,17.438,0,1,0,35.438,18,17.434,17.434,0,0,0,18,.563Zm8.156,20.531H18v4.985a.844.844,0,0,1-1.441.6L8.522,18.6a.836.836,0,0,1,0-1.188l8.037-8.086a.844.844,0,0,1,1.441.6v4.985h8.156A.846.846,0,0,1,27,15.75v4.5A.846.846,0,0,1,26.156,21.094Z" transform="translate(-0.563 -0.563)" fill="#9d6ff3"/>
|
|
</svg>
|
|
</button>
|
|
<span class="current-page-index">{{@index}}</span> / 5
|
|
<button class="next page-btn index-{{@index}} {{#if @last }}disabled{{/if}}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" style="pointer-events: none;"="34.875" height="34.875" viewBox="0 0 34.875 34.875">
|
|
<path id="Icon_awesome-arrow-alt-circle-right" data-name="Icon awesome-arrow-alt-circle-right" d="M18,.563A17.438,17.438,0,1,1,.563,18,17.434,17.434,0,0,1,18,.563ZM9.844,21.094H18v4.985a.844.844,0,0,0,1.441.6L27.478,18.6a.836.836,0,0,0,0-1.188L19.441,9.323a.844.844,0,0,0-1.441.6v4.985H9.844A.846.846,0,0,0,9,15.75v4.5A.846.846,0,0,0,9.844,21.094Z" transform="translate(-0.563 -0.563)" fill="#9d6ff3"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
{{/each}}
|
|
</fieldset>
|
|
|
|
<fieldset id="eyeColor" class="color">
|
|
<input type="radio" name="eyeColor" id="eyeColor0" value="0" />
|
|
<label for="eyeColor0" style="background: #070606 !important;" ></label>
|
|
<input type="radio" name="eyeColor" id="eyeColor1" value="1" />
|
|
<label for="eyeColor1" style="background: #887E75 !important;" ></label>
|
|
<input type="radio" name="eyeColor" id="eyeColor2" value="2" />
|
|
<label for="eyeColor2" style="background: #814631 !important;" ></label>
|
|
<input type="radio" name="eyeColor" id="eyeColor3" value="3" />
|
|
<label for="eyeColor3" style="background: #796A34 !important;" ></label>
|
|
<input type="radio" name="eyeColor" id="eyeColor4" value="4" />
|
|
<label for="eyeColor4" style="background: #565BA4 !important;" ></label>
|
|
<input type="radio" name="eyeColor" id="eyeColor5" value="5" />
|
|
<label for="eyeColor5" style="background: #4C8260 !important;" ></label>
|
|
</fieldset>
|
|
|
|
<fieldset id="eyePosition" class="subtab has-sliders">
|
|
<input type="range" class="invert" name="eyeVertical" id="eyeVertical" min="0" max="18" />
|
|
<label for="eyeVertical">eyeVertical</label>
|
|
<input type="range" name="eyeHorizontal" id="eyeHorizontal" min="0" max="12" />
|
|
<label for="eyeHorizontal">eyeHorizontal</label>
|
|
<input type="range" name="eyeRotation" id="eyeRotation" min="0" max="7" />
|
|
<label for="eyeRotation">eyeRotation</label>
|
|
<input type="range" name="eyeSize" id="eyeSize" min="0" max="7" />
|
|
<label for="eyeSize">eyeSize</label>
|
|
<input type="range" name="eyeStretch" id="eyeStretch" min="0" max="6" />
|
|
<label for="eyeStretch">eyeStretch</label>
|
|
</fieldset>
|
|
</div>
|
|
|
|
<div class="tab" id="noseTypeTab">
|
|
<div class="subtabs">
|
|
<button class="subtabbtn active" id="noseTypeSubButton">
|
|
noseType
|
|
</button>
|
|
<button class="subtabbtn" id="nosePositionSubButton">
|
|
nosePosition
|
|
</button>
|
|
</div>
|
|
<fieldset id="noseType" class="subtab has-subpages active">
|
|
{{#each editorToHex.nose}}
|
|
<div class="subpage">
|
|
{{#each this}}
|
|
<input type="radio" name="noseType" id="noseType{{this}}" value="{{this}}" />
|
|
<label for="noseType{{this}}">{{this}}</label>
|
|
{{/each}}
|
|
<div class="pagination">
|
|
<button class="previous page-btn index-{{@index}} {{#if @first }}disabled{{/if}}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="34.875" height="34.875" viewBox="0 0 34.875 34.875">
|
|
<path id="Icon_awesome-arrow-alt-circle-right" data-name="Icon awesome-arrow-alt-circle-right" d="M18,.563A17.438,17.438,0,1,0,35.438,18,17.434,17.434,0,0,0,18,.563Zm8.156,20.531H18v4.985a.844.844,0,0,1-1.441.6L8.522,18.6a.836.836,0,0,1,0-1.188l8.037-8.086a.844.844,0,0,1,1.441.6v4.985h8.156A.846.846,0,0,1,27,15.75v4.5A.846.846,0,0,1,26.156,21.094Z" transform="translate(-0.563 -0.563)" fill="#9d6ff3"/>
|
|
</svg>
|
|
</button>
|
|
<span class="current-page-index">{{@index}}</span> / 2
|
|
<button class="next page-btn index-{{@index}} {{#if @last }}disabled{{/if}}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" style="pointer-events: none;"="34.875" height="34.875" viewBox="0 0 34.875 34.875">
|
|
<path id="Icon_awesome-arrow-alt-circle-right" data-name="Icon awesome-arrow-alt-circle-right" d="M18,.563A17.438,17.438,0,1,1,.563,18,17.434,17.434,0,0,1,18,.563ZM9.844,21.094H18v4.985a.844.844,0,0,0,1.441.6L27.478,18.6a.836.836,0,0,0,0-1.188L19.441,9.323a.844.844,0,0,0-1.441.6v4.985H9.844A.846.846,0,0,0,9,15.75v4.5A.846.846,0,0,0,9.844,21.094Z" transform="translate(-0.563 -0.563)" fill="#9d6ff3"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
{{/each}}
|
|
</fieldset>
|
|
|
|
<fieldset id="nosePosition" class="subtab has-sliders">
|
|
<input type="range" class="invert" name="noseVertical" id="noseVertical" min="0" max="18" />
|
|
<label for="noseVertical">noseVertical</label>
|
|
<input type="range" name="noseSize" id="noseSize" min="0" max="8" />
|
|
<label for="noseSize">noseSize</label>
|
|
</fieldset>
|
|
</div>
|
|
|
|
<div class="tab" id="mouthTypeTab">
|
|
<div class="subtabs">
|
|
<button class="subtabbtn active" id="mouthTypeSubButton">
|
|
mouthType
|
|
</button>
|
|
<button class="subtabbtn" id="mouthPositionSubButton">
|
|
mouthPosition
|
|
</button>
|
|
</div>
|
|
<fieldset id="mouthType" class="subtab has-subpages active">
|
|
{{#each editorToHex.mouth}}
|
|
<div class="subpage">
|
|
{{#each this}}
|
|
<input type="radio" name="mouthType" id="mouthType{{this}}" value="{{this}}" />
|
|
<label for="mouthType{{this}}">{{this}}</label>
|
|
{{/each}}
|
|
<div class="pagination">
|
|
<button class="previous page-btn index-{{@index}} {{#if @first }}disabled{{/if}}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="34.875" height="34.875" viewBox="0 0 34.875 34.875">
|
|
<path id="Icon_awesome-arrow-alt-circle-right" data-name="Icon awesome-arrow-alt-circle-right" d="M18,.563A17.438,17.438,0,1,0,35.438,18,17.434,17.434,0,0,0,18,.563Zm8.156,20.531H18v4.985a.844.844,0,0,1-1.441.6L8.522,18.6a.836.836,0,0,1,0-1.188l8.037-8.086a.844.844,0,0,1,1.441.6v4.985h8.156A.846.846,0,0,1,27,15.75v4.5A.846.846,0,0,1,26.156,21.094Z" transform="translate(-0.563 -0.563)" fill="#9d6ff3"/>
|
|
</svg>
|
|
</button>
|
|
<span class="current-page-index">{{@index}}</span> / 3
|
|
<button class="next page-btn index-{{@index}} {{#if @last }}disabled{{/if}}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" style="pointer-events: none;"="34.875" height="34.875" viewBox="0 0 34.875 34.875">
|
|
<path id="Icon_awesome-arrow-alt-circle-right" data-name="Icon awesome-arrow-alt-circle-right" d="M18,.563A17.438,17.438,0,1,1,.563,18,17.434,17.434,0,0,1,18,.563ZM9.844,21.094H18v4.985a.844.844,0,0,0,1.441.6L27.478,18.6a.836.836,0,0,0,0-1.188L19.441,9.323a.844.844,0,0,0-1.441.6v4.985H9.844A.846.846,0,0,0,9,15.75v4.5A.846.846,0,0,0,9.844,21.094Z" transform="translate(-0.563 -0.563)" fill="#9d6ff3"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
{{/each}}
|
|
</fieldset>
|
|
|
|
<fieldset id="mouthColor" class="color">
|
|
<input type="radio" name="mouthColor" id="mouthColor0" value="0" />
|
|
<label for="mouthColor0" style="background: #FF5D0C !important;" ></label>
|
|
<input type="radio" name="mouthColor" id="mouthColor1" value="1" />
|
|
<label for="mouthColor1" style="background: #FF110C !important;" ></label>
|
|
<input type="radio" name="mouthColor" id="mouthColor2" value="2" />
|
|
<label for="mouthColor2" style="background: #FF524B !important;" ></label>
|
|
<input type="radio" name="mouthColor" id="mouthColor3" value="3" />
|
|
<label for="mouthColor3" style="background: #FFAA77 !important;" ></label>
|
|
<input type="radio" name="mouthColor" id="mouthColor4" value="4" />
|
|
<label for="mouthColor4" style="background: #181312 !important;" ></label>
|
|
</fieldset>
|
|
|
|
<fieldset id="mouthPosition" class="subtab has-sliders">
|
|
<input type="range" class="invert" name="mouthVertical" id="mouthVertical" min="0" max="18" />
|
|
<label for="mouthVertical">mouthVertical</label>
|
|
<input type="range" name="mouthSize" id="mouthSize" min="0" max="8" />
|
|
<label for="mouthSize">mouthSize</label>
|
|
</fieldset>
|
|
</div>
|
|
|
|
<div class="tab" id="glassesTypeTab">
|
|
<div class="subtabs">
|
|
<button class="subtabbtn active" id="glassesTypeSubButton">
|
|
glassesType
|
|
</button>
|
|
<button class="subtabbtn" id="glassesPositionSubButton">
|
|
glassesPosition
|
|
</button>
|
|
</div>
|
|
<fieldset id="glassesType" class="subtab active">
|
|
<input type="radio" name="glassesType" id="glassesType0" value="0" />
|
|
<label for="glassesType0">0</label>
|
|
<input type="radio" name="glassesType" id="glassesType1" value="1" />
|
|
<label for="glassesType1">1</label>
|
|
<input type="radio" name="glassesType" id="glassesType2" value="2" />
|
|
<label for="glassesType2">2</label>
|
|
<input type="radio" name="glassesType" id="glassesType3" value="3" />
|
|
<label for="glassesType3">3</label>
|
|
<input type="radio" name="glassesType" id="glassesType4" value="4" />
|
|
<label for="glassesType4">4</label>
|
|
<input type="radio" name="glassesType" id="glassesType5" value="5" />
|
|
<label for="glassesType5">5</label>
|
|
<input type="radio" name="glassesType" id="glassesType6" value="6" />
|
|
<label for="glassesType6">6</label>
|
|
<input type="radio" name="glassesType" id="glassesType7" value="7" />
|
|
<label for="glassesType7">7</label>
|
|
<input type="radio" name="glassesType" id="glassesType8" value="8" />
|
|
<label for="glassesType8">8</label>
|
|
</fieldset>
|
|
|
|
<fieldset id="glassesColor" class="color">
|
|
<input type="radio" name="glassesColor" id="glassesColor0" value="0" />
|
|
<label for="glassesColor0" style="background: #000000 !important;" ></label>
|
|
<input type="radio" name="glassesColor" id="glassesColor1" value="1" />
|
|
<label for="glassesColor1" style="background: #7A4011 !important;" ></label>
|
|
<input type="radio" name="glassesColor" id="glassesColor2" value="2" />
|
|
<label for="glassesColor2" style="background: #D51208 !important;" ></label>
|
|
<input type="radio" name="glassesColor" id="glassesColor3" value="3" />
|
|
<label for="glassesColor3" style="background: #29376E !important;" ></label>
|
|
<input type="radio" name="glassesColor" id="glassesColor4" value="4" />
|
|
<label for="glassesColor4" style="background: #D56D00 !important;" ></label>
|
|
<input type="radio" name="glassesColor" id="glassesColor5" value="5" />
|
|
<label for="glassesColor5" style="background: #987F6E !important;" ></label>
|
|
</fieldset>
|
|
|
|
<fieldset id="glassesPosition" class="subtab has-sliders">
|
|
<input type="range" class="invert" name="glassesVertical" id="glassesVertical" min="0" max="20" />
|
|
<label for="glassesVertical">glassesVertical</label>
|
|
<input type="range" name="glassesSize" id="glassesSize" min="0" max="7" />
|
|
<label for="glassesSize">glassesSize</label>
|
|
</fieldset>
|
|
</div>
|
|
|
|
<div class="tab" id="facialHairTypeTab">
|
|
<div class="subtabs">
|
|
<button class="subtabbtn active" id="facialHairTypeSubButton">
|
|
facialHairType
|
|
</button>
|
|
<button class="subtabbtn" id="facialHairMustacheSubButton">
|
|
facialHairMustache
|
|
</button>
|
|
<button class="subtabbtn" id="facialHairPositionSubButton">
|
|
facialHairPosition
|
|
</button>
|
|
</div>
|
|
<fieldset id="facialHairType" class="subtab active">
|
|
<input type="radio" name="facialHairType" id="facialHairType0" value="0" />
|
|
<label for="facialHairType0">0</label>
|
|
<input type="radio" name="facialHairType" id="facialHairType1" value="1" />
|
|
<label for="facialHairType1">1</label>
|
|
<input type="radio" name="facialHairType" id="facialHairType2" value="2" />
|
|
<label for="facialHairType2">2</label>
|
|
<input type="radio" name="facialHairType" id="facialHairType3" value="3" />
|
|
<label for="facialHairType3">3</label>
|
|
<input type="radio" name="facialHairType" id="facialHairType4" value="4" />
|
|
<label for="facialHairType4">4</label>
|
|
<input type="radio" name="facialHairType" id="facialHairType5" value="5" />
|
|
<label for="facialHairType5">5</label>
|
|
</fieldset>
|
|
|
|
<fieldset id="facialHairColor" class="color">
|
|
<input type="radio" name="facialHairColor" id="facialHairColor0" value="0" />
|
|
<label for="facialHairColor0" style="background: #0A0A09 !important;" ></label>
|
|
<input type="radio" name="facialHairColor" id="facialHairColor1" value="1" />
|
|
<label for="facialHairColor1" style="background: #562D1B !important;" ></label>
|
|
<input type="radio" name="facialHairColor" id="facialHairColor2" value="2" />
|
|
<label for="facialHairColor2" style="background: #772314 !important;" ></label>
|
|
<input type="radio" name="facialHairColor" id="facialHairColor3" value="3" />
|
|
<label for="facialHairColor3" style="background: #9C481E !important;" ></label>
|
|
<input type="radio" name="facialHairColor" id="facialHairColor4" value="4" />
|
|
<label for="facialHairColor4" style="background: #988B8D !important;" ></label>
|
|
<input type="radio" name="facialHairColor" id="facialHairColor5" value="5" />
|
|
<label for="facialHairColor5" style="background: #664C1A !important;" ></label>
|
|
<input type="radio" name="facialHairColor" id="facialHairColor6" value="6" />
|
|
<label for="facialHairColor6" style="background: #AA6822 !important;" ></label>
|
|
<input type="radio" name="facialHairColor" id="facialHairColor7" value="7" />
|
|
<label for="facialHairColor7" style="background: #FEB454 !important;" ></label>
|
|
</fieldset>
|
|
|
|
<fieldset id="facialHairMustache" class="subtab">
|
|
<input type="radio" name="facialHairMustache" id="facialHairMustache0" value="0" />
|
|
<label for="facialHairMustache0">0</label>
|
|
<input type="radio" name="facialHairMustache" id="facialHairMustache1" value="1" />
|
|
<label for="facialHairMustache1">1</label>
|
|
<input type="radio" name="facialHairMustache" id="facialHairMustache2" value="2" />
|
|
<label for="facialHairMustache2">2</label>
|
|
<input type="radio" name="facialHairMustache" id="facialHairMustache3" value="3" />
|
|
<label for="facialHairMustache3">3</label>
|
|
<input type="radio" name="facialHairMustache" id="facialHairMustache4" value="4" />
|
|
<label for="facialHairMustache4">4</label>
|
|
<input type="radio" name="facialHairMustache" id="facialHairMustache5" value="5" />
|
|
<label for="facialHairMustache5">5</label>
|
|
</fieldset>
|
|
|
|
<fieldset id="facialHairPosition" class="subtab has-sliders">
|
|
<input type="range" class="invert" name="facialHairVertical" id="facialHairVertical" min="0" max="16" />
|
|
<label for="facialHairVertical">facialHairVertical</label>
|
|
<input type="range" name="facialHairSize" id="facialHairSize" min="0" max="8" />
|
|
<label for="facialHairSize">facialHairSize</label>
|
|
</fieldset>
|
|
</div>
|
|
|
|
<div class="tab" id="moleEnableTab">
|
|
<div class="subtabs">
|
|
<button class="subtabbtn active" id="moleEnableSubButton">
|
|
moleEnable
|
|
</button>
|
|
<button class="subtabbtn" id="molePositionSubButton">
|
|
moleEnablePosition
|
|
</button>
|
|
</div>
|
|
<fieldset id="moleEnable" class="subtab active">
|
|
<input type="radio" name="moleEnable" id="moleEnable0" value="0" />
|
|
<label for="moleEnable0">0</label>
|
|
<input type="radio" name="moleEnable" id="moleEnable1" value="1" />
|
|
<label for="moleEnable1">1</label>
|
|
</fieldset>
|
|
|
|
<fieldset id="molePosition" class="subtab has-sliders">
|
|
<input type="range" class="invert" name="moleVertical" id="moleVertical" min="0" max="30" />
|
|
<label for="moleVertical">moleVertical</label>
|
|
<input type="range" name="moleHorizontal" id="moleHorizontal" min="0" max="16" />
|
|
<label for="moleHorizontal">moleHorizontal</label>
|
|
<input type="range" name="moleSize" id="moleSize" min="0" max="8" />
|
|
<label for="moleSize">moleSize</label>
|
|
</fieldset>
|
|
</div>
|
|
|
|
<div class="tab" id="sizeTab">
|
|
<fieldset id="size" class="active has-sliders">
|
|
<input type="range" name="height" id="height" min="0" max="127" />
|
|
<label for="height">height</label>
|
|
<input type="range" name="build" id="build" min="0" max="127" />
|
|
<label for="build">build</label>
|
|
</fieldset>
|
|
</div>
|
|
|
|
<div class="tab" id="miiscTab"><!--Get it it's funny 'cause 'mii' and 'misc'-->
|
|
<div class="subtabs">
|
|
<button class="subtabbtn active" id="genderSubButton">
|
|
dress
|
|
</button>
|
|
<button class="subtabbtn" id="favoriteColorSubButton">
|
|
favcolor
|
|
</button>
|
|
</div>
|
|
<fieldset id="gender" class="subtab active">
|
|
<input type="radio" name="gender" id="gender0" value="0" />
|
|
<label for="gender0">0</label>
|
|
<input type="radio" name="gender" id="gender1" value="1" />
|
|
<label for="gender1">1</label>
|
|
</fieldset>
|
|
|
|
<fieldset id="favoriteColor" class="subtab">
|
|
<input type="radio" name="favoriteColor" id="favoriteColor0" value="0" />
|
|
<label for="favoriteColor0" style="background: #FF2216 !important;" ></label>
|
|
<input type="radio" name="favoriteColor" id="favoriteColor1" value="1" />
|
|
<label for="favoriteColor1" style="background: #FF7A1A !important;" ></label>
|
|
<input type="radio" name="favoriteColor" id="favoriteColor2" value="2" />
|
|
<label for="favoriteColor2" style="background: #FFED22 !important;" ></label>
|
|
<input type="radio" name="favoriteColor" id="favoriteColor3" value="3" />
|
|
<label for="favoriteColor3" style="background: #91F321 !important;" ></label>
|
|
<input type="radio" name="favoriteColor" id="favoriteColor4" value="4" />
|
|
<label for="favoriteColor4" style="background: #008332 !important;" ></label>
|
|
<input type="radio" name="favoriteColor" id="favoriteColor5" value="5" />
|
|
<label for="favoriteColor5" style="background: #0D50BE !important;" ></label>
|
|
<input type="radio" name="favoriteColor" id="favoriteColor6" value="6" />
|
|
<label for="favoriteColor6" style="background: #49BBE4 !important;" ></label>
|
|
<input type="radio" name="favoriteColor" id="favoriteColor7" value="7" />
|
|
<label for="favoriteColor7" style="background: #FF6381 !important;" ></label>
|
|
<input type="radio" name="favoriteColor" id="favoriteColor8" value="8" />
|
|
<label for="favoriteColor8" style="background: #8B2DB2 !important;" ></label>
|
|
<input type="radio" name="favoriteColor" id="favoriteColor9" value="9" />
|
|
<label for="favoriteColor9" style="background: #573D18 !important;" ></label>
|
|
<input type="radio" name="favoriteColor" id="favoriteColor10" value="10" />
|
|
<label for="favoriteColor10" style="background: #FFFFFF !important;" ></label>
|
|
<input type="radio" name="favoriteColor" id="favoriteColor11" value="11" />
|
|
<label for="favoriteColor11" style="background: #1D1A15 !important;" ></label>
|
|
</fieldset>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<script id="encodedUserMiiData" type="text/plain">
|
|
{{encodedUserMiiData}}
|
|
</script>
|
|
<script src="/assets/js/miieditor.bundled.js"></script>
|