0
1
Fork 0

refs #3971 Order confirm style fixes

This commit is contained in:
Juan Ferrer 2023-01-16 14:18:07 +01:00
parent 59ed61ae9b
commit be43a38b38
12 changed files with 292 additions and 287 deletions

2
debian/changelog vendored
View File

@ -1,4 +1,4 @@
hedera-web (22.48.6) stable; urgency=low
hedera-web (22.48.7) stable; urgency=low
* Initial Release.

View File

@ -1,76 +1,77 @@
.basket .head {
border-bottom: 1px solid #DDD;
}
.basket .head p {
font-weight: bold;
margin: 0;
padding: 0;
font-size: 1.4rem;
text-align: right;
}
.basket .form > p {
margin: 0;
font-size: 1.4rem;
color: white;
text-align: right;
}
.hedera-basket {
.head {
border-bottom: 1px solid #DDD;
}
.head p {
font-weight: bold;
margin: 0;
padding: 0;
font-size: 1.4rem;
text-align: right;
}
.form > p {
margin: 0;
font-size: 1.4rem;
color: white;
text-align: right;
}
/* Lines */
/* Lines */
.basket .line {
display: flex;
align-items: center;
gap: 12px;
margin: 10px 0;
height: 80px;
}
.basket .line:first-child {
margin-top: 0;
}
.basket .line:last-child {
margin-bottom: 0;
}
.basket .line > .delete {
margin: 0 -8px;
}
.basket .line > .photo {
flex: none;
border-radius: 50%;
width: 68px;
height: 68px;
gap: 0;
}
.basket .line > .info {
flex: 1;
overflow: hidden;
}
.basket .line > .info > * {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.basket .line > .info > h2 {
font-size: 1rem;
font-weight: normal;
margin: 0;
}
.basket .line > .info > p {
margin: 0;
}
.basket .line > .info > .tags {
color: #777;
}
.basket .line .subtotal {
float: right;
}
.line {
display: flex;
align-items: center;
gap: 12px;
margin: 10px 0;
height: 80px;
}
.line:first-child {
margin-top: 0;
}
.line:last-child {
margin-bottom: 0;
}
.line > .delete {
margin: 0 -8px;
}
.line > .photo {
flex: none;
border-radius: 50%;
width: 68px;
height: 68px;
gap: 0;
}
.line > .info {
flex: 1;
overflow: hidden;
}
.line > .info > * {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.line > .info > h2 {
font-size: 1rem;
font-weight: normal;
margin: 0;
}
.line > .info > p {
margin: 0;
}
.line > .info > .tags {
color: #777;
}
.line .subtotal {
float: right;
}
/* Fields */
/* Fields */
.basket td.available-exceeded input {
background-color: #FCC;
td.available-exceeded input {
background-color: #FCC;
}
.icon > img {
border-radius: 50%;
}
}
.basket .icon > img {
border-radius: 50%;
}

View File

@ -16,7 +16,7 @@
tip="_Checkout"
on-click="this.hash.setAll({form: 'ecomerce/confirm'})"/>
</div>
<div id="form" class="basket">
<div id="form" class="hedera-basket">
<div class="box vn-w-sm vn-pa-lg">
<div class="head vn-pb-lg">
<p>

View File

@ -1,54 +1,55 @@
.checkout .bar {
margin-bottom: 16px;
}
.hedera-checkout {
.bar {
margin-bottom: 16px;
}
/* Step */
/* Step */
.answers button,
.answers p,
.radio > div {
font-size: 1.2rem;
.answers button,
.answers p,
.radio > div {
font-size: 1.2rem;
}
.answers .htk-select {
max-width: 15em;
margin: 0 auto;
font-size: 1.4rem;
}
.answers p {
margin: 0.3em 0;
}
.target {
max-width: 28em;
margin: 0 auto;
}
.address {
border-radius: 0.1em;
padding: 0.6em 1.4em;
}
.address.selected {
background-color: rgba(1, 1, 1, .1);
}
.address:hover {
cursor: pointer;
background-color: rgba(1, 1, 1, .05);
}
.address p.consignee {
font-weight: bold;
}
.radio {
max-width: 20em;
margin: 0 auto;
}
.radio > div {
padding: 0.5em;
}
.thin-calendar {
max-width: 24em;
margin: 0 auto;
box-shadow: none;
}
.htk-assistant .thin {
float: right;
}
}
.answers .htk-select {
max-width: 15em;
margin: 0 auto;
font-size: 1.4rem;
}
.answers p {
margin: 0.3em 0;
}
.target {
max-width: 28em;
margin: 0 auto;
}
.address {
border-radius: 0.1em;
padding: 0.6em 1.4em;
}
.address.selected {
background-color: rgba(1, 1, 1, .1);
}
.address:hover {
cursor: pointer;
background-color: rgba(1, 1, 1, .05);
}
.address p.consignee {
font-weight: bold;
}
.radio {
max-width: 20em;
margin: 0 auto;
}
.radio > div {
padding: 0.5em;
}
.thin-calendar {
max-width: 24em;
margin: 0 auto;
box-shadow: none;
}
.htk-assistant .thin {
float: right;
}

View File

@ -54,7 +54,7 @@
tip="_Cancel"
on-click="onCancelClick"/>
</div>
<div id="form" class="checkout">
<div id="form" class="hedera-checkout">
<div class="vn-w-sm">
<div class="box bar">
<htk-assistant-bar

View File

@ -1,93 +1,95 @@
.confirm .summary {
margin-bottom: 16px;
}
.confirm p {
margin: .2em 0;
}
.hedera-confirm {
.summary {
margin-bottom: 16px;
}
p {
margin: .2em 0;
}
/* Table */
/* Table */
.confirm .debt-info {
padding: 0;
}
.confirm .debt-info > table {
border-collapse: collapse;
}
.confirm td {
padding: .15em 0;
}
.confirm .sum-total > td {
border-top: solid 1px #DDD;
font-weight: bold;
}
.confirm .currency {
text-align: right;
}
.confirm .credit-info {
display: none;
}
.confirm .exceeded-info {
display: none;
color: #E53935;
}
.debt-info {
padding: 0;
}
.debt-info > table {
border-collapse: collapse;
}
td {
padding: .15em 0;
}
.sum-total > td {
border-top: solid 1px #DDD;
font-weight: bold;
}
.currency {
text-align: right;
}
.credit-info {
display: none;
}
.exceeded-info {
display: none;
color: #E53935;
}
/* Pay */
/* Pay */
.confirm .amount-selector,
.confirm .pay-methods > div {
display: none;
}
.confirm .pay-methods > div {
margin: .3em 0;
}
.confirm .pay-methods > div > label > input[type=radio] {
margin: 0;
margin-right: .5em;
vertical-align: middle;
}
.confirm .pay-methods > div > div {
padding: .5em 1.5em;
display: none;
}
.confirm .pay-methods > div.selected > div {
display: block;
}
.confirm .transfer-account {
margin-top: .5em;
}
.confirm .transfer-account > p {
margin: .1em 0;
}
.amount-selector,
.pay-methods > div {
display: none;
}
.pay-methods > div {
margin: .3em 0;
}
.pay-methods > div > label > input[type=radio] {
margin: 0;
margin-right: .5em;
vertical-align: middle;
}
.pay-methods > div > div {
padding: .5em 1.5em;
display: none;
}
.pay-methods > div.selected > div {
display: block;
}
.transfer-account {
margin-top: .5em;
}
.transfer-account > p {
margin: .1em 0;
}
.confirm .payment > div {
margin-bottom: 1.4em;
.payment > div {
margin-bottom: 1.4em;
}
.payment > .button-bar {
display: flex;
justify-content: space-between;
margin-bottom: 0;
margin-top: 32px;
}
.payment > .button-bar button{
font-size: 1.2rem;
border-radius: 2rem;
padding: .5rem 1rem;
margin: 0;
}
.modify-order {
border: 1px solid #1a1a1a;
}
.modify-order:hover {
color: white;
background-color: #1a1a1a;
}
.confirm-order {
border: 1px solid #8cc63f;
background-color: #8cc63f;
color: white;
}
.confirm-order:hover {
background-color: transparent;
color: #6b5;
}
}
.confirm .payment > .button-bar {
display: flex;
justify-content: space-between;
margin-bottom: 0;
margin-top: 32px;
}
.confirm .payment > .button-bar button{
font-size: 1.2rem;
border-radius: 2rem;
padding: .5rem 1rem;
margin: 0;
}
.confirm .modify-order {
border: 1px solid #1a1a1a;
}
.confirm .modify-order:hover {
color: white;
background-color: #1a1a1a;
}
.confirm .confirm-order {
border: 1px solid #8cc63f;
background-color: #8cc63f;
color: white;
}
.confirm .confirm-order:hover {
background-color: transparent;
color: #6b5;
}

View File

@ -27,7 +27,7 @@
<div id="title">
<h1><t>Order summary</t></h1>
</div>
<div id="form" class="confirm">
<div id="form" class="hedera-confirm">
<div class="vn-w-sm">
<div class="box vn-pa-lg summary">
<div>

View File

@ -2,7 +2,7 @@
<div id="title">
<h1><t>Invoices</t></h1>
</div>
<div id="form" class="invoices">
<div id="form" class="hedera-invoices">
<htk-grid
class="box vn-w-sm"
show-header="false">

View File

@ -34,7 +34,7 @@
tip="_ShoppingBasket"
on-click="onBasketClick"/>
</div>
<div id="form" class="orders">
<div id="form" class="hedera-orders">
<htk-repeater
class="htk-list box confirmed vn-w-sm"
form-id="iter"

View File

@ -1,78 +1,79 @@
/* Header */
.hedera-ticket {
/* Header */
.ticket .head {
padding: 0;
padding-bottom: 3px;
border-bottom: 1px solid #DDD;
margin-bottom: 1px;
}
.ticket .head > div > div {
margin: 15px 0;
}
.ticket .head > div > div:first-child {
margin: 0;
}
.ticket .head p {
margin: 3px 0;
}
.ticket .head p.important {
font-size: 1.2rem;
font-weight: bold;
}
.ticket .total {
text-align: right;
}
.ticket .packages {
margin-top: 14px;
padding-top: 14px;
border-top: 1px solid #DDD;
display: block;
}
.head {
padding: 0;
padding-bottom: 3px;
border-bottom: 1px solid #DDD;
margin-bottom: 1px;
}
.head > div > div {
margin: 15px 0;
}
.head > div > div:first-child {
margin: 0;
}
.head p {
margin: 3px 0;
}
.head p.important {
font-size: 1.2rem;
font-weight: bold;
}
.total {
text-align: right;
}
.packages {
margin-top: 14px;
padding-top: 14px;
border-top: 1px solid #DDD;
display: block;
}
/* Lines */
/* Lines */
.ticket .line {
display: flex;
align-items: center;
gap: 12px;
margin: 10px 0;
height: 80px;
.line {
display: flex;
align-items: center;
gap: 12px;
margin: 10px 0;
height: 80px;
}
.line:last-child {
margin-bottom: 0;
}
.line > .photo {
flex: none;
border-radius: 50%;
width: 68px;
height: 68px;
gap: 0;
}
.line > .info {
flex: 1;
overflow: hidden;
}
.line > .info > * {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.line > .info > h2 {
font-size: 1rem;
font-weight: normal;
margin-bottom: 2px;
}
.line > .info > p {
margin: 0;
}
.line > .info > .tags {
color: #777;
}
.line > .info .discount {
color: green;
}
.line > .info > .subtotal {
float: right;
}
}
.ticket .line:last-child {
margin-bottom: 0;
}
.ticket .line > .photo {
flex: none;
border-radius: 50%;
width: 68px;
height: 68px;
gap: 0;
}
.ticket .line > .info {
flex: 1;
overflow: hidden;
}
.ticket .line > .info > * {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.ticket .line > .info > h2 {
font-size: 1rem;
font-weight: normal;
margin-bottom: 2px;
}
.ticket .line > .info > p {
margin: 0;
}
.ticket .line > .info > .tags {
color: #777;
}
.ticket .line > .info .discount {
color: green;
}
.ticket .line > .info > .subtotal {
float: right;
}

View File

@ -14,7 +14,7 @@
tip="_Print delivery note"
on-click="this.onPrintClick()"/>
</div>
<div id="form" class="ticket">
<div id="form" class="hedera-ticket">
<div class="box vn-w-sm vn-pa-lg">
<htk-loader class="head" form="ticket-form">
<h5>#{{ticket.id}}</h5>

View File

@ -1,6 +1,6 @@
{
"name": "hedera-web",
"version": "22.48.6",
"version": "22.48.7",
"description": "Verdnatura web page",
"license": "GPL-3.0",
"repository": {