Difference between revisions of "MediaWiki:Common.css"

From War Thunder Wiki
Jump to: navigation, search
Line 1: Line 1:
 +
.dynamic_image {
 +
    max-width: 100%;
 +
    height: auto;
 +
}
 +
 
.right_ttx .tright {
 
.right_ttx .tright {
 
     clear: none;
 
     clear: none;

Revision as of 12:04, 15 August 2018

.dynamic_image {
    max-width: 100%;
    height: auto;
}

.right_ttx .tright {
    clear: none;
}


a {
    text-decoration-skip-ink: none;
}

pre {
    overflow-x: auto;
}

img {
    max-width: 1100px;
    height: auto;
}

.mw-body h1, .mw-body-content h2 {
    font-family: 'Roboto',sans-serif !important;
}

.zebra tr:nth-child(even) {
    background-color: rgb(240,240,240);
}

#mw-head .selected::after {
    width: 100%; 
    height: 21px; 
    margin-top: -10px;
    content: ""; 
    background: url(/skins/Vector/images/arrow_selected.png) no-repeat center center;
    display: block;
}

@font-face
{
    font-family: wtfModern;
    src: url(/resources/wt_font.ttf);
}

@font-face
{
    font-family: wtfSymbols;
    src: url(/resources/symbols_skyquake.ttf);
}

/*
См. [[Wikipedia:NavFrame]]
*/

div.NavFrame {
    margin: 0;
    padding: 4px;
    border: 1px solid #aaa;
    text-align: center;
    border-collapse: collapse;
    font-size: 95%;
    background-color: #f9f9f9;
}
div.NavFrame + div.NavFrame {
    border-top-style: none;
    border-top-style: hidden;
}
div.NavPic {
    background-color: #fff;
    margin: 0;
    padding: 2px;
    /* @noflip */
    float: left;
}
div.NavFrame div.NavHead {
    height: 1.6em;
    font-weight: bold;
    background-color: #ccf;
}
div.NavFrame p,
div.NavFrame div.NavContent,
div.NavFrame div.NavContent p {
    font-size: 100%;
}
div.NavEnd {
    margin: 0;
    padding: 0;
    line-height: 1px;
    clear: both;
}
a.NavToggle {
    position: absolute;
    top: 0;
    /* @noflip */
    right: 3px;
    font-weight: normal;
    font-size: 90%;
}

/* Стили для карточек ТТХ */
.ttx {
    width: 300px;
    float: right;
    margin-left: 10px;
    margin-bottom: 15px;
    border: solid 1px #B0BEC5;
    background: #EEEEEE;
    color: #323246;
    font-weight: bold;
    line-height: 1.4em;
}

.ttx a {
    color: #01579B;
}

.ttx-title {
    text-align:center;
    background-color:#263238;
    color:#EEEEEE;
    padding:2px 0;
}

.ttx-image img {
    width: 100%;
    height: auto;
}

.ttx-buy {
    text-align: center;
    margin: 5px 0;
}

.ttx-buy-button {
    background-color: #C84632;
    color: #EEEEEE;
    padding: 5px;
    cursor: pointer;
}

.ttx-buy-button:hover {
    background-color: #e43c22;
}

.ttx-info {
    text-align: center;
    background-color: #D2DADE;
    color: #0D5E9E;
    height: 22px;
}

.ttx-flag {
    display: block;
    float: left;
    height: 22px;
}

.ttx-flag img {
    height: 22px;
}

.ttx-country {
    float: left;
    margin: 0 5px;
    padding: 1px;
}

.ttx-rank {
    float: right;
    margin: 0 5px;
    padding: 1px;
}

.ttx-switch-mode {
    text-align:center;
    color:#01579B;
    font-family:wtfModern,sans-serif;
    font-size: 170%;
    height: 30px;
}

.ttx-switch-mode-button {
    width: 100px;
    float: left;
    padding: 6px 0;
    cursor: pointer;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
    font-weight: normal;
}

.ttx-switch-mode-button:hover {
    background-color: #263238;
    color: #EEEEEE;
}

.ttx-table {
    width: 100%;
}

.ttx-switch-size {
    text-align: center;
    color: #01579B;
    font-weight: normal;
    width: 100% !important;
    padding: 0 !important;
}

.ttx-switch-size-button {
    width: 50%;
    float: left;
    cursor: pointer;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
    padding: 2px 0;
}

.ttx-switch-size-button:hover {
    background-color: rgb(38, 50, 56);
    color: rgb(238, 238, 238);
}

.ttx-table-head {
    text-align: center;
    color: #323246;
    padding: 4px 0;
}

.ttx-table-line {
    padding: 3px 10px;
    display: table;
    width: 280px;
}

.ttx-table-line:nth-child(odd) {
    background-color: #DBE0E2;
}

.ttx-collapsed {
    display: none;
}

.ttx-name {
    display: block;
    text-align: left;
    font-weight: bold;
}

.ttx-name-indent {
    display: block;
    text-align: left;
    font-weight: bold;
    margin-left: 6px;
    font-size: 97%;
}

.ttx-value {
    float: right;
    margin: 0 0 0 5px;
    text-align: right;
    font-weight: normal;
    max-width: 200px;
}

.ttx-value img {
    height: 18px;
    width: auto;
}

/* Код главной страницы */
.wt-index-main {
    position: relative;
    line-height: 1.6;
}

.wt-index-main:hover span a {
    color: #ECBC4A;
    text-decoration: underline;
}

.wt-index-img-main img {
    width: 100%;
    min-width: 220px;
    height: auto;
}

.wt-index-img-main-text a:link {
    position: absolute;
    bottom: 0px;
    left: 0px;
    display: block;
    padding: 9px 0;
    font-size: 27px;
    background-color: rgba(0,0,0,0.25);
    width: 100%;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
    min-width: 220px;
    color: #f7f7f7;
    font-family: wtfModern,sans-serif;
}

.wt-index-img-main-text a:visited {
    color: #f7f7f7;
}

.wt-index-img-main-text a:hover {
    color: #ECBC4A;
}

.wt-ul-container {
   width: 100%;
   margin-top: 10px;
}

.wt-ul-navigation div{
    display:table;
}

.wt-ul-navigation div a {
    display: table-cell;
    vertical-align: middle;
}

.wt-ul-container th {
    color: #546e7a;
    font-size: 18px;
    margin: 5px;
    font-weight: normal;
}

.wt-ul-navigation img {
   width: 30px;
   height: 30px;
   margin: 9px;
   margin-left: 0;
}

/* Код страниц Авиация и Наземная техника */
.wt-class-table div {
   border:1px solid #B0BEC5;
   float: left;
   width: 130px;
   height: 104px;
   margin-right: 15px;
   margin-bottom: 10px;
   line-height: 1.3;
}

.wt-class-table div a:nth-child(even) {
    display: table-cell;
    vertical-align: middle;
    height: 36px;
    width: 128px;
}

/* Код сайдбара */
[id="p-Vehicles"] a, [id="p-Resources"] a {
    display: inline-block;
    margin-top: 4px;
    position: absolute;
}

div#p-navigation li, div#p-lang li {
    border-bottom: none !important;
}

div#p-navigation span, div#p-lang span {
    display: none !important;
}

[id="n-Aviation"]::before {content:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAUCAYAAABmvqYOAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xOdTWsmQAAAHnSURBVEhL3VTPaxNBGF0DWqEi9lAQ/4BW9CYIRQ+F6qnUg4fSQ0prQA+5FPIX5FS8CV5aG09aYknc2Q2lLAR3ZjQzs1KSk1DopRYP6kGQ2B/2UGN8s36F5GaTPfngMcybb9588+036/z/KCo1xLiaK0t5gaTk4Ir3Mx43X10R3SYpOXjCPAEPGDcZkpIDE9ErZH7EZJQj6d9QCWvXWKgfM2GWiMueNM8sWagKMH2OjD8xrlsY61gvxPpJDFfLHXsXfCkvkTWuzPUjbPqO8ZcnTmi6COPfGNtgq1P/S9oT7zdbXm1zhKwdZzUILjJpMlh44QsT4PQPMNtF8BewacuBNWsK89jkp00G/Axtx94G2rq9kftG3V1pNM6SdTeklOcrWl95zdV1n5tbuP59JvVDmNRhcgy6vtQPUI4pJtVYievRUlAbLpfL58jidGi322fi2gpz6HKdtXNaSgYuN4sozz4TOk1ScmA8yqE0TT+M7pGUHFzUmT7iBEnJAbWehPE39i66QVJ/wIdLsbfmJtosC67FLRiaJU9E8640VymsN1TQZuiQj6j1D4x7thVxwD56vYn5Nv6Qlyn09HhZrQ7iUd3xeDTthXqWCfvMddr2PrIffxoEAxTaH/L5fKq4oYYS7/He4Dh/AAsseX61iDXDAAAAAElFTkSuQmCC');}
[id="n-Ground-vehicles"]::before {content:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAUCAYAAABmvqYOAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xOdTWsmQAAAIVSURBVEhL7VPPaxNBGJ22KE3BHyAiehBBQS+CqNRDewlI/DM8ePLkIR6V0Gu1oCdRqBepkM3M7ppDDu7uTMzOTCyJPUguYo8eRPCgmBgwdftmM6VJWzX11EMfPLKZ7/vefL+G7GNvIUmSMZ/Xr7lcvQeTrSwLdaFQKIxb992B8toMiySE5VcWxXOUqzyL1F2cxRDvMS6b+H7kCvnQjfqkQl+34X8G5XqGcbWKgG8e17eeNpsHrIl4on4Goh+3VpIyUves2854JfQ5ZPUBjr+8SC04STJhTSm8qr6Iar6An/xInvelPLRBp9U6aN0IMRkhu7Mej69sEP9zCFzBbwe87TjOZgAghJiEfQnZt91QPhiMLQfxacyqPweXxzfT8ncqsd/XRScIjqTOAzAXskDN4YLucIx8R0OZLZgLMKj7OFxjPH7ihnp6MAsW6svsTeOk2RqrOYRiUWc8IS8ZX1/Iq0hyHpf9NvPwuLqBzGUJhz+Mk435b5jVhN5nUwEN4zyB8DOwi+E1KIzWb9cwvUbGVYi3sZqP08G+DMMT6NFziP+EERsic9Z/ZNCqzGI2yxDu4B0sFCu149ZEiP9anoJoCeX0wJbpvTX9A8mYK+qzEF0B1xC75AbLx6xxE54QR9EeZgZiVhDf30dh6pvGKPqi8vawlduOotYZbA+et2oM0TxzrizNkx+2Y53vlMvNKSuzj7+BkHWMWugQekdGHgAAAABJRU5ErkJggg==');}
[id="n-Fleet"]::before {content:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAUCAYAAABmvqYOAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xOdTWsmQAAAIdSURBVEhL3VQ7aFRBFN2gBgUVEvCDkDRJERREtBBUAoH0YixSpFMIJIWFjZWNtViJkHSiKXb2zby3ISwr782M2fms5IfIqohFtBBRNCKSD5j4ckZmQyBkSXYDggcud+beO+feufPJ/N/IFm1rKMwdxs00EzoMublECNnn3fWDkEoz4/Y+5XqRcT3HEv2BCvMO4w4fUj+CouxiwrwE4bCUcn9e2k5UPwu5l0nTJh9WH/Kl8llU+ZZx1ZeCLJ+UT1ChDXbz0M19WH2YUKoFlTMkeA/9ADqH3n+OpO31IQ2hKRLli+j5K8rNbyT4CX03a+0h7989UN0N9PmbO0iII003hOs1+FZg/wVdCCen2vyynWFcqXYc2lUq7ADIhjC+DeI1JC2D8FYo1M0g1v2BsJcb2kUVSLKKakf8dG/RMPmTwouj2PKFvyL1uWyhdKz6GjeTSzl/0PWaJvZ8Nd7ZayKIVS/6u+oODkRvclydISTdQu767O4+4hZ87LKz10SQ6B48khW/4DV9Zo5715a2sFhdwbX84WIh3715ewTcdGNBKeDqqbtu+LAeRVofcb7N5Hkp8Q2YCgqpMGEJTfS8s9cEkfLkeNF0uX8E5KMgWABhDGIN+YPxV7QtB/kC38dQ6OsWLaKJuuYpdgYkOozKB0ESQz5B3ANagq4EQj+OnuseV4QP3z1GZmYOoC2noqR0unqDkKBjbEK1+JB/gUxmHVZ4nYBrq7zZAAAAAElFTkSuQmCC');}

[id="n-WT:Wiki-on-YouTube"]::before {content:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAUCAYAAABmvqYOAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xOdTWsmQAAAGBSURBVEhL7ZO/SwMxFMeL4CD4Hzg46Sa4uzq7ODqoIAji7ubi5uboKIhCm+Sqbr1LrnhJOlgHXaw/EEGrboqK0sXze0cGo69Qu7j0Cx/uyHvf74WXXKGn/5W1doDFeo5JXRHSnAilL8CNkPqWK9PkUj9moHaP9TuhzDVqZ3g/FsqWWJxMbtbr/S7OVxDqaTQ+w5R2AzbQKMZ63MX54sruUKaOkeYVGTMuzheKNdIEuDQP1LqHNB9cJYsuzhfmeUqaAJNmmEdmhSt9jjm3qB7QYlGy7OJ84asNwpCThWeHFVSqY2VlVwNlroi+lohtd+FZTzGOBzGieXBJ9HUfLsLDUcx1G8EvGOEn0dc+HNcQd/uXIacUJrOYNe43Xc/BWWBcSy7OF3ZTJU0AtTdq3Ue/80gvuDhfGMs6beoMbOAJTLk4XwH+LjQ1f5r+wNFBZIdcnK80TfuYshOY3UZ2cHgWca85DrAM4/439rDDAOssUHpXRHoLzzVWrY24qJ7aqVD4Aq10wT28kJ10AAAAAElFTkSuQmCC');}
[id="n-War-Thunder"]::before {content:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAUCAYAAABmvqYOAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xOdTWsmQAAAJgSURBVEhLrVRLa1NBGI2ixZaiogiiSF1aRBTcuBBEN4UuRJAsdONC8PEDXKjQdOcjFTcVQRQXFuRO78xIhBCSzEzMnZm0csVXXejGiu4UKgjSqiSeSaZEBO1NmwMf87h3znfu+b47qU5ASqUNgbW9ftk9xHG8lkp9j0l7ym91D0yYEyCfZ0KzoGA3+e2V45HW25g0M4gGEnwJi2ao0Wis8o87g7OAlaY3E0J67iu1LhT6JhQvOPJmAmHUw8KTHf71zsBUdJBKQ5nUWS6j/VToCkjri+TYr8OmCaJUvz+SHFzVdoJgFqQ/MDIu9DDU2r8SLGBv1B9JDufnpIh2g2AeRL+cygkhBrg0d9rkzh79OZRmyB9Lhgf5qfWhMrtcAtjzFiR1Ku1jWoj2IuEIivoG8QoJqlRGZxP3PldqI3o5C5JPUHwtLOvDGKdcAowfUNhboYgucmVGmdJjXOrjrGLTrFIb9BT/RlC220FcRMxCdZ6q6ABXeh9IPzbtaNXhK8bvTjnGq4h3iexxfofCDDBh01B3DEU7woU96fp70et2OIui62jV865lPcX/EQS2F9aMQNFr5y0SPMd8EvNLtKyvYJ2DTS8Rc7DqLivWBjOZzGp/PBny1eoWEByFtxegMut/pjGnmMnqIXTPGddJTNlzhMz0+GPJoJRaA6LLsOBbs6DeDsyd708JUf3unnG35bKuA/fJIHrR9hkhNHrfppd9v/wJLu1p+DzXUm1+gnw8F8d9/vHKkMvFfVREt1vW6GesWFm6pzsBUdNbQf4eSW64Wvjt7gHdMsyLdo9fLoFU6jdf2O8hZ9AMiAAAAABJRU5ErkJggg==');}
[id="n-WT-Live"]::before {content:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAUCAYAAABmvqYOAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xOdTWsmQAAALISURBVEhL7VRLaFNBFK2tWqr1V6TSLvwsFO1CED9FXbkTxZW489+FCm5cKQhWQd0J4sr6KX4okpf35r0GSROTN5PkzUxSCVQwG+vCUlwpSq3YVqrGc9OJpSZqceXCAwPv3nvuZ84dXs1/zAqeJxeFYrEmY84aXibXZj6roysSWcC4us24fPQ4CJYZ9x/B/OAAcj7aPOiwLKvOuGeC+fKU46v3ji/PPIjHF7JUdoMJVYVVKMz3nshWW6j1yNNoMOTyYLMJT6MnIpYj+JpIjlLNDtcnYD/zhNxiKBXAxMcxiGv7alUkpbaCP2EnZWdXPj/PUKbAEsERFB4H4byTTrc4XL5gvnrTm86tMZQKuCm9D7wJ188cEkLMxc1jyOlz+tIthjIFFO3GGWNJvc0V2aPQfsTh6izFnLhqZkLdRHwE/oIj9G7SlvYCThzTRy0hGkuycvUqlMzMXK7rqwDBMUsUGl1fXkeRL2iymmKOH1yiCeErlo4vn8e0bqJpHaEuwx6hRmFf7aABXZ6bqTucTykQCukGdL+FhG+WJRophsJ3YX/9UZyr0d5kdkWxWJwDGc7hTFIzujWknXSgf6loGUhIUHFPylYnKa/C/hzmmXaKYbpjSBotF0cz92E0tzg6OFhvc3UDvmFXiKW2L/cQz0upTaWiZcB5DdqNk54eV3vx/ZZx3U3PzbKKdUzok2juo9B9luhfRzn0SnDLAeTeCWndgPgFxAt2Kru2VLQMm+udpDkI3aUrcmnBfhdOZjYaSgWwi8MYYhjPbxdNDv5LNLqXSOSXGMoU8nibKBjBGQrzbLuVCFa6XHfQKzCUChCHpKA94RZX0GyUCXmQdmEo0/CSuTZM8gkNemj7JIcJ/RKdxWKty+V+5H3A1AOhmK7+X0LHWiaC065QF3838c9gKbkdS+6np2hc1UHyRKOD9cacNf7mT/qvoqbmO4O5AbI2NZwXAAAAAElFTkSuQmCC');}
[id="n-Official-Forum"]::before {content:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAUCAYAAABmvqYOAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwAAADsABataJCQAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xOdTWsmQAAAHySURBVEhLvVS/axRBFL6YVBFJI1hI0IBIUFsRk9ZCG0vBKnZBsEtQIsoVwSoBsU8VlHDLzmxuqyy7M5O7nZkLQUjAP8Fe0JhwSGD9Zu8d3CYh2SXRDx673/vxzdvZeVPLsuyf2YnOi7L/B6w2tN7eusOFXeBKL+cmTrF+HE8m7awvzA2SOg4et29zaXaZNF08s4r2k0stgtb2OMkVgS5WesL6i0ta1/pKGePCPGfC7DCh97m0MyRXBIT3scC3prK3yFUavmxP518gzDtyFeHEYRHRyqgkjvc3+JJPjcRe73H7lid6qZl0ruVcmfdcpB9Cpa46Xlrc8+IxJO5B/AB7+dSLv4LrAwj89uP0keNM6i58e0HLTLmaCuLeME/SzygOmyK9m3Oh1xBn7lQ5HkjTwAKNRtSacDWV91wpNUKvQDY0yN1ceF42TPRscSTsrqnOTXKVBovN/dPFhd7Aef0VSPs6DMNRcp8JX6lJbA+DuPsHL8ldBN/UDzFA35F0mHcxYCzRi74ykyjeOBrL40L/Qe22yyG5IvK7RXYecGVf+dLMOUPBKhVv9qbQ/AD/2I/3jSXpLIvMPZIqB1xiz6i7Q3SNY2nmV6PoMoXPhwHxbqD0i+LpOSeYso/RreVJ54nbNnJfDNyouyGp1+uXyFUStdpfu2uCup6r3bsAAAAASUVORK5CYII=');}

/* Код деревьев техники */
@media screen and (max-width:1200px){
    .tree {
        zoom: 85%;
    }
}

@keyframes scroll {
  from { margin-left: 0; }
  to { margin-left: -35px; }
}

.tree {
    width: 100%;
    background-color: #242e33;
}

.tree table {
    background-color: #242e33;
    border-color: #cccccc;
}

.tree tr {
    vertical-align: top;
}

.tree th {
    text-align: center;
    color: #cccccc;
    font-weight: normal;
    padding: 3px;
}

.tree td {
    padding: 7px 4px 0;
    width: 165px;
}

.tree-item {
    cursor: pointer;
    position: relative;
    width: 120px;
    height: 48px;
    margin: auto;
}

.tree-item:hover span.tree-item-text-scroll {
  animation: scroll 2s infinite alternate linear;
}

.tree-item-background {
    position: absolute;
}

.tree-item-text {
    color: white;
    float: right;
    margin: 3px 5px 0;
    width: 110px;
    position: relative;
    z-index: 10;
    text-align: right;
    font-size: 85%;
    font-family: Verdana;
    pointer-events: none;
    white-space: nowrap;
    overflow: hidden;
}

.tree-item-img {
    position: absolute;
    margin: 5px;
    pointer-events: none;
}

.tree-item-img img {
    height: 42px;
}

.tree-group {
    cursor: pointer;
    position: relative;
    width: 120px;
    height: 52px;
    margin: auto;
    margin-top: -4px;
    background: url(/images/d/db/Item_group.png) no-repeat;
}

.tree-group:hover span.tree-item-text-scroll {
  animation: scroll 2s infinite alternate linear;
}

.tree-group-collapse {
    width: 120px;
    background: #405561;
    margin: auto;
    z-index: 100;
    padding: 4%;
    border: solid 1px;
    left: 0;
    right: 0;
}

.tree-group-text {
    color: white;
    float: right;
    margin: 7px 5px 0;
    width: 110px;
    position: relative;
    z-index: 10;
    text-align: right;
    font-size: 85%;
    font-family: Verdana;
    pointer-events: none;
    white-space: nowrap;
    overflow: hidden;
}

.tree-group-img {
    position: absolute;
    margin: 3px;
    margin-top: 9px;
    pointer-events: none;
}

.tree-group-img img {
    height: 42px;
}

.tree-arrow {
    position: relative;
    width: 120px;
    height: auto;
    margin: auto;
}



.userbox-img-scale img {
    width: 46px;
    height: auto;
}