瀏覽代碼

fixed small accessibility issues

Bernadette Elena Hammerle 4 年之前
父節點
當前提交
da16428aa5
共有 6 個文件被更改,包括 22 次插入15 次删除
  1. 2 2
      src/Addition.js
  2. 10 2
      src/App.css
  3. 2 2
      src/Error.js
  4. 4 4
      src/Help.js
  5. 2 3
      src/Home.js
  6. 2 2
      src/Subtraction.js

+ 2 - 2
src/Addition.js

@@ -266,7 +266,7 @@ function Addition() {
 
 
   return (
-    <div id="content">
+    <main>
 
       <h1>Addition</h1>
 
@@ -332,7 +332,7 @@ function Addition() {
         showIdmtResults={showIdmtResults}
       />
 
-    </div>
+    </main>
   );
 }
 

+ 10 - 2
src/App.css

@@ -3,14 +3,18 @@
   min-height: 93vh;
 }
 
-#content{
+main{
   margin-bottom: 60px;
 }
 
-#content ul{
+main ul{
   list-style: none;
 }
 
+main ul li a{
+  color: #005bdf;
+}
+
 .dx-datagrid-focus-overlay{
   height: 0px !important;
 }
@@ -62,4 +66,8 @@ h1{
 
 input[type="text"]{
   margin: 7px;
+}
+
+#wrapper .navbar-dark .navbar-nav .nav-link{
+  color: rgba(255,255,255,.9)
 }

+ 2 - 2
src/Error.js

@@ -3,10 +3,10 @@ import "./App.css";
 
 function Subtraction() {
   return (
-    <div id="content">
+    <main>
       <h1>error 404</h1>
       <p>Sorry, this page doesn't exist.</p>
-    </div>
+    </main>
   );
 }
 

+ 4 - 4
src/Help.js

@@ -2,7 +2,7 @@ import React from "react";
 
 function Help() {
   return (
-    <div id="content">
+    <main>
       <h1>Hilfe</h1>
 
       <h2>1. Navigation</h2>
@@ -11,8 +11,8 @@ function Help() {
       </p>
 
       <ul>
-        <a href="/addition"><li>Addition</li></a>
-        <a href="/subtraction"><li>Subtraktion</li></a>
+        <li><a href="/addition">Addition</a></li>
+        <li><a href="/subtraction">Subtraktion</a></li>
       </ul>
 
       <h2>2. Eingabe der Rechnung</h2>
@@ -54,7 +54,7 @@ function Help() {
       <p>
         Um die Eingabe zu korrigieren oder eine neue Rechnung zu beginnen, muss die Seite neu geladen werden.
       </p>
-    </div>
+    </main>
   );
 }
 

+ 2 - 3
src/Home.js

@@ -2,16 +2,15 @@ import React from "react";
 
 function Home() {
   return (
-    <div id="content">
+    <main>
       <h1>Willkommen bei der MAWEN Web App</h1>
-      <p> Mawen bedeutet "Math Working environment" </p>
       <p> Derzeit sind zwei Grundrechnungsarten verf&uuml;gbar:&nbsp;
         <a href="/addition">Addition</a>
         &nbsp;und&nbsp;
         <a href="/subtraction">Subtraction</a>
         &nbsp;
       </p>
-    </div>
+    </main>
   );
 }
 

+ 2 - 2
src/Subtraction.js

@@ -308,7 +308,7 @@ function Subtraction() {
   }
 
   return (
-    <div id="content">
+    <main>
 
       <h1>Subtraction</h1>
 
@@ -374,7 +374,7 @@ function Subtraction() {
         showIdmtResults={showIdmtResults}
       />
 
-    </div>
+    </main>
   );
 }