clean up mobile layout per @callebtc (#874)

This commit is contained in:
Lee Salminen 2022-08-14 11:41:26 -06:00 committed by GitHub
parent c85be8dd22
commit 3df66334db
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 8 deletions

View file

@ -1,12 +1,11 @@
#invoicePage>.row:first-child>.col-xs { #invoicePage>.row:first-child>.col-md-6 {
display: flex; display: flex;
} }
#invoicePage>.row:first-child>.col-xs>.q-card { #invoicePage>.row:first-child>.col-md-6>.q-card {
flex: 1; flex: 1;
} }
#invoicePage .clear { #invoicePage .clear {
margin-bottom: 25px; margin-bottom: 25px;
} }
@ -15,6 +14,17 @@
display: none; display: none;
} }
@media (min-width: 1024px) {
#invoicePage>.row:first-child>.col-md-6:first-child>div {
margin-right: 5px;
}
#invoicePage>.row:first-child>.col-md-6:nth-child(2)>div {
margin-left: 5px;
}
}
@media print { @media print {
* { * {
color: black !important; color: black !important;

View file

@ -19,8 +19,8 @@
block page %} block page %}
<link rel="stylesheet" href="/invoices/static/css/pay.css" /> <link rel="stylesheet" href="/invoices/static/css/pay.css" />
<div id="invoicePage"> <div id="invoicePage">
<div class="row q-gutter-y-md q-gutter-md"> <div class="row q-gutter-y-md">
<div class="col-xs"> <div class="col-md-6 col-sm-12 col-xs-12">
<q-card> <q-card>
<q-card-section> <q-card-section>
<p> <p>
@ -88,7 +88,7 @@ block page %}
</q-card> </q-card>
</div> </div>
<div class="col-xs"> <div class="col-md-6 col-sm-12 col-xs-12">
<q-card> <q-card>
<q-card-section> <q-card-section>
<p> <p>
@ -131,7 +131,7 @@ block page %}
<div class="clear"></div> <div class="clear"></div>
<div class="row q-gutter-y-md q-gutter-md"> <div class="row">
<div class="col-12 col-md"> <div class="col-12 col-md">
<q-card> <q-card>
<q-card-section> <q-card-section>
@ -162,7 +162,7 @@ block page %}
<div class="clear"></div> <div class="clear"></div>
<div class="row q-gutter-y-md q-gutter-md"> <div class="row">
<div class="col-12 col-md"> <div class="col-12 col-md">
<q-card> <q-card>
<q-card-section> <q-card-section>