0
1
Fork 0
This commit is contained in:
Juan Ferrer 2022-05-28 02:37:24 +02:00
parent 6de30422ff
commit 060acd294e
29 changed files with 237 additions and 167 deletions

2
debian/changelog vendored
View File

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

View File

@ -1,6 +1,6 @@
.items .item .photo {
border-radius: 50%;
border-radius: 10px;
height: 80px;
width: 80px;
}

View File

@ -1,14 +1,4 @@
.queries {
padding: 1em;
}
.queries .box {
max-width: 600px;
margin: 0 auto;
}
.queries .form {
box-sizing: border-box;
padding: 2em;
}
.queries textarea {
display: block;
width: 100%;

View File

@ -13,7 +13,7 @@
on-click="this.onCleanClick()"/>
</div>
<div id="form" class="queries">
<div class="box form">
<div class="box form vn-w-sm vn-pa-lg">
<div class="form-group">
<label><t>SQL query</t></label>
<textarea

View File

@ -24,8 +24,8 @@
}
}*/
.about .box {
margin-bottom: 1em;
padding: 2em;
margin-bottom: 16px;
padding: 32px;
}
.about h1 {
padding: 0;

View File

@ -14,8 +14,8 @@
<htk-repeater form-id="iter">
<db-model property="model">
<custom>
SELECT title, text, image, id FROM news
WHERE tag != 'course'
SELECT title, text, image, id
FROM news
ORDER BY priority, created DESC
</custom>
</db-model>

View File

@ -100,8 +100,8 @@ Hedera.Catalog = new Class({
,realmRenderer: function(builder, form) {
var link = builder.$('link');
link.href = this.hash.make({
'form': this.hash.get('form'),
'realm': form.get('id')
form: this.hash.get('form'),
realm: form.get('id')
});
}
@ -192,22 +192,17 @@ Hedera.Catalog = new Class({
if (this.isGuest())
return;
this.hash.set({'form': 'ecomerce/basket'});
this.hash.set({form: 'ecomerce/basket'});
}
,onConfigureClick: function() {
if (this.isGuest())
return;
this.hash.set({'form': 'ecomerce/checkout'});
this.hash.set({form: 'ecomerce/checkout'});
}
,repeaterFunc: function(res, form) {
res.$('item-box').addEventListener('click',
this.onAddItemClick.bind(this, form));
}
,onAddItemClick: function(form, event) {
,onAddItemClick: function(event, form) {
if (event.defaultPrevented) return;
event.preventDefault();
if (this.isGuest()) return;

View File

@ -35,6 +35,7 @@ Lower size: Mida més petita
Higher size: Mida més gran
'%.0d Units': '%.0d Unitats'
for: per
Zoom image: Ampliar imatge
AddToBasket: Afegir article
Add: Afegir
Erase: Esborrar

View File

@ -35,6 +35,7 @@ Lower size: Lower size
Higher size: Higher size
'%.0d Units': '%.0d Units'
for: for
Zoom image: Zoom image
AddToBasket: Add to basket
Add: Add
Erase: Remove

View File

@ -35,6 +35,7 @@ Higher size: Medida más grande
Relevancy: Relevancia
'%.0d Units': '%.0d Unidades'
for: por
Zoom image: Ampliar imagen
AddToBasket: Añadir artículo
Add: Añadir
Erase: Borrar

View File

@ -35,6 +35,7 @@ Lower size: Taille le plus bas
Higher size: Taille le plus élevé
'%.0d Units': '%.0d Unités'
for: pour
Zoom image: Agrandir l'image
AddToBasket: Ajouter article
Add: Ajouter
Erase: Effacer

View File

@ -35,6 +35,7 @@ Lower size: Tamanho menor
Higher size: Tamanho maior
'%.0d Units': '%.0d Unidades'
por: para
Zoom image: Mais zoom
AddToBasket: Adicionar à Cesta
Add: Adicionar
Erase: Eliminar

View File

@ -1,14 +1,7 @@
.catalog {
padding: 0 !important;
margin-right: 18em;
}
/* Topbar */
.catalog-actions > .htk-search-entry {
margin-right: .4em;
}
/* Right panel */
.right-panel {
@ -132,13 +125,17 @@
/* Items */
.item-box {
transition: background-color 200ms ease-in;
display: flex;
box-sizing: border-box;
}
.item-box:hover {
cursor: pointer;
background-color: #eee;
.item-box > htk-image {
flex: none;
}
.item-info {
.item-box > htk-image:hover {
background-color: transparent;
}
.item-box > .item-info {
flex: auto;
position: relative;
}
.item-info .second-category {
@ -192,19 +189,19 @@
border-radius: .2em;
padding: .1em .3em;
border: .1em transparent solid;
background-color: white;
box-sizing: border-box;
}
.item-info .grouping {
width: 2em;
width: 38px;
background-color: #ddd;
}
.item-info .available {
width: 3.3em;
width: 65px;
border-color: #bbb;
color: #777;
}
.item-info .price {
width: 4em;
width: 75px;
border-color: #9cbc28;
color: #748c1e;
}
@ -221,40 +218,82 @@
padding-right: .5em;
}
/* Grid view */
.grid-view > * {
display: flex;
gap: 16px;
flex-wrap: wrap;
justify-content: center;
}
.grid-view .item-box {
border-radius: .6em;
box-shadow: .05em .05em .2em rgba(0, 0, 0, .1);
overflow: hidden;
background-color: white;
flex-direction: column;
width: 210px;
height: 375px;
overflow: hidden;
}
.grid-view .item-box:hover {
background-color: #efefef;
}
.grid-view .item-info {
margin: 10px;
}
.grid-view .item-box > .htk-image {
width: 210px;
height: 210px;
}
.grid-view .item-box > .item-info {
flex: auto;
overflow: hidden;
}
.grid-view .item-info .available-price {
position: absolute;
bottom: 0;
right: 0;
}
.grid-view .item-info .tags td {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
max-width: 6em;
width: 6em;
line-height: 1.1em;
}
/* List view */
.list-view {
max-width: 420px;
border-radius: .6em;
box-shadow: .05em .05em .2em rgba(0, 0, 0, .1);
overflow: hidden;
background-color: white;
max-width: 544px;
margin: 0 auto;
padding: 1em;
}
.list-view .item-box {
display: block;
position: relative;
width: 100%;
gap: 10px;
margin: 0;
height: 5.5em;
padding: 10px;
height: 120px;
overflow: visible;
border-bottom: 1px solid #DDD;
}
.list-view .item-box > .htk-image {
margin: 1em;
width: 3.5em;
height: 3.5em;
float: left;
overflow: hidden;
.list-view .item-box:last-child {
border-bottom: none;
}
.list-view .item-box > .htk-image > img {
.list-view .item-box > .htk-image {
width: 100px;
height: 100px;
border-radius: 50%;
}
.list-view .item-info {
position: absolute;
left: 5.5em;
right: 0;
top: 0;
bottom: 0;
margin: .8em;
margin-left: 0;
overflow: hidden;
}
.list-view .item-info > h2 {
font-size: 1em;
@ -290,52 +329,6 @@
display: none;
}
/* Grid view */
.grid-view {
padding: 1em;
padding-right: .2em;
padding-bottom: .4em;
text-align: center;
}
.grid-view .item-box {
text-align: left;
position: relative;
display: inline-block;
width: 24em;
margin: 0;
margin-right: .8em;
margin-bottom: .6em;
height: 11em;
overflow: hidden;
}
.grid-view .item-box > .htk-image {
width: 11em;
height: 100%;
float: left;
}
.grid-view .item-info {
position: absolute;
left: 11.4em;
right: 0;
top: 0;
bottom: 0;
margin: .6em;
}
.grid-view .item-info .available-price {
position: absolute;
bottom: 0;
right: 0;
}
.grid-view .item-info .tags td {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
max-width: 6em;
width: 6em;
line-height: 1.1em;
}
/* Card */
.card-popup {

View File

@ -117,20 +117,21 @@
id="grid-view"
empty-message="_Choose filter from right menu"
form-id="item"
model="items-model"
renderer="repeaterFunc">
model="items-model" >
<custom>
<div
id="item-box"
class="box item-box"
title="{{_('AddToBasket')}}">
class="item-box clickable"
title="{{_('AddToBasket')}}"
on-click="this.onAddItemClick($event, $.item)">
<htk-image
directory="catalog"
subdir="200x200"
form="item"
column="image"
stamp-column="updated"
full-dir="1600x900"/>
full-dir="1600x900"
title="_Zoom image"/>
<div class="item-info">
<h2>
{{item.item}}
@ -160,7 +161,7 @@
{{item.available}}
</span>
<span class="price" title="_GroupingPrice">
{{Vn.Value.format(item.price, 'x%.0d')}}
{{Vn.Value.format(item.price, '%.02d')}}
</span>
</div>
</div>

View File

@ -1,13 +1,13 @@
.balance {
margin-right: .5em;
margin-right: 8px;
}
.balance > * {
vertical-align: middle;
}
.balance > .amount {
color: white;
padding: 0.3em;
padding: .3em;
}
.balance > .info {
display: inline;
@ -17,8 +17,8 @@
}
.balance > .negative {
background-color: #EF5350;
border-radius: 0.1em;
box-shadow: 0 0 0.4em #666;
border-radius: .1em;
box-shadow: 0 0 .4em #666;
}
.balance-popup {
width: 25em;

View File

@ -20,12 +20,11 @@
</db-model>
</db-form>
</htk-text>
</span>
<img
src="image/icon/dark/info.svg"
</span>
<htk-icon
name="info"
title="_PaymentInfo"
class="info"
alt="Info"/>
class="info"/>
</div>
<htk-bar-button
id="pay-button"

View File

@ -1,4 +1,33 @@
.new .box {
position: relative;
}
.new .image-label {
position: absolute;
text-align: center;
width: 100%;
top: 30px;
opacity: .5;
}
.new .htk-image {
height: 100px;
overflow: hidden;
border-bottom: 1px solid #ddd;
}
.new .htk-image > button {
display: block;
}
.new .htk-image > img {
margin-top: -40%;
width: 100%;
height: initial;
}
.new .tag-priority {
display: flex;
gap: 16px;
}
.new .tag-priority > *{
flex: 1;
}
.new textarea {
min-height: 500px;
}

View File

@ -9,7 +9,7 @@
updatable="true"
on-operations-done="this.onOperationsDone()">
<custom>
SELECT id, title, text, tag, priority
SELECT id, title, text, tag, priority, image
FROM news WHERE id = #new
</custom>
<sql-batch property="batch">
@ -35,29 +35,43 @@
on-click="this.onAcceptClick()"/>
</div>
<div id="form" class="new">
<div class="box form vn-w-sm vn-pa-lg">
<div class="form-group">
<label><t>Title</t></label>
<htk-entry form="iter" column="title"/>
</div>
<div class="form-group">
<label><t>Tag</t></label>
<htk-combo form="iter" column="tag">
<db-model property="model">
<custom>
SELECT name, description FROM newsTag
ORDER BY description
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label><t>Priority</t></label>
<htk-entry form="iter" column="priority"/>
</div>
<div class="form-group">
<label><t>NewBody</t></label>
<textarea id="html-editor"/>
<div class="box form vn-w-sm">
<h4 class="image-label"><t>Image</t></h4>
<htk-image
form="iter"
column="image"
class="photo"
directory="news"
subdir="full"
full-dir="full"
editable="true"
conn="conn"/>
<div class="vn-pa-lg">
<div class="form-group">
<label><t>Title</t></label>
<htk-entry form="iter" column="title"/>
</div>
<div class="form-group tag-priority">
<div>
<label><t>Tag</t></label>
<htk-combo form="iter" column="tag">
<db-model property="model">
<custom>
SELECT name, description FROM newsTag
ORDER BY description
</custom>
</db-model>
</htk-combo>
</div>
<div>
<label><t>Priority</t></label>
<htk-entry form="iter" column="priority"/>
</div>
</div>
<div class="form-group">
<label><t>NewBody</t></label>
<textarea id="html-editor"/>
</div>
</div>
</div>
</div>

View File

@ -2,5 +2,5 @@
.news .item .photo {
height: 80px;
width: 80px;
border-radius: 50%;
border-radius: 10px;
}

View File

@ -68,17 +68,14 @@ $navbar-height: 64px;
}
& > .action-bar {
flex: none;
padding: 0;
margin: 0;
height: 100%;
& > div {
padding: 0;
margin: 0;
height: 100%;
display: flex;
align-items: center;
padding: 0 1em;
padding-right: $spacing-md;
padding-left: $spacing-sm;
gap: .5em;
& > * {

View File

@ -114,6 +114,7 @@ select,
}
input[type=text],
input[type=password],
input[type=file],
input[type=number],
textarea,
.input,
@ -196,6 +197,12 @@ img.editable {
clear: both !important;
}
/* Clickable */
.clickable {
@extend %clickable;
}
/* Box */
.box {

View File

@ -110,18 +110,18 @@ module.exports = new Class({
this.node.removeChild(this.editButton);
this.editButton = null;
}
if (this._editable) {
var button = this.createElement('button');
button.addEventListener('click', this._onEditClick.bind(this));
button.title = _('UpdateImage');
this.node.appendChild(button);
var icon = new Htk.Icon({icon: 'add-photo'});
var icon = new Htk.Icon({name: 'add_a_photo'});
button.appendChild(icon.node);
this.editButton = button;
}
console.log(this.editable);
}
,_makeSrc: function(subdir) {
@ -162,7 +162,8 @@ module.exports = new Class({
}
,_onClick: function(event) {
if (!this._fullDir || !this._value || this._error)
if (!this._fullDir || !this._value || this._error
|| event.defaultPrevented)
return;
event.preventDefault();
@ -170,7 +171,8 @@ module.exports = new Class({
}
,_onEditClick: function(event) {
event.stopPropagation();
if (event.defaultPrevented) return
event.preventDefault();
var editor = new Htk.ImageEditor({conn: this.conn});
editor.setData(this.value, this._directory);

View File

@ -357,6 +357,7 @@ td.cell-image .htk-image {
.htk-image {
position: relative;
overflow: hidden;
transition: opacity 250ms ease-out;
&.clickable:hover {
cursor: pointer;
@ -371,17 +372,20 @@ td.cell-image .htk-image {
position: absolute;
top: 0;
left: 0;
margin: 0;
padding: .15em;
padding: 8px;
margin: 4px;
display: none;
background-color: rgba(255, 255, 255, .6);
&:hover {
background-color: rgba(255, 255, 255, .8);
}
}
&:hover > button {
display: block;
}
& > button > img {
& > button > .htk-icon {
display: block;
height: 1.2em;
height: 1.2em;
}
}

View File

@ -5,3 +5,4 @@
@import "./text";
@import "./width";
@import "./components";
@import "./material-symbols";

View File

@ -0,0 +1,22 @@
/* fallback */
@font-face {
font-family: 'Material Symbols Rounded';
font-style: normal;
font-weight: 400;
src: url(./material-symbols.woff2) format('woff2');
}
.material-symbols-rounded {
font-family: 'Material Symbols Rounded';
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-moz-font-feature-settings: 'liga';
-moz-osx-font-smoothing: grayscale;
}

Binary file not shown.

View File

@ -27,6 +27,18 @@ module.exports = new Class({
,get: function() {
return this._node.className;
}
},
/**
* Title of the element.
*/
title: {
type: String
,set: function(x) {
this.node.title = x;
}
,get: function() {
return this.node.title;
}
}
}

View File

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

View File

@ -15,7 +15,6 @@ $result = $db->query('SELECT name, content FROM metatag');
<link rel="icon" type="image/png" href="image/favicon/favicon.png"/>
<link rel="icon" type="image/svg+xml" href="image/icon.svg" sizes="any"/>
<link rel="manifest" href="<?=$dir?>/manifest.json"/>
<link rel="stylesheet" href="https://fonts.sandbox.google.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@48,400,0,0"/>
<meta name="theme-color" content="#333333"/>
<meta name="content-language" content="<?=$lang?>"/>