website updates

Summary:
A few small website updates:

- changed the tutorials to point to the `stable` tag on github so we don't have to update the website each time we want to run them!
- changed the colab button
- re ran notebook cells to update the images for textured meshes

Once these fixes are landed I can build and publish the website.

Reviewed By: bottler

Differential Revision: D20484836

fbshipit-source-id: 603a05e752f631c60d1a3abb9adeb1b9b451ab98
This commit is contained in:
Nikhila Ravi 2020-03-17 13:04:55 -07:00 committed by Facebook GitHub Bot
parent 25d2e2c8b7
commit 3901dbe4de
7 changed files with 105 additions and 61 deletions

View File

@ -83,7 +83,7 @@
"outputs": [],
"source": [
"!pip install torch torchvision\n",
"!pip install 'git+https://github.com/facebookresearch/pytorch3d.git'"
"!pip install 'git+https://github.com/facebookresearch/pytorch3d.git@stable'"
]
},
{

View File

@ -70,7 +70,7 @@
"outputs": [],
"source": [
"!pip install torch torchvision\n",
"!pip install 'git+https://github.com/facebookresearch/pytorch3d.git'"
"!pip install 'git+https://github.com/facebookresearch/pytorch3d.git@stable'"
]
},
{

View File

@ -85,7 +85,7 @@
"outputs": [],
"source": [
"!pip install torch torchvision\n",
"!pip install 'git+https://github.com/facebookresearch/pytorch3d.git'"
"!pip install 'git+https://github.com/facebookresearch/pytorch3d.git@stable'"
]
},
{

File diff suppressed because one or more lines are too long

View File

@ -45,32 +45,40 @@ class Tutorial extends React.Component {
<TutorialSidebar currentTutorialID={tutorialID} />
<Container className="mainContainer">
<div className="tutorialButtonsWrapper">
<div className="colabButtonWrapper">
<a
href={`https://colab.research.google.com/github/facebookresearch/pytorch3d/blob/master/docs/tutorials/${tutorialID}.ipynb`}>
<img align="left" src="https://colab.research.google.com/assets/colab-badge.svg" alt="Open In Colab"/>
</a>
</div>
<div className="tutorialButtonWrapper buttonWrapper">
<a
className="tutorialButton button"
download
href={`${baseUrl}files/${tutorialID}.ipynb`}
target="_blank">
{renderDownloadIcon()}
{'Download Tutorial Jupyter Notebook'}
</a>
</div>
<div className="tutorialButtonWrapper buttonWrapper">
<a
className="tutorialButton button"
download
href={`${baseUrl}files/${tutorialID}.py`}
target="_blank">
{renderDownloadIcon()}
{'Download Tutorial Source Code'}
</a>
</div>
<div className="tutorialButtonWrapper buttonWrapper">
<a
className="tutorialButton button"
download
href={`https://colab.research.google.com/github/facebookresearch/pytorch3d/blob/stable/docs/tutorials/${tutorialID}.ipynb`}
target="_blank">
<img
className="colabButton"
align="left"
src={`${baseUrl}img/colab_icon.png`}
/>
{'Run in Google Colab'}
</a>
</div>
<div className="tutorialButtonWrapper buttonWrapper">
<a
className="tutorialButton button"
download
href={`${baseUrl}files/${tutorialID}.ipynb`}
target="_blank">
{renderDownloadIcon()}
{'Download Tutorial Jupyter Notebook'}
</a>
</div>
<div className="tutorialButtonWrapper buttonWrapper">
<a
className="tutorialButton button"
download
href={`${baseUrl}files/${tutorialID}.py`}
target="_blank">
{renderDownloadIcon()}
{'Download Tutorial Source Code'}
</a>
</div>
</div>
<div
className="tutorialBody"

View File

@ -1,7 +1,7 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
* @format
**/
**/
const React = require('react');
@ -22,23 +22,54 @@ class TutorialHome extends React.Component {
<Container className="mainContainer documentContainer postContainer">
<div className="post">
<header className="postHeader">
<h1 className="postHeaderTitle">Welcome to the PyTorch3D Tutorials</h1>
<h1 className="postHeaderTitle">
Welcome to the PyTorch3D Tutorials
</h1>
</header>
<p>
Here you can learn about the structure and applications of Pytorch3D from
examples which are in the form of ipython notebooks.
Here you can learn about the structure and applications of
Pytorch3D from examples which are in the form of ipython
notebooks.
</p>
<h3> Run interactively </h3>
<p>
At the top of each example you can find a button named <strong>"Open in Colab"</strong> which will open the notebook in <a href="https://colab.research.google.com/notebooks/intro.ipynb"> Google Colaboratory </a> where you can run the code directly in the browser with access to GPU support e.g.
At the top of each example you can find a button named{' '}
<strong>"Run in Google Colab"</strong> which will open the
notebook in{' '}
<a href="https://colab.research.google.com/notebooks/intro.ipynb">
{' '}
Google Colaboratory{' '}
</a>{' '}
where you can run the code directly in the browser with access to
GPU support - it looks like this:
</p>
<div className="tutorialButtonsWrapper">
<div className="tutorialButtonWrapper buttonWrapper">
<a className="tutorialButton button" target="_blank">
<img
className="colabButton"
align="left"
src="/img/colab_icon.png"
/>
{'Run in Google Colab'}
</a>
</div>
</div>
<p>
{' '}
You can modify the code and experiment with varying different
settings. Remember to install pytorch, torchvision, fvcore and
pytorch3d in the first cell of the colab notebook by running:{' '}
</p>
<img align="center" src="https://colab.research.google.com/assets/colab-badge.svg" alt="Open In Colab"/>
<p> You can modify the code and experiment with varying different settings.
Remember to install pytorch, torchvision, fvcore and pytorch3d in the first cell of the colab notebook by running: </p>
<MarkdownBlock>{bash`!pip install torch torchvision
!pip install 'git+https://github.com/facebookresearch/pytorch3d.git'`}</MarkdownBlock>
<h3> Run locally </h3>
<p> There is also a button to download the notebook and source code to run it locally. </p>
!pip install 'git+https://github.com/facebookresearch/pytorch3d.git@stable'`}</MarkdownBlock>
This installs the latest stable version of PyTorch3D from github.
<h3> Run locally </h3>
<p>
{' '}
There is also a button to download the notebook and source code to
run it locally.{' '}
</p>
</div>
</Container>
</div>

View File

@ -267,9 +267,14 @@ p a:hover {
padding-right: 0.25em;
}
.colabButton {
width: 24px;
}
.tutorialButtonsWrapper {
display: flex;
align-items: center;
padding-bottom: 15px;
}
/* .tutorialButton {