Merge pull request #478 from KPMP/KPMP-5086_MinorVisualAdjustments

KPMP-5086_MinorVisualAdjustments
KPMP · Feb 7, 2024 · acc897b · acc897b
2 parents 797e3c7 + dcf283f
commit acc897b
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 12 deletions.
diff --git a/src/components/Home/DataSummary.js b/src/components/Home/DataSummary.js
@@ -22,17 +22,17 @@ class DataSummary extends Component {
                 <Row><h2 className="data-summary">Atlas Data Summary</h2></Row>
                 <Row><p>IMPORTANT: Please follow this <a href="https://www.kpmp.org/help-docs/study-overview?tabname=citingkpmpdata">citation guideline</a> when presenting or publishing data from the Kidney Tissue Atlas.</p></Row>
 
-                <h1 className="centered kpmp-color-dark"><span><FontAwesomeIcon className='kpmp-color-dark pe-2' icon={faPerson} /></span>PARTICIPANTS</h1>
+                <h3 className="centered kpmp-color-dark"><span><FontAwesomeIcon className='kpmp-color-dark pe-2' icon={faPerson} /></span>PARTICIPANTS</h3>
                 <ParticipantSummary/>
 
-                <Row><h5 className="sub-header lowered">Participants by -omics type</h5></Row>
+                <Row><h4 className="sub-header lowered">Participants by -omics type</h4></Row>
                 <Row><p>A subset of the raw data from the Data Repository has been analyzed and made available for interactive mining in Explorer and Spatial Viewer.</p></Row>
 
                 <Row>
                     <SamplesByDataTypeTableContainer/>
                 </Row>
 
-                <Row><h5 className="sub-header lowered">Files in the Data Repository by -omics type</h5></Row>
+                <Row><h4 className="sub-header lowered">Files in the Data Repository by -omics type</h4></Row>
                 <Row><p>The datasets available in the Repository are a combination of raw and processed data from KPMP participant biopsies and reference tissue samples.</p></Row>
 
                 <Row>

diff --git a/src/components/Home/TopContent.js b/src/components/Home/TopContent.js
@@ -14,15 +14,21 @@ class TopContent extends Component {
   render() {
     return (
         <Container className="landing container container-expanded mt-2 rounded border p-3 shadow-sm">
-          <Row><h3 className="subtitle">Kidney Precision Medicine Project</h3></Row>
-          <Row><h1 className="title">Kidney Tissue Atlas</h1></Row>
-          <Row><p>The Kidney Tissue Atlas is a set of interactive tools built to promote retrieval, exploration, discovery, and analysis of the KPMP data by the greater research community.</p></Row>
-          <Col xs='12'>
-              <a rel="noreferrer" target='_blank' href='https://www.kpmp.org/help-docs/data' onClick={() => {
-              this.handleGoogleAnalyticsEvent('Atlas Home', 'Navigation', 'Help: learn about data types')}}>
-                Learn more about our data types and methodologies
-            </a>
-          </Col>
+          <div><h3 className="subtitle">Kidney Precision Medicine Project</h3></div>
+          <div><h1 className="title">Kidney Tissue Atlas</h1></div>
+          <div>
+            <Col xs='12'>
+              The Kidney Tissue Atlas is a set of interactive tools built to promote retrieval, exploration, discovery, and analysis of the KPMP data by the greater research community.
+            </Col>
+          </div>
+          <div>
+            <Col xs='12'>
+                <a rel="noreferrer" target='_blank' href='https://www.kpmp.org/help-docs/data' onClick={() => {
+                this.handleGoogleAnalyticsEvent('Atlas Home', 'Navigation', 'Help: learn about data types')}}>
+                  Learn more about our data types and methodologies
+              </a>
+            </Col>
+          </div>
         </Container>
     );
   }