added labels to crate sidebar metadata

Author: psg-19

app/components/crate-sidebar.css

@@ -18,6 +18,11 @@
     }
 }
 
+._label {
+    font-weight: 500;
+    margin-right: 0.2rem;
+}
+
 .date,
 .msrv,
 .edition,

app/components/crate-sidebar.gjs

@@ -65,11 +65,14 @@ export default class CrateSidebar extends Component {
       <div class='metadata'>
         <h2 class='heading'>Metadata</h2>
 
-        <time datetime={{dateFormatIso @version.created_at}} class='date'>
+        <time datetime={{dateFormatIso @version.created_at}} class='date' data-test-date-label>
           {{svgJar 'calendar'}}
           <span>
             {{dateFormatDistanceToNow @version.created_at addSuffix=true}}
-            <Tooltip @text={{dateFormat @version.created_at 'PPP'}} />
+            <Tooltip>
+              Last Updated:
+              {{dateFormat @version.created_at 'PPP'}}
+            </Tooltip>
           </span>
         </time>
 
@@ -109,9 +112,10 @@ export default class CrateSidebar extends Component {
         {{/if}}
 
         {{#if @version.crate_size}}
-          <div class='bytes'>
+          <div class='bytes' data-test-byte-size>
             {{svgJar 'weight'}}
             {{prettyBytes @version.crate_size}}
+            <Tooltip @text='Crate Size' />
           </div>
         {{/if}}
 

tests/acceptance/crate-test.js

@@ -312,8 +312,12 @@ module('Acceptance | crate page', function (hooks) {
 
     await visit('/crates/foo');
     assert.dom('[data-test-linecounts]').hasText('1,119 SLoC');
+    assert.dom('[data-test-date-ts]').exists();
+    assert.dom('[data-test-byte-size]').exists();
 
     await visit('/crates/foo/0.5.0');
     assert.dom('[data-test-linecounts]').hasText('520 SLoC');
+    assert.dom('[data-test-date-ts]').exists();
+    assert.dom('[data-test-byte-size]').exists();
   });
 });