Skip to Content
Last modified by Veronika Kocher on Friday, 04 Sep 2026 14:45
From version 9.3
edited by Veronika Kocher
on Thursday, 03 Sep 2026 9:18
Change comment: There is no comment for this version
To version 9.5
edited by Veronika Kocher
on Thursday, 03 Sep 2026 10:09
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -425,22 +425,115 @@
425 425  </div>
426 426  {{/html}}
427 427  
428 -{{html clean="false"}}
428 +\n\n
429 +\n\n{{html clean="false"}}
429 429  <!-- SN_HORIZONTAL_BOX_HARMONIZER_START -->
430 -<style data-sn-horizontal-box-harmonizer="1">
431 -[data-sn-equal-height-managed="1"]{box-sizing:border-box}
432 -@media(max-width:767px){
433 - [data-sn-equal-height-managed="1"]{min-height:0!important}
431 +
432 +<style data-sn-horizontal-box-harmonizer="7">
433 +/* ---------- Typography: never justify headings ---------- */
434 +#xwikicontent h1,
435 +#xwikicontent h2,
436 +#xwikicontent h3,
437 +#xwikicontent h4,
438 +#xwikicontent h5,
439 +#xwikicontent h6,
440 +#xwikicontent .box-title,
441 +#xwikicontent [role="heading"],
442 +#xwikicontent h1 a,
443 +#xwikicontent h2 a,
444 +#xwikicontent h3 a,
445 +#xwikicontent h4 a,
446 +#xwikicontent h5 a,
447 +#xwikicontent h6 a,
448 +#xwikicontent .box-title a,
449 +#xwikicontent [role="heading"] a{
450 + text-align:left!important;
451 + text-justify:auto!important;
452 + word-spacing:normal!important;
434 434  }
454 +
455 +/* ---------- Native XWiki semantic callouts ---------- */
456 +#xwikicontent .box.infomessage,
457 +#xwikicontent .infomessage,
458 +#xwikicontent .box.warningmessage,
459 +#xwikicontent .warningmessage,
460 +#xwikicontent .box.successmessage,
461 +#xwikicontent .successmessage,
462 +#xwikicontent .box.errormessage,
463 +#xwikicontent .errormessage,
464 +#xwikicontent [data-sn-callout-harmonized="1"]{
465 + box-sizing:border-box!important;
466 + border-radius:8px!important;
467 + border-top:1px solid rgba(0,0,0,.08)!important;
468 + border-right:1px solid rgba(0,0,0,.08)!important;
469 + border-bottom:1px solid rgba(0,0,0,.08)!important;
470 + border-left:4px solid var(--sn-callout-accent,#21b6d7)!important;
471 + padding:14px 16px!important;
472 + text-align:left!important;
473 + text-justify:auto!important;
474 + word-spacing:normal!important;
475 + box-shadow:none!important;
476 +}
477 +
478 +#xwikicontent .box.infomessage,
479 +#xwikicontent .infomessage{
480 + --sn-callout-accent:#21b6d7;
481 + background:#eaf7fb!important;
482 +}
483 +
484 +#xwikicontent .box.warningmessage,
485 +#xwikicontent .warningmessage{
486 + --sn-callout-accent:#f0aa00;
487 + background:#fff8e7!important;
488 +}
489 +
490 +#xwikicontent .box.successmessage,
491 +#xwikicontent .successmessage{
492 + --sn-callout-accent:#38b76a;
493 + background:#edf9f1!important;
494 +}
495 +
496 +#xwikicontent .box.errormessage,
497 +#xwikicontent .errormessage{
498 + --sn-callout-accent:#e94b13;
499 + background:#fff1ec!important;
500 +}
501 +
502 +#xwikicontent [data-sn-callout-harmonized="1"] > :first-child,
503 +#xwikicontent .infomessage > :first-child,
504 +#xwikicontent .warningmessage > :first-child,
505 +#xwikicontent .successmessage > :first-child,
506 +#xwikicontent .errormessage > :first-child{
507 + margin-top:0!important;
508 +}
509 +
510 +#xwikicontent [data-sn-callout-harmonized="1"] > :last-child,
511 +#xwikicontent .infomessage > :last-child,
512 +#xwikicontent .warningmessage > :last-child,
513 +#xwikicontent .successmessage > :last-child,
514 +#xwikicontent .errormessage > :last-child{
515 + margin-bottom:0!important;
516 +}
517 +
518 +#xwikicontent [data-sn-equal-height-managed],
519 +#xwikicontent [data-sn-first-section-aligned],
520 +#xwikicontent [data-sn-first-content-aligned]{
521 + box-sizing:border-box;
522 +}
435 435  </style>
436 -<script data-sn-horizontal-box-harmonizer="1">
524 +
525 +<script data-sn-horizontal-box-harmonizer="7">
437 437  (function(){
438 438   "use strict";
439 439  
440 440   var MOBILE_MAX=767;
441 - var ROW_TOLERANCE=4;
530 + var ROW_TOLERANCE=6;
442 442   var MIN_W=150;
443 443   var MIN_H=36;
533 + var MAX_PARENT_CHILDREN=18;
534 + var SEARCH_DEPTH=5;
535 + var RESIZE_DEBOUNCE=220;
536 + var MIN_WIDTH_CHANGE=2;
444 444  
445 445   var root=
446 446   document.getElementById("xwikicontent")||
... ... @@ -450,72 +450,297 @@
450 450  
451 451   if(!root)return;
452 452  
453 - var managed=new Set();
454 - var raf=0;
546 + var heightManaged=new Set();
547 + var sectionManaged=new Set();
548 + var contentManaged=new Set();
455 455  
550 + var originalMinHeight=new WeakMap();
551 + var originalMarginTop=new WeakMap();
552 +
553 + var resizeTimer=0;
554 + var lastWidth=-1;
555 + var hasApplied=false;
556 + var applying=false;
557 +
456 456   function num(v){
457 457   var n=parseFloat(v);
458 458   return Number.isFinite(n)?n:0;
459 459   }
460 460  
461 - function visible(el){
563 + function visible(el,minW,minH){
462 462   if(!el||el.nodeType!==1)return false;
565 +
463 463   var s=getComputedStyle(el);
464 - if(s.display==="none"||s.visibility==="hidden"||Number(s.opacity)===0)return false;
567 +
568 + if(
569 + s.display==="none"||
570 + s.visibility==="hidden"||
571 + Number(s.opacity)===0
572 + ){
573 + return false;
574 + }
575 +
465 465   var r=el.getBoundingClientRect();
466 - return r.width>=MIN_W&&r.height>=MIN_H;
577 +
578 + return (
579 + r.width>=(minW||1)&&
580 + r.height>=(minH||1)
581 + );
467 467   }
468 468  
584 + function normalizeText(text){
585 + return String(text||"")
586 + .replace(/\s+/g," ")
587 + .trim()
588 + .toUpperCase();
589 + }
590 +
469 469   function excluded(el){
470 - return !el.matches||el.matches(
471 - "button,input,select,textarea,option,label,img,svg,canvas,table,thead,tbody,tfoot,tr,td,th,summary,script,style,noscript,template,.btn,.chip,[role=button]"
592 + return (
593 + !el.matches||
594 + el.matches(
595 + "button,input,select,textarea,option,label,img,svg,canvas,table,thead,tbody,tfoot,tr,td,th,summary,script,style,noscript,template,.btn,.chip,[role=button]"
596 + )
472 472   );
473 473   }
474 474  
600 + /* ---------- Custom coloured callouts ---------- */
601 +
602 + function nativeCallout(el){
603 + var c=
604 + typeof el.className==="string"
605 + ? el.className.toLowerCase()
606 + : "";
607 +
608 + return (
609 + /(^|\s)(infomessage|warningmessage|successmessage|errormessage)(\s|$)/.test(c)
610 + );
611 + }
612 +
613 + function customCallout(el){
614 + if(!visible(el,220,42)||excluded(el))return false;
615 +
616 + var r=el.getBoundingClientRect();
617 +
618 + if(r.height>520)return false;
619 +
620 + var s=getComputedStyle(el);
621 +
622 + var bg=
623 + s.backgroundColor&&
624 + s.backgroundColor!=="rgba(0, 0, 0, 0)"&&
625 + s.backgroundColor!=="transparent"&&
626 + s.backgroundColor!=="rgb(255, 255, 255)";
627 +
628 + var left=
629 + num(s.borderLeftWidth);
630 +
631 + return (
632 + bg&&
633 + left>=2
634 + );
635 + }
636 +
637 + function harmoniseCustomCallouts(){
638 + Array.from(
639 + root.querySelectorAll(
640 + "div,aside,section"
641 + )
642 + ).forEach(function(el){
643 + if(nativeCallout(el))return;
644 + if(!customCallout(el))return;
645 +
646 + var s=getComputedStyle(el);
647 +
648 + el.setAttribute(
649 + "data-sn-callout-harmonized",
650 + "1"
651 + );
652 +
653 + if(
654 + s.borderLeftColor
655 + ){
656 + el.style.setProperty(
657 + "--sn-callout-accent",
658 + s.borderLeftColor
659 + );
660 + }
661 + });
662 + }
663 +
664 + /* ---------- Restore only values V7 itself changed ---------- */
665 +
666 + function saveOriginal(el,map,property){
667 + if(map.has(el))return;
668 +
669 + map.set(el,{
670 + value:
671 + el.style.getPropertyValue(
672 + property
673 + ),
674 + priority:
675 + el.style.getPropertyPriority(
676 + property
677 + )
678 + });
679 + }
680 +
681 + function restoreOriginal(el,map,property){
682 + var original=map.get(el);
683 +
684 + if(original&&original.value){
685 + el.style.setProperty(
686 + property,
687 + original.value,
688 + original.priority||""
689 + );
690 + }else{
691 + el.style.removeProperty(
692 + property
693 + );
694 + }
695 + }
696 +
697 + function resetRuntime(){
698 + heightManaged.forEach(function(el){
699 + restoreOriginal(
700 + el,
701 + originalMinHeight,
702 + "min-height"
703 + );
704 +
705 + el.removeAttribute(
706 + "data-sn-equal-height-managed"
707 + );
708 + });
709 +
710 + sectionManaged.forEach(function(el){
711 + restoreOriginal(
712 + el,
713 + originalMarginTop,
714 + "margin-top"
715 + );
716 +
717 + el.removeAttribute(
718 + "data-sn-first-section-aligned"
719 + );
720 + });
721 +
722 + contentManaged.forEach(function(el){
723 + restoreOriginal(
724 + el,
725 + originalMarginTop,
726 + "margin-top"
727 + );
728 +
729 + el.removeAttribute(
730 + "data-sn-first-content-aligned"
731 + );
732 + });
733 +
734 + heightManaged.clear();
735 + sectionManaged.clear();
736 + contentManaged.clear();
737 + }
738 +
739 + /* ---------- Card detection ---------- */
740 +
475 475   function namedLikeBox(el){
476 - var c=typeof el.className==="string"?el.className:"";
742 + var c=
743 + typeof el.className==="string"
744 + ? el.className
745 + : "";
746 +
477 477   return /(^|[\s_-])(box|card|tile|panel|role|check|service|source|call|area|detail|resource|topic|warn|info)([\s_-]|$)/i.test(c);
478 478   }
479 479  
480 480   function boxLike(el){
481 - if(!visible(el)||excluded(el))return false;
751 + if(
752 + !visible(el,MIN_W,MIN_H)||
753 + excluded(el)
754 + ){
755 + return false;
756 + }
757 +
482 482   var s=getComputedStyle(el);
483 483   var r=el.getBoundingClientRect();
760 +
484 484   var border=
485 - num(s.borderTopWidth)+num(s.borderRightWidth)+
486 - num(s.borderBottomWidth)+num(s.borderLeftWidth);
762 + num(s.borderTopWidth)+
763 + num(s.borderRightWidth)+
764 + num(s.borderBottomWidth)+
765 + num(s.borderLeftWidth);
766 +
487 487   var radius=Math.max(
488 - num(s.borderTopLeftRadius),num(s.borderTopRightRadius),
489 - num(s.borderBottomLeftRadius),num(s.borderBottomRightRadius)
768 + num(s.borderTopLeftRadius),
769 + num(s.borderTopRightRadius),
770 + num(s.borderBottomLeftRadius),
771 + num(s.borderBottomRightRadius)
490 490   );
491 - var bg=s.backgroundColor&&s.backgroundColor!=="rgba(0, 0, 0, 0)"&&s.backgroundColor!=="transparent";
492 - var shadow=s.boxShadow&&s.boxShadow!=="none";
493 - return namedLikeBox(el)||border>=1||(bg&&radius>=3)||(shadow&&r.width>=180);
773 +
774 + var bg=
775 + s.backgroundColor&&
776 + s.backgroundColor!=="rgba(0, 0, 0, 0)"&&
777 + s.backgroundColor!=="transparent";
778 +
779 + var shadow=
780 + s.boxShadow&&
781 + s.boxShadow!=="none";
782 +
783 + return (
784 + namedLikeBox(el)||
785 + border>=1||
786 + (bg&&radius>=3)||
787 + (shadow&&r.width>=180)
788 + );
494 494   }
495 495  
496 496   function pickTarget(child){
497 - if(!visible(child))return null;
792 + if(!visible(child,MIN_W,MIN_H))return null;
793 +
498 498   if(boxLike(child))return child;
499 499  
500 500   var cr=child.getBoundingClientRect();
501 501   var q=[];
798 +
502 502   Array.from(child.children||[]).forEach(function(el){
503 503   q.push({el:el,depth:1});
504 504   });
505 505  
506 - var best=null,bestScore=-1;
803 + var best=null;
804 + var bestScore=-Infinity;
507 507  
508 508   while(q.length){
509 509   var item=q.shift();
510 510   var el=item.el;
511 - if(!visible(el))continue;
512 512  
810 + if(!visible(el,MIN_W,MIN_H))continue;
811 +
513 513   var r=el.getBoundingClientRect();
514 514  
515 - if(r.width>=cr.width*.72&&boxLike(el)){
516 - var widthFit=1-Math.min(1,Math.abs(cr.width-r.width)/Math.max(1,cr.width));
517 - var topFit=1-Math.min(1,Math.abs(cr.top-r.top)/80);
518 - var score=widthFit*5+topFit*2+Math.min(r.height,600)/600;
814 + if(
815 + r.width>=cr.width*.68&&
816 + boxLike(el)
817 + ){
818 + var widthFit=
819 + 1-Math.min(
820 + 1,
821 + Math.abs(cr.width-r.width)/
822 + Math.max(1,cr.width)
823 + );
824 +
825 + var topFit=
826 + 1-Math.min(
827 + 1,
828 + Math.abs(cr.top-r.top)/100
829 + );
830 +
831 + var score=
832 + widthFit*6+
833 + topFit*3+
834 + Math.min(r.height,900)/450+
835 + Math.min(r.width*r.height,900000)/900000;
836 +
519 519   if(score>bestScore){
520 520   best=el;
521 521   bestScore=score;
... ... @@ -522,9 +522,12 @@
522 522   }
523 523   }
524 524  
525 - if(item.depth<3){
843 + if(item.depth<SEARCH_DEPTH){
526 526   Array.from(el.children||[]).forEach(function(next){
527 - q.push({el:next,depth:item.depth+1});
845 + q.push({
846 + el:next,
847 + depth:item.depth+1
848 + });
528 528   });
529 529   }
530 530   }
... ... @@ -532,130 +532,692 @@
532 532   return best;
533 533   }
534 534  
535 - function reset(){
536 - managed.forEach(function(el){
537 - el.style.removeProperty("min-height");
538 - el.removeAttribute("data-sn-equal-height-managed");
539 - });
540 - managed.clear();
856 + function groupRows(entries){
857 + var groups=[];
858 +
859 + entries
860 + .slice()
861 + .sort(function(a,b){
862 + return (
863 + a.rect.top-b.rect.top||
864 + a.rect.left-b.rect.left
865 + );
866 + })
867 + .forEach(function(entry){
868 + var group=null;
869 +
870 + for(var i=0;i<groups.length;i++){
871 + if(
872 + Math.abs(
873 + groups[i].top-
874 + entry.rect.top
875 + )<=ROW_TOLERANCE
876 + ){
877 + group=groups[i];
878 + break;
879 + }
880 + }
881 +
882 + if(!group){
883 + group={
884 + top:entry.rect.top,
885 + entries:[]
886 + };
887 + groups.push(group);
888 + }
889 +
890 + group.entries.push(entry);
891 + });
892 +
893 + return groups;
541 541   }
542 542  
543 - function horizontalLayout(parent){
544 - if(!visible(parent))return false;
545 - var s=getComputedStyle(parent);
546 - if(s.display==="grid"||s.display==="inline-grid")return true;
547 - if(s.display==="flex"||s.display==="inline-flex"){
548 - return s.flexDirection==="row"||s.flexDirection==="row-reverse";
896 + function validRow(group){
897 + if(group.entries.length<2)return false;
898 +
899 + var lefts=
900 + group.entries
901 + .map(function(e){return e.rect.left;})
902 + .sort(function(a,b){return a-b;});
903 +
904 + if(
905 + lefts[lefts.length-1]-
906 + lefts[0]<
907 + 80
908 + ){
909 + return false;
549 549   }
550 - return false;
911 +
912 + var widths=
913 + group.entries
914 + .map(function(e){return e.rect.width;})
915 + .filter(function(w){return w>0;});
916 +
917 + if(widths.length<2)return false;
918 +
919 + var minW=
920 + Math.min.apply(Math,widths);
921 +
922 + var maxW=
923 + Math.max.apply(Math,widths);
924 +
925 + return (
926 + maxW/
927 + Math.max(1,minW)<=
928 + 1.9
929 + );
551 551   }
552 552  
553 - function rowGroups(entries){
554 - var groups=[];
555 - entries.slice().sort(function(a,b){
556 - return a.rect.top-b.rect.top||a.rect.left-b.rect.left;
557 - }).forEach(function(entry){
558 - var group=null;
559 - for(var i=0;i<groups.length;i++){
560 - if(Math.abs(groups[i].top-entry.rect.top)<=ROW_TOLERANCE){
561 - group=groups[i];
562 - break;
932 + /* ---------- Known ARSN first section bars ---------- */
933 +
934 + function knownBar(el){
935 + var text=
936 + normalizeText(
937 + el.textContent
938 + );
939 +
940 + return (
941 + text==="HIER STARTEN"||
942 + text==="ORGANISIEREN & DOKUMENTIEREN"||
943 + text==="ENTSCHEIDEN"||
944 + text==="START HERE"||
945 + text==="GET STARTED"||
946 + text==="ORGANISE & DOCUMENT"||
947 + text==="ORGANIZE & DOCUMENT"||
948 + text==="DECIDE"
949 + );
950 + }
951 +
952 + function findKnownBar(card){
953 + var cardRect=
954 + card.getBoundingClientRect();
955 +
956 + var rows=
957 + Array.from(
958 + card.querySelectorAll(
959 + "div,p,span,strong,h3,h4,h5,h6"
960 + )
961 + )
962 + .filter(function(el){
963 + if(!visible(el,20,6))return false;
964 + if(!knownBar(el))return false;
965 +
966 + var r=el.getBoundingClientRect();
967 +
968 + var rel=
969 + r.top-
970 + cardRect.top;
971 +
972 + return (
973 + rel>=35&&
974 + rel<=
975 + cardRect.height*.75
976 + );
977 + })
978 + .sort(function(a,b){
979 + return (
980 + a.getBoundingClientRect().top-
981 + b.getBoundingClientRect().top
982 + );
983 + });
984 +
985 + return rows[0]||null;
986 + }
987 +
988 + function alignKnownBars(cards){
989 + var rows=
990 + cards.map(function(card){
991 + var bar=
992 + findKnownBar(card);
993 +
994 + if(!bar)return null;
995 +
996 + var cr=
997 + card.getBoundingClientRect();
998 +
999 + var br=
1000 + bar.getBoundingClientRect();
1001 +
1002 + return {
1003 + bar:bar,
1004 + relativeTop:
1005 + br.top-
1006 + cr.top
1007 + };
1008 + });
1009 +
1010 + if(
1011 + rows.some(function(row){
1012 + return !row;
1013 + })
1014 + ){
1015 + return false;
1016 + }
1017 +
1018 + var target=
1019 + Math.max.apply(
1020 + Math,
1021 + rows.map(function(row){
1022 + return row.relativeTop;
1023 + })
1024 + );
1025 +
1026 + rows.forEach(function(row){
1027 + var delta=
1028 + target-
1029 + row.relativeTop;
1030 +
1031 + if(delta<=1)return;
1032 +
1033 + saveOriginal(
1034 + row.bar,
1035 + originalMarginTop,
1036 + "margin-top"
1037 + );
1038 +
1039 + var current=
1040 + num(
1041 + getComputedStyle(
1042 + row.bar
1043 + ).marginTop
1044 + );
1045 +
1046 + row.bar.style.setProperty(
1047 + "margin-top",
1048 + (
1049 + current+
1050 + delta
1051 + )+"px"
1052 + );
1053 +
1054 + row.bar.setAttribute(
1055 + "data-sn-first-section-aligned",
1056 + "7"
1057 + );
1058 +
1059 + sectionManaged.add(
1060 + row.bar
1061 + );
1062 + });
1063 +
1064 + return true;
1065 + }
1066 +
1067 + /* ---------- Generic first content after heading ---------- */
1068 +
1069 + function heading(card){
1070 + var cr=
1071 + card.getBoundingClientRect();
1072 +
1073 + var rows=
1074 + Array.from(
1075 + card.querySelectorAll(
1076 + "h1,h2,h3,h4,h5,h6,.box-title,[role=heading]"
1077 + )
1078 + )
1079 + .filter(function(el){
1080 + if(!visible(el,20,8))return false;
1081 +
1082 + var r=el.getBoundingClientRect();
1083 +
1084 + var rel=
1085 + r.top-
1086 + cr.top;
1087 +
1088 + return (
1089 + rel>=0&&
1090 + rel<=
1091 + Math.min(
1092 + 160,
1093 + cr.height*.45
1094 + )
1095 + );
1096 + })
1097 + .sort(function(a,b){
1098 + return (
1099 + a.getBoundingClientRect().top-
1100 + b.getBoundingClientRect().top
1101 + );
1102 + });
1103 +
1104 + return rows[0]||null;
1105 + }
1106 +
1107 + function firstContent(card,h){
1108 + if(!h)return null;
1109 +
1110 + var cr=
1111 + card.getBoundingClientRect();
1112 +
1113 + var hr=
1114 + h.getBoundingClientRect();
1115 +
1116 + var rows=
1117 + Array.from(
1118 + card.querySelectorAll(
1119 + "p,div,ul,ol,dl,blockquote"
1120 + )
1121 + )
1122 + .filter(function(el){
1123 + if(
1124 + el===h||
1125 + h.contains(el)||
1126 + el.contains(h)
1127 + ){
1128 + return false;
563 563   }
564 - }
565 - if(!group){
566 - group={top:entry.rect.top,entries:[]};
567 - groups.push(group);
568 - }
569 - group.entries.push(entry);
1130 +
1131 + if(!visible(el,30,8))return false;
1132 +
1133 + var text=
1134 + String(el.textContent||"")
1135 + .replace(/\s+/g," ")
1136 + .trim();
1137 +
1138 + if(text.length<3)return false;
1139 +
1140 + var r=el.getBoundingClientRect();
1141 +
1142 + if(
1143 + r.top<
1144 + hr.bottom-1
1145 + ){
1146 + return false;
1147 + }
1148 +
1149 + if(
1150 + r.top-cr.top>
1151 + Math.min(
1152 + 280,
1153 + cr.height*.65
1154 + )
1155 + ){
1156 + return false;
1157 + }
1158 +
1159 + if(
1160 + r.height>
1161 + cr.height*.58
1162 + ){
1163 + return false;
1164 + }
1165 +
1166 + return true;
1167 + })
1168 + .sort(function(a,b){
1169 + var ar=
1170 + a.getBoundingClientRect();
1171 +
1172 + var br=
1173 + b.getBoundingClientRect();
1174 +
1175 + return (
1176 + ar.top-br.top||
1177 + ar.height-br.height
1178 + );
1179 + });
1180 +
1181 + return rows[0]||null;
1182 + }
1183 +
1184 + function alignGeneric(cards){
1185 + var rows=
1186 + cards.map(function(card){
1187 + var h=
1188 + heading(card);
1189 +
1190 + var c=
1191 + firstContent(
1192 + card,
1193 + h
1194 + );
1195 +
1196 + if(!h||!c)return null;
1197 +
1198 + var cr=
1199 + card.getBoundingClientRect();
1200 +
1201 + var rr=
1202 + c.getBoundingClientRect();
1203 +
1204 + return {
1205 + content:c,
1206 + relativeTop:
1207 + rr.top-cr.top
1208 + };
1209 + });
1210 +
1211 + if(
1212 + rows.some(function(row){
1213 + return !row;
1214 + })
1215 + ){
1216 + return false;
1217 + }
1218 +
1219 + var target=
1220 + Math.max.apply(
1221 + Math,
1222 + rows.map(function(row){
1223 + return row.relativeTop;
1224 + })
1225 + );
1226 +
1227 + rows.forEach(function(row){
1228 + var delta=
1229 + target-
1230 + row.relativeTop;
1231 +
1232 + if(delta<=1)return;
1233 +
1234 + saveOriginal(
1235 + row.content,
1236 + originalMarginTop,
1237 + "margin-top"
1238 + );
1239 +
1240 + var current=
1241 + num(
1242 + getComputedStyle(
1243 + row.content
1244 + ).marginTop
1245 + );
1246 +
1247 + row.content.style.setProperty(
1248 + "margin-top",
1249 + (
1250 + current+
1251 + delta
1252 + )+"px"
1253 + );
1254 +
1255 + row.content.setAttribute(
1256 + "data-sn-first-content-aligned",
1257 + "7"
1258 + );
1259 +
1260 + contentManaged.add(
1261 + row.content
1262 + );
570 570   });
571 - return groups;
1264 +
1265 + return true;
572 572   }
573 573  
574 - function run(){
575 - reset();
1268 + function applyRow(group){
1269 + if(!validRow(group))return false;
576 576  
577 - if(window.innerWidth<=MOBILE_MAX)return;
1271 + var cards=[];
1272 + var seen=new Set();
578 578  
579 - var parents=Array.from(root.querySelectorAll("*")).filter(function(el){
580 - return el.children&&el.children.length>=2&&horizontalLayout(el);
1274 + group.entries.forEach(function(entry){
1275 + if(!seen.has(entry.target)){
1276 + seen.add(entry.target);
1277 + cards.push(entry.target);
1278 + }
581 581   });
582 582  
583 - parents.forEach(function(parent){
584 - var entries=[];
1281 + if(cards.length<2)return false;
585 585  
586 - Array.from(parent.children).forEach(function(child){
587 - if(!visible(child))return;
588 - var target=pickTarget(child);
589 - if(!target)return;
590 - entries.push({
591 - target:target,
592 - rect:target.getBoundingClientRect()
593 - });
594 - });
1283 + if(
1284 + !alignKnownBars(cards)
1285 + ){
1286 + alignGeneric(cards);
1287 + }
595 595  
596 - if(entries.length<2)return;
1289 + var maxHeight=0;
597 597  
598 - rowGroups(entries).forEach(function(group){
599 - if(group.entries.length<2)return;
1291 + cards.forEach(function(card){
1292 + maxHeight=
1293 + Math.max(
1294 + maxHeight,
1295 + card.getBoundingClientRect().height
1296 + );
1297 + });
600 600  
601 - var lefts=group.entries.map(function(e){return e.rect.left;}).sort(function(a,b){return a-b;});
602 - if(lefts[lefts.length-1]-lefts[0]<80)return;
1299 + maxHeight=
1300 + Math.ceil(
1301 + maxHeight
1302 + );
603 603  
604 - var targets=[];
605 - var seen=new Set();
1304 + if(maxHeight<MIN_H)return false;
606 606  
607 - group.entries.forEach(function(e){
608 - if(!seen.has(e.target)){
609 - seen.add(e.target);
610 - targets.push(e.target);
611 - }
1306 + cards.forEach(function(card){
1307 + saveOriginal(
1308 + card,
1309 + originalMinHeight,
1310 + "min-height"
1311 + );
1312 +
1313 + card.style.setProperty(
1314 + "min-height",
1315 + maxHeight+"px"
1316 + );
1317 +
1318 + card.setAttribute(
1319 + "data-sn-equal-height-managed",
1320 + "7"
1321 + );
1322 +
1323 + heightManaged.add(card);
1324 + });
1325 +
1326 + return true;
1327 + }
1328 +
1329 + function calculate(force){
1330 + if(applying)return;
1331 +
1332 + var width=
1333 + Math.round(
1334 + window.innerWidth
1335 + );
1336 +
1337 + var meaningful=
1338 + lastWidth<0||
1339 + Math.abs(
1340 + width-
1341 + lastWidth
1342 + )>=
1343 + MIN_WIDTH_CHANGE;
1344 +
1345 + if(
1346 + hasApplied&&
1347 + !force&&
1348 + !meaningful
1349 + ){
1350 + return;
1351 + }
1352 +
1353 + applying=true;
1354 +
1355 + try{
1356 + harmoniseCustomCallouts();
1357 +
1358 + if(width<=MOBILE_MAX){
1359 + if(hasApplied){
1360 + resetRuntime();
1361 + }
1362 +
1363 + hasApplied=false;
1364 + lastWidth=width;
1365 + return;
1366 + }
1367 +
1368 + if(hasApplied){
1369 + resetRuntime();
1370 + }
1371 +
1372 + var parents=
1373 + Array.from(
1374 + root.querySelectorAll("*")
1375 + )
1376 + .filter(function(parent){
1377 + return (
1378 + visible(
1379 + parent,
1380 + MIN_W,
1381 + MIN_H
1382 + )&&
1383 + parent.children&&
1384 + parent.children.length>=2&&
1385 + parent.children.length<=
1386 + MAX_PARENT_CHILDREN
1387 + );
612 612   });
613 613  
614 - if(targets.length<2)return;
1390 + var touched=
1391 + new Set();
615 615  
616 - var max=0;
617 - targets.forEach(function(el){
618 - max=Math.max(max,el.getBoundingClientRect().height);
1393 + parents.forEach(function(parent){
1394 + var entries=[];
1395 +
1396 + Array.from(
1397 + parent.children
1398 + ).forEach(function(child){
1399 + if(
1400 + !visible(
1401 + child,
1402 + MIN_W,
1403 + MIN_H
1404 + )
1405 + ){
1406 + return;
1407 + }
1408 +
1409 + var target=
1410 + pickTarget(child);
1411 +
1412 + if(!target)return;
1413 +
1414 + entries.push({
1415 + target:target,
1416 + rect:
1417 + target.getBoundingClientRect()
1418 + });
619 619   });
620 620  
621 - max=Math.ceil(max);
622 - if(max<MIN_H)return;
1421 + groupRows(
1422 + entries
1423 + ).forEach(function(group){
1424 + if(!validRow(group))return;
623 623  
624 - targets.forEach(function(el){
625 - el.style.setProperty("min-height",max+"px");
626 - el.setAttribute("data-sn-equal-height-managed","1");
627 - managed.add(el);
1426 + var targets=
1427 + group.entries.map(function(entry){
1428 + return entry.target;
1429 + });
1430 +
1431 + if(
1432 + !targets.some(function(el){
1433 + return !touched.has(el);
1434 + })
1435 + ){
1436 + return;
1437 + }
1438 +
1439 + if(applyRow(group)){
1440 + targets.forEach(function(el){
1441 + touched.add(el);
1442 + });
1443 + }
628 628   });
629 629   });
630 - });
1446 +
1447 + lastWidth=width;
1448 + hasApplied=true;
1449 + }finally{
1450 + applying=false;
1451 + }
631 631   }
632 632  
633 - function schedule(){
634 - if(raf)cancelAnimationFrame(raf);
635 - raf=requestAnimationFrame(function(){
636 - raf=requestAnimationFrame(function(){
637 - raf=0;
638 - run();
639 - });
640 - });
1454 + function resize(){
1455 + if(resizeTimer){
1456 + clearTimeout(
1457 + resizeTimer
1458 + );
1459 + }
1460 +
1461 + resizeTimer=
1462 + setTimeout(
1463 + function(){
1464 + resizeTimer=0;
1465 + calculate(false);
1466 + },
1467 + RESIZE_DEBOUNCE
1468 + );
641 641   }
642 642  
643 - addEventListener("resize",schedule,{passive:true});
644 - addEventListener("load",schedule,{once:true});
1471 + function waitImages(){
1472 + var images=
1473 + Array.from(
1474 + root.querySelectorAll("img")
1475 + );
645 645  
646 - root.addEventListener("click",function(){
647 - setTimeout(schedule,0);
648 - },true);
1477 + return Promise.all(
1478 + images.map(function(img){
1479 + if(img.complete){
1480 + return Promise.resolve();
1481 + }
649 649  
650 - if(document.fonts&&document.fonts.ready){
651 - document.fonts.ready.then(schedule);
1483 + return new Promise(function(resolve){
1484 + var done=function(){
1485 + resolve();
1486 + };
1487 +
1488 + img.addEventListener(
1489 + "load",
1490 + done,
1491 + {once:true}
1492 + );
1493 +
1494 + img.addEventListener(
1495 + "error",
1496 + done,
1497 + {once:true}
1498 + );
1499 + });
1500 + })
1501 + );
652 652   }
653 653  
654 - schedule();
655 - setTimeout(schedule,250);
656 - setTimeout(schedule,900);
1504 + async function initial(){
1505 + if(
1506 + document.readyState!==
1507 + "complete"
1508 + ){
1509 + await new Promise(function(resolve){
1510 + addEventListener(
1511 + "load",
1512 + resolve,
1513 + {once:true}
1514 + );
1515 + });
1516 + }
1517 +
1518 + if(
1519 + document.fonts&&
1520 + document.fonts.ready
1521 + ){
1522 + try{
1523 + await document.fonts.ready;
1524 + }catch(error){}
1525 + }
1526 +
1527 + await waitImages();
1528 +
1529 + // Exactly one initial layout calculation.
1530 + calculate(true);
1531 + }
1532 +
1533 + addEventListener(
1534 + "resize",
1535 + resize,
1536 + {passive:true}
1537 + );
1538 +
1539 + initial();
657 657  })();
658 658  </script>
659 -<!-- SN_HORIZONTAL_BOX_HARMONIZER_END -->
660 -{{/html}}
661 661  
1543 +<!-- SN_HORIZONTAL_BOX_HARMONIZER_END -->
1544 +{{/html}}\n