Wijzigen voor document Huisstijl

Samenvatting

• Objecten (2 gewijzigd, 0 toegevoegd, 0 verwijderd)
  • XWiki.JavaScriptExtension[0]
  • XWiki.StyleSheetExtension[0]

Details

XWiki.JavaScriptExtension[0]

code

...	...	@@ -41,6 +41,26 @@
41	41	return kaarten;
42	42	}
43	43
	44	+ // Adres van de oorspronkelijke afbeelding: zonder de width- en height-parameters waarmee XWiki verkleint.
	45	+ function origineel(src) {
	46	+ try {
	47	+ var url = new URL(src, window.location.href);
	48	+ url.searchParams.delete('width');
	49	+ url.searchParams.delete('height');
	50	+ return url.toString();
	51	+ } catch (e) {
	52	+ return src;
	53	+ }
	54	+ }
	55	+
	56	+ function zetIcoon(beeld) {
	57	+ beeld.classList.add('wb-kaart-geenbeeld');
	58	+ var icoon = document.createElement('span');
	59	+ icoon.className = 'fa fa-book wb-kaart-icoon';
	60	+ icoon.setAttribute('aria-hidden', 'true');
	61	+ beeld.appendChild(icoon);
	62	+ }
	63	+
44	44	function maakKaart(k) {
45	45	var kaart = document.createElement(k.link ? 'a' : 'div');
46	46	kaart.className = 'wb-kaart';
...	...	@@ -55,13 +55,14 @@
55	55	beeld.className = 'wb-kaart-beeld';
56	56	if (k.img) {
57	57	var img = document.createElement('img');
58		- img.src = k.img.currentSrc || k.img.src;
	78	+ // Het origineel laden in plaats van de door XWiki verkleinde versie (?width=…&height=…), zodat grote kaarten scherp zijn.
	79	+ img.src = origineel(k.img.currentSrc || k.img.src);
59	59	img.alt = '';
60	60	img.loading = 'lazy';
61	61	img.decoding = 'async';
62	62	var geenBeeld = function () {
63		- beeld.classList.add('wb-kaart-geenbeeld');
64	64	img.remove();
	85	+ zetIcoon(beeld);
65	65	};
66	66	img.addEventListener('error', geenBeeld);
67	67	// Sommige externe sites geven bij een verdwenen afbeelding een leeg plaatje in plaats van een fout.
...	...	@@ -72,7 +72,7 @@
72	72	});
73	73	beeld.appendChild(img);
74	74	} else {
75		- beeld.classList.add('wb-kaart-geenbeeld');
	96	+ zetIcoon(beeld);
76	76	}
77	77	var titel = document.createElement('span');
78	78	titel.className = 'wb-kaart-titel';
...	...	@@ -106,8 +106,27 @@
106	106	Array.prototype.forEach.call(tabellen, function (tabel) {
107	107	try { verwerk(tabel); } catch (e) { /* bij een fout blijft de tabel gewoon zichtbaar */ }
108	108	});
	130	+ Array.prototype.forEach.call(document.querySelectorAll('#xwikicontent ul.wikitoc'), eigenNummering);
109	109	}
110	110
	133	+ // Inhoudsopgave: staan de nummers al in de koppen ("2.1 Mogelijkheden"), dan geen tweede nummering ervoor.
	134	+ // Beslist per inhoudsopgave, zodat die in zijn geheel genummerd of ongenummerd is.
	135	+ function eigenNummering(toc) {
	136	+ var links = toc.querySelectorAll('a');
	137	+ if (!links.length) {
	138	+ return;
	139	+ }
	140	+ var genummerd = 0;
	141	+ Array.prototype.forEach.call(links, function (a) {
	142	+ if (/^\s*\d+(\.\d+)*\.?\s/.test(a.textContent || '')) {
	143	+ genummerd++;
	144	+ }
	145	+ });
	146	+ if (genummerd / links.length >= 0.6) {
	147	+ toc.classList.add('wb-toc-eigen-nummers');
	148	+ }
	149	+ }
	150	+
111	111	// Bij wijzigen op de pagina zelf: eerst de oorspronkelijke tabel terug, zodat de editor nooit de kaarten ziet.
112	112	function herstel() {
113	113	Array.prototype.forEach.call(document.querySelectorAll('#xwikicontent .wb-kaarten'), function (r) { r.remove(); });

XWiki.StyleSheetExtension[0]

Code

...	...	@@ -249,6 +249,11 @@
249	249	color: #80868b;
250	250	font-variant-numeric: tabular-nums;
251	251	}
	252	+/* Koppen die zelf al genummerd zijn ("2.1 Mogelijkheden"): het script zet deze class, dan geen tweede nummer */
	253	+#xwikicontent ul.wikitoc.wb-toc-eigen-nummers li > .wikilink::before,
	254	+#xwikicontent ul.wikitoc.wb-toc-eigen-nummers ul li > .wikilink::before {
	255	+ content: none;
	256	+}
252	252	#xwikicontent ul.wikitoc > li:not(.nodirectchild),
253	253	#xwikicontent ul.wikitoc > li.nodirectchild > ul > li {
254	254	margin-top: 10px;
...	...	@@ -764,13 +764,13 @@
764	764	.wb-kaart:hover .wb-kaart-beeld img {
765	765	transform: scale(1.03);
766	766	}
767		-.wb-kaart-geenbeeld::before {
768		- content: "02d";
	772	+/* Geen of verdwenen afbeelding: het script zet er een boekpictogram in (geen backslash-codes in deze CSS:
	773	+ de CSS-verkleiner van XWiki breekt die, en dan valt de rest van het bestand weg). */
	774	+.wb-kaart-icoon {
769	769	position: absolute;
770	770	top: 50%;
771	771	left: 50%;
772	772	transform: translate(-50%, -50%);
773		- font-family: FontAwesome;
774	774	font-size: 34px;
775	775	color: #b86e00;
776	776	opacity: .5;
...	...	@@ -781,20 +781,23 @@
781	781	font-weight: 500;
782	782	line-height: 1.35;
783	783	}
784		-/* Grote schermen: grotere kaarten */
	789	+/* Grote schermen: grote kaarten, foto's in hun oorspronkelijke 3:2-verhouding */
785	785	@media (min-width: 1200px) {
786	786	.wb-kaarten {
787		- grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
788		- gap: 22px;
	792	+ grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
	793	+ gap: 26px;
789	789	}
	795	+ .wb-kaart-beeld {
	796	+ aspect-ratio: 3 / 2;
	797	+ }
790	790	.wb-kaart-titel {
791		- padding: 12px 16px 14px;
792		- font-size: 16px;
	799	+ padding: 14px 18px 16px;
	800	+ font-size: 17px;
793	793	}
794	794	}
795	795	@media (min-width: 1800px) {
796	796	.wb-kaarten {
797		- grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
	805	+ grid-template-columns: repeat(auto-fill, minmax(420px, 1fr));
798	798	}
799	799	}
800	800
...	...	@@ -883,3 +883,35 @@
883	883	}
884	884	}
885	885
	894	+/* Overzichtstabellen (livetable): woorden heel laten, lange adressen afkappen met ...; bij aanwijzen het volledige adres */
	895	+#xwikicontent table.xwiki-livetable {
	896	+ font-size: 14px;
	897	+}
	898	+#xwikicontent .xwiki-livetable-display-header th,
	899	+#xwikicontent .xwiki-livetable-display-body td {
	900	+ padding: 6px 7px;
	901	+}
	902	+#xwikicontent table.xwiki-livetable .xwiki-livetable-display-body td {
	903	+ word-break: normal;
	904	+ overflow-wrap: break-word;
	905	+ hyphens: manual;
	906	+}
	907	+#xwikicontent table.xwiki-livetable .xwiki-livetable-display-body td.URL,
	908	+#xwikicontent table.xwiki-livetable .xwiki-livetable-display-body td.DOWNLOADURL {
	909	+ max-width: 140px;
	910	+ white-space: nowrap;
	911	+ overflow: hidden;
	912	+ text-overflow: ellipsis;
	913	+}
	914	+#xwikicontent table.xwiki-livetable .xwiki-livetable-display-body td.URL:hover,
	915	+#xwikicontent table.xwiki-livetable .xwiki-livetable-display-body td.DOWNLOADURL:hover {
	916	+ white-space: normal;
	917	+ overflow-wrap: anywhere;
	918	+}
	919	+/* Een brede overzichtstabel blijft binnen de pagina en schuift zo nodig opzij */
	920	+#xwikicontent table.xwiki-livetable {
	921	+ display: block;
	922	+ max-width: 100%;
	923	+ overflow-x: auto;
	924	+}
	925	+