fix layout switching between grid and flexbox
This commit is contained in:
parent
4f1b866ca5
commit
430547f821
@ -159,9 +159,9 @@ impl Component for Account {
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<button onclick={on_deposit} class={classes!("account__button")} disabled={!self.amount_valid}>{"deposit"}</button>
|
||||
<button onclick={on_withdraw} class={classes!("account__button")} disabled={!self.amount_valid}>{"withdraw"}</button>
|
||||
<button onclick={on_transfer} class={classes!("account__button")} disabled={!self.amount_valid || !self.is_transfer_account_valid()}>{"transfer"}</button>
|
||||
<button onclick={on_deposit} class={classes!("account__button", "account__deposit")} disabled={!self.amount_valid}>{"deposit"}</button>
|
||||
<button onclick={on_withdraw} class={classes!("account__button", "account__withdraw")} disabled={!self.amount_valid}>{"withdraw"}</button>
|
||||
<button onclick={on_transfer} class={classes!("account__button", "account__transfer")} disabled={!self.amount_valid || !self.is_transfer_account_valid()}>{"transfer"}</button>
|
||||
</fieldset>
|
||||
</section>
|
||||
</>
|
||||
|
@ -48,6 +48,21 @@ html, body {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.account__deposit {
|
||||
grid-column: 1;
|
||||
grid-row: 2;
|
||||
}
|
||||
|
||||
.account__withdraw {
|
||||
grid-column: 2;
|
||||
grid-row: 2;
|
||||
}
|
||||
|
||||
.account__transfer {
|
||||
grid-column: 3;
|
||||
grid-row: 2;
|
||||
}
|
||||
|
||||
.account__button {
|
||||
color: black;
|
||||
border-radius: 0;
|
||||
@ -117,12 +132,7 @@ html, body {
|
||||
|
||||
@media (max-width: 605px) {
|
||||
.account__grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.account__accounts {
|
||||
grid-column: 1;
|
||||
grid-row: 2;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user