First and last steps do not appear on line when displayed vertically

[jeffgrann]

Describe the bug Display issue with the first and last steps when displayed vertically where the indicator and text is indented to the right from the line.

To Reproduce Use the code from the readme and change .horizontal to .vertical:

struct MyMain: View {
    let steps = [ Text("Cart").font(.caption),
                  Text("Delivery Address").font(.caption),
                  Text("Order Summary").font(.caption),
                  Text("Payment Method").font(.caption),
                  Text("Track").font(.caption)]

    let indicationTypes = [StepperIndicationType.custom(NumberedCircleView(text: "1")),
                            .custom(NumberedCircleView(text: "2")),
                            .custom(NumberedCircleView(text: "3")),
                            .custom(NumberedCircleView(text: "4")),
                            .custom(NumberedCircleView(text: "5"))]

    var body: some View {
        StepperView()
            .addSteps(steps)
            .indicators(indicationTypes)
            .stepIndicatorMode(StepperMode.vertical)
            .spacing(50)
            .lineOptions(StepperLineOptions.custom(1, Colors.blue(.teal).rawValue))
    }
}

Expected behavior Indicators should line up.

Screenshots

Info (please complete the following information):

• Device: Simulator (not tried on actual device)
• OS: iOS 14.2
• Xcode Version 12.2 (12B45b)

Additional context N/A

[badrinathvm]

Hi, @jeffgrann thank you so much for checking out the library, Instead of using the Text( try using StepTextView(text: which aligns as expected.

Below is the code

 let steps = [ StepTextView(text: "Cart"),
                  StepTextView(text: "Delivery Address"),
                  StepTextView(text: "Order Summary"),
                  StepTextView(text: "Payment Method"),
                  StepTextView(text: "Track")]

    let indicationTypes = [StepperIndicationType.custom(NumberedCircleView(text: "1")),
                            .custom(NumberedCircleView(text: "2")),
                            .custom(NumberedCircleView(text: "3")),
                            .custom(NumberedCircleView(text: "4")),
                            .custom(NumberedCircleView(text: "5"))]

    var body: some View {
        StepperView()
            .addSteps(steps)
            .indicators(indicationTypes)
            .stepIndicatorMode(StepperMode.vertical)
            .spacing(50)
            .lineOptions(StepperLineOptions.custom(1, Colors.blue(.teal).rawValue))
    }

[jeffgrann]

Thanks!