Fix annotation screen

[yexingsha]

Mock in Figma, largely based on iOS with some slight tweaks.

• Font size: use 15sp bold for title, and 15sp for body. Line height is 22dp.
• Font color: use zoteroBlue for "Add comment", and #6E6D73 for quoted text.
• All rows should have 8dp horizontal padding. Currently some rows seem to lack right padding.
• Title row height should be 36dp, with a 1dp bottom border that takes up height, so 37dp in total. Area and ink annotations currently lack that bottom border.
• Quote/image row should have 8dp vertical padding.
• Comment row should have 8dp bottom padding. When there is no comment in an annotation, do not display "Add comment" unless the annotation box is in focus.
• Tag row should have 8dp vertical padding, with a 1dp top border that takes up height. When there is no tag in an annotation, do not display "Add tags" unless the annotation box is in focus.
• Annotation box focus ring should use zoteroBlue, and should be an outer border.
• The gap between annotation boxes should be 13dp.
• The gap between the search bar and annotation boxes should be 16dp.
• I like the fact that the search box is sticky when scrolling, but the search box should have some bottom padding on scroll. iOS has 3dp, which I think is too small. Let's make it 8dp.
• The bottom bar should have a white background and a full-width top border, just as in allitems screen.

[yexingsha]

In 1.0.15, area and ink annotation are no longer showing up:

The annotation box looks great, but the selected state makes everything shift to the right. I think it's because the 3dp difference of inner/outer border wasn't corrected for. Note the red guide in the screenshot:

Also, let's give an extra 8dp space between the search bar and the first annotation item. It doesn't affect the 8dp bottom padding on search box when scrolling.