Compactify level/reset/copy box, touch up mobile UI

This commit is contained in:
hppeng 2022-07-25 00:41:02 -07:00
parent f441236531
commit dbc69ab874
2 changed files with 25 additions and 12 deletions

View file

@ -45,7 +45,7 @@
<div class="col-xl-6">
<div class="row row-cols-1 mb-3 gy-3">
<div class="col">
<div class="row row-cols-1 row-cols-xl-2 dark-shadow dark-6 gy-2 justify-content-center">
<div class="row row-cols-1 row-cols-xl-2 dark-shadow dark-6 justify-content-center equipment-input">
<div class="col-auto rounded order-xl-0 order-0">
<div class="row h-100 px-1" id="helmet-dropdown">
<div class="col-auto px-lg-1 g-0 dark-7 rounded-end my-auto text-center scaled-item-icon" id="helmet-img-loc">
@ -286,7 +286,7 @@
</div>
</div>
</div>
<div class="col-auto order-xl-0 order-1">
<div class="col-auto order-xl-0 order-1 level-input">
<div class="row h-100 px-1">
<div class="col">
<div class="row align-items-center justify-content-left">
@ -301,8 +301,10 @@
</div>
</div>
<div class="row align-items-left justify-content-left my-1">
<button class="col-auto mx-1 px-1 py-0 border-info text-light dark-5 scaled-font rounded fake-button" id=copy-button onclick="copyBuild()">Copy short</button>
<button class="col-auto mx-1 px-1 py-0 border-info text-light dark-5 scaled-font rounded fake-button" id=share-button onclick="shareBuild(player_build)">Copy for sharing</button>
<button class="col-auto mx-1 px-1 py-0 border-info text-light dark-5 scaled-font rounded fake-button"
id=copy-button onclick="copyBuild()">Copy short</button>
<button class="col-auto mx-1 px-1 py-0 border-info text-light dark-5 scaled-font rounded fake-button"
id=share-button onclick="shareBuild(player_build)">Copy for sharing</button>
</div>
</div>
</div>

View file

@ -106,11 +106,9 @@ input.equipment-input {
font-size: var(--scaled-fontsize);
}
.my-container {
position: fixed; /* Stay in place */
left: var(--sidebar-width);
overflow-y: scroll;
height: 100%;
.equipment-input {
--bs-gutter-y: 1rem;
--bs-gutter-x: 3rem
}
.text-right {
@ -176,7 +174,7 @@ input.equipment-input {
}
.scaled-item-icon img {
width: 5.5rem;
width: 6rem;
}
.scaled-bckgrd {
@ -185,7 +183,7 @@ input.equipment-input {
}
.scaled-bckgrd img {
width: 6.5rem;
width: 7rem;
}
.overall-box {
@ -200,6 +198,13 @@ input.equipment-input {
padding-left: var(--sidebar-width);
max-width: 100%;
}
.equipment-input {
--bs-gutter-y: 0.5rem;
--bs-gutter-x: 1.5rem;
}
.level-input {
margin-top: 0
}
.scaled-font {
font-size: 1rem;
}
@ -258,7 +263,13 @@ input.equipment-input {
padding-left: var(--sidebar-width);
max-width: 100%;
}
.equipment-input {
--bs-gutter-y: 0.5rem;
--bs-gutter-x: 1.5rem
}
.level-input {
margin-top: 0
}
.scaled-font {
font-size: 1rem;
}