Dracula Update:

Added comment label colors
Added exemplary reason style

README.md

@@ -8,7 +8,7 @@
 |------|---------|------------|----------|
 | Notabug Dracula | 1.0.5 | [notabug.io](https://notabug.io) | [Click](https://gitlab.com/Bauke/styles/raw/master/css/notabug-dracula/notabug-dracula.user.css) |
 | Tildes Compact | 1.0.4 | [tildes.net](https://tildes.net) | [Click](https://gitlab.com/Bauke/styles/raw/master/css/tildes-compact/tildes-compact.user.css) |
-| Tildes Dracula | 2.0.8 | [tildes.net](https://tildes.net) | [Click](https://gitlab.com/Bauke/styles/raw/master/css/tildes-dracula/tildes-dracula.user.css) |
+| Tildes Dracula | 2.0.9 | [tildes.net](https://tildes.net) | [Click](https://gitlab.com/Bauke/styles/raw/master/css/tildes-dracula/tildes-dracula.user.css) |
 | Tildes Monokai | 1.1.4 | [tildes.net](https://tildes.net) | [Click](https://gitlab.com/Bauke/styles/raw/master/css/tildes-monokai/tildes-monokai.user.css) |
 
 ## Installing

css/tildes-dracula/tildes-dracula.css

@@ -320,6 +320,20 @@ body:not(.theme) .comment .time-responsive-full,body.theme-light .comment .time-
   color: #f8f8f2;
 }
 
+body:not(.theme) .comment-exemplary-reasons,body.theme-light .comment-exemplary-reasons,body.theme-dark .comment-exemplary-reasons,body.theme-black .comment-exemplary-reasons {
+  background-color: #282a36;
+  padding: 5px;
+}
+
+body:not(.theme) .comment-exemplary-reasons[open],body.theme-light .comment-exemplary-reasons[open],body.theme-dark .comment-exemplary-reasons[open],body.theme-black .comment-exemplary-reasons[open] {
+  border-bottom: 1px solid #8be9fd;
+}
+
+body:not(.theme) .comment-exemplary-reasons ul,body.theme-light .comment-exemplary-reasons ul,body.theme-dark .comment-exemplary-reasons ul,body.theme-black .comment-exemplary-reasons ul {
+  margin-left: 1.3rem;
+  margin-bottom: 0;
+}
+
 body:not(.theme) .comment[data-comment-depth='0'],body.theme-light .comment[data-comment-depth='0'],body.theme-dark .comment[data-comment-depth='0'],body.theme-black .comment[data-comment-depth='0'] {
   border-color: #282a36;
 }
@@ -328,6 +342,12 @@ body:not(.theme) .is-comment-collapsed header .link-user,body.theme-light .is-co
   color: #50fa7b;
 }
 
+body:not(.theme) .label-comment-exemplary,body.theme-light .label-comment-exemplary,body.theme-dark .label-comment-exemplary,body.theme-black .label-comment-exemplary {
+  color: #282a36;
+  border-color: #8be9fd;
+  background-color: #8be9fd;
+}
+
 body:not(.theme) .post-buttons,body.theme-light .post-buttons,body.theme-dark .post-buttons,body.theme-black .post-buttons {
   padding: 0;
 }
@@ -354,6 +374,80 @@ body:not(.theme) .post-button-used:hover,body:not(.theme) .post-button-used:acti
   text-decoration: underline;
 }
 
+.btn-comment-label-exemplary {
+  color: #8be9fd;
+  border-color: #8be9fd;
+}
+
+.btn-comment-label-exemplary:hover {
+  color: #8be9fd;
+}
+
+.btn-comment-label-exemplary.btn-used:hover {
+  color: #282a36;
+  background-color: #8be9fd;
+}
+
+.btn-comment-label-offtopic {
+  color: #50fa7b;
+  border-color: #50fa7b;
+}
+
+.btn-comment-label-offtopic:hover {
+  color: #50fa7b;
+}
+
+.btn-comment-label-offtopic.btn-used:hover {
+  color: #282a36;
+  background-color: #50fa7b;
+}
+
+.btn-comment-label-joke {
+  color: #f1fa8c;
+  border-color: #f1fa8c;
+}
+
+.btn-comment-label-joke:hover {
+  color: #f1fa8c;
+}
+
+.btn-comment-label-joke.btn-used:hover {
+  color: #282a36;
+  background-color: #f1fa8c;
+}
+
+.btn-comment-label-noise {
+  color: #ffb86c;
+  border-color: #ffb86c;
+}
+
+.btn-comment-label-noise:hover {
+  color: #ffb86c;
+}
+
+.btn-comment-label-noise.btn-used:hover {
+  color: #282a36;
+  background-color: #ffb86c;
+}
+
+.btn-comment-label-malice {
+  color: #f55;
+  border-color: #f55;
+}
+
+.btn-comment-label-malice:hover {
+  color: #f55;
+}
+
+.btn-comment-label-malice.btn-used:hover {
+  color: #282a36;
+  background-color: #f55;
+}
+
+.btn-comment-label.btn-used {
+  border: none;
+}
+
 body:not(.theme) #page-list,body.theme-light #page-list,body.theme-dark #page-list,body.theme-black #page-list {
   background-color: #44475a;
 }
@@ -753,6 +847,10 @@ body:not(.theme) .label-topic-tag-nsfw a,body.theme-light .label-topic-tag-nsfw
   border-color: #bd93f9 !important;
 }
 
+.is-comment-exemplary>.comment-itself {
+  border-color: #8be9fd !important;
+}
+
 .is-comment-new>.comment-itself {
   border-color: #ffb86c !important;
 }

css/tildes-dracula/tildes-dracula.user.css

@@ -1,7 +1,7 @@
 /* ==UserStyle==
 @name        Tildes Dracula
 @namespace   tildes.net
-@version     2.0.8
+@version     2.0.9
 @author      Bauke
 @description Dracula theme for Tildes.net
 @homepageURL https://gitlab.com/Bauke/styles
@@ -331,6 +331,20 @@ body:not(.theme) .comment .time-responsive-full,body.theme-light .comment .time-
   color: #f8f8f2;
 }
 
+body:not(.theme) .comment-exemplary-reasons,body.theme-light .comment-exemplary-reasons,body.theme-dark .comment-exemplary-reasons,body.theme-black .comment-exemplary-reasons {
+  background-color: #282a36;
+  padding: 5px;
+}
+
+body:not(.theme) .comment-exemplary-reasons[open],body.theme-light .comment-exemplary-reasons[open],body.theme-dark .comment-exemplary-reasons[open],body.theme-black .comment-exemplary-reasons[open] {
+  border-bottom: 1px solid #8be9fd;
+}
+
+body:not(.theme) .comment-exemplary-reasons ul,body.theme-light .comment-exemplary-reasons ul,body.theme-dark .comment-exemplary-reasons ul,body.theme-black .comment-exemplary-reasons ul {
+  margin-left: 1.3rem;
+  margin-bottom: 0;
+}
+
 body:not(.theme) .comment[data-comment-depth='0'],body.theme-light .comment[data-comment-depth='0'],body.theme-dark .comment[data-comment-depth='0'],body.theme-black .comment[data-comment-depth='0'] {
   border-color: #282a36;
 }
@@ -339,6 +353,12 @@ body:not(.theme) .is-comment-collapsed header .link-user,body.theme-light .is-co
   color: #50fa7b;
 }
 
+body:not(.theme) .label-comment-exemplary,body.theme-light .label-comment-exemplary,body.theme-dark .label-comment-exemplary,body.theme-black .label-comment-exemplary {
+  color: #282a36;
+  border-color: #8be9fd;
+  background-color: #8be9fd;
+}
+
 body:not(.theme) .post-buttons,body.theme-light .post-buttons,body.theme-dark .post-buttons,body.theme-black .post-buttons {
   padding: 0;
 }
@@ -365,6 +385,80 @@ body:not(.theme) .post-button-used:hover,body:not(.theme) .post-button-used:acti
   text-decoration: underline;
 }
 
+.btn-comment-label-exemplary {
+  color: #8be9fd;
+  border-color: #8be9fd;
+}
+
+.btn-comment-label-exemplary:hover {
+  color: #8be9fd;
+}
+
+.btn-comment-label-exemplary.btn-used:hover {
+  color: #282a36;
+  background-color: #8be9fd;
+}
+
+.btn-comment-label-offtopic {
+  color: #50fa7b;
+  border-color: #50fa7b;
+}
+
+.btn-comment-label-offtopic:hover {
+  color: #50fa7b;
+}
+
+.btn-comment-label-offtopic.btn-used:hover {
+  color: #282a36;
+  background-color: #50fa7b;
+}
+
+.btn-comment-label-joke {
+  color: #f1fa8c;
+  border-color: #f1fa8c;
+}
+
+.btn-comment-label-joke:hover {
+  color: #f1fa8c;
+}
+
+.btn-comment-label-joke.btn-used:hover {
+  color: #282a36;
+  background-color: #f1fa8c;
+}
+
+.btn-comment-label-noise {
+  color: #ffb86c;
+  border-color: #ffb86c;
+}
+
+.btn-comment-label-noise:hover {
+  color: #ffb86c;
+}
+
+.btn-comment-label-noise.btn-used:hover {
+  color: #282a36;
+  background-color: #ffb86c;
+}
+
+.btn-comment-label-malice {
+  color: #f55;
+  border-color: #f55;
+}
+
+.btn-comment-label-malice:hover {
+  color: #f55;
+}
+
+.btn-comment-label-malice.btn-used:hover {
+  color: #282a36;
+  background-color: #f55;
+}
+
+.btn-comment-label.btn-used {
+  border: none;
+}
+
 body:not(.theme) #page-list,body.theme-light #page-list,body.theme-dark #page-list,body.theme-black #page-list {
   background-color: #44475a;
 }
@@ -764,6 +858,10 @@ body:not(.theme) .label-topic-tag-nsfw a,body.theme-light .label-topic-tag-nsfw
   border-color: #bd93f9 !important;
 }
 
+.is-comment-exemplary>.comment-itself {
+  border-color: #8be9fd !important;
+}
+
 .is-comment-new>.comment-itself {
   border-color: #ffb86c !important;
 }

sass/tildes-dracula/_comments.sass

@@ -48,12 +48,28 @@ body.theme-black
     .time-responsive-full
       color: $foreground
 
+  .comment-exemplary-reasons
+    background-color: $background
+    padding: 5px
+
+    &[open]
+      border-bottom: 1px solid $cyan
+
+    ul
+      margin-left: 1.3rem
+      margin-bottom: 0
+
   .comment[data-comment-depth='0']
     border-color: $background
 
   .is-comment-collapsed header .link-user
     color: $green
 
+  .label-comment-exemplary
+    color: $background
+    border-color: $cyan
+    background-color: $cyan
+
   .post-buttons
     padding: 0
 
@@ -78,3 +94,61 @@ body.theme-black
     &:focus
       color: $cyan
       text-decoration: underline
+
+.btn-comment-label-exemplary
+  color: $cyan
+  border-color: $cyan
+
+  &:hover
+    color: $cyan
+
+  &.btn-used:hover
+    color: $background
+    background-color: $cyan
+
+.btn-comment-label-offtopic
+  color: $green
+  border-color: $green
+
+  &:hover
+    color: $green
+
+  &.btn-used:hover
+    color: $background
+    background-color: $green
+
+.btn-comment-label-joke
+  color: $yellow
+  border-color: $yellow
+
+  &:hover
+    color: $yellow
+
+  &.btn-used:hover
+    color: $background
+    background-color: $yellow
+
+.btn-comment-label-noise
+  color: $orange
+  border-color: $orange
+
+  &:hover
+    color: $orange
+
+  &.btn-used:hover
+    color: $background
+    background-color: $orange
+
+.btn-comment-label-malice
+  color: $red
+  border-color: $red
+
+  &:hover
+    color: $red
+
+  &.btn-used:hover
+    color: $background
+    background-color: $red
+
+.btn-comment-label.btn-used
+  border: none

sass/tildes-dracula/_misc.sass

@@ -164,6 +164,9 @@ body.theme-black
 .is-comment-mine>.comment-itself
   border-color: $purple !important
 
+.is-comment-exemplary>.comment-itself
+  border-color: $cyan !important
+
 .is-comment-new>.comment-itself
   border-color: $orange !important
 

sass/tildes-dracula/tildes-dracula.json

@@ -4,7 +4,7 @@
   "options": {
     "name": "Tildes Dracula",
     "namespace": "tildes.net",
-    "version": "2.0.8",
+    "version": "2.0.9",
     "author": "Bauke",
     "description": "Dracula theme for Tildes.net",
     "homepageURL": "https://gitlab.com/Bauke/styles",