ulvis.paste.net

Paste Search Dynamic
Recent pastes
loginbox
  1. <html>
  2.  
  3. //Contains all the CSS styling for the forms
  4. <style>
  5.     body {
  6.         background-color: white;
  7.     }
  8.  
  9.     .menuBar {
  10.         background-color: #fcd8a1;
  11.         overflow: hidden;
  12.         position: fixed;
  13.         top: 0px;
  14.         left: 0px;
  15.         width: 100%;
  16.     }
  17.  
  18.     .menuBar a {
  19.         float: right;
  20.         color: black;
  21.         text-align: center;
  22.         padding: 16px 16px;
  23.         text-decoration: none;
  24.         font-size: 32;
  25.         font-family: Tahoma;
  26.     }
  27.  
  28.     .menuBar a:hover, .dropbtn:hover {
  29.         background-color: #ffcd11;
  30.         color: white;
  31.     }
  32.  
  33.     .menuBar b {
  34.         float: left;
  35.         color: black;
  36.         text-align: center;
  37.         padding: 16px 16px;
  38.         text-decoration: none;
  39.         font-size: 32;
  40.         font-family: Tahoma;
  41.     }
  42.  
  43.     .dropdown {
  44.         float: right;
  45.         overflow: hidden;
  46.         position: relative;
  47.     }
  48.  
  49.     .dropbtn {
  50.         background-color: #fcd8a1;
  51.         border:none;
  52.         float: right;
  53.         color: black;
  54.         text-align: center;
  55.         padding: 16px 16px;
  56.         text-decoration: none;
  57.         font-size: 32;
  58.         font-family: Tahoma;
  59.         margin: 0;
  60.     }
  61.  
  62.  
  63.     .dropdown-content {
  64.         display: none;
  65.         position: relative;
  66.         float: right;
  67.         color: black;
  68.         text-align: center;
  69.         text-decoration: none;
  70.         font-size: 32;
  71.         font-family: Tahoma;
  72.         box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  73.         z-index: 1;
  74.     }
  75.  
  76.     .dropdown-content a {
  77.         float: none;
  78.         color: black;
  79.         padding: 12px 16px;
  80.         text-decoration: none;
  81.         display: block;
  82.         text-align: left;
  83.     }
  84.  
  85.     .dropdown:hover .dropdown-content {
  86.         display: block;
  87.     }
  88.  
  89.     .box {
  90.         height: 100px;
  91.         width: 33%;
  92.         background-color: #FFFFFF;
  93.         border:1px solid black;
  94.         font-family: Tahoma;
  95.         position: absolute;
  96.         left: 33%;
  97.         top: 20%;
  98.         border-radius: 12px;
  99.         font-size: 12pt;
  100.     }
  101.  
  102.     .fontSizeButton {
  103.  
  104.         background-color: #fcd8a1;
  105.         border:none;
  106.         color: black;
  107.         text-align: center;
  108.         font-family: Tahoma;
  109.         font-size: 32px;
  110.         padding: 16px;
  111.  
  112.     }
  113.  
  114.     .fontSizeButton:hover {
  115.         background-color: #ffcd11;
  116.     }
  117.  
  118.     .gap {
  119.         height: 20px;
  120.     }
  121.  
  122.     .button1 {
  123.         position: absolute;
  124.         right: 50px;
  125.         bottom: -30px;
  126.         padding-bottom: 0px;
  127.         height = 20px;
  128.         width = 80px;
  129.  
  130.         background-color: #fcd8a1;
  131.         border: none;
  132.         color: white;
  133.         padding: 5px 15px;
  134.         text-align: center;
  135.         font-size: 16px;
  136.         cursor: pointer;
  137.     }
  138.  
  139.     .button2 {
  140.         position: absolute;
  141.         right: -0px;
  142.         bottom: -30px;
  143.         padding-bottom: 0px;
  144.         height = 20px;
  145.         width = 80px;
  146.         font-family: Tahoma;
  147.         background: rgba(0,0,0,0);
  148.         color: black;
  149.         padding: 5px 15px;
  150.         text-align: center;
  151.         font-size: 10px;
  152.         cursor: pointer;
  153.         background-color: #FFFFFF;
  154.         border:1px solid black;
  155.         border-radius: 12px;
  156.     }
  157.  
  158.     .button2:hover{
  159.         color: white;
  160.     }
  161.  
  162.     #signIn label {
  163.         margin-left: 5%;
  164.         display: inline-block;
  165.         width: 100px;
  166.         text-align: right;
  167.     }
  168.  
  169.     #username, #password {
  170.         width: 58%;
  171.         margin-left: 5px;
  172.         box-sizing: border-box;
  173.         border: none;
  174.         border-bottom: 2px solid #fcd8a1;
  175.         font-family: Tahoma;
  176.     }
  177.  
  178. </style>
  179. <script>
  180.  
  181.     //Allow the timer to function properly
  182.     function startTime() {
  183.         var today = new Date();
  184.         var h = today.getHours();
  185.         var m = today.getMinutes();
  186.         h = checkTime(h);
  187.         m = checkTime(m);
  188.         document.getElementById('timestamp').innerHTML =
  189.             h + ":" + m ;
  190.         var t = setTimeout(startTime, 500);
  191.     }
  192.  
  193.     //Ensure the timer updates regularly
  194.     function checkTime(i) {
  195.         if (i < 10) {i = "0" + i}
  196.         return i;
  197.     }
  198.  
  199.     //User authentication function
  200.     function checkLogin(){
  201.         //Array holding id details
  202.         var id = "{{$id}}";
  203.         //If username and password don't match up in database
  204.         if(id=="1"){
  205.             alert("Username/Password Incorrect - Please Try Again");
  206.         }
  207.         //If user tries to access another page via url without logging in
  208.         else if(id=="2"){
  209.             alert("Please log in before using the system");
  210.         }
  211.         //Initialize timestamp
  212.         startTime();
  213.     }
  214.     //Define boolean value to store whether text should normally sized or larger
  215.     var increasetrue = true;
  216.     //Function to change font size on button click
  217.     function increaseFontSize() {
  218.         //Increase font size
  219.         if (increasetrue == true) {
  220.             document.getElementById("fontSizeButton").innerHTML = "aA&#818";
  221.             document.getElementById("loginbox").style.fontSize = "18pt";
  222.             document.getElementById("loginButton").style.fontSize = "16pt";
  223.             document.getElementById("username").style.fontSize = "16pt";
  224.             document.getElementById("password").style.fontSize = "16pt";
  225.             document.getElementById("usernamediv").style.height = "10px";
  226.             document.getElementById("loginButton").style.bottom = "-40px";
  227.             increasetrue = false;
  228.         }
  229.         //Make font normally sized
  230.         else if(increasetrue == false){
  231.             document.getElementById("fontSizeButton").innerHTML = "a&#818A";
  232.             document.getElementById("loginbox").style.fontSize = "12pt";
  233.             document.getElementById("loginButton").style.fontSize = "10pt";
  234.             document.getElementById("username").style.fontSize = "12pt";
  235.             document.getElementById("password").style.fontSize = "12pt";
  236.             document.getElementById("usernamediv").style.height = "20px";
  237.             document.getElementById("loginButton").style.bottom = "";
  238.             increasetrue = true;
  239.         }
  240.     }
  241.  
  242. </script>
  243.  
  244. <head>
  245.     <title>Login</title>
  246. </head>
  247. <!-- When page loads, check the user us logged in -->
  248. <body onload="checkLogin()">
  249.  
  250. <!-- HTML for page -->
  251. <div id="menuBar" class="menuBar">
  252.     <b style="float: left;">Make-It-All</b>
  253.     <div class="dropdown">
  254.         <b style="font-weight:normal" id="timestamp"></b>
  255.     </div>
  256.     <div >
  257.         <button id="fontSizeButton" type="submit" class="fontSizeButton" onclick="increaseFontSize()" >a&#818A</button>
  258.     </div>
  259. </div>
  260.  
  261. <div id="loginbox" class="box">
  262.     <form id="signIn" action ="" method="POST">
  263.         @csrf
  264.         <div id="usernamediv" class="gap"> </div>
  265.         <label for="username">Username:</label>
  266.         <input type="text" id="username" name="username">
  267.         <div class="gap"> </div>
  268.         <label for="password">Password:</label>
  269.         <input type="password" id="password" name="password">
  270.         <button id="loginButton" type="submit" class="button2">Login</button>
  271.     </form>
  272. </div>
  273. </body>
  274. </html>
Parsed in 0.000 seconds