about summary refs log tree commit diff
path: root/uploader/templates
diff options
context:
space:
mode:
Diffstat (limited to 'uploader/templates')
-rw-r--r--uploader/templates/background-jobs/base.html10
-rw-r--r--uploader/templates/background-jobs/delete-job.html61
-rw-r--r--uploader/templates/background-jobs/job-status.html45
-rw-r--r--uploader/templates/background-jobs/job-summary.html75
-rw-r--r--uploader/templates/background-jobs/list-jobs.html79
-rw-r--r--uploader/templates/background-jobs/macro-display-job-details.html29
-rw-r--r--uploader/templates/background-jobs/stop-job.html61
-rw-r--r--uploader/templates/base.html120
-rw-r--r--uploader/templates/cli-output.html2
-rw-r--r--uploader/templates/genotypes/base.html31
-rw-r--r--uploader/templates/genotypes/list-genotypes.html17
-rw-r--r--uploader/templates/genotypes/list-markers.html22
-rw-r--r--uploader/templates/genotypes/view-dataset.html16
-rw-r--r--uploader/templates/index.html229
-rw-r--r--uploader/templates/login.html12
-rw-r--r--uploader/templates/macro-forms.html9
-rw-r--r--uploader/templates/phenotypes/add-phenotypes-base.html31
-rw-r--r--uploader/templates/phenotypes/add-phenotypes-raw-files.html36
-rw-r--r--uploader/templates/phenotypes/add-phenotypes-with-rqtl2-bundle.html18
-rw-r--r--uploader/templates/phenotypes/base.html36
-rw-r--r--uploader/templates/phenotypes/confirm-delete-phenotypes.html196
-rw-r--r--uploader/templates/phenotypes/create-dataset.html5
-rw-r--r--uploader/templates/phenotypes/edit-phenotype.html2
-rw-r--r--uploader/templates/phenotypes/job-status.html55
-rw-r--r--uploader/templates/phenotypes/load-phenotypes-success.html20
-rw-r--r--uploader/templates/phenotypes/macro-display-pheno-dataset-card.html28
-rw-r--r--uploader/templates/phenotypes/macro-display-preview-table.html24
-rw-r--r--uploader/templates/phenotypes/review-job-data.html4
-rw-r--r--uploader/templates/phenotypes/view-dataset.html156
-rw-r--r--uploader/templates/phenotypes/view-phenotype.html75
-rw-r--r--uploader/templates/platforms/base.html22
-rw-r--r--uploader/templates/platforms/create-platform.html20
-rw-r--r--uploader/templates/platforms/list-platforms.html5
-rw-r--r--uploader/templates/populations/base.html28
-rw-r--r--uploader/templates/populations/create-population.html18
-rw-r--r--uploader/templates/populations/list-populations.html7
-rw-r--r--uploader/templates/populations/macro-display-population-card.html40
-rw-r--r--uploader/templates/populations/view-population.html199
-rw-r--r--uploader/templates/publications/base.html13
-rw-r--r--uploader/templates/publications/create-publication.html23
-rw-r--r--uploader/templates/publications/delete-publication-success.html18
-rw-r--r--uploader/templates/publications/delete-publication.html95
-rw-r--r--uploader/templates/publications/edit-publication.html17
-rw-r--r--uploader/templates/publications/index.html59
-rw-r--r--uploader/templates/publications/view-publication.html2
-rw-r--r--uploader/templates/samples/base.html29
-rw-r--r--uploader/templates/samples/list-samples.html50
-rw-r--r--uploader/templates/samples/upload-failure.html5
-rw-r--r--uploader/templates/samples/upload-progress.html5
-rw-r--r--uploader/templates/samples/upload-samples.html97
-rw-r--r--uploader/templates/samples/upload-success.html5
-rw-r--r--uploader/templates/species/base.html21
-rw-r--r--uploader/templates/species/macro-display-species-card.html29
-rw-r--r--uploader/templates/species/view-species.html171
54 files changed, 1627 insertions, 855 deletions
diff --git a/uploader/templates/background-jobs/base.html b/uploader/templates/background-jobs/base.html
new file mode 100644
index 0000000..7201207
--- /dev/null
+++ b/uploader/templates/background-jobs/base.html
@@ -0,0 +1,10 @@
+{%extends "base.html"%}
+
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
+  <a href="{{url_for('background-jobs.list_jobs')}}">
+    background jobs
+  </a>
+</li>
+{%endblock%}
diff --git a/uploader/templates/background-jobs/delete-job.html b/uploader/templates/background-jobs/delete-job.html
new file mode 100644
index 0000000..242c775
--- /dev/null
+++ b/uploader/templates/background-jobs/delete-job.html
@@ -0,0 +1,61 @@
+{%extends "background-jobs/base.html"%}
+{%from "flash_messages.html" import flash_all_messages%}
+{%from "background-jobs/macro-display-job-details.html" import display_job_details%}
+
+{%block title%}Background Jobs{%endblock%}
+
+{%block pagetitle%}Background Jobs{%endblock%}
+
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
+  <a href="{{url_for('background-jobs.job_summary', job_id=job.job_id)}}">
+    summary
+  </a>
+</li>
+{%endblock%}
+
+{%block contents%}
+{{flash_all_messages()}}
+
+<div class="row">
+  <h2 class="heading">background jobs: delete?</h2>
+
+  <p class="text-danger">Are you sure you want to delete the job below?</p>
+
+  {{display_job_details(job, display_datetime)}}
+</div>
+
+<div class="row">
+  <form id="frm-delete-job"
+        method="POST"
+        action="{{url_for('background-jobs.delete_single', job_id=job.job_id)}}">
+    <div class="row">
+      <div class="col">
+        <input type="submit"
+               class="btn btn-info"
+               value="cancel"
+               name="btn-confirm-delete" />
+      </div>
+      <div class="col">
+        <input type="submit"
+               class="btn btn-danger"
+               value="delete"
+               name="btn-confirm-delete" />
+      </div>
+    </div>
+  </form>
+</div>
+{%endblock%}
+
+
+{%block sidebarcontents%}
+<div class="row">
+  <h6 class="subheading">What is this?</h6>
+</div>
+<div class="row">
+  <p>Confirm whether or not you want to delete job
+    <strong>{{job.job_id}}</strong>.</p>
+</div>
+{{super()}}
+{%endblock%}
diff --git a/uploader/templates/background-jobs/job-status.html b/uploader/templates/background-jobs/job-status.html
new file mode 100644
index 0000000..2e75c6d
--- /dev/null
+++ b/uploader/templates/background-jobs/job-status.html
@@ -0,0 +1,45 @@
+{%extends "background-jobs/base.html"%}
+{%from "background-jobs/macro-display-job-details.html" import display_job_details%}
+
+{%from "flash_messages.html" import flash_all_messages%}
+
+{%block extrameta%}
+<meta http-equiv="refresh" content="5" />
+{%endblock%}
+
+{%block title%}Background Jobs{%endblock%}
+
+{%block pagetitle%}Background Jobs{%endblock%}
+
+{%block contents%}
+{{flash_all_messages()}}
+
+<div class="row">
+  <h2 class="heading">job status</h2>
+
+  {{display_job_details(job, display_datetime)}}
+</div>
+
+<div class="row">
+  <div class="col">
+    <a href="{{url_for('background-jobs.stop_job', job_id=job.job_id)}}"
+       title="Stop/Kill this job."
+       class="btn btn-danger">stop job</a>
+  </div>
+</div>
+
+<div class="row">
+  <h3 class="subheading">STDOUT</h3>
+  <div style="max-width: 40em; overflow: scroll">
+    <pre>{{job["stdout"]}}</pre>
+  </div>
+</div>
+
+<div class="row">
+  <h3 class="subheading">STDERR</h3>
+  <div style="max-width: 40em; overflow: scroll">
+    <pre>{{job["stderr"]}}</pre>
+  </div>
+</div>
+
+{%endblock%}
diff --git a/uploader/templates/background-jobs/job-summary.html b/uploader/templates/background-jobs/job-summary.html
new file mode 100644
index 0000000..ef9ef6c
--- /dev/null
+++ b/uploader/templates/background-jobs/job-summary.html
@@ -0,0 +1,75 @@
+{%extends "background-jobs/base.html"%}
+{%from "flash_messages.html" import flash_all_messages%}
+{%from "background-jobs/macro-display-job-details.html" import display_job_details%}
+
+{%block title%}Background Jobs{%endblock%}
+
+{%block pagetitle%}Background Jobs{%endblock%}
+
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
+  <a href="{{url_for('background-jobs.job_summary', job_id=job.job_id)}}">
+    summary
+  </a>
+</li>
+{%endblock%}
+
+{%block contents%}
+{{flash_all_messages()}}
+
+<div class="row">
+  <h2 class="heading">background jobs: summary</h2>
+
+  {{display_job_details(job, display_datetime)}}
+</div>
+
+<div class="row">
+  {%if view_under_construction%}
+  <div class="col">
+    <a href="#"
+       class="btn btn-info not-implemented"
+       title="Update the expiry date and time for this job.">update expiry</a>
+  </div>
+
+  {%if job.metadata.status in ("stopped",)%}
+  <div class="col">
+    <a href="#"
+       class="btn btn-warning not-implemented"
+       title="Create a new copy of this job, and run the copy.">Run Copy</a>
+  </div>
+  {%endif%}
+  {%endif%}
+
+  <div class="col">
+    <a href="{{url_for('background-jobs.delete_single', job_id=job.job_id)}}"
+       class="btn btn-danger"
+       title="Delete this job.">delete</a>
+  </div>
+</div>
+
+<div class="row">
+  <h3 class="subheading">Script Errors and Logging</h3>
+  <div style="max-width: 40em; overflow: scroll">
+    <pre>{{job["stderr"]}}</pre>
+  </div>
+</div>
+
+<div class="row">
+  <h3 class="subheading">Script Output</h3>
+  <div style="max-width: 40em; overflow: scroll">
+    <pre>{{job["stdout"]}}</pre>
+  </div>
+</div>
+{%endblock%}
+
+
+{%block sidebarcontents%}
+<div class="row">
+  <h6 class="subheading">What is this?</h6>
+</div>
+<div class="row">
+  <p>This page shows the results of running job '{{job.job_id}}'.</p>
+</div>
+{{super()}}
+{%endblock%}
diff --git a/uploader/templates/background-jobs/list-jobs.html b/uploader/templates/background-jobs/list-jobs.html
new file mode 100644
index 0000000..c16b850
--- /dev/null
+++ b/uploader/templates/background-jobs/list-jobs.html
@@ -0,0 +1,79 @@
+{%extends "background-jobs/base.html"%}
+{%from "flash_messages.html" import flash_all_messages%}
+
+{%block title%}Background Jobs{%endblock%}
+
+{%block pagetitle%}Background Jobs{%endblock%}
+
+{%block contents%}
+{{flash_all_messages()}}
+
+<div class="row"><h2 class="heading">Background Jobs</h2></div>
+
+<div class="row">
+  <div class="table-responsive">
+    <table class="table">
+      <thead>
+        <tr class="table-primary">
+          <th>Type</th>
+          <th>Created</th>
+          <th title="Date and time past which the job's details will be deleted from the system.">
+            Expires</th>
+          <th>Status</th>
+          <th>Actions</th>
+        </tr>
+      </thead>
+
+      <tbody>
+        {%for job in jobs%}
+        <tr>
+          <td>{{job.metadata["job-type"]}}</td>
+          <td>{{display_datetime(job.created)}}</td>
+          <td title="Date and time past which the job's details will be deleted from the system.">
+            {{display_datetime(job.expires)}}
+          </td>
+          <td {%if job.metadata.status == "completed"%}
+              class="fw-bold text-capitalize text-success"
+              {%elif job.metadata.status == "error"%}
+              class="fw-bold text-capitalize text-danger"
+              {%elif job.metadata.status == "stopped"%}
+              class="fw-bold text-capitalize text-warning"
+              {%else%}
+              class="fw-bold text-capitalize text-info"
+              {%endif%}>
+            <div>
+              {{job.metadata.status}}
+            </div>
+          </td>
+          <td>
+            <a href="{{url_for('background-jobs.job_summary', job_id=job.job_id)}}"
+               class="btn btn-info"
+               title="View more detailed information about this job.">
+              view summary</a>
+          </td>
+        </tr>
+        {%else%}
+        <tr>
+          <td colspan="5">
+            You do not have any jobs you have run in the background.</td>
+        </tr>
+        {%endfor%}
+      </tbody>
+    </table>
+  </div>
+</div>
+{%endblock%}
+
+
+{%block sidebarcontents%}
+<div class="row">
+  <h6 class="subheading">What is this?</h6>
+</div>
+<div class="row">
+  <p>The table lists the jobs that are running in the background, that you
+    started.</p>
+  <p>You can use the tools provided on this page to manage the jobs, and to view
+    each job's details.</p>
+</div>
+{{super()}}
+{%endblock%}
diff --git a/uploader/templates/background-jobs/macro-display-job-details.html b/uploader/templates/background-jobs/macro-display-job-details.html
new file mode 100644
index 0000000..82e33c0
--- /dev/null
+++ b/uploader/templates/background-jobs/macro-display-job-details.html
@@ -0,0 +1,29 @@
+{%macro display_job_details(job, display_datetime)%}
+<table class="table">
+  <thead>
+  </thead>
+
+  <tbody>
+    <tr>
+      <th class="table-primary">Job ID</th>
+      <td>{{job.job_id}}</td>
+    </tr>
+    <tr>
+      <th class="table-primary">Type</th>
+      <td>{{job.metadata["job-type"]}}</td>
+    </tr>
+    <tr>
+      <th class="table-primary">Created</th>
+      <td>{{display_datetime(job.created)}}</td>
+    </tr>
+    <tr>
+      <th class="table-primary">Expires</th>
+      <td>{{display_datetime(job.expires)}}</td>
+    </tr>
+    <tr>
+      <th class="table-primary">Status</th>
+      <td>{{job.metadata.status}}</td>
+    </tr>
+  </tbody>
+</table>
+{%endmacro%}
diff --git a/uploader/templates/background-jobs/stop-job.html b/uploader/templates/background-jobs/stop-job.html
new file mode 100644
index 0000000..fc190ac
--- /dev/null
+++ b/uploader/templates/background-jobs/stop-job.html
@@ -0,0 +1,61 @@
+{%extends "background-jobs/base.html"%}
+{%from "flash_messages.html" import flash_all_messages%}
+{%from "background-jobs/macro-display-job-details.html" import display_job_details%}
+
+{%block title%}Background Jobs{%endblock%}
+
+{%block pagetitle%}Background Jobs{%endblock%}
+
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
+  <a href="{{url_for('background-jobs.job_summary', job_id=job.job_id)}}">
+    summary
+  </a>
+</li>
+{%endblock%}
+
+{%block contents%}
+{{flash_all_messages()}}
+
+<div class="row">
+  <h2 class="heading">background jobs: stop?</h2>
+
+  <p class="text-danger">Are you sure you want to stop the job below?</p>
+
+  {{display_job_details(job, display_datetime)}}
+</div>
+
+<div class="row">
+  <form id="frm-stop-job"
+        method="POST"
+        action="{{url_for('background-jobs.stop_job', job_id=job.job_id)}}">
+    <div class="row">
+      <div class="col">
+        <input type="submit"
+               class="btn btn-info"
+               value="cancel"
+               name="btn-confirm-stop" />
+      </div>
+      <div class="col">
+        <input type="submit"
+               class="btn btn-danger"
+               value="stop"
+               name="btn-confirm-stop" />
+      </div>
+    </div>
+  </form>
+</div>
+{%endblock%}
+
+
+{%block sidebarcontents%}
+<div class="row">
+  <h6 class="subheading">What is this?</h6>
+</div>
+<div class="row">
+  <p>Confirm whether or not you want to stop job
+    <strong>{{job.job_id}}</strong>.</p>
+</div>
+{{super()}}
+{%endblock%}
diff --git a/uploader/templates/base.html b/uploader/templates/base.html
index 3c0d0d4..ae4ecef 100644
--- a/uploader/templates/base.html
+++ b/uploader/templates/base.html
@@ -16,7 +16,11 @@
     <link rel="stylesheet" type="text/css"
           href="{{url_for('base.datatables',
                 filename='css/dataTables.bootstrap5.min.css')}}" />
-    <link rel="stylesheet" type="text/css" href="/static/css/styles.css" />
+    <link rel="stylesheet" type="text/css" href="/static/css/layout-common.css" />
+    <link rel="stylesheet" type="text/css" href="/static/css/layout-large.css" />
+    <link rel="stylesheet" type="text/css" href="/static/css/layout-medium.css" />
+    <link rel="stylesheet" type="text/css" href="/static/css/layout-small.css" />
+    <link rel="stylesheet" type="text/css" href="/static/css/theme.css" />
 
     {%block css%}{%endblock%}
 
@@ -26,14 +30,32 @@
     <header id="header">
       <span id="header-text">GeneNetwork</span>
       <nav id="header-nav">
-        <ul class="nav justify-content-end">
+        <ul class="nav">
+          {%if user_logged_in()%}
+          <li>
+            <a href="{{url_for('background-jobs.list_jobs')}}"
+               title="User's background jobs.">
+              <!-- https://icons.getbootstrap.com/icons/back/ -->
+              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-back" viewBox="0 0 16 16">
+                <path d="M0 2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v2h2a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-2H2a2 2 0 0 1-2-2zm2-1a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1z"/>
+              </svg>
+              Background jobs
+            </a>
+          </li>
+
           <li>
-            {%if user_logged_in()%}
             <a href="{{url_for('oauth2.logout')}}"
                title="Log out of the system">
+              <!-- https://icons.getbootstrap.com/icons/file-person/ -->
+              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-file-person" viewBox="0 0 16 16">
+                <path d="M12 1a1 1 0 0 1 1 1v10.755S12 11 8 11s-5 1.755-5 1.755V2a1 1 0 0 1 1-1zM4 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2z"/>
+                <path d="M8 10a3 3 0 1 0 0-6 3 3 0 0 0 0 6"/>
+              </svg>
               <span class="glyphicon glyphicon-user"></span>
-              {{user_email()}} Sign Out</a>
-            {%else%}
+              Sign Out ({{user_email()}})</a>
+          </li>
+          {%else%}
+          <li>
             <a href="{{authserver_authorise_uri()}}"
                title="Log in to the system">Sign In</a>
             {%endif%}
@@ -42,91 +64,29 @@
       </nav>
     </header>
 
-    <aside id="nav-sidebar">
-      <ul class="nav flex-column">
-        <li {%if activemenu=="home"%}class="activemenu"{%endif%}>
-          <a href="/" >Home</a></li>
-        <li {%if activemenu=="publications"%}class="activemenu"{%endif%}>
-          <a href="{{url_for('publications.index')}}"
-             title="View and manage publications.">Publications</a></li>
-        <li {%if activemenu=="species"%}class="activemenu"{%endif%}>
-          <a href="{{url_for('species.list_species')}}"
-             title="View and manage species information.">Species</a></li>
-        <li {%if activemenu=="platforms"%}class="activemenu"{%endif%}>
-          <a href="{{url_for('species.platforms.index')}}"
-             title="View and manage species platforms.">Sequencing Platforms</a></li>
-        <li {%if activemenu=="populations"%}class="activemenu"{%endif%}>
-          <a href="{{url_for('species.populations.index')}}"
-             title="View and manage species populations.">Populations</a></li>
-        <li {%if activemenu=="samples"%}class="activemenu"{%endif%}>
-          <a href="{{url_for('species.populations.samples.index')}}"
-             title="Upload population samples.">Samples</a></li>
-        <li {%if activemenu=="genotypes"%}class="activemenu"{%endif%}>
-          <a href="{{url_for('species.populations.genotypes.index')}}"
-             title="Upload Genotype data.">Genotype Data</a></li>
-        <!--
-            TODO: Maybe include menus here for managing studies and dataset or
-            maybe have the studies/datasets managed under their respective
-            sections, e.g. "Publish*" studies/datasets under the "Phenotypes"
-            section, "ProbeSet*" studies/datasets under the "Expression Data"
-            sections, etc.
-          -->
-        <li {%if activemenu=="phenotypes"%}class="activemenu"{%endif%}>
-          <a href="{{url_for('species.populations.phenotypes.index')}}"
-             title="Upload phenotype data.">Phenotype Data</a></li>
-        <!--
-        <li {%if activemenu=="expression-data"%}class="activemenu"{%endif%}>
-          <a href="{{url_for('species.populations.expression-data.index')}}"
-             title="Upload expression data."
-             class="not-implemented">Expression Data</a></li>
-        <li {%if activemenu=="individuals"%}class="activemenu"{%endif%}>
-          <a href="#"
-             class="not-implemented"
-             title="Upload individual data.">Individual Data</a></li>
-        <li {%if activemenu=="rna-seq"%}class="activemenu"{%endif%}>
-          <a href="#"
-             class="not-implemented"
-             title="Upload RNA-Seq data.">RNA-Seq Data</a></li>
-        <li {%if activemenu=="async-jobs"%}class="activemenu"{%endif%}>
-          <a href="#"
-             class="not-implemented"
-             title="View and manage the backgroud jobs you have running">
-            Background Jobs</a></li>
-        -->
-      </ul>
-    </aside>
 
     <main id="main" class="main">
+      <nav id="breadcrumbs" aria-label="breadcrumb">
+        <ol class="breadcrumb">
+          {%block breadcrumbs%}
+          <li class="breadcrumb-item">
+            <a href="{{url_for('base.index')}}">Home</a></li>
+          {%endblock%}
+        </ol>
+      </nav>
 
-      <div id="pagetitle" class="pagetitle">
-        <span class="title">Data Upload and Quality Control: {%block pagetitle%}{%endblock%}</span>
-        <!--
-            <nav>
-              <ol class="breadcrumb">
-                <li {%if activelink is not defined or activelink=="home"%}
-                    class="breadcrumb-item active"
-                    {%else%}
-                    class="breadcrumb-item"
-                    {%endif%}>
-                  <a href="{{url_for('base.index')}}">Home</a>
-                </li>
-                {%block lvl1_breadcrumbs%}{%endblock%}
-              </ol>
-            </nav>
-            -->
-      </div>
-
-      <div id="all-content">
-        <div id="main-content">
+      <div id="main-content">
           {%block contents%}{%endblock%}
         </div>
-        <div id="sidebar-content">
+
+      <div id="sidebar-content">
           {%block sidebarcontents%}{%endblock%}
         </div>
-      </div>
     </main>
 
 
+
+    <script type="text/javascript" src="/static/js/debug.js"></script>
     <!--
         Core dependencies
       -->
diff --git a/uploader/templates/cli-output.html b/uploader/templates/cli-output.html
index 64b1a9a..9cff09d 100644
--- a/uploader/templates/cli-output.html
+++ b/uploader/templates/cli-output.html
@@ -1,7 +1,7 @@
 {%macro cli_output(job, stream)%}
 
 <h4 class="subheading">{{stream | upper}} Output</h4>
-<div class="cli-output" style="max-height: 10em; overflow: auto;">
+<div class="cli-output" style="overflow: auto;">
   <pre>{{job.get(stream, "")}}</pre>
 </div>
 
diff --git a/uploader/templates/genotypes/base.html b/uploader/templates/genotypes/base.html
index 7d61312..8d1b951 100644
--- a/uploader/templates/genotypes/base.html
+++ b/uploader/templates/genotypes/base.html
@@ -1,23 +1,18 @@
 {%extends "populations/base.html"%}
+{%from "populations/macro-display-population-card.html" import display_sui_population_card%}
 
-{%block lvl3_breadcrumbs%}
-<li {%if activelink=="genotypes"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  {%if population is mapping%}
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
   <a href="{{url_for('species.populations.genotypes.list_genotypes',
-           species_id=species.SpeciesId,
-           population_id=population.Id)}}">
-    {%if dataset is defined and dataset is mapping%}
-    {{dataset.Name}}
-    {%else%}
-    Genotypes
-    {%endif%}</a>
-  {%else%}
-  <a href="{{url_for('species.populations.genotypes.index')}}">Genotypes</a>
-  {%endif%}
+           species_id=species['SpeciesId'],
+           population_id=population['Id'])}}">
+    genotype
+  </a>
 </li>
-{%block lvl4_breadcrumbs%}{%endblock%}
+{%endblock%}
+
+
+{%block sidebarcontents%}
+{{display_sui_population_card(species, population)}}
 {%endblock%}
diff --git a/uploader/templates/genotypes/list-genotypes.html b/uploader/templates/genotypes/list-genotypes.html
index 0f074fd..a2b98c8 100644
--- a/uploader/templates/genotypes/list-genotypes.html
+++ b/uploader/templates/genotypes/list-genotypes.html
@@ -1,23 +1,10 @@
 {%extends "genotypes/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
-{%from "populations/macro-display-population-card.html" import display_population_card%}
 
 {%block title%}Genotypes{%endblock%}
 
 {%block pagetitle%}Genotypes{%endblock%}
 
-{%block lvl4_breadcrumbs%}
-<li {%if activelink=="list-genotypes"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  <a href="{{url_for('species.populations.genotypes.list_genotypes',
-           species_id=species.SpeciesId,
-           population_id=population.Id)}}">List genotypes</a>
-</li>
-{%endblock%}
-
 {%block contents%}
 {{flash_all_messages()}}
 
@@ -143,7 +130,3 @@
     all the rest.</p>
 </div>
 {%endblock%}
-
-{%block sidebarcontents%}
-{{display_population_card(species, population)}}
-{%endblock%}
diff --git a/uploader/templates/genotypes/list-markers.html b/uploader/templates/genotypes/list-markers.html
index a705ae3..22189c7 100644
--- a/uploader/templates/genotypes/list-markers.html
+++ b/uploader/templates/genotypes/list-markers.html
@@ -1,20 +1,18 @@
 {%extends "genotypes/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
-{%from "species/macro-display-species-card.html" import display_species_card%}
 
 {%block title%}Genotypes: List Markers{%endblock%}
 
 {%block pagetitle%}Genotypes: List Markers{%endblock%}
 
-{%block lvl4_breadcrumbs%}
-<li {%if activelink=="list-markers"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
   <a href="{{url_for('species.populations.genotypes.list_markers',
-           species_id=species.SpeciesId,
-           population_id=population.Id)}}">List markers</a>
+           species_id=species['SpeciesId'],
+           population_id=population['Id'])}}">
+    markers
+  </a>
 </li>
 {%endblock%}
 
@@ -59,7 +57,7 @@
   <table class="table">
     <thead>
       <tr>
-        <th title="">#</th>
+        <th title="">Index</th>
         <th title="">Marker Name</th>
         <th title="Chromosome">Chr</th>
         <th title="Physical location of the marker in megabasepairs">
@@ -99,7 +97,3 @@
 </div>
 {%endif%}
 {%endblock%}
-
-{%block sidebarcontents%}
-{{display_species_card(species)}}
-{%endblock%}
diff --git a/uploader/templates/genotypes/view-dataset.html b/uploader/templates/genotypes/view-dataset.html
index e7ceb36..1c4eccf 100644
--- a/uploader/templates/genotypes/view-dataset.html
+++ b/uploader/templates/genotypes/view-dataset.html
@@ -1,21 +1,17 @@
 {%extends "genotypes/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
-{%from "populations/macro-display-population-card.html" import display_population_card%}
 
 {%block title%}Genotypes: View Dataset{%endblock%}
 
 {%block pagetitle%}Genotypes: View Dataset{%endblock%}
 
-{%block lvl4_breadcrumbs%}
-<li {%if activelink=="view-dataset"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
   <a href="{{url_for('species.populations.genotypes.view_dataset',
            species_id=species.SpeciesId,
            population_id=population.Id,
-           dataset_id=dataset.Id)}}">view dataset</a>
+           dataset_id=dataset.Id)}}">dataset</a>
 </li>
 {%endblock%}
 
@@ -55,7 +51,3 @@
 </div>
 
 {%endblock%}
-
-{%block sidebarcontents%}
-{{display_population_card(species, population)}}
-{%endblock%}
diff --git a/uploader/templates/index.html b/uploader/templates/index.html
index aa1414e..6e9c777 100644
--- a/uploader/templates/index.html
+++ b/uploader/templates/index.html
@@ -1,107 +1,170 @@
 {%extends "base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
+{%from "macro-forms.html" import add_http_feature_flags%}
 
 {%block title%}Home{%endblock%}
 
 {%block pagetitle%}Home{%endblock%}
 
-{%block contents%}
-
-<div class="row">
-  {{flash_all_messages()}}
-  <div class="explainer">
-    <p>Welcome to the <strong>GeneNetwork Data Upload and Quality Control
-        System</strong>.</p>
-    <p>This tool helps you prepare and upload research data to GeneNetwork for
-      analysis.</p>
-
-    <h2 class="heading">Getting Started</h2>
-    <p>The sections below explain the features of the system. Review this guide
-      to learn how to use the system.</p>
-
-    {%block extrapageinfo%}{%endblock%}
-
-    <h3 class="subheading">Species</h3>
-
-    <p>GeneNetwork supports genetic studies across multiple species (e.g. mice
-      [Mus musculus], human [homo sapiens], rats [Rattus norvegicus], etc.) .
-      Here you can:</p>
-    <ul>
-      <li>View all species that are currently supported</li>
-      <li>Add new species not yet in the system</li>
-    </ul>
-
-    <h3 class="subheading">Populations</h3>
-
-    <p>A "population" refers to a specific subgroup within a species that you’re
-      studying (e.g., BXD mice). Here you can:</p>
-    <ul>
-      <li>View the populations that exist for a selected species</li>
-      <li>Add new populations of study for a selected species</li>
-    </ul>
-
-    <h3 class="subheading">Samples</h3>
+{%block extra_breadcrumbs%}{%endblock%}
 
-    <p>Manage individual specimens or cases used in your experiments. These
-      include:</p>
-
-    <ul>
-      <li>Experimental subjects</li>
-      <li>Data sources (e.g., tissue samples, clinical cases)</li>
-      <li>Strain means (instead of entering multiple BXD1 individuals, for
-        example, the mean would be entered for a single BXD1 strain)</li>
-    </ul>
-
-
-    <h3 class="subheading">Genotype Data</h3>
-
-    <p>Upload and review genetic markers and allele encodings for your
-      population. Key details:</p>
+{%block contents%}
 
-    <ul>
-      <li>Markers are species-level (e.g., mouse SNP databases).</li>
-      <li>Allele data is population-specific (tied to your experimental
-        samples).</li>
-    </ul>
+{%macro add_form_buttons()%}
+<div class="row form-buttons">
+  <div class="col">
+    <input type="submit"
+           class="btn btn-primary"
+           value="use selected species" />
+  </div>
+  <div class="col">
+    <a href="{{url_for('species.create_species', return_to='base.index')}}"
+       class="btn btn-outline-primary"
+       title="Add a new species to Genenetwork.">add a new Species</a>
+  </div>
+</div>
+{%endmacro%}
 
-    <p><strong>Requirement</strong>: Samples must already have been registered
-      in the system before uploading genotype data.</p>
+<div class="row">{{flash_all_messages()}}</div>
 
-    <h3 class="subheading">Phenotype Data</h3>
+{%if user_logged_in()%}
 
-    <p>Phenotypes are the visible traits or features of a living thing. For
-      example, phenotypes include:</p>
+<div class="row">
+  <ul class="nav nav-tabs" id="index-actions">
+    <li class="nav-item presentation">
+      <button class="nav-link active"
+              id="upload-data-tab"
+              data-bs-toggle="tab"
+              data-bs-target="#upload-data-content"
+              type="button"
+              role="tab"
+              aria-controls="upload-data-content"
+              aria-selected="false">Upload Data</button></li>
+    <li class="nav-item presentation">
+      <button class="nav-link"
+              id="publications-tab"
+              data-bs-toggle="tab"
+              data-bs-target="#publications-content"
+              type="button"
+              role="tab"
+              aria-controls="publications-content"
+              aria-selected="true">Publications</button></li>
+  </ul>
+</div>
 
-    <ul>
-      <li>Weight</li>
-      <li>Height</li>
-      <li>Color (such as the color of fur or eyes)</li>
-    </ul>
+<div class="row">
+  <div class="tab-content" id="upload-data-tabs-content">
+    <div class="tab-pane fade show active"
+         id="upload-data-content"
+         role="tabpanel"
+         aria-labelledby="upload-data-content-tab">
+      <h2 class="heading">Species</h2>
+
+      <p>Select the species you want to work with.</p>
+
+      <form method="GET" action="{{url_for('base.index')}}" class="form-horizontal">
+        {{add_http_feature_flags()}}
+
+        {{add_form_buttons()}}
+
+        {%if species | length != 0%}
+        <div style="margin-top:1em;">
+          <table id="tbl-select-species" class="table compact stripe"
+                 data-species-list='{{species | tojson}}'>
+            <thead>
+              <tr>
+                <th></th>
+                <th>Species Name</th>
+              </tr>
+            </thead>
+
+            <tbody></tbody>
+          </table>
+        </div>
+
+        {%else%}
+
+        <label class="control-label" for="rdo-cant-find-species">
+          <input id="rdo-cant-find-species" type="radio" name="species_id"
+                 value="CREATE-SPECIES" />
+          There are no species to select from. Create the first one.</label>
+
+        <div class="col-sm-offset-10 col-sm-2">
+          <input type="submit"
+                 class="btn btn-primary col-sm-offset-1"
+                 value="continue" />
+        </div>
+
+        {%endif%}
+
+        {{add_form_buttons()}}
+
+      </form>
+    </div>
+
+    <div class="tab-pane fade"
+         id="publications-content"
+         role="tabpanel"
+         aria-labelledby="publications-content-tab">
+      <p>You can view, edit, and delete existing publications, as well as add
+        new ones, by clicking the button below.</p>
+
+      <a href="{{url_for('publications.index')}}"
+         title="Manage publications."
+         class="btn btn-primary">manage publications</a>
+    </div>
+  </div>
+</div>
 
-    <p>This part of the system will allow you to upload and manage the values
-      for different phenotypes from various samples in your studies.</p>
+{%else%}
 
-    <!--
+<div class="row">
+  <img src="/static/images/frontpage_banner.png"
+       alt="Banner image showing the process flow a user would follow." />
+</div>
 
-        <h3 class="subheading">Expression Data</h3>
+<div class="row">
+  <p>The GeneNetwork Uploader (gn-uploader) lets you easily add new data to the
+    GeneNetwork System. It automatically checks your data for quality and walks
+    you through fixing any issues before submission.</p>
+</div>
 
-    <p class="text-danger">
-      <span class="glyphicon glyphicon-exclamation-sign"></span>
-      <strong>TODO</strong>: Document this &hellip;</p>
+<div class="row">
+  <div class="col">
+      <a href="{{authserver_authorise_uri()}}"
+         title="Sign in to the system"
+         class="btn btn-primary">Sign in</a>
+  </div>
+</div>
+{%endif%}
 
-    <h3 class="subheading">Individual Data</h3>
+{%endblock%}
 
-    <p class="text-danger">
-      <span class="glyphicon glyphicon-exclamation-sign"></span>
-      <strong>TODO</strong>: Document this &hellip;</p>
 
-    <h3 class="subheading">RNA-Seq Data</h3>
 
-    <p class="text-danger">
-      <span class="glyphicon glyphicon-exclamation-sign"></span>
-      <strong>TODO</strong>: Document this &hellip;</p>
-  </div>
-  -->
+{%block sidebarcontents%}
+{%if view_under_construction%}
+<div class="row">
+  <p>The data in Genenetwork is related to one species or another. Use the form
+    provided to select from existing species, or click on the
+    "Create a New Species" button if you cannot find the species you want to
+    work with.</p>
 </div>
+<div class="row">
+  <form id="frm-quick-navigation">
+    <legend>Quick Navigation</legend>
+    <div class="form-group">
+      <label for="fqn-species-id">Species</label>
+      <select name="species_id">
+        <option value="">Select species</option>
+      </select>
+    </div>
+  </form>
+</div>
+{%endif%}
+{%endblock%}
+
 
+{%block javascript%}
+<script type="text/javascript" src="/static/js/species.js"></script>
 {%endblock%}
diff --git a/uploader/templates/login.html b/uploader/templates/login.html
deleted file mode 100644
index e76c644..0000000
--- a/uploader/templates/login.html
+++ /dev/null
@@ -1,12 +0,0 @@
-{%extends "index.html"%}
-
-{%block title%}Data Upload{%endblock%}
-
-{%block pagetitle%}log in{%endblock%}
-
-{%block extrapageinfo%}
-<p class="text-dark">
-  You <strong>need to
-    <a href="{{authserver_authorise_uri()}}"
-       title="Sign in to the system">sign in</a></strong> to use this system.</p>
-{%endblock%}
diff --git a/uploader/templates/macro-forms.html b/uploader/templates/macro-forms.html
new file mode 100644
index 0000000..0ccab32
--- /dev/null
+++ b/uploader/templates/macro-forms.html
@@ -0,0 +1,9 @@
+{%macro add_http_feature_flags()%}
+{%for flag in http_feature_flags():%}
+{%if (request.args.get(flag) or request.form.get(flag) or ""):%}
+<input type="hidden"
+       name="{{flag}}"
+       value="{{(request.args.get(flag) or request.form.get(flag))}}" />
+{%endif%}
+{%endfor%}
+{%endmacro%}
diff --git a/uploader/templates/phenotypes/add-phenotypes-base.html b/uploader/templates/phenotypes/add-phenotypes-base.html
index 9909c20..3207129 100644
--- a/uploader/templates/phenotypes/add-phenotypes-base.html
+++ b/uploader/templates/phenotypes/add-phenotypes-base.html
@@ -1,26 +1,13 @@
 {%extends "phenotypes/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
 {%from "macro-table-pagination.html" import table_pagination%}
-{%from "phenotypes/macro-display-pheno-dataset-card.html" import display_pheno_dataset_card%}
 
 {%block title%}Phenotypes{%endblock%}
 
 {%block pagetitle%}Phenotypes{%endblock%}
 
-{%block lvl4_breadcrumbs%}
-<li {%if activelink=="add-phenotypes"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  <a href="{{url_for('species.populations.phenotypes.add_phenotypes',
-           species_id=species.SpeciesId,
-           population_id=population.Id,
-           dataset_id=dataset.Id)}}">Add Phenotypes</a>
-</li>
-{%endblock%}
-
 {%block contents%}
+{{super()}}
 {{flash_all_messages()}}
 
 <div class="row">
@@ -42,8 +29,7 @@
 
     {%block frm_add_phenotypes_elements%}{%endblock%}
 
-    <fieldset id="fldset-publication-info">
-      <legend>Publication Information</legend>
+      <h4>Publication Information</h4>
       <input type="hidden" name="publication-id" id="txt-publication-id" />
       <span class="form-text text-muted">
         Select a publication for your data. <br />
@@ -57,7 +43,7 @@
       <table id="tbl-select-publication" class="table compact stripe">
         <thead>
           <tr>
-            <th>#</th>
+            <th>Index</th>
             <th>PubMed ID</th>
             <th>Title</th>
             <th>Authors</th>
@@ -66,7 +52,6 @@
 
         <tbody></tbody>
       </table>
-    </fieldset>
 
     <div class="form-group">
       <input type="submit"
@@ -83,6 +68,8 @@
 {%endblock%}
 
 
+
+
 {%block javascript%}
 <script type="text/javascript">
   $(function() {
@@ -97,7 +84,8 @@
                       if(pub.PubMed_ID) {
                           return `<a href="https://pubmed.ncbi.nlm.nih.gov/` +
                               `${pub.PubMed_ID}/" target="_blank" ` +
-                              `title="Link to publication on NCBI.">` +
+                              `title="Link to publication on NCBI. This will ` +
+                              `open in a new tab.">` +
                               `${pub.PubMed_ID}</a>`;
                       }
                       return "";
@@ -110,10 +98,7 @@
                       if(pub.Title) {
                           title = pub.Title
                       }
-                      return `<a href="/publications/view/${pub.Id}" ` +
-                          `target="_blank" ` +
-                          `title="Link to view publication details">` +
-                          `${title}</a>`;
+                      return title;
                   }
               },
               {
diff --git a/uploader/templates/phenotypes/add-phenotypes-raw-files.html b/uploader/templates/phenotypes/add-phenotypes-raw-files.html
index 67b56e3..b1322b2 100644
--- a/uploader/templates/phenotypes/add-phenotypes-raw-files.html
+++ b/uploader/templates/phenotypes/add-phenotypes-raw-files.html
@@ -1,7 +1,6 @@
 {%extends "phenotypes/add-phenotypes-base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
 {%from "macro-table-pagination.html" import table_pagination%}
-{%from "phenotypes/macro-display-pheno-dataset-card.html" import display_pheno_dataset_card%}
 {%from "phenotypes/macro-display-preview-table.html" import display_preview_table%}
 {%from "phenotypes/macro-display-resumable-elements.html" import display_resumable_elements%}
 
@@ -9,19 +8,6 @@
 
 {%block pagetitle%}Phenotypes{%endblock%}
 
-{%block lvl4_breadcrumbs%}
-<li {%if activelink=="add-phenotypes"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  <a href="{{url_for('species.populations.phenotypes.add_phenotypes',
-           species_id=species.SpeciesId,
-           population_id=population.Id,
-           dataset_id=dataset.Id)}}">Add Phenotypes</a>
-</li>
-{%endblock%}
-
 {%block frm_add_phenotypes_documentation%}
 <p>This page will allow you to upload all the separate files that make up your
   phenotypes. Here, you will have to upload each separate file individually. If
@@ -35,8 +21,7 @@
 {%endblock%}
 
 {%block frm_add_phenotypes_elements%}
-<fieldset id="fldset-file-metadata">
-  <legend>File(s) Metadata</legend>
+  <h4>File(s) Metadata</h4>
   <div class="form-group">
     <label for="txt-file-separator" class="form-label">File Separator</label>
     <div class="input-group">
@@ -103,12 +88,9 @@
       <a href="#docs-file-na" title="Documentation for no-value fields">
         documentation for more information</a>.</span>
   </div>
-</fieldset>
 
-<fieldset id="fldset-files">
   <legend>Data File(s)</legend>
 
-  <fieldset id="fldset-descriptions-file">
     <div class="form-group">
       <div class="form-check">
         <input id="chk-phenotype-descriptions-transposed"
@@ -159,10 +141,8 @@
       {{display_preview_table(
       "tbl-preview-pheno-desc", "phenotype descriptions")}}
     </div>
-  </fieldset>
-
 
-  <fieldset id="fldset-data-file">
+    
     <div class="form-group">
       <div class="form-check">
         <input id="chk-phenotype-data-transposed"
@@ -210,11 +190,9 @@
         on the expected format for the file provided here.</p>')}}
       {{display_preview_table("tbl-preview-pheno-data", "phenotype data")}}
     </div>
-  </fieldset>
 
   
   {%if population.Family in families_with_se_and_n%}
-  <fieldset id="fldset-se-file">
     <div class="form-group">
       <div class="form-check">
         <input id="chk-phenotype-se-transposed"
@@ -261,10 +239,8 @@
 
       {{display_preview_table("tbl-preview-pheno-se", "standard errors")}}
     </div>
-  </fieldset>
 
 
-  <fieldset id="fldset-n-file">
     <div class="form-group">
       <div class="form-check">
         <input id="chk-phenotype-n-transposed"
@@ -311,8 +287,6 @@
 
       {{display_preview_table("tbl-preview-pheno-n", "number of samples/individuals")}}
     </div>
-  </fieldset>
-</fieldset>
 {%endif%}
 {%endblock%}
 
@@ -447,10 +421,6 @@
 
 {%endblock%}
 
-{%block sidebarcontents%}
-{{display_pheno_dataset_card(species, population, dataset)}}
-{%endblock%}
-
 
 {%block more_javascript%}
 <script src="{{url_for('base.node_modules',
@@ -495,7 +465,7 @@
               .map((field) => {
                   var value = field.trim();
                   if(navalues.includes(value)) {
-                      return "⋘NUL⋙";
+                      return "[NO-VALUE]";
                   }
                   return value;
               })
diff --git a/uploader/templates/phenotypes/add-phenotypes-with-rqtl2-bundle.html b/uploader/templates/phenotypes/add-phenotypes-with-rqtl2-bundle.html
index 898fc0c..4afd6ab 100644
--- a/uploader/templates/phenotypes/add-phenotypes-with-rqtl2-bundle.html
+++ b/uploader/templates/phenotypes/add-phenotypes-with-rqtl2-bundle.html
@@ -1,25 +1,11 @@
 {%extends "phenotypes/add-phenotypes-base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
 {%from "macro-table-pagination.html" import table_pagination%}
-{%from "phenotypes/macro-display-pheno-dataset-card.html" import display_pheno_dataset_card%}
 
 {%block title%}Phenotypes{%endblock%}
 
 {%block pagetitle%}Phenotypes{%endblock%}
 
-{%block lvl4_breadcrumbs%}
-<li {%if activelink=="add-phenotypes"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  <a href="{{url_for('species.populations.phenotypes.add_phenotypes',
-           species_id=species.SpeciesId,
-           population_id=population.Id,
-           dataset_id=dataset.Id)}}">Add Phenotypes</a>
-</li>
-{%endblock%}
-
 {%block frm_add_phenotypes_documentation%}
 <p>Select the zip file bundle containing information on the phenotypes you
   wish to upload, then click the "Upload Phenotypes" button below to
@@ -201,7 +187,3 @@
     <em>phenotypes × individuals</em>.</p>
 </div>
 {%endblock%}
-
-{%block sidebarcontents%}
-{{display_pheno_dataset_card(species, population, dataset)}}
-{%endblock%}
diff --git a/uploader/templates/phenotypes/base.html b/uploader/templates/phenotypes/base.html
index adbc012..5959422 100644
--- a/uploader/templates/phenotypes/base.html
+++ b/uploader/templates/phenotypes/base.html
@@ -1,19 +1,27 @@
 {%extends "populations/base.html"%}
+{%from "phenotypes/macro-display-pheno-dataset-card.html" import display_sui_pheno_dataset_card%}
 
-{%block lvl3_breadcrumbs%}
-<li {%if activelink=="phenotypes"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  {%if dataset is mapping%}
+{%block breadcrumbs%}
+{{super()}}
+{%if dataset%}
+<li class="breadcrumb-item">
   <a href="{{url_for('species.populations.phenotypes.view_dataset',
-           species_id=species.SpeciesId,
-           population_id=population.Id,
-           dataset_id=dataset.Id)}}">{{dataset.Name}}</a>
-  {%else%}
-  <a href="{{url_for('species.populations.phenotypes.index')}}">Phenotypes</a>
-  {%endif%}
+           species_id=species['SpeciesId'],
+           population_id=population['Id'],
+           dataset_id=dataset['Id'])}}">
+    {{dataset["Name"]}}
+  </a>
 </li>
-{%block lvl4_breadcrumbs%}{%endblock%}
+{%endif%}
+{%endblock%}
+
+{%block contents%}
+<div class="row">
+  <h2 class="heading">{{dataset.FullName}} ({{dataset.Name}})</h2>
+</div>
+{%endblock%}
+
+
+{%block sidebarcontents%}
+{{display_sui_pheno_dataset_card(species, population, dataset)}}
 {%endblock%}
diff --git a/uploader/templates/phenotypes/confirm-delete-phenotypes.html b/uploader/templates/phenotypes/confirm-delete-phenotypes.html
new file mode 100644
index 0000000..3cf6e65
--- /dev/null
+++ b/uploader/templates/phenotypes/confirm-delete-phenotypes.html
@@ -0,0 +1,196 @@
+{%extends "phenotypes/base.html"%}
+{%from "flash_messages.html" import flash_all_messages%}
+
+{%block title%}Phenotypes{%endblock%}
+
+{%block pagetitle%}Delete Phenotypes{%endblock%}
+
+{%block lvl4_breadcrumbs%}
+<li {%if activelink=="view-dataset"%}
+    class="breadcrumb-item active"
+    {%else%}
+    class="breadcrumb-item"
+    {%endif%}>
+  <a href="{{url_for('species.populations.phenotypes.view_dataset',
+           species_id=species.SpeciesId,
+           population_id=population.Id,
+           dataset_id=dataset.Id)}}">View</a>
+</li>
+{%endblock%}
+
+{%block contents%}
+{{flash_all_messages()}}
+
+<div class="row"><h2>Delete Phenotypes</h2></div>
+
+{%if phenotypes | length > 0%}
+<div class="row">
+  <p>You have requested to delete the following phenotypes:</p>
+</div>
+
+<div class="row">
+  <div class="col">
+    <a id="btn-select-all-phenotypes"
+       href="#"
+       class="btn btn-info"
+       title="Select all phenotypes">select all</a>
+  </div>
+  <div class="col">
+    <a id="btn-deselect-all-phenotypes"
+       href="#"
+       class="btn btn-warning"
+       title="Deselect all phenotypes">deselect all</a>
+  </div>
+</div>
+
+<div class="row">
+  <table id="tbl-delete-phenotypes" class="table">
+    <thead>
+      <tr>
+        <th>Index</th>
+        <th>Record ID</th>
+        <th>Description</th>
+      </tr>
+    </thead>
+    <tbody>
+      {%for phenotype in phenotypes%}
+      <tr>
+        <td>
+          <input id="chk-xref-id-{{phenotype.xref_id}}"
+                 name="xref_ids"
+                 type="checkbox"
+                 value="{{phenotype.xref_id}}"
+                 class="chk-row-select" />
+        </td>
+        <td>{{phenotype.xref_id}}</td>
+        <td>{{phenotype.Post_publication_description or
+          phenotype.Pre_publication_description or
+          phenotype.original_description}}</td>
+      </tr>
+      {%endfor%}
+    </tbody>
+  </table>
+</div>
+
+<div class="row">
+  <form id="frm-delete-phenotypes-selected"
+        method="POST"
+        action="{{url_for('species.populations.phenotypes.delete_phenotypes',
+                species_id=species.SpeciesId,
+                population_id=population.Id,
+                dataset_id=dataset.Id)}}">
+    <div class="row">
+      <div class="col">
+        <input class="btn btn-info"
+               type="submit"
+               title="Cancel delete and return to dataset page."
+               name="action"
+               value="cancel" /></div>
+      <div class="col">
+        <input id="btn-delete-phenotypes-selected"
+               class="btn btn-danger"
+               type="submit"
+               title="Delete the selected phenotypes from this dataset."
+               name="action"
+               value="delete" />
+      </div>
+    </div>
+  </form>
+</div>
+{%else%}
+<div class="row">
+  <p>You did not select any phenotypes to delete. Delete everything?</p>
+</div>
+
+<div class="row">
+  <form id="frm-delete-phenotypes-all"
+        method="POST"
+        action="{{url_for('species.populations.phenotypes.delete_phenotypes',
+                species_id=species.SpeciesId,
+                population_id=population.Id,
+                dataset_id=dataset.Id)}}">
+    <div class="form-check">
+      <input class="form-check-input"
+             type="checkbox"
+             name="confirm_delete_all_phenotypes"
+             id="chk-confirm-delete-all-phenotypes" />
+      <label class="form-check-label"
+             for="chk-confirm-delete-all-phenotypes">
+        delete all phenotypes?</label>
+    </div>
+
+    <div class="row">
+      <div class="col">
+        <input class="btn btn-info"
+               type="submit"
+               title="Cancel delete and return to dataset page."
+               name="action"
+               value="cancel" /></div>
+      <div class="col">
+        <input class="btn btn-danger"
+               type="submit"
+               title="Delete all phenotypes in this dataset."
+               name="action"
+               value="delete" />
+      </div>
+    </div>
+  </form>
+</div>
+{%endif%}
+
+{%endblock%}
+
+{%block javascript%}
+<script type="text/javascript">
+  $(function() {
+      var dt = buildDataTable(
+          "#tbl-delete-phenotypes",
+          data=[],
+          columns=[],
+          userSettings={
+              responsive: true,
+              select: {
+                  style: "os",
+                  info: false
+              },
+              initComplete: function(setting, json) {
+                  var api = this.api();
+                  api.rows().select();
+                  api.rows({selected: true}).nodes().each((node, index) => {
+                      setRowChecked(node);
+                  });
+              }
+          });
+
+      $("#btn-select-all-phenotypes").on("click", function(event) {
+          dt.selectAll();
+      });
+
+      $("#btn-deselect-all-phenotypes").on("click", function(event) {
+          dt.deselectAll();
+      });
+
+      $("#btn-delete-phenotypes-selected").on("click", function(event) {
+          event.preventDefault();
+          form = $("#frm-delete-phenotypes-selected");
+          form.find(".dynamically-added-element").remove();
+          dt.rows({selected: true}).nodes().each(function(node, index) {
+              var xref_id = $(node)
+                  .find('input[type="checkbox"]:checked')
+                  .val();
+              var chk = $('<input type="checkbox">');
+              chk.attr("class", "dynamically-added-element");
+              chk.attr("value", xref_id);
+              chk.attr("name", "xref_ids");
+              chk.attr("style", "display: none");
+              chk.prop("checked", true);
+              form.append(chk);
+          });
+          form.append(
+              $('<input type="hidden" name="action" value="delete" />'));
+          form.submit();
+      })
+  });
+</script>
+{%endblock%}
+
diff --git a/uploader/templates/phenotypes/create-dataset.html b/uploader/templates/phenotypes/create-dataset.html
index 19a2b34..6eced05 100644
--- a/uploader/templates/phenotypes/create-dataset.html
+++ b/uploader/templates/phenotypes/create-dataset.html
@@ -48,7 +48,8 @@
              {%else%}
              class="form-control"
              {%endif%}
-             required="required" />
+             required="required"
+             disabled="disabled" />
       <small class="form-text text-muted">
         <p>A short representative name for the dataset.</p>
         <p>Recommended: Use the population name and append "Publish" at the end.
@@ -66,7 +67,7 @@
       <input id="txt-dataset-fullname"
              name="dataset-fullname"
              type="text"
-             value="{{original_formdata.get('dataset-fullname', '')}}"
+             value="{{original_formdata.get('dataset-fullname', '') or population.Name + ' Phenotypes'}}"
              {%if errors["dataset-fullname"] is defined%}
              class="form-control danger"
              {%else%}
diff --git a/uploader/templates/phenotypes/edit-phenotype.html b/uploader/templates/phenotypes/edit-phenotype.html
index 115d6af..1b3ee9d 100644
--- a/uploader/templates/phenotypes/edit-phenotype.html
+++ b/uploader/templates/phenotypes/edit-phenotype.html
@@ -142,7 +142,7 @@
       <table class="table table-striped table-responsive table-form-table">
         <thead style="position: sticky; top: 0;">
           <tr>
-            <th>#</th>
+            <th>Index</th>
             <th>Sample</th>
             <th>Value</th>
             {%if population.Family in families_with_se_and_n%}
diff --git a/uploader/templates/phenotypes/job-status.html b/uploader/templates/phenotypes/job-status.html
index 257f726..951907f 100644
--- a/uploader/templates/phenotypes/job-status.html
+++ b/uploader/templates/phenotypes/job-status.html
@@ -2,7 +2,6 @@
 {%from "cli-output.html" import cli_output%}
 {%from "flash_messages.html" import flash_all_messages%}
 {%from "macro-table-pagination.html" import table_pagination%}
-{%from "phenotypes/macro-display-pheno-dataset-card.html" import display_pheno_dataset_card%}
 
 {%block extrameta%}
 {%if job and job.status not in ("success", "completed:success", "error", "completed:error")%}
@@ -14,23 +13,13 @@
 
 {%block pagetitle%}Phenotypes{%endblock%}
 
-{%block lvl4_breadcrumbs%}
-<li {%if activelink=="add-phenotypes"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  <a href="{{url_for('species.populations.phenotypes.add_phenotypes',
-           species_id=species.SpeciesId,
-           population_id=population.Id,
-           dataset_id=dataset.Id)}}">View Datasets</a>
-</li>
-{%endblock%}
-
 {%block contents%}
 
 {%if job%}
-<h4 class="subheading">Progress</h4>
+<div class="row">
+  <h2 class="heading">{{dataset.FullName}} ({{dataset.Name}})</h2>
+  <h3 class="subheading">upload progress</h3>
+</div>
 <div class="row" style="overflow:scroll;">
   <p><strong>Process Status:</strong> {{job.status}}</p>
   {%if metadata%}
@@ -63,10 +52,10 @@
   <p>
     {%if errors | length == 0%}
     <a href="{{url_for('species.populations.phenotypes.review_job_data',
-           species_id=species.SpeciesId,
-           population_id=population.Id,
-           dataset_id=dataset.Id,
-           job_id=job_id)}}"
+             species_id=species.SpeciesId,
+             population_id=population.Id,
+             dataset_id=dataset.Id,
+             job_id=job_id)}}"
        class="btn btn-primary"
        title="Continue to process data">Continue</a>
     {%else%}
@@ -80,14 +69,29 @@
   {%endif%}
 </div>
 
-<h4 class="subheading">Errors</h4>
+<h3 class="subheading">upload errors</h3>
+{%if errors | length == 0 %}
 <div class="row" style="max-height: 20em; overflow: scroll;">
-  {%if errors | length == 0 %}
   <p class="text-info">
     <span class="glyphicon glyphicon-info-sign"></span>
     No errors found so far
   </p>
-  {%else%}
+</div>
+{%else%}
+{%if errors | length > 0%}
+<div class="row">
+  <div class="col">
+    <a href="{{url_for('species.populations.phenotypes.download_errors',
+             species_id=species.SpeciesId,
+             population_id=population.Id,
+             dataset_id=dataset.Id,
+             job_id=job_id)}}"
+       class="btn btn-info"
+       title="Download the errors as a CSV file.">download errors CSV</a>
+  </div>
+</div>
+{%endif%}
+<div class="row" style="max-height: 20em; overflow: scroll;">
   <table class="table table-responsive">
     <thead style="position: sticky; top: 0; background: white;">
       <tr>
@@ -122,7 +126,8 @@
       {%endfor%}
     </tbody>
   </table>
-  {%endif%}
+</div>
+{%endif%}
 </div>
 
 <div class="row">
@@ -149,7 +154,3 @@
 </div>
 {%endif%}
 {%endblock%}
-
-{%block sidebarcontents%}
-{{display_pheno_dataset_card(species, population, dataset)}}
-{%endblock%}
diff --git a/uploader/templates/phenotypes/load-phenotypes-success.html b/uploader/templates/phenotypes/load-phenotypes-success.html
index 645be16..1fb0e61 100644
--- a/uploader/templates/phenotypes/load-phenotypes-success.html
+++ b/uploader/templates/phenotypes/load-phenotypes-success.html
@@ -1,26 +1,14 @@
 {%extends "phenotypes/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
 {%from "macro-table-pagination.html" import table_pagination%}
-{%from "phenotypes/macro-display-pheno-dataset-card.html" import display_pheno_dataset_card%}
 
 {%block title%}Phenotypes{%endblock%}
 
 {%block pagetitle%}Phenotypes{%endblock%}
 
-{%block lvl4_breadcrumbs%}
-<li {%if activelink=="load-phenotypes-success"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  <a href="{{url_for('species.populations.phenotypes.add_phenotypes',
-           species_id=species.SpeciesId,
-           population_id=population.Id,
-           dataset_id=dataset.Id)}}">Add Phenotypes</a>
-</li>
-{%endblock%}
-
 {%block contents%}
+{{super()}}
+
 <div class="row">
   <p>You have successfully loaded
     <!-- maybe indicate the number of phenotypes here? -->your
@@ -34,9 +22,5 @@
 </div>
 {%endblock%}
 
-{%block sidebarcontents%}
-{{display_pheno_dataset_card(species, population, dataset)}}
-{%endblock%}
-
 
 {%block more_javascript%}{%endblock%}
diff --git a/uploader/templates/phenotypes/macro-display-pheno-dataset-card.html b/uploader/templates/phenotypes/macro-display-pheno-dataset-card.html
index 11b108b..641421d 100644
--- a/uploader/templates/phenotypes/macro-display-pheno-dataset-card.html
+++ b/uploader/templates/phenotypes/macro-display-pheno-dataset-card.html
@@ -1,4 +1,4 @@
-{%from "populations/macro-display-population-card.html" import display_population_card%}
+{%from "populations/macro-display-population-card.html" import display_population_card, display_sui_population_card%}
 
 {%macro display_pheno_dataset_card(species, population, dataset)%}
 {{display_population_card(species, population)}}
@@ -29,3 +29,29 @@
   </div>
 </div>
 {%endmacro%}
+
+{%macro display_sui_pheno_dataset_card(species, population, dataset)%}
+{{display_sui_population_card(species, population)}}
+
+<div class="row">
+  <table class="table">
+    <caption>Current dataset</caption>
+    <tbody>
+      <tr>
+        <th>Name</th>
+        <td>{{dataset.Name}}</td>
+      </tr>
+
+      <tr>
+        <th>Full Name</th>
+        <td>{{dataset.FullName}}</td>
+      </tr>
+
+      <tr>
+        <th>Short Name</th>
+        <td>{{dataset.ShortName}}</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+{%endmacro%}
diff --git a/uploader/templates/phenotypes/macro-display-preview-table.html b/uploader/templates/phenotypes/macro-display-preview-table.html
index 5a4c422..6dffe9f 100644
--- a/uploader/templates/phenotypes/macro-display-preview-table.html
+++ b/uploader/templates/phenotypes/macro-display-preview-table.html
@@ -1,19 +1,11 @@
 {%macro display_preview_table(tableid, filetype)%}
-<div class="card">
-  <div class="card-body">
-    <h5 class="card-title">{{filetype | title}}: File Preview</h5>
-    <div class="card-text" style="overflow: scroll;">
-      <table id="{{tableid}}" class="table table-condensed table-responsive">
-        <thead>
-          <tr>
-          </tr>
-        <tbody>
-          <tr>
-            <td class="data-row-template text-info"></td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-  </div>
+<div class="table-responsive"
+     style="max-width:39.2em;border-radius:5px;border: solid 1px;overflow-x: scroll;">
+  <h5>{{filetype | title}}: File Preview</h5>
+  <table id="{{tableid}}" class="table">
+    <thead><tr></tr></thead>
+
+    <tbody></tbody>
+  </table>
 </div>
 {%endmacro%}
diff --git a/uploader/templates/phenotypes/review-job-data.html b/uploader/templates/phenotypes/review-job-data.html
index 859df74..c8355b2 100644
--- a/uploader/templates/phenotypes/review-job-data.html
+++ b/uploader/templates/phenotypes/review-job-data.html
@@ -104,10 +104,6 @@
 {%endif%}
 {%endblock%}
 
-{%block sidebarcontents%}
-{{display_pheno_dataset_card(species, population, dataset)}}
-{%endblock%}
-
 
 {%block javascript%}
 <script type="text/javascript">
diff --git a/uploader/templates/phenotypes/view-dataset.html b/uploader/templates/phenotypes/view-dataset.html
index 306dcce..3bb2586 100644
--- a/uploader/templates/phenotypes/view-dataset.html
+++ b/uploader/templates/phenotypes/view-dataset.html
@@ -1,7 +1,6 @@
 {%extends "phenotypes/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
 {%from "macro-table-pagination.html" import table_pagination%}
-{%from "populations/macro-display-population-card.html" import display_population_card%}
 
 {%block title%}Phenotypes{%endblock%}
 
@@ -24,37 +23,6 @@
 {{flash_all_messages()}}
 
 <div class="row">
-  <p>The basic dataset details are:</p>
-
-  <table class="table">
-    <thead>
-      <tr>
-        <th>Name</th>
-        <th>Full Name</th>
-        <th>Short Name</th>
-      </tr>
-    </thead>
-
-    <tbody>
-      <tr>
-        <td>{{dataset.Name}}</td>
-        <td>{{dataset.FullName}}</td>
-        <td>{{dataset.ShortName}}</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-
-<div class="row">
-  <p><a href="{{url_for('species.populations.phenotypes.add_phenotypes',
-              species_id=species.SpeciesId,
-              population_id=population.Id,
-              dataset_id=dataset.Id)}}"
-        title="Add a bunch of phenotypes"
-        class="btn btn-primary">Add phenotypes</a></p>
-</div>
-
-<div class="row">
   <h2>Phenotype Data</h2>
 
   <p>Click on any of the phenotypes in the table below to view and edit that
@@ -63,9 +31,70 @@
     phenotypes of interest.</p>
 </div>
 
-
 <div class="row">
+  <div class="col">
+    <a href="{{url_for('species.populations.phenotypes.add_phenotypes',
+             species_id=species.SpeciesId,
+             population_id=population.Id,
+             dataset_id=dataset.Id)}}"
+       title="Add a bunch of phenotypes"
+       class="btn btn-primary">Add phenotypes</a>
+  </div>
+
+  <div class="col">
+    <form id="frm-recompute-phenotype-means"
+          method="POST"
+          action="{{url_for(
+                  'species.populations.phenotypes.recompute_means',
+                  species_id=species['SpeciesId'],
+                  population_id=population['Id'],
+                  dataset_id=dataset['Id'])}}"
+          class="d-flex flex-row align-items-center flex-wrap"
+          style="display: inline;">
+      <input type="submit"
+             title="Compute/Recompute the means for all phenotypes."
+             class="btn btn-info"
+             value="compute means"
+             id="submit-frm-recompute-phenotype-means" />
+    </form>
+  </div>
+
+  <div class="col">
+    <form id="frm-run-qtlreaper"
+          method="POST"
+          action="{{url_for(
+                  'species.populations.phenotypes.rerun_qtlreaper',
+                  species_id=species['SpeciesId'],
+                  population_id=population['Id'],
+                  dataset_id=dataset['Id'])}}"
+          class="d-flex flex-row align-items-center flex-wrap"
+          style="display: inline;">
+      <input type="submit"
+             title="Run/Rerun QTLReaper."
+             class="btn btn-info"
+             value="run QTLReaper"
+             id="submit-frm-rerun-qtlreaper" />
+    </form>
+  </div>
+
+  <div class="col">
+    <form id="frm-delete-phenotypes"
+          method="POST"
+          action="{{url_for(
+                  'species.populations.phenotypes.delete_phenotypes',
+                  species_id=species['SpeciesId'],
+                  population_id=population['Id'],
+                  dataset_id=dataset['Id'])}}">
+      <input type="submit"
+             class="btn btn-danger"
+             id="btn-delete-phenotypes"
+             title="Delete phenotypes from this dataset. If no phenotypes are selected in the table, this will delete ALL the phenotypes."
+             value="delete phenotypes" />
+    </form>
+  </div>
+</div>
 
+<div class="row" style="margin-top: 0.5em;">
   <table id="tbl-phenotypes-list" class="table compact stripe cell-border">
     <thead>
       <tr>
@@ -81,12 +110,10 @@
 </div>
 {%endblock%}
 
-{%block sidebarcontents%}
-{{display_population_card(species, population)}}
-{%endblock%}
-
 
 {%block javascript%}
+<script type="text/javascript" src="/static/js/urls.js"></script>
+
 <script type="text/javascript">
   $(function() {
       var species_id = {{species.SpeciesId}};
@@ -113,11 +140,12 @@
                       var spcs_id = {{species.SpeciesId}};
                       var pop_id = {{population.Id}};
                       var dtst_id = {{dataset.Id}};
-                      return `<a href="/species/${spcs_id}` +
+                      var url = buildURLFromCurrentURL(
+                          (`/species/${spcs_id}` +
                           `/populations/${pop_id}` +
                           `/phenotypes/datasets/${dtst_id}` +
-                          `/phenotype/${pheno.xref_id}` +
-                          `" target="_blank">` +
+                           `/phenotype/${pheno.xref_id}`));
+                      return `<a href="${url.toString()}" target="_blank">` +
                           `${pheno.InbredSetCode}_${pheno.xref_id}` +
                           `</a>`;
                   }
@@ -145,6 +173,54 @@
                   return `${pheno.InbredSetCode}_${pheno.xref_id}`;
               }
           });
+
+
+      $("#submit-frm-rerun-qtlreaper").on(
+          "click",
+          function(event) {
+              // (Re)run the QTLReaper script for selected phenotypes.
+              event.preventDefault();
+              var form = $("#frm-run-qtlreaper");
+              form.find(".dynamically-added-element").remove();
+              dtPhenotypesList.rows({selected: true}).nodes().each((node, index) => {
+                  _cloned = $(node).find(".chk-row-select").clone();
+                  _cloned.removeAttr("id");
+                  _cloned.removeAttr("class");
+                  _cloned.attr("style", "display: none;");
+                  _cloned.attr("data-type", "dynamically-added-element");
+                  _cloned.attr("class", "dynamically-added-element checkbox");
+                  _cloned.prop("checked", true);
+                  form.append(_cloned);
+              });
+              form.submit();
+          });
+
+      $("#btn-delete-phenotypes").on(
+          "click",
+          function(event) {
+              // Collect selected phenotypes for deletion, if any.
+              event.preventDefault();
+              form = $("#frm-delete-phenotypes");
+              form.find(".dynamically-added-element").remove();
+              $("#tbl-phenotypes-list")
+                  .DataTable()
+                  .rows({selected: true}).
+                  nodes().each(function(node, index) {
+                      var parts = $(node)
+                          .find(".chk-row-select")
+                          .val()
+                          .split("_");
+                      var xref_id = parts[parts.length - 1].trim();
+                      var chk = $('<input type="checkbox">');
+                      chk.attr("class", "dynamically-added-element");
+                      chk.attr("value", xref_id);
+                      chk.attr("name", "xref_ids");
+                      chk.attr("style", "display: none");
+                      chk.prop("checked", true);
+                      form.append(chk);
+                  });
+              form.submit();
+          });
   });
 </script>
 {%endblock%}
diff --git a/uploader/templates/phenotypes/view-phenotype.html b/uploader/templates/phenotypes/view-phenotype.html
index 21ac501..a59949e 100644
--- a/uploader/templates/phenotypes/view-phenotype.html
+++ b/uploader/templates/phenotypes/view-phenotype.html
@@ -1,31 +1,18 @@
 {%extends "phenotypes/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
-{%from "populations/macro-display-population-card.html" import display_population_card%}
 
 {%block title%}Phenotypes{%endblock%}
 
 {%block pagetitle%}Phenotypes{%endblock%}
 
-{%block lvl4_breadcrumbs%}
-<li {%if activelink=="view-phenotype"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  <a href="{{url_for('species.populations.phenotypes.view_phenotype',
-           species_id=species.SpeciesId,
-           population_id=population.Id,
-           dataset_id=dataset.Id,
-           xref_id=xref_id)}}">View Phenotype</a>
-</li>
-{%endblock%}
-
 {%block contents%}
 {{flash_all_messages()}}
 
 <div class="row">
-  <div class="panel panel-default">
-    <div class="panel-heading"><strong>Basic Phenotype Details</strong></div>
+  <div class="card">
+    <div class="card-header">
+      <h5 class="card-title">Basic Phenotype Details</h5>
+    </div>
 
     <table class="table">
       <tbody>
@@ -41,24 +28,46 @@
           <td><strong>Units</strong></td>
           <td>{{phenotype.Units}}</td>
         </tr>
-        {%for key,value in publish_data.items()%}
-        <tr>
-          <td><strong>{{key}}</strong></td>
-          <td>{{value}}</td>
-        </tr>
-        {%else%}
-        <tr>
-          <td colspan="2" class="text-muted">
-            <span class="glyphicon glyphicon-exclamation-sign"></span>
-            No publication data found.
-          </td>
-        </tr>
-        {%endfor%}
       </tbody>
     </table>
   </div>
 </div>
 
+<div class="row" style="margin-top:5px;">
+  <div class="card">
+    <div class="card-header">
+      <h5 class="card-title">Publication Details</h5>
+    </div>
+
+    <div class="card-body">
+      <table class="table">
+        <tbody>
+          <tr>
+            {%for key in ("PubMed_ID", "Authors", "Title", "Journal"):%}
+          <tr>
+            <td><strong>{{key}}</strong></td>
+            <td>{{publication.get(key, "")}}</td>
+          </tr>
+          {%else%}
+          <tr>
+            <td colspan="2" class="text-muted">
+              <span class="glyphicon glyphicon-exclamation-sign"></span>
+              No publication data found.
+            </td>
+          </tr>
+          {%endfor%}
+          </tr>
+        </tbody>
+      </table>
+      <div style="text-align: right;">
+        <a href="{{url_for('publications.edit_publication', publication_id=publication.Id, next=next)}}"
+           class="btn btn-info">edit</a>
+        <a href="#" class="btn btn-danger not-implemented">change</a>
+      </div>
+    </div>
+  </div>
+</div>
+
 {%if "group:resource:edit-resource" in privileges
 or "group:resource:delete-resource" in privileges%}
 <div class="row">
@@ -94,7 +103,7 @@ or "group:resource:delete-resource" in privileges%}
     <table class="table">
       <thead>
         <tr>
-          <th>#</th>
+          <th>Index</th>
           <th>Sample</th>
           <th>Value</th>
           {%if has_se%}
@@ -129,7 +138,3 @@ or "group:resource:delete-resource" in privileges%}
 </div>
 
 {%endblock%}
-
-{%block sidebarcontents%}
-{{display_population_card(species, population)}}
-{%endblock%}
diff --git a/uploader/templates/platforms/base.html b/uploader/templates/platforms/base.html
index dac965f..d4f3686 100644
--- a/uploader/templates/platforms/base.html
+++ b/uploader/templates/platforms/base.html
@@ -1,13 +1,17 @@
 {%extends "species/base.html"%}
+{%from "species/macro-display-species-card.html" import display_sui_species_card%}
 
-{%block lvl3_breadcrumbs%}
-<li {%if activelink=="platforms"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  <a href="{{url_for('species.populations.platforms.index')}}">
-    Sequencing Platforms</a>
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
+  <a href="{{url_for('species.platforms.list_platforms',
+           species_id=species['SpeciesId'])}}">
+    Platforms
+  </a>
 </li>
-{%block lvl4_breadcrumbs%}{%endblock%}
+{%endblock%}
+
+
+{%block sidebarcontents%}
+{{display_sui_species_card(species)}}
 {%endblock%}
diff --git a/uploader/templates/platforms/create-platform.html b/uploader/templates/platforms/create-platform.html
index 0866d5e..3a62472 100644
--- a/uploader/templates/platforms/create-platform.html
+++ b/uploader/templates/platforms/create-platform.html
@@ -1,19 +1,15 @@
 {%extends "platforms/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
-{%from "species/macro-display-species-card.html" import display_species_card%}
 
 {%block title%}Platforms &mdash; Create Platforms{%endblock%}
 
-{%block pagetitle%}Platforms &mdash; Create Platforms{%endblock%}
-
-{%block lvl3_breadcrumbs%}
-<li {%if activelink=="create-platform"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
   <a href="{{url_for('species.platforms.create_platform',
-           species_id=species.SpeciesId)}}">create platform</a>
+           species_id=species['SpeciesId'])}}">
+    Create
+  </a>
 </li>
 {%endblock%}
 
@@ -118,7 +114,3 @@
   </form>
 </div>
 {%endblock%}
-
-{%block sidebarcontents%}
-{{display_species_card(species)}}
-{%endblock%}
diff --git a/uploader/templates/platforms/list-platforms.html b/uploader/templates/platforms/list-platforms.html
index a6bcfdc..db14745 100644
--- a/uploader/templates/platforms/list-platforms.html
+++ b/uploader/templates/platforms/list-platforms.html
@@ -1,6 +1,5 @@
 {%extends "platforms/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
-{%from "species/macro-display-species-card.html" import display_species_card%}
 
 {%block title%}Platforms &mdash; List Platforms{%endblock%}
 
@@ -87,7 +86,3 @@
   {%endif%}
 </div>
 {%endblock%}
-
-{%block sidebarcontents%}
-{{display_species_card(species)}}
-{%endblock%}
diff --git a/uploader/templates/populations/base.html b/uploader/templates/populations/base.html
index 9db8083..24cacc2 100644
--- a/uploader/templates/populations/base.html
+++ b/uploader/templates/populations/base.html
@@ -1,18 +1,20 @@
 {%extends "species/base.html"%}
+{%from "populations/macro-display-population-card.html" import display_sui_population_card%}
 
-{%block lvl2_breadcrumbs%}
-<li {%if activelink=="populations"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  {%if population is mapping%}
+{%block breadcrumbs%}
+{{super()}}
+{%if population%}
+<li class="breadcrumb-item">
   <a href="{{url_for('species.populations.view_population',
-           species_id=species.SpeciesId,
-           population_id=population.Id)}}">{{population.Name}}</a>
-  {%else%}
-  <a href="{{url_for('species.populations.index')}}">Populations</a>
-  {%endif%}
+           species_id=species['SpeciesId'],
+           population_id=population['Id'])}}">
+    {{population["Name"]}}
+  </a>
 </li>
-{%block lvl3_breadcrumbs%}{%endblock%}
+{%endif%}
+{%endblock%}
+
+
+{%block sidebarcontents%}
+{{display_sui_population_card(species, population)}}
 {%endblock%}
diff --git a/uploader/templates/populations/create-population.html b/uploader/templates/populations/create-population.html
index 007b6bf..d5359f5 100644
--- a/uploader/templates/populations/create-population.html
+++ b/uploader/templates/populations/create-population.html
@@ -1,20 +1,16 @@
 {%extends "populations/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
-{%from "species/macro-select-species.html" import select_species_form%}
-{%from "species/macro-display-species-card.html" import display_species_card%}
 
 {%block title%}Create Population{%endblock%}
 
 {%block pagetitle%}Create Population{%endblock%}
 
-{%block lvl3_breadcrumbs%}
-<li {%if activelink=="create-population"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
   <a href="{{url_for('species.populations.create_population',
-           species_id=species.SpeciesId)}}">create population</a>
+           species_id=species['SpeciesId'])}}">
+    create population</a>
 </li>
 {%endblock%}
 
@@ -263,7 +259,3 @@
   </form>
 </div>
 {%endblock%}
-
-{%block sidebarcontents%}
-{{display_species_card(species)}}
-{%endblock%}
diff --git a/uploader/templates/populations/list-populations.html b/uploader/templates/populations/list-populations.html
index f780e94..a092e34 100644
--- a/uploader/templates/populations/list-populations.html
+++ b/uploader/templates/populations/list-populations.html
@@ -54,7 +54,7 @@
         <th></th>
         <th>Name</th>
         <th>Full Name</th>
-        <th>Description</th>
+        <th>Information</th>
       </tr>
     </thead>
 
@@ -71,7 +71,10 @@
           </a>
         </td>
         <td>{{population.FullName}}</td>
-        <td>{{population.Description}}</td>
+        <td><a href="https://info.genenetwork.org/species/source.php?SpeciesName={{species.Name}}&InbredSetName={{population.Name}}"
+               title="Link to detailed information on this population."
+               class="btn btn-info"
+               target="_blank">info</a></td>
       </tr>
       {%else%}
       <tr>
diff --git a/uploader/templates/populations/macro-display-population-card.html b/uploader/templates/populations/macro-display-population-card.html
index 16b477f..f3040ea 100644
--- a/uploader/templates/populations/macro-display-population-card.html
+++ b/uploader/templates/populations/macro-display-population-card.html
@@ -1,4 +1,4 @@
-{%from "species/macro-display-species-card.html" import display_species_card%}
+{%from "species/macro-display-species-card.html" import display_species_card,display_sui_species_card%}
 
 {%macro display_population_card(species, population)%}
 {{display_species_card(species)}}
@@ -39,3 +39,41 @@
   </div>
 </div>
 {%endmacro%}
+
+
+{%macro display_sui_population_card(species, population)%}
+{{display_sui_species_card(species)}}
+{%if population%}
+<div class="row">
+  <table class="table">
+    <caption>Current population</caption>
+    <tbody>
+      <tr>
+        <th>Name</th>
+        <td>{{population.Name}}</td>
+      </tr>
+
+      <tr>
+        <th>Full Name</th>
+        <td>{{population.FullName}}</td>
+      </tr>
+
+      <tr>
+        <th>Code</th>
+        <td>{{population.InbredSetCode}}</td>
+      </tr>
+
+      <tr>
+        <th>Genetic Type</th>
+        <td>{{population.GeneticType}}</td>
+      </tr>
+
+      <tr>
+        <th>Family</th>
+        <td>{{population.Family}}</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+{%endif%}
+{%endmacro%}
diff --git a/uploader/templates/populations/view-population.html b/uploader/templates/populations/view-population.html
index b23caeb..ac89bc7 100644
--- a/uploader/templates/populations/view-population.html
+++ b/uploader/templates/populations/view-population.html
@@ -1,102 +1,127 @@
 {%extends "populations/base.html"%}
-{%from "flash_messages.html" import flash_all_messages%}
-{%from "species/macro-select-species.html" import select_species_form%}
-{%from "species/macro-display-species-card.html" import display_species_card%}
-
-{%block title%}Populations{%endblock%}
-
-{%block pagetitle%}Populations{%endblock%}
-
-{%block lvl3_breadcrumbs%}
-<li {%if activelink=="view-population"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  <a href="{{url_for('species.populations.view_population',
-           species_id=species.SpeciesId,
-           population_id=population.InbredSetId)}}">view</a>
-</li>
-{%endblock%}
-
+{%from "macro-step-indicator.html" import step_indicator%}
+{%from "populations/macro-display-population-card.html" import display_sui_population_card%}
 
 {%block contents%}
 <div class="row">
-  <h2>Population Details</h2>
-
-  {{flash_all_messages()}}
-
-  <dl>
-    <dt>Name</dt>
-    <dd>{{population.Name}}</dd>
-
-    <dt>FullName</dt>
-    <dd>{{population.FullName}}</dd>
-
-    <dt>Code</dt>
-    <dd>{{population.InbredSetCode}}</dd>
-
-    <dt>Genetic Type</dt>
-    <dd>{{population.GeneticType}}</dd>
-
-    <dt>Family</dt>
-    <dd>{{population.Family}}</dd>
-
-    <dt>Description</dt>
-    <dd><pre>{{population.Description or "-"}}</pre></dd>
-  </dl>
+  <h2 class="heading">{{population.FullName}} ({{population.Name}})</h2>
 </div>
 
 <div class="row">
-  … maybe provide a way to organise populations in the same family here …
+  <ul class="nav nav-tabs" id="population-actions">
+    <li class="nav-item presentation">
+      <button class="nav-link"
+              id="samples-tab"
+              data-bs-toggle="tab"
+              data-bs-target="#samples-content"
+              type="button"
+              role="tab"
+              aria-controls="samples-content"
+              aria-selected="true">Samples</button></li>
+    <li class="nav-item presentation">
+      <button class="nav-link active"
+              id="phenotypes-tab"
+              data-bs-toggle="tab"
+              data-bs-target="#phenotypes-content"
+              type="button"
+              role="tab"
+              aria-controls="phenotypes-content"
+              aria-selected="false">Phenotypes</button></li>
+    {%if view_under_construction%}
+    <li class="nav-item presentation">
+      <button class="nav-link"
+              id="genotypes-tab"
+              data-bs-toggle="tab"
+              data-bs-target="#genotypes-content"
+              type="button"
+              role="tab"
+              aria-controls="genotypes-content"
+              aria-selected="false">Genotypes</button></li>
+    <li class="nav-item presentation">
+      <button class="nav-link"
+              id="expression-data-tab"
+              data-bs-toggle="tab"
+              data-bs-target="#expression-data-content"
+              type="button"
+              role="tab"
+              aria-controls="expression-data-content"
+              aria-selected="false">Expression-Data</button></li>
+    {%endif%}
+  </ul>
 </div>
 
 <div class="row">
-  <h3>Actions</h3>
-
-  <p>
-    Click any of the following links to use this population in performing the
-    subsequent operations.
-  </p>
-
-  <nav class="nav">
-    <ul>
-      <li>
-        <a href="{{url_for('species.populations.samples.list_samples',
-                 species_id=species.SpeciesId,
-                 population_id=population.Id)}}"
-           title="Manage samples: Add new or delete existing.">
-          manage samples</a>
-      </li>
-      <li>
-        <a href="{{url_for('species.populations.genotypes.list_genotypes',
-                 species_id=species.SpeciesId,
-                 population_id=population.Id)}}"
-           title="Manage genotypes for {{species.FullName}}">Manage Genotypes</a>
-      </li>
-      <li>
-        <a href="{{url_for('species.populations.phenotypes.list_datasets',
-                 species_id=species.SpeciesId,
-                 population_id=population.Id)}}"
-           title="Manage phenotype data.">manage phenotype data</a>
-      </li>
-      <li>
-        <a href="#" title="Manage expression data"
-           class="not-implemented">manage expression data</a>
-      </li>
-      <li>
-        <a href="#" title="Manage individual data"
-           class="not-implemented">manage individual data</a>
-      </li>
-      <li>
-        <a href="#" title="Manage RNA-Seq data"
-           class="not-implemented">manage RNA-Seq data</a>
-      </li>
-    </ul>
-  </nav>
+  <div class="tab-content" id="populations-tabs-content">
+    <div class="tab-pane fade"
+         id="samples-content"
+         role="tabpanel"
+         aria-labelledby="samples-content-tab">
+      <p>Think of a <strong>"sample"</strong> as say a single case or individual
+        in the experiment. It could even be a single strain (where applicable).
+      </p>
+      <p>This is a convenience feature for when you want to upload phenotypes to
+        the system, but do not have the genotypes data ready yet.</p>
+      <a href="{{url_for('species.populations.samples.list_samples',
+               species_id=species.SpeciesId,
+               population_id=population.Id)}}"
+         title="View and upload samples for population '{{population['Name']}}'"
+         class="btn btn-primary">Manage Samples</a>
+    </div>
+
+    <div class="tab-pane fade show active"
+         id="phenotypes-content"
+         role="tabpanel"
+         aria-labelledby="phenotypes-content-tab">
+
+      <div class="row" style="margin-top: 1em;">
+        <h3> Phenotypes in  Population "{{population.FullName}} ({{population.Name}})"</h3>
+
+        <p>To view existing phenotype traits, or upload new ones, click the button below:</p>
+
+        <div class="row">
+          <div class="col">
+            <a href="{{url_for(
+                     'species.populations.phenotypes.list_datasets',
+                     species_id=species.SpeciesId,
+                     population_id=population.Id)}}"
+               title="View and upload phenotype traits"
+               class="btn btn-primary">Phenotypes</a>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="tab-pane fade"
+         id="genotypes-content"
+         role="tabpanel"
+         aria-labelledby="genotypes-content-tab">
+      <p>This allows you to upload the data that concerns your genotypes.</p>
+      <p>Any samples/individuals/cases/strains that do not already exist in the
+        system will be added. This does not delete any existing data.</p>
+      <a href="{{url_for('species.populations.genotypes.list_genotypes',
+               species_id=species.SpeciesId,
+               population_id=population.Id)}}"
+         title="Upload genotype information for the '{{population.FullName}}' population of the '{{species.FullName}}' species."
+         class="btn btn-primary">upload genotypes</a>
+    </div>
+    <div class="tab-pane fade" id="expression-data-content" role="tabpanel" aria-labelledby="expression-data-content-tab">
+      <p>Upload expression data (mRNA data) for this population.</p>
+      <a href="#" title="" class="btn btn-primary">upload genotypes</a>
+    </div>
+  </div>
 </div>
 {%endblock%}
 
 {%block sidebarcontents%}
-{{display_species_card(species)}}
+<div class="row">
+  <p>Each tab presents a feature that's available at the population level.
+    Select the tab that allows you to continue with your task.</p>
+</div>
+{{super()}}
+{%endblock%}
+
+
+
+
+{%block javascript%}
 {%endblock%}
diff --git a/uploader/templates/publications/base.html b/uploader/templates/publications/base.html
index db80bfa..de0a350 100644
--- a/uploader/templates/publications/base.html
+++ b/uploader/templates/publications/base.html
@@ -1,12 +1,9 @@
 {%extends "base.html"%}
 
-{%block lvl1_breadcrumbs%}
-<li {%if activelink=="publications"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  <a href="{{url_for('publications.index')}}">Publications</a>
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
+  <a href="{{url_for('publications.index')}}"
+     title="Manage publications">Publications</a>
 </li>
-{%block lvl2_breadcrumbs%}{%endblock%}
 {%endblock%}
diff --git a/uploader/templates/publications/create-publication.html b/uploader/templates/publications/create-publication.html
index 3f828a9..fb0127d 100644
--- a/uploader/templates/publications/create-publication.html
+++ b/uploader/templates/publications/create-publication.html
@@ -3,7 +3,13 @@
 
 {%block title%}View Publication{%endblock%}
 
-{%block pagetitle%}View Publication{%endblock%}
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
+  <a href="{{url_for('publications.create_publication', **get_args)}}"
+     title="Manage publications">create publication</a>
+</li>
+{%endblock%}
 
 
 {%block contents%}
@@ -12,7 +18,7 @@
 <div class="row">
   <form id="frm-create-publication"
         method="POST"
-        action="{{url_for('publications.create_publication', **request.args)}}"
+        action="{{url_for('publications.create_publication', **get_args)}}"
         class="form-horizontal">
 
     <div class="row mb-3">
@@ -152,11 +158,14 @@
       </div>
     </div>
 
-    <div class="row mb-3">
-      <div class="col-sm-2"></div>
-      <div class="col-sm-8">
-        <input type="submit" class="btn btn-primary" value="Add" />
-        <input type="reset" class="btn btn-danger" />
+    <div class="row">
+      <div class="col">
+        <input type="submit"
+               class="btn btn-primary"
+               value="create publication" />
+      </div>
+      <div class="col">
+        <input type="reset" class="btn btn-danger" value="reset form" />
       </div>
     </div>
 
diff --git a/uploader/templates/publications/delete-publication-success.html b/uploader/templates/publications/delete-publication-success.html
new file mode 100644
index 0000000..53a44ec
--- /dev/null
+++ b/uploader/templates/publications/delete-publication-success.html
@@ -0,0 +1,18 @@
+{%extends "publications/base.html"%}
+{%from "flash_messages.html" import flash_all_messages%}
+
+{%block title%}View Publication{%endblock%}
+
+{%block pagetitle%}View Publication{%endblock%}
+
+
+{%block contents%}
+{{flash_all_messages()}}
+{%endblock%}
+
+
+{%block javascript%}
+<script type="text/javascript">
+  $(function() {});
+</script>
+{%endblock%}
diff --git a/uploader/templates/publications/delete-publication.html b/uploader/templates/publications/delete-publication.html
new file mode 100644
index 0000000..a9c8c7c
--- /dev/null
+++ b/uploader/templates/publications/delete-publication.html
@@ -0,0 +1,95 @@
+{%extends "publications/base.html"%}
+{%from "flash_messages.html" import flash_all_messages%}
+
+{%block title%}Delete Publication{%endblock%}
+
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
+  <a href="{{url_for('publications.delete_publication',
+           publication_id=publication.Id)}}"
+     title="Manage publications">delete publication</a>
+</li>
+{%endblock%}
+
+
+{%block contents%}
+{{flash_all_messages()}}
+<div class="row">
+  <p>You are about to delete the publication with the following details:</p>
+</div>
+
+<div class="row">
+  <table class="table">
+    <tr>
+      <th>Linked Phenotypes</th>
+      <td>{{linked_phenotypes | count}}</td>
+    </tr>
+    <tr>
+      <th>PubMed</th>
+      <td>
+        {%if publication.PubMed_ID%}
+        <a href="https://pubmed.ncbi.nlm.nih.gov/{{publication.PubMed_ID}}/"
+           target="_blank">{{publication.PubMed_ID}}</a>
+        {%else%}
+        —
+        {%endif%}
+      </td>
+    </tr>
+    <tr>
+      <th>Title</th>
+      <td>{{publication.Title or "—"}}</td>
+    </tr>
+    <tr>
+      <th>Authors</th>
+      <td>{{publication.Authors or "—"}}</td>
+    </tr>
+    <tr>
+      <th>Journal</th>
+      <td>{{publication.Journal or "—"}}</td>
+    </tr>
+    <tr>
+      <th>Published</th>
+      <td>{{publication.Month or ""}} {{publication.Year or "—"}}</td>
+    </tr>
+    <tr>
+      <th>Volume</th>
+      <td>{{publication.Volume or "—"}}</td>
+    </tr>
+    <tr>
+      <th>Pages</th>
+      <td>{{publication.Pages or "—"}}</td>
+    </tr>
+    <tr>
+      <th>Abstract</th>
+      <td>
+        {%for line in (publication.Abstract or "—").replace("\r\n", "<br />").replace("\n", "<br />").split("<br />")%}
+        <p>{{line}}</p>
+        {%endfor%}
+      </td>
+    </tr>
+  </table>
+</div>
+
+<div class="row">
+  <p>If you are sure that is what you want, click the button below to delete the
+    publication</p>
+  <p class="form-text text-small">
+    <small>You will not be able to recover the data if you click
+      delete below.</small></p>
+
+  <form action="{{url_for('publications.delete_publication', publication_id=publication_id)}}"
+        method="POST">
+    <div class="form-group">
+      <input type="submit" value="delete" class="btn btn-danger" />
+    </div>
+  </form>
+</div>
+{%endblock%}
+
+
+{%block javascript%}
+<script type="text/javascript">
+  $(function() {});
+</script>
+{%endblock%}
diff --git a/uploader/templates/publications/edit-publication.html b/uploader/templates/publications/edit-publication.html
index 540ecf1..314a78c 100644
--- a/uploader/templates/publications/edit-publication.html
+++ b/uploader/templates/publications/edit-publication.html
@@ -1,9 +1,16 @@
 {%extends "publications/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
 
-{%block title%}View Publication{%endblock%}
-
-{%block pagetitle%}View Publication{%endblock%}
+{%block title%}Edit Publication{%endblock%}
+
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
+  <a href="{{url_for('publications.edit_publication',
+           publication_id=publication.Id)}}"
+     title="Edit the publication's details">edit publication</a>
+</li>
+{%endblock%}
 
 
 {%block contents%}
@@ -12,7 +19,9 @@
 <div class="row">
   <form id="frm-create-publication"
         method="POST"
-        action="{{url_for('publications.edit_publication', publication_id=publication_id, **request.args)}}"
+        action="{{url_for('publications.edit_publication',
+                publication_id=publication_id,
+                next=request.args.get('next', ''))}}"
         class="form-horizontal">
 
     <div class="row mb-3">
diff --git a/uploader/templates/publications/index.html b/uploader/templates/publications/index.html
index 369812b..eb2e81b 100644
--- a/uploader/templates/publications/index.html
+++ b/uploader/templates/publications/index.html
@@ -3,23 +3,29 @@
 
 {%block title%}Publications{%endblock%}
 
-{%block pagetitle%}Publications{%endblock%}
-
 
 {%block contents%}
 {{flash_all_messages()}}
 
 <div class="row" style="padding-bottom: 1em;">
-  <a href="{{url_for('publications.create_publication')}}"
-     class="btn btn-primary">
-    add new publication</a>
+  <div class="col">
+    <a href="{{url_for('publications.create_publication')}}"
+       class="btn btn-primary"
+       title="Create a new publication.">
+      add new publication</a>
+  </div>
+</div>
+
+<div class="row">
+  <p>Click on the title to view more details or to edit the information for that
+    publication.</p>
 </div>
 
 <div class="row">
   <table id="tbl-list-publications" class="table compact stripe">
     <thead>
       <tr>
-        <th>#</th>
+        <th>Index</th>
         <th>PubMed ID</th>
         <th>Title</th>
         <th>Authors</th>
@@ -33,6 +39,8 @@
 
 
 {%block javascript%}
+<script type="text/javascript" src="/static/js/urls.js"></script>
+
 <script type="text/javascript">
   $(function() {
       var publicationsDataTable = buildDataTable(
@@ -43,24 +51,25 @@
               {
                   searchable: true,
                   data: (pub) => {
-                  if(pub.PubMed_ID) {
-                      return `<a href="https://pubmed.ncbi.nlm.nih.gov/` +
-                          `${pub.PubMed_ID}/" target="_blank" ` +
-                          `title="Link to publication on NCBI.">` +
-                          `${pub.PubMed_ID}</a>`;
-                  }
-                  return "";
+                      if(pub.PubMed_ID) {
+                          return `<a href="https://pubmed.ncbi.nlm.nih.gov/` +
+                              `${pub.PubMed_ID}/" target="_blank" ` +
+                              `title="Link to publication on NCBI.">` +
+                              `${pub.PubMed_ID}</a>`;
+                      }
+                      return "";
                   }
               },
               {
                   searchable: true,
                   data: (pub) => {
-                  var title = "⸻";
-                  if(pub.Title) {
-                      title = pub.Title
-                  }
-                  return `<a href="/publications/view/${pub.Id}" ` +
-                          `target="_blank" ` +
+                      var title = "⸻";
+                      if(pub.Title) {
+                          title = pub.Title
+                      }
+                      url=buildURLFromCurrentURL(
+                          `/publications/view/${pub.Id}`);
+                      return `<a href="${url}" target="_blank" ` +
                           `title="Link to view publication details">` +
                           `${title}</a>`;
                   }
@@ -68,12 +77,12 @@
               {
                   searchable: true,
                   data: (pub) => {
-                  authors = pub.Authors.split(",").map(
-                      (item) => {return item.trim();});
-                  if(authors.length > 1) {
-                      return authors[0] + ", et. al.";
-                  }
-                  return authors[0];
+                      authors = pub.Authors.split(",").map(
+                          (item) => {return item.trim();});
+                      if(authors.length > 1) {
+                          return authors[0] + ", et. al.";
+                      }
+                      return authors[0];
                   }
               }
           ],
diff --git a/uploader/templates/publications/view-publication.html b/uploader/templates/publications/view-publication.html
index 0bd7bc5..01ccf1e 100644
--- a/uploader/templates/publications/view-publication.html
+++ b/uploader/templates/publications/view-publication.html
@@ -3,8 +3,6 @@
 
 {%block title%}View Publication{%endblock%}
 
-{%block pagetitle%}View Publication{%endblock%}
-
 
 {%block contents%}
 {{flash_all_messages()}}
diff --git a/uploader/templates/samples/base.html b/uploader/templates/samples/base.html
index 291782b..7fd5020 100644
--- a/uploader/templates/samples/base.html
+++ b/uploader/templates/samples/base.html
@@ -1,12 +1,25 @@
 {%extends "populations/base.html"%}
+{%from "populations/macro-display-population-card.html" import display_sui_population_card%}
 
-{%block lvl3_breadcrumbs%}
-<li {%if activelink=="samples"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  <a href="{{url_for('species.populations.samples.index')}}">Samples</a>
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
+  <a href="{{url_for('species.populations.samples.list_samples',
+           species_id=species['SpeciesId'],
+           population_id=population.Id)}}">
+    Samples
+  </a>
 </li>
-{%block lvl4_breadcrumbs%}{%endblock%}
+{%endblock%}
+
+{%block contents%}
+<div class="row">
+  <h2 class="heading">{{population.FullName}} ({{population.Name}})</h2>
+</div>
+{%endblock%}
+
+
+
+{%block sidebarcontents%}
+{{display_sui_population_card(species, population)}}
 {%endblock%}
diff --git a/uploader/templates/samples/list-samples.html b/uploader/templates/samples/list-samples.html
index aed27c3..3aac984 100644
--- a/uploader/templates/samples/list-samples.html
+++ b/uploader/templates/samples/list-samples.html
@@ -1,53 +1,34 @@
 {%extends "samples/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
 {%from "populations/macro-select-population.html" import select_population_form%}
-{%from "populations/macro-display-population-card.html" import display_population_card%}
 
 {%block title%}Samples &mdash; List Samples{%endblock%}
 
-{%block pagetitle%}Samples &mdash; List Samples{%endblock%}
-
-{%block lvl4_breadcrumbs%}
-<li {%if activelink=="list-samples"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  <a href="{{url_for('species.populations.samples.list_samples',
-           species_id=species.SpeciesId,
-           population_id=population.Id)}}">List</a>
-</li>
-{%endblock%}
-
 {%block contents%}
-{{flash_all_messages()}}
+{{super()}}
 
 <div class="row">
-  <p>
-    You selected the population "{{population.FullName}}" from the
-    "{{species.FullName}}" species.
-  </p>
+  <h3 class="subheading">manage samples</h3>
+  {{flash_all_messages()}}
 </div>
 
 <div class="row">
-  <p>
+  <div class="col">
     <a href="{{url_for('species.populations.samples.upload_samples',
              species_id=species.SpeciesId,
              population_id=population.Id)}}"
        title="Add samples for population '{{population.FullName}}' from species
               '{{species.FullName}}'."
-       class="btn btn-primary">
-      add samples
-    </a>
-  </p>
+       class="btn btn-primary">add new samples</a>
+  </div>
 </div>
 
 {%if samples | length > 0%}
 <div class="row">
   <p>
-    This population already has <strong>{{total_samples}}</strong>
-    samples/individuals entered. You can explore the list of samples in this
-    population in the table below.
+    Population "{{population.FullName}} ({{population.Name}})" already has
+    <strong>{{total_samples}}</strong> samples/individuals entered. You can
+    explore the list of samples in the table below.
   </p>
 </div>
 
@@ -106,15 +87,6 @@
       {%endfor%}
     </tbody>
   </table>
-
-  <p>
-    <a href="#"
-       title="Delete samples from population '{{population.FullName}}' from species
-              '{{species.FullName}}'."
-       class="btn btn-danger not-implemented">
-      delete all samples
-    </a>
-  </p>
 </div>
 {%else%}
 <div class="row">
@@ -124,7 +96,3 @@
 {%endif%}
 
 {%endblock%}
-
-{%block sidebarcontents%}
-{{display_population_card(species, population)}}
-{%endblock%}
diff --git a/uploader/templates/samples/upload-failure.html b/uploader/templates/samples/upload-failure.html
index 2cf8053..75192ec 100644
--- a/uploader/templates/samples/upload-failure.html
+++ b/uploader/templates/samples/upload-failure.html
@@ -1,6 +1,5 @@
 {%extends "base.html"%}
 {%from "cli-output.html" import cli_output%}
-{%from "populations/macro-display-population-card.html" import display_population_card%}
 
 {%block title%}Samples Upload Failure{%endblock%}
 
@@ -31,7 +30,3 @@
 {{cli_output(job, "stderr")}}
 </div>
 {%endblock%}
-
-{%block sidebarcontents%}
-{{display_population_card(species, population)}}
-{%endblock%}
diff --git a/uploader/templates/samples/upload-progress.html b/uploader/templates/samples/upload-progress.html
index 677d457..38f931b 100644
--- a/uploader/templates/samples/upload-progress.html
+++ b/uploader/templates/samples/upload-progress.html
@@ -1,6 +1,5 @@
 {%extends "samples/base.html"%}
 {%from "cli-output.html" import cli_output%}
-{%from "populations/macro-display-population-card.html" import display_population_card%}
 
 {%block extrameta%}
 <meta http-equiv="refresh" content="5">
@@ -25,7 +24,3 @@
 </div>
 
 {%endblock%}
-
-{%block sidebarcontents%}
-{{display_population_card(species, population)}}
-{%endblock%}
diff --git a/uploader/templates/samples/upload-samples.html b/uploader/templates/samples/upload-samples.html
index 6422094..1f665a3 100644
--- a/uploader/templates/samples/upload-samples.html
+++ b/uploader/templates/samples/upload-samples.html
@@ -1,21 +1,16 @@
 {%extends "samples/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
-{%from "populations/macro-select-population.html" import select_population_form%}
-{%from "populations/macro-display-population-card.html" import display_population_card%}
 
 {%block title%}Samples &mdash; Upload Samples{%endblock%}
 
-{%block pagetitle%}Samples &mdash; Upload Samples{%endblock%}
-
-{%block lvl4_breadcrumbs%}
-<li {%if activelink=="uploade-samples"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
+{%block breadcrumbs%}
+{{super()}}
+<li class="breadcrumb-item">
   <a href="{{url_for('species.populations.samples.upload_samples',
-           species_id=species.SpeciesId,
-           population_id=population.Id)}}">List</a>
+           species_id=species['SpeciesId'],
+           population_id=population.Id)}}">
+    Upload
+  </a>
 </li>
 {%endblock%}
 
@@ -23,35 +18,6 @@
 {{flash_all_messages()}}
 
 <div class="row">
-  <p>
-    You can now upload the samples for the "{{population.FullName}}" population
-    from the "{{species.FullName}}" species here.
-  </p>
-  <p>
-    Upload a <strong>character-separated value (CSV)</strong> file that contains
-    details about your samples. The CSV file should have the following fields:
-    <dl>
-      <dt>Name</dt>
-      <dd>The primary name/identifier for the sample/individual.</dd>
-
-      <dt>Name2</dt>
-      <dd>A secondary name for the sample. This can simply be the same as
-        <strong>Name</strong> above. This field <strong>MUST</strong> contain a
-        value.</dd>
-
-      <dt>Symbol</dt>
-      <dd>A symbol for the sample. This can be a strain name, e.g. 'BXD60' for
-        species that have strains. This field can be left empty for species like
-        Humans that do not have strains..</dd>
-
-      <dt>Alias</dt>
-      <dd>An alias for the sample. Can be an empty field, or take on the same
-        value as that of the Symbol.</dd>
-    </dl>
-  </p>
-</div>
-
-<div class="row">
   <form id="form-samples"
         method="POST"
         action="{{url_for('species.populations.samples.upload_samples',
@@ -65,14 +31,17 @@
 
     <div class="form-group">
       <label for="file-samples" class="form-label">select file</label>
-      <input type="file" name="samples_file" id="file:samples"
+      <input type="file" name="samples_file" id="file-samples"
 	     accept="text/csv, text/tab-separated-values, text/plain"
 	     class="form-control" />
+      <small class="form-text text-muted">
+        See the <a href="#docs-samples-upload">documentation below</a> for
+        details on expected file format.</small>
     </div>
 
     <div class="form-group">
-      <label for="select:separator" class="form-label">field separator</label>
-      <select id="select:separator"
+      <label for="select-separator" class="form-label">field separator</label>
+      <select id="select-separator"
 	      name="separator"
 	      required="required"
 	      class="form-control">
@@ -83,7 +52,7 @@
         <option value=";">Semicolon</option>
         <option value="other">Other</option>
       </select>
-      <input id="txt:separator"
+      <input id="txt-separator"
 	     type="text"
 	     name="other_separator"
 	     class="form-control" />
@@ -95,11 +64,11 @@
     </div>
 
     <div class="form-group form-check">
-      <input id="chk:heading"
+      <input id="chk-heading"
 	     type="checkbox"
 	     name="first_line_heading"
 	     class="form-check-input" />
-      <label for="chk:heading" class="form-check-label">
+      <label for="chk-heading" class="form-check-label">
         first line is a heading?</label>
       <small class="form-text text-muted">
         Select this if the first line in your file contains headings for the
@@ -108,8 +77,8 @@
     </div>
 
     <div class="form-group">
-      <label for="txt:delimiter" class="form-label">field delimiter</label>
-      <input id="txt:delimiter"
+      <label for="txt-delimiter" class="form-label">field delimiter</label>
+      <input id="txt-delimiter"
 	     type="text"
 	     name="field_delimiter"
 	     maxlength="1"
@@ -149,10 +118,34 @@
     </tbody>
   </table>
 </div>
-{%endblock%}
 
-{%block sidebarcontents%}
-{{display_population_card(species, population)}}
+
+
+<div class="row" id="docs-samples-upload">
+  <h3 class="subheading">File Format</h3>
+  <p>
+    Upload a <strong>character-separated value (CSV)</strong> file that contains
+    details about your samples. The CSV file should have the following fields:
+    <dl>
+      <dt>Name</dt>
+      <dd>The primary name/identifier for the sample/individual.</dd>
+
+      <dt>Name2</dt>
+      <dd>A secondary name for the sample. This can simply be the same as
+        <strong>Name</strong> above. This field <strong>MUST</strong> contain a
+        value.</dd>
+
+      <dt>Symbol</dt>
+      <dd>A symbol for the sample. This can be a strain name, e.g. 'BXD60' for
+        species that have strains. This field can be left empty for species like
+        Humans that do not have strains..</dd>
+
+      <dt>Alias</dt>
+      <dd>An alias for the sample. Can be an empty field, or take on the same
+        value as that of the Symbol.</dd>
+    </dl>
+  </p>
+</div>
 {%endblock%}
 
 {%block javascript%}
diff --git a/uploader/templates/samples/upload-success.html b/uploader/templates/samples/upload-success.html
index 881d466..d6318e9 100644
--- a/uploader/templates/samples/upload-success.html
+++ b/uploader/templates/samples/upload-success.html
@@ -1,6 +1,5 @@
 {%extends "samples/base.html"%}
 {%from "cli-output.html" import cli_output%}
-{%from "populations/macro-display-population-card.html" import display_population_card%}
 
 {%block title%}Job Status{%endblock%}
 
@@ -30,7 +29,3 @@
 </div>
 
 {%endblock%}
-
-{%block sidebarcontents%}
-{{display_population_card(species, population)}}
-{%endblock%}
diff --git a/uploader/templates/species/base.html b/uploader/templates/species/base.html
index f64f72b..3be79f0 100644
--- a/uploader/templates/species/base.html
+++ b/uploader/templates/species/base.html
@@ -1,17 +1,12 @@
 {%extends "base.html"%}
 
-{%block lvl1_breadcrumbs%}
-<li {%if activelink=="species"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  {%if species is mapping%}
-  <a href="{{url_for('species.view_species', species_id=species.SpeciesId)}}">
-    {{species.Name}}</a>
-  {%else%}
-  <a href="{{url_for('species.list_species')}}">Species</a>
-  {%endif%}
+{%block breadcrumbs%}
+{{super()}}
+{%if species%}
+<li class="breadcrumb-item">
+  <a href="{{url_for('species.view_species', species_id=species['SpeciesId'])}}">
+    {{species["Name"]|title}}
+  </a>
 </li>
-{%block lvl2_breadcrumbs%}{%endblock%}
+{%endif%}
 {%endblock%}
diff --git a/uploader/templates/species/macro-display-species-card.html b/uploader/templates/species/macro-display-species-card.html
index 166c7b9..30c564f 100644
--- a/uploader/templates/species/macro-display-species-card.html
+++ b/uploader/templates/species/macro-display-species-card.html
@@ -20,3 +20,32 @@
   </div>
 </div>
 {%endmacro%}
+
+
+{%macro display_sui_species_card(species)%}
+<div class="row">
+  <table class="table">
+    <caption>Current Species</caption>
+    <tbody>
+      <tr>
+        <th>Name</th>
+        <td>{{species["Name"] | title}}</td>
+      </tr>
+      <tr>
+        <th>Scientific</th>
+        <td>{{species["FullName"]}}</td>
+      </tr>
+      {%if species["TaxonomyId"]%}
+      <tr>
+        <th>Taxonomy ID</th>
+        <td>
+          <a href="https://www.ncbi.nlm.nih.gov/Taxonomy/Browser/wwwtax.cgi?id={{species.TaxonomyId}}"
+             title="NCBI's Taxonomy Browser page for {{species.Name}}">
+            {{species.TaxonomyId}}</a>
+        </td>
+      </tr>
+    </tbody>
+    {%endif%}
+  </table>
+</div>
+{%endmacro%}
diff --git a/uploader/templates/species/view-species.html b/uploader/templates/species/view-species.html
index 2d02f7e..81608fc 100644
--- a/uploader/templates/species/view-species.html
+++ b/uploader/templates/species/view-species.html
@@ -1,90 +1,127 @@
 {%extends "species/base.html"%}
 {%from "flash_messages.html" import flash_all_messages%}
+{%from "macro-forms.html" import add_http_feature_flags%}
+{%from "macro-step-indicator.html" import step_indicator%}
+{%from "species/macro-display-species-card.html" import display_sui_species_card%}
 
 {%block title%}View Species{%endblock%}
 
-{%block pagetitle%}View Species{%endblock%}
+{%macro add_form_buttons()%}
+<div class="row form-buttons">
+  <div class="col">
+    <input type="submit"
+           value="use selected population"
+           class="btn btn-primary" />
+  </div>
+
+  <div class="col">
+    <a href="{{url_for('species.populations.create_population',
+             species_id=species.SpeciesId,
+             return_to='species.view_species')}}"
+       title="Create a new population for species '{{species.Name}}'."
+       class="btn btn-outline-info">
+      Create a new population
+    </a>
+  </div>
+</div>
+{%endmacro%}
 
-{%block lvl2_breadcrumbs%}
-<li {%if activelink=="view-species"%}
-    class="breadcrumb-item active"
-    {%else%}
-    class="breadcrumb-item"
-    {%endif%}>
-  <a href="{{url_for('species.view_species', species_id=species.SpeciesId)}}">View</a>
-</li>
-{%endblock%}
 
 {%block contents%}
-{{flash_all_messages()}}
 <div class="row">
-  <h2>Details on species {{species.FullName}}</h2>
+  <h2 class="heading">{{species.FullName}} ({{species.Name}})</h2>
+</div>
 
-  <dl>
-    <dt>Common Name</dt>
-    <dd>{{species.SpeciesName}}</dd>
+<div class "row">
+  <ul class="nav nav-tabs" id="species-actions">
+    <li class="nav-item presentation">
+      <button class="nav-link active"
+              id="populations-tab"
+              data-bs-toggle="tab"
+              data-bs-target="#populations-content"
+              type="button"
+              role="tab"
+              aria-controls="populations-content"
+              aria-selected="true">Populations</button>
+    </li>
+    <li class="nav-item presentation">
+      <button class="nav-link"
+              id="sequencing-platforms-tab"
+              data-bs-toggle="tab"
+              data-bs-target="#sequencing-platforms-content"
+              type="button"
+              role="tab"
+              aria-controls="sequencing-platforms-content"
+              aria-selected="true">Sequencing Platforms</button>
+    </li>
+  </ul>
+</div>
 
-    <dt>Scientific Name</dt>
-    <dd>{{species.FullName}}</dd>
+<div class="row">
+  <div class="tab-content" id="species-tabs-content">
+    <div class="tab-pane fade show active"
+         id="populations-content"
+         role="tabpanel"
+         aria-labelledby="populations-content-tab">
+      <p>Data belonging to a particular species is further divided into one or more
+        populations for easier handling. Please select the population you want to work
+        with.</p>
 
-    <dt>Taxonomy ID</dt>
-    <dd>{{species.TaxonomyId}}</dd>
-  </dl>
+      <form method="GET"
+            action="{{url_for('species.view_species', species_id=species.SpeciesId)}}"
+            class="form-horizontal">
+        {{add_http_feature_flags()}}
+        {{add_form_buttons()}}
 
-  <h3>Actions</h3>
+        {%if populations | length != 0%}
+        <div style="margin-top:0.3em;">
+          <table id="tbl-select-population" class="table compact stripe"
+                 data-populations-list='{{populations | tojson}}'>
+            <thead>
+              <tr>
+                <th></th>
+                <th>Population</th>
+              </tr>
+            </thead>
 
-  <p>
-    You can proceed to perform any of the following actions for species
-    {{species.FullName}}
-  </p>
+            <tbody></tbody>
+          </table>
+        </div>
 
-  <ol>
-    <li>
-      <a href="{{url_for('species.populations.list_species_populations',
-               species_id=species.SpeciesId)}}"
-         title="Create/Edit populations for {{species.FullName}}">
-        Manage populations</a>
-    </li>
-    <li>
-      <a href="{{url_for('species.platforms.list_platforms',
-               species_id=species.SpeciesId)}}"
-         title="Create/Edit sequencing platforms for {{species.FullName}}">
-        Manage sequencing platforms</a>
-    </li>
-  </ol>
+        {%else%}
+        <p class="form-text">
+          There are no populations currently defined for {{species['FullName']}}
+          ({{species['SpeciesName']}}).</p>
+        {%endif%}
 
-  
+        {{add_form_buttons()}}
+
+      </form>
+    </div>
+    <div class="tab-pane fade"
+         id="sequencing-platforms-content"
+         role="tabpanel"
+         aria-labelledby="sequencing-platforms-content-tab">
+      <p>Upload and manage the sequencing platforms for species
+        '{{species.Name | title}} ({{species.FullName}})'
+        <a href="{{url_for('species.platforms.list_platforms',
+                 species_id=species.SpeciesId)}}"
+           title="Manage sequencing platforms for {{species.Name}}">here</a>.
+      </p>
+    </div>
+  </div>
 </div>
 {%endblock%}
 
 {%block sidebarcontents%}
-<div class="card">
-  <div class="card-body">
-    <h5 class="card-title">Species Extras</h5>
-    <div class="card-text">
-      <p>Some extra internal-use details (mostly for UI concerns on GeneNetwork)</p>
-      <p>
-        <small>
-          If you do not understand what the following are about, simply ignore them
-          &mdash;
-          They have no bearing whatsoever on your data, or its analysis.
-        </small>
-      </p>
-      <dl>
-        <dt>Family</dt>
-        <dd>{{species.Family}}</dd>
+<div class="row">
+  <p>You can manage species' populations and sequencing platforms here. Select
+    the tab for the feature you wish to continue working on.</p>
+</div>
+{{display_sui_species_card(species)}}
+{%endblock%}
 
-        <dt>FamilyOrderId</dt>
-        <dd>{{species.FamilyOrderId}}</dd>
 
-        <dt>OrderId</dt>
-        <dd>{{species.OrderId}}</dd>
-      </dl>
-    </div>
-    <a href="{{url_for('species.edit_species_extra',
-             species_id=species.SpeciesId)}}"
-       class="card-link"
-       title="Edit the species' internal-use details.">Edit</a>
-  </div>
-</div>
+{%block javascript%}
+<script type="text/javascript" src="/static/js/populations.js"></script>
 {%endblock%}