1. Update spacing units to em 2. Hide reasoning icon by default 3. Make arrow scaleable
| @@ -347,7 +347,7 @@ input[type='checkbox']:focus-visible { | ||
| 347 | 347 | border-left: 2px solid var(--SmartThemeEmColor); |
| 348 | 348 | border-radius: 2px; |
| 349 | 349 | padding: 5px; |
| 350 | 350 | margin-bottom: 0.5rem5em; |
| 351 | 351 | overflow-y: auto; |
| 352 | 352 | color: var(--SmartThemeEmColor); |
| 353 | 353 | } |
| @@ -355,6 +355,7 @@ input[type='checkbox']:focus-visible { | ||
| 355 | 355 | .mes_reasoning_details { |
| 356 | 356 | margin-right: var(--mes-right-spacing); |
| 357 | 357 | } |
| 358 | + | |
| 358 | 359 | .mes_reasoning_details .mes_reasoning_summary { |
| 359 | 360 | margin-right: calc(var(--mes-right-spacing) * -1); |
| 360 | 361 | } |
| @@ -383,11 +384,17 @@ input[type='checkbox']:focus-visible { | ||
| 383 | 384 | cursor: pointer; |
| 384 | 385 | position: relative; |
| 385 | 386 | user-select: none; |
| 386 | 387 | margin: 0.5rem5em 2px; |
| 387 | 388 | padding: 7px 14px; |
| 388 | 389 | border-radius: 10px; |
| 389 | 390 | background-color: var(--grey30); |
| 390 | 391 | font-size: calc(var(--mainFontSize) * 0.9); |
| 392 | + align-items: baseline; | |
| 393 | +} | |
| 394 | + | |
| 395 | +/* TWIMC: Remove with custom CSS to show the icon */ | |
| 396 | +.mes_reasoning_header > .icon-svg { | |
| 397 | + display: none; | |
| 391 | 398 | } |
| 392 | 399 | |
| 393 | 400 | @supports not selector(:has(*)) { |
| @@ -407,10 +414,9 @@ input[type='checkbox']:focus-visible { | ||
| 407 | 414 | } |
| 408 | 415 | |
| 409 | 416 | .mes_reasoning_details .mes_reasoning_arrow { |
| 410 | - font-size: 10px; | |
| 417 | + font-size: calc(var(--mainFontSize) * 0.7); | |
| 411 | - width: 10px; | |
| 418 | + width: calc(var(--mainFontSize) * 0.7); | |
| 412 | - height: 10px; | |
| 419 | + height: calc(var(--mainFontSize) * 0.7); | |
| 413 | - margin-top: 5px; | |
| 414 | 420 | } |
| 415 | 421 | |
| 416 | 422 | .mes_reasoning_details:not([open]) .mes_reasoning_arrow { |
| @@ -4251,15 +4257,15 @@ input[type="range"]::-webkit-slider-thumb { | ||
| 4251 | 4257 | |
| 4252 | 4258 | .mes_reasoning_actions { |
| 4253 | 4259 | margin: 0; |
| 4254 | 4260 | margin-top: 0.5rem5em; |
| 4255 | 4261 | } |
| 4256 | 4262 | |
| 4257 | 4263 | .mes_edit_buttons .menu_button, |
| 4258 | 4264 | .mes_reasoning_actions .edit_button { |
| 4259 | 4265 | opacity: 0.5; |
| 4260 | 4266 | padding: 0px; |
| 4261 | 4267 | font-size: 1rem1em; |
| 4262 | 4268 | height: 2rem2em; |
| 4263 | 4269 | margin-top: 0; |
| 4264 | 4270 | margin-bottom: 0; |
| 4265 | 4271 | aspect-ratio: 1 / 1; |
| @@ -4269,7 +4275,7 @@ input[type="range"]::-webkit-slider-thumb { | ||
| 4269 | 4275 | } |
| 4270 | 4276 | |
| 4271 | 4277 | .mes_reasoning_actions .edit_button { |
| 4272 | 4278 | margin-bottom: 0.5rem5em; |
| 4273 | 4279 | opacity: 1; |
| 4274 | 4280 | filter: brightness(0.7); |
| 4275 | 4281 | } |