fix button display #199

client/src/components/popup/erase.tsx

@@ -63,12 +63,8 @@ export function ErasePopup () {
       <p>Do you want to delete your saved progress irreversibly?</p>
     </Trans>
     <div className='settings-buttons'>
-      { levelId ?
-        <Button onClick={eraseLevel} to="">{t("Delete this Level")}</Button> : <></>
-      }
-      { worldId ?
-        <Button onClick={eraseWorld} to="">{t("Delete this World")}</Button> : <></>
-      }
+      <Button onClick={levelId && eraseLevel} to="" disabled={!levelId} >{t("Delete this Level")}</Button>
+      <Button onClick={worldId && eraseWorld} to="" disabled={!worldId} >{t("Delete this World")}</Button>
       <Button onClick={eraseProgress} to={`/${gameId}/`}>{t("Delete Everything")}</Button>
     </div>
     <Trans>

client/src/css/app.css

@@ -78,6 +78,7 @@ body {
 .btn-disabled, .btn[disabled] {
   color: var(--clr-dark-gray);
   background: var(--clr-light-gray);
+  cursor: not-allowed;
 }
 
 .btn-inverted.btn-disabled, .btn-inverted.btn[disabled] {