Fix styling

docs/_docs/03-02-product-guide-commenter-features.md

@@ -17,13 +17,13 @@ We also provide a Facebook auth plugin that supports logging in with Facebook (y
 
 Talk supports a standard comment hierarchy. There are top-level (or parent) comments, and then replies to that comment (or children comments). 
 
-**Permalinks**
+### Permalinks
 
 All levels of comments and replies are able to be linked to via permalink. Permalinks are structured using a `commentId` query param:
 
 https://domain.com/article-asset-slug/?commentId=0879edd7-1c4f-4918-abd2-a770db446b75
 
-**Threading**
+### Threading
 
 Talk supports by default 3 levels of threading, meaning each top-level comment has a depth of 3 replies; replies beyond that are not nested below the 3rd level. You can adjust this using the `TALK_THREADING_LEVEL` configuration variable. We don’t recommend deep threading because it can cause issues with styling, especially on mobile.
 
@@ -37,7 +37,7 @@ You can style threaded comments using these CSS classes:
   talk-stream-pending-comment
 ```
 
-**Automatic Updates**
+### Automatic Updates
 
 Talk supports real-time loading and updating of comments, via subscriptions (specifically GraphQL Subscriptions); this enables us to not have to refresh to see new comments on a given comment stream. 
 
@@ -45,7 +45,7 @@ Talk enables this via “Load More” buttons for both top-level comments (this
 
 We’ve decided to go this route in order to make the viewing experience as smooth as possible, so that the feed of comments doesn’t change as you’re reading just because new comments are coming in. This could be especially disruptive on breaking news and/or controversial stories with very active discussions.
 
-**Comment Character Limits**
+### Comment Character Limits
 
 You can enable Talk to limit the character length for comments, for example, some newsrooms we’ve worked with prefer a limit between 2000 and 5000 characters. Commenters will be alerted that they have gone over that number and won’t be able to submit their comment until they’ve edited it. This can be a useful tool to ensure commenters are concise with their comments.
 
@@ -125,18 +125,18 @@ The My Profile tab is where commenters can go to see their comment history, as w
 
 Talk leverages notification and messages on the stream to alert users to important information about their comment or their account.
 
-**Pre-moderation of comments**
+### Pre-moderation of comments
 
 If a stream is set to Pre-mod, or a commenter’s Trust karma score has fallen to negative, or if for any other reason their comment is being pre-moderated, they will get a notification letting them know this when they post a comment.
 
-**Suspension because of Username**
+### Suspension because of Username
 
 When a commenter has been suspended because their username is inappropriate, they will see a message at the top of their streams stating this.
 
-**Timed Suspension**
+### Timed Suspension
 
 When a commenter has been suspended for a block of time (aka a “time-out”), they will see a message at the top of their streams stating this.
 
-**Ban**
+### Ban
 
 When a commenter has been banned, they will see a message at the top of their streams staging this.

docs/_docs/03-04-product-guide-trust.md

@@ -6,7 +6,7 @@ permalink: /trust/
 Trust is a set of components within Talk that incorporate automated moderation
 features based on a user's previous behavior.
 
-### User Karma Score
+## User Karma Score
 
 Using Trust’s calculations, Talk will automatically pre-moderate comments of
 users who have a negative karma score. All users start out with a `0` neutral
@@ -32,7 +32,7 @@ You can configure your own Trust thresholds by using [TRUST_THRESHOLD]({{"/advan
 configuration.
 
 
-### Reliable and Unreliable Flaggers
+## Reliable and Unreliable Flaggers
 
 Trust also calculates how reliable users are in terms of the comments they
 report. This information is displayed to moderators in the User History drawer,

docs/_docs/03-05-product-guide-toxic-comments.md

@@ -21,7 +21,7 @@ Talk (0.8 or 80% is the default), which works like this:
 Read more about Coral’s take on toxicity
 [on our blog](https://blog.coralproject.net/toxic-avenging/){:target="_blank"}.
 
-### What is the Perspective API?
+## What is the Perspective API?
 
 The likely toxicity of a comment is evaluated using scores generated from
 [Perspective API](http://perspectiveapi.com/){:target="_blank"}. This is part of
@@ -48,12 +48,12 @@ We’ve talked with their team on several occasions, and have been impressed by
 their dedication and commitment to this issue. These are smart people who are
 trying to improve a broken part of the internet.
 
-### How do I add the Toxic Comments plugin?
+## How do I add the Toxic Comments plugin?
 To enable this behavior, visit the
 [talk-plugin-toxic-comments]({{ "/additional-plugins/#talk-plugin-toxic-comments" | relative_url }})
 plugin documentation.
 
 
-### Request an API Key
+## Request an API Key
 
 You can read more about Google's Perspective API and/or request an API key here: [http://perspectiveapi.com/](http://perspectiveapi.com/).

docs/_sass/talk.scss

@@ -16,11 +16,25 @@ body {
 }
 
 h1 {
-  font-size: 1.7em;
+  font-size: 2rem;
 }
 
-h2, h3, h4 {
+h2 {
   margin: 1.6em 0 0.8em;
+  font-size: 1.75rem;
+  font-weight: 600;
+}
+
+h3 {
+  margin: 1.6em 0 0.8em;
+  font-size: 1.5rem;
+  font-weight: 500;
+}
+
+h4 {
+  margin: 1.6em 0 0.8em;
+  font-size: 1.2rem;
+  font-weight: 500;
 }
 
 .btn-coral {
@@ -41,7 +55,6 @@ h2, h3, h4 {
 }
 
 article.configuration {
-
   h2, .toc {
     @extend .param;
   }
@@ -408,4 +421,3 @@ a.brand {
     }
   }
 }
-