change wp
BIN
bg/crystal.png
Normal file
|
After Width: | Height: | Size: 9.2 KiB |
|
Before Width: | Height: | Size: 437 KiB After Width: | Height: | Size: 437 KiB |
BIN
bg/konata.png
Normal file
|
After Width: | Height: | Size: 179 KiB |
BIN
bg/lain.png
Normal file
|
After Width: | Height: | Size: 3 MiB |
BIN
bg/mary_and_gabriel.png
Normal file
|
After Width: | Height: | Size: 1.5 MiB |
BIN
bg/sakura.jpg
Normal file
|
After Width: | Height: | Size: 529 KiB |
BIN
bg/squirtle.gif
Normal file
|
After Width: | Height: | Size: 138 KiB |
56
index.html
|
|
@ -6,6 +6,18 @@
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
<div class='settings'>
|
||||||
|
<select name="dropdown" id="dropdown">
|
||||||
|
<option value="">set bg</option>
|
||||||
|
<option value="frogs">frogs</option>
|
||||||
|
<option value="mary">mary</option>
|
||||||
|
<option value="crystal">crystal</option>
|
||||||
|
<option value="konata">konata</option>
|
||||||
|
<option value="lain">lain</option>
|
||||||
|
<option value="sakura">sakura</option>
|
||||||
|
<option value="squirtle">squirtle</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="link-container">
|
<div class="link-container">
|
||||||
<div id="main" style='display:block'>
|
<div id="main" style='display:block'>
|
||||||
|
|
@ -44,6 +56,50 @@
|
||||||
|
|
||||||
<script>
|
<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 = {
|
||||||
|
'frogs': 'frogs.jpg',
|
||||||
|
'mary': 'mary_and_gabriel.png',
|
||||||
|
'crystal': 'crystal.png',
|
||||||
|
'konata': 'konata.png',
|
||||||
|
'lain': 'lain.png',
|
||||||
|
'sakura': 'sakura.jpg',
|
||||||
|
'squirtle': 'squirtle.gif'
|
||||||
|
}
|
||||||
|
|
||||||
|
document.body.style.backgroundImage = "url('bg/"+ bg_map[bg] +"')";
|
||||||
|
}
|
||||||
|
|
||||||
|
document.getElementById("dropdown").addEventListener("change", function () {
|
||||||
|
if (this.value != "") {
|
||||||
|
changeWallpaper(this.value);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
var key_map = {
|
var key_map = {
|
||||||
'a': 'https://wiki.archlinux.org/',
|
'a': 'https://wiki.archlinux.org/',
|
||||||
'd': 'https://www.domdit.com',
|
'd': 'https://www.domdit.com',
|
||||||
|
|
|
||||||
15
style.css
|
|
@ -1,5 +1,5 @@
|
||||||
body {
|
body {
|
||||||
background-image: url("bg.jpg");
|
background-image: url("bg/frogs.jpg");
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
font-family: monospace, monospace;
|
font-family: monospace, monospace;
|
||||||
font-size: 25px;
|
font-size: 25px;
|
||||||
|
|
@ -10,6 +10,19 @@ table, th, td {
|
||||||
border: 1px solid black;
|
border: 1px solid black;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.settings {
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
right: 20px;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
option, select {
|
||||||
|
width: 70px;
|
||||||
|
font-family: monospace, monospace;
|
||||||
|
background: grey;
|
||||||
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
|
||||||