thrillwiki_django_no_react/backend/templates/rides/partials/coaster_fields.html

<div class="grid grid-cols-1 gap-6 md:grid-cols-2">
    <!-- Left Column -->
    <div class="space-y-6">
        <div>
            <label for="id_height_ft" class="block mb-1 text-sm font-medium text-gray-700 dark:text-gray-300">
                Height (ft)
            </label>
            <input type="number" 
                   name="height_ft" 
                   id="id_height_ft"
                   class="w-full border-gray-300 rounded-lg form-input dark:border-gray-600 dark:bg-gray-700 dark:text-white"
                   placeholder="Total height of the coaster in feet"
                   min="0">
        </div>
        <div>
            <label for="id_length_ft" class="block mb-1 text-sm font-medium text-gray-700 dark:text-gray-300">
                Length (ft)
            </label>
            <input type="number" 
                   name="length_ft" 
                   id="id_length_ft"
                   class="w-full border-gray-300 rounded-lg form-input dark:border-gray-600 dark:bg-gray-700 dark:text-white"
                   placeholder="Total track length in feet"
                   min="0">
        </div>
        <div>
            <label for="id_speed_mph" class="block mb-1 text-sm font-medium text-gray-700 dark:text-gray-300">
                Speed (mph)
            </label>
            <input type="number" 
                   name="speed_mph" 
                   id="id_speed_mph"
                   class="w-full border-gray-300 rounded-lg form-input dark:border-gray-600 dark:bg-gray-700 dark:text-white"
                   placeholder="Maximum speed in miles per hour"
                   min="0">
        </div>
        <div>
            <label for="id_inversions" class="block mb-1 text-sm font-medium text-gray-700 dark:text-gray-300">
                Inversions
            </label>
            <input type="number" 
                   name="inversions" 
                   id="id_inversions"
                   class="w-full border-gray-300 rounded-lg form-input dark:border-gray-600 dark:bg-gray-700 dark:text-white"
                   placeholder="Number of inversions"
                   min="0">
        </div>
    </div>

    <!-- Right Column -->
    <div class="space-y-6">
        <div>
            <label for="id_track_material" class="block mb-1 text-sm font-medium text-gray-700 dark:text-gray-300">
                Track Material
            </label>
            <select name="track_material" 
                    id="id_track_material"
                    class="w-full border-gray-300 rounded-lg form-select dark:border-gray-600 dark:bg-gray-700 dark:text-white">
                <option value="">Select track material...</option>
                <option value="STEEL">Steel</option>
                <option value="WOOD">Wood</option>
                <option value="HYBRID">Hybrid</option>
                <option value="OTHER">Other</option>
            </select>
        </div>
        <div>
            <label for="id_roller_coaster_type" class="block mb-1 text-sm font-medium text-gray-700 dark:text-gray-300">
                Coaster Type
            </label>
            <select name="roller_coaster_type" 
                    id="id_roller_coaster_type"
                    class="w-full border-gray-300 rounded-lg form-select dark:border-gray-600 dark:bg-gray-700 dark:text-white">
                <option value="">Select coaster type...</option>
                <option value="SITDOWN">Sit-Down</option>
                <option value="INVERTED">Inverted</option>
                <option value="FLYING">Flying</option>
                <option value="STANDUP">Stand-Up</option>
                <option value="WING">Wing</option>
                <option value="SUSPENDED">Suspended</option>
                <option value="BOBSLED">Bobsled</option>
                <option value="PIPELINE">Pipeline</option>
                <option value="MOTORBIKE">Motorbike</option>
                <option value="FLOORLESS">Floorless</option>
                <option value="DIVE">Dive</option>
                <option value="FAMILY">Family</option>
                <option value="WILD_MOUSE">Wild Mouse</option>
                <option value="SPINNING">Spinning</option>
                <option value="FOURTH_DIMENSION">4th Dimension</option>
                <option value="OTHER">Other</option>
            </select>
        </div>
        <div>
            <label for="id_launch_type" class="block mb-1 text-sm font-medium text-gray-700 dark:text-gray-300">
                Launch Type
            </label>
            <select name="launch_type" 
                    id="id_launch_type"
                    class="w-full border-gray-300 rounded-lg form-select dark:border-gray-600 dark:bg-gray-700 dark:text-white">
                <option value="">Select launch type...</option>
                <option value="CHAIN">Chain Lift</option>
                <option value="CABLE">Cable Launch</option>
                <option value="HYDRAULIC">Hydraulic Launch</option>
                <option value="LSM">Linear Synchronous Motor</option>
                <option value="LIM">Linear Induction Motor</option>
                <option value="GRAVITY">Gravity</option>
                <option value="OTHER">Other</option>
            </select>
        </div>
    </div>
</div>