diff --git a/changes/36754-enroll-links-mono-spaced b/changes/36754-enroll-links-mono-spaced new file mode 100644 index 0000000000..af11d6b33c --- /dev/null +++ b/changes/36754-enroll-links-mono-spaced @@ -0,0 +1 @@ +* Changed iOS/iPadOS and Android enrollment links on Add hosts modal to monospaced font to improve readability. diff --git a/frontend/components/AddHostsModal/PlatformWrapper/AndroidPanel/AndroidPanel.tsx b/frontend/components/AddHostsModal/PlatformWrapper/AndroidPanel/AndroidPanel.tsx index 521211f7aa..ce436fb29c 100644 --- a/frontend/components/AddHostsModal/PlatformWrapper/AndroidPanel/AndroidPanel.tsx +++ b/frontend/components/AddHostsModal/PlatformWrapper/AndroidPanel/AndroidPanel.tsx @@ -44,7 +44,7 @@ const AndroidPanel = ({ enrollSecret }: IAndroidPanelProps) => { label="Send this to your end users:" enableCopy readOnly - inputWrapperClass + inputWrapperClass={`${baseClass}__enroll-link`} name="enroll-link" value={url} /> diff --git a/frontend/components/AddHostsModal/PlatformWrapper/AndroidPanel/_styles.scss b/frontend/components/AddHostsModal/PlatformWrapper/AndroidPanel/_styles.scss index b5b7f3f051..795d9bf5f7 100644 --- a/frontend/components/AddHostsModal/PlatformWrapper/AndroidPanel/_styles.scss +++ b/frontend/components/AddHostsModal/PlatformWrapper/AndroidPanel/_styles.scss @@ -1,3 +1,6 @@ .android-panel { - + &__enroll-link input { + font-family: "SourceCodePro", $monospace; + color: $core-fleet-blue; + } } diff --git a/frontend/components/AddHostsModal/PlatformWrapper/IosIpadosPanel/IosIpadosPanel.tsx b/frontend/components/AddHostsModal/PlatformWrapper/IosIpadosPanel/IosIpadosPanel.tsx index 38a4e82dec..88095bc20c 100644 --- a/frontend/components/AddHostsModal/PlatformWrapper/IosIpadosPanel/IosIpadosPanel.tsx +++ b/frontend/components/AddHostsModal/PlatformWrapper/IosIpadosPanel/IosIpadosPanel.tsx @@ -49,7 +49,7 @@ const IosIpadosPanel = ({ enrollSecret }: IosIpadosPanelProps) => { label="Send this to your end users:" enableCopy readOnly - inputWrapperClass + inputWrapperClass={`${baseClass}__enroll-link`} name="enroll-link" value={url} helpText={helpText} diff --git a/frontend/components/AddHostsModal/PlatformWrapper/IosIpadosPanel/_styles.scss b/frontend/components/AddHostsModal/PlatformWrapper/IosIpadosPanel/_styles.scss index 603ab26c2a..1777418509 100644 --- a/frontend/components/AddHostsModal/PlatformWrapper/IosIpadosPanel/_styles.scss +++ b/frontend/components/AddHostsModal/PlatformWrapper/IosIpadosPanel/_styles.scss @@ -5,4 +5,8 @@ &__spinner { margin: $pad-xxlarge auto; } + &__enroll-link input { + font-family: "SourceCodePro", $monospace; + color: $core-fleet-blue; + } } diff --git a/frontend/components/AddHostsModal/PlatformWrapper/_styles.scss b/frontend/components/AddHostsModal/PlatformWrapper/_styles.scss index 9806f836f8..df3a32aa26 100644 --- a/frontend/components/AddHostsModal/PlatformWrapper/_styles.scss +++ b/frontend/components/AddHostsModal/PlatformWrapper/_styles.scss @@ -16,7 +16,6 @@ &__textarea { font-family: "SourceCodePro", $monospace; - font-weight: $bold; color: $core-fleet-blue; line-height: $line-height; line-break: anywhere;