Skip to content

Commit aac87d5

Browse files
author
minjk-bl
committed
Fix jupyter theme font issue
1 parent 5b01aba commit aac87d5

1 file changed

Lines changed: 64 additions & 40 deletions

File tree

‎visualpython/css/root.css‎

Lines changed: 64 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -238,9 +238,10 @@ select.vp-select * {
238238
/* Buttons */
239239
input.vp-button,
240240
button.vp-button {
241-
width: 80px;
241+
min-width: 80px;
242+
width: fit-content;
242243
height: 30px;
243-
background: #FFFFFF;
244+
background-color: #FFFFFF;
244245
border: 0.25px solid #E4E4E4;
245246
box-sizing: border-box;
246247
box-shadow: 0.5px 0.5px 0.5px rgb(0 0 0 / 10%);
@@ -263,41 +264,41 @@ button.vp-button {
263264
supported by Chrome, Edge, Opera and Firefox */
264265
}
265266
.vp-button:hover {
266-
background: #F8F8F8;
267+
background-color: #F8F8F8;
267268
}
268269
.vp-button.cancel {
269-
background: #E5E5E5;
270+
background-color: #E5E5E5;
270271
border: 0px;
271272
}
272273
.vp-button.cancel:hover {
273-
background: #DEDEDE;
274+
background-color: #DEDEDE;
274275
}
275276
.vp-button.add {
276-
background: #FFFFFF;
277+
background-color: #FFFFFF;
277278
}
278279
.vp-button.add:hover {
279-
background: #F8F8F8;
280+
background-color: #F8F8F8;
280281
}
281282
.vp-button.activated {
282-
background: #F38504;
283+
background-color: #F38504;
283284
border: 0px;
284285
color: #FFFFFF;
285286
}
286287
.vp-button.activated:hover {
287-
background: #EF6B10;
288+
background-color: #EF6B10;
288289
}
289290
.vp-button.disabled,
290291
.vp-button.disabled:hover,
291292
.vp-button:disabled,
292293
.vp-button:disabled:hover {
293-
background: #E5E5E5;
294+
background-color: #E5E5E5;
294295
border: 0px;
295296
border: 0.25px solid #E4E4E4;
296297
color: #696969;
297298
cursor: not-allowed;
298299
}
299300
.vp-button.activated.disabled {
300-
background: #FFC09A;
301+
background-color: #FFC09A;
301302
color: white;
302303
}
303304
.vp-checkbox {
@@ -390,50 +391,65 @@ hr.vp-extra-menu-line {
390391
margin: 5px 0px 7px 0px;
391392
}
392393
/* width style*/
393-
.wp100 {
394+
#vp_wrapper .wp100,
395+
.vp-popup-frame .wp100 {
394396
width: 100% !important;
395397
}
396-
.wp80 {
398+
#vp_wrapper .wp80,
399+
.vp-popup-frame .wp80 {
397400
width: 80% !important;
398401
}
399-
.wp50 {
402+
#vp_wrapper .wp50,
403+
.vp-popup-frame .wp50 {
400404
width: 50% !important;
401405
}
402-
.wp49 {
406+
#vp_wrapper .wp49,
407+
.vp-popup-frame .wp49 {
403408
width: 49% !important;
404409
}
405-
.wp5 {
410+
#vp_wrapper .wp5,
411+
.vp-popup-frame .wp5 {
406412
width: 5% !important;
407413
}
408-
.w150 {
414+
#vp_wrapper .w150,
415+
.vp-popup-frame .w150 {
409416
width: 150px !important;
410417
}
411-
.w100 {
418+
#vp_wrapper .w100,
419+
.vp-popup-frame .w100 {
412420
width: 100px !important;
413421
}
414-
.w80 {
422+
#vp_wrapper .w80,
423+
.vp-popup-frame .w80 {
415424
width: 80px !important;
416425
}
417-
.w70 {
426+
#vp_wrapper .w70,
427+
.vp-popup-frame .w70 {
418428
width: 70px !important;
419429
}
420-
.w50 {
430+
#vp_wrapper .w50,
431+
.vp-popup-frame .w50 {
421432
width: 50px !important;
422433
}
423-
.w30 {
434+
#vp_wrapper .w30,
435+
.vp-popup-frame .w30 {
424436
width: 30px !important;
425437
}
426-
.w10 {
438+
#vp_wrapper .w10,
439+
.vp-popup-frame .w10 {
427440
width: 10px !important;
428441
}
429442
/* temporary margin */
430-
.mt5 {
443+
#vp_wrapper .mt5,
444+
.vp-popup-frame .mt5 {
431445
margin-top: 5px;
432446
}
433-
.mb5 {
447+
#vp_wrapper .mb5,
448+
.vp-popup-frame .mb5 {
434449
margin-bottom: 5px;
435450
}
436-
.mr5 {
451+
#vp_wrapper .mr5,
452+
.vp-popup-frame .mr5 {
437453
margin-right: 5px;
438454
}
439455
/* Layout */
@@ -562,7 +578,7 @@ hr.vp-extra-menu-line {
562578
cursor: pointer;
563579
}
564580
.vp-vs-box input:disabled {
565-
background: var(--light-gray-color) !important;
581+
background-color: var(--light-gray-color) !important;
566582
cursor: not-allowed;
567583
}
568584
.vp-vs-box input:disabled + .vp-vs-filter {
@@ -572,23 +588,23 @@ hr.vp-extra-menu-line {
572588
display: none;
573589
position: absolute;
574590
width: 101px;
575-
background: #FFFFFF;
591+
background-color: #FFFFFF;
576592
border: 0.25px solid #C4C4C4;
577593
box-sizing: border-box;
578594
box-shadow: 2px 2px 8px rgb(0 0 0 / 10%);
579595
z-index: 50;
580596
padding: 5px;
581597
}
582598
.vp-vs-item:hover {
583-
background: var(--light-gray-color);
599+
background-color: var(--light-gray-color);
584600
color: var(--font-highlight);
585601
cursor: pointer;
586602
}
587603
/* Data error box */
588604
.vp-data-error-box {
589605
margin: 7px;
590606
padding: 10px;
591-
background: #FFFFFF;
607+
background-color: #FFFFFF;
592608
border: 0.25px solid #E4E4E4;
593609
box-shadow: 1px 1px 2px rgb(0 0 0 / 10%);
594610
border-radius: 2px;
@@ -601,13 +617,13 @@ hr.vp-extra-menu-line {
601617
font-weight: bold;
602618
}
603619
.vp-data-error-box pre {
604-
background: #eeeeee;
620+
background-color: #eeeeee;
605621
margin: 0px;
606622
padding: 7px;
607623
}
608624
/* suggest input hover items */
609625
.vp-sg-item:hover {
610-
background: var(--light-gray-color);
626+
background-color: var(--light-gray-color);
611627
color: var(--font-highlight);
612628
cursor: pointer;
613629
}
@@ -620,31 +636,39 @@ hr.vp-extra-menu-line {
620636
height: auto;
621637
background: none;
622638
}
623-
.cm-s-ipython span.cm-comment {
639+
#vp_wrapper .cm-s-ipython span.cm-comment,
640+
.vp-popup-frame .cm-s-ipython span.cm-comment{
624641
color: #007979;
625642
font-style: italic;
626643
}
627-
.cm-s-ipython span.cm-operator {
644+
#vp_wrapper .cm-s-ipython span.cm-operator,
645+
.vp-popup-frame .cm-s-ipython span.cm-operator{
628646
color: #AA22FF;
629647
font-weight: bold;
630648
}
631-
.cm-s-ipython span.cm-variable {
649+
#vp_wrapper .cm-s-ipython span.cm-variable,
650+
.vp-popup-frame .cm-s-ipython span.cm-variable {
632651
color: #000;
633652
}
634-
.cm-s-ipython span.cm-string {
653+
#vp_wrapper .cm-s-ipython span.cm-string,
654+
.vp-popup-frame .cm-s-ipython span.cm-string {
635655
color: #BA2121;
636656
}
637-
.cm-s-ipython span.cm-number {
657+
#vp_wrapper .cm-s-ipython span.cm-number,
658+
.vp-popup-frame .cm-s-ipython span.cm-number {
638659
color: #080;
639660
}
640-
.cm-s-ipython span.cm-keyword {
661+
#vp_wrapper .cm-s-ipython span.cm-keyword,
662+
.vp-popup-frame .cm-s-ipython span.cm-keyword {
641663
color: #008000;
642664
font-weight: bold;
643665
}
644-
.cm-s-ipython span.cm-def {
666+
#vp_wrapper .cm-s-ipython span.cm-def,
667+
.vp-popup-frame .cm-s-ipython span.cm-def {
645668
color: #00f;
646669
}
647-
.cm-s-ipython span.cm-builtin {
670+
#vp_wrapper .cm-s-ipython span.cm-builtin,
671+
.vp-popup-frame .cm-s-ipython span.cm-builtin {
648672
color: #008000;
649673
}
650674

0 commit comments

Comments
 (0)