refs #5966 Changed style
gitea/worker-time-control/pipeline/head This commit looks good Details

This commit is contained in:
Guillermo Bonet 2023-08-22 13:46:00 +02:00
parent f64265659e
commit 97b47bf47d
12 changed files with 216 additions and 130 deletions

View File

@ -1,4 +1,4 @@
Copyright (C) 2021 - Verdnatura Levante S.L.
Copyright (C) 2023 - Verdnatura Levante S.L.
This package is free software; you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by

View File

@ -6,10 +6,11 @@ and open the template in the editor.
-->
<html>
<head>
<title>FichApp</title>
<title>Time Control</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/style.css" rel="stylesheet" type="text/css"/>
<link rel="icon" type="image/png" href="img/favicon.ico">
<script src="node_modules/jquery/dist/jquery.min.js" type="text/javascript"></script>
<script src="node_modules/fastclick/lib/fastclick.js" type="text/javascript"></script>
</head>

View File

@ -3,141 +3,143 @@
Author : enrique blasco blanquer
*/
*{
* {
margin: 0;
padding: 0;
box-sizing: border-box;
user-select: none;
}
html,body{
html, body {
width: 100%;
height: 100%;
font-family: sans-serif;
background: #000;
font-family: 'Poppins', 'Verdana', 'Sans';
background: #121212;
}
h1{
h1 {
position: fixed;
bottom: 20px;
right: 20px;
font-size: 1em;
color: #fff;
font-weight: 400;
color: white;
}
span{
span {
color: #ED4947;
}
.total{
.total {
float: right;
font-weight: bold;
font-size: 1.4em;
margin-top: -40px;
}
ul{
ul {
list-style: none;
}
.pinLogin{
background-image: url(../img/logo.png);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
#logoVerd{
width: 200px;
margin: 20px;
}
#logoVerdHeader{
width: 50px;
margin: 0;
position: fixed;
top: 12px;
left: 20px;
}
.pinContainer{
width: 350px;
.pinContainer {
width: 320px;
height: 460px;
position: fixed;
top: 0;
bottom: 0;
bottom: 21%;
left: 0;
right: 0;
margin: auto;
text-align: center;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
#txtPin{
#txtPin {
text-align: center;
padding: 15px 5px;
background: rgba(255,255,255,.90);
border: none;
font-weight: bold;
background: white;
line-height: 40px;
font-weight: 400;
font-size: 1.5em;
border-radius: 5px;
border-radius: 50px;
display: block;
width: 250px;
width: 310px;
height: 70px;
margin: auto;
margin-bottom: 10px;
overflow: hidden;
font-size: 26px;
}
.btnPin{
#logo {
width: 25%;
padding-bottom: 20px;
}
.btnPin {
display: flex;
align-items: center;
justify-content: center;
float: left;
width: calc(100% / 3);
height: calc(500px/5);
height: calc(500px / 5);
padding: 5px;
}
.btnPinNum{
.btnPinNum {
width: 100%;
height: 100%;
font-size: 2.5em;
background: rgba(255,255,255,.90);
padding-top: 21px;
border-radius: 5px;
background: #292929;
color: white;
margin: auto;
border-radius: 48%;
font-weight: 400;
display: flex;
align-items: center;
justify-content: center;
}
.btnPinNum:active{
background: rgb(255,255,255);
.btnPinNum:active {
background: #333;;
}
.btnCancel{
.btnCancel {
width: 100%;
height: 100%;
font-size: 2.5em;
padding-top: 20px;
display: flex;
align-items: center;
justify-content: center;
background: rgba(237,73,71,.90);
color: #fff;
border-radius: 5px;
border-radius: 50%;
}
.btnCancel:active{
.btnCancel:active {
background: rgb(172,55,54);
}
.btnOk{
.btnOk {
width: 100%;
height: 100%;
font-size: 2.5em;
padding-top: 20px;
display: flex;
align-items: center;
justify-content: center;
background: rgba(163,171,38,.90);
color: #fff;
border-radius: 5px;
border-radius: 50%;
}
.btnOk:active{
#invertColor {
filter: invert(100%);
}
.btnOk:active {
background: rgb(130, 136, 31);
}
#txtNombre{
#txtNombre {
padding-top: 0px;
padding-left: 10px;
float: left;
@ -147,43 +149,44 @@ ul{
font-weight: bold;
}
.paneles{
.paneles {
overflow: hidden;
width: 100%;
}
.planPanel{
.planPanel {
float: left;
width: 100%;
padding: 20px 20px 0 20px;
height: auto;
}
.problemsPanel{
.problemsPanel {
float: left;
width: 100%;
height: auto;
padding: 20px;
}
.container{
.container {
width: 100%;
height: 100%;
background: rgba(255,255,255,.90);
background: #292929;
padding: 20px;
overflow: hidden;
box-shadow: 0 0 5px rgba(0,0,0,.2);
border-radius: 8px;
}
h2{
h2 {
font-size: 1.3em;
color: white;
}
h3{
h3 {
font-size: 1em;
color: #9EA7AC;
font-weight: normal;
}
.footer{
.footer {
display: none;
position: absolute;
bottom: 0;
@ -192,7 +195,7 @@ h3{
text-align: center;
}
.in,.inMiddle {
.in, .inMiddle {
display: inline;
position: static;
width: 350px;
@ -201,13 +204,13 @@ h3{
font-size: 2em;
color: #fff;
text-align: center;
border-radius: 10px;
border-radius: 50%;
}
.in:active {
background: rgb(0, 204, 10);
}
.out,.outMiddle{
.out,.outMiddle {
display: inline;
position: static;
width: 350px;
@ -216,48 +219,48 @@ h3{
font-size: 2em;
color: #fff;
text-align: center;
border-radius: 10px;
border-radius: 50%;
}
.out:active {
background: rgb(237,73,71);
}
.inMiddle{
.inMiddle {
background: rgba(210, 172, 2, 0.9);
}
.outMiddle{
background: rgba(226, 86, 4, 0.9);
.outMiddle {
background: rgba(210, 172, 2, 0.9);
}
.inMiddle:active{
.inMiddle:active {
background: rgb(210, 172, 2);
}
.outMiddle:active{
background: rgb(226, 86, 4);
.outMiddle:active {
background: rgb(210, 172, 2);
}
header{
header {
overflow: hidden;
padding: 20px 20px 0px 20px;
}
.btnSalir{
.btnSalir {
float: right;
background: rgba(237,73,71,.90);
padding: 5px 30px;
font-size: 1.2em;
color: #fff;
border-radius: 5px;
border-radius: 50px;
}
.btnSalir:active{
.btnSalir:active {
background: rgb(237,73,71);
}
#txtIncidencia{
#txtIncidencia {
color: #ED4947;
font-weight: bold;
font-size: 1.4em;
@ -266,12 +269,12 @@ header{
.listHorario{
.listHorario {
margin-top: 20px;
width: 100%;
overflow: hidden;
}
.listHorario .headerLi{
.listHorario .headerLi {
width: 100%;
overflow: hidden;
border-top: 1px solid #9EA7AC;
@ -279,7 +282,7 @@ header{
}
.listHorario label{
.listHorario label {
float: left;
width: calc(100% / 7);
text-align: center;
@ -287,12 +290,12 @@ header{
padding: 5px 0;
}
.hoy{
.hoy {
background: #9EA7AC;
color: #fff;
}
.listHorario .time{
.listHorario .time {
float: left;
width: calc(100% / 7);
text-align: center;
@ -301,7 +304,7 @@ header{
overflow: hidden;
}
.listHorario .time img{
.listHorario .time img {
width: 20px;
float: left;
margin-right: 5px;
@ -309,22 +312,22 @@ header{
margin-top: 7px;
}
.listHorario .time p{
.listHorario .time p {
float: left;
background: #8DD202;
padding: 5px;
border-radius: 7px;
}
.impar{
.impar {
color: rgba(163,171,38,.90);
font-weight: bold;
}
.hide{
.hide {
opacity: 0;
}
.show{
.show {
opacity: 1;
}
@ -336,13 +339,15 @@ header{
width: 100%;
height: 100%;
color: #fff;
background: #8DD202;
background: #BBFFBB;
color: #363;
}
.confirm.confirmKO {
background: rgba(237,73,71);
background: #ffcdd2;
color: #A00;
}
.contConfirm{
.contConfirm {
position: fixed;
margin: auto;
top:0;
@ -354,12 +359,12 @@ header{
text-align: center;
}
.contConfirm h4{
.contConfirm h4 {
font-size: 2.5em;
margin-bottom: 20px;
}
.btnconfirmar{
.btnconfirmar {
float: left;
font-size: 1.2em;
padding: 18px;
@ -368,7 +373,7 @@ header{
margin: 15px;
}
.btnnoconfirm{
.btnnoconfirm {
float: left;
font-size: 1.2em;
padding: 18px;
@ -377,13 +382,13 @@ header{
margin: 15px;
}
.botonera{
.botonera {
margin: auto;
width: 310px;
overflow: hidden;
}
.loading{
.loading {
display: none;
top: 0;
left: 0;
@ -391,18 +396,17 @@ header{
z-index: 999;
width: 100%;
height: 100%;
background: rgba(25,154,166,1);
background: -moz-linear-gradient(45deg, rgba(25,154,166,1) 0%, rgba(39,216,139,1) 100%);
background: -webkit-gradient(left bottom, right top, color-stop(0%, rgba(25,154,166,1)), color-stop(100%, rgba(39,216,139,1)));
background: -webkit-linear-gradient(45deg, rgba(25,154,166,1) 0%, rgba(39,216,139,1) 100%);
background: -o-linear-gradient(45deg, rgba(25,154,166,1) 0%, rgba(39,216,139,1) 100%);
background: -ms-linear-gradient(45deg, rgba(25,154,166,1) 0%, rgba(39,216,139,1) 100%);
background: linear-gradient(45deg, rgba(25,154,166,1) 0%, rgba(39,216,139,1) 100%);
background: linear-gradient(45deg, rgba(255, 255, 255, .5) 0%, rgb(0, 0, 0, .5) 100%);
background: -moz-linear-gradient(45deg, rgba(255, 255, 255, .5) 0%, rgb(0, 0, 0, .5) 100%);
background: -webkit-gradient(left bottom, right top, color-stop(0%, rgba(255, 255, 255, .5)), color-stop(100%, rgb(0, 0, 0, .5)));
background: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .5) 0%, rgb(0, 0, 0, .5) 100%);
background: -o-linear-gradient(45deg, rgba(255, 255, 255, .5) 0%, rgb(0, 0, 0, .5) 100%);
background: -ms-linear-gradient(45deg, rgba(255, 255, 255, .5) 0%, rgb(0, 0, 0, .5) 100%);
background: linear-gradient(45deg, rgba(255, 255, 255, .5) 0%, rgb(0, 0, 0, .5) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#199aa6', endColorstr='#27d88b', GradientType=1 );
}
.loadingcontent{
.loadingcontent {
position: fixed;
height: 50px;
width: 100%;
@ -412,8 +416,6 @@ header{
left: 0;
}
.sk-cube-grid {
width: 40px;
height: 40px;

1
img/close.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 -960 960 960" width="48"><path d="m250.923-218.924-31.999-31.999L448.001-480 218.924-709.077l31.999-31.999L480-511.999l229.077-229.077 31.999 31.999L511.999-480l229.077 229.077-31.999 31.999L480-448.001 250.923-218.924Z"/></svg>

After

Width:  |  Height:  |  Size: 291 B

1
img/done.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 -960 960 960" width="48"><path d="M379.154-258.309 168.616-468.846l32.615-32.23 177.923 177.923 379-379.384 32.614 32.614-411.614 411.614Z"/></svg>

After

Width:  |  Height:  |  Size: 210 B

BIN
img/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 105 KiB

71
img/logo.svg Normal file
View File

@ -0,0 +1,71 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0.00 0.00 1192.00 1192.00">
<path fill="#8abb28" d="
M 631.17 333.43
C 660.52 258.92 720.25 182.84 803.25 166.49
Q 808.86 165.39 825.98 163.08
Q 966.26 144.23 1106.42 125.28
A 0.57 0.55 87.0 0 1 1107.05 125.86
C 1105.40 182.31 1103.42 238.79 1101.26 295.22
Q 1098.67 362.81 1073.06 425.28
C 1042.57 499.70 982.13 573.27 898.34 587.76
Q 895.85 588.19 878.54 590.53
Q 740.59 609.17 600.48 628.12
Q 598.97 628.32 599.14 626.82
C 599.78 620.96 599.72 614.34 599.88 608.25
C 600.89 571.32 602.67 523.90 604.09 481.75
Q 604.93 456.55 605.61 446.75
Q 609.64 388.09 631.17 333.43
Z"
/>
<path fill="#8abb28" d="
M 389.58 267.53
C 459.94 270.37 506.64 327.82 525.33 390.81
C 534.83 422.80 538.24 454.21 537.16 487.50
Q 535.07 552.28 532.73 617.06
Q 532.44 625.03 532.51 634.87
A 2.89 2.88 86.0 0 1 530.02 637.74
Q 399.63 655.43 267.76 673.34
C 163.55 687.50 106.33 588.25 97.78 499.73
C 95.67 477.89 95.77 461.04 96.92 434.18
C 98.75 391.28 99.85 348.34 101.39 305.51
A 0.84 0.83 -3.3 0 1 102.11 304.71
Q 236.99 286.42 371.99 268.19
Q 379.80 267.13 389.58 267.53
Z"
/>
<path fill="#8abb28" d="
M 678.83 907.84
C 639.27 907.28 612.10 874.67 601.69 839.26
Q 594.64 815.25 595.11 790.18
Q 595.49 770.19 598.14 702.63
Q 598.16 702.14 598.65 702.07
Q 669.55 692.44 740.39 682.91
Q 753.48 681.15 760.30 681.56
C 790.25 683.36 814.01 704.65 826.55 731.22
Q 841.38 762.63 840.37 799.07
Q 839.17 842.80 837.47 886.68
A 0.81 0.80 89.6 0 1 836.71 887.46
Q 833.32 887.64 829.73 888.13
Q 764.23 897.07 698.73 906.00
Q 684.66 907.92 678.83 907.84
Z"
/>
<path fill="#8abb28" d="
M 246.54 772.04
Q 270.48 752.78 300.25 745.74
Q 306.54 744.25 319.96 742.45
Q 422.69 728.61 525.46 714.64
Q 526.14 714.55 526.11 715.23
C 524.34 756.04 523.37 796.93 521.94 837.75
C 519.54 906.05 491.06 978.57 437.09 1022.84
Q 407.07 1047.47 368.50 1052.69
Q 262.23 1067.07 157.16 1081.36
Q 155.73 1081.56 155.77 1080.12
Q 156.70 1049.37 157.67 1019.94
C 158.74 987.17 159.19 962.04 160.52 946.01
C 165.97 880.38 194.50 813.93 246.54 772.04
Z"
/>
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

View File

@ -6,17 +6,18 @@ and open the template in the editor.
-->
<html>
<head>
<title>FichApp</title>
<title>Time Control</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/style.css" rel="stylesheet" type="text/css"/>
<link rel="icon" type="image/png" href="img/favicon.ico">
<script src="node_modules/jquery/dist/jquery.min.js" type="text/javascript"></script>
<script src="node_modules/fastclick/lib/fastclick.js" type="text/javascript"></script>
</head>
<body class="pinLogin">
<div class="pinContainer">
<p id="txtPin">USUARIO</p>
<img id="logo" src="img/logo.svg"/>
<p id="txtPin">ID USUARIO</p>
<div class="btnPin btnnum">
<div class="btnPinNum">
1
@ -64,7 +65,7 @@ and open the template in the editor.
</div>
<div class="btnPin">
<div class="btnCancel">
<img id="invertColor" src="img/close.svg">
</div>
</div>
<div class="btnPin btnnum">
@ -72,9 +73,9 @@ and open the template in the editor.
0
</div>
</div>
<div class="btnPin ">
<div class="btnPin">
<div class="btnOk">
<img id="invertColor" src="img/done.svg">
</div>
</div>
</div>

View File

@ -21,7 +21,7 @@ function setEvents() {
$(".btnCancel").on("click", function () {
pin = "";
$("#txtPin").text("USUARIO");
$("#txtPin").text("ID USUARIO");
});
$(".btnOk").on("click", login);
@ -47,7 +47,7 @@ function login() {
},
error: function() {
$(".loading").fadeOut(200);
$("#txtPin").text("USUARIO");
$("#txtPin").text("ID USUARIO");
pin = "";
}
});

19
package-lock.json generated
View File

@ -1,15 +1,24 @@
{
"name": "es.verdnatura.worker-time-control",
"version": "1.0.1",
"lockfileVersion": 1,
"version": "1.0.2",
"lockfileVersion": 3,
"requires": true,
"dependencies": {
"fastclick": {
"packages": {
"": {
"name": "es.verdnatura.worker-time-control",
"version": "1.0.2",
"license": "GPL-3.0",
"dependencies": {
"fastclick": "^1.0.6",
"jquery": "^3.6.0"
}
},
"node_modules/fastclick": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/fastclick/-/fastclick-1.0.6.tgz",
"integrity": "sha1-FhYlsnsaWAZAWTa9qaLBkm0Gvmo="
},
"jquery": {
"node_modules/jquery": {
"version": "3.6.0",
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.6.0.tgz",
"integrity": "sha512-JVzAR/AjBvVt2BmYhxRCSYysDsPcssdmTFnzyLEts9qNwmjmu4JTAMYubEfwVOSwpQ1I1sKKFcxhZCI2buerfw=="

View File

@ -1,6 +1,6 @@
{
"name": "es.verdnatura.worker-time-control",
"version": "1.0.1",
"version": "1.0.2",
"author": "Verdnatura Levante SL",
"description": "Fichador",
"displayName": "Fichador",