MediaWiki:Common.css

Материал из Ботвапедии
Перейти к: навигация, поиск

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

  • Firefox / Safari: Удерживая клавишу Shift, нажмите на панели инструментов Обновить либо нажмите Ctrl-F5 или Ctrl-R (⌘-R на Mac)
  • Google Chrome: Нажмите Ctrl-Shift-R (⌘-Shift-R на Mac)
  • Internet Explorer: Удерживая Ctrl, нажмите Обновить либо нажмите Ctrl-F5
  • Opera: Перейдите в Menu → Настройки (Opera → Настройки на Mac), а затем Безопасность → Очистить историю посещений → Кэшированные изображения и файлы
@import url("/InvisibleCSS/morro.css"); 
@import url("/InvisibleCSS/may_2016.css"); 
@import url("/InvisibleCSS/icon.css");
@import url("/InvisibleCSS/star.css");
@import url("/InvisibleCSS/all.css");
@import url("/InvisibleCSS/scroll.css");
@import url("/InvisibleCSS/menu.css");
@import url("/InvisibleCSS/snow_wars.css");
@font-face {font-family: DsCoptic;
 src: local("DsCoptic"), 
 url(https://wiki.botva.ru/DS_Coptic.ttf); 
 }

/* ВОТ ТАК ДОЛЖЕН ВЫГЛЯДЕТЬ РАЙ ПЕРФЕКЦИОНИСТА */


.item_1660 {background-position: -500px -940px;} /* Кулон летуновода */
.item_1404 {background-position: -460px -460px;}  /* Стеклянный глаз */
.item_1405 {background-position: -460px -480px;} /* Тыквовин */
.item_1287 {background-position: -440px -20px;}  /* Щитовик */
.item_1288 {background-position: -440px 0;} /* Загребун */
.item_1532 {background-position: -480px -820px;} /* кулон сноходца */
.item_1465 {background-position: -460px -1020px;} /* Компас */
.item_1413 {background-position: -460px -540px;} /* Шутовской молоточек */
.item_1411 {background-position: -460px -560px;} /* Шутовские сапожки */
.item_1412 {background-position: -460px -580px;} /* Шутовской щитомеч */

.item_king_1 {background-position: -320px 0; width:27px; height:20px;} /* кристальная корона царя горы */
.item_king_2 {background-position: -320px -20px; width:27px; height:20px;} /* бронзовая корона царя горы */
.item_king_3 {background-position: -320px -40px; width:27px; height:20px;} /* золотая корона царя горы */

/*Сущности мишек*/
.morro_ability43{background-position:-120px -240px} /*Сущность серого мимимишки*/
.morro_ability44{background-position:-180px -240px} /*Сущность белого мимимишки*/
.morro_ability45{background-position:-240px -240px} /*Сущность кровожадного мимимишки*/
.morro_ability46{background-position:-300px -240px} /*Сущность горноконя*/
.morro_ability55{background-position: 0px -300px} /*Сущность Фенека*/
.morro_ability59{background-position:-120px -300px} /*Сущность скитальца*/

/* === АДАПТИВНАЯ СЕТКА ДЛЯ АРТЕФАКТОВ НА МОБИЛЬНЫХ === */
@media screen and (max-width: 768px) {
    /* Превращаем таблицу и её строки в блоки, чтобы они шли друг под другом */
    .adaptive-artifacts, 
    .adaptive-artifacts tbody, 
    .adaptive-artifacts tr, 
    .adaptive-artifacts td, 
    .adaptive-artifacts th {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box;
    }

    /* Делаем заголовки по центру и с отступом сверху */
    .adaptive-artifacts th {
        text-align: center !important;
        padding-top: 15px !important;
        padding-bottom: 5px !important;
        border-bottom: none !important;
    }

    /* Убираем лишние границы между ячейками на мобильном для чистоты */
    .adaptive-artifacts td {
        border-left: none !important;
        border-right: none !important;
        padding: 10px 5px !important;
    }

    /* ВАЖНО: Сохраняем нормальный вид для вложенных таблиц (уровни 1-6) */
    .adaptive-artifacts td .wikitable,
    .adaptive-artifacts td .wikitable tr,
    .adaptive-artifacts td .wikitable td,
    .adaptive-artifacts td .wikitable th {
        display: table !important; /* Возвращаем табличное поведение вложенным элементам */
        width: 100% !important;
    }
    
    .adaptive-artifacts td .wikitable td,
    .adaptive-artifacts td .wikitable th {
        display: table-cell !important;
    }

    /* Немного уменьшаем размер шрифта заголовков на телефоне, чтобы влезали */
    .adaptive-artifacts big big {
        font-size: 1.3em;
    }
}
/* ТЕСТ: фон таблицы должен стать красным на телефоне */
@media screen and (max-width: 768px) {
    .adaptive-artifacts {
        background-color: red !important;
    }
}