diff --git a/src/menu.rs b/src/menu.rs index ee1bdf9..dc7fdd3 100644 --- a/src/menu.rs +++ b/src/menu.rs @@ -185,6 +185,7 @@ fn setup_how_to_play(mut commands: Commands, deck: Res) { .observe(button_set_state(ViewState::Menu)); parent.spawn((Node { + width: Val::Px(500.0), align_items: AlignItems::Center, justify_content: JustifyContent::Center, flex_direction: FlexDirection::Column, @@ -255,16 +256,17 @@ fn setup_how_to_play(mut commands: Commands, deck: Res) { ); [ ("Find groups of 3 cards", None), - ("All cards in a set must match or differ in their traits: Color, Number, Shading, and Shape.", None), + ("All cards in a set must either match or differ in their traits: Color, Number, Shading, and Shape.", None), ("For example all agree on Color, Shading, and Shape but not Number...", Some(most_matching)), - ("...or all agree on Number but not Color, Number, Shading, and Shape...", Some(most_not_matching)), - ("...but never partial agreement on a trait...", Some(not_valid)), + ("...or all agree on Number but not Color, Shading, and Shape...", Some(most_not_matching)), + ("...but never partial agreement...", Some(not_valid)), ("When in doubt, click the 'Help!' button to get an assist.", None), ] .iter() .for_each(|(t, example)| { parent.spawn(( Node { + max_width: Val::Percent(100.0), flex_direction: FlexDirection::Row, align_items: AlignItems::Center, ..default() @@ -278,22 +280,26 @@ fn setup_how_to_play(mut commands: Commands, deck: Res) { }, Text(t.to_string()), )); - if let Some((a, b, c)) = example { - [a, b, c].iter().for_each(|x| { - let sprite = deck.cards.get(*x).unwrap(); - parent.spawn(( - Node { - height: Val::Px(100.0), - ..default() - }, - ImageNode { - image: sprite.image.clone(), - texture_atlas: sprite.texture_atlas.clone(), - ..default() - } - )); - }); - }; + parent.spawn(Node { + ..default() + }).with_children(|parent| { + if let Some((a, b, c)) = example { + [a, b, c].iter().for_each(|x| { + let sprite = deck.cards.get(*x).unwrap(); + parent.spawn(( + Node { + height: Val::Px(100.0), + ..default() + }, + ImageNode { + image: sprite.image.clone(), + texture_atlas: sprite.texture_atlas.clone(), + ..default() + } + )); + }); + }; + }); }); }); });