text input: style and small fixes

frontend/frontend/src/components/Home/TextSection.js

@@ -38,7 +38,7 @@ const TextSection = ({
       <input
         type="text"
         className={classnames(
-          'border border-gray-300 rounded px-2 py-1 mt-2 w-1/2',
+          'border border-gray-300 rounded px-2 py-1 mt-2 w-3/4 min-w-48 max-w-xl',
           disabled ? 'cursor-not-allowed' : '',
         )}
         value={internalValue}

frontend/frontend/src/pages/Home/Home.js

@@ -106,6 +106,7 @@ const HomeScreen = ({ stage, setStage }) => {
       fullSuffix += `username=${userId}`;
       break;
     case CardTypes.PIN:
+      fullSuffix += `username=${userId}`;
       fullSuffix += `repo=${repo}`;
       break;
     case CardTypes.GIST:

frontend/frontend/src/pages/Home/stages/Customize.js

@@ -102,12 +102,12 @@ const CustomizeStage = ({
                 <br />
                 {!isAuthenticated && (
                   <>
-                    Please
+                    Please{' '}
                     <a
                       href="#"
                       onClick={(e) => {
                         e.preventDefault();
-                        setStage(1);
+                        setStage(0);
                       }}
                       className="underline text-blue-900"
                     >
@@ -134,7 +134,7 @@ const CustomizeStage = ({
             title="WakaTime Username"
             description={
               <>
-                Set your
+                Set your{' '}
                 <a
                   href="https://wakatime.com/"
                   target="_blank"
@@ -144,7 +144,7 @@ const CustomizeStage = ({
                 </a>{' '}
                 username to fetch your stats.
               </>
-            } // TODO: make link visible
+            }
             placeholder={`e.g. "${DEMO_WAKATIME_USER}"`}
             value={wakatimeUser}
             setValue={setWakatimeUser}