A11y and Responsive fixes (#208)

* Luke Special - Making styles B&W * Fixing Buttons and order of header elements on all pages * Navbar and Food Banks Updates * Fixing A11y issues * Fixing A11y due to iFrame placement * Adding A11y * A11y Updates * A11y Changes * A11y fix updating to reflect naming convention * A11y * Update index.html * Update index.html * Update index.html * Adding Post Template * Updating news templates * Update post.html * News Updates * Create post 2.html * A11y Fixes * A11y * Delete post 2.html * Update index.js * A11y and Responsive Updates Co-authored-by: Aaron Hans <[email protected]>
cagov · Jan 15, 2020 · ce5a043 · ce5a043
1 parent 8ebd685
commit ce5a043
Show file tree

Hide file tree

Showing 5 changed files with 24 additions and 10 deletions.
diff --git a/src/css/_alpha.scss b/src/css/_alpha.scss
@@ -1245,8 +1245,21 @@ li.lead {
   .one-column-fix {
 	margin-top: -2px;
 }
+
+.card-body {
+     padding: 5px;
+}
+
+.list-group {
+     margin-left: -.6rem;
+}
+
+cwds-step-list li .step-interior {
+    padding-left: 20px;
 
 }
+
+}
 
 
 .smcx-iframe-container {

diff --git a/src/es/services/state-california-employee-holidays/index.html b/src/es/services/state-california-employee-holidays/index.html
@@ -65,9 +65,9 @@ <h2>Proxímos días festivos</h2>
 
           <cwds-accordion>
             <div class="card">
-              <div class="card-header accordion-alpha" id="heading-one">
+              <div class="card-header accordion-alpha pr-5" id="heading-one">
                 <button class="btn btn-link mb-n3" type="button" aria-expanded="false">
-                  <h3 class="pl-3 h4">Días festivos de 2020</h3>
+                  <h3 class="pl-2 h4">Días festivos de 2020</h3>
                 </button>
               </div>
               <div class="card-container collapsed" aria-labelledby="heading-one">
@@ -161,9 +161,9 @@ <h4>Días festivos adicionales</h4>
         <div class="column mb-20">
           <cwds-accordion>
             <div class="card">
-              <div class="card-header accordion-alpha" id="heading-two">
+              <div class="card-header accordion-alpha pr-5" id="heading-two">
                 <button class="btn btn-link mb-n3" type="button" aria-expanded="false">
-                  <h3 class="pl-3 h4">Días festivos de 2021</h3>
+                  <h3 class="pl-2 h4">Días festivos de 2021</h3>
                 </button>
               </div>
               <div class="card-container collapsed" aria-labelledby="heading-two">
@@ -258,9 +258,9 @@ <h4>Días festivos adicionales</h4>
           <a id="credits">
             <cwds-accordion class="js-credits">
               <div class="card">
-                <div class="card-header accordion-alpha" id="heading-three">
+                <div class="card-header accordion-alpha pr-5" id="heading-three">
                   <button class="btn btn-link js-credit-button mb-n3" type="button" aria-expanded="false">
-                    <h3 class="pl-3 h4 text-left" >Más información sobre días festivos del estado</h3>
+                    <h3 class="pl-2 h4 text-left" >Más información sobre días festivos del estado</h3>
                   </button>
                 </div>
                 <div class="card-container collapsed" aria-labelledby="heading-three">

diff --git a/src/js/minwage/index.js b/src/js/minwage/index.js
@@ -183,7 +183,7 @@ function buildDisplay(wageJson) {
           <div class="card mb-3" >
             <div class="card-header accordion-alpha" id="heading${label}">
               <button class="btn" type="button" aria-expanded="false">
-                <h3 class="pl-3 h4 mb-n1 pr-5 text-left">${translations["Minimum wage increases on"]} ${new Date(label).toLocaleDateString('en-US', options)} </h3>
+                <h3 class="pl-2 h4 mb-n1 pr-4 text-left">${translations["Minimum wage increases on"]} ${new Date(label).toLocaleDateString('en-US', options)} </h3>
               </button>
             </div>
             <div class="card-container collapsed" aria-labelledby="heading${label}">

diff --git a/src/partials/footer.html b/src/partials/footer.html
@@ -5,6 +5,7 @@
         <ul class="list-group list list-group-horizontal-lg flex-fill list-group-flush">
 			<li class="list-group-item alpha-footer border-0">© State of California</li>        
             <li class="list-group-item alpha-footer"><a href="/about/">About</a></li>
+			<li class="list-group-item alpha-footer"><a href="https://news.alpha.ca.gov/">News</a></li>
             <li class="list-group-item alpha-footer"><a href="/feedback/">Feedback</a></li>          
         </ul>
       </div>

diff --git a/src/services/state-california-employee-holidays/index.html b/src/services/state-california-employee-holidays/index.html
@@ -66,7 +66,7 @@ <h2>Upcoming holidays</h2>
 
           <cwds-accordion>
             <div class="card">
-              <div class="card-header accordion-alpha" id="heading-one">
+              <div class="card-header accordion-alpha pr-3" id="heading-one">
                 <button class="btn mb-n3" type="button" aria-expanded="false">
                   <h3 class="pl-3 h4">2020 holidays</h3>
                 </button>
@@ -162,7 +162,7 @@ <h4>Other holidays</h4>
         <div class="column mb-20">
           <cwds-accordion>
             <div class="card">
-              <div class="card-header accordion-alpha" id="heading-two">
+              <div class="card-header accordion-alpha pr-3" id="heading-two">
                 <button class="btn mb-n3" type="button" aria-expanded="false">
                   <h3 class="pl-3 h4">2021 holidays</h3>
                 </button>
@@ -259,7 +259,7 @@ <h4>Other holidays</h4>
           <a id="credits">
             <cwds-accordion class="js-credits">
               <div class="card">
-                <div class="card-header accordion-alpha" id="heading-three">
+                <div class="card-header accordion-alpha pr-3" id="heading-three">
                   <button class="btn js-credit-button mb-n3" type="button" aria-expanded="false">
                     <h3 class="pl-3 h4 text-left" >More details about holidays</h3>
                   </button>