Merge pull request #6 from catalystneuro/feature/landing-page-update

Feature/landing page update

assets/scss/_variables_project.scss

@@ -8,14 +8,16 @@ $secondary: #005B7F;
 
 // Banner styles
 .home-banner {
-    background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('/images/dandi-banner.png');
-    background-size: cover;
-    background-position: center;
-    min-height: 80vh;
+    background-color: #4C4C4C;
+    min-height: 40vh;
+    width: 100vw;
     color: #fff;
     position: relative;
     padding: 4rem 0;
-    margin-bottom: 0;
+    margin: 0;
+    margin-left: calc(-50vw + 50%);
+    margin-right: calc(-50vw + 50%);
+    overflow: hidden;
 
     .container {
         position: relative;
@@ -24,7 +26,7 @@ $secondary: #005B7F;
 
     h1 {
         font-size: 3rem;
-        font-weight: 300;
+        font-weight: 400;
         margin-bottom: 2rem;
         color: #fff;
         line-height: 1.2;
@@ -248,28 +250,6 @@ $secondary: #005B7F;
     }
 }
 
-// Alert styles
-.top-alert {
-    background-color: #f8d7da;
-    border-color: #f5c6cb;
-    color: #721c24;
-    padding: 0.75rem 1.25rem;
-    margin-bottom: 0;
-    text-align: center;
-    position: relative;
-    z-index: 2;
-
-    a {
-        color: #721c24;
-        text-decoration: underline;
-        font-weight: 500;
-
-        &:hover {
-            color: darken(#721c24, 10%);
-        }
-    }
-}
-
 // Hide page meta elements
 .td-page-meta__view {
     display: none !important;

content/en/_index.md

@@ -2,10 +2,6 @@
 title: DANDI
 ---
 
-<div class="top-alert">
-  Help us help you! Please take our <strong><a href="https://docs.google.com/forms/d/e/1FAIpQLScT0KLxT8pgQ4y6_Wqa_1IPHKJOrxGJ6nPMwxh1QS3od3P1lw/viewform">survey</a></strong> so we can learn about your data needs.
-</div>
-
 {{< blocks/banner title="DANDI: Distributed Archives for Neurophysiology Data Integration" show_news="true" >}}
 The DANDI platform is supported by the [BRAIN Initiative](https://braininitiative.nih.gov/) for publishing, sharing, and processing neurophysiology data. The archive accepts cellular neurophysiology data including electrophysiology, optophysiology, and behavioral time-series, and images from immunostaining experiments. The platform is now available for data upload and distribution. The storage of data in the archive is also supported by the [Amazon Opendata program](https://registry.opendata.aws/).
 

content/en/docs/04_user_guide/03_view.md

@@ -31,10 +31,7 @@ metadata provided by the owners such as contact information, description, licens
  simple statistics for a Dandiset such as size of the Dandiset and number of files, or
  a summary of the Dandiset including information about species, techniques, and standards.
 
-<img
-src="/images/docs/web_dandiset_lp.png"
-alt="web_dandiset_lp"
-style="width: 60%; height: auto; display: block; margin-left: auto;  margin-right: auto;"/>
+![web_dandiset_lp](../../../images/docs/web_dandiset_lp.png)
 
 If you scroll down, you will also find:
 - Assets Summary
@@ -45,21 +42,14 @@ While most of the metadata is summarized on the landing page, some additional in
 found by clicking `Metadata` on the right-side panel. For Dandiset owners, this button also allows
 adding relevant metadata to populate the landing page.
 
-<img
-src="/images/docs/web_dandiset_metadata.png"
-alt="web_dandiset_metadata"
-style="width: 60%; height: auto; display: block; margin-left: auto;  margin-right: auto;"/>
+![web_dandiset_metadata](../../../images/docs/web_dandiset_metadata.png)
 
 ## File View
 
 The right side panel allows you also to access a file browser to navigate the list of folders and files
 in a Dandiset.
 
-<img
-src="/images/docs/web_dandiset_files.png"
-alt="web_dandiset_files"
-style="width: 60%; height: auto; display: block; margin-left: auto;  margin-right: auto;"/>
-
+![web_dandiset_files](../../../images/docs/web_dandiset_files.png)
 
 Any file in the Dandiset has a download icon
 You can click this icon to download a file to your device where you are browsing
@@ -71,11 +61,7 @@ services that can open the file. *Note:* that these services often have size lim
 ## My Dandisets
 If you log in as a registered user, you will also see `My Dandisets` tab:
 
-<img
-src="/images/docs/my_dandiset.png"
-alt="my_dandiset"
-style="width: 7
-0%; height: auto; display: block; margin-left: auto;  margin-right: auto;"/>
+![web_my_dandiset](../../../images/docs/my_dandiset.png)
 
 By clicking the tab, you can access all the Dandisets you own. For these Dandisets, you can edit and update
 metadata through the Dandiset actions section, and add or remove other owners or data.

content/en/docs/04_user_guide/04_download.md

@@ -12,26 +12,16 @@ Once you have the Dandiset you are interested in (see more in [the Dandiset View
 On the landing page of each Dandiset, you can find `Download` button on the right-hand panel. After clicking the
 button, you will see the specific command you can use with DANDI Python CLI (as well as the information on how to download the CLI).
 
-<img
-src="../img/web_dandiset_rsp_download.png"
-alt="web_dandiset_rsp_download"
-style="width: 30%; height: auto; display: block; margin-left: auto;  margin-right: auto;"/>
-
+![web_dandiset_rsp_download](../../../images/docs/web_dandiset_rsp_download.png)
 
 ### Download specific files
 
 The right-side panel of the Dandiset landing page allows you also to access the list of folders and files.
 
-<img
-src="../img/web_dandiset_files.png"
-alt="web_dandiset_files"
-style="width: 60%; height: auto; display: block; margin-left: auto;  margin-right: auto;"/>
-
+![web_dandiset_files](../../../images/docs/web_dandiset_files.png)
 
 Each file in the Dandiset has a download icon next to it, clicking the icon will start the download process.
 
-
-
 ## Using the Python CLI Client
 
 The [DANDI Python client](https://pypi.org/project/dandi/) gives you more options, such as downloading entire

content/en/docs/05_developer_guide/01_project_structure.md

@@ -5,9 +5,7 @@ weight: 1
 
 The DANDI project can be represented schematically:
 
-<img src="../img/dandi_structure.svg"
-alt="dandi_structure"
-style="width: 70%; height: auto; display: block; margin-left: auto; margin-right: auto;"/>
+![dandi_structure](../../../images/docs/dandi_structure.svg)
 
 The **Client side** contains the DANDI Python CLI and DANDI Web application.
 

content/en/docs/05_developer_guide/03_contribute_docs.md

@@ -8,26 +8,15 @@ is missing or unclear, let us know by [opening an issue on our helpdesk](https:/
 
 ## Serving the Docs Locally
 
-This project uses the [MkDocs](https://www.mkdocs.org/) tool with the [Material theme](https://squidfunk.github.io/mkdocs-material/)
-and extra plugins to generate the website.
+This project uses the [Hugo](https://gohugo.io/) to generate the website. To test locally, you will need to install Hugo.
 
-To test locally, you will need to install the Python dependencies. To do that, type the following commands:
+To run a local server, type the following commands:
 
 ```
-git clone https://github.com/dandi/handbook.git
-cd handbook
-pip install -r requirements.txt
+git clone https://github.com/dandi/dandi.github.io.git
+cd dandi.github.io
+hugo server
 ```
 
-If you are working on your *fork*, simply replace `https://github.com/dandi/handbook.git`
-with `git clone [email protected]/<username>/handbook.git` , where `<username>` is your
-GitHub username.
-
-Once done, you need to run MkDocs. Simply type:
-
-```
-mkdocs serve
-```
-
-Finally, open [`http://127.0.0.1:8000/`](http://127.0.0.1:8000/) in your
+Finally, open [`http://127.0.0.1:1313/`](http://127.0.0.1:1313/) in your
 browser, and you should see the default home page of the documentation being displayed.

hugo.yaml

@@ -117,10 +117,11 @@ params:
   github_branch: main
 
   # Google Custom Search Engine ID. Remove or comment out to disable search.
-  gcs_engine_id: d72aa9b2712488cc3
+  # gcs_engine_id: d72aa9b2712488cc3
 
   # Enable Lunr.js offline search
-  offlineSearch: false
+  offlineSearch: true
+  offlineSearchSummaryLength: 200
 
   # Enable syntax highlighting and copy buttons on code blocks with Prism
   prism_syntax_highlighting: false
@@ -147,7 +148,7 @@ params:
     # If you want this feature, but occasionally need to remove the "Feedback" section from a single page,
     # add "hide_feedback: true" to the page's front matter.
     feedback:
-      enable: true
+      enable: false
       # The responses that the user sees after clicking "yes" (the page was helpful) or "no" (the page was not helpful).
       "yes": >-
         Glad to hear it! Please <a href="https://github.com/USERNAME/REPOSITORY/issues/new">tell us how we can improve</a>.