diff --git a/client/src/components/Ripple.vue b/client/src/components/Ripple.vue
index 1482613..7467a5f 100644
--- a/client/src/components/Ripple.vue
+++ b/client/src/components/Ripple.vue
@@ -44,6 +44,12 @@ export default {
     const height = this.$refs.container.offsetHeight
     this.rippleWidth = width > height ? width : height
     this.halfRippleWidth = this.rippleWidth / 2
+
+    window.addEventListener('mouseup', this.purgeRipples)
+  },
+
+  beforeDestroy() {
+    window.removeEventListener('mouseup', this.purgeRipples)
   },
 
   methods: {
diff --git a/client/src/components/Summoner/Champions/ChampionsSearch.vue b/client/src/components/Summoner/Champions/ChampionsSearch.vue
index f6fd0e1..b38c717 100644
--- a/client/src/components/Summoner/Champions/ChampionsSearch.vue
+++ b/client/src/components/Summoner/Champions/ChampionsSearch.vue
@@ -1,5 +1,5 @@
 <template>
-  <Ripple color="rgba(44, 82, 130, 0.7)" class="relative inline-block rounded-lg bg-blue">
+  <Ripple color="rgba(43, 108, 176, 0.7)" class="relative inline-block rounded-lg">
     <input
       v-model="championName"
       @input="search"
@@ -38,5 +38,6 @@ export default {
 <style scoped>
 .input-color::placeholder {
   color: #fff;
+  font-weight: 300;
 }
 </style>