Hugging Face's logo

Spaces:
capta1n
/
hw-bas
Running

App Files Community
capta1n commited on
Commit
8cf5a6c
·
verified ·
1 Parent(s): b9bbdb2

请你按以下内容进行优化这个系统架构图 1、右侧的"防御体系能力巡检"是属于中间模块的名称，要迁移到中间模块中 2、整体的字体都放大一些 3、左侧中除攻击手法沉淀和攻击剧本管理之外的：LLM生成、外部APT、内部演练、公开手法、攻击情报、最新漏洞exp、单点剧本、全链路剧本，都需要像资产管理里面的内容那样框起来 4、完善整体的设计和风格更加突出产品架构的专业性 5、中间模块的文字内容不要堆叠出息遮挡，分布均匀一些 - Follow Up Deployment

Browse files
Files changed (1) hide show
  1. index.html +42 -25
index.html CHANGED
@@ -52,7 +52,7 @@
52
  </head>
53
  <body class="bg-gray-50 min-h-screen p-6 font-sans">
54
  <div class="max-w-6xl mx-auto">
55
- <h1 class="text-3xl font-bold text-center text-gray-800 mb-8">BAS系统架构图</h1>
56
 
57
  <div class="relative bg-white rounded-xl shadow-lg p-8">
58
  <!-- 上侧模块 -->
@@ -108,24 +108,40 @@
108
  <h4 class="font-medium text-purple-600 mb-2 flex items-center">
109
  <i class="fas fa-brain mr-2"></i>攻击手法沉淀模块
110
  </h4>
111
- <ul class="space-y-1 text-sm">
112
- <li class="flex items-center"><i class="fas fa-robot text-xs mr-2 text-purple-400"></i>LLM生成</li>
113
- <li class="flex items-center"><i class="fas fa-external-link-alt text-xs mr-2 text-purple-400"></i>外部APT</li>
114
- <li class="flex items-center"><i class="fas fa-users text-xs mr-2 text-purple-400"></i>内部演练</li>
115
- <li class="flex items-center"><i class="fas fa-book-open text-xs mr-2 text-purple-400"></i>公开手法</li>
116
- <li class="flex items-center"><i class="fas fa-bell text-xs mr-2 text-purple-400"></i>攻击情报</li>
117
- <li class="flex items-center"><i class="fas fa-bug text-xs mr-2 text-purple-400"></i>最新漏洞exp</li>
118
- </ul>
 
 
 
 
 
 
 
 
 
 
 
 
119
  </div>
120
 
121
  <div>
122
  <h4 class="font-medium text-purple-600 mb-2 flex items-center">
123
  <i class="fas fa-scroll mr-2"></i>攻击剧本管理模块
124
  </h4>
125
- <ul class="space-y-1 text-sm">
126
- <li class="flex items-center"><i class="fas fa-dot-circle text-xs mr-2 text-purple-400"></i>单点剧本</li>
127
- <li class="flex items-center"><i class="fas fa-link text-xs mr-2 text-purple-400"></i>全链路剧本</li>
128
- </ul>
 
 
 
 
129
  </div>
130
  </div>
131
  </div>
@@ -134,36 +150,37 @@
134
  <div class="w-full md:w-2/4 flex justify-center mb-8 md:mb-0">
135
  <div class="center-circle bg-blue-50 border-2 border-blue-200">
136
  <div class="rotating-border"></div>
137
- <div class="z-10 p-4">
138
- <div class="bg-blue-100 rounded-full p-2 mb-2">
 
139
  <i class="fas fa-sync-alt text-blue-600 animate-spin"></i>
140
  </div>
141
- <h3 class="font-bold text-blue-700">7×24小时</h3>
142
- <p class="text-sm text-blue-600">持续不间断模块</p>
143
  </div>
144
 
145
- <div class="absolute -top-2 left-1/2 transform -translate-x-1/2 bg-white px-2 py-1 rounded-full text-xs font-medium shadow-sm">
146
  <i class="fas fa-arrow-down text-blue-400 mr-1"></i>巡检剧本规划
147
  </div>
148
- <div class="absolute top-1/4 right-0 transform translate-x-1/2 bg-white px-2 py-1 rounded-full text-xs font-medium shadow-sm">
149
  <i class="fas fa-arrow-left text-blue-400 mr-1"></i>巡检范围圈定
150
  </div>
151
- <div class="absolute bottom-1/4 right-0 transform translate-x-1/2 bg-white px-2 py-1 rounded-full text-xs font-medium shadow-sm">
152
  <i class="fas fa-arrow-left text-blue-400 mr-1"></i>巡检任务下发
153
  </div>
154
- <div class="absolute -bottom-2 left-1/2 transform -translate-x-1/2 bg-white px-2 py-1 rounded-full text-xs font-medium shadow-sm">
155
  <i class="fas fa-arrow-up text-blue-400 mr-1"></i>巡检节点执行
156
  </div>
157
- <div class="absolute bottom-1/4 left-0 transform -translate-x-1/2 bg-white px-2 py-1 rounded-full text-xs font-medium shadow-sm">
158
  <i class="fas fa-arrow-right text-blue-400 mr-1"></i>结果跟进
159
  </div>
160
- <div class="absolute top-1/4 left-0 transform -translate-x-1/2 bg-white px-2 py-1 rounded-full text-xs font-medium shadow-sm">
161
  <i class="fas fa-arrow-right text-blue-400 mr-1"></i>报告生成
162
  </div>
163
- <div class="absolute left-1/2 transform -translate-x-1/2 -translate-y-1/2 bg-white px-2 py-1 rounded-full text-xs font-medium shadow-sm" style="top: 30%;">
164
  数据分析
165
  </div>
166
- <div class="absolute left-1/2 transform -translate-x-1/2 translate-y-1/2 bg-white px-2 py-1 rounded-full text-xs font-medium shadow-sm" style="bottom: 30%;">
167
  执行结果反馈
168
  </div>
169
  </div>
 
52
  </head>
53
  <body class="bg-gray-50 min-h-screen p-6 font-sans">
54
  <div class="max-w-6xl mx-auto">
55
+ <h1 class="text-4xl font-bold text-center text-gray-800 mb-8">BAS系统架构图</h1>
56
 
57
  <div class="relative bg-white rounded-xl shadow-lg p-8">
58
  <!-- 上侧模块 -->
 
108
  <h4 class="font-medium text-purple-600 mb-2 flex items-center">
109
  <i class="fas fa-brain mr-2"></i>攻击手法沉淀模块
110
  </h4>
111
+ <div class="grid grid-cols-2 gap-2 mt-2">
112
+ <div class="bg-white p-2 rounded flex items-center text-sm">
113
+ <i class="fas fa-robot text-purple-400 mr-2"></i>LLM生成
114
+ </div>
115
+ <div class="bg-white p-2 rounded flex items-center text-sm">
116
+ <i class="fas fa-external-link-alt text-purple-400 mr-2"></i>外部APT
117
+ </div>
118
+ <div class="bg-white p-2 rounded flex items-center text-sm">
119
+ <i class="fas fa-users text-purple-400 mr-2"></i>内部演练
120
+ </div>
121
+ <div class="bg-white p-2 rounded flex items-center text-sm">
122
+ <i class="fas fa-book-open text-purple-400 mr-2"></i>公开手法
123
+ </div>
124
+ <div class="bg-white p-2 rounded flex items-center text-sm">
125
+ <i class="fas fa-bell text-purple-400 mr-2"></i>攻击情报
126
+ </div>
127
+ <div class="bg-white p-2 rounded flex items-center text-sm">
128
+ <i class="fas fa-bug text-purple-400 mr-2"></i>最新漏洞exp
129
+ </div>
130
+ </div>
131
  </div>
132
 
133
  <div>
134
  <h4 class="font-medium text-purple-600 mb-2 flex items-center">
135
  <i class="fas fa-scroll mr-2"></i>攻击剧本管理模块
136
  </h4>
137
+ <div class="grid grid-cols-2 gap-2 mt-2">
138
+ <div class="bg-white p-2 rounded flex items-center text-sm">
139
+ <i class="fas fa-dot-circle text-purple-400 mr-2"></i>单点剧本
140
+ </div>
141
+ <div class="bg-white p-2 rounded flex items-center text-sm">
142
+ <i class="fas fa-link text-purple-400 mr-2"></i>全链路剧本
143
+ </div>
144
+ </div>
145
  </div>
146
  </div>
147
  </div>
 
150
  <div class="w-full md:w-2/4 flex justify-center mb-8 md:mb-0">
151
  <div class="center-circle bg-blue-50 border-2 border-blue-200">
152
  <div class="rotating-border"></div>
153
+ <div class="z-10 p-4 text-center">
154
+ <h3 class="font-bold text-xl text-blue-700 mb-2">防御体系能力巡检</h3>
155
+ <div class="bg-blue-100 rounded-full p-2 mb-2 inline-block">
156
  <i class="fas fa-sync-alt text-blue-600 animate-spin"></i>
157
  </div>
158
+ <h4 class="font-bold text-lg text-blue-700">7×24小时</h4>
159
+ <p class="text-base text-blue-600">持续不间断模块</p>
160
  </div>
161
 
162
+ <div class="absolute -top-4 left-1/2 transform -translate-x-1/2 bg-white px-3 py-1 rounded-full text-sm font-medium shadow-sm">
163
  <i class="fas fa-arrow-down text-blue-400 mr-1"></i>巡检剧本规划
164
  </div>
165
+ <div class="absolute top-1/4 right-0 transform translate-x-1/2 bg-white px-3 py-1 rounded-full text-sm font-medium shadow-sm">
166
  <i class="fas fa-arrow-left text-blue-400 mr-1"></i>巡检范围圈定
167
  </div>
168
+ <div class="absolute bottom-1/4 right-0 transform translate-x-1/2 bg-white px-3 py-1 rounded-full text-sm font-medium shadow-sm">
169
  <i class="fas fa-arrow-left text-blue-400 mr-1"></i>巡检任务下发
170
  </div>
171
+ <div class="absolute -bottom-4 left-1/2 transform -translate-x-1/2 bg-white px-3 py-1 rounded-full text-sm font-medium shadow-sm">
172
  <i class="fas fa-arrow-up text-blue-400 mr-1"></i>巡检节点执行
173
  </div>
174
+ <div class="absolute bottom-1/4 left-0 transform -translate-x-1/2 bg-white px-3 py-1 rounded-full text-sm font-medium shadow-sm">
175
  <i class="fas fa-arrow-right text-blue-400 mr-1"></i>结果跟进
176
  </div>
177
+ <div class="absolute top-1/4 left-0 transform -translate-x-1/2 bg-white px-3 py-1 rounded-full text-sm font-medium shadow-sm">
178
  <i class="fas fa-arrow-right text-blue-400 mr-1"></i>报告生成
179
  </div>
180
+ <div class="absolute left-1/2 transform -translate-x-1/2 -translate-y-1/2 bg-white px-3 py-1 rounded-full text-sm font-medium shadow-sm" style="top: 25%;">
181
  数据分析
182
  </div>
183
+ <div class="absolute left-1/2 transform -translate-x-1/2 translate-y-1/2 bg-white px-3 py-1 rounded-full text-sm font-medium shadow-sm" style="bottom: 25%;">
184
  执行结果反馈
185
  </div>
186
  </div>