How to edit dropdown items list to look like below

I've implemented a custom dropdown widget in my Flutter project, but I'm encountering an issue with the display of the dropdown items when the widget is used.

import 'package:flutter/material.dart';
import 'package:universalteam/Components/AppColors.dart';

Widget CustomDropdown({
  required List<String> items,
  required String hint,
  double borderRadius = 16,
  double width = double.infinity,
  double height = 60,
  double left = 0,
  double right = 0,
  double top = 0,
  double bottom = 0,
  double fontSize = 16,
  Color color = AppColors.black,
  Color containerBackgroundColor = AppColors.RegisterPageTextFieldColor,
  Color textFieldBackgroundColor = AppColors.RegisterPageTextFieldColor,
  double contentPaddingLeft = 12,
  double contentPaddingRight = 0,
  TextAlign textalign = TextAlign.left,
  bool isRequired = false,
  void Function(String?)? onChanged,
}) {
  String? _selectedItem;

  return Visibility(
    visible: true,
    child: Container(
      width: width,
      height: height,
      padding: EdgeInsets.only(
        left: left,
        right: right,
        top: top,
        bottom: bottom,
      ),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(borderRadius)),
        color: containerBackgroundColor,
      ),
      child: Container(
        alignment: Alignment.center,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.all(Radius.circular(borderRadius)),
          color: textFieldBackgroundColor,
        ),
        child: DropdownButtonFormField<String>(
          value: _selectedItem,
          style: TextStyle(
            fontSize: fontSize,
            fontFamily: "Poppins",
            fontWeight: FontWeight.w400,
            color: AppColors.black,
          ),
          decoration: InputDecoration(
            label: RichText(
              softWrap: true,
              text: TextSpan(
                text: hint,
                style: TextStyle(
                  color: AppColors.darkGray,
                ),
                children: [
                  isRequired == true
                      ? TextSpan(
                          text: ' * ',
                          style: TextStyle(
                            color: AppColors.darkMagenta,
                            fontWeight: FontWeight.bold,
                          ),
                        )
                      : TextSpan(text: '')
                ],
              ),
            ),
            border: InputBorder.none,
            contentPadding: EdgeInsets.only(
              left: contentPaddingLeft,
              right: contentPaddingRight,
            ),
            suffixIcon: Icon(
              Icons.keyboard_arrow_down,
              size: 25,
              color: AppColors.darkMagenta,
            ),
          ),
          onChanged: (String? newValue) {
            _selectedItem = newValue;
            onChanged?.call(newValue);
          },
          items: items.map<DropdownMenuItem<String>>((String value) {
            return DropdownMenuItem<String>(
              value: value,
              child: Text(
                value,
                textAlign: TextAlign.center,
                style: TextStyle(
                  color: Color(0xFF5F5F60),
                  fontSize: 13,
                  fontFamily: 'Poppins',
                  fontWeight: FontWeight.w400,
                  height: 0.12,
                ),
              ),
            );
          }).toList(),
          icon: SizedBox(),
        ),
      ),
    ),
  );
}

I want to fix how the dropdown items are displayed but I can't. Whenever I call this widget this is what it looks like

I want it to look like this

Take a look at dropdown_button_2 (https://pub.dev/packages/dropdown_button2) that package offers some really nice dropdown customization options. You can probably do what you are wanting with it