loraSMS / pageBegin.skel /
Yanik Cawidrone Push everything
cbf75b6 a year ago
1 contributor
244 lines | 6.249kb
<!doctype html>
<html lang="en-us">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/font-awesome/css/all.css" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="css/style.css" />
    <link rel="alternate stylesheet" type="text/css" id="style-dynamic" href="" />
    <link rel="shortcut icon" href="favicon.png">
    <link rel="icon" type="image/png" href="favicon.png" sizes="16x16">
    <link rel="icon" type="image/png" href="favicon-32x32.png" sizes="32x32">
    <script>
    function changeCSS(cssFile, cssLinkIndex) {
      var oldlink = document.getElementsByTagName("link").item(cssLinkIndex);
      var newlink = document.createElement("link");
      newlink.setAttribute("rel", "stylesheet");
      newlink.setAttribute("type", "text/css");
      newlink.setAttribute("href", cssFile);
      document.getElementsByTagName("head").item(0).replaceChild(newlink, oldlink);
    }
    function getStylesheet() {
      var currentTime = new Date().getHours();
      if (0 <= currentTime && currentTime < 7) {
        changeCSS('css/style-night.css',3);
      } else if (7 <= currentTime && currentTime < 19) {
        changeCSS('css/style-day.css',3);
      } else if (19 <= currentTime && currentTime < 24) {
        changeCSS('css/style-night.css',3);
      }
    }
    getStylesheet();

    function hideMenu() {
      var x = document.getElementById("menu-news");
      var btn = document.getElementById("menu-btn");
      if (x.style.display === "none") {
        x.style.display = "block";
        btn.innerHTML = '<i class="fa fa-times fa-fw"></i>';
        //document.getElementById('article-display').setAttribute("class", "col-6");
      } else {
        x.style.display = "none";
        btn.innerHTML = '<i class="fa fa-bars fa-fw"></i>';
        //document.getElementById('article-display').setAttribute("class", "col-8");
      }
    }
    function forceStylesheet() {
      var x = document.getElementById("style-active");
      var btn = document.getElementById("style-btn");

      if (x.className === "night") {
        x.className = "day";
        btn.innerHTML = '<i class="fa fa-sun-o fa-fw"></i>';
        changeCSS('css/style-day.css',3);
      } else {
        x.className = "night";
        btn.innerHTML = '<i class="fa fa-moon-o fa-fw"></i>';
        changeCSS('css/style-night.css',3);
      }
    }

    window.onload = function () {
      // Set Day/Night icon after load
      var x = document.getElementById("style-active");
      var btn = document.getElementById("style-btn");
      var currentTime = new Date().getHours();
      if (0 <= currentTime && currentTime < 7) {
        x.className = "night";
        btn.innerHTML = '<i class="fa fa-moon-o fa-fw"></i>';
        changeCSS('css/style-night.css',3);
      } else if (7 <= currentTime && currentTime < 19) {
        x.className = "day";
        btn.innerHTML = '<i class="fa fa-sun-o fa-fw"></i>';
        changeCSS('css/style-day.css',3);
      } else if (19 <= currentTime && currentTime < 24) {
        x.className = "night";
        btn.innerHTML = '<i class="fa fa-moon-o fa-fw"></i>';
        changeCSS('css/style-night.css',3);
      }
      var w = window;
      var d = document;
      var e = d.documentElement;
      var g = d.getElementsByTagName('body')[0];
      screenX = w.innerWidth || e.clientWidth || g.clientWidth;
      if(screenX > 767) {
        var sectionMenu = document.getElementById("menu-news");
        sectionMenu.style.display = "none";
      }
      hideMenu();
    }
    </script>

    <title>CSTAPPNAME</title>
<style>
* {
    box-sizing: border-box;
}
.row::after {
  content: "";
  clear: both;
  display: table;
}
[class*="col-"] {
  float: left;
  padding: 15px;
}
html {
  font-family: "Lucida Sans", sans-serif;
}
.header {
  background-color: #5b7e96;
  color: #ffffff;
  padding: 2px;
}

tr:nth-child(even) {
  background: #dcdcdc;
}
tr:hover {
  background: #8cf;
}
td {
}
td.center {
}
tbody {
  background-color: #e4f0f5;
}
thead {
  background-color: #3f87a6;
  color: #fff;
  font-weight: bold;
}


/* For mobile phones: */
[class*="col-"] {
    width: 100%;

  }
@media only screen and (min-width: 500px) and (max-width: 699px) {
  /* For phone */
  #menu-news {
    display: none;
  }
  #pdf-btn { display: none; }

}
@media only screen and (min-width: 700px) {
    /* For tablets: */
    .col-s-1 {width: 8.33%;}
    .col-s-2 {width: 16.66%;}
    .col-s-3 {width: 25%;}
    .col-s-4 {width: 33.33%;}
    .col-s-5 {width: 41.66%;}
    .col-s-6 {width: 50%;}
    .col-s-7 {width: 58.33%;}
    .col-s-8 {width: 66.66%;}
    .col-s-9 {width: 75%;}
    .col-s-10 {width: 83.33%;}
    .col-s-11 {width: 91.66%;}
    .col-s-12 {width: 100%;}
}
@media only screen and (min-width: 768px) {
    /* For desktop: */
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
}

.topnav {
  overflow: hidden;
  background-color: #5b7e96;
}


.title {
  width: 200px;
  /*white-space: nowrap;
  overflow: hidden;*/
  float: left;
  /*text-overflow: ellipsis;*/
  font-size: 1.2em;
  color:#fff;
  padding: 4px 4px;
  position: relative;
}
.title:hover {
}
.title-tooltip {
  display: none;
}
.title:hover .title-tooltip {
  display: block;
  font-size: 1.0em;
  overflow: visible;
  white-space: wrap;
}

.topnav a {
  float: left;
  display: block;
  color: #fff;
  text-align: center;
  padding: 4px 4px;
  text-decoration: none;
  font-size: 17px;
}

.topnav a:hover {
  background-color: #888;
  color: black;
}

.topnav a.active {
  background-color: #eee;
  color: black;
}

.topnav .icon {
  display: none;
}

h1 { font-size:20px; font-weight:bold; }
h2 { font-size:16px; font-weight:bold; }
h3 { font-size:14px; font-weight:bold; }
/*a:link { color: #5b7e96; }
a:visited { color: #5b7e96; }
a:hover { color: #888; }
*/
</style>
</head>
<body>