ref(dashboards): Enforce widget padding inside `WidgetFrame` (#83744)

Instead of having all the visualization widgets specify the correct
padding, set the padding inside `WidgetFrame` itself. This makes it much
easier to use `WidgetFrame` in other contexts, since the padding will be
correct.

No visual changes!

static/app/views/dashboards/widgets/bigNumberWidget/bigNumberWidget.tsx

@@ -14,8 +14,6 @@ import {
   DEFAULT_FIELD,
   MISSING_DATA_MESSAGE,
   NON_FINITE_NUMBER_MESSAGE,
-  X_GUTTER,
-  Y_GUTTER,
 } from '../common/settings';
 import type {StateProps} from '../common/types';
 
@@ -92,6 +90,5 @@ const BigNumberResizeWrapper = styled('div')`
 
 const LoadingPlaceholder = styled('span')`
   color: ${p => p.theme[DEEMPHASIS_COLOR_NAME]};
-  padding: ${X_GUTTER} ${Y_GUTTER};
   font-size: ${p => p.theme.fontSizeLarge};
 `;

static/app/views/dashboards/widgets/bigNumberWidget/bigNumberWidgetVisualization.tsx

@@ -15,8 +15,6 @@ import type {
   Thresholds,
 } from 'sentry/views/dashboards/widgets/common/types';
 
-import {X_GUTTER, Y_GUTTER} from '../common/settings';
-
 import {ThresholdsIndicator} from './thresholdsIndicator';
 
 export interface BigNumberWidgetVisualizationProps {
@@ -143,7 +141,7 @@ function Wrapper({children}: any) {
 
 const AutoResizeParent = styled('div')`
   position: absolute;
-  inset: ${Y_GUTTER} ${X_GUTTER} ${Y_GUTTER} ${X_GUTTER};
+  inset: 0;
 
   color: ${p => p.theme.headingColor};
 

static/app/views/dashboards/widgets/common/errorPanel.tsx

@@ -27,7 +27,7 @@ const Panel = styled('div')<{height?: string}>`
   position: absolute;
   inset: 0;
 
-  padding: ${X_GUTTER} ${Y_GUTTER};
+  padding: ${Y_GUTTER} ${X_GUTTER};
 
   display: flex;
   gap: ${space(1)};

static/app/views/dashboards/widgets/common/widgetFrame.tsx

@@ -283,4 +283,5 @@ const VisualizationWrapper = styled('div')`
   flex-grow: 1;
   min-height: 0;
   position: relative;
+  padding: 0 ${X_GUTTER} ${Y_GUTTER} ${X_GUTTER};
 `;

static/app/views/dashboards/widgets/timeSeriesWidget/timeSeriesWidget.tsx

@@ -12,7 +12,7 @@ import {
   type TimeSeriesWidgetVisualizationProps,
 } from 'sentry/views/dashboards/widgets/timeSeriesWidget/timeSeriesWidgetVisualization';
 
-import {MISSING_DATA_MESSAGE, X_GUTTER, Y_GUTTER} from '../common/settings';
+import {MISSING_DATA_MESSAGE} from '../common/settings';
 import type {StateProps} from '../common/types';
 
 export interface TimeSeriesWidgetProps
@@ -76,7 +76,6 @@ export function TimeSeriesWidget(props: TimeSeriesWidgetProps) {
 
 const TimeSeriesWrapper = styled('div')`
   flex-grow: 1;
-  padding: 0 ${X_GUTTER} ${Y_GUTTER} ${X_GUTTER};
 `;
 
 const LoadingPlaceholder = styled('div')`

static/app/views/projectDetail/projectScoreCards/actionWrapper.tsx

@@ -3,5 +3,5 @@ import styled from '@emotion/styled';
 import {space} from 'sentry/styles/space';
 
 export const ActionWrapper = styled('div')`
-  padding: ${space(2)};
+  padding: ${space(1)} 0 0 0;
 `;