enc.html

<!DOCTYPE html>
<html lang="en">

<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js" defer></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js" defer></script>
    <script src="https://momentjs.com/downloads/moment.js"></script>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Fredoka:wght@300&display=swap" rel="stylesheet">
    <script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
    <script nomodule src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"></script>
    <style>
        *{margin: 0;padding: 0}body{background-size: cover;font-family: 'Fredoka', sans-serif}.bottom{width: 100%;position: fixed;bottom: 0;display: flex;justify-content: center}.center{display: flex}.blackglass{backdrop-filter: blur(10px) saturate(200%);-webkit-backdrop-filter: blur(25px) saturate(200%);background-color: rgba(0, 0, 0, 0.72);border-radius: 12px;border: 1px solid rgba(209, 213, 219, 0.3)}.containers{display: flex;backdrop-filter: blur(25px) saturate(200%);-webkit-backdrop-filter: blur(25px) saturate(200%);background-color: rgba(0, 0, 0, 0.72);border-radius: 12px;border: 1px solid rgba(209, 213, 219, 0.3);margin: 10px}.apps img{width: 50px;transition: .1s}.apps img:hover{transform: scale(1.1)}.actionbuttons img:hover{transform: scale(1.1)}.actionbuttons img:active{transform: scale(0.8)}.actionbuttons img{width: 50px;transition: .1s}.apps img:active{transform: scale(0.8)}.dt{color: #fff}.noti{padding: 10px}.notify{margin-top: 8px;font-size: 20px;color: #fff;transition: .1s}.noti:hover .notify{transform: scale(1.2)}.noti:active .notify{transform: scale(0.8)}.windowmanager{height: 100vh}.wb-title,.wb-min,.wb-max,.wb-close{backdrop-filter: blur(25px) saturate(200%);-webkit-backdrop-filter: blur(25px) saturate(200%)}.wb-min,.wb-max,.wb-close{padding-left: 5px;padding-right: 5px}.wb-close:hover{background-color: red}.dt{margin: 5px}#tem{width: 20px}.weather{justify-content: center;align-items: center;display: flex;color: #fff}.acicon{margin-top: 10px;font-size: 30px;color: #fff;transition: .1s;padding-left: 10px;padding-right: 10px}.whiteglass{backdrop-filter: blur(10px) saturate(180%);-webkit-backdrop-filter: blur(10px) saturate(180%);background-color: rgba(255, 255, 255, 0.3);border-radius: 12px;border: 1px solid rgba(209, 213, 219, 0.1)}.startmenu{position: absolute;height: 80%;width: 70%;color: #fff;bottom: 10%;left: 15%;right: 15%;display: none}.topsec{display: flex;width: 95%;margin: 2.5%}.topsec .boxes{margin: 5px;width: 100%;height: 125px;color: #fff}.topsec .boxes .same{color: #fff;display: flex;justify-content: space-between}.topsec .boxes .same .temp{margin: 10px}.topsec .boxes .same .infor{display: flex;justify-content: center;align-items: center}.topsec .boxes .same .infor .icone{width: 40px;height: 40px;margin: 10px}.o{margin-top: 5px}.bel{margin: 10px;margin-left: 30px}.bel ul li{list-style-image: url(dot.svg)}.flex{display: flex}.devices{margin-top: 10px;align-items: center;justify-content: center;display: flex;width: 33.33%}.devices .deviceicon{width: 40px;color: #fff;justify-content: center;align-items: center;display: flex;border-radius: 100%;height: 40px;font-size: 20px}.progress{margin-top: 10px;height: 7px}.progress-bar{background: lime}.title{color: #fff;margin-left: 10px}.boxcontainer{width: 80%;display: flex}.boxcontainer .apps{margin: 10px}.boxcontainer .apps:hover{transform: scale(1)}.boxcontainer .apps .appname{color: #fff}.middlesec{display: flex}.rightsubsec{border-left: 2px solid rgba(133, 133, 133, 0.541);color: #fff;width: 100%;align-items: center;justify-content: center}.verboxes{width: 90%;margin: 10px;margin-left: 5%;display: flex}.appimage img{width: 80%}.bottomsec{position: absolute;bottom: 0;background: rgba(0, 0, 0, 0.336);display: flex;width: 100%;align-items: center;height: 10%;justify-content: space-between}.bottomsec .leftsec{display: flex;margin-left: 20px}.bottomsec .leftsec .imagesec{margin:;font-size: 20px}.bottomsec .leftsec .username{}.bottomsec .centersec{display: flex;margin-left: 10px}.centersec .button{margin: 2px;border-radius: 5px;background: rgba(128, 128, 128, 0.651);font-size: 20px;height: 30px;padding-left: 20px;padding-right: 20px;justify-content: center;align-items: center;display: flex}.rightsec{margin-right: -22%;right: 0;margin-bottom: 10px}.rightsec .flex{margin-top: 10px}.rightsec .gress{margin-top: -10px}.rightsec .flex .text{line-height: 10px;margin-top: 20px;margin-right: 10px}.rightsec .flex .imageop img{width: 40px;margin-top: 10px}#hiop{position: absolute;height: 100vh;width: 100%;display: none}
    </style>
    <script src="https://rawcdn.githack.com/nextapps-de/winbox/0.2.0/dist/winbox.bundle.js" defer></script>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body background="back.jpg">
<div id="hiop" onclick="hidefun()"></div><div class="startmenu blackglass" id="startmenu"><div class="topsec"><div class="boxes whiteglass"><div class="same"><div class="temp">Tempreatue<br><font size="5px">24°</font></div><div class="infor"><div class="tex">Sunny</div><div class="icone"><img src="sun.svg"></div></div></div></div><div class="boxes whiteglass"><center class="o">Today</center><div class="bel"><ul><li>12:00 - 13:00<br>Subscreibe to my Channel</li><li>17:00 - 18:00<br>Make New videos</li></ul></div></div><div class="boxes whiteglass flex"><div class="devices"><center><div class="dv"><div class="deviceicon blackglass"><ion-icon name="phone-portrait-outline"></ion-icon></div><div class="devicename">Phone</div><div class="charged"><ion-icon name="flash"></ion-icon>25%</div><div class="progressbar"><div class="progress"><div class="progress-bar" role="progressbar" style="width:25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div></div></div></div></div><div class="devices"><div class="dv"><div class="deviceicon blackglass"><ion-icon name="watch-outline"></ion-icon></div><div class="devicename">Watch</div><div class="charged"><ion-icon name="flash"></ion-icon>85%</div><div class="progressbar"><div class="progress"><div class="progress-bar" role="progressbar" style="width:85%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div></div></div></div></div><div class="devices"><center><div class="dv"><div class="deviceicon blackglass"><ion-icon name="car-sport-outline"></ion-icon></div><div class="devicename">Car</div><div class="charged"><ion-icon name="flash"></ion-icon>55%</div><div class="progressbar"><div class="progress"><div class="progress-bar" role="progressbar" style="width:55%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div></div></div></div></div></div></div><div class="middlesec"><div class="leftsubsec"><div class="pinnedapps"><div class="title">Pinned Apps</div><div class="boxcontainer"><div class="apps" onclick="files()"><center><img src="src/apps/scalable/file-manager-red.svg" alt=""><div class="appname">Files</div></center></div><div class="apps" onclick="mail()"><center><img src="src/apps/scalable/thunderbird.svg"><div class="appname">Mail</div></center></div><div class="apps" onclick="browser()"><center><img src="src/apps/scalable/google-chrome.svg"><div class="appname">Chrome</div></center></div><div class="apps" onclick="calculator()"><center><img src="src/apps/scalable/calc.svg"><div class="appname">Calculator</div></center></div><div class="apps" onclick="vscode()"><center><img src="src/apps/scalable/visual-studio-code.svg"><div class="appname">VSCode</div></center></div><div class="apps" onclick="settings()"><center><img src="src/apps/scalable/breeze-settings.svg"><div class="appname">Settings</div></center></div><div class="apps" onclick="games()"><center><img src="src/apps/scalable/mess.svg"><div class="appname">Games</div></center></div><div class="apps" onclick="music()"><center><img src="src/apps/scalable/spotify-client.svg"><div class="appname">Spotify</div></center></div></div></div></div><div class="rightsubsec"><div class="title">Pick where you left off</div><div class="verboxes whiteglass" onclick="music()"><div class="appimage"><img src="src/apps/scalable/spotify-client.svg"></div><div class="upperniche"><div class="mainchez"><b>Play music</b></div><div class="sub">Listen to "its my life"</div></div></div><div class="verboxes whiteglass" onclick="browser()"><div class="appimage"><img src="src/apps/scalable/google-chrome.svg"></div><div class="upperniche"><div class="mainchez"><b>Chrome</b></div><div class="sub">Resume browsing</div></div></div><div class="verboxes whiteglass" onclick="games()"><div class="appimage"><img src="src/apps/scalable/applications-games.svg"></div><div class="upperniche"><div class="mainchez"><b>Games</b></div><div class="sub">Play games</div></div></div></div></div><div class="bottomsec"><div class="leftsec"><div class="imagesec"><ion-icon name="person-circle-outline"></ion-icon></div><div class="username">Dynamic code</div></div><div class="centersec"><div class="button"><ion-icon name="settings-outline"></ion-icon></div><div class="button"><ion-icon name="apps-sharp"></ion-icon></div><div class="button"><ion-icon name="power-outline"></ion-icon></div></div><div class="rightsec"><div class="flex"><div class="text"><font size="3px">Cloud storage<br><font size="1px">262GB used of 500GB</font></div><div class="imageop"><img src="cloud.svg" alt="cloud"></div></div><div class="gress"><div class="progress" style="height:5px"><div class="progress-bar" role="progressbar" style="width:52.4%;background:#1e90ff" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div></div></div></div></div></div><div class="bottom"><div class="center"><div class="containers"><div class="apps" onclick="files()"><img src="src/apps/scalable/file-manager-red.svg" alt=""></div><div class="apps" onclick="mail()"><img src="src/apps/scalable/thunderbird.svg"></div><div class="apps" onclick="browser()"><img src="src/apps/scalable/google-chrome.svg"></div><div class="apps" onclick="calculator()"><img src="src/apps/scalable/calc.svg"></div><div class="apps" onclick="vscode()"><img src="src/apps/scalable/visual-studio-code.svg"></div><div class="apps" onclick="settings()"><img src="src/apps/scalable/breeze-settings.svg"></div><div class="apps" onclick="games()"><img src="src/apps/scalable/mess.svg"></div><div class="apps" onclick="music()"><img src="src/apps/scalable/spotify-client.svg"></div></div><div class="containers"><div class="actionbuttons"><ion-icon name="search-outline" class="acicon"></ion-icon></div><div class="actionbuttons" onclick="strtmenu()"><ion-icon name="logo-react" class="acicon"></ion-icon></div><div class="actionbuttons"><ion-icon name="copy-outline" class="acicon"></ion-icon></div></div><div class="containers"><div class="dt"><div class="time" id="time">10:48</div><div class="date" id="date">sunday,March 13</div></div><div class="weather">&nbsp; <img src="sun.svg" id="tem">&nbsp;24°&nbsp;&nbsp;</div></div><div class="containers"><div class="noti"><ion-icon class="notify" name="wifi-outline"></ion-icon></div><div class="noti"><ion-icon class="notify" name="bluetooth-outline"></ion-icon></div><div class="noti"><ion-icon class="notify" name="volume-high-outline"></ion-icon></div><div class="noti"><ion-icon class="notify" name="battery-full-outline"></ion-icon></div><div class="noti"><ion-icon class="notify" name="chevron-up-outline"></ion-icon></div></div></div></div><div class="windowmanager"></div>
    <script>
       var hiop=document.getElementById("hiop"),startmenu=document.getElementById("startmenu");function hidefun(){startmenu.style.display="none",hiop.style.display="none"}function strtmenu(){"none"===startmenu.style.display?(startmenu.style.display="block",hiop.style.display="block"):(startmenu.style.display="none",hiop.style.display="none")}function vscode(){new WinBox("VS Code",{url:"https://vscode.dev/",bottom:80,background:"#252526",max:!1,class:["no-full"],x:"center",y:"center",width:"60%",height:"65%"})}function browser(){new WinBox("Chrome",{url:"apps/chrome.html",bottom:80,background:"#cbd5e0",max:!1,class:["no-full"],x:"center",y:"center",width:"60%",height:"65%"})}function games(){new WinBox("Games",{url:"https://frive.net/",bottom:80,background:"#1e608d",max:!1,class:["no-full"],x:"center",y:"center",width:"60%",height:"65%"})}function mail(){new WinBox("mail",{url:"apps/mail.html",bottom:80,background:"#1e608d",max:!1,class:["no-full"],x:"center",y:"center",width:"60%",height:"65%"})}function music(){new WinBox("Spotify(Not real)",{url:"apps/spotify.html",bottom:80,background:"#121212",max:!1,class:["no-full"],x:"center",y:"center",width:"60%",height:"65%"})}document.getElementById("date").innerHTML=moment().format("MMMM Do YYYY"),document.getElementById("time").innerHTML=moment().format("h:mm a");
    </script>
</body>

</html>