xref: /template/ad-hominem/css/_diff.css (revision 9a22688fd82549fdced43db5ebd85a95637a4765)
1/**
2 * This file provides styles for the diff view, which shows you
3 * differences between two versions of a page (?do=diff).
4 */
5
6.mode_diff table.diff {
7	width: 100%;
8	border-width: 0;
9}
10.mode_diff table.diff th,
11.mode_diff table.diff td {
12	vertical-align: top;
13	padding: 0;
14	border-width: 0;
15	/* no style.ini colours because deleted and added lines have a fixed background colour */
16	background-color: #fff;
17	color: #333;
18}
19
20/* table header */
21.mode_diff table.diff th {
22	border-bottom: 1px solid @ini_border;
23	font-size: 110%;
24	font-weight: normal;
25}
26.mode_diff table.diff th a {
27	font-weight: bold;
28}
29.mode_diff table.diff th span.user {
30	font-size: .9em;
31}
32.mode_diff table.diff th span.sum {
33	font-size: .9em;
34	font-weight: bold;
35}
36.mode_diff table.diff th.minor {
37	color: #999;
38}
39.mode_diff table.diff_sidebyside th {
40	width: 50%;
41}
42
43/* table body */
44.mode_diff table.diff .diff-lineheader {
45	width: .7em;
46	text-align: right;
47}
48[dir=rtl] .mode_diff table.diff .diff-lineheader {
49	text-align: left;
50}
51.mode_diff table.diff .diff-lineheader,
52.mode_diff table.diff td {
53	font-family: @ini_mono_fonts;
54	background-color:	#F6F8FA;
55}
56.mode_diff table.diff td.diff-blockheader {
57	font-weight: bold;
58}
59.mode_diff table.diff .diff-addedline {
60	background-color: #E4FFEE;
61	color: inherit;
62}
63.mode_diff table.diff .diff-deletedline {
64	background-color: #FFEEF0;
65	color: inherit;
66}
67.mode_diff table.diff td.diff-context {
68	background-color: #FFF;
69	color: inherit;
70}
71.mode_diff table.diff td.diff-addedline strong {
72	color:				#23292E;
73	background-color:	#A5F2C1;
74	font-weight:		normal;
75}
76.mode_diff table.diff td.diff-deletedline strong {
77	color:				#23292E;
78	background-color:	#FFB7BF;
79	font-weight:		normal;
80}
81
82/* diff options */
83
84.mode_diff .diffoptions form {
85	float: left;
86}
87.mode_diff .diffoptions p {
88	float: right;
89}
90
91/* diff nav */
92
93.mode_diff table.diff_sidebyside td.diffnav {
94	padding-bottom: .7em;
95}
96.mode_diff .diffnav a {
97	display: inline-block;
98	vertical-align: middle;
99}
100.mode_diff .diffnav a span {
101	display: none;
102}
103
104.mode_diff .diffnav a:hover,
105.mode_diff .diffnav a:active,
106.mode_diff .diffnav a:focus {
107	background-color: @ini_background_alt;
108	text-decoration: none;
109}
110
111.mode_diff .diffnav a:before {
112	display: inline-block;
113	line-height: 1;
114	padding: .2em .4em;
115	border: 1px solid @ini_border;
116	border-radius: 2px;
117	color: @ini_text;
118}
119
120.mode_diff .diffnav a.diffprevrev:before {
121	content: '\25C0'; /* left triangle */
122}
123.mode_diff .diffnav a.diffnextrev:before,
124.mode_diff .diffnav a.difflastrev:before {
125	content: '\25B6'; /* right triangle */
126}
127.mode_diff .diffnav a.diffbothprevrev:before {
128	content: '\25C0\25C0';
129}
130.mode_diff .diffnav a.diffbothnextrev:before {
131	content: '\25B6\25B6';
132}
133
134.mode_diff .diffnav select {
135	width: 60%;
136	min-width: 9em;
137	height: 1.5em; /* height is necessary for longer options in Webkit */
138}
139
140.mode_diff .diffnav select option[selected] {
141	font-weight: bold;
142}
143
144/* dark mode overrides */
145@media (prefers-color-scheme: dark) {
146
147	body.mode_diff.darkmode  table.diff .diff-lineheader,
148	body.mode_diff.darkmode  table.diff th,
149	body.mode_diff.darkmode  table.diff td {
150		background-color:	#1C2125;
151		color:				#D0D5DA;
152	}
153	body.mode_diff.darkmode table.diff td.diff-context {
154		background-color:	#23292E;
155	}
156	body.mode_diff.darkmode  table.diff .diff-deletedline {
157		background-color:	#49090F;
158	}
159	body.mode_diff.darkmode  table.diff .diff-addedline {
160		background-color:	#0A3A1E;
161	}
162	body.mode_diff.darkmode  table.diff td.diff-addedline strong {
163		color:				#FFF;
164		background-color:	#038642;
165	}
166	body.mode_diff.darkmode  table.diff td.diff-deletedline strong {
167		color:				#FFF;
168		background-color:	#BB0E27;
169	}
170	body.mode_diff.darkmode  .diffnav a::before {
171		color:				@ini_text_dark;
172		border:				transparent none 0;
173	}
174	body.mode_diff.darkmode  .diffnav select {
175		background-color:	@ini_background_site_dark;
176		color:				@ini_text_dark;
177		border:				transparent none 0;
178	}
179}