mobile view change : suseendhiran
This commit is contained in:
parent
a2dac392ae
commit
7573347b6c
@ -15,6 +15,10 @@
|
||||
}, 300000);
|
||||
</script>
|
||||
<style>
|
||||
|
||||
|
||||
/* Desktops and laptops ----------- */
|
||||
@media only screen and (min-width : 1224px) {
|
||||
b {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
color: #3bd671 !important;
|
||||
@ -234,7 +238,234 @@
|
||||
}
|
||||
.xd-content .xd-button.xd-ok {
|
||||
background: #734caf;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Smartphones (portrait and landscape) ----------- */
|
||||
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
|
||||
b {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
color: #3bd671 !important;
|
||||
}
|
||||
b1 {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
color: red
|
||||
}
|
||||
.dot {
|
||||
height: 25px;
|
||||
width: 25px;
|
||||
background-color: lightgreen;
|
||||
border-radius: 90%;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 0 0 rgba(204,169,44, 0.4);
|
||||
animation: pulse 2s infinite;
|
||||
}
|
||||
.dot:hover {
|
||||
animation: none;
|
||||
}
|
||||
.dot1 {
|
||||
height: 25px;
|
||||
width: 25px;
|
||||
background-color: red;
|
||||
border-radius: 90%;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 0 0 rgba(204,169,44, 0.4);
|
||||
animation: pulse 2s infinite;
|
||||
}
|
||||
.dot1:hover {
|
||||
animation: none;
|
||||
}
|
||||
|
||||
@-webkit-keyframes pulse {
|
||||
0% {
|
||||
-webkit-box-shadow: 0 0 0 0 rgba(204,169,44, 0.4);
|
||||
}
|
||||
70% {
|
||||
-webkit-box-shadow: 0 0 0 10px rgba(204,169,44, 0);
|
||||
}
|
||||
100% {
|
||||
-webkit-box-shadow: 0 0 0 0 rgba(204,169,44, 0);
|
||||
}
|
||||
}
|
||||
@keyframes pulse {
|
||||
0% {
|
||||
-moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0.4);
|
||||
box-shadow: 0 0 0 0 rgba(204,169,44, 0.4);
|
||||
}
|
||||
70% {
|
||||
-moz-box-shadow: 0 0 0 10px rgba(204,169,44, 0);
|
||||
box-shadow: 0 0 0 10px rgba(204,169,44, 0);
|
||||
}
|
||||
100% {
|
||||
-moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0);
|
||||
box-shadow: 0 0 0 0 rgba(204,169,44, 0);
|
||||
}
|
||||
}
|
||||
.header {
|
||||
background: rgb(3, 37, 37);
|
||||
padding: 10px 0;
|
||||
height: 13%;
|
||||
width: 120%;
|
||||
}
|
||||
.with-in-header{
|
||||
color: white;
|
||||
text-align: right;
|
||||
position: relative;
|
||||
right: 70px;
|
||||
padding-left: 2em;
|
||||
}
|
||||
.last-update{
|
||||
color: white;
|
||||
font-size: large;
|
||||
text-align: right;
|
||||
position: relative;
|
||||
right: 70px;
|
||||
padding-left: 2em;
|
||||
}
|
||||
.header1 {
|
||||
background: white;
|
||||
border-radius: 6px;
|
||||
/* border: 2px solid #1f221c; */
|
||||
text-align: left;
|
||||
padding: 10px 0;
|
||||
padding-top: 2em;
|
||||
padding-left: 2em;
|
||||
height: 40%;
|
||||
width: 88%;
|
||||
position: relative;
|
||||
left: 70px;
|
||||
top: 65px;
|
||||
}
|
||||
.header2 {
|
||||
background: white;
|
||||
text-align: left;
|
||||
padding: 10px 0;
|
||||
width: 80%;
|
||||
position: relative;
|
||||
left: 70px;
|
||||
top: 100px;
|
||||
}
|
||||
.header3 {
|
||||
background: white;
|
||||
text-align: left;
|
||||
padding: 10px 0;
|
||||
width: 120%;
|
||||
position: relative;
|
||||
left: 60px;
|
||||
top: 100px;
|
||||
}
|
||||
.header4 {
|
||||
background: white;
|
||||
text-align: left;
|
||||
padding: 10px 0;
|
||||
width: 80%;
|
||||
position: relative;
|
||||
left: 70px;
|
||||
top: 100px;
|
||||
}
|
||||
.header5 {
|
||||
background: white;
|
||||
text-align: left;
|
||||
padding: 10px 0;
|
||||
width: 120%;
|
||||
position: relative;
|
||||
left: 70px;
|
||||
top: 100px;
|
||||
}
|
||||
.header6 {
|
||||
background: white;
|
||||
text-align: left;
|
||||
padding: 10px 0;
|
||||
width: 80%;
|
||||
position: relative;
|
||||
left: 70px;
|
||||
top: 100px;
|
||||
}
|
||||
.header7 {
|
||||
background: white;
|
||||
text-align: left;
|
||||
padding: 10px 0;
|
||||
width: 120%;
|
||||
position: relative;
|
||||
left: 70px;
|
||||
top: 100px;
|
||||
}
|
||||
.uk-text-primary {
|
||||
color: #3bd671 !important;
|
||||
}
|
||||
.uk-text-primary1 {
|
||||
color: red;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
#tab-des {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
border-collapse: collapse;
|
||||
width: 87%;
|
||||
}
|
||||
|
||||
#tab-des th , #tab-des td {
|
||||
border: 1px solid #ddd;
|
||||
width: 0em;
|
||||
padding: 8px;
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
#tab-des tr:nth-child(even){background-color: #f2f2f2;}
|
||||
|
||||
#tab-des tr:hover {
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
#tab-des th {
|
||||
padding-top: 12px;
|
||||
padding-bottom: 12px;
|
||||
text-align: center;
|
||||
background-color: #04AA6D;
|
||||
color: white;
|
||||
}
|
||||
|
||||
#tab-des-2 {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
border-collapse: collapse;
|
||||
width: 87%;
|
||||
top: 100px;
|
||||
}
|
||||
|
||||
#tab-des-2 td, #tab-des-2 th {
|
||||
border: 1px solid #ddd;
|
||||
width: 0em;
|
||||
padding: 8px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#tab-des-2 tr:nth-child(even){background-color: #f2f2f2;}
|
||||
|
||||
#tab-des-2 tr:hover {background-color: #ddd;}
|
||||
|
||||
#tab-des-2 th {
|
||||
padding-top: 12px;
|
||||
padding-bottom: 12px;
|
||||
text-align: center;
|
||||
background-color: #04AA6D;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.xd-content .xd-body .xd-body-inner {
|
||||
max-height: unset;
|
||||
}
|
||||
.xd-content .xd-body p {
|
||||
color: #f0f;
|
||||
text-shadow: 0 0 5px rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.xd-content .xd-button.xd-ok {
|
||||
background: #734caf;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<title class="bi-alarm">Status</title>
|
||||
<% if ( down == 0) { %>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user