MediaWiki:Test.css: различия между версиями

Текущая версия от 10:00, 13 января 2026

<div class="user-profile-card">
  <div class="user-avatar">
    [[File:Placeholder_avatar.png|thumb|none|Аватар]]
  </div>
  <div class="user-info">
    <div class="user-name">DefhomeNEW <span class="user-role-badge">Модератор сообщества</span></div>
    <div class="user-stats">
      ПРАВОК: 34 • СООБЩЕНИЙ: 0
    </div>
    <div class="user-social-icons">
      [[File:Discord-icon.png|20px|link=|alt=Discord]]
    </div>
  </div>
  <div class="profile-actions">
    <a href="/wiki/User:DefhomeNEW/edit" class="button button-edit-profile">ПРАВИТЬ ПРОФАЙЛ</a>
  </div>
</div>

<!-- Возможно, вам понадобится добавить CSS в MediaWiki:Common.css или ваш личный CSS User:DefhomeNEW/common.css -->
<style type="text/css">
/* Здесь будут ваши CSS-правила */
</style>

@@ Строка 1: / Строка 1: @@
-     /* Для всей страницы, если нужно */
+<div class="user-profile-card">
-     body.skin-vector { /* Или другой класс для вашего скина */
+  <div class="user-avatar">
-        background-color: #1a1a1a; /* Темно-серый фон */
+     [[File:Placeholder_avatar.png|thumb|none|Аватар]]
-        color: #e0e0e0; /* Светлый текст */
+  </div>
-    }
+  <div class="user-info">
+     <div class="user-name">DefhomeNEW <span class="user-role-badge">Модератор сообщества</span></div>
+    <div class="user-stats">
+      ПРАВОК: 34 • СООБЩЕНИЙ: 0
+    </div>
+    <div class="user-social-icons">
+      [[File:Discord-icon.png|20px|link=|alt=Discord]]
+    </div>
+  </div>
+  <div class="profile-actions">
+    <a href="/wiki/User:DefhomeNEW/edit" class="button button-edit-profile">ПРАВИТЬ ПРОФАЙЛ</a>
+  </div>
+</div>
-    /* Блок профиля (если вы создадите его на User:Ваше_имя) */
+<!-- Возможно, вам понадобится добавить CSS в MediaWiki:Common.css или ваш личный CSS User:DefhomeNEW/common.css -->
-    .user-profile-card {
+<style type="text/css">
-        display: flex; /* Или grid */
+/* Здесь будут ваши CSS-правила */
-        align-items: center;
+</style>
-        background-color: #2a2a2a; /* Темный фон блока */
-        padding: 20px;
-        border-radius: 8px;
-        margin-bottom: 20px;
-        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
-        color: #e0e0e0;
-    }
-    .user-avatar img {
-        width: 80px;
-        height: 80px;
-        border-radius: 50%;
-        margin-right: 20px;
-        border: 3px solid #555; /* Обводка аватара */
-    }
-    .user-info {
-        flex-grow: 1;
-    }
-    .user-name {
-        font-size: 24px;
-        font-weight: bold;
-        color: #ffffff; /* Белый цвет имени */
-        margin-bottom: 5px;
-        display: flex; /* Для выравнивания роли */
-        align-items: center;
-    }
-    .user-role-badge {
-        background-color: #8b4513; /* Коричневый цвет */
-        color: #ffffff;
-        padding: 3px 8px;
-        border-radius: 4px;
-        font-size: 12px;
-        font-weight: normal;
-        margin-left: 10px;
-        white-space: nowrap; /* Чтобы текст не переносился */
-    }
-    .user-stats {
-        font-size: 14px;
-        color: #aaaaaa; /* Серый цвет статистики */
-        margin-bottom: 10px;
-    }
-    .user-social-icons img { /* Для иконки Discord */
-        width: 20px;
-        height: 20px;
-        margin-right: 8px;
-        vertical-align: middle; /* Выравнивание по центру */
-    }
-    .profile-actions {
-        margin-left: 20px;
-    }
-    .button-edit-profile {
-        display: inline-block;
-        padding: 10px 15px;
-        border: 1px solid #ccc;
-        border-radius: 5px;
-        text-decoration: none;
-        color: #e0e0e0;
-        background-color: #333;
-        transition: background-color 0.3s ease;
-    }
-    .button-edit-profile:hover {
-        background-color: #555;
-        color: #ffffff;
-    }
-    /* Стилизация стандартного блока информации о пользователе (если вы не создаете свою страницу) */
-    /* Например, для блоков, которые появляются при нажатии на имя пользователя */
-    .mw-user-profile-content { /* Этот класс может отличаться в зависимости от скина */
-       /* Здесь можно добавить стили */
-    }
-    </style>