Zum Inhalt springen

Wiki-Quellcode von Service Navigator

Zuletzt geändert von Veronika Kocher am Donnerstag, 03 Sep. 2026 14:15
Zeige letzte Bearbeiter
1 {{html}}
2 <div style="max-width:1400px;margin:0 auto;">
3
4 <p style="margin:0 0 8px 0;">
5 Künstlerische und administrative Services der Universität unterstützen viele unterschiedliche Anliegen – von Forschungsprojekten und Lehre über Personal, IT, Räume, Beschaffung und Rechtsfragen bis zu internationaler Mobilität und Bibliotheksservices.
6 </p>
7
8 <p style="margin:0 0 22px 0;">
9 Der <strong>Service-Navigator</strong> ist danach organisiert, was du tun möchtest – nicht nach dem Organigramm der Universität.
10 </p>
11
12 <section style="margin:0 0 28px 0;padding:16px 18px;border:1px solid #e3ded6;border-radius:10px;background:#fcfbf8;box-shadow:0 1px 2px rgba(0,0,0,.035);">
13 <h2 style="font-size:20px;margin:0 0 6px 0;color:#35312d;">Service finden</h2>
14 <p style="margin:0 0 12px 0;color:#6a655e;">
15 Suche nach Aufgabe, Thema oder Frage – zum Beispiel <em>Raum, Rechnung, Barrierefreiheit, DOI, Veranstaltung, Beschäftigung, Datenschutz</em> oder <em>Bibliothek</em>.
16 </p>
17
18 <form action="https://xwiki.uni-ak.ac.at/bin/view/Main/SolrSearch" method="get" role="search" style="margin:0;">
19 <div style="display:flex;gap:10px;align-items:center;flex-wrap:wrap;">
20 <label for="service-navigator-search" style="position:absolute;left:-10000px;">Services durchsuchen</label>
21 <input
22 id="service-navigator-search"
23 name="text"
24 type="search"
25 placeholder="Wobei brauchst du Unterstützung?"
26 autocomplete="off"
27 style="flex:1 1 520px;min-width:260px;padding:11px 13px;border:1px solid #cfc8bd;border-radius:6px;background:#fffdf9;font-size:16px;"
28 />
29 <button type="submit" class="btn btn-primary" style="padding:11px 22px;">Suchen</button>
30 </div>
31 </form>
32 </section>
33
34 <h2 style="font-size:24px;margin:0 0 16px 0;color:#35312d;">Services nach deinem Anliegen finden</h2>
35
36 <div style="
37 display:grid;
38 grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
39 gap:18px;
40 align-items:stretch;
41 ">
42
43 <!-- 1. PEOPLE, EQUALITY, HEALTH & WORK -->
44 <section style="display:flex;flex-direction:column;min-height:320px;border:1px solid #e3ded6;border-left:6px solid #f0aa00;border-radius:12px;background:#fcfbf8;box-shadow:0 1px 2px rgba(0,0,0,.035);overflow:hidden;">
45 <div style="padding:18px 18px 14px 18px;flex:1;">
46 <div style="display:inline-block;font-size:12px;font-weight:700;letter-spacing:.065em;color:#4f4a44;margin-bottom:8px;padding:4px 7px;background:#f3efe8;border-radius:4px;">PERSONAL &amp; ARBEIT</div>
47 <h3 style="font-size:21px;line-height:1.25;margin:0 0 8px 0;color:#252321;">Personal, Gleichstellung, Gesundheit &amp; Arbeit</h3>
48 <p style="color:#6a655e;margin:0 0 14px 0;">Beschäftigung, Gleichstellung, Diversität, Behinderung, Barrierefreiheit und Gesundheit.</p>
49
50 <div style="font-weight:700;margin-bottom:6px;">Ich möchte …</div>
51 <ul style="margin:0 0 14px 18px;padding:0;">
52 <li>Fragen zu Beschäftigung, Arbeitsbedingungen oder Arbeitsrecht klären</li>
53 <li>Unterstützung bei Diskriminierung, Gleichstellung oder Diversität erhalten</li>
54 <li>Behinderung, Barrierefreiheit oder Gesundheit am Arbeitsplatz klären</li>
55 </ul>
56
57 <div style="font-size:12px;color:#6a655e;line-height:1.45;">
58 Personal · Personalentwicklung · Gleichbehandlung · Diversität · Behinderung · Barrierefreiheit · Gesundheit · Arbeitsrecht
59 </div>
60 </div>
61 <div style="padding:0 18px 18px 18px;">
62 <span class="btn btn-default btn-block disabled" style="background:#f4f0e9;border-color:#d8d1c7;color:#6b655d;" aria-disabled="true">Bereich in Vorbereitung</span>
63 </div>
64 </section>
65
66 <!-- 2. IT & DIGITAL SERVICES -->
67 <section style="display:flex;flex-direction:column;min-height:320px;border:1px solid #e3ded6;border-left:6px solid #38b76a;border-radius:12px;background:#fcfbf8;box-shadow:0 1px 2px rgba(0,0,0,.035);overflow:hidden;">
68 <div style="padding:18px 18px 14px 18px;flex:1;">
69 <div style="display:inline-block;font-size:12px;font-weight:700;letter-spacing:.065em;color:#4f4a44;margin-bottom:8px;padding:4px 7px;background:#f3efe8;border-radius:4px;">IT &amp; DIGITAL</div>
70 <h3 style="font-size:21px;line-height:1.25;margin:0 0 8px 0;color:#252321;">IT &amp; digitale Services</h3>
71 <p style="color:#6a655e;margin:0 0 14px 0;">Accounts, Systeme, Software, digitale Infrastruktur und IT-Support.</p>
72
73 <div style="font-weight:700;margin-bottom:6px;">Ich möchte …</div>
74 <ul style="margin:0 0 14px 18px;padding:0;">
75 <li>auf einen Account, ein System oder einen digitalen Dienst zugreifen</li>
76 <li>ein IT-Problem lösen</li>
77 <li>ein digitales oder IT-Projekt planen oder koordinieren</li>
78 </ul>
79
80 <div style="font-size:12px;color:#6a655e;line-height:1.45;">
81 Accounts · IT-Support · Software · digitale Tools · Infrastruktur · IT-Projektkoordination
82 </div>
83 </div>
84 <div style="padding:0 18px 18px 18px;">
85 <span class="btn btn-default btn-block disabled" style="background:#f4f0e9;border-color:#d8d1c7;color:#6b655d;" aria-disabled="true">Bereich in Vorbereitung</span>
86 </div>
87 </section>
88
89 <!-- 3. ROOMS, BUILDINGS & CAMPUS -->
90 <section style="display:flex;flex-direction:column;min-height:320px;border:1px solid #e3ded6;border-left:6px solid #38b76a;border-radius:12px;background:#fcfbf8;box-shadow:0 1px 2px rgba(0,0,0,.035);overflow:hidden;">
91 <div style="padding:18px 18px 14px 18px;flex:1;">
92 <div style="display:inline-block;font-size:12px;font-weight:700;letter-spacing:.065em;color:#4f4a44;margin-bottom:8px;padding:4px 7px;background:#f3efe8;border-radius:4px;">CAMPUS</div>
93 <h3 style="font-size:21px;line-height:1.25;margin:0 0 8px 0;color:#252321;">Räume, Gebäude &amp; Campus</h3>
94 <p style="color:#6a655e;margin:0 0 14px 0;">Räume, Gebäude, Einrichtungen, Campusnutzung und betriebliche Unterstützung.</p>
95
96 <div style="font-weight:700;margin-bottom:6px;">Ich möchte …</div>
97 <ul style="margin:0 0 14px 18px;padding:0;">
98 <li>einen Raum buchen oder nutzen</li>
99 <li>ein Problem mit Gebäude, Ausstattung oder Sicherheit melden</li>
100 <li>Informationen zu Campuseinrichtungen oder Hausordnung finden</li>
101 </ul>
102
103 <div style="font-size:12px;color:#6a655e;line-height:1.45;">
104 Facility Management · Liegenschaften · Raumkoordination · Gebäudetechnik · Sicherheit · Hausordnung · Campusbetrieb
105 </div>
106 </div>
107 <div style="padding:0 18px 18px 18px;">
108 <span class="btn btn-default btn-block disabled" style="background:#f4f0e9;border-color:#d8d1c7;color:#6b655d;" aria-disabled="true">Bereich in Vorbereitung</span>
109 </div>
110 </section>
111
112 <!-- 4. ART & RESEARCH SERVICES -->
113 <section style="display:flex;flex-direction:column;min-height:320px;border:1px solid #e3ded6;border-left:6px solid #21b6d7;border-radius:12px;background:#fcfbf8;box-shadow:0 1px 2px rgba(0,0,0,.035);overflow:hidden;">
114 <div style="padding:18px 18px 14px 18px;flex:1;">
115 <div style="display:inline-block;font-size:12px;font-weight:700;letter-spacing:.065em;color:#4f4a44;margin-bottom:8px;padding:4px 7px;background:#f3efe8;border-radius:4px;">KUNST &amp; FORSCHUNG</div>
116 <h3 style="font-size:21px;line-height:1.25;margin:0 0 8px 0;color:#252321;">Services für Kunst &amp; Forschung</h3>
117 <p style="color:#6a655e;margin:0 0 8px 0;">Abteilungsübergreifende Orientierung für Planung, Durchführung, Publikation, Teilen und Erhaltung künstlerischer und wissenschaftlicher Projekte.</p>
118 <!-- ARSN_ROOT_SCOPE_ROUTING_V1 -->
119 <div style="font-size:12px;color:#506168;line-height:1.45;margin:0 0 14px 0;padding:7px 9px;background:#eef7f9;border-radius:5px;"><strong>Zentrale Projekt- &amp; Förderdrehscheibe:</strong> Support Kunst und Forschung · Fachzuständigkeiten bleiben bei den jeweils verantwortlichen Service-Stellen.</div>
120
121 <div style="font-weight:700;margin-bottom:6px;">Ich möchte …</div>
122 <ul style="margin:0 0 14px 18px;padding:0;">
123 <li>ein künstlerisches oder Forschungsprojekt entwickeln oder planen</li>
124 <li>Forschungsdaten, Dokumentation oder Zusammenarbeit organisieren</li>
125 <li>Outputs publizieren, zitieren, teilen oder erhalten</li>
126 </ul>
127
128 <div style="font-size:12px;color:#6a655e;line-height:1.45;">
129 Forschungsprojekte · Forschungsdatenmanagement · Rechte &amp; Ethik · Repositorien · Publikation · Erhaltung
130 </div>
131 </div>
132 <div style="padding:0 18px 18px 18px;">
133 <a href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/" class="btn btn-primary btn-block">Services für Kunst &amp; Forschung öffnen</a>
134 </div>
135 </section>
136
137 <!-- 5. STUDY, TEACHING & CURRICULUM -->
138 <section style="display:flex;flex-direction:column;min-height:320px;border:1px solid #e3ded6;border-left:6px solid #21b6d7;border-radius:12px;background:#fcfbf8;box-shadow:0 1px 2px rgba(0,0,0,.035);overflow:hidden;">
139 <div style="padding:18px 18px 14px 18px;flex:1;">
140 <div style="display:inline-block;font-size:12px;font-weight:700;letter-spacing:.065em;color:#4f4a44;margin-bottom:8px;padding:4px 7px;background:#f3efe8;border-radius:4px;">STUDIUM &amp; LEHRE</div>
141 <h3 style="font-size:21px;line-height:1.25;margin:0 0 8px 0;color:#252321;">Studium, Lehre &amp; Curriculum</h3>
142 <p style="color:#6a655e;margin:0 0 14px 0;">Unterstützung für Studium, Lehre, Curricula und Lernumgebung.</p>
143
144 <div style="font-weight:700;margin-bottom:6px;">Ich möchte …</div>
145 <ul style="margin:0 0 14px 18px;padding:0;">
146 <li>eine studienbezogene Frage klären</li>
147 <li>Lehre oder Curricula entwickeln oder ändern</li>
148 <li>Unterstützung für Abschlussarbeiten oder Barrierefreiheit im Studium finden</li>
149 </ul>
150
151 <div style="font-size:12px;color:#6a655e;line-height:1.45;">
152 Studienangelegenheiten · Lehrqualität · Curriculumsentwicklung · Abschlussarbeiten · studentische Arbeitsräume
153 </div>
154 </div>
155 <div style="padding:0 18px 18px 18px;">
156 <span class="btn btn-default btn-block disabled" style="background:#f4f0e9;border-color:#d8d1c7;color:#6b655d;" aria-disabled="true">Bereich in Vorbereitung</span>
157 </div>
158 </section>
159
160 <!-- 6. RESEARCH & DISCOVERY RESOURCES -->
161 <section style="display:flex;flex-direction:column;min-height:340px;border:1px solid #e3ded6;border-left:6px solid #21b6d7;border-radius:12px;background:#fcfbf8;box-shadow:0 1px 2px rgba(0,0,0,.035);overflow:hidden;">
162 <div style="padding:18px 18px 14px 18px;flex:1;">
163 <div style="display:inline-block;font-size:12px;font-weight:700;letter-spacing:.065em;color:#4f4a44;margin-bottom:8px;padding:4px 7px;background:#f3efe8;border-radius:4px;">FINDEN · SUCHEN · ENTDECKEN</div>
164 <h3 style="font-size:21px;line-height:1.25;margin:0 0 8px 0;color:#252321;">Recherche &amp; Forschungsressourcen</h3>
165 <p style="color:#6a655e;margin:0 0 14px 0;">Literatur, Datenbanken, Archive, Sammlungen, Repositorien und spezialisierte Forschungsressourcen an der Universität finden.</p>
166
167 <div style="font-weight:700;margin-bottom:6px;">Ich möchte …</div>
168 <ul style="margin:0 0 14px 18px;padding:0;">
169 <li>Literatur, Medien, Datenbanken oder digitale Ressourcen finden</li>
170 <li>in archivalischen, künstlerischen oder institutionellen Sammlungen recherchieren</li>
171 <li>Repositorien, Spezialarchive und Forschungsdatenbanken entdecken</li>
172 </ul>
173
174 <div style="font-size:12px;color:#6a655e;line-height:1.5;">
175 Universitätsbibliothek &amp; supA · lizenzierte Datenbanken · Universitätsarchiv &amp; Kunstsammlung · Online-Sammlungsdatenbanken · Oskar Kokoschka Zentrum · Viktor J. Papanek Foundation · Venedig Biennale Archiv Austria · Weibel Institut &amp; Peter-Weibel-Archiv · Ursula Blickle Video Archiv · Angewandte Repository
176 </div>
177 </div>
178 <div style="padding:0 18px 18px 18px;">
179 <span class="btn btn-default btn-block disabled" style="background:#f4f0e9;border-color:#d8d1c7;color:#6b655d;" aria-disabled="true">Bereich in Vorbereitung</span>
180 </div>
181 </section>
182
183 <!-- 7. PURCHASING, FINANCE & LOGISTICS -->
184 <section style="display:flex;flex-direction:column;min-height:320px;border:1px solid #e3ded6;border-left:6px solid #38b76a;border-radius:12px;background:#fcfbf8;box-shadow:0 1px 2px rgba(0,0,0,.035);overflow:hidden;">
185 <div style="padding:18px 18px 14px 18px;flex:1;">
186 <div style="display:inline-block;font-size:12px;font-weight:700;letter-spacing:.065em;color:#4f4a44;margin-bottom:8px;padding:4px 7px;background:#f3efe8;border-radius:4px;">BESCHAFFEN &amp; BEWEGEN</div>
187 <h3 style="font-size:21px;line-height:1.25;margin:0 0 8px 0;color:#252321;">Beschaffung, Finanzen &amp; Logistik</h3>
188 <p style="color:#6a655e;margin:0 0 14px 0;">Einkaufen, bezahlen, budgetieren, versenden, transportieren und übersiedeln.</p>
189
190 <div style="font-weight:700;margin-bottom:6px;">Ich möchte …</div>
191 <ul style="margin:0 0 14px 18px;padding:0;">
192 <li>Materialien oder Dienstleistungen beschaffen</li>
193 <li>eine Rechnung, ein Budget oder einen Finanzprozess klären</li>
194 <li>Gegenstände versenden, transportieren oder übersiedeln</li>
195 </ul>
196
197 <div style="font-size:12px;color:#6a655e;line-height:1.45;">
198 Beschaffung · Controlling · Finanzbuchhaltung · Ressourcenplanung · Post &amp; Logistik · Transporte · Übersiedlungen
199 </div>
200 </div>
201 <div style="padding:0 18px 18px 18px;">
202 <span class="btn btn-default btn-block disabled" style="background:#f4f0e9;border-color:#d8d1c7;color:#6b655d;" aria-disabled="true">Bereich in Vorbereitung</span>
203 </div>
204 </section>
205
206 <!-- 8. LEGAL, DATA PROTECTION & GOVERNANCE -->
207 <section style="display:flex;flex-direction:column;min-height:320px;border:1px solid #e3ded6;border-left:6px solid #f0aa00;border-radius:12px;background:#fcfbf8;box-shadow:0 1px 2px rgba(0,0,0,.035);overflow:hidden;">
208 <div style="padding:18px 18px 14px 18px;flex:1;">
209 <div style="display:inline-block;font-size:12px;font-weight:700;letter-spacing:.065em;color:#4f4a44;margin-bottom:8px;padding:4px 7px;background:#f3efe8;border-radius:4px;">RECHTE &amp; REGELN</div>
210 <h3 style="font-size:21px;line-height:1.25;margin:0 0 8px 0;color:#252321;">Recht, Datenschutz &amp; Governance</h3>
211 <p style="color:#6a655e;margin:0 0 14px 0;">Rechtsfragen, Datenschutz, Informationsrechte und institutionelle Regelungen.</p>
212
213 <div style="font-weight:700;margin-bottom:6px;">Ich möchte …</div>
214 <ul style="margin:0 0 14px 18px;padding:0;">
215 <li>eine rechtliche oder vertragliche Frage klären</li>
216 <li>mit personenbezogenen Daten oder Datenschutz umgehen</li>
217 <li>eine institutionelle Regel oder Vorgabe zum Informationszugang verstehen</li>
218 </ul>
219
220 <div style="font-size:12px;color:#6a655e;line-height:1.45;">
221 Rechtsabteilung · Datenschutz · Informationsfreiheit · Governance · institutionelle Regelungen
222 </div>
223 </div>
224 <div style="padding:0 18px 18px 18px;">
225 <span class="btn btn-default btn-block disabled" style="background:#f4f0e9;border-color:#d8d1c7;color:#6b655d;" aria-disabled="true">Bereich in Vorbereitung</span>
226 </div>
227 </section>
228
229 <!-- 9. COMMUNICATION, MEDIA & EVENTS -->
230 <section style="display:flex;flex-direction:column;min-height:320px;border:1px solid #e3ded6;border-left:6px solid #e94b13;border-radius:12px;background:#fcfbf8;box-shadow:0 1px 2px rgba(0,0,0,.035);overflow:hidden;">
231 <div style="padding:18px 18px 14px 18px;flex:1;">
232 <div style="display:inline-block;font-size:12px;font-weight:700;letter-spacing:.065em;color:#4f4a44;margin-bottom:8px;padding:4px 7px;background:#f3efe8;border-radius:4px;">KOMMUNIZIEREN &amp; ORGANISIEREN</div>
233 <h3 style="font-size:21px;line-height:1.25;margin:0 0 8px 0;color:#252321;">Kommunikation, Medien &amp; Veranstaltungen</h3>
234 <p style="color:#6a655e;margin:0 0 14px 0;">Kommunizieren, publizieren, drucken, bewerben und Veranstaltungen organisieren.</p>
235
236 <div style="font-weight:700;margin-bottom:6px;">Ich möchte …</div>
237 <ul style="margin:0 0 14px 18px;padding:0;">
238 <li>etwas kommunizieren oder öffentlich machen</li>
239 <li>eine Publikation, einen Flyer oder Drucksorten produzieren</li>
240 <li>eine Veranstaltung organisieren oder unterstützen</li>
241 </ul>
242
243 <div style="font-size:12px;color:#6a655e;line-height:1.45;">
244 Presse &amp; Kommunikation · Publikationen · Drucksorten · Veranstaltungsmanagement · Open House · Festival
245 </div>
246 </div>
247 <div style="padding:0 18px 18px 18px;">
248 <span class="btn btn-default btn-block disabled" style="background:#f4f0e9;border-color:#d8d1c7;color:#6b655d;" aria-disabled="true">Bereich in Vorbereitung</span>
249 </div>
250 </section>
251
252 <!-- 10. INTERNATIONAL OFFICE -->
253 <section style="display:flex;flex-direction:column;min-height:300px;border:1px solid #e3ded6;border-left:6px solid #21b6d7;border-radius:12px;background:#fcfbf8;box-shadow:0 1px 2px rgba(0,0,0,.035);overflow:hidden;">
254 <div style="padding:18px 18px 14px 18px;flex:1;">
255 <div style="display:inline-block;font-size:12px;font-weight:700;letter-spacing:.065em;color:#4f4a44;margin-bottom:8px;padding:4px 7px;background:#f3efe8;border-radius:4px;">INTERNATIONAL</div>
256 <h3 style="font-size:21px;line-height:1.25;margin:0 0 8px 0;color:#252321;">International Office</h3>
257 <p style="color:#6a655e;margin:0 0 14px 0;">Internationale Mobilität, Austausch und Unterstützung im internationalen Kontext.</p>
258
259 <div style="font-weight:700;margin-bottom:6px;">Ich möchte …</div>
260 <ul style="margin:0 0 14px 18px;padding:0;">
261 <li>einen internationalen Aufenthalt oder Austausch planen</li>
262 <li>Fragen zu Mobilitätsmöglichkeiten klären</li>
263 <li>Unterstützung für einen internationalen Kontext finden</li>
264 </ul>
265
266 <div style="font-size:12px;color:#6a655e;line-height:1.45;">
267 Mobilität · Austausch · internationale Kooperation · internationale Unterstützung
268 </div>
269 </div>
270 <div style="padding:0 18px 18px 18px;">
271 <span class="btn btn-default btn-block disabled" style="background:#f4f0e9;border-color:#d8d1c7;color:#6b655d;" aria-disabled="true">Bereich in Vorbereitung</span>
272 </div>
273 </section>
274
275
276 </div>
277
278 <aside style="margin-top:26px;padding:14px 16px;border:1px solid #cfe8ef;border-left:4px solid #21b6d7;background:#eaf6f9;border-radius:6px;">
279 <strong>Nicht sicher, wo du anfangen sollst?</strong>
280 <div style="margin-top:4px;">
281 Nutze die Suche oben auf der Seite oder wähle die Karte, die am besten zu deinem Anliegen passt. Ein Service kann bewusst in mehreren Bereichen vorkommen, wenn er dadurch leichter auffindbar ist.
282 </div>
283 </aside>
284
285 </div>
286 {{/html}}
287
288 {{html clean="false"}}
289 <!-- SN_SERVICE_NAVIGATOR_MASTER_STYLE_START -->
290
291 <style data-sn-service-navigator-master="1">
292 /* =========================================================
293 MASTER TYPOGRAPHY
294 ========================================================= */
295 #xwikicontent h1,
296 #xwikicontent h2,
297 #xwikicontent h3,
298 #xwikicontent h4,
299 #xwikicontent h5,
300 #xwikicontent h6,
301 #xwikicontent .box-title,
302 #xwikicontent [role="heading"],
303 #xwikicontent h1 a,
304 #xwikicontent h2 a,
305 #xwikicontent h3 a,
306 #xwikicontent h4 a,
307 #xwikicontent h5 a,
308 #xwikicontent h6 a,
309 #xwikicontent .box-title a,
310 #xwikicontent [role="heading"] a{
311 text-align:left!important;
312 text-justify:auto!important;
313 word-spacing:normal!important;
314 }
315
316 /* =========================================================
317 COMING SOON / IN VORBEREITUNG
318 ========================================================= */
319 .sn-coming-soon-badge{
320 display:inline-block;
321 vertical-align:middle;
322 margin-left:10px;
323 padding:4px 8px;
324 border-radius:14px;
325 border:1px solid #efd9cc;
326 background:#fff4ee;
327 color:#8a4d36;
328 font-size:11px;
329 font-weight:700;
330 letter-spacing:.055em;
331 line-height:1.2;
332 white-space:nowrap;
333 }
334
335 /* =========================================================
336 NATIVE / DETAIL CALLOUT GEOMETRY
337 Preserve existing backgrounds.
338 ========================================================= */
339 #xwikicontent .arsn-info,
340 #xwikicontent .dmp-info,
341 #xwikicontent .ido-info,
342 #xwikicontent .pp-info,
343 #xwikicontent .infomessage{
344 box-sizing:border-box!important;
345 border-left:4px solid #21b6d7!important;
346 border-radius:8px;
347 text-align:left!important;
348 word-spacing:normal!important;
349 }
350
351 #xwikicontent .arsn-warn,
352 #xwikicontent .dmp-warn,
353 #xwikicontent .ido-warn,
354 #xwikicontent .pp-warn,
355 #xwikicontent .warn,
356 #xwikicontent .warning,
357 #xwikicontent .warningmessage,
358 #xwikicontent .errormessage{
359 box-sizing:border-box!important;
360 border-left:4px solid #e94b13!important;
361 border-radius:8px;
362 text-align:left!important;
363 word-spacing:normal!important;
364 }
365
366 [data-sn-master-equal-height],
367 [data-sn-master-first-row]{
368 box-sizing:border-box;
369 }
370
371 /* =========================================================
372 FULL-WIDTH THREE-LINE NUMBER / TITLE / SUBTITLE BLOCKS
373 ========================================================= */
374 #xwikicontent .arsn-area-label[data-sn-three-line="1"]{
375 display:grid!important;
376 grid-template-columns:minmax(0,1fr)!important;
377 grid-auto-rows:auto!important;
378 width:100%!important;
379 max-width:none!important;
380 box-sizing:border-box!important;
381 justify-items:start!important;
382 align-items:start!important;
383 gap:2px!important;
384 text-align:left!important;
385 text-align-last:left!important;
386 text-justify:auto!important;
387 word-spacing:normal!important;
388 white-space:normal!important;
389 }
390 #xwikicontent .arsn-area-label[data-sn-three-line="1"] > .arsn-area-number,
391 #xwikicontent .arsn-area-label[data-sn-three-line="1"] > .sn-area-label-title,
392 #xwikicontent .arsn-area-label[data-sn-three-line="1"] > .arsn-area-action{
393 display:block!important;
394 width:100%!important;
395 margin:0!important;
396 text-align:left!important;
397 text-align-last:left!important;
398 text-justify:auto!important;
399 word-spacing:normal!important;
400 white-space:normal!important;
401 }
402 </style>
403
404 <script data-sn-service-navigator-master="1">
405 (function(){
406 "use strict";
407
408 var PAGE_KIND="overview";
409 var PLACEHOLDER=false;
410 var PLACEHOLDER_LABEL="IN VORBEREITUNG";
411
412 var MOBILE_MAX=767;
413 var ROW_TOLERANCE=6;
414 var RESIZE_DEBOUNCE=220;
415
416 var root=
417 document.getElementById("xwikicontent")||
418 document.querySelector(".xwiki-rendering-content")||
419 document.querySelector("main")||
420 document.body;
421
422 if(!root)return;
423
424 var managedHeight=new Set();
425 var managedMargin=new Set();
426 var originalHeight=new WeakMap();
427 var originalMargin=new WeakMap();
428
429 var resizeTimer=0;
430 var running=false;
431
432 var THEMES=[
433 {
434 name:"BLUE",
435 accent:"#21b6d7",
436 bg:"#eaf7fb",
437 text:"#315d68",
438 labels:[
439 "HIER STARTEN",
440 "ENTSCHEIDEN",
441 "ÜBERPRÜFEN & ANPASSEN",
442 "START HERE",
443 "DECIDE",
444 "REVIEW & ADAPT"
445 ]
446 },
447 {
448 name:"RED",
449 accent:"#e94b13",
450 bg:"#fff1ec",
451 text:"#8a4d36",
452 labels:[
453 "PLANEN & ORGANISIEREN",
454 "ORGANISIEREN & DOKUMENTIEREN",
455 "PUBLIZIEREN & PRÄSENTIEREN",
456 "PLAN & ORGANISE",
457 "PLAN & ORGANIZE",
458 "ORGANISE & DOCUMENT",
459 "ORGANIZE & DOCUMENT",
460 "PUBLISH & PRESENT"
461 ]
462 },
463 {
464 name:"YELLOW",
465 accent:"#f0aa00",
466 bg:"#fff8e7",
467 text:"#785b17",
468 labels:[
469 "SCHÜTZEN & KLÄREN",
470 "STANDARDISIEREN & IDENTIFIZIEREN",
471 "ÖFFNEN, NACHNUTZEN & AUFFINDBAR MACHEN",
472 "PROTECT & CLARIFY",
473 "STANDARDISE & IDENTIFY",
474 "STANDARDIZE & IDENTIFY",
475 "OPEN, REUSE & MAKE FINDABLE"
476 ]
477 },
478 {
479 name:"GREEN",
480 accent:"#38b76a",
481 bg:"#edf9f1",
482 text:"#3f7451",
483 labels:[
484 "INFRASTRUKTUR EINRICHTEN",
485 "INFRASTRUKTUR & ZUSAMMENARBEIT EINRICHTEN",
486 "SPEICHERN & ZUGRIFF STEUERN",
487 "REPOSITORIUM, ERHALTEN & ÜBERGEBEN",
488 "SET UP INFRASTRUCTURE",
489 "SET UP INFRASTRUCTURE & COLLABORATION",
490 "STORE & CONTROL ACCESS",
491 "REPOSITORY, PRESERVE & HAND OVER"
492 ]
493 }
494 ];
495
496 function num(value){
497 var n=parseFloat(value);
498 return Number.isFinite(n)?n:0;
499 }
500
501 function norm(value){
502 return String(value||"")
503 .replace(/\s+/g," ")
504 .trim()
505 .toUpperCase();
506 }
507
508 function visible(el){
509 if(!el||el.nodeType!==1)return false;
510
511 var style=getComputedStyle(el);
512 var rect=el.getBoundingClientRect();
513
514 return (
515 style.display!=="none"&&
516 style.visibility!=="hidden"&&
517 rect.width>20&&
518 rect.height>4
519 );
520 }
521
522 function saveStyle(el,map,property){
523 if(map.has(el))return;
524
525 map.set(el,{
526 value:el.style.getPropertyValue(property),
527 priority:el.style.getPropertyPriority(property)
528 });
529 }
530
531 function restoreStyle(el,map,property){
532 var original=map.get(el);
533
534 if(original&&original.value){
535 el.style.setProperty(
536 property,
537 original.value,
538 original.priority||""
539 );
540 }else{
541 el.style.removeProperty(property);
542 }
543 }
544
545 function resetRuntime(){
546 managedHeight.forEach(function(el){
547 restoreStyle(
548 el,
549 originalHeight,
550 "min-height"
551 );
552 el.removeAttribute(
553 "data-sn-master-equal-height"
554 );
555 });
556
557 managedMargin.forEach(function(el){
558 restoreStyle(
559 el,
560 originalMargin,
561 "margin-top"
562 );
563 el.removeAttribute(
564 "data-sn-master-first-row"
565 );
566 });
567
568 managedHeight.clear();
569 managedMargin.clear();
570 }
571
572 function themeFor(text){
573 var value=norm(text);
574
575 for(var i=0;i<THEMES.length;i++){
576 for(var j=0;j<THEMES[i].labels.length;j++){
577 var label=THEMES[i].labels[j];
578
579 if(
580 value===label||
581 value.indexOf(label+" ")===0||
582 value.indexOf(label+" -")===0||
583 value.indexOf(label+" ·")===0
584 ){
585 return THEMES[i];
586 }
587 }
588 }
589
590 return null;
591 }
592
593 /* =======================================================
594 BORDERLESS FILLED RED/ORANGE CTA BUTTONS
595 ======================================================= */
596
597 function colourDistance(a,b){
598 return Math.sqrt(
599 Math.pow(a[0]-b[0],2)+
600 Math.pow(a[1]-b[1],2)+
601 Math.pow(a[2]-b[2],2)
602 );
603 }
604
605 function makeFilledRedOrangeCTAsBorderless(){
606 var RED_ORANGE=[233,75,19];
607
608 Array.from(
609 root.querySelectorAll(
610 'a,button,[role="button"],input[type="submit"],input[type="button"]'
611 )
612 ).forEach(function(el){
613 if(!visible(el))return;
614
615 var style=getComputedStyle(el);
616 var rgb=parseRGB(style.backgroundColor);
617
618 if(!rgb)return;
619
620 if(
621 colourDistance(
622 rgb,
623 RED_ORANGE
624 )>55
625 ){
626 return;
627 }
628
629 var rect=el.getBoundingClientRect();
630
631 if(
632 rect.width<80||
633 rect.height<24
634 ){
635 return;
636 }
637
638 el.style.setProperty(
639 "border",
640 "none",
641 "important"
642 );
643
644 el.style.setProperty(
645 "border-left",
646 "none",
647 "important"
648 );
649
650 el.style.setProperty(
651 "border-top",
652 "none",
653 "important"
654 );
655
656 el.style.setProperty(
657 "border-right",
658 "none",
659 "important"
660 );
661
662 el.style.setProperty(
663 "border-bottom",
664 "none",
665 "important"
666 );
667
668 el.style.setProperty(
669 "box-shadow",
670 "none",
671 "important"
672 );
673 });
674 }
675
676 /* =======================================================
677 FULL-WIDTH THREE-LINE AREA LABELS
678 ======================================================= */
679
680 function compactText(value){
681 return String(value||"")
682 .replace(/\s+/g," ")
683 .trim();
684 }
685
686 function makeThreeLineAreaLabels(){
687 Array.from(
688 root.querySelectorAll(
689 ".arsn-area-label"
690 )
691 ).forEach(function(label){
692 if(
693 label.getAttribute(
694 "data-sn-three-line"
695 )==="1"
696 ){
697 return;
698 }
699
700 var number=
701 label.querySelector(
702 ":scope > .arsn-area-number"
703 );
704
705 var action=
706 label.querySelector(
707 ":scope > .arsn-area-action"
708 );
709
710 if(
711 !number||
712 !action
713 ){
714 return;
715 }
716
717 var clone=
718 label.cloneNode(true);
719
720 var cloneNumber=
721 clone.querySelector(
722 ":scope > .arsn-area-number"
723 );
724
725 var cloneAction=
726 clone.querySelector(
727 ":scope > .arsn-area-action"
728 );
729
730 if(cloneNumber){
731 cloneNumber.remove();
732 }
733
734 if(cloneAction){
735 cloneAction.remove();
736 }
737
738 var titleText=
739 compactText(
740 clone.textContent
741 );
742
743 if(!titleText){
744 return;
745 }
746
747 var numberNode=
748 number.cloneNode(true);
749
750 var actionNode=
751 action.cloneNode(true);
752
753 var titleNode=
754 document.createElement(
755 "span"
756 );
757
758 titleNode.className=
759 "sn-area-label-title";
760
761 titleNode.textContent=
762 titleText;
763
764 while(label.firstChild){
765 label.removeChild(
766 label.firstChild
767 );
768 }
769
770 label.appendChild(
771 numberNode
772 );
773
774 label.appendChild(
775 titleNode
776 );
777
778 label.appendChild(
779 actionNode
780 );
781
782 label.setAttribute(
783 "data-sn-three-line",
784 "1"
785 );
786
787 var head=
788 label.closest(
789 ".arsn-area-head"
790 );
791
792 if(head){
793 head.style.setProperty(
794 "width",
795 "100%",
796 "important"
797 );
798
799 head.style.setProperty(
800 "max-width",
801 "100%",
802 "important"
803 );
804
805 head.style.setProperty(
806 "box-sizing",
807 "border-box",
808 "important"
809 );
810 }
811 });
812 }
813
814 /* =======================================================
815 PLACEHOLDER BADGE
816 ======================================================= */
817
818 function applyPlaceholderBadge(){
819 if(!PLACEHOLDER)return;
820
821 if(
822 document.querySelector(
823 ".sn-coming-soon-badge"
824 )
825 ){
826 return;
827 }
828
829 var title=
830 document.querySelector(
831 "#document-title"
832 )||
833 document.querySelector(
834 "h1"
835 );
836
837 if(!title)return;
838
839 var badge=
840 document.createElement(
841 "span"
842 );
843
844 badge.className=
845 "sn-coming-soon-badge";
846
847 badge.textContent=
848 PLACEHOLDER_LABEL;
849
850 badge.setAttribute(
851 "aria-label",
852 PLACEHOLDER_LABEL
853 );
854
855 title.appendChild(
856 badge
857 );
858 }
859
860 /* =======================================================
861 DETAIL PAGE OWN-ACCENT PROPAGATION
862 ======================================================= */
863
864 function parseRGB(value){
865 var match=String(value||"").match(
866 /rgba?\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)/i
867 );
868
869 if(!match)return null;
870
871 return [
872 Number(match[1]),
873 Number(match[2]),
874 Number(match[3])
875 ];
876 }
877
878 function distance(a,b){
879 return Math.sqrt(
880 Math.pow(a[0]-b[0],2)+
881 Math.pow(a[1]-b[1],2)+
882 Math.pow(a[2]-b[2],2)
883 );
884 }
885
886 function paletteMatch(cssColor){
887 var rgb=parseRGB(cssColor);
888
889 if(!rgb)return null;
890
891 var palette=[
892 {hex:"#21b6d7",rgb:[33,182,215]},
893 {hex:"#e94b13",rgb:[233,75,19]},
894 {hex:"#f0aa00",rgb:[240,170,0]},
895 {hex:"#38b76a",rgb:[56,183,106]}
896 ];
897
898 var best=null;
899 var bestDistance=Infinity;
900
901 palette.forEach(function(item){
902 var d=distance(rgb,item.rgb);
903
904 if(d<bestDistance){
905 best=item;
906 bestDistance=d;
907 }
908 });
909
910 return bestDistance<=30
911 ?best
912 :null;
913 }
914
915 function propagateDetailAccents(){
916 if(PAGE_KIND!=="detail")return;
917
918 Array.from(
919 root.querySelectorAll(
920 ".arsn-call,.dmp-call,.ido-call,.pp-call,"+
921 ".arsn-source,.dmp-source,.ido-source,.pp-source"
922 )
923 ).forEach(function(el){
924 if(!visible(el))return;
925
926 var style=getComputedStyle(el);
927
928 if(
929 num(style.borderTopWidth)>=2
930 ){
931 var match=
932 paletteMatch(
933 style.borderTopColor
934 );
935
936 if(match){
937 el.style.setProperty(
938 "border-left",
939 "4px solid "+match.hex,
940 "important"
941 );
942 }
943 }
944 });
945
946 // Warning families: explicit safety override.
947 Array.from(
948 root.querySelectorAll(
949 ".arsn-warn,.dmp-warn,.ido-warn,.pp-warn,"+
950 ".warn,.warning,.warningmessage,.errormessage"
951 )
952 ).forEach(function(el){
953 if(!visible(el))return;
954
955 el.style.setProperty(
956 "border-left",
957 "4px solid #e94b13",
958 "important"
959 );
960 });
961
962 // Info families: explicit orientation override.
963 Array.from(
964 root.querySelectorAll(
965 ".arsn-info,.dmp-info,.ido-info,.pp-info,.infomessage"
966 )
967 ).forEach(function(el){
968 if(!visible(el))return;
969
970 el.style.setProperty(
971 "border-left",
972 "4px solid #21b6d7",
973 "important"
974 );
975 });
976 }
977
978 /* =======================================================
979 OVERVIEW SEMANTIC THEME PALETTE
980 ======================================================= */
981
982 function smallestThemeHeaders(){
983 return Array.from(
984 root.querySelectorAll(
985 "div,span,p,strong,h3,h4,h5,h6"
986 )
987 ).filter(function(el){
988 if(!visible(el))return false;
989 if(!themeFor(el.textContent))return false;
990
991 return !Array.from(
992 el.children||[]
993 ).some(function(child){
994 return !!themeFor(
995 child.textContent
996 );
997 });
998 });
999 }
1000
1001 function findOverviewCard(header){
1002 var node=header.parentElement;
1003 var candidates=[];
1004
1005 while(node&&node!==root){
1006 var rect=node.getBoundingClientRect();
1007 var style=getComputedStyle(node);
1008
1009 var border=
1010 num(style.borderTopWidth)+
1011 num(style.borderRightWidth)+
1012 num(style.borderBottomWidth)+
1013 num(style.borderLeftWidth);
1014
1015 if(
1016 rect.width>=220&&
1017 rect.width<=800&&
1018 rect.height>=120&&
1019 border>=1
1020 ){
1021 candidates.push(node);
1022 }
1023
1024 node=node.parentElement;
1025 }
1026
1027 if(!candidates.length)return null;
1028
1029 candidates.sort(function(a,b){
1030 return (
1031 b.getBoundingClientRect().height-
1032 a.getBoundingClientRect().height
1033 );
1034 });
1035
1036 return candidates[0];
1037 }
1038
1039 function rowCandidates(link,card){
1040 var result=[];
1041 var cardRect=
1042 card.getBoundingClientRect();
1043
1044 var node=link;
1045
1046 while(node&&node!==card){
1047 if(visible(node)){
1048 var rect=
1049 node.getBoundingClientRect();
1050
1051 if(
1052 rect.height<=105&&
1053 rect.width>=
1054 cardRect.width*.50&&
1055 rect.width<=
1056 cardRect.width*1.03
1057 ){
1058 result.push(node);
1059 }
1060 }
1061
1062 node=node.parentElement;
1063 }
1064
1065 return result;
1066 }
1067
1068 function chooseOuterRow(
1069 candidates,
1070 link
1071 ){
1072 if(!candidates.length){
1073 return link;
1074 }
1075
1076 var bordered=
1077 candidates.filter(function(el){
1078 return (
1079 num(
1080 getComputedStyle(el)
1081 .borderLeftWidth
1082 )>=1
1083 );
1084 });
1085
1086 var pool=
1087 bordered.length
1088 ?bordered
1089 :candidates;
1090
1091 pool.sort(function(a,b){
1092 var ar=
1093 a.getBoundingClientRect();
1094
1095 var br=
1096 b.getBoundingClientRect();
1097
1098 return (
1099 ar.left-br.left||
1100 br.width-ar.width
1101 );
1102 });
1103
1104 return pool[0]||link;
1105 }
1106
1107 function applyOverviewPalette(){
1108 if(PAGE_KIND!=="overview"){
1109 return [];
1110 }
1111
1112 var headers=
1113 smallestThemeHeaders()
1114 .map(function(el){
1115 return {
1116 el:el,
1117 theme:
1118 themeFor(
1119 el.textContent
1120 ),
1121 card:
1122 findOverviewCard(
1123 el
1124 )
1125 };
1126 })
1127 .filter(function(row){
1128 return !!row.card;
1129 });
1130
1131 var unique=[];
1132 var seenHeaders=new Set();
1133
1134 headers.forEach(function(row){
1135 var key=
1136 row.theme.name+
1137 "|"+
1138 Math.round(
1139 row.card
1140 .getBoundingClientRect()
1141 .left
1142 )+
1143 "|"+
1144 Math.round(
1145 row.el
1146 .getBoundingClientRect()
1147 .top
1148 );
1149
1150 if(!seenHeaders.has(key)){
1151 seenHeaders.add(key);
1152 unique.push(row);
1153 }
1154 });
1155
1156 unique.forEach(function(row){
1157 var headerRect=
1158 row.el
1159 .getBoundingClientRect();
1160
1161 row.el.style.setProperty(
1162 "background",
1163 row.theme.bg,
1164 "important"
1165 );
1166
1167 row.el.style.setProperty(
1168 "color",
1169 row.theme.text,
1170 "important"
1171 );
1172
1173 row.el.style.setProperty(
1174 "text-align",
1175 "left",
1176 "important"
1177 );
1178
1179 row.el.style.setProperty(
1180 "word-spacing",
1181 "normal",
1182 "important"
1183 );
1184
1185 var later=
1186 unique
1187 .filter(function(other){
1188 return (
1189 other.card===row.card&&
1190 other.el
1191 .getBoundingClientRect()
1192 .top>
1193 headerRect.top+2
1194 );
1195 })
1196 .sort(function(a,b){
1197 return (
1198 a.el
1199 .getBoundingClientRect()
1200 .top-
1201 b.el
1202 .getBoundingClientRect()
1203 .top
1204 );
1205 });
1206
1207 var stopTop=
1208 later.length
1209 ?later[0].el
1210 .getBoundingClientRect()
1211 .top
1212 :Infinity;
1213
1214 Array.from(
1215 row.card.querySelectorAll("a")
1216 ).forEach(function(link){
1217 if(!visible(link))return;
1218
1219 var rect=
1220 link.getBoundingClientRect();
1221
1222 if(
1223 rect.top<=
1224 headerRect.bottom-2||
1225 rect.top>=
1226 stopTop-2
1227 ){
1228 return;
1229 }
1230
1231 var candidates=
1232 rowCandidates(
1233 link,
1234 row.card
1235 );
1236
1237 var target=
1238 chooseOuterRow(
1239 candidates,
1240 link
1241 );
1242
1243 candidates.forEach(function(el){
1244 el.style.setProperty(
1245 "border-left",
1246 "0 solid transparent",
1247 "important"
1248 );
1249 });
1250
1251 target.style.setProperty(
1252 "border-left",
1253 "3px solid "+
1254 row.theme.accent,
1255 "important"
1256 );
1257
1258 target.style.setProperty(
1259 "box-sizing",
1260 "border-box",
1261 "important"
1262 );
1263 });
1264 });
1265
1266 return unique;
1267 }
1268
1269 /* =======================================================
1270 OVERVIEW CARD HEIGHT + FIRST THEMATIC ROW
1271 ======================================================= */
1272
1273 function alignOverviewCards(headers){
1274 if(
1275 PAGE_KIND!=="overview"||
1276 window.innerWidth<=MOBILE_MAX
1277 ){
1278 return;
1279 }
1280
1281 var cards=[];
1282 var seen=new Set();
1283
1284 headers.forEach(function(row){
1285 if(!seen.has(row.card)){
1286 seen.add(row.card);
1287 cards.push(row.card);
1288 }
1289 });
1290
1291 if(cards.length<2){
1292 return;
1293 }
1294
1295 // Group cards by actual top position.
1296 var groups=[];
1297
1298 cards.forEach(function(card){
1299 var top=
1300 card.getBoundingClientRect().top;
1301
1302 var group=null;
1303
1304 for(var i=0;i<groups.length;i++){
1305 if(
1306 Math.abs(
1307 groups[i].top-top
1308 )<=ROW_TOLERANCE
1309 ){
1310 group=groups[i];
1311 break;
1312 }
1313 }
1314
1315 if(!group){
1316 group={
1317 top:top,
1318 cards:[]
1319 };
1320 groups.push(group);
1321 }
1322
1323 group.cards.push(card);
1324 });
1325
1326 groups.forEach(function(group){
1327 if(group.cards.length<2){
1328 return;
1329 }
1330
1331 var firstHeaders=
1332 group.cards.map(function(card){
1333 var candidates=
1334 headers
1335 .filter(function(row){
1336 return row.card===card;
1337 })
1338 .sort(function(a,b){
1339 return (
1340 a.el
1341 .getBoundingClientRect()
1342 .top-
1343 b.el
1344 .getBoundingClientRect()
1345 .top
1346 );
1347 });
1348
1349 return candidates.length
1350 ?candidates[0]
1351 :null;
1352 });
1353
1354 if(
1355 !firstHeaders.some(function(row){
1356 return !row;
1357 })
1358 ){
1359 var targetTop=
1360 Math.max.apply(
1361 Math,
1362 firstHeaders.map(function(row){
1363 return (
1364 row.el
1365 .getBoundingClientRect()
1366 .top-
1367 row.card
1368 .getBoundingClientRect()
1369 .top
1370 );
1371 })
1372 );
1373
1374 firstHeaders.forEach(function(row){
1375 var relativeTop=
1376 row.el
1377 .getBoundingClientRect()
1378 .top-
1379 row.card
1380 .getBoundingClientRect()
1381 .top;
1382
1383 var delta=
1384 targetTop-relativeTop;
1385
1386 if(delta>1){
1387 saveStyle(
1388 row.el,
1389 originalMargin,
1390 "margin-top"
1391 );
1392
1393 var current=
1394 num(
1395 getComputedStyle(
1396 row.el
1397 ).marginTop
1398 );
1399
1400 row.el.style.setProperty(
1401 "margin-top",
1402 (
1403 current+delta
1404 )+"px"
1405 );
1406
1407 row.el.setAttribute(
1408 "data-sn-master-first-row",
1409 "1"
1410 );
1411
1412 managedMargin.add(
1413 row.el
1414 );
1415 }
1416 });
1417 }
1418
1419 var maxHeight=0;
1420
1421 group.cards.forEach(function(card){
1422 maxHeight=
1423 Math.max(
1424 maxHeight,
1425 card
1426 .getBoundingClientRect()
1427 .height
1428 );
1429 });
1430
1431 maxHeight=
1432 Math.ceil(maxHeight);
1433
1434 group.cards.forEach(function(card){
1435 saveStyle(
1436 card,
1437 originalHeight,
1438 "min-height"
1439 );
1440
1441 card.style.setProperty(
1442 "min-height",
1443 maxHeight+"px"
1444 );
1445
1446 card.setAttribute(
1447 "data-sn-master-equal-height",
1448 "1"
1449 );
1450
1451 managedHeight.add(
1452 card
1453 );
1454 });
1455 });
1456 }
1457
1458 /* =======================================================
1459 DETAIL GRID EQUAL HEIGHT, DESKTOP ONLY
1460 ======================================================= */
1461
1462 function equaliseDetailGrids(){
1463 if(
1464 PAGE_KIND!=="detail"||
1465 window.innerWidth<=MOBILE_MAX
1466 ){
1467 return;
1468 }
1469
1470 var selectors=[
1471 ".arsn-grid",
1472 ".arsn-grid-2",
1473 ".arsn-grid-3",
1474 ".dmp-grid",
1475 ".ido-grid",
1476 ".pp-grid"
1477 ];
1478
1479 selectors.forEach(function(selector){
1480 Array.from(
1481 root.querySelectorAll(selector)
1482 ).forEach(function(grid){
1483 var children=
1484 Array.from(
1485 grid.children||[]
1486 ).filter(visible);
1487
1488 if(children.length<2){
1489 return;
1490 }
1491
1492 var groups=[];
1493
1494 children.forEach(function(child){
1495 var top=
1496 child
1497 .getBoundingClientRect()
1498 .top;
1499
1500 var group=null;
1501
1502 for(var i=0;i<groups.length;i++){
1503 if(
1504 Math.abs(
1505 groups[i].top-top
1506 )<=ROW_TOLERANCE
1507 ){
1508 group=groups[i];
1509 break;
1510 }
1511 }
1512
1513 if(!group){
1514 group={
1515 top:top,
1516 items:[]
1517 };
1518 groups.push(group);
1519 }
1520
1521 group.items.push(child);
1522 });
1523
1524 groups.forEach(function(group){
1525 if(group.items.length<2){
1526 return;
1527 }
1528
1529 var maxHeight=0;
1530
1531 group.items.forEach(function(item){
1532 maxHeight=
1533 Math.max(
1534 maxHeight,
1535 item
1536 .getBoundingClientRect()
1537 .height
1538 );
1539 });
1540
1541 maxHeight=
1542 Math.ceil(maxHeight);
1543
1544 group.items.forEach(function(item){
1545 saveStyle(
1546 item,
1547 originalHeight,
1548 "min-height"
1549 );
1550
1551 item.style.setProperty(
1552 "min-height",
1553 maxHeight+"px"
1554 );
1555
1556 item.setAttribute(
1557 "data-sn-master-equal-height",
1558 "1"
1559 );
1560
1561 managedHeight.add(item);
1562 });
1563 });
1564 });
1565 });
1566 }
1567
1568 /* =======================================================
1569 RUN / RESPONSIVE SCHEDULING
1570 ======================================================= */
1571
1572 function run(){
1573 if(running)return;
1574
1575 running=true;
1576
1577 try{
1578 resetRuntime();
1579 applyPlaceholderBadge();
1580 propagateDetailAccents();
1581
1582 var headers=
1583 applyOverviewPalette();
1584
1585 makeThreeLineAreaLabels();
1586 makeFilledRedOrangeCTAsBorderless();
1587
1588 if(
1589 window.innerWidth>
1590 MOBILE_MAX
1591 ){
1592 alignOverviewCards(
1593 headers
1594 );
1595
1596 equaliseDetailGrids();
1597 }
1598 }finally{
1599 running=false;
1600 }
1601 }
1602
1603 function onResize(){
1604 if(resizeTimer){
1605 clearTimeout(
1606 resizeTimer
1607 );
1608 }
1609
1610 resizeTimer=
1611 setTimeout(
1612 function(){
1613 resizeTimer=0;
1614 run();
1615 },
1616 RESIZE_DEBOUNCE
1617 );
1618 }
1619
1620 async function waitForReady(){
1621 if(
1622 document.readyState!=="complete"
1623 ){
1624 await new Promise(function(resolve){
1625 window.addEventListener(
1626 "load",
1627 resolve,
1628 {once:true}
1629 );
1630 });
1631 }
1632
1633 if(
1634 document.fonts&&
1635 document.fonts.ready
1636 ){
1637 try{
1638 await document.fonts.ready;
1639 }catch(error){}
1640 }
1641
1642 var images=
1643 Array.from(
1644 root.querySelectorAll("img")
1645 );
1646
1647 await Promise.all(
1648 images.map(function(img){
1649 if(img.complete){
1650 return Promise.resolve();
1651 }
1652
1653 return new Promise(function(resolve){
1654 var done=function(){
1655 resolve();
1656 };
1657
1658 img.addEventListener(
1659 "load",
1660 done,
1661 {once:true}
1662 );
1663
1664 img.addEventListener(
1665 "error",
1666 done,
1667 {once:true}
1668 );
1669 });
1670 })
1671 );
1672
1673 run();
1674 }
1675
1676 window.addEventListener(
1677 "resize",
1678 onResize,
1679 {passive:true}
1680 );
1681
1682 waitForReady();
1683 })();
1684 </script>
1685
1686 <!-- SN_SERVICE_NAVIGATOR_MASTER_STYLE_END -->
1687 {{/html}}