Feat UI add end user auth to controls page (#11991)

relates to #11002

Implements the UI for mdm macos setup end user authentication page.


![image](https://github.com/fleetdm/fleet/assets/1153709/1af6c5d7-99d0-401d-9938-a78617eca817)


![image](https://github.com/fleetdm/fleet/assets/1153709/8f0ed8cc-63f5-425b-8f3a-f2f83ed018f7)



- [x] Changes file added for user-visible changes in `changes/` or
`orbit/changes/`.
- [x] Manual QA for all new/changed functionality

frontend/components/SectionHeader/SectionHeader.stories.tsx

@@ -0,0 +1,15 @@
+import { Meta, StoryObj } from "@storybook/react";
+
+import SectionHeader from ".";
+
+const meta: Meta<typeof SectionHeader> = {
+  title: "Components/SectionHeader",
+  component: SectionHeader,
+  args: { title: "Section header title" },
+};
+
+export default meta;
+
+type Story = StoryObj<typeof SectionHeader>;
+
+export const Basic: Story = {};

frontend/components/SectionHeader/SectionHeader.tsx

@@ -0,0 +1,13 @@
+import React from "react";
+
+const baseClass = "section-header";
+
+interface ISectionHeaderProps {
+  title: string;
+}
+
+const SectionHeader = ({ title }: ISectionHeaderProps) => {
+  return <h2 className={baseClass}>{title}</h2>;
+};
+
+export default SectionHeader;

frontend/components/SectionHeader/_styles.scss

@@ -0,0 +1,8 @@
+.section-header {
+  margin: 0 0 $pad-large;
+  padding-bottom: $pad-small;
+  font-size: $medium;
+  font-weight: $regular;
+  color: $core-fleet-black;
+  border-bottom: solid 1px $ui-fleet-black-10;
+}

frontend/components/SectionHeader/index.ts

@@ -0,0 +1 @@
+export { default } from "./SectionHeader";