Editorial fixes and add 'requirement' label (#153)

* Editorial tweaks to introduction

* Change to requirement and add text to describe requirement type

* Fix sections

* Add different colours for requirement level

* Improve requirement type text

* Fix grammar

Author: iadawn

explainer/index.html

@@ -19,7 +19,7 @@
     <section id='sotd'>
         <p>This is an updated draft of the WCAG 3.0 Explainer. It is informative, not normative, and is not expected to become a W3C Recommendation. It provides background on [[[?WCAG3]]].</p>
 
-        <p>To comment, <a href="https://github.com/w3c/wcag3/issues/new">file an issue in the W3C wcag3 GitHub repository</a>. The Working Group requests that public comments be filed as new issues, one issue per discrete comment. It is free to create a GitHub account to file issues. If filing issues in GitHub is not feasible, send email to <a href="mailto:[email protected]?subject=WCAG%203.0%20public%20comment">[email protected]</a> (<a href="https://lists.w3.org/Archives/Public/public-agwg-comments/">comment archive</a>). In-progress updates to the guidelines can be viewed in the <a href="https://w3c.github.io/wcag3/guidelines/">public editors’ draft</a>.</p>
+        <p>To comment, <a href="https://github.com/w3c/wcag3/issues/new">file an issue in the W3C wcag3 GitHub repository</a>. The Working Group requests that public comments be filed as new issues, one issue per discrete comment. It is free to create a GitHub account to file issues. If filing issues in GitHub is not feasible, email <a href="mailto:[email protected]?subject=WCAG%203.0%20public%20comment">[email protected]</a> (<a href="https://lists.w3.org/Archives/Public/public-agwg-comments/">comment archive</a>). In-progress updates to the guidelines can be viewed in the <a href="https://w3c.github.io/wcag3/guidelines/">public editors’ draft</a>.</p>
 
     </section>
     <section id="intro">

guidelines/guidelines.css

@@ -53,28 +53,33 @@ summary::after {
 a.internalDFN[title]:hover, .internalDFN[title]:active, a.internalDFN[title]:focus {
 	cursor: help;
 }
-.provision h4, .provision h5 {
+.requirement h4, .requirement h5 {
 	font-style: normal;
 	font-weight: normal;
 	font-size: 100%;
 	color: #005A9C;
 }
+.requirement .requirement-type {
+	font-size: 90%;
+	font-variant: small-caps;
+	color: #404040;
+}
 
 .guideline {
 	margin-left: 4em;
 	position: relative;
 }
 
-.guideline .provision {
+.guideline .requirement {
 	margin-left: 4em;
 	position: relative;
 }
 
-.guideline-text, provision-text {
+.guideline-text, .requirement-text {
 	font-size: 110%;
 	margin-top: 0;
 }
-.guideline h3, .provision h4, .provision h5 {
+.guideline h3, .requirement h4, .requirement h5 {
 	width: 100%;
 	margin-bottom: 0;
 	margin-top: .4em;
@@ -160,7 +165,7 @@ caption {
 	content: "§";
 	display: block;
 }
-.status-marker, .provision-type-marker {
+.status-marker {
   font-weight: 700;
   font-size: 11px;
   font-size: .6125rem;
@@ -176,10 +181,6 @@ caption {
 	background: #d0e1f1;
 	color: #091832;  
 }
-.provision-type-marker {
-	background: #6bc8fe;
-	color: #111111;  
-}
 a[href].status-link {
 	color: var(--text);
 }

guidelines/guidelines.js

@@ -80,27 +80,29 @@ function addStatusMarkers() {
 	});
 }
 
-var provisionTypeLabels = {
+var requirementTypeLabels = {
 	foundational: 'Used to test the most basic level of accessibility.',
-	supplemental: 'Used for higher levels of conformance.',
-	assertion: 'An attributable and documented statement of fact regarding procedures practiced in the development and maintenance of the content or product to improve accessibility.',
+	supplemental: 'Used for higher levels of conformance.'
 }
 
-function addProvisionTypeMarkers() {
-	var typeKeys = Object.keys(provisionTypeLabels);
-	typeKeys.forEach(function (provisionType) {
-		var headingSelector = '[data-provision-type="' + provisionType + '"] > .header-wrapper';
-		var headings = document.querySelectorAll(headingSelector);
-		headings.forEach(function (heading) {
-			var provisionTypeMarker = document.createElement("span");
-			provisionTypeMarker.classList.add("provision-type-marker");
-			provisionTypeMarker.innerHTML = sentenceCase(provisionType);	
-			heading.firstElementChild.insertAdjacentElement('beforeend', provisionTypeMarker);
-		});
+function addRequirementType() {
+	var requirements = document.querySelectorAll(".requirement");
+	requirements.forEach(function (requirement) {
+		var requirementType = requirement.getAttribute('data-requirement-type');
+		var preText = document.createElement("span");
+		var heading = requirement.querySelector("h5");
+		preText.classList.add("requirement-type");
+		if(requirementType == 'assertion') {
+			preText.innerHTML = "Assertion ";
+		} else if(requirementType == 'foundational' || requirementType == 'supplemental') {
+			preText.innerHTML = sentenceCase(requirementType) + " requirement ";
+		} else {
+			preText.innerHTML = "Requirement ";
+		}
+		heading.insertAdjacentElement('afterbegin', preText);
 	});
 }
 
-
 function removeDraftMethodLinks() {
 	document.querySelectorAll('.method-link').forEach(function(node){
 		uri = node.href;
@@ -160,19 +162,11 @@ function removeImgSize() {
 	});
 }
 
-function removeGLNum() {
-	var tocEl = document.querySelector(".tocline > a[href=\"#guidelines\"]").parentNode.querySelector("ol");
-	tocEl.querySelectorAll("bdi.secno").forEach(function(node){node.remove();});
-
-	var sectionEl = document.querySelector("#guidelines");
-	sectionEl.querySelectorAll("bdi.secno").forEach(function(node){node.remove();});
-}
-
-function removeProvisionNum() {
+function removeRequirementNum() {
 	var tocEl = document.querySelector(".tocline > a[href=\"#guidelines\"]").parentNode.querySelector("ol");
 	tocEl.querySelectorAll("ol ol ol ol bdi.secno").forEach(function(node){node.remove();});
 
-	document.querySelectorAll(".provision bdi.secno").forEach(function(node){node.remove();});
+	document.querySelectorAll(".requirement bdi.secno").forEach(function(node){node.remove();});
 }
 
 function outputJson() {
@@ -249,18 +243,16 @@ function moveStatusFilterToToc() {
 // scripts before Respec has run
 function preRespec() {
 	adjustDfnData();
-	linkOutcome();
 	addSummaryMarkers();
 }
 
 // scripts after Respec has run
 function postRespec() {
 	adjustNormativity();
 	removeDraftMethodLinks();
-	addProvisionTypeMarkers();
+	removeRequirementNum();
+	addRequirementType();
 	addStatusMarkers();
 	removeImgSize();
 	outputJson();
-	// removeGLNum();
-	removeProvisionNum();
 }