1 files changed, 125 insertions, 4 deletions
diff --git a/app/javascript/flavours/glitch/styles/components/accounts.scss b/app/javascript/flavours/glitch/styles/components/accounts.scss
index ddcce1218..25393f88a 100644
--- a/app/javascript/flavours/glitch/styles/components/accounts.scss
+++ b/app/javascript/flavours/glitch/styles/components/accounts.scss
@@ -450,20 +450,141 @@
   word-break: normal;
   word-wrap: break-word;
 
-  p {
+	.emojione {
+    width: 20px;
+    height: 20px;
+    margin: -3px 0 0;
+  }
+
+  .hoverplay:hover { padding-left: 20px }
+
+  p, pre, blockquote {
     margin-bottom: 20px;
+    white-space: pre-wrap;
 
     &:last-child {
       margin-bottom: 0;
     }
   }
 
+	h1, h2, h3, h4, h5, h6 {
+		margin-top: 20px;
+		margin-bottom: 20px;
+	}
+
+	h1, h2 {
+		font-weight: 700;
+		font-size: 18px;
+	}
+
+	h2 {
+		font-size: 16px;
+	}
+
+	h3, h4, h5, h6 {
+		font-weight: 500;
+	}
+
+	blockquote {
+		padding-left: 10px;
+		border-left: 3px solid $darker-text-color;
+		color: $darker-text-color;
+		white-space: normal;
+		font-style: italic;
+
+		p:last-child {
+			margin-bottom: 20px;
+		}
+	}
+
+	b, strong {
+		font-weight: 700;
+	}
+
+	em, i {
+		font-style: italic;
+	}
+
+	sub {
+		font-size: smaller;
+		text-align: sub;
+	}
+
+	sup {
+		vertical-align: super;
+		font-size: smaller;
+	}
+
+	ul, ol {
+		margin-left: 1em;
+
+		p {
+			margin: 0;
+		}
+
+		li:last-child {
+			margin-bottom: 20px;
+		}
+	}
+
+	ul {
+		list-style-type: disc;
+	}
+
+	ol {
+		list-style-type: decimal;
+	}
+
+	s, del {
+		text-decoration: line-through;
+	}
+
+	hr {
+		border-color: lighten($dark-text-color, 10%);
+	}
+
+	pre, code {
+		color: lighten($dark-text-color, 33%);
+	}
+
+	mark {
+		background-color: #ccff15;
+		color: black;
+	}
+
   a {
-    color: inherit;
-    text-decoration: underline;
+    background-color: lighten($ui-base-color, 7%);
+    color: darken($secondary-text-color, 10%);
+    text-decoration: none;
+    padding: 2px;
+    border: 1px solid lighten($ui-base-color, 20%);
+    border-radius: 8px;
 
     &:hover {
-      text-decoration: none;
+      border: 1px solid darken($secondary-text-color, 20%);
+      color: lighten($dark-text-color, 10%);
+    }
+
+    &.mention {
+      &:hover {
+        text-decoration: none;
+
+        span {
+          text-decoration: underline;
+        }
+      }
+    }
+
+    .fa {
+      color: $dark-text-color;
+    }
+  }
+
+  p {
+    margin-bottom: 20px;
+
+    &:last-child {
+      margin-bottom: 0;
     }
   }
 }