-
+
-
+
-
-
-
+ Content
-Content
-
-
+
- {{ cohortNumber }}
- Cohorts
-
+
+
@@ -79,34 +75,20 @@
+ {{ cohortNumber }}
+ Cohorts
-
-
- Over 1,000
- Variables Mapped
-
+
+ Over 1,000
+ Variables Mapped
Content
-
-
@@ -114,27 +96,19 @@
+
-
+ Cohorts
-
- 
-
-
-
-
-
- Here you can find an overview on the investigated cohorts, - references to the study design and links for data access - application. Additionally, there are summary statistics on key - Parkinson's disease biomarkers displayed. -
+
+
+ Cohorts
+Here you can find an overview on the investigated cohorts, references to the study design and links for data access application. Additionally, there are summary statistics on key Parkinson's disease biomarkers displayed.
Cohorts
-
-
-
+ Biomarker Overview
-
- 
-
-
+
-
-
+
+
@@ -144,33 +118,21 @@
+
Biomarker Overview
-
-
@@ -178,31 +140,19 @@
+
-
+ StudyPicker
-
- 
-
-
-
-
-
- The StudyPicker assists you in identifying suited PD data - resources for your research plans. Rank cohorts based on their - available variables and investigate further properties. -
+
+
+ StudyPicker
+The StudyPicker assists you in identifying suited PD data resources for your research plans. Rank cohorts based on their available variables and investigate further properties.
StudyPicker
-
-
-
+ Ethnoracial Diversity
-
- 
-
-
+
-
-
-
+
@@ -212,33 +162,21 @@ - The displayed chart visualizes the ethnoracial diversity across - the investigated cohorts. Following the link, you can find - individual charts per cohort illustrating their diversity. -
+
+
Ethnoracial Diversity
-
-
@@ -246,32 +184,19 @@
+
-
+ Feature Mappings
-
- 
-
-
-
-
-
- Following the link, you will find semantic mappings between - variables of the investigated datasets. Equivalent features have - been connected and highlight semantic interoperability. -
+
+
+ Feature Mappings
+Following the link, you will find semantic mappings between variables of the investigated datasets. Equivalent features have been connected and highlight semantic interoperability.
Feature Mappings
-
-
-
+ Longitudinal Follow-up
-
- 
-
-
+
-
-
-
+
@@ -281,32 +206,21 @@ - This section lets you explore interactive visualizations of the - longitudinal follow-up and participant drop-out encountered in - the included studies. Additionally, you can visualize the - longitudinal coverage of individual variables per study. -
+
+
Longitudinal Follow-up
-
-
@@ -314,32 +228,4 @@
-
-
-
diff --git a/frontend/src/app/nav-bar/nav-bar.component.spec.ts b/frontend/src/app/nav-bar/nav-bar.component.spec.ts
index 9200480..2ad3a10 100644
--- a/frontend/src/app/nav-bar/nav-bar.component.spec.ts
+++ b/frontend/src/app/nav-bar/nav-bar.component.spec.ts
@@ -42,7 +42,7 @@ describe('NavBarComponent', () => {
});
it('should render the logo with correct src and alt attributes', () => {
- const logoElement = fixture.debugElement.query(By.css('.logo img'));
+ const logoElement = fixture.debugElement.query(By.css('.img-fluid'));
expect(logoElement.nativeElement.src).toContain('assets/logos/logo.png');
expect(logoElement.nativeElement.alt).toBe('pdataviewer-logo');
});
diff --git a/frontend/src/app/study-picker/study-picker.component.css b/frontend/src/app/study-picker/study-picker.component.css
index ceb87bd..0e8f039 100644
--- a/frontend/src/app/study-picker/study-picker.component.css
+++ b/frontend/src/app/study-picker/study-picker.component.css
@@ -79,25 +79,6 @@ body {
vertical-align: middle;
}
-/* Styles for buttons */
-button {
- background-color: #007bff;
- border: none;
- color: white;
- padding: 10px 20px;
- display: inline-block;
- font-size: 16px;
- margin: 4px 2px;
- cursor: pointer;
- border-radius: 5px;
- transition: background-color 0.3s ease;
- text-align: center;
-}
-
-button:hover {
- background-color: #0056b3;
-}
-
.missing-features-cell {
max-width: 100px;
word-wrap: break-word;
diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index 1bb3e24..1ff4c85 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -1,62 +1,9 @@
/* Reset and Global Styles */
-html,
-body,
-div,
-span,
-applet,
-object,
-iframe,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p,
-blockquote,
-pre,
-a,
-abbr,
-acronym,
-address,
-big,
-cite,
-code,
-del,
-dfn,
-em,
-font,
-img,
-ins,
-kbd,
-q,
-s,
-samp,
-small,
-strike,
-strong,
-sub,
-sup,
-tt,
-var,
-b,
-u,
-i,
-center,
-dl,
-dt,
-dd,
-ol,
-ul,
-li,
-figure,
-header,
-nav,
-section,
-article,
-aside,
-footer,
-figcaption {
+html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
+blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,
+font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
+b, u, i, center, dl, dt, dd, ol, ul, li, figure, header, nav, section, article,
+aside, footer, figcaption {
margin: 0;
padding: 0;
border: 0;
@@ -65,8 +12,7 @@ figcaption {
box-sizing: border-box;
}
-html,
-body {
+html, body {
font-family: Roboto, "Helvetica Neue", sans-serif;
font-weight: 400;
background-color: #fff;
@@ -81,19 +27,12 @@ a {
text-decoration: none;
}
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-ul {
+h1, h2, h3, h4, h5, h6, ul {
margin-top: 0;
margin-bottom: 0;
}
-::selection,
-::-moz-selection {
+::selection, ::-moz-selection {
background: #1cacd7;
color: #fff;
}
@@ -108,59 +47,36 @@ ul {
background: #f9f9f9;
}
-.left-heading .section-title {
- font-weight: 500;
+.section-title {
color: #1e1e1e;
margin-bottom: 30px;
- position: relative;
- font-size: 24px;
- line-height: 42px;
- letter-spacing: 0.25px;
-}
-
-.center-text,
-.left-text {
- font-weight: 400;
- font-size: 16px;
- color: #777;
- line-height: 28px;
- letter-spacing: 1px;
-}
-
-.center-text {
+ font-size: 1.4vw;
text-align: center;
- margin-bottom: 50px;
}
-.center-text p,
-.left-text p {
- font-size: 15px;
+.text-center, .text, .text-center p, .text p {
+ text-align: center;
+ font-size: 1vw;
color: #777;
margin-bottom: 30px;
}
-a.main-button,
-button.main-button {
- font-size: 13px;
- border-radius: 20px;
- padding: 12px 20px;
- background-color: #1cacd7;
- text-transform: uppercase;
- color: #fff;
- letter-spacing: 0.25px;
- transition: all 0.3s ease 0s;
-}
-
-a.main-button:hover,
-button.main-button:hover {
- background-color: #5fb9e9;
- color: #fff;
-}
-
-button.main-button {
- outline: none;
+button {
+ background-color: #007bff;
border: none;
+ color: white;
+ padding: 10px 20px;
+ display: inline-block;
+ font-size: 0.8vw;
+ margin: 4px 2px;
cursor: pointer;
+ border-radius: 5px;
+ transition: all 0.3s ease;
+ text-align: center;
+}
+
+button:hover {
+ background-color: #0056b3;
}
.container {
@@ -169,8 +85,8 @@ button.main-button {
}
.nav-bar {
- padding-left: 400px;
- padding-right: 400px;
+ padding: 0 20%;
+ width: 100%;
}
.body {
-
+ Tools
-
-
- Tools
-
-
-
-
-
-
-
- How to Cite Us
-
-
- Yasamin Salimi, Tim Adams, Mehmet Can Ay et al. On the Utility of
- Large Language Model Embeddings for Revolutionizing Semantic Data
- Harmonization in Alzheimer's and Parkinson's Disease, 01 April
- 2024, PREPRINT (Version 1) available at Research Square [https://doi.org/10.21203/rs.3.rs-4108029/v1]
-
-
-