Add an ASCII diagram of an example Swift package directory structure, to

make it clear where the snippets go, and also where the documentation
catalog goes.

Also show a concrete example of how to reference a snippet.

Fix a typo.

Author: patshaughnessy

Sources/docc/DocCDocumentation.docc/adding-code-snippets-to-your-content.md

@@ -44,7 +44,24 @@ let package = Package(
 
 Swift Package Manager expects to find your code examples in the directory `Snippets` at the top of your project, parallel to the file `Package.swift` and the directory `Sources`. 
 At the root of your project, create the directory `Snippets`.
-Within the Snippets directory, create a file with your code snippet.
+Within the `Snippets` directory, create a file with your code snippet.
+
+Your Swift package directory structure should resemble this:
+
+```
+YourProject
+  ├─ Package.swift
+  ├─ Snippets/
+  │  ├─ example-snippet.swift
+  ├─ Sources/
+  │  ├─ YourProject.docc/
+  │  │ ├─ YourProject.md
+  │  ├─ main.swift
+etc...
+```
+
+> Note: Unlike `Snippets`, your Swift package's documentation catalog should be located as a subdirectory of `Sources`, where all of your other Swift source code files are located. For example, see `YourProject.docc` above.
+
 
 The following example illustrates a code example in the file `Snippets/example-snippet.swift`:
 
@@ -85,6 +102,12 @@ The `path` argument has three parts:
 
 3. The name of your snippet file without the `.swift` extension
 
+In the example package above, the `YourProject.md` file could reference `example-snippet.swift` like this:
+
+```markdown
+@Snippet(path: "YourProject/Snippets/example-snippet")
+```
+
 Without any additional annotations in your snippet, Docc includes the entirety of your code example as the snippet.
 To prevent parts of your snippet file from being rendered in documentation, add comments in your code in the format `// snippet.hide` and `// snippet.show` on new lines, surrounding the content you want to hide.
 These comments act as a toggle to hide or show content from the snippet.
@@ -165,7 +188,7 @@ Extending the earlier snippet example, the slice `setup` would be referenced wit
 
 ### Documenting the code in your snippet
 
-DocC parses contiguous comments within your the code of a snippet as markdown to annotate your code when embedded in documentation.
+DocC parses contiguous comments within the code of a snippet as markdown to annotate your code when embedded in documentation.
 DocC will attempt to reference symbols from within these comments just like any other documentation content.
 You can reference symbols from your API, which DocC converts into hyperlinks to that symbol when displaying the content.