Iteration 2: fixed some CSS for English pages

track/static/js/tables.js

@@ -175,8 +175,8 @@ $(function() {
 
     // add custom tailwind classes
     $('#DataTables_Table_0_filter').attr('class', 'flex block justify-start md:justify-center');
-    $('#DataTables_Table_0_filter label').attr('class', 'w-full md:w-2/3');
-    $('#datatables-search').attr('class', 'border border-solid border-https-dark-gray bg-https-light-gray focus:border-https-blue block md:inline-block h-8 md:ml-6 mb-4 md:mb-8 w-full md:w-3/5 lg:w-3/4');
-    $('.dataTables_csv').attr('class', 'text-lg md:ml-4 mt-4 md:mt-6');
+    $('#DataTables_Table_0_filter label').attr('class', 'text-2xl w-full md:w-2/3');
+    $('#datatables-search').attr('class', 'border border-solid border-https-dark-gray bg-https-light-gray focus:border-https-blue block md:inline-block h-12 md:ml-6 mb-4 md:mb-8 w-full lg:w-3/4');
+    $('.dataTables_csv').attr('class', 'text-3xl md:ml-4 mt-4 md:mt-6');
   });
 });

track/templates/en/domains.html

@@ -17,7 +17,7 @@
 
 		<div class="text-center mt-8 font-bold">
 			<div class="inline-block h-10 mr-4"><a href="/en/organizations/" class="text-black no-underline hover:text-https-blue font-medium">By Organization</a></div>
-			<div class="inline-block border-b-4 border-https-blue h-10 ml-4">By Domain</div>
+			<div class="inline-block border-b-4 border-https-blue ml-4">By Domain</div>
 		</div>
 
 	</header>
@@ -26,7 +26,7 @@
 	    <table language="en" class="domain responsive https">
 	      <caption class="sr-only">Secure HTTP(S) By Domain. Table is sortable via first row table headers. Each row contains a domain and related attributes.</caption>
 	      <thead>
-	        <tr>
+	        <tr class="leading-tight text-2xl">
 	          <th class="never"></th>
 	          <th class="all"><strong>Domain</strong></th>
 	          <th class="never"><strong>Agency</strong></th>

track/templates/en/guidance.html

@@ -7,12 +7,12 @@
 
 {% block content %}
 <section id="main-content" class="flex-1">
-    <div class="container mx-auto items-center sm:w-4/5 xl:w-3/5 mt-6 mb-6">
-        <h1>Read guidance</h1>
-        <p>Help us make government websites more secure. Please complete the following steps to become compliant with the Government of Canada's web security standards. If you have any questions about this process, please <a href="/en/help">contact us</a>.</p>
+    <div class="container mx-auto items-center sm:w-4/5 xl:w-5/6 mt-6 mb-6">
+        <h1 class="border-0">Read guidance</h1>
+        <p class="text-2xl">Help us make government websites more secure. Please complete the following steps to become compliant with the Government of Canada's web security standards. If you have any questions about this process, please <a href="/en/help">contact us</a>.</p>
         <br/>
 
-        <ol class="text-lg mb-2 leading-normal">
+        <ol class="text-2xl mb-2 leading-normal">
 
            <li class="mb-6"> Identify key resources required to act as central point(s) of contact with TBS and the HTTPS Community of Practice.  Establish connections via the GCTools channels at:
 
@@ -71,7 +71,20 @@ <h1>Read guidance</h1>
            </li>
         </ol>
         <br/>
-        <p>For any questions or concerns related to the ITPIN and related implementation guidance, contact TBS Cybersecurity (<a href="mailto:[email protected]" class="text-https-blue hover:text-black">[email protected]</a>).</p>
+        <p class="text-2xl">For any questions or concerns related to the ITPIN and related implementation guidance, contact TBS Cybersecurity (<a href="mailto:[email protected]" class="text-https-blue hover:text-black">[email protected]</a>).</p>
     </div>
 </section>
 {% endblock %}
+
+{% block breadcrumb %}
+					{
+					 title: "Track web security compliance",
+                     href: "/en/index"
+					},
+					{
+					 title: "Guidance",
+
+					}
+
+{% endblock %}
+{% block datemodified %}2019-04-23{% endblock %}

track/templates/en/help.html

@@ -7,15 +7,28 @@
 
 {% block content %}
 <section id="main-content" class="flex-1">
-	<div class="container mx-auto items-center sm:w-4/5 xl:w-3/5 mt-6">
-		<h1>Get help</h1>
-		<h2 class=" mb-4">General public</h2>
-		<p>For interpretation of any aspect of <a class="text-https-blue hover:text-black" href="https://www.canada.ca/en/treasury-board-secretariat/services/information-technology/policy-implementation-notices/implementing-https-secure-web-connections-itpin.html">Implementing HTTPS for Secure Web Connections: Information Technology Policy Implementation Notice (ITPIN)</a>, contact Treasury Board of Canada Secretariat through Public Enquiries.</p>
+	<div class="container mx-auto items-center sm:w-4/5 xl:w-5/6 mt-6">
+		<h1 class="border-0">Get help</h1>
+		<h2 class="text-3/4 mb-4">General public</h2>
+		<p class="text-2xl">For interpretation of any aspect of <a class="text-https-blue hover:text-black" href="https://www.canada.ca/en/treasury-board-secretariat/services/information-technology/policy-implementation-notices/implementing-https-secure-web-connections-itpin.html">Implementing HTTPS for Secure Web Connections: Information Technology Policy Implementation Notice (ITPIN)</a>, contact Treasury Board of Canada Secretariat through Public Enquiries.</p>
 		<h2 class=" mt-4 mb-4">Government of Canada employees</h2>
-		<p>Individuals at departments should contact their departmental information technology group for any questions regarding this <abbr title="Information Technology Policy Implementation Notice">ITPIN</abbr>. Individuals can also join the <a href="https://gcconnex.gc.ca/groups/profile/35218846/gc-https-everywhere-2018-https-partout-dans-le-gc-2018?language=en" class="text-https-blue hover:text-black">HTTPS Everywhere group on GCconnex</a>, or the #HTTPSEverywhere channel on <a href="https://message.gccollab.ca/" class="text-https-blue hover:text-black">GCcollab Message</a>.</p>
-		<p>Individuals from a departmental information technology group may contact the <a href="mailto:[email protected]" class="text-https-blue hover:text-black">TBS Cyber Security mailbox</a> for interpretations of this <abbr title="Information Technology Policy Implementation Notice">ITPIN</abbr>.</p>
-		<p class="mb-8">Individuals with questions about the accuracy of their domain’s compliance data may contact the <a href="mailto:[email protected]" class="text-https-blue hover:text-black">TBS Cyber Security mailbox</a>. Note that compliance data does not automatically refresh. If you modified your domain recently, there may be a delay before your domain’s information updates.</p>
+		<p class="text-2xl">Individuals at departments should contact their departmental information technology group for any questions regarding this <abbr title="Information Technology Policy Implementation Notice">ITPIN</abbr>. Individuals can also join the <a href="https://gcconnex.gc.ca/groups/profile/35218846/gc-https-everywhere-2018-https-partout-dans-le-gc-2018?language=en" class="text-https-blue hover:text-black">HTTPS Everywhere group on GCconnex</a>, or the #HTTPSEverywhere channel on <a href="https://message.gccollab.ca/" class="text-https-blue hover:text-black">GCcollab Message</a>.</p>
+		<p class="text-2xl">Individuals from a departmental information technology group may contact the <a href="mailto:[email protected]" class="text-https-blue hover:text-black">TBS Cyber Security mailbox</a> for interpretations of this <abbr title="Information Technology Policy Implementation Notice">ITPIN</abbr>.</p>
+		<p class="text-2xl mb-8">Individuals with questions about the accuracy of their domain’s compliance data may contact the <a href="mailto:[email protected]" class="text-https-blue hover:text-black">TBS Cyber Security mailbox</a>. Note that compliance data does not automatically refresh. If you modified your domain recently, there may be a delay before your domain’s information updates.</p>
 	</div>
 
 </section>
 {% endblock %}
+
+{% block breadcrumb %}
+					{
+					 title: "Track web security compliance",
+                     href: "/en/index"
+					},
+					{
+					 title: "Help",
+
+					}
+
+{% endblock %}
+{% block datemodified %}2019-04-23{% endblock %}

track/templates/en/index.html

@@ -10,26 +10,22 @@
 
 <section id="main-content" class="flex-1 bg-https-light-gray py-6">
 
-		<div class="flex flex-col lg:flex-row mx-auto items-center sm:w-4/5 xl:w-3/5">
-			<div class="flex-1 lg:mr-8 lg:pr-8 mb-4 lg:mb-0">
-				<h1 class="text-4xl sm:text-5xl mb-6">Track web security compliance</h1>
-				<h2 class="text-3xl mb-2">Making government websites more secure</h2>
-				<p class="text-xl">Canadians rely on the Government of Canada to provide secure digital services. A <a class="text-https-blue hover:text-black" href="https://www.canada.ca/en/treasury-board-secretariat/services/information-technology/policy-implementation-notices/implementing-https-secure-web-connections-itpin.html">new policy notice</a> guides government websites to adopt good web security practices. Track how government sites are becoming more secure.</p>
-
-              {%  if request.headers.get("app-type","internal") == "internal"  %}
+		<div class="flex flex-col lg:flex-row mx-auto items-auto  sm:w-4/5 xl:w-5/6">
+			<div class="flex-1 mt-6 mr-6">
+				<h1 class="text-5xl sm:text-5xl mb-6 border-0">Track web security compliance</h1>
+				<h2 class="text-4xl mb-2">Making government websites more secure</h2>
+				<p class="text-3xl">Canadians rely on the Government of Canada to provide secure digital services. A <a class="text-https-blue hover:text-black" href="https://www.canada.ca/en/treasury-board-secretariat/services/information-technology/policy-implementation-notices/implementing-https-secure-web-connections-itpin.html">new policy notice</a> guides government websites to adopt good web security practices. Track how government sites are becoming more secure.</p>
 
 				<div class="flex">
-					<p class="text-xl mt-2 lg:mt-6"><a href="/en/domains/" class="text-https-blue hover:text-black">Check a government website</a></p>
+					<p class="text-3xl mt-2 lg:mt-6"><a href="/en/domains/" class="text-https-blue hover:text-black">Check a government website</a></p>
 					<object class="ml-2 lg:mt-4" type="image/svg+xml" tabindex="-1" aria-hidden="true" role="none" data="/static/images/cta-arrow.svg"></object>
 				</div>
 
-              {%  endif %}
-
 			</div>
 
 			<div class="flex-inline flex-col text-center mx-auto">
 				<div class="compliant"></div>
-				<h3 class="font-bold text-xl sm:text-2xl">Domains that <br> enforce HTTPS</h3>
+				<h3 class="font-bold text-3xl sm:text-2xl">Domains that <br> enforce HTTPS</h3>
 			</div>
 		</div>
 

track/templates/en/layout-en.html

@@ -27,7 +27,7 @@
 
 </head>
 	{% include 'includes/en/beta-bar.html' %}
-<body vocab="http://schema.org/" typeof="WebPage">
+<body vocab="http://schema.org/" typeof="WebPage" class="flex flex-1 flex-col min-h-screen">
 {% set GTM_key = "GOOGLE_TAG_MANAGER" | fetch_env() %}
 {% if GTM_key %}
 <!-- Google Tag Manager (noscript) -->
@@ -58,7 +58,7 @@
 					 href: "https://www.canada.ca/en/government/system/digital-government.html"
 					},
 					{
-					 title: "Digital Government",
+					 title: "Secure digital services",
 					 href: "https://www.canada.ca/en/government/system/digital-government/secure-digital-services.html"
 					},
 					{% block breadcrumb %}{% endblock breadcrumb %}

track/templates/en/organizations.html

@@ -18,7 +18,7 @@
 		{% include 'includes/en/header.html' %}
 
 		<div class="text-center mt-8 font-bold">
-			<div class="inline-block border-b-4 border-https-blue h-10 mr-4">By Organization</div>
+			<div class="inline-block border-b-4 border-https-blue mr-4">By Organization</div>
 			<div class="inline-block h-10 ml-4"><a href="/en/domains/" class="text-black no-underline hover:text-https-blue font-medium">By Domain</a></div>
 		</div>
 
@@ -29,7 +29,7 @@
 	    <table language="en" class="organization responsive https">
 	      <caption>HTTPS by organization. Table is sortable via first row table headers. Each row contains an organization and related attributes.</caption>
 	      <thead>
-	        <tr>
+	        <tr class="leading-tight text-2xl">
 	          <th class="never"></th>
 	          <th class="all" scope="col"><strong>Organization</strong></th>
 	          <th class="min-tablet" scope="col"><strong><abbr title="Information Technology Policy Implementation Notice">ITPIN</abbr> Compliant</strong></th>

track/templates/fr/domains.html

@@ -17,7 +17,7 @@
 
 		<div class="text-center mt-8 font-bold">
 			<div class="inline-block h-10 mr-4"><a href="/fr/organisations/" class="text-black no-underline hover:text-https-blue font-medium">Par organisation</a></div>
-			<div class="inline-block border-b-4 border-https-blue h-10 ml-4">Par domaine</div>
+			<div class="inline-block border-b-4 border-https-blue ml-4">Par domaine</div>
 		</div>
 
 	</header>
@@ -45,3 +45,26 @@
 
 <script src="/static/js/https/domains.js?{{ now() | date("%Y%m%j%H%M%S") }}"></script> 
 {% endblock %}
+
+
+{% block breadcrumb %}
+					{
+					 title: "Suivre la conformité en matière de sécurité Web",
+                     href: "/fr/index"
+					},
+					{
+					 title: "Vérifier la conformité - Par Domaine",
+
+					}
+
+{% endblock %}
+
+
+{% block pagerelatedscript %}
+
+<script src="/static/js/https/domains.js?{{ now() | date("%Y%m%j%H%M%S") }}"></script>
+
+{% endblock %}
+
+
+{% block datemodified %}2019-04-23{% endblock %}

track/templates/fr/guidance.html

@@ -7,7 +7,7 @@
 
 {% block content %}
 <section id="main-content" class="flex-1">
-	<div class="container mx-auto items-center sm:w-4/5 xl:w-3/5 mt-6 mb-6">
+	<div class="container mx-auto items-center sm:w-4/5 xl:w-5/6 mt-6 mb-6">
 		<h1>Lires les directives</h1>
 		<p>Aidez-nous à rendre les sites web du gouvernement plus sécuritaires. Veuillez compléter les étapes suivantes afin de respecter les normes de sécurité en ligne du gouvernement du Canada. Si vous avez des questions sur ce processus, <a href="/fr/aide">contactez-nous</a>.</p>
   	<br/>

track/templates/fr/index.html

@@ -10,18 +10,17 @@
 
 <section id="main-content" class="flex-1 bg-https-light-gray py-6">
 
-		<div class="flex flex-col lg:flex-row mx-auto items-center sm:w-4/5 xl:w-3/5">
+		<div class="flex flex-col lg:flex-row mx-auto items-center sm:w-4/5 xl:w-5/6">
 			<div class="flex-1 lg:mr-8 lg:pr-8 mb-4 lg:mb-0">
-				<h1 class="text-4xl sm:text-5xl mb-6">Suivre la conformité en matière de sécurité Web</h1>
+				<h1 class="text-4xl sm:text-5xl mb-6 border-0">Suivre la conformité en matière de sécurité Web</h1>
 				<h2 class="text-3xl mb-2">Rendre les sites gouvernementaux plus sécuritaires</h2>
 				<p class="text-xl">Les Canadiens s'attendent à ce que le gouvernement du Canada leur offre des services en ligne sécurisés. Un <a class="text-https-blue hover:text-black " href="https://www.canada.ca/fr/secretariat-conseil-tresor/services/technologie-information/avis-mise-oeuvre-politique/mise-oeuvre-https-connexions-web-securisees-ampti.html">nouvel avis de politique</a> vise à assurer que les sites gouvernementaux soient conformes aux bonnes pratiques en matière de sécurité Web. Voyez comment les sites gouvernementaux deviennent plus sécuritaires.</p>
 
-                {%  if request.headers.get("app-type","public") == "internal"  %}
+
 				<div class="flex">
 					<p class="text-xl mt-2 lg:mt-6"><a href="/fr/domaines/" class="text-https-blue hover:text-black ">Vérifier la conformité d’un site gouvernemental</a></p>
 					<object class="ml-2 lg:mt-4" type="image/svg+xml" tabindex="-1" role="img" aria-hidden="true" data="/static/images/cta-arrow.svg"></object>
 				</div>
-                {% endif %}
 
 			</div>
 
@@ -36,3 +35,18 @@ <h3 class=" text-xl sm:text-2xl">Domaines qui excécutent <br>  le protocole HTT
 <script src="/static/js/https/donuts.js?{{ now() | date("%Y%m%j%H%M%S") }}"></script>
 <script src="/static/js/https/organizations.js?{{ now() | date("%Y%m%j%H%M%S") }}"></script>
 {% endblock %}
+
+{% block pagerelatedscript %}
+
+<script src="/static/js/https/donuts.js?{{ now() | date("%Y%m%j%H%M%S") }}"></script>
+
+{% endblock %}
+
+{% block breadcrumb %}
+					{
+					 title: "Suivre la conformité en matière de sécurité Web"
+
+					}
+{% endblock %}
+
+{% block datemodified %}2019-04-23{% endblock %}