Refactor README.md with collapsible sections (#417)

Author: Daryl-Horton

README.md

@@ -25,13 +25,22 @@ GistPad is a Visual Studio Code extension that allows you to edit GitHub [Gists]
 - **[Contributed Commands](#contributed-commands-file-explorer)**
 - **[Configuration Settings](#configuration-settings)**
 
+<details>
+  <summary>Getting Started</summary>
+  
 ## Getting Started
 
 1. Install this extension from the marketplace, then run `Developer: Reload Window`.
 
 1. Open the `GistPad` tab _(look for the notebook icon in the activity bar)_. From there, you can open a gist or GitHub repo by ID/URL, or sign in with a GitHub account in order to manage your [gists](#gist-management) and [repositories](#repositories). To sign-in, simply click the `Sign In` button and follow the provided flow in order to authenticate with your GitHub account.
 
 From here, you can create and edit [gists](#gist-management), [repositories](#repositories), [wikis](#wikis) and [runnable code samples](#codeswing). And in addition to doing this from the `Gists` tree view, you can also do it from [Copilot chat](#copilot-chat) (thanks to a [built-in MCP server](https://npmjs.com/gistpad-mcp)). Have fun, and let us know how we can make your knowledge-management experience even more awesome! 🙌
+<br>
+
+[Back to Table of Contents](#table-of-contents)
+</details>
+<details>
+  <summary>Gist Management</summary>
 
 ## Gist Management
 
@@ -134,7 +143,13 @@ You can create as many daily notes as you need, and when you're done with them,
 To see what can be done with gists and [code swings](#codeswing), and to keep up with the cool stuff that folks in the community are building, check out the `Showcase` view in the `GistPad` tab. This is a list of categories intended to highlight different use-cases for gists, along with examples. Simply click the `Open` button for any gist in order to explore it, or expand the gist to see its file contents. If you have a gist that you think is worth showcasing, please open an issue and let us know about it. We'll keep the showcase updated periodically to highlight new and interesting things, so stay tuned!
 
 <img width="250px" src="https://user-images.githubusercontent.com/116461/74891549-2c9f4500-533c-11ea-9bbb-c5907d41a589.png" />
+<br>
 
+[Back to Table of Contents](#table-of-contents)
+</details>
+<details>
+  <summary>Repository Management</summary>
+  
 ## Repositories
 
 GistPad also allows you to create and edit GitHub repos without needing to clone anything locally. To get started, run the `GistPad: Open Repository` command, and specify/select the name of the repo you'd like to start managing. If you want to create a new repo, then select the `Create new repo` or `Create new private repo` options, then specify the name of the repo.
@@ -215,19 +230,37 @@ Furthermore, when you open a page that contains backlinks, the set of backlinks
 #### Embedding Files
 
 In addition to adding links to pages, it's sometimes valuable to embed the contents of another page directly into a note, so that you can easily read them together. To do this, you can use the `![[link]]` syntax, where you'll recieve auto-completion support just like regular links. When you use an embed link, the target page's contents will be displayed within the note whenever you view it's markdown preview.
+<br>
 
+[Back to Table of Contents](#table-of-contents)
+</details>
+<details>
+  <summary>CodeSwing</summary>
+  
 ## CodeSwing
 
 If you're building web applications, and want to create a quick playground environment in order to experiment with HTML, CSS or JavaScript (or [Sass/SCSS, Less, Pug and TypeScript](#additional-language-support)), you can install the [CodeSwing extension](https://aka.ms/codeswing), in order to have a CodePen-like web experience, integrated into VS Code. GistPad provides an integration with CodeSwing, and so once it's installed, you can right-click the `Your Gists` node in the `GistPad` tree and select `New CodeSwing` or `New Secret CodeSwing`. This will create a new gist, seeded with the selected template fields, and then provide you with a live preview Webview, so that you can iterate on the code and visually see how it behaves.
 
 When you create a new swing, you'll be asked to select a template, which is simply a way to get started quickly, using the libraries and languages you intend to use (e.g. React.js, Vue.js). Since the swing is backed by a Gist, your changes are saved and shareable with your friends. Additionally, as you find other swings that you'd like to use, simply fork them and create your own swings. That way, you can use Gists as "templates" for swing environments, and collaborate on them with others just like you would any other gist. When you're done with a swing, simply close the preview window and all other documents will be automatically closed. If you no longer need the swing, then delete it just like any other gist 👍
+<br>
 
+[Back to Table of Contents](#table-of-contents)
+</details>
+<details>
+  <summary>Copilot chat</summary>
+  
 ## Copilot chat
 
 In addition to managing gists via the `Gists` tree view, you can also use Copilot chat (in `Agent` mode) to discuss and edit your gists/daily notes via natural language. For example, if you opened up Copilot chat and asked `What is the summary of my <X> gist?`, then Copilot would look up your list of gists, find the one about `<X>`, and then generate a summary for you. Or if you asked `Create a new gist that talks about the JavaScript programming language?`, then Copilot would generate a description + file contents based on the requested topic and then create a new gist for you.
 
 This experience works because the GistPad extension ships with the [GistPad MCP server](https://npmjs.com/gistpad-mcp) out of the box. Beyond simplifying setup, this approach is also more secure, since it creates and manages a GitHub token on your behald, with the minimal scopes. For more details about what you can do with GistPad + Copilot, refer to the `GistPad > MCP` settings and/or check out the docs for the GistPad MCP server (including it's list of tools, resources, and prompts support).
+<br>
 
+[Back to Table of Contents](#table-of-contents)
+</details>
+<details>
+  <summary>Contributed Commands</summary>
+  
 ## Contributed Commands (File Explorer)
 
 In addition to the `Gists` view, GistPad also contributes an `Copy File to Gist` command to the context menu of the `Explorer` file tree, which allows you to easily add local files to a new or existing Gist.
@@ -290,7 +323,13 @@ In addition to the `Gists` view, this extension also provides the following comm
 - `GistPad: Starred Gists` - Lists your starred Gists, and then opens the files for the selected one.
 
 - `GistPad: Paste Gist File` - Allows you to paste the contents of a gist file into the active editor.
+<br>
 
+[Back to Table of Contents](#table-of-contents)
+</details>
+<details>
+  <summary>Configuration Settings</summary>
+  
 ## Configuration Settings
 
 - `GistPad > Comments: Show Thread` - Specifies when to show the comment thread UI whenever you open a gist file. Can be set to one of the following values: