MediaWiki:Common.css: mudanças entre as edições
De Bloodstone Wiki
mSem resumo de edição |
mSem resumo de edição |
||
Linha 609: | Linha 609: | ||
font-size: 22px; | font-size: 22px; | ||
font-weight: 500; | font-weight: 500; | ||
} | |||
@media only screen and (max-width: 600px) { | |||
#HuntTempletaBox{ | |||
width: 100%; | |||
} | |||
} | } |
Edição das 11h12min de 12 de maio de 2021
/** o código CSS colocado aqui será aplicado a todos os temas */ ::-webkit-scrollbar { width: 10px; height: 10px; } ::-webkit-scrollbar-thumb { background: #ababab; border-radius: 10px; } ::-webkit-scrollbar-thumb:hover{ background: #878787; } ::-webkit-scrollbar-track{ background: #ffffff; border-radius: 10px; } /* Contribuições*/ .contributionscores-wrapper { } .contributionscores-title { background-color: #aaaaaa; margin-bottom:0px; padding-left: .4em; } .contributionscores .header { background-color: #cccccc; border-bottom: 1pxsolid #999999; font-weight: bold; } .contributionscores .odd { background-color: #eeeeee; } .contributionscores .header td { padding-left: .2em; padding-right: .2em; } .contributionscores .content { padding-left: .2em; padding-right: .2em; } /* Estilo das Tabelas de DPL */ table#tabelaDPL {border-collapse: collapse; background-color: #CEDFF2;width:100%;} table#tabelaDPL th {border:2px solid white;} table#tabelaDPL tr td {border:2px solid white; background-color:#E8F2F8; textalign:center;} table#tabelaDPL td:first-child {padding-left: 4px; backgroundcolor:transparent; text-align:left;} table#tabelaDPL td:last-child {padding-left: 4px; text-align:left;} /* NPC Trades */ #ComercioNPC table > tbody > tr > td:nth-child(1){ display: grid; } div.exception, td.exception { background-color:#ff8e8e; } td.buy table tbody tr td, td.sell table tbody tr td { line-height: 1em; padding: 2px; } td.buy table, td.sell table { padding: 0; margin: 0; } table.trades td { padding:0; line-height:1.25em; } div.npcprice, div.npcvalue, td.npcvalue, td.npcprice { background-color:#9eff8e; font-weight: bold; color:#000; line-height:100%; } #mNPC_Infobox { display: grid; padding: 16px; border-radius: 16px; box-shadow: 0px 0px 4px 1px hsla(0,0%,0%,.24); gap: 16px; } #mNPC_Infobox pre { all: unset; } .Casos-de-Familia { all:unset; border-bottom: dashed 1px hsla(0,0%,0%,.24); display: block; width: 100%; } #mNPC_Infobox > div:nth-child(2) { display: grid; justify-content: start; } #mNPC_Infobox > div:nth-child(2) > p{ padding: 0px 16px; display: grid; grid-template-columns: 1fr 1fr; grid-gap: 16px; margin: 0px; } #mNPC_Infobox > div:nth-child(2) > p > *:nth-child(1){ justify-self: end; } #mNPC_Infobox > div:nth-child(2) > p > *:nth-child(2){ justify-self: start; } #mNPC_Infobox > .header { display: grid; grid-template-areas: 'Imagem .' 'Imagem titulo' 'Imagem subtitulo' 'Imagem.'; column-gap: 16px; row-gap: 8px; grid-template-columns: auto 1fr; grid-template-rows: 1fr auto auto 1fr; /* border-bottom: dashed 1px hsla(0,0%,0%,.24); */ } #mNPC_Infobox > .header pre { all: unset; padding: 0px; background: transparent; border: none; } #mNPC_Infobox > .header > *:nth-child(1){ grid-area: Imagem; } #mNPC_Infobox > .header > *:nth-child(2){ grid-area: titulo; align-self: end; font-size: 32px; font-weight: normal; } #mNPC_Infobox > .header > *:nth-child(2)::after { display: none; } #mNPC_Infobox > .header > *:nth-child(3){ grid-area: subtitulo; align-self: start; font-size: 16px; font-weight: normal; } #mNPC_Infobox > .header > *:nth-child(3)::after { display: none; } #mNPC_Infobox > .main { display: grid; } #mNPC_Infobox > .main > h1 { margin-top: 4px; } #mNPC_Infobox > .main b { font-size: 20px; } #mNPC_Infobox > .main > h1::after{ display: none; } #mNPC_Infobox > .main > .section { display: grid; gap: 4px; width: 100%; overflow-x: scroll; } /*Criaturas Imagens*/ .tw-criatura-32 { --size: 32px; } .tw-criatura-64 { --size: 64px; } .tw-criatura-2-steps { --steps: 2; } .tw-criatura-8-steps { --steps: 8; } .tw-criatura-13-steps { --steps: 13; } .tw-criatura { overflow: hidden; position: relative; display: inline-block; width: var(--size); height: var(--size); } .tw-criatura > div { position: absolute; top: 0; left: 0; animation: rodando 1s steps(var(--steps)) infinite; } .tw-criatura-img-2 > div { left: calc(-1 * var(--size)); } .tw-criatura-img-3 > div { left: calc(-2 * var(--size)); } .tw-criatura-img-4 > div { left: calc(-3 * var(--size)); } /* Home Responsividade */ table.home-responsive{ width: 100%; table-layout: fixed; max-width: 1100px; text-align: center; box-shadow: 0px 0px 4px 1px hsla(0, 0%, 0%, .24); overflow: hidden; border-radius: 4px; } table.home-responsive td{ width: 20%; word-wrap: break-word; } table.home-responsive img{ width: 100%; height: auto; max-width: 125px; } table.home-responsive a{ font-size: 12px; font-weight: bold; } #mainBolinho { display: grid; width: 100%; } #mainBolinho > .header { display: grid; grid-gap: 16px; } #mainBolinho > .header a { background: none; padding-right: 0; } #mainBolinho > .header #toc { display: none; } #mainBolinho > .header > div { display: grid; grid-gap: 4px; } #mainBolinho > .header > div:nth-child(2) > div:nth-child(1) > a, #mainBolinho > .header > div:nth-child(2) > div:nth-child(2) > a{ background-color: #2f487b; color: #fff; padding: 16px; justify-self: center; } #mainBolinho > .header > div:nth-child(2) > div:nth-child(2) > a{ background: #2f487b; } #mainBolinho > .header > div:nth-child(2) > div:nth-child(1) > *:nth-child(1), #mainBolinho > .header > div:nth-child(2) > div:nth-child(2) > *:nth-child(1){ border-radius: 4px 0px 0px 4px; } #mainBolinho > .header > div:nth-child(2) > div:nth-child(1) > *:nth-child(2){ border-radius: 0px 0px 0px 0px; } #mainBolinho > .header > div:nth-child(2) > div:nth-child(1) > *:nth-child(3), #mainBolinho > .header > div:nth-child(2) > div:nth-child(2) > *:nth-child(2){ border-radius: 0px 4px 4px 0px; } #mainBolinho > .header > div > * { all: unset; text-align: center; } #mainBolinho > .header > div > h1 { font-size: 40px; font-weight: bolder; } #mainBolinho > .header > div > h2 { font-size: 20px; } #mainBolinho > .header > div > h2 > * { all: unset; } #mainBolinho > .header > div > *::after { all: unset; border: none; } #mainBolinho > .main { display: grid; width: 100%; grid-gap: 16px; text-align: center; } #mainBolinho > .main > .section:nth-child(1) { justify-self: center; } #mainBolinho > .main > .section:nth-child(2) img { width: 100%; height: auto; } #CriaturaDPL > table > tbody > tr > td:nth-child(2){ background: white !important; box-shadow: inset 0px 0px 4px 1px hsla(0,0%,0%,.24); } /* Deleta */ #Odin *:not(table):not(thead):not(tbody):not(tfoot):not(tr):not(th):not(td):not(img) { all: unset;} /* #Odin * { all: unset;} */ #Odin { display: grid; gap: 16px; box-shadow: 0px 0px 4px 1px #ccc; border-radius: 16px; padding: 16px; } #Odin:not(.Minerios) > .header { display: grid; gap: 4px 16px; grid-template-areas: 'img h1' 'img h2'; justify-content: start; } #Odin:not(.Minerios) > .header > *:nth-child(1){ grid-area: img; } #Odin:not(.Minerios) > .header > *:nth-child(2){ grid-area: h1; align-self: end; font-size: 24px; } #Odin:not(.Minerios) > .header > *:nth-child(3){ grid-area: h2; align-self: start; font-size: 18px; font-style: italic; } #Odin h1::after, #Odin h2::after { display: none; } #Odin .separador { border-bottom: dashed 1px #ccc; display: block; width: 100%; height: 1px; } #Odin .moreinfo { display: grid; padding: 0px 16px; } #Odin .moreinfo > p > span:nth-child(1) { font-weight: bold; } #Odin .main { display: grid; gap: 16px; } #Odin .main > h1 { font-weight: bold; padding: 0px 16px; } #Odin .main .section{ display: grid; gap: 16px; width: 100%; overflow-x: scroll; grid-auto-flow: column; } #Odin .main .section > *:nth-child(1) { justify-self: end; } #Odin .main .section > *:nth-child(2) { justify-self: start; } #Odin .main .section table:nth-child(1) { table-layout: fixed; white-space: nowrap; } #Odin .main .section table:nth-child(2) { table-layout: fixed; white-space: nowrap; } #Odin .main .section p { text-align: center; } #Odin .main .section table td { width: auto; } #Odin .main .section table td:nth-child(1) { display: grid; } #Odin .main .section table table{ font-weight: bold; } #Odin a:hover{ cursor: pointer; text-decoration: underline; } /* Diálogos*/ .Diálogos{ background-color: #F2F2F2; border-radius: 5px; box-shadow: 0 0 6px #B2B2B2; display: inline-block; padding: 10px 10px 10px 18px; position: relative; vertical-align: top; width: auto; } .Diálogos::before { background-color: #F2F2F2; content: "\00a0"; display: block; height: 16px; position: absolute; top: 11px; transform: rotate( 29deg ) skew( -35deg ); -moz-transform: rotate( 29deg ) skew( -35deg ); -ms-transform: rotate( 29deg ) skew( -35deg ); -o-transform: rotate( 29deg ) skew( -35deg ); -webkit-transform: rotate( 29deg ) skew( -35deg ); width: 20px; } .me { float: left; margin: 4px 0px 0px 16px; } .me::before { box-shadow: -2px 2px 2px 0 rgba( 178, 178, 178, .4 ); left: -9px; } .AlinhaQuest table { text-align: center; } /* Mapa/Box */ .mapbox_show { cursor: pointer; } /* Mapa Hunt */ .map_hunt_coord { display: none; } .map_hunt pre { display:none; } /* Mapa */ .map_frame { z-index: 8010; display: none; position: fixed; width: 520px; height: 450px; top: 50%; left: 50%; margin-top: -225px; margin-left: -250px; margin-right: 250px; margin-bottom: 250px; webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); } #my-map { position: absolute; top: -374px; left: -192px; width: 1280px; height: 1200px; } .map_box { clip: rect(0px, 520px, 462px, 0px); position: absolute; } .map_show { cursor: pointer; color: #0645AD; } .map_show:hover { cursor: pointer; color: #0645AD; text-decoration: underline; } .map_cross { position: absolute; top: -18px; right: -18px; width: 35px; height: 35px; cursor: pointer; z-index: 8040; } .map_overlay { opacity: 0.65; cursor: auto; display: none; height: 7628px; background-color: rgb(0, 0, 0); position: fixed; top: 0; left: 0; width: 100%; z-index: 8000; } .map_logobox { position: absolute; bottom: 0; right: 0; cursor: pointer; z-index: 8040; opacity: 0.8; } .map_logobox:hover { opacity: 1; } a.map_logo { background: url("https://www.bloodstonewiki.com.br/images/b/b5/Minimap_icon.png"); background-repeat: no-repeat; width: 70px; height: 60px; position: absolute; bottom: 18px; right: 8px; } .map_hunt_box{ border-radius: 12px; width: 250px; height: 250px; } .MagiasImagem { width: 86px; height: auto; border-radius: 12px; box-shadow: 0px 0px 1px 0px; } #HuntTempletaBox { box-shadow: 0px 0px 4px 0px hsl(0deg 0% 0% / 55%); overflow: hidden; border-radius: 12px; float: right; margin-right: 2px; background-color: #80808005; } #HuntTempletaBoxTitle { margin-bottom: -6px; margin-top: 6px; text-align: center; font-family: Roboto; font-size: 22px; font-weight: 500; } @media only screen and (max-width: 600px) { #HuntTempletaBox{ width: 100%; } }