Skip to Content

Wiki source code of Prepare

Version 30.1 by Veronika Kocher on Thursday, 03 Sep 2026 15:03
Show last authors
1 {{html clean="false"}}
2
3 <style>
4 .arsn-phase {
5 max-width: 1400px;
6 margin: 0 auto;
7 color: #322f2b;
8 }
9
10 .arsn-phase * {
11 box-sizing: border-box;
12 }
13
14 .arsn-eyebrow {
15 font-size: 12px;
16 font-weight: 700;
17 letter-spacing: .075em;
18 text-transform: uppercase;
19 }
20
21 .arsn-card {
22 border-radius: 11px;
23 box-shadow: 0 1px 3px rgba(0,0,0,.035);
24 }
25
26 .arsn-hero-image {
27 height: 138px;
28 overflow: hidden;
29 border-radius: 11px 11px 0 0;
30 background: #f1eee9;
31 }
32
33 .arsn-hero-image img {
34 width: 100%;
35 height: 100%;
36 object-fit: cover;
37 display: block;
38 }
39
40 .arsn-progress {
41 position: relative;
42 display: grid;
43 grid-template-columns: repeat(3, minmax(0,1fr));
44 gap: 14px;
45 margin: 0 0 26px 0;
46 padding: 4px 0 0 0;
47 }
48
49 .arsn-progress:before {
50 content: "";
51 position: absolute;
52 top: 21px;
53 left: 9%;
54 right: 9%;
55 height: 2px;
56 background: #e9cfc2;
57 z-index: 0;
58 }
59
60 .arsn-step {
61 position: relative;
62 z-index: 1;
63 text-align: center;
64 }
65
66 .arsn-step-dot {
67 width: 14px;
68 height: 14px;
69 margin: 0 auto 7px auto;
70 border-radius: 50%;
71 border: 3px solid #fff;
72 box-shadow: 0 0 0 1px #d5cfc7;
73 background: #d8d2ca;
74 }
75
76 .arsn-step.active .arsn-step-dot {
77 background: #e94b13;
78 box-shadow: 0 0 0 1px #e94b13;
79 }
80
81 .arsn-step.done .arsn-step-dot {
82 background: #8c837a;
83 box-shadow: 0 0 0 1px #8c837a;
84 }
85
86 .arsn-step-label {
87 font-size: 11px;
88 font-weight: 700;
89 letter-spacing: .06em;
90 color: #746d65;
91 }
92
93 .arsn-step.active .arsn-step-label {
94 color: #7d4a37;
95 }
96
97 .arsn-step-desc {
98 margin-top: 3px;
99 font-size: 13px;
100 color: #6a655e;
101 }
102
103 .arsn-focus-grid {
104 display: grid;
105 grid-template-columns: repeat(3, minmax(230px,1fr));
106 gap: 12px;
107 }
108
109 .arsn-focus-group {
110 padding: 13px 14px;
111 background: rgba(255,255,255,.52);
112 border: 1px solid #cfe8ef;
113 border-radius: 8px;
114 }
115
116 .arsn-focus-group strong {
117 display: block;
118 margin-bottom: 6px;
119 color: #2f5661;
120 }
121
122 .arsn-focus-group ul {
123 margin: 0 0 0 17px;
124 padding: 0;
125 color: #365862;
126 }
127
128 .arsn-focus-group li {
129 margin: 4px 0;
130 }
131
132 .arsn-outcome-grid {
133 display: grid;
134 grid-template-columns: repeat(auto-fit, minmax(230px,1fr));
135 gap: 10px;
136 }
137
138 .arsn-outcome {
139 position: relative;
140 padding: 12px 13px 12px 36px;
141 background: #fcfbf8;
142 border: 1px solid #e3ded6;
143 border-radius: 8px;
144 color: #4f4a44;
145 }
146
147 .arsn-outcome:before {
148 content: "✓";
149 position: absolute;
150 left: 13px;
151 top: 10px;
152 color: #e94b13;
153 font-weight: 800;
154 }
155
156 .arsn-area-grid {
157 display: grid;
158 grid-template-columns: repeat(auto-fit, minmax(310px,1fr));
159 gap: 18px;
160 align-items: stretch;
161 }
162
163 .arsn-area {
164 display: flex;
165 flex-direction: column;
166 overflow: hidden;
167 border: 1px solid #e3ded6;
168 border-radius: 11px;
169 background: #fcfbf8;
170 box-shadow: 0 1px 3px rgba(0,0,0,.035);
171 }
172
173 .arsn-area-head {
174 padding: 18px 19px 12px 19px;
175 }
176
177 .arsn-area-body {
178 padding: 3px 19px 19px 19px;
179 }
180
181 .arsn-area-label {
182 display: inline-flex;
183 align-items: center;
184 gap: 7px;
185 padding: 5px 8px;
186 margin-bottom: 9px;
187 border-radius: 5px;
188 font-size: 12px;
189 font-weight: 700;
190 letter-spacing: .065em;
191 }
192
193 .arsn-area-number {
194 opacity: .72;
195 }
196
197 .arsn-area-action {
198 margin-left: 2px;
199 font-weight: 600;
200 opacity: .74;
201 letter-spacing: .02em;
202 text-transform: none;
203 }
204
205 .arsn-area h4 {
206 font-size: 19px;
207 line-height: 1.3;
208 margin: 0 0 7px 0;
209 color: #2f2b27;
210 }
211
212 .arsn-area p {
213 margin: 0;
214 line-height: 1.5;
215 color: #625d56;
216 }
217
218 .arsn-topic {
219 display: block;
220 margin: 6px 0;
221 padding: 10px 11px;
222 border: 1px solid #e9e4dc;
223 border-radius: 6px;
224 background: #fffdf9;
225 color: #252321;
226 text-decoration: none;
227 font-weight: 600;
228 transition: transform .08s ease, box-shadow .08s ease, background .08s ease;
229 }
230
231 .arsn-topic:hover,
232 .arsn-topic:focus {
233 background: #fff7f1;
234 text-decoration: none;
235 transform: translateY(-1px);
236 box-shadow: 0 2px 5px rgba(0,0,0,.06);
237 }
238
239 .arsn-resource-grid {
240 display: grid;
241 grid-template-columns: repeat(auto-fit, minmax(230px,1fr));
242 gap: 12px;
243 }
244
245 .arsn-related-grid {
246 display: grid;
247 grid-template-columns: repeat(auto-fit, minmax(260px,1fr));
248 gap: 8px;
249 }
250
251 .arsn-related-link {
252 display: block;
253 padding: 9px 10px;
254 border: 1px solid #e9e4dc;
255 border-left: 3px solid #e94b13;
256 border-radius: 6px;
257 background: #fffdf9;
258 color: #252321;
259 text-decoration: none;
260 font-weight: 600;
261 }
262
263 .arsn-related-link:hover,
264 .arsn-related-link:focus {
265 background: #fff7f1;
266 text-decoration: none;
267 }
268
269 .arsn-tip {
270 padding: 12px 15px;
271 border: 1px solid #c7e5ed;
272 border-left: 4px solid #21b6d7;
273 background: #eaf6f9;
274 border-radius: 7px;
275 color: #365e68;
276 font-size: 13px;
277 }
278
279 .arsn-tip strong {
280 color: #2d5661;
281 }
282
283 @media (max-width: 800px) {
284 .arsn-focus-grid {
285 grid-template-columns: 1fr;
286 }
287 }
288
289 @media (max-width: 700px) {
290 .arsn-progress:before {
291 display: none;
292 }
293 .arsn-progress {
294 grid-template-columns: 1fr;
295 gap: 8px;
296 }
297 .arsn-step {
298 text-align: left;
299 display: grid;
300 grid-template-columns: 24px 1fr;
301 column-gap: 8px;
302 align-items: center;
303 }
304 .arsn-step-dot {
305 margin: 0;
306 }
307 .arsn-step-desc {
308 grid-column: 2;
309 }
310 }
311 </style>
312
313 <div class="arsn-phase">
314
315 <section class="arsn-card" style="margin:0 0 18px 0;border:1px solid #e3ded6;border-left:6px solid #e94b13;background:#fcfbf8;overflow:hidden;">
316 <div class="arsn-hero-image">
317 <img src="https://xwiki.uni-ak.ac.at/bin/download/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/WebHome/enable.png" alt="Enable — planning and setting up an artistic or research project" />
318 </div>
319 <div style="padding:18px 22px 21px 22px;">
320 <div class="arsn-eyebrow" style="color:#8a4d36;margin-bottom:6px;">PROJECT PHASE 1 · ENABLE</div>
321 <h2 style="font-size:28px;line-height:1.18;margin:0 0 9px 0;color:#2c2926;">I develop my project idea — I plan, fund &amp; set up my project</h2>
322 <p style="font-size:15px;line-height:1.58;color:#5e5953;max-width:1080px;margin:0;">
323 Before active project work begins, clarify how the project will be organised, funded and supported,
324 what materials and research outputs are expected, and how rights, responsibilities, infrastructure
325 and data management will be handled from the start.
326 </p>
327 </div>
328 </section>
329
330 <div class="arsn-progress">
331
332 <div class="arsn-step active">
333 <div class="arsn-step-dot"></div>
334 <div class="arsn-step-label">1 · ENABLE</div>
335 <div class="arsn-step-desc">Plan & set up</div>
336 </div>
337
338 <div class="arsn-step">
339 <div class="arsn-step-dot"></div>
340 <div class="arsn-step-label">2 · WORK & MANAGE</div>
341 <div class="arsn-step-desc">Run & document</div>
342 </div>
343
344 <div class="arsn-step">
345 <div class="arsn-step-dot"></div>
346 <div class="arsn-step-label">3 · PUBLISH & SHARE</div>
347 <div class="arsn-step-desc">Publish, preserve & hand over</div>
348 </div>
349 </div>
350
351 <section class="arsn-card" style="margin:0 0 22px 0;padding:19px 21px;background:#eaf6f9;border:1px solid #cfe8ef;border-left:5px solid #21b6d7;">
352 <div class="arsn-eyebrow" style="color:#3f6871;margin-bottom:5px;">RIGHT NOW</div>
353 <h3 style="font-size:22px;margin:0 0 8px 0;color:#2f4e56;">What should I be focusing on now?</h3>
354 <p style="margin:0 0 15px 0;color:#49636a;">You do not need every detail fixed before you start. You do need enough shared decisions to make the project workable, responsible and easy to continue.</p>
355
356 <div class="arsn-focus-grid">
357 <div class="arsn-focus-group">
358 <strong>Project</strong>
359 <ul>
360 <li>What is the scope, and who is responsible for which decisions?</li>
361 <li>Which funding opportunities and funder requirements apply?</li>
362 <li>What data, materials and outputs will be created, collected or reused?</li>
363 <li>Do I need a Data Management Plan?</li>
364 </ul>
365 </div>
366
367 <div class="arsn-focus-group">
368 <strong>Rights & responsibilities</strong>
369 <ul>
370 <li>Which copyright, permissions or licences need to be clarified?</li>
371 <li>Will personal, sensitive, confidential or ethically complex materials be involved?</li>
372 <li>Which decisions should be documented from the beginning?</li>
373 <li>Who will be responsible for shared accounts, access and handover?</li>
374 </ul>
375 </div>
376
377 <div class="arsn-focus-group">
378 <strong>Working setup</strong>
379 <ul>
380 <li>How should files and folders be organised and named?</li>
381 <li>Where will materials be stored and backed up?</li>
382 <li>Who should have access?</li>
383 <li>Which infrastructure, services and tools are appropriate?</li>
384 </ul>
385 </div>
386 </div>
387 </section>
388
389 <section style="margin:0 0 28px 0;">
390 <div class="arsn-eyebrow" style="color:#8a4d36;margin-bottom:5px;">BY THE END OF THIS PHASE</div>
391 <h3 style="font-size:21px;margin:0 0 10px 0;color:#35312d;">You should have a workable project setup</h3>
392 <div class="arsn-outcome-grid">
393 <div class="arsn-outcome">a clear project scope and named responsibilities</div>
394 <div class="arsn-outcome">a basic plan for data, materials and expected outputs</div>
395 <div class="arsn-outcome">key rights, ethics and protection issues identified</div>
396 <div class="arsn-outcome">agreed storage, backup, access and collaboration arrangements</div>
397 </div>
398 </section>
399
400 <div style="margin:0 0 15px 0;">
401 <div class="arsn-eyebrow" style="color:#8a4d36;margin-bottom:4px;">EXPLORE THIS PHASE</div>
402 <h3 style="font-size:24px;margin:0 0 5px 0;color:#35312d;">Four areas to get your project ready</h3>
403 <p style="margin:0;color:#6a655e;">Start with the area that matches what you need to decide or set up now.</p>
404 </div>
405
406 <div class="arsn-area-grid" style="margin-bottom:30px;">
407 <section class="arsn-area" style="border-top:4px solid #21b6d7;">
408 <div class="arsn-area-head">
409 <div class="arsn-area-label" style="background:#eaf6f9;color:#355f69;"><span class="arsn-area-number">01</span> START HERE <span class="arsn-area-action">· Orient</span></div>
410 <h4>Orient yourself and choose the right level of setup</h4>
411 <p>Use these pages if you are just starting out, unsure which topics apply, or need a practical minimum setup for a smaller project.</p>
412 </div>
413 <div class="arsn-area-body">
414 <a class="arsn-topic" href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/Get%20Started/" style="border-left:3px solid #21b6d7;">Get Started</a>
415 <a class="arsn-topic" href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/Quick%20Start%20for%20Small%20Projects/" style="border-left:3px solid #21b6d7;">Quick Start for Small Projects</a>
416 </div>
417 </section>
418
419 <section class="arsn-area" style="border-top:4px solid #e94b13;">
420 <div class="arsn-area-head">
421 <div class="arsn-area-label" style="background:#f7e6dd;color:#7b4430;"><span class="arsn-area-number">02</span> PLAN &amp; ORGANISE <span class="arsn-area-action">· Decide</span></div>
422 <h4>Define what the project needs and how it will be organised</h4>
423 <p>Clarify scope, responsibilities, funding conditions, expected materials and outputs, and the basic data-management approach before active work begins.</p>
424 </div>
425 <div class="arsn-area-body">
426 <a class="arsn-topic" href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/Project%20Planning%20%26%20Organisation/" style="border-left:3px solid #e94b13;">Project Planning &amp; Organisation</a>
427 <a class="arsn-topic" href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/Funding%20%26%20Funder%20Requirements/" style="border-left:3px solid #e94b13;">Funding &amp; Funder Requirements</a>
428 <a class="arsn-topic" href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/Identify%20Your%20Data%20%26%20Research%20Outputs/" style="border-left:3px solid #e94b13;">Identify Your Data &amp; Research Outputs</a>
429 <a class="arsn-topic" href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/Plan%20Your%20Data%20Management/" style="border-left:3px solid #e94b13;">Plan Your Data Management</a>
430 <a class="arsn-topic" href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/File%20Organisation%20%26%20Naming/" style="border-left:3px solid #e94b13;">File Organisation &amp; Naming</a>
431 </div>
432 </section>
433
434 <section class="arsn-area" style="border-top:4px solid #f0aa00;">
435 <div class="arsn-area-head">
436 <div class="arsn-area-label" style="background:#fff3d5;color:#7a5b12;"><span class="arsn-area-number">03</span> PROTECT &amp; CLARIFY <span class="arsn-area-action">· Check</span></div>
437 <h4>Clarify rights, permissions, protection needs and responsibilities</h4>
438 <p>Identify legal, ethical or data-protection issues early enough to obtain permissions, make agreements and avoid unnecessary restrictions later.</p>
439 </div>
440 <div class="arsn-area-body">
441 <a class="arsn-topic" href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/Copyright%2C%20Rights%20%26%20Licences/" style="border-left:3px solid #f0aa00;">Copyright, Rights &amp; Licences</a>
442 <a class="arsn-topic" href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/Data%20Protection%20%26%20Ethics/" style="border-left:3px solid #f0aa00;">Data Protection &amp; Ethics</a>
443 </div>
444 </section>
445
446 <section class="arsn-area" style="border-top:4px solid #38b76a;">
447 <div class="arsn-area-head">
448 <div class="arsn-area-label" style="background:#e6f3e9;color:#3f6d4b;"><span class="arsn-area-number">04</span> SET UP INFRASTRUCTURE &amp; COLLABORATION <span class="arsn-area-action">· Prepare</span></div>
449 <h4>Create a working environment the project can actually use</h4>
450 <p>Decide where project materials live, how they are backed up and protected, which tools are appropriate and how access and collaboration will work.</p>
451 </div>
452 <div class="arsn-area-body">
453 <a class="arsn-topic" href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/Storage%2C%20Backup%20%26%20Security/" style="border-left:3px solid #38b76a;">Storage, Backup &amp; Security</a>
454 <a class="arsn-topic" href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/Infrastructure%2C%20Services%20%26%20Tools/" style="border-left:3px solid #38b76a;">Infrastructure, Services &amp; Tools</a>
455 <a class="arsn-topic" href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/Collaboration%20Setup/" style="border-left:3px solid #38b76a;">Collaboration Setup</a>
456 </div>
457 </section>
458 </div>
459
460 <section class="arsn-card" style="margin:0 0 27px 0;padding:18px 20px;background:#fcfbf8;border:1px solid #e3ded6;border-left:5px solid #e94b13;">
461 <div class="arsn-eyebrow" style="color:#8a4d36;margin-bottom:5px;">NEXT PHASE</div>
462 <h3 style="font-size:21px;margin:0 0 7px 0;color:#43332d;">Continue in Work &amp; Manage</h3>
463 <p style="margin:0 0 13px 0;color:#68564e;line-height:1.5;">The setup decisions made here should guide the project, but they are not fixed forever. During active project work, organise, document, secure and review how the project is actually working.</p>
464 <a href="https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Work%20%26%20Manage/" class="btn btn-default" style="background:#fff7f1;border-color:#e4cabc;color:#493a34;">Continue to Work &amp; Manage</a>
465 </section>
466
467 <div style="margin:0 0 13px 0;">
468 <div class="arsn-eyebrow" style="color:#8a4d36;margin-bottom:4px;">USEFUL MATERIALS</div>
469 <h3 style="font-size:22px;margin:0 0 4px 0;color:#35312d;">Practical resources</h3>
470 </div>
471
472 <div class="arsn-resource-grid" style="margin-bottom:27px;">
473 <div style="padding:15px 16px;background:#fcfbf8;border:1px solid #e3ded6;border-top:3px solid #21b6d7;border-radius:9px;"><strong style="color:#3a5d66;">Info Sheets</strong><br><span data-arsn-coming-soon="true" style="display:inline-block;margin:6px 0 8px 0;padding:4px 9px;border-radius:14px;background:#fff4ee;border:1px solid #efd9cc;color:#8a4d36;font-size:11px;font-weight:700;letter-spacing:.065em;line-height:1.2;">COMING SOON</span><div style="margin-top:5px;color:#625d56;">Short reference guides for common questions and decisions.</div></div>
474 <div style="padding:15px 16px;background:#fcfbf8;border:1px solid #e3ded6;border-top:3px solid #e94b13;border-radius:9px;"><strong style="color:#503a31;">Tutorials</strong><br><span data-arsn-coming-soon="true" style="display:inline-block;margin:6px 0 8px 0;padding:4px 9px;border-radius:14px;background:#fff4ee;border:1px solid #efd9cc;color:#8a4d36;font-size:11px;font-weight:700;letter-spacing:.065em;line-height:1.2;">COMING SOON</span><div style="margin-top:5px;color:#625d56;">Step-by-step instructions for specific tasks and workflows.</div></div>
475 <div style="padding:15px 16px;background:#fcfbf8;border:1px solid #e3ded6;border-top:3px solid #38b76a;border-radius:9px;"><strong style="color:#3f6b4b;">Checklists &amp; Templates</strong><br><span data-arsn-coming-soon="true" style="display:inline-block;margin:6px 0 8px 0;padding:4px 9px;border-radius:14px;background:#fff4ee;border:1px solid #efd9cc;color:#8a4d36;font-size:11px;font-weight:700;letter-spacing:.065em;line-height:1.2;">COMING SOON</span><div style="margin-top:5px;color:#625d56;">Reusable aids for planning, documenting and reviewing your project setup.</div></div>
476 </div>
477
478 <aside style="margin:0 0 14px 0;padding:16px 18px;border:1px solid #c7e5ed;border-left:5px solid #21b6d7;background:#e5f5f9;border-radius:8px;"><!-- ARSN_PHASE_ROUTING_V1 -->
479 <strong style="color:#2d5661;">Need help finding the right route?</strong>
480 <div style="margin-top:5px;color:#365e68;line-height:1.5;"><strong>Start with Support Kunst und Forschung</strong> for project development, funding, proposals and coordination of funded art/research projects. For rights, data, IT, finance, HR, rooms or other specialist questions, follow the responsible service named on the topic page.</div>
481 </aside>
482
483 <div class="arsn-tip"><strong>Tip · A useful rule of thumb:</strong> Plan early, document decisions, and review them as the project changes. A simple setup that is actually used is usually more effective than a complex plan that is never updated.</div>
484
485 </div>
486 {{/html}}
487
488 {{html clean="false"}}
489 <!-- SN_SERVICE_NAVIGATOR_MASTER_STYLE_START -->
490
491 <style data-sn-service-navigator-master="1">
492 /* =========================================================
493 MASTER TYPOGRAPHY
494 ========================================================= */
495 #xwikicontent h1,
496 #xwikicontent h2,
497 #xwikicontent h3,
498 #xwikicontent h4,
499 #xwikicontent h5,
500 #xwikicontent h6,
501 #xwikicontent .box-title,
502 #xwikicontent [role="heading"],
503 #xwikicontent h1 a,
504 #xwikicontent h2 a,
505 #xwikicontent h3 a,
506 #xwikicontent h4 a,
507 #xwikicontent h5 a,
508 #xwikicontent h6 a,
509 #xwikicontent .box-title a,
510 #xwikicontent [role="heading"] a{
511 text-align:left!important;
512 text-justify:auto!important;
513 word-spacing:normal!important;
514 }
515
516 /* =========================================================
517 COMING SOON / IN VORBEREITUNG
518 ========================================================= */
519 .sn-coming-soon-badge{
520 display:inline-block;
521 vertical-align:middle;
522 margin-left:10px;
523 padding:4px 8px;
524 border-radius:14px;
525 border:1px solid #efd9cc;
526 background:#fff4ee;
527 color:#8a4d36;
528 font-size:11px;
529 font-weight:700;
530 letter-spacing:.055em;
531 line-height:1.2;
532 white-space:nowrap;
533 }
534
535 /* =========================================================
536 NATIVE / DETAIL CALLOUT GEOMETRY
537 Preserve existing backgrounds.
538 ========================================================= */
539 #xwikicontent .arsn-info,
540 #xwikicontent .dmp-info,
541 #xwikicontent .ido-info,
542 #xwikicontent .pp-info,
543 #xwikicontent .infomessage{
544 box-sizing:border-box!important;
545 border-left:4px solid #21b6d7!important;
546 border-radius:8px;
547 text-align:left!important;
548 word-spacing:normal!important;
549 }
550
551 #xwikicontent .arsn-warn,
552 #xwikicontent .dmp-warn,
553 #xwikicontent .ido-warn,
554 #xwikicontent .pp-warn,
555 #xwikicontent .warn,
556 #xwikicontent .warning,
557 #xwikicontent .warningmessage,
558 #xwikicontent .errormessage{
559 box-sizing:border-box!important;
560 border-left:4px solid #e94b13!important;
561 border-radius:8px;
562 text-align:left!important;
563 word-spacing:normal!important;
564 }
565
566 [data-sn-master-equal-height],
567 [data-sn-master-first-row]{
568 box-sizing:border-box;
569 }
570
571 /* =========================================================
572 FULL-WIDTH THREE-LINE NUMBER / TITLE / SUBTITLE BLOCKS
573 ========================================================= */
574 #xwikicontent .arsn-area-label[data-sn-three-line="1"]{
575 display:grid!important;
576 grid-template-columns:minmax(0,1fr)!important;
577 grid-auto-rows:auto!important;
578 width:100%!important;
579 max-width:none!important;
580 box-sizing:border-box!important;
581 justify-items:start!important;
582 align-items:start!important;
583 gap:2px!important;
584 text-align:left!important;
585 text-align-last:left!important;
586 text-justify:auto!important;
587 word-spacing:normal!important;
588 white-space:normal!important;
589 }
590 #xwikicontent .arsn-area-label[data-sn-three-line="1"] > .arsn-area-number,
591 #xwikicontent .arsn-area-label[data-sn-three-line="1"] > .sn-area-label-title,
592 #xwikicontent .arsn-area-label[data-sn-three-line="1"] > .arsn-area-action{
593 display:block!important;
594 width:100%!important;
595 margin:0!important;
596 text-align:left!important;
597 text-align-last:left!important;
598 text-justify:auto!important;
599 word-spacing:normal!important;
600 white-space:normal!important;
601 }
602 </style>
603
604 <script data-sn-service-navigator-master="1">
605 (function(){
606 "use strict";
607
608 var PAGE_KIND="overview";
609 var PLACEHOLDER=false;
610 var PLACEHOLDER_LABEL="COMING SOON";
611
612 var MOBILE_MAX=767;
613 var ROW_TOLERANCE=6;
614 var RESIZE_DEBOUNCE=220;
615
616 var root=
617 document.getElementById("xwikicontent")||
618 document.querySelector(".xwiki-rendering-content")||
619 document.querySelector("main")||
620 document.body;
621
622 if(!root)return;
623
624 var managedHeight=new Set();
625 var managedMargin=new Set();
626 var originalHeight=new WeakMap();
627 var originalMargin=new WeakMap();
628
629 var resizeTimer=0;
630 var running=false;
631
632 var THEMES=[
633 {
634 name:"BLUE",
635 accent:"#21b6d7",
636 bg:"#eaf7fb",
637 text:"#315d68",
638 labels:[
639 "HIER STARTEN",
640 "ENTSCHEIDEN",
641 "ÃœBERPRÃœFEN & ANPASSEN",
642 "START HERE",
643 "DECIDE",
644 "REVIEW & ADAPT"
645 ]
646 },
647 {
648 name:"RED",
649 accent:"#e94b13",
650 bg:"#fff1ec",
651 text:"#8a4d36",
652 labels:[
653 "PLANEN & ORGANISIEREN",
654 "ORGANISIEREN & DOKUMENTIEREN",
655 "PUBLIZIEREN & PRÄSENTIEREN",
656 "PLAN & ORGANISE",
657 "PLAN & ORGANIZE",
658 "ORGANISE & DOCUMENT",
659 "ORGANIZE & DOCUMENT",
660 "PUBLISH & PRESENT"
661 ]
662 },
663 {
664 name:"YELLOW",
665 accent:"#f0aa00",
666 bg:"#fff8e7",
667 text:"#785b17",
668 labels:[
669 "SCHÜTZEN & KLÄREN",
670 "STANDARDISIEREN & IDENTIFIZIEREN",
671 "ÖFFNEN, NACHNUTZEN & AUFFINDBAR MACHEN",
672 "PROTECT & CLARIFY",
673 "STANDARDISE & IDENTIFY",
674 "STANDARDIZE & IDENTIFY",
675 "OPEN, REUSE & MAKE FINDABLE"
676 ]
677 },
678 {
679 name:"GREEN",
680 accent:"#38b76a",
681 bg:"#edf9f1",
682 text:"#3f7451",
683 labels:[
684 "INFRASTRUKTUR EINRICHTEN",
685 "INFRASTRUKTUR & ZUSAMMENARBEIT EINRICHTEN",
686 "SPEICHERN & ZUGRIFF STEUERN",
687 "REPOSITORIUM, ERHALTEN & ÃœBERGEBEN",
688 "SET UP INFRASTRUCTURE",
689 "SET UP INFRASTRUCTURE & COLLABORATION",
690 "STORE & CONTROL ACCESS",
691 "REPOSITORY, PRESERVE & HAND OVER"
692 ]
693 }
694 ];
695
696 function num(value){
697 var n=parseFloat(value);
698 return Number.isFinite(n)?n:0;
699 }
700
701 function norm(value){
702 return String(value||"")
703 .replace(/\s+/g," ")
704 .trim()
705 .toUpperCase();
706 }
707
708 function visible(el){
709 if(!el||el.nodeType!==1)return false;
710
711 var style=getComputedStyle(el);
712 var rect=el.getBoundingClientRect();
713
714 return (
715 style.display!=="none"&&
716 style.visibility!=="hidden"&&
717 rect.width>20&&
718 rect.height>4
719 );
720 }
721
722 function saveStyle(el,map,property){
723 if(map.has(el))return;
724
725 map.set(el,{
726 value:el.style.getPropertyValue(property),
727 priority:el.style.getPropertyPriority(property)
728 });
729 }
730
731 function restoreStyle(el,map,property){
732 var original=map.get(el);
733
734 if(original&&original.value){
735 el.style.setProperty(
736 property,
737 original.value,
738 original.priority||""
739 );
740 }else{
741 el.style.removeProperty(property);
742 }
743 }
744
745 function resetRuntime(){
746 managedHeight.forEach(function(el){
747 restoreStyle(
748 el,
749 originalHeight,
750 "min-height"
751 );
752 el.removeAttribute(
753 "data-sn-master-equal-height"
754 );
755 });
756
757 managedMargin.forEach(function(el){
758 restoreStyle(
759 el,
760 originalMargin,
761 "margin-top"
762 );
763 el.removeAttribute(
764 "data-sn-master-first-row"
765 );
766 });
767
768 managedHeight.clear();
769 managedMargin.clear();
770 }
771
772 function themeFor(text){
773 var value=norm(text);
774
775 for(var i=0;i<THEMES.length;i++){
776 for(var j=0;j<THEMES[i].labels.length;j++){
777 var label=THEMES[i].labels[j];
778
779 if(
780 value===label||
781 value.indexOf(label+" ")===0||
782 value.indexOf(label+" -")===0||
783 value.indexOf(label+" ·")===0
784 ){
785 return THEMES[i];
786 }
787 }
788 }
789
790 return null;
791 }
792
793 /* =======================================================
794 BORDERLESS FILLED RED/ORANGE CTA BUTTONS
795 ======================================================= */
796
797 function colourDistance(a,b){
798 return Math.sqrt(
799 Math.pow(a[0]-b[0],2)+
800 Math.pow(a[1]-b[1],2)+
801 Math.pow(a[2]-b[2],2)
802 );
803 }
804
805 function makeFilledRedOrangeCTAsBorderless(){
806 var RED_ORANGE=[233,75,19];
807
808 Array.from(
809 root.querySelectorAll(
810 'a,button,[role="button"],input[type="submit"],input[type="button"]'
811 )
812 ).forEach(function(el){
813 if(!visible(el))return;
814
815 var style=getComputedStyle(el);
816 var rgb=parseRGB(style.backgroundColor);
817
818 if(!rgb)return;
819
820 if(
821 colourDistance(
822 rgb,
823 RED_ORANGE
824 )>55
825 ){
826 return;
827 }
828
829 var rect=el.getBoundingClientRect();
830
831 if(
832 rect.width<80||
833 rect.height<24
834 ){
835 return;
836 }
837
838 el.style.setProperty(
839 "border",
840 "none",
841 "important"
842 );
843
844 el.style.setProperty(
845 "border-left",
846 "none",
847 "important"
848 );
849
850 el.style.setProperty(
851 "border-top",
852 "none",
853 "important"
854 );
855
856 el.style.setProperty(
857 "border-right",
858 "none",
859 "important"
860 );
861
862 el.style.setProperty(
863 "border-bottom",
864 "none",
865 "important"
866 );
867
868 el.style.setProperty(
869 "box-shadow",
870 "none",
871 "important"
872 );
873 });
874 }
875
876 /* =======================================================
877 FULL-WIDTH THREE-LINE AREA LABELS
878 ======================================================= */
879
880 function compactText(value){
881 return String(value||"")
882 .replace(/\s+/g," ")
883 .trim();
884 }
885
886 function makeThreeLineAreaLabels(){
887 Array.from(
888 root.querySelectorAll(
889 ".arsn-area-label"
890 )
891 ).forEach(function(label){
892 if(
893 label.getAttribute(
894 "data-sn-three-line"
895 )==="1"
896 ){
897 return;
898 }
899
900 var number=
901 label.querySelector(
902 ":scope > .arsn-area-number"
903 );
904
905 var action=
906 label.querySelector(
907 ":scope > .arsn-area-action"
908 );
909
910 if(
911 !number||
912 !action
913 ){
914 return;
915 }
916
917 var clone=
918 label.cloneNode(true);
919
920 var cloneNumber=
921 clone.querySelector(
922 ":scope > .arsn-area-number"
923 );
924
925 var cloneAction=
926 clone.querySelector(
927 ":scope > .arsn-area-action"
928 );
929
930 if(cloneNumber){
931 cloneNumber.remove();
932 }
933
934 if(cloneAction){
935 cloneAction.remove();
936 }
937
938 var titleText=
939 compactText(
940 clone.textContent
941 );
942
943 if(!titleText){
944 return;
945 }
946
947 var numberNode=
948 number.cloneNode(true);
949
950 var actionNode=
951 action.cloneNode(true);
952
953 var titleNode=
954 document.createElement(
955 "span"
956 );
957
958 titleNode.className=
959 "sn-area-label-title";
960
961 titleNode.textContent=
962 titleText;
963
964 while(label.firstChild){
965 label.removeChild(
966 label.firstChild
967 );
968 }
969
970 label.appendChild(
971 numberNode
972 );
973
974 label.appendChild(
975 titleNode
976 );
977
978 label.appendChild(
979 actionNode
980 );
981
982 label.setAttribute(
983 "data-sn-three-line",
984 "1"
985 );
986
987 var head=
988 label.closest(
989 ".arsn-area-head"
990 );
991
992 if(head){
993 head.style.setProperty(
994 "width",
995 "100%",
996 "important"
997 );
998
999 head.style.setProperty(
1000 "max-width",
1001 "100%",
1002 "important"
1003 );
1004
1005 head.style.setProperty(
1006 "box-sizing",
1007 "border-box",
1008 "important"
1009 );
1010 }
1011 });
1012 }
1013
1014 /* =======================================================
1015 PLACEHOLDER BADGE
1016 ======================================================= */
1017
1018 function applyPlaceholderBadge(){
1019 if(!PLACEHOLDER)return;
1020
1021 if(
1022 document.querySelector(
1023 ".sn-coming-soon-badge"
1024 )
1025 ){
1026 return;
1027 }
1028
1029 var title=
1030 document.querySelector(
1031 "#document-title"
1032 )||
1033 document.querySelector(
1034 "h1"
1035 );
1036
1037 if(!title)return;
1038
1039 var badge=
1040 document.createElement(
1041 "span"
1042 );
1043
1044 badge.className=
1045 "sn-coming-soon-badge";
1046
1047 badge.textContent=
1048 PLACEHOLDER_LABEL;
1049
1050 badge.setAttribute(
1051 "aria-label",
1052 PLACEHOLDER_LABEL
1053 );
1054
1055 title.appendChild(
1056 badge
1057 );
1058 }
1059
1060 /* =======================================================
1061 DETAIL PAGE OWN-ACCENT PROPAGATION
1062 ======================================================= */
1063
1064 function parseRGB(value){
1065 var match=String(value||"").match(
1066 /rgba?\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)/i
1067 );
1068
1069 if(!match)return null;
1070
1071 return [
1072 Number(match[1]),
1073 Number(match[2]),
1074 Number(match[3])
1075 ];
1076 }
1077
1078 function distance(a,b){
1079 return Math.sqrt(
1080 Math.pow(a[0]-b[0],2)+
1081 Math.pow(a[1]-b[1],2)+
1082 Math.pow(a[2]-b[2],2)
1083 );
1084 }
1085
1086 function paletteMatch(cssColor){
1087 var rgb=parseRGB(cssColor);
1088
1089 if(!rgb)return null;
1090
1091 var palette=[
1092 {hex:"#21b6d7",rgb:[33,182,215]},
1093 {hex:"#e94b13",rgb:[233,75,19]},
1094 {hex:"#f0aa00",rgb:[240,170,0]},
1095 {hex:"#38b76a",rgb:[56,183,106]}
1096 ];
1097
1098 var best=null;
1099 var bestDistance=Infinity;
1100
1101 palette.forEach(function(item){
1102 var d=distance(rgb,item.rgb);
1103
1104 if(d<bestDistance){
1105 best=item;
1106 bestDistance=d;
1107 }
1108 });
1109
1110 return bestDistance<=30
1111 ?best
1112 :null;
1113 }
1114
1115 function propagateDetailAccents(){
1116 if(PAGE_KIND!=="detail")return;
1117
1118 Array.from(
1119 root.querySelectorAll(
1120 ".arsn-call,.dmp-call,.ido-call,.pp-call,"+
1121 ".arsn-source,.dmp-source,.ido-source,.pp-source"
1122 )
1123 ).forEach(function(el){
1124 if(!visible(el))return;
1125
1126 var style=getComputedStyle(el);
1127
1128 if(
1129 num(style.borderTopWidth)>=2
1130 ){
1131 var match=
1132 paletteMatch(
1133 style.borderTopColor
1134 );
1135
1136 if(match){
1137 el.style.setProperty(
1138 "border-left",
1139 "4px solid "+match.hex,
1140 "important"
1141 );
1142 }
1143 }
1144 });
1145
1146 // Warning families: explicit safety override.
1147 Array.from(
1148 root.querySelectorAll(
1149 ".arsn-warn,.dmp-warn,.ido-warn,.pp-warn,"+
1150 ".warn,.warning,.warningmessage,.errormessage"
1151 )
1152 ).forEach(function(el){
1153 if(!visible(el))return;
1154
1155 el.style.setProperty(
1156 "border-left",
1157 "4px solid #e94b13",
1158 "important"
1159 );
1160 });
1161
1162 // Info families: explicit orientation override.
1163 Array.from(
1164 root.querySelectorAll(
1165 ".arsn-info,.dmp-info,.ido-info,.pp-info,.infomessage"
1166 )
1167 ).forEach(function(el){
1168 if(!visible(el))return;
1169
1170 el.style.setProperty(
1171 "border-left",
1172 "4px solid #21b6d7",
1173 "important"
1174 );
1175 });
1176 }
1177
1178 /* =======================================================
1179 OVERVIEW SEMANTIC THEME PALETTE
1180 ======================================================= */
1181
1182 function smallestThemeHeaders(){
1183 return Array.from(
1184 root.querySelectorAll(
1185 "div,span,p,strong,h3,h4,h5,h6"
1186 )
1187 ).filter(function(el){
1188 if(!visible(el))return false;
1189 if(!themeFor(el.textContent))return false;
1190
1191 return !Array.from(
1192 el.children||[]
1193 ).some(function(child){
1194 return !!themeFor(
1195 child.textContent
1196 );
1197 });
1198 });
1199 }
1200
1201 function findOverviewCard(header){
1202 var node=header.parentElement;
1203 var candidates=[];
1204
1205 while(node&&node!==root){
1206 var rect=node.getBoundingClientRect();
1207 var style=getComputedStyle(node);
1208
1209 var border=
1210 num(style.borderTopWidth)+
1211 num(style.borderRightWidth)+
1212 num(style.borderBottomWidth)+
1213 num(style.borderLeftWidth);
1214
1215 if(
1216 rect.width>=220&&
1217 rect.width<=800&&
1218 rect.height>=120&&
1219 border>=1
1220 ){
1221 candidates.push(node);
1222 }
1223
1224 node=node.parentElement;
1225 }
1226
1227 if(!candidates.length)return null;
1228
1229 candidates.sort(function(a,b){
1230 return (
1231 b.getBoundingClientRect().height-
1232 a.getBoundingClientRect().height
1233 );
1234 });
1235
1236 return candidates[0];
1237 }
1238
1239 function rowCandidates(link,card){
1240 var result=[];
1241 var cardRect=
1242 card.getBoundingClientRect();
1243
1244 var node=link;
1245
1246 while(node&&node!==card){
1247 if(visible(node)){
1248 var rect=
1249 node.getBoundingClientRect();
1250
1251 if(
1252 rect.height<=105&&
1253 rect.width>=
1254 cardRect.width*.50&&
1255 rect.width<=
1256 cardRect.width*1.03
1257 ){
1258 result.push(node);
1259 }
1260 }
1261
1262 node=node.parentElement;
1263 }
1264
1265 return result;
1266 }
1267
1268 function chooseOuterRow(
1269 candidates,
1270 link
1271 ){
1272 if(!candidates.length){
1273 return link;
1274 }
1275
1276 var bordered=
1277 candidates.filter(function(el){
1278 return (
1279 num(
1280 getComputedStyle(el)
1281 .borderLeftWidth
1282 )>=1
1283 );
1284 });
1285
1286 var pool=
1287 bordered.length
1288 ?bordered
1289 :candidates;
1290
1291 pool.sort(function(a,b){
1292 var ar=
1293 a.getBoundingClientRect();
1294
1295 var br=
1296 b.getBoundingClientRect();
1297
1298 return (
1299 ar.left-br.left||
1300 br.width-ar.width
1301 );
1302 });
1303
1304 return pool[0]||link;
1305 }
1306
1307 function applyOverviewPalette(){
1308 if(PAGE_KIND!=="overview"){
1309 return [];
1310 }
1311
1312 var headers=
1313 smallestThemeHeaders()
1314 .map(function(el){
1315 return {
1316 el:el,
1317 theme:
1318 themeFor(
1319 el.textContent
1320 ),
1321 card:
1322 findOverviewCard(
1323 el
1324 )
1325 };
1326 })
1327 .filter(function(row){
1328 return !!row.card;
1329 });
1330
1331 var unique=[];
1332 var seenHeaders=new Set();
1333
1334 headers.forEach(function(row){
1335 var key=
1336 row.theme.name+
1337 "|"+
1338 Math.round(
1339 row.card
1340 .getBoundingClientRect()
1341 .left
1342 )+
1343 "|"+
1344 Math.round(
1345 row.el
1346 .getBoundingClientRect()
1347 .top
1348 );
1349
1350 if(!seenHeaders.has(key)){
1351 seenHeaders.add(key);
1352 unique.push(row);
1353 }
1354 });
1355
1356 unique.forEach(function(row){
1357 var headerRect=
1358 row.el
1359 .getBoundingClientRect();
1360
1361 row.el.style.setProperty(
1362 "background",
1363 row.theme.bg,
1364 "important"
1365 );
1366
1367 row.el.style.setProperty(
1368 "color",
1369 row.theme.text,
1370 "important"
1371 );
1372
1373 row.el.style.setProperty(
1374 "text-align",
1375 "left",
1376 "important"
1377 );
1378
1379 row.el.style.setProperty(
1380 "word-spacing",
1381 "normal",
1382 "important"
1383 );
1384
1385 var later=
1386 unique
1387 .filter(function(other){
1388 return (
1389 other.card===row.card&&
1390 other.el
1391 .getBoundingClientRect()
1392 .top>
1393 headerRect.top+2
1394 );
1395 })
1396 .sort(function(a,b){
1397 return (
1398 a.el
1399 .getBoundingClientRect()
1400 .top-
1401 b.el
1402 .getBoundingClientRect()
1403 .top
1404 );
1405 });
1406
1407 var stopTop=
1408 later.length
1409 ?later[0].el
1410 .getBoundingClientRect()
1411 .top
1412 :Infinity;
1413
1414 Array.from(
1415 row.card.querySelectorAll("a")
1416 ).forEach(function(link){
1417 if(!visible(link))return;
1418
1419 var rect=
1420 link.getBoundingClientRect();
1421
1422 if(
1423 rect.top<=
1424 headerRect.bottom-2||
1425 rect.top>=
1426 stopTop-2
1427 ){
1428 return;
1429 }
1430
1431 var candidates=
1432 rowCandidates(
1433 link,
1434 row.card
1435 );
1436
1437 var target=
1438 chooseOuterRow(
1439 candidates,
1440 link
1441 );
1442
1443 candidates.forEach(function(el){
1444 el.style.setProperty(
1445 "border-left",
1446 "0 solid transparent",
1447 "important"
1448 );
1449 });
1450
1451 target.style.setProperty(
1452 "border-left",
1453 "3px solid "+
1454 row.theme.accent,
1455 "important"
1456 );
1457
1458 target.style.setProperty(
1459 "box-sizing",
1460 "border-box",
1461 "important"
1462 );
1463 });
1464 });
1465
1466 return unique;
1467 }
1468
1469 /* =======================================================
1470 OVERVIEW CARD HEIGHT + FIRST THEMATIC ROW
1471 ======================================================= */
1472
1473 function alignOverviewCards(headers){
1474 if(
1475 PAGE_KIND!=="overview"||
1476 window.innerWidth<=MOBILE_MAX
1477 ){
1478 return;
1479 }
1480
1481 var cards=[];
1482 var seen=new Set();
1483
1484 headers.forEach(function(row){
1485 if(!seen.has(row.card)){
1486 seen.add(row.card);
1487 cards.push(row.card);
1488 }
1489 });
1490
1491 if(cards.length<2){
1492 return;
1493 }
1494
1495 // Group cards by actual top position.
1496 var groups=[];
1497
1498 cards.forEach(function(card){
1499 var top=
1500 card.getBoundingClientRect().top;
1501
1502 var group=null;
1503
1504 for(var i=0;i<groups.length;i++){
1505 if(
1506 Math.abs(
1507 groups[i].top-top
1508 )<=ROW_TOLERANCE
1509 ){
1510 group=groups[i];
1511 break;
1512 }
1513 }
1514
1515 if(!group){
1516 group={
1517 top:top,
1518 cards:[]
1519 };
1520 groups.push(group);
1521 }
1522
1523 group.cards.push(card);
1524 });
1525
1526 groups.forEach(function(group){
1527 if(group.cards.length<2){
1528 return;
1529 }
1530
1531 var firstHeaders=
1532 group.cards.map(function(card){
1533 var candidates=
1534 headers
1535 .filter(function(row){
1536 return row.card===card;
1537 })
1538 .sort(function(a,b){
1539 return (
1540 a.el
1541 .getBoundingClientRect()
1542 .top-
1543 b.el
1544 .getBoundingClientRect()
1545 .top
1546 );
1547 });
1548
1549 return candidates.length
1550 ?candidates[0]
1551 :null;
1552 });
1553
1554 if(
1555 !firstHeaders.some(function(row){
1556 return !row;
1557 })
1558 ){
1559 var targetTop=
1560 Math.max.apply(
1561 Math,
1562 firstHeaders.map(function(row){
1563 return (
1564 row.el
1565 .getBoundingClientRect()
1566 .top-
1567 row.card
1568 .getBoundingClientRect()
1569 .top
1570 );
1571 })
1572 );
1573
1574 firstHeaders.forEach(function(row){
1575 var relativeTop=
1576 row.el
1577 .getBoundingClientRect()
1578 .top-
1579 row.card
1580 .getBoundingClientRect()
1581 .top;
1582
1583 var delta=
1584 targetTop-relativeTop;
1585
1586 if(delta>1){
1587 saveStyle(
1588 row.el,
1589 originalMargin,
1590 "margin-top"
1591 );
1592
1593 var current=
1594 num(
1595 getComputedStyle(
1596 row.el
1597 ).marginTop
1598 );
1599
1600 row.el.style.setProperty(
1601 "margin-top",
1602 (
1603 current+delta
1604 )+"px"
1605 );
1606
1607 row.el.setAttribute(
1608 "data-sn-master-first-row",
1609 "1"
1610 );
1611
1612 managedMargin.add(
1613 row.el
1614 );
1615 }
1616 });
1617 }
1618
1619 var maxHeight=0;
1620
1621 group.cards.forEach(function(card){
1622 maxHeight=
1623 Math.max(
1624 maxHeight,
1625 card
1626 .getBoundingClientRect()
1627 .height
1628 );
1629 });
1630
1631 maxHeight=
1632 Math.ceil(maxHeight);
1633
1634 group.cards.forEach(function(card){
1635 saveStyle(
1636 card,
1637 originalHeight,
1638 "min-height"
1639 );
1640
1641 card.style.setProperty(
1642 "min-height",
1643 maxHeight+"px"
1644 );
1645
1646 card.setAttribute(
1647 "data-sn-master-equal-height",
1648 "1"
1649 );
1650
1651 managedHeight.add(
1652 card
1653 );
1654 });
1655 });
1656 }
1657
1658 /* =======================================================
1659 DETAIL GRID EQUAL HEIGHT, DESKTOP ONLY
1660 ======================================================= */
1661
1662 function equaliseDetailGrids(){
1663 if(
1664 PAGE_KIND!=="detail"||
1665 window.innerWidth<=MOBILE_MAX
1666 ){
1667 return;
1668 }
1669
1670 var selectors=[
1671 ".arsn-grid",
1672 ".arsn-grid-2",
1673 ".arsn-grid-3",
1674 ".dmp-grid",
1675 ".ido-grid",
1676 ".pp-grid"
1677 ];
1678
1679 selectors.forEach(function(selector){
1680 Array.from(
1681 root.querySelectorAll(selector)
1682 ).forEach(function(grid){
1683 var children=
1684 Array.from(
1685 grid.children||[]
1686 ).filter(visible);
1687
1688 if(children.length<2){
1689 return;
1690 }
1691
1692 var groups=[];
1693
1694 children.forEach(function(child){
1695 var top=
1696 child
1697 .getBoundingClientRect()
1698 .top;
1699
1700 var group=null;
1701
1702 for(var i=0;i<groups.length;i++){
1703 if(
1704 Math.abs(
1705 groups[i].top-top
1706 )<=ROW_TOLERANCE
1707 ){
1708 group=groups[i];
1709 break;
1710 }
1711 }
1712
1713 if(!group){
1714 group={
1715 top:top,
1716 items:[]
1717 };
1718 groups.push(group);
1719 }
1720
1721 group.items.push(child);
1722 });
1723
1724 groups.forEach(function(group){
1725 if(group.items.length<2){
1726 return;
1727 }
1728
1729 var maxHeight=0;
1730
1731 group.items.forEach(function(item){
1732 maxHeight=
1733 Math.max(
1734 maxHeight,
1735 item
1736 .getBoundingClientRect()
1737 .height
1738 );
1739 });
1740
1741 maxHeight=
1742 Math.ceil(maxHeight);
1743
1744 group.items.forEach(function(item){
1745 saveStyle(
1746 item,
1747 originalHeight,
1748 "min-height"
1749 );
1750
1751 item.style.setProperty(
1752 "min-height",
1753 maxHeight+"px"
1754 );
1755
1756 item.setAttribute(
1757 "data-sn-master-equal-height",
1758 "1"
1759 );
1760
1761 managedHeight.add(item);
1762 });
1763 });
1764 });
1765 });
1766 }
1767
1768 /* =======================================================
1769 RUN / RESPONSIVE SCHEDULING
1770 ======================================================= */
1771
1772 function run(){
1773 if(running)return;
1774
1775 running=true;
1776
1777 try{
1778 resetRuntime();
1779 applyPlaceholderBadge();
1780 propagateDetailAccents();
1781
1782 var headers=
1783 applyOverviewPalette();
1784
1785 makeThreeLineAreaLabels();
1786 makeFilledRedOrangeCTAsBorderless();
1787
1788 if(
1789 window.innerWidth>
1790 MOBILE_MAX
1791 ){
1792 alignOverviewCards(
1793 headers
1794 );
1795
1796 equaliseDetailGrids();
1797 }
1798 }finally{
1799 running=false;
1800 }
1801 }
1802
1803 function onResize(){
1804 if(resizeTimer){
1805 clearTimeout(
1806 resizeTimer
1807 );
1808 }
1809
1810 resizeTimer=
1811 setTimeout(
1812 function(){
1813 resizeTimer=0;
1814 run();
1815 },
1816 RESIZE_DEBOUNCE
1817 );
1818 }
1819
1820 async function waitForReady(){
1821 if(
1822 document.readyState!=="complete"
1823 ){
1824 await new Promise(function(resolve){
1825 window.addEventListener(
1826 "load",
1827 resolve,
1828 {once:true}
1829 );
1830 });
1831 }
1832
1833 if(
1834 document.fonts&&
1835 document.fonts.ready
1836 ){
1837 try{
1838 await document.fonts.ready;
1839 }catch(error){}
1840 }
1841
1842 var images=
1843 Array.from(
1844 root.querySelectorAll("img")
1845 );
1846
1847 await Promise.all(
1848 images.map(function(img){
1849 if(img.complete){
1850 return Promise.resolve();
1851 }
1852
1853 return new Promise(function(resolve){
1854 var done=function(){
1855 resolve();
1856 };
1857
1858 img.addEventListener(
1859 "load",
1860 done,
1861 {once:true}
1862 );
1863
1864 img.addEventListener(
1865 "error",
1866 done,
1867 {once:true}
1868 );
1869 });
1870 })
1871 );
1872
1873 run();
1874 }
1875
1876 window.addEventListener(
1877 "resize",
1878 onResize,
1879 {passive:true}
1880 );
1881
1882 waitForReady();
1883 })();
1884 </script>
1885
1886 <!-- SN_SERVICE_NAVIGATOR_MASTER_STYLE_END -->
1887 {{/html}}