404.html - cloud-compiler - A real-time, low-latency code ...

404.html (2914B)
      1 <!DOCTYPE html>
      2 <html lang="en">
      3 
      4 <head>
      5   <meta name="viewport" content="width=device-width, initial-scale=1">
      6   <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css'>
      7 <link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Arvo'>
      8   <!-- The font was updated to 'Inter' as requested. -->
      9 <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap" rel="stylesheet">
     10 </head>
     11 
     12 <style>
     13     body{
     14   margin:0;
     15   padding:0;
     16   font-family: 'Inter', sans-serif;
     17   height:100vh;
     18 background-image: linear-gradient(to top, #2e1753, #1f1746, #131537, #0d1028, #050819);
     19   display:flex;
     20   justify-content:center;
     21   align-items:center;
     22   overflow:hidden;
     23 }
     24 .text{
     25   position:absolute;
     26   top:10%;
     27   color:#fff;
     28   text-align:center;
     29 }
     30 h1{
     31   font-size:50px;
     32 }
     33 .star{
     34   position:absolute;
     35   width:2px;
     36   height:2px;
     37   background:#fff;
     38   right:0;
     39   animation:starTwinkle 3s infinite linear;
     40 }
     41 .astronaut img{
     42   width:100px;
     43   position:absolute;
     44   top:55%;
     45   animation:astronautFly 6s infinite linear;
     46 }
     47 @keyframes astronautFly{
     48   0%{
     49     left:-100px;
     50   }
     51   25%{
     52     top:50%;
     53     transform:rotate(30deg);
     54   }
     55   50%{
     56     transform:rotate(45deg);
     57     top:55%;
     58   }
     59   75%{
     60     top:60%;
     61     transform:rotate(30deg);
     62   }
     63   100%{
     64     left:110%;
     65     transform:rotate(45deg);
     66   }
     67 }
     68 @keyframes starTwinkle{
     69   0%{
     70      background:rgba(255,255,255,0.4);
     71   }
     72   25%{
     73     background:rgba(255,255,255,0.8);
     74   }
     75   50%{
     76    background:rgba(255,255,255,1);
     77   }
     78   75%{
     79     background:rgba(255,255,255,0.8);
     80   }
     81   100%{
     82     background:rgba(255,255,255,0.4);
     83   }
     84 }
     85 
     86 
     87 
     88 @media (max-width: 768px) {
     89   .four_zero_four_bg {
     90     height: 200px;
     91   }
     92   .four_zero_four_bg h1 {
     93     font-size: 40px;
     94   }
     95   .four_zero_four_bg h3 {
     96     font-size: 40px;
     97   }
     98   .button a {
     99     font-size: 16px;
    100     padding: 15px 30px;
    101   }
    102 }
    103 </style>
    104 
    105 <body>
    106 
    107   <div class="text">
    108   <div>ERROR</div>
    109   <h1>404</h1>
    110   <hr>
    111   <div>Page Not Found</div><br>
    112   <div><a href="https://compiler.aranag.site" style="color: #fff; text-decoration: none;"><u>Go to Homepage</u></a></div>
    113 </div>
    114 
    115 <div class="astronaut">
    116   <img src="https://images.vexels.com/media/users/3/152639/isolated/preview/506b575739e90613428cdb399175e2c8-space-astronaut-cartoon-by-vexels.png" alt="" class="src">
    117 </div>
    118 
    119   </div>
    120     </div>
    121     </div>
    122     </div>
    123   </div>
    124 </section>
    125 </body>
    126 <script>
    127   document.addEventListener("DOMContentLoaded",function(){
    128   
    129  var body=document.body;
    130   setInterval(createStar,100);
    131   function createStar(){
    132     var right=Math.random()*500;
    133     var top=Math.random()*screen.height;
    134     var star=document.createElement("div");
    135  star.classList.add("star")
    136   body.appendChild(star);
    137   setInterval(runStar,10);
    138     star.style.top=top+"px";
    139   function runStar(){
    140     if(right>=screen.width){
    141       star.remove();
    142     }
    143     right+=3;
    144     star.style.right=right+"px";
    145   }
    146   } 
    147 })
    148 </script>
    149 </html>
	cloud-compiler A real-time, low-latency code ...
	Log \| Files \| Refs \| README \| LICENSE