Add documentation for all components

Closes #3 (closed)

docs/components/activity/index.md

@@ -17,16 +17,45 @@ const user = {
 </script>
 
 # Activity
-```html
+
+Activities display history entries for a Funkwhale pod. Each item contains the following information:
+
+- An image
+- A track title
+- An artist name
+- A username
+- A [popover](./../popover/index.md)
+
+| Prop    | Data type    | Required? | Description                                  |
+|---------|--------------|-----------|----------------------------------------------|
+| `track` | Track object | Yes       | The track to render in the activity entry.   |
+| `user`  | User object  | Yes       | The user associated with the activity entry. |
+
+## Single items
+
+You can render a single activity item by passing the track and user information to the `<fw-activity>` component.
+
+```vue-html
 <fw-activity :track="track" :user="user" />
 ```
+
 <fw-activity :track="track" :user="user" />
 
+## Activity lists
+
+You can display a list of activity items by passing a `v-for` directive and adding a `key` to the item. The `key` must be unique to the list.
+
 ::: info
-Whenever there is more than 1 activity entry in a row, there would be a 1px border to separate the entries
+Items in a list are visually separated by a 1px border.
 :::
 
-```html
-<fw-activity :track="track" :user="user" v-for="i in 3" :key="i" />
+```vue-html{4-5}
+<fw-activity
+  :track="track"
+  :user="user"
+  v-for="i in 3"
+  :key="i"
+/>
 ```
+
 <fw-activity :track="track" :user="user" v-for="i in 3" :key="i" />