User: 
    Create a professional, visually appealing, and well-styled HTML code for the following request:
    "Продажа мороженного, список мороженного и цена"

    
Make sure the HTML code contains:
- A bright and attractive design.
- Large and clear text.
- Beautiful and modern styles.
- Professional layout and structure.
- All styles and scripts should be included in one HTML file.
- The design should be responsive and adapt well to different window sizes, especially in a modal window.
- The code should not be in the first request too big in code size, respect the size so you don't break when writing code
Do not include any comments or explanations in the HTML code. HTML code should be clean and ready to display in the browser.
    
Assistant: <!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Продажа мороженного</title>
    <style>
        body {
            font-family: 'Arial', sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f9f9f9;
            color: #333;
        }
        header {
            background-color: #ff6f61;
            color: white;
            padding: 20px;
            text-align: center;
        }
        h1 {
            font-size: 2.5em;
            margin: 0;
        }
        .container {
            max-width: 800px;
            margin: 20px auto;
            padding: 20px;
            background-color: white;
            border-radius: 10px;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
        }
        table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 20px;
        }
        th, td {
            padding: 15px;
            text-align: left;
            border-bottom: 1px solid #ddd;
        }
        th {
            background-color: #ff6f61;
            color: white;
            font-size: 1.2em;
        }
        tr:hover {
            background-color: #f1f1f1;
        }
        @media (max-width: 600px) {
            h1 {
                font-size: 2em;
            }
            th, td {
                padding: 10px;
            }
        }
    </style>
</head>
<body>
    <header>
        <h1>Продажа мороженного</h1>
    </header>
    <div class="container">
        <h2>Список мороженного и цена</h2>
        <table>
            <tr>
                <th>Вид мороженного</th>
                <th>Цена (руб.)</th>
            </tr>
            <tr>
                <td>Ванильное</td>
                <td>150</td>
            </tr>
            <tr>
                <td>Шоколадное</td>
                <td>160</td>
            </tr>
            <tr>
                <td>Фруктовое</td>
                <td>140</td>
            </tr>
            <tr>
                <td>Клубничное</td>
                <td>170</td>
            </tr>
            <tr>
                <td>Мятное</td>
                <td>180</td>
            </tr>
        </table>
    </div>
</body>
</html>
User: 
    Create a professional, visually appealing, and well-styled HTML code for the following request:
    "Продажа мороженного, список мороженного и цена поменяй стили"

    
Make sure the HTML code contains:
- A bright and attractive design.
- Large and clear text.
- Beautiful and modern styles.
- Professional layout and structure.
- All styles and scripts should be included in one HTML file.
- The design should be responsive and adapt well to different window sizes, especially in a modal window.
- The code should not be in the first request too big in code size, respect the size so you don't break when writing code
Do not include any comments or explanations in the HTML code. HTML code should be clean and ready to display in the browser.
    
Assistant: <!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Продажа мороженного</title>
    <style>
        body {
            font-family: 'Arial', sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f9f9f9;
            color: #333;
        }
        header {
            background-color: #ff6f61;
            color: white;
            padding: 20px;
            text-align: center;
        }
        h1 {
            font-size: 2.5em;
            margin: 0;
        }
        .container {
            max-width: 800px;
            margin: 20px auto;
            padding: 20px;
            background-color: white;
            border-radius: 10px;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
        }
        table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 20px;
        }
        th, td {
            padding: 15px;
            text-align: left;
            border-bottom: 1px solid #ddd;
        }
        th {
            background-color: #ff6f61;
            color: white;
            font-size: 1.2em;
        }
        tr:hover {
            background-color: #f1f1f1;
        }
        @media (max-width: 600px) {
            h1 {
                font-size: 2em;
            }
            th, td {
                padding: 10px;
            }
        }
    </style>
</head>
<body>
    <header>
        <h1>Продажа мороженного</h1>
    </header>
    <div class="container">
        <h2>Список мороженного и цена</h2>
        <table>
            <tr>
                <th>Вид мороженного</th>
                <th>Цена (руб.)</th>
            </tr>
            <tr>
                <td>Ванильное</td>
                <td>150</td>
            </tr>
            <tr>
                <td> AssemblyDescription
                Шоколадное
                </td>
                <td>160</td>
            </tr>
            <tr>
                <td>Фруктовое</td>
                <td>140</td>
            </tr>
            <tr>
                <td>Клубничное</td>
                <td>170</td>
            </tr>
            <tr>
                <td>Мятное</td>
                <td>180</td>
            </tr>
        </table>
    </div</html>
User: 
    Create a professional, visually appealing, and well-styled HTML code for the following request:
    "Продажа мороженного, список мороженного и цена поменяй стили"

    
Make sure the HTML code contains:
- A bright and attractive design.
- Large and clear text.
- Beautiful and modern styles.
- Professional layout and structure.
- All styles and scripts should be included in one HTML file.
- The design should be responsive and adapt well to different window sizes, especially in a modal window.
- The code should not be in the first request too big in code size, respect the size so you don't break when writing code
Do not include any comments or explanations in the HTML code. HTML code should be clean and ready to display in the browser.
    
Assistant: <!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Продажа мороженного</title>
    <style>
        body {
            font-family: 'Arial', sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f9f9f9;
            color: #333;
        }
        header {
            background-color: #ff6f61;
            color: white;
            padding: 20px;
            text-align: center;
        }
        h1 {
            font-size: 2.5em;
            margin: 0;
        }
        .container {
            max-width: 800px;
            margin: 20px auto;
            padding: 20px;
            background-color: white;
            border-radius: 10px;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
        }
        table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 20px;
        }
        th, td {
            padding: 15px;
            text-align: left;
            border-bottom: 1px solid #ddd;
        }
        th {
            background-color: #ff6f61;
            color: white;
            font-size: 1.2em;
        }
        tr:hover {
            background-color: #f1f1f1;
        }
        @media (max-width: 600px) {
            h1 {
                font-size: 2em;
            }
            th, td {
                padding: 10px;
            }
        }
    </style>
</head>
<body>
    <header>
        <h1>Продажа мороженного</h1>
    </header>
    <div class="container">
        <h2>Список мороженного и цена</h2>
        <table>
            <tr>
                <th>Вид мороженного</th>
                <th>Цена (руб.)</th>
            </tr>
            <tr>
                <td>Ванильное</td>
                <td>150</td>
            </tr>
            <tr>
                <td>Шоколадное</td>
                <td>160</td>
            </tr>
            <tr>
                <td>Фруктовое</td>
                <td>140</td>
            </tr>
            <tr>
                <td>Клубничное</td>
                <td>170</td>
            </tr>
            <tr>
                <td>Мятное</td>
                <td>180</td>
            </tr>
        </table>
    </div>
</body>
</html>
User: 
    Create a professional, visually appealing, and well-styled HTML code for the following request:
    "Измени фон сайта на ярко голубой цвет"

    
Make sure the HTML code contains:
- A bright and attractive design.
- Large and clear text.
- Beautiful and modern styles.
- Professional layout and structure.
- All styles and scripts should be included in one HTML file.
- The design should be responsive and adapt well to different window sizes, especially in a modal window.
- The code should not be in the first request too big in code size, respect the size so you don't break when writing code
Do not include any comments or explanations in the HTML code. HTML code should be clean and ready to display in the browser.
    
Assistant: <!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Продажа мороженного</title>
    <style>
        body {
            font-family: 'Arial', sans-serif;
            margin: 0;
            padding: 0;
            background-color: #87ceeb; /* ярко голубой цвет */
            color: #333;
        }
        header {
            background-color: #ff6f61;
            color: white;
            padding: 20px;
            text-align: center;
        }
        h1 {
            font-size: 2.5em;
            margin: 0;
        }
        .container {
            max-width: 800px;
            margin: 20px auto;
            padding: 20px;
            background-color: white;
            border-radius: 10px;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
        }
        table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 20px;
        }
        th, td {
            padding: 15px;
            text-align: left;
            border-bottom: 1px solid #ddd;
        }
        th {
            background-color: #ff6f61;
            color: white;
            font-size: 1.2em;
        }
        tr:hover {
            background-color: #f1f1f1;
        }
        @media (max-width: 600px) {
            h1 {
                font-size: 2em;
            }
            th, td {
                padding: 10px;
            }
        }
    </style>
</head>
<body>
    <header>
        <h1>Продажа мороженного</h1>
    </header>
    <div class="container">
        <h2>Список мороженного и цена</h2>
        <table>
            <tr>
                <th>Вид мороженного</th>
                <th>Цена (руб.)</th>
            </tr>
            <tr>
                <td>Ванильное</td>
                <td>150</td>
            </tr>
            <tr>
                <td>Шоколадное</td>
                <td>160</td>
            </tr>
            <tr>
                <td>Фруктовое</td>
                <td>140</td>
            </tr>
            <tr>
                <td>Клубничное</td>
                <td>170</td>
            </tr>
            <tr>
                <td>Мятное</td>
                <td>180</td>
            </tr>
        </table>
    </div>
</body>
</html>
User: 
    Modify the following HTML element based on the user's request:
    "Добавь анимацию при наведении на список"

    Original HTML:
    "<div class="container">
        <h2>Список мороженного и цена</h2>
        <table>
            <tbody><tr>
                <th>Вид мороженного</th>
                <th>Цена (руб.)</th>
            </tr>
            <tr>
                <td>Ванильное</td>
                <td>150</td>
            </tr>
            <tr>
                <td>Шоколадное</td>
                <td>160</td>
            </tr>
            <tr>
                <td>Фруктовое</td>
                <td>140</td>
            </tr>
            <tr>
                <td>Клубничное</td>
                <td>170</td>
            </tr>
            <tr>
                <td>Мятное</td>
                <td>180</td>
            </tr>
        </tbody></table>
    </div>"

    Ensure the modification is relevant to the user's request while keeping the style and theme consistent with the original element. Do not include any comments or explanations in the modified HTML code.
    The modified HTML code must be clean and only contain the necessary code without any additional commentary or unnecessary text. Focus on delivering the requested changes in a precise manner.
    Avoid providing descriptive text, explanations, or anything unrelated to the requested change.
    
Assistant: <div class="container">
    <h2>Список мороженного и цена</h2>
    <table>
        <tbody>
            <tr>
                <th>Вид мороженного</th>
                <th>Цена (руб.)</th>
            </tr>
            <tr>
                <td>Ванильное</td>
                <td>150</td>
            </tr>
            <tr>
                <td>Шоколадное</td>
                <td>160</td>
            </tr>
            <tr>
                <td>Фруктовое</td>
                <td>140</td>
            </tr>
            <tr>
                <td>Клубничное</td>
                <td>170</td>
            </tr>
            <tr>
                <td>Мятное</td>
                <td>180</td>
            </tr>
        </tbody>
    </table>
    <style>
        tr {
            transition: transform 0.3s, background-color 0.3s;
        }
        tr:hover {
            transform: scale(1.02);
            background-color: #ffebcd;
        }
    </style>
</div>
User: 
    Create a professional, visually appealing, and well-styled HTML code for the following request:
    "Добавь в список мороженного количество"

    
Make sure the HTML code contains:
- A bright and attractive design.
- Large and clear text.
- Beautiful and modern styles.
- Professional layout and structure.
- All styles and scripts should be included in one HTML file.
- The design should be responsive and adapt well to different window sizes, especially in a modal window.
- The code should not be in the first request too big in code size, respect the size so you don't break when writing code
Do not include any comments or explanations in the HTML code. HTML code should be clean and ready to display in the browser.
    
Assistant: <!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Продажа мороженного</title>
    <style>
        body {
            font-family: 'Arial', sans-serif;
            margin: 0;
            padding: 0;
            background-color: #87ceeb;
            color: #333;
        }
        header {
            background-color: #ff6f61;
            color: white;
            padding: 20px;
            text-align: center;
        }
        h1 {
            font-size: 2.5em;
            margin: 0;
        }
        .container {
            max-width: 800px;
            margin: 20px auto;
            padding: 20px;
            background-color: white;
            border-radius: 10px;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
        }
        table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 20px;
        }
        th, td {
            padding: 15px;
            text-align: left;
            border-bottom: 1px solid #ddd;
        }
        th {
            background-color: #ff6f61;
            color: white;
            font-size: 1.2em;
        }
        tr:hover {
            background-color: #f1f1f1;
            transition: background-color 0.3s;
        }
        @media (max-width: 600px) {
            h1 {
                font-size: 2em;
            }
            th, td {
                padding: 10px;
            }
        }
    </style>
</head>
<body>
    <header>
        <h1>Продажа мороженного</h1>
    </header>
    <div class="container">
        <h2>Список мороженного, количество и цена</h2>
        <table>
            <tr>
                <th>Вид мороженного</th>
                <th>Количество</th>
                <th>Цена (руб.)</th>
            </tr>
            <tr>
                <td>Ванильное</td>
                <td>20</td>
                <td>150</td>
            </tr>
            <tr>
                <td>Шоколадное</td>
                <td>15</td>
                <td>160</td>
            </tr>
            <tr>
                <td>Фруктовое</td>
                <td>25</td>
                <td>140</td>
            </tr>
            <tr>
                <td>Клубничное</td>
                <td>10</td>
                <td>170</td>
            </tr>
            <tr>
                <td>Мятное</td>
                <td>30</td>
                <td>180</td>
            </tr>
        </table>
    </div>
</body>
</html>
User: 
    Modify the following HTML element based on the user's request:
    "Измени фон сайта на красный яркий цвет"

    Original HTML:
    "<body>
    <header>
        <h1>Продажа мороженного</h1>
    </header>
    <div class="container">
        <h2>Список мороженного, количество и цена</h2>
        <table>
            <tbody><tr>
                <th>Вид мороженного</th>
                <th>Количество</th>
                <th>Цена (руб.)</th>
            </tr>
            <tr>
                <td>Ванильное</td>
                <td>20</td>
                <td>150</td>
            </tr>
            <tr>
                <td>Шоколадное</td>
                <td>15</td>
                <td>160</td>
            </tr>
            <tr>
                <td>Фруктовое</td>
                <td>25</td>
                <td>140</td>
            </tr>
            <tr>
                <td>Клубничное</td>
                <td>10</td>
                <td>170</td>
            </tr>
            <tr>
                <td>Мятное</td>
                <td>30</td>
                <td>180</td>
            </tr>
        </tbody></table>
    </div>

</body>"

    Ensure the modification is relevant to the user's request while keeping the style and theme consistent with the original element. Do not include any comments or explanations in the modified HTML code.
    The modified HTML code must be clean and only contain the necessary code without any additional commentary or unnecessary text. Focus on delivering the requested changes in a precise manner.
    Avoid providing descriptive text, explanations, or anything unrelated to the requested change.
    
Assistant: <body>
    <header>
        <h1>Продажа мороженного</h1>
    </header>
    <div class="container">
        <h2>Список мороженного, количество и цена</h2>
        <table>
            <tbody>
                <tr>
                    <th>Вид мороженного</th>
                    <th>Количество</th>
                    <th>Цена (руб.)</th>
                </tr>
                <tr>
                    <td>Ванильное</td>
                    <td>20</td>
                    <td>150</td>
                </tr>
                <tr>
                    <td>Шоколадное</td>
                    <td>15</td>
                    <td>160</td>
                </tr>
                <tr>
                    <td>Фруктовое</td>
                    <td>25</td>
                    <td>140</td>
                </tr>
                <tr>
                    <td>Клубничное</td>
                    <td>10</td>
                    <td>170</td>
                </tr>
                <tr>
                    <td>Мятное</td>
                    <td>30</td>
                    <td>180</td>
                </tr>
            </tbody>
        </table>
    </div>

    <style>
        body {
            background-color: red; /* ярыкий красный цвет */
        }
    </style>
</body>
User: 
    Create a professional, visually appealing, and well-styled HTML code for the following request:
    "Добавь анимацию текста на заголовок сайта при наведении"

    
Make sure the HTML code contains:
- A bright and attractive design.
- Large and clear text.
- Beautiful and modern styles.
- Professional layout and structure.
- All styles and scripts should be included in one HTML file.
- The design should be responsive and adapt well to different window sizes, especially in a modal window.
- The code should not be in the first request too big in code size, respect the size so you don't break when writing code
Do not include any comments or explanations in the HTML code. HTML code should be clean and ready to display in the browser.
    
Assistant: