Jellyfish042 commited on
Commit
7dd61f7
·
verified ·
1 Parent(s): 0d1d5df

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +32 -10
index.html CHANGED
@@ -76,16 +76,18 @@
76
  }
77
  .circle-container {
78
  display: flex;
79
- justify-content: space-around;
80
  align-items: center;
81
  flex: 1;
82
  max-height: 400px;
 
83
  }
84
  .model-container {
85
  display: flex;
86
  flex-direction: column;
87
  align-items: center;
88
  position: relative;
 
89
  }
90
  .circle {
91
  background-color: #ffffff;
@@ -111,6 +113,24 @@
111
  font-size: 20px;
112
  font-weight: bold;
113
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
114
  </style>
115
  </head>
116
  <body>
@@ -148,6 +168,9 @@
148
  </div>
149
  <div id="new-param" class="param-label">1B</div>
150
  </div>
 
 
 
151
  <div class="model-container">
152
  <div id="circle-old" class="circle"></div>
153
  <div class="circle-label">
@@ -208,21 +231,20 @@
208
  const equivalent = params * Math.pow(2, generation - 4);
209
  resultEquiv.textContent = equivalent.toFixed(1);
210
 
211
- // 更新圆形大小
212
- const baseSize = 80; // 基础大小
213
  const newSize = baseSize * Math.sqrt(params);
214
  const oldSize = baseSize * Math.sqrt(equivalent);
215
 
216
- // 限制最大尺寸
217
- const maxSize = 200;
218
- const scaleFactor = Math.max(newSize, oldSize) > maxSize ? maxSize / Math.max(newSize, oldSize) : 1;
219
 
220
- circleNew.style.width = `${Math.max(30, newSize * scaleFactor)}px`;
221
- circleNew.style.height = `${Math.max(30, newSize * scaleFactor)}px`;
222
  newParam.textContent = `${params.toFixed(1)}B`;
223
 
224
- circleOld.style.width = `${Math.max(30, oldSize * scaleFactor)}px`;
225
- circleOld.style.height = `${Math.max(30, oldSize * scaleFactor)}px`;
226
  oldParam.textContent = `${equivalent.toFixed(1)}B`;
227
 
228
  // 调整参数文本颜色
 
76
  }
77
  .circle-container {
78
  display: flex;
79
+ justify-content: space-between;
80
  align-items: center;
81
  flex: 1;
82
  max-height: 400px;
83
+ padding: 0 40px;
84
  }
85
  .model-container {
86
  display: flex;
87
  flex-direction: column;
88
  align-items: center;
89
  position: relative;
90
+ flex: 1;
91
  }
92
  .circle {
93
  background-color: #ffffff;
 
113
  font-size: 20px;
114
  font-weight: bold;
115
  }
116
+ .equals-sign {
117
+ font-size: 80px;
118
+ color: #4CAF50;
119
+ font-weight: bold;
120
+ display: flex;
121
+ align-items: center;
122
+ justify-content: center;
123
+ text-shadow: 0 0 10px rgba(76, 175, 80, 0.5);
124
+ animation: glow 2s ease-in-out infinite alternate;
125
+ }
126
+ @keyframes glow {
127
+ from {
128
+ text-shadow: 0 0 10px rgba(76, 175, 80, 0.5);
129
+ }
130
+ to {
131
+ text-shadow: 0 0 20px rgba(76, 175, 80, 0.8);
132
+ }
133
+ }
134
  </style>
135
  </head>
136
  <body>
 
168
  </div>
169
  <div id="new-param" class="param-label">1B</div>
170
  </div>
171
+
172
+ <div class="equals-sign">≈</div>
173
+
174
  <div class="model-container">
175
  <div id="circle-old" class="circle"></div>
176
  <div class="circle-label">
 
231
  const equivalent = params * Math.pow(2, generation - 4);
232
  resultEquiv.textContent = equivalent.toFixed(1);
233
 
234
+ // 更新圆形大小 - 移除大小限制,只保留极小的最小值
235
+ const baseSize = 80;
236
  const newSize = baseSize * Math.sqrt(params);
237
  const oldSize = baseSize * Math.sqrt(equivalent);
238
 
239
+ // 只设置一个很小的最小值,避免完全看不见
240
+ const minSize = 20;
 
241
 
242
+ circleNew.style.width = `${Math.max(minSize, newSize)}px`;
243
+ circleNew.style.height = `${Math.max(minSize, newSize)}px`;
244
  newParam.textContent = `${params.toFixed(1)}B`;
245
 
246
+ circleOld.style.width = `${Math.max(minSize, oldSize)}px`;
247
+ circleOld.style.height = `${Math.max(minSize, oldSize)}px`;
248
  oldParam.textContent = `${equivalent.toFixed(1)}B`;
249
 
250
  // 调整参数文本颜色