Tabs test

_sass/custom_dc.scss

@@ -8,3 +8,17 @@
   padding-bottom: 20px;
   white-space: pre-wrap;
 }
+
+#console.api-tabcontent, #cli.api-tabcontent, #clia.api-tabcontent, #consolea.api-tabcontent,  {
+  font-family: inherit !important;
+  font-size: inherit !important;
+  color: inherit !important;
+  padding-bottom: inherit !important;
+  margin-bottom: 5px;
+  white-space: inherit !important;
+  line-height: inherit !important;
+  ol {
+    padding-top: 25px;
+    padding-bottom: 10px;
+  }
+}

custom_dc/data_cloud.md

@@ -122,19 +122,30 @@ Now set environment variables:
 
 As you are iterating on changes to the source CSV and JSON files, you can re-upload them at any time, either overwriting existing files or creating new folders. If you want versioned snapshots, we recommend that you create a new subfolder and store the latest version of the files there. If you prefer to simply incrementally update, you can simply overwrite files in a pre-existing folder. Creating new subfolders is slower but safer. Overwriting files is faster but riskier.
 
-To upload data using the Cloud Console:
-
-1. Go to [https://console.cloud.google.com/storage/browse](https://console.cloud.google.com/storage/browse){: target="_blank"} and select your custom Data Commons bucket.
-1. Navigate to the folder you created in the earlier step.
-1. Click **Upload Files**, and select all your CSV files and `config.json`.
-
-To upload data using the command line:
-
-1. Navigate to your local "input" directory where your source files are located.
-1. Run the following command:
-   <pre>
-   gcloud storage cp config.json *.csv gs://<var>BUCKET_NAME</var>/<var>FOLDER_PATH</var>
-   </pre>
+<div class="api-tab">
+  <button id="get-button" class="api-tablink" onclick="openTab(event, 'console')">Cloud Console
+  </button>
+  <button id="post-button" class="api-tablink" onclick="openTab(event, 'cli')">gcloud CLI
+  </button>
+</div>
+
+<div id="console" class="api-tabcontent">
+<ol>
+<li>Go to <a href="https://console.cloud.google.com/storage/browse" target="_blank">https://console.cloud.google.com/storage/browse</a> and select your custom Data Commons bucket.</li>
+<li>Navigate to the folder you created in the earlier step.</li>
+<li>Click <b>Upload Files</b>, and select all your CSV files and <code>config.json</code>.</li>
+</ol>
+</div>
+
+<div id="cli" class="api-tabcontent">
+<ol>
+<li>Navigate to your local "input" directory where your source files are located.</li>
+<li>Run the following command:
+   <pre>gcloud storage cp config.json *.csv gs://<var>BUCKET_NAME</var>/<var>FOLDER_PATH</var></pre>
+</li>
+</ol>
+</div>
+<script src="/assets/js/api-doc-tabs.js"></script>
 
 > **Note:** Do not upload the local `datacommons` subdirectory or its files.
 
@@ -146,23 +157,32 @@ Now that everything is configured, and you have uploaded your data in Google Clo
 
 Every time you upload new input CSV or JSON files to Google Cloud Storage, you will need to rerun the job.
 
-To run the job using the Cloud Console:
-
-1. Go to [https://console.cloud.google.com/run/jobs](https://console.cloud.google.com/run/jobs){: target="_blank"} for your project.
-1. From the list of jobs, click the link of the "datacommons-data" job you created above.
-1. Optionally, if you have received a `SQL check failed` error when previously trying to start the container, and would like to minimize startup time, click **Execute with overrides** and click **Add variable** to set a new variable with name `DATA_RUN_MODE` and value `schemaupdate`.
-1. Click **Execute**. It will take several minutes for the job to run. You can click the **Logs** tab to view the progress. 
-
-To run the job using the command line:
-
-1. From any local directory, run the following command:
-   <pre>
-   gcloud run jobs execute <var>JOB_NAME</var>
-   </pre>
-1. To view the progress of the job, run the following command:
-   <pre>
-   gcloud beta run jobs logs tail <var>JOB_NAME</var>
-   </pre>
+<div class="api-tab">
+  <button id="get-button" class="api-tablink" onclick="openTab(event, 'consolea')">Cloud Console
+  </button>
+  <button id="post-button" class="api-tablink" onclick="openTab(event, 'clia')">gcloud CLI
+  </button>
+</div>
+
+<div id="consolea" class="api-tabcontent">
+<ol>
+<li>Go to <a href="https://console.cloud.google.com/run/jobs" target="_blank">https://console.cloud.google.com/run/jobs</a> for your project.</li>
+<li>From the list of jobs, click the link of the "datacommons-data" job you created above.</li>
+<li>Optionally, if you have received a <code>SQL check failed</code> error when previously trying to start the container, and would like to minimize startup time, click <b>Execute with overrides</b> and click <b>Add variable</b> to set a new variable with name <code>DATA_RUN_MODE</code> and value <code>schemaupdate</code>.</li>
+<li>Click <b>Execute</b>. It will take several minutes for the job to run. You can click the <b>Logs</b> tab to view the progress. </li>
+</ol>
+</div>
+
+<div id="clia" class="api-tabcontent">
+<ol>
+<li>From any local directory, run the following command:
+   <pre>gcloud run jobs execute <var>JOB_NAME</var></pre></li>
+<li>To view the progress of the job, run the following command:
+   <pre>gcloud beta run jobs logs tail <var>JOB_NAME</var></pre>
+</li>
+</ol>
+</div>
+<script src="/assets/js/api-doc-tabs.js"></script>
 
 When it completes, to verify that the data has been loaded correctly, see [Inspect the Cloud SQL database](#inspect-sql).
 
@@ -246,17 +266,14 @@ docker run \
 -v <var>OUTPUT_DIRECTORY</var>:<var>OUTPUT_DIRECTORY</var> \
 -e GOOGLE_APPLICATION_CREDENTIALS=/gcp/creds.json \
 -v $HOME/.config/gcloud/application_default_credentials.json:/gcp/creds.json:ro \
-[-e DATA_RUN_MODE=schemaupdate \]
 gcr.io/datcom-ci/datacommons-data:<var>VERSION</var>
 </pre>
 
 The version is `latest` or `stable`.
 
-> Note: The DATA_RUN_MODE flag is only relevant if you have previously received a `SQL check failed` error, and is optional to speed up the startup process.
-
 To verify that the data is correctly created in your Cloud SQL database, use the procedure in [Inspect the Cloud SQL database](#inspect-sql) above.
 
-#### Run the data management Docker container in schema update mode 
+#### Optional: Run the data management Docker container in schema update mode 
 
 If you have tried to start a container, and have received a `SQL check failed` error, this indicates that a database schema update is needed. You need to restart the data management container, and you can specify an additional, optional, flag, `DATA_RUN_MODE` to miminize the startup time.
 

custom_dc/quickstart.md

@@ -65,15 +65,13 @@ An API key is required to authorize requests from your site to the base Data Com
 1. Open a terminal window, and go to a directory to which you would like to download the Data Commons repository.
 1. Clone the website Data Commons repository:
 
-  <pre>
-   git clone https://github.com/datacommonsorg/website.git [<var>DIRECTORY</var>]
-  </pre>
-  If you don't specify a directory name, this creates a local `website` subdirectory. If you specify a directory name, all files are created under that directory, without a `website` subdirectory.
+   <pre>git clone https://github.com/datacommonsorg/website.git [<var>DIRECTORY</var>]</pre>
+   If you don't specify a directory name, this creates a local `website` subdirectory. If you specify a directory name, all files are created under that directory, without a `website` subdirectory.
 
 When the downloads are complete, navigate to the root directory of the repo (e.g. `website`). References to various files and commands in these procedures are relative to this root.
 
 <pre>
-cd website
+cd website | <var>DIRECTORY</var>
 </pre>
 
 ### Set environment variables {#env-vars}