Im trying to make my code architecture as most simple as i can and more optimize in order to avoid re-renders ,i want some feedback in order to fix any bugs or make it better.

Here is my code :

// ignore_for_file: camel_case_types
import 'package:flutter/material.dart';

class Thin_White_Line extends StatelessWidget {
  const Thin_White_Line({super.key});

  @override
  Widget build(BuildContext context) {
    double screenWidth = MediaQuery.of(context).size.width;
    final thin_white_line_sizes =
        Thin_White_Line_Sizes.fromScreenWidth(screenWidth);

    return Container(
      width: thin_white_line_sizes.width,
      height: thin_white_line_sizes.height,
      decoration: BoxDecoration(
        color: Colors.white70,
        borderRadius:
            BorderRadius.circular(thin_white_line_sizes.border_radius),
        boxShadow: [
          BoxShadow(
            color: Colors.black.withOpacity(0.2),
            offset: Offset(0, 2),
            blurRadius: thin_white_line_sizes.blur_radius,
          ),
        ],
      ),
    );
  }
}

class Thin_White_Line_Sizes {
  final double width;
  final double height;
  final double border_radius;
  final double blur_radius;

  Thin_White_Line_Sizes(
      {required this.width,
      required this.height,
      required this.border_radius,
      required this.blur_radius});

  factory Thin_White_Line_Sizes.fromScreenWidth(double screenWidth) {
    if (screenWidth < 480) {
      return Thin_White_Line_Sizes(
          width: screenWidth / 2,
          height: 2.0,
          border_radius: 2,
          blur_radius: 4);
    } else if (screenWidth <= 1280) {
      return Thin_White_Line_Sizes(
          width: screenWidth / 2,
          height: 4.0,
          border_radius: 4,
          blur_radius: 6);
    } else {
      return Thin_White_Line_Sizes(
          width: screenWidth / 2,
          height: 5.0,
          border_radius: 6,
          blur_radius: 8);
    }
  }
}

Do i need the class ? Do i need to make it statefull to “optimize it maybe better” ?

Do i need to use a Theme for that?

I make many re-usable components with the same logic but i never needed to use a Theme before so i dont know if i need one.(My Texts – ElevatedButtons are custom with different width and height sizes in some screens,so does a Theme make sense? )

How you handle the different screen sizes situation?

Thanks in Advance.