update

css/statbate.css

@@ -3,6 +3,13 @@ body {
 	background-color: #f3f3f5;
 }
 
+a,
+a:hover,
+a:active {
+	color: #333;
+	word-break: break-word;
+}
+
 .statbate {
 	/* background: linear-gradient(#000, #000) no-repeat center/2px 100%; */
 	max-width: 790px;
@@ -203,6 +210,10 @@ body {
   border-color: #343a40;
 }
 
+.btn-dark:focus{
+	box-shadow: none;
+}
+
 .dropdown-item.active, .dropdown-item:active {
     color: black;
     text-decoration: none;
@@ -214,6 +225,11 @@ body {
     text-align: center;
 }
 
+.table td, .table th {
+    padding: 6px 20px;
+    vertical-align: middle;
+}
+
 .tab-content {
     margin-top: 12px;
     position: relative;
@@ -359,7 +375,51 @@ table.dataTable {
   text-align: center;
 }
 
+.form-control:focus,
+.form-select:focus {
+  border-color: #ced4da;
+  box-shadow: none;
+}
+
+.page-item.active .page-link {
+	background-color: #efefef !important;
+	border: 1px solid grey;
+	border-color: lightgrey !important;
+}
+
+.page-link {
+    color: black !important;
+}
+
+.dataTables_filter label {
+	display: block !important;
+	text-align: right !important;
+}
+
+.form-control-sm[type=search] {
+	width: 160px !important;
+}
+
+.promo-block {
+    position: absolute;
+    max-width: 380px;
+    width: 100%;
+    height: 31px;
+    left: 0;
+	right: 0;
+	margin: auto;
+    opacity: 0.25;
+}
+
+.promo-block img {
+    object-fit: cover;
+    width: 100%;
+    height: 100%;
+    border-radius: 6px;
+}
+
 @media (max-width: 805px) {
+	.promo-block,
 	.dataTables_paginate,
 	.dataTables_info,
 	.dataTables_length,
@@ -387,10 +447,6 @@ table.dataTable {
 		width: 100%;
 	}
 
-	.dataTables_filter label {
-		display: block !important;
-	}
-	
 	.form-control-sm[type=search] {
 		width: 100% !important;
 	}
@@ -404,6 +460,7 @@ table.dataTable {
 }
 
 @media (any-hover: hover) {
+	.promo-block:hover,
 	.footer_social i:hover,
 	.banner:hover {
 		opacity: 1;

index.html

@@ -150,6 +150,11 @@
 			<div class="tab-content">
 				<div aria-labelledby="cams-tab" role="tabpanel active" class="tab-pane fade active show" id="cams">
 						
+						
+						<div class="promo-block">
+								<a href="https://www.getmonero.org" target="_blank"><img src="./img/xmr.webp" width="380" height="31"></a>
+						</div>
+						
 					<!-- test data start -->
 					
 					
@@ -164,7 +169,7 @@
 														title="Use search online">
 														last
 													</th>
-													<th class="d-none d-sm-table-cell" data-toggle="tooltip" data-placement="top" title="Avarage income per day">$ day</th>
+													<th class="d-none d-sm-table-cell" data-toggle="tooltip" data-placement="top" title="Avarage income per day">$.day</th>
 													<th class="d-none d-sm-table-cell" data-toggle="tooltip"
 														data-placement="top" title="Uniq donators per month">dons
 													</th>
@@ -184,7 +189,7 @@
 													<td>52976</td>
 												</tr>
 												<tr class="even">
-													<td class="d-none d-sm-table-cell">2</td>
+													<td class="d-none d-sm-table-cell">100</td>
 													<td>ehotlovea</td>
 													<td><font color="green">online</font></td>
 													<td class="d-none d-sm-table-cell">1909</td>

js/statbate.js

@@ -160,7 +160,17 @@ function statbate() {
 }
 
 function createTables(){
-	tables["main"] = $('#main').DataTable({...dataTableOptions,});
+	tables["main"] = $('#main').DataTable({
+		...dataTableOptions,
+		aoColumns: [
+			{ "orderable": false, "searchable": false, "sWidth": "5%" },
+			{ "orderable": false, "sWidth": "35%" },
+			{ "orderable": false,  "sWidth": "15%" },
+			{ "searchable": false, "sWidth": "15%" },
+			{ "searchable": false, "sWidth": "15%" },
+			{ "searchable": false, "sWidth": "15%" },
+		],	
+	});
 	tables["main"]["status"] = "mobile";
 	if(window.innerWidth > 805){
 		tables["main"]["status"] = "desktop";