refs #3971 Style fixes
gitea/hedera-web/pipeline/head This commit looks good Details

This commit is contained in:
Juan Ferrer 2022-11-15 22:26:48 +01:00
parent 1f80bd5ee0
commit 22ce6425de
13 changed files with 86 additions and 111 deletions

2
debian/changelog vendored
View File

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

View File

@ -1,13 +1,13 @@
.home { .home {
padding: 0 !important; padding: 6px !important;
} }
/* News panel */ /* News panel */
.column { .column {
margin: .5em; margin: 0 auto;
max-width: 120em; max-width: 1680px;
} }
.action-bar button.start-order { .action-bar button.start-order {
border: 1px solid white; border: 1px solid white;
@ -21,7 +21,7 @@
.new { .new {
text-align: left; text-align: left;
margin: .5em; margin: 6px;
} }
.new img { .new img {
display: block; display: block;
@ -29,7 +29,7 @@
width: 100%; width: 100%;
} }
.new .top { .new .top {
padding: 1.5em; padding: 18px;
padding-bottom: 1px; padding-bottom: 1px;
} }
.new h2 { .new h2 {
@ -39,14 +39,8 @@
padding: 0; padding: 0;
} }
.new-info {
font-size: 0.9rem;
color: #444;
text-align: right;
margin: .8em 0;
}
.new-text { .new-text {
margin: 1.5em 0; margin: 18px 0;
font-family: 'Open Sans'; font-family: 'Open Sans';
} }
.new-text a { .new-text a {
@ -56,5 +50,5 @@
text-decoration: underline; text-decoration: underline;
} }
.new-text li { .new-text li {
margin: 0.4em 0; margin: 4px 0;
} }

View File

@ -1,38 +1,35 @@
Hedera.Basket = new Class({ Hedera.Basket = new Class({
Extends: Hedera.Form Extends: Hedera.Form,
,open: function() { open() {
this.close(); this.close();
this.isOpen = true; this.isOpen = true;
Hedera.BasketChecker.check(this.conn, this.hash, Hedera.BasketChecker.check(this.conn, this.hash,
this.onBasketCheck.bind(this)); this.onBasketCheck.bind(this));
} },
,onBasketCheck: function(isOk) { onBasketCheck(isOk) {
if (isOk) if (isOk)
this.loadUi(); this.loadUi();
} },
,activate: function() { activate() {
this.$.items.setInfo('bi', 'myBasketItem', 'hedera'); this.$.items.setInfo('bi', 'myBasketItem', 'hedera');
} },
,onConfigureClick: function() { onConfigureClick() {
Htk.Toast.showWarning(_('RememberReconfiguringImpact')); Htk.Toast.showWarning(_('RememberReconfiguringImpact'));
this.hash.setAll({form: 'ecomerce/checkout'}); this.hash.setAll({form: 'ecomerce/checkout'});
} },
,onDeleteClick: function(form) { onDeleteClick(form) {
if (confirm(_('ReallyDelete'))) if (confirm(_('ReallyDelete')))
form.deleteRow(); form.deleteRow();
} },
,subtotal: function(form) { subtotal(form) {
return form.$.amount * form.$.price; return form.$.amount * form.$.price;
} }
}); });

View File

@ -20,21 +20,25 @@
.basket .line { .basket .line {
display: flex; display: flex;
align-items: center;
gap: 12px; gap: 12px;
margin: 20px 0; margin: 10px 0;
height: 68px; height: 80px;
}
.basket .line:first-child {
margin-top: 0;
} }
.basket .line:last-child { .basket .line:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
.basket .line > .delete { .basket .line > .delete {
align-self: center;
margin: 0 -8px; margin: 0 -8px;
} }
.basket .line > .photo { .basket .line > .photo {
flex: none; flex: none;
border-radius: 50%; border-radius: 50%;
width: 68px; width: 68px;
height: 68px;
gap: 0; gap: 0;
} }
.basket .line > .info { .basket .line > .info {
@ -49,7 +53,7 @@
.basket .line > .info > h2 { .basket .line > .info > h2 {
font-size: .9rem; font-size: .9rem;
font-weight: normal; font-weight: normal;
margin-bottom: 2px; margin: 0;
} }
.basket .line > .info > p { .basket .line > .info > p {
margin: 0; margin: 0;

View File

@ -26,7 +26,7 @@
</htk-text> </htk-text>
</p> </p>
</div> </div>
<div class="lines"> <div class="lines vn-pt-lg">
<htk-repeater form-id="iter"> <htk-repeater form-id="iter">
<db-model id="items" property="model" updatable="true"> <db-model id="items" property="model" updatable="true">
SELECT bi.id, bi.amount, bi.price, i.longName item, SELECT bi.id, bi.amount, bi.price, i.longName item,

View File

@ -34,9 +34,10 @@
.ticket .line { .ticket .line {
display: flex; display: flex;
align-items: center;
gap: 12px; gap: 12px;
margin: 24px 0; margin: 10px 0;
height: 68px; height: 80px;
} }
.ticket .line:last-child { .ticket .line:last-child {
margin-bottom: 0; margin-bottom: 0;
@ -45,6 +46,8 @@
flex: none; flex: none;
border-radius: 50%; border-radius: 50%;
width: 68px; width: 68px;
height: 68px;
gap: 0;
} }
.ticket .line > .info { .ticket .line > .info {
flex: 1; flex: 1;
@ -69,9 +72,6 @@
.ticket .line > .info .discount { .ticket .line > .info .discount {
color: green; color: green;
} }
.ticket .line > .info > .amount {
float: left;
}
.ticket .line > .info > .subtotal { .ticket .line > .info > .subtotal {
float: right; float: right;
} }

View File

@ -66,9 +66,6 @@
<p class="tags"> <p class="tags">
{{iter.value5}} {{iter.value6}} {{iter.value7}} {{iter.value5}} {{iter.value6}} {{iter.value7}}
</p> </p>
<p class="amount">
{{iter.quantity}} x {{Vn.Value.format(iter.price, '%.2d€')}}
</p>
<p class="subtotal"> <p class="subtotal">
<span class="discount" id="discount"> <span class="discount" id="discount">
{{Vn.Value.format(this.discountSubtotal(iter), '%.2d€')}} - {{Vn.Value.format(this.discountSubtotal(iter), '%.2d€')}} -
@ -76,6 +73,9 @@
</span> </span>
{{Vn.Value.format(this.subtotal(iter), '%.2d€')}} {{Vn.Value.format(this.subtotal(iter), '%.2d€')}}
</p> </p>
<p class="amount">
{{iter.quantity}} x {{Vn.Value.format(iter.price, '%.2d€')}}
</p>
</div> </div>
</div> </div>
</custom> </custom>

View File

@ -400,16 +400,24 @@ module.exports = new Class({
} }
,setForm: function(form) { ,setForm: function(form) {
Vn.Node.removeChilds(this.$.formHolder); const holder = this.$.formHolder;
Vn.Node.removeChilds(holder);
if (form) { if (form) {
this.$.formHolder.appendChild(form); holder.appendChild(form);
setTimeout(this._onSetFormTimeout.bind(this), 0); holder.classList.add('move-start');
setTimeout(() => this._onSetFormTimeout(), 10);
} }
} }
,_onSetFormTimeout: function() { ,_onSetFormTimeout: function() {
Vn.Node.addClass(this.$.formHolder, 'show'); const holder = this.$.formHolder;
holder.classList.remove('move-start');
holder.classList.add('move-end');
holder.addEventListener('transitionend',
() => holder.classList.remove('move-end'),
{once: true}
);
} }
,setTitle: function(title) { ,setTitle: function(title) {

View File

@ -46,12 +46,12 @@ $navbar-height: 64px;
} }
} }
& > .title-wraper { & > .title-wraper {
flex: auto;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 12px; gap: 12px;
overflow: hidden; overflow: hidden;
padding-left: 12px; padding-left: 12px;
flex-shrink: 2;
& > .title { & > .title {
overflow: hidden; overflow: hidden;
@ -67,20 +67,17 @@ $navbar-height: 64px;
} }
} }
& > .action-bar { & > .action-bar {
flex: none; flex: auto;
height: 100%; height: 100%;
& > div { & > div {
height: 100%;
display: flex; display: flex;
justify-content: flex-end;
height: 100%;
align-items: center; align-items: center;
padding-right: 12px; padding-right: 12px;
padding-left: 4px; padding-left: 4px;
gap: 2px; gap: 2px;
& > * {
float: right;
}
} }
button { button {
margin: 0; margin: 0;
@ -283,18 +280,19 @@ $navbar-height: 64px;
position: relative; position: relative;
height: inherit; height: inherit;
opacity: 0; &.move-start {
transform: translateZ(0) translateX(-2em); opacity: 0;
-webkit-transform: translateZ(0) translateX(-2em); transform: translate3d(-2em, 0, 0);
-webkit-transform: translate3d(-2em, 0, 0);
transition-property: opacity, transform; }
transition-duration: 200ms; &.move-end {
transition-timing-function: ease-out;
&.show {
opacity: 1; opacity: 1;
transform: translateZ(0) translateX(0em); transform: translate3d(0, 0, 0);
-webkit-transform: translateZ(0) translateX(0em); -webkit-transform: translate3d(0, 0, 0);
transition-property: opacity, transform;
transition-duration: 200ms;
transition-timing-function: ease-out;
} }
& > * { & > * {
padding: $spacing-md; padding: $spacing-md;

View File

@ -7,4 +7,9 @@
& > .htk-icon { & > .htk-icon {
display: block; display: block;
} }
& > .text {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
} }

View File

@ -8,6 +8,8 @@
border-radius: 20px; border-radius: 20px;
padding: 0 12px; padding: 0 12px;
overflow: hidden; overflow: hidden;
flex: auto;
max-width: 300px;
& > * { & > * {
display: inline-block; display: inline-block;
@ -19,9 +21,9 @@
color: gray; color: gray;
} }
& > .entry { & > .entry {
flex: auto;
margin: 0; margin: 0;
border: none; border: none;
width: 80px;
box-shadow: none; box-shadow: none;
padding-right: 0; padding-right: 0;
padding-left: 0; padding-left: 0;

View File

@ -5,48 +5,15 @@
/* Standard */ /* Standard */
body { font-size: 14px; } body { font-size: 14px; }
/* Desktop - Laptop 1360x768 */ /* smartphone, portrait */
@media (max-resolution: 119dpi) and (min-device-width: 1340px) and (max-device-width: 1899px) { @media (min-width:320px) { body { font-size: 13px; } }
body { font-size: 14px; } /* smartphone, landscape */
} @media (min-width:480px) { body { font-size: 13px; } }
/* tablet, portrait */
/* Desktop - FHD 1920x1080 */ @media (min-width:600px) { body { font-size: 13px; } }
@media (max-resolution: 119dpi) and (min-device-width: 1900px) { /* tablet, landscape */
body { font-size: 14px; } @media (min-width:801px) { body { font-size: 13px; } }
} /* big landscape tablets, laptop and desktop */
@media (min-width:1025px) { body { font-size: 14px; } }
/* Mobile - Low DPI */ /* hi-res laptop and desktop */
@media @media (min-width:1281px) { body { font-size: 14px; } }
(min-resolution: 120dpi),
(-webkit-min-device-pixel-ratio: 1.5) {
body { font-size: 13px; }
}
@media
(min-resolution: 144dpi),
(-webkit-min-device-pixel-ratio: 1.5) {
body { font-size: 13px; }
}
/* Mobile - Normal DPI */
@media
(max-device-width: 383px) and (min-resolution: 192dpi),
(max-device-width: 383px) and (-webkit-min-device-pixel-ratio: 2) {
body { font-size: 13px; }
}
@media
(min-device-width: 384px) and (min-resolution: 192dpi),
(min-device-width: 384px) and (-webkit-min-device-pixel-ratio: 2) {
body { font-size: 13px; }
}
/* Mobile - High DPI */
@media
(max-device-width: 411px) and (min-resolution: 249dpi),
(max-device-width: 411px) and (-webkit-min-device-pixel-ratio: 3) {
body { font-size: 13px; }
}
@media
(min-device-width: 414px) and (min-resolution: 249dpi),
(min-device-width: 414px) and (-webkit-min-device-pixel-ratio: 3) {
body { font-size: 13px; }
}

View File

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