Skip to Content

Wijzigen voor document Huisstijl

Laatst gewijzigd door Jeeves de Butler op 07-10-2026 01:56
Van versie 9.1
gewijzigd door Jeeves de Butler
op 05-10-2026 03:17
Opmerking bij wijziging: Er is geen opmerking bij deze versie
Naar versie 20.1
gewijzigd door Jeeves de Butler
op 05-10-2026 04:54
Opmerking bij wijziging: Er is geen opmerking bij deze versie

Samenvatting

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  
... ... @@ -837,6 +837,65 @@
837 837   text-indent: 0 !important;
838 838  }
839 839  
848 +/* ---------- Overzicht van onderliggende pagina's (startpagina van een onderdeel) ---------- */
849 +
850 +.wb-overzicht {
851 + list-style: none;
852 + display: grid;
853 + grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
854 + gap: 10px;
855 + margin: 14px 0 28px;
856 + padding: 0;
857 +}
858 +.wb-overzicht li {
859 + margin: 0;
860 +}
861 +#body #xwikicontent .wb-overzicht a {
862 + display: flex;
863 + align-items: center;
864 + gap: 12px;
865 + height: 100%;
866 + padding: 12px 14px;
867 + border: 1px solid #e8eaed;
868 + border-radius: 10px;
869 + background: #ffffff;
870 + color: #202124;
871 + text-decoration: none;
872 + transition: border-color .15s ease, box-shadow .15s ease;
873 +}
874 +#body #xwikicontent .wb-overzicht a:hover,
875 +#body #xwikicontent .wb-overzicht a:focus {
876 + border-color: #ffb447;
877 + box-shadow: 0 2px 10px rgba(31, 35, 40, .08);
878 +}
879 +.wb-overzicht-icoon {
880 + flex: none;
881 + width: 36px;
882 + height: 36px;
883 + display: flex;
884 + align-items: center;
885 + justify-content: center;
886 + border-radius: 50%;
887 + background: #ffefd5;
888 + color: #b86e00;
889 + font-size: 16px;
890 + text-align: center;
891 +}
892 +.wb-overzicht strong {
893 + display: block;
894 + font-weight: 500;
895 + line-height: 1.3;
896 +}
897 +.wb-overzicht small {
898 + display: block;
899 + margin-top: 2px;
900 + font-size: 13px;
901 + color: #5f6368;
902 +}
903 +.wb-overzicht-leeg {
904 + color: #5f6368;
905 +}
906 +
840 840  /* ---------- Telefoon ---------- */
841 841  
842 842  @media (max-width: 767px) {
... ... @@ -883,3 +883,35 @@
883 883   }
884 884  }
885 885  
953 +/* Overzichtstabellen (livetable): woorden heel laten, lange adressen afkappen met ...; bij aanwijzen het volledige adres */
954 +#xwikicontent table.xwiki-livetable {
955 + font-size: 14px;
956 +}
957 +#xwikicontent .xwiki-livetable-display-header th,
958 +#xwikicontent .xwiki-livetable-display-body td {
959 + padding: 6px 7px;
960 +}
961 +#xwikicontent table.xwiki-livetable .xwiki-livetable-display-body td {
962 + word-break: normal;
963 + overflow-wrap: break-word;
964 + hyphens: manual;
965 +}
966 +#xwikicontent table.xwiki-livetable .xwiki-livetable-display-body td.URL,
967 +#xwikicontent table.xwiki-livetable .xwiki-livetable-display-body td.DOWNLOADURL {
968 + max-width: 140px;
969 + white-space: nowrap;
970 + overflow: hidden;
971 + text-overflow: ellipsis;
972 +}
973 +#xwikicontent table.xwiki-livetable .xwiki-livetable-display-body td.URL:hover,
974 +#xwikicontent table.xwiki-livetable .xwiki-livetable-display-body td.DOWNLOADURL:hover {
975 + white-space: normal;
976 + overflow-wrap: anywhere;
977 +}
978 +/* Een brede overzichtstabel blijft binnen de pagina en schuift zo nodig opzij */
979 +#xwikicontent table.xwiki-livetable {
980 + display: block;
981 + max-width: 100%;
982 + overflow-x: auto;
983 +}
984 +