feat(ui): Shorten build string in footer (#16705)

This shortens the build string and makes it a bit more subtle

src/sentry/static/sentry/app/components/footer.tsx

@@ -6,6 +6,7 @@ import ConfigStore from 'app/stores/configStore';
 import ExternalLink from 'app/components/links/externalLink';
 import Hook from 'app/components/hook';
 import getDynamicText from 'app/utils/getDynamicText';
+import space from 'app/styles/space';
 
 const Footer = () => {
   const config = ConfigStore.getConfig();
@@ -37,12 +38,12 @@ const Footer = () => {
               fixed: 'Acceptance Test',
               value: config.version.current,
             })}
-            {' ('}
-            {getDynamicText({
-              fixed: 'test',
-              value: config.version.build,
-            })}
-            {')'}
+            <Build>
+              {getDynamicText({
+                fixed: 'test',
+                value: config.version.build.substring(0, 7),
+              })}
+            </Build>
           </div>
         )}
         <a href="/" tabIndex={-1} className="icon-sentry-logo" />
@@ -59,4 +60,11 @@ const FooterLink = styled(ExternalLink)`
   }
 `;
 
+const Build = styled('span')`
+  font-size: ${p => p.theme.fontSizeRelativeSmall};
+  color: ${p => p.theme.gray1};
+  font-weight: bold;
+  margin-left: ${space(1)};
+`;
+
 export default Footer;