Änderungen von Dokument Service Navigator
Zuletzt geändert von Veronika Kocher am Donnerstag, 03 Sep. 2026 14:15
Von Version 1.8
bearbeitet von Veronika Kocher
am Donnerstag, 03 Sep. 2026 13:04
am Donnerstag, 03 Sep. 2026 13:04
Änderungskommentar:
Es gibt keinen Kommentar für diese Version
Auf Version 1.9
bearbeitet von Veronika Kocher
am Donnerstag, 03 Sep. 2026 14:15
am Donnerstag, 03 Sep. 2026 14:15
Änderungskommentar:
Es gibt keinen Kommentar für diese Version
Zusammenfassung
-
Seiteneigenschaften (1 geändert, 0 hinzugefügt, 0 gelöscht)
Details
- Seiteneigenschaften
-
- Inhalt
-
... ... @@ -367,6 +367,38 @@ 367 367 [data-sn-master-first-row]{ 368 368 box-sizing:border-box; 369 369 } 370 + 371 +/* ========================================================= 372 + FULL-WIDTH THREE-LINE NUMBER / TITLE / SUBTITLE BLOCKS 373 + ========================================================= */ 374 +#xwikicontent .arsn-area-label[data-sn-three-line="1"]{ 375 + display:grid!important; 376 + grid-template-columns:minmax(0,1fr)!important; 377 + grid-auto-rows:auto!important; 378 + width:100%!important; 379 + max-width:none!important; 380 + box-sizing:border-box!important; 381 + justify-items:start!important; 382 + align-items:start!important; 383 + gap:2px!important; 384 + text-align:left!important; 385 + text-align-last:left!important; 386 + text-justify:auto!important; 387 + word-spacing:normal!important; 388 + white-space:normal!important; 389 +} 390 +#xwikicontent .arsn-area-label[data-sn-three-line="1"] > .arsn-area-number, 391 +#xwikicontent .arsn-area-label[data-sn-three-line="1"] > .sn-area-label-title, 392 +#xwikicontent .arsn-area-label[data-sn-three-line="1"] > .arsn-area-action{ 393 + display:block!important; 394 + width:100%!important; 395 + margin:0!important; 396 + text-align:left!important; 397 + text-align-last:left!important; 398 + text-justify:auto!important; 399 + word-spacing:normal!important; 400 + white-space:normal!important; 401 +} 370 370 </style> 371 371 372 372 <script data-sn-service-navigator-master="1"> ... ... @@ -559,6 +559,227 @@ 559 559 } 560 560 561 561 /* ======================================================= 594 + BORDERLESS FILLED RED/ORANGE CTA BUTTONS 595 + ======================================================= */ 596 + 597 + function colourDistance(a,b){ 598 + return Math.sqrt( 599 + Math.pow(a[0]-b[0],2)+ 600 + Math.pow(a[1]-b[1],2)+ 601 + Math.pow(a[2]-b[2],2) 602 + ); 603 + } 604 + 605 + function makeFilledRedOrangeCTAsBorderless(){ 606 + var RED_ORANGE=[233,75,19]; 607 + 608 + Array.from( 609 + root.querySelectorAll( 610 + 'a,button,[role="button"],input[type="submit"],input[type="button"]' 611 + ) 612 + ).forEach(function(el){ 613 + if(!visible(el))return; 614 + 615 + var style=getComputedStyle(el); 616 + var rgb=parseRGB(style.backgroundColor); 617 + 618 + if(!rgb)return; 619 + 620 + if( 621 + colourDistance( 622 + rgb, 623 + RED_ORANGE 624 + )>55 625 + ){ 626 + return; 627 + } 628 + 629 + var rect=el.getBoundingClientRect(); 630 + 631 + if( 632 + rect.width<80|| 633 + rect.height<24 634 + ){ 635 + return; 636 + } 637 + 638 + el.style.setProperty( 639 + "border", 640 + "none", 641 + "important" 642 + ); 643 + 644 + el.style.setProperty( 645 + "border-left", 646 + "none", 647 + "important" 648 + ); 649 + 650 + el.style.setProperty( 651 + "border-top", 652 + "none", 653 + "important" 654 + ); 655 + 656 + el.style.setProperty( 657 + "border-right", 658 + "none", 659 + "important" 660 + ); 661 + 662 + el.style.setProperty( 663 + "border-bottom", 664 + "none", 665 + "important" 666 + ); 667 + 668 + el.style.setProperty( 669 + "box-shadow", 670 + "none", 671 + "important" 672 + ); 673 + }); 674 + } 675 + 676 + /* ======================================================= 677 + FULL-WIDTH THREE-LINE AREA LABELS 678 + ======================================================= */ 679 + 680 + function compactText(value){ 681 + return String(value||"") 682 + .replace(/\s+/g," ") 683 + .trim(); 684 + } 685 + 686 + function makeThreeLineAreaLabels(){ 687 + Array.from( 688 + root.querySelectorAll( 689 + ".arsn-area-label" 690 + ) 691 + ).forEach(function(label){ 692 + if( 693 + label.getAttribute( 694 + "data-sn-three-line" 695 + )==="1" 696 + ){ 697 + return; 698 + } 699 + 700 + var number= 701 + label.querySelector( 702 + ":scope > .arsn-area-number" 703 + ); 704 + 705 + var action= 706 + label.querySelector( 707 + ":scope > .arsn-area-action" 708 + ); 709 + 710 + if( 711 + !number|| 712 + !action 713 + ){ 714 + return; 715 + } 716 + 717 + var clone= 718 + label.cloneNode(true); 719 + 720 + var cloneNumber= 721 + clone.querySelector( 722 + ":scope > .arsn-area-number" 723 + ); 724 + 725 + var cloneAction= 726 + clone.querySelector( 727 + ":scope > .arsn-area-action" 728 + ); 729 + 730 + if(cloneNumber){ 731 + cloneNumber.remove(); 732 + } 733 + 734 + if(cloneAction){ 735 + cloneAction.remove(); 736 + } 737 + 738 + var titleText= 739 + compactText( 740 + clone.textContent 741 + ); 742 + 743 + if(!titleText){ 744 + return; 745 + } 746 + 747 + var numberNode= 748 + number.cloneNode(true); 749 + 750 + var actionNode= 751 + action.cloneNode(true); 752 + 753 + var titleNode= 754 + document.createElement( 755 + "span" 756 + ); 757 + 758 + titleNode.className= 759 + "sn-area-label-title"; 760 + 761 + titleNode.textContent= 762 + titleText; 763 + 764 + while(label.firstChild){ 765 + label.removeChild( 766 + label.firstChild 767 + ); 768 + } 769 + 770 + label.appendChild( 771 + numberNode 772 + ); 773 + 774 + label.appendChild( 775 + titleNode 776 + ); 777 + 778 + label.appendChild( 779 + actionNode 780 + ); 781 + 782 + label.setAttribute( 783 + "data-sn-three-line", 784 + "1" 785 + ); 786 + 787 + var head= 788 + label.closest( 789 + ".arsn-area-head" 790 + ); 791 + 792 + if(head){ 793 + head.style.setProperty( 794 + "width", 795 + "100%", 796 + "important" 797 + ); 798 + 799 + head.style.setProperty( 800 + "max-width", 801 + "100%", 802 + "important" 803 + ); 804 + 805 + head.style.setProperty( 806 + "box-sizing", 807 + "border-box", 808 + "important" 809 + ); 810 + } 811 + }); 812 + } 813 + 814 + /* ======================================================= 562 562 PLACEHOLDER BADGE 563 563 ======================================================= */ 564 564 ... ... @@ -1329,6 +1329,9 @@ 1329 1329 var headers= 1330 1330 applyOverviewPalette(); 1331 1331 1585 + makeThreeLineAreaLabels(); 1586 + makeFilledRedOrangeCTAsBorderless(); 1587 + 1332 1332 if( 1333 1333 window.innerWidth> 1334 1334 MOBILE_MAX