MediaWiki:Common.css: различия между версиями
Нет описания правки |
Нет описания правки |
||
| (не показаны 104 промежуточные версии этого же участника) | |||
| Строка 1: | Строка 1: | ||
.custom-h2 { | .custom-h2 { | ||
margin-bottom: 0.8rem !important; | margin-bottom: 0.8rem !important; | ||
| Строка 47: | Строка 15: | ||
display: block !important; | display: block !important; | ||
left: 65px !important; | left: 65px !important; | ||
} | } | ||
| Строка 96: | Строка 25: | ||
} | } | ||
. | span.va-icon2 { | ||
position: relative; | |||
vertical-align: text-bottom !important; | |||
} | } | ||
span.va-icon { | span.va-icon { | ||
position: relative; | |||
top: 2px; | |||
vertical-align: text-bottom !important; | vertical-align: text-bottom !important; | ||
} | } | ||
ul.gallery { | ul.gallery { | ||
margin:.8rem 0 1.6rem!important; | margin:.8rem 0 1.6rem!important; | ||
padding:2px; | padding:2px; | ||
} | } | ||
@media only screen and (max-width: 1290px) { | @media only screen and (max-width: 1290px) { | ||
li.gallerybox,li.gallerybox div,li.gallerybox a.image,li.gallerybox a.image img { | li.gallerybox,li.gallerybox div,li.gallerybox a.image,li.gallerybox a.image img { | ||
width:13vw!important; | width:13vw!important; | ||
} | } | ||
} | } | ||
li.gallerybox div.thumb { | li.gallerybox div.thumb { | ||
border-color:#2b2f36; | border-color:#2b2f36; | ||
background-color:#24272f; | background-color:#24272f; | ||
} | } | ||
.mw-body-content a.image { | .mw-body-content a.image { | ||
display:initial | display:initial; | ||
} | } | ||
.icon-caption { | .icon-caption { | ||
text-align: center; | text-align: center; | ||
} | } | ||
.rarity-common,.rarity-common a { | .rarity-common,.rarity-common a { | ||
color:#969696!important; | color:#969696!important; | ||
text-shadow:0 0 3px #000!important; | text-shadow:0 0 3px #000!important; | ||
} | } | ||
.rarity-white,.rarity-white a { | .rarity-white,.rarity-white a { | ||
color:#fff!important; | color:#fff!important; | ||
text-shadow:0 0 3px grey!important; | text-shadow:0 0 3px grey!important; | ||
} | } | ||
.rarity-glpar,.rarity-glpar a { | .rarity-glpar,.rarity-glpar a { | ||
color:#f3bb32!important; | color:#f3bb32!important; | ||
text-shadow:0 0 10px #f3bb32!important; | text-shadow:0 0 10px #f3bb32!important; | ||
} | } | ||
.rarity-green,.rarity-green a { | .rarity-green,.rarity-green a { | ||
color:#3dd20b!important; | color:#3dd20b!important; | ||
} | } | ||
.rarity-unique,.rarity-unique a { | .rarity-unique,.rarity-unique a { | ||
color:#2f78ff!important; | color:#2f78ff!important; | ||
} | } | ||
.rarity-blue,.rarity-blue a { | .rarity-blue,.rarity-blue a { | ||
color:#2f78ff!important; | color:#2f78ff!important; | ||
} | } | ||
.rarity-legendary,.rarity-legendary a { | .rarity-legendary,.rarity-legendary a { | ||
color:#ff9600!important; | color:#ff9600!important; | ||
} | } | ||
.rarity-orange,.rarity-orange a { | .rarity-orange,.rarity-orange a { | ||
color:#ff9600!important; | color:#ff9600!important; | ||
} | } | ||
.rarity-purple,.rarity-purple a { | .rarity-purple,.rarity-purple a { | ||
color:#9132c8!important; | color:#9132c8!important; | ||
} | } | ||
.rarity-yellow,.rarity-yellow a { | .rarity-yellow,.rarity-yellow a { | ||
color:#ffb400!important; | color:#ffb400!important; | ||
} | } | ||
.rarity-dark-orange,.rarity-dark-orange a { | .rarity-dark-orange,.rarity-dark-orange a { | ||
color:#dc7800!important; | color:#dc7800!important; | ||
} | } | ||
.rarity-pearlescent,.rarity-pearlescent a { | .rarity-pearlescent,.rarity-pearlescent a { | ||
color:#0ff!important; | color:#0ff!important; | ||
} | } | ||
.rarity-e-tech,.rarity-e-tech a { | .rarity-e-tech,.rarity-e-tech a { | ||
color:#f0f!important; | color:#f0f!important; | ||
} | } | ||
.rarity-cursed,.rarity-cursed a { | .rarity-cursed,.rarity-cursed a { | ||
color:#0cc!important; | color:#0cc!important; | ||
} | } | ||
.rarity-red,.rarity-red a { | .rarity-red,.rarity-red a { | ||
color:#cf4747!important; | color:#cf4747!important; | ||
} | } | ||
.rarity-seraph,.rarity-seraph a { | .rarity-seraph,.rarity-seraph a { | ||
color:#ff69b4!important; | color:#ff69b4!important; | ||
} | } | ||
.rarity-aftermarket,.rarity-aftermarket a { | .rarity-aftermarket,.rarity-aftermarket a { | ||
color:lime!important; | color:lime!important; | ||
} | } | ||
.rarity-rainbow,.rarity-rainbow a { | .rarity-rainbow,.rarity-rainbow a { | ||
background:rgba(255,32,32,1); | background:rgba(255,32,32,1); | ||
background:-moz-linear-gradient(left,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%); | background:-moz-linear-gradient(left,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%); | ||
background:-webkit-gradient(left top,right top,color-stop(0%,rgba(255,32,32,1)),color-stop(14%,rgba(250,152,77,1)),color-stop(25%,rgba(250,250,77,1)),color-stop(42%,rgba(100,250,77,1)),color-stop(57%,rgba(0,247,226,1)),color-stop(71%,rgba(77,121,250,1)),color-stop(86%,rgba(221,77,250,1)),color-stop(100%,rgba(250,147,147,1))); | background:-webkit-gradient(left top,right top,color-stop(0%,rgba(255,32,32,1)),color-stop(14%,rgba(250,152,77,1)),color-stop(25%,rgba(250,250,77,1)),color-stop(42%,rgba(100,250,77,1)),color-stop(57%,rgba(0,247,226,1)),color-stop(71%,rgba(77,121,250,1)),color-stop(86%,rgba(221,77,250,1)),color-stop(100%,rgba(250,147,147,1))); | ||
background:-webkit-linear-gradient(left,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%); | background:-webkit-linear-gradient(left,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%); | ||
background:-o-linear-gradient(left,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%); | background:-o-linear-gradient(left,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%); | ||
background:-ms-linear-gradient(left,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%); | background:-ms-linear-gradient(left,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%); | ||
background:linear-gradient(to right,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%); | background:linear-gradient(to right,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%); | ||
-webkit-background-clip:text; | -webkit-background-clip:text; | ||
background-clip:text; | background-clip:text; | ||
-webkit-text-fill-color:transparent!important; | -webkit-text-fill-color:transparent!important; | ||
text-shadow:none!important; | text-shadow:none!important; | ||
} | } | ||
.rarity-common>.new,.rarity-white>.new,.rarity-green>.new,.rarity-unique>.new,.rarity-blue>.new,.rarity-legendary>.new,.rarity-orange>.new,.rarity-purple>.new,.rarity-yellow>.new,.rarity-dark-orange>.new,.rarity-pearlescent>.new,.rarity-e-tech>.new,.rarity-seraph>.new,.rarity-rainbow>.new { | .rarity-common>.new,.rarity-white>.new,.rarity-green>.new,.rarity-unique>.new,.rarity-blue>.new,.rarity-legendary>.new,.rarity-orange>.new,.rarity-purple>.new,.rarity-yellow>.new,.rarity-dark-orange>.new,.rarity-pearlescent>.new,.rarity-e-tech>.new,.rarity-seraph>.new,.rarity-rainbow>.new { | ||
background-color:#FF454574!important; | background-color:#FF454574!important; | ||
} | } | ||
| Строка 353: | Строка 237: | ||
.border-gray img, .border-white img, .border-green img, .border-blue img, .border-epic img, .border-lega img { | .border-gray img, .border-white img, .border-green img, .border-blue img, .border-epic img, .border-lega img { | ||
border-radius: 2px; | border-radius: 2px; | ||
} | } | ||
| Строка 380: | Строка 242: | ||
display: table; | display: table; | ||
border-collapse: collapse; | border-collapse: collapse; | ||
background-color: # | background-color: #12303c; | ||
border: 1px solid # | border: 1px solid #2b4454; | ||
} | } | ||
.custom-table tr { | .custom-table tr { | ||
color: white; | color: white; | ||
border-bottom: 1px solid # | border-bottom: 1px solid #2b4454; | ||
} | } | ||
| Строка 394: | Строка 256: | ||
.custom-table th { | .custom-table th { | ||
color: # | color: #337c97; | ||
background-color: # | background-color: #0f2833; | ||
} | } | ||
.active-hover tr:hover { | .active-hover tr:hover { | ||
background-color: # | background-color: #193948; | ||
} | } | ||
| Строка 406: | Строка 268: | ||
flex-flow: row wrap; | flex-flow: row wrap; | ||
justify-content: center; | justify-content: center; | ||
margin: 0 auto 15px auto; | margin: 0 auto 15px auto; | ||
width: 244px; | width: 244px; | ||
} | } | ||
| Строка 418: | Строка 276: | ||
flex-flow: row wrap; | flex-flow: row wrap; | ||
justify-content: center; | justify-content: center; | ||
margin: 0 auto 15px auto; | margin: 0 auto 15px auto; | ||
} | } | ||
.bosses | .bosses a { | ||
display: inline-block; | |||
margin: 5px; | margin: 5px; | ||
border: 3px ridge #3d8ac2; | border: 3px ridge #3d8ac2; | ||
| Строка 434: | Строка 289: | ||
flex-flow: row wrap; | flex-flow: row wrap; | ||
justify-content: center; | justify-content: center; | ||
margin: 0 auto 15px auto; | margin: 0 auto 15px auto; | ||
} | } | ||
| Строка 450: | Строка 301: | ||
flex-flow: row wrap; | flex-flow: row wrap; | ||
justify-content: center; | justify-content: center; | ||
margin: 0 auto 15px auto; | margin: 0 auto 15px auto; | ||
} | } | ||
.shop | .shop { | ||
margin: | display: flex; | ||
flex-flow: row wrap; | |||
justify-content: center; | |||
margin: 0 auto 15px auto; | |||
} | } | ||
. | .gift { | ||
display: flex; | display: flex; | ||
flex-flow: row wrap; | flex-flow: row wrap; | ||
justify-content: center; | justify-content: center; | ||
margin: 0 auto 15px auto; | margin: 0 auto 15px auto; | ||
} | } | ||
. | .gift > div { | ||
margin: 5px; | width: inherit !important; | ||
margin: 5px !important; | |||
} | } | ||
. | .loot { | ||
display: flex; | display: flex; | ||
flex-flow: row wrap; | flex-flow: row wrap; | ||
justify-content: center; | justify-content: center; | ||
margin: 0 auto 15px auto; | margin: 0 auto 15px auto; | ||
} | } | ||
.used-in-craft | .used-in-craft { | ||
margin: | display: flex; | ||
flex-flow: row wrap; | |||
justify-content: center; | |||
margin: 0 auto 15px auto; | |||
} | } | ||
| Строка 502: | Строка 348: | ||
flex-flow: row wrap; | flex-flow: row wrap; | ||
justify-content: center; | justify-content: center; | ||
margin: 0 auto 15px auto; | margin: 0 auto 15px auto; | ||
} | } | ||
| Строка 521: | Строка 359: | ||
@media only screen and (max-width:1023px) { | @media only screen and (max-width:1023px) { | ||
.pc-block { | .custom-table th, td { | ||
display:none; | padding: 5px; | ||
} | } | ||
.pc-block { | |||
display:none !important; | |||
} | |||
} | } | ||
@media only screen and (min-width: 1024px) { | @media only screen and (min-width: 1024px) { | ||
.mobile-block { | .mobile-block { | ||
display:none !important; | |||
} | } | ||
.custom-table { | .custom-table { | ||
overflow-x: scroll; | |||
} | } | ||
} | } | ||
| Строка 596: | Строка 437: | ||
/*}*/ | /*}*/ | ||
. | .item-count { | ||
background-color: # | position: absolute; | ||
border: 1px solid # | bottom: -2px; | ||
right: 4px; | |||
font-size: 13px; | |||
font-weight: bold; | |||
color: white; | |||
text-shadow: #000 2px 0px 2px, #000 0px 2px 2px, #000 0px -2px 2px, #000 -2px 0px 2px; | |||
} | |||
.recipe__card { | |||
background-color: #1c323e; | |||
border: 1px solid #314755; | |||
margin: 10px; | margin: 10px; | ||
} | } | ||
. | .recipe__card .recipe-name { | ||
margin-top: 8px; | margin-top: 8px; | ||
text-align: center; | text-align: center; | ||
| Строка 611: | Строка 462: | ||
} | } | ||
. | .recipe__card .item-main { | ||
margin: 8px 0 8px | margin: 8px 0 8px 10px; | ||
float: left; | float: left; | ||
} | } | ||
. | .recipe__card .item-main span { | ||
border-width: 4px; | border-width: 4px; | ||
border-radius: 10px; | border-radius: 10px; | ||
} | } | ||
. | .recipe__card .item-main span img { | ||
border-radius: 7px; | border-radius: 7px; | ||
margin: 0 !important; | margin: 0 !important; | ||
} | } | ||
. | .recipe__card .item-small-block { | ||
display: flex; | display: flex; | ||
flex-flow: row wrap; | flex-flow: row wrap; | ||
| Строка 632: | Строка 483: | ||
} | } | ||
. | .recipe__card .item-small { | ||
margin-left: 6px; | margin-left: 6px; | ||
} | } | ||
. | .recipe__card .item-small span { | ||
border-width: 3px; | border-width: 3px; | ||
border-radius: 7px; | border-radius: 7px; | ||
} | } | ||
. | .recipe__card .item-small span img { | ||
border-radius: 5px; | border-radius: 5px; | ||
margin: 0 !important; | margin: 0 !important; | ||
} | } | ||
. | .recipe__card .item-main .item-count { | ||
font-size: 14px !important; | font-size: 14px !important; | ||
bottom: 3px !important; | bottom: 3px !important; | ||
| Строка 654: | Строка 504: | ||
} | } | ||
. | .recipe__card .item-small .item-count { | ||
font-size: 11px !important; | font-size: 11px !important; | ||
bottom: | bottom: 5px !important; | ||
right: | right: 5px !important; | ||
text-shadow: -1px 1px 2px #000000; | text-shadow: -1px 1px 2px #000000; | ||
} | } | ||
| Строка 665: | Строка 515: | ||
position: relative; | position: relative; | ||
} | } | ||
.big-table table { | .big-table table { | ||
margin: 0 auto; | margin: 0 auto; | ||
| Строка 672: | Строка 523: | ||
-webkit-overflow-scrolling: touch; | -webkit-overflow-scrolling: touch; | ||
} | } | ||
.scroll-right:after { | .scroll-right:after { | ||
content: ''; | content: ''; | ||
| Строка 687: | Строка 539: | ||
background-position: 100% 0%; | background-position: 100% 0%; | ||
} | } | ||
.scroll-left:before { | .scroll-left:before { | ||
content: ''; | content: ''; | ||
| Строка 726: | Строка 579: | ||
} | } | ||
.custom- | .custom-grid__card { | ||
display: flex; | |||
flex-flow: column wrap; | |||
text-align: center; | |||
width: 200px; | width: 200px; | ||
background: #031e2f; | background: #031e2f; | ||
margin: 10px; | margin: 0.5rem; | ||
padding: 15px; | padding: 1rem; | ||
border-radius: 15px; | border-radius: 8px; | ||
border: 1px solid # | border: 1px solid #314755; | ||
} | |||
.custom-grid__card:hover { | |||
background: #0c2738; | |||
cursor: pointer; | |||
} | |||
.custom-grid__header { | |||
font-weight: bold; | |||
font-size: 14px; | |||
text-transform: uppercase; | |||
text-align: center; | |||
color: #eae5b1; | |||
margin-bottom: 5px; | |||
} | |||
.custom-grid__footer { | |||
font-family: BeaufortforLoL; | |||
color: #649ec0; | |||
font-style: italic; | |||
margin-top: 5px; | |||
} | |||
.custom-grid--category img { | |||
border: 1px solid #547481; | |||
} | |||
.blue-tooltip { | |||
width: 325px; | |||
background-color: #0d2232; | |||
border: 1px solid #39576a; | |||
box-shadow: 0px 0px 5px 0px rgba(54, 81, 122, 0.5); | |||
} | |||
.tooltip-hero-main { | |||
margin: 7px; | |||
display: flex; | |||
} | |||
.tooltip-hero-name { | |||
font-family: BeaufortforLoL; | |||
text-align: center; | |||
font-size: 26px; | |||
line-height: 26px; | |||
color: #7daed7; | |||
text-transform: uppercase; | |||
font-weight: bold; | |||
text-shadow: 2px 2px 2px #142730; | |||
margin: 10px; | |||
} | |||
.tooltip-hero-icon { | |||
width: 125px; | |||
height: 125px; | |||
} | |||
.tooltip-hero-icon img { | |||
border-style: solid; | |||
border-width: 4px; | |||
border-radius: 8px; | |||
cursor: pointer; | |||
box-sizing: border-box; | |||
} | |||
.tooltip-hero-property { | |||
font-family: BeaufortforLoL; | |||
text-transform: uppercase; | |||
width: 110px; | |||
text-align: center; | |||
display: flex; | |||
flex-flow: column wrap; | |||
} | |||
.tooltip-hero-property span { | |||
color: #ffb257; | |||
font-weight: bold; | |||
font-size: 10px; | |||
} | |||
.tooltip-hero-property div { | |||
color: #7daed7; | |||
font-weight: bold; | |||
font-size: 12px; | |||
line-height: 25px; | |||
} | |||
.tooltip-hero-stats { | |||
color: #b5cbcf; | |||
font-weight: bold; | |||
font-size: 12px; | |||
display: flex; | |||
flex-flow: column wrap; | |||
} | |||
.tooltip-hero-stats div { | |||
line-height: 22px; | |||
} | |||
.tooltip-hero-stats span { | |||
margin-left: 3px; | |||
} | |||
.tooltip-hero-abilities { | |||
display: flex; | |||
flex-direction: column; | |||
margin: 0 5px; | |||
} | |||
.tooltip-hero-ability:last-child { | |||
margin-bottom: 8px; | |||
} | |||
.tooltip-hero-ability { | |||
display: flex; | |||
flex-direction: row; | |||
padding-top: 5px; | |||
margin-bottom: 5px; | |||
} | |||
.tooltip-hero-ability-icon { | |||
display: flex; | |||
justify-content: center; | |||
padding: 0 5px; | |||
} | |||
.tooltip-hero-ability-properties { | |||
line-height: 1; | |||
font-size: 13px; | |||
text-transform: none; | |||
padding: 0 15px 0 0; | |||
color: #b5cbcf; | |||
} | |||
.tooltip-hero-ability-type, .tooltip-hero-ability-chance{ | |||
color: #ffb257; | |||
} | |||
.tooltip-hero-ability-description { | |||
/*font-weight: 400;*/ | |||
} | |||
.tooltip-hero-other { | |||
width: 295px; | |||
margin: 0 5px 7px 5px; | |||
} | |||
.tooltip-hero-features { | |||
display: flex; | |||
flex-direction: column; | |||
padding-left: 5px; | |||
} | |||
.tooltip-hero-feature { | |||
font-weight: normal; | |||
text-transform: none; | |||
color: #b5cbcf; | |||
font-size: 13px; | |||
line-height: 16px; | |||
margin-top: 5px; | |||
} | |||
.infobox-hero-feature:last-child { | |||
padding-bottom: 5px; | |||
} | |||
.tooltip-hero-feature-name { | |||
display: block; | |||
font-size: 11px; | |||
color: #ffb257; | |||
font-weight: bold; | |||
text-transform: uppercase; | |||
} | |||
.tooltip-hero-sieges { | |||
display: flex; | |||
flex-direction: column; | |||
padding-left: 5px; | |||
} | |||
.tooltip-hero-siege { | |||
font-weight: normal; | |||
text-transform: none; | |||
color: #b5cbcf; | |||
font-size: 13px; | |||
line-height: 16px; | |||
margin-top: 5px; | |||
} | |||
.tooltip-hero-siege:last-child { | |||
padding-bottom: 5px; | |||
} | |||
.tooltip-hero-siege-name { | |||
display: block; | |||
font-size: 11px; | |||
color: #ffb257; | |||
font-weight: bold; | |||
text-transform: uppercase; | |||
} | |||
.tooltip-hero-dislikes { | |||
width: 100%; | |||
display: flex; | |||
flex-direction: column; | |||
} | |||
.tooltip-hero-dislike { | |||
font-weight: normal; | |||
text-transform: none; | |||
color: #b5cbcf; | |||
padding: 5px; | |||
font-size: 13px; | |||
line-height: 16px; | |||
} | |||
.tooltip-hero-dislike-name { | |||
display: block; | |||
font-size: 11px; | |||
color: #ffb257; | |||
font-weight: bold; | |||
text-transform: uppercase; | |||
} | |||
.tooltip-hero-other a { | |||
color: #3eabdf; | |||
} | |||
.tooltip-item-main { | |||
display: flex; | |||
justify-content: center; | |||
margin: 20px; | |||
} | |||
.tooltip-item-name { | |||
font-family: BeaufortforLoL; | |||
text-align: center; | |||
font-size: 26px; | |||
line-height: 26px; | |||
color: #7daed7; | |||
text-transform: uppercase; | |||
font-weight: bold; | |||
text-shadow: 2px 2px 2px #142730; | |||
margin: 20px; | |||
} | |||
.tooltip-item-icon { | |||
width: 140px; | |||
height: 140px; | |||
} | |||
.tooltip-item-icon img { | |||
border-style: solid; | |||
border-width: 4px; | |||
border-radius: 10px; | |||
cursor: pointer; | |||
box-sizing: border-box; | |||
} | |||
.tooltip-item-type { | |||
padding: 15px 0; | |||
border-top: 1px solid #486c81; | |||
border-bottom: 1px solid #486c81; | |||
background-color: #173445; | |||
font-family: BeaufortforLoL; | |||
font-size: 14px; | |||
text-align: center; | |||
font-weight: bold; | |||
color: white; | |||
} | |||
.tooltip-item-description { | |||
color: #649ec0; | |||
font-style: italic; | |||
padding: 10px; | |||
font-family: BeaufortforLoL; | |||
font-size: 14px; | |||
text-align: center; | |||
} | |||
.tooltip-item-auc-description { | |||
font-family: 'BeaufortforLOL'; | |||
font-size: 14px; | |||
padding: 10px 0; | |||
color: #efefef; | |||
background: #0f2c45; | |||
text-align: center; | |||
line-height: 1.5em; | |||
} | |||
.tooltip-item-min-cost, .tooltip-item-deposit { | |||
font-weight: bold; | |||
} | |||
.tooltip-item-min-cost span, .tooltip-item-deposit span { | |||
color: #efde22; | |||
} | |||
.tooltip-item-auc-description .va-icon { | |||
top: 0 !important; | |||
} | |||
.tooltip-item-abilities { | |||
display: flex; | |||
flex-direction: column; | |||
margin: 7px; | |||
} | |||
.tooltip-item-ability:last-child { | |||
margin-bottom: 8px; | |||
} | |||
.tooltip-item-ability { | |||
display: flex; | |||
flex-direction: row; | |||
padding-top: 5px; | |||
margin-bottom: 5px; | |||
} | |||
.tooltip-item-ability-icon { | |||
display: flex; | |||
justify-content: center; | |||
padding: 0 5px; | |||
} | |||
.tooltip-item-ability-properties { | |||
line-height: 1; | |||
font-size: 13px; | |||
text-transform: none; | |||
padding: 0 15px 0 0; | |||
color: #b5cbcf; | |||
} | |||
.tooltip-item-ability-type, .tooltip-item-ability-chance{ | |||
color: #ffb257; | |||
} | |||
.tooltip-unit-property { | |||
font-family: BeaufortforLoL; | |||
text-transform: uppercase; | |||
width: 110px; | |||
text-align: center; | |||
display: flex; | |||
flex-flow: column wrap; | |||
} | |||
.tooltip-unit-property span { | |||
color: #ffb257; | |||
font-weight: bold; | |||
font-size: 10px; | |||
} | |||
.tooltip-unit-property div { | |||
color: #7daed7; | |||
font-weight: bold; | |||
font-size: 12px; | |||
line-height: 25px; | |||
} | |||
.tooltip-boss-main { | |||
margin: 7px; | |||
} | |||
.tooltip-boss-name { | |||
font-family: BeaufortforLoL; | |||
text-align: center; | |||
font-size: 26px; | |||
line-height: 26px; | |||
color: #7daed7; | |||
text-transform: uppercase; | |||
font-weight: bold; | |||
text-shadow: 2px 2px 2px #142730; | |||
margin: 20px 10px; | |||
} | |||
.tooltip-boss-property-block { | |||
display: flex; | |||
color: #ffb257; | |||
font-weight: bold; | |||
font-size: 11px; | |||
text-transform: uppercase; | |||
align-items: center; | |||
justify-content: space-around; | |||
} | |||
.tooltip-boss-property { | |||
margin: 10px 0 5px 40px; | |||
text-align: center; | |||
line-height: 20px; | |||
} | |||
.tooltip-boss-property span { | |||
margin-bottom: 10px; | |||
color: #ffb257; | |||
} | |||
.tooltip-boss-property div { | |||
color: #f1e6d0; | |||
margin-top: -5px; | |||
} | |||
.tooltip-boss-icon-block { | |||
padding: 0; | |||
width: 160px | |||
} | |||
.tooltip-boss-icon { | |||
width: 128px; | |||
position: relative; | |||
margin: 0 auto; | |||
} | |||
.tooltip-boss-icon img { | |||
border: 3px ridge #3d8ac2; | |||
} | |||
.tooltip-boss-features { | |||
position: absolute; | |||
width: 30px; | |||
height: 128px; | |||
display: flex; | |||
flex-flow: column wrap; | |||
top: 0; | |||
right: -20px; | |||
} | |||
.tooltip-boss-features img { | |||
border: 0; | |||
} | |||
.tooltip-boss-hp { | |||
width: 200px; | |||
height: 15px; | |||
background: #149132; | |||
line-height: 15px; | |||
color: white; | |||
border: 1px solid #172027; | |||
margin: 15px auto 10px auto; | |||
padding: 3px 8px; | |||
font-weight: bold; | |||
text-shadow: 1px 1px 2px #223038; | |||
text-align: center; | |||
} | |||
.tooltip-boss-data { | |||
display: table; | |||
width: 100%; | |||
border-spacing: 0; | |||
margin-top: 10px !important; | |||
} | |||
.tooltip-boss-data tr { | |||
text-align: center; | |||
} | |||
.tooltip-boss-score-block, .tooltip-boss-loot-block, .tooltip-boss-summon-block { | |||
display: flex; | |||
flex-flow: row wrap; | |||
justify-content: space-around; | |||
} | |||
.tooltip-boss-score-head { | |||
display: flex; | |||
text-transform: uppercase; | |||
color: white; | |||
align-items: center; | |||
padding-left: 10px; | |||
width: 30%; | |||
} | |||
.tooltip-boss-score-body { | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
padding: 10px 0; | |||
width: 64%; | |||
} | |||
.tooltip-boss-score-body span { | |||
height: 15px; | |||
color: white; | |||
font-weight: bold; | |||
font-size: 14px; | |||
} | |||
.tooltip-boss-score-body .va-icon { | |||
top: 0 !important; | |||
} | |||
.tooltip-boss-loot-head { | |||
display: flex; | |||
align-items: center; | |||
text-transform: uppercase; | |||
color: white; | |||
padding-left: 10px; | |||
width: 30%; | |||
} | |||
.tooltip-boss-loot-body { | |||
display: flex; | |||
justify-content: space-evenly; | |||
padding: 10px 0; | |||
width: 64%; | |||
} | |||
.tooltip-boss-loot-body > div { | |||
width: inherit; | |||
display: block; | |||
} | |||
.tooltip-boss-summon-head { | |||
display: flex; | |||
align-items: center; | |||
text-transform: uppercase; | |||
color: white; | |||
padding-left: 10px; | |||
width: 30%; | |||
} | |||
.tooltip-boss-summon-body { | |||
width: 64%; | |||
display: flex; | |||
justify-content: center; | |||
padding: 10px 0; | |||
} | |||
.tooltip-boss-info-head { | |||
text-transform: uppercase; | |||
color: #ffb257; | |||
padding: 10px 0 3px 0 !important; | |||
} | |||
.tooltip-boss-info-body { | |||
padding: 0 5px 5px 5px; | |||
color: #efefef; | |||
text-align: center; | |||
} | |||
.tooltip-boss-guards { | |||
display: flex; | |||
flex-wrap: wrap; | |||
} | |||
.tooltip-boss-guard { | |||
padding: 0 0 10px 0 !important; | |||
width: 50%; | |||
} | |||
.tooltip-boss-guard-icon { | |||
width: 80px; | |||
position: relative; | |||
margin: 0 auto; | |||
} | |||
.tooltip-boss-guard-icon img { | |||
border: 3px ridge #316f9c; | |||
} | |||
.tooltip-boss-guard-hp { | |||
width: 80%; | |||
height: 15px; | |||
background: #149132; | |||
line-height: 15px; | |||
color: white; | |||
border: 1px solid #172027; | |||
margin: 5px auto; | |||
padding: 3px; | |||
font-weight: bold; | |||
text-shadow: 1px 1px 2px #223038; | |||
text-align: center; | |||
} | |||
.tooltip-boss-guard-features { | |||
position: absolute; | |||
width: 24px; | |||
height: 100px; | |||
display: flex; | |||
flex-flow: column wrap; | |||
top: 0; | |||
right: -17px; | |||
} | |||
.tooltip-boss-guard-features img { | |||
border: 0; | |||
} | |||
.tooltip-boss-score { | |||
margin-left: 3px; | |||
color: rgb(208,200,101); | |||
font-weight: bold; | |||
line-height: 29px; | |||
font-size: 13px; | |||
} | |||
/* Hides tooltips with redlinks, not yet loaded ones and elements containing tooltip contents for advanced tooltips */ | |||
.has-redlinks, .tooltip-loading, .advanced-tooltip .tooltip-contents { | |||
display: none; | |||
} | |||
/* Align images with text the same way it's in page content */ | |||
/* Was probably better to play with the classes but that would cause ton of side effects */ | |||
.main-tooltip img { | |||
vertical-align: middle; | |||
} | |||
.hero-border-common img { | |||
border-color:#8f8676; | |||
} | |||
.hero-border-uncommon img { | |||
border-color:#d8c7aa; | |||
} | |||
.hero-border-rare img { | |||
border-color:#3ab11c; | |||
} | |||
.hero-border-ultrarare img { | |||
border-color:#2c75fb; | |||
} | |||
.hero-border-epic img { | |||
border-color:#c113ec; | |||
} | |||
.hero-border-legendary img { | |||
border-color:#f5b526; | |||
} | |||
.hero-border-mythic img { | |||
border-color:#00c7b1; | |||
} | |||
.hero-border-divine img { | |||
border-color:#54452a; | |||
} | |||
.hero-border-godlike img { | |||
border-color:#a50934; | |||
} | |||
.hero-border-eternal img { | |||
border-color:#ce05b5; | |||
} | |||
.hero-border-galactic img { | |||
border-color:#9db53d; | |||
} | |||
.item-border-common img { | |||
border-color: gray; | |||
} | |||
.item-border-uncommon img { | |||
border-color: #fff; | |||
} | |||
.item-border-rare img { | |||
border-color: #09db4b; | |||
} | |||
.item-border-ultrarare img { | |||
border-color: #03a9fc; | |||
} | |||
.item-border-epic img { | |||
border-color: #7408bd; | |||
} | |||
.item-border-legendary img { | |||
border-color: #ff9600; | |||
} | } | ||
Текущая версия от 10:10, 29 ноября 2023
.custom-h2 {
margin-bottom: 0.8rem !important;
background-color: rgba(24,36,44,0.6) !important;
border: 1px solid #172027 !important;
padding: 10px !important;
color: #c9c79d !important;
display: flex !important;
}
.custom-h2 .mw-headline {
margin: 0 auto !important;
}
.custom-h2 .mw-editsection {
display: block !important;
left: 65px !important;
}
.hero-icon-border {
border: 1px solid #567a88;
}
.mw-body-content-change {
background-color: /* #22313a */ #112b3a !important;
}
span.va-icon2 {
position: relative;
vertical-align: text-bottom !important;
}
span.va-icon {
position: relative;
top: 2px;
vertical-align: text-bottom !important;
}
ul.gallery {
margin:.8rem 0 1.6rem!important;
padding:2px;
}
@media only screen and (max-width: 1290px) {
li.gallerybox,li.gallerybox div,li.gallerybox a.image,li.gallerybox a.image img {
width:13vw!important;
}
}
li.gallerybox div.thumb {
border-color:#2b2f36;
background-color:#24272f;
}
.mw-body-content a.image {
display:initial;
}
.icon-caption {
text-align: center;
}
.rarity-common,.rarity-common a {
color:#969696!important;
text-shadow:0 0 3px #000!important;
}
.rarity-white,.rarity-white a {
color:#fff!important;
text-shadow:0 0 3px grey!important;
}
.rarity-glpar,.rarity-glpar a {
color:#f3bb32!important;
text-shadow:0 0 10px #f3bb32!important;
}
.rarity-green,.rarity-green a {
color:#3dd20b!important;
}
.rarity-unique,.rarity-unique a {
color:#2f78ff!important;
}
.rarity-blue,.rarity-blue a {
color:#2f78ff!important;
}
.rarity-legendary,.rarity-legendary a {
color:#ff9600!important;
}
.rarity-orange,.rarity-orange a {
color:#ff9600!important;
}
.rarity-purple,.rarity-purple a {
color:#9132c8!important;
}
.rarity-yellow,.rarity-yellow a {
color:#ffb400!important;
}
.rarity-dark-orange,.rarity-dark-orange a {
color:#dc7800!important;
}
.rarity-pearlescent,.rarity-pearlescent a {
color:#0ff!important;
}
.rarity-e-tech,.rarity-e-tech a {
color:#f0f!important;
}
.rarity-cursed,.rarity-cursed a {
color:#0cc!important;
}
.rarity-red,.rarity-red a {
color:#cf4747!important;
}
.rarity-seraph,.rarity-seraph a {
color:#ff69b4!important;
}
.rarity-aftermarket,.rarity-aftermarket a {
color:lime!important;
}
.rarity-rainbow,.rarity-rainbow a {
background:rgba(255,32,32,1);
background:-moz-linear-gradient(left,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%);
background:-webkit-gradient(left top,right top,color-stop(0%,rgba(255,32,32,1)),color-stop(14%,rgba(250,152,77,1)),color-stop(25%,rgba(250,250,77,1)),color-stop(42%,rgba(100,250,77,1)),color-stop(57%,rgba(0,247,226,1)),color-stop(71%,rgba(77,121,250,1)),color-stop(86%,rgba(221,77,250,1)),color-stop(100%,rgba(250,147,147,1)));
background:-webkit-linear-gradient(left,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%);
background:-o-linear-gradient(left,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%);
background:-ms-linear-gradient(left,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%);
background:linear-gradient(to right,rgba(255,32,32,1) 0%,rgba(250,152,77,1) 14%,rgba(250,250,77,1) 25%,rgba(100,250,77,1) 42%,rgba(0,247,226,1) 57%,rgba(77,121,250,1) 71%,rgba(221,77,250,1) 86%,rgba(250,147,147,1) 100%);
-webkit-background-clip:text;
background-clip:text;
-webkit-text-fill-color:transparent!important;
text-shadow:none!important;
}
.rarity-common>.new,.rarity-white>.new,.rarity-green>.new,.rarity-unique>.new,.rarity-blue>.new,.rarity-legendary>.new,.rarity-orange>.new,.rarity-purple>.new,.rarity-yellow>.new,.rarity-dark-orange>.new,.rarity-pearlescent>.new,.rarity-e-tech>.new,.rarity-seraph>.new,.rarity-rainbow>.new {
background-color:#FF454574!important;
}
.size10, .size10 a {
font-size: 10px;
}
.size12, .size12 a {
font-size: 12px;
}
.size14, .size14 a {
font-size: 14px;
}
.size16, .size16 a {
font-size: 16px;
}
.size18, .size18 a {
font-size: 18px;
}
.size20, .size20 a {
font-size: 20px;
}
.size22, .size22 a {
font-size: 22px;
}
.size24, .size24 a {
font-size: 24px;
}
.size26, .size26 a {
font-size: 26px;
}
.size28, .size28 a {
font-size: 28px;
}
.size30, .size30 a {
font-size: 30px;
}
.border-gray {
border-style: solid;
border-radius: 3px;
border-color: gray;
width:fit-content;
}
.border-white {
border-style: solid;
border-radius: 3px;
border-color: #ffffff;
width:fit-content;
}
.border-green {
border-style: solid;
border-radius: 3px;
border-color: #09db4b;
width:fit-content;
}
.border-blue {
border-style: solid;
border-radius: 3px;
border-color: #03a9fc;
width:fit-content;
}
.border-epic {
border-style: solid;
border-radius: 3px;
border-color: #7408bd;
width:fit-content;
}
.border-lega {
border-style: solid;
border-radius: 3px;
border-color: #ff9600;
width:fit-content;
}
.border-gray img, .border-white img, .border-green img, .border-blue img, .border-epic img, .border-lega img {
border-radius: 2px;
}
.custom-table {
display: table;
border-collapse: collapse;
background-color: #12303c;
border: 1px solid #2b4454;
}
.custom-table tr {
color: white;
border-bottom: 1px solid #2b4454;
}
.custom-table th, td {
padding: 10px;
}
.custom-table th {
color: #337c97;
background-color: #0f2833;
}
.active-hover tr:hover {
background-color: #193948;
}
.recipes {
display: flex;
flex-flow: row wrap;
justify-content: center;
margin: 0 auto 15px auto;
width: 244px;
}
.bosses {
display: flex;
flex-flow: row wrap;
justify-content: center;
margin: 0 auto 15px auto;
}
.bosses a {
display: inline-block;
margin: 5px;
border: 3px ridge #3d8ac2;
}
.chests {
display: flex;
flex-flow: row wrap;
justify-content: center;
margin: 0 auto 15px auto;
}
.chests > div {
width: inherit !important;
margin: 5px !important;
}
.awards {
display: flex;
flex-flow: row wrap;
justify-content: center;
margin: 0 auto 15px auto;
}
.shop {
display: flex;
flex-flow: row wrap;
justify-content: center;
margin: 0 auto 15px auto;
}
.gift {
display: flex;
flex-flow: row wrap;
justify-content: center;
margin: 0 auto 15px auto;
}
.gift > div {
width: inherit !important;
margin: 5px !important;
}
.loot {
display: flex;
flex-flow: row wrap;
justify-content: center;
margin: 0 auto 15px auto;
}
.used-in-craft {
display: flex;
flex-flow: row wrap;
justify-content: center;
margin: 0 auto 15px auto;
}
.used-in-craft > div {
display: block !important;
width: inherit !important;
position: static !important;
margin: 5px !important;
}
.activates-hero {
display: flex;
flex-flow: row wrap;
justify-content: center;
margin: 0 auto 15px auto;
}
.activates-hero > div {
display: block !important;
width: inherit !important;
position: static !important;
margin: 5px !important;
}
@media only screen and (max-width:1023px) {
.custom-table th, td {
padding: 5px;
}
.pc-block {
display:none !important;
}
}
@media only screen and (min-width: 1024px) {
.mobile-block {
display:none !important;
}
.custom-table {
overflow-x: scroll;
}
}
/* ################################################## */
/* ### TEMPLATE DOCUMENTATION ### */
/* ### (Шаблон:Docparam/Шаблон:Documentation) ### */
/* ################################################## */
/* Template:Docparam */
.va-docparam {
padding: 5px 2px 5px 20px;
text-indent: -18px;
margin-bottom: 3px;
background: #002a32;
border: 1px dotted #D9D9D9;
overflow: auto;
}
.va-docparam-icon {
margin: 0;
padding: 0;
width: 20px;
float: left;
}
.va-docparam-default {
float: right;
font-size: 10px;
}
.va-docparam-params {
font-family: monospace;
}
.va-docparam-desc {
margin: 0 0 8px;
padding: 0 0 5px 20px;
}
/* ------------------- шаблон Предмет */
/*.item {*/
/* width: 30%;*/
/* border: 1px solid #8c8c8c;*/
/* background: #303030;*/
/* padding: 10px;*/
/*}*/
/*.item .rare-border {*/
/* width: 92px;*/
/* margin: 0 auto;*/
/* border-radius: 5px;*/
/* margin-bottom: 10px;*/
/*}*/
.item ul {
list-style-type: none;
/*text-align: center;*/
/*margin: 0;*/
}
/*.item span {*/
/* font-weight: bold;*/
/*}*/
.item-count {
position: absolute;
bottom: -2px;
right: 4px;
font-size: 13px;
font-weight: bold;
color: white;
text-shadow: #000 2px 0px 2px, #000 0px 2px 2px, #000 0px -2px 2px, #000 -2px 0px 2px;
}
.recipe__card {
background-color: #1c323e;
border: 1px solid #314755;
margin: 10px;
}
.recipe__card .recipe-name {
margin-top: 8px;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding: 0 10px;
}
.recipe__card .item-main {
margin: 8px 0 8px 10px;
float: left;
}
.recipe__card .item-main span {
border-width: 4px;
border-radius: 10px;
}
.recipe__card .item-main span img {
border-radius: 7px;
margin: 0 !important;
}
.recipe__card .item-small-block {
display: flex;
flex-flow: row wrap;
margin-top: 9px;
}
.recipe__card .item-small {
margin-left: 6px;
}
.recipe__card .item-small span {
border-width: 3px;
border-radius: 7px;
}
.recipe__card .item-small span img {
border-radius: 5px;
margin: 0 !important;
}
.recipe__card .item-main .item-count {
font-size: 14px !important;
bottom: 3px !important;
right: 8px !important;
text-shadow: -1px 1px 2px #000000;
}
.recipe__card .item-small .item-count {
font-size: 11px !important;
bottom: 5px !important;
right: 5px !important;
text-shadow: -1px 1px 2px #000000;
}
.big-table {
overflow: auto;
position: relative;
}
.big-table table {
margin: 0 auto;
vertical-align: top;
max-width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.scroll-right:after {
content: '';
display: block;
width: 15px;
position: absolute;
top: 0;
right: 0;
bottom: 0;
z-index: 500;
background: radial-gradient(ellipse at right, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 75%) 100% center;
background-repeat: no-repeat;
background-attachment: scroll;
background-size: 15px 100%;
background-position: 100% 0%;
}
.scroll-left:before {
content: '';
display: block;
width: 15px;
position: absolute;
top: 0;
bottom: 0;
left: 0;
z-index: 500;
background: radial-gradient(ellipse at left, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 75%) 0 center;
background-repeat: no-repeat;
background-attachment: scroll;
background-size: 15px 100%;
}
.owl-carousel.owl-loaded {
text-align: center;
}
.mw-highlight-lines pre {
box-shadow: inset 2.75em 0 0 #365474 !important;
}
.mw-highlight-lines .lineno {
user-select: none !important;
-webkit-user-select: none !important;
-moz-user-select: none !important;
margin-left: -2.9em !important;
color: #b8c7cb !important;
}
.custom-grid {
width: 100%;
text-align: center;
display: flex;
flex-flow: row wrap;
justify-content: center;
}
.custom-grid__card {
display: flex;
flex-flow: column wrap;
text-align: center;
width: 200px;
background: #031e2f;
margin: 0.5rem;
padding: 1rem;
border-radius: 8px;
border: 1px solid #314755;
}
.custom-grid__card:hover {
background: #0c2738;
cursor: pointer;
}
.custom-grid__header {
font-weight: bold;
font-size: 14px;
text-transform: uppercase;
text-align: center;
color: #eae5b1;
margin-bottom: 5px;
}
.custom-grid__footer {
font-family: BeaufortforLoL;
color: #649ec0;
font-style: italic;
margin-top: 5px;
}
.custom-grid--category img {
border: 1px solid #547481;
}
.blue-tooltip {
width: 325px;
background-color: #0d2232;
border: 1px solid #39576a;
box-shadow: 0px 0px 5px 0px rgba(54, 81, 122, 0.5);
}
.tooltip-hero-main {
margin: 7px;
display: flex;
}
.tooltip-hero-name {
font-family: BeaufortforLoL;
text-align: center;
font-size: 26px;
line-height: 26px;
color: #7daed7;
text-transform: uppercase;
font-weight: bold;
text-shadow: 2px 2px 2px #142730;
margin: 10px;
}
.tooltip-hero-icon {
width: 125px;
height: 125px;
}
.tooltip-hero-icon img {
border-style: solid;
border-width: 4px;
border-radius: 8px;
cursor: pointer;
box-sizing: border-box;
}
.tooltip-hero-property {
font-family: BeaufortforLoL;
text-transform: uppercase;
width: 110px;
text-align: center;
display: flex;
flex-flow: column wrap;
}
.tooltip-hero-property span {
color: #ffb257;
font-weight: bold;
font-size: 10px;
}
.tooltip-hero-property div {
color: #7daed7;
font-weight: bold;
font-size: 12px;
line-height: 25px;
}
.tooltip-hero-stats {
color: #b5cbcf;
font-weight: bold;
font-size: 12px;
display: flex;
flex-flow: column wrap;
}
.tooltip-hero-stats div {
line-height: 22px;
}
.tooltip-hero-stats span {
margin-left: 3px;
}
.tooltip-hero-abilities {
display: flex;
flex-direction: column;
margin: 0 5px;
}
.tooltip-hero-ability:last-child {
margin-bottom: 8px;
}
.tooltip-hero-ability {
display: flex;
flex-direction: row;
padding-top: 5px;
margin-bottom: 5px;
}
.tooltip-hero-ability-icon {
display: flex;
justify-content: center;
padding: 0 5px;
}
.tooltip-hero-ability-properties {
line-height: 1;
font-size: 13px;
text-transform: none;
padding: 0 15px 0 0;
color: #b5cbcf;
}
.tooltip-hero-ability-type, .tooltip-hero-ability-chance{
color: #ffb257;
}
.tooltip-hero-ability-description {
/*font-weight: 400;*/
}
.tooltip-hero-other {
width: 295px;
margin: 0 5px 7px 5px;
}
.tooltip-hero-features {
display: flex;
flex-direction: column;
padding-left: 5px;
}
.tooltip-hero-feature {
font-weight: normal;
text-transform: none;
color: #b5cbcf;
font-size: 13px;
line-height: 16px;
margin-top: 5px;
}
.infobox-hero-feature:last-child {
padding-bottom: 5px;
}
.tooltip-hero-feature-name {
display: block;
font-size: 11px;
color: #ffb257;
font-weight: bold;
text-transform: uppercase;
}
.tooltip-hero-sieges {
display: flex;
flex-direction: column;
padding-left: 5px;
}
.tooltip-hero-siege {
font-weight: normal;
text-transform: none;
color: #b5cbcf;
font-size: 13px;
line-height: 16px;
margin-top: 5px;
}
.tooltip-hero-siege:last-child {
padding-bottom: 5px;
}
.tooltip-hero-siege-name {
display: block;
font-size: 11px;
color: #ffb257;
font-weight: bold;
text-transform: uppercase;
}
.tooltip-hero-dislikes {
width: 100%;
display: flex;
flex-direction: column;
}
.tooltip-hero-dislike {
font-weight: normal;
text-transform: none;
color: #b5cbcf;
padding: 5px;
font-size: 13px;
line-height: 16px;
}
.tooltip-hero-dislike-name {
display: block;
font-size: 11px;
color: #ffb257;
font-weight: bold;
text-transform: uppercase;
}
.tooltip-hero-other a {
color: #3eabdf;
}
.tooltip-item-main {
display: flex;
justify-content: center;
margin: 20px;
}
.tooltip-item-name {
font-family: BeaufortforLoL;
text-align: center;
font-size: 26px;
line-height: 26px;
color: #7daed7;
text-transform: uppercase;
font-weight: bold;
text-shadow: 2px 2px 2px #142730;
margin: 20px;
}
.tooltip-item-icon {
width: 140px;
height: 140px;
}
.tooltip-item-icon img {
border-style: solid;
border-width: 4px;
border-radius: 10px;
cursor: pointer;
box-sizing: border-box;
}
.tooltip-item-type {
padding: 15px 0;
border-top: 1px solid #486c81;
border-bottom: 1px solid #486c81;
background-color: #173445;
font-family: BeaufortforLoL;
font-size: 14px;
text-align: center;
font-weight: bold;
color: white;
}
.tooltip-item-description {
color: #649ec0;
font-style: italic;
padding: 10px;
font-family: BeaufortforLoL;
font-size: 14px;
text-align: center;
}
.tooltip-item-auc-description {
font-family: 'BeaufortforLOL';
font-size: 14px;
padding: 10px 0;
color: #efefef;
background: #0f2c45;
text-align: center;
line-height: 1.5em;
}
.tooltip-item-min-cost, .tooltip-item-deposit {
font-weight: bold;
}
.tooltip-item-min-cost span, .tooltip-item-deposit span {
color: #efde22;
}
.tooltip-item-auc-description .va-icon {
top: 0 !important;
}
.tooltip-item-abilities {
display: flex;
flex-direction: column;
margin: 7px;
}
.tooltip-item-ability:last-child {
margin-bottom: 8px;
}
.tooltip-item-ability {
display: flex;
flex-direction: row;
padding-top: 5px;
margin-bottom: 5px;
}
.tooltip-item-ability-icon {
display: flex;
justify-content: center;
padding: 0 5px;
}
.tooltip-item-ability-properties {
line-height: 1;
font-size: 13px;
text-transform: none;
padding: 0 15px 0 0;
color: #b5cbcf;
}
.tooltip-item-ability-type, .tooltip-item-ability-chance{
color: #ffb257;
}
.tooltip-unit-property {
font-family: BeaufortforLoL;
text-transform: uppercase;
width: 110px;
text-align: center;
display: flex;
flex-flow: column wrap;
}
.tooltip-unit-property span {
color: #ffb257;
font-weight: bold;
font-size: 10px;
}
.tooltip-unit-property div {
color: #7daed7;
font-weight: bold;
font-size: 12px;
line-height: 25px;
}
.tooltip-boss-main {
margin: 7px;
}
.tooltip-boss-name {
font-family: BeaufortforLoL;
text-align: center;
font-size: 26px;
line-height: 26px;
color: #7daed7;
text-transform: uppercase;
font-weight: bold;
text-shadow: 2px 2px 2px #142730;
margin: 20px 10px;
}
.tooltip-boss-property-block {
display: flex;
color: #ffb257;
font-weight: bold;
font-size: 11px;
text-transform: uppercase;
align-items: center;
justify-content: space-around;
}
.tooltip-boss-property {
margin: 10px 0 5px 40px;
text-align: center;
line-height: 20px;
}
.tooltip-boss-property span {
margin-bottom: 10px;
color: #ffb257;
}
.tooltip-boss-property div {
color: #f1e6d0;
margin-top: -5px;
}
.tooltip-boss-icon-block {
padding: 0;
width: 160px
}
.tooltip-boss-icon {
width: 128px;
position: relative;
margin: 0 auto;
}
.tooltip-boss-icon img {
border: 3px ridge #3d8ac2;
}
.tooltip-boss-features {
position: absolute;
width: 30px;
height: 128px;
display: flex;
flex-flow: column wrap;
top: 0;
right: -20px;
}
.tooltip-boss-features img {
border: 0;
}
.tooltip-boss-hp {
width: 200px;
height: 15px;
background: #149132;
line-height: 15px;
color: white;
border: 1px solid #172027;
margin: 15px auto 10px auto;
padding: 3px 8px;
font-weight: bold;
text-shadow: 1px 1px 2px #223038;
text-align: center;
}
.tooltip-boss-data {
display: table;
width: 100%;
border-spacing: 0;
margin-top: 10px !important;
}
.tooltip-boss-data tr {
text-align: center;
}
.tooltip-boss-score-block, .tooltip-boss-loot-block, .tooltip-boss-summon-block {
display: flex;
flex-flow: row wrap;
justify-content: space-around;
}
.tooltip-boss-score-head {
display: flex;
text-transform: uppercase;
color: white;
align-items: center;
padding-left: 10px;
width: 30%;
}
.tooltip-boss-score-body {
display: flex;
align-items: center;
justify-content: center;
padding: 10px 0;
width: 64%;
}
.tooltip-boss-score-body span {
height: 15px;
color: white;
font-weight: bold;
font-size: 14px;
}
.tooltip-boss-score-body .va-icon {
top: 0 !important;
}
.tooltip-boss-loot-head {
display: flex;
align-items: center;
text-transform: uppercase;
color: white;
padding-left: 10px;
width: 30%;
}
.tooltip-boss-loot-body {
display: flex;
justify-content: space-evenly;
padding: 10px 0;
width: 64%;
}
.tooltip-boss-loot-body > div {
width: inherit;
display: block;
}
.tooltip-boss-summon-head {
display: flex;
align-items: center;
text-transform: uppercase;
color: white;
padding-left: 10px;
width: 30%;
}
.tooltip-boss-summon-body {
width: 64%;
display: flex;
justify-content: center;
padding: 10px 0;
}
.tooltip-boss-info-head {
text-transform: uppercase;
color: #ffb257;
padding: 10px 0 3px 0 !important;
}
.tooltip-boss-info-body {
padding: 0 5px 5px 5px;
color: #efefef;
text-align: center;
}
.tooltip-boss-guards {
display: flex;
flex-wrap: wrap;
}
.tooltip-boss-guard {
padding: 0 0 10px 0 !important;
width: 50%;
}
.tooltip-boss-guard-icon {
width: 80px;
position: relative;
margin: 0 auto;
}
.tooltip-boss-guard-icon img {
border: 3px ridge #316f9c;
}
.tooltip-boss-guard-hp {
width: 80%;
height: 15px;
background: #149132;
line-height: 15px;
color: white;
border: 1px solid #172027;
margin: 5px auto;
padding: 3px;
font-weight: bold;
text-shadow: 1px 1px 2px #223038;
text-align: center;
}
.tooltip-boss-guard-features {
position: absolute;
width: 24px;
height: 100px;
display: flex;
flex-flow: column wrap;
top: 0;
right: -17px;
}
.tooltip-boss-guard-features img {
border: 0;
}
.tooltip-boss-score {
margin-left: 3px;
color: rgb(208,200,101);
font-weight: bold;
line-height: 29px;
font-size: 13px;
}
/* Hides tooltips with redlinks, not yet loaded ones and elements containing tooltip contents for advanced tooltips */
.has-redlinks, .tooltip-loading, .advanced-tooltip .tooltip-contents {
display: none;
}
/* Align images with text the same way it's in page content */
/* Was probably better to play with the classes but that would cause ton of side effects */
.main-tooltip img {
vertical-align: middle;
}
.hero-border-common img {
border-color:#8f8676;
}
.hero-border-uncommon img {
border-color:#d8c7aa;
}
.hero-border-rare img {
border-color:#3ab11c;
}
.hero-border-ultrarare img {
border-color:#2c75fb;
}
.hero-border-epic img {
border-color:#c113ec;
}
.hero-border-legendary img {
border-color:#f5b526;
}
.hero-border-mythic img {
border-color:#00c7b1;
}
.hero-border-divine img {
border-color:#54452a;
}
.hero-border-godlike img {
border-color:#a50934;
}
.hero-border-eternal img {
border-color:#ce05b5;
}
.hero-border-galactic img {
border-color:#9db53d;
}
.item-border-common img {
border-color: gray;
}
.item-border-uncommon img {
border-color: #fff;
}
.item-border-rare img {
border-color: #09db4b;
}
.item-border-ultrarare img {
border-color: #03a9fc;
}
.item-border-epic img {
border-color: #7408bd;
}
.item-border-legendary img {
border-color: #ff9600;
}