safebox/web-installer
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 30 Wiki Activity

sidebar changes
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
hael
2025-08-05 19:43:15 +00:00
parent d7147b6c81
commit 0d61dd1725
2 changed files with 33 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
manage.html
View File

@@ -6,7 +6,7 @@
<title>Safebox</title> <title>Safebox</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Switzer:ital,wght@0,300;0,400;0,500;0,600;1,400&display=swap"/> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Switzer:ital,wght@0,300;0,400;0,500;0,600;1,400&display=swap"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"/> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"/>
<link rel="stylesheet" href="style.css?t=4" /> <link rel="stylesheet" href="style.css?t=5" />
</head> </head>
<body> <body>
<div class="sidebar"> <div class="sidebar">
@@ -16,17 +16,6 @@
<span>Safebox</span> <span>Safebox</span>
</div> </div>
<div class="menu"> <div class="menu">
<div class="menu-item" style="margin-bottom:20px">
<img src="/img/globe.png" data-src="/img/globe.png" data-hover="/img/globe.png" alt="VPN" />
<div class="menu-label">
<span id="vpnBtn">VPN</span>
<label class="switch">
<input type="checkbox" id="vpnToggle">
<span class="slider-text"><span class="switch-label">OFF</span></span>
</label>
</div>
</div>
<!-- <!--
<div class="menu-item"><i class="fas fa-th"></i><span>Applications</span></div> <div class="menu-item"><i class="fas fa-th"></i><span>Applications</span></div>
<div class="menu-item"><i class="fas fa-hdd"></i><span>Disk Management</span></div> <div class="menu-item"><i class="fas fa-hdd"></i><span>Disk Management</span></div>
@@ -46,24 +35,29 @@
</div> </div>
</div> </div>
<div class="yellow-row"> <div class="yellow-row">
<div id="pro_off">
<div class="yellow-box"> <div class="yellow-box">
<div id="pro_off">
<h4>Safebox Pro</h4> <h4>Safebox Pro</h4>
<p>Enjoy benefits and unlock more feature such as remote access, geo-redundant backups etc. <br><br> <p>Enjoy benefits and unlock more feature such as remote access, geo-redundant backups etc. <br><br>
<a href="" class="details">Read details</a><br><br> <a href="" class="details">Read details</a><br><br>
<img src="/img/upgrade.png" alt="Upgrade now" width="100%"/> <img src="/img/upgrade.png" alt="Upgrade now" width="100%"/>
</p> </p>
</div> </div>
<div id="pro_on" class="hidden"> </div>
<h4>Login</h4> <div id="pro_on" class="hidden">
<p>Enjoy benefits and unlock more feature such as remote access, geo-redundant backups etc. <br><br> <div class="grey-box">
<a href="" class="details">Read details</a><br><br> <h4><img src="/img/globe.png" data-src="/img/globe.png" data-hover="/img/globe.png" alt="VPN" /> Remote access</h4>
<p>It allows you to connect your installed apps to a custom domain (your own or one registered through us), so you can securely log in from any browser, anywhere in the world.
</p> </p>
</div> <div class="vpn-item">
</div> <span id="vpnBtn">VPN</span>
<div class="yellow-corner"> <label class="switch">
<img src="img/yellow_corner.png" alt=""/> <input type="checkbox" id="vpnToggle" onclick="return false">
<span class="slider-text"><span class="switch-label">OFF</span></span>
</label>
</div>
</div> </div>
</div>
</div> </div>
</div> </div>
<div class="main" > <div class="main" >
@@ -351,6 +345,9 @@
} }
vpnToggle.addEventListener("change", updateStatus); vpnToggle.addEventListener("change", updateStatus);
vpnToggle.addEventListener('click', function (e) {
e.preventDefault();
});
// Alapállapot beállítása // Alapállapot beállítása
updateStatus(); updateStatus();

14
style.css
View File

@@ -317,6 +317,20 @@
align-items: flex-end; align-items: flex-end;
} }
.grey-box {
border: 2px solid #41464f;
border-radius: 20px 20px 0px 20px;
color: #999;
text-align: left;
margin: 0px;
padding: 10px 18px;
font-weight: bold;
font-size: 12px;
}
.grey-box h4 {
color: var(--highlight-color);
}
.main { .main {
flex: 1; flex: 1;
padding: 30px; padding: 30px;