perfin/src/main/resources/account-view.fxml

<?xml version="1.0" encoding="UTF-8"?>

<?import com.andrewlalis.perfin.view.component.PropertiesPane?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.Text?>
<BorderPane
        xmlns="http://javafx.com/javafx"
        xmlns:fx="http://javafx.com/fxml"
        fx:controller="com.andrewlalis.perfin.control.AccountViewController"
>
    <top>
        <Label fx:id="titleLabel" styleClass="std-padding,large-font,bold-text"/>
    </top>
    <center>
        <VBox>
            <!-- Main account properties and actions -->
            <BorderPane>
                <center>
                    <VBox styleClass="std-padding,std-spacing">
                        <FlowPane>
                            <!-- Main account properties. -->
                            <PropertiesPane vgap="5" hgap="5">
                                <Label text="Name" styleClass="bold-text"/>
                                <Label fx:id="accountNameLabel"/>

                                <Label text="Number" styleClass="bold-text"/>
                                <Label fx:id="accountNumberLabel" styleClass="mono-font"/>

                                <Label text="Currency" styleClass="bold-text"/>
                                <Label fx:id="accountCurrencyLabel"/>

                                <Label text="Created At" styleClass="bold-text"/>
                                <Label fx:id="accountCreatedAtLabel" styleClass="mono-font"/>

                                <VBox>
                                    <Label text="Current Balance" styleClass="bold-text" fx:id="balanceLabel"/>
                                    <Text
                                            styleClass="small-font,secondary-color-fill"
                                            wrappingWidth="${balanceLabel.width}"
                                    >Computed using the last recorded balance and all transactions since.</Text>
                                </VBox>
                                <Label fx:id="accountBalanceLabel" styleClass="mono-font"/>
                            </PropertiesPane>
                        </FlowPane>
                    </VBox>
                </center>
                <right>
                    <VBox styleClass="std-padding,std-spacing">
                        <Label text="Actions" styleClass="bold-text"/>
                        <VBox fx:id="actionsVBox" styleClass="std-spacing">
                            <Button text="Edit" onAction="#goToEditPage"/>
                            <Button text="Record Balance" onAction="#goToCreateBalanceRecord"/>
                            <Button text="Archive" onAction="#archiveAccount"/>
                            <Button text="Delete" onAction="#deleteAccount"/>
                            <Button text="Unarchive" onAction="#unarchiveAccount"/>
                        </VBox>
                    </VBox>
                </right>
            </BorderPane>

            <!-- Account history -->
            <VBox VBox.vgrow="ALWAYS">
                <Label text="History" styleClass="bold-text,std-padding"/>
                <VBox>
                    <ScrollPane styleClass="tile-container-scroll">
                        <VBox fx:id="historyItemsVBox" styleClass="tile-container"/>
                    </ScrollPane>
                    <AnchorPane>
                        <Button
                                fx:id="loadMoreHistoryButton"
                                text="Load more history"
                                onAction="#loadMoreHistory"
                                AnchorPane.leftAnchor="0.0"
                                AnchorPane.rightAnchor="0.0"
                        />
                    </AnchorPane>
                </VBox>
            </VBox>
        </VBox>
    </center>
</BorderPane>