Improve accessibility of the interests select box

.hound.yml

@@ -1,9 +1,11 @@
 eslint:
   enabled: true
   config_file: assets/.eslintrc.json
+  ignore_file: assets/.eslintignore
   version: 5.16.0
 scss:
   enabled: false
 stylelint:
   config_file: assets/.stylelintrc.json
+  ignore_file: assets/.stylelintignore
   enabled: true

assets/.eslintignore

@@ -0,0 +1,2 @@
+js/vendor
+assets/js/vendor

assets/.stylelintignore

@@ -1 +1,2 @@
 css/vendor
+assets/css/vendor

assets/css/app.scss

@@ -15,7 +15,7 @@
 @import "objects/container";
 
 @import "~highlight.js/styles/github.css";
-@import "vendor/selectize";
+@import "vendor/select2";
 
 @import "components/announcement";
 @import "components/announcement-create";

assets/css/components/_announcement-form.scss

@@ -19,10 +19,27 @@
     border: $base-border;
     border-radius: $base-border-radius;
     box-shadow: 0 0 16px rgba($light-gray, 0.6);
-    display: none;
+    display: block;
     font-size: $small-font-size;
+    opacity: 0;
     padding: $small-spacing;
+    transition: opacity 150ms, visibility 150ms;
+    visibility: hidden;
     width: 600px;
     z-index: $ceiling-z-index;
   }
+
+  .interested-user-count {
+    text-decoration: underline;
+
+    &:hover,
+    &:focus {
+      color: $tbds-brand-red;
+
+      + .interested-user-names {
+        opacity: 1;
+        visibility: visible;
+      }
+    }
+  }
 }