Browse Source

fix(stacktrace): Fixes styling missing frame context in mobile traces (#46557)

Fixes https://github.com/getsentry/sentry/issues/46472

In some stacktraces, the class `.empty-context` wasn't being applied. So I removed it and replaced with emotion styles.
Malachi Willey 1 year ago
parent
commit
eb93e586e9

+ 12 - 3
static/app/components/events/interfaces/frame/context.tsx

@@ -129,10 +129,10 @@ const Context = ({
 
   if (!hasContextSource && !hasContextVars && !hasContextRegisters && !hasAssembly) {
     return emptySourceNotation ? (
-      <div className="empty-context">
+      <EmptyContext>
         <StyledIconFlag size="xs" />
-        <p>{t('No additional details are available for this frame.')}</p>
-      </div>
+        {t('No additional details are available for this frame.')}
+      </EmptyContext>
     ) : null;
   }
 
@@ -230,3 +230,12 @@ const Wrapper = styled('ol')<{startLineNo: number}>`
     border-radius: 0 !important;
   }
 `;
+
+const EmptyContext = styled('div')`
+  display: flex;
+  align-items: center;
+  gap: ${space(1)};
+  padding: 20px;
+  color: ${p => p.theme.subText};
+  font-size: ${p => p.theme.fontSizeMedium};
+`;

+ 0 - 16
static/less/group-detail.less

@@ -451,22 +451,6 @@ div.traceback > ul {
       color: inherit;
     }
 
-    .empty-context {
-      padding: 20px;
-      color: @gray;
-
-      p {
-        display: inline-block;
-        margin-bottom: 0;
-      }
-
-      .icon {
-        opacity: 0.45;
-        margin-right: 10px;
-        font-size: 0.85em;
-      }
-    }
-
     .context {
       display: none;
       background: #fff;