mirror of
https://github.com/MHSanaei/3x-ui.git
synced 2026-10-02 20:22:10 +03:00
MHSanaei
fd7b3559bc
Monthly sponsor placements need to change without cutting a panel release. Panels now read 3X/sponsors.json from the MHSanaei/sponsors repo (GitHub Pages on sponsors.sanaei.dev) and show active sponsors in four slots: an overview banner, a rotating sidebar card (max three), the login page and a new Sponsors page that also lists open placements. An entry shows only while enable is not false and until is in the future; links must be https and logos are png/webp/jpg by name only. The list is cached for an hour and the last good copy survives upstream failures; logos are proxied through /sponsors/logo/:name with failures cached, so CSP stays 'self' and admin browsers never reach a third party. Admins can hide a slot for 24h. Under XUI_DEBUG the panel reads a sibling ../sponsors/3X checkout so edits can be previewed before push.
232 lines
4.7 KiB
CSS
232 lines
4.7 KiB
CSS
.index-page,
|
|
.clients-page,
|
|
.inbounds-page,
|
|
.xray-page,
|
|
.settings-page,
|
|
.nodes-page,
|
|
.groups-page,
|
|
.api-docs-page,
|
|
.sponsors-page {
|
|
--bg-page: #e6e8ec;
|
|
--bg-card: #ffffff;
|
|
min-height: 100vh;
|
|
background: var(--bg-page);
|
|
}
|
|
|
|
.index-page.is-dark,
|
|
.clients-page.is-dark,
|
|
.inbounds-page.is-dark,
|
|
.xray-page.is-dark,
|
|
.settings-page.is-dark,
|
|
.nodes-page.is-dark,
|
|
.groups-page.is-dark,
|
|
.api-docs-page.is-dark,
|
|
.sponsors-page.is-dark {
|
|
--bg-page: #1a1b1f;
|
|
--bg-card: #23252b;
|
|
}
|
|
|
|
.index-page.is-dark.is-ultra,
|
|
.clients-page.is-dark.is-ultra,
|
|
.inbounds-page.is-dark.is-ultra,
|
|
.xray-page.is-dark.is-ultra,
|
|
.settings-page.is-dark.is-ultra,
|
|
.nodes-page.is-dark.is-ultra,
|
|
.groups-page.is-dark.is-ultra,
|
|
.api-docs-page.is-dark.is-ultra,
|
|
.sponsors-page.is-dark.is-ultra {
|
|
--bg-page: #000;
|
|
--bg-card: #101013;
|
|
}
|
|
|
|
.index-page .ant-layout,
|
|
.index-page .ant-layout-content,
|
|
.clients-page .ant-layout,
|
|
.clients-page .ant-layout-content,
|
|
.inbounds-page .ant-layout,
|
|
.inbounds-page .ant-layout-content,
|
|
.xray-page .ant-layout,
|
|
.xray-page .ant-layout-content,
|
|
.settings-page .ant-layout,
|
|
.settings-page .ant-layout-content,
|
|
.nodes-page .ant-layout,
|
|
.nodes-page .ant-layout-content,
|
|
.groups-page .ant-layout,
|
|
.groups-page .ant-layout-content,
|
|
.api-docs-page .ant-layout,
|
|
.api-docs-page .ant-layout-content {
|
|
background: transparent;
|
|
}
|
|
|
|
.index-page .content-shell,
|
|
.clients-page .content-shell,
|
|
.inbounds-page .content-shell,
|
|
.xray-page .content-shell,
|
|
.settings-page .content-shell,
|
|
.nodes-page .content-shell,
|
|
.groups-page .content-shell,
|
|
.api-docs-page .content-shell {
|
|
background: transparent;
|
|
}
|
|
|
|
.index-page .content-area,
|
|
.clients-page .content-area,
|
|
.inbounds-page .content-area,
|
|
.xray-page .content-area,
|
|
.settings-page .content-area,
|
|
.nodes-page .content-area,
|
|
.groups-page .content-area {
|
|
padding: 24px;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.clients-page .content-area,
|
|
.inbounds-page .content-area,
|
|
.nodes-page .content-area,
|
|
.groups-page .content-area {
|
|
padding: 8px;
|
|
}
|
|
}
|
|
|
|
.loading-spacer {
|
|
min-height: calc(100vh - 120px);
|
|
}
|
|
|
|
/* Tall action menus (e.g. the inbound/client context menus) must stay inside
|
|
the viewport even when antd flips them upward near the screen edge. */
|
|
.ant-dropdown .ant-dropdown-menu {
|
|
max-height: calc(100vh - 32px);
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.ant-dropdown-menu-item:not(.ant-dropdown-menu-item-disabled):not(
|
|
.ant-dropdown-menu-item-danger
|
|
):hover,
|
|
.ant-dropdown-menu-item:not(.ant-dropdown-menu-item-disabled):not(
|
|
.ant-dropdown-menu-item-danger
|
|
):hover
|
|
.ant-dropdown-menu-title-content,
|
|
.ant-dropdown-menu-item:not(.ant-dropdown-menu-item-disabled):not(
|
|
.ant-dropdown-menu-item-danger
|
|
):hover
|
|
> .anticon {
|
|
color: var(--ant-color-primary) !important;
|
|
}
|
|
|
|
.ant-dropdown-menu-item:not(.ant-dropdown-menu-item-disabled):not(
|
|
.ant-dropdown-menu-item-danger
|
|
):hover {
|
|
background-color: color-mix(in srgb, var(--ant-color-primary) 14%, transparent) !important;
|
|
}
|
|
|
|
.ant-dropdown-menu-item-divider {
|
|
background-color: var(--ant-color-border) !important;
|
|
}
|
|
|
|
body.dark .ant-dropdown-menu-item-divider {
|
|
background-color: rgba(255, 255, 255, 0.12) !important;
|
|
}
|
|
|
|
.settings-page .header-row,
|
|
.xray-page .header-row {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
}
|
|
|
|
.settings-page .header-actions,
|
|
.xray-page .header-actions {
|
|
padding: 4px;
|
|
}
|
|
|
|
.settings-page .header-info,
|
|
.xray-page .header-info {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.icons-only .ant-tabs-nav {
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.icons-only .ant-tabs-nav-wrap {
|
|
width: 100%;
|
|
}
|
|
|
|
.icons-only .ant-tabs-nav-list {
|
|
display: flex;
|
|
width: 100%;
|
|
}
|
|
|
|
.icons-only .ant-tabs-tab {
|
|
flex: 1 1 0;
|
|
justify-content: center;
|
|
margin: 0;
|
|
padding: 10px 0;
|
|
}
|
|
|
|
.icons-only .ant-tabs-tab .anticon {
|
|
margin: 0;
|
|
font-size: 18px;
|
|
}
|
|
|
|
.icons-only .ant-tabs-nav-operations {
|
|
display: none;
|
|
}
|
|
|
|
.clients-page .summary-card,
|
|
.inbounds-page .summary-card,
|
|
.nodes-page .summary-card,
|
|
.groups-page .summary-card {
|
|
padding: 16px;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.clients-page .summary-card,
|
|
.inbounds-page .summary-card,
|
|
.nodes-page .summary-card,
|
|
.groups-page .summary-card {
|
|
padding: 8px;
|
|
}
|
|
}
|
|
|
|
/* Hosts page shares the standard panel page shell (background, transparent
|
|
layout, content padding, summary-card padding). */
|
|
.hosts-page {
|
|
--bg-page: #e6e8ec;
|
|
--bg-card: #ffffff;
|
|
min-height: 100vh;
|
|
background: var(--bg-page);
|
|
}
|
|
|
|
.hosts-page.is-dark {
|
|
--bg-page: #1a1b1f;
|
|
--bg-card: #23252b;
|
|
}
|
|
|
|
.hosts-page.is-dark.is-ultra {
|
|
--bg-page: #000;
|
|
--bg-card: #101013;
|
|
}
|
|
|
|
.hosts-page .ant-layout,
|
|
.hosts-page .ant-layout-content,
|
|
.hosts-page .content-shell {
|
|
background: transparent;
|
|
}
|
|
|
|
.hosts-page .content-area {
|
|
padding: 24px;
|
|
}
|
|
|
|
.hosts-page .summary-card {
|
|
padding: 16px;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.hosts-page .content-area,
|
|
.hosts-page .summary-card {
|
|
padding: 8px;
|
|
}
|
|
}
|