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