mirror of
https://github.com/a-b-street/abstreet.git
synced 2024-11-24 01:15:12 +03:00
Import screen UI fixups (#584)
* Import screen UI fixups - even out the spacing a bit - use underline style for "Alternate Instructions" web link - left/right switch is more intuitive than right/left - disambiguate label from toggle id
This commit is contained in:
parent
162f09a887
commit
e672256828
@ -158,25 +158,7 @@ impl<A: AppLike + 'static> CityPicker<A> {
|
||||
batch.into_widget(ctx).named("picker"),
|
||||
Widget::col(this_city).centered_vert(),
|
||||
]),
|
||||
Widget::custom_row(vec![
|
||||
"Don't see the place you want?"
|
||||
.text_widget(ctx)
|
||||
.centered_vert(),
|
||||
ctx.style()
|
||||
.btn_plain
|
||||
.btn()
|
||||
// TODO On web, this is a link, so it's styled appropriately. Use a
|
||||
// different style on native?
|
||||
.label_styled_text(
|
||||
Text::from(
|
||||
Line("Import a new city into A/B Street")
|
||||
.fg(Color::hex("#4CA4E5"))
|
||||
.underlined(),
|
||||
),
|
||||
ControlState::Default,
|
||||
)
|
||||
.build_widget(ctx, "import new city"),
|
||||
]),
|
||||
"Don't see the place you want?".text_widget(ctx),
|
||||
if cfg!(not(target_arch = "wasm32")) {
|
||||
ctx.style()
|
||||
.btn_outline
|
||||
@ -185,6 +167,21 @@ impl<A: AppLike + 'static> CityPicker<A> {
|
||||
} else {
|
||||
Widget::nothing()
|
||||
},
|
||||
if cfg!(target_arch = "wasm32") {
|
||||
// On web, this is a link, so it's styled appropriately.
|
||||
ctx.style()
|
||||
.btn_plain
|
||||
.btn()
|
||||
.label_underlined_text("Import a new city into A/B Street")
|
||||
.build_widget(ctx, "import new city")
|
||||
} else {
|
||||
// On native this shows the "import" instructions modal within
|
||||
// the app
|
||||
ctx.style()
|
||||
.btn_outline
|
||||
.text("Import a new city into A/B Street")
|
||||
.build_widget(ctx, "import new city")
|
||||
},
|
||||
]))
|
||||
.build(ctx),
|
||||
}))
|
||||
|
@ -28,37 +28,53 @@ impl<A: AppLike + 'static> ImportCity<A> {
|
||||
Line("Import a new city").small_heading().into_widget(ctx),
|
||||
ctx.style().btn_close_widget(ctx),
|
||||
]),
|
||||
Widget::row(vec![
|
||||
"Step 1)".text_widget(ctx),
|
||||
Widget::col(vec![
|
||||
Widget::row(vec![
|
||||
"Step 1)".text_widget(ctx).centered_vert(),
|
||||
ctx.style()
|
||||
.btn_plain
|
||||
.btn()
|
||||
.label_underlined_text("Go to geojson.io")
|
||||
.build_def(ctx),
|
||||
]),
|
||||
Widget::row(vec![
|
||||
"Step 2)".text_widget(ctx).margin_right(16),
|
||||
"Draw a polygon boundary where you want to import"
|
||||
.text_widget(ctx)
|
||||
.margin_below(16),
|
||||
])
|
||||
.margin_below(16),
|
||||
Widget::row(vec![
|
||||
"Step 3)".text_widget(ctx).margin_right(16),
|
||||
"Copy the JSON text on the right into your clipboard".text_widget(ctx),
|
||||
])
|
||||
.margin_below(16),
|
||||
Widget::row(vec![
|
||||
"Step 4)".text_widget(ctx).centered_vert(),
|
||||
Toggle::choice(
|
||||
ctx,
|
||||
"left handed driving",
|
||||
"drive on the left",
|
||||
"right",
|
||||
None,
|
||||
false,
|
||||
),
|
||||
]),
|
||||
Widget::row(vec![
|
||||
"Step 5)".text_widget(ctx).centered_vert(),
|
||||
ctx.style()
|
||||
.btn_solid_primary
|
||||
.text("Import the area from your clipboard")
|
||||
.build_def(ctx),
|
||||
])
|
||||
.margin_below(32),
|
||||
ctx.style()
|
||||
.btn_solid_primary
|
||||
.text("Go to geojson.io")
|
||||
.btn_plain
|
||||
.btn()
|
||||
.label_underlined_text("Alternate instructions")
|
||||
.build_def(ctx),
|
||||
]),
|
||||
"Step 2) Draw a polygon boundary where you want to import".text_widget(ctx),
|
||||
"Step 3) Copy the JSON text on the right into your clipboard".text_widget(ctx),
|
||||
Widget::row(vec![
|
||||
"Step 4)".text_widget(ctx),
|
||||
Toggle::choice(
|
||||
ctx,
|
||||
"driving side",
|
||||
"drive on the right",
|
||||
"left",
|
||||
None,
|
||||
true,
|
||||
),
|
||||
]),
|
||||
Widget::row(vec![
|
||||
"Step 5)".text_widget(ctx),
|
||||
ctx.style()
|
||||
.btn_solid_primary
|
||||
.text("Import the area from your clipboard")
|
||||
.build_def(ctx),
|
||||
]),
|
||||
ctx.style()
|
||||
.btn_outline
|
||||
.text("Alternate instructions")
|
||||
.build_def(ctx),
|
||||
])
|
||||
.section(ctx),
|
||||
]))
|
||||
.build(ctx);
|
||||
Box::new(ImportCity {
|
||||
@ -96,7 +112,7 @@ impl<A: AppLike + 'static> State<A> for ImportCity<A> {
|
||||
format!("{}/one_step_import", bin_dir),
|
||||
"boundary.geojson".to_string(),
|
||||
];
|
||||
if !self.panel.is_checked("driving side") {
|
||||
if self.panel.is_checked("left handed driving") {
|
||||
args.push("--drive_on_left".to_string());
|
||||
}
|
||||
match grab_geojson_from_clipboard() {
|
||||
|
@ -185,7 +185,7 @@ impl Toggle {
|
||||
// TODO These should actually be radio buttons
|
||||
pub fn choice<MK: Into<Option<MultiKey>>>(
|
||||
ctx: &EventCtx,
|
||||
label: &str,
|
||||
action: &str,
|
||||
left_label: &str,
|
||||
right_label: &str,
|
||||
hotkey: MK,
|
||||
@ -252,7 +252,7 @@ impl Toggle {
|
||||
toggle_right_button.build(ctx, right_label),
|
||||
toggle_left_button.build(ctx, left_label),
|
||||
)
|
||||
.named(label)
|
||||
.named(action)
|
||||
.centered_vert(),
|
||||
right_text_button.build_def(ctx).centered_vert(),
|
||||
])
|
||||
|
Loading…
Reference in New Issue
Block a user