Theme: Page styles move to emotion global styles and design tweaks (#33529)

* Theme: Page styles move to emotion global styles and design tweaks

* More style tweaks

* tweaks

* Updating snapshots

* Another fix

* Another fix

* minor fix

* More style tweaks to page toolbar and alert rule page

* minor polish

public/app/features/api-keys/ApiKeysActionBar.tsx

@@ -15,8 +15,6 @@ export const ApiKeysActionBar: FC<Props> = ({ searchQuery, disabled, onAddClick,
       <div className="gf-form gf-form--grow">
         <FilterInput placeholder="Search keys" value={searchQuery} onChange={onSearchChange} />
       </div>
-
-      <div className="page-action-bar__spacer" />
       <Button className="pull-right" onClick={onAddClick} disabled={disabled}>
         Add API key
       </Button>

public/app/features/api-keys/ApiKeysPage.tsx

@@ -11,7 +11,7 @@ import { ApiKeysAddedModal } from './ApiKeysAddedModal';
 import config from 'app/core/config';
 import appEvents from 'app/core/app_events';
 import EmptyListCTA from 'app/core/components/EmptyListCTA/EmptyListCTA';
-import { InlineField, InlineSwitch } from '@grafana/ui';
+import { InlineField, InlineSwitch, VerticalGroup } from '@grafana/ui';
 import { rangeUtil } from '@grafana/data';
 import { getTimeZone } from 'app/features/profile/state/selectors';
 import { setSearchQuery } from './state/reducers';
@@ -150,13 +150,12 @@ export class ApiKeysPageUnconnected extends PureComponent<Props, State> {
                   ) : null}
                   <ApiKeysForm show={isAdding} onClose={toggleIsAdding} onKeyAdded={this.onAddApiKey} />
                   {showTable ? (
-                    <>
-                      <h3 className="page-heading">Existing API keys</h3>
+                    <VerticalGroup>
                       <InlineField label="Show expired">
                         <InlineSwitch id="showExpired" value={includeExpired} onChange={this.onIncludeExpiredChange} />
                       </InlineField>
                       <ApiKeysTable apiKeys={apiKeys} timeZone={timeZone} onDelete={this.onDeleteApiKey} />
-                    </>
+                    </VerticalGroup>
                   ) : null}
                 </>
               );