mirror of
https://github.com/dromara/hertzbeat.git
synced 2026-09-17 18:19:02 +00:00
Compare commits
12
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
a22023a663 | ||
|
|
4e841a9fb1 | ||
|
|
b7ecb9b2ec | ||
|
|
d40d130dc6 | ||
|
|
65a522ea9b | ||
|
|
3ef635c977 | ||
|
|
14b53fc1f4 | ||
|
|
330387734f | ||
|
|
7af77c9b86 | ||
|
|
0be1f2d1ef | ||
|
|
87e6dae115 | ||
|
|
1c45cfe14e |
@@ -15,6 +15,7 @@ This page explains how connect to the HertzBeat MCP SSE server. The MCP server a
|
||||
### Connect to the MCP server
|
||||
|
||||
Make sure that hertzbeat server is up and running. If you are using any other port than 1157, replace the following accordingly
|
||||
|
||||
- URL: `http://localhost:1157/api/sse`
|
||||
|
||||
### Authentication
|
||||
@@ -23,10 +24,10 @@ You must authenticate each request using one of the following methods:
|
||||
|
||||
- JWT bearer token
|
||||
|
||||
- Header: `Authorization: Bearer <your-jwt-token>`
|
||||
- Header: `Authorization: Bearer <your-jwt-token>`
|
||||
|
||||
- Basic authentication
|
||||
- Header: `Authorization: Basic <base64(username:password)>`
|
||||
- Header: `Authorization: Basic <base64(username:password)>`
|
||||
|
||||
### Cursor MCP configuration
|
||||
|
||||
|
||||
@@ -37,15 +37,15 @@ management:
|
||||
|
||||
### Configure parameters
|
||||
|
||||
| Parameter name | Parameter Help describes the |
|
||||
| Parameter name | Parameter Help describes the |
|
||||
|-----------------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
|
||||
| Monitor Host | THE MONITORED PEER IPV4, IPV6 OR DOMAIN NAME. Note ⚠️ that there are no protocol headers (eg: https://, http://). |
|
||||
| Monitoring Name | A name that identifies this monitoring that needs to be unique. |
|
||||
| Monitor Host | THE MONITORED PEER IPV4, IPV6 OR DOMAIN NAME. Note ⚠️ that there are no protocol headers (eg: https://, http://). |
|
||||
| Monitoring Name | A name that identifies this monitoring that needs to be unique. |
|
||||
| Port | The default port provided by the database is 8080. |
|
||||
| Enable HTTPS | Whether to access the website through HTTPS, please note that ⚠️ when HTTPS is enabled, the default port needs to be changed to 443 |
|
||||
| The acquisition interval is | Monitor the periodic data acquisition interval, in seconds, and the minimum interval that can be set is 30 seconds |
|
||||
| The acquisition interval is | Monitor the periodic data acquisition interval, in seconds, and the minimum interval that can be set is 30 seconds |
|
||||
| Whether to probe the | Whether to check the availability of the monitoring before adding a monitoring is successful, and the new modification operation will continue only if the probe is successful |
|
||||
| Description Comment | For more information identifying and describing the remarks for this monitoring, users can remark the information here |
|
||||
| Description Comment | For more information identifying and describing the remarks for this monitoring, users can remark the information here |
|
||||
|
||||
### Collect metrics
|
||||
|
||||
|
||||
@@ -30,7 +30,7 @@ The production environment recommends a complete deployment method, refer [Insta
|
||||
|
||||
### 1. Click Add Linux Operating System Monitor
|
||||
|
||||
> HertzBeat Page -> Monitors Menu -> New Monitor -> OS Monitor -> Add OS Linux
|
||||
> HertzBeat Page -> Monitors -> New Monitor -> OS Monitor -> Add OS Linux
|
||||
|
||||

|
||||
|
||||
|
||||
@@ -32,7 +32,7 @@ The production environment recommends a complete deployment method, refer <https
|
||||
|
||||
1. Click Add SSL Certificate Monitor
|
||||
|
||||
> HertzBeat Page -> Monitors Menu -> New Monitor -> Service Monitor -> Add SSL Certificate
|
||||
> HertzBeat Page -> Monitors -> New Monitor -> Service Monitor -> Add SSL Certificate
|
||||
|
||||

|
||||
|
||||
|
||||
@@ -36,7 +36,7 @@ gitee: <https://gitee.com/hertzbeat/hertzbeat>
|
||||
|
||||
1. 点击新增SSL证书监控
|
||||
|
||||
> 系统页面 -> 监控菜单 -> SSL证书 -> 新增SSL证书
|
||||
> 系统页面 -> 监控中心 -> SSL证书 -> 新增SSL证书
|
||||
|
||||

|
||||
|
||||
|
||||
@@ -44,7 +44,7 @@ management:
|
||||
| 端口 | 数据库提供的默认端口为 8080。 |
|
||||
| 启用 HTTPS | 是否通过 HTTPS 访问网站,请注意⚠️当启用 HTTPS 时,需要将默认端口更改为 443 |
|
||||
| 采集间隔 | 监控周期性采集数据的时间间隔,单位为秒,最小间隔为 30 秒。 |
|
||||
| 是否探测 | 在新增监控前是否先进行可用性探测,只有探测成功才会继续新增或修改操作。 |
|
||||
| 是否探测 | 在新增监控前是否先进行可用性探测,只有探测成功才会继续新增或修改操作。 |
|
||||
| 描述备注 | 用于添加关于监控的额外标识和描述信息。 |
|
||||
|
||||
### 采集指标
|
||||
|
||||
+1
-1
@@ -32,7 +32,7 @@ github: <https://github.com/apache/hertzbeat>
|
||||
|
||||
1. 新增 SSL 证书监控
|
||||
|
||||
> 系统页面 -> 监控菜单 -> 新增监控 -> 服务监控 -> SSL 证书 -> 新增 SSL 证书
|
||||
> 系统页面 -> 监控中心 -> 新增监控 -> 应用服务监控 -> SSL 证书 -> 新增 SSL 证书
|
||||
|
||||

|
||||
|
||||
|
||||
+1
-1
@@ -32,7 +32,7 @@ github: <https://github.com/apache/hertzbeat>
|
||||
|
||||
1. 新增 SSL 证书监控
|
||||
|
||||
> 系统页面 -> 监控菜单 -> 新增监控 -> 服务监控 -> SSL 证书 -> 新增 SSL 证书
|
||||
> 系统页面 -> 监控中心 -> 新增监控 -> 应用服务监控 -> SSL 证书 -> 新增 SSL 证书
|
||||
|
||||

|
||||
|
||||
|
||||
@@ -30,7 +30,7 @@ The production environment recommends a complete deployment method, refer <https
|
||||
|
||||
1. Click Add SSL Certificate Monitor
|
||||
|
||||
> HertzBeat Page -> Monitors Menu -> New Monitor -> Service Monitor -> Add SSL Certificate
|
||||
> HertzBeat Page -> Monitors -> New Monitor -> Service Monitor -> Add SSL Certificate
|
||||
|
||||

|
||||
|
||||
|
||||
@@ -2,11 +2,23 @@
|
||||
/* Import system theme variables */
|
||||
@import 'src/styles/theme.less';
|
||||
|
||||
/* CSS Variables for theme support */
|
||||
:host {
|
||||
/* Light theme variables */
|
||||
--background-color: #f5f7fa;
|
||||
--sidebar-background: #ffffff;
|
||||
--content-background: #ffffff;
|
||||
--border-color: rgba(255, 255, 255, 0.2);
|
||||
--shadow-color: rgba(0, 0, 0, 0.06);
|
||||
--primary-color: @primary-color;
|
||||
--primary-color-light: lighten(@primary-color, 10%);
|
||||
|
||||
display: block; /* Change to block layout to avoid extra whitespace */
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
background-color: var(--background-color);
|
||||
min-height: 100vh;
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.page-header-item {
|
||||
@@ -20,6 +32,288 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* Dark theme variables */
|
||||
:host.dark {
|
||||
--background-color: #141414;
|
||||
--sidebar-background: #1f1f1f;
|
||||
--content-background: #1f1f1f;
|
||||
--border-color: rgba(255, 255, 255, 0.1);
|
||||
--shadow-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
/* Dark theme support for ng-alain */
|
||||
:host ::ng-deep .dark {
|
||||
--background-color: #141414;
|
||||
--sidebar-background: #1f1f1f;
|
||||
--content-background: #1f1f1f;
|
||||
--border-color: rgba(255, 255, 255, 0.1);
|
||||
--shadow-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
/* Global dark theme support */
|
||||
[data-theme='dark'] :host,
|
||||
.dark :host {
|
||||
--background-color: #141414;
|
||||
--sidebar-background: #1f1f1f;
|
||||
--content-background: #1f1f1f;
|
||||
--border-color: rgba(255, 255, 255, 0.1);
|
||||
--shadow-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
/* Modern Layout Styles with Rounded Separation - Complete Override */
|
||||
:host ::ng-deep {
|
||||
/* Reset all default ng-alain positioning - exclude header items */
|
||||
.alain-default {
|
||||
position: static !important;
|
||||
transform: none !important;
|
||||
left: auto !important;
|
||||
right: auto !important;
|
||||
top: auto !important;
|
||||
bottom: auto !important;
|
||||
}
|
||||
|
||||
.alain-default__aside,
|
||||
.alain-default__content {
|
||||
position: static !important;
|
||||
transform: none !important;
|
||||
left: auto !important;
|
||||
right: auto !important;
|
||||
top: auto !important;
|
||||
bottom: auto !important;
|
||||
}
|
||||
|
||||
/* Layout container styling with CSS Grid */
|
||||
.alain-default {
|
||||
background-color: var(--background-color, #f5f7fa) !important;
|
||||
padding: 12px !important;
|
||||
display: grid !important;
|
||||
grid-template-columns: 200px 1fr !important;
|
||||
grid-template-rows: 64px 1fr !important;
|
||||
grid-template-areas:
|
||||
"header header"
|
||||
"sidebar content" !important;
|
||||
gap: 12px !important;
|
||||
min-height: 100vh !important;
|
||||
box-sizing: border-box !important;
|
||||
}
|
||||
|
||||
/* Collapsed sidebar layout */
|
||||
.alain-default.alain-default__collapsed {
|
||||
grid-template-columns: 64px 1fr !important;
|
||||
}
|
||||
|
||||
/* Header modern styling */
|
||||
.alain-default__header {
|
||||
grid-area: header !important;
|
||||
background: linear-gradient(135deg, var(--primary-color, @primary-color) 0%, var(--primary-color-light, lighten(@primary-color, 10%)) 100%) !important;
|
||||
box-shadow: 0 4px 20px var(--shadow-color, rgba(0, 0, 0, 0.08)) !important;
|
||||
border-radius: 16px !important;
|
||||
backdrop-filter: blur(10px) !important;
|
||||
transition: all 0.3s ease !important;
|
||||
position: relative !important;
|
||||
z-index: 10 !important;
|
||||
margin: 0 !important;
|
||||
width: 100% !important;
|
||||
height: 64px !important;
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
/* Ensure header items are visible and properly positioned */
|
||||
.alain-default__header-item,
|
||||
.alain-default__header .alain-default__header-logo,
|
||||
.alain-default__header .alain-default__header-trigger,
|
||||
.alain-default__header .alain-default__header-action,
|
||||
.alain-default__nav-item,
|
||||
header-notify,
|
||||
header-user,
|
||||
header-search {
|
||||
position: relative !important;
|
||||
z-index: 11 !important;
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
}
|
||||
|
||||
/* Fix notification badge positioning */
|
||||
.alain-default__nav-item .ant-badge,
|
||||
.alain-default__nav-item nz-badge {
|
||||
display: inline-flex !important;
|
||||
align-items: center !important;
|
||||
}
|
||||
|
||||
/* Sidebar modern styling */
|
||||
.alain-default__aside {
|
||||
grid-area: sidebar !important;
|
||||
background: var(--sidebar-background, #ffffff) !important;
|
||||
border-radius: 16px !important;
|
||||
box-shadow: 0 8px 32px var(--shadow-color, rgba(0, 0, 0, 0.06)) !important;
|
||||
border: 1px solid var(--border-color, rgba(255, 255, 255, 0.2)) !important;
|
||||
backdrop-filter: blur(20px) !important;
|
||||
overflow: hidden !important;
|
||||
transition: all 0.3s ease !important;
|
||||
position: relative !important;
|
||||
margin: 0 !important;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
}
|
||||
|
||||
.alain-default__aside::after {
|
||||
display: none !important; /* Remove default border */
|
||||
}
|
||||
|
||||
/* Content area modern styling */
|
||||
.alain-default__content {
|
||||
grid-area: content !important;
|
||||
background: var(--content-background, #ffffff) !important;
|
||||
border-radius: 16px !important;
|
||||
box-shadow: 0 8px 32px var(--shadow-color, rgba(0, 0, 0, 0.06)) !important;
|
||||
border: 1px solid var(--border-color, rgba(255, 255, 255, 0.2)) !important;
|
||||
backdrop-filter: blur(20px) !important;
|
||||
overflow: auto !important;
|
||||
transition: all 0.3s ease !important;
|
||||
position: relative !important;
|
||||
margin: 0 !important;
|
||||
padding: 12px !important;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
}
|
||||
|
||||
/* Sidebar navigation modern styling */
|
||||
.sidebar-nav__item {
|
||||
margin: 4px 12px;
|
||||
border-radius: 12px;
|
||||
border-left: none;
|
||||
transition: all 0.3s ease;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.sidebar-nav__item:hover {
|
||||
background: linear-gradient(135deg, rgba(63, 81, 181, 0.08) 0%, rgba(63, 81, 181, 0.04) 100%);
|
||||
transform: translateX(4px);
|
||||
}
|
||||
|
||||
.sidebar-nav__selected {
|
||||
background: linear-gradient(135deg, rgba(63, 81, 181, 0.12) 0%, rgba(63, 81, 181, 0.08) 100%);
|
||||
border-left: none;
|
||||
border-radius: 12px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.sidebar-nav__selected::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 4px;
|
||||
height: 24px;
|
||||
background: linear-gradient(135deg, @primary-color 0%, lighten(@primary-color, 20%) 100%);
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
|
||||
.sidebar-nav__item-link {
|
||||
padding: 12px 16px;
|
||||
border-radius: 8px;
|
||||
transition: all 0.3s ease;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.sidebar-nav__selected > .sidebar-nav__item-link {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Header items modern styling */
|
||||
.alain-default__nav-item {
|
||||
border-radius: 8px;
|
||||
margin: 0 4px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.alain-default__nav-item:hover {
|
||||
background-color: rgba(255, 255, 255, 0.15) !important;
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
/* Search component modern styling */
|
||||
.alain-default__search {
|
||||
.ant-input-affix-wrapper {
|
||||
border-radius: 20px;
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border: 1px solid rgba(255, 255, 255, 0.2);
|
||||
backdrop-filter: blur(10px);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.ant-input-affix-wrapper:hover,
|
||||
.ant-input-affix-wrapper:focus {
|
||||
background: rgba(255, 255, 255, 0.25);
|
||||
border-color: rgba(255, 255, 255, 0.4);
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
/* Logo area styling */
|
||||
.alain-default__header-logo {
|
||||
border-radius: 12px;
|
||||
margin: 8px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.alain-default__header-logo:hover {
|
||||
transform: scale(1.02);
|
||||
}
|
||||
|
||||
/* Responsive design */
|
||||
@media (max-width: 768px) {
|
||||
.alain-default {
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.alain-default__header {
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.alain-default__aside {
|
||||
margin-top: 4px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.alain-default__content {
|
||||
margin-top: 4px;
|
||||
margin-left: 4px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Dark theme support */
|
||||
[data-theme='dark'] & {
|
||||
:host {
|
||||
background-color: #141414;
|
||||
}
|
||||
|
||||
.alain-default__aside {
|
||||
background: #1f1f1f;
|
||||
border-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.alain-default__content {
|
||||
background: #1f1f1f;
|
||||
border-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.sidebar-nav__item:hover {
|
||||
background: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.04) 100%);
|
||||
}
|
||||
|
||||
.sidebar-nav__selected {
|
||||
background: linear-gradient(135deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0.08) 100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Footer styles */
|
||||
global-footer {
|
||||
text-align: center;
|
||||
@@ -198,4 +492,4 @@ global-footer {
|
||||
.chatbot-input input {
|
||||
flex: 1;
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
-->
|
||||
|
||||
<div class="mobile-hide">
|
||||
<ngx-slick-carousel style="margin-top: 70px" nz-row class="carousel" [config]="slideConfig">
|
||||
<ngx-slick-carousel nz-row class="carousel" [config]="slideConfig">
|
||||
<div style="width: 25%; margin: 3px" ngxSlickItem class="slide">
|
||||
<div class="mb-md hoverCard">
|
||||
<div nz-row nzAlign="middle" class="bg-primary rounded-lg">
|
||||
@@ -288,7 +288,7 @@
|
||||
</ngx-slick-carousel>
|
||||
</div>
|
||||
|
||||
<div nz-row nzGutter="16" style="margin-top: 25px; height: 400px">
|
||||
<div nz-row nzGutter="16" style="margin-top: 25px; height: 500px">
|
||||
<div nz-col [nzXs]="{ span: 24 }" [nzSm]="{ span: 24 }" [nzMd]="{ span: 6 }" style="height: 100%">
|
||||
<nz-spin [nzSpinning]="wordCloudDataLoading">
|
||||
<angular-tag-cloud
|
||||
@@ -391,7 +391,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div nz-row nzGutter="16" style="margin-top: 25px; height: 320px">
|
||||
<div nz-row nzGutter="16" style="margin-top: 25px; height: 420px">
|
||||
<div nz-col [nzXs]="{ span: 24 }" [nzSm]="{ span: 24 }" [nzMd]="{ span: 15 }" class="mb-md timeline-card" style="height: 100%">
|
||||
<nz-spin [nzSpinning]="alertContentLoading">
|
||||
<nz-card nzHoverable [nzTitle]="alertCardTitleTemplate" [nzExtra]="extraTemplate" style="height: inherit; overflow: hidden">
|
||||
|
||||
+2
-3
@@ -39,11 +39,10 @@
|
||||
<button class="handover_button_content" id="handover_button_self" (click)="handleButtonClick()">{{
|
||||
'common.button.' + collapse_expand | i18n
|
||||
}}</button>
|
||||
<i nz-icon (click)="handleButtonClick()">
|
||||
<svg viewBox="64 64 896 896" focusable="false" fill="#000000" width="1.12em" height="1.12em" data-icon="alert" aria-hidden="true">
|
||||
<i nz-icon (click)="handleButtonClick()" class="help-toggle-icon">
|
||||
<svg viewBox="64 64 896 896" focusable="false" width="1.12em" height="1.12em" data-icon="alert" aria-hidden="true">
|
||||
<path
|
||||
d="M550.4 793.6L490.666667 853.333333l-59.733334-59.733333L256 618.666667l59.733333-59.733334 174.933334 174.933334 174.933333-174.933334 59.733333 59.733334-174.933333 174.933333zM490.666667 332.8l-174.933334 174.933333L256 448l174.933333-174.933333L490.666667 213.333333l59.733333 59.733334 174.933333 174.933333-59.733333 59.733333-174.933333-174.933333z"
|
||||
fill="#000000"
|
||||
p-id="3525"
|
||||
></path>
|
||||
</svg>
|
||||
|
||||
+71
-10
@@ -1,16 +1,18 @@
|
||||
.help_message_div {
|
||||
margin-top: 60px;
|
||||
width: 100%;
|
||||
max-height: 140px;
|
||||
overflow-y: hidden;
|
||||
box-shadow: inset 1px 4px 6px 1px rgb(0 0 0 / 0.05);
|
||||
box-shadow: inset 1px 4px 6px 1px rgba(0, 0, 0, 0.05);
|
||||
background-color: var(--help-message-bg, #ffffff);
|
||||
color: var(--help-message-text, rgba(0, 0, 0, 0.85));
|
||||
}
|
||||
.collapsed_content{
|
||||
overflow-y: hidden;
|
||||
max-height: 131.2px;
|
||||
}
|
||||
.help_message_nav_item {
|
||||
color: gray;
|
||||
color: var(--help-message-nav-text, #8c8c8c);
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.help_link_nav_item {
|
||||
@@ -23,7 +25,7 @@
|
||||
|
||||
.level1_breadcrumb {
|
||||
height: 28.8px;
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
background-color: var(--help-message-breadcrumb-bg, rgba(0, 0, 0, 0.05));
|
||||
}
|
||||
|
||||
.menu_name {
|
||||
@@ -39,7 +41,16 @@
|
||||
}
|
||||
|
||||
.level2_message_show::-webkit-scrollbar-track {
|
||||
background-color: rgba(63, 81, 181, 0.38);
|
||||
background-color: var(--help-message-scrollbar-track, rgba(63, 81, 181, 0.38));
|
||||
}
|
||||
|
||||
.level2_message_show::-webkit-scrollbar-thumb {
|
||||
background-color: var(--help-message-scrollbar-thumb, rgba(63, 81, 181, 0.6));
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.level2_message_show::-webkit-scrollbar-thumb:hover {
|
||||
background-color: var(--help-message-scrollbar-thumb-hover, rgba(63, 81, 181, 0.8));
|
||||
}
|
||||
|
||||
.help_link_content {
|
||||
@@ -65,11 +76,11 @@
|
||||
}
|
||||
|
||||
.help_message_nav_item:hover {
|
||||
color: #282828;
|
||||
color: var(--help-message-nav-hover, #282828);
|
||||
}
|
||||
|
||||
.help_message_nav:hover {
|
||||
border-bottom: 2px solid rgba(116, 54, 157, 0.79);
|
||||
border-bottom: 2px solid var(--help-message-nav-border-hover, rgba(116, 54, 157, 0.79));
|
||||
}
|
||||
|
||||
.help_link_nav {
|
||||
@@ -85,7 +96,7 @@
|
||||
float: left;
|
||||
height: 13px;
|
||||
width: 2px;
|
||||
background-color: rgba(0, 0, 0, 0.44);
|
||||
background-color: var(--help-message-divider, rgba(0, 0, 0, 0.44));
|
||||
margin-top: 8.5px;
|
||||
margin-left: 22px;
|
||||
}
|
||||
@@ -105,22 +116,38 @@
|
||||
}
|
||||
|
||||
.hover_blue:hover {
|
||||
color: #2b4acb;
|
||||
color: var(--help-message-link-hover, #2b4acb);
|
||||
}
|
||||
|
||||
.handover_button_content {
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
color: var(--help-message-button-text, rgba(0, 0, 0, 0.85));
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.handover_button_content:hover {
|
||||
color: #282828;
|
||||
color: var(--help-message-button-hover, #282828);
|
||||
}
|
||||
|
||||
.help_link_span {
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
.help-toggle-icon {
|
||||
cursor: pointer;
|
||||
transition: color 0.3s ease;
|
||||
|
||||
svg {
|
||||
fill: var(--help-message-button-text, rgba(0, 0, 0, 0.85));
|
||||
transition: fill 0.3s ease;
|
||||
}
|
||||
|
||||
&:hover svg {
|
||||
fill: var(--help-message-button-hover, #282828);
|
||||
}
|
||||
}
|
||||
|
||||
.help_com_icon {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
@@ -131,3 +158,37 @@
|
||||
float: left;
|
||||
}
|
||||
|
||||
:host {
|
||||
--help-message-bg: #ffffff;
|
||||
--help-message-text: rgba(0, 0, 0, 0.85);
|
||||
--help-message-nav-text: #8c8c8c;
|
||||
--help-message-nav-hover: #282828;
|
||||
--help-message-breadcrumb-bg: rgba(0, 0, 0, 0.05);
|
||||
--help-message-nav-border-hover: rgba(116, 54, 157, 0.79);
|
||||
--help-message-divider: rgba(0, 0, 0, 0.44);
|
||||
--help-message-link-hover: #2b4acb;
|
||||
--help-message-button-text: rgba(0, 0, 0, 0.85);
|
||||
--help-message-button-hover: #282828;
|
||||
--help-message-scrollbar-track: rgba(63, 81, 181, 0.38);
|
||||
--help-message-scrollbar-thumb: rgba(63, 81, 181, 0.6);
|
||||
--help-message-scrollbar-thumb-hover: rgba(63, 81, 181, 0.8);
|
||||
}
|
||||
|
||||
[data-theme='dark'] :host,
|
||||
:host.dark,
|
||||
.dark :host {
|
||||
--help-message-bg: #1f1f1f;
|
||||
--help-message-text: rgba(255, 255, 255, 0.85);
|
||||
--help-message-nav-text: rgba(255, 255, 255, 0.65);
|
||||
--help-message-nav-hover: rgba(255, 255, 255, 0.85);
|
||||
--help-message-breadcrumb-bg: rgba(255, 255, 255, 0.08);
|
||||
--help-message-nav-border-hover: rgba(116, 54, 157, 0.79);
|
||||
--help-message-divider: rgba(255, 255, 255, 0.3);
|
||||
--help-message-link-hover: #4096ff;
|
||||
--help-message-button-text: rgba(255, 255, 255, 0.85);
|
||||
--help-message-button-hover: rgba(255, 255, 255, 0.95);
|
||||
--help-message-scrollbar-track: rgba(255, 255, 255, 0.1);
|
||||
--help-message-scrollbar-thumb: rgba(255, 255, 255, 0.2);
|
||||
--help-message-scrollbar-thumb-hover: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
|
||||
@@ -2084,11 +2084,11 @@ body {color: rgba(0, 0, 0, 0.85);background-color: #f5f7fa;}
|
||||
.alain-default__aside-inner::-webkit-scrollbar-thumb {background-color: transparent;}
|
||||
.alain-default__progress-bar {background: rgba(221, 221, 221, 0.4);}
|
||||
.sidebar-nav__item {border-left: 3px solid transparent;}
|
||||
.sidebar-nav__item-link {color: rgba(0, 0, 0, 0.85);}
|
||||
.sidebar-nav__item-link:hover {color: @primary-color;}
|
||||
.sidebar-nav__item-link {color: rgba(0, 0, 0, 0.85); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif; font-weight: 500;}
|
||||
.sidebar-nav__item-link:hover {color: @primary-color; font-weight: 500;}
|
||||
.sidebar-nav__item-disabled:hover {color: rgba(0, 0, 0, 0.85);}
|
||||
.sidebar-nav__selected {background-color: #fcfcfc;border-left-color: @primary-color;}
|
||||
.sidebar-nav__selected > .sidebar-nav__item-link {color: @primary-color;}
|
||||
.sidebar-nav__selected > .sidebar-nav__item-link {color: @primary-color; font-weight: 600;}
|
||||
.sidebar-nav__group-title {color: rgba(0, 0, 0, 0.45);}
|
||||
.sidebar-nav__sub .sidebar-nav__item {border-left: 0 !important;}
|
||||
.sidebar-nav__sub-arrow::before, .sidebar-nav__sub-arrow::after {background: #fff;background-image: linear-gradient(to right, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.85));border-radius: 2px;}
|
||||
|
||||
@@ -4,3 +4,150 @@
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Modern UI Enhancements */
|
||||
body {
|
||||
background-color: #f5f7fa;
|
||||
transition: background-color 0.3s ease;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', Arial, sans-serif;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
[data-theme='dark'] body {
|
||||
background-color: #141414;
|
||||
}
|
||||
|
||||
/* Smooth scrolling */
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
/* Enhanced card styling */
|
||||
.ant-card {
|
||||
border-radius: 12px !important;
|
||||
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04) !important;
|
||||
border: 1px solid rgba(0, 0, 0, 0.06) !important;
|
||||
transition: all 0.3s ease !important;
|
||||
}
|
||||
|
||||
.ant-card:hover {
|
||||
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
|
||||
transform: translateY(-2px) !important;
|
||||
}
|
||||
|
||||
[data-theme='dark'] .ant-card {
|
||||
background-color: #1f1f1f !important;
|
||||
border-color: rgba(255, 255, 255, 0.1) !important;
|
||||
}
|
||||
|
||||
/* Enhanced button styling */
|
||||
.ant-btn {
|
||||
transition: all 0.3s ease !important;
|
||||
}
|
||||
|
||||
.ant-btn:hover {
|
||||
transform: translateY(-1px) !important;
|
||||
}
|
||||
|
||||
/* Enhanced table styling */
|
||||
.ant-table {
|
||||
border-radius: 12px !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
.ant-table-thead > tr > th {
|
||||
background: linear-gradient(135deg, #fafbfc 0%, #f5f7fa 100%) !important;
|
||||
border-bottom: 2px solid #e8e8e8 !important;
|
||||
}
|
||||
|
||||
[data-theme='dark'] .ant-table-thead > tr > th {
|
||||
background: linear-gradient(135deg, #262626 0%, #1f1f1f 100%) !important;
|
||||
border-bottom-color: #434343 !important;
|
||||
}
|
||||
|
||||
/* Enhanced modal styling */
|
||||
.ant-modal-content {
|
||||
border-radius: 16px !important;
|
||||
box-shadow: 0 16px 48px rgba(0, 0, 0, 0.12) !important;
|
||||
}
|
||||
|
||||
/* Enhanced form styling */
|
||||
.ant-form-item {
|
||||
margin-bottom: 20px !important;
|
||||
}
|
||||
|
||||
.ant-input,
|
||||
.ant-input-number,
|
||||
.ant-select-selector {
|
||||
transition: all 0.3s ease !important;
|
||||
}
|
||||
|
||||
.ant-input:focus,
|
||||
.ant-input-number:focus,
|
||||
.ant-select-focused .ant-select-selector {
|
||||
transform: translateY(-1px) !important;
|
||||
box-shadow: 0 4px 12px rgba(63, 81, 181, 0.15) !important;
|
||||
}
|
||||
|
||||
/* Enhanced pagination styling */
|
||||
.ant-pagination-item {
|
||||
transition: all 0.3s ease !important;
|
||||
}
|
||||
|
||||
.ant-pagination-item:hover {
|
||||
transform: translateY(-1px) !important;
|
||||
}
|
||||
|
||||
/* Enhanced tag styling */
|
||||
.ant-tag {
|
||||
transition: all 0.3s ease !important;
|
||||
}
|
||||
|
||||
.ant-tag:hover {
|
||||
transform: translateY(-1px) !important;
|
||||
}
|
||||
|
||||
/* Loading animation enhancement */
|
||||
.ant-spin-dot {
|
||||
animation: antSpinMove 1s infinite linear !important;
|
||||
}
|
||||
|
||||
@keyframes antSpinMove {
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: rotate(405deg);
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom scrollbar styling */
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: rgba(0, 0, 0, 0.04);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
border-radius: 4px;
|
||||
transition: background 0.3s ease;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
[data-theme='dark'] ::-webkit-scrollbar-track {
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
|
||||
[data-theme='dark'] ::-webkit-scrollbar-thumb {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
[data-theme='dark'] ::-webkit-scrollbar-thumb:hover {
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user