149 lines
2.9 KiB
HTML
149 lines
2.9 KiB
HTML
<head>
|
|
<title>{{title}}</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<style>
|
|
|
|
body {
|
|
background-image: url("bg/{{bg_img}}");
|
|
background-size: cover;
|
|
background-position: center;
|
|
font-family: {{font}};
|
|
font-size: {{font_size}}px;
|
|
color: {{font_color}};
|
|
}
|
|
|
|
table, th, td {
|
|
border: 1px solid black;
|
|
}
|
|
|
|
.settings {
|
|
position: absolute;
|
|
top: 10px;
|
|
right: 20px;
|
|
font-size: 14px;
|
|
}
|
|
|
|
option, select {
|
|
width: 70px;
|
|
font-family: {{font}};
|
|
background: grey;
|
|
}
|
|
|
|
.container {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 100%;
|
|
}
|
|
|
|
.link-container {
|
|
width: 300px;
|
|
background: rgba(255, 255, 50, 0.11);
|
|
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
|
|
backdrop-filter: blur(15px);
|
|
-webkit-backdrop-filter: blur(15px);
|
|
border: 1px solid rgba(255, 255, 255, 0.26);
|
|
padding: 20px;
|
|
}
|
|
|
|
.link {
|
|
color: {{link_color}};
|
|
text-decoration: none;
|
|
}
|
|
|
|
.link:hover {
|
|
color: {{link_hover_color}};
|
|
text-decoration: none;
|
|
}
|
|
|
|
</style>
|
|
|
|
<div class='settings'>
|
|
<select name="dropdown" id="dropdown">
|
|
<option value="">set bg</option>
|
|
{{bg_options}}
|
|
</select>
|
|
</div>
|
|
<div class="container">
|
|
<div class="link-container">
|
|
{{links}}
|
|
<br>
|
|
<span style="font-size:14px">
|
|
{{section_links}}
|
|
</span><br>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
|
|
function getCookie(cname) {
|
|
let name = cname + "=";
|
|
let decodedCookie = decodeURIComponent(document.cookie);
|
|
let ca = decodedCookie.split(';');
|
|
for(let i = 0; i <ca.length; i++) {
|
|
let c = ca[i];
|
|
while (c.charAt(0) == ' ') {
|
|
c = c.substring(1);
|
|
}
|
|
if (c.indexOf(name) == 0) {
|
|
return c.substring(name.length, c.length);
|
|
}
|
|
}
|
|
return "";
|
|
}
|
|
|
|
var bg = getCookie("bg")
|
|
console.log(bg)
|
|
if (bg != "" && bg != 'undefined') {
|
|
changeWallpaper(bg)
|
|
}
|
|
|
|
function changeWallpaper(bg) {
|
|
document.cookie = "bg=" + bg;
|
|
var bg_map = {{bg_map}}
|
|
|
|
document.body.style.backgroundImage = "url('bg/"+ bg_map[bg] +"')";
|
|
}
|
|
|
|
document.getElementById("dropdown").addEventListener("change", function () {
|
|
if (this.value != "") {
|
|
changeWallpaper(this.value);
|
|
}
|
|
});
|
|
|
|
var key_map = {{key_map}}
|
|
|
|
function toggleSection(section) {
|
|
var sections = {{section_array}}
|
|
for (let i = 0; i < sections.length; i++) {
|
|
if (section == sections[i]) {
|
|
document.getElementById(sections[i]).style.display = 'block';
|
|
} else {
|
|
document.getElementById(sections[i]).style.display = 'none';
|
|
}
|
|
}
|
|
}
|
|
|
|
document.onkeypress = function (e) {
|
|
|
|
var section_map = {{section_map}}
|
|
|
|
if (e.key in section_map) {
|
|
toggleSection(section_map[e.key])
|
|
} else {
|
|
if (e.key in key_map) {
|
|
window.location.href = key_map[e.key];
|
|
}
|
|
}
|
|
};
|
|
|
|
|
|
</script>
|
|
|
|
</body>
|
|
|