Provisioning: Use theme colors in TokenPermissionsInfo (#106014)

.betterer.results

@@ -2738,13 +2738,6 @@ exports[`better eslint`] = {
       [0, 0, 0, "Add noMargin prop to Card components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "0"],
       [0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "1"]
     ],
-    "public/app/features/provisioning/Wizard/ConnectStep.tsx:5381": [
-      [0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "0"],
-      [0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "1"],
-      [0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "2"],
-      [0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "3"],
-      [0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "4"]
-    ],
     "public/app/features/provisioning/Wizard/FinishStep.tsx:5381": [
       [0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "0"],
       [0, 0, 0, "Add noMargin prop to Field components to remove built-in margins. Use layout components like Stack or Grid with the gap prop instead for consistent spacing.", "1"],

public/app/features/provisioning/Shared/TokenPermissionsInfo.tsx

@@ -65,7 +65,7 @@ function getStyles(theme: GrafanaTheme2) {
     }),
     accessLevel: css({
       fontFamily: theme.typography.fontFamilyMonospace,
-      background: '#22262B',
+      background: theme.colors.background.secondary,
       borderRadius: theme.shape.radius.default,
       padding: theme.spacing(0.25, 0.5),
     }),

public/app/features/provisioning/Wizard/ConnectStep.tsx

@@ -28,6 +28,7 @@ export function ConnectStep() {
         <>
           <TokenPermissionsInfo />
           <Field
+            noMargin
             label={t('provisioning.connect-step.label-access-token', 'GitHub access token')}
             required
             description={t(
@@ -62,6 +63,7 @@ export function ConnectStep() {
           </Field>
 
           <Field
+            noMargin
             label={t('provisioning.connect-step.label-repository-url', 'GitHub repository URL')}
             error={errors.repository?.url?.message}
             invalid={!!errors.repository?.url}
@@ -83,11 +85,13 @@ export function ConnectStep() {
                   ),
                 },
               })}
+              id={'repository-url'}
               placeholder={t('provisioning.connect-step.placeholder-github-url', 'https://github.com/username/repo')}
             />
           </Field>
 
           <Field
+            noMargin
             label={t('provisioning.connect-step.label-branch', 'Branch name')}
             description={t('provisioning.connect-step.description-branch', 'Branch to use for the GitHub repository')}
             error={errors.repository?.branch?.message}
@@ -95,11 +99,13 @@ export function ConnectStep() {
           >
             <Input
               {...register('repository.branch')}
+              id={'repository-branch'}
               placeholder={t('provisioning.connect-step.placeholder-branch', 'main')}
             />
           </Field>
 
           <Field
+            noMargin
             label={t('provisioning.connect-step.label-path', 'Path to subdirectory in repository')}
             error={errors.repository?.path?.message}
             invalid={!!errors.repository?.path}
@@ -108,13 +114,14 @@ export function ConnectStep() {
               'This is the path to a subdirectory in your GitHub repository where dashboards will be stored and provisioned from'
             )}
           >
-            <Input {...register('repository.path')} />
+            <Input {...register('repository.path')} id="repository-path" />
           </Field>
         </>
       )}
 
       {type === 'local' && (
         <Field
+          noMargin
           label={t('provisioning.connect-step.label-local-path', 'Local path')}
           error={errors.repository?.path?.message}
           invalid={!!errors.repository?.path}
@@ -123,6 +130,7 @@ export function ConnectStep() {
             {...register('repository.path', {
               required: t('provisioning.connect-step.error-field-required', 'This field is required.'),
             })}
+            id="repository-local-path"
             placeholder={t('provisioning.connect-step.placeholder-local-path', '/path/to/repo')}
           />
         </Field>