Skip to content

Change overall background color to match react components #531

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 6 commits into
base: master
Choose a base branch
from
Open

Change overall background color to match react components #531

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
7443d2c
Change overall background color to match react components
twells46 Feb 25, 2025
4131646
Merge branch 'master' into fixBackground
tcorbly Mar 27, 2025
66fa89f
Merge branch 'master' into fixBackground
twells46 May 13, 2025
a6d9424
Use minHeight for dynamic sizing
twells46 May 13, 2025
b380830
Revert "Change overall background color to match react components"
twells46 May 13, 2025
2c24a9b
Merge branch 'master' into fixBackground
tcorbly Jun 13, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 6 additions & 5 deletions src/components/interface/Card.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ const Container = styled('div', (props: ThemeProps & {
height: '100%',
minWidth: '320px',
maxWidth: '350px',
minHeight: '320px',
maxHeight: '350px',
display: 'flex',
flexDirection: 'column',
Expand Down Expand Up @@ -98,7 +99,7 @@ export class Card extends React.Component<Props, State> {
}

render() {
const {
const {
backgroundImage,
backgroundColor,
backgroundPosition,
Expand All @@ -111,9 +112,9 @@ export class Card extends React.Component<Props, State> {
} = this.props;

return (
<Container
theme={theme}
backgroundimage={backgroundImage}
<Container
theme={theme}
backgroundimage={backgroundImage}
backgroundcolor={backgroundColor}
backgroundposition={backgroundPosition}
backgroundsize={backgroundSize}
Expand All @@ -127,4 +128,4 @@ export class Card extends React.Component<Props, State> {
);
}
}
export default Card;
export default Card;
3 changes: 2 additions & 1 deletion src/index.html.ejs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@

font-family: 'Roboto', sans-serif;
font-weight: 300;
overflow-x: hidden;
}

/* Pattern styles */
Expand Down Expand Up @@ -168,4 +169,4 @@
<script src="/scratch/blocks_compressed.js"></script>
<script src="/scratch/blocks_compressed_vertical.js"></script>
</body>
</html>
</html>
10 changes: 5 additions & 5 deletions src/pages/Dashboard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ const Container = styled('div', (props: ThemeProps) => ({
alignItems: 'center',
justifyContent: 'center',
width: '100%',
height: '100vh',
minHeight: '100vh',
backgroundColor: props.theme.backgroundColor,
color: props.theme.color,
}));
Expand All @@ -57,7 +57,7 @@ const CardContainer = styled('div', (props: ThemeProps) => ({
paddingRight: cardContainerMargin(),
backgroundColor: props.theme.backgroundColor,
width: '100%',
height: 'calc(100vh - 48px)',
minHeight: 'calc(100vh - 48px)',
}));


Expand All @@ -73,7 +73,7 @@ class Dashboard extends React.PureComponent<Props> {

return (
<Container className={className} style={style} theme={theme}>
<MainMenu theme={theme}/>
<MainMenu theme={theme} />
<CardContainer theme={theme}>
<Card
theme={theme}
Expand All @@ -83,7 +83,7 @@ class Dashboard extends React.PureComponent<Props> {
backgroundImage={'url(../../static/icons/Laptop_Icon_Sunscreen.png)'}
onClick={onTutorialsClick}
/>
<Card
<Card
theme={theme}
title={LocalizedString.lookup(tr('3D Simulator'), locale)}
description={LocalizedString.lookup(tr('A simulator for the Botball demobot.'), locale)}
Expand Down Expand Up @@ -121,4 +121,4 @@ export default connect((state: State) => ({
onTutorialsClick: () => dispatch(push('/tutorials')),
onLeaderboardClick: () => dispatch(push('/leaderboard')),
onSimulatorClick: () => dispatch(push('/scene/jbcSandboxA')),
}))(Dashboard) as React.ComponentType<DashboardPublicProps>;
}))(Dashboard) as React.ComponentType<DashboardPublicProps>;