TwinpathNet Hotspot Theme

A high-performance, Vercel-inspired Mikrotik Hotspot template designed for modern ISPs.

✨ Features

🎨 Vercel-Inspired UI

Built with a sleek, dark-mode-first prioritization. Minimalist aesthetics that focus on content and typography, providing a premium feel for end-users.

🛡️ Advanced Security

API Hardening: Automatically hides details of unused vouchers (0 uptime/bytes) to prevent enumeration attacks.
Form Isolation: 'Info Check' logic is physically separated from the main login form, preventing accidental logins.
Input Guard: Native Enter key handling preventing unwanted form submissions.

⚡ Smart QR Scanner

Context-Aware: Intelligently switches between "Login Mode" and "Check Status Mode".
Fast Path: Instantly processes scanned codes without unnecessary confirmation dialogs when checking status.
Auto Cleanup: Modals automatically close when switching tabs or pressing Escape.

🌐 Multi-Language Support

Native Localization: Built-in JSON-based translation engine (ID/EN).
Auto-Detect: Remembers user preference via LocalStorage.

🚀 Installation

Download Release Grab the latest .zip from the Releases Page.
Drag & Drop Extract the folder and upload it to your Mikrotik's Files menu via Winbox or FTP.
Configure Profile Go to IP > Hotspot > Server Profiles, select your profile, and point HTML Directory to the uploaded folder.

🛠️ Configuration

1. Edit Config File

Open js/config.js to customize your brand:

const brandConfig = {
    brandName: "TwinpathNet",
    portalUrl: "http://h.twinpath.net", // Your Hotspot DNS Name
    mikhmonUrl: "https://mikhmon.dyzulk.com", // Your Mikhmon API URL
    mikhmonSession: "Twinpath-Net", // Your Mikhmon Session Name
    allowedDomains: [ // Whitelist Domains for QR Scanner
        "h.twinpath.net",
        "welcome.wifi.id",
        "yourportal.net"
    ]
};

2. Walled Garden (Important!)

To ensure the Voucher Check feature works before users log in, you must allow access to your Mikhmon API domain in Mikrotik.

Copy and paste this script into your Mikrotik Terminal:

/ip hotspot walled-garden
add dst-host=mikhmon.dyzulk.com comment="Allow Mikhmon API for Voucher Check"
add dst-host=unpkg.com comment="Allow External Icons/Fonts (If used)"

(Replace mikhmon.dyzulk.com with your actual Mikhmon domain)