Update styles for mes_reasoning

24c16f622fb83c7a723ee0970980188471fd9ea5

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

1 files changed, +40 -19Ignore whitespace
public/style.css+40 -19
@@ -292,36 +292,44 @@ input[type='checkbox']:focus-visible {
292 filter: grayscale(25%);292 filter: grayscale(25%);
293}293}
294294
295.mes_text table {295.mes_text table,
296.mes_reasoning table {
296 border-spacing: 0;297 border-spacing: 0;
297 border-collapse: collapse;298 border-collapse: collapse;
298 margin-bottom: 10px;299 margin-bottom: 10px;
299}300}
300301
301.mes_text td,302.mes_text td,
302.mes_text th {303.mes_text th,
304.mes_reasoning td,
305.mes_reasoning th {
303 border: 1px solid;306 border: 1px solid;
304 border-collapse: collapse;307 border-collapse: collapse;
305 padding: 0.25em;308 padding: 0.25em;
306}309}
307310
308.mes_text p {311.mes_text p,
312.mes_reasoning p {
309 margin-top: 0;313 margin-top: 0;
310 margin-bottom: 10px;314 margin-bottom: 10px;
311}315}
312316
313.mes_text li tt {317.mes_text li tt,
318.mes_reasoning li tt {
314 display: inline-block;319 display: inline-block;
315}320}
316321
317.mes_text ol,322.mes_text ol,
318.mes_text ul {323.mes_text ul,
324.mes_reasoning ol,
325.mes_reasoning ul {
319 margin-top: 5px;326 margin-top: 5px;
320 margin-bottom: 5px;327 margin-bottom: 5px;
321}328}
322329
323.mes_text br,330.mes_text br,
324.mes_bias br {331.mes_bias br,
332.mes_reasoning br {
325 content: ' ';333 content: ' ';
326}334}
327335
@@ -340,7 +348,7 @@ input[type='checkbox']:focus-visible {
340 padding: 5px;348 padding: 5px;
341 margin: 5px 0;349 margin: 5px 0;
342 overflow-y: auto;350 overflow-y: auto;
343 max-height: min(50vh, 300px);351 max-height: 90vh;
344}352}
345353
346.mes_reasoning_summary {354.mes_reasoning_summary {
@@ -370,24 +378,30 @@ input[type='checkbox']:focus-visible {
370}378}
371379
372.mes_text i,380.mes_text i,
373.mes_text em {381.mes_text em,
382.mes_reasoning i,
383.mes_reasoning em {
374 color: var(--SmartThemeEmColor);384 color: var(--SmartThemeEmColor);
375}385}
376386
377.mes_text u {387.mes_text u,
388.mes_reasoning u {
378 color: var(--SmartThemeUnderlineColor);389 color: var(--SmartThemeUnderlineColor);
379}390}
380391
381.mes_text q {392.mes_text q,
393.mes_reasoning q {
382 color: var(--SmartThemeQuoteColor);394 color: var(--SmartThemeQuoteColor);
383}395}
384396
385.mes_text font[color] em,397.mes_text font[color] em,
386.mes_text font[color] i {398.mes_text font[color] i,
387 color: inherit;399.mes_text font[color] u,
388}400.mes_text font[color] q,
389401.mes_reasoning font[color] em,
390.mes_text font[color] q {402.mes_reasoning font[color] i,
403.mes_reasoning font[color] u,
404.mes_reasoning font[color] q {
391 color: inherit;405 color: inherit;
392}406}
393407
@@ -395,7 +409,8 @@ input[type='checkbox']:focus-visible {
395 display: block;409 display: block;
396}410}
397411
398.mes_text blockquote {412.mes_text blockquote,
413.mes_reasoning blockquote {
399 border-left: 3px solid var(--SmartThemeQuoteColor);414 border-left: 3px solid var(--SmartThemeQuoteColor);
400 padding-left: 10px;415 padding-left: 10px;
401 background-color: var(--black30a);416 background-color: var(--black30a);
@@ -405,18 +420,24 @@ input[type='checkbox']:focus-visible {
405.mes_text strong em,420.mes_text strong em,
406.mes_text strong,421.mes_text strong,
407.mes_text h2,422.mes_text h2,
408.mes_text h1 {423.mes_text h1,
424.mes_reasoning strong em,
425.mes_reasoning strong,
426.mes_reasoning h2,
427.mes_reasoning h1 {
409 font-weight: bold;428 font-weight: bold;
410}429}
411430
412.mes_text pre code {431.mes_text pre code,
432.mes_reasoning pre code {
413 position: relative;433 position: relative;
414 display: block;434 display: block;
415 overflow-x: auto;435 overflow-x: auto;
416 padding: 1em;436 padding: 1em;
417}437}
418438
419.mes_text img:not(.mes_img) {439.mes_text img:not(.mes_img),
440.mes_reasoning img:not(.mes_img) {
420 max-width: 100%;441 max-width: 100%;
421 max-height: var(--doc-height);442 max-height: var(--doc-height);
422}443}