jsdoc: Port back CSS changes from Paperjs.org.

build/jsdoc-toolkit/templates/jsdoc/static/resources/css/reference.css

@@ -1,12 +1,12 @@
 /* These styles are shared with the server version of docs */
 
 .reference h1, .reference h2, .reference h3 {
-	font-size: 12px;
+	font-size: 13px;
 	font-weight: normal;
-	display: block;
+	height: 18px; /* -2px so border-bottom aligns with contained links */
-	height: 17px;
-	margin: 0 0 16px 0;
 	border-bottom: 1px solid;
+	margin-top: 0;
+	margin-bottom: 16px;
 }
 
 .reference h3 {
@@ -14,13 +14,18 @@
 	border-bottom-style: dotted;
 }
 
+.reference a tt {
+	line-height: 18px;
+}
+/*
 .reference a tt,
 .reference a tt b {
 	padding-bottom: 1px;
 }
+*/
 
-.reference pre {
+.reference p {
-	margin: 0 0 20px 0;
+	margin: 0 0 16px 0;
 }
 
 .reference ul {
@@ -58,12 +63,8 @@
 	list-style-image: none; /* needed for ie 6 */
 }
 
-.reference-end {
-	height: 600px;
-}
-
 .reference-members {
-	padding-bottom: 16px;
+	margin-bottom: 16px;
 }
 
 .member-group-text {
@@ -94,14 +95,14 @@
 .member-text {
 	border-top: 1px dashed #999;
 	padding: 10px 10px 0 10px;
-	margin-bottom: -10px; /* Compensate half of 20px margins of p and ul */
+	margin-bottom: -6px; /* Compensate margins of p and ul to end up with 10px */
 }
 
 .reference ul,
 .reference .paperscript,
 .reference .CodeMirror {
-	margin-top: -10px; /* Move half way up close to previous paragraph */
+	margin-top: -8px; /* Move half way up close to previous paragraph */
-	margin-bottom: 20px;
+	margin-bottom: 16px;
 }
 
 .reference ul {
@@ -118,12 +119,13 @@
 	padding-left: 30px;
 }
 
-ul.package-classes {
+.package-classes {
 	padding-bottom: 4px;
 }
 
 .package-classes ul {
 	margin-left: 10px;
+	margin-bottom: 10px;
 }
 
 .reference h2 a {

build/jsdoc-toolkit/templates/jsdoc/static/resources/css/style.css

@@ -12,7 +12,7 @@ body {
 }
 
 select, input, textarea {
-	font-size: 12px;
+	font-size: 11px;
 	margin: 0;
 	color: #000;
 }

build/jsdoc-toolkit/templates/jsdoc/static/resources/js/reference.js

@@ -48,7 +48,6 @@ Code = HtmlElement.extend({
 	}
 });
 
-
 PaperScript = HtmlElement.extend({
 	_class: 'paperscript',
 
@@ -176,45 +175,56 @@ PaperScript = HtmlElement.extend({
 	}
 });
 
-$document.addEvent('domready', function() {
-	var h = unescape(document.location.hash);
-	if (h) scrollToElement(h.substring(1));
-});
-
 var lastMemberId = null;
-function toggleMember(id, scrollTo) {
+function toggleMember(id, scrollTo, dontScroll) {
+	var link = $('#' + id + '-link');
+	if (!link)
+		return true;
+	var desc = $('#' + id + '-description');
+	var v = !link.hasClass('hidden');
+	// Retrieve y-offset before any changes, so we can correct scrolling after
+	var offset = (v ? link : desc).getOffset().y;
 	if (lastMemberId && lastMemberId != id) {
 		var prevId = lastMemberId;
 		lastMemberId = null;
-		toggleMember(prevId);
+		toggleMember(prevId, false, true);
 	}
-	var link = $('#' + id + '-link');
+	lastMemberId = v && id;
-	if (link) {
+	link.modifyClass('hidden', v);
-		var desc = $('#' + id + '-description');
+	desc.modifyClass('hidden', !v);
-		var v = !link.hasClass('hidden');
+	if (!dontScroll) {
-		lastMemberId = v && id;
+		// Correct scrolling relatively to where we are, by checking the amount
-		link.modifyClass('hidden', v);
+		// the element has shifted due to the above toggleMember call, and
-		desc.modifyClass('hidden', !v);
+		// correcting by 11px offset, caused by 1px border and 10px padding.
-		if (!desc.editor && v) {
+		var scroll = $window.getScrollOffset();
-			desc.editor = $$('pre.code, .paperscript', desc).each(function(code) {
+		$window.setScrollOffset(scroll.x, scroll.y
-				code.initialize();
+				+ (v ? desc : link).getOffset().y - offset + 11 * (v ? 1 : -1));
-			});
-		}
-		if (scrollTo)
-			scrollToMember(id);
-		return false;
 	}
-	return true;
+	if (!desc.editor && v) {
+		desc.editor = $$('pre.code, .paperscript', desc).each(function(code) {
+			code.initialize();
+		});
+	}
+	if (scrollTo)
+		scrollToMember(id);
+	return false;
 }
 
 function scrollToElement(id) {
 	var e = $('#' + id + '-member');
 	if (e) {
-		var offs = e.getOffset();
-		$window.setScrollOffset(offs);
 		if (e.hasClass('member'))
 			toggleMember(id);
+		var offs = e.getOffset();
+		$window.setScrollOffset(offs);
 	} else {
-		document.location.hash = id;
+		window.location.hash = id;
 	}
 }
+
+$document.addEvent('domready', function() {
+	var h = unescape(document.location.hash);
+	if (h) scrollToElement(h.substring(1));
+	if (window.paper)
+		paper.load();
+});