9555-Events style & fix scroll pagination

This commit is contained in:
Pablo Aragon 2023-04-18 10:21:17 +02:00
parent bfd00726bf
commit 49d82698b1
5 changed files with 105 additions and 96 deletions

View File

@ -0,0 +1,25 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="11px" height="10px" viewBox="0 0 11 10" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 61.2 (101010) - https://sketch.com -->
<title>8FDB48E7-691D-43C7-B7AD-DC381E7FA74C@svg</title>
<desc>Created with sketchtool.</desc>
<g id="Consola-mobile" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="2b-Events---open-groups" transform="translate(-323.000000, -268.000000)" fill="#3F3F3F">
<g id="List" transform="translate(20.000000, 138.000000)">
<g id="Conmutador" transform="translate(0.000000, 26.000000)">
<g id="Group" transform="translate(10.000000, 48.000000)">
<g id="Elements-/-mobile-/-Event-card">
<g id="Event">
<g id="Secondary" transform="translate(10.000000, 55.000000)">
<g id="Label-star" transform="translate(282.000000, 0.000000)">
<path d="M6.5,9.75 L4.47286801,10.8157264 C3.98402343,11.0727272 3.37939627,10.8847806 3.12239546,10.3959361 C3.02005639,10.2012756 2.98474172,9.9783075 3.02191856,9.76154987 L3.40906632,7.50430523 L3.40906632,7.50430523 L1.7690821,5.9057157 C1.37359852,5.52021449 1.36550621,4.88710123 1.75100742,4.49161765 C1.90451603,4.33413401 2.10565844,4.23164683 2.32329547,4.20002232 L4.58969793,3.87069477 L4.58969793,3.87069477 L5.60326392,1.81698575 C5.84768622,1.32173209 6.44731205,1.11839309 6.94256571,1.36281539 C7.13977832,1.46014562 7.29940584,1.61977315 7.39673608,1.81698575 L8.41030207,3.87069477 L8.41030207,3.87069477 L10.6767045,4.20002232 C11.2232494,4.27943994 11.6019308,4.78688279 11.5225132,5.33342765 C11.4908887,5.55106469 11.3884015,5.7522071 11.2309179,5.9057157 L9.59093368,7.50430523 L9.59093368,7.50430523 L9.97808144,9.76154987 C10.0714424,10.3058863 9.70585462,10.8228422 9.16151817,10.9162033 C8.94476055,10.9533801 8.72179247,10.9180654 8.52713199,10.8157264 L6.5,9.75 L6.5,9.75 Z" id="Star"></path>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

View File

@ -918,27 +918,8 @@ html .ui-body-a .ui-accordion-content {
html .ui-bar-a a,
html .ui-body-a a,
html body .ui-group-theme-a a {
color: #38c;
font-weight: 700;
}
.ui-page-theme-a a:visited,
html .ui-bar-a a:visited,
html .ui-body-a a:visited,
html body .ui-group-theme-a a:visited {
color: #38c;
}
.ui-page-theme-a a:hover,
html .ui-bar-a a:hover,
html .ui-body-a a:hover,
html body .ui-group-theme-a a:hover {
color: #059;
}
.ui-page-theme-a a:active,
html .ui-bar-a a:active,
html .ui-body-a a:active,
html body .ui-group-theme-a a:active {
color: #059;
}
.ui-page-theme-a .ui-button,
html .ui-bar-a .ui-button,
html .ui-body-a .ui-button,
@ -1015,25 +996,7 @@ html body div.ui-slider-track.ui-body-a .ui-button-active,
.ui-page-theme-a .ui-accordion-header.ui-state-active,
html .ui-body-a .ui-accordion-header-active,
html .ui-body-a .ui-accordion-header.ui-state-active {
background-color: #38c;
border-color: #38c;
color: #fff;
text-shadow: 0 1px 0 #059;
}
.ui-page-theme-a .ui-button:focus,
html .ui-bar-a .ui-button:focus,
html .ui-body-a .ui-button:focus,
html body .ui-group-theme-a .ui-button:focus,
html head + body .ui-button.ui-button-a:focus,
.ui-page-theme-a .ui-focus,
html .ui-bar-a .ui-focus,
html .ui-body-a .ui-focus,
html body .ui-group-theme-a .ui-focus,
html head + body .ui-button-a.ui-focus,
html head + body .ui-body-a.ui-focus {
-webkit-box-shadow: 0 0 12px #38c;
-moz-box-shadow: 0 0 12px #38c;
box-shadow: 0 0 12px #38c;
}
.ui-bar-b,
.ui-page-theme-b .ui-bar-inherit,
@ -1078,27 +1041,8 @@ html .ui-body-b .ui-accordion-content {
html .ui-bar-b a,
html .ui-body-b a,
html body .ui-group-theme-b a {
color: #2ad;
font-weight: 700;
}
.ui-page-theme-b a:visited,
html .ui-bar-b a:visited,
html .ui-body-b a:visited,
html body .ui-group-theme-b a:visited {
color: #2ad;
}
.ui-page-theme-b a:hover,
html .ui-bar-b a:hover,
html .ui-body-b a:hover,
html body .ui-group-theme-b a:hover {
color: #08b;
}
.ui-page-theme-b a:active,
html .ui-bar-b a:active,
html .ui-body-b a:active,
html body .ui-group-theme-b a:active {
color: #08b;
}
.ui-page-theme-b .ui-button,
html .ui-bar-b .ui-button,
html .ui-body-b .ui-button,
@ -1175,25 +1119,7 @@ html body div.ui-slider-track.ui-body-b .ui-button-active,
.ui-page-theme-b .ui-accordion-header.ui-state-active,
html .ui-body-b .ui-accordion-header-active,
html .ui-body-b .ui-accordion-header.ui-state-active {
background-color: #2ad;
border-color: #2ad;
color: #fff;
text-shadow: 0 1px 0 #08b;
}
.ui-page-theme-b .ui-button:focus,
html .ui-bar-b .ui-button:focus,
html .ui-body-b .ui-button:focus,
html body .ui-group-theme-b .ui-button:focus,
html head + body .ui-button.ui-button-b:focus,
.ui-page-theme-b .ui-focus,
html .ui-bar-b .ui-focus,
html .ui-body-b .ui-focus,
html body .ui-group-theme-b .ui-focus,
html head + body .ui-button-b.ui-focus,
html head + body .ui-body-b.ui-focus {
-webkit-box-shadow: 0 0 12px #2ad;
-moz-box-shadow: 0 0 12px #2ad;
box-shadow: 0 0 12px #2ad;
}
.ui-disabled,
.ui-state-disabled,

View File

@ -30,6 +30,7 @@
--secondary-color: #ffffff;
--body-color: #f6f7fb;
--border-color: #e5e9ed;
--muted-color: #8a96a6;
}
@font-face {
@ -80,7 +81,7 @@ body {
}
.ui-header .ui-title {
font-size: 14px !important;
font-size: 12pt !important;
min-height: 1.1em;
text-align: center;
display: block;
@ -90,7 +91,7 @@ body {
overflow: hidden;
white-space: nowrap;
outline: 0 !important;
line-height: 25px;
line-height: 18pt;
}
.ui-btn-inner {
@ -362,7 +363,7 @@ tr.group_view_data,
.datos_green a,
.datos_greenf9 a {
background-color: #52a000;
color: #ffffff !important;
color: #000000 !important;
text-shadow: none !important;
}
.datos_red,
@ -370,7 +371,7 @@ tr.group_view_data,
.datos_red a,
.datos_redf9 a {
background-color: #ff3e41;
color: #ffffff !important;
color: #000000 !important;
text-shadow: none !important;
}
@ -416,7 +417,7 @@ tr.group_view_data,
}
tr.events {
border-bottom: 6px solid #f7f7f7 !important;
border-bottom: 6px solid var(--secondary-color) !important;
font-size: 12px !important;
}
@ -1868,7 +1869,7 @@ table.tactical_bars > tbody > tr,
}
div#main_page {
background-color: var(--body-color) !important;
background-color: var(--body-color);
}
.ui-header.ui-bar-inherit.ui-header-fixed.slidedown {
@ -1905,10 +1906,18 @@ div#main_page {
align-items: center;
}
span#user_logged {
padding-right: 0px;
right: 20px;
line-height: 30px;
font-size: 10pt !important;
}
.ui-grid-a.ui-responsive {
background-color: var(--secondary-color);
border-radius: 8px;
border: 1px solid var(--border-color);
margin-bottom: 10px;
}
.ui-button-icon-space {
@ -1947,6 +1956,12 @@ div.hr {
margin: 10px 0px;
}
div.hr-full {
border-bottom: 1px solid var(--border-color);
width: 200%;
margin: 10px -100px;
}
table,
fieldset {
padding: 0px 5px !important;
@ -2032,6 +2047,8 @@ div#tactical2 .tactical_set > table {
.ui-collapsible.ui-collapsible-inset.ui-corner-all.ui-collapsible-themed-content.ui-collapsible-collapsed {
border: 1px solid var(--border-color);
border-radius: 8px;
margin-top: 0px;
margin-bottom: 10px;
}
.ui-collapsible-heading-toggle.ui-button.ui-button-a.ui-mini,
@ -2065,13 +2082,15 @@ table#last-activity > tbody > tr > td.cell_0 {
padding-bottom: 2px !important;
}
table#last-activity > tbody > tr > td.cell_1 {
width: 75%;
width: 70%;
max-width: 75%;
padding-bottom: 2px !important;
}
table#last-activity > tbody > tr > td.cell_2 {
width: 15%;
width: 20%;
padding-bottom: 2px !important;
padding-left: 0px !important;
padding-right: 0px !important;
}
table#last-activity > tbody > tr > td.cell_3 {
width: 10%;
@ -2084,5 +2103,44 @@ table#last-activity > tbody > tr > td > b {
}
.muted {
color: #8a96a6 !important;
color: var(--muted-color) !important;
}
.white-card {
background-color: var(--secondary-color);
padding: 10px;
border: 1px solid var(--border-color);
border-radius: 8px;
}
/* Events table */
table#list_events > tbody > tr.events > td.cell_0 {
border-top-left-radius: 8px !important;
border-top-right-radius: 8px !important;
}
table#list_events > tbody > tr.events > td.vertical_middle {
border-bottom-left-radius: 8px !important;
border-bottom-right-radius: 8px !important;
color: #4a4a4a;
}
table#list_events > tbody > tr.events {
background-color: var(--secondary-color) !important;
}
table#list_events > tbody > tr.events.datos_green > td {
background-color: #81b92e40;
}
table#list_events > tbody > tr.events.datos_red > td {
background-color: #ed474a40;
}
table#list_events > tbody > tr.events.datos_yellow > td {
background-color: #fcab1040;
}
table#list_events > tbody > tr.events.datos_blue > td {
background-color: #25a8ff40;
}
table#list_events > tbody > tr.events.datos_grey > td {
background-color: #adadad40;
}

View File

@ -560,6 +560,7 @@ class User
$(".ui-overlay-a").addClass("login-background");
$(".ui-overlay-a").removeClass("ui-overlay-a");
$(".ui-page-theme-a").css({"background-color":"transparent !important"});
$("div.ui-page.ui-page-theme-a.ui-page-active#main_page").css({"background-color":"transparent !important"});
});
</script>
'

View File

@ -195,15 +195,15 @@ class Events
switch ($event['estado']) {
case 0:
$img_st = 'images/star_white.png';
$img_st = 'images/star-dark.svg';
break;
case 1:
$img_st = 'images/tick_white.png';
$img_st = 'images/validate.svg';
break;
case 2:
$img_st = 'images/hourglass_white.png';
$img_st = 'images/clock.svg';
break;
default:
@ -221,7 +221,7 @@ class Events
$status_icon = html_print_image(
$img_st,
true,
false,
['class' => 'main_menu_icon'],
false,
false,
false,
@ -264,11 +264,7 @@ class Events
$row_1 = '<span class="events_agent">'.$agent_name.'</span>';
$row_1 .= '<span class="events_timestamp">';
$row_1 .= ui_print_timestamp(
$event['timestamp_last'],
true,
['units' => 'tiny']
);
$row_1 .= human_time_comparation($event['timestamp_last'], 'tiny');
$row_1 .= $status_icon;
$row_1 .= '</span>';
@ -1008,7 +1004,10 @@ class Events
$html = $ui->getEndForm();
$ui->contentCollapsibleAddItem($html);
$ui->contentEndCollapsible();
$ui->contentAddHtml('<div class="hr-full"></div>');
$ui->contentAddHtml('<div class="white-card">');
$this->listEventsHtml();
$ui->contentAddHtml('</div>');
$ui->endContent();
$ui->showPage();
}
@ -1351,14 +1350,14 @@ class Events
$(\"table#\"+table_id+\" tbody\").append(new_rows);
load_more_rows = 0;
// load_more_rows = 0;
refresh_link_listener_list_events();
}
}
function ajax_load_rows() {
if (load_more_rows) {
load_more_rows = 0;
if (load_more_rows) {
// load_more_rows = 0;
postvars = {};
postvars[\"action\"] = \"ajax\";
postvars[\"parameter1\"] = \"events\";
@ -1383,7 +1382,7 @@ class Events
//Check if the end of the event list tables is in the client limits
var table_end = $('#list_events').offset().top + $('#list_events').height();
if (table_end < document.documentElement.clientHeight) {
ajax_load_rows();
// ajax_load_rows();
}
}