├── screenshots
├── apps-sections.jpg
├── settings-sections.jpg
├── apps-sections-select.jpg
├── sub-links-sections.jpg
└── user-status-sections.jpg
├── LICENSE
├── README_zh.md
├── README_fa.md
├── README_en.md
├── README.md
└── index.html
/screenshots/apps-sections.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/legiz-ru/material-remnawave-subscription-page/HEAD/screenshots/apps-sections.jpg
--------------------------------------------------------------------------------
/screenshots/settings-sections.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/legiz-ru/material-remnawave-subscription-page/HEAD/screenshots/settings-sections.jpg
--------------------------------------------------------------------------------
/screenshots/apps-sections-select.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/legiz-ru/material-remnawave-subscription-page/HEAD/screenshots/apps-sections-select.jpg
--------------------------------------------------------------------------------
/screenshots/sub-links-sections.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/legiz-ru/material-remnawave-subscription-page/HEAD/screenshots/sub-links-sections.jpg
--------------------------------------------------------------------------------
/screenshots/user-status-sections.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/legiz-ru/material-remnawave-subscription-page/HEAD/screenshots/user-status-sections.jpg
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2025 legiz-ru
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README_zh.md:
--------------------------------------------------------------------------------
1 | [Русская версия](README.md) | [English Version](README_en.md) | [中文版](README_zh.md) | [نسخه فارسی](README_fa.md)
2 |
3 | [演示页面](https://legiz-ru.github.io/Orion)
4 |
5 | # Material Remnawave 订阅页面
6 |
7 | 此存储库包含 Remnawave 代理面板订阅页面的源代码，采用现代 Material Design 3 风格设计。该页面为用户提供方便的订阅信息访问、连接说明和链接。代码在 Claude Sonnet 4 AI 模型的帮助下编写。
8 |
9 | ## 主要特性
10 |
11 | * **Material 3 设计：** 根据最新的 Material Design 3 原则开发的现代直观用户界面。
12 |
13 | * **深色和浅色主题支持：** 自动或手动在浅色和深色主题之间切换，适合任何光照条件下的舒适使用。
14 |
15 | * **灵活的应用配置：** 支持用于连接的标准推荐应用程序列表，以及通过[可自定义的 `app-config.json`](https://remna.st/docs/install/remnawave-subscription-page#custom-app-configjson-custom-apps) 文件轻松集成第三方客户端。
16 | * * **自定义组**
17 | 通过集成文件向应用程序部分添加额外组的能力，[例如，`TV 部分`](https://github.com/legiz-ru/my-remnawave/blob/main/sub-page/multiapp/app-config.json)。
18 |
19 | * **品牌支持：** 通过 `app-config.json` 配置中的 `logoUrl` 和 `supportUrl` 参数设置徽标和支持链接，实现页面个性化。
20 |
21 | * **remnawave-json 支持：** 可将订阅页面集成到 https://github.com/Jolymmiels/remnawave-json（适配的 index.html 文件位于 remnawave-json 文件夹中）。
22 |
23 | * **单独链接复制：** 除了主要订阅链接外，还可以直接从页面复制单独链接（例如 `vless://`、`trojan://`）。
24 |
25 | * **多语言支持：** 页面支持俄语、英语、波斯语和中文，具有自动浏览器语言检测功能。
26 |
27 | ## 屏幕截图
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 | ## 安装
38 |
39 | 1. **下载页面文件：**
40 | 使用 `curl` 将 `index.html` 文件下载到您的 `docker-compose.yml` 所在的同一目录：
41 |
42 | ```bash
43 | curl -o index.html https://raw.githubusercontent.com/legiz-ru/material-remnawave-subscription-page/refs/heads/main/index.html
44 | ```
45 |
46 | 2. **配置 Docker Compose：**
47 | 通过在 `remnawave-subscription-page` 容器中挂载 `volumes`，在您的 `docker-compose.yml` 中指定下载的 `index.html` 的路径。
48 |
49 | 标准安装示例：
50 |
51 | ```yaml
52 | services:
53 | remnawave-subscription-page:
54 | volumes:
55 | - ./index.html:/opt/app/frontend/index.html
56 | ```
57 |
58 | 如果您计划使用[自定义应用程序列表](https://remna.st/docs/install/remnawave-subscription-page#custom-app-configjson-custom-apps)（`app-config.json`），请添加相应的 `volume`：
59 |
60 | ```yaml
61 | services:
62 | remnawave-subscription-page:
63 | image: remnawave/subscription-page:latest
64 | volumes:
65 | - ./index.html:/opt/app/frontend/index.html
66 | - ./app-config.json:/opt/app/frontend/assets/app-config.json
67 | ```
68 |
69 | 您可以使用我的自定义应用程序列表之一，可在以下位置获得：[自定义应用列表](https://github.com/legiz-ru/my-remnawave/blob/main/README.md#remnawave-subscription-page-%D1%81lient-configuration)
70 |
71 | 3. **重启容器：**
72 | 要应用更改，请重启您的 Docker 容器：
73 |
74 | ```bash
75 | docker compose down remnawave-subscription-page && docker compose up -d remnawave-subscription-page
76 | ```
77 |
78 | ## 联系方式
79 |
80 | * [Telegram 频道](https://t.me/legiz_trashbag)
81 |
82 | ## 支持项目
83 |
84 | 如果您喜欢这个项目并想支持其开发，您可以进行捐赠：
85 |
86 | * [Telegram 上的 Tribute](https://t.me/tribute/app?startapp=drzu)
87 | * [TON USDT: `UQAGQTQZYCx5TWj5cmTLpo7164PFsXqZZJ6t6x88n7sHW9gU`]
--------------------------------------------------------------------------------
/README_fa.md:
--------------------------------------------------------------------------------
1 | [Русская версия](README.md) | [English Version](README_en.md) | [中文版](README_zh.md) | [نسخه فارسی](README_fa.md)
2 |
3 | [صفحهی نمایشی](https://legiz-ru.github.io/Orion)
4 |
5 | # صفحه اشتراک Material Remnawave
6 |
7 | این مخزن حاوی کد منبع صفحه اشتراک پنل پروکسی Remnawave است که با طراحی مدرن Material Design 3 ایجاد شده است. این صفحه به کاربران دسترسی راحت به اطلاعات اشتراک، دستورالعملهای اتصال و لینکها ارائه میدهد. کد با کمک مدل هوش مصنوعی Claude Sonnet 4 نوشته شده است.
8 |
9 | ## ویژگیهای کلیدی
10 |
11 | * **طراحی Material 3:** رابط کاربری مدرن و بصری که بر اساس آخرین اصول Material Design 3 توسعه یافته است.
12 |
13 | * **پشتیبانی از تم تیره و روشن:** تغییر خودکار یا دستی بین تمهای روشن و تیره برای استفاده راحت در هر شرایط نوری.
14 |
15 | * **پیکربندی انعطافپذیر اپلیکیشن:** از فهرست استاندارد اپلیکیشنهای توصیه شده برای اتصال پشتیبانی میکند، همچنین ادغام آسان کلاینتهای شخص ثالث از طریق فایل [`app-config.json` قابل تنظیم](https://remna.st/docs/install/remnawave-subscription-page#custom-app-configjson-custom-apps).
16 | * * **گروههای سفارشی**
17 | امکان اضافه کردن گروههای اضافی به بخش اپها از طریق فایل ادغام، [به عنوان مثال، `بخش TV`](https://github.com/legiz-ru/my-remnawave/blob/main/sub-page/multiapp/app-config.json).
18 |
19 | * **پشتیبانی از برندینگ:** پیکربندی لوگو و لینک پشتیبانی از طریق پارامترهای `logoUrl` و `supportUrl` در تنظیمات `app-config.json` برای شخصیسازی صفحه.
20 |
21 | * **پشتیبانی از برندینگ:** پیکربندی لوگو و لینک پشتیبانی از طریق پارامترهای `logoUrl` و `supportUrl` در تنظیمات `app-config.json` برای شخصیسازی صفحه.
22 |
23 | * **کپی کردن لینکهای جداگانه:** امکان کپی کردن لینکهای جداگانه (مثل `vless://`, `trojan://`) مستقیماً از صفحه، علاوه بر لینک اشتراک اصلی.
24 |
25 | * **پشتیبانی چند زبانه:** در دسترس بودن صفحه به زبانهای روسی، انگلیسی، فارسی و چینی، با تشخیص خودکار زبان مرورگر.
26 |
27 | ## اسکرینشاتها
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 | ## نصب
38 |
39 | 1. **دانلود فایل صفحه:**
40 | فایل `index.html` را در همان دایرکتوری که فایل `docker-compose.yml` شما قرار دارد، با استفاده از `curl` دانلود کنید:
41 |
42 | ```bash
43 | curl -o index.html https://raw.githubusercontent.com/legiz-ru/material-remnawave-subscription-page/refs/heads/main/index.html
44 | ```
45 |
46 | 2. **پیکربندی Docker Compose:**
47 | مسیر فایل دانلود شده `index.html` را در `docker-compose.yml` خود با mount کردن `volumes` در container `remnawave-subscription-page` مشخص کنید.
48 |
49 | مثال برای نصب استاندارد:
50 |
51 | ```yaml
52 | services:
53 | remnawave-subscription-page:
54 | volumes:
55 | - ./index.html:/opt/app/frontend/index.html
56 | ```
57 |
58 | اگر قصد استفاده از [فهرست اپلیکیشن سفارشی](https://remna.st/docs/install/remnawave-subscription-page#custom-app-configjson-custom-apps) (`app-config.json`) را دارید، `volume` مربوطه را اضافه کنید:
59 |
60 | ```yaml
61 | services:
62 | remnawave-subscription-page:
63 | image: remnawave/subscription-page:latest
64 | volumes:
65 | - ./index.html:/opt/app/frontend/index.html
66 | - ./app-config.json:/opt/app/frontend/assets/app-config.json
67 | ```
68 |
69 | میتوانید از یکی از فهرستهای اپلیکیشن سفارشی من استفاده کنید که در آدرس زیر در دسترس است: [فهرست اپ سفارشی](https://github.com/legiz-ru/my-remnawave/blob/main/README.md#remnawave-subscription-page-%D1%81lient-configuration)
70 |
71 | 3. **راهاندازی مجدد container:**
72 | برای اعمال تغییرات، container Docker خود را مجدداً راهاندازی کنید:
73 |
74 | ```bash
75 | docker compose down remnawave-subscription-page && docker compose up -d remnawave-subscription-page
76 | ```
77 |
78 | ## تماس
79 |
80 | * [کانال تلگرام](https://t.me/legiz_trashbag)
81 |
82 | ## حمایت از پروژه
83 |
84 | اگر این پروژه را دوست دارید و میخواهید از توسعه آن حمایت کنید، میتوانید کمک مالی کنید:
85 |
86 | * [Tribute در تلگرام](https://t.me/tribute/app?startapp=drzu)
87 | * [TON USDT: `UQAGQTQZYCx5TWj5cmTLpo7164PFsXqZZJ6t6x88n7sHW9gU`]
--------------------------------------------------------------------------------
/README_en.md:
--------------------------------------------------------------------------------
1 | [Русская версия](README.md) | [English Version](README_en.md) | [中文版](README_zh.md) | [نسخه فارسی](README_fa.md)
2 |
3 | [Demo page](https://legiz-ru.github.io/Orion)
4 |
5 | # Material Remnawave Subscription page
6 |
7 | This repository contains the source code for the subscription page of the Remnawave proxy panel, designed in a modern Material Design 3 style. The page provides users with convenient access to subscription information, connection instructions, and links. The code was written with the help of the Claude Sonnet 4 AI model.
8 |
9 | ## Key Features
10 |
11 | * **Material 3 Design:** A modern and intuitive user interface developed in accordance with the latest Material Design 3 principles.
12 |
13 | * **Dark and Light Theme Support:** Automatic or manual switching between light and dark themes for comfortable use in any lighting conditions.
14 |
15 | * **Flexible App Configuration:** Supports a standard list of recommended applications for connection, as well as easy integration of third-party clients via a [customizable `app-config.json`](https://remna.st/docs/install/remnawave-subscription-page#custom-app-configjson-custom-apps) file.
16 | * * **Custom Groups**
17 | The ability to add additional groups to the apps section via the integration file, [for example, the `TV section`](https://github.com/legiz-ru/my-remnawave/blob/main/sub-page/multiapp/app-config.json).
18 |
19 | * **Branding Support:** Configure logo and support link through `logoUrl` and `supportUrl` parameters in `app-config.json` configuration for page personalization.
20 |
21 | * **remnawave-json Support:** Ability to integrate the subscription page into https://github.com/Jolymmiels/remnawave-json (adapted index.html file is located in the remnawave-json folder).
22 |
23 | * **Individual Link Copying:** Ability to copy individual links (e.g., `vless://`, `trojan://` ) directly from the page, in addition to the main subscription link.
24 |
25 | * **Multi-language Support:** Availability of the page in Russian, English, Persian, and Chinese, with automatic detection of the browser language.
26 |
27 | ## Screenshots
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 | ## Installation
38 |
39 | 1. **Download the page file:**
40 | Download the `index.html` file to the same directory where your `docker-compose.yml` is located, using `curl`:
41 |
42 | ```bash
43 | curl -o index.html https://raw.githubusercontent.com/legiz-ru/material-remnawave-subscription-page/refs/heads/main/index.html
44 | ```
45 |
46 | 2. **Configure Docker Compose:**
47 | Specify the path to the downloaded `index.html` in your `docker-compose.yml` by mounting `volumes` into the `remnawave-subscription-page` container.
48 |
49 | Example for a standard installation:
50 |
51 | ```yaml
52 | services:
53 | remnawave-subscription-page:
54 | volumes:
55 | - ./index.html:/opt/app/frontend/index.html
56 | ```
57 |
58 | If you plan to use a [custom application list](https://remna.st/docs/install/remnawave-subscription-page#custom-app-configjson-custom-apps) (`app-config.json`), add the corresponding `volume`:
59 |
60 | ```yaml
61 | services:
62 | remnawave-subscription-page:
63 | image: remnawave/subscription-page:latest
64 | volumes:
65 | - ./index.html:/opt/app/frontend/index.html
66 | - ./app-config.json:/opt/app/frontend/assets/app-config.json
67 | ```
68 |
69 | You can use one of my custom application lists, available at: [Custom App List](https://github.com/legiz-ru/my-remnawave/blob/main/README.md#remnawave-subscription-page-%D1%81lient-configuration)
70 |
71 | 3. **Restart the container:**
72 | To apply the changes, restart your Docker container:
73 |
74 | ```bash
75 | docker compose down remnawave-subscription-page && docker compose up -d remnawave-subscription-page
76 | ```
77 |
78 | ## Contact
79 |
80 | * [Telegram Channel](https://t.me/legiz_trashbag)
81 |
82 | ## Support the Project
83 |
84 | If you like this project and want to support its development, you can make a donation:
85 |
86 | * [Tribute on Telegram](https://t.me/tribute/app?startapp=drzu)
87 | * [TON USDT: `UQAGQTQZYCx5TWj5cmTLpo7164PFsXqZZJ6t6x88n7sHW9gU`]
88 |
89 |
90 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | [Русская версия](README.md) | [English Version](README_en.md) | [中文版](README_zh.md) | [نسخه فارسی](README_fa.md)
2 |
3 | [Демонстрационная страница](https://legiz-ru.github.io/material-remnawave-subscription-page)
4 |
5 | # Material Remnawave Subscription page
6 |
7 | Данный репозиторий содержит исходный код страницы подписки для панели прокси Remnawave, выполненной в современном стиле Material Design 3. Страница предоставляет пользователям удобный доступ к информации о подписке, инструкциям по подключению и ссылкам. Код написан с помощью нейросети Claude Sonnet 4.
8 |
9 | ## Ключевые особенности
10 |
11 | * **Дизайн Material 3:** Современный и интуитивно понятный пользовательский интерфейс, разработанный в соответствии с новейшими принципами Material Design 3.
12 |
13 | * **Поддержка темной и светлой темы:** Автоматическое или ручное переключение между светлой и темной темами для комфортного использования в любых условиях освещения.
14 |
15 | * **Гибкая настройка приложений:** Поддержка стандартного списка рекомендованных приложений для подключения, а также возможность легкой интеграции сторонних клиентов через [настраиваемый `app-config.json`](https://remna.st/docs/install/remnawave-subscription-page#custom-app-configjson-custom-apps).
16 | * * **Кастомные группы** Возможность добавлять дополнительные группы в раздел приложений через файл интеграции, [например `секцию TV`](https://github.com/legiz-ru/my-remnawave/blob/main/sub-page/multiapp/app-config.json).
17 |
18 | * **Поддержка брендинга:** Настройка логотипа и ссылки на поддержку через параметры `logoUrl` и `supportUrl` в конфигурации `app-config.json` для персонализации внешнего вида страницы.
19 |
20 | * **Поддержка remnawave-json:** Возможность интеграции страницы подписки в https://github.com/Jolymmiels/remnawave-json (адаптированный файл index.html расположен в папке remnawave-json).
21 |
22 | * **Копирование индивидуальных ссылок:** Возможность копировать отдельные ссылки (например, `vless://`, `trojan://` ) непосредственно со страницы, помимо общей ссылки подписки.
23 |
24 | * **Многоязычная поддержка:** Доступность страницы на русском, английском, персидском и китайском языках с автоматическим определением языка браузера.
25 |
26 | ## Скриншоты
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 | ## Установка
37 |
38 | 1. **Загрузка файла страницы:**
39 | Скачайте файл `index.html` в ту же папку, где находится ваш `docker-compose.yml`, используя `curl`:
40 |
41 | ```bash
42 | curl -o index.html https://raw.githubusercontent.com/legiz-ru/material-remnawave-subscription-page/refs/heads/main/index.html
43 | ```
44 |
45 | 2. **Настройка Docker Compose:**
46 | Пропишите путь к скачанному `index.html` в вашем `docker-compose.yml` через проброс `volumes` в контейнер `remnawave-subscription-page`.
47 |
48 | Пример для стандартной установки:
49 |
50 | ```yaml
51 | services:
52 | remnawave-subscription-page:
53 | image: remnawave/subscription-page:latest
54 | volumes:
55 | - ./index.html:/opt/app/frontend/index.html
56 | ```
57 |
58 | Если вы планируете использовать [кастомный список приложений](https://remna.st/docs/install/remnawave-subscription-page#custom-app-configjson-custom-apps) (`app-config.json`), добавьте соответствующий `volume`:
59 |
60 | ```yaml
61 | services:
62 | remnawave-subscription-page:
63 | image: remnawave/subscription-page:latest
64 | volumes:
65 | - ./index.html:/opt/app/frontend/index.html
66 | - ./app-config.json:/opt/app/frontend/assets/app-config.json
67 | ```
68 |
69 | Вы можете воспользоваться одним из моих кастомных списков приложений, доступных по ссылке: [Список кастомных приложений](https://github.com/legiz-ru/my-remnawave/blob/main/README.md#remnawave-subscription-page-%D1%81lient-configuration)
70 |
71 | 3. **Перезапуск контейнера:**
72 | Для применения изменений перезапустите контейнер Docker:
73 |
74 | ```bash
75 | docker compose down remnawave-subscription-page && docker compose up -d remnawave-subscription-page
76 | ```
77 |
78 | ## Связь
79 |
80 | * [[Telegram-канал](https://t.me/legiz_trashbag)]
81 |
82 | ## Поддержка проекта
83 |
84 | Если вам нравится этот проект и вы хотите поддержать его развитие, вы можете сделать пожертвование:
85 |
86 | * [[Tribute on Telegram](https://t.me/tribute/app?startapp=drzu)]
87 | * [TON USDT: `UQAGQTQZYCx5TWj5cmTLpo7164PFsXqZZJ6t6x88n7sHW9gU`]
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 | <%= metaTitle %>
9 |
10 |
52 |
53 |
85 |
86 |
113 |
114 |
115 |
292 |
293 |
294 |
31 | 
32 | 
33 | 
34 | 
35 |