ref(crons): Align timeline with monitor name (#52811)

**Before ——**
<img width="562" alt="image"
src="https://github.com/getsentry/sentry/assets/44172267/7726e69d-472a-4202-8ae3-5c239006dd49">


**After ——**
<img width="562" alt="image"
src="https://github.com/getsentry/sentry/assets/44172267/bac946ae-a41c-483f-b630-d38a7c25a4a6">

static/app/views/monitors/components/overviewTimeline/checkInTimeline.tsx

@@ -69,7 +69,7 @@ export function CheckInTimeline(props: Props) {
 
 const TimelineContainer = styled('div')`
   position: relative;
-  height: 14px;
+  height: calc(${p => p.theme.fontSizeLarge} * ${p => p.theme.text.lineHeightHeading});
   margin: ${space(2)} 0;
 `;
 
@@ -79,6 +79,8 @@ const JobTick = styled('div')<{
   status: CheckInStatus;
 }>`
   position: absolute;
+  top: calc(50% + 1px);
+  transform: translateY(-50%);
   background: ${p => getColorsFromStatus(p.status, p.theme).tickColor};
   opacity: 0.7;
   width: 4px;