wbuezas
/
hedera-web-mindshore
forked from verdnatura/hedera-web
0
1
Fork 0
Code Pull Requests Activity

Checkpoint

This commit is contained in:
Juan Ferrer 2022-05-21 23:31:56 +02:00
parent 83ab901da6
commit f815aa9992
73 changed files with 11157 additions and 12214 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
forms/account/address/style.css
View File

@ -6,11 +6,5 @@
.address .box .address .box
{ {
max-width: 30em; max-width: 30em;
padding: 2em; padding: 3em;
} }
.address .form
{
margin: 0 auto;
max-width: 25em;
}

41
forms/account/address/ui.xml
View File

@ -23,40 +23,45 @@
</db-form> </db-form>
</vn-group> </vn-group>
<div id="title"> <div id="title">
<h1><t>AddEditAddress</t></h1> <h1><t>Configuration</t></h1>
</div> </div>
<div id="actions"> <div id="actions">
<htk-bar-button
icon="ok"
tip="_Accept"
on-click="onAcceptClick"/>
<htk-bar-button <htk-bar-button
icon="close" icon="close"
tip="_Return" tip="_Return"
on-click="onReturnClick"/> on-click="onReturnClick"/>
<htk-bar-button
icon="check"
tip="_Accept"
on-click="onAcceptClick"/>
</div> </div>
<div id="form" class="address"> <div id="form" class="address">
<div class="box"> <div class="box">
<div class="form"> <div class="form">
<h2><t>AddEditAddress</t></h2>
<div class="form-group"> <div class="form-group">
<label><t>Name</t></label> <htk-entry
<htk-entry column="nickname" form="iter"/> placeholder="_Name"
column="nickname" form="iter"/>
</div> </div>
<div class="form-group"> <div class="form-group">
<label><t>Address</t></label> <htk-entry
<htk-entry column="street" form="iter"/> placeholder="_Address"
column="street" form="iter"/>
</div> </div>
<div class="form-group"> <div class="form-group">
<label><t>City</t></label> <htk-entry
<htk-entry column="city" form="iter"/> placeholder="_City"
column="city" form="iter"/>
</div> </div>
<div class="form-group"> <div class="form-group">
<label><t>ZipCode</t></label> <htk-entry
<htk-entry column="postalCode" form="iter"/> placeholder="_ZipCode"
column="postalCode" form="iter"/>
</div> </div>
<div class="form-group"> <div class="form-group">
<label><t>Country</t></label> <htk-combo
<htk-combo> placeholder="_Country">
<db-param <db-param
id="country" id="country"
property="param" property="param"
@ -70,8 +75,10 @@
</htk-combo> </htk-combo>
</div> </div>
<div class="form-group"> <div class="form-group">
<label><t>Province</t></label> <htk-combo
<htk-combo column="provinceFk" form="iter"> placeholder="_Province"
column="provinceFk"
form="iter">
<db-model property="model"> <db-model property="model">
SELECT id, name FROM vn.province SELECT id, name FROM vn.province
WHERE countryFk = #country WHERE countryFk = #country

3
forms/account/conf/locale/ca.yml
View File

@ -1,4 +1,5 @@
Configuration: Configuració Configuration: Configuració
Personal information: Dades personals
Username: Nom d'usuari Username: Nom d'usuari
Password: Contrasenya Password: Contrasenya
Email: Correu electrònic Email: Correu electrònic
@ -9,7 +10,7 @@ Receive invoices by email: Rebre factures per correu electrònic
Old password: Contrasenya antiga Old password: Contrasenya antiga
New password: Nova contrasenya New password: Nova contrasenya
Repeat password: Repetir contrasenya Repeat password: Repetir contrasenya
Info: Info Requirements: Requisits
Modify: Modificar Modify: Modificar
Password requirements: Requisits de contrasenya Password requirements: Requisits de contrasenya
characters long: caràcters de longitud characters long: caràcters de longitud

3
forms/account/conf/locale/en.yml
View File

@ -1,4 +1,5 @@
Configuration: Configuration Configuration: Configuration
Personal information: Personal information
Username: Username Username: Username
Password: Password Password: Password
Email: Email Email: Email
@ -9,7 +10,7 @@ Receive invoices by email: Receive invoices by email
Old password: Old password Old password: Old password
New password: New password New password: New password
Repeat password: Repeat password Repeat password: Repeat password
Info: Info Requirements: Requirements
Modify: Modify Modify: Modify
Password requirements: Password requirements Password requirements: Password requirements
characters long: characters long characters long: characters long

3
forms/account/conf/locale/es.yml
View File

@ -1,4 +1,5 @@
Configuration: Configuración Configuration: Configuración
Personal information: Datos personales
Username: Nombre de usuario Username: Nombre de usuario
Password: Contraseña Password: Contraseña
Email: Correo electrónico Email: Correo electrónico
@ -9,7 +10,7 @@ Receive invoices by email: Recibir facturas por correo electrónico
Old password: Contaseña antigua Old password: Contaseña antigua
New password: Nueva contraseña New password: Nueva contraseña
Repeat password: Repetir contraseña Repeat password: Repetir contraseña
Info: Info Requirements: Requisitos
Modify: Modificar Modify: Modificar
Password requirements: Requisitos de constraseña Password requirements: Requisitos de constraseña
characters long: carácteres de longitud characters long: carácteres de longitud

3
forms/account/conf/locale/fr.yml
View File

@ -1,4 +1,5 @@
Configuration: Configuration Configuration: Configuration
Personal information: Informations personnelles
Username: Utilisateur Username: Utilisateur
Password: Mot de passe Password: Mot de passe
Email: Courriel Email: Courriel
@ -9,7 +10,7 @@ Receive invoices by email: Recevoir des factures par e-mail
Old password: Ancien mot de passe Old password: Ancien mot de passe
New password: Nouveau mot de passe New password: Nouveau mot de passe
Repeat password: Répéter le mot de passe Repeat password: Répéter le mot de passe
Info: Info Requirements: Exigences
Modify: Modifier Modify: Modifier
Password requirements: Mot de passe exigences Password requirements: Mot de passe exigences
characters long: Longs caractères characters long: Longs caractères

3
forms/account/conf/locale/pt.yml
View File

@ -1,4 +1,5 @@
Configuration: Configuração Configuration: Configuração
Personal information: Dados pessoais
Username: Nome de usuario Username: Nome de usuario
Password: Palavra-Passe Password: Palavra-Passe
Email: E-Mail Email: E-Mail
@ -9,7 +10,7 @@ Receive invoices by email: Receber facturas por e-mail
Old password: Palavra-Passe antiga Old password: Palavra-Passe antiga
New password: Nova Palavra-Passe New password: Nova Palavra-Passe
Repeat password: Repetir Palavra-Passe Repeat password: Repetir Palavra-Passe
Info: Info Requirements: Requisitos
Modify: Modificar Modify: Modificar
Password requirements: Requisitos de Palavra-Passe Password requirements: Requisitos de Palavra-Passe
characters long: caracteres characters long: caracteres

14
forms/account/conf/style.css
View File

@ -6,23 +6,13 @@
.conf .box .conf .box
{ {
max-width: 30em; max-width: 30em;
padding: 2em; padding: 3em;
} }
.conf .form
{
margin: 0 auto;
max-width: 25em;
}
.conf .form-group input[type=password]
{
margin-bottom: 0.5em;
}
.pass-change .pass-change
{ {
max-width: 15em; max-width: 15em;
padding: 2.5em;
} }
.pass-info .pass-info
{ {
width: 15em; width: 15em;

74
forms/account/conf/ui.xml
View File

@ -29,47 +29,61 @@
tip="_Addresses" tip="_Addresses"
on-click="onAddressesClick"/> on-click="onAddressesClick"/>
<htk-bar-button <htk-bar-button
icon="preferences" icon="lock_reset"
tip="_Change password" tip="_Change password"
on-click="onPassChangeClick"/> on-click="onPassChangeClick"/>
</div> </div>
<div id="form" class="conf"> <div id="form" class="conf">
<div class="box"> <div class="box">
<div class="form"> <div class="form">
<div class="form-group"> <h2><t>Personal information</t></h2>
<label for="user-name"><t>Username</t></label> <div class="form-group">
<htk-text form="user-form" column="name"/> <htk-entry
</div> placeholder="_Username"
<div class="form-group"> disabled="true"
<label for="email"><t>Email</t></label> form="user-form"
<htk-entry form="user-form" column="email"></htk-entry> column="name"/>
</div>
<div class="form-group">
<label for="nickname"><t>Display name</t></label>
<htk-entry form="user-form" column="nickname"/>
</div>
<div class="form-group">
<label for="lang"><t>Language</t></label>
<htk-combo form="user-form" column="lang">
<db-model property="model">
<custom>
SELECT code, name FROM language WHERE isActive
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label for="mail"><t>Receive invoices by email</t></label>
<htk-check form="user-form" column="isToBeMailed"/>
</div>
</div> </div>
<div class="form-group">
<htk-entry
placeholder="_Email"
form="user-form"
column="email">
</htk-entry>
</div>
<div class="form-group">
<htk-entry
placeholder="_Display name"
form="user-form"
column="nickname"/>
</div>
<div class="form-group">
<htk-combo
placeholder="_Language"
form="user-form"
column="lang">
<db-model property="model">
<custom>
SELECT code, name FROM language WHERE isActive
</custom>
</db-model>
</htk-combo>
</div>
<div class="form-group">
<label>
<htk-check form="user-form" column="isToBeMailed"/>
<t>Receive invoices by email</t>
</label>
</div>
</div>
</div> </div>
</div> </div>
<htk-popup <htk-popup
id="change-password" id="change-password"
modal="true"> modal="true">
<div property="child-node" class="htk-dialog pass-change"> <div property="child-node" class="htk-dialog pass-change">
<div> <div class="form">
<h2><t>Change password</t></h2>
<input <input
id="old-password" id="old-password"
type="password" type="password"
@ -88,7 +102,7 @@
<t>Modify</t> <t>Modify</t>
</button> </button>
<button class="thin" on-click="onPassInfoClick"> <button class="thin" on-click="onPassInfoClick">
<t>Info</t> <t>Requirements</t>
</button> </button>
<div class="clear"/> <div class="clear"/>
</div> </div>

4
forms/admin/connections/style.css
View File

@ -10,11 +10,9 @@
.action-bar .connections-sum .action-bar .connections-sum
{ {
padding: .4em; padding: .4em;
margin-top: .9em;
margin-right: .5em;
background-color: #1e88e5; background-color: #1e88e5;
border-radius: 0.1em; border-radius: 0.1em;
box-shadow: 0 0 0.4em #666; box-shadow: 0 0 0.4em rgba(255, 255, 255, .1);
} }
/* List */ /* List */

12
forms/admin/connections/ui.xml
View File

@ -38,15 +38,15 @@
<htk-button <htk-button
form="iter" form="iter"
column="id" column="id"
tip="_Supplant user" tip="_Access log"
icon="incognito" icon="history"
on-click="onChangeUserClick"/> on-click="onAccessLogClick"/>
<htk-button <htk-button
form="iter" form="iter"
column="id" column="id"
tip="_Access log" tip="_Supplant user"
icon="gnome" icon="supervisor_account"
on-click="onAccessLogClick"/> on-click="onChangeUserClick"/>
<p class="important"> <p class="important">
<htk-text form="iter" column="nickname"/> <htk-text form="iter" column="nickname"/>
</p> </p>

4
forms/admin/users/ui.xml
View File

@ -34,14 +34,14 @@
form="iter" form="iter"
column="id" column="id"
tip="_Access log" tip="_Access log"
icon="gnome" icon="history"
on-click="onAccessLogClick"/> on-click="onAccessLogClick"/>
<htk-button <htk-button
id="impersonate" id="impersonate"
form="iter" form="iter"
column="id" column="id"
tip="_Impersonate user" tip="_Impersonate user"
icon="incognito" icon="supervisor_account"
on-click="onChangeUserClick"/> on-click="onChangeUserClick"/>
<span id="disabled" class="disabled"> <span id="disabled" class="disabled">
<t>Disabled</t> <t>Disabled</t>

2
forms/admin/visits/ui.xml
View File

@ -8,7 +8,7 @@
tip="_Refresh" tip="_Refresh"
on-click="onRefreshClick"/> on-click="onRefreshClick"/>
<htk-bar-button <htk-bar-button
icon="user-info" icon="visibility"
tip="_Connections" tip="_Connections"
on-click="onSessionsClick"/> on-click="onSessionsClick"/>
</div> </div>

12
forms/agencies/packages/packages.js
View File

@ -1,13 +1,11 @@
Hedera.Packages = new Class Hedera.Packages = new Class({
({
Extends: Hedera.Form Extends: Hedera.Form
,onShowClick: function (column, agencyId) ,onShowClick: function(column, agencyId) {
{ this.hash.set({
this.hash.set ({ form: 'agencies/provinces',
'form': 'agencies/provinces', agency: agencyId
'agency': agencyId
}); });
} }
}); });

2
forms/agencies/packages/ui.xml
View File

@ -12,7 +12,7 @@
</db-model> </db-model>
<htk-column-button <htk-column-button
column="agency_id" column="agency_id"
icon="show" icon="search"
tip="_ShowByProvince" tip="_ShowByProvince"
on-clicked="onShowClick"/> on-clicked="onShowClick"/>
<htk-column-text title="_Agency" column="Agencia"/> <htk-column-text title="_Agency" column="Agencia"/>

43
forms/cms/home/style.css
View File

@ -1,70 +1,53 @@
/* News panel */ /* News panel */
.column .column {
{
margin: .5em; margin: .5em;
max-width: 120em; max-width: 120em;
} }
.action-bar button.start-order .action-bar button.start-order {
{
margin: 1em;
padding: .5em 1em;
border: 1px solid white; border: 1px solid white;
} }
.action-bar button.start-order:hover .action-bar button.start-order:hover {
{
background-color: white; background-color: white;
color: black; color: black;
} }
/* New */ /* New */
.new .new {
{
text-align: left; text-align: left;
background-color: white;
color: #222;
border: none;
border-radius: 0.1em;
box-shadow: 0 0.2em 0.2em rgba(1, 1, 1, 0.2);
margin: .5em; margin: .5em;
} }
.new img .new img {
{
display: block; display: block;
margin: auto; margin: auto;
width: 100%; width: 100%;
} }
.new .top .new .top {
{
padding: 1.5em; padding: 1.5em;
padding-bottom: 1px; padding-bottom: 1px;
} }
.new h2 .new h2 {
{
font-size: 1.6em; font-size: 1.6em;
color: black; color: black;
font-weight: normal; font-weight: normal;
padding: 0; padding: 0;
} }
.new-info
{ .new-info {
font-size: 0.9em; font-size: 0.9em;
color: #444; color: #444;
text-align: right; text-align: right;
margin: 0.8em 0; margin: 0.8em 0;
} }
.new-text .new-text {
{
margin: 1.5em 0; margin: 1.5em 0;
} }
.new-text a .new-text a {
{
color: blue; color: blue;
text-decoration: underline; text-decoration: underline;
} }
.new-text li .new-text li {
{
margin: 0.4em 0; margin: 0.4em 0;
} }

4
forms/cms/home/ui.xml
View File

@ -5,7 +5,7 @@
<div id="actions" class="catalog-actions"> <div id="actions" class="catalog-actions">
<htk-bar-button <htk-bar-button
class="start-order" class="start-order"
icon="new-order" icon="add_shopping_cart"
tip="_Start order" tip="_Start order"
on-click="onStartOrderClick"/> on-click="onStartOrderClick"/>
</div> </div>
@ -21,7 +21,7 @@
</db-model> </db-model>
<custom> <custom>
<div class="masonry-box"> <div class="masonry-box">
<div class="new"> <div class="new box">
<htk-image <htk-image
directory="news" directory="news"
subdir="full" subdir="full"

14
forms/ecomerce/basket/ui.xml
View File

@ -4,17 +4,17 @@
</div> </div>
<div id="actions"> <div id="actions">
<htk-bar-button <htk-bar-button
icon="ok" icon="settings"
tip="_Checkout" tip="_ConfigureOrder"
on-click="onCheckoutClick"/> on-click="onConfigureClick"/>
<htk-bar-button <htk-bar-button
icon="view-dual" icon="local_florist"
tip="_Catalog" tip="_Catalog"
on-click="onCatalogClick"/> on-click="onCatalogClick"/>
<htk-bar-button <htk-bar-button
icon="preferences" icon="shopping_cart_checkout"
tip="_ConfigureOrder" tip="_Checkout"
on-click="onConfigureClick"/> on-click="onCheckoutClick"/>
</div> </div>
<div id="form" class="basket"> <div id="form" class="basket">
<div class="box"> <div class="box">

4
forms/ecomerce/catalog/catalog.js
View File

@ -105,7 +105,7 @@ Hedera.Catalog = new Class({
}); });
var img = builder.$('image'); var img = builder.$('image');
img.src = 'image/family/light/'+ form.get('code') +'.svg'; img.src = 'image/family/black/'+ form.get('code') +'.svg';
img.title = form.get('name'); img.title = form.get('name');
img.alt = img.title; img.alt = img.title;
} }
@ -419,7 +419,7 @@ Vn.Filter = new Class({
li.appendChild(button); li.appendChild(button);
var icon = new Htk.Icon({ var icon = new Htk.Icon({
icon: 'close', name: 'close',
alt: _('Close') alt: _('Close')
}); });
button.appendChild(icon.node); button.appendChild(icon.node);

4
forms/ecomerce/catalog/locale/ca.yml
View File

@ -2,7 +2,7 @@ Catalog: Catàleg
SearchResults: Resultats de cerca SearchResults: Resultats de cerca
SelectFamily: Selecciona una família SelectFamily: Selecciona una família
Choose filter from right menu: Tria un filtre en el menú de la dreta Choose filter from right menu: Tria un filtre en el menú de la dreta
Choose a realm: Tria un regne Choose a realm: Tria un categoria
ArticleNotFound: Artcle no trobat ArticleNotFound: Artcle no trobat
ArticleNotAvailable: Article no disponible ArticleNotAvailable: Article no disponible
List view: Vista de lista List view: Vista de lista
@ -15,7 +15,7 @@ Warehouse: Magatzem
Filter by: Filtrar per Filter by: Filtrar per
Order by: Ordenar per Order by: Ordenar per
Search: Cercar Search: Cercar
Change: Cambiar Modify: Modificar
Size: Mida Size: Mida
Realm: Regne Realm: Regne
Family: Família Family: Família

4
forms/ecomerce/catalog/locale/en.yml
View File

@ -2,7 +2,7 @@ Catalog: Catalog
SearchResults: Search results SearchResults: Search results
SelectFamily: Select family SelectFamily: Select family
Choose filter from right menu: Choose a filter from the right menu Choose filter from right menu: Choose a filter from the right menu
Choose a realm: Choose a realm Choose a realm: Choose a category
ArticleNotFound: Item not found ArticleNotFound: Item not found
ArticleNotAvailable: Item not available ArticleNotAvailable: Item not available
List view: List view List view: List view
@ -15,7 +15,7 @@ Warehouse: Warehouse
Filter by: Filter by Filter by: Filter by
Order by: Order by Order by: Order by
Search: Search Search: Search
Change: Change Modify: Modify
Size: Size Size: Size
Realm: Realm Realm: Realm
Family: Family Family: Family

4
forms/ecomerce/catalog/locale/es.yml
View File

@ -2,7 +2,7 @@ Catalog: Catálogo
SearchResults: Resultados de búsqueda SearchResults: Resultados de búsqueda
SelectFamily: Selecciona una familia SelectFamily: Selecciona una familia
Choose filter from right menu: Elige un filtro en el menú de la derecha Choose filter from right menu: Elige un filtro en el menú de la derecha
Choose a realm: Elige un reino Choose a realm: Elige una categoría
ArticleNotFound: Artículo no encontrado ArticleNotFound: Artículo no encontrado
ArticleNotAvailable: Artículo no disponible ArticleNotAvailable: Artículo no disponible
List view: Vista de lista List view: Vista de lista
@ -15,7 +15,7 @@ Warehouse: Almacén
Filter by: Filtrar por Filter by: Filtrar por
Order by: Ordenar por Order by: Ordenar por
Search: Buscar Search: Buscar
Change: Cambiar Modify: Modificar
Size: Medida Size: Medida
Realm: Reino Realm: Reino
Family: Familia Family: Familia

4
forms/ecomerce/catalog/locale/fr.yml
View File

@ -2,7 +2,7 @@ Catalog: Catalogue
SearchResults: Résultats de la recherche SearchResults: Résultats de la recherche
SelectFamily: Choisissez une famille SelectFamily: Choisissez une famille
Choose filter from right menu: Choisissez un filtre dans le menu de droite Choose filter from right menu: Choisissez un filtre dans le menu de droite
Choose a realm: Choisissez un royaume Choose a realm: Choisissez une catégorie
ArticleNotFound: Article non trouvé ArticleNotFound: Article non trouvé
ArticleNotAvailable: Article non disponible ArticleNotAvailable: Article non disponible
List view: Liste voir List view: Liste voir
@ -15,7 +15,7 @@ Warehouse: Entrepôt
Filter by: Filtrer par Filter by: Filtrer par
Order by: Trier par Order by: Trier par
Search: Recherche Search: Recherche
Change: Modifier Modify: Modifier
Size: Mesure Size: Mesure
Realm: Famille Realm: Famille
Family: Sous-genre Family: Sous-genre

4
forms/ecomerce/catalog/locale/pt.yml
View File

@ -2,7 +2,7 @@ Catalog: Catálogo
SearchResults: Resultados de busca SearchResults: Resultados de busca
SelectFamily: Seleccione uma família SelectFamily: Seleccione uma família
Choose filter from right menu: Escolha um filtro no menú da direita Choose filter from right menu: Escolha um filtro no menú da direita
Choose a realm: Escolha um reino Choose a realm: Escolha uma categoria
ArticleNotFound: Ítem não encontrado ArticleNotFound: Ítem não encontrado
ArticleNotAvailable: Ítem não disponível ArticleNotAvailable: Ítem não disponível
List view: Ver como lista List view: Ver como lista
@ -15,7 +15,7 @@ Warehouse: Armazém
Filter by: Filtrar por Filter by: Filtrar por
Order by: Ordenar por Order by: Ordenar por
Search: Buscar Search: Buscar
Change: Modificar Modify: Modificar
Size: Medida Size: Medida
Realm: Reino Realm: Reino
Family: Família Family: Família

32
forms/ecomerce/catalog/style.css
View File

@ -1,13 +1,12 @@
.catalog .catalog
{ {
margin-right: 17em; margin-right: 18em;
} }
/* Topbar */ /* Topbar */
.catalog-actions > .htk-search-entry .catalog-actions > .htk-search-entry
{ {
margin-top: .8em;
margin-right: .4em; margin-right: .4em;
} }
@ -19,7 +18,7 @@
top: 4.4em; top: 4.4em;
bottom: 0; bottom: 0;
right: 0; right: 0;
width: 17em; width: 18em;
overflow: auto; overflow: auto;
background-color: #fafafa; background-color: #fafafa;
} }
@ -34,11 +33,16 @@
} }
.right-panel .basket-info > button .right-panel .basket-info > button
{ {
color: #E0F2F1; color: white;
margin: 0 auto; margin: 0 auto;
display: block; display: block;
margin-top: .4em; margin-top: .4em;
} }
.right-panel .basket-info > button:hover
{
background-color: white;
color: #60872c;
}
.right-panel .basket-info > p .right-panel .basket-info > p
{ {
margin: 0; margin: 0;
@ -50,7 +54,13 @@
} }
.right-panel .filter .right-panel .filter
{ {
padding: 1em; margin: 1em;
}
.right-panel .categories,
.right-panel .filters,
.right-panel .order
{
margin: 1.5em 0;
} }
.right-panel .filters, .right-panel .filters,
.right-panel .order .right-panel .order
@ -71,7 +81,6 @@
.right-panel h2 .right-panel h2
{ {
font-weight: normal; font-weight: normal;
padding: .4em 0;
color: #777; color: #777;
font-size: 1.1em; font-size: 1.1em;
} }
@ -82,7 +91,7 @@
.right-panel .realms a .right-panel .realms a
{ {
display: inline-block; display: inline-block;
width: 30%; width: 25%;
padding: .6em; padding: .6em;
box-sizing: border-box; box-sizing: border-box;
} }
@ -102,7 +111,6 @@
{ {
margin: 0 auto; margin: 0 auto;
margin-bottom: .7em; margin-bottom: .7em;
width: 90%;
display: block; display: block;
} }
.vn-filter > ul .vn-filter > ul
@ -444,7 +452,7 @@
.item-card .footer .item-card .footer
{ {
text-align: center; text-align: center;
background-color: #009688; background-color: #1a1a1a;
color: white; color: white;
line-height: 2em; line-height: 2em;
padding: .4em; padding: .4em;
@ -489,15 +497,15 @@
.right-panel .right-panel
{ {
top: 0; top: 0;
right: -17em; right: -18em;
z-index: 20; z-index: 20;
transition: transform 200ms ease-out; transition: transform 200ms ease-out;
-webkit-transition: transform 200ms ease-out; -webkit-transition: transform 200ms ease-out;
} }
.right-panel.show .right-panel.show
{ {
transform: translateZ(0) translateX(-17em); transform: translateZ(0) translateX(-18em);
-webkit-transform: translateZ(0) translateX(-17em); -webkit-transform: translateZ(0) translateX(-18em);
} }
.catalog .catalog
{ {

25
forms/ecomerce/catalog/ui.xml
View File

@ -94,19 +94,20 @@
<h1 id="title-text"><t>Catalog</t></h1> <h1 id="title-text"><t>Catalog</t></h1>
</div> </div>
<div id="actions" class="catalog-actions"> <div id="actions" class="catalog-actions">
<button class="menu" on-click="onShowMenuClick"> <htk-search-entry
<img src="image/icon/dark/menu.svg" alt="_Menu"/> param="search"/>
</button>
<htk-bar-button
icon="basket"
tip="_ShoppingBasket"
on-click="onBasketClick"/>
<htk-bar-button <htk-bar-button
id="view-button" id="view-button"
tip="_Switch view" tip="_Switch view"
icon="format_list_bulleted"
on-click="onSwitchViewClick"/> on-click="onSwitchViewClick"/>
<htk-search-entry <htk-bar-button
param="search"/> icon="shopping_cart_checkout"
tip="_ShoppingBasket"
on-click="onBasketClick"/>
<button class="menu" on-click="onShowMenuClick">
<img src="image/icon/dark/menu.svg" alt="_Menu"/>
</button>
</div> </div>
<div id="form" class="catalog"> <div id="form" class="catalog">
<div id="main" class="main"> <div id="main" class="main">
@ -176,7 +177,7 @@
<htk-text form="basket" column="agency"/> <htk-text form="basket" column="agency"/>
</p> </p>
<button class="thin" on-click="onConfigureClick"> <button class="thin" on-click="onConfigureClick">
<t>Change</t> <t>Modify</t>
</button> </button>
</div> </div>
<div class="filter"> <div class="filter">
@ -462,14 +463,14 @@
<div class="footer"> <div class="footer">
<button on-click="onEraseClick" title="_Erase" class="erase"> <button on-click="onEraseClick" title="_Erase" class="erase">
<htk-icon <htk-icon
icon="delete" name="delete"
theme="dark" theme="dark"
alt="_Erase"/> alt="_Erase"/>
</button> </button>
<htk-text id="amount"/> <htk-text id="amount"/>
<button on-click="onConfirmClick" title="_Confirm" class="confirm"> <button on-click="onConfirmClick" title="_Confirm" class="confirm">
<htk-icon <htk-icon
icon="ok" name="done"
theme="dark" theme="dark"
alt="_Confirm"/> alt="_Confirm"/>
</button> </button>

50
forms/ecomerce/checkout/style.css
View File

@ -1,15 +1,12 @@
.checkout .checkout {
{
padding: 1em; padding: 1em;
max-width: 40em; max-width: 40em;
margin: 0 auto; margin: 0 auto;
} }
.checkout .bar .checkout .bar {
{
margin-bottom: 1em; margin-bottom: 1em;
} }
.checkout .form .checkout .form {
{
max-width: 40em; max-width: 40em;
padding: 4em 2em; padding: 4em 2em;
} }
@ -18,67 +15,54 @@
.answers button, .answers button,
.answers p, .answers p,
.radio > div .radio > div {
{
font-size: 1.4em; font-size: 1.4em;
} }
.answers .htk-select .answers .htk-select {
{
max-width: 10em; max-width: 10em;
display: block; display: block;
margin: 0 auto; margin: 0 auto;
font-size: 1.6em; font-size: 1.6em;
height: 1.8em; height: 1.8em;
} }
.answers p .answers p {
{
margin: 0.3em 0; margin: 0.3em 0;
} }
.target .target {
{
max-width: 28em; max-width: 28em;
margin: 0 auto; margin: 0 auto;
} }
.address .address {
{
border-radius: 0.1em; border-radius: 0.1em;
padding: 0.6em 1.4em; padding: 0.6em 1.4em;
} }
.address.selected .address.selected {
{
background-color: rgba(1, 1, 1, .1); background-color: rgba(1, 1, 1, .1);
} }
.address:hover .address:hover {
{
cursor: pointer; cursor: pointer;
background-color: rgba(1, 1, 1, .05); background-color: rgba(1, 1, 1, .05);
} }
.address p.consignee .address p.consignee {
{
font-weight: bold; font-weight: bold;
} }
.radio .radio {
{
max-width: 20em; max-width: 20em;
margin: 0 auto; margin: 0 auto;
} }
.radio > div .radio > div {
{
padding: 0.5em; padding: 0.5em;
} }
.thin-calendar .thin-calendar {
{
width: inherit; width: inherit;
max-width: 24em; max-width: 24em;
margin: 0 auto; margin: 0 auto;
box-shadow: 0 0.1em 0.3em #ccc; box-shadow: .05em .05em .2em rgba(0, 0, 0, .2);
} }
.thin-calendar tr > th .thin-calendar tr > th {
{
color: white; color: white;
} }
.htk-assistant .thin .htk-assistant .thin {
{
float: right; float: right;
} }

1
forms/ecomerce/orders/style.css
View File

@ -11,7 +11,6 @@
.balance .balance
{ {
margin-top: 1.2em;
margin-right: .5em; margin-right: .5em;
} }
.balance > * .balance > *

20
forms/ecomerce/orders/ui.xml
View File

@ -3,17 +3,6 @@
<h1><t>LastOrders</t></h1> <h1><t>LastOrders</t></h1>
</div> </div>
<div id="actions"> <div id="actions">
<htk-bar-button
icon="basket"
tip="_ShoppingBasket"
show-text="false"
on-click="onBasketClick"/>
<htk-bar-button
id="pay-button"
icon="pay"
tip="_MakePayment"
show-text="false"
on-click="onPayButtonClick"/>
<div class="balance"> <div class="balance">
<span class="label"> <span class="label">
<t>Balance:</t> <t>Balance:</t>
@ -38,6 +27,15 @@
class="info" class="info"
alt="Info"/> alt="Info"/>
</div> </div>
<htk-bar-button
id="pay-button"
icon="payments"
tip="_MakePayment"
on-click="onPayButtonClick"/>
<htk-bar-button
icon="shopping_cart"
tip="_ShoppingBasket"
on-click="onBasketClick"/>
</div> </div>
<div id="form" class="orders"> <div id="form" class="orders">
<div class="box confirmed"> <div class="box confirmed">

8
forms/news/new/ui.xml
View File

@ -25,14 +25,14 @@
<h1><t>AddEditNew</t></h1> <h1><t>AddEditNew</t></h1>
</div> </div>
<div id="actions"> <div id="actions">
<htk-bar-button
icon="ok"
tip="_Accept"
on-click="onAcceptClick"/>
<htk-bar-button <htk-bar-button
icon="close" icon="close"
tip="_Return" tip="_Return"
on-click="onReturnClick"/> on-click="onReturnClick"/>
<htk-bar-button
icon="check"
tip="_Accept"
on-click="onAcceptClick"/>
</div> </div>
<div id="form" class="new"> <div id="form" class="new">
<div class="box"> <div class="box">

49
image/family/black/accessory.svg Normal file
View File

@ -0,0 +1,49 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 24.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg
version="1.1"
id="Capa_1"
x="0px"
y="0px"
viewBox="0 0 40 40"
xml:space="preserve"
sodipodi:docname="accessory.svg"
width="40"
height="40"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><defs
id="defs9" /><sodipodi:namedview
id="namedview7"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="3.595"
inkscape:cx="100"
inkscape:cy="99.860918"
inkscape:window-width="1920"
inkscape:window-height="1011"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="Capa_1" />
<style
type="text/css"
id="style2">
.st0{fill:#1E1E1C;}
.st1{fill:none;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
.st2{fill:#FFFFFF;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
</style>
<path
class="st0"
d="M 37.313228,1.0829325 H 2.714188 C 1.233722,1.0829325 0,2.2892385 0,3.7971205 v 5.099383 c 0,1.4804655 1.206306,2.7141875 2.714188,2.7141875 h 2.083619 v 0.08225 L 7.978067,33.8451 c 0.411241,2.933516 2.63194,5.071968 5.236464,5.071968 h 13.543522 c 2.63194,0 4.825223,-2.138452 5.236464,-5.071968 l 3.207676,-22.234407 h 2.083619 C 38.766278,11.610693 40,10.404387 40,8.8965055 v -5.126801 c 0,-1.480466 -1.206306,-2.686772 -2.686772,-2.686772 z m -4.386566,10.6374225 -3.152844,21.79575 c -0.274161,1.809459 -1.535298,3.125429 -3.015765,3.125429 H 13.241947 c -1.480467,0 -2.76902,-1.31597 -3.015765,-3.125429 L 7.073338,11.583275 h 25.908156 z m 4.825223,-2.8238515 c 0,0.246744 -0.191912,0.466073 -0.466073,0.466073 H 2.714188 c -0.246745,0 -0.466073,-0.191913 -0.466073,-0.466073 v -5.126799 c 0,-0.246745 0.191912,-0.466073 0.466073,-0.466073 h 34.59904 c 0.246745,0 0.466073,0.191912 0.466073,0.466073 v 5.126799 z"
id="path4"
style="stroke-width:0.27416;fill:#1a1a1a;fill-opacity:1" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB

59
image/family/black/artificial.svg Normal file
View File

@ -0,0 +1,59 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 24.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg
version="1.1"
id="Capa_1"
x="0px"
y="0px"
viewBox="0 0 40 40"
xml:space="preserve"
sodipodi:docname="artificial.svg"
width="40"
height="40"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><defs
id="defs13" /><sodipodi:namedview
id="namedview11"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="3.595"
inkscape:cx="100"
inkscape:cy="99.860918"
inkscape:window-width="1920"
inkscape:window-height="1011"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="Capa_1" />
<style
type="text/css"
id="style2">
.st0{fill:#1E1E1C;}
.st1{fill:none;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
.st2{fill:#FFFFFF;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
</style>
<g
id="g8"
transform="matrix(0.26820887,0,0,0.26820887,-6.5074179,-6.820887)"
style="fill:#1a1a1a;fill-opacity:1">
<path
class="st0"
d="m 113.7,83.3 c -4.1,0 -8.2,0 -12.4,0 -5.2,0 -10.4,0 -15.6,0 h -2 c -1.5,0 -1.8,0.2 -1.8,1.8 v 30.2 c 0,0.6 0,0.9 0.3,1.2 0.3,0.3 0.6,0.3 1.3,0.3 h 30.2 c 1.5,0 1.7,-0.3 1.7,-1.7 0,-10 0,-20.1 0,-30.1 0.1,-1.5 -0.2,-1.7 -1.7,-1.7 z m -6.4,17.5 v 7.6 h -0.6 c -1.3,0 -2.6,0 -3.9,0 h -1.7 -4.5 c -1.9,0 -3.9,0 -5.8,0 H 90.4 L 90.3,108 v 0 c 0,-5.5 0,-10.8 0,-16.2 v -0.4 h 0.5 c 6.4,0 11.4,0 16,0 h 0.3 l 0.2,0.3 c 0,0 0,0.1 0,0.2 0,3.1 0,6 0,8.9 z"
id="path4"
style="fill:#1a1a1a;fill-opacity:1" />
<path
class="st0"
d="m 145.9,158.2 25.8,-44.7 c 0.3,-0.5 0.6,-1 0.9,-1.6 l 0.8,-1.4 L 155.2,100 173.4,89.5 173,88.7 c -0.1,-0.3 -0.3,-0.5 -0.4,-0.8 L 146.3,42.1 c -0.4,-0.8 -0.8,-1.1 -1.1,-1.2 -0.3,-0.1 -0.8,0.1 -1.5,0.5 l -4.6,2.6 c -3.8,2.2 -7.5,4.3 -11.3,6.5 L 127.1,51 V 31.7 c 0,-0.7 0,-1.1 -0.3,-1.4 C 126.5,30 126.2,30 125.4,30 H 72.5 c -0.1,0 -0.3,0 -0.5,0 -0.5,0 -0.8,0.1 -1.1,0.3 -0.2,0.2 -0.3,0.6 -0.3,1 0,0.2 0,0.4 0,0.6 v 0.4 3.6 c 0,4.8 0,9.6 0,14.4 V 51 L 52.9,40.8 52.4,40.7 52.1,41.1 c -0.1,0.1 -0.2,0.2 -0.3,0.3 L 25.1,87.5 c -1,1.7 -0.9,2 0.8,3 L 42.3,100 32,105.8 c -2.3,1.3 -4.5,2.6 -6.8,3.9 -0.4,0.2 -0.8,0.5 -0.9,1 -0.1,0.3 0,0.7 0.3,1.1 0.1,0.2 0.2,0.3 0.3,0.5 l 25.9,45 c 0.3,0.6 0.7,1.2 1.2,1.8 l 0.3,0.3 18.1,-10.4 v 2.5 c 0,1.6 0,3.1 0,4.6 l -0.1,12.1 c 0,1.5 0.2,1.7 1.6,1.7 h 2.5 c 1.6,0 3.1,0.1 4.7,0.1 h 45.1 c 2.4,0 2.6,-0.2 2.6,-2.7 v -17.4 -0.8 l 0.6,0.3 c 2.8,1.6 5.6,3.2 8.3,4.8 l 1.9,1.1 c 2.1,1.2 4.2,2.4 6.3,3.6 0.2,0.1 0.7,0.4 1.1,0.2 0.4,0 0.6,-0.2 0.9,-0.9 z m -3.8,-10 -0.3,-0.2 -22.7,-13.1 -0.2,0.5 c -0.3,0.6 -0.3,1.1 -0.2,1.6 v 0.3 c 0,6.4 0,12.8 0,19.3 v 4.1 c 0,0.2 0,0.4 0,0.7 v 0.4 h -40 v -0.7 c 0,-1.8 0,-3.6 0,-5.3 l 0.1,-20.9 -0.7,0.3 c -1.9,0.8 -3.5,1.8 -5.2,2.8 -0.9,0.5 -1.8,1 -2.6,1.5 -1.6,0.9 -3.2,1.8 -5,2.9 l -10,5.8 -19.9,-34.6 14.6,-8.4 9,-5.2 -6.5,-3.7 -17.2,-10 0.3,-0.6 19.2,-33.1 c 0.1,-0.2 0.2,-0.3 0.3,-0.5 l 0.2,-0.3 0.5,0.2 c 1.3,0.8 2.7,1.6 4,2.4 l 17.4,10.1 c 0.3,0.2 0.7,0.4 1.2,0.1 l 0.3,-0.2 c 0.2,-0.3 0.2,-0.7 0.2,-1.2 0,-0.9 0,-1.7 0,-2.5 0,-0.8 0,-1.5 0,-2.3 L 79,38.2 h 0.6 c 2.1,0 4.2,0 6.2,0.1 h 0.3 c 2.3,0.1 4.2,0.1 5.9,0.1 5.8,0 11.4,0 18.1,0 h 7.9 0.1 c 0.1,0 0.2,0 0.3,0 h 0.3 v 27.1 l 23.6,-13.5 19.9,34.6 -23.5,13.5 23.5,13.6 -0.2,0.3 z"
id="path6"
style="fill:#1a1a1a;fill-opacity:1" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.7 KiB

76
image/family/black/flower.svg Normal file
View File

@ -0,0 +1,76 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 24.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg
version="1.1"
id="Capa_1"
x="0px"
y="0px"
viewBox="0 0 40 40"
xml:space="preserve"
sodipodi:docname="flower.svg"
width="40"
height="40"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><defs
id="defs13"><linearGradient
inkscape:collect="always"
id="linearGradient981"><stop
style="stop-color:#000000;stop-opacity:1;"
offset="0"
id="stop977" /><stop
style="stop-color:#000000;stop-opacity:0;"
offset="1"
id="stop979" /></linearGradient><linearGradient
inkscape:collect="always"
xlink:href="#linearGradient981"
id="linearGradient983"
x1="34.739397"
y1="99.599534"
x2="165.73375"
y2="99.599534"
gradientUnits="userSpaceOnUse" /></defs><sodipodi:namedview
id="namedview11"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="4.365"
inkscape:cx="102.29095"
inkscape:cy="63.459336"
inkscape:window-width="1920"
inkscape:window-height="1011"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="Capa_1" />
<style
type="text/css"
id="style2">
.st0{fill:#1E1E1C;}
.st1{fill:none;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
.st2{fill:#FFFFFF;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
</style>
<g
id="g8"
transform="matrix(0.28530481,0,0,0.28530481,-8.5979763,-8.4162261)"
style="stroke:none;stroke-opacity:1;fill:#1a1a1a;fill-opacity:1">
<path
class="st0"
d="m 100.1,76.9 h -0.5 c -6.1,0 -11.8,2.3 -16.1,6.5 -4.4,4.3 -6.8,10.1 -6.8,16.3 0,6.2 2.4,12 6.7,16.2 4.2,4.2 10,6.5 15.9,6.5 h 0.3 0.3 c 5.9,0 11.6,-2.4 15.9,-6.5 4.3,-4.2 6.7,-10 6.7,-16.2 0,-12.5 -9.9,-22.5 -22.4,-22.8 z M 89.2,89.1 c 2.7,-2.7 6.4,-4.2 10,-4.2 h 0.4 c 3.8,-0.1 7.6,1.4 10.5,4.2 2.9,2.8 4.5,6.6 4.5,10.8 0,8.2 -6.8,14.9 -15,14.9 h -0.1 c -8,0 -14.8,-6.8 -14.8,-14.9 -0.1,-4.1 1.5,-8 4.5,-10.8 z"
id="path4"
style="stroke:none;stroke-opacity:1;fill:#1a1a1a;fill-opacity:1" />
<path
class="st0"
d="m 157.2,102 -0.2,-0.2 0.2,-0.2 c 0.1,-0.1 0.2,-0.2 0.3,-0.3 6.1,-6.5 8.9,-14.4 8.1,-23.2 -0.7,-7.9 -4.1,-14.5 -10,-19.7 -5.1,-4.4 -10.9,-6.8 -17.3,-7.3 v 0 h -0.4 c -1.7,-0.1 -3.4,0 -5.2,0.1 -0.8,0.1 -1.5,0.1 -2.2,0.2 h -0.1 c -0.1,-0.1 -0.2,-0.4 -0.4,-1 -1.7,-5.4 -4.7,-10 -8.9,-13.6 -6.8,-5.8 -14.8,-8.2 -23.6,-7 -6.5,0.8 -12.3,3.7 -17.1,8.5 -3,3 -5.3,6.6 -6.8,10.7 L 73.4,49.5 73,49.3 C 68.6,48.2 64.2,48.2 59.9,49 53.3,50.4 47.8,53.5 43.6,58.4 37.1,66.1 34.8,75 36.9,85 c 1,4.6 3,8.7 6.1,12.4 L 43.3,97.8 43,98 c -2.7,2.8 -4.8,6 -6.2,9.6 v 0 c 0,0.1 -4.5,9.7 -0.2,21.5 0,0.1 0,0.1 0.1,0.2 0,0.1 0.1,0.2 0.1,0.4 0.4,1 0.8,2 1.3,2.9 0.4,0.9 0.8,1.5 1.1,2 3.3,5.4 8.2,9.4 14.4,11.8 5,2 10.4,2.5 16,1.6 l 0.3,-0.1 0.2,0.5 c 0.9,3.2 2.3,6.1 4.1,8.6 4.4,6.2 10.2,10.2 17.4,12 0.8,0.2 3.6,0.7 7.3,0.7 2.3,0 4.9,-0.2 7.6,-0.9 l 0.3,-0.1 c 0.3,-0.1 0.5,-0.1 0.7,-0.2 0.1,0 0.2,-0.1 0.4,-0.1 l 0.2,-0.1 c 4.2,-1.4 8.1,-3.7 11.5,-7 3.1,-3 5.5,-6.6 7,-10.7 0.1,-0.2 0.1,-0.3 0.2,-0.5 l 0.1,-0.2 h 0.2 c 0.1,0 0.3,0.1 0.5,0.1 3,0.7 5.8,0.9 8.6,0.8 4.3,-0.2 8.4,-1.3 12.1,-3.3 6,-3.2 10.5,-7.8 13.3,-13.9 2.9,-6.4 3.5,-13.1 1.8,-20.1 -1.3,-4.1 -3.3,-8.1 -6.2,-11.5 z M 149,98.3 c -0.8,0.6 -1.6,1.2 -2.3,1.7 l -1.7,1.2 0.4,0.5 c 0.7,0.9 1.6,1.6 2.3,2.2 0.4,0.3 0.8,0.6 1.1,1 4.6,4.2 7,9.2 7.4,15.3 0.3,5.9 -1.5,11.1 -5.3,15.4 -4.8,5.4 -10.8,7.9 -18,7.5 -2.6,-0.2 -5.2,-0.9 -8.1,-2.2 -0.6,-0.2 -1.1,-0.5 -1.7,-0.7 l -1.9,-0.8 -1.1,5.3 c -1.9,9.3 -9.8,16.4 -19.4,17.3 -0.7,0.1 -1.4,0.1 -2.1,0.1 -5,0 -9.9,-1.8 -13.9,-5.1 -3.9,-3.3 -6.6,-7.9 -7.5,-12.9 -0.2,-1.2 -0.4,-2.5 -0.5,-3.7 l -0.1,-0.9 c 0,-0.4 -0.1,-1 -0.5,-1.5 l -0.3,-0.3 -1.8,0.6 c -0.9,0.3 -1.8,0.6 -2.7,0.9 -8.9,3.1 -19,-0.1 -24.6,-7.8 -2.6,-3.6 -4,-7.6 -4.1,-11.8 -0.3,-7.8 2.9,-14.2 9.4,-19 L 55.4,98 55,97.7 c -0.7,-0.7 -1.5,-1.4 -2.2,-2 -0.9,-0.7 -1.7,-1.5 -2.5,-2.3 -4,-4.2 -6.1,-9.1 -6.2,-14.8 -0.1,-5.4 1.6,-10.2 5,-14.3 3.5,-4.2 8,-6.8 13.4,-7.7 4.2,-0.7 8.4,-0.1 12.6,1.8 0.8,0.4 1.6,0.7 2.6,1.1 0.6,0.2 0.9,0.4 1.3,0.2 0.4,-0.2 0.5,-0.6 0.6,-1.2 0.1,-0.6 0.2,-1.2 0.3,-1.8 v -0.1 c 0.2,-1.2 0.4,-2.3 0.8,-3.4 2.8,-8.5 8.6,-13.7 17.2,-15.3 7.4,-1.4 13.9,0.7 19.5,6.3 3.5,3.5 5.6,8 6.1,13.2 0.1,0.8 0.2,1.6 0.3,2.4 l 0.2,2 0.6,-0.1 c 1,-0.2 1.9,-0.5 2.7,-0.8 l 0.1,-0.1 c 0.3,-0.1 0.5,-0.2 0.8,-0.3 8,-2.8 15.3,-1.5 21.8,3.8 4.6,3.8 7.2,8.8 7.7,14.8 0.6,7.7 -2.4,14.2 -8.7,19.2 z"
id="path6"
style="stroke:none;stroke-opacity:1;fill:#1a1a1a;fill-opacity:1" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.9 KiB

49
image/family/black/fruit.svg Normal file
View File

@ -0,0 +1,49 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 24.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg
version="1.1"
id="Capa_1"
x="0px"
y="0px"
viewBox="0 0 40 40"
xml:space="preserve"
sodipodi:docname="fruit.svg"
width="40"
height="40"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><defs
id="defs9" /><sodipodi:namedview
id="namedview7"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="3.595"
inkscape:cx="100"
inkscape:cy="99.860918"
inkscape:window-width="1920"
inkscape:window-height="1011"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="Capa_1" />
<style
type="text/css"
id="style2">
.st0{fill:#1E1E1C;}
.st1{fill:none;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
.st2{fill:#FFFFFF;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
</style>
<path
class="st0"
d="m 4.6155643,32.24963 c 1.033877,0 2.041908,0.232623 2.998243,0.67202 0.18093,0.07754 0.387705,0.180928 0.568633,0.284316 l 0.103387,0.05169 c 1.9902137,0.982183 4.2388957,1.473275 6.4875777,1.473275 1.68005,0 3.3601,-0.284317 4.936762,-0.852949 h 0.02585 l 0.05169,0.02585 c 1.60251,0.568632 3.282559,0.852948 4.988456,0.852948 0.05169,0 0.103387,0 0.155081,0 h 0.103388 c 0.02585,0 0.02585,0 0.05169,0 0.02585,0 0.05169,0 0.07754,0 h 0.02585 c 3.980425,-0.103388 7.676536,-1.75759 10.468003,-4.600753 2.791467,-2.843161 4.316438,-6.616811 4.342284,-10.597237 0,-0.284317 -0.103387,-0.542786 -0.310162,-0.749561 -0.206776,-0.206776 -0.465245,-0.310163 -0.723717,-0.310163 h -9.434126 l -0.02585,-0.103388 c -0.28431,-2.50715 -1.188952,-4.910914 -2.662226,-6.952821 -0.232622,-0.336009 -0.516938,-0.697866 -0.852948,-1.059723 l -0.05169,-0.05169 0.05169,-0.07754 c 1.550815,-1.8351313 1.628356,-3.1274773 1.628356,-3.3859473 0,-0.542785 -0.413551,-0.982183 -0.982183,-1.008029 0,0 0,0 0,0 -0.516938,0 -1.00803,0.439397 -1.059723,0.956336 0,0 -0.07754,0.74956 -1.03388,1.938519 l -0.02585,0.02585 -0.07754,0.02585 -0.05169,-0.02585 C 21.493607,6.2993277 17.797496,5.0586757 13.997999,5.2654507 10.04342,5.4722267 6.4248503,7.2298167 3.7884643,10.176366 c -4.03211997,4.497365 -4.936762,10.933249 -2.274529,16.361101 l 0.05169,0.103388 c 0.103387,0.180931 0.206775,0.361857 0.310163,0.594479 0.568632,1.240652 0.775407,2.610541 0.594479,3.954581 -0.05169,0.310163 0.05169,0.646172 0.284316,0.878795 0.232622,0.232622 0.568632,0.33601 0.878795,0.284316 0.310163,-0.07754 0.646173,-0.103388 0.982183,-0.103388 z m 33.2391427,-11.682808 0.07754,0.07754 v 0.05169 c -0.232622,2.636385 -1.240652,5.117691 -2.920704,7.185445 l -0.02585,0.02585 h -0.103388 l -0.05169,-0.02585 -5.221077,-5.22108 c -0.387704,-0.387704 -1.033876,-0.439397 -1.42158,-0.103387 -0.232622,0.180928 -0.361859,0.465244 -0.361859,0.74956 0,0.284316 0.10339,0.568635 0.310162,0.77541 l 5.324467,5.324465 v 0.05169 0.05169 l -0.02585,0.02585 c -2.016059,1.757593 -4.497363,2.843163 -7.133751,3.127479 h -0.05169 l -0.07754,-0.05169 v -0.05169 -8.271015 c 0,-0.568632 -0.413551,-1.033877 -0.930489,-1.08557 -0.284316,-0.02585 -0.568632,0.07754 -0.775408,0.258469 -0.206775,0.206775 -0.33601,0.465244 -0.33601,0.74956 v 8.426097 l -0.07754,0.07754 h -0.05169 c -1.266499,-0.07754 -2.481304,-0.33601 -3.670265,-0.749561 -0.129232,-0.07754 -0.232622,-0.10339 -0.336009,-0.129237 -1.240652,-0.491089 -2.377916,-1.163111 -3.411793,-1.990212 l -0.02585,-0.02585 v -0.103382 l 0.02585,-0.05169 5.557089,-5.557086 c 0.387704,-0.387704 0.439398,-1.033879 0.103385,-1.421583 -0.180926,-0.232622 -0.465242,-0.361857 -0.749558,-0.361857 -0.284316,-0.02585 -0.568635,0.103388 -0.77541,0.310163 l -5.660475,5.660477 h -0.05169 -0.05169 l -0.02585,-0.02585 c -1.860989,-2.119449 -2.972406,-4.729988 -3.230875,-7.547301 v -0.05169 l 0.05169,-0.07754 h 0.05169 26.053699 z m -34.5056417,5.014302 -0.02585,-0.02585 C 1.0745333,20.90283 1.8499413,15.397433 5.3134283,11.546242 7.5879573,9.0132437 10.689589,7.5141217 14.101382,7.3331937 c 3.385947,-0.180928 6.668506,0.956336 9.201504,3.2308653 0.129234,0.103388 0.232622,0.206776 0.361857,0.33601 l 0.180931,0.180929 c 0.155079,0.155081 0.310163,0.310163 0.465242,0.491091 l 0.02585,0.02585 c 0.310163,0.33601 0.594479,0.723714 0.878795,1.085571 1.214805,1.68005 1.990212,3.670263 2.248681,5.738017 v 0.05169 l -0.05169,0.07754 h -0.05169 -16.774653 c -0.284316,0 -0.542785,0.103388 -0.7237137,0.310163 -0.206775,0.206776 -0.310163,0.465245 -0.310163,0.749562 0,5.221077 2.6363857,10.002759 7.0562097,12.845919 l 0.05169,0.02585 -0.02585,0.155081 -0.07754,0.02585 c -0.620326,0.07754 -1.214806,0.129231 -1.835132,0.129231 -1.912672,0 -3.77365,-0.413548 -5.5053937,-1.266498 h -0.02585 c -0.232619,-0.15508 -0.516934,-0.284314 -0.749557,-0.387702 -1.188958,-0.568632 -2.455457,-0.852948 -3.747804,-0.852948 h -0.103388 v -0.103388 c 0,-1.292348 -0.310163,-2.558847 -0.827101,-3.721958 -0.129235,-0.361857 -0.258469,-0.620326 -0.413551,-0.878795 z"
id="path4"
style="stroke-width:0.258469;fill:#1a1a1a;fill-opacity:1" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 5.3 KiB

49
image/family/black/greenery.svg Normal file
View File

@ -0,0 +1,49 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 24.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg
version="1.1"
id="Capa_1"
x="0px"
y="0px"
viewBox="0 0 40 40"
xml:space="preserve"
sodipodi:docname="greenery.svg"
width="40"
height="40"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><defs
id="defs9" /><sodipodi:namedview
id="namedview7"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="3.595"
inkscape:cx="100"
inkscape:cy="99.860918"
inkscape:window-width="1920"
inkscape:window-height="1011"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="Capa_1" />
<style
type="text/css"
id="style2">
.st0{fill:#1E1E1C;}
.st1{fill:none;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
.st2{fill:#FFFFFF;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
</style>
<path
class="st0"
d="M 34.045254,21.098493 C 33.702189,16.753004 30.814725,12.321749 25.46863,7.9190818 21.15173,4.3740778 16.405999,1.8582678 14.54773,0.94342876 l -0.02859,-0.05718 h -0.02859 l -0.02859,-0.02859 c -0.428827,-0.228707 -0.714715,-0.343062 -0.800481,-0.400239 L 12.575107,-2.4007925e-7 12.031921,1.0577838 C 5.4279214,14.065662 4.1700164,23.642891 8.2867954,29.503584 c 3.6307706,5.174562 10.2919476,5.946458 13.9227186,5.946458 0.571774,0 1.114961,-0.02859 1.600969,-0.05718 h 0.05718 l 0.02859,0.05718 c 0.886252,1.572381 1.743914,2.944641 2.601576,4.088191 0.200121,0.257299 0.486009,0.428831 0.829074,0.45742 0.343065,0.02859 0.68613,-0.08577 0.943428,-0.285888 l 0.02859,-0.02859 c 0.486009,-0.428832 0.543186,-1.14355 0.142944,-1.658148 -0.743308,-1.000606 -1.543792,-2.201333 -2.315689,-3.602181 l -0.05718,-0.08577 0.08577,-0.05718 c 5.631983,-4.031013 8.262147,-8.462268 7.890494,-13.179411 z M 22.466812,32.99141 c -0.05718,0 -0.114355,0 -0.200121,0 -7.433073,0 -10.69219,-3.058995 -11.950095,-4.888675 -3.1733496,-4.54561 -2.3156876,-12.493281 2.51581,-22.9567612 l 0.114355,-0.285888 0.08577,0.285888 c 1.686736,6.4610562 5.145974,18.6684502 9.520052,27.6739042 l 0.08577,0.142944 z m 2.601576,-0.943428 -0.114355,0.08577 -0.05718,-0.114355 C 20.608544,23.271238 17.092128,10.949489 15.376804,4.4026668 l -0.05718,-0.22871 0.22871,0.114355 c 2.630165,1.458026 6.461056,3.802303 9.720173,6.7469432 3.945247,3.516416 6.060814,6.975654 6.318113,10.291948 0.285887,3.659359 -1.915446,7.29013 -6.518234,10.720779 z"
id="path4"
style="stroke-width:0.285887;fill:#1a1a1a;fill-opacity:1" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.9 KiB

59
image/family/black/handmade.svg Normal file
View File

@ -0,0 +1,59 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 24.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg
version="1.1"
id="Capa_1"
x="0px"
y="0px"
viewBox="0 0 40 40"
xml:space="preserve"
sodipodi:docname="handmade.svg"
width="40"
height="40"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><defs
id="defs13" /><sodipodi:namedview
id="namedview11"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="3.595"
inkscape:cx="100"
inkscape:cy="99.860918"
inkscape:window-width="1920"
inkscape:window-height="1011"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="Capa_1" />
<style
type="text/css"
id="style2">
.st0{fill:#1E1E1C;}
.st1{fill:none;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
.st2{fill:#FFFFFF;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
</style>
<g
id="g8"
transform="matrix(0.28579156,0,0,0.28579156,-8.7130268,-8.5559862)"
style="fill:#1a1a1a;fill-opacity:1">
<path
class="st0"
d="m 165,128.6 c 1.6,-6.6 2,-12.7 1.5,-18.7 -0.6,-5.6 -2,-10.4 -4.5,-14.8 -4.2,-7.5 -10.6,-12.8 -19,-15.5 -1,-0.3 -2,-0.6 -3.1,-0.8 l -1.8,-0.4 1.9,-0.3 c 1.4,-0.2 2.8,-0.5 4.1,-0.7 l 0.7,-0.1 c 4.4,-0.8 8.9,-1.6 13.3,-2.9 3.3,-1 6.2,-2.7 8.8,-4.5 l 0.8,-0.6 -0.7,-0.7 c -0.6,-0.6 -1.3,-1.3 -1.9,-1.9 -2,-2 -4,-4 -6.2,-5.8 -7.8,-6.3 -15,-9.6 -22.9,-10.6 -5.7,-0.7 -11.2,-0.1 -16.2,1.9 -1.6,0.6 -3.1,1.4 -4.2,2 l -0.3,0.2 -0.2,-0.3 c -1.2,-2.2 -2.8,-4.2 -4.9,-6 -4.1,-3.4 -9,-5 -14.7,-4.6 H 95.1 L 95,43.1 C 94,40.3 92.4,37.8 90.1,35.6 83.4,29.1 73.3,28.1 65.4,33.1 62.1,35.2 59.6,38 58,41.6 L 57.8,42.1 57.3,42 c -1.9,-0.3 -3.8,-0.3 -5.9,0 -4.9,0.6 -9.5,3.2 -12.8,7.2 -3.5,4.3 -5,9.7 -4.3,15.3 0.4,3.4 1.6,6.4 3.5,9.1 0,0.1 0.1,0.1 0.1,0.1 l 0.1,0.2 -0.2,0.3 c -3.4,4.2 -4.9,8.9 -4.5,14.2 0.5,6.8 3.7,12.2 9.6,15.9 3.5,2.3 7.7,3.2 12.3,2.8 l 0.3,-0.1 0.1,0.3 c 1.2,3.4 3.2,6.2 5.8,8.4 3.4,2.9 7.2,4.4 11.3,4.7 0.3,0 0.4,0.1 0.7,0.5 l 6.5,8.8 c 2.5,3.3 5,6.8 7.5,10.2 0.5,0.7 0.5,1.1 0.3,1.6 -0.4,0.9 -0.6,1.9 -0.9,2.7 v 0.1 c -0.1,0.4 -0.2,0.8 -0.3,1.2 l -2,6.5 c -1.3,4.1 -2.5,8.2 -3.8,12.2 -0.5,1.6 -0.3,3 0.4,4.1 0.8,1.1 2.1,1.6 3.8,1.6 H 109 c 1,0 2,0 3,0 2.7,0 5.4,0 8.1,0 1.2,0 2.2,-0.3 3,-1 1.7,-1.5 1.5,-3.4 1,-4.9 l -1.8,-5.9 c -1.7,-5.6 -3.4,-11.3 -5.1,-17.1 -0.1,-0.5 -0.1,-0.8 0.2,-1.3 4.3,-6.8 8.5,-13.7 12.7,-20.4 l 5.2,-8.3 c 0.2,-0.3 0.4,-0.7 0.7,-1 l 0.3,-0.4 7.9,9.1 c 3.1,3.6 6.4,7.4 10,10.7 2.5,2.3 5.5,3.8 8.4,5.2 l 0.9,0.4 0.7,-2.9 c 0.2,-1.2 0.5,-2.3 0.8,-3.5 z M 113.9,75 c 2.4,-3.5 3.6,-7.4 3.5,-11.7 0,-0.5 0.1,-0.7 0.6,-1 5.2,-3.3 10.5,-4.6 16.5,-4 5.4,0.6 10.5,2.7 16,6.5 0.7,0.5 1.5,1 2.3,1.7 l 0.6,0.5 -0.7,0.2 c -1.5,0.4 -3,0.7 -4.3,0.9 -3.1,0.6 -6.1,1.1 -9.1,1.6 -4,0.7 -8.1,1.4 -12.2,2.3 -3.5,0.7 -8.1,1.8 -12.7,3.5 l -1.1,0.4 z m -39.6,37.4 c -2.9,0 -5.7,-1.1 -7.9,-3.3 -2.2,-2.1 -3.5,-4.8 -3.8,-8.2 -0.1,-0.7 -0.1,-1.3 -0.2,-2 L 62.2,97 H 61.3 C 60.1,97.1 59,97.6 58,98 l -0.4,0.2 c -3,1.2 -6.4,1.1 -9.3,-0.3 -3,-1.4 -5.4,-4.1 -6.4,-7.3 -1.5,-4.7 0.2,-10 4.2,-13 l 4,-3 -0.5,-0.7 C 49,73 48.2,72.4 47.4,71.8 l -0.1,-0.1 c -0.2,-0.2 -0.5,-0.4 -0.7,-0.5 -3,-2.5 -4.5,-5.7 -4.4,-9.3 0.1,-5.3 3,-9.4 8,-11.2 2.8,-1 5.6,-0.9 8.5,0.3 l 4.7,2 0.3,-0.9 c 0.4,-1.1 0.6,-2.2 0.7,-3.3 l 0.2,-1 c 0.8,-4.4 4.5,-9.3 10.9,-9.6 4.2,-0.2 7.7,1.4 10.3,5 1.4,1.9 2.1,4.2 2.3,7.1 0.1,0.9 0.1,1.8 0.4,2.7 L 88.7,53.8 91,53 c 0.8,-0.3 1.6,-0.6 2.4,-0.8 5.5,-2 11.6,0.4 14.3,5.5 2.2,4.1 2,8.3 -0.6,12.5 -1,1.6 -2.5,2.8 -4.2,3.9 l -0.5,0.4 c -1,0.7 -1.4,1.1 -1.4,1.7 0,0.6 0.4,1.1 1.3,1.8 1.6,1.4 3.2,2.8 4.3,4.7 1.9,3.1 2.1,7.1 0.6,10.7 -1.5,3.6 -4.4,6.1 -8.3,7 -2.3,0.6 -4.7,0.3 -7.1,-0.7 -0.7,-0.3 -1.4,-0.6 -2.1,-0.9 L 87.2,97.7 87,98.4 c -0.4,1 -0.5,1.9 -0.7,2.8 l -0.1,0.7 c -0.7,4 -2.7,7 -6.1,8.9 -1.9,1 -3.9,1.6 -5.8,1.6 z m 46,7.2 c -3.9,6.3 -7.4,11.9 -11,17.7 -0.8,1.3 -0.9,2.6 -0.4,4.3 l 4.5,15.1 c 0.5,1.5 0.9,3 1.3,4.5 l 0.1,0.5 h -0.5 c -2.1,0 -4.2,0 -6.3,0 h -2.7 c -4.7,0 -9.7,0 -14.8,0.2 H 90 l 0.1,-0.5 c 0.2,-0.7 0.4,-1.4 0.6,-2.1 0.1,-0.4 0.3,-0.9 0.4,-1.3 1.8,-6 3.4,-11 4.9,-15.7 0.7,-2.1 0.3,-4 -1,-5.8 -3.2,-4.3 -6.5,-8.7 -9.4,-12.7 l -3.5,-4.7 0.4,-0.2 c 3.4,-1.6 6,-3.8 8.1,-6.7 0.7,-1 1.3,-2.1 1.8,-3.1 l 0.2,-0.5 0.5,0.1 c 3,0.5 5.9,0.3 8.6,-0.5 6.9,-2.1 11.5,-6.6 13.7,-13.5 l 0.1,-0.5 0.5,0.1 c 3.1,0.5 5.7,2.3 8.3,4.2 1.4,1 2.6,2.2 3.9,3.3 0.5,0.5 1.1,1 1.7,1.4 l 0.3,0.2 z m 38.1,-3.2 c -0.1,1.6 -0.2,3.1 -0.4,4.6 l -0.1,0.8 -1.3,-1.4 c -2.8,-3 -5.5,-6.2 -8.1,-9.2 -2,-2.3 -4.2,-4.9 -6.4,-7.3 -3.5,-3.8 -7.3,-7.9 -11.7,-11.4 -2.4,-1.9 -4.7,-3.4 -7,-4.5 l -0.9,-0.4 0.9,-0.3 c 0.8,-0.2 1.6,-0.4 2.5,-0.6 6.4,-1.1 12.4,-0.4 17.7,2.2 7.1,3.5 11.7,9.3 13.7,17.5 1,3.2 1.3,6.5 1.1,10 z"
id="path4"
style="fill:#1a1a1a;fill-opacity:1" />
<path
class="st0"
d="m 75.4,59.4 h -0.2 -0.1 c -8.7,0.1 -15.5,7.1 -15.5,15.9 0,4.3 1.6,8.3 4.6,11.3 2.9,2.9 6.9,4.6 11.2,4.6 8.8,0 15.8,-7 15.8,-15.8 0,-4.3 -1.6,-8.3 -4.6,-11.2 -3,-3.1 -7,-4.8 -11.2,-4.8 z m -0.1,23.5 c -2,0 -3.9,-0.8 -5.3,-2.3 -1.4,-1.5 -2.2,-3.4 -2.2,-5.4 0.1,-4.3 3.3,-7.6 7.6,-7.6 2,0 3.8,0.8 5.2,2.2 1.5,1.5 2.3,3.5 2.3,5.5 0,4.2 -3.4,7.6 -7.6,7.6 z"
id="path6"
style="fill:#1a1a1a;fill-opacity:1" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 5.5 KiB

59
image/family/black/handmadeArtificial.svg Normal file
View File

@ -0,0 +1,59 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 24.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg
version="1.1"
id="Capa_1"
x="0px"
y="0px"
viewBox="0 0 40 40"
xml:space="preserve"
sodipodi:docname="handmadeArtificial.svg"
width="40"
height="40"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><defs
id="defs13" /><sodipodi:namedview
id="namedview11"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="3.595"
inkscape:cx="100"
inkscape:cy="99.860918"
inkscape:window-width="1920"
inkscape:window-height="1011"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="Capa_1" />
<style
type="text/css"
id="style2">
.st0{fill:#1E1E1C;}
.st1{fill:none;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
.st2{fill:#FFFFFF;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
</style>
<g
id="g8"
transform="matrix(0.2875629,0,0,0.2875629,-8.75629,-8.7994244)"
style="fill:#1a1a1a;fill-opacity:1">
<path
class="st0"
d="m 92.8,87.4 c 0,-0.2 0,-0.3 0,-0.4 V 65.7 c 0,-0.5 -0.1,-0.8 -0.3,-0.9 -0.2,-0.2 -0.5,-0.3 -1,-0.3 -0.1,0 -0.3,0 -0.4,0 h -20 -0.3 c -0.2,0 -0.4,0 -0.5,0 -0.4,0 -0.7,0.2 -0.8,0.2 -0.2,0.2 -0.3,0.5 -0.3,0.8 0,0.2 0,0.3 0,0.5 V 88 H 92.7 Z M 85.3,72.3 c 0,0.9 0,1.8 0,2.7 v 2.3 c 0,0.9 0,1.8 0,2.8 v 0.4 h -0.4 c -2.6,0 -5.2,0 -7.9,0 h -0.4 v -0.4 c 0,-2.6 0,-5.2 0,-7.9 V 71.8 H 77 c 2.6,0 5.1,0 7.9,0 h 0.2 z"
id="path4"
style="fill:#1a1a1a;fill-opacity:1" />
<path
class="st0"
d="m 167.4,121.4 c -0.1,-0.4 -0.2,-0.7 -0.4,-1.1 L 153.1,81.9 C 152.2,79.8 150.9,80 150.9,80 l -16.9,4 1.2,-0.9 9.6,-6.7 v 0 l 19.6,-13.8 -39.3,-9.8 v 0 c -0.6,-0.1 -1.2,-0.3 -1.7,-0.4 -1,-0.2 -1.4,0.2 -1.8,0.9 -0.1,0.1 -0.1,0.3 -0.2,0.4 v 0 l -0.4,0.7 -9,-15.8 c -0.4,-0.8 -0.7,-1.1 -1.1,-1.2 -0.4,-0.1 -0.8,0.1 -1.5,0.5 l -2.7,1.5 c -2,1.2 -4,2.3 -6,3.5 l -0.6,0.3 -0.1,-0.6 v -2.3 c 0,-1.4 0,-2.7 0,-4.1 0,-0.5 0,-1 0,-1.5 0,-1.2 0,-2.4 -0.1,-3.5 V 30.6 H 64.1 C 62.4,30.7 62,32 62,32.7 V 33 c 0,3.2 0,6.4 0,9.6 v 0.6 L 61.4,42.9 C 60.7,42.5 60,42.1 59.3,41.7 l -1.6,-0.9 c -1.8,-1 -3.7,-2.1 -5.5,-3.2 -0.3,-0.2 -0.7,-0.4 -1.1,-0.2 -0.4,0.1 -0.6,0.6 -0.7,0.8 0,0.1 -0.1,0.2 -0.2,0.4 l -18.3,31.3 0.4,0.2 c 1.7,1.1 3.5,2.1 5.3,3.1 0.2,0.1 0.4,0.2 0.5,0.3 v 0 l 5,2.5 -2.8,1.6 c 0,0 -0.1,0 -0.1,0.1 l -8.3,4.8 0.2,0.4 c 1.9,3.7 17.8,31.4 18.8,32.4 l 0.2,0.3 6.2,-3.5 4.7,-3 -0.2,6.8 v 0 c 0,1.6 0,3.1 0,4.6 0,0.3 0,0.8 0.3,1.2 0.3,0.3 0.8,0.3 1,0.3 0.5,0 1.1,0 1.7,0.1 h 0.1 c 0.6,0.1 1.2,0.1 1.7,0.1 0.7,0 1.4,0 2.1,0 0.9,0 1.8,0 2.7,0 0.1,0 0.1,0 0.2,0 0.7,0 1.2,0.3 1.8,0.9 4,5.1 8.4,10.6 13.4,16.7 0.5,0.6 0.6,1.1 0.4,1.8 -1.9,5.9 -3.9,11.7 -5.8,17.6 l -2.8,7.9 c -0.2,0.6 -0.1,1.2 0.2,1.8 0.4,0.5 0.9,0.8 1.6,0.8 h 44.2 l -0.2,-1 c -0.1,-0.2 -0.1,-0.4 -0.1,-0.6 l -1.8,-6.1 c -1.9,-6.6 -3.9,-13.4 -5.9,-20.3 -0.3,-1 -0.2,-1.7 0.4,-2.7 4.4,-7 8.8,-14.1 13.2,-21.1 l 3.8,-6.1 c 0.1,-0.1 0.2,-0.3 0.2,-0.4 l 0.3,0.1 0.1,-0.4 c 0.2,0 0.4,0.1 0.8,0.3 l 30.3,11.3 c 0.3,0.1 0.6,0.2 1,0.3 l 1.4,0.5 z M 129.3,70.5 c 0.5,-0.3 0.6,-0.8 0.4,-1.3 l -0.9,-1.5 c -0.7,-1.3 -1.5,-2.5 -2.2,-3.8 l -2.6,-4 16.5,4 v 0 l 0.7,0.2 5.8,1.9 -2.6,1.7 -4.6,3 c -4.6,3 -9.2,5.9 -13.8,8.9 -0.2,0.2 -0.4,0.2 -0.6,0.2 -0.2,0 -0.3,-0.1 -0.5,-0.2 -1.5,-0.9 -3,-1.8 -4.5,-2.7 l -1.1,-0.6 z m -59,43.9 h -0.9 v -0.5 -17.6 l -0.7,0.3 c -1.7,0.8 -3.3,1.8 -4.9,2.7 l -0.1,0.1 c -0.9,0.5 -1.8,1.1 -2.7,1.6 -1.8,1 -3.7,2.1 -5.3,3.1 l -2,1.2 -0.6,-1.1 c -0.6,-1 -1.2,-2 -1.8,-3 -3,-5.1 -5.9,-10.3 -8.8,-15.4 L 42.2,85.3 42.7,85 56,77.3 c 0.2,-0.1 0.4,-0.3 0.7,-0.4 L 57.8,76.2 43.7,68 C 42.9,67.5 42.6,66.5 43.1,65.7 L 53,48.6 c 0.5,-0.8 1.5,-1.1 2.3,-0.6 L 68,55.3 c 0.3,0.2 0.6,0.2 0.9,0 0.3,-0.2 0.5,-0.5 0.5,-0.8 v -0.8 c 0,-1.2 0.1,-2.2 0.1,-3.3 0,-2.4 0,-4.8 0,-7.2 V 38 H 70 c 7.3,0 14.7,0 22,0 h 0.5 v 16.5 c 0,0.3 0.2,0.7 0.5,0.8 0.3,0.1 0.7,0.2 1,0 L 106.8,48 c 0.8,-0.5 1.9,-0.2 2.3,0.6 l 6.8,11.9 c 1.2,2 2.3,4 3.5,6.1 l 0.3,0.6 -14.3,8.2 c -0.3,0.2 -0.4,0.5 -0.4,0.8 0,0.3 0.2,0.6 0.5,0.8 l 12.8,7.4 c 0.8,0.5 1.1,1.5 0.6,2.3 l -9.9,17.1 c -0.2,0.4 -0.6,0.7 -1,0.8 -0.4,0.1 -0.9,0.1 -1.3,-0.2 L 93.2,96.6 92.9,97 c -0.4,0.4 -0.4,0.9 -0.3,1.4 v 8.4 3.7 c 0,1.3 0,2.4 -0.2,3.6 l -0.1,0.3 h -0.5 c -0.1,0 -0.2,0 -0.3,0 -7,0 -14.1,0.1 -21.2,0 z m 55.8,-4.5 -9.5,15.2 c -2.7,4.2 -5.3,8.5 -8,12.7 -0.5,0.8 -0.6,1.5 -0.3,2.5 1.5,5.3 3.1,10.5 4.6,15.8 l 1.7,5.9 h -0.5 c 0,0 -0.1,0 -0.1,0 h -0.1 l -20.2,-0.1 c -0.7,0 -1.4,0 -2.1,0 h -3.1 l 1.3,-4.1 c 1.8,-5.7 3.8,-11.6 5.7,-17.3 0.4,-1.1 0.2,-1.8 -0.5,-2.7 -3.4,-4.2 -6.7,-8.4 -10.7,-13.3 l -1.9,-2.4 h 16.2 c 0.7,0 1,0 1.2,-0.3 0.3,-0.3 0.3,-0.6 0.3,-1.4 v -11 l 0.6,0.4 c 0.2,0.1 0.3,0.2 0.5,0.3 1.6,0.9 3.1,1.8 4.7,2.7 l 3.9,2.3 c 1.1,0.6 1.4,0.5 2,-0.5 l 5.5,-9.4 c 0.1,-0.1 0.1,-0.2 0.2,-0.3 l 0.2,-0.2 0.6,0.2 c 2.4,0.9 4.7,1.8 7.1,2.6 0.5,0.2 0.9,0.6 1,1 0.1,0.4 -0.1,0.9 -0.3,1.4 z m 21.6,-2.2 -26.3,-9.8 0.3,-0.6 c 0.5,-0.9 1,-1.8 1.5,-2.7 0.1,-0.2 0.3,-0.2 0.7,-0.3 l 16.3,-3.9 c 2,-0.5 3.9,-0.9 5.9,-1.4 l 1,-0.1 1,1 V 90 c 1.5,4.1 2.9,8.1 4.4,12.2 l 3.6,8.7 z"
id="path6"
style="fill:#1a1a1a;fill-opacity:1" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 5.4 KiB

49
image/family/black/mortuary.svg Normal file
View File

@ -0,0 +1,49 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 24.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg
version="1.1"
id="Capa_1"
x="0px"
y="0px"
viewBox="0 0 40 40"
xml:space="preserve"
sodipodi:docname="mortuary.svg"
width="40"
height="40"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><defs
id="defs9" /><sodipodi:namedview
id="namedview7"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="3.595"
inkscape:cx="100"
inkscape:cy="99.860918"
inkscape:window-width="1920"
inkscape:window-height="1011"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="Capa_1" />
<style
type="text/css"
id="style2">
.st0{fill:#1E1E1C;}
.st1{fill:none;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
.st2{fill:#FFFFFF;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
</style>
<path
class="st0"
d="m 35.428571,16.4 c 0,-8.085714 -6.228572,-14.714286 -14.142857,-15.371429 V 0.314286 C 21.285715,0.142857 21.142858,0 20.971429,0 H 19.314286 C 19.142858,0 19,0.142857 19,0.314286 V 1 C 10.942858,1.514286 4.5714285,8.228571 4.5714285,16.4 c 0,5.6 3,10.514286 7.4857145,13.228571 L 9.3714285,37.4 c -0.171429,0.542857 0.08571,1.114286 0.628571,1.285714 l 0.2285725,0.08571 c 0.542856,0.171428 1.114286,-0.08571 1.285714,-0.628572 l 2.6,-7.485714 c 1.428572,0.6 2.999999,0.971428 4.628571,1.114286 v 7.2 C 18.742858,39.542857 19.2,40 19.771429,40 h 0.257143 C 20.6,40 21.057143,39.542857 21.057143,38.971429 V 31.8 c 1.657143,-0.114286 3.257143,-0.485714 4.714286,-1.085714 l 2.599999,7.514285 c 0.17143,0.542858 0.771429,0.8 1.285714,0.628572 l 0.228572,-0.08571 C 30.428571,38.6 30.685715,38 30.514286,37.485714 L 27.828572,29.714286 C 32.371428,27.028571 35.428571,22.057143 35.428571,16.4 Z m -2.285714,0 c 0,0.4 -0.02857,0.8 -0.05714,1.2 -1.6,-0.142857 -3.114285,-0.542857 -4.6,-1.085714 0,0 0,-0.02857 0,-0.02857 C 28.485715,11.8 24.685715,8 20,8 c -0.942857,0 -1.885715,0.142857 -2.771429,0.457143 -1.342857,-1.428572 -2.399999,-2.771429 -3.142856,-3.8 1.771428,-0.885714 3.771428,-1.4 5.914285,-1.4 7.257143,0 13.142857,5.885714 13.142857,13.142857 z M 19.085715,10.342857 c 0.285713,-0.05714 0.6,-0.05714 0.914285,-0.05714 3.085715,0 5.628571,2.257143 6.114285,5.2 -2.657142,-1.4 -5.057142,-3.257143 -7.02857,-5.142857 z M 12.114286,5.885714 C 13.228572,7.4 15.057143,9.685714 17.457143,12 c 4.857143,4.628571 10.085715,7.342857 15.199999,7.885714 -0.314285,1.142857 -0.771428,2.2 -1.371427,3.2 -11.2,-0.2 -19.742857,-11.971428 -21.6285725,-14.8 C 10.371429,7.371429 11.2,6.571429 12.114286,5.885714 Z m 1.914285,11.2 c 2.371428,2.285715 4.828572,4.114286 7.314286,5.485715 -0.428572,0.08571 -0.885714,0.142857 -1.342857,0.142857 -3.314285,0 -6,-2.6 -6.200001,-5.857143 0.08572,0.08571 0.142858,0.142857 0.228572,0.228571 z m 5.057144,12.428572 C 12.4,29.057143 7.0571425,23.485714 6.8571425,16.8 c -0.05714,-2.314286 0.457143,-4.485714 1.457143,-6.4 0.742857,1.057143 1.8857145,2.6 3.4000005,4.285714 -0.142857,0.6 -0.2,1.228572 -0.2,1.828572 C 11.514286,21.2 15.314285,25 20,25 c 1.485714,0 2.914285,-0.371429 4.171428,-1.085714 1.828571,0.714285 3.685715,1.2 5.514286,1.371428 -2.571429,2.828572 -6.4,4.514286 -10.599999,4.228572 z"
id="path4"
style="stroke-width:0.285714;fill:#1a1a1a;fill-opacity:1" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.7 KiB

79
image/family/black/pets.svg Normal file
View File

@ -0,0 +1,79 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="40mm"
height="40mm"
viewBox="0 0 40 40"
version="1.1"
id="svg1600"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
sodipodi:docname="pets.svg"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:dc="http://purl.org/dc/elements/1.1/">
<defs
id="defs1594" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="3.0684205"
inkscape:cx="49.699837"
inkscape:cy="46.277881"
inkscape:document-units="mm"
inkscape:current-layer="layer1"
inkscape:document-rotation="0"
showgrid="false"
inkscape:window-width="1920"
inkscape:window-height="1011"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:pagecheckerboard="0" />
<metadata
id="metadata1597">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<g
id="g885"
style="fill:#1a1a1a;fill-opacity:1">
<path
id="path8"
style="fill:#1a1a1a;stroke-width:0.061654;fill-opacity:1"
d="m 19.703707,14.502266 v 0.0062 c -3.970522,0.06782 -7.694429,1.566152 -10.5120202,4.211112 -2.8854103,2.706613 -4.4694945,6.301341 -4.4694945,10.117727 v 0.301792 h 0.00568 c 0.1294733,4.451422 3.6995645,8.002625 9.5875287,9.519317 1.886615,0.487066 3.964124,0.746207 6.017203,0.746207 h 0.0925 c 2.108569,-0.01233 4.204824,-0.283607 6.060615,-0.801502 5.622848,-1.559849 8.829214,-5.074293 8.792223,-9.649024 -0.03699,-3.890372 -1.646645,-7.52801 -4.538221,-10.25312 -2.873078,-2.706614 -6.689241,-4.19871 -10.739912,-4.19871 z m 0.191202,2.306319 h 0.0987 c 3.471124,0 6.726416,1.270111 9.167917,3.569807 2.435336,2.293533 3.791643,5.345174 3.816302,8.600509 0.02466,3.452627 -2.564741,6.159413 -7.114809,7.423319 -1.670828,0.462407 -3.551369,0.709001 -5.450314,0.715203 h -0.0739 c -1.868119,0 -3.748181,-0.234566 -5.455998,-0.672311 C 9.9258243,35.168873 7.0587142,32.450255 7.0093913,28.929807 v -0.08061 c 0,-3.175187 1.3317326,-6.177643 3.7424067,-8.446514 2.42917,-2.281201 5.653491,-3.557105 9.143111,-3.594095 z" />
<path
id="path26"
style="fill:#1a1a1a;stroke-width:0.061654;fill-opacity:1"
d="M 26.238191,0.59665452 C 25.201227,0.56851579 24.157001,1.0061208 23.235274,1.8627271 22.224144,2.8060343 21.46583,4.1686855 21.102071,5.7100374 20.738312,7.251389 20.799933,8.8113797 21.27467,10.09995 c 0.536391,1.455036 1.529238,2.422794 2.799312,2.724899 0.265113,0.06165 0.536424,0.0925 0.807703,0.0925 1.004962,1e-6 2.015954,-0.437841 2.916101,-1.264005 1.011129,-0.943308 1.769443,-2.3059584 2.133203,-3.8473105 C 30.294749,6.2646819 30.233125,4.7052079 29.758391,3.4166373 29.215834,1.9616013 28.223466,0.99332729 26.953392,0.69122239 26.71641,0.63457769 26.477491,0.60314808 26.238191,0.59665452 Z m -0.0863,2.29546728 c 0.09248,-3e-7 0.18495,0.01251 0.2651,0.031006 0.499396,0.1171429 0.912079,0.573587 1.177189,1.2826089 0.320601,0.875488 0.357614,1.9664889 0.0925,3.070097 -0.258947,1.103608 -0.782698,2.0593724 -1.460893,2.6944092 -0.554886,0.5117281 -1.134612,0.7336421 -1.634009,0.6164991 -0.493233,-0.117142 -0.906394,-0.57307 -1.171504,-1.2820916 -0.3206,-0.875488 -0.357614,-1.9670056 -0.0925,-3.0706136 0.258947,-1.1036078 0.783213,-2.0593725 1.461409,-2.6944092 0.456238,-0.425413 0.931128,-0.6475055 1.362708,-0.6475058 z" />
<path
id="path32"
style="fill:#1a1a1a;stroke-width:0.061654;fill-opacity:1"
d="m 36.206575,6.0790071 c -0.733356,0.010554 -1.501195,0.2351881 -2.257226,0.6686931 -1.196092,0.6905254 -2.23805,1.8499745 -2.940905,3.2680178 -0.709025,1.42421 -0.998387,2.95298 -0.819589,4.3217 0.197294,1.535186 0.949338,2.700355 2.1146,3.279903 0.493231,0.240451 1.02331,0.363802 1.578197,0.363802 0.746014,0 1.535129,-0.221683 2.305802,-0.665593 1.196091,-0.690526 2.238049,-1.849974 2.940907,-3.268017 0.70902,-1.424209 0.998902,-2.952979 0.820105,-4.3217002 C 39.751174,8.190627 38.999128,7.0254581 37.833866,6.4459098 37.32676,6.1923575 36.776964,6.0707992 36.206575,6.0790071 Z m 0.04857,2.2965007 c 0.203459,0 0.394742,0.043388 0.561208,0.1297078 0.456239,0.22812 0.758661,0.7645595 0.85731,1.5229044 0.117145,0.924811 -0.09285,1.99131 -0.598413,3.008602 -0.50556,1.017292 -1.226796,1.837195 -2.028298,2.299601 -0.659699,0.37609 -1.275956,0.462214 -1.732196,0.234094 -0.456239,-0.22812 -0.758671,-0.770725 -0.857311,-1.522904 -0.117144,-0.924811 0.09233,-1.99131 0.597895,-3.008602 0.505563,-1.017292 1.227315,-1.8371952 2.028817,-2.2996011 0.419248,-0.240451 0.819563,-0.3638021 1.170988,-0.3638021 z" />
<path
id="path26-6"
style="fill:#1a1a1a;stroke-width:0.061654;fill-opacity:1"
d="m 13.762467,0.59665452 c -0.239299,0.006494 -0.478218,0.0379232 -0.715202,0.0945679 -1.270074,0.3021049 -2.262958,1.27037888 -2.805513,2.72541488 -0.4747359,1.2885703 -0.5363581,2.8480446 -0.172599,4.3893962 0.363761,1.5413521 1.122075,2.9040025 2.133203,3.8473105 0.900148,0.826164 1.911656,1.264006 2.916618,1.264005 0.271279,0 0.542072,-0.03085 0.807185,-0.0925 1.270075,-0.302105 2.262922,-1.269863 2.799313,-2.724899 C 19.200209,8.8113797 19.26183,7.2513893 18.898071,5.7100374 18.534312,4.1686855 17.775998,2.8060343 16.764868,1.8627271 15.84314,1.0061207 14.799432,0.56851579 13.762467,0.59665452 Z m 0.0863,2.29546728 c 0.43158,0 0.905953,0.2220925 1.362191,0.6475055 0.678196,0.6350367 1.202462,1.5908014 1.461409,2.6944092 0.265113,1.103608 0.228099,2.1951256 -0.0925,3.0706136 C 16.314756,10.013672 15.901595,10.4696 15.408362,10.586742 14.908965,10.703885 14.329756,10.481971 13.77487,9.9702426 13.096676,9.3352058 12.572407,8.3794414 12.31346,7.2758334 c -0.265113,-1.1036081 -0.228099,-2.194609 0.0925,-3.070097 0.26511,-0.7090219 0.678309,-1.165466 1.177706,-1.2826089 0.08015,-0.018497 0.17262,-0.031006 0.2651,-0.031006 z" />
<path
id="path32-9"
style="fill:#1a1a1a;stroke-width:0.061654;fill-opacity:1"
d="M 3.7935669,6.0790071 C 3.2231793,6.0707997 2.6733809,6.1923575 2.166276,6.4459098 1.001015,7.0254579 0.24896743,8.190627 0.05167643,9.7258128 c -0.178799,1.3687212 0.11056822,2.8974912 0.81958822,4.3217002 0.70285695,1.418043 1.74481575,2.577491 2.94090565,3.268017 0.7706752,0.44391 1.5603043,0.665593 2.3063192,0.665593 0.554886,0 1.0849652,-0.123351 1.5781983,-0.363802 1.165261,-0.579548 1.9173055,-1.744717 2.1145994,-3.279903 0.1787962,-1.36872 -0.1110818,-2.89749 -0.8201048,-4.3217 C 8.2883263,8.597675 7.2463667,7.4382256 6.0502767,6.7477002 5.2942444,6.3141952 4.5269224,6.0895602 3.7935669,6.0790071 Z m -0.049093,2.2965007 c 0.351427,0 0.7522567,0.1233511 1.1715046,0.3638021 0.801502,0.4624059 1.5227369,1.2823091 2.0283001,2.2996011 0.5055639,1.017292 0.7155568,2.083791 0.5984128,3.008602 -0.09864,0.752179 -0.4010707,1.294784 -0.8573119,1.522904 C 6.229142,15.798537 5.6128851,15.712413 4.9531859,15.336323 4.1516839,14.873917 3.4299313,14.054014 2.9243692,13.036722 2.4188063,12.01943 2.20933,10.952931 2.326473,10.02812 2.4251229,9.2697751 2.727544,8.7333356 3.1837849,8.5052156 3.3502499,8.4188955 3.5410153,8.3755078 3.7444739,8.3755078 Z" />
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 7.6 KiB

49
image/family/black/plant.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 9.1 KiB

49
image/family/black/preserved.svg Normal file
View File

@ -0,0 +1,49 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 24.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg
version="1.1"
id="Capa_1"
x="0px"
y="0px"
viewBox="0 0 40 40"
xml:space="preserve"
sodipodi:docname="preserved.svg"
width="40"
height="40"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><defs
id="defs9" /><sodipodi:namedview
id="namedview7"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="3.595"
inkscape:cx="100"
inkscape:cy="99.860918"
inkscape:window-width="1920"
inkscape:window-height="1011"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="Capa_1" />
<style
type="text/css"
id="style2">
.st0{fill:#1E1E1C;}
.st1{fill:none;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
.st2{fill:#FFFFFF;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
</style>
<path
class="st0"
d="m 19.999996,39.999996 c 0.632411,0 1.121092,-0.517427 1.121092,-1.121092 v -8.39382 h 0.114984 c 2.874596,-0.08624 5.116781,-0.977363 6.669062,-2.644628 2.673374,-2.817104 2.443407,-6.927776 2.357169,-7.732663 v 0 c -0.05749,-0.603665 -0.546173,-1.092346 -1.149839,-1.149838 -0.287459,-0.02875 -1.322314,-0.114984 -2.644628,0.08624 l -0.488681,0.08624 0.431189,-0.258714 c 0.546174,-0.344951 1.034855,-0.747395 1.466044,-1.20733 2.673374,-2.817104 2.443407,-6.927776 2.357169,-7.732663 C 30.176067,9.328063 29.687384,8.839382 29.083719,8.78189 28.537545,8.7244 26.58282,8.609414 24.484365,9.356809 L 24.31189,9.414299 24.34064,9.213077 C 24.455623,8.609412 24.513115,7.977001 24.513115,7.373336 24.398131,3.492632 21.408552,0.790512 20.833633,0.301831 c -0.488682,-0.402444 -1.149839,-0.402444 -1.63852,0 -0.603665,0.459935 -3.593245,3.162055 -3.708228,7.042759 -0.02875,0.632411 0.02875,1.236076 0.172475,1.868487 l 0.02875,0.201222 -0.172475,-0.05749 C 13.41718,8.609414 11.433709,8.724398 10.887535,8.78189 10.28387,8.83938 9.7951894,9.328063 9.7376974,9.931728 c -0.08624,0.804887 -0.316205,4.915559 2.3571686,7.732663 0.431189,0.431189 0.891124,0.833633 1.437297,1.178584 l 0.402444,0.258714 -0.488681,-0.08624 c -0.632411,-0.08624 -1.178585,-0.114984 -1.609774,-0.114984 -0.431189,0 -0.747395,0.02875 -0.919871,0.02875 -0.603665,0.05749 -1.0923456,0.546173 -1.1498376,1.149838 -0.08624,0.804887 -0.316206,4.886813 2.3571686,7.732663 1.552281,1.63852 3.794466,2.529644 6.640316,2.644628 h 0.114984 v 8.39382 c 0,0.632411 0.488681,1.149838 1.121092,1.149838 z M 27.93388,21.171394 h 0.114984 v 0.114984 c -0.02875,1.20733 -0.28746,3.420769 -1.782249,5.001796 -1.121093,1.20733 -2.788358,1.839742 -4.973051,1.954725 H 21.17858 v -0.114983 c 0.08624,-2.299677 0.776141,-4.053181 2.012217,-5.203019 1.523536,-1.49479 3.621991,-1.753503 4.743083,-1.753503 z M 27.87639,10.966579 h 0.114984 v 0.114984 c -0.02875,1.20733 -0.287459,3.420769 -1.782249,5.001796 -1.121093,1.178585 -2.788358,1.839742 -4.973051,1.925979 H 21.12109 v -0.114983 c 0.08624,-2.299677 0.776141,-4.05318 2.012217,-5.203019 1.552282,-1.437298 3.650737,-1.696011 4.743083,-1.724757 z M 17.757811,7.40208 c 0.05749,-2.155947 1.379806,-3.880704 2.184693,-4.714337 l 0.08624,-0.08624 0.08624,0.08624 c 0.776141,0.833633 2.098455,2.55839 2.184693,4.714337 0.05749,1.696012 -0.689903,3.392023 -2.155947,5.030543 l -0.08624,0.08624 -0.08624,-0.08624 C 18.418968,10.794103 17.700319,9.098092 17.757811,7.40208 Z m -4.024434,8.681279 c -1.466044,-1.552281 -1.753503,-3.794466 -1.782249,-5.001796 v -0.114984 h 0.114984 c 1.35106,0.02875 3.277039,0.344951 4.743083,1.724757 v 0 c 1.236076,1.149839 1.897233,2.903342 2.012217,5.203019 v 0.114983 h -0.114984 c -2.184693,-0.08624 -3.851958,-0.747394 -4.973051,-1.925979 z m 5.001797,12.130794 c -2.184693,-0.08624 -3.851959,-0.747395 -4.973051,-1.925979 -1.466044,-1.552281 -1.753503,-3.794466 -1.782249,-5.001796 v -0.114984 h 0.114984 c 1.121092,0.02875 3.219547,0.287459 4.743083,1.724757 1.236076,1.149839 1.897233,2.903342 2.012217,5.203019 v 0.114983 z M 18.418968,21.228886 C 18.074017,20.91268 17.700319,20.625221 17.26913,20.337761 l -0.431189,-0.258714 0.488681,0.05749 c 0.833633,0.114984 1.638519,0.14373 2.500898,0.114984 0.02875,0 0.05749,0 0.08624,0 h 0.05749 0.05749 c 0.02875,0 0.05749,0 0.08624,0 0.201221,0 0.373697,0 0.574919,0 0.689903,0 1.379806,-0.05749 2.040963,-0.14373 l 0.517427,-0.08624 -0.431189,0.28746 c -0.43119,0.258714 -0.804887,0.574919 -1.149839,0.891125 -0.574919,0.546173 -1.092346,1.236076 -1.523535,2.012217 l -0.08624,0.172476 -0.08624,-0.172476 c -0.459931,-0.747391 -0.977359,-1.437294 -1.552278,-1.983467 z"
id="path4"
style="stroke-width:0.28746;fill-opacity:1;fill:#1a1a1a" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 5.0 KiB

59
image/family/black/treatments.svg Normal file
View File

@ -0,0 +1,59 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 24.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg
version="1.1"
id="Capa_1"
x="0px"
y="0px"
viewBox="0 0 40 40"
xml:space="preserve"
sodipodi:docname="treatments.svg"
width="40"
height="40"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><defs
id="defs13" /><sodipodi:namedview
id="namedview11"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="3.595"
inkscape:cx="100"
inkscape:cy="99.860918"
inkscape:window-width="1920"
inkscape:window-height="1011"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="Capa_1" />
<style
type="text/css"
id="style2">
.st0{fill:#1E1E1C;}
.st1{fill:none;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
.st2{fill:#FFFFFF;stroke:#1E1E1C;stroke-width:8;stroke-miterlimit:10;}
</style>
<g
id="g8"
transform="matrix(0.28715004,0,0,0.28715004,-9.3036616,-8.6719315)"
style="fill:#1a1a1a;fill-opacity:1">
<path
class="st0"
d="m 88.4,48.2 c -10.7,3.1 -16.5,10.9 -16.5,22 v 99.3 h 60.3 c 0,-0.1 0,-0.2 0,-0.3 0,-8.8 0,-17.6 0,-26.4 0,-24.2 0,-49.3 -0.1,-74.1 0,-7.7 -3.7,-13.9 -10.6,-18.1 v 0 c -1.3,-0.8 -2.8,-1.4 -4.4,-2 H 117 c -0.7,-0.3 -1.4,-0.6 -2.2,-0.9 l -0.2,-0.1 V 30.2 H 89.3 V 47.8 L 88.8,48 c -0.2,0.1 -0.3,0.2 -0.4,0.2 z m 35.7,113.4 H 79.9 V 73.2 h 44.2 z M 97.4,38.2 h 9.3 v 9.4 h -9.3 z m -4.3,17.4 h 3.4 c 4.8,0 9.7,-0.1 14.5,0 5.2,0.1 9.2,2.6 11.8,7.4 0.2,0.3 0.3,0.7 0.5,1 v 0.1 c 0.1,0.2 0,0.3 0,0.4 0,0 0,0.1 0,0.1 v 0.3 H 80.5 l 0.2,-0.5 c 0.7,-2.2 2,-4.1 3.9,-5.7 2.5,-2 5.4,-3.1 8.5,-3.1 z"
id="path4"
style="fill:#1a1a1a;fill-opacity:1" />
<path
class="st0"
d="m 114.7,130.7 c 0.1,-3.1 0,-6.2 0,-9.3 v -1 c 0,-1.1 0,-2.2 0,-3.2 v -0.1 c 0,-1.1 0,-2.3 0,-3.4 v -0.2 c 0,-3 0,-6.1 0,-9.1 0,-1.4 -0.2,-2.6 -0.4,-3.6 -1.4,-5.5 -6.5,-9.5 -12.2,-9.5 -0.5,0 -1,0 -1.4,0.1 -6.5,0.8 -11.3,6.1 -11.4,12.5 -0.1,8.4 0,17.1 0,24.8 v 1.9 c 0,0.9 0.1,1.9 0.4,2.9 1.5,6.1 7.3,10.2 13.5,9.6 6.5,-0.7 11.4,-6 11.5,-12.4 z m -7.9,-9.7 c 0,3 0,6 0,9 0,3 -1.9,5.2 -4.7,5.2 -1.3,0 -2.4,-0.5 -3.3,-1.3 -1,-0.9 -1.5,-2.3 -1.5,-3.8 0,-8.5 0,-17.2 0,-25.7 0,-1.5 0.5,-2.9 1.5,-3.8 0.9,-0.8 2,-1.3 3.3,-1.3 2.8,0 4.7,2.2 4.7,5.2 0,3 0,6 0,9 v 3.8 z"
id="path6"
style="fill:#1a1a1a;fill-opacity:1" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.7 KiB

60
index.js Normal file
View File

@ -0,0 +1,60 @@
__webpack_public_path__ = _PUBLIC_PATH;
require('hedera/hedera');
window.onload = function() {
loadLocale(main);
}
function main(req) {
if (req)
onLocaleLoad(req);
hederaWeb = new Hedera.App();
hederaWeb.run();
}
function loadLocale(cb) {
Vn.Locale.init();
var lang = Vn.Locale.language;
var req = require.context('js', true, /locale\/en.yml$/);
onLocaleLoad(req);
switch (lang) {
case 'ca':
require([], function() {
cb(require.context('js', true, /locale\/ca.yml$/));
});
break;
case 'es':
require([], function() {
cb(require.context('js', true, /locale\/es.yml$/));
});
break;
case 'fr':
require([], function() {
cb(require.context('js', true, /locale\/fr.yml$/));
});
break;
case 'mn':
require([], function() {
cb(require.context('js', true, /locale\/mn.yml$/));
});
break;
case 'pt':
require([], function() {
cb(require.context('js', true, /locale\/pt.yml$/));
});
break;
default:
cb();
}
}
function onLocaleLoad(req) {
var keys = req.keys();
for (var i = 0; i < keys.length; i++)
Vn.Locale.add(req(keys[i]));
}

350
js/hedera/gui.css
View File

@ -1,350 +0,0 @@
.vn-gui {
height: inherit;
}
/* Font */
.vn-gui .user-name,
.vn-gui .menu-title,
.vn-gui .main-menu {
font-size: 1.1em;
}
/* Navigation bar */
.vn-gui .navbar {
position: fixed;
background-color: #1A1A1A;
left: 250px;
top: 0;
right: 0;
z-index: 1;
overflow: hidden;
height: 64px;
color: white;
transition-property: left, background-color, transform;
transition-duration: 200ms;
transition-timing-function: ease-in-out;
}
.vn-gui .menu-button {
position: absolute;
left: 0;
display: none;
border: none;
background-color: transparent;
padding: 0 .4em;
margin: 0;
height: 100%;
}
.vn-gui .menu-button:hover {
background-color: rgba(0, 0, 0, .2);
}
.vn-gui .menu-button img {
vertical-align: middle;
height: 1.8em;
}
.vn-gui .title {
float: left;
}
.vn-gui .title h1 {
font-weight: normal;
font-size: 1.4em;
padding: .8em .6em;
padding-right: .3em;
margin: 0;
}
.vn-gui .navbar > .htk-spinner {
float: left;
margin: 1.05em .8em;
}
/* Action bar */
.vn-gui .action-bar {
float: right;
padding: 0;
margin: 0;
height: 100%;
}
.vn-gui .action-bar > div {
padding: 0;
margin: 0;
height: 100%;
}
.vn-gui .action-bar > div > * {
float: right;
}
.vn-gui .action-bar button {
margin: 0;
padding: 1.25em .5em;
border-radius: 2em;
font-weight: bold;
}
.vn-gui .action-bar button:hover {
background-color: rgba(1, 1, 1, .2);
}
.vn-gui .action-bar button > img {
vertical-align: middle;
height: 1.4em;
}
/* Background */
.vn-gui > .background {
z-index: 10;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
visibility: hidden;
background-color: rgba(1, 1, 1, .7);
opacity: 0;
}
.vn-gui > .background.show {
visibility: visible;
transition: opacity 200ms ease-out;
opacity: 1;
}
/* Left panel */
.vn-gui .left-panel {
z-index: 20;
position: fixed;
left: 0;
bottom: 0;
top: 0;
background-color: white;
z-index: 20;
width: 250px;
}
.vn-gui .menu-overflow {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 4em;
overflow: auto;
}
.vn-gui .menu-header {
background-color: #1A1A1A;
color: white;
height: 64px;
display: flex;
}
.vn-gui .logo {
display: block;
width: 160px;
margin-left: 37px;
}
.vn-gui .user-info {
overflow: hidden;
padding: 20px 37px;
font-weight: bold;
}
.vn-gui .user-info > img {
margin-right: 10px;
height: 20px;
vertical-align: middle;
}
.vn-gui .user-info > p {
margin: 0;
margin-top: .2em;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.vn-gui .logout {
display: block;
width: 100%;
margin: 0;
text-align: left;
padding: 14px 37px;
}
.vn-gui .supplant {
display: none;
padding: 8px;
margin: 0;
margin-top: .2em;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.vn-gui .supplant > p {
margin: 0;
margin-top: .2em;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.vn-gui .supplant-logout {
float: right;
margin: 0;
padding: .2em;
display: block;
}
.vn-gui .supplant-logout > img {
height: 1.2em;
display: block;
}
/* Test link */
.vn-gui .test-link {
display: none;
margin: .5em;
background-color: #3f51b5;
color: white;
padding: 0 1em;
line-height: 2em;
border-radius: .1em;
text-align: center;
}
.vn-gui .test-link:hover {
background-color: #4f61c5;
}
.vn-gui .dev-info {
display: none;
padding: .3em .5em;
color: white;
background-color: #3f51b5;
font-size: .9em;
margin: .5em;
border-radius: .1em;
}
.vn-gui .dev-info > p {
margin: .2em 0;
}
.vn-gui .dev-info > .mode {
color: #BBF;
}
/* Menu */
.vn-gui .main-menu,
.vn-gui ul.submenu {
list-style-type: none;
padding: 0;
margin: 0;
}
.vn-gui .main-menu > li {
display: block;
padding: 0;
margin: 0;
width: 100%;
}
.vn-gui .main-menu a {
width: 70%;
padding: 0 15%;
display: block;
line-height: 2.8em;
}
.vn-gui .main-menu a:hover,
.vn-gui .main-menu a.selected {
background-color: rgba(1, 1, 1, .1);
}
.vn-gui ul.submenu {
display: none;
}
.vn-gui ul.submenu.popup {
display: inline;
position: fixed;
border: none;
border-radius: 1px;
background-color: white;
box-shadow: 0 0 .3em rgba(1, 1, 1, .3);
z-index: 50;
width: 13em;
max-height: 30em;
}
/* Social */
.vn-gui .menu-footer {
position: absolute;
bottom: 0;
right: 0;
left: 0;
}
/* Body */
.vn-gui > .body {
margin-left: 250px;
padding-top: 4.4em;
height: inherit;
box-sizing: border-box;
height: inherit;
transition-property: margin-left, margin-right;
transition-duration: 200ms;
}
.vn-gui .form-holder {
position: relative;
height: inherit;
opacity: 0;
transform: translateZ(0) translateX(-2em);
-webkit-transform: translateZ(0) translateX(-2em);
transition-property: opacity, transform;
transition-duration: 200ms;
transition-timing-function: ease-out;
}
.vn-gui .form-holder.show {
opacity: 1;
transform: translateZ(0) translateX(0em);
-webkit-transform: translateZ(0) translateX(0em);
}
/* Mobile */
@media (max-width: 960px) {
.vn-gui .action-bar span.label,
.vn-gui .htk-button > span {
display: none;
}
.vn-gui > .navbar {
padding-left: 2.8em;
left: 0;
}
.vn-gui > .body {
margin-left: 0;
}
.vn-gui .menu-button {
display: block;
}
.vn-gui .left-panel {
top: 0;
left: -250px;
box-shadow: 0 0 .2em rgba(1, 1, 1, .3);
transition: transform 200ms ease-out;
-webkit-transition: transform 200ms ease-out;
}
.vn-gui .left-panel.show {
transform: translateZ(0) translateX(250px);
-webkit-transform: translateZ(0) translateX(250px);
}
.vn-gui .form-holder {
left: 0;
}
.vn-gui ul.submenu {
display: block;
background-color: #888;
color: white;
box-shadow: inset 0 0 .2em rgba(1, 1, 1, .2);
overflow: hidden;
max-height: 0;
transition: max-height 300ms ease-out;
webkit-transition: max-height 300ms ease-out;
}
.vn-gui .main-menu li:hover > ul.submenu {
max-height: 20em;
}
}

6
js/hedera/gui.js
View File

@ -1,8 +1,8 @@
var Module = require('./module'); var Module = require('./module');
var Tpl = require('./gui.xml'); var Tpl = require('./gui.xml').default;
require('./gui.css'); require('./gui.scss');
module.exports = new Class({ module.exports = new Class({
Extends: Htk.Component, Extends: Htk.Component,
@ -49,7 +49,7 @@ module.exports = new Class({
var sql = 'SELECT id, name, nickname FROM account.myUser;' var sql = 'SELECT id, name, nickname FROM account.myUser;'
+'SELECT defaultForm FROM config;' +'SELECT defaultForm FROM config;'
+'SELECT url FROM imageConfig;' +'SELECT url FROM imageConfig;'
+'SELECT dbproduccion FROM vn2008.tblContadores;' +'SELECT dbproduccion FROM vn.config;'
+'SELECT productionDomain, testDomain FROM config;'; +'SELECT productionDomain, testDomain FROM config;';
this._conn.execQuery(sql, this.onMainQueryDone.bind(this)); this._conn.execQuery(sql, this.onMainQueryDone.bind(this));

324
js/hedera/gui.scss Normal file
View File

@ -0,0 +1,324 @@
.vn-gui {
height: inherit;
/* Font */
.user-name,
.menu-title {
font-size: 1.1em;
}
/* Navigation bar */
.navbar {
position: fixed;
background-color: #1A1A1A;
left: 250px;
top: 0;
right: 0;
z-index: 1;
overflow: hidden;
height: 64px;
color: white;
transition-property: left, background-color, transform;
transition-duration: 200ms;
transition-timing-function: ease-in-out;
}
.menu-button {
position: absolute;
left: 0;
display: none;
border: none;
background-color: transparent;
padding: 0 1em;
margin: 0;
height: 100%;
}
.menu-button:hover {
background-color: rgba(0, 0, 0, .2);
}
.menu-button img {
vertical-align: middle;
height: 1.8em;
}
.title {
float: left;
}
.title h1 {
font-weight: normal;
font-size: 1.4em;
padding: .8em .6em;
padding-right: .3em;
margin: 0;
}
.navbar > .htk-spinner {
float: left;
margin: 1.05em .8em;
}
/* Action bar */
.action-bar {
float: right;
padding: 0;
margin: 0;
height: 100%;
}
.action-bar > div {
padding: 0;
margin: 0;
height: 100%;
display: flex;
align-items: center;
padding: 0 1em;
gap: .5em;
}
.action-bar > div > * {
float: right;
}
.action-bar button {
margin: 0;
padding: .6em;
}
.action-bar button:hover {
background-color: rgba(2550, 255, 255, .2);
}
/* Background */
& > .background {
z-index: 10;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
visibility: hidden;
background-color: rgba(1, 1, 1, .7);
opacity: 0;
}
& > .background.show {
visibility: visible;
transition: opacity 200ms ease-out;
opacity: 1;
}
/* Left panel */
.left-panel {
z-index: 20;
position: fixed;
left: 0;
bottom: 0;
top: 0;
background-color: white;
z-index: 20;
width: 250px;
}
.menu-overflow {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 4em;
overflow: auto;
}
.menu-header {
background-color: #1A1A1A;
color: white;
height: 64px;
display: flex;
}
.logo {
display: block;
width: 160px;
margin-left: 37px;
}
.user-info > div {
display: flex;
justify-content: space-between;
align-items: center;
overflow: hidden;
font-weight: bold;
border: 1px solid #eaeaea;
margin: 25px;
& > span {
padding: 10px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.logout {
display: block;
margin: 0;
text-align: left;
&:hover {
background-color: #1a1a1a;
color: white;
}
}
&.supplant {
display: none;
}
}
/* Test link */
.test-link {
display: none;
margin: .5em;
background-color: #3f51b5;
color: white;
padding: 0 1em;
line-height: 2em;
border-radius: .1em;
text-align: center;
}
.test-link:hover {
background-color: #4f61c5;
}
.dev-info {
display: none;
padding: .3em .5em;
color: white;
background-color: #3f51b5;
font-size: .9em;
margin: .5em;
border-radius: .1em;
}
.dev-info > p {
margin: .2em 0;
}
.dev-info > .mode {
color: #BBF;
}
/* Menu */
.main-menu,
ul.submenu {
list-style-type: none;
padding: 0;
margin: 0;
}
.main-menu > li {
display: block;
padding: 0;
margin: 0;
width: 100%;
}
.main-menu a {
width: 70%;
padding: 0 15%;
display: block;
line-height: 2.8em;
}
.main-menu a:hover,
.main-menu a.selected {
background-color: rgba(1, 1, 1, .1);
}
ul.submenu {
display: none;
}
ul.submenu.popup {
display: inline;
position: fixed;
border: none;
border-radius: 1px;
background-color: white;
box-shadow: 0 0 .3em rgba(1, 1, 1, .3);
z-index: 50;
width: 13em;
max-height: 30em;
}
/* Social */
.menu-footer {
position: absolute;
bottom: 0;
right: 0;
left: 0;
}
/* Body */
& > .body {
margin-left: 250px;
padding-top: 4.4em;
height: inherit;
box-sizing: border-box;
height: inherit;
transition-property: margin-left, margin-right;
transition-duration: 200ms;
}
.form-holder {
position: relative;
height: inherit;
opacity: 0;
transform: translateZ(0) translateX(-2em);
-webkit-transform: translateZ(0) translateX(-2em);
transition-property: opacity, transform;
transition-duration: 200ms;
transition-timing-function: ease-out;
}
.form-holder.show {
opacity: 1;
transform: translateZ(0) translateX(0em);
-webkit-transform: translateZ(0) translateX(0em);
}
/* Mobile */
@media (max-width: 960px) {
.action-bar span.label,
.htk-button > .text {
display: none;
}
& > .navbar {
padding-left: 2.8em;
left: 0;
}
& > .body {
margin-left: 0;
}
.menu-button {
display: block;
}
.left-panel {
top: 0;
left: -250px;
box-shadow: 0 0 .2em rgba(1, 1, 1, .3);
transition: transform 200ms ease-out;
-webkit-transition: transform 200ms ease-out;
}
.left-panel.show {
transform: translateZ(0) translateX(250px);
-webkit-transform: translateZ(0) translateX(250px);
}
.form-holder {
left: 0;
}
ul.submenu {
display: block;
background-color: #888;
color: white;
box-shadow: inset 0 0 .2em rgba(1, 1, 1, .2);
overflow: hidden;
max-height: 0;
transition: max-height 300ms ease-out;
webkit-transition: max-height 300ms ease-out;
}
.main-menu li:hover > ul.submenu {
max-height: 20em;
}
}
}

25
js/hedera/gui.xml
View File

@ -3,7 +3,7 @@
<div id="top-bar" class="navbar"> <div id="top-bar" class="navbar">
<div id="action-bar" class="action-bar"/> <div id="action-bar" class="action-bar"/>
<button id="menu-button" class="menu-button"> <button id="menu-button" class="menu-button">
<img src="image/icon/dark/menu.svg" alt="_Menu"/> <htk-icon name="menu" alt="_Menu"/>
</button> </button>
<div id="title" class="title"/> <div id="title" class="title"/>
<htk-spinner id="loader" class="loader dark"/> <htk-spinner id="loader" class="loader dark"/>
@ -14,21 +14,22 @@
<img class="logo" src="image/logo-dark.svg" alt="Verdnatura"/> <img class="logo" src="image/logo-dark.svg" alt="Verdnatura"/>
</div> </div>
<div class="user-info"> <div class="user-info">
<img src="image/icon/light/access-log.svg" alt=""/> <div>
<t>Hello</t>, <span id="user-name"/> <span id="user-name"/>
<button class="logout" on-click="onLogoutClick">
<htk-icon name="logout" alt="_Exit"/>
</button>
</div>
<div id="supplant" class="supplant">
<span id="supplanted"/>
<button class="logout" on-click="onSupplantExitClick">
<htk-icon name="logout" alt="_Exit"/>
</button>
</div>
</div> </div>
<ul id="main-menu" class="main-menu"/> <ul id="main-menu" class="main-menu"/>
<button class="logout" on-click="onLogoutClick">
<t>Exit</t>
</button>
</div> </div>
<div class="menu-footer"> <div class="menu-footer">
<div id="supplant" class="supplant">
<button class="supplant-logout" on-click="onSupplantExitClick" title="_Exit">
<img src="image/icon/light/exit.svg" alt="_Exit"/>
</button>
<p id="supplanted"/>
</div>
<div id="dev-info" class="dev-info"> <div id="dev-info" class="dev-info">
<p class="mode">Testing</p> <p class="mode">Testing</p>
<p><t>Version</t> <span id="version"/></p> <p><t>Version</t> <span id="version"/></p>

23
js/hedera/hedera.js
View File

@ -1,16 +1,17 @@
require ('htk/htk'); require('htk/htk');
require ('./style.css'); require('./responsive.scss');
require('./style.scss');
Hedera = module.exports = { Hedera = module.exports = {
Login : require ('./login') Login : require('./login')
,SocialBar : require ('./social-bar') ,SocialBar : require('./social-bar')
,Gui : require ('./gui') ,Gui : require('./gui')
,Module : require ('./module') ,Module : require('./module')
,Form : require ('./form') ,Form : require('./form')
,Report : require ('./report') ,Report : require('./report')
,App : require ('./app') ,App : require('./app')
,Tpv : require ('./tpv') ,Tpv : require('./tpv')
,BasketChecker : require ('./basket-checker') ,BasketChecker : require('./basket-checker')
}; };

225
js/hedera/login.css
View File

@ -1,225 +0,0 @@
.vn-login
{
color: #333;
font-size: 1.1em;
font-weight: normal;
height: inherit;
background-color: white;
}
/* Body */
.vn-login .body
{
height: inherit;
}
.vn-login .column
{
position: relative;
margin: 0 auto;
max-width: 40em;
height: inherit;
background-color: white;
min-height:
}
/* Login */
.vn-login .login
{
position: relative;
height: inherit;
max-width: 18em;
margin: 0 auto;
}
.vn-login form
{
position: absolute;
top: 50%;
margin-top: -380px;
width: 100%;
padding: 2em 0;
}
.vn-login form > div
{
margin: 1em 0;
}
.vn-login p
{
margin: .4em 0;
}
/* Header */
.vn-login .header
{
margin-bottom: 80px;
}
.vn-login .header img
{
display: block;
width: 100%;
}
.vn-login .version-code
{
color: red;
text-align: right;
margin: .2em auto;
font-weight: bold;
height: 1.4em;
display: none;
}
/* Body */
.vn-login .form-inputs
{
margin: 0 auto;
max-width: 15em;
}
.vn-login label
{
margin: 0;
}
.vn-login .form-group label
{
display: block;
font-size: inherit;
}
.vn-login .remind-block {
margin: 20px 0;
}
.vn-login .remind-forgot {
margin: 40px 0;
}
.vn-login input
{
margin: 0.3em;
}
.vn-login input[type=text],
.vn-login input[type=password]
{
margin: 0;
padding: 0 .5em;
width: 100%;
border-bottom: 1px solid #AAA;
height: 2.6em;
}
.vn-login input[type=text],
.vn-login input[type=password],
.vn-login input[type=submit],
.vn-login input[type=button],
.vn-login input[type=reset],
.vn-login button,
.vn-login .button
{
border-radius: .1em;
}
.vn-login input[type=checkbox]
{
padding: 0;
margin: 0;
width: initial;
height: initial;
margin-right: .5em;
}
.vn-login input[type=submit],
.vn-login input[type=button],
.vn-login input[type=reset],
.vn-login button,
.vn-login .button
{
margin: 0 auto;
background-color: #0d1115;
border-radius: 25px;
height: 50px;
width: 100%;
color: white;
transition: transform 200ms ease-out;
transition-property: background-color;
}
.vn-login input[type=submit]:hover,
.vn-login input[type=button]:hover,
.vn-login input[type=reset]:hover,
.vn-login button:hover,
.vn-login .button:hover
{
background-color: #7d8185;
}
.vn-login .button.guest
{
margin-top: 15px;
border: 1px solid #0d1115;
background-color: white;
color: #0d1115;
}
.vn-login .button.guest:hover
{
border-color: #7d8185;
background-color: #7d8185;
color: white;
}
hr
{
border: solid 1px #333;
margin: 0;
padding: 0;
display: block;
}
.vn-login .enter
{
position: relative;
}
.vn-login .wrapper
{
width: 0;
overflow: visible;
position: absolute;
top: 0;
right: 0;
}
.vn-login .htk-spinner
{
margin: .3em 1em;
position: absolute;
}
/* Footer */
.vn-login .footer
{
margin-top: 80px;
font-size: 14px;
text-align: center;
}
.vn-login .contact
{
margin-top: 15px;
color: grey;
}
.vn-login .footer a
{
font-weight: bold;
}
@media (max-height: 50em)
{
.vn-login .column
{
min-height: 45em;
}
.vn-login .login
{
display: flex;
align-items: center;
}
.vn-login form
{
top: 0;
position: relative;
margin-top: 0;
padding-top: 5.5em;
}
}

4
js/hedera/login.js
View File

@ -1,6 +1,6 @@
require('./login.css'); require('./login.scss');
var Tpl = require('./login.xml'); var Tpl = require('./login.xml').default;
module.exports = new Class({ module.exports = new Class({
Extends: Htk.Component, Extends: Htk.Component,

148
js/hedera/login.scss Normal file
View File

@ -0,0 +1,148 @@
.vn-login {
display: flex;
align-items: center;
justify-content: center;
color: #333;
font-size: 1.1em;
font-weight: normal;
height: inherit;
background-color: white;
a:hover {
text-decoration: underline;
}
input {
margin: .3em;
}
input[type=text],
input[type=password] {
margin: 0;
padding: 0 5px;
width: 100%;
height: 2.6em;
border-radius: 0;
border-top: none;
border-left: none;
border-right: none;
background-color: none;
}
input[type=checkbox] {
padding: 0;
margin: 0;
width: initial;
height: initial;
margin-right: .5em;
}
input[type=submit],
input[type=button],
input[type=reset],
button,
.button {
margin: 0 auto;
background-color: #0d1115;
border-radius: 25px;
height: 50px;
width: 100%;
color: white;
transition: transform 200ms ease-out;
transition-property: background-color;
&:hover {
background-color: #3d3f42;
}
}
@media (max-height: 50em) {
height: initial;
}
}
.vn-login > .column {
max-width: 300px;
& > .header {
margin-top: 60px;
margin-bottom: 80px;
img {
display: block;
width: 100%;
}
.version-code {
color: red;
text-align: right;
margin: .2em auto;
font-weight: bold;
height: 1.4em;
display: none;
}
}
& > .footer {
margin-bottom: 60px;
margin-top: 80px;
font-size: 14px;
text-align: center;
.contact {
margin-top: 15px;
color: grey;
}
a {
font-weight: bold;
}
}
& > form {
& > div {
margin: 20px 0;
}
p {
margin: 5px 0;
}
label {
margin: 0;
}
& > .form-group > label {
display: block;
font-size: 14px;
}
& > .remind-block {
margin-top: 20px;
margin-bottom: 40px;
}
.button.guest {
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #0d1115;
background-color: white;
color: #0d1115;
text-decoration: none;
&:hover {
border-color: rgba(0, 0, 0, .8);
background-color: rgba(0, 0, 0, .8);
color: white;
}
}
.password-forgotten {
text-align: center;
font-size: 14px;
margin-top: 30px;
}
.enter {
position: relative;
}
.wrapper {
width: 0;
overflow: visible;
position: absolute;
top: 0;
right: 0;
}
.htk-spinner {
margin: .3em 1em;
position: absolute;
}
}
}

64
js/hedera/login.xml
View File

@ -1,13 +1,11 @@
<vn> <vn>
<div id="main" class="vn-login"> <div id="main" class="vn-login">
<div class="body"> <div class="column">
<div class="column"> <div class="header">
<div class="login"> <img src="image/logo.svg" alt="VerdNatura"/>
<div class="version-code"/>
</div>
<form id="form"> <form id="form">
<div class="header">
<img src="image/logo.svg" alt=""/>
<div class="version-code"/>
</div>
<div class="form-group"> <div class="form-group">
<label> <label>
<t>User</t> <t>User</t>
@ -20,20 +18,11 @@
<input type="password" id="pass" name="password"/> <input type="password" id="pass" name="password"/>
</label> </label>
</div> </div>
<div class="remind-forgot"> <div class="remind-block">
<div class="remind-block"> <label>
<label> <input type="checkbox" id="remember" name="remember"/>
<input type="checkbox" id="remember" name="remember"/> <t>Remind me</t>
<t>Remind me</t> </label>
</label>
</div>
<div class="remind-block">
<p>
<a href="#" on-click="onPasswordLost">
<t>Password forgotten? Push here</t>
</a>
</p>
</div>
</div> </div>
<div class="enter"> <div class="enter">
<input id="submit" type="submit" value="_Login"/> <input id="submit" type="submit" value="_Login"/>
@ -41,24 +30,25 @@
<htk-spinner id="spinner"/> <htk-spinner id="spinner"/>
</div> </div>
</div> </div>
<a class="button guest" href="#!form=cms/home&amp;guest=true"> <div>
<t>Log in as guest</t> <a class="button guest" href="#!form=cms/home&amp;guest=true">
</a> <t>Log in as guest</t>
<div class="footer"> </a>
<p>
<t>Yet you are not a customer?</t>
<a href="_Sign up link" target="_blank"><t>Sign up</t></a>
</p>
<p class="contact">
<p>Tel. <t>Login phone</t> - <t>Login mail</t></p>
</p>
<!--
<htk-social-bar id="social-bar" priority="1"/>
<div id="social" class="social"/>
-->
</div> </div>
<p class="password-forgotten">
<a href="#" on-click="onPasswordLost">
<t>Password forgotten? Push here</t>
</a>
</p>
</form> </form>
</div> <div class="footer">
<p>
<t>Yet you are not a customer?</t>
<a href="_Sign up link" target="_blank"><t>Sign up</t></a>
</p>
<p class="contact">
Tel. <t>Login phone</t> - <t>Login mail</t>
</p>
</div> </div>
</div> </div>
</div> </div>

BIN
js/hedera/poppins.ttf Normal file
View File

Binary file not shown.

4
js/hedera/report.css
View File

@ -1,8 +1,8 @@
@font-face @font-face
{ {
font-family: 'Roboto'; font-family: 'Roboto';
src: url('roboto.ttf') format('truetype'); src: url('roboto.ttf') format('truetype');
} }
@media print @media print
{ {

54
js/hedera/responsive.scss Normal file
View File

@ -0,0 +1,54 @@
/* Responsive */
/* Standard */
@media screen {
body { font-size: 10pt; }
}
/* Desktop - Laptop 1360x768 */
@media (max-resolution: 119dpi) and (min-device-width: 1340px) and (max-device-width: 1899px) {
body { font-size: 10pt; }
}
/* Desktop - FHD 1920x1080 */
@media (max-resolution: 119dpi) and (min-device-width: 1900px) {
body { font-size: 13pt; }
}
/* Mobile - Low DPI */
@media
(min-resolution: 120dpi),
(-webkit-min-device-pixel-ratio: 1.5) {
body { font-size: 9pt; }
}
@media
(min-resolution: 144dpi),
(-webkit-min-device-pixel-ratio: 1.5) {
body { font-size: 11pt; }
}
/* 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: 10pt; }
}
@media
(min-device-width: 384px) and (min-resolution: 192dpi),
(min-device-width: 384px) and (-webkit-min-device-pixel-ratio: 2) {
body { font-size: 11pt; }
}
/* 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: 10pt; }
}
@media
(min-device-width: 412px) and (min-resolution: 249dpi),
(min-device-width: 412px) and (-webkit-min-device-pixel-ratio: 3) {
body { font-size: 11pt; }
}

297
js/hedera/style.css → js/hedera/style.scss
View File

@ -1,77 +1,13 @@
@font-face @font-face {
{ font-family: 'Poppins';
font-family: 'Roboto'; src: url('poppins.ttf') format('truetype');
src: url('roboto.ttf') format('truetype');
}
/* Responsive */
/* Standard */
@media screen
{
body { font-size: 10pt; }
}
/* Desktop - Laptop 1360x768 */
@media (max-resolution: 119dpi) and (min-device-width: 1340px) and (max-device-width: 1899px)
{
body { font-size: 10pt; }
}
/* Desktop - FHD 1920x1080 */
@media (max-resolution: 119dpi) and (min-device-width: 1900px)
{
body { font-size: 13pt; }
}
/* Mobile - Low DPI */
@media
(min-resolution: 120dpi),
(-webkit-min-device-pixel-ratio: 1.5)
{
body { font-size: 9pt; }
}
@media
(min-resolution: 144dpi),
(-webkit-min-device-pixel-ratio: 1.5)
{
body { font-size: 11pt; }
}
/* 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: 10pt; }
}
@media
(min-device-width: 384px) and (min-resolution: 192dpi),
(min-device-width: 384px) and (-webkit-min-device-pixel-ratio: 2)
{
body { font-size: 11pt; }
}
/* 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: 10pt; }
}
@media
(min-device-width: 412px) and (min-resolution: 249dpi),
(min-device-width: 412px) and (-webkit-min-device-pixel-ratio: 3)
{
body { font-size: 11pt; }
} }
/* Global */ /* Global */
body body {
{ font-family: 'Poppins', 'Verdana', 'Sans';
font-family: 'Roboto', 'Verdana', 'Sans';
background-color: #FAFAFA; background-color: #FAFAFA;
color: #333; color: #333;
position: absolute; position: absolute;
@ -86,88 +22,77 @@ button,
input, input,
select, select,
textarea, textarea,
option option {
{
font-size: inherit; font-size: inherit;
font-family: inherit; font-family: inherit;
color: inherit; color: inherit;
} }
iframe iframe {
{
border: none; border: none;
} }
fieldset fieldset {
{
margin: 0; margin: 0;
} }
form form {
{
padding: 0; padding: 0;
margin: 0; margin: 0;
} }
table table {
{
width: 100%; width: 100%;
} }
a:link, a:link,
a:visited, a:visited,
a:active a:active {
{
color: inherit; color: inherit;
text-decoration: none; text-decoration: none;
} }
a:hover a:hover {
{
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
} }
a img a img {
{
padding: 1px; padding: 1px;
} }
a img:hover a img:hover {
{
opacity: 0.9; opacity: 0.9;
} }
h1, h2, h3, h4, h5, h6 h1, h2, h3, h4, h5, h6 {
{
margin: 0; margin: 0;
padding: .2em 0; padding: .2em 0;
} }
h1 h1 {
{
font-size: 1.5em; font-size: 1.5em;
} }
h2 h2 {
{
font-size: 1.2em; font-size: 1.2em;
} }
p p {
{
margin: 0.8em 0; margin: 0.8em 0;
} }
/* Focus outline */ /* Focus outline */
a:focus, a:focus {
input:focus,
button:focus
{
outline: 1px solid rgba(1, 1, 1, 0.15); outline: 1px solid rgba(1, 1, 1, 0.15);
-moz-outline-radius: .1em; -moz-outline-radius: .1em;
} }
input:focus,
button:focus {
outline: 0;
}
button::-moz-focus-inner, button::-moz-focus-inner,
input[type=submit]::-moz-focus-inner, input[type=submit]::-moz-focus-inner,
input[type=button]::-moz-focus-inner, input[type=button]::-moz-focus-inner,
input[type=reset]::-moz-focus-inner input[type=reset]::-moz-focus-inner {
{
border: none; border: none;
} }
select:-moz-focusring select:-moz-focusring {
{
/* color: transparent; /* color: transparent;
text-shadow: 0 0 0 #333;*/ text-shadow: 0 0 0 #333;*/
} }
input:-webkit-autofill {
-webkit-box-shadow: inset 0 0 0px 9999px white;
}
/* Inputs */ /* Inputs */
@ -177,71 +102,62 @@ input[type=file],
input[type=number], input[type=number],
textarea, textarea,
select, select,
.input .input {
{ border: 1px solid #ddd;
border: none; transition: border-color 100ms ease-in;
border-bottom: 1px solid #999;
margin: .2em 0; margin: .2em 0;
box-sizing: border-box; box-sizing: border-box;
color: #333; color: #333;
border-radius: 0; border-radius: 0;
text-align: left; text-align: left;
width: 100%; width: 100%;
&:focus {
border-color: #333;
}
} }
input[type=text], input[type=text],
input[type=password], input[type=password],
input[type=number], input[type=number],
textarea, textarea,
.input .input,
{ select {
padding: 0 .2em; padding: .8em;
} }
input[type=text], input[type=text],
input[type=password], input[type=password],
input[type=file], input[type=file],
input[type=number], input[type=number],
select, select,
.input .input {
{ height: 2.8em;
height: 2.2em;
} }
textarea textarea {
{
height: 3.5em; height: 3.5em;
width: 20em; width: 20em;
} }
input[type=text]:focus, input[type=text]:disabled {
input[type=password]:focus, background-color: #f3f3f3;
input[type=file]:focus,
input[type=number]:focus,
textarea:focus,
.input:focus
{
border-color: #333;
} }
input[type=checkbox], input[type=checkbox],
input[type=radio] input[type=radio] {
{
cursor: pointer; cursor: pointer;
margin: .2em;
padding: .3em; padding: .3em;
margin-right: .6em;
} }
select select {
{
background-color: white; background-color: white;
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
} }
option option {
{
padding: .4em; padding: .4em;
border-width: 0; border-width: 0;
font-weight: normal; font-weight: normal;
font-size: 1em; font-size: 1em;
} }
select, select,
option option {
{
cursor: pointer; cursor: pointer;
} }
@ -251,17 +167,16 @@ input[type=submit],
input[type=button], input[type=button],
input[type=reset], input[type=reset],
button, button,
.button .button {
{
border: none; border: none;
background-color: transparent; background-color: transparent;
padding: .5em; padding: .5em;
cursor: pointer; cursor: pointer;
border-radius: 0.1em; border-radius: 0.1em;
margin: -0.5em; margin: -0.5em;
font-weight: bold;
} }
.button .button {
{
display: inline-block; display: inline-block;
text-align: center; text-align: center;
box-sizing: border-box; box-sizing: border-box;
@ -270,16 +185,14 @@ input[type=submit]:hover,
input[type=button]:hover, input[type=button]:hover,
input[type=reset]:hover, input[type=reset]:hover,
button:hover, button:hover,
.button:hover .button:hover {
{
background-color: rgba(1, 1, 1, 0.1); background-color: rgba(1, 1, 1, 0.1);
} }
/* Flat button */ /* Flat button */
button.flat, button.flat,
.button.flat .button.flat {
{
border: none; border: none;
border-radius: 0.1em; border-radius: 0.1em;
box-shadow: 0 0.2em 0.2em #DDD; box-shadow: 0 0.2em 0.2em #DDD;
@ -287,14 +200,12 @@ button.flat,
color: black; color: black;
} }
button.flat:hover, button.flat:hover,
.button.flat:hover .button.flat:hover {
{
background-color: #9C3; background-color: #9C3;
cursor: pointer; cursor: pointer;
} }
button.flat:disabled, button.flat:disabled,
.button.flat:disabled .button.flat:disabled {
{
color: gray; color: gray;
} }
@ -304,60 +215,62 @@ input[type=submit].thin,
input[type=button].thin, input[type=button].thin,
input[type=reset].thin, input[type=reset].thin,
button.thin, button.thin,
.button.thin .button.thin {
{
color: #008D77; color: #008D77;
border-radius: .5em; border-radius: 1.4em;
background-color: rgba(0, 0, 0, .1); padding: .5em 1.4em;
background-color: rgba(255, 255, 255, .1);
font-weight: bold;
} }
input[type=submit].thin:disabled, input[type=submit].thin:disabled,
input[type=button].thin:disabled, input[type=button].thin:disabled,
input[type=reset].thin:disabled, input[type=reset].thin:disabled,
button.thin:disabled button.thin:disabled
.button.thin:disabled .button.thin:disabled {
{
color: gray; color: gray;
} }
input[type=submit].thin:hover,
input[type=button].thin:hover,
input[type=reset].thin:hover,
button.thin:hover
.button.thin:hover {
background-color: rgba(0, 0, 0, .1);
}
/* Image */ /* Image */
img.editable img.editable {
{
cursor: pointer; cursor: pointer;
} }
/* Button */ /* Button */
.htk-button img .htk-button img {
{
height: 1.5em; height: 1.5em;
} }
/* Float */ /* Float */
.clear .clear {
{
clear: both !important; clear: both !important;
} }
/* Box */ /* Box */
.box .box {
{
background-color: white; background-color: white;
margin: 0 auto; margin: 0 auto;
border-radius: .8em; border-radius: .6em;
box-shadow: .05em .05em .2em rgba(0, 0, 0, .1); box-shadow: .05em .05em .2em rgba(0, 0, 0, .1);
overflow: hidden;
} }
.box .header .box .header {
{
padding: 0.6em 0.8em; padding: 0.6em 0.8em;
margin: 0; margin: 0;
background-color: #009688; background-color: #009688;
color: white; color: white;
} }
.box .header > h1 .box .header > h1 {
{
color: white; color: white;
text-align: left; text-align: left;
font-size: 1.6em; font-size: 1.6em;
@ -365,31 +278,28 @@ img.editable
font-weight: normal; font-weight: normal;
display: inline; display: inline;
} }
.box .body .box .body {
{
padding: 2em; padding: 2em;
} }
/* Form */ /* Form */
.form .form {
{
margin: 0 auto; margin: 0 auto;
} }
.form-group .form > h2 {
{ margin-bottom: .8em;
}
.form-group {
margin-bottom: 1.2em; margin-bottom: 1.2em;
} }
.form-group:last-child .form-group:last-child {
{
margin-bottom: 0; margin-bottom: 0;
} }
.form-group > label .form-group > label {
{
display: block; display: block;
margin: 0; margin: 0;
margin-bottom: .2em; margin-bottom: .2em;
font-size: .9em;
color: #222; color: #222;
} }
.form-group > input[type=text], .form-group > input[type=text],
@ -397,52 +307,44 @@ img.editable
.form-group > input[type=file], .form-group > input[type=file],
.form-group > input[type=number], .form-group > input[type=number],
.form-group > select, .form-group > select,
.form-group > textarea .form-group > textarea {
{
margin: 0; margin: 0;
width: 100%; width: 100%;
} }
/* Form */ /* Form */
table.form table.form {
{
padding: 1em; padding: 1em;
border-collapse: separate; border-collapse: separate;
border-spacing: 0.3em; border-spacing: 0.3em;
} }
table.form td.label table.form td.label {
{
width: 45%; width: 45%;
text-align: right; text-align: right;
} }
table.form tr table.form tr {
{
height: 2.8em; height: 2.8em;
} }
/* Icon */ /* Icon */
img.icon img.icon {
{
height: 1.5em; height: 1.5em;
} }
/* Masonry */ /* Masonry */
.masonry .masonry {
{
margin: 0 auto; margin: 0 auto;
text-align: left; text-align: left;
} }
.masonry-box .masonry-box {
{
width: 100%; width: 100%;
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
} }
@media screen and (min-width: 1000px) and (max-width: 1399px) @media screen and (min-width: 1000px) and (max-width: 1399px) {
{
.masonry-box .masonry-box
{ {
width: 50%; width: 50%;
@ -456,28 +358,23 @@ img.icon
clear: right; clear: right;
} }
} }
@media screen and (min-width: 1400px) @media screen and (min-width: 1400px) {
{
.masonry-box { width: 33.3%; } .masonry-box { width: 33.3%; }
} }
@media screen and (min-width: 2000px) @media screen and (min-width: 2000px) {
{
.masonry-box { width: 25%; } .masonry-box { width: 25%; }
} }
/* Social bar */ /* Social bar */
.htk-social-bar .htk-social-bar {
{
text-align: center; text-align: center;
} }
.htk-social-bar a .htk-social-bar a {
{
display: inline-block; display: inline-block;
margin: 0 .1em; margin: 0 .1em;
} }
.htk-social-bar img .htk-social-bar img {
{
height: 1.8em; height: 1.8em;
width: 1.8em; width: 1.8em;
} }

38
js/htk/assistant-bar.js
View File

@ -40,41 +40,35 @@ module.exports = new Class({
render: function() { render: function() {
var bar = this.createRoot('div'); var bar = this.createRoot('div');
bar.className = 'htk-assistant-bar'; bar.className = 'htk-assistant-bar';
var previousButton = this.createElement('button'); var previousButton = new Htk.Button({
previousButton.className = 'previous'; icon: 'arrow_back_ios',
previousButton.title = _('Previous'); tip: 'Previous'
}).node;
previousButton.classList.add('previous');
previousButton.addEventListener('click', this.movePrevious.bind(this)); previousButton.addEventListener('click', this.movePrevious.bind(this));
bar.appendChild(previousButton); bar.appendChild(previousButton);
var img = this.createElement('img');
img.src = 'image/icon/light/go-previous.svg';
previousButton.appendChild(img);
var steps = this.createElement('div'); var steps = this.createElement('div');
steps.className = 'steps'; steps.className = 'steps';
bar.appendChild(steps); bar.appendChild(steps);
var nextButton = this.createElement('button'); var nextButton = new Htk.Button({
nextButton.className = 'next'; icon: 'arrow_forward_ios',
nextButton.title = _('Next'); tip: 'Next'
}).node;
nextButton.classList.add('next');
nextButton.addEventListener('click', this.moveNext.bind(this)); nextButton.addEventListener('click', this.moveNext.bind(this));
bar.appendChild(nextButton); bar.appendChild(nextButton);
var img = this.createElement('img'); var endButton = new Htk.Button({
img.src = 'image/icon/light/go-next.svg'; icon: 'done',
nextButton.appendChild(img); tip: 'Confirm'
}).node;
var endButton = this.createElement('button'); endButton.classList.add('end');
endButton.className = 'end';
endButton.title = _('Confirm');
endButton.addEventListener('click', this.end.bind(this)); endButton.addEventListener('click', this.end.bind(this));
bar.appendChild(endButton); bar.appendChild(endButton);
var img = this.createElement('img');
img.src = 'image/icon/light/ok.svg';
endButton.appendChild(img);
this._steps = steps; this._steps = steps;
this._previousButton = previousButton; this._previousButton = previousButton;
this._nextButton = nextButton; this._nextButton = nextButton;

16
js/htk/column/button.js
View File

@ -9,13 +9,10 @@ module.exports = new Class({
}, },
icon: { icon: {
type: String type: String
,set: function(x) ,set: function(x) {
{
this._icon = x; this._icon = x;
this.image = 'image/icon/light/'+ x +'.svg';
} }
,get: function() ,get: function() {
{
return this._icon; return this._icon;
} }
}, },
@ -60,13 +57,14 @@ module.exports = new Class({
button.disabled = this.disabled; button.disabled = this.disabled;
td.appendChild(button); td.appendChild(button);
var img = this.createElement('img'); var span = this.createElement('span');
img.src = this.image; span.className = 'material-symbols-rounded icon';
button.appendChild(img); span.innerText = this._icon;
button.appendChild(span);
if (this.tip) { if (this.tip) {
button.title = _(this.tip); button.title = _(this.tip);
img.title = _(this.tip); span.title = _(this.tip);
} }
return td; return td;

14
js/htk/field/bar-button.js
View File

@ -1,22 +1,10 @@
var Button = require ('./button'); var Button = require('./button');
module.exports = new Class module.exports = new Class
({ ({
Extends: Button Extends: Button
,Tag: 'htk-bar-button' ,Tag: 'htk-bar-button'
,Properties:
{
icon:
{
type: String
,set: function (x)
{
this.img.src = 'image/icon/dark/'+ x +'.svg';
}
}
}
,_showText: true ,_showText: true
}); });

78
js/htk/field/button.js
View File

@ -1,54 +1,42 @@
module.exports = new Class module.exports = new Class({
({
Extends: Htk.Field Extends: Htk.Field
,Tag: 'htk-button' ,Tag: 'htk-button'
,Properties: ,Properties:
{ {
image: image: {
{
type: String type: String
,set: function (x) ,set: function(x) {
{ this.span.innerText = x;
this.img.src = x;
} }
}, },
icon: icon: {
{
type: String type: String
,set: function (x) ,set: function(x) {
{ this.span.innerText = x;
this.img.src = 'image/icon/light/'+ x +'.svg';
} }
}, },
tip: tip: {
{
type: String type: String
,set: function (x) ,set: function(x) {
{ if (x) {
if (x)
{
this.node.title = _(x); this.node.title = _(x);
this.img.title = _(x); this.span.title = _(x);
} }
this.renderContent (); this.renderContent();
} }
,get: function () ,get: function() {
{
return this.node.title; return this.node.title;
} }
}, },
showText: showText: {
{
type: Boolean type: Boolean
,set: function (x) ,set: function(x) {
{
this._showText = x; this._showText = x;
this.renderContent (); this.renderContent();
} }
,get: function () ,get: function() {
{
return this._showText; return this._showText;
} }
} }
@ -56,31 +44,29 @@ module.exports = new Class
,_showText: false ,_showText: false
,render: function () ,render: function() {
{ var node = this.createRoot('button');
var node = this.createRoot ('button');
node.className = 'htk-button'; node.className = 'htk-button';
node.addEventListener ('click', this.onClick.bind (this)); node.addEventListener('click', this.onClick.bind(this));
this.img = this.createElement ('img'); this.span = this.createElement('span');
node.appendChild (this.img); this.span.className = 'material-symbols-rounded icon';
node.appendChild(this.span);
} }
,renderContent: function () ,renderContent: function() {
{
if (this._textNode) if (this._textNode)
Vn.Node.remove (this._textNode); Vn.Node.remove(this._textNode);
if (this._showText && this.node.title) if (this._showText && this.node.title) {
{ this._textNode = this.createElement('span');
this._textNode = this.createElement ('span'); this._textNode.className = 'text';
this._textNode.appendChild (this.createTextNode (this.node.title)); this._textNode.appendChild(this.createTextNode(this.node.title));
this.node.appendChild (this._textNode); this.node.appendChild(this._textNode);
} }
} }
,onClick: function () ,onClick: function() {
{ this.signalEmit('click', this._form);
this.signalEmit ('click', this._form);
} }
}); });

60
js/htk/field/entry.js
View File

@ -3,16 +3,56 @@ module.exports = new Class
({ ({
Extends: Htk.Field Extends: Htk.Field
,Tag: 'htk-entry' ,Tag: 'htk-entry'
,Properties:
,render: function ()
{ {
var node = this.createRoot ('input'); /**
* Displayed text when there is no content.
*/
placeholder:
{
type: String
,set: function(x) {
this.node.placeholder = x;
}
,get: function() {
return this.node.placeholder;
}
},
/**
* Whether is disabled.
*/
disabled:
{
type: Boolean
,set: function(x) {
this.node.disabled = x;
}
,get: function() {
return this.node.disabled;
}
},
/**
* Whether is readonly data.
*/
readonly:
{
type: Boolean
,set: function(x) {
this.node.readonly = x;
}
,get: function() {
return this.node.readonly;
}
}
}
,render: function() {
var node = this.createRoot('input');
node.type = 'text'; node.type = 'text';
node.addEventListener ('change', this._onChange.bind (this)); node.addEventListener('change', this._onChange.bind(this));
} }
,_onChange: function (event) ,_onChange: function(event) {
{
var newValue; var newValue;
if (this.node.value == '') if (this.node.value == '')
@ -20,19 +60,17 @@ module.exports = new Class
else else
newValue = this.node.value; newValue = this.node.value;
this.valueChanged (newValue); this.valueChanged(newValue);
} }
,putValue: function (value) ,putValue: function(value) {
{
if (!value) if (!value)
this.node.value = ''; this.node.value = '';
else else
this.node.value = value; this.node.value = value;
} }
,setEditable: function (editable) ,setEditable: function(editable) {
{
this.node.readOnly = !editable; this.node.readOnly = !editable;
} }
}); });

297
js/htk/grid.js
View File

@ -1,8 +1,7 @@
var Widget = require ('./widget'); var Widget = require('./widget');
module.exports = new Class module.exports = new Class({
({
Extends: Widget Extends: Widget
,Tag: 'htk-grid' ,Tag: 'htk-grid'
,Child: 'model' ,Child: 'model'
@ -14,9 +13,8 @@ module.exports = new Class
model: model:
{ {
type: Db.Model type: Db.Model
,set: function (x) ,set: function(x) {
{ this.link({_model: x},
this.link ({_model: x},
{ {
'status-changed': this.onModelChange 'status-changed': this.onModelChange
,'row-deleted': this.onRowDelete ,'row-deleted': this.onRowDelete
@ -25,14 +23,13 @@ module.exports = new Class
,'updatable-changed': this.onUpdatableChange ,'updatable-changed': this.onUpdatableChange
}); });
var set = new Db.SimpleIterator ({model: x}); var set = new Db.SimpleIterator({model: x});
this.link ({_set: set}); this.link({_set: set});
this.onUpdatableChange (); this.onUpdatableChange();
this.onModelChange (); this.onModelChange();
} }
,get: function () ,get: function() {
{
return this._model; return this._model;
} }
}, },
@ -50,13 +47,11 @@ module.exports = new Class
showHeader: showHeader:
{ {
type: Boolean type: Boolean
,set: function (x) ,set: function(x) {
{
this._showHeader = x; this._showHeader = x;
this.thead.style.display = x ? 'table-header-group' : 'none'; this.thead.style.display = x ? 'table-header-group' : 'none';
} }
,get: function () ,get: function() {
{
return this._showHeader; return this._showHeader;
} }
} }
@ -64,209 +59,180 @@ module.exports = new Class
,_model: null ,_model: null
,_set: null ,_set: null
,columns: new Array () ,columns: new Array()
,internalColumn: null ,internalColumn: null
,internalColumns: 0 ,internalColumns: 0
,sortColumn: -1 ,sortColumn: -1
,sortWay: null ,sortWay: null
,_showHeader: true ,_showHeader: true
,render: function () ,render: function() {
{ var table = this.createRoot('table');
var table = this.createRoot ('table');
table.className = 'htk-grid'; table.className = 'htk-grid';
var thead = this.createElement ('thead'); var thead = this.createElement('thead');
table.appendChild (thead); table.appendChild(thead);
this.thead = this.createElement ('tr') this.thead = this.createElement('tr')
thead.appendChild (this.thead); thead.appendChild(this.thead);
this.tbody = this.createElement ('tbody'); this.tbody = this.createElement('tbody');
table.appendChild (this.tbody); table.appendChild(this.tbody);
} }
,appendChild: function (child) ,appendChild: function(child) {
{ this.appendColumn(child);
this.appendColumn (child);
} }
,removeClicked: function (column, value, row) ,removeClicked: function(column, value, row) {
{ if (confirm(_('ReallyDelete')))
if (confirm (_('ReallyDelete'))) this._model.deleteRow(row);
this._model.deleteRow (row);
} }
,onRowDelete: function (model, row) ,onRowDelete: function(model, row) {
{
var tableRows = this.tbody.childNodes; var tableRows = this.tbody.childNodes;
this.tbody.removeChild (tableRows[row]); this.tbody.removeChild(tableRows[row]);
for (var i = row; i < tableRows.length; i++) for (var i = row; i < tableRows.length; i++)
tableRows[i].className = (i % 2) ? 'pair-row' : ''; tableRows[i].className = (i % 2) ? 'pair-row' : '';
this.showNoRecordsFound (); this.showNoRecordsFound();
} }
,onRowInsert: function (model) ,onRowInsert: function() {
{ this.buildRow(1);
this.buildRow (1);
} }
,renderCell: function (row, column, tr) ,renderCell: function(row, column, tr) {
{
if (column.columnIndex != -1) if (column.columnIndex != -1)
column.value = this._model.data[row][column.columnIndex]; column.value = this._model.data[row][column.columnIndex];
if (column.renderer) if (column.renderer) {
{
this._set.row = row; this._set.row = row;
column.renderer (column, this._set); column.renderer(column, this._set);
} }
return column.render (tr); return column.render(tr);
} }
,refreshRow: function (row, columns) ,refreshRow: function(row, columns) {
{
var x = this.columns; var x = this.columns;
var tr = this.tbody.childNodes[row]; var tr = this.tbody.childNodes[row];
for (var i = 0; i < x.length; i++) for (var i = 0; i < x.length; i++)
if (x[i].renderer || columns.indexOf (x[i].columnIndex) != -1) if (x[i].renderer || columns.indexOf(x[i].columnIndex) != -1) {
{ var cell = this.renderCell(row, x[i], tr);
var cell = this.renderCell (row, x[i], tr); tr.replaceChild(cell, tr.childNodes[i]);
tr.replaceChild (cell, tr.childNodes[i]);
} }
} }
,onRowUpdate: function (model, row, columns) ,onRowUpdate: function(model, row, columns) {
{ this.refreshRow(row, columns);
this.refreshRow (row, columns);
} }
,buildRow: function (count) ,buildRow: function(count) {
{ for (var i = 0; i < count; i++) {
for (var i = 0; i < count; i++) var tr = this.createElement('tr');
{
var tr = this.createElement ('tr');
if (i % 2) if (i % 2)
tr.className = 'pair-row'; tr.className = 'pair-row';
for (var j = 0; j < this.columns.length; j++) for (var j = 0; j < this.columns.length; j++) {
{ var cell = this.renderCell(i, this.columns[j], tr);
var cell = this.renderCell (i, this.columns[j], tr); tr.appendChild(cell);
tr.appendChild (cell);
} }
this.tbody.appendChild (tr); this.tbody.appendChild(tr);
} }
} }
,onUpdatableChange: function () ,onUpdatableChange: function() {
{ if (this._model && this._model.updatable) {
if (this._model && this._model.updatable) if (!this.internalColumn) {
{ this.internalColumn = new Htk.ColumnButton({
if (!this.internalColumn)
{
this.internalColumn = new Htk.ColumnButton
({
icon: 'delete' icon: 'delete'
,tip: _('Remove') ,tip: _('Remove')
}); });
this.internalColumn.on ('clicked', this.removeClicked, this); this.internalColumn.on('clicked', this.removeClicked, this);
this.insertInternalColumn (0, this.internalColumn); this.insertInternalColumn(0, this.internalColumn);
} }
} } else if (this.internalColumn) {
else if (this.internalColumn)
{
this.internalColumn = null; this.internalColumn = null;
this.removeInternalColumn (0); this.removeInternalColumn(0);
} }
} }
,onModelChange: function () ,onModelChange: function() {
{
var emptyMessage = this.emptyMessage ? var emptyMessage = this.emptyMessage ?
this.emptyMessage : _('NoData'); this.emptyMessage : _('NoData');
if (!this._model) if (!this._model) {
{ this.showMessage(emptyMessage, 'refresh');
this.showMessage (emptyMessage, 'refresh.svg');
return; return;
} }
this._node.removeChild (this.tbody); this._node.removeChild(this.tbody);
this.tbody = this.createElement ('tbody'); this.tbody = this.createElement('tbody');
switch (this._model.status) switch (this._model.status) {
{
case Db.Model.Status.READY: case Db.Model.Status.READY:
{ {
for (var i = 0; i < this.columns.length; i++) for (var i = 0; i < this.columns.length; i++)
this.columns[i].updateColumnIndex (this._model); this.columns[i].updateColumnIndex(this._model);
this.buildRow (this._model.numRows); this.buildRow(this._model.numRows);
this.showNoRecordsFound (); this.showNoRecordsFound();
break; break;
} }
case Db.Model.Status.LOADING: case Db.Model.Status.LOADING:
this.showMessage (_('Loading'), null); this.showMessage(_('Loading'), null);
break; break;
case Db.Model.Status.CLEAN: case Db.Model.Status.CLEAN:
this.showMessage (emptyMessage, 'refresh'); this.showMessage(emptyMessage, 'refresh');
break; break;
case Db.Model.Status.ERROR: case Db.Model.Status.ERROR:
this.showMessage (_('ErrorLoadingData'), 'error'); this.showMessage(_('ErrorLoadingData'), 'error');
break; break;
} }
this._node.appendChild (this.tbody); this._node.appendChild(this.tbody);
} }
,showNoRecordsFound: function () ,showNoRecordsFound: function() {
{
if (this._model.numRows == 0) if (this._model.numRows == 0)
this.showMessage (_('EmptyList'), 'clean'); this.showMessage(_('EmptyList'), 'block');
} }
,showMessage: function (message, src) ,showMessage: function(message, src) {
{
if (this.columns.length == 0) if (this.columns.length == 0)
return; return;
var tr = this.createElement ('tr'); var tr = this.createElement('tr');
this.tbody.appendChild (tr); this.tbody.appendChild(tr);
var td = this.createElement ('td'); var td = this.createElement('td');
td.className = 'message'; td.className = 'message';
td.colSpan = this.columns.length; td.colSpan = this.columns.length;
tr.appendChild (td); tr.appendChild(td);
if (src) if (src) {
{ const icon = new Htk.Icon({
var img = this.createElement ('img'); name: src
img.alt = ''; });
img.src = 'image/icon/light/'+ src +'.svg'; td.appendChild(icon.node);
td.appendChild (img); } else {
} var spinner = new Htk.Spinner();
else spinner.start();
{ td.appendChild(spinner.node);
var spinner = new Htk.Spinner ();
spinner.start ();
td.appendChild (spinner.node);
} }
var message = this.createTextNode (message); var message = this.createTextNode(message);
td.appendChild (message); td.appendChild(message);
} }
,scrollToRow: function (row) ,scrollToRow: function(row) {
{ if (row >= 0) {
if (row >= 0) var height = parseInt(this.tr.style.height);
{
var height = parseInt (this.tr.style.height);
this.node.scrollTop = (row - 2) * height; this.node.scrollTop = (row - 2) * height;
if (this.selectedRow) if (this.selectedRow)
@ -277,12 +243,10 @@ module.exports = new Class
} }
} }
,sortModel: function (column) ,sortModel: function(column) {
{
var columnIndex = column.columnIndex; var columnIndex = column.columnIndex;
if (this._model && columnIndex != -1) if (this._model && columnIndex != -1) {
{
if (this.sortColumn === columnIndex if (this.sortColumn === columnIndex
&& this.sortWay === Db.Model.SortWay.ASC) && this.sortWay === Db.Model.SortWay.ASC)
this.sortWay = Db.Model.SortWay.DESC; this.sortWay = Db.Model.SortWay.DESC;
@ -291,112 +255,99 @@ module.exports = new Class
this.sortColumn = columnIndex; this.sortColumn = columnIndex;
this._model.sort (columnIndex, this.sortWay); this._model.sort(columnIndex, this.sortWay);
} }
} }
,columnChanged: function (column, row, newValue) ,columnChanged: function(column, row, newValue) {
{
var columnIndex = column.columnIndex; var columnIndex = column.columnIndex;
if (columnIndex != -1) if (columnIndex != -1)
this._model.setByIndex (row, columnIndex, newValue); this._model.setByIndex(row, columnIndex, newValue);
} }
,addColumn: function (pos, column) ,addColumn: function(pos, column) {
{ var header = column.renderHeader();
var header = column.renderHeader ();
if (pos == -1 || pos >= this.columns.length) if (pos == -1 || pos >= this.columns.length) {
{ pos = this.columns.push(column) - 1;
pos = this.columns.push (column) - 1; this.thead.appendChild(header);
this.thead.appendChild (header); } else {
} this.columns.splice(pos, 0, column);
else this.thead.insertBefore(header, this.thead.childNodes[pos]);
{
this.columns.splice (pos, 0, column);
this.thead.insertBefore (header, this.thead.childNodes[pos]);
} }
header.addEventListener ('click', header.addEventListener('click',
this.sortModel.bind (this, column)); this.sortModel.bind(this, column));
header.title = _('Sort'); header.title = _('Sort');
column.on ('changed', this.columnChanged, this); column.on('changed', this.columnChanged, this);
var rows = this.tbody.childNodes; var rows = this.tbody.childNodes;
if (this._model && this._model.numRows > 0) if (this._model && this._model.numRows > 0)
for (var i = 0; i < rows.length; i++) for (var i = 0; i < rows.length; i++) {
{ var cell = this.renderCell(i, column, rows[i]);
var cell = this.renderCell (i, column, rows[i]); rows[i].insertBefore(cell, rows[i].childNodes[pos+1]);
rows[i].insertBefore (cell, rows[i].childNodes[pos+1]);
} }
return pos; return pos;
} }
,insertInternalColumn: function (pos, column) ,insertInternalColumn: function(pos, column) {
{
if (pos < 0 || pos > this.internalColumns) if (pos < 0 || pos > this.internalColumns)
pos = this.internalColumns; pos = this.internalColumns;
this.internalColumns++; this.internalColumns++;
return this.addColumn (pos, column); return this.addColumn(pos, column);
} }
,insertColumn: function (pos, column) ,insertColumn: function(pos, column) {
{
if (pos > 0) if (pos > 0)
pos += this.internalColumns; pos += this.internalColumns;
return this.addColumn (pos, column) - this.internalColumns; return this.addColumn(pos, column) - this.internalColumns;
} }
,appendColumn: function (column) ,appendColumn: function(column) {
{ return this.insertColumn(-1, column);
return this.insertColumn (-1, column);
} }
,deleteColumn: function (pos) ,deleteColumn: function(pos) {
{
if (pos < 0 || pos >= this.columns.length) if (pos < 0 || pos >= this.columns.length)
return; return;
this.columns.splice (pos, 1); this.columns.splice(pos, 1);
this.thead.removeChild (this.thead.childNodes[pos]); this.thead.removeChild(this.thead.childNodes[pos]);
var rows = this.tbody.childNodes; var rows = this.tbody.childNodes;
if (this._model && this._model.numRows > 0) if (this._model && this._model.numRows > 0)
for (var i = 0; i < rows.length; i++) for (var i = 0; i < rows.length; i++)
rows[i].removeChild (rows[i].childNodes[pos]); rows[i].removeChild(rows[i].childNodes[pos]);
} }
,removeInternalColumn: function (pos) ,removeInternalColumn: function(pos) {
{
if (this.internalColumns == 0) if (this.internalColumns == 0)
return; return;
if (pos < 0 || pos > this.internalColumns) if (pos < 0 || pos > this.internalColumns)
pos = this.internalColumns; pos = this.internalColumns;
this.deleteColumn (pos); this.deleteColumn(pos);
this.internalColumns--; this.internalColumns--;
} }
,removeColumn: function (pos) ,removeColumn: function(pos) {
{
if (pos > 0) if (pos > 0)
pos += this.internalColumns; pos += this.internalColumns;
this.deleteColumn (pos); this.deleteColumn(pos);
} }
,reloadModel: function () ,reloadModel: function() {
{
if (this._model != null) if (this._model != null)
this.onModelChange (); this.onModelChange();
} }
}); });

90
js/htk/htk.js
View File

@ -1,54 +1,54 @@
require ('db/db'); require('db/db');
require ('./style.css'); require('./style.scss');
Htk = module.exports = { Htk = module.exports = {
NodeBuilder : require ('./node-builder') NodeBuilder : require('./node-builder')
,Widget : require ('./widget') ,Widget : require('./widget')
,Component : require ('./component') ,Component : require('./component')
,Popup : require ('./popup') ,Popup : require('./popup')
,Dialog : require ('./dialog') ,Dialog : require('./dialog')
,Toast : require ('./toast') ,Toast : require('./toast')
,Repeater : require ('./repeater') ,Repeater : require('./repeater')
,Grid : require ('./grid') ,Grid : require('./grid')
,Spinner : require ('./spinner') ,Spinner : require('./spinner')
,Icon : require ('./icon') ,Icon : require('./icon')
,FullImage : require ('./full-image') ,FullImage : require('./full-image')
,ImageEditor : require ('./image-editor') ,ImageEditor : require('./image-editor')
,Assistant : require ('./assistant') ,Assistant : require('./assistant')
,AssistantBar : require ('./assistant-bar') ,AssistantBar : require('./assistant-bar')
,Step : require ('./step') ,Step : require('./step')
,Loader : require ('./loader') ,Loader : require('./loader')
,Field : require ('./field') ,Field : require('./field')
,Column : require ('./column') ,Column : require('./column')
}; };
var Fields = { var Fields = {
Text : require ('./field/text') Text : require('./field/text')
,Html : require ('./field/html') ,Html : require('./field/html')
,Entry : require ('./field/entry') ,Entry : require('./field/entry')
,RadioGroup : require ('./field/radio-group') ,RadioGroup : require('./field/radio-group')
,Radio : require ('./field/radio') ,Radio : require('./field/radio')
,Label : require ('./field/label') ,Label : require('./field/label')
,TextArea : require ('./field/text-area') ,TextArea : require('./field/text-area')
,Spin : require ('./field/spin') ,Spin : require('./field/spin')
,Check : require ('./field/check') ,Check : require('./field/check')
,Select : require ('./field/select') ,Select : require('./field/select')
,Calendar : require ('./field/calendar') ,Calendar : require('./field/calendar')
,DateChooser : require ('./field/date-chooser') ,DateChooser : require('./field/date-chooser')
,Image : require ('./field/image') ,Image : require('./field/image')
,Button : require ('./field/button') ,Button : require('./field/button')
,BarButton : require ('./field/bar-button') ,BarButton : require('./field/bar-button')
,Table : require ('./field/table') ,Table : require('./field/table')
,SearchEntry : require ('./field/search-entry') ,SearchEntry : require('./field/search-entry')
,ColumnButton : require ('./column/button') ,ColumnButton : require('./column/button')
,ColumnLink : require ('./column/link') ,ColumnLink : require('./column/link')
,ColumnDate : require ('./column/date') ,ColumnDate : require('./column/date')
,ColumnImage : require ('./column/image') ,ColumnImage : require('./column/image')
,ColumnRadio : require ('./column/radio') ,ColumnRadio : require('./column/radio')
,ColumnSpin : require ('./column/spin') ,ColumnSpin : require('./column/spin')
,ColumnText : require ('./column/text') ,ColumnText : require('./column/text')
,ColumnCheck : require ('./column/check') ,ColumnCheck : require('./column/check')
}; };
for (var field in Fields) for (var field in Fields)

48
js/htk/icon.js
View File

@ -1,48 +1,38 @@
var Widget = require ('./widget'); var Widget = require('./widget');
module.exports = new Class module.exports = new Class({
({
Extends: Widget Extends: Widget
,Tag: 'htk-icon' ,Tag: 'htk-icon'
,Properties: ,Properties:
{ {
icon: name: {
{
type: String type: String
,set: function (x) ,set: function(x) {
{
this._icon = x; this._icon = x;
this._setIcon (); this._setIcon();
} }
,get: function () ,get: function() {
{
return this._icon; return this._icon;
} }
}, },
theme: theme: {
{
type: String type: String
,set: function (x) ,set: function(x) {
{
this._theme = x; this._theme = x;
this._setIcon (); this._setIcon();
} }
,get: function () ,get: function() {
{
return this._theme; return this._theme;
} }
}, },
alt: alt: {
{
type: String type: String
,set: function (x) ,set: function(x) {
{
this.node.alt = x; this.node.alt = x;
} }
,get: function () ,get: function() {
{
return this.node.alt; return this.node.alt;
} }
} }
@ -50,14 +40,12 @@ module.exports = new Class
,_icon: null ,_icon: null
,render: function () ,render: function() {
{ const node = this.createRoot('span');
this.createRoot ('img'); node.className = 'material-symbols-rounded icon';
} }
,_setIcon: function () ,_setIcon: function() {
{ this.node.innerText = this._icon;
var theme = this._theme ? this._theme : 'light';
this.node.src = 'image/icon/'+ theme +'/'+ this._icon +'.svg';
} }
}); });

7
js/htk/image-editor.js
View File

@ -1,7 +1,7 @@
var Component = require('./component'); var Component = require('./component');
var Toast = require('./toast'); var Toast = require('./toast');
var Tpl = require('./image-editor.xml'); var Tpl = require('./image-editor.xml').default;
/** /**
* A form to handle the image database, it allows to add new images or * A form to handle the image database, it allows to add new images or
@ -22,8 +22,9 @@ module.exports = new Class({
this.builderInitString(Tpl); this.builderInitString(Tpl);
var self = this; var self = this;
this.$('form').onsubmit = function() this.$('form').onsubmit = function() {
{ self._onSubmit(); return false; }; self._onSubmit(); return false;
};
this.parent(props); this.parent(props);
}, },

184
js/htk/repeater.js
View File

@ -1,8 +1,7 @@
var Widget = require ('./widget'); var Widget = require('./widget');
module.exports = new Class module.exports = new Class({
({
Extends: Widget Extends: Widget
,Tag: 'htk-repeater' ,Tag: 'htk-repeater'
,Child: 'model' ,Child: 'model'
@ -14,9 +13,8 @@ module.exports = new Class
model: model:
{ {
type: Db.Model type: Db.Model
,set: function (x) ,set: function(x) {
{ this.link({_model: x},
this.link ({_model: x},
{ {
'status-changed': this._onModelChange 'status-changed': this._onModelChange
,'row-deleted': this._onRowDelete ,'row-deleted': this._onRowDelete
@ -24,10 +22,9 @@ module.exports = new Class
,'row-inserted': this._onRowInsert ,'row-inserted': this._onRowInsert
}); });
this._onModelChange (); this._onModelChange();
} }
,get: function () ,get: function() {
{
this._model; this._model;
} }
} }
@ -37,12 +34,10 @@ module.exports = new Class
,formId: ,formId:
{ {
type: String type: String
,set: function (x) ,set: function(x) {
{
this._formId = x; this._formId = x;
} }
,get: function () ,get: function() {
{
this._formId; this._formId;
} }
} }
@ -53,12 +48,10 @@ module.exports = new Class
,renderer: ,renderer:
{ {
type: Function type: Function
,set: function (x) ,set: function(x) {
{
this._renderer = x; this._renderer = x;
} }
,get: function () ,get: function() {
{
this._renderer; this._renderer;
} }
} }
@ -68,13 +61,11 @@ module.exports = new Class
,showStatus: ,showStatus:
{ {
type: Boolean type: Boolean
,set: function (x) ,set: function(x) {
{
this._showStatus = x; this._showStatus = x;
this._onModelChange(); this._onModelChange();
} }
,get: function () ,get: function() {
{
this._showStatus; this._showStatus;
} }
} }
@ -92,176 +83,157 @@ module.exports = new Class
,_formId: 'form' ,_formId: 'form'
,_showStatus: true ,_showStatus: true
,render: function () ,render: function() {
{ var div = this.createRoot('div');
var div = this.createRoot ('div');
this._container = this.createElement ('div'); this._container = this.createElement('div');
this._container.className = 'htk-repeater'; this._container.className = 'htk-repeater';
div.appendChild (this._container); div.appendChild(this._container);
} }
,loadXml: function (builderResult, node) ,loadXml: function(builderResult, node) {
{ this.parent(builderResult, node);
this.parent (builderResult, node);
var builder = this._builder = new Vn.Builder (); var builder = this._builder = new Vn.Builder();
builder.setParent (builderResult); builder.setParent(builderResult);
builder.loadXmlFromNode (node.firstElementChild); builder.loadXmlFromNode(node.firstElementChild);
this._onModelChange (); this._onModelChange();
} }
,getChild: function (index) ,getChild: function(index) {
{
return this._container.childNodes[index]; return this._container.childNodes[index];
} }
,getBuilder: function (index) ,getBuilder: function(index) {
{
return this._childsData[index].builder; return this._childsData[index].builder;
} }
,getForm: function (index) ,getForm: function(index) {
{
return this._childsData[index].set; return this._childsData[index].set;
} }
,_buildBox: function (index) ,_buildBox: function(index) {
{ var set = new Db.SimpleIterator({
var set = new Db.SimpleIterator ({
model: this._model, model: this._model,
row: index row: index
}); });
this._builder.add (this._formId, set); this._builder.add(this._formId, set);
var res = this._builder.load (); var res = this._builder.load();
res.link (); res.link();
this._childsData.push ({ this._childsData.push({
builder: res, builder: res,
set: set set: set
}); });
if (this._renderer) if (this._renderer)
this._renderer (res, set); this._renderer(res, set);
return res.getMain (); return res.getMain();
} }
,_onModelChange: function () ,_onModelChange: function() {
{
if (!this._model || !this._builder) if (!this._model || !this._builder)
return; return;
this.node.removeChild (this._container); this.node.removeChild(this._container);
Vn.Node.removeChilds (this._container); Vn.Node.removeChilds(this._container);
this._freeChildsData (); this._freeChildsData();
this._childsData = []; this._childsData = [];
switch (this._model.status) switch (this._model.status) {
{
case Db.Model.Status.READY: case Db.Model.Status.READY:
{ {
for (var i = 0; i < this._model.numRows; i++) for (var i = 0; i < this._model.numRows; i++)
this._container.appendChild (this._buildBox (i)); this._container.appendChild(this._buildBox(i));
this._showNoRecordsFound (); this._showNoRecordsFound();
break; break;
} }
case Db.Model.Status.LOADING: case Db.Model.Status.LOADING:
this._showMessage (_('Loading'), null); this._showMessage(_('Loading'), null);
break; break;
case Db.Model.Status.CLEAN: case Db.Model.Status.CLEAN:
{ {
var emptyMessage = this.emptyMessage ? var emptyMessage = this.emptyMessage ?
this.emptyMessage : _('NoData'); this.emptyMessage : _('NoData');
this._showMessage (emptyMessage, 'refresh'); this._showMessage(emptyMessage, 'refresh');
break; break;
} }
case Db.Model.Status.ERROR: case Db.Model.Status.ERROR:
this._showMessage (_('ErrorLoadingData'), 'error'); this._showMessage(_('ErrorLoadingData'), 'error');
break; break;
} }
this.node.appendChild (this._container); this.node.appendChild(this._container);
this.signalEmit ('change'); this.signalEmit('change');
} }
,_showNoRecordsFound: function () ,_showNoRecordsFound: function() {
{
if (this._model.numRows === 0) if (this._model.numRows === 0)
this._showMessage (_('EmptyList'), 'clean'); this._showMessage(_('EmptyList'), 'block');
} }
,_showMessage: function (message, src) ,_showMessage: function(message, src) {
{
if (!this._showStatus) if (!this._showStatus)
return; return;
var div = this.createElement ('div'); var div = this.createElement('div');
div.className = 'message'; div.className = 'message';
this._container.appendChild (div); this._container.appendChild(div);
if (src) if (src) {
{ const icon = new Htk.Icon({
var img = this.createElement ('img'); name: src
img.alt = ''; });
img.src = 'image/icon/light/'+ src +'.svg'; div.appendChild(icon.node);
div.appendChild (img); } else {
} var spinner = new Htk.Spinner();
else spinner.start();
{ div.appendChild(spinner.node);
var spinner = new Htk.Spinner ();
spinner.start ();
div.appendChild (spinner.node);
} }
div.appendChild (this.createTextNode (message)); div.appendChild(this.createTextNode(message));
} }
,_onRowDelete: function (model, row) ,_onRowDelete: function(model, row) {
{ Vn.Node.remove(this._container.childNodes[row]);
Vn.Node.remove (this._container.childNodes[row]); this._unrefChildData(row);
this._unrefChildData (row); this._childsData.splice(row, 1);
this._childsData.splice (row, 1);
for (var i = row; i < this._model.numRows; i++) for (var i = row; i < this._model.numRows; i++)
this._childsData[i].set.row = i; this._childsData[i].set.row = i;
this._showNoRecordsFound (); this._showNoRecordsFound();
} }
,_onRowUpdate: function (model, row) ,_onRowUpdate: function(model, row) {
{ this._childsData[row].set.iterChanged();
this._childsData[row].set.iterChanged ();
} }
,_onRowInsert: function (model, row) ,_onRowInsert: function(model, row) {
{ var box = this._buildBox(row);
var box = this._buildBox (row); this._container.appendChild(box);
this._container.appendChild (box);
} }
,_freeChildsData: function () ,_freeChildsData: function() {
{
if (this._childsData) if (this._childsData)
for (var i = 0; i < this._childsData.length; i++) for (var i = 0; i < this._childsData.length; i++)
this._unrefChildData (i); this._unrefChildData(i);
} }
,_unrefChildData: function (index) ,_unrefChildData: function(index) {
{
var childData = this._childsData[index]; var childData = this._childsData[index];
childData.set.unref (); childData.set.unref();
childData.builder.unref (); childData.builder.unref();
} }
,destroy: function () ,destroy: function() {
{ this._freeChildsData();
this._freeChildsData (); this.parent();
this.parent ();
} }
}); });

541
js/htk/style.css → js/htk/style.scss
View File

@ -1,110 +1,105 @@
/* Grid */ /* Grid */
.htk-grid .htk-grid {
{
margin: auto; margin: auto;
border-collapse: collapse; border-collapse: collapse;
& > thead > tr,
& > tfoot > tr {
background-color: #8cc63f;
vertical-align: middle;
height: 3em;
}
th {
color: white;
cursor: pointer;
font-weight: normal;
padding: 0 0.4em;
}
th:hover {
background-color: rgba(1, 1, 1, 0.2);
}
tr {
height: 3.5em;
}
& > tfoot a,
& > thead a {
color: black;
}
tr.pair-row {
background-color: transparent;
}
& > tbody tr {
border-top: 1px solid #DDD;
}
& > tbody tr:first-child {
border-top: none;
}
& > tbody td {
margin: 0;
padding: 0 0.5em;
}
th,
td {
text-align: left;
}
td:first-child,
th:first-child {
padding-left: 1em;
}
td:last-child,
th:last-child {
padding-right: 1em;
}
.message {
padding: 1.5em;
text-align: center;
}
.message > * {
display: inline-block;
vertical-align: middle;
padding-right: .8em;
}
} }
.htk-grid > thead > tr,
.htk-grid > tfoot > tr /* Repater */
{
background-color: #009688; .htk-repeater {
vertical-align: middle; & > .message {
height: 3em; padding: 1.5em;
} text-align: center;
.htk-grid th
{ & > * {
color: white; vertical-align: middle;
cursor: pointer; }
font-weight: normal; & > span,
padding: 0 0.4em; & > .htk-spinner {
} display: inline-block;
.htk-grid th:hover padding-right: 10px;
{ }
background-color: rgba(1, 1, 1, 0.2); }
}
.htk-grid tr
{
height: 3.5em;
}
.htk-grid > tfoot a,
.htk-grid > thead a
{
color: black;
}
.htk-grid tr.pair-row
{
background-color: transparent;
}
.htk-grid > tbody tr
{
border-top: 1px solid #DDD;
}
.htk-grid > tbody tr:first-child
{
border-top: none;
}
.htk-grid > tbody td
{
margin: 0;
padding: 0 0.5em;
}
.htk-grid th,
.htk-grid td
{
text-align: left;
}
.htk-grid td:first-child,
.htk-grid th:first-child
{
padding-left: 1em;
}
.htk-grid td:last-child,
.htk-grid th:last-child
{
padding-right: 1em;
}
.htk-grid .message
{
padding: 1.5em;
text-align: center;
}
.htk-grid .message > *
{
display: inline-block;
vertical-align: middle;
padding-right: 0.8em;
}
.htk-grid .message > img
{
height: 1.8em;
} }
/* Grid cells */ /* Grid cells */
th.cell-spin th.cell-spin {
{
text-align: right; text-align: right;
} }
td.cell-spin td.cell-spin {
{
width: 2.5em; width: 2.5em;
text-align: right; text-align: right;
} }
th.cell-check, th.cell-check,
th.cell-radio th.cell-radio {
{
text-align: center; text-align: center;
} }
td.cell-button td.cell-button {
{
max-width: 1em; max-width: 1em;
text-align: center; text-align: center;
} }
td.cell-button > button, td.cell-button > button,
td.cell-button > a td.cell-button > a {
{
display: inline-block; display: inline-block;
margin: 0 auto; margin: 0 auto;
padding: .5em; padding: .5em;
@ -114,24 +109,20 @@ td.cell-button > a
box-sizing: border-box; box-sizing: border-box;
} }
td.cell-button > button:hover, td.cell-button > button:hover,
td.cell-button > a:hover td.cell-button > a:hover {
{
background-color: rgba(1, 1, 1, 0.1); background-color: rgba(1, 1, 1, 0.1);
} }
td.cell-button img td.cell-button img {
{
height: 1.5em; height: 1.5em;
width: 1.5em; width: 1.5em;
display: block; display: block;
margin: auto; margin: auto;
padding: 0; padding: 0;
} }
td.cell-image td.cell-image {
{
text-align: center; text-align: center;
} }
td.cell-image .htk-image td.cell-image .htk-image {
{
max-width: 2.5em; max-width: 2.5em;
max-height: 2.5em; max-height: 2.5em;
display: block; display: block;
@ -140,35 +131,29 @@ td.cell-image .htk-image
/* Select */ /* Select */
.htk-select .htk-select {
{
width: 100%; width: 100%;
height: 2em; height: 2em;
text-align: left; text-align: left;
} }
.htk-select-menu .htk-select-menu {
{
height: 100%; height: 100%;
max-height: 80em; max-height: 80em;
overflow: auto; overflow: auto;
min-width: 14em; min-width: 14em;
} }
.htk-select-menu tbody > tr .htk-select-menu tbody > tr {
{
border-top: none; border-top: none;
height: 2.5em; height: 2.5em;
} }
.htk-select-menu td.message .htk-select-menu td.message {
{
padding: 1em; padding: 1em;
} }
.htk-select-menu tr:hover .htk-select-menu tr:hover {
{
background-color: rgba(1, 1, 1, 0.1); background-color: rgba(1, 1, 1, 0.1);
cursor: pointer; cursor: pointer;
} }
.htk-select-menu td .htk-select-menu td {
{
max-width: 11em; max-width: 11em;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -177,88 +162,65 @@ td.cell-image .htk-image
/* Button */ /* Button */
.htk-button > span .htk-button {
{ display: flex;
margin-left: .5em; align-items: center;
} border-radius: 2em;
font-weight: bold;
gap: .5em;
padding: 0 .5em;
/* Repater */ & > span.icon {
display: block;
.htk-repeater > .message }
{
padding: 1.5em;
text-align: center;
}
.htk-repeater > .message > *
{
vertical-align: middle;
}
.htk-repeater > .message > img,
.htk-repeater > .message > .htk-spinner
{
display: inline-block;
padding-right: .8em;
height: 1.8em;
} }
/* Calendar */ /* Calendar */
.htk-calendar .htk-calendar {
{
width: 20em; width: 20em;
background-color: white; background-color: white;
border: none; border: none;
border-radius: .5em; border-radius: .5em;
} }
.htk-calendar table .htk-calendar table {
{
border-collapse: collapse; border-collapse: collapse;
} }
.htk-calendar thead tr, .htk-calendar thead tr,
.htk-calendar tfoot tr .htk-calendar tfoot tr {
{ background-color: #888;
background-color: #8cc63f;
color: white; color: white;
font-weight: normal; font-weight: normal;
vertical-align: middle; vertical-align: middle;
text-align: center; text-align: center;
height: 3em; height: 3em;
} }
.htk-calendar thead span .htk-calendar thead span {
{
color: white; color: white;
} }
.htk-calendar thead tr .htk-calendar thead tr {
{
border-bottom: none; border-bottom: none;
} }
.htk-calendar tfoot tr .htk-calendar tfoot tr {
{
border-top: none; border-top: none;
} }
.htk-calendar th.button .htk-calendar th.button {
{
display: table-cell; display: table-cell;
} }
.htk-calendar th.button:hover .htk-calendar th.button:hover {
{
cursor: pointer; cursor: pointer;
background-color: rgba(1, 1, 1, 0.2); background-color: rgba(1, 1, 1, 0.2);
} }
.htk-calendar col .htk-calendar col {
{
width: 14.2%; width: 14.2%;
} }
.htk-calendar tr .htk-calendar tr {
{
height: 2em; height: 2em;
} }
.htk-calendar tbody td .htk-calendar tbody td {
{
text-align: right; text-align: right;
} }
.htk-calendar tbody td > div .htk-calendar tbody td > div {
{
height: 2em; height: 2em;
width: 2em; width: 2em;
line-height: 2em; line-height: 2em;
@ -268,47 +230,39 @@ td.cell-image .htk-image
margin: 0 auto; margin: 0 auto;
color: #555; color: #555;
} }
.htk-calendar div.disabled .htk-calendar div.disabled {
{
color: #999; color: #999;
} }
.htk-calendar div.today .htk-calendar div.today {
{
font-weight: bold; font-weight: bold;
color: black; color: black;
} }
.htk-calendar div.selected .htk-calendar div.selected {
{
color: white; color: white;
background-color: #009688; background-color: #8cc63f;
} }
.htk-calendar div.enabled:hover .htk-calendar div.enabled:hover {
{
cursor: pointer; cursor: pointer;
background-color: #008678; background-color: rgba(140, 198, 63, 0.8);
color: white; color: white;
} }
/* Image */ /* Image */
.htk-image .htk-image {
{
position: relative; position: relative;
overflow: hidden; overflow: hidden;
} }
.htk-image.clickable:hover .htk-image.clickable:hover {
{
cursor: pointer; cursor: pointer;
opacity: 0.85; opacity: 0.85;
} }
.htk-image > img .htk-image > img {
{
display: block; display: block;
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
.htk-image > button .htk-image > button {
{
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
@ -316,12 +270,10 @@ td.cell-image .htk-image
padding: .15em; padding: .15em;
display: none; display: none;
} }
.htk-image:hover > button .htk-image:hover > button {
{
display: block; display: block;
} }
.htk-image > button > img .htk-image > button > img {
{
display: block; display: block;
height: 1.2em; height: 1.2em;
height: 1.2em; height: 1.2em;
@ -329,13 +281,11 @@ td.cell-image .htk-image
/* Full image */ /* Full image */
.htk-full-image img .htk-full-image img {
{
display: block; display: block;
cursor: pointer; cursor: pointer;
} }
.htk-full-image .htk-spinner .htk-full-image .htk-spinner {
{
background-color: #FFF; background-color: #FFF;
margin: .6em; margin: .6em;
display: block; display: block;
@ -343,14 +293,12 @@ td.cell-image .htk-image
/* Image editor */ /* Image editor */
.htk-image-editor .htk-image-editor {
{
width: 18em; width: 18em;
margin: 0 auto; margin: 0 auto;
padding: 1.5em; padding: 1.5em;
} }
.htk-image-editor h2 .htk-image-editor h2 {
{
color: white; color: white;
background-color: #009688; background-color: #009688;
text-align: left; text-align: left;
@ -360,30 +308,25 @@ td.cell-image .htk-image
padding: 0.6em 0.8em; padding: 0.6em 0.8em;
margin: 0; margin: 0;
} }
.htk-image-editor iframe .htk-image-editor iframe {
{
display: none; display: none;
} }
.htk-image-editor .footer .htk-image-editor .footer {
{
margin-top: 2em; margin-top: 2em;
} }
.htk-image-editor .footer > .htk-spinner .htk-image-editor .footer > .htk-spinner {
{
padding-right: 1.2em; padding-right: 1.2em;
height: 1.3em; height: 1.3em;
width: 1.3em; width: 1.3em;
} }
.htk-image-editor .footer > .htk-spinner, .htk-image-editor .footer > .htk-spinner,
.htk-image-editor .footer > input .htk-image-editor .footer > input {
{
float: right; float: right;
} }
/* Toast */ /* Toast */
.htk-toast .htk-toast {
{
z-index: 210; z-index: 210;
display: block; display: block;
position: fixed; position: fixed;
@ -396,8 +339,7 @@ td.cell-image .htk-image
max-height: 40em; max-height: 40em;
overflow: visible; overflow: visible;
} }
.htk-toast > div .htk-toast > div {
{
margin: .5em 0; margin: .5em 0;
padding: .5em 2%; padding: .5em 2%;
border-radius: 0.1em; border-radius: 0.1em;
@ -412,32 +354,27 @@ td.cell-image .htk-image
transition-duration: 200ms; transition-duration: 200ms;
transition-timing-function: ease-out; transition-timing-function: ease-out;
} }
.htk-toast > div.show .htk-toast > div.show {
{
opacity: 1; opacity: 1;
transform: translateZ(0) translateY(0em); transform: translateZ(0) translateY(0em);
-webkit-transform: translateZ(0) translateY(0em); -webkit-transform: translateZ(0) translateY(0em);
} }
.htk-toast > .message .htk-toast > .message {
{
background-color: #BBFFBB; background-color: #BBFFBB;
color: #363; color: #363;
} }
.htk-toast > .warning .htk-toast > .warning {
{
background-color: #FFE0B2; background-color: #FFE0B2;
color: #C30; color: #C30;
} }
.htk-toast > .error .htk-toast > .error {
{
background-color: #FFCDD2; background-color: #FFCDD2;
color: #A00; color: #A00;
} }
/* Popup */ /* Popup */
.htk-background .htk-background {
{
position: fixed; position: fixed;
left: 0; left: 0;
right: 0; right: 0;
@ -448,55 +385,47 @@ td.cell-image .htk-image
opacity: 0; opacity: 0;
transition: opacity 200ms ease-in-out; transition: opacity 200ms ease-in-out;
} }
.htk-popup .htk-popup {
{
z-index: 200; z-index: 200;
display: block; display: block;
position: fixed; position: fixed;
overflow: hidden; overflow: hidden;
background-color: white; background-color: white;
border-radius: 0.15em; border-radius: 10px;
box-shadow: 0 0 0.4em rgba(1, 1, 1, 0.6); box-shadow: 0 0 0.4em rgba(1, 1, 1, 0.6);
box-sizing: content-box; box-sizing: content-box;
} }
.htk-popup.modal .htk-popup.modal {
{
position: absolute; position: absolute;
font-size: 1.2em; font-size: 1.2em;
top: 50%; top: 50%;
left: 50%; left: 50%;
} }
.htk-popup > * .htk-popup > * {
{
border-radius: 0.1em; border-radius: 0.1em;
} }
/* Dialog */ /* Dialog */
.htk-dialog .htk-dialog {
{
padding: 1.5em; padding: 1.5em;
max-width: 20em; max-width: 20em;
font-weight: normal; font-weight: normal;
color: #555; color: #555;
} }
.htk-dialog p .htk-dialog p {
{
margin: 0; margin: 0;
} }
.htk-dialog img .htk-dialog img {
{
float: left; float: left;
height: 3em; height: 3em;
margin-top: 0; margin-top: 0;
margin-right: 1em; margin-right: 1em;
} }
.htk-dialog p .htk-dialog p {
{
padding: 0; padding: 0;
} }
.htk-dialog .button-bar > button .htk-dialog .button-bar > button {
{
float: right; float: right;
margin-left: 1em; margin-left: 1em;
margin-top: .5em; margin-top: .5em;
@ -504,25 +433,23 @@ td.cell-image .htk-image
/* Assistant */ /* Assistant */
.htk-assistant > div .htk-assistant > div {
{
display: none; display: none;
}
.htk-assistant > div > h2 & > h2 {
{ text-align: center;
text-align: center; font-weight: normal;
font-weight: normal; font-size: 1.5em;
font-size: 1.5em; margin: 0;
margin: 0; padding: 0;
padding: 0; margin-bottom: 1em;
margin-bottom: 1em; font-weight: bold;
font-weight: bold; }
} }
/* Assistant bar */ /* Assistant bar */
.htk-assistant-bar .htk-assistant-bar {
{
position: relative; position: relative;
padding: .8em; padding: .8em;
display: flex; display: flex;
@ -530,100 +457,102 @@ td.cell-image .htk-image
justify-content: space-between; justify-content: space-between;
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
}
.htk-assistant-bar > button
{
border-radius: 50%;
padding: 0;
margin: 0;
}
.htk-assistant-bar > .end
{
display: none;
}
.htk-assistant-bar > button > img
{
display: block;
width: 1.8em;
padding: .5em;
}
.htk-assistant-bar > .steps
{
display: flex;
align-items: center;
}
.htk-assistant-bar > .steps > div {
background-color: #AAA;
width: .5em;
height: .5em;
cursor: pointer;
border-radius: 50%;
margin: .5em;
transition-property: width, height; & > button {
transition-duration: 100ms; border-radius: 50%;
transition-timing-function: ease-in-out; padding: .5em;
} margin: 0;
.htk-assistant-bar > .steps > div.selected { text-align: center;
background-color: #666;
width: 1em; & > img {
height: 1em; display: block;
} width: 1.8em;
.htk-assistant-bar > .steps > div:hover { padding: .5em;
opacity: .7; }
} }
.htk-assistant-bar > .steps > img & > .end {
{ display: none;
width: 1.3em; color: #8cc63f;
margin: 0 .2em;
cursor: pointer; & > .icon {
} font-size: 1.6rem;
.htk-assistant-bar > .steps > img:hover }
{ }
opacity: .7; & > .steps {
display: flex;
align-items: center;
& > div {
background-color: #AAA;
width: .5em;
height: .5em;
cursor: pointer;
border-radius: 50%;
margin: .5em;
transition-property: width, height;
transition-duration: 100ms;
transition-timing-function: ease-in-out;
&.selected {
background-color: #666;
width: 1em;
height: 1em;
}
&:hover {
opacity: .7;
}
}
& > img {
width: 1.3em;
margin: 0 .2em;
cursor: pointer;
&:hover {
opacity: .7;
}
}
}
} }
/* Search entry */ /* Search entry */
.htk-search-entry .htk-search-entry {
{
background-color: white; background-color: white;
height: 2.2em; height: 2.8em;
border-radius: 1.4em;
padding: 0 1.4em;
} }
.htk-search-entry > * .htk-search-entry > * {
{
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
} }
.htk-search-entry > img .htk-search-entry > img {
{
margin: 0; margin: 0;
height: 1.5em; height: 1.5em;
margin: 0 .4em; margin-right: .6em;
} }
.htk-search-entry > .entry .htk-search-entry > .entry {
{
margin: 0; margin: 0;
border: none; border: none;
width: 8em; width: 8em;
box-shadow: none; box-shadow: none;
padding-right: 0;
padding-left: 0;
} }
.htk-search-entry > .entry:focus .htk-search-entry > .entry:focus {
{
background-color: initial; background-color: initial;
} }
/* Spinner */ /* Spinner */
.htk-spinner .htk-spinner {
{
width: 1.8em; width: 1.8em;
height: 1.8em; height: 1.8em;
position: relative; position: relative;
display: inline-block; display: inline-block;
} }
.htk-spinner > .spinner .htk-spinner > .spinner {
{
left: 0; left: 0;
position: absolute; position: absolute;
width: inherit; width: inherit;
@ -636,23 +565,19 @@ td.cell-image .htk-image
animation: spinner 1s linear infinite; animation: spinner 1s linear infinite;
-webkit-animation: spinner 1s linear infinite; -webkit-animation: spinner 1s linear infinite;
} }
.htk-spinner.dark > .spinner .htk-spinner.dark > .spinner {
{
border-top-color: white; border-top-color: white;
border-left-color: white; border-left-color: white;
} }
@keyframes spinner @keyframes spinner {
{
to {transform: rotate(360deg);} to {transform: rotate(360deg);}
} }
@-webkit-keyframes spinner @-webkit-keyframes spinner {
{
to {-webkit-transform: rotate(360deg);} to {-webkit-transform: rotate(360deg);}
} }
/* Loader */ /* Loader */
.htk-loader > .spinner .htk-loader > .spinner {
{
text-align: center; text-align: center;
} }

19205
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

34
package.json
View File

@ -8,22 +8,25 @@
"url": "https://git.verdnatura.es/hedera-web" "url": "https://git.verdnatura.es/hedera-web"
}, },
"devDependencies": { "devDependencies": {
"archiver": "^3.0.0", "archiver": "^5.3.1",
"assets-webpack-plugin": "^3.9.7", "assets-webpack-plugin": "^7.1.1",
"bundle-loader": "^0.5.6", "bundle-loader": "^0.5.6",
"css-loader": "^2.1.0", "css-loader": "^6.7.1",
"eslint": "^5.13.0", "eslint": "^8.15.0",
"file-loader": "^3.0.1", "file-loader": "^6.2.0",
"fs-extra": "^5.0.0", "fs-extra": "^10.1.0",
"glob": "^7.1.3", "glob": "^8.0.3",
"html-webpack-plugin": "^5.5.0",
"json-loader": "^0.5.7", "json-loader": "^0.5.7",
"raw-loader": "^1.0.0", "node-sass": "^7.0.1",
"style-loader": "^0.23.1", "raw-loader": "^4.0.2",
"url-loader": "^1.1.2", "sass-loader": "^12.6.0",
"webpack": "^4.29.1", "style-loader": "^3.3.1",
"webpack-cli": "^3.2.3", "url-loader": "^4.1.1",
"webpack-dev-server": "^3.1.14", "webpack": "^5.72.1",
"webpack-merge": "^4.2.1", "webpack-cli": "^4.9.2",
"webpack-dev-server": "^4.9.0",
"webpack-merge": "^5.8.0",
"yaml-loader": "^0.5.0" "yaml-loader": "^0.5.0"
}, },
"dependencies": { "dependencies": {
@ -33,7 +36,8 @@
"tinymce": "^5.0.0" "tinymce": "^5.0.0"
}, },
"scripts": { "scripts": {
"dev": "webpack-dev-server --progress --colors --hot", "dev": "webpack serve --open",
"back": "cd ../salix && NODE_ENV=test gulp backOnly",
"build": "rm -rf build/ ; webpack", "build": "rm -rf build/ ; webpack",
"clean": "rm -rf build/" "clean": "rm -rf build/"
} }

1
pages/main/ui.php
View File

@ -15,6 +15,7 @@ $result = $db->query('SELECT name, content FROM metatag');
<link rel="icon" type="image/png" href="image/favicon/favicon.png"/> <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="icon" type="image/svg+xml" href="image/icon.svg" sizes="any"/>
<link rel="manifest" href="<?=$dir?>/manifest.json"/> <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="theme-color" content="#333333"/>
<meta name="content-language" content="<?=$lang?>"/> <meta name="content-language" content="<?=$lang?>"/>

10
web/html.php
View File

@ -30,15 +30,21 @@ function getWebpackAssets() {
if (_DEV_MODE) { if (_DEV_MODE) {
$devServerPort = $wpConfig->devServerPort; $devServerPort = $wpConfig->devServerPort;
$host = $_SERVER['SERVER_NAME']; $host = $_SERVER['SERVER_NAME'];
$serverPath = "http://$host:$devServerPort/"; $serverPath = "http://$host:$devServerPort";
} }
$wpAssets = json_decode(file_get_contents("$buildDir/webpack-assets.json")); $wpAssets = json_decode(file_get_contents("$buildDir/webpack-assets.json"));
$jsFiles = []; $jsFiles = [];
foreach ($wpAssets as $name => $asset) foreach ($wpAssets as $name => $asset)
if (!empty($name) && $name != '_empty_' && property_exists($asset, 'js')) if (!empty($name)
&& $name != '_empty_'
&& $name != 'main'
&& property_exists($asset, 'js'))
$jsFiles[] = $serverPath . $asset->js; $jsFiles[] = $serverPath . $asset->js;
$jsFiles[] = $serverPath . $wpAssets->{''}->js[0];
$jsFiles[] = $serverPath . $wpAssets->main->js;
return $jsFiles; return $jsFiles;
} }

68
webpack.config.js
View File

@ -1,15 +1,15 @@
var path = require('path'); const path = require('path');
var webpack = require('webpack'); const webpack = require('webpack');
var AssetsWebpackPlugin = require('assets-webpack-plugin'); const AssetsWebpackPlugin = require('assets-webpack-plugin');
var merge = require('webpack-merge'); const merge = require('webpack-merge').merge;
var wpConfig = require('./webpack.config.json'); const wpConfig = require('./webpack.config.json');
let env = process.env.NODE_ENV || 'development'; let env = process.env.NODE_ENV || 'development';
var devMode = env === 'development'; const devMode = env === 'development';
var outputPath = path.join(__dirname, wpConfig.buildDir); const outputPath = path.join(__dirname, wpConfig.buildDir);
var publicPath = wpConfig.buildDir +'/'; const publicPath = '/' + wpConfig.buildDir + '/';
var baseConfig = { const baseConfig = {
entry: wpConfig.entry, entry: wpConfig.entry,
mode: devMode ? 'development' : 'production', mode: devMode ? 'development' : 'production',
output: { output: {
@ -18,10 +18,31 @@ var baseConfig = {
}, },
module: { module: {
rules: [ rules: [
{ test: /\.css$/, loader: 'style-loader!css-loader' }, {
{ test: /\.yml$/, loader: 'json-loader!yaml-loader' }, test: /\.css$/,
{ test: /\.xml$/, loader: 'raw-loader' }, use: ['style-loader', 'css-loader'],
{ test: /\.ttf$/, loader: 'file-loader' } }, {
test: /\.yml$/,
use: ['json-loader', 'yaml-loader']
}, {
test: /\.xml$/,
use: 'raw-loader'
}, {
test: /\.ttf$/,
type: 'asset/resource'
}, {
test: /\.scss$/,
use: [
'style-loader',
'css-loader',
{
loader: 'sass-loader',
options: {
sourceMap: true
}
}
]
}
] ]
}, },
resolve: { resolve: {
@ -56,30 +77,31 @@ var baseConfig = {
} }
}; };
var prodConfig = { const prodConfig = {
output: { output: {
filename: '[name].[chunkhash].js', filename: '[name].[chunkhash].js',
chunkFilename: 'chunk.[id].[chunkhash].js' chunkFilename: 'chunk.[id].[chunkhash].js'
}, },
plugins: [ optimization: {
new webpack.HashedModuleIdsPlugin() moduleIds: 'hashed'
], },
devtool: 'source-map' devtool: 'source-map'
}; };
var devConfig = { const devConfig = {
output: { output: {
filename: '[name].js', filename: '[name].js',
chunkFilename: 'chunk.[id].js' chunkFilename: 'chunk.[id].js'
}, },
plugins: [ optimization: {
new webpack.NamedModulesPlugin() moduleIds: 'named'
], },
devServer: { devServer: {
host: '0.0.0.0', host: '0.0.0.0',
static: __dirname,
port: wpConfig.devServerPort, port: wpConfig.devServerPort,
headers: {'Access-Control-Allow-Origin': '*'}, headers: {'Access-Control-Allow-Origin': '*'},
stats: { chunks: false }, //stats: { chunks: false },
proxy: { proxy: {
'/api': 'http://localhost:3000', '/api': 'http://localhost:3000',
'/': { '/': {
@ -91,5 +113,5 @@ var devConfig = {
devtool: 'eval' devtool: 'eval'
}; };
var mrgConfig = devMode ? devConfig : prodConfig; const mrgConfig = devMode ? devConfig : prodConfig;
module.exports = merge(baseConfig, mrgConfig); module.exports = merge(baseConfig, mrgConfig);

2
webpack.config.json
View File

@ -1,5 +1,5 @@
{ {
"buildDir": "build", "buildDir": "build",
"devServerPort": 9000, "devServerPort": 9000,
"entry": {"main": "./app.js"} "entry": "./app.js"
} }