9555-Events style & fix scroll pagination
This commit is contained in:
parent
bfd00726bf
commit
49d82698b1
|
@ -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 |
|
@ -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,
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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>
|
||||
'
|
||||
|
|
|
@ -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();
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue