Merge pull request #3056 from romitgit/MSFT-122-Issue#2820

MSFT 122 Issue#2820 - fixed improper heading level structure

Author: sushilshinde

src/shared/components/challenge-detail/Header/index.jsx

@@ -261,9 +261,9 @@ export default function ChallengeHeader(props) {
         </div>
         <div styleName="prizes-ops-container">
           <div styleName="prizes-outer-container">
-            <h3 styleName="prizes-title">
+            <h2 styleName="prizes-title">
 PRIZES
-            </h3>
+            </h2>
             <Prizes prizes={prizes && prizes.length ? prizes : [0]} pointPrizes={pointPrizes} />
             {
               bonusType ? (

src/shared/components/challenge-detail/Specification/SideBar/index.jsx

@@ -100,12 +100,12 @@ DOWNLOADS:
         {
           !isDesign && !isMM && (
           <div>
-            <h3>
+            <h2>
 REVIEW STYLE:
-            </h3>
-            <h4>
+            </h2>
+            <h3>
 Final Review:
-            </h4>
+            </h3>
             <span styleName="link-like-paragraph tooltip-container">
               {reviewTypeTitle}
               <Tooltip content={reviewTip}>
@@ -114,9 +114,9 @@ Final Review:
                 </div>
               </Tooltip>
             </span>
-            <h4>
+            <h3>
 Approval:
-            </h4>
+            </h3>
             <span styleName="link-like-paragraph tooltip-container">
               User Sign-Off
               <Tooltip content={approvalTip} className={styles['tooltip-overlay']}>
@@ -131,9 +131,9 @@ Approval:
         {
           !isMM && (
           <div>
-            <h3>
+            <h2>
   CHALLENGE LINKS:
-            </h3>
+            </h2>
             {
               isDevelop && environment && environment.length > 0
               && (
@@ -181,12 +181,12 @@ Approval:
           isDesign
           && (
           <div>
-            <h3>
+            <h2>
 SUBMISSION FORMAT:
-            </h3>
-            <h4>
+            </h2>
+            <h3>
 Your Design Files:
-            </h4>
+            </h3>
             <ol>
               <li>
                 {'Look for instructions in this challenge regarding what files to provide.'}
@@ -214,9 +214,9 @@ Your Design Files:
 Read the FAQ.
               </a>
             </p>
-            <h4>
+            <h3>
 Fonts, Stock Photos, and Icons:
-            </h4>
+            </h3>
             <p styleName="link-like-paragraph">
               All fonts, stock photos, and icons within your design must be declared
               when you submit. DO NOT include any 3rd party files in your
@@ -226,9 +226,9 @@ Fonts, Stock Photos, and Icons:
                 policy.
               </a>
             </p>
-            <h4>
+            <h3>
 Screening:
-            </h4>
+            </h3>
             <p styleName="link-like-paragraph">
               All submissions are screened for eligibility before the challenge
               holder picks winners. Don
@@ -248,9 +248,9 @@ t let your hard work go to waste. Learn more about how to
                 </a>
               }
             </p>
-            <h3>
+            <h2>
 SOURCE FILES:
-            </h3>
+            </h2>
             <ul styleName="source-files-list">
               {
                 fileTypes && fileTypes.length > 0
@@ -265,9 +265,9 @@ SOURCE FILES:
             <p styleName="link-like-paragraph">
               You must include all source files with your submission.
             </p>
-            <h3>
+            <h2>
 SUBMISSION LIMIT:
-            </h3>
+            </h2>
             <p styleName="link-like-paragraph">
               {
                 submissionLimit
@@ -285,9 +285,9 @@ SUBMISSION LIMIT:
           terms.length > 0
           && (
           <div>
-            <h3>
+            <h2>
 CHALLENGE TERMS:
-            </h3>
+            </h2>
             <div styleName="link-like-paragraph">
               {
                 terms.map(t => (
@@ -306,9 +306,9 @@ CHALLENGE TERMS:
         }
         { shareable && (
           <div>
-            <h3>
+            <h2>
 SHARE:
-            </h3>
+            </h2>
             <ShareSocial />
           </div>
         )}

src/shared/components/challenge-detail/Specification/SideBar/styles.scss

@@ -91,7 +91,7 @@
     padding-bottom: 7px;
   }
 
-  h3 {
+  h2 {
     @include roboto-bold;
 
     font-size: 13px;
@@ -100,7 +100,7 @@
     padding-bottom: 2px;
   }
 
-  h4 {
+  h3 {
     @include roboto-bold;
 
     font-size: 13px;
@@ -109,7 +109,7 @@
     margin-top: 4 * $base-unit;
   }
 
-  h4:first-of-type {
+  h3:first-of-type {
     margin-top: 2 * $base-unit;
   }