Forum

Arquivo => Ajuda e Dúvidas => SE Extreme 1 => Tutoriais => Topic started by: GodFather. on July 27, 2008, 19:40:58

Title: TUTORIAL - Construção/Edição de Skins
Post by: GodFather. on July 27, 2008, 19:40:58
Boas ppl...resolvi fazer um tutorial para o pessoal que queira fazer Skins para o jogo...

Alteração de Imagens

Alteração dos .CSS

Aqui não devem alterar nada para além do que está sublinhado com os XXX, para não desconfigurar o vosso jogo...mas se acharem capazes força ;)

Os "#XXXXXX" representam um código de cor...

>>>VER LISTA DE CÓDIGOS DE COR<<< (http://www.computerhope.com/htmcolor.htm)
[/i]

Quote from: global.css
body {
   font-family: Trebuchet MS, Tahoma;
   color:#XXXXX;(textos de avisos) VER (http://img247.imageshack.us/img247/1491/66855588xa4.jpg)
   font-size:12px;
   margin-top:5px;
   background-color: #XXXXXX;(background do menu) VER (http://img95.imageshack.us/img95/7035/48174708fj0.jpg)
   background-repeat:no-repeat;
   background-attachment: fixed;
}

body.normal, body.log {
   background-image: url("../img/bg/background.jpg");
   background-position: right;
}

table {
   color:#XXXXXX; (cores gerais) VER (http://img206.imageshack.us/img206/3821/44017292oh1.jpg)
   font-family: Trebuchet MS, Tahoma;
   font-size:12px;
   border-style:hidden;
   border-color:#XXXXX; (não sei)
   empty-cells: show;
}

table.eco {
   border: none;
   font-size: 11px;
   font-weight: bold;
   padding: 5px;
   margin-top:0px;
   margin-bottom:10px;
}

.tooltip {
   font-size:11px;
   color:#XXXXX; (letras dos tooltips) VER (http://img359.imageshack.us/img359/787/47186407wq4.jpg)
   opacity:.90;
   text-align: center;
   padding: 5px;
   width:215px;
   background-color: #XXXXXX; (background dos tooltips) VER (http://img185.imageshack.us/img185/1503/86470440jy5.jpg)
   border: 1px solid #XXXXX; (bordas dos tooltips) VER (http://img359.imageshack.us/img359/787/47186407wq4.jpg)
   line-height: 18px;
}

.stt { border-bottom: 1px solid #444; }

tr.hover:hover, tr.sethover, td.hover:hover, td.hover:hover { background-color: #XXXXX; } (seleccionar) VER (http://img516.imageshack.us/img516/6174/71098969lv2.jpg)

a {
   color:#XXXXXX; (letras menu) VER (http://img501.imageshack.us/img501/5948/19809294wp1.jpg)
   text-decoration: underline;
   cursor: pointer;
}

a:hover { text-decoration:underline; }
a.noline, a.noline:hover { text-decoration: none; }

img { border-style:none; }

input {
   background-color: #XXXXXX; VER (http://img523.imageshack.us/img523/2474/11433884az4.jpg)
   color: #XXXXXX; VER (http://img523.imageshack.us/img523/4236/91795836cl4.jpg)
   border-color: #XXXXXX; (não sei)
}

textarea {
   border-style:solid;
   border-width:1px;
   color:#XXXXXX; (acho que não funciona muito bem, mas é nas letras das msgs)
   background-color: #XXXXXX; (background a escrever msgs)
border-color:#XXXXXX; VER (http://img169.imageshack.us/img169/9923/10qk0.jpg)
}

td.br { border-right: #XXXXXX solid 1px; }
td.bl { border-left: #XXXXXX solid 1px; }
td.bt { border-top: #XXXXXX solid 1px; }
tr.bb td, td.bb { border-bottom: #XXXXXX solid 1px; } (linha na vista geral, edifício, laboratório, hangar, armamento) VER (http://img169.imageshack.us/img169/8923/11qq7.jpg)

tr.h30 { height: 30px; }
tr.h28 { height: 28px; }

p.text {
   text-align:center;
   margin-top: 30px;
   margin-bottom: 30px;
   font-style: italic;
   font-size: 12px;
}

.noborder {
   border-style: none;
   border-width: 0px;
}

input.text {
   border: 1px solid #XXXXXX; VER (http://img517.imageshack.us/img517/9941/12jg5.jpg)
   padding-left: 2px;
   font-size: 11px;
}

input.button {
   border: 1px solid #XXXXXX; VER (http://img508.imageshack.us/img508/4610/13zx4.jpg)
   font-size: 11px;
}

.xmini { font-size: 10px; }
.mini { font-size: 11px; }
.medium { font-size: 14px; }
.big { font-size: 17px; }
.b, .bold { font-weight: bold; }
.center { text-align: center; }
.red { color: #F44; }
.blue { color: #69C; }
.green { color: #4C4; }
.orange { color: #FA2; }
.grey { color: #555; }
.white { color: #AAA; } (hotkeys das msgs)

li {
   line-height: 1.5em;
   list-style-type: square;
   margin: .2em 0 0 0;
   padding: 0;
   list-style-image: url(../img/bg/bullet.gif);
}

ul.nl0, ul.nl1, ul.nl2, ul.nl3, ul.nl4, ul.nl5 {
   padding: 0;
   margin: 0;
}

ul.nl1 { padding-left: 2em; }
ul.nl2 { padding-left: 4em; }
ul.nl3 { padding-left: 6em; }
ul.nl4 { padding-left: 8em; }
ul.nl5 { padding-left: 10em; }

tr.sep td, td.sep { border-bottom: 1px solid #XXX; }
tr.sept td, td.sept { border-top: 1px solid #XXX; } (não sei)
td.left { text-align: left; }
td.right { text-align: right; }
label.ecored { font-size: 12px; font-weight: bold; }

table.eco {
   width: 760px;
   font-size: 11px;
   font-weight: normal;
   background-position: bottom center;
   background-repeat: no-repeat;
   color: #XXXXXX; (recursos) VER (http://img183.imageshack.us/img183/2536/14ou4.jpg)
   margin-bottom: 20px;
}

table.ecobig { background-image: url("../img/bg/ecobback.png"); }
td.ecobheight { height: 45px; }
td.ecosheight { height: 25px; }

td.econormal {
   background-repeat: no-repeat;
   background-position: center;
   width: 88px;
   text-align: center;
}

td.ecospecial {
   background-repeat: no-repeat;
   background-position: center;
   width: 135px;
   text-align: center;
}

td.ecobmetal { background-image: url("../img/bg/ecobmetal.png"); }
td.ecobdiamond { background-image: url("../img/bg/ecobdiamond.png"); }
td.ecobhydrogen { background-image: url("../img/bg/ecobhydrogen.png"); }
td.ecobzion { background-image: url("../img/bg/ecobzion.png"); }
td.ecobnanite { background-image: url("../img/bg/ecobnanite.png"); }
td.ecobenergy { background-image: url("../img/bg/ecobenergy.png"); }
td.ecobrobots { background-image: url("../img/bg/ecobrobots.png"); }

td.ecosmetal { background-image: url("../img/bg/ecosmetal.png"); }
td.ecosdiamond { background-image: url("../img/bg/ecosdiamond.png"); }
td.ecoshydrogen { background-image: url("../img/bg/ecoshydrogen.png"); }
td.ecoszion { background-image: url("../img/bg/ecoszion.png"); }
td.ecosnanite { background-image: url("../img/bg/ecosnanite.png"); }
td.ecosenergy { background-image: url("../img/bg/ecosenergy.png"); }
td.ecosrobots { background-image: url("../img/bg/ecosrobots.png"); }

div.econame { font-size: 12px; font-weight: bold;}
div.ecovalue { position: relative; top: 2px;}

td.empty { width: 10px; }

table.help {
   width: 760px;
   margin-bottom: 15px;
   line-height:17px;
   border-collapse: collapse;
}

tr.b760 {
   background-image: url("../img/bg/back.png");
   background-repeat: repeat-y;
}

tr.b760t {
   height: 5px;
   background-image: url("../img/bg/bt760.png");
   background-position: top;
}

tr.b760b {
   height: 5px;
   background-image: url("../img/bg/bt760.png");
   background-position: bottom;
}

tr.b670 {
   background-image: url("../img/bg/back.png");
   background-repeat: repeat-y;
   width: 670px;
}

tr.b670t {
   height: 5px;
   background-image: url("../img/bg/bt670.png");
   background-position: top;
}

tr.b670b {
   height: 5px;
   background-image: url("../img/bg/bt670.png");
   background-position: bottom;
}

tr.bo720 {
   background-image: url("../img/bg/oback.png");
   background-repeat: repeat-y;
   width: 670px;
}

tr.bo720t {
   height: 5px;
   background-image: url("../img/bg/bot720.png");
   background-position: top;
}

tr.bo720b {
   height: 5px;
   background-image: url("../img/bg/bot720.png");
   background-position: bottom;
}

tr.b720 {
   background-image: url("../img/bg/back.png");
   background-repeat: repeat-y;
   width: 670px;
}

tr.b720t {
   height: 5px;
   background-image: url("../img/bg/bt720.png");
   background-position: top;
}

tr.b720b {
   height: 5px;
   background-image: url("../img/bg/bt720.png");
   background-position: bottom;
}

table.b670 {
   width: 670px;
   border-collapse: collapse;
}

table.b760 {
   width: 760px;
   border-collapse: collapse;
}

table.b720 {
   width: 720px;
   border-collapse: collapse;
}

td.pad {
   padding-left: 8px;
   padding-right: 8px;
}

table.justify td, td.justify {
   text-align: justify;
   padding-right: 5px;
   padding-left: 5px;
}

table.cell {
   border-collapse: collapse;
}
/* --- */

td.helptext {
   padding: 0px 10px 0px 10px;
   text-align: justify;
}

.helptop {
   position: absolute;
   top: 5px;
   right: 10px;
}

div.helpimg, div.helpimg2 {
   width: 25px;
   height: 25px;
   background-image: url("../img/bg/infomini.png");   
   background-position: center;
   cursor: pointer;
}

body, table, input, select, font {
   font-family: "Trebuchet MS";
   font-size: 12px;
}

ul.subhelp, ul.help { margin: 0px; padding: 0px; padding-top: 2px;}
ul.subhelp { padding-left: 20px; }

select {
   background-color: black;
   border: solid 1px;
   font-family: Trebuchet MS;
   font-size: 12px;
   text-align: left;
   color: #XXXXXX; VER (http://img413.imageshack.us/img413/6619/15se1.jpg)
   border-color: #XXXXXX; VER (http://img299.imageshack.us/img299/6481/16nb8.jpg)
}

select.unitslist {
   width: 250px;
   border: 1px solid #XXX; VER (http://img397.imageshack.us/img397/5706/17fo0.jpg)
   background-color: #XXX; VER (http://img299.imageshack.us/img299/9849/18ss4.jpg)
}

img.avatar { width: 80px; height: 80px; }

.playerstate { color: #XXX; font-family: Trebuchet MS; font-weight: bold; font-size: 11px;} (estado V, I, N, E, P do observatório)

input.center {
   border: 1px solid #XXX; VER (http://img359.imageshack.us/img359/4512/19eo2.jpg)
   font-size: 11px;
   text-align: center;
}

/* TABS */
td.tabini, td.tabend, td.tabnormal, td.tabactual, td.tabnormalh, td.tabactualh {
   background-image: url("../img/bg/tabs.png");
   background-repeat: no-repeat;
}

td.tabsep { background-image: url("../img/bg/tabsep.png"); }

td.hidebarini, td.hidebarend, td.hidebar {
   background-image: url("../img/bg/tabs.png");
   background-repeat: no-repeat;
   height: 30px;
}

Quote from: menu.css
body { margin: 0px 0px 0px 0px; }
font.hotkey { font-size:10px; }

td { text-align: center; }

div {
   cursor: pointer;
   background-repeat: no-repeat;
   background-position: center;
   text-align: center;
}

table.menutopbase, td.menucat, td.menuplanetsel {
   background-repeat: no-repeat;
   background-position: center;
}

table.menutopbase {
   background-image: url("../img/bg/menutopbase.png");
   background-position: center top;
   height: 32px;
}

div.menutopmsg { height: 22px; background-image: url("../img/bg/menutopmsg.png"); }
div.menuontime { height: 22px; background-image: url("../img/bg/menunewmsg.png"); }
div.menutopnotes { height: 22px; background-image: url("../img/bg/menutopnotes.png"); }
div.menutoppanel { height: 22px; background-image: url("../img/bg/menutoppanel.png"); }
div.menutopexit { height: 22px; background-image: url("../img/bg/menutopexit.png"); }

td.menutopmsg { width: 34%; }
td.menutopnotes, td.menutopcfg, td.menutopexit { width: 22%; }

div.menuoptions { background-image: url("../img/bg/menuoptions.png"); }
div.menuoptions:hover, div.menuoptionsh { background-image: url("../img/bg/menuoptionsh.png"); }

div.menutopmsg:hover, div.menutopmsgh { height: 22px; background-image: url("../img/bg/menutopmsgh.png"); }
div.menuontime:hover, div.menuontimeh { height: 22px; background-image: url("../img/bg/menunewmsgh.png"); }
div.menutopnotes:hover, div.menutopnotesh { height: 22px; background-image: url("../img/bg/menutopnotesh.png"); }
div.menutoppanel:hover, div.menutoppanelh { height: 22px; background-image: url("../img/bg/menutoppanelh.png"); }
div.menutopexit:hover, div.menutopexith { height: 22px; background-image: url("../img/bg/menutopexith.png"); }
   
td.menucat {
   background-image: url("../img/bg/menucat.png");
   text-align: right;
   background-position: top;
   font-size: 9px;
   color: #XXXXXX; VER (http://img393.imageshack.us/img393/7/20bs4.jpg)
   font-weight: normal;
   height:14px;
}

label.menucat { position: relative; top: 2px; }

td.menuplanet {
   width: 32px;
   height: 40px;
   cursor: pointer;
}

td.menuplanetsel {
   width: 32px;
   height: 40px;
   border-style: none;
   cursor: pointer;
   background-image: url("../img/bg/menuplanetsel.png");
}
   
table.menutable { width: 95px; }
table.bigone {}
table.planets {}


Quote from: Observatory.css
table.obs { margin-top: 5px; font-size: 11px; }

td.team, td.friend, td.enemy, td.region, td.sel, td.selh,
td.miniteam, td.minifriend, td.minienemy, td.miniregion,
td.teamh, td.friendh, td.enemyh, td.regionh {
   background-repeat: no-repeat;
   background-position: center;
}

td.team { background-image: url("../img/bg/obsteam.png"); }
td.friend { background-image: url("../img/bg/obsfriend.png"); }
td.enemy { background-image: url("../img/bg/obsenemy.png"); }
td.region { background-image: url("../img/bg/obsregion.png"); }
td.sel, td.selh { background-image: url("../img/bg/obssel.png"); }

td.team:hover, td.teamh { background-image: url("../img/bg/obsteamh.png"); }
td.friend:hover, td.friendh { background-image: url("../img/bg/obsfriendh.png"); }
td.enemy:hover, td.enemyh { background-image: url("../img/bg/obsenemyh.png"); }
td.region:hover, td.regionh { background-image: url("../img/bg/obsregionh.png"); }

td.obs { height: 89px; width: 104px; text-align: center;}
table.obsblue {
   background-repeat: no-repeat;
   background-position: center;
   background-image: url("../img/bg/obsblue.png");
}
table.nreg { width: 95%; height: 98%; }
td.legend { height: 20px; }

td.radio { width: 30px; }
td.name { width: 70px; }
td.bigname { width: 105px; }
input.probes { width: 40px; text-align: center; }
input.nav { width: 40px; height: 24px; }
input.disabled { color: #XXX; border-color: #XXX; font-style: italic; } (não sei)
tr.nav { height: 26px; }

td.vtab {  font-size: 13px; }
td.vtab:hover, td.vtabh { font-weight: bold; font-size: 13px; }

td.obsmap { background-image: url("../img/bg/map.png"); }
td.obsmap2 { background-image: url("../img/bg/map2.png"); }
td.obsmap, td.obsmap2 {
   background-repeat: no-repeat;
   background-position: center;
   width: 35px;
   height: 35px;
}

Quote from: tex.css
/* Notas */
textarea.note {
   font-size: 11px;
   width: 575px;
   height: 100px;
   padding: 2px 0px 2px 2px;
}
div.note {
   padding: 5px;
   text-align: justify;
}
input.tnote { width: 300px; }

/* Mensagens */
font.num {
   font-style: italic;
   font-size: 11px;
}
table.systemmsg {
   width: 99%;
   height: 100%;
}
div.normalmsg {
   width: 100%;
   height: 103px;
   overflow: auto;
}
td.noavatar { padding-left: 3px; }

/* Envio de Mensagens */
input.sendw { width: 200px; }
textarea.sendmsg {
   width: 460px;
   height: 180px;
   padding: 2px;
}
td.warn { text-align: justify; }

/* Requisitos */
table.lreq {
   color: #XXXXXX; (barra dos requisitos) VER (http://img410.imageshack.us/img410/5236/21zz4.jpg)
   width: 600px;
   line-height: 22px;
   border-collapse: collapse;
}

table.lreq a {
   text-decoration: none;
   color:#XXXXXX; (barra do nome - requistos) VER (http://img403.imageshack.us/img403/6507/22av9.jpg)
}

/* Simulador */
td.sti {
   width: 50px;
   font-size: 11px;
   border-bottom:solid 1px;
}

/* Estatisticas */
table.stat {
   font-size: 11px;
   width: 720px;
}
table.stop {
   margin-bottom: 10px;
   width: 325px;
}
table.sttop { width: 710px; }
td.points { width: 90px; }
td.totalp {
   width: 100px;
   font-weight: bold;
}

/* Jogadores*/
input.pname { width: 150px; }
input.pinv { width: 350px; }
table.ttplayers {
   width: 200px;
   font-size:11px;
   color: #XXXXXX; (não sei)
}

/* Mercado */
td.meco, td.mmyeco {
   font-size:11px;
   width:120px;
   text-align:center;
   color:#XXXXXX; (letras de topo - Mercado) VER (http://img510.imageshack.us/img510/3007/23lz1.jpg)
}
td.mmyeco {
   font-weight: bold;
}
input.meco {
   width:100px;
   font-size: 11px;
   text-align: center;
}
td.mtrow {
   text-align:right;
   font-size:11px;
}
.bad {
   color:#XXXXXX; (mau - "vermelho")
   font-weight: bold;
}
.good {
   color:#XXXXXX; (bom - "verde")
   font-weight: bold;
}

tr.mb670 {
   background-image: url("../img/bg/mback.png");
   background-repeat: repeat-y;
   width: 680px;
}

tr.mb670t {
   height: 5px;
   background-image: url("../img/bg/mbt670.png");
   background-position: top;
}

tr.mb670b {
   height: 5px;
   background-image: url("../img/bg/mbt670.png");
   background-position: bottom;
}

/* Espiar */
tr.empty { height: 18px; }
tr.spy { line-height: 22px; }
td.spyhide { text-decoration: underline; cursor: pointer; }
input.disab { border: 1px solid; color: #XXX; text-align: center; } (não sei)
input.enab { border: 1px solid; color: #XXX; text-align: center; } (não sei)

/* Genérico */
input.feco { width:90px; }

table.regions {
   font-size:11px;
   padding:3px;
   color: #XXXXXX; VER (http://img262.imageshack.us/img262/2889/28yp0.jpg)
}

/* Imperio */
table.empire {
   margin-left: 10px;
   font-size: 11px;
}

/* Vista Geral */
td.vgplanets {
   border: solid 1px;
   border-color:#XXXXXX; VER (http://img204.imageshack.us/img204/9573/25ip5.jpg)
   width: 131px;
   height: 120px;
   background-color:#XXXXXX; VER (http://img410.imageshack.us/img410/8007/24hf0.jpg)
   font-size:10px;
   cursor:pointer;
}

td.onplanet { opacity: 0.5; }
td.offplanet { opacity: 1.0; }

td.cleanplanet {
   width: 131px;
   height: 120px;
}

td.vgcenterp {
   border: solid 1px;
   background-color:#XXXXXX; VER (http://img410.imageshack.us/img410/4062/26gg5.jpg)
   border-color:#XXXXXX; VER (http://img262.imageshack.us/img262/3107/29sd3.jpg)
}

table.msgunread {
   border: 1px solid;
   height: 28px;
   margin-bottom: 10px;
   width: 700px;
}

font.destak {
   color: #XXXXXX; VER (http://img373.imageshack.us/img373/1581/27cw2.jpg)
   font-weight: bold;   
}

/* Relatórios de Ataque */
td.warb, td.warbl, td.warbr {
   background-image: url("../img/bg/bwar.png");
   background-repeat: no-repeat;
   height: 30px;
}

td.warb { background-position: center; }
td.warbl { background-position: left; }
td.warbr { background-position: right; }

td.warob, td.warobl, td.warobr {
   background-image: url("../img/bg/bowar.png");
   background-repeat: no-repeat;
   height: 30px;
}

td.warob { background-position: center; }
td.warobl { background-position: left; }
td.warobr { background-position: right; }

tr.wsp { height: 10px; }

Alujamento

Sugestões

LINK UTEIS

Agradeço as vossas sugestões para melhorar o Tut... ;) espero que vos seja util  :fine[/list]
Title: Re: TUTORIAL - Contrução de Skins
Post by: Icaro on July 27, 2008, 20:26:10
excelente trabalho!

Stiky  :fine
Title: Re: TUTORIAL - Contrução de Skins
Post by: Dead_punK on July 27, 2008, 21:55:32
Grande ajuda :fine

Mas só quem tem serviços pagos e que pode fazer e usar a sua skin, não é?
Title: Re: TUTORIAL - Contrução de Skins
Post by: GodFather. on July 27, 2008, 22:27:52
Todos podem fazer mas apenas jogadores com serviços pagos as podem usar...

talvez quando o jogo estiver mais avançado e começar a dar lucro, isso possa mudar... :fine
Title: Re: TUTORIAL - Contrução de Skins
Post by: OCoiso on July 27, 2008, 23:53:22
Muito bom stunt  :fine :fine
Já andava aqui as voltas para criar uma, com isto vai ser mais fácil  :P
Title: Re: TUTORIAL - Contrução de Skins
Post by: KUKA on July 28, 2008, 01:41:11
Epá, vais me desculpar, mas onde é que está esse tutorial?

Eu aqui só vejo código, não vejo nenhum tutorial sobre como mudar x e y...
Title: Re: TUTORIAL - Contrução de Skins
Post by: Falken on July 28, 2008, 04:50:16
Kuka os comentários no código ajudam a perceber ao que as mudanças se referem...  ;)

Bom trabalho  :fine
Title: Re: TUTORIAL - Contrução de Skins
Post by: KUKA on July 28, 2008, 09:28:18
ahhhhh

Quer dizer que o que está entre parêntesis não faz parte? É a explicação do que estamos a editar?

 :fine
Title: Re: TUTORIAL - Contrução de Skins
Post by: Rock'N'Rolla on July 28, 2008, 18:56:46
Quote from: global.css
body.normal, body.log {
   background-image: url("../img/bg/background.jpg");
   background-position: right;
}

Edit:a img foi removida
esta imagem e' o que está na citaçao??

mas eu qeria mudar de imagem do fundo, como eu faço??? :th :th

Title: Re: TUTORIAL - Contrução de Skins
Post by: GodFather. on July 28, 2008, 18:59:03
 :-D

Fazes download dos ficheiros originais das Skins, para editar...

ai estão os ficheiros .CSS com explicação entre () e tens a frente de todos os #XXXXXX um url de uma imagem que mostra a modificação... :fine
>>> VER LISTA DE CÓDIGOS DE COR <<< (http://www.computerhope.com/htmcolor.htm)

 :fine

EDITADO: nome do post principal para TUTORIAL - Contrução/Edição de Skins
Title: Re: TUTORIAL - Contrução de Skins
Post by: GodFather. on July 28, 2008, 19:02:02
Quote from: Gothic on July 28, 2008, 18:56:46
Quote from: global.css
body.normal, body.log {
   background-image: url("../img/bg/background.jpg");
   background-position: right;
}

http://i241.photobucket.com/albums/ff90/killer12_17/background.jpg
esta imagem e' o que está na citaçao??

mas eu qeria mudar de imagem do fundo, como eu faço??? :th :th

 :P... Basta ires a pasta IMG > BJ > eliminares o ficheiro background.jpg... e colocares nessa mesma pasta a tua imagem com o nome background no formato .jpg


:fine


Title: Re: TUTORIAL - Contrução/Edição de Skins
Post by: Rock'N'Rolla on July 28, 2008, 19:06:14
Obrigadaoooooo..  :-D :-D :-D

excelente TUTORIALLL  :fine :fine

Qero q venha ai mais IDEIAS  :P :P

Continua assim  :fine
Title: Re: TUTORIAL - Contrução/Edição de Skins
Post by: Rock'N'Rolla on July 28, 2008, 19:29:31
Mais outra duvida  :-[

o meu skin ta pronto..

e como é que eu faço para ter o Url do meu skin ?? :th :th
Title: Re: TUTORIAL - Contrução/Edição de Skins
Post by: GodFather. on July 28, 2008, 19:43:18
Quote from: Gothic on July 28, 2008, 19:29:31
Mais outra duvida  :-[

o meu skin ta pronto..

e como é que eu faço para ter o Url do meu skin ?? :th :th

Alujamento

    * Fazer hosting dos ficheiros, mantendo o nome e a organização das pastas originais
    * O URL indicado deverá ter na raiz a pasta "img" e a "css".

Se fores cliente cabovisão tens um servidor FTP...mas existem muitos servidores outros servidores grátis que podes arranjar, podem é não ser de confiança ... só tens de procurar  :fine

p.s - se quiseres manda-me um MP, com o teu mail...e eu faço-te hosting dos ficheiros :fine
Title: Re: TUTORIAL - Contrução/Edição de Skins
Post by: Rock'N'Rolla on July 29, 2008, 22:24:53

http://i241.photobucket.com/albums/ff90/killer12_17/duvida.jpg

Quote from: global.css
textarea {
   border-style:solid;
   border-width:1px;
   color: #9900CC
   background-color: transparent;
   border-color: #9900CC;

a minha questao e' porque que isto (imagem) ta branco como no codigo que pôs, ta' transparete..??? :th :th
Title: Re: TUTORIAL - Contrução/Edição de Skins
Post by: Rock'N'Rolla on July 30, 2008, 17:34:24
ninguem sabe dizer o q se passa??
Title: Re: TUTORIAL - Contrução/Edição de Skins
Post by: Bruno on July 31, 2008, 02:29:18
Quote from: Gothic on July 29, 2008, 22:24:53
Quote from: global.css
textarea {
   background-color: transparent;
}
Encontras-te a usar o Internet Explorer? Eu lembro-me que tive problemas com o transparent no IE e não consegui dar a volta. (se estás, testa no Firefox e vê se aparece bem)
Title: Re: TUTORIAL - Contrução/Edição de Skins
Post by: Rock'N'Rolla on July 31, 2008, 03:12:50
realmente estou a usar o firefox..
Title: Re: TUTORIAL - Contrução/Edição de Skins
Post by: fpereira91 on July 31, 2008, 14:51:13
Muito bom!!

Tenho k tentar um dia!!

XD
Title: Re: TUTORIAL - Construção/Edição de Skins
Post by: Magikrap on September 12, 2008, 16:23:38
http://img254.imageshack.us/img254/959/helplj5.jpg

boas tardes.. vou tentar explicar isto em português.  :P :-D :P

Eu queria pôr um fundo que ta seleccionado com um rectângulo da seta 1 igual ao fundo que esta' apontar da seta 2
e não consigo encontrar o código la' nenhum da parte dos ficheiros. será que alguém podia ajudar-me a edicar
que parte do codigo está ???

a skin ta pronta.. so' falta esta cena  :P :-D :P

obrigado  :fine
cumprimentos
Bourne
Title: Re: TUTORIAL - Construção/Edição de Skins
Post by: Magikrap on September 13, 2008, 06:37:52


http://img526.imageshack.us/img526/6076/corazuluk0.jpg

->onde ta azul em metal, hidrogéno, natites e robots, não da' mudar para verde??

http://img381.imageshack.us/img381/2476/corbrancopretocinzentoqu3.png
fui procurar um jogador aqi fica uma imagem
->onde ta o "assunto" ao lado ta uma caixa.. o que eu escrevo é preto, qeria verde e nao consigo encontrar.. nem mudar.. :(
alguem podia ajudar ?
->a mesma imagem, na caixa onde eu escrevo aparece branco.. pq?? enviar mensagem pelo pop-up aparece igual como eu qeria.. mas aqi nao :S e ao escrever fica cinzento o q eu escrivi mas qeria verde, nao da' para mudar???
-> ali em baixo onde diz "numeros de caracters:0/1000" tá uma cena que e' aa clicar qando qer enviar mas nas letras ta preto e qeria verde tbm. vi todas das imagens que o godfather pôs umas delas nao funciona.

http://img527.imageshack.us/img527/7415/corpretoal3.jpg

-> aqele numero ta preto e o fundo sem selecionar e' perto qeria q os numeros fossem verdes..



NINHUM DESTAS IMAGENS ENCONTRO O CODIGO!! :(
Title: Re: TUTORIAL - Construção/Edição de Skins
Post by: Bruno on September 20, 2008, 14:07:12
Diz-me uma coisa... usas que Browser? E queres ter compatibilidade com IE6? (dificulta as coisas)
Title: Re: TUTORIAL - Construção/Edição de Skins
Post by: Magikrap on September 20, 2008, 14:10:26
Quote from: Bruno on September 20, 2008, 14:07:12
Diz-me uma coisa... usas que Browser? E queres ter compatibilidade com IE6? (dificulta as coisas)

uso mozilla firefox 3 br-pt
Title: Re: TUTORIAL - Construção/Edição de Skins
Post by: Bruno on September 20, 2008, 15:19:09
Para o texto do assunto deves conseguir alterar usando no global o "input" no "color".
Código actual:
Code: [Select]
input {
background-color: transparent;
color: #AAAAAA;
border-color: #888888;
}

Caso não altere tenta no mesmo ficheiro no "input.text" no "color".
Código actual:
Code: [Select]
input.text {
border: 1px solid #888;
padding-left: 2px;
font-size: 11px;
}

Quanto ao sitio onde escreves a mensagem tenta no global.css, no "textarea" em "background-color" meter preto.
Código actual:
Code: [Select]
textarea {
border-style:solid;
border-width:1px;
color:#AAAAAA;
background-color:transparent;
border-color:#888888;
}
Quanto à economia só consegues meter tudo verde se alterares o código do "blue" para mesma cor que o "green" (tb no global.css).
Código actual:
Code: [Select]
.blue { color: #69C; }
.green { color: #4C4; }

Quanto ao texto do botão experimenta adicionar o "color" no seguinte texto:
Code: [Select]
input.button {
border: 1px solid #AAA;
font-size: 11px;
}
Se não te safares diz! ;)
Title: Re: TUTORIAL - Construção/Edição de Skins
Post by: Spartaco on September 20, 2008, 18:03:34
Como é que se edita as cores de fundo, letras e limites do chat?
Title: Re: TUTORIAL - Construção/Edição de Skins
Post by: Bruno on September 20, 2008, 18:52:50
Quote from: Spartaco on September 20, 2008, 18:03:34
Como é que se edita as cores de fundo, letras e limites do chat?
O chat por agora não permite skins pessoais :(
Title: Re: TUTORIAL - Construção/Edição de Skins
Post by: Spartaco on September 20, 2008, 19:13:05
mau  :'( :'( :'( :'( :'(

mas espero que quando vierem as .css actualizadas tb adicionem essa opção  :fine :fine :fine :fine