granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix modal positioning

Browse source 
Weirdly, mobile modals had 14px of padding, so we reset that and got rid of the min-width on Login and Signup modals
This commit is contained in:
Justin Edmund 2023-02-02 03:36:19 -08:00
parent a744b27940
commit 85d5ba075b
3 changed files with 6 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
components/DialogContent/index.scss
View file

@ -1,9 +1,11 @@
.Dialog { .Dialog {
position: fixed; position: fixed;
box-sizing: border-box;
background: none; background: none;
border: 0; border: 0;
inset: 0; inset: 0;
display: grid; display: grid;
padding: 0;
place-items: center; place-items: center;
min-height: 100vh; min-height: 100vh;
min-width: 100vw; min-width: 100vw;
@ -42,6 +44,8 @@
@include breakpoint(phone) { @include breakpoint(phone) {
animation: 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0s 1 normal forwards running animation: 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0s 1 normal forwards running
openModalMobile; openModalMobile;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
min-width: inherit; min-width: inherit;
min-height: 80vh; min-height: 80vh;
transform: initial; transform: initial;

2
components/LoginModal/index.scss
View file

@ -1,6 +1,6 @@
.Login.DialogContent { .Login.DialogContent {
gap: $unit; gap: $unit;
min-width: $unit * 52; // min-width: $unit * 52;
.Fields { .Fields {
display: flex; display: flex;

2
components/SignupModal/index.scss
View file

@ -1,6 +1,6 @@
.Signup.DialogContent { .Signup.DialogContent {
gap: $unit; gap: $unit;
min-width: $unit * 52; // min-width: $unit * 52;
.Fields { .Fields {
display: flex; display: flex;