1. Update spacing units to em 2. Hide reasoning icon by default 3. Make arrow scaleable

50869757d35ce7ae6d5cf2989bd9584d94451417

Cohee <18619528+Cohee1207@users.noreply.github.com>

Parents: ffeb6b45aa353ed74137cac5d91716f95962617d
1 files changed, +17 -11Ignore whitespace
public/style.css+17 -11
@@ -347,7 +347,7 @@ input[type='checkbox']:focus-visible {
347 border-left: 2px solid var(--SmartThemeEmColor);347 border-left: 2px solid var(--SmartThemeEmColor);
348 border-radius: 2px;348 border-radius: 2px;
349 padding: 5px;349 padding: 5px;
350 margin-bottom: 0.5rem;350 margin-bottom: 0.5em;
351 overflow-y: auto;351 overflow-y: auto;
352 color: var(--SmartThemeEmColor);352 color: var(--SmartThemeEmColor);
353}353}
@@ -355,6 +355,7 @@ input[type='checkbox']:focus-visible {
355.mes_reasoning_details {355.mes_reasoning_details {
356 margin-right: var(--mes-right-spacing);356 margin-right: var(--mes-right-spacing);
357}357}
358
358.mes_reasoning_details .mes_reasoning_summary {359.mes_reasoning_details .mes_reasoning_summary {
359 margin-right: calc(var(--mes-right-spacing) * -1);360 margin-right: calc(var(--mes-right-spacing) * -1);
360}361}
@@ -383,14 +384,20 @@ input[type='checkbox']:focus-visible {
383 cursor: pointer;384 cursor: pointer;
384 position: relative;385 position: relative;
385 user-select: none;386 user-select: none;
386 margin: 0.5rem 2px;387 margin: 0.5em 2px;
387 padding: 7px 14px;388 padding: 7px 14px;
388 border-radius: 10px;389 border-radius: 10px;
389 background-color: var(--grey30);390 background-color: var(--grey30);
390 font-size: calc(var(--mainFontSize) * 0.9);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}
392399
393@supports not selector(:has(*)) { 400@supports not selector(:has(*)) {
394 .mes_reasoning_details {401 .mes_reasoning_details {
395 display: none !important;402 display: none !important;
396 }403 }
@@ -407,10 +414,9 @@ input[type='checkbox']:focus-visible {
407}414}
408415
409.mes_reasoning_details .mes_reasoning_arrow {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}
415421
416.mes_reasoning_details:not([open]) .mes_reasoning_arrow {422.mes_reasoning_details:not([open]) .mes_reasoning_arrow {
@@ -4251,15 +4257,15 @@ input[type="range"]::-webkit-slider-thumb {
42514257
4252.mes_reasoning_actions {4258.mes_reasoning_actions {
4253 margin: 0;4259 margin: 0;
4254 margin-top: 0.5rem;4260 margin-top: 0.5em;
4255}4261}
42564262
4257.mes_edit_buttons .menu_button,4263.mes_edit_buttons .menu_button,
4258.mes_reasoning_actions .edit_button {4264.mes_reasoning_actions .edit_button {
4259 opacity: 0.5;4265 opacity: 0.5;
4260 padding: 0px;4266 padding: 0px;
4261 font-size: 1rem;4267 font-size: 1em;
4262 height: 2rem;4268 height: 2em;
4263 margin-top: 0;4269 margin-top: 0;
4264 margin-bottom: 0;4270 margin-bottom: 0;
4265 aspect-ratio: 1 / 1;4271 aspect-ratio: 1 / 1;
@@ -4269,7 +4275,7 @@ input[type="range"]::-webkit-slider-thumb {
4269}4275}
42704276
4271.mes_reasoning_actions .edit_button {4277.mes_reasoning_actions .edit_button {
4272 margin-bottom: 0.5rem;4278 margin-bottom: 0.5em;
4273 opacity: 1;4279 opacity: 1;
4274 filter: brightness(0.7);4280 filter: brightness(0.7);
4275}4281}