mirror of
https://github.com/milk-net/milk-net.github.io.git
synced 2025-04-16 07:33:42 -05:00
Compare commits
13 commits
cae3f70508
...
cdaa7b8383
| Author | SHA1 | Date | |
|---|---|---|---|
|
cdaa7b8383 | ||
|
|
b04eba2904 | ||
|
|
e7d093519c | ||
|
|
9879c8c8f8 | ||
|
|
c249bbce55 | ||
|
|
6554f40c93 | ||
|
|
8ea2d75bfa | ||
|
|
a052e64900 | ||
|
|
a8feb2e0c2 | ||
|
|
46f0579d07 | ||
|
|
6b11c524e4 | ||
|
|
b1ef311406 | ||
|
|
14ff052b93 |
4 changed files with 163 additions and 0 deletions
21
qr/index.html
Normal file
21
qr/index.html
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<title>MilkNet | QR Code Generator</title>
|
||||
<link id="favicon" rel="icon" href="/assets/img/milk.png" type="image/x-icon">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>QR Code Generator</h1>
|
||||
<input type="text" id="qr-text" placeholder="Enter text or URL" />
|
||||
<button id="generate">Generate QR</button>
|
||||
<div id="qrcode"></div>
|
||||
<button id="download" style="display:none;">Download image</button>
|
||||
</div>
|
||||
<script src="https://cdn.jsdelivr.net/npm/qrcodejs/qrcode.min.js"></script>
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
53
qr/script.js
Normal file
53
qr/script.js
Normal file
|
|
@ -0,0 +1,53 @@
|
|||
let qrcode;
|
||||
|
||||
const input = document.getElementById('qr-text');
|
||||
const generateBtn = document.getElementById('generate');
|
||||
const downloadBtn = document.getElementById('download');
|
||||
const qrContainer = document.getElementById('qrcode');
|
||||
|
||||
function generateQR() {
|
||||
const qrText = input.value.trim();
|
||||
if (!qrText) return alert("Please enter text!");
|
||||
|
||||
qrContainer.innerHTML = "";
|
||||
qrContainer.classList.remove('fade-in');
|
||||
|
||||
// Generate QR
|
||||
qrcode = new QRCode(qrContainer, {
|
||||
text: qrText,
|
||||
width: 256,
|
||||
height: 256,
|
||||
colorDark : "#000000",
|
||||
colorLight : "#ffffff",
|
||||
correctLevel : QRCode.CorrectLevel.H
|
||||
});
|
||||
|
||||
// Wait for QR code to render
|
||||
setTimeout(() => {
|
||||
qrContainer.classList.add('fade-in');
|
||||
}, 50);
|
||||
|
||||
downloadBtn.style.display = 'inline-block';
|
||||
}
|
||||
|
||||
// Click event
|
||||
generateBtn.addEventListener('click', generateQR);
|
||||
|
||||
// Keydown event on input (Enter)
|
||||
input.addEventListener('keydown', (e) => {
|
||||
if (e.key === 'Enter') {
|
||||
e.preventDefault(); // prevent form submit/reload if inside a form
|
||||
generateQR();
|
||||
}
|
||||
});
|
||||
|
||||
// Download QR
|
||||
downloadBtn.addEventListener('click', () => {
|
||||
const img = qrContainer.querySelector('img');
|
||||
if (img) {
|
||||
const link = document.createElement('a');
|
||||
link.href = img.src;
|
||||
link.download = 'qrcode.png';
|
||||
link.click();
|
||||
}
|
||||
});
|
||||
66
qr/style.css
Normal file
66
qr/style.css
Normal file
|
|
@ -0,0 +1,66 @@
|
|||
body {
|
||||
font-family: 'Segoe UI', sans-serif;
|
||||
background: #000;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
padding: 2rem;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.container {
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
backdrop-filter: blur(12px);
|
||||
-webkit-backdrop-filter: blur(12px);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
padding: 2rem;
|
||||
border-radius: 20px;
|
||||
box-shadow: 0 0 30px rgba(255, 255, 255, 0.05);
|
||||
display: inline-block;
|
||||
max-width: 90%;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
input {
|
||||
width: 280px;
|
||||
padding: 0.6rem;
|
||||
margin-bottom: 1rem;
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
color: #fff;
|
||||
border: 1px solid rgba(255, 255, 255, 0.2);
|
||||
border-radius: 10px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
input::placeholder {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 0.6rem 1.2rem;
|
||||
margin-top: 1rem;
|
||||
cursor: pointer;
|
||||
background: rgba(0, 123, 255, 0.8);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 10px;
|
||||
transition: background 0.2s ease;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background: rgba(0, 123, 255, 1);
|
||||
}
|
||||
|
||||
#qrcode {
|
||||
margin-top: 2rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
23
wx/index.html
Normal file
23
wx/index.html
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>MilkNet | WX</title>
|
||||
<link rel="icon" type="image/png" href="/assets/img/milk.png"/>
|
||||
<link rel="stylesheet" href="/style.css">
|
||||
<script src="/index.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<img src="/assets/img/milk_optimized.png" class="center">
|
||||
<h1 class="center-text">MilkNet</h1>
|
||||
|
||||
<div class="center-text">
|
||||
<p class="center-text">Weather apps</p>
|
||||
<a href="/weather">IntelliSTAR by qconrad</a> • <a href="/weatherscan-v1/v1.weatherscan.net">Weatherscan v1 by mistwx.com</a> • <a href="/weatherscan-v2/v2.weatherscan.net">Weatherscan v2 by mistwx.com</a>
|
||||
|
||||
<footer>
|
||||
<a href="/"><img src="/assets/img/88x31.png" loading="lazy" width="88" height="31"></a>
|
||||
<a href="/"><img src="/assets/img/88x31_light.png" loading="lazy" width="88" height="31"></a>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
</head>
|
||||
Loading…
Add table
Reference in a new issue