Skip to Content

Wiki source code of Prepare

Version 30.2 by Veronika Kocher on Thursday, 03 Sep 2026 15:54
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 · PREPARE</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 · PREPARE</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 // Phase overview rule:
1184 // only explicit three-line area-label blocks carry semantic colour.
1185 // Ordinary h4 and focus-card headings stay neutral.
1186 return Array.from(
1187 root.querySelectorAll(
1188 ".arsn-area-label"
1189 )
1190 ).filter(function(el){
1191 return (
1192 visible(el)&&
1193 !!themeFor(
1194 el.textContent
1195 )
1196 );
1197 });
1198 }
1199
1200 function findOverviewCard(header){
1201 var node=header.parentElement;
1202 var candidates=[];
1203
1204 while(node&&node!==root){
1205 var rect=node.getBoundingClientRect();
1206 var style=getComputedStyle(node);
1207
1208 var border=
1209 num(style.borderTopWidth)+
1210 num(style.borderRightWidth)+
1211 num(style.borderBottomWidth)+
1212 num(style.borderLeftWidth);
1213
1214 if(
1215 rect.width>=220&&
1216 rect.width<=800&&
1217 rect.height>=120&&
1218 border>=1
1219 ){
1220 candidates.push(node);
1221 }
1222
1223 node=node.parentElement;
1224 }
1225
1226 if(!candidates.length)return null;
1227
1228 candidates.sort(function(a,b){
1229 return (
1230 b.getBoundingClientRect().height-
1231 a.getBoundingClientRect().height
1232 );
1233 });
1234
1235 return candidates[0];
1236 }
1237
1238 function rowCandidates(link,card){
1239 var result=[];
1240 var cardRect=
1241 card.getBoundingClientRect();
1242
1243 var node=link;
1244
1245 while(node&&node!==card){
1246 if(visible(node)){
1247 var rect=
1248 node.getBoundingClientRect();
1249
1250 if(
1251 rect.height<=105&&
1252 rect.width>=
1253 cardRect.width*.50&&
1254 rect.width<=
1255 cardRect.width*1.03
1256 ){
1257 result.push(node);
1258 }
1259 }
1260
1261 node=node.parentElement;
1262 }
1263
1264 return result;
1265 }
1266
1267 function chooseOuterRow(
1268 candidates,
1269 link
1270 ){
1271 if(!candidates.length){
1272 return link;
1273 }
1274
1275 var bordered=
1276 candidates.filter(function(el){
1277 return (
1278 num(
1279 getComputedStyle(el)
1280 .borderLeftWidth
1281 )>=1
1282 );
1283 });
1284
1285 var pool=
1286 bordered.length
1287 ?bordered
1288 :candidates;
1289
1290 pool.sort(function(a,b){
1291 var ar=
1292 a.getBoundingClientRect();
1293
1294 var br=
1295 b.getBoundingClientRect();
1296
1297 return (
1298 ar.left-br.left||
1299 br.width-ar.width
1300 );
1301 });
1302
1303 return pool[0]||link;
1304 }
1305
1306 function applyOverviewPalette(){
1307 if(PAGE_KIND!=="overview"){
1308 return [];
1309 }
1310
1311 var headers=
1312 smallestThemeHeaders()
1313 .map(function(el){
1314 return {
1315 el:el,
1316 theme:
1317 themeFor(
1318 el.textContent
1319 ),
1320 card:
1321 findOverviewCard(
1322 el
1323 )
1324 };
1325 })
1326 .filter(function(row){
1327 return !!row.card;
1328 });
1329
1330 var unique=[];
1331 var seenHeaders=new Set();
1332
1333 headers.forEach(function(row){
1334 var key=
1335 row.theme.name+
1336 "|"+
1337 Math.round(
1338 row.card
1339 .getBoundingClientRect()
1340 .left
1341 )+
1342 "|"+
1343 Math.round(
1344 row.el
1345 .getBoundingClientRect()
1346 .top
1347 );
1348
1349 if(!seenHeaders.has(key)){
1350 seenHeaders.add(key);
1351 unique.push(row);
1352 }
1353 });
1354
1355 unique.forEach(function(row){
1356 var headerRect=
1357 row.el
1358 .getBoundingClientRect();
1359
1360 row.el.style.setProperty(
1361 "background",
1362 row.theme.bg,
1363 "important"
1364 );
1365
1366 row.el.style.setProperty(
1367 "color",
1368 row.theme.text,
1369 "important"
1370 );
1371
1372 row.el.style.setProperty(
1373 "text-align",
1374 "left",
1375 "important"
1376 );
1377
1378 row.el.style.setProperty(
1379 "word-spacing",
1380 "normal",
1381 "important"
1382 );
1383
1384 var later=
1385 unique
1386 .filter(function(other){
1387 return (
1388 other.card===row.card&&
1389 other.el
1390 .getBoundingClientRect()
1391 .top>
1392 headerRect.top+2
1393 );
1394 })
1395 .sort(function(a,b){
1396 return (
1397 a.el
1398 .getBoundingClientRect()
1399 .top-
1400 b.el
1401 .getBoundingClientRect()
1402 .top
1403 );
1404 });
1405
1406 var stopTop=
1407 later.length
1408 ?later[0].el
1409 .getBoundingClientRect()
1410 .top
1411 :Infinity;
1412
1413 Array.from(
1414 row.card.querySelectorAll("a")
1415 ).forEach(function(link){
1416 if(!visible(link))return;
1417
1418 var rect=
1419 link.getBoundingClientRect();
1420
1421 if(
1422 rect.top<=
1423 headerRect.bottom-2||
1424 rect.top>=
1425 stopTop-2
1426 ){
1427 return;
1428 }
1429
1430 var candidates=
1431 rowCandidates(
1432 link,
1433 row.card
1434 );
1435
1436 var target=
1437 chooseOuterRow(
1438 candidates,
1439 link
1440 );
1441
1442 candidates.forEach(function(el){
1443 el.style.setProperty(
1444 "border-left",
1445 "0 solid transparent",
1446 "important"
1447 );
1448 });
1449
1450 target.style.setProperty(
1451 "border-left",
1452 "3px solid "+
1453 row.theme.accent,
1454 "important"
1455 );
1456
1457 target.style.setProperty(
1458 "box-sizing",
1459 "border-box",
1460 "important"
1461 );
1462 });
1463 });
1464
1465 return unique;
1466 }
1467
1468 /* =======================================================
1469 OVERVIEW CARD HEIGHT + FIRST THEMATIC ROW
1470 ======================================================= */
1471
1472 function alignOverviewCards(headers){
1473 if(
1474 PAGE_KIND!=="overview"||
1475 window.innerWidth<=MOBILE_MAX
1476 ){
1477 return;
1478 }
1479
1480 var cards=[];
1481 var seen=new Set();
1482
1483 headers.forEach(function(row){
1484 if(!seen.has(row.card)){
1485 seen.add(row.card);
1486 cards.push(row.card);
1487 }
1488 });
1489
1490 if(cards.length<2){
1491 return;
1492 }
1493
1494 // Group cards by actual top position.
1495 var groups=[];
1496
1497 cards.forEach(function(card){
1498 var top=
1499 card.getBoundingClientRect().top;
1500
1501 var group=null;
1502
1503 for(var i=0;i<groups.length;i++){
1504 if(
1505 Math.abs(
1506 groups[i].top-top
1507 )<=ROW_TOLERANCE
1508 ){
1509 group=groups[i];
1510 break;
1511 }
1512 }
1513
1514 if(!group){
1515 group={
1516 top:top,
1517 cards:[]
1518 };
1519 groups.push(group);
1520 }
1521
1522 group.cards.push(card);
1523 });
1524
1525 groups.forEach(function(group){
1526 if(group.cards.length<2){
1527 return;
1528 }
1529
1530 var firstHeaders=
1531 group.cards.map(function(card){
1532 var candidates=
1533 headers
1534 .filter(function(row){
1535 return row.card===card;
1536 })
1537 .sort(function(a,b){
1538 return (
1539 a.el
1540 .getBoundingClientRect()
1541 .top-
1542 b.el
1543 .getBoundingClientRect()
1544 .top
1545 );
1546 });
1547
1548 return candidates.length
1549 ?candidates[0]
1550 :null;
1551 });
1552
1553 if(
1554 !firstHeaders.some(function(row){
1555 return !row;
1556 })
1557 ){
1558 var targetTop=
1559 Math.max.apply(
1560 Math,
1561 firstHeaders.map(function(row){
1562 return (
1563 row.el
1564 .getBoundingClientRect()
1565 .top-
1566 row.card
1567 .getBoundingClientRect()
1568 .top
1569 );
1570 })
1571 );
1572
1573 firstHeaders.forEach(function(row){
1574 var relativeTop=
1575 row.el
1576 .getBoundingClientRect()
1577 .top-
1578 row.card
1579 .getBoundingClientRect()
1580 .top;
1581
1582 var delta=
1583 targetTop-relativeTop;
1584
1585 if(delta>1){
1586 saveStyle(
1587 row.el,
1588 originalMargin,
1589 "margin-top"
1590 );
1591
1592 var current=
1593 num(
1594 getComputedStyle(
1595 row.el
1596 ).marginTop
1597 );
1598
1599 row.el.style.setProperty(
1600 "margin-top",
1601 (
1602 current+delta
1603 )+"px"
1604 );
1605
1606 row.el.setAttribute(
1607 "data-sn-master-first-row",
1608 "1"
1609 );
1610
1611 managedMargin.add(
1612 row.el
1613 );
1614 }
1615 });
1616 }
1617
1618 var maxHeight=0;
1619
1620 group.cards.forEach(function(card){
1621 maxHeight=
1622 Math.max(
1623 maxHeight,
1624 card
1625 .getBoundingClientRect()
1626 .height
1627 );
1628 });
1629
1630 maxHeight=
1631 Math.ceil(maxHeight);
1632
1633 group.cards.forEach(function(card){
1634 saveStyle(
1635 card,
1636 originalHeight,
1637 "min-height"
1638 );
1639
1640 card.style.setProperty(
1641 "min-height",
1642 maxHeight+"px"
1643 );
1644
1645 card.setAttribute(
1646 "data-sn-master-equal-height",
1647 "1"
1648 );
1649
1650 managedHeight.add(
1651 card
1652 );
1653 });
1654 });
1655 }
1656
1657 /* =======================================================
1658 DETAIL GRID EQUAL HEIGHT, DESKTOP ONLY
1659 ======================================================= */
1660
1661 function equaliseDetailGrids(){
1662 if(
1663 PAGE_KIND!=="detail"||
1664 window.innerWidth<=MOBILE_MAX
1665 ){
1666 return;
1667 }
1668
1669 var selectors=[
1670 ".arsn-grid",
1671 ".arsn-grid-2",
1672 ".arsn-grid-3",
1673 ".dmp-grid",
1674 ".ido-grid",
1675 ".pp-grid"
1676 ];
1677
1678 selectors.forEach(function(selector){
1679 Array.from(
1680 root.querySelectorAll(selector)
1681 ).forEach(function(grid){
1682 var children=
1683 Array.from(
1684 grid.children||[]
1685 ).filter(visible);
1686
1687 if(children.length<2){
1688 return;
1689 }
1690
1691 var groups=[];
1692
1693 children.forEach(function(child){
1694 var top=
1695 child
1696 .getBoundingClientRect()
1697 .top;
1698
1699 var group=null;
1700
1701 for(var i=0;i<groups.length;i++){
1702 if(
1703 Math.abs(
1704 groups[i].top-top
1705 )<=ROW_TOLERANCE
1706 ){
1707 group=groups[i];
1708 break;
1709 }
1710 }
1711
1712 if(!group){
1713 group={
1714 top:top,
1715 items:[]
1716 };
1717 groups.push(group);
1718 }
1719
1720 group.items.push(child);
1721 });
1722
1723 groups.forEach(function(group){
1724 if(group.items.length<2){
1725 return;
1726 }
1727
1728 var maxHeight=0;
1729
1730 group.items.forEach(function(item){
1731 maxHeight=
1732 Math.max(
1733 maxHeight,
1734 item
1735 .getBoundingClientRect()
1736 .height
1737 );
1738 });
1739
1740 maxHeight=
1741 Math.ceil(maxHeight);
1742
1743 group.items.forEach(function(item){
1744 saveStyle(
1745 item,
1746 originalHeight,
1747 "min-height"
1748 );
1749
1750 item.style.setProperty(
1751 "min-height",
1752 maxHeight+"px"
1753 );
1754
1755 item.setAttribute(
1756 "data-sn-master-equal-height",
1757 "1"
1758 );
1759
1760 managedHeight.add(item);
1761 });
1762 });
1763 });
1764 });
1765 }
1766
1767 /* =======================================================
1768 RUN / RESPONSIVE SCHEDULING
1769 ======================================================= */
1770
1771 function run(){
1772 if(running)return;
1773
1774 running=true;
1775
1776 try{
1777 resetRuntime();
1778 applyPlaceholderBadge();
1779 propagateDetailAccents();
1780
1781 var headers=
1782 applyOverviewPalette();
1783
1784 makeThreeLineAreaLabels();
1785 makeFilledRedOrangeCTAsBorderless();
1786
1787 if(
1788 window.innerWidth>
1789 MOBILE_MAX
1790 ){
1791 alignOverviewCards(
1792 headers
1793 );
1794
1795 equaliseDetailGrids();
1796 }
1797 }finally{
1798 running=false;
1799 }
1800 }
1801
1802 function onResize(){
1803 if(resizeTimer){
1804 clearTimeout(
1805 resizeTimer
1806 );
1807 }
1808
1809 resizeTimer=
1810 setTimeout(
1811 function(){
1812 resizeTimer=0;
1813 run();
1814 },
1815 RESIZE_DEBOUNCE
1816 );
1817 }
1818
1819 async function waitForReady(){
1820 if(
1821 document.readyState!=="complete"
1822 ){
1823 await new Promise(function(resolve){
1824 window.addEventListener(
1825 "load",
1826 resolve,
1827 {once:true}
1828 );
1829 });
1830 }
1831
1832 if(
1833 document.fonts&&
1834 document.fonts.ready
1835 ){
1836 try{
1837 await document.fonts.ready;
1838 }catch(error){}
1839 }
1840
1841 var images=
1842 Array.from(
1843 root.querySelectorAll("img")
1844 );
1845
1846 await Promise.all(
1847 images.map(function(img){
1848 if(img.complete){
1849 return Promise.resolve();
1850 }
1851
1852 return new Promise(function(resolve){
1853 var done=function(){
1854 resolve();
1855 };
1856
1857 img.addEventListener(
1858 "load",
1859 done,
1860 {once:true}
1861 );
1862
1863 img.addEventListener(
1864 "error",
1865 done,
1866 {once:true}
1867 );
1868 });
1869 })
1870 );
1871
1872 run();
1873 }
1874
1875 window.addEventListener(
1876 "resize",
1877 onResize,
1878 {passive:true}
1879 );
1880
1881 waitForReady();
1882 })();
1883 </script>
1884
1885 <!-- SN_SERVICE_NAVIGATOR_MASTER_STYLE_END -->
1886 {{/html}}