import 'dart:math';

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

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

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepOrange),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Энциклопедия пород собак'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: const MyWidget(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {

    final data = [
      _CardData(text:'Немецкая овчарка', desc: 'Отличные охранники и бойцы, уверенные, выносливые', tages:['крупные', 'служебные'] , imageUrl: 'https://i.pinimg.com/originals/37/a2/9a/37a29a34b248ff86d15c5d1aca9a13e0.jpg'),
      _CardData(text: 'Хаски', desc: 'Очень дружелюбные и ласковые, отличные компаньоны', tages:['крупные', 'пастушьи', 'компаньоны'] , imageUrl: 'https://i.pinimg.com/736x/56/c4/f0/56c4f08522549ed68e6782a4461810fc.jpg'),
      _CardData(text: 'Доберман', desc: 'Умные, преданные, с молниеносной реакцией и чувством собственного достоинства', tages:['крупные', 'бойцовые'] , imageUrl: 'https://i.pinimg.com/736x/46/05/4f/46054f5a232d2be0704e5bf2c92c073a.jpg'),
      _CardData(text: 'Колли', desc: 'Общительные, интеллигентные, неагрессивные, сильно привязываются', tages:['крупные', 'компаньоны'] , imageUrl: 'https://i.pinimg.com/originals/b4/9a/59/b49a59cd65b1315bf207896e7022ff96.jpg'),
      _CardData(text: 'Корги', desc: 'Жизнерадостные, активные, социальные, обучаемые, ', tages:['маленькие', 'декоративные'] , imageUrl: 'https://avatars.mds.yandex.net/i?id=0d1565e44373e7be60d235ebfe642396_l-4776319-images-thumbs&n=13'),
    ];

    return Center(
      child: SingleChildScrollView(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: data.map((e) => _Card.fromData(e)).toList(),
        ),
      ),
    );
  }
}

class _Card extends StatelessWidget {
  final String text;
  final String desc;
  final List<String> tages;
  final String imageUrl;

  _Card(this.text, this.desc, this.tages, this.imageUrl);

  factory _Card.fromData(_CardData data) => _Card(
    data.text,
    data.desc,
    data.tages,
    data.imageUrl
  );

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 150,
      margin: const EdgeInsets.only(top: 16),
      decoration: BoxDecoration(
        color: Colors.white,
        boxShadow: [
          BoxShadow(
            color: Colors.black26.withOpacity(0.5),
            offset: const Offset(0, 5),
            blurRadius: 8,
            spreadRadius: 4
          )
        ]
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Expanded(
              child: ClipRRect(
                child: SizedBox(
                  height: 150,
                  width: 400,
                  child: Image.network(
                      imageUrl ?? '',
                      fit: BoxFit.cover,
                      errorBuilder: (_, __, ___) => const Placeholder(),
                  ),
                ),
              )
          ),
          Expanded(
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text(
                      text,
                      style: Theme.of(context).textTheme.titleMedium
                  ),
                  Text (
                    desc,
                    style: TextStyle(
                      fontSize: 12.0,
                      height: 0.99
                    ),
                    //style: Theme.of(context).textTheme.bodySmall,
                  ),
                  Wrap(
                      spacing: 2.0,
                      runSpacing: 3.0,
                      children: tages.map((e) => _buildTag(e)).toList(),
                  )
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildTag(String tag) {
    return Container(
      margin: const EdgeInsets.only(right: 5.0),
      padding: const EdgeInsets.symmetric(horizontal: 6.0, vertical: 2.0),
      decoration: BoxDecoration(
        color: Colors.orange,
        borderRadius: BorderRadius.circular(16.0),
      ),
      child: Text(
        tag,
        style: TextStyle(
          color: Colors.white,
          fontSize: 10.0,
        ),
      ),
    );
  }
}

class _CardData {
  final String text;
  final String desc;
  final List<String> tages;
  final String imageUrl;

  _CardData({required this.text, required this.desc, required this.tages, required this.imageUrl});
}