как сделать такой же экран блокировки

Добро пожаловать!

Зарегистрировавшись у нас, вы сможете обсуждать, делиться и отправлять личные сообщения другим участникам нашего сообщества.

Зарегистрироваться!
ℙ𝕒𝕨𝕟𝕠 𝕙𝕖𝕝𝕡 // ...
Активный
Регистрация
28 Июл 2024
Сообщения
1,021
Попробуй этот хз будет работать или нет, но у меня вроде все работает

HTML:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Доступ к форуму ограничен</title>
<style>
    body {
        margin: 0;
        padding: 0;
        background: #121212;
        font-family: 'Inter', sans-serif;
        color: #e4e4e4;
    }

    .wrapper {
        max-width: 800px;
        margin: 50px auto;
        background: #1b1b1b;
        padding: 40px;
        border-radius: 10px;
        border: 1px solid #2a2a2a;
        box-shadow: 0 0 20px rgba(0,0,0,0.4);
    }

    .header-icon {
        font-size: 60px;
        color: #ffa200;
        text-align: center;
        margin-bottom: 15px;
    }

    .main-title {
        text-align: center;
        font-size: 28px;
        font-weight: 600;
        color: #ffa200;
        margin-bottom: 25px;
    }

    .info-block {
        background: #181818;
        border: 1px solid #2a2a2a;
        border-radius: 8px;
        padding: 25px;
    }

    .info-title {
        font-size: 20px;
        font-weight: 600;
        color: #ffa200;
        margin-bottom: 20px;
    }

    .row {
        display: flex;
        justify-content: space-between;
        padding: 10px 0;
        border-bottom: 1px solid #2a2a2a;
    }

    .row:last-child {
        border-bottom: none;
    }

    .row b {
        color: #ffa200;
    }

    .footer {
        margin-top: 25px;
        text-align: center;
        font-size: 14px;
        opacity: 0.7;
    }

    a.support {
        color: #ffa200;
        text-decoration: none;
        font-weight: 600;
    }

    a.support:hover {
        text-decoration: underline;
    }
</style>
</head>
<body>

<div class="wrapper">
    <div class="header-icon">🚫</div>
    <div class="main-title">Доступ к форуму ограничен</div>

    <div class="info-block">
        <div class="info-title">Информация о блокировке</div>

        <div class="row">
            <span>Заблокирован:</span>
            <b>Сервером автоматически</b>
        </div>

        <div class="row">
            <span>Дата начала:</span>
            <b>01 Янв 2030</b>
        </div>

        <div class="row">
            <span>Дата окончания:</span>
            <b>1 Янв 2035</b>
        </div>

        <div class="row">
            <span>Причина:</span>
            <b> 5.10 </b>
        </div>

        <div class="row">
            <span>Автоматическое разблокирование:</span>
            <b>Нет</b>
        </div>
    </div>

    <div class="footer">
        Для уточнения деталей блокировки свяжитесь: 
        <a href="#" class="support">Telegram / Поддержка</a>
    </div>
</div>

</body>
</html>
 
ℙ𝕒𝕨𝕟𝕠 𝕙𝕖𝕝𝕡 // ...
Активный
Регистрация
28 Июл 2024
Сообщения
1,021
Попробуй этот хз будет работать или нет, но у меня вроде все работает

HTML:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Доступ к форуму ограничен</title>
<style>
    body {
        margin: 0;
        padding: 0;
        background: #121212;
        font-family: 'Inter', sans-serif;
        color: #e4e4e4;
    }

    .wrapper {
        max-width: 800px;
        margin: 50px auto;
        background: #1b1b1b;
        padding: 40px;
        border-radius: 10px;
        border: 1px solid #2a2a2a;
        box-shadow: 0 0 20px rgba(0,0,0,0.4);
    }

    .header-icon {
        font-size: 60px;
        color: #ffa200;
        text-align: center;
        margin-bottom: 15px;
    }

    .main-title {
        text-align: center;
        font-size: 28px;
        font-weight: 600;
        color: #ffa200;
        margin-bottom: 25px;
    }

    .info-block {
        background: #181818;
        border: 1px solid #2a2a2a;
        border-radius: 8px;
        padding: 25px;
    }

    .info-title {
        font-size: 20px;
        font-weight: 600;
        color: #ffa200;
        margin-bottom: 20px;
    }

    .row {
        display: flex;
        justify-content: space-between;
        padding: 10px 0;
        border-bottom: 1px solid #2a2a2a;
    }

    .row:last-child {
        border-bottom: none;
    }

    .row b {
        color: #ffa200;
    }

    .footer {
        margin-top: 25px;
        text-align: center;
        font-size: 14px;
        opacity: 0.7;
    }

    a.support {
        color: #ffa200;
        text-decoration: none;
        font-weight: 600;
    }

    a.support:hover {
        text-decoration: underline;
    }
</style>
</head>
<body>

<div class="wrapper">
    <div class="header-icon">🚫</div>
    <div class="main-title">Доступ к форуму ограничен</div>

    <div class="info-block">
        <div class="info-title">Информация о блокировке</div>

        <div class="row">
            <span>Заблокирован:</span>
            <b>Сервером автоматически</b>
        </div>

        <div class="row">
            <span>Дата начала:</span>
            <b>01 Янв 2030</b>
        </div>

        <div class="row">
            <span>Дата окончания:</span>
            <b>1 Янв 2035</b>
        </div>

        <div class="row">
            <span>Причина:</span>
            <b> 5.10 </b>
        </div>

        <div class="row">
            <span>Автоматическое разблокирование:</span>
            <b>Нет</b>
        </div>
    </div>

    <div class="footer">
        Для уточнения деталей блокировки свяжитесь:
        <a href="#" class="support">Telegram / Поддержка</a>
    </div>
</div>

</body>
</html>
OFFTOP

к сожелению не как там, но хоть что-то похоже на это

 
Команда форума
Модератор
Регистрация
4 Ноя 2024
Сообщения
1,432
 
Сверху