Page History

<script>
//Ver. 2.0710
// 2.02 added styles for page-breaks w/o line
// 2.03 captions + ruler page-break issue corrected
// 2.04 exclusion of img.emoticon (.svg btw) from getting frame & responsiveness
// 2.05 no not insert a caption if title is empty
// 2.06 force font-weight:normal (no bold) in caption
// 2.07 commented/removed 1200 px width limit
// 2.08 added class removal for old-fashioned "back to top" bottom icon
// 2.09 force NO style whatsoever to tiny images (imgCenter & imgShadow lead to misplacement of icons in mid-sentences)
// 2.10 forced caption color (solves orange caption "bug" without the need to clear formatting)

$(document).ready(function(){
   $("#main-content.wiki-content img").filter(":not([data-linked-resource-default-alias='top_of_page.jpg'])").each(function(){ 
        // for each image but "back-to-top" in the main page
        $(this).attr({"src": $(this).attr("data-image-src"),"height":""}) 
        // remove any predefined style (snapshot) and any height ('coz width gets modified and it impacts img ratio)
       $(this).addClass("imgFrame imgShadow imgCenter imgResponsive").css("max-width",$(this).attr("width")+"px"); // add the frameshadow style, sets max-width to user-defined width (700, 900)
        var t=""
        if($(this).is("[title]") && $(this).attr("title")!="") { t=$(this).attr("title") 
			 // if a title is set, it becomes the value of "t"
        	$(this).parent().after('<figcaption class="imgcaption">'+t+'</figcaption>') 
        	// a sub caption is created under the image, with the value of t, the title 
		} 
       
        if($(this).attr("data-linked-resource-content-type")=='image/png'){
            /*remove classes from png */
            $(this).removeClass("imgFrame imgShadow imgCenter")
        }
        if($(this)[0].width <160) {
            /*no frame or responsive size for tiny images*/
            $(this).removeClass("imgFrame imgResponsive imgShadow imgCenter") //2.08 removeClass("imgFrame imgResponsive"), 2.09 removeClass("imgFrame imgResponsive imgShadow imgCenter")
        }
		$("[alt='top_of_page.jpg']").removeClass("imgShadow") //2.08
		$(".emoticon").removeClass("imgFrame imgResponsive imgShadow imgCenter") //2.04
	
    })
})
</script>

<style>
    #main-content.wiki-content LI IMG.imgCenter, #main-content.wiki-content LI IMG.imgShadow, #main-content.wiki-content LI IMG.imgResponsive{
        /*perfectly centers images in lists by removing the list-induced tabulation*/
        transform:translateX(-20px);
    }
    .imgFrame {border:1px solid #ccc; background:transparent; padding:5px;}
    .imgShadow{box-shadow:0 0 15px rgba(0,0,0,0.2);}
    .imgCenter{margin:20px auto 0 auto !important;}
    .imgResponsive{/*min-width:160px;*/width:calc(100% - 20px)!important;} 
    .wiki-content .columnLayout {/*max-width:1200px;*/} /* extranet has no width limit: set max width to 1200px */
    .imgcaption {font-style:italic;font-size:0.85rem; text-align:center; margin:10px 0;font-weight:normal;color:#172b4d !important; } /* style for the auto generated image sub caption*/ //2.10
    .wiki-content .confluence-embedded-file-wrapper.confluence-embedded-manual-size {page-break-inside:avoid;} /*prevents page break between an image and its sub caption*/
	.page-break-ruler, .page-break-simple{ 
       page-break-after: always;
       line-height: 1em;
       }
    .page-break-ruler{ border-top: 1px solid #ccc; margin-top: 20px;}
</style>