Make the full width of an annotation quote clickable to expand it

For consistency with annotation bodies and to provide an easier hit
target on mobile, make the full width of annotation quotes clickable
to expand them.

h/static/scripts/directive/excerpt.js

@@ -28,6 +28,14 @@ function ExcerptController() {
   this.showInlineControls = function () {
     return this.overflowing() && this.inlineControls;
   }
+
+  this.bottomShadowStyles = function () {
+    return {
+      'excerpt__shadow': true,
+      'excerpt__shadow--transparent': this.inlineControls,
+      'is-hidden': !this.isExpandable(),
+    };
+  }
 }
 
 function toPx(val) {

h/static/styles/excerpt.scss

@@ -57,6 +57,10 @@
     transition: opacity $expand-duration linear;
   }
 
+  .excerpt__shadow--transparent {
+    background-image: none;
+  }
+
   .excerpt__shadow.is-hidden {
     opacity: 0;
     pointer-events: none;

h/templates/client/excerpt.html

@@ -14,9 +14,7 @@
       </span>
     </div>
   </div>
-  <div class="excerpt__shadow"
-       ng-click="vm.toggle()"
-       ng-class="{'is-hidden' : !vm.isExpandable()}"
-       ng-if="!vm.inlineControls"
+  <div ng-click="vm.toggle()"
+       ng-class="vm.bottomShadowStyles()"
        title="Show the full excerpt"></div>
 </div>