diff --git a/client/src/components/level.css b/client/src/components/level.css index 75c311d..e972dc0 100644 --- a/client/src/components/level.css +++ b/client/src/components/level.css @@ -251,3 +251,10 @@ td code { /* border: 3px solid #5191d1; */ box-shadow: .0em .0em .4em .1em var(--clr-primary); } + +.introduction-panel { + max-width: 900px; + width: 80%; + margin-left: auto; + margin-right: auto; +} diff --git a/client/src/components/level.tsx b/client/src/components/level.tsx index 10eec98..e84d40a 100644 --- a/client/src/components/level.tsx +++ b/client/src/components/level.tsx @@ -336,28 +336,24 @@ function PlayableLevel({worldId, levelId}) { export default Level +/** The site with the introduction text of a world */ function Introduction({worldId}) { const gameId = React.useContext(GameIdContext) const gameInfo = useGetGameInfoQuery({game: gameId}) return <>
- -
-
-
- - {gameInfo.data?.worlds.nodes[worldId].introduction} - -
-
-
- {0 == gameInfo.data?.worldSize[worldId] ? + +
+ + {gameInfo.data?.worlds.nodes[worldId].introduction} + + {gameInfo.data?.worldSize[worldId] == 0 ? : } -
+ + }
}