Final Project Part 2

<template>
    <div class="flex flex-col items-center">
        <h1>Add Transaction</h1>
        
        <div class="toggle-switch">
            <input type="radio" id="debit" name="transaction_type" checked>
            <label for="debit">Debit</label>
            
            <input type="radio" id="credit" name="transaction_type">
            <label for="credit">Credit</label>
        </div>
        
        <div class="input-field">
            <label for="description">Description</label>
            <input type="text" id="description" name="transaction_description" placeholder="Enter your description">
        </div>
        
        <div class="input-field">
            <label for="amount">Amount</label>
            <div>
                <span class="currency">$<span>
                <input type="text" id="amount" name="transaction_amount">
            </div>
        </div>
        
        <div>
            <button>Add</button>
        </div>
    </div>
</template>

<label for="credit">Credit</label>

</div>

<label for="description">Description</label>

<input type="text" id="description" name="transaction_description" placeholder="Enter

your description">

</div>

<label for="amount">Amount</label>

<div>

</div>

<div>

</div>

</template>

<h1>Add Transaction</h1>

<label for="debit">Debit</label>

›

"Download the Vue Devtools extension for a better development experience: https://github.com/vuejs/vue-devtools"

›

"You are running Vue in development mode. Make sure to turn on production mode when deploying for production. See more tips at https://vuejs.org/guide/deployment.html"

-12:27