Set up a tabletop view for both the GM and the player #260

Merged
savanni merged 15 commits from visions-playfield into main 2024-11-20 04:06:13 +00:00
3 changed files with 10 additions and 2 deletions
Showing only changes of commit 6416931c67 - Show all commits

View File

@ -16,6 +16,6 @@ export class Client {
}
async playingField(): Promise<PlayingField> {
return { backgroundImage: "tower-in-mist.jpg" };
return { backgroundImage: "su-pearl.png" };
}
}

View File

@ -1,3 +1,11 @@
.playing-field {
display: flex;
}
.playing-field__background {
max-width: 50%;
}
.playing-field__background > img {
max-width: 100%;
}

View File

@ -15,7 +15,7 @@ export const PlayingFieldComponent = ({ client }: PlayingFieldProps) => {
const backgroundUrl = field && client.imageUrl(field.backgroundImage);
return (<div className="playing-field">
<div> Left Panel </div>
<div> {backgroundUrl && <img src={backgroundUrl.toString()} alt="playing field" />} </div>
<div className="playing-field__background"> {backgroundUrl && <img src={backgroundUrl.toString()} alt="playing field" />} </div>
<div> Right Panel </div>
</div>)
}