// "Load game" screen. The `save_list` widget lists the worlds in the saves directory.
root: Column {
    width: Fill,
    height: Fill,
    align: Center,
    justify: Center,
    gap: 16,
    background: "backdrop",
    children: [
        Text { text: "Load game", size: 34, color: "accent" },
        Panel {
            gap: 10,
            width: Px(560),
            children: [
                Text { text: "No saved worlds yet.", color: "dim", visible: "!has_saves" },
                Widget("save_list"),
                Row {
                    gap: 10,
                    align: Center,
                    children: [
                        Text { text: "Character", color: "dim" },
                        Input {
                            id: "name",
                            value: "{profile_name}",
                            width: Px(200),
                            max_len: 24,
                            tooltip: "Letters, digits, spaces, _ and - (max 24)",
                        },
                    ],
                },
                Checkbox {
                    id: "host",
                    text: "Allow other players to join",
                    tooltip: "Host the world on the network. You are always an admin of your own world.",
                },
                Row {
                    gap: 10,
                    align: Center,
                    visible: "host",
                    children: [
                        Text { text: "Port", color: "dim" },
                        Input { id: "port", value: "{default_port}", width: Px(80), max_len: 5 },
                        Text { text: "Password", color: "dim" },
                        Input {
                            id: "password",
                            password: true,
                            placeholder: "none",
                            width: Px(140),
                            tooltip: "Players need this password to join (empty: no password)",
                        },
                    ],
                },
                Text { text: "{message}", color: "error", visible: "message", max_width: 530 },
                Row {
                    children: [Button { text: "Back", action: "screen:main" }],
                },
            ],
        },
        Text { text: "Saves: {saves_dir}", size: 13, color: "dim" },
    ],
}