A/B/Start visuals

This commit is contained in:
thecozies 2024-03-03 11:33:49 -06:00
parent d3bb526c91
commit ab20eea803
3 changed files with 60 additions and 1 deletions

View File

@ -133,6 +133,50 @@
</div> </div>
</div> </div>
<div class="input-config__visual-quarter-right"> <div class="input-config__visual-quarter-right">
<div class="input-config__main-buttons">
<div
class="input-viz input-viz__button input-viz__button--sm input-viz__button--Start"
visual-input="START"
>
<svg src="icons/VizMap/ButtonSmall.svg" />
<div class="input-viz__mappings">
<div
class="input-config__visual-mapping"
data-for="cur_binding, i : inputs.START"
>
<div>{{cur_binding}}</div>
</div>
</div>
</div>
<div
class="input-viz input-viz__button input-viz__button--lg input-viz__button--B"
visual-input="B"
>
<svg src="icons/VizMap/ButtonLarge.svg" />
<div class="input-viz__mappings">
<div
class="input-config__visual-mapping"
data-for="cur_binding, i : inputs.B"
>
<div>{{cur_binding}}</div>
</div>
</div>
</div>
<div
class="input-viz input-viz__button input-viz__button--lg input-viz__button--A"
visual-input="A"
>
<svg src="icons/VizMap/ButtonLarge.svg" />
<div class="input-viz__mappings">
<div
class="input-config__visual-mapping"
data-for="cur_binding, i : inputs.A"
>
<div>{{cur_binding}}</div>
</div>
</div>
</div>
</div>
<div class="input-config__c-buttons"> <div class="input-config__c-buttons">
<div class="input-config__c-buttons-lr"> <div class="input-config__c-buttons-lr">
<div <div

File diff suppressed because one or more lines are too long

View File

@ -199,11 +199,16 @@ $all-inputs:
&--A { &--A {
@include set-svgs-color($color-a); @include set-svgs-color($color-a);
margin-top: auto;
} }
&--B { &--B {
@include set-svgs-color($color-success); @include set-svgs-color($color-success);
} }
&--Start {
@include set-svgs-color($color-error);
}
} }
.input-viz__Z { .input-viz__Z {
@ -324,3 +329,13 @@ $dpad-size: 192;
} }
} }
} }
.input-config__main-buttons {
display: flex;
flex-direction: row;
justify-content: space-between;
width: space(268);
height: space(128);
position: relative;
margin-right: space(10);
}