Accessibility: improve contrast tweaks (#34143)

HaoK · web-flow · commit cb9ed02a31b7 · 2021-07-08T21:09:34.000Z
diff --git a/src/Identity/UI/src/wwwroot/V4/css/site.css b/src/Identity/UI/src/wwwroot/V4/css/site.css
@@ -7,9 +7,13 @@ a.navbar-brand {
   word-break: break-all;
 }
 
-/* Provide sufficient contrast against white background */
 a {
-  color: #0366d6;
+  color: #0077cc;
+}
+
+.form-control:focus {
+    border-color: #0077cc;
+    box-shadow: 0 0 0 0.2rem #0077cc;
 }
 
 .btn-primary {
@@ -28,8 +32,6 @@ a {
   outline: black auto 1px;
 }
 
-/* Sticky footer styles
--------------------------------------------------- */
 html {
   font-size: 14px;
 }
@@ -63,15 +65,12 @@ button.accept-policy {
   line-height: inherit;
 }
 
-/* Sticky footer styles
--------------------------------------------------- */
 html {
   position: relative;
   min-height: 100%;
 }
 
 body {
-  /* Margin bottom by footer height */
   margin-bottom: 60px;
 }
 .footer {
@@ -80,5 +79,5 @@ body {
   width: 100%;
   overflow: scroll;
   white-space: nowrap;
-  line-height: 60px; /* Vertically center the text there */
+  line-height: 60px;
 }
diff --git a/src/ProjectTemplates/Web.ProjectTemplates/content/BlazorServerWeb-CSharp/wwwroot/css/site.css b/src/ProjectTemplates/Web.ProjectTemplates/content/BlazorServerWeb-CSharp/wwwroot/css/site.css
@@ -5,7 +5,7 @@ html, body {
 }
 
 a, .btn-link {
-    color: #0366d6;
+    color: #0077cc;
 }
 
 .btn-primary {
diff --git a/src/ProjectTemplates/Web.ProjectTemplates/content/ComponentsWebAssembly-CSharp/Client/wwwroot/css/app.css b/src/ProjectTemplates/Web.ProjectTemplates/content/ComponentsWebAssembly-CSharp/Client/wwwroot/css/app.css
@@ -5,7 +5,7 @@ html, body {
 }
 
 a, .btn-link {
-    color: #0366d6;
+    color: #0077cc;
 }
 
 .btn-primary {
diff --git a/src/ProjectTemplates/Web.ProjectTemplates/content/RazorPagesWeb-CSharp/wwwroot/css/site.css b/src/ProjectTemplates/Web.ProjectTemplates/content/RazorPagesWeb-CSharp/wwwroot/css/site.css
@@ -7,9 +7,8 @@ a.navbar-brand {
   word-break: break-all;
 }
 
-/* Provide sufficient contrast against white background */
 a {
-  color: #0366d6;
+  color: #0077cc;
 }
 
 .btn-primary {
@@ -24,8 +23,6 @@ a {
   border-color: #1861ac;
 }
 
-/* Sticky footer styles
--------------------------------------------------- */
 html {
   font-size: 14px;
 }
@@ -51,21 +48,18 @@ button.accept-policy {
   line-height: inherit;
 }
 
-/* Sticky footer styles
--------------------------------------------------- */
 html {
   position: relative;
   min-height: 100%;
 }
 
 body {
-  /* Margin bottom by footer height */
   margin-bottom: 60px;
 }
 .footer {
   position: absolute;
   bottom: 0;
   width: 100%;
   white-space: nowrap;
-  line-height: 60px; /* Vertically center the text there */
+  line-height: 60px;
 }
diff --git a/src/ProjectTemplates/Web.ProjectTemplates/content/StarterWeb-CSharp/wwwroot/css/site.css b/src/ProjectTemplates/Web.ProjectTemplates/content/StarterWeb-CSharp/wwwroot/css/site.css
@@ -7,9 +7,8 @@ a.navbar-brand {
   word-break: break-all;
 }
 
-/* Provide sufficient contrast against white background */
 a {
-  color: #0366d6;
+  color: #0077cc;
 }
 
 .btn-primary {
@@ -24,8 +23,6 @@ a {
   border-color: #1861ac;
 }
 
-/* Sticky footer styles
--------------------------------------------------- */
 html {
   font-size: 14px;
 }
@@ -51,21 +48,18 @@ button.accept-policy {
   line-height: inherit;
 }
 
-/* Sticky footer styles
--------------------------------------------------- */
 html {
   position: relative;
   min-height: 100%;
 }
 
 body {
-  /* Margin bottom by footer height */
   margin-bottom: 60px;
 }
 .footer {
   position: absolute;
   bottom: 0;
   width: 100%;
   white-space: nowrap;
-  line-height: 60px; /* Vertically center the text there */
+  line-height: 60px;
 }
diff --git a/src/ProjectTemplates/Web.ProjectTemplates/content/StarterWeb-FSharp/wwwroot/css/site.css b/src/ProjectTemplates/Web.ProjectTemplates/content/StarterWeb-FSharp/wwwroot/css/site.css
@@ -7,9 +7,8 @@ a.navbar-brand {
   word-break: break-all;
 }
 
-/* Provide sufficient contrast against white background */
 a {
-  color: #0366d6;
+  color: #0077cc;
 }
 
 .btn-primary {
@@ -24,8 +23,6 @@ a {
   border-color: #1861ac;
 }
 
-/* Sticky footer styles
--------------------------------------------------- */
 html {
   font-size: 14px;
 }
@@ -51,21 +48,18 @@ button.accept-policy {
   line-height: inherit;
 }
 
-/* Sticky footer styles
--------------------------------------------------- */
 html {
   position: relative;
   min-height: 100%;
 }
 
 body {
-  /* Margin bottom by footer height */
   margin-bottom: 60px;
 }
 .footer {
   position: absolute;
   bottom: 0;
   width: 100%;
   white-space: nowrap;
-  line-height: 60px; /* Vertically center the text there */
+  line-height: 60px;
 }

Original file line number	Diff line number	Diff line change
`@@ -7,9 +7,13 @@ a.navbar-brand {`
`7`	`7`	`word-break: break-all;`
`8`	`8`	`}`
`9`	`9`
`10`		`-/* Provide sufficient contrast against white background */`
`11`	`10`	`a {`
`12`		`- color: #0366d6;`
	`11`	`+ color: #0077cc;`
	`12`	`+}`
	`13`	`+`
	`14`	`+.form-control:focus {`
	`15`	`+ border-color: #0077cc;`
	`16`	`+ box-shadow: 0 0 0 0.2rem #0077cc;`
`13`	`17`	`}`
`14`	`18`
`15`	`19`	`.btn-primary {`
`@@ -28,8 +32,6 @@ a {`
`28`	`32`	`outline: black auto 1px;`
`29`	`33`	`}`
`30`	`34`
`31`		`-/* Sticky footer styles`
`32`		`--------------------------------------------------- */`
`33`	`35`	`html {`
`34`	`36`	`font-size: 14px;`
`35`	`37`	`}`
`@@ -63,15 +65,12 @@ button.accept-policy {`
`63`	`65`	`line-height: inherit;`
`64`	`66`	`}`
`65`	`67`
`66`		`-/* Sticky footer styles`
`67`		`--------------------------------------------------- */`
`68`	`68`	`html {`
`69`	`69`	`position: relative;`
`70`	`70`	`min-height: 100%;`
`71`	`71`	`}`
`72`	`72`
`73`	`73`	`body {`
`74`		`- /* Margin bottom by footer height */`
`75`	`74`	`margin-bottom: 60px;`
`76`	`75`	`}`
`77`	`76`	`.footer {`
`@@ -80,5 +79,5 @@ body {`
`80`	`79`	`width: 100%;`
`81`	`80`	`overflow: scroll;`
`82`	`81`	`white-space: nowrap;`
`83`		`- line-height: 60px; /* Vertically center the text there */`
	`82`	`+ line-height: 60px;`
`84`	`83`	`}`
Original file line number	Diff line number	Diff line change
`@@ -5,7 +5,7 @@ html, body {`
`5`	`5`	`}`
`6`	`6`
`7`	`7`	`a, .btn-link {`
`8`		`- color: #0366d6;`
	`8`	`+ color: #0077cc;`
`9`	`9`	`}`
`10`	`10`
`11`	`11`	`.btn-primary {`
Original file line number	Diff line number	Diff line change
`@@ -7,9 +7,8 @@ a.navbar-brand {`
`7`	`7`	`word-break: break-all;`
`8`	`8`	`}`
`9`	`9`
`10`		`-/* Provide sufficient contrast against white background */`
`11`	`10`	`a {`
`12`		`- color: #0366d6;`
	`11`	`+ color: #0077cc;`
`13`	`12`	`}`
`14`	`13`
`15`	`14`	`.btn-primary {`
`@@ -24,8 +23,6 @@ a {`
`24`	`23`	`border-color: #1861ac;`
`25`	`24`	`}`
`26`	`25`
`27`		`-/* Sticky footer styles`
`28`		`--------------------------------------------------- */`
`29`	`26`	`html {`
`30`	`27`	`font-size: 14px;`
`31`	`28`	`}`
`@@ -51,21 +48,18 @@ button.accept-policy {`
`51`	`48`	`line-height: inherit;`
`52`	`49`	`}`
`53`	`50`
`54`		`-/* Sticky footer styles`
`55`		`--------------------------------------------------- */`
`56`	`51`	`html {`
`57`	`52`	`position: relative;`
`58`	`53`	`min-height: 100%;`
`59`	`54`	`}`
`60`	`55`
`61`	`56`	`body {`
`62`		`- /* Margin bottom by footer height */`
`63`	`57`	`margin-bottom: 60px;`
`64`	`58`	`}`
`65`	`59`	`.footer {`
`66`	`60`	`position: absolute;`
`67`	`61`	`bottom: 0;`
`68`	`62`	`width: 100%;`
`69`	`63`	`white-space: nowrap;`
`70`		`- line-height: 60px; /* Vertically center the text there */`
	`64`	`+ line-height: 60px;`
`71`	`65`	`}`