Änderungen von Dokument Art & Research Services Navigator
Zuletzt geändert von Veronika Kocher am Freitag, 18 Sep. 2026 16:47
Von Version 9.3
bearbeitet von Veronika Kocher
am Donnerstag, 03 Sep. 2026 9:34
am Donnerstag, 03 Sep. 2026 9:34
Änderungskommentar:
Es gibt keinen Kommentar für diese Version
Auf Version 11.3
bearbeitet von Veronika Kocher
am Freitag, 04 Sep. 2026 9:18
am Freitag, 04 Sep. 2026 9:18
Änderungskommentar:
Es gibt keinen Kommentar für diese Version
Zusammenfassung
-
Seiteneigenschaften (1 geändert, 0 hinzugefügt, 0 gelöscht)
Details
- Seiteneigenschaften
-
- Inhalt
-
... ... @@ -3,7 +3,6 @@ 3 3 Der **Service-Navigator Kunst & Forschung** hilft dir, für jede Phase deines Projekts die passende Orientierung, Services und Ressourcen zu finden. 4 4 5 5 {{info title="Unterstützung für dein Projekt:"}} 6 - 7 7 8 8 **Support Kunst und Forschung (SKF)** begleitet Projekt- und Fördervorhaben und arbeitet je nach Bedarf mit den passenden Services der Universität zusammen. 9 9 ... ... @@ -435,9 +435,9 @@ 435 435 ))) 436 436 ))) 437 437 438 -(% style="padding:0 16px 16px 16px;" %) 437 +(% class="arsn-phase-cta-wrap" style="padding:0 16px 16px 16px;" %) 439 439 ((( 440 -[[Zu Vorbereiten>>https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/||class="btn btn-primary btn-block"]] 439 +[[Zu Vorbereiten>>https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Enable/||class="btn btn-primary btn-block arsn-phase-cta"]] 441 441 ))) 442 442 ))) 443 443 ))) ... ... @@ -501,9 +501,9 @@ 501 501 ))) 502 502 ))) 503 503 504 -(% style="padding:0 16px 16px 16px;" %) 503 +(% class="arsn-phase-cta-wrap" style="padding:0 16px 16px 16px;" %) 505 505 ((( 506 -[[Zu Arbeiten & Verwalten>>https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Work%20%26%20Manage/||class="btn btn-primary btn-block"]] 505 +[[Zu Arbeiten & Verwalten>>https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Work%20%26%20Manage/||class="btn btn-primary btn-block arsn-phase-cta"]] 507 507 ))) 508 508 ))) 509 509 ))) ... ... @@ -577,9 +577,9 @@ 577 577 ))) 578 578 ))) 579 579 580 -(% style="padding:0 16px 16px 16px;" %) 579 +(% class="arsn-phase-cta-wrap" style="padding:0 16px 16px 16px;" %) 581 581 ((( 582 -[[Zu Publizieren & Teilen>>https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Publish%20%26%20Share/||class="btn btn-primary btn-block"]] 581 +[[Zu Publizieren & Teilen>>https://xwiki.uni-ak.ac.at/bin/view/Service%20Navigator/Art%20%26%20Research%20Services%20Navigator/Publish%20%26%20Share/||class="btn btn-primary btn-block arsn-phase-cta"]] 583 583 ))) 584 584 ))) 585 585 ))) ... ... @@ -636,23 +636,132 @@ 636 636 ))) 637 637 638 638 {{html clean="false"}} 639 -<!-- SN_HORIZONTAL_BOX_HARMONIZER_START --> 640 -<style data-sn-horizontal-box-harmonizer="4"> 641 -[data-sn-equal-height-managed], 642 -[data-sn-first-section-aligned]{ 638 +<!-- SN_SERVICE_NAVIGATOR_MASTER_STYLE_START --> 639 + 640 +<style data-sn-service-navigator-master="1"> 641 +/* ========================================================= 642 + MASTER TYPOGRAPHY 643 + ========================================================= */ 644 +#xwikicontent h1, 645 +#xwikicontent h2, 646 +#xwikicontent h3, 647 +#xwikicontent h4, 648 +#xwikicontent h5, 649 +#xwikicontent h6, 650 +#xwikicontent .box-title, 651 +#xwikicontent [role="heading"], 652 +#xwikicontent h1 a, 653 +#xwikicontent h2 a, 654 +#xwikicontent h3 a, 655 +#xwikicontent h4 a, 656 +#xwikicontent h5 a, 657 +#xwikicontent h6 a, 658 +#xwikicontent .box-title a, 659 +#xwikicontent [role="heading"] a{ 660 + text-align:left!important; 661 + text-justify:auto!important; 662 + word-spacing:normal!important; 663 +} 664 + 665 +/* ========================================================= 666 + COMING SOON / IN VORBEREITUNG 667 + ========================================================= */ 668 +.sn-coming-soon-badge{ 669 + display:inline-block; 670 + vertical-align:middle; 671 + margin-left:10px; 672 + padding:4px 8px; 673 + border-radius:14px; 674 + border:1px solid #efd9cc; 675 + background:#fff4ee; 676 + color:#8a4d36; 677 + font-size:11px; 678 + font-weight:700; 679 + letter-spacing:.055em; 680 + line-height:1.2; 681 + white-space:nowrap; 682 +} 683 + 684 +/* ========================================================= 685 + NATIVE / DETAIL CALLOUT GEOMETRY 686 + Preserve existing backgrounds. 687 + ========================================================= */ 688 +#xwikicontent .arsn-info, 689 +#xwikicontent .dmp-info, 690 +#xwikicontent .ido-info, 691 +#xwikicontent .pp-info, 692 +#xwikicontent .infomessage{ 693 + box-sizing:border-box!important; 694 + border-left:4px solid #21b6d7!important; 695 + border-radius:8px; 696 + text-align:left!important; 697 + word-spacing:normal!important; 698 +} 699 + 700 +#xwikicontent .arsn-warn, 701 +#xwikicontent .dmp-warn, 702 +#xwikicontent .ido-warn, 703 +#xwikicontent .pp-warn, 704 +#xwikicontent .warn, 705 +#xwikicontent .warning, 706 +#xwikicontent .warningmessage, 707 +#xwikicontent .errormessage{ 708 + box-sizing:border-box!important; 709 + border-left:4px solid #e94b13!important; 710 + border-radius:8px; 711 + text-align:left!important; 712 + word-spacing:normal!important; 713 +} 714 + 715 +[data-sn-master-equal-height], 716 +[data-sn-master-first-row]{ 643 643 box-sizing:border-box; 644 644 } 719 + 720 +/* ========================================================= 721 + FULL-WIDTH THREE-LINE NUMBER / TITLE / SUBTITLE BLOCKS 722 + ========================================================= */ 723 +#xwikicontent .arsn-area-label[data-sn-three-line="1"]{ 724 + display:grid!important; 725 + grid-template-columns:minmax(0,1fr)!important; 726 + grid-auto-rows:auto!important; 727 + width:100%!important; 728 + max-width:none!important; 729 + box-sizing:border-box!important; 730 + justify-items:start!important; 731 + align-items:start!important; 732 + gap:2px!important; 733 + text-align:left!important; 734 + text-align-last:left!important; 735 + text-justify:auto!important; 736 + word-spacing:normal!important; 737 + white-space:normal!important; 738 +} 739 +#xwikicontent .arsn-area-label[data-sn-three-line="1"] > .arsn-area-number, 740 +#xwikicontent .arsn-area-label[data-sn-three-line="1"] > .sn-area-label-title, 741 +#xwikicontent .arsn-area-label[data-sn-three-line="1"] > .arsn-area-action{ 742 + display:block!important; 743 + width:100%!important; 744 + margin:0!important; 745 + text-align:left!important; 746 + text-align-last:left!important; 747 + text-justify:auto!important; 748 + word-spacing:normal!important; 749 + white-space:normal!important; 750 +} 645 645 </style> 646 -<script data-sn-horizontal-box-harmonizer="4"> 752 + 753 +<script data-sn-service-navigator-master="1"> 647 647 (function(){ 648 648 "use strict"; 649 649 757 + var PAGE_KIND="overview"; 758 + var PLACEHOLDER=false; 759 + var PLACEHOLDER_LABEL="IN VORBEREITUNG"; 760 + 650 650 var MOBILE_MAX=767; 651 651 var ROW_TOLERANCE=6; 652 - var MIN_W=150; 653 - var MIN_H=36; 654 - var MAX_PARENT_CHILDREN=16; 655 - var SEARCH_DEPTH=5; 763 + var RESIZE_DEBOUNCE=220; 656 656 657 657 var root= 658 658 document.getElementById("xwikicontent")|| ... ... @@ -662,93 +662,105 @@ 662 662 663 663 if(!root)return; 664 664 665 - var heightManaged=new Set(); 666 - var sectionManaged=new Set(); 667 - var originalMinHeight=new WeakMap(); 668 - var originalMarginTop=new WeakMap(); 669 - var raf=0; 773 + var managedHeight=new Set(); 774 + var managedMargin=new Set(); 775 + var originalHeight=new WeakMap(); 776 + var originalMargin=new WeakMap(); 670 670 671 - function num(v){ 672 - var n=parseFloat(v); 673 - return Number.isFinite(n)?n:0; 674 - } 778 + var resizeTimer=0; 779 + var running=false; 675 675 676 - function visible(el,minW,minH){ 677 - if(!el||el.nodeType!==1)return false; 678 - 679 - var s=getComputedStyle(el); 680 - 681 - if( 682 - s.display==="none"|| 683 - s.visibility==="hidden"|| 684 - Number(s.opacity)===0 685 - ){ 686 - return false; 781 + var THEMES=[ 782 + { 783 + name:"BLUE", 784 + accent:"#21b6d7", 785 + bg:"#eaf7fb", 786 + text:"#315d68", 787 + labels:[ 788 + "HIER STARTEN", 789 + "ENTSCHEIDEN", 790 + "ÜBERPRÜFEN & ANPASSEN", 791 + "START HERE", 792 + "DECIDE", 793 + "REVIEW & ADAPT" 794 + ] 795 + }, 796 + { 797 + name:"RED", 798 + accent:"#e94b13", 799 + bg:"#fff1ec", 800 + text:"#8a4d36", 801 + labels:[ 802 + "PLANEN & ORGANISIEREN", 803 + "ORGANISIEREN & DOKUMENTIEREN", 804 + "PUBLIZIEREN & PRÄSENTIEREN", 805 + "PLAN & ORGANISE", 806 + "PLAN & ORGANIZE", 807 + "ORGANISE & DOCUMENT", 808 + "ORGANIZE & DOCUMENT", 809 + "PUBLISH & PRESENT" 810 + ] 811 + }, 812 + { 813 + name:"YELLOW", 814 + accent:"#f0aa00", 815 + bg:"#fff8e7", 816 + text:"#785b17", 817 + labels:[ 818 + "SCHÜTZEN & KLÄREN", 819 + "STANDARDISIEREN & IDENTIFIZIEREN", 820 + "ÖFFNEN, NACHNUTZEN & AUFFINDBAR MACHEN", 821 + "PROTECT & CLARIFY", 822 + "STANDARDISE & IDENTIFY", 823 + "STANDARDIZE & IDENTIFY", 824 + "OPEN, REUSE & MAKE FINDABLE" 825 + ] 826 + }, 827 + { 828 + name:"GREEN", 829 + accent:"#38b76a", 830 + bg:"#edf9f1", 831 + text:"#3f7451", 832 + labels:[ 833 + "INFRASTRUKTUR EINRICHTEN", 834 + "INFRASTRUKTUR & ZUSAMMENARBEIT EINRICHTEN", 835 + "SPEICHERN & ZUGRIFF STEUERN", 836 + "REPOSITORIUM, ERHALTEN & ÜBERGEBEN", 837 + "SET UP INFRASTRUCTURE", 838 + "SET UP INFRASTRUCTURE & COLLABORATION", 839 + "STORE & CONTROL ACCESS", 840 + "REPOSITORY, PRESERVE & HAND OVER" 841 + ] 687 687 } 843 + ]; 688 688 689 - var r=el.getBoundingClientRect(); 690 - 691 - return ( 692 - r.width>=(minW||1)&& 693 - r.height>=(minH||1) 694 - ); 845 + function num(value){ 846 + var n=parseFloat(value); 847 + return Number.isFinite(n)?n:0; 695 695 } 696 696 697 - function excluded(el){ 698 - return ( 699 - !el.matches|| 700 - el.matches( 701 - "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]" 702 - ) 703 - ); 850 + function norm(value){ 851 + return String(value||"") 852 + .replace(/\s+/g," ") 853 + .trim() 854 + .toUpperCase(); 704 704 } 705 705 706 - function namedLikeBox(el){ 707 - var c= 708 - typeof el.className==="string" 709 - ? el.className 710 - : ""; 857 + function visible(el){ 858 + if(!el||el.nodeType!==1)return false; 711 711 712 - r eturn/(^|[s_-])(box|card|tile|panel|role|check|service|source|call|area|detail|resource|topic|warn|info)([s_-]|$)/i.test(c);713 - }860 + var style=getComputedStyle(el); 861 + var rect=el.getBoundingClientRect(); 714 714 715 - function boxLike(el){ 716 - if(!visible(el,MIN_W,MIN_H)||excluded(el))return false; 717 - 718 - var s=getComputedStyle(el); 719 - var r=el.getBoundingClientRect(); 720 - 721 - var border= 722 - num(s.borderTopWidth)+ 723 - num(s.borderRightWidth)+ 724 - num(s.borderBottomWidth)+ 725 - num(s.borderLeftWidth); 726 - 727 - var radius=Math.max( 728 - num(s.borderTopLeftRadius), 729 - num(s.borderTopRightRadius), 730 - num(s.borderBottomLeftRadius), 731 - num(s.borderBottomRightRadius) 732 - ); 733 - 734 - var bg= 735 - s.backgroundColor&& 736 - s.backgroundColor!=="rgba(0, 0, 0, 0)"&& 737 - s.backgroundColor!=="transparent"; 738 - 739 - var shadow= 740 - s.boxShadow&& 741 - s.boxShadow!=="none"; 742 - 743 743 return ( 744 - namedLikeBox(el)||745 - b order>=1||746 - (bg&&radius>=3)||747 - (shadow&&r.width>=180)864 + style.display!=="none"&& 865 + style.visibility!=="hidden"&& 866 + rect.width>20&& 867 + rect.height>4 748 748 ); 749 749 } 750 750 751 - function save Original(el,map,property){871 + function saveStyle(el,map,property){ 752 752 if(map.has(el))return; 753 753 754 754 map.set(el,{ ... ... @@ -757,7 +757,7 @@ 757 757 }); 758 758 } 759 759 760 - function restore Original(el,map,property){880 + function restoreStyle(el,map,property){ 761 761 var original=map.get(el); 762 762 763 763 if(original&&original.value){ ... ... @@ -771,247 +771,470 @@ 771 771 } 772 772 } 773 773 774 - function reset(){ 775 - heightManaged.forEach(function(el){776 - restore Original(894 + function resetRuntime(){ 895 + managedHeight.forEach(function(el){ 896 + restoreStyle( 777 777 el, 778 - original MinHeight,898 + originalHeight, 779 779 "min-height" 780 780 ); 781 - 782 782 el.removeAttribute( 783 - "data-sn-equal-height -managed"902 + "data-sn-master-equal-height" 784 784 ); 785 785 }); 786 786 787 - sectionManaged.forEach(function(el){788 - restore Original(906 + managedMargin.forEach(function(el){ 907 + restoreStyle( 789 789 el, 790 - originalMargin Top,909 + originalMargin, 791 791 "margin-top" 792 792 ); 793 - 794 794 el.removeAttribute( 795 - "data-sn-first- section-aligned"913 + "data-sn-master-first-row" 796 796 ); 797 797 }); 798 798 799 - heightManaged.clear();800 - sectionManaged.clear();917 + managedHeight.clear(); 918 + managedMargin.clear(); 801 801 } 802 802 803 - function pickTarget(child){804 - if(!visible(child,MIN_W,MIN_H))return null;921 + function themeFor(text){ 922 + var value=norm(text); 805 805 806 - if(boxLike(child)){ 807 - return child; 924 + for(var i=0;i<THEMES.length;i++){ 925 + for(var j=0;j<THEMES[i].labels.length;j++){ 926 + var label=THEMES[i].labels[j]; 927 + 928 + if( 929 + value===label|| 930 + value.indexOf(label+" ")===0|| 931 + value.indexOf(label+" -")===0|| 932 + value.indexOf(label+" ·")===0 933 + ){ 934 + return THEMES[i]; 935 + } 936 + } 808 808 } 809 809 810 - varcr=child.getBoundingClientRect();811 - var q=[];939 + return null; 940 + } 812 812 813 - Array.from(child.children||[]).forEach(function(el){ 814 - q.push({el:el,depth:1}); 942 + /* ======================================================= 943 + BORDERLESS FILLED RED/ORANGE CTA BUTTONS 944 + ======================================================= */ 945 + 946 + function colourDistance(a,b){ 947 + return Math.sqrt( 948 + Math.pow(a[0]-b[0],2)+ 949 + Math.pow(a[1]-b[1],2)+ 950 + Math.pow(a[2]-b[2],2) 951 + ); 952 + } 953 + 954 + function makeFilledRedOrangeCTAsBorderless(){ 955 + var RED_ORANGE=[233,75,19]; 956 + 957 + Array.from( 958 + root.querySelectorAll( 959 + 'a,button,[role="button"],input[type="submit"],input[type="button"]' 960 + ) 961 + ).forEach(function(el){ 962 + if(!visible(el))return; 963 + 964 + var style=getComputedStyle(el); 965 + var rgb=parseRGB(style.backgroundColor); 966 + 967 + if(!rgb)return; 968 + 969 + if( 970 + colourDistance( 971 + rgb, 972 + RED_ORANGE 973 + )>55 974 + ){ 975 + return; 976 + } 977 + 978 + var rect=el.getBoundingClientRect(); 979 + 980 + if( 981 + rect.width<80|| 982 + rect.height<24 983 + ){ 984 + return; 985 + } 986 + 987 + el.style.setProperty( 988 + "border", 989 + "none", 990 + "important" 991 + ); 992 + 993 + el.style.setProperty( 994 + "border-left", 995 + "none", 996 + "important" 997 + ); 998 + 999 + el.style.setProperty( 1000 + "border-top", 1001 + "none", 1002 + "important" 1003 + ); 1004 + 1005 + el.style.setProperty( 1006 + "border-right", 1007 + "none", 1008 + "important" 1009 + ); 1010 + 1011 + el.style.setProperty( 1012 + "border-bottom", 1013 + "none", 1014 + "important" 1015 + ); 1016 + 1017 + el.style.setProperty( 1018 + "box-shadow", 1019 + "none", 1020 + "important" 1021 + ); 815 815 }); 1023 + } 816 816 817 - var best=null; 818 - var bestScore=-Infinity; 1025 + /* ======================================================= 1026 + FULL-WIDTH THREE-LINE AREA LABELS 1027 + ======================================================= */ 819 819 820 - while(q.length){ 821 - var item=q.shift(); 822 - var el=item.el; 1029 + function compactText(value){ 1030 + return String(value||"") 1031 + .replace(/\s+/g," ") 1032 + .trim(); 1033 + } 823 823 824 - if(!visible(el,MIN_W,MIN_H))continue; 1035 + function makeThreeLineAreaLabels(){ 1036 + Array.from( 1037 + root.querySelectorAll( 1038 + ".arsn-area-label" 1039 + ) 1040 + ).forEach(function(label){ 1041 + if( 1042 + label.getAttribute( 1043 + "data-sn-three-line" 1044 + )==="1" 1045 + ){ 1046 + return; 1047 + } 825 825 826 - var r=el.getBoundingClientRect(); 1049 + var number= 1050 + label.querySelector( 1051 + ":scope > .arsn-area-number" 1052 + ); 827 827 1054 + var action= 1055 + label.querySelector( 1056 + ":scope > .arsn-area-action" 1057 + ); 1058 + 828 828 if( 829 - r .width>=cr.width*.68&&830 - boxLike(el)1060 + !number|| 1061 + !action 831 831 ){ 832 - var widthFit= 833 - 1-Math.min( 834 - 1, 835 - Math.abs(cr.width-r.width)/ 836 - Math.max(1,cr.width) 837 - ); 1063 + return; 1064 + } 838 838 839 - var topFit= 840 - 1-Math.min( 841 - 1, 842 - Math.abs(cr.top-r.top)/100 843 - ); 1066 + var clone= 1067 + label.cloneNode(true); 844 844 845 - var score= 846 - widthFit*6+ 847 - topFit*3+ 848 - Math.min(r.height,900)/450+ 849 - Math.min(r.width*r.height,900000)/900000; 1069 + var cloneNumber= 1070 + clone.querySelector( 1071 + ":scope > .arsn-area-number" 1072 + ); 850 850 851 - if(score>bestScore){ 852 - best=el; 853 - bestScore=score; 854 - } 1074 + var cloneAction= 1075 + clone.querySelector( 1076 + ":scope > .arsn-area-action" 1077 + ); 1078 + 1079 + if(cloneNumber){ 1080 + cloneNumber.remove(); 855 855 } 856 856 857 - if(item.depth<SEARCH_DEPTH){ 858 - Array.from(el.children||[]).forEach(function(next){ 859 - q.push({ 860 - el:next, 861 - depth:item.depth+1 862 - }); 863 - }); 1083 + if(cloneAction){ 1084 + cloneAction.remove(); 864 864 } 865 - } 866 866 867 - return best; 868 - } 1087 + var titleText= 1088 + compactText( 1089 + clone.textContent 1090 + ); 869 869 870 - function groupsByVisualRow(entries){ 871 - var groups=[]; 1092 + if(!titleText){ 1093 + return; 1094 + } 872 872 873 - entries 874 - .slice() 875 - .sort(function(a,b){ 876 - return ( 877 - a.rect.top-b.rect.top|| 878 - a.rect.left-b.rect.left 1096 + var numberNode= 1097 + number.cloneNode(true); 1098 + 1099 + var actionNode= 1100 + action.cloneNode(true); 1101 + 1102 + var titleNode= 1103 + document.createElement( 1104 + "span" 879 879 ); 880 - }) 881 - .forEach(function(entry){ 882 - var group=null; 883 883 884 - for(var i=0;i<groups.length;i++){ 885 - if( 886 - Math.abs( 887 - groups[i].top- 888 - entry.rect.top 889 - )<=ROW_TOLERANCE 890 - ){ 891 - group=groups[i]; 892 - break; 893 - } 894 - } 1107 + titleNode.className= 1108 + "sn-area-label-title"; 895 895 896 - if(!group){ 897 - group={ 898 - top:entry.rect.top, 899 - entries:[] 900 - }; 901 - groups.push(group); 902 - } 1110 + titleNode.textContent= 1111 + titleText; 903 903 904 - group.entries.push(entry); 905 - }); 1113 + while(label.firstChild){ 1114 + label.removeChild( 1115 + label.firstChild 1116 + ); 1117 + } 906 906 907 - return groups; 1119 + label.appendChild( 1120 + numberNode 1121 + ); 1122 + 1123 + label.appendChild( 1124 + titleNode 1125 + ); 1126 + 1127 + label.appendChild( 1128 + actionNode 1129 + ); 1130 + 1131 + label.setAttribute( 1132 + "data-sn-three-line", 1133 + "1" 1134 + ); 1135 + 1136 + var head= 1137 + label.closest( 1138 + ".arsn-area-head" 1139 + ); 1140 + 1141 + if(head){ 1142 + head.style.setProperty( 1143 + "width", 1144 + "100%", 1145 + "important" 1146 + ); 1147 + 1148 + head.style.setProperty( 1149 + "max-width", 1150 + "100%", 1151 + "important" 1152 + ); 1153 + 1154 + head.style.setProperty( 1155 + "box-sizing", 1156 + "border-box", 1157 + "important" 1158 + ); 1159 + } 1160 + }); 908 908 } 909 909 910 - function validHorizontalGroup(group){ 911 - if(group.entries.length<2)return false; 1163 + /* ======================================================= 1164 + PLACEHOLDER BADGE 1165 + ======================================================= */ 912 912 913 - var lefts= 914 - group.entries 915 - .map(function(e){return e.rect.left;}) 916 - .sort(function(a,b){return a-b;}); 1167 + function applyPlaceholderBadge(){ 1168 + if(!PLACEHOLDER)return; 917 917 918 918 if( 919 - lefts[lefts.length-1]-920 - lefts[0]<921 - 801171 + document.querySelector( 1172 + ".sn-coming-soon-badge" 1173 + ) 922 922 ){ 923 - return false;1175 + return; 924 924 } 925 925 926 - var widths= 927 - group.entries 928 - .map(function(e){return e.rect.width;}) 929 - .filter(function(w){return w>0;}); 1178 + var title= 1179 + document.querySelector( 1180 + "#document-title" 1181 + )|| 1182 + document.querySelector( 1183 + "h1" 1184 + ); 930 930 931 - if( widths.length<2)returnfalse;1186 + if(!title)return; 932 932 933 - var minWidth=Math.min.apply(Math,widths); 934 - var maxWidth=Math.max.apply(Math,widths); 1188 + var badge= 1189 + document.createElement( 1190 + "span" 1191 + ); 935 935 936 - return ( 937 - maxWidth/ 938 - Math.max(1,minWidth)<= 939 - 1.9 1193 + badge.className= 1194 + "sn-coming-soon-badge"; 1195 + 1196 + badge.textContent= 1197 + PLACEHOLDER_LABEL; 1198 + 1199 + badge.setAttribute( 1200 + "aria-label", 1201 + PLACEHOLDER_LABEL 940 940 ); 941 - } 942 942 943 - function normalizeText(text){ 944 - return String(text||"") 945 - .replace(/s+/g," ") 946 - .trim() 947 - .toUpperCase(); 1204 + title.appendChild( 1205 + badge 1206 + ); 948 948 } 949 949 950 - function exactKnownFirstSection(el){ 951 - var text=normalizeText(el.textContent); 1209 + /* ======================================================= 1210 + DETAIL PAGE OWN-ACCENT PROPAGATION 1211 + ======================================================= */ 952 952 953 - return ( 954 - text==="HIER STARTEN"|| 955 - text==="ORGANISIEREN & DOKUMENTIEREN"|| 956 - text==="ENTSCHEIDEN"|| 957 - text==="START HERE"|| 958 - text==="GET STARTED"|| 959 - text==="ORGANISE & DOCUMENT"|| 960 - text==="ORGANIZE & DOCUMENT"|| 961 - text==="DECIDE" 1213 + function parseRGB(value){ 1214 + var match=String(value||"").match( 1215 + /rgba?\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)/i 962 962 ); 1217 + 1218 + if(!match)return null; 1219 + 1220 + return [ 1221 + Number(match[1]), 1222 + Number(match[2]), 1223 + Number(match[3]) 1224 + ]; 963 963 } 964 964 965 - function visuallyFirstSectionBar(card){ 966 - var cardRect=card.getBoundingClientRect(); 967 - var candidates=[]; 1227 + function distance(a,b){ 1228 + return Math.sqrt( 1229 + Math.pow(a[0]-b[0],2)+ 1230 + Math.pow(a[1]-b[1],2)+ 1231 + Math.pow(a[2]-b[2],2) 1232 + ); 1233 + } 968 968 1235 + function paletteMatch(cssColor){ 1236 + var rgb=parseRGB(cssColor); 1237 + 1238 + if(!rgb)return null; 1239 + 1240 + var palette=[ 1241 + {hex:"#21b6d7",rgb:[33,182,215]}, 1242 + {hex:"#e94b13",rgb:[233,75,19]}, 1243 + {hex:"#f0aa00",rgb:[240,170,0]}, 1244 + {hex:"#38b76a",rgb:[56,183,106]} 1245 + ]; 1246 + 1247 + var best=null; 1248 + var bestDistance=Infinity; 1249 + 1250 + palette.forEach(function(item){ 1251 + var d=distance(rgb,item.rgb); 1252 + 1253 + if(d<bestDistance){ 1254 + best=item; 1255 + bestDistance=d; 1256 + } 1257 + }); 1258 + 1259 + return bestDistance<=30 1260 + ?best 1261 + :null; 1262 + } 1263 + 1264 + function propagateDetailAccents(){ 1265 + if(PAGE_KIND!=="detail")return; 1266 + 969 969 Array.from( 970 - card.querySelectorAll( 971 - "div,p,span,strong,h3,h4,h5,h6" 1268 + root.querySelectorAll( 1269 + ".arsn-call,.dmp-call,.ido-call,.pp-call,"+ 1270 + ".arsn-source,.dmp-source,.ido-source,.pp-source" 972 972 ) 973 973 ).forEach(function(el){ 974 - if(!visible(el,20,6))return; 975 - if(excluded(el))return; 1273 + if(!visible(el))return; 976 976 977 - var r=el.getBoundingClientRect(); 978 - var relativeTop=r.top-cardRect.top; 1275 + var style=getComputedStyle(el); 979 979 980 980 if( 981 - relativeTop<45|| 982 - relativeTop>cardRect.height*.72 1278 + num(style.borderTopWidth)>=2 983 983 ){ 984 - return; 1280 + var match= 1281 + paletteMatch( 1282 + style.borderTopColor 1283 + ); 1284 + 1285 + if(match){ 1286 + el.style.setProperty( 1287 + "border-left", 1288 + "4px solid "+match.hex, 1289 + "important" 1290 + ); 1291 + } 985 985 } 1293 + }); 986 986 987 - var widthRatio= 988 - r.width/ 989 - Math.max(1,cardRect.width); 1295 + // Warning families: explicit safety override. 1296 + Array.from( 1297 + root.querySelectorAll( 1298 + ".arsn-warn,.dmp-warn,.ido-warn,.pp-warn,"+ 1299 + ".warn,.warning,.warningmessage,.errormessage" 1300 + ) 1301 + ).forEach(function(el){ 1302 + if(!visible(el))return; 990 990 991 - if( 992 - widthRatio<.55|| 993 - widthRatio>1.05|| 994 - r.height>54 995 - ){ 996 - return; 997 - } 1304 + el.style.setProperty( 1305 + "border-left", 1306 + "4px solid #e94b13", 1307 + "important" 1308 + ); 1309 + }); 998 998 999 - var text=normalizeText(el.textContent); 1311 + // Info families: explicit orientation override. 1312 + Array.from( 1313 + root.querySelectorAll( 1314 + ".arsn-info,.dmp-info,.ido-info,.pp-info,.infomessage" 1315 + ) 1316 + ).forEach(function(el){ 1317 + if(!visible(el))return; 1000 1000 1001 - if( 1002 - text.length<2|| 1003 - text.length>90 1004 - ){ 1005 - return; 1006 - } 1319 + el.style.setProperty( 1320 + "border-left", 1321 + "4px solid #21b6d7", 1322 + "important" 1323 + ); 1324 + }); 1325 + } 1007 1007 1008 - var style=getComputedStyle(el); 1327 + /* ======================================================= 1328 + OVERVIEW SEMANTIC THEME PALETTE 1329 + ======================================================= */ 1009 1009 1010 - var bg= 1011 - style.backgroundColor&& 1012 - style.backgroundColor!=="rgba(0, 0, 0, 0)"&& 1013 - style.backgroundColor!=="transparent"; 1331 + function smallestThemeHeaders(){ 1332 + return Array.from( 1333 + root.querySelectorAll( 1334 + "div,span,p,strong,h3,h4,h5,h6" 1335 + ) 1336 + ).filter(function(el){ 1337 + if(!visible(el))return false; 1338 + if(!themeFor(el.textContent))return false; 1014 1014 1340 + return !Array.from( 1341 + el.children||[] 1342 + ).some(function(child){ 1343 + return !!themeFor( 1344 + child.textContent 1345 + ); 1346 + }); 1347 + }); 1348 + } 1349 + 1350 + function findOverviewCard(header){ 1351 + var node=header.parentElement; 1352 + var candidates=[]; 1353 + 1354 + while(node&&node!==root){ 1355 + var rect=node.getBoundingClientRect(); 1356 + var style=getComputedStyle(node); 1357 + 1015 1015 var border= 1016 1016 num(style.borderTopWidth)+ 1017 1017 num(style.borderRightWidth)+ ... ... @@ -1018,315 +1018,755 @@ 1018 1018 num(style.borderBottomWidth)+ 1019 1019 num(style.borderLeftWidth); 1020 1020 1021 - var mostlyUpper= 1022 - text.length>=3&& 1023 - text===text.toUpperCase(); 1024 - 1025 - var exact=exactKnownFirstSection(el); 1026 - 1027 - var score= 1028 - (exact?20:0)+ 1029 - (bg?6:0)+ 1030 - (border>=1?2:0)+ 1031 - (mostlyUpper?4:0)+ 1032 - (num(style.fontWeight)>=600?1:0); 1033 - 1034 - if(score>=7){ 1035 - candidates.push({ 1036 - el:el, 1037 - relativeTop:relativeTop, 1038 - width:r.width, 1039 - score:score 1040 - }); 1364 + if( 1365 + rect.width>=220&& 1366 + rect.width<=800&& 1367 + rect.height>=120&& 1368 + border>=1 1369 + ){ 1370 + candidates.push(node); 1041 1041 } 1042 - }); 1043 1043 1373 + node=node.parentElement; 1374 + } 1375 + 1044 1044 if(!candidates.length)return null; 1045 1045 1046 1046 candidates.sort(function(a,b){ 1047 - if(a.score!==b.score)return b.score-a.score; 1048 - if(Math.abs(a.relativeTop-b.relativeTop)>3){ 1049 - return a.relativeTop-b.relativeTop; 1050 - } 1051 - return b.width-a.width; 1379 + return ( 1380 + b.getBoundingClientRect().height- 1381 + a.getBoundingClientRect().height 1382 + ); 1052 1052 }); 1053 1053 1054 - // For exact known labels always prefer the earliest exact match. 1055 - var exacts=candidates.filter(function(c){ 1056 - return exactKnownFirstSection(c.el); 1057 - }); 1385 + return candidates[0]; 1386 + } 1058 1058 1059 - if(exacts.length){ 1060 - exacts.sort(function(a,b){ 1061 - return a.relativeTop-b.relativeTop||b.width-a.width; 1062 - }); 1063 - return exacts[0].el; 1064 - } 1388 + function rowCandidates(link,card){ 1389 + var result=[]; 1390 + var cardRect= 1391 + card.getBoundingClientRect(); 1065 1065 1066 - // Generic fallback: earliest high-confidence bar. 1067 - candidates.sort(function(a,b){ 1068 - return a.relativeTop-b.relativeTop||b.score-a.score||b.width-a.width; 1069 - }); 1393 + var node=link; 1070 1070 1071 - return candidates[0].el; 1072 - } 1395 + while(node&&node!==card){ 1396 + if(visible(node)){ 1397 + var rect= 1398 + node.getBoundingClientRect(); 1073 1073 1074 - function alignFirstSections(cards){ 1075 - var rows= 1076 - cards.map(function(card){ 1077 - var bar= 1078 - visuallyFirstSectionBar(card); 1400 + if( 1401 + rect.height<=105&& 1402 + rect.width>= 1403 + cardRect.width*.50&& 1404 + rect.width<= 1405 + cardRect.width*1.03 1406 + ){ 1407 + result.push(node); 1408 + } 1409 + } 1079 1079 1080 - if(!bar)return null; 1411 + node=node.parentElement; 1412 + } 1081 1081 1082 - varcardRect=1083 - card.getBoundingClientRect();1414 + return result; 1415 + } 1084 1084 1085 - var barRect= 1086 - bar.getBoundingClientRect(); 1417 + function chooseOuterRow( 1418 + candidates, 1419 + link 1420 + ){ 1421 + if(!candidates.length){ 1422 + return link; 1423 + } 1087 1087 1088 - return {1089 - card:card,1090 - bar:bar,1091 - relativeTop:1092 - barRect.top-cardRect.top,1093 - label:1094 - normalizeText(bar.textContent)1095 - };1425 + var bordered= 1426 + candidates.filter(function(el){ 1427 + return ( 1428 + num( 1429 + getComputedStyle(el) 1430 + .borderLeftWidth 1431 + )>=1 1432 + ); 1096 1096 }); 1097 1097 1098 - // Conservative: only align when every card in the horizontal row 1099 - // has a reliable first section bar. 1100 - if( 1101 - rows.some(function(row){ 1102 - return !row; 1103 - }) 1104 - ){ 1105 - return null; 1435 + var pool= 1436 + bordered.length 1437 + ?bordered 1438 + :candidates; 1439 + 1440 + pool.sort(function(a,b){ 1441 + var ar= 1442 + a.getBoundingClientRect(); 1443 + 1444 + var br= 1445 + b.getBoundingClientRect(); 1446 + 1447 + return ( 1448 + ar.left-br.left|| 1449 + br.width-ar.width 1450 + ); 1451 + }); 1452 + 1453 + return pool[0]||link; 1454 + } 1455 + 1456 + function applyOverviewPalette(){ 1457 + if(PAGE_KIND!=="overview"){ 1458 + return []; 1106 1106 } 1107 1107 1108 - var targetTop= 1109 - Math.max.apply( 1110 - Math, 1111 - rows.map(function(row){ 1112 - return row.relativeTop; 1461 + var headers= 1462 + smallestThemeHeaders() 1463 + .map(function(el){ 1464 + return { 1465 + el:el, 1466 + theme: 1467 + themeFor( 1468 + el.textContent 1469 + ), 1470 + card: 1471 + findOverviewCard( 1472 + el 1473 + ) 1474 + }; 1113 1113 }) 1114 - ); 1476 + .filter(function(row){ 1477 + return !!row.card; 1478 + }); 1115 1115 1116 - rows.forEach(function(row){ 1117 - var delta= 1118 - targetTop- 1119 - row.relativeTop; 1480 + var unique=[]; 1481 + var seenHeaders=new Set(); 1120 1120 1121 - if(delta<=1)return; 1483 + headers.forEach(function(row){ 1484 + var key= 1485 + row.theme.name+ 1486 + "|"+ 1487 + Math.round( 1488 + row.card 1489 + .getBoundingClientRect() 1490 + .left 1491 + )+ 1492 + "|"+ 1493 + Math.round( 1494 + row.el 1495 + .getBoundingClientRect() 1496 + .top 1497 + ); 1122 1122 1123 - saveOriginal( 1124 - row.bar, 1125 - originalMarginTop, 1126 - "margin-top" 1499 + if(!seenHeaders.has(key)){ 1500 + seenHeaders.add(key); 1501 + unique.push(row); 1502 + } 1503 + }); 1504 + 1505 + unique.forEach(function(row){ 1506 + var headerRect= 1507 + row.el 1508 + .getBoundingClientRect(); 1509 + 1510 + row.el.style.setProperty( 1511 + "background", 1512 + row.theme.bg, 1513 + "important" 1127 1127 ); 1128 1128 1129 - var currentMargin= 1130 - num( 1131 - getComputedStyle( 1132 - row.bar 1133 - ).marginTop 1134 - ); 1516 + row.el.style.setProperty( 1517 + "color", 1518 + row.theme.text, 1519 + "important" 1520 + ); 1135 1135 1136 - row.bar.style.setProperty( 1137 - "margin-top", 1138 - ( 1139 - currentMargin+ 1140 - delta 1141 - )+"px" 1522 + row.el.style.setProperty( 1523 + "text-align", 1524 + "left", 1525 + "important" 1142 1142 ); 1143 1143 1144 - row.bar.setAttribute( 1145 - "data-sn-first-section-aligned", 1146 - "4" 1528 + row.el.style.setProperty( 1529 + "word-spacing", 1530 + "normal", 1531 + "important" 1147 1147 ); 1148 1148 1149 - sectionManaged.add(row.bar); 1534 + var later= 1535 + unique 1536 + .filter(function(other){ 1537 + return ( 1538 + other.card===row.card&& 1539 + other.el 1540 + .getBoundingClientRect() 1541 + .top> 1542 + headerRect.top+2 1543 + ); 1544 + }) 1545 + .sort(function(a,b){ 1546 + return ( 1547 + a.el 1548 + .getBoundingClientRect() 1549 + .top- 1550 + b.el 1551 + .getBoundingClientRect() 1552 + .top 1553 + ); 1554 + }); 1555 + 1556 + var stopTop= 1557 + later.length 1558 + ?later[0].el 1559 + .getBoundingClientRect() 1560 + .top 1561 + :Infinity; 1562 + 1563 + Array.from( 1564 + row.card.querySelectorAll("a") 1565 + ).forEach(function(link){ 1566 + if( 1567 + link.classList && 1568 + link.classList.contains( 1569 + "arsn-phase-cta" 1570 + ) 1571 + ){ 1572 + return; 1573 + } 1574 + 1575 + if(!visible(link))return; 1576 + 1577 + var rect= 1578 + link.getBoundingClientRect(); 1579 + 1580 + if( 1581 + rect.top<= 1582 + headerRect.bottom-2|| 1583 + rect.top>= 1584 + stopTop-2 1585 + ){ 1586 + return; 1587 + } 1588 + 1589 + var candidates= 1590 + rowCandidates( 1591 + link, 1592 + row.card 1593 + ); 1594 + 1595 + var target= 1596 + chooseOuterRow( 1597 + candidates, 1598 + link 1599 + ); 1600 + 1601 + candidates.forEach(function(el){ 1602 + el.style.setProperty( 1603 + "border-left", 1604 + "0 solid transparent", 1605 + "important" 1606 + ); 1607 + }); 1608 + 1609 + target.style.setProperty( 1610 + "border-left", 1611 + "3px solid "+ 1612 + row.theme.accent, 1613 + "important" 1614 + ); 1615 + 1616 + target.style.setProperty( 1617 + "box-sizing", 1618 + "border-box", 1619 + "important" 1620 + ); 1621 + }); 1150 1150 }); 1151 1151 1152 - return { 1153 - labels: 1154 - rows.map(function(row){ 1155 - return row.label; 1156 - }), 1157 - targetRelativeTop: 1158 - Math.round(targetTop) 1159 - }; 1624 + return unique; 1160 1160 } 1161 1161 1162 - function applyGroup(group){ 1163 - if(!validHorizontalGroup(group)){ 1164 - return null; 1627 + /* ======================================================= 1628 + OVERVIEW CARD HEIGHT + FIRST THEMATIC ROW 1629 + ======================================================= */ 1630 + 1631 + function alignOverviewCards(headers){ 1632 + if( 1633 + PAGE_KIND!=="overview"|| 1634 + window.innerWidth<=MOBILE_MAX 1635 + ){ 1636 + return; 1165 1165 } 1166 1166 1167 1167 var cards=[]; 1168 1168 var seen=new Set(); 1169 1169 1170 - group.entries.forEach(function(entry){1171 - if(!seen.has( entry.target)){1172 - seen.add( entry.target);1173 - cards.push( entry.target);1642 + headers.forEach(function(row){ 1643 + if(!seen.has(row.card)){ 1644 + seen.add(row.card); 1645 + cards.push(row.card); 1174 1174 } 1175 1175 }); 1176 1176 1177 - if(cards.length<2)return null; 1649 + if(cards.length<2){ 1650 + return; 1651 + } 1178 1178 1179 - varfirstSection=1180 - alignFirstSections(cards);1653 + // Group cards by actual top position. 1654 + var groups=[]; 1181 1181 1182 - // The section alignment can change natural card heights. 1183 - // Measure only afterwards. 1184 - var maxHeight=0; 1185 - 1186 1186 cards.forEach(function(card){ 1187 - maxHeight=Math.max( 1188 - maxHeight, 1189 - card.getBoundingClientRect().height 1190 - ); 1657 + var top= 1658 + card.getBoundingClientRect().top; 1659 + 1660 + var group=null; 1661 + 1662 + for(var i=0;i<groups.length;i++){ 1663 + if( 1664 + Math.abs( 1665 + groups[i].top-top 1666 + )<=ROW_TOLERANCE 1667 + ){ 1668 + group=groups[i]; 1669 + break; 1670 + } 1671 + } 1672 + 1673 + if(!group){ 1674 + group={ 1675 + top:top, 1676 + cards:[] 1677 + }; 1678 + groups.push(group); 1679 + } 1680 + 1681 + group.cards.push(card); 1191 1191 }); 1192 1192 1193 - maxHeight=Math.ceil(maxHeight); 1684 + groups.forEach(function(group){ 1685 + if(group.cards.length<2){ 1686 + return; 1687 + } 1194 1194 1195 - if(maxHeight<MIN_H)return null; 1689 + var firstHeaders= 1690 + group.cards.map(function(card){ 1691 + var candidates= 1692 + headers 1693 + .filter(function(row){ 1694 + return row.card===card; 1695 + }) 1696 + .sort(function(a,b){ 1697 + return ( 1698 + a.el 1699 + .getBoundingClientRect() 1700 + .top- 1701 + b.el 1702 + .getBoundingClientRect() 1703 + .top 1704 + ); 1705 + }); 1196 1196 1197 - cards.forEach(function(card){ 1198 - saveOriginal( 1199 - card, 1200 - originalMinHeight, 1201 - "min-height" 1202 - ); 1707 + return candidates.length 1708 + ?candidates[0] 1709 + :null; 1710 + }); 1203 1203 1204 - card.style.setProperty( 1205 - "min-height", 1206 - maxHeight+"px" 1207 - ); 1712 + if( 1713 + !firstHeaders.some(function(row){ 1714 + return !row; 1715 + }) 1716 + ){ 1717 + var targetTop= 1718 + Math.max.apply( 1719 + Math, 1720 + firstHeaders.map(function(row){ 1721 + return ( 1722 + row.el 1723 + .getBoundingClientRect() 1724 + .top- 1725 + row.card 1726 + .getBoundingClientRect() 1727 + .top 1728 + ); 1729 + }) 1730 + ); 1208 1208 1209 - card.setAttribute( 1210 - "data-sn-equal-height-managed", 1211 - "4" 1212 - ); 1732 + firstHeaders.forEach(function(row){ 1733 + var relativeTop= 1734 + row.el 1735 + .getBoundingClientRect() 1736 + .top- 1737 + row.card 1738 + .getBoundingClientRect() 1739 + .top; 1213 1213 1214 - heightManaged.add(card);1215 - });1741 + var delta= 1742 + targetTop-relativeTop; 1216 1216 1217 - return { 1218 - cards:cards.length, 1219 - height:maxHeight, 1220 - firstSection:firstSection 1221 - }; 1744 + if(delta>1){ 1745 + saveStyle( 1746 + row.el, 1747 + originalMargin, 1748 + "margin-top" 1749 + ); 1750 + 1751 + var current= 1752 + num( 1753 + getComputedStyle( 1754 + row.el 1755 + ).marginTop 1756 + ); 1757 + 1758 + row.el.style.setProperty( 1759 + "margin-top", 1760 + ( 1761 + current+delta 1762 + )+"px" 1763 + ); 1764 + 1765 + row.el.setAttribute( 1766 + "data-sn-master-first-row", 1767 + "1" 1768 + ); 1769 + 1770 + managedMargin.add( 1771 + row.el 1772 + ); 1773 + } 1774 + }); 1775 + } 1776 + 1777 + var maxHeight=0; 1778 + 1779 + group.cards.forEach(function(card){ 1780 + maxHeight= 1781 + Math.max( 1782 + maxHeight, 1783 + card 1784 + .getBoundingClientRect() 1785 + .height 1786 + ); 1787 + }); 1788 + 1789 + maxHeight= 1790 + Math.ceil(maxHeight); 1791 + 1792 + group.cards.forEach(function(card){ 1793 + saveStyle( 1794 + card, 1795 + originalHeight, 1796 + "min-height" 1797 + ); 1798 + 1799 + card.style.setProperty( 1800 + "min-height", 1801 + maxHeight+"px" 1802 + ); 1803 + 1804 + card.setAttribute( 1805 + "data-sn-master-equal-height", 1806 + "1" 1807 + ); 1808 + 1809 + managedHeight.add( 1810 + card 1811 + ); 1812 + }); 1813 + }); 1222 1222 } 1223 1223 1224 - function run(){ 1225 - reset(); 1816 + /* ======================================================= 1817 + DETAIL GRID EQUAL HEIGHT, DESKTOP ONLY 1818 + ======================================================= */ 1226 1226 1820 + function equaliseDetailGrids(){ 1227 1227 if( 1822 + PAGE_KIND!=="detail"|| 1228 1228 window.innerWidth<=MOBILE_MAX 1229 1229 ){ 1230 1230 return; 1231 1231 } 1232 1232 1233 - var parents= 1828 + var selectors=[ 1829 + ".arsn-grid", 1830 + ".arsn-grid-2", 1831 + ".arsn-grid-3", 1832 + ".dmp-grid", 1833 + ".ido-grid", 1834 + ".pp-grid" 1835 + ]; 1836 + 1837 + selectors.forEach(function(selector){ 1234 1234 Array.from( 1235 - root.querySelectorAll("*") 1236 - ).filter(function(parent){ 1237 - return ( 1238 - visible(parent,MIN_W,MIN_H)&& 1239 - parent.children&& 1240 - parent.children.length>=2&& 1241 - parent.children.length<=MAX_PARENT_CHILDREN 1242 - ); 1243 - }); 1839 + root.querySelectorAll(selector) 1840 + ).forEach(function(grid){ 1841 + var children= 1842 + Array.from( 1843 + grid.children||[] 1844 + ).filter(visible); 1244 1244 1245 - var touched=new Set(); 1846 + if(children.length<2){ 1847 + return; 1848 + } 1246 1246 1247 - parents.forEach(function(parent){ 1248 - var entries=[]; 1850 + var groups=[]; 1249 1249 1250 - Array.from(parent.children).forEach(function(child){ 1251 - if(!visible(child,MIN_W,MIN_H))return; 1852 + children.forEach(function(child){ 1853 + var top= 1854 + child 1855 + .getBoundingClientRect() 1856 + .top; 1252 1252 1253 - var target=pickTarget(child); 1254 - if(!target)return; 1858 + var group=null; 1255 1255 1256 - entries.push({ 1257 - target:target, 1258 - rect:target.getBoundingClientRect() 1860 + for(var i=0;i<groups.length;i++){ 1861 + if( 1862 + Math.abs( 1863 + groups[i].top-top 1864 + )<=ROW_TOLERANCE 1865 + ){ 1866 + group=groups[i]; 1867 + break; 1868 + } 1869 + } 1870 + 1871 + if(!group){ 1872 + group={ 1873 + top:top, 1874 + items:[] 1875 + }; 1876 + groups.push(group); 1877 + } 1878 + 1879 + group.items.push(child); 1259 1259 }); 1260 - }); 1261 1261 1262 - if(entries.length<2)return; 1882 + groups.forEach(function(group){ 1883 + if(group.items.length<2){ 1884 + return; 1885 + } 1263 1263 1264 - groupsByVisualRow(entries).forEach(function(group){ 1265 - if(!validHorizontalGroup(group))return; 1887 + var maxHeight=0; 1266 1266 1267 - var signature= 1268 - group.entries.map(function(entry){ 1269 - return entry.target; 1889 + group.items.forEach(function(item){ 1890 + maxHeight= 1891 + Math.max( 1892 + maxHeight, 1893 + item 1894 + .getBoundingClientRect() 1895 + .height 1896 + ); 1270 1270 }); 1271 1271 1272 - if( 1273 - !signature.some(function(el){ 1274 - return !touched.has(el); 1275 - }) 1276 - ){ 1277 - return; 1278 - } 1899 + maxHeight= 1900 + Math.ceil(maxHeight); 1279 1279 1280 - var applied= 1281 - applyGroup(group); 1902 + group.items.forEach(function(item){ 1903 + saveStyle( 1904 + item, 1905 + originalHeight, 1906 + "min-height" 1907 + ); 1282 1282 1283 - if(applied){ 1284 - signature.forEach(function(el){ 1285 - touched.add(el); 1909 + item.style.setProperty( 1910 + "min-height", 1911 + maxHeight+"px" 1912 + ); 1913 + 1914 + item.setAttribute( 1915 + "data-sn-master-equal-height", 1916 + "1" 1917 + ); 1918 + 1919 + managedHeight.add(item); 1286 1286 }); 1287 - } 1921 + }); 1288 1288 }); 1289 1289 }); 1290 1290 } 1291 1291 1292 - function schedule(){ 1293 - if(raf)cancelAnimationFrame(raf); 1926 + /* ======================================================= 1927 + RUN / RESPONSIVE SCHEDULING 1928 + ======================================================= */ 1294 1294 1295 - raf=requestAnimationFrame(function(){ 1296 - raf=requestAnimationFrame(function(){ 1297 - raf=0; 1298 - run(); 1299 - }); 1300 - }); 1930 + function run(){ 1931 + if(running)return; 1932 + 1933 + running=true; 1934 + 1935 + try{ 1936 + resetRuntime(); 1937 + applyPlaceholderBadge(); 1938 + propagateDetailAccents(); 1939 + 1940 + var headers= 1941 + applyOverviewPalette(); 1942 + 1943 + makeThreeLineAreaLabels(); 1944 + makeFilledRedOrangeCTAsBorderless(); 1945 + 1946 + if( 1947 + window.innerWidth> 1948 + MOBILE_MAX 1949 + ){ 1950 + alignOverviewCards( 1951 + headers 1952 + ); 1953 + 1954 + equaliseDetailGrids(); 1955 + } 1956 + }finally{ 1957 + running=false; 1958 + } 1301 1301 } 1302 1302 1303 - addEventListener("resize",schedule,{passive:true}); 1304 - addEventListener("load",schedule,{once:true}); 1961 + function onResize(){ 1962 + if(resizeTimer){ 1963 + clearTimeout( 1964 + resizeTimer 1965 + ); 1966 + } 1305 1305 1306 - root.addEventListener( 1307 - "click", 1308 - function(){ 1309 - setTimeout(schedule,0); 1310 - }, 1311 - true 1312 - ); 1968 + resizeTimer= 1969 + setTimeout( 1970 + function(){ 1971 + resizeTimer=0; 1972 + run(); 1973 + }, 1974 + RESIZE_DEBOUNCE 1975 + ); 1976 + } 1313 1313 1314 - Array.from(root.querySelectorAll("img")).forEach(function(img){ 1315 - if(!img.complete){ 1316 - img.addEventListener("load",schedule,{once:true}); 1978 + async function waitForReady(){ 1979 + if( 1980 + document.readyState!=="complete" 1981 + ){ 1982 + await new Promise(function(resolve){ 1983 + window.addEventListener( 1984 + "load", 1985 + resolve, 1986 + {once:true} 1987 + ); 1988 + }); 1317 1317 } 1318 - }); 1319 1319 1320 - if(document.fonts&&document.fonts.ready){ 1321 - document.fonts.ready.then(schedule); 1991 + if( 1992 + document.fonts&& 1993 + document.fonts.ready 1994 + ){ 1995 + try{ 1996 + await document.fonts.ready; 1997 + }catch(error){} 1998 + } 1999 + 2000 + var images= 2001 + Array.from( 2002 + root.querySelectorAll("img") 2003 + ); 2004 + 2005 + await Promise.all( 2006 + images.map(function(img){ 2007 + if(img.complete){ 2008 + return Promise.resolve(); 2009 + } 2010 + 2011 + return new Promise(function(resolve){ 2012 + var done=function(){ 2013 + resolve(); 2014 + }; 2015 + 2016 + img.addEventListener( 2017 + "load", 2018 + done, 2019 + {once:true} 2020 + ); 2021 + 2022 + img.addEventListener( 2023 + "error", 2024 + done, 2025 + {once:true} 2026 + ); 2027 + }); 2028 + }) 2029 + ); 2030 + 2031 + run(); 1322 1322 } 1323 1323 1324 - schedule(); 1325 - setTimeout(schedule,200); 1326 - setTimeout(schedule,650); 1327 - setTimeout(schedule,1400); 2034 + window.addEventListener( 2035 + "resize", 2036 + onResize, 2037 + {passive:true} 2038 + ); 2039 + 2040 + waitForReady(); 1328 1328 })(); 1329 1329 </script> 1330 -<!-- SN_HORIZONTAL_BOX_HARMONIZER_END --> 2043 + 2044 +<!-- SN_SERVICE_NAVIGATOR_MASTER_STYLE_END --> 1331 1331 {{/html}} 1332 1332 2047 +{{html clean="false"}} 2048 +<!-- ARSN_PHASE_CTA_MOBILE_EDGE_FIX_V3_START --> 2049 +<style data-arsn-phase-cta-mobile-edge-fix="3"> 2050 +@media (max-width:767px){ 2051 + 2052 + /* Remove the white side gutters around the three phase CTAs. */ 2053 + #xwikicontent .arsn-phase-cta-wrap{ 2054 + box-sizing:border-box!important; 2055 + width:calc(100% + 2px)!important; 2056 + max-width:none!important; 2057 + margin:14px -1px -1px -1px!important; 2058 + padding:0!important; 2059 + border:0!important; 2060 + border-left:0!important; 2061 + box-shadow:none!important; 2062 + background:transparent!important; 2063 + } 2064 + 2065 + /* Full-width orange CTA; no extra border/shadow. */ 2066 + #xwikicontent a.arsn-phase-cta{ 2067 + display:flex!important; 2068 + align-items:center!important; 2069 + justify-content:center!important; 2070 + gap:8px!important; 2071 + 2072 + box-sizing:border-box!important; 2073 + width:100%!important; 2074 + max-width:none!important; 2075 + min-width:0!important; 2076 + 2077 + margin:0!important; 2078 + padding:12px 14px!important; 2079 + 2080 + border:0!important; 2081 + border-left:0!important; 2082 + border-right:0!important; 2083 + border-top:0!important; 2084 + border-bottom:0!important; 2085 + box-shadow:none!important; 2086 + 2087 + border-radius:8px!important; 2088 + 2089 + text-align:center!important; 2090 + text-align-last:center!important; 2091 + text-justify:auto!important; 2092 + word-spacing:normal!important; 2093 + white-space:normal!important; 2094 + } 2095 + 2096 + /* Keep an XWiki external-link icon on the same line/flex row. */ 2097 + #xwikicontent a.arsn-phase-cta::after{ 2098 + flex:0 0 auto!important; 2099 + margin-left:2px!important; 2100 + } 2101 + 2102 + #xwikicontent a.arsn-phase-cta > .fa, 2103 + #xwikicontent a.arsn-phase-cta > .icon, 2104 + #xwikicontent a.arsn-phase-cta > .external-link-icon, 2105 + #xwikicontent a.arsn-phase-cta > [class*="external"]{ 2106 + position:static!important; 2107 + display:inline-block!important; 2108 + flex:0 0 auto!important; 2109 + margin:0!important; 2110 + } 2111 +} 2112 +</style> 2113 +<!-- ARSN_PHASE_CTA_MOBILE_EDGE_FIX_V3_END --> 2114 +{{/html}} 2115 +