fix: move EV3 troubleshooting into troubleshooting section

src/components/extension-landing/extension-landing.scss

@@ -7,6 +7,11 @@
     padding: 0;
 }
 
+html {
+    // Adjust target position to compensate for the floating top content
+    scroll-padding-top: calc(50px + 5rem); // nav bar + OS chooser
+}
+
 .extension-landing {
     &>div {
         padding: 4rem 0;

src/components/extension-landing/extension-troubleshooting.jsx

@@ -13,7 +13,7 @@ const ExtensionTroubleshooting = props => {
     };
     return (
         <ExtensionSection className="faq">
-            <h2><FormattedMessage
+            <h2 id="troubleshooting"><FormattedMessage
                 id="extensions.troubleshootingTitle"
                 values={sharedValues}
             /></h2>

src/components/extension-landing/install-scratch-link.jsx

@@ -12,8 +12,7 @@ require('./extension-landing.scss');
 // Assumes this will only be called with an OS that needs Scratch Link
 const InstallScratchLink = ({
     currentOS,
-    hideScratchLink,
+    hideScratchLink
-    showEv3
 }) => (
     <div className="blue install-scratch-link">
         <FlexRow className="inner column">
@@ -82,7 +81,7 @@ const InstallScratchLink = ({
                         }`}
                     /></p>
                 </Step>
-                {(showEv3 || !hideScratchLink) && <Step
+                <Step
                     compact
                     number={3}
                 >
@@ -102,15 +101,19 @@ const InstallScratchLink = ({
                             }}
                         />
                     </span>}
-                    {showEv3 && <span className="step-description">
+                    <span className="step-description">
-                        <FormattedMessage id="installScratchLink.ev3Workaround" />
+                        <FormattedMessage
-                        <div ><a
+                            id="installScratchLink.ifYouHaveTrouble.bodyText"
-                            href={`https://downloads.scratch.mit.edu/link/scratch-link-${
+                            values={{
-                                currentOS === OS_ENUM.WINDOWS ? 'windows' : 'mac'
+                                linkText: (
-                            }-1.4.3.zip`}
+                                    <a
-                        ><FormattedMessage id="installScratchLink.downloadScratchLink1.4" /></a></div>
+                                        href="#troubleshooting"
-                    </span>}
+                                    ><FormattedMessage id="installScratchLink.ifYouHaveTrouble.linkText" /></a>
-                </Step>}
+                                )
+                            }}
+                        />
+                    </span>
+                </Step>
             </Steps>
         </FlexRow>
     </div>
@@ -118,8 +121,7 @@ const InstallScratchLink = ({
 
 InstallScratchLink.propTypes = {
     currentOS: PropTypes.string.isRequired,
-    hideScratchLink: PropTypes.bool,
+    hideScratchLink: PropTypes.bool
-    showEv3: PropTypes.bool
 };
 
 module.exports = InstallScratchLink;

src/l10n.json

@@ -173,8 +173,8 @@
     "installScratchLink.startScratchLink2.Windows": "If it does not appear, run Scratch Link from your Start menu.",
     "installScratchLink.learnMore.bodyText": "To learn more about Scratch Link, click {linkText}.",
     "installScratchLink.learnMore.linkText": "here",
-    "installScratchLink.ev3Workaround": "If you have issues connecting EV3 with Scratch Link 2.0, please try Scratch Link 1.4.",
+    "installScratchLink.ifYouHaveTrouble.bodyText": "If you have trouble, see the {linkText} for tips.",
-    "installScratchLink.downloadScratchLink1.4": "Direct download Scratch Link 1.4",
+    "installScratchLink.ifYouHaveTrouble.linkText": "Troubleshooting section",
 
     "parents.FaqAgeRangeA": "While Scratch is primarily designed for 8 to 16 year olds, it is also used by people of all ages, including younger children with their parents.",
     "parents.FaqAgeRangeQ": "What is the age range for Scratch?",
@@ -451,6 +451,8 @@
     "extensions.checkOSVersionTitle": "Make sure your operating system is compatible with Scratch Link",
     "extensions.checkOSVersionText": "The minimum operating system versions are listed at the top of this page. See instructions for checking your version of {winOSVersionLink} or {macOSVersionLink}.",
     "extensions.checkOsVersionText2": "If you are using macOS 12, please update to macOS 12.3 or newer. Earlier versions of macOS 12 do not work correctly with Scratch Link.",
+    "extensions.ev3TryScratchLink1.4": "If you have issues connecting EV3 with Scratch Link 2.0, please try Scratch Link 1.4.",
+    "extensions.downloadScratchLink1.4": "Download Scratch Link 1.4",
     "extensions.winOSVersionLinkText": "Windows",
     "extensions.macOSVersionLinkText": "macOS",
     "extensions.closeScratchCopiesTitle": "Close other copies of Scratch",

src/views/download/scratch-link/download.jsx

@@ -16,6 +16,7 @@ import ExtensionSection from '../../../components/extension-landing/extension-se
 import ExtensionTroubleshooting from '../../../components/extension-landing/extension-troubleshooting.jsx';
 import InstallScratchLink from '../../../components/extension-landing/install-scratch-link.jsx';
 
+import OS_ENUM from '../../../lib/os-enum.js';
 import {isDownloaded} from '../../../components/install-scratch/install-util.js';
 
 import '../../../components/extension-landing/extension-landing.scss';
@@ -135,6 +136,12 @@ const ScratchLink = ({intl}) => {
                             />
                         </p>
                         <p><FormattedMessage id="extensions.checkOsVersionText2" /></p>
+                        <h3 className="faq-title"><FormattedMessage id="extensions.ev3TryScratchLink1.4" /></h3>
+                        <p><a
+                            href={`https://downloads.scratch.mit.edu/link/scratch-link-${
+                                os === OS_ENUM.WINDOWS ? 'windows' : 'mac'
+                            }-1.4.3.zip`}
+                        ><FormattedMessage id="extensions.downloadScratchLink1.4" /></a></p>
                     </React.Fragment>
                 )}
                 <h3 className="faq-title"><FormattedMessage id="scratchLink.closeScratchCopiesTitle" /></h3>

src/views/ev3/ev3.jsx

@@ -288,6 +288,12 @@ class EV3 extends ExtensionLanding {
                 >
                     {isDownloaded(this.state.OS) && (
                         <React.Fragment>
+                            <h3 className="faq-title"><FormattedMessage id="extensions.ev3TryScratchLink1.4" /></h3>
+                            <p><a
+                                href={`https://downloads.scratch.mit.edu/link/scratch-link-${
+                                    this.state.OS === OS_ENUM.WINDOWS ? 'windows' : 'mac'
+                                }-1.4.3.zip`}
+                            ><FormattedMessage id="extensions.downloadScratchLink1.4" /></a></p>
                             <h3 className="faq-title"><FormattedMessage id="ev3.checkOSVersionTitle" /></h3>
                             <p>
                                 <FormattedMessage