mirror of
https://github.com/tobychui/zoraxy.git
synced 2025-10-30 21:44:04 +01:00
599 lines
31 KiB
HTML
599 lines
31 KiB
HTML
<!doctype html>
|
||
<html>
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta content="width=device-width, initial-scale=1.0" name="viewport">
|
||
<meta content="Reverse Proxy, Open Source, Aroz, Go, OS, NAS, Cloud" name="keywords">
|
||
<meta content="Simplify your self-hosted services with Zoraxy, the ultimate homelab networking toolbox" name="description">
|
||
<meta name="author" content="tobychui">
|
||
|
||
<!-- HTML Meta Tags -->
|
||
<title>Homelab Gateway | Zoraxy</title>
|
||
<meta name="description" content="Simplify your self-hosted services with Zoraxy, the ultimate homelab networking toolbox">
|
||
|
||
<!-- Facebook Meta Tags -->
|
||
<meta property="og:url" content="https://zoraxy.aroz.org/">
|
||
<meta property="og:type" content="website">
|
||
<meta property="og:title" content="Hello Zoraxy">
|
||
<meta property="og:description" content="Simplify your self-hosted services with Zoraxy, the ultimate homelab networking toolbox">
|
||
<meta property="og:image" content="https://zoraxy.aroz.org/img/og.png">
|
||
|
||
<!-- Twitter Meta Tags -->
|
||
<meta name="twitter:card" content="summary_large_image">
|
||
<meta property="twitter:domain" content="os.aroz.org">
|
||
<meta property="twitter:url" content="https://zoraxy.aroz.org/">
|
||
<meta name="twitter:title" content="Hello Zoraxy">
|
||
<meta name="twitter:description" content="Simplify your self-hosted services with Zoraxy, the ultimate homelab networking toolbox">
|
||
<meta name="twitter:image" content="https://zoraxy.aroz.org/img/og.png">
|
||
|
||
<!-- JavaScript Libs-->
|
||
<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
|
||
<script src="dom-i18n.min.js"></script>
|
||
<link href="main.css" rel="stylesheet">
|
||
|
||
<!-- Css stuffs-->
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.9.3/semantic.min.js" integrity="sha512-gnoBksrDbaMnlE0rhhkcx3iwzvgBGz6mOEj4/Y5ZY09n55dYddx6+WYc72A55qEesV8VX2iMomteIwobeGK1BQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.9.3/semantic.min.css" integrity="sha512-3quBdRGJyLy79hzhDDcBzANW+mVqPctrGCfIPosHQtMKb3rKsCxfyslzwlz2wj1dT8A7UX+sEvDjaUv+WExQrA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||
|
||
<!-- Favicons -->
|
||
<link href="favicon.png" rel="icon">
|
||
<link href="img/apple-touch-icon.png" rel="apple-touch-icon">
|
||
|
||
<!-- Google Fonts -->
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300;400;600;700;900&display=swap" rel="stylesheet">
|
||
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100;300;400&display=swap" rel="stylesheet">
|
||
<link href="https://fonts.googleapis.com/css2?family=M+PLUS+1p&family=Noto+Sans+JP:wght@100..900&display=swap" rel="stylesheet">
|
||
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@100;300;400&display=swap" rel="stylesheet">
|
||
|
||
<!-- AOS.js-->
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/aos/2.3.4/aos.js" integrity="sha512-A7AYk1fGKX6S2SsHywmPkrnzTZHrgiVT7GcQkLGDe2ev0aWb8zejytzS8wjo7PGEXKqJOrjQ4oORtnimIRZBtw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/aos/2.3.4/aos.css" integrity="sha512-1cK78a1o+ht2JcaW6g8OXYwqpev9+6GqOkz9xmBN9iUUhIndKtxwILGWYOSibOKjLsEdjyjZvYDq/cZwNeak0w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||
</head>
|
||
<body>
|
||
<div id="backToTopBtn" class="ui big icon button" onclick="backToTop();">
|
||
<i class="ui arrow up icon"></i>
|
||
</div>
|
||
<button id="rwdmenubtn" class="ui black big icon button"><i class="ui bars icon"></i></button>
|
||
<div id="mainmenu" class="ui segment">
|
||
<div class="ui container">
|
||
<div class="ui small stackable secondary menu">
|
||
<div class="item">
|
||
<img class="ui tiny image" src="img/logo.png">
|
||
</div>
|
||
<a class="item" href="#mainmenu" i18n>
|
||
Home // 主頁 // Startseite
|
||
</a>
|
||
<a class="item" href="#about" i18n>
|
||
About Zoraxy // 關於 Zoraxy // Über Zoraxy
|
||
</a>
|
||
<a class="item" href="#features" i18n>
|
||
Screenshots // 系統截圖 // Bildschirmfotos
|
||
</a>
|
||
<a class="item" href="#techspec" i18n>
|
||
Videos // 介紹影片 // Videos
|
||
</a>
|
||
<a class="item" href="#download" i18n>
|
||
Download // 下載 // Herunterladen
|
||
</a>
|
||
<a class="item" href="#learnmore" i18n>
|
||
Learn More // 了解更多 // Mehr erfahren
|
||
</a>
|
||
<a class="right floated item">
|
||
<div class="ui small selection dropdown">
|
||
<input type="hidden" id="language">
|
||
<div class="default text" style="color: #6cacff;"><i class="language icon"></i> Default</div>
|
||
<i class="dropdown icon"></i>
|
||
<div class="menu">
|
||
<div class="item" data-value="en">English</div>
|
||
<div class="item" data-value="zh">中文（正體）</div>
|
||
<div class="item" data-value="de">Deutsch</div>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="messageBanner">
|
||
<div class="ui text container">
|
||
<p i18n>This site is currently under development. Some information might not be ready.
|
||
// 本網站目前仍在開發中，部分資訊可能尚未準備好。
|
||
// Diese Seite ist in Entwicklung. Einige Informationen sind möglicherweise nicht verfügbar.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<div id="slideshowBanner">
|
||
<div class="title">
|
||
<h1 i18n>Zoraxy</h1>
|
||
<div class="ui divider" style="border-top: 1px solid rgba(255,255,255,0.5); "></div>
|
||
<p i18n>The ultimate homelab networking toolbox for self-hosted services
|
||
// 簡化自家伺服器部署之事，初學者居家網絡必備良器
|
||
// Das ultimative Homelab-Netzwerk-Toolbox für selbstgehostete Dienste
|
||
</p>
|
||
<a href="https://github.com/tobychui/zoraxy/releases" class="ui basic white button" target="_blank"><i style="color:white;" class="ui download icon"></i><span i18n>Download // 立即下載 // Herunterladen </span></a>
|
||
<a href="https://github.com/tobychui/zoraxy" class="ui basic white button" target="_blank"><i style="color: white;" class="ui code icon"></i><span i18n>Source Code // 查看原始碼 // Quellcode</span></a>
|
||
|
||
</div>
|
||
<div id="wavesWrapper">
|
||
<!-- CSS waves-->
|
||
<svg class="waves" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||
viewBox="0 24 150 28" preserveAspectRatio="none" shape-rendering="auto">
|
||
<defs>
|
||
<path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z" />
|
||
</defs>
|
||
<g class="parallax">
|
||
<use xlink:href="#gentle-wave" x="48" y="0" fill="rgba(255,255,255,0.7" />
|
||
<use xlink:href="#gentle-wave" x="48" y="3" fill="rgba(255,255,255,0.5)" />
|
||
<use xlink:href="#gentle-wave" x="48" y="5" fill="rgba(255,255,255,0.3)" />
|
||
<use xlink:href="#gentle-wave" x="48" y="7" fill="#fff" />
|
||
</g>
|
||
</svg>
|
||
</div>
|
||
</div>
|
||
<br><br><br><br>
|
||
<!-- About ArozOS-->
|
||
<div id="about" class="ui text container">
|
||
<div class="ui stackable grid" data-aos="fade-up">
|
||
<div class="six wide column" align="right">
|
||
<img class="ui medium image" src="img/preview-pc.png">
|
||
</div>
|
||
<div class="ten wide column">
|
||
<div class="about-text-wrapper">
|
||
<p class="about-title"><b i18n>Reverse Proxy // 反向代理 // Reverse-Proxy</b></p>
|
||
<p><span i18n>Easy setups with dynamic updates // 讓你想不到般簡單易用、迅速設定、動態更新 // Einfache Einrichtung mit dynamischen Updates</span></p>
|
||
<p i18n>Access your reverse proxy and self-hosted services from any computer with a browser, anytime, anywhere.
|
||
// 透過瀏覽器，隨時隨地在任何裝置上存取您的反向代理及自家伺服器服務。
|
||
// Greifen Sie jederzeit und überall von jedem Gerät aus auf Ihren Reverse-Proxy und selbst gehostete
|
||
</p>
|
||
<div class="ui list">
|
||
<div class="item">
|
||
<i class="caret right icon"></i>
|
||
<div class="content" i18n>
|
||
Simple setups with web UI
|
||
// 透過網頁介面簡單設定即可使用
|
||
// Einfache Einrichtung mit Web-UI
|
||
</div>
|
||
</div>
|
||
<div class="item">
|
||
<i class="caret right icon"></i>
|
||
<div class="content" i18n>
|
||
Change settings on the fly without restarting
|
||
// 即時更改設定，無需重新啟動
|
||
// Einstellungen ohne Neustart ändern
|
||
</div>
|
||
</div>
|
||
<div class="item">
|
||
<i class="caret right icon"></i>
|
||
<div class="content" i18n>
|
||
One of the best reverse proxy manager for beginners
|
||
// 可能是最適合初學者的反向代理管理器之一
|
||
// Einer der besten Reverse-Proxy-Manager für Anfänger
|
||
</div>
|
||
</div>
|
||
<div class="item">
|
||
<i class="caret right icon"></i>
|
||
<div class="content" i18n>
|
||
Easily install plugins and edit configurations
|
||
// 輕鬆安裝插件並編輯設定
|
||
// Plugins einfach installieren und Konfigurationen bearbeiten
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="ui stackable grid" data-aos="fade-up">
|
||
<div class="six wide column" align="right">
|
||
<img class="ui medium image" src="img/preview-mobile.png">
|
||
</div>
|
||
<div class="ten wide column">
|
||
<div class="about-text-wrapper">
|
||
<p class="about-title"><b i18n>Real-time Analytics // 即時流量分析 // Echtzeit-Analysen</b></p>
|
||
<p><span i18n>Dynamic statistic and access control // 動態流量數據、權限與路由設定 // Dynamische Statistik und Zugriffskontrolle</span></p>
|
||
<p i18n>Provide real time statistical overview, take advantage of the real time traffic and situations to make better decisions.
|
||
// 提供即時統計概覽，利用即時流量和情況做出更好的決策。
|
||
// Bietet eine Echtzeit-Übersicht über die Statistiken, um bessere Entscheidungen zu treffen.
|
||
</p>
|
||
<div class="ui list">
|
||
<div class="item">
|
||
<i class="caret right icon"></i>
|
||
<div class="content" i18n>
|
||
Real time visitor statistic
|
||
// 即時訪客統計概覽
|
||
// Echtzeit-Besucherstatistik
|
||
</div>
|
||
</div>
|
||
<div class="item">
|
||
<i class="caret right icon"></i>
|
||
<div class="content" i18n>
|
||
Instant network utilitization overview
|
||
// 即時網路使用率概覽
|
||
// Sofortige Netzwerkübersicht
|
||
</div>
|
||
</div>
|
||
<div class="item">
|
||
<i class="caret right icon"></i>
|
||
<div class="content" i18n>
|
||
No-reload access control and settings
|
||
// 即時生效存取控制和設定
|
||
// Zugriffskontrolle und Einstellungen ohne Neustart
|
||
</div>
|
||
</div>
|
||
<div class="item">
|
||
<i class="caret right icon"></i>
|
||
<div class="content" i18n>
|
||
One-click setting change with no downtime
|
||
// 一鍵設定更改，無需停機
|
||
// Einstellungsänderung mit einem Klick ohne Ausfallzeiten
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<br><br><br><br>
|
||
<!-- Features -->
|
||
<div class="ui divider"></div>
|
||
<div id="features" class="ui container">
|
||
<div class="centered title">
|
||
<h1 i18n>Screenshots
|
||
// 系統截圖
|
||
// Bildschirmfotos
|
||
</h1>
|
||
</div>
|
||
<div class="ui three column stackable grid">
|
||
<div class="column">
|
||
<img class="ui fluid image screenshot" src="img/screenshots/1.png">
|
||
</div>
|
||
<div class="column">
|
||
<img class="ui fluid image screenshot" src="img/screenshots/2.png">
|
||
</div>
|
||
<div class="column">
|
||
<img class="ui fluid image screenshot" src="img/screenshots/3.png">
|
||
</div>
|
||
<div class="column">
|
||
<img class="ui fluid image screenshot" src="img/screenshots/4.png">
|
||
</div>
|
||
<div class="column">
|
||
<img class="ui fluid image screenshot" src="img/screenshots/5.png">
|
||
</div>
|
||
<div class="column">
|
||
<img class="ui fluid image screenshot" src="img/screenshots/6.png">
|
||
</div>
|
||
<!-- <div class="column">
|
||
<img class="ui fluid image screenshot" src="img/screenshots/7.png">
|
||
</div> -->
|
||
<div class="column">
|
||
<img class="ui fluid image screenshot" src="img/screenshots/8.png">
|
||
</div>
|
||
<div class="column">
|
||
<img class="ui fluid image screenshot" src="img/screenshots/9.png">
|
||
</div>
|
||
<div class="column">
|
||
<img class="ui fluid image screenshot" src="img/screenshots/10.png">
|
||
</div>
|
||
</div>
|
||
<br><br><br>
|
||
</div>
|
||
|
||
<!-- Spec -->
|
||
<div id="techspec" class="blackbanner">
|
||
<br><br>
|
||
<div class="centered title">
|
||
<h1 style="font-weight: 600;" i18n>
|
||
Review Videos
|
||
// 介紹影片
|
||
// Videos
|
||
</h1>
|
||
</div>
|
||
<div>
|
||
<div class="videoScrollBar">
|
||
<div class="introvideo"><iframe width="560" height="315" src="https://www.youtube.com/embed/5-lps8DC6_Y?si=rkfePn9kiYKCvYUZ" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe></div>
|
||
<div class="introvideo"><iframe width="560" height="315" src="https://www.youtube.com/embed/49xQYLpmedE?si=fgba2iK55s1760Xr" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe></div>
|
||
<div class="introvideo"><iframe width="560" height="315" src="https://www.youtube.com/embed/I_F97he5F2A?si=qKEXwDcjkX1nPejq" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe></div>
|
||
<div class="introvideo"><iframe width="560" height="315" src="https://www.youtube.com/embed/FNU08-ufByM?si=I2hq9vsapeXB2Oqb" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe></div>
|
||
</div>
|
||
</div>
|
||
<br><br><br>
|
||
</div>
|
||
|
||
<!-- Download -->
|
||
<div id="download" class="ui text container">
|
||
<br><br>
|
||
<div class="centered title">
|
||
<h1 i18n>
|
||
Download
|
||
// 下載
|
||
// Herunterladen
|
||
</h1>
|
||
</div>
|
||
|
||
<div class="downloadTabWrapper">
|
||
<div class="ui top attached fluid stackable tabular menu">
|
||
<a class="active item" data-tab="linux"><i class="grey linux icon"></i> Linux</a>
|
||
<a class="item" data-tab="windows"><i class="blue windows icon"></i> Windows</a>
|
||
<a class="item" data-tab="rpi"><i class="red raspberry pi icon"></i><span i18n>SBCs // ARM 開發板 // SBCs</span></a>
|
||
<a class="item" data-tab="build"><i class="code icon"></i> <span i18n>Build from source // 從原始碼建置 // Aus dem Quellcode erstellen</span> </a>
|
||
</div>
|
||
<div class="ui bottom attached active tab segment" data-tab="linux">
|
||
<p i18n>
|
||
Install with command line
|
||
// 使用 CLI 下載並執行發行版本
|
||
// Installieren Sie mit der Befehlszeile
|
||
</p>
|
||
<div class="ui black message">
|
||
<code>
|
||
wget https://github.com/tobychui/zoraxy/releases/latest/download/zoraxy_linux_amd64<br>
|
||
chmod +x ./zoraxy_linux_amd64<br>
|
||
sudo ./zoraxy_linux_amd64
|
||
</code>
|
||
</div>
|
||
<br>
|
||
<p i18n>
|
||
Install with precompiled binary
|
||
// 下載發行版本
|
||
// Installieren Sie mit vorkompilierten Binärdateien
|
||
</p>
|
||
<button class="ui basic downloadButton button" onclick='handleDownload("zoraxy_linux_amd64");'>
|
||
<i class="black linux icon"></i>
|
||
<span i18n>Download x64
|
||
// 下載 64位元 執行檔
|
||
// Herunterladen x64
|
||
</span>
|
||
</button>
|
||
<span style="font-size: 1.2em; font-weight: 600; margin-right: 0.4em">OR</span>
|
||
<button class="ui basic downloadButton button" onclick='handleDownload("zoraxy_linux_386");'>
|
||
<i class="black linux icon"></i>
|
||
<span i18n>Download x32
|
||
// 下載 32位元 執行檔
|
||
// Herunterladen x32
|
||
</span>
|
||
</button>
|
||
</div>
|
||
<div class="ui bottom attached tab segment" data-tab="windows">
|
||
<p i18n>
|
||
Install with precompiled binary
|
||
// 下載發行版本
|
||
// Installieren Sie mit vorkompilierten Binärdateien
|
||
</p>
|
||
<button class="ui basic downloadButton button" onclick='handleDownload("zoraxy_windows_amd64.exe");'>
|
||
<i class="blue windows icon"></i>
|
||
<span i18n>
|
||
Download Zoraxy for Windows
|
||
// 下載 Windows 版 Zoraxy
|
||
// Zoraxy für Windows herunterladen
|
||
</span>
|
||
</button>
|
||
<br><br>
|
||
</div>
|
||
<div class="ui bottom attached tab segment" data-tab="rpi">
|
||
<p i18n>Install with command line (armv6-7, arm64, x86)
|
||
// 使用 CLI 下載並執行 （armv6-7, arm64, x86）
|
||
// Installieren Sie mit der Befehlszeile (armv6-7, arm64, x86)
|
||
</p>
|
||
<div class="ui black message">
|
||
<code>
|
||
# Check your CPU architecture<br>
|
||
uname -m <br>
|
||
<br>
|
||
# For arm64 (aarch64) CPU<br>
|
||
wget -O zoraxy https://github.com/tobychui/zoraxy/releases/latest/download/zoraxy_linux_arm64<br>
|
||
<br>
|
||
# For armv6 (armv6l) / armv7 (armv7l) CPU<br>
|
||
wget -O zoraxy https://github.com/tobychui/zoraxy/releases/latest/download/zoraxy_linux_arm<br>
|
||
<br>
|
||
# For RISC-V (riscv64) CPU<br>
|
||
wget -O zoraxy https://github.com/tobychui/zoraxy/releases/latest/download/zoraxy_linux_riscv64<br>
|
||
<br>
|
||
|
||
chmod +x ./zoraxy<br>
|
||
sudo ./zoraxy <br>
|
||
</code>
|
||
</div>
|
||
<br>
|
||
<p i18n>Install with precompiled binary
|
||
// 下載發行版本
|
||
// Installieren Sie mit vorkompilierten Binärdateien
|
||
</p>
|
||
<button class="ui basic downloadButton button" onclick='handleDownload("zoraxy_linux_arm");'><i class="black download icon"></i> <span i18n></span>arm (v6, v7)</button>
|
||
<button class="ui basic downloadButton button" onclick='handleDownload("zoraxy_linux_arm64");'><i class="black download icon"></i> <span i18n></span>arm64</button>
|
||
<button class="ui basic downloadButton button" onclick='handleDownload("zoraxy_linux_riscv64");'><i class="grey download icon"></i> <span i18n></span>riscv64</button>
|
||
</div>
|
||
<div class="ui bottom attached tab segment" data-tab="build">
|
||
<p i18n>Require Go (Golang) compiler. Details build from source instruction can be found on Zoraxy Github README file.
|
||
// 需要 Go (Go 語言）編譯器。建置詳情可以在 Zoraxy Github README 檔案中找到。
|
||
// Erfordert den Go (Golang) Compiler. Detaillierte Anweisungen zum Erstellen aus dem Quellcode finden Sie in der Zoraxy Github README-Datei.
|
||
</p>
|
||
<div class="ui black message">
|
||
<code>
|
||
git clone https://github.com/tobychui/zoraxy<br>
|
||
cd ./zoraxy/src/<br>
|
||
go mod tidy<br>
|
||
go build<br>
|
||
sudo ./zoraxy <br>
|
||
</code>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<p>
|
||
<span i18n>After Zoraxy is started, navigate to
|
||
// 當 Zoraxy 執行檔 / 服務啟動後，使用瀏覽器開啟
|
||
// Nachdem Zoraxy gestartet wurde, navigieren Sie zu
|
||
</span>
|
||
<a href="http://localhost:8000" target="_blank">http://localhost:8000</a>
|
||
<span i18n>to continue account and system setup.
|
||
// 以繼續帳戶和系統設定。
|
||
// um die Konto- und Systemeinrichtung fortzusetzen.
|
||
</span>
|
||
</p>
|
||
<br><br>
|
||
</div>
|
||
|
||
<!-- Learn More -->
|
||
<div class="ui divider"></div>
|
||
<div id="learnmore" class="ui text container">
|
||
<div class="centered title" style="margin-bottom: 0px;">
|
||
<h1 i18n>Learn More
|
||
// 了解更多
|
||
// Mehr erfahren
|
||
</h1>
|
||
<p i18n>If you like this project, please feel free to give us a ⭐ star ⭐.
|
||
// 如果您喜歡這個開源專案，歡迎來給我們一顆 ⭐星星⭐ 喔！!
|
||
// Wenn Ihnen dieses Projekt gefällt, geben Sie uns bitte einen ⭐ Stern ⭐.
|
||
</p>
|
||
</div>
|
||
<div class="ui basic segment linkicons">
|
||
<div class="ui big breadcrumb">
|
||
<a class="section externallink" href="https://github.com/tobychui/zoraxy" target="_blank">
|
||
<div class="ui icon header">
|
||
<i class="black github icon"></i>
|
||
<div class="content" i18n>
|
||
Github
|
||
// 源碼
|
||
// Quellcode
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<i class="divider"> </i>
|
||
<a class="section externallink" href="https://zoraxy.aroz.org/plugins/html/" target="_blank">
|
||
<div class="ui icon header">
|
||
<i class="green code icon"></i>
|
||
<div class="content" i18n>
|
||
Plugin Devs
|
||
// 插件開發
|
||
// Plugin-Entwickler
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<i class=" divider"> </i>
|
||
<a class="section externallink" href="mailto:toby@imuslab.com" target="_blank">
|
||
<div class="ui icon header">
|
||
<i class="yellow mail icon"></i>
|
||
<div class="content" i18n>
|
||
Email
|
||
// 電子郵件
|
||
// E-Mail
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<i class=" divider"> </i>
|
||
<a class="section externallink" href="https://t.me/ArOZBeta" target="_blank">
|
||
<div class="ui icon header">
|
||
<i class="blue telegram icon"></i>
|
||
<div class="content">
|
||
Telegram
|
||
</div>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<br><br><br><br>
|
||
</div>
|
||
|
||
<!-- Footer -->
|
||
<div id="footer">
|
||
<div class="ui container">
|
||
<br><br>
|
||
<div class="ui stackable grid" style="height: 100%;">
|
||
<div class="six wide column" style="height: 100%;">
|
||
<a href="https://zoraxy.aroz.org"><img src="img/logo_white.png" class="ui small image"></a>
|
||
<p><span style="font-weight: 300;">The Zoraxy Project</span><br>
|
||
© Toby Chui</p>
|
||
|
||
<div class="bottom-attach">
|
||
<br><br>
|
||
<div class="ui breadcrumb" style="margin-top: 0.4em;">
|
||
<div class="section" i18n><a style="color: white;" href="https://zoraxy.aroz.org" target="_blank">zoraxy.aroz.org</a></div>
|
||
<div class="divider"> / </div>
|
||
<div class="section">2018 - <span class="year">now</span></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="three wide column">
|
||
<div class="ui list">
|
||
<div class="item title" i18n>Developer Tools
|
||
// 開發者工具
|
||
// Entwicklerwerkzeuge
|
||
</div>
|
||
<div class="item"><a href="https://github.com/tobychui/zoraxy/wiki" target="_blank">Zoraxy Wiki</a></div>
|
||
<div class="item"><a href="https://github.com/tobychui/zoraxy" target="_blank">Source Code</a></div>
|
||
<div class="item"><a href="" target="_blank">Offical Plugin List</a></div>
|
||
<div class="item"><a href="" target="_blank">Plugin Development Guide</a></div>
|
||
</div>
|
||
</div>
|
||
<div class="three wide column">
|
||
<div class="ui list">
|
||
<div class="item title" i18n>Project Spin-offs
|
||
// 衍生開源計劃
|
||
// Projekt-Ableger
|
||
</div>
|
||
<div class="item"><a href="https://os.aroz.org" target="_blank">ArozOS</a></div>
|
||
</div>
|
||
</div>
|
||
<div class="three wide column">
|
||
<div class="ui list">
|
||
<div class="item title" i18n>Related Links
|
||
// 相關連接
|
||
// Verwandte Links
|
||
</div>
|
||
<div class="item"><a href="https://github.com/tobychui/zoraxy/wiki/Getting-Started" target="_blank" i18n>Getting Started</a></div>
|
||
<div class="item"><a href="https://github.com/tobychui/zoraxy/releases" target="_blank">Zoraxy Release</a></div>
|
||
<div class="item"><a href="https://hub.docker.com/r/zoraxydocker/zoraxy" target="_blank">Zoraxy Docker</a></div>
|
||
<div class="item"><a href="https://imuslab.com" target="_blank">imuslab</a></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<br><br><br><br>
|
||
</div>
|
||
|
||
<script>
|
||
AOS.init();
|
||
$(".year").text(new Date().getFullYear());
|
||
|
||
// Function to open the modal with the clicked image using jQuery
|
||
function openModal(src) {
|
||
// Remove the old modal if it exists
|
||
$('#imageModal').remove();
|
||
|
||
const modal = $('<div style="display:none;">', { id: 'imageModal' }).css({
|
||
position: 'fixed',
|
||
top: '0',
|
||
left: '0',
|
||
width: '100%',
|
||
height: '100%',
|
||
backgroundColor: 'rgba(0, 0, 0, 0.8)',
|
||
display: 'flex',
|
||
alignItems: 'center',
|
||
justifyContent: 'center',
|
||
zIndex: '1000'
|
||
});
|
||
|
||
const img = $('<img>', { src: src }).css({
|
||
maxWidth: '80%',
|
||
maxHeight: '80%',
|
||
boxShadow: '0 0 10px rgba(0, 0, 0, 0.5)'
|
||
});
|
||
|
||
modal.append(img);
|
||
$("body").css("overflow", "hidden");
|
||
|
||
modal.on('click', function() {
|
||
modal.remove();
|
||
$("body").css("overflow", "auto");
|
||
});
|
||
|
||
$('body').append(modal);
|
||
}
|
||
|
||
// Add click event listener to all screenshot images using jQuery
|
||
$('.screenshot').on('click', function() {
|
||
openModal($(this).attr('src'));
|
||
});
|
||
</script>
|
||
<!-- Locales -->
|
||
<script src="main.js" defer></script>
|
||
</body>
|
||
</html> |