Merge pull request #2365 from IvarK/fix-glyph-set-saves-kongtest

Make glyph set saves fit better on smaller screens
This commit is contained in:
Dys 2022-03-24 17:05:13 +08:00 committed by GitHub
commit c8a43ec7aa
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 10 additions and 7 deletions

View File

@ -597,8 +597,9 @@
.c-glyph-set-save-container {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
margin: 1rem 7rem 0;
justify-content: center;
margin: 1rem auto 0;
max-width: 30rem;
}
.c-glyph-single-set-save {
@ -606,7 +607,7 @@
flex-wrap: wrap;
justify-content: space-around;
align-items: flex-end;
height: 7.5rem;
margin: 0 0 1.5rem;
}
.c-glyph-single-set-save-flexbox {
@ -622,7 +623,7 @@
}
.c-glyph-sets-save-name__input {
width: 20rem;
width: 16rem;
height: 1.5em;
font-size: 1.35rem;
background-color: black;
@ -646,7 +647,7 @@
color: var(--color-reality-light);
border: 0.2rem solid var(--color-reality);
border-radius: 0.5rem;
margin-bottom: 1rem;
margin: 0 0.4rem 1rem;
transition-duration: 0.2s;
cursor: pointer;
}

View File

@ -158,7 +158,7 @@ export default {
:none-text="noSet"
/>
</div>
<div class="c-glyph-single-set-save-flexbox" style="width: 22rem">
<div class="c-glyph-single-set-save-flexbox">
<div ach-tooltip="Set a custom name (up to 20 characters)">
<input
:id="id"
@ -200,5 +200,7 @@ export default {
</template>
<style scoped>
.c-glyph-single-set-save-flexbox {
width: 16rem;
}
</style>