From 5e47233feb206f5fe464b00f319e815d43f30728 Mon Sep 17 00:00:00 2001
From: Julian Matschinske <ge93nar@mytum.de>
Date: Sat, 11 Apr 2020 20:41:32 +0200
Subject: [PATCH] Video and must (and legend)
---
.../launch-analysis.component.html | 1 +
.../about-page/about-page.component.html | 4 --
.../about-page/about-page.component.scss | 4 ++
.../pages/home-page/home-page.component.html | 60 ++++++++++++-------
.../pages/home-page/home-page.component.scss | 33 +++++-----
5 files changed, 61 insertions(+), 41 deletions(-)
diff --git a/src/app/components/launch-analysis/launch-analysis.component.html b/src/app/components/launch-analysis/launch-analysis.component.html
index 3ca3ac39..f4d81847 100644
--- a/src/app/components/launch-analysis/launch-analysis.component.html
+++ b/src/app/components/launch-analysis/launch-analysis.component.html
@@ -154,6 +154,7 @@
The <a href="https://en.wikipedia.org/wiki/Steiner_tree_problem">Steiner tree</a>
problem is a classical combinatorial optimization problem. It asks to find a sub-graph
of minimum size connecting a given set of seed nodes.
+ This implementation behaves non-deterministically, so results can differ between multiple runs.
</p>
<div class="field">
<label class="label" for="multisteiner-numtrees">Number of Steiner trees to return</label>
diff --git a/src/app/pages/about-page/about-page.component.html b/src/app/pages/about-page/about-page.component.html
index 84be42ab..a8a0c4e1 100644
--- a/src/app/pages/about-page/about-page.component.html
+++ b/src/app/pages/about-page/about-page.component.html
@@ -22,17 +22,13 @@
approaches for the identification of new drug targets and new repurposable drugs.
<br>
<br>
-
For detailed information please visit our blog: <a href="https://www.exbio.de/exbio-vs-covid-part-1/"> https://www.exbio.de/exbio-vs-covid-part-1/</a>
<br>
<br>
We are constantly updating and integrating new data as it becomes available.
<br>
If you are interested to make your virus-human interactome data available via our platform, please contact us.
-
</p>
- <h2 class="subtitle">Tutorial Video</h2>
- <iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/PLxrYfuuu2o" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<h2 class="subtitle">General workflow of the platform</h2>
<ol>
<li>Select the viral interaction dataset (SARS-CoV1-Pfefferle, SARS-CoV1-VirHostNet, SARS-CoV2-Gordon).</li>
diff --git a/src/app/pages/about-page/about-page.component.scss b/src/app/pages/about-page/about-page.component.scss
index 7dc7ccfe..f2308e41 100644
--- a/src/app/pages/about-page/about-page.component.scss
+++ b/src/app/pages/about-page/about-page.component.scss
@@ -7,3 +7,7 @@ div.scroll{
height: calc(100vh - 70px);
}
+iframe {
+ margin-bottom: 100px;
+ max-width: 100%;
+}
diff --git a/src/app/pages/home-page/home-page.component.html b/src/app/pages/home-page/home-page.component.html
index caeb9d64..a9661338 100644
--- a/src/app/pages/home-page/home-page.component.html
+++ b/src/app/pages/home-page/home-page.component.html
@@ -1,31 +1,49 @@
<!--htmlhint inline-style-disabled:false -->
<div class="content landing scroll">
<div class="container has-text-centered">
- <div class="column is-6 width100">
+ <div class="column">
+ <div class="logo-box is-hidden-mobile">
+ <img src="assets/covex_logo.png" style="height: 200px; width: 600px">
+ </div>
- <img src="assets/covex_logo.png" style="height: 200px; width: 600px">
+ <div class="has-text-centered video-box">
+ <iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/H9pbYQFlt6U" frameborder="0"
+ allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>
+ </iframe>
+ </div>
- <h1 class="subtitle is-2">
- <i>Explore the </i> <b> virus-host interactome</b>
- </h1>
- <h1 class="subtitle is-2">
- <i>Find</i> <b> putative drug targets</b>
- </h1>
- <h1 class="subtitle is-2">
- <i>Repurpose</i> <b> drugs </b>
- </h1>
- <h1 class="subtitle is-3">
- <i>All in one </i><b>web-tool</b>
- </h1>
+ <div class="button-box is-hidden-mobile">
+ <button class="button has-text-info is-large is-rounded">
+ <a routerLink="/explorer" routerLinkActive="is-active">
+ <span class="icon"><i class="fa fa-project-diagram has-text-info"></i></span>
+ <span>Start App</span>
+ </a>
+ </button>
+ </div>
- <button class="button has-text-info is-large is-rounded ">
- <a routerLink="/explorer" routerLinkActive="is-active">
- <span class="icon"><i class="fa fa-project-diagram has-text-info"></i></span>
- <span>Start now!</span>
- </a>
- </button>
+ <div class="button-box is-hidden-tablet">
+ <button class="button has-text-info is-large is-rounded">
+ <a routerLink="/explorer" routerLinkActive="is-active">
+ <span class="icon"><i class="fa fa-project-diagram has-text-info"></i></span>
+ <span>Open Desktop App</span>
+ </a>
+ </button>
+ </div>
+ <div class="text-box is-hidden-mobile">
+ <h1 class="subtitle is-3">
+ Explore the virus-host interactome
+ </h1>
+ <h1 class="subtitle is-3">
+ Find putative drug targets
+ </h1>
+ <h1 class="subtitle is-3">
+ Repurpose drugs
+ </h1>
+ <h1 class="subtitle is-3">
+ All in one web-tool
+ </h1>
+ </div>
</div>
</div>
</div>
-
diff --git a/src/app/pages/home-page/home-page.component.scss b/src/app/pages/home-page/home-page.component.scss
index de8b3bdf..b3d5ed64 100644
--- a/src/app/pages/home-page/home-page.component.scss
+++ b/src/app/pages/home-page/home-page.component.scss
@@ -6,32 +6,33 @@ img {
border-radius: 25px;
}
-
-div.scroll{
+div.scroll {
overflow: auto;
height: calc(100vh - 60px);
}
-h1.subtitle.is-2 {
- color: #d0d0d0;
- font-family: "Open Sans", "Helvetica Neue", sans-serif;
+.logo-box {
+ maring-top: 20px;
+ maring-bottom: 20px;
}
-h1.subtitle.is-3 {
- color: #d0d0d0;
- font-family: "Open Sans", "Helvetica Neue", sans-serif;
+.text-box {
+ .subtitle {
+ color: #c8c8c8;
+ }
}
-div.column.is-6.width100 {
+.video-box {
+ margin-top: 40px;
+ margin-bottom: 40px;
width: 100%;
-}
-div.container.has-text-centered {
- margin-top: 10%;
+ iframe {
+ max-width: 100%;
+ }
}
-.centered {
- position: fixed; /* or absolute */
- top: 50%;
- left: 50%;
+.button-box {
+ maring-top: 40px;
+ margin-bottom: 40px;
}
--
GitLab