Mercurial Repositories > eric / file comparison

comparison: eric6/UI/Previewers/PreviewerHTMLStyles.py

eric6/UI/Previewers/PreviewerHTMLStyles.py

changeset 7524
282680dae446
parent 7360
9190402e4505
child 7923
91e843545d9a
equal deleted inserted replaced
7523:6e26ec343c78 7524:282680dae446
5 5
6 """ 6 """
7 Module implementing CSS styles for the Markdown preview. 7 Module implementing CSS styles for the Markdown preview.
8 """ 8 """
9 9
10 10 ###########################################################################
11 css_markdown = """ 11 ## Styles for light window schemes below
12 @media (prefers-color-scheme: light) { 12 ###########################################################################
13 :root { 13
14 --font-color: #000; 14 css_markdown_light = """
15 --background-color: #fff;
16 --alt-backgroundcolor: #f8f8f8;
17 --frame-color: #333;
18 }
19 }
20
21 @media (prefers-color-scheme: dark) {
22 :root {
23 --font-color: #fff;
24 --background-color: #000;
25 --alt-backgroundcolor: #707070;
26 --frame-color: #ccc;
27 }
28 }
29
30 html { 15 html {
31 background-color: var(--background-color, #fff); 16 background-color: #ffffff;
32 } 17 }
33 18
34 body { 19 body {
35 background-color: var(--background-color, #fff); 20 background-color: #ffffff;
36 color: var(--font-color, #000); 21 color: #000000;
37 font-family: sans-serif; 22 font-family: sans-serif;
38 font-size:12px; 23 font-size:12px;
39 line-height:1.7; 24 line-height:1.7;
40 word-wrap:break-word 25 word-wrap:break-word
41 } 26 }
83 } 68 }
84 69
85 h1 .octicon-link, h2 .octicon-link, h3 .octicon-link, h4 .octicon-link, 70 h1 .octicon-link, h2 .octicon-link, h3 .octicon-link, h4 .octicon-link,
86 h5 .octicon-link, h6 .octicon-link { 71 h5 .octicon-link, h6 .octicon-link {
87 display:none; 72 display:none;
88 color: var(--font-color, #000); 73 color: #000000;
89 } 74 }
90 75
91 h1:hover a.anchor, h2:hover a.anchor, h3:hover a.anchor, h4:hover a.anchor, 76 h1:hover a.anchor, h2:hover a.anchor, h3:hover a.anchor, h4:hover a.anchor,
92 h5:hover a.anchor, h6:hover a.anchor { 77 h5:hover a.anchor, h6:hover a.anchor {
93 text-decoration:none; 78 text-decoration:none;
209 padding:3px 3px 194 padding:3px 3px
210 } 195 }
211 196
212 table tr { 197 table tr {
213 border-top:1px solid #ccc; 198 border-top:1px solid #ccc;
214 background-color: var(--background-color, #fff); 199 background-color: #ffffff;
215 } 200 }
216 201
217 table tr:nth-child(2n) { 202 table tr:nth-child(2n) {
218 background-color:var(--alt-background-color, #f8f8f8); 203 background-color:#f8f8f8;
219 } 204 }
220 205
221 img { 206 img {
222 max-width:100%; 207 max-width:100%;
223 -moz-box-sizing:border-box; 208 -moz-box-sizing:border-box;
244 float:left 229 float:left
245 } 230 }
246 231
247 span.frame span span { 232 span.frame span span {
248 clear:both; 233 clear:both;
249 color:var(--frame-color, #333); 234 color:#333333;
250 display:block; 235 display:block;
251 padding:5px 0 0 236 padding:5px 0 0
252 } 237 }
253 238
254 span.align-center { 239 span.align-center {
313 } 298 }
314 299
315 code, tt { 300 code, tt {
316 margin:0; 301 margin:0;
317 border:1px solid #ddd; 302 border:1px solid #ddd;
318 background-color:var(--alt-background-color, #f8f8f8); 303 background-color:#f8f8f8;
319 border-radius:3px; 304 border-radius:3px;
320 max-width:100%; 305 max-width:100%;
321 display:inline-block; 306 display:inline-block;
322 overflow:auto; 307 overflow:auto;
323 vertical-align:middle; 308 vertical-align:middle;
340 border:none; 325 border:none;
341 background:transparent 326 background:transparent
342 } 327 }
343 328
344 .highlight pre, pre { 329 .highlight pre, pre {
345 background-color:var(--alt-background-color, #f8f8f8); 330 background-color:#f8f8f8;
346 border:1px solid #ddd; 331 border:1px solid #ddd;
347 font-size:12px; 332 font-size:12px;
348 line-height:16px; 333 line-height:16px;
349 overflow:auto; 334 overflow:auto;
350 padding:6px 6px; 335 padding:6px 6px;
384 background-color: #fff 369 background-color: #fff
385 } 370 }
386 """ 371 """
387 372
388 373
389 css_pygments = """ 374 css_pygments_light = """
390 pre .hll { background-color: #ffffcc } 375 pre .hll { background-color: #ffffcc }
391 376
392 /* Comment */ 377 /* Comment */
393 pre .c { color: #999988; font-style: italic } 378 pre .c { color: #999988; font-style: italic }
394 379
568 553
569 /* Literal.Number.Integer.Long */ 554 /* Literal.Number.Integer.Long */
570 pre .il { color: #009999 } 555 pre .il { color: #009999 }
571 556
572 """ 557 """
558
559 ###########################################################################
560 ## Styles for dark window schemes below
561 ###########################################################################
562
563 css_markdown_dark = """
564 html {
565 background-color: #262626;
566 }
567
568 body {
569 background-color: #262626);
570 color: #ffffff;
571 font-family: sans-serif;
572 font-size:12px;
573 line-height:1.7;
574 word-wrap:break-word
575 }
576
577 body>*:first-child {
578 margin-top:0 !important
579 }
580
581 body>*:last-child {
582 margin-bottom:0 !important
583 }
584
585 a {
586 color:#8ebfff
587 }
588
589 a.absent {
590 color:#dd0000
591 }
592
593 a.anchor {
594 display:block;
595 padding-right:6px;
596 padding-left:30px;
597 margin-left:-30px;
598 cursor:pointer;
599 position:absolute;
600 top:0;
601 left:0;
602 bottom:0
603 }
604
605 a.anchor:focus {
606 outline:none
607 }
608
609 tt, code, pre {
610 font-family: Consolas, "Liberation Mono", Courier, monospace;
611 font-size: 12px;
612 }
613
614 h1, h2, h3, h4, h5, h6 {
615 margin:1em 0 6px;
616 padding:0;
617 font-weight:bold;
618 line-height:1.7;
619 cursor:text;
620 position:relative
621 }
622
623 h1 .octicon-link, h2 .octicon-link, h3 .octicon-link, h4 .octicon-link,
624 h5 .octicon-link, h6 .octicon-link {
625 display:none;
626 color: #ffffff;
627 }
628
629 h1:hover a.anchor, h2:hover a.anchor, h3:hover a.anchor, h4:hover a.anchor,
630 h5:hover a.anchor, h6:hover a.anchor {
631 text-decoration:none;
632 line-height:1;
633 padding-left:8px;
634 margin-left:-30px;
635 top:15%
636 }
637
638 h1:hover a.anchor .octicon-link, h2:hover a.anchor .octicon-link,
639 h3:hover a.anchor .octicon-link, h4:hover a.anchor .octicon-link,
640 h5:hover a.anchor .octicon-link, h6:hover a.anchor .octicon-link {
641 display:inline-block
642 }
643
644 h1 tt, h1 code, h2 tt, h2 code, h3 tt, h3 code, h4 tt, h4 code,
645 h5 tt, h5 code, h6 tt, h6 code {
646 font-size:inherit
647 }
648
649 h1 {
650 font-size:2em;
651 border-bottom:1px solid #ddd
652 }
653
654 h2 {
655 font-size:1.6em;
656 border-bottom:1px solid #eee
657 }
658
659 h3 {
660 font-size:1.4em
661 }
662
663 h4 {
664 font-size:1.2em
665 }
666
667 h5 {
668 font-size:1em
669 }
670
671 h6 {
672 color:#aaaaaa;
673 font-size:1em
674 }
675
676 p, blockquote, ul, ol, dl, table, pre {
677 margin:8px 0
678 }
679
680 hr {
681 background: rgba(120, 120, 120, 1);
682 border: 0 none;
683 color: #ccc;
684 height: 2px;
685 padding: 0;
686 margin: 8px 0;
687 }
688
689 ul, ol {
690 padding-left:15px
691 }
692
693 ul.no-list, ul.task-list, ol.no-list, ol.task-list {
694 list-style-type:none;
695 }
696
697 ul ul, ul ol, ol ol, ol ul {
698 margin-top:0;
699 margin-bottom:0
700 }
701
702
703 dl {
704 padding:0
705 }
706
707 dl dt {
708 font-size:14px;
709 font-weight:bold;
710 font-style:italic;
711 padding:0;
712 margin-top:8px
713 }
714
715 dl dd {
716 margin-bottom:15px;
717 padding:0 8px
718 }
719
720 blockquote {
721 border-left:4px solid #DDD;
722 padding:0 8px;
723 color:#aaaaaa
724 }
725
726 blockquote>:first-child {
727 margin-top:0px
728 }
729
730 blockquote>:last-child {
731 margin-bottom:0px
732 }
733
734 table {
735 border-collapse: collapse;
736 border-spacing: 0;
737 overflow:auto;
738 display:block
739 }
740
741 table th {
742 font-weight:bold
743 }
744
745 table th, table td {
746 border:1px solid #ddd;
747 padding:3px 3px
748 }
749
750 table tr {
751 border-top:1px solid #cccccc;
752 background-color: #262626;
753 }
754
755 table tr:nth-child(2n) {
756 background-color:#404040;
757 }
758
759 img {
760 max-width:100%;
761 -moz-box-sizing:border-box;
762 box-sizing:border-box
763 }
764
765 span.frame {
766 display:block;
767 overflow:hidden
768 }
769
770 span.frame>span {
771 border:1px solid #464646;
772 display:block;
773 float:left;
774 overflow:hidden;
775 margin:6px 0 0;
776 padding:7px;
777 width:auto
778 }
779
780 span.frame span img {
781 display:block;
782 float:left
783 }
784
785 span.frame span span {
786 clear:both;
787 color:#565656;
788 display:block;
789 padding:5px 0 0
790 }
791
792 span.align-center {
793 display:block;
794 overflow:hidden;
795 clear:both
796 }
797
798 span.align-center>span {
799 display:block;
800 overflow:hidden;
801 margin:6px auto 0;
802 text-align:center
803 }
804
805 span.align-center span img {
806 margin:0 auto;
807 text-align:center
808 }
809
810 span.align-right {
811 display:block;
812 overflow:hidden;
813 clear:both
814 }
815
816 span.align-right>span {
817 display:block;
818 overflow:hidden;
819 margin:6px 0 0;
820 text-align:right
821 }
822
823 span.align-right span img {
824 margin:0;
825 text-align:right
826 }
827
828 span.float-left {
829 display:block;
830 margin-right:6px;
831 overflow:hidden;
832 float:left
833 }
834
835 span.float-left span {
836 margin:6px 0 0
837 }
838
839 span.float-right {
840 display:block;
841 margin-left:6px;
842 overflow:hidden;
843 float:right
844 }
845
846 span.float-right>span {
847 display:block;
848 overflow:hidden;
849 margin:6px auto 0;
850 text-align:right
851 }
852
853 code, tt {
854 margin:0;
855 border:1px solid #ddd;
856 background-color:#404040;
857 border-radius:3px;
858 max-width:100%;
859 display:inline-block;
860 overflow:auto;
861 vertical-align:middle;
862 line-height:1.1;
863 padding:0
864 }
865
866 code:before, code:after, tt:before, tt:after {
867 content:"\00a0"
868 }
869
870 code {
871 white-space:nowrap
872 }
873
874 pre>code {
875 margin:0;
876 padding:0;
877 white-space:pre;
878 border:none;
879 background:transparent
880 }
881
882 .highlight pre, pre {
883 background-color:#404040;
884 border:1px solid #ddd;
885 font-size:12px;
886 line-height:16px;
887 overflow:auto;
888 padding:6px 6px;
889 border-radius:3px
890 }
891
892 pre {
893 word-wrap:normal
894 }
895
896 pre code, pre tt {
897 margin:0;
898 padding:0;
899 background-color:transparent;
900 border:none;
901 word-wrap:normal;
902 max-width:initial;
903 display:inline;
904 overflow:initial;
905 line-height:inherit
906 }
907
908 pre code:before, pre code:after, pre tt:before, pre tt:after {
909 content:normal
910 }
911
912 kbd {
913 border:1px solid gray;
914 font-size:1.2em;
915 box-shadow:1px 0 1px 0 #eee, 0 1px 0 1px #ccc, 0 2px 0 2px #444;
916 -webkit-border-radius:2px;
917 -moz-border-radius:2px;
918 border-radius:2px;
919 margin:2px 3px;
920 padding:1px 5px;
921 color: #000;
922 background-color: #fff
923 }
924 """
925
926
927 css_pygments_dark = """
928 pre .hll { background-color: #464646 }
929
930 /* Comment */
931 pre .c { color: #74cc66; font-style: italic }
932
933 /* Error */
934 pre .err { color: #a61717; background-color: #e3d2d2 }
935
936 /* Keyword */
937 pre .k { font-weight: bold }
938
939 /* Operator */
940 pre .o { font-weight: bold }
941
942 /* Comment.Multiline */
943 pre .cm { color: #74cc66; font-style: italic }
944
945 /* Comment.Preproc */
946 pre .cp { color: #74cc66; font-weight: bold; font-style: italic }
947
948 /* Comment.Single */
949 pre .c1 { color: #74cc66; font-style: italic }
950
951 /* Comment.Special */
952 pre .cs { color: #74cc66; font-weight: bold; font-style: italic }
953
954 /* Generic.Deleted */
955 pre .gd { color: #ffffff; background-color: #843d3d }
956
957 /* Generic.Emph */
958 pre .ge { font-style: italic }
959
960 /* Generic.Error */
961 pre .gr { color: #ff0000 }
962
963 /* Generic.Heading */
964 pre .gh { color: #dadada }
965
966 /* Generic.Inserted */
967 pre .gi { color: #ffffff; background-color: #4e8750 }
968
969 /* Generic.Output */
970 pre .go { color: #bbbbbb }
971
972 /* Generic.Prompt */
973 pre .gp { color: #999999 }
974
975 /* Generic.Strong */
976 pre .gs { font-weight: bold }
977
978 /* Generic.Subheading */
979 pre .gu { color: #dd60dd }
980
981 /* Generic.Traceback */
982 pre .gt { color: #ff0000 }
983
984 /* Keyword.Constant */
985 pre .kc { font-weight: bold }
986
987 /* Keyword.Declaration */
988 pre .kd { font-weight: bold }
989
990 /* Keyword.Namespace */
991 pre .kn { font-weight: bold }
992
993 /* Keyword.Pseudo */
994 pre .kp { font-weight: bold }
995
996 /* Keyword.Reserved */
997 pre .kr { font-weight: bold }
998
999 /* Keyword.Type */
1000 pre .kt { color: #b3efad; font-weight: bold }
1001
1002 /* Literal.Number */
1003 pre .m { color: #00c8c8 }
1004
1005 /* Literal.String */
1006 pre .s { color: #f46b6b }
1007
1008 /* Name.Attribute */
1009 pre .na { color: #b6d13b }
1010
1011 /* Name.Builtin */
1012 pre .nb { color: #b3efad }
1013
1014 /* Name.Class */
1015 pre .nc { color: #00aaff; font-weight: bold }
1016
1017 /* Name.Constant */
1018 pre .no { color: #dd3131 }
1019
1020 /* Name.Decorator */
1021 pre .nd { color: #e19bff; font-weight: bold }
1022
1023 /* Name.Entity */
1024 pre .ni { color: #dedede }
1025
1026 /* Name.Exception */
1027 pre .ne { color: #e75555; font-weight: bold }
1028
1029 /* Name.Function */
1030 pre .nf { color: #00aaff; font-weight: bold }
1031
1032 /* Name.Label */
1033 pre .nl { color: #e1e100; font-weight: bold }
1034
1035 /* Name.Namespace */
1036 pre .nn { color: #00aaff }
1037
1038 /* Name.Tag */
1039 pre .nt { color: #b3efad }
1040
1041 /* Name.Variable */
1042 pre .nv { color: #00aaff }
1043
1044 /* Operator.Word */
1045 pre .ow { font-weight: bold }
1046
1047 /* Text.Whitespace */
1048 pre .w { color: #bbbbbb }
1049
1050 /* Literal.Number.Float */
1051 pre .mf { color: #00aaff }
1052
1053 /* Literal.Number.Hex */
1054 pre .mh { color: #00aaff }
1055
1056 /* Literal.Number.Integer */
1057 pre .mi { color: #00aaff }
1058
1059 /* Literal.Number.Oct */
1060 pre .mo { color: #00aaff }
1061
1062 /* Literal.String.Backtick */
1063 pre .sb { color: #f46b6b }
1064
1065 /* Literal.String.Char */
1066 pre .sc { color: #f46b6b }
1067
1068 /* Literal.String.Doc */
1069 pre .sd { color: #f46b6b }
1070
1071 /* Literal.String.Double */
1072 pre .s2 { color: #f46b6b }
1073
1074 /* Literal.String.Escape */
1075 pre .se { color: #f46b6b }
1076
1077 /* Literal.String.Heredoc */
1078 pre .sh { color: #f46b6b }
1079
1080 /* Literal.String.Interpol */
1081 pre .si { color: #f46b6b }
1082
1083 /* Literal.String.Other */
1084 pre .sx { color: #f46b6b }
1085
1086 /* Literal.String.Regex */
1087 pre .sr { color: #bb6688 }
1088
1089 /* Literal.String.Single */
1090 pre .s1 { color: #f46b6b }
1091
1092 /* Literal.String.Symbol */
1093 pre .ss { color: #00aaff }
1094
1095 /* Name.Builtin.Pseudo */
1096 pre .bp { color: #b3efad }
1097
1098 /* Name.Variable.Class */
1099 pre .vc { color: #00aaff }
1100
1101 /* Name.Variable.Global */
1102 pre .vg { color: #00aaff }
1103
1104 /* Name.Variable.Instance */
1105 pre .vi { color: #00aaff }
1106
1107 /* Literal.Number.Integer.Long */
1108 pre .il { color: #00c8c8 }
1109
1110 """

Mercurial Repository: eric

eric ide

mercurial