Merge pull request #566 from creativecommons/more_labels

Document and style more labels

Author: kgodey

content/contributing-code/repo-labels/contents.lr

@@ -134,6 +134,10 @@ label based on whether it was closed with or without resolution, respectively.
     🧹 status: ticket work required
   </span>
   - **Description:** Needs more details before it can be worked on
+- <span class="gh-label status-dark">
+    🏷 status: label work required
+  </span>
+  - **Description:** Needs proper labelling before it can be worked on
 - <span class="gh-label status-lighter">
     ⛔️ status: discarded
   </span>
@@ -211,11 +215,19 @@ recognized by GitHub. The special ones don't have emojis either._
 
 ### Miscellaneous
 
-- <span class="gh-label has-background-black has-text-white">
+- <span class="gh-label miscellaneous">
     🤯 ノಠ益ಠノ彡┻━┻
   </span>
   - **Description:** Aaargh!
-  
+- <span class="gh-label hacktoberfest">
+    Hacktoberfest
+  </span>
+  - **Description:** Good issues for Hacktoberfest participants
+- <span class="gh-label invalid">
+    invalid
+  </span>
+  - **Description:** Inappropriate or invalid (ex. Hacktoberfest spam)
+
 ## Usage rules
 
 In the above categories, some are marked with an `*` sign. Those are mandatory

webpack/js/components.js

@@ -29,7 +29,7 @@ export const IssueLabel = {
      * @returns {string} the name of the class to apply to the label
      */
     className() {
-      return this.$root.categories[this.name] || 'miscellaneous'
+      return this.$root.categories[this.name] || `${this.name.toLocaleLowerCase()} miscellaneous`
     }
   }
 }

webpack/sass/main.scss

@@ -70,6 +70,8 @@ pre {
     ('priority-positive'     #cfda2c #000000),
     ('priority-favourable'   #008672 #ffffff),
     ('miscellaneous'         #000000 #ffffff),
+    ('hacktoberfest'         #883255 #ffffff),
+    ('invalid'               #eeeeee #000000),
   );
   @each $category, $background-color, $foreground-color in $label-colors {
     &.#{$category} {