Changes for page Plan Your Data Management

Summary

• Page properties (1 modified, 0 added, 0 removed)

Details

Page properties

Content

...	...	@@ -339,6 +339,38 @@
339	339	[data-sn-master-first-row]{
340	340	box-sizing:border-box;
341	341	}
	342	+
	343	+/* =========================================================
	344	+ FULL-WIDTH THREE-LINE NUMBER / TITLE / SUBTITLE BLOCKS
	345	+ ========================================================= */
	346	+#xwikicontent .arsn-area-label[data-sn-three-line="1"]{
	347	+ display:grid!important;
	348	+ grid-template-columns:minmax(0,1fr)!important;
	349	+ grid-auto-rows:auto!important;
	350	+ width:100%!important;
	351	+ max-width:none!important;
	352	+ box-sizing:border-box!important;
	353	+ justify-items:start!important;
	354	+ align-items:start!important;
	355	+ gap:2px!important;
	356	+ text-align:left!important;
	357	+ text-align-last:left!important;
	358	+ text-justify:auto!important;
	359	+ word-spacing:normal!important;
	360	+ white-space:normal!important;
	361	+}
	362	+#xwikicontent .arsn-area-label[data-sn-three-line="1"] > .arsn-area-number,
	363	+#xwikicontent .arsn-area-label[data-sn-three-line="1"] > .sn-area-label-title,
	364	+#xwikicontent .arsn-area-label[data-sn-three-line="1"] > .arsn-area-action{
	365	+ display:block!important;
	366	+ width:100%!important;
	367	+ margin:0!important;
	368	+ text-align:left!important;
	369	+ text-align-last:left!important;
	370	+ text-justify:auto!important;
	371	+ word-spacing:normal!important;
	372	+ white-space:normal!important;
	373	+}
342	342	</style>
343	343
344	344	<script data-sn-service-navigator-master="1">
...	...	@@ -531,6 +531,227 @@
531	531	}
532	532
533	533	/* =======================================================
	566	+ BORDERLESS FILLED RED/ORANGE CTA BUTTONS
	567	+ ======================================================= */
	568	+
	569	+ function colourDistance(a,b){
	570	+ return Math.sqrt(
	571	+ Math.pow(a[0]-b[0],2)+
	572	+ Math.pow(a[1]-b[1],2)+
	573	+ Math.pow(a[2]-b[2],2)
	574	+ );
	575	+ }
	576	+
	577	+ function makeFilledRedOrangeCTAsBorderless(){
	578	+ var RED_ORANGE=[233,75,19];
	579	+
	580	+ Array.from(
	581	+ root.querySelectorAll(
	582	+ 'a,button,[role="button"],input[type="submit"],input[type="button"]'
	583	+ )
	584	+ ).forEach(function(el){
	585	+ if(!visible(el))return;
	586	+
	587	+ var style=getComputedStyle(el);
	588	+ var rgb=parseRGB(style.backgroundColor);
	589	+
	590	+ if(!rgb)return;
	591	+
	592	+ if(
	593	+ colourDistance(
	594	+ rgb,
	595	+ RED_ORANGE
	596	+ )>55
	597	+ ){
	598	+ return;
	599	+ }
	600	+
	601	+ var rect=el.getBoundingClientRect();
	602	+
	603	+ if(
	604	+ rect.width<80||
	605	+ rect.height<24
	606	+ ){
	607	+ return;
	608	+ }
	609	+
	610	+ el.style.setProperty(
	611	+ "border",
	612	+ "none",
	613	+ "important"
	614	+ );
	615	+
	616	+ el.style.setProperty(
	617	+ "border-left",
	618	+ "none",
	619	+ "important"
	620	+ );
	621	+
	622	+ el.style.setProperty(
	623	+ "border-top",
	624	+ "none",
	625	+ "important"
	626	+ );
	627	+
	628	+ el.style.setProperty(
	629	+ "border-right",
	630	+ "none",
	631	+ "important"
	632	+ );
	633	+
	634	+ el.style.setProperty(
	635	+ "border-bottom",
	636	+ "none",
	637	+ "important"
	638	+ );
	639	+
	640	+ el.style.setProperty(
	641	+ "box-shadow",
	642	+ "none",
	643	+ "important"
	644	+ );
	645	+ });
	646	+ }
	647	+
	648	+ /* =======================================================
	649	+ FULL-WIDTH THREE-LINE AREA LABELS
	650	+ ======================================================= */
	651	+
	652	+ function compactText(value){
	653	+ return String(value||"")
	654	+ .replace(/\s+/g," ")
	655	+ .trim();
	656	+ }
	657	+
	658	+ function makeThreeLineAreaLabels(){
	659	+ Array.from(
	660	+ root.querySelectorAll(
	661	+ ".arsn-area-label"
	662	+ )
	663	+ ).forEach(function(label){
	664	+ if(
	665	+ label.getAttribute(
	666	+ "data-sn-three-line"
	667	+ )==="1"
	668	+ ){
	669	+ return;
	670	+ }
	671	+
	672	+ var number=
	673	+ label.querySelector(
	674	+ ":scope > .arsn-area-number"
	675	+ );
	676	+
	677	+ var action=
	678	+ label.querySelector(
	679	+ ":scope > .arsn-area-action"
	680	+ );
	681	+
	682	+ if(
	683	+ !number||
	684	+ !action
	685	+ ){
	686	+ return;
	687	+ }
	688	+
	689	+ var clone=
	690	+ label.cloneNode(true);
	691	+
	692	+ var cloneNumber=
	693	+ clone.querySelector(
	694	+ ":scope > .arsn-area-number"
	695	+ );
	696	+
	697	+ var cloneAction=
	698	+ clone.querySelector(
	699	+ ":scope > .arsn-area-action"
	700	+ );
	701	+
	702	+ if(cloneNumber){
	703	+ cloneNumber.remove();
	704	+ }
	705	+
	706	+ if(cloneAction){
	707	+ cloneAction.remove();
	708	+ }
	709	+
	710	+ var titleText=
	711	+ compactText(
	712	+ clone.textContent
	713	+ );
	714	+
	715	+ if(!titleText){
	716	+ return;
	717	+ }
	718	+
	719	+ var numberNode=
	720	+ number.cloneNode(true);
	721	+
	722	+ var actionNode=
	723	+ action.cloneNode(true);
	724	+
	725	+ var titleNode=
	726	+ document.createElement(
	727	+ "span"
	728	+ );
	729	+
	730	+ titleNode.className=
	731	+ "sn-area-label-title";
	732	+
	733	+ titleNode.textContent=
	734	+ titleText;
	735	+
	736	+ while(label.firstChild){
	737	+ label.removeChild(
	738	+ label.firstChild
	739	+ );
	740	+ }
	741	+
	742	+ label.appendChild(
	743	+ numberNode
	744	+ );
	745	+
	746	+ label.appendChild(
	747	+ titleNode
	748	+ );
	749	+
	750	+ label.appendChild(
	751	+ actionNode
	752	+ );
	753	+
	754	+ label.setAttribute(
	755	+ "data-sn-three-line",
	756	+ "1"
	757	+ );
	758	+
	759	+ var head=
	760	+ label.closest(
	761	+ ".arsn-area-head"
	762	+ );
	763	+
	764	+ if(head){
	765	+ head.style.setProperty(
	766	+ "width",
	767	+ "100%",
	768	+ "important"
	769	+ );
	770	+
	771	+ head.style.setProperty(
	772	+ "max-width",
	773	+ "100%",
	774	+ "important"
	775	+ );
	776	+
	777	+ head.style.setProperty(
	778	+ "box-sizing",
	779	+ "border-box",
	780	+ "important"
	781	+ );
	782	+ }
	783	+ });
	784	+ }
	785	+
	786	+ /* =======================================================
534	534	PLACEHOLDER BADGE
535	535	======================================================= */
536	536
...	...	@@ -1301,6 +1301,9 @@
1301	1301	var headers=
1302	1302	applyOverviewPalette();
1303	1303
	1557	+ makeThreeLineAreaLabels();
	1558	+ makeFilledRedOrangeCTAsBorderless();
	1559	+
1304	1304	if(
1305	1305	window.innerWidth>
1306	1306	MOBILE_MAX