diff --git a/js/client-battle.js b/js/client-battle.js index 956585d69da..bad59ff9f97 100644 --- a/js/client-battle.js +++ b/js/client-battle.js @@ -334,6 +334,9 @@ if (this.request) { // TODO: investigate when to do this this.updateSide(this.request.side); + if (this.request.ally) { + this.addAlly(this.request.ally); + } act = this.request.requestType; if (this.request.side) { @@ -390,7 +393,7 @@ break; case 'team': - if (this.battle.mySide.pokemon && !this.battle.mySide.pokemon.length) { + if (this.battle.nearSide.pokemon && !this.battle.nearSide.pokemon.length) { // too early, we can't determine `this.choice.count` yet // TODO: send teamPreviewCount in the request object return; @@ -402,6 +405,9 @@ done: 0, count: 1 }; + if (this.battle.gameType === 'multi') { + this.choice.count = 1; + } if (this.battle.gameType === 'doubles') { this.choice.count = 2; } @@ -514,7 +520,8 @@ } var moveTarget = this.choice ? this.choice.moveTarget : ''; - var pos = this.choice.choices.length - (type === 'movetarget' ? 1 : 0); + var pos = this.choice.choices.length; + if (type === 'movetarget') pos--; var hpRatio = switchables[pos].hp / switchables[pos].maxhp; @@ -551,6 +558,10 @@ if (type === 'movetarget') { requestTitle += 'At who? '; + if (this.request && this.request.side) { + pos += Math.floor((parseInt(this.side.charAt(1), 10) - 1) / 2); + } + var targetMenus = ['', '']; var nearActive = this.battle.nearSide.active; var farActive = this.battle.farSide.active; @@ -710,7 +721,14 @@ '
' + switchMenu + '
' + '' ); - + /*if (this.battle.mySide.ally) { + this.$allyPokemon.html( + '
' + + '
' + + '
' + this.displayAllyParty() + '
' + + '
' + ); + }*/ this.$controls.html( '
' + '
' + requestTitle + this.getTimerHTML() + '
' + @@ -725,12 +743,25 @@ var pokemon = switchables[i]; pokemon.name = pokemon.ident.substr(4); var tooltipArgs = 'switchpokemon|' + i; - if (pokemon.fainted || i < this.battle.nearSide.active.length || this.choice.switchFlags[i] || trapped) { + if (pokemon.fainted || (i < this.battle.nearSide.active.length && i < this.battle.pokemonControlled) || this.choice.switchFlags[i] || trapped) { party += ' '; } else { party += ' '; } } + if (this.battle.nearSide.ally) party += this.displayAllyParty(); + return party; + }, + displayAllyParty: function () { + var party = ''; + if (!this.battle.nearSide.ally) return; + var allyParty = this.battle.nearSide.ally.myPokemon; + for (var i = 0; i < allyParty.length; i++) { + var pokemon = allyParty[i]; + pokemon.name = pokemon.ident.substr(4); + var tooltipArgs = 'allypokemon|' + i; + party += ' '; + } return party; }, updateSwitchControls: function (type) { @@ -755,7 +786,7 @@ // TODO? hpbar requestTitle += "Which Pokémon will it switch in for?"; var controls = '
'; - for (var i = 0; i < nearActive.length; i++) { + for (var i = 0; i < nearActive.length && i < this.battle.pokemonControlled; i++) { var pokemon = this.battle.myPokemon[i]; var tooltipArgs = 'switchpokemon|' + i; if (pokemon && !pokemon.fainted || this.choice.switchOutFlags[i]) { @@ -784,8 +815,8 @@ for (var i = 0; i < switchables.length; i++) { var pokemon = switchables[i]; var tooltipArgs = 'switchpokemon|' + i; - if (pokemon.fainted || i < this.battle.nearSide.active.length || this.choice.switchFlags[i]) { - switchMenu += '
`; } pokemonhtml = '
' + pokemonhtml + '
'; + const ratinghtml = side.rating ? ` title="Rating: ${BattleLog.escapeHTML(side.rating)}"` : ``; + let posStr = ""; + if (isAlly) { + if (side.ally === this.battle.nearSide || side === this.battle.nearSide.ally) { + posStr += "p3"; + } else { + posStr += "p4"; + } + } else { + posStr = side === this.battle.nearSide ? "p1" : "p2"; + } + return `
${BattleLog.escapeHTML(side.name)}
${pokemonhtml}
`; + } + updateSidebar(side: Side) { const $sidebar = (side.isFar ? this.$rightbar : this.$leftbar); + let sidebarhtml = this.getSidebarHTML(side) + (side.ally ? this.getSidebarHTML(side.ally, true) : ''); if (side.name) { - const ratinghtml = side.rating ? ` title="Rating: ${BattleLog.escapeHTML(side.rating)}"` : ``; - $sidebar.html(`
${BattleLog.escapeHTML(side.name)}
${pokemonhtml}
`); + $sidebar.html(sidebarhtml); $sidebar.find('.trainer').css('opacity', 1); } else { $sidebar.find('.trainer').css('opacity', 0.4); } } updateSidebars() { - for (const side of this.battle.sides) this.updateSidebar(side); + this.$leftbar.html(this.getSidebarHTML(this.battle.nearSide) + (this.battle.nearSide.ally ? this.getSidebarHTML(this.battle.nearSide.ally, true) : '')); + this.$rightbar.html(this.getSidebarHTML(this.battle.farSide) + (this.battle.farSide.ally ? this.getSidebarHTML(this.battle.farSide.ally, true) : '')); } updateStatbars() { for (const side of this.battle.sides) { @@ -708,8 +721,8 @@ class BattleScene { } teamPreviewEnd() { - for (let siden = 0; siden < 2; siden++) { - this.$sprites[siden].empty(); + for (let siden = 0; siden < this.battle.sides.length; siden++) { + this.$sprites[siden % 2].empty(); this.battle.sides[siden].updateSprites(); } } @@ -717,7 +730,7 @@ class BattleScene { let newBGNum = 0; for (let siden = 0; siden < 2; siden++) { const side = this.battle.sides[siden]; - const spriteIndex = +this.battle.sidesSwitched ^ siden; + const spriteIndex = +this.battle.sidesSwitched ^ (siden % 2); let textBuf = ''; let buf = ''; let buf2 = ''; diff --git a/src/battle-scene-stub.ts b/src/battle-scene-stub.ts index 31005f6f56f..6728ef167ef 100644 --- a/src/battle-scene-stub.ts +++ b/src/battle-scene-stub.ts @@ -44,6 +44,7 @@ class BattleSceneStub { teamPreview(): void { } teamPreviewEnd(): void { } updateGen(): void { } + getSidebarHTML(side: Side) { } updateSidebar(side: Side): void { } updateSidebars(): void { } updateStatbars(): void { } diff --git a/src/battle-text-parser.ts b/src/battle-text-parser.ts index 7acb5a9df8e..2ba53af649c 100644 --- a/src/battle-text-parser.ts +++ b/src/battle-text-parser.ts @@ -16,6 +16,8 @@ type KWArgs = {[kw: string]: string}; class BattleTextParser { p1 = "Player 1"; p2 = "Player 2"; + p3 = "Player 3"; + p4 = "Player 4"; perspective: 0 | 1; gen = 7; curLineSection: 'break' | 'preMajor' | 'major' | 'postMajor' = 'break'; @@ -226,7 +228,7 @@ class BattleTextParser { pokemonName = (pokemon: string) => { if (!pokemon) return ''; - if (!pokemon.startsWith('p1') && !pokemon.startsWith('p2')) return `???pokemon:${pokemon}???`; + if (!pokemon.startsWith('p1') && !pokemon.startsWith('p2') && !pokemon.startsWith('p3') && !pokemon.startsWith('p4')) return `???pokemon:${pokemon}???`; if (pokemon.charAt(3) === ':') return pokemon.slice(4).trim(); else if (pokemon.charAt(2) === ':') return pokemon.slice(3).trim(); return `???pokemon:${pokemon}???`; @@ -236,8 +238,10 @@ class BattleTextParser { if (!pokemon) return ''; let side; switch (pokemon.slice(0, 2)) { - case 'p1': side = 0; break; - case 'p2': side = 1; break; + case 'p1': + case 'p3': side = 0; break; + case 'p2': + case 'p4': side = 1; break; default: return `???pokemon:${pokemon}???`; } const name = this.pokemonName(pokemon); @@ -257,6 +261,8 @@ class BattleTextParser { side = side.slice(0, 2); if (side === 'p1') return this.p1; if (side === 'p2') return this.p2; + if (side === 'p3') return this.p3; + if (side === 'p4') return this.p4; return `???side:${side}???`; } @@ -409,6 +415,10 @@ class BattleTextParser { this.p1 = name; } else if (side === 'p2' && name) { this.p2 = name; + } else if (side === 'p3' && name) { + this.p3 = name; + } else if (side === 'p4' && name) { + this.p4 = name; } return ''; } diff --git a/src/battle-tooltips.ts b/src/battle-tooltips.ts index 25f8f951f7d..cc957dcbf06 100644 --- a/src/battle-tooltips.ts +++ b/src/battle-tooltips.ts @@ -273,9 +273,9 @@ class BattleTooltips { let move = this.battle.dex.getMove(args[1]); let index = parseInt(args[2], 10); let pokemon = this.battle.nearSide.active[index]; - let serverPokemon = this.battle.myPokemon![index]; let gmaxMove = args[3] ? this.battle.dex.getMove(args[3]) : undefined; if (!pokemon) return false; + let serverPokemon = pokemon.side === this.battle.nearSide.ally ? this.battle.nearSide.ally.myPokemon![index] : this.battle.myPokemon![index]; buf = this.showMoveTooltip(move, type, pokemon, serverPokemon, gmaxMove); break; } @@ -305,8 +305,24 @@ class BattleTooltips { // mouse over active pokemon // pokemon definitely exists, serverPokemon maybe let sideIndex = parseInt(args[1], 10); - let side = this.battle.sides[+this.battle.sidesSwitched ^ sideIndex]; let activeIndex = parseInt(args[2], 10); + let side = sideIndex ? this.battle.farSide : this.battle.nearSide; + if (this.battle.gameType === 'multi') { + if (activeIndex >= side.active.length) return; + if (activeIndex && side.sideid !== 'p3' && side.sideid !== 'p4') side = side.ally; + if (!activeIndex && (side.sideid === 'p3' || side.sideid === 'p4')) side = side.ally; + let pokemon = side.active[activeIndex]; + if (!pokemon) return; + let serverPokemon = null; + if (side === this.battle.nearSide && this.battle.myPokemon) { + serverPokemon = this.battle.myPokemon[0]; + } else if (side === this.battle.nearSide.ally && this.battle.nearSide.ally.myPokemon) { + serverPokemon = this.battle.nearSide.ally.myPokemon[0]; + } + if (!pokemon) return false; + buf = this.showPokemonTooltip(pokemon, serverPokemon, true); + break; + } let pokemon = side.active[activeIndex]; let serverPokemon = null; if (sideIndex === 0 && this.battle.myPokemon) { @@ -319,16 +335,30 @@ class BattleTooltips { case 'switchpokemon': { // switchpokemon|POKEMON // mouse over switchable pokemon // serverPokemon definitely exists, sidePokemon maybe - let side = this.battle.mySide; + // let side = this.battle.mySide; let activeIndex = parseInt(args[1], 10); let pokemon = null; - if (activeIndex < side.active.length) { + /* if (activeIndex < side.active.length && activeIndex < this.battle.pokemonControlled) { pokemon = side.active[activeIndex]; - } + if (pokemon && pokemon.side === side.ally) pokemon = null; + } */ let serverPokemon = this.battle.myPokemon![activeIndex]; buf = this.showPokemonTooltip(pokemon, serverPokemon); break; } + case 'allypokemon': { // allypokemon|POKEMON + // mouse over ally's pokemon + // serverPokemon definitely exists, sidePokemon maybe + // let side = this.battle.mySide.ally; + let activeIndex = parseInt(args[1], 10); + let pokemon = null; + /*if (activeIndex < side.pokemon.length) { + pokemon = side.pokemon[activeIndex] || side.ally ? side.ally.pokemon[activeIndex] : null; + }*/ + let serverPokemon = this.battle.nearSide.ally.myPokemon ? this.battle.nearSide.ally.myPokemon[activeIndex] : null; + buf = this.showPokemonTooltip(pokemon, serverPokemon); + break; + } case 'field': { buf = this.showFieldTooltip(); break; diff --git a/src/battle.ts b/src/battle.ts index c98a6a1823c..523b0773bf6 100644 --- a/src/battle.ts +++ b/src/battle.ts @@ -577,9 +577,11 @@ class Side { battle: Battle; name = ''; id = ''; + sideid: string; n: number; isFar: boolean; foe: Side = null!; + ally: Side = null!; avatar: string = 'unknown'; rating: string = ''; totalPokemon = 6; @@ -593,13 +595,15 @@ class Side { active = [null] as (Pokemon | null)[]; lastPokemon = null as Pokemon | null; pokemon = [] as Pokemon[]; + myPokemon = [] as ServerPokemon[] | null; /** [effectName, levels, minDuration, maxDuration] */ sideConditions: {[id: string]: [string, number, number, number]} = {}; - constructor(battle: Battle, n: number, isOpp?: boolean) { + constructor(battle: Battle, n: number, sideid: string, isOpp?: boolean) { this.battle = battle; this.n = n; + this.sideid = sideid; this.isFar = isOpp || !!n; this.updateSprites(); } @@ -1062,8 +1066,12 @@ class Battle { farSide: Side = null!; p1: Side = null!; p2: Side = null!; + p3?: Side = null!; + p4?: Side = null!; + me: Side = null!; myPokemon: ServerPokemon[] | null = null; - sides: [Side, Side] = [null!, null!]; + pokemonControlled = 0; + sides: Side[] = null!; lastMove = ''; gen = 7; @@ -1071,7 +1079,7 @@ class Battle { teamPreviewCount = 0; speciesClause = false; tier = ''; - gameType: 'singles' | 'doubles' | 'triples' = 'singles'; + gameType: 'singles' | 'doubles' | 'triples' | 'multi' = 'singles'; rated: string | boolean = false; isBlitz = false; endLastTurnPending = false; @@ -1106,7 +1114,6 @@ class Battle { constructor($frame: JQuery, $logFrame: JQuery, id = '') { this.id = id; - if (!$frame && !$logFrame) { this.scene = new BattleSceneStub(); } else { @@ -1138,13 +1145,18 @@ class Battle { return false; } init() { - this.p1 = new Side(this, 0); - this.p2 = new Side(this, 1); + this.p1 = new Side(this, 0, 'p1'); + this.p2 = new Side(this, 1, 'p2'); this.sides = [this.p1, this.p2]; this.p2.foe = this.p1; this.p1.foe = this.p2; this.nearSide = this.mySide = this.p1; this.farSide = this.p2; + if (this.id.includes('multi')) { + this.p3 = new Side(this, 0, 'p3'); + this.p4 = new Side(this, 1, 'p4'); + this.sides.push(this.p3, this.p4); + } this.gen = 7; this.reset(); } @@ -1163,6 +1175,7 @@ class Battle { if (side) side.reset(); } this.myPokemon = null; + this.setAttrs(); // DOM state this.scene.reset(); @@ -1192,12 +1205,31 @@ class Battle { this.farSide = null!; this.p1 = null!; this.p2 = null!; + this.p3 = null!; + this.p4 = null!; } log(args: Args, kwArgs?: KWArgs, preempt?: boolean) { this.scene.log.add(args, kwArgs, preempt); } + setAttrs() { + this.sides = [this.p1, this.p2]; + this.p2.foe = this.p1; + this.p1.foe = this.p2; + if (this.id.includes('multi') && this.p3 && this.p4) { + this.p3.foe = this.p2; + this.p3.ally = this.p1; + this.p1.ally = this.p3; + this.p4.ally = this.p2; + this.p2.ally = this.p4; + this.p4.foe = this.p1; + this.sides.push(this.p3, this.p4); + this.mySide.n = this.mySide.ally.n = 0; + this.farSide.n = this.farSide.ally.n = 1; + } + } + resetToCurrentTurn() { if (this.ended) { this.reset(true); @@ -1217,10 +1249,12 @@ class Battle { } switchSides() { this.setSidesSwitched(!this.sidesSwitched); + this.scene.updateSidebars(); this.resetToCurrentTurn(); } setSidesSwitched(sidesSwitched: boolean) { this.sidesSwitched = sidesSwitched; + if (this.mySide === this.p3 || this.mySide === this.p4) return; if (this.sidesSwitched) { this.nearSide = this.mySide = this.p2; this.farSide = this.p1; @@ -1229,7 +1263,9 @@ class Battle { this.farSide = this.p2; } this.nearSide.isFar = false; + if (this.nearSide.ally) this.nearSide.ally.isFar = false; this.farSide.isFar = true; + if (this.farSide.ally) this.farSide.ally.isFar = true; // nothing else should need updating - don't call this function after sending out pokemon } @@ -2974,22 +3010,16 @@ class Battle { let siden = -1; let slot = -1; // if there is an explicit slot for this pokemon let slotChart: {[k: string]: number} = {a: 0, b: 1, c: 2, d: 3, e: 4, f: 5}; - if (name.substr(0, 4) === 'p2: ' || name === 'p2') { - siden = this.p2.n; - name = name.substr(4); - } else if (name.substr(0, 4) === 'p1: ' || name === 'p1') { - siden = this.p1.n; - name = name.substr(4); - } else if (name.substr(0, 2) === 'p2' && name.substr(3, 2) === ': ') { - slot = slotChart[name.substr(2, 1)]; - siden = this.p2.n; - name = name.substr(5); - pokemonid = 'p2: ' + name; - } else if (name.substr(0, 2) === 'p1' && name.substr(3, 2) === ': ') { - slot = slotChart[name.substr(2, 1)]; - siden = this.p1.n; - name = name.substr(5); - pokemonid = 'p1: ' + name; + if (name.match(/^p[0-9]$|p[0-9]: |p[0-9][a-f]: /)) { + const serverSideN = parseInt(name.charAt(1), 10) - 1; + siden = serverSideN; + if (name.match(/^p[0-9]$|p[0-9]: /)) { + name = name.substr(4); + } else { + slot = slotChart[name.charAt(2)]; + name = name.substr(5); + pokemonid = 'p' + (serverSideN + 1) + ': ' + name; + } } return {name, siden, slot, pokemonid}; } @@ -2999,14 +3029,14 @@ class Battle { pokemonid = parsedPokemonid; const searchid = `${pokemonid}|${details}`; - const side = this.sides[siden]; + const side = this.gameType === 'multi' ? this.getSide(`p${siden + 1}`) : this.sides[siden]; // search inactive revealed pokemon for (let i = 0; i < side.pokemon.length; i++) { let pokemon = side.pokemon[i]; if (pokemon.fainted) continue; // already active, can't be switching in - if (side.active.includes(pokemon)) continue; + if (side.active.includes(pokemon) && side.ally) continue; // just switched out, can't be switching in if (pokemon === side.lastPokemon && !side.active[slot]) continue; @@ -3070,6 +3100,8 @@ class Battle { getSide(sidename: string): Side { if (sidename === 'p1' || sidename.substr(0, 3) === 'p1:') return this.p1; if (sidename === 'p2' || sidename.substr(0, 3) === 'p2:') return this.p2; + if ((sidename === 'p3' || sidename.substr(0, 3) === 'p3:') && this.p3) return this.p3; + if ((sidename === 'p4' || sidename.substr(0, 3) === 'p4:') && this.p4) return this.p4; if (this.nearSide.id === sidename) return this.nearSide; if (this.farSide.id === sidename) return this.farSide; if (this.nearSide.name === sidename) return this.nearSide; @@ -3126,6 +3158,20 @@ class Battle { case 'turn': { this.setTurn(args[1]); this.log(args); + if (this.gameType === 'multi') { + const mySideSlot = this.mySide.sideid === 'p1' || this.mySide.sideid === 'p2' ? 0 : 1; + let myActives = []; + myActives[mySideSlot] = this.mySide.active[mySideSlot]; + myActives[mySideSlot ^ 1] = this.mySide.ally.active[mySideSlot ^ 1]; + this.mySide.active = myActives; + this.mySide.ally.active = this.mySide.active; + const farSideSlot = this.farSide.sideid === 'p1' || this.farSide.sideid === 'p2' ? 0 : 1; + let yourActives = []; + yourActives[farSideSlot] = this.farSide.active[farSideSlot]; + yourActives[farSideSlot ^ 1] = this.farSide.ally.active[farSideSlot ^ 1]; + this.farSide.active = yourActives; + this.farSide.ally.active = this.farSide.active; + } break; } case 'tier': { @@ -3147,6 +3193,9 @@ class Battle { this.nearSide.active = [null]; this.farSide.active = [null]; break; + case 'multi': + this.pokemonControlled = 1; + /* falls through */ case 'doubles': this.nearSide.active = [null, null]; this.farSide.active = [null, null]; @@ -3262,9 +3311,9 @@ class Battle { side.setName(args[2]); if (args[3]) side.setAvatar(args[3]); if (args[4]) side.rating = args[4]; - this.scene.updateSidebar(side); if (this.joinButtons) this.scene.hideJoinButtons(); this.log(args); + this.scene.updateSidebar(side); break; } case 'teamsize': { diff --git a/src/panel-battle.tsx b/src/panel-battle.tsx index 44a6ad37c86..b0551172d0a 100644 --- a/src/panel-battle.tsx +++ b/src/panel-battle.tsx @@ -10,6 +10,8 @@ type BattleDesc = { minElo?: number | string, p1?: string, p2?: string, + p3?: string, + p4?: string, }; class BattlesRoom extends PSRoom { diff --git a/style/battle.css b/style/battle.css index c6533c64582..fd24d39e539 100644 --- a/style/battle.css +++ b/style/battle.css @@ -6,554 +6,655 @@ License: GPLv2 */ @import url(./battle-log.css?v4); - .battle { - position: absolute; - text-align: left; - top: 9px; - left: -1px; - border: 1px solid #AAAAAA; - background: #CFD5DA; - width: 640px; - height: 360px; - overflow: hidden; - - font-family: Verdana, sans-serif; - font-size: 10pt; + position: absolute; + text-align: left; + top: 9px; + left: -1px; + border: 1px solid #AAAAAA; + background: #CFD5DA; + width: 640px; + height: 360px; + overflow: hidden; + font-family: Verdana, sans-serif; + font-size: 10pt; } + .backdrop { - width: 700px; - height: 500px; - position: absolute; - top: -90px; - left: -50px; - background: transparent url(../fx/bg-beach.png) no-repeat scroll left top; - opacity: 0.8; + width: 700px; + height: 500px; + position: absolute; + top: -90px; + left: -50px; + background: transparent url(../fx/bg-beach.png) no-repeat scroll left top; + opacity: 0.8; } + .battle a { - color: #2277FF; + color: #2277FF; } + .battle a:hover { - color: #1155AA; + color: #1155AA; } + .innerbattle { - position: relative; - width: 640px; - height: 360px; + position: relative; + width: 640px; + height: 360px; } + .battle-log-add { - position: absolute; - text-align: left; - border: 1px solid #AAAAAA; - background: #EEF2F5; - color: black; - top: 369px; - left: 640px; - right: -1px; - - font-family: Verdana, sans-serif; - font-size: 10pt; + position: absolute; + text-align: left; + border: 1px solid #AAAAAA; + background: #EEF2F5; + color: black; + top: 369px; + left: 640px; + right: -1px; + font-family: Verdana, sans-serif; + font-size: 10pt; } + .battle-log { - position: absolute; - text-align: left; - border: 1px solid #AAAAAA; - background: #EEF2F5; - color: black; - top: 9px; - left: 640px; - right: -1px; - height: 360px; - - font-family: Verdana, sans-serif; - font-size: 10pt; - - overflow: auto; - overflow-y: scroll; - -webkit-overflow-scrolling: touch; - overflow-scrolling: touch; - word-wrap: break-word; + position: absolute; + text-align: left; + border: 1px solid #AAAAAA; + background: #EEF2F5; + color: black; + top: 9px; + left: 640px; + right: -1px; + height: 360px; + font-family: Verdana, sans-serif; + font-size: 10pt; + overflow: auto; + overflow-y: scroll; + -webkit-overflow-scrolling: touch; + overflow-scrolling: touch; + word-wrap: break-word; } + .battle-log-inline { - position: static; - top: auto; - right: auto; - bottom: auto; - left: auto; - height: auto; - width: auto; - overflow-y: auto; + position: static; + top: auto; + right: auto; + bottom: auto; + left: auto; + height: auto; + width: auto; + overflow-y: auto; } + .battle-log .inner { - padding: 4px 8px 0px 8px; + padding: 4px 8px 0px 8px; } + .battle-log .inner-preempt { - padding: 0 8px 4px 8px; + padding: 0 8px 4px 8px; } + .battle-log .inner-after { - margin-top: 0.5em; + margin-top: 0.5em; } .playbutton { - position: absolute; - display: block; - top: 160px; - left: 120px; - right: 120px; - text-align: center; -} -.playbutton1, .playbutton2 { - position: absolute; - display: block; - top: 190px; - left: 100px; - z-index: 100; + position: absolute; + display: block; + top: 160px; + left: 120px; + right: 120px; + text-align: center; +} + +.playbutton1, +.playbutton2 { + position: absolute; + display: block; + top: 190px; + left: 100px; + z-index: 100; } + .playbutton2 { - top: 130px; - left: 300px; + top: 130px; + left: 300px; } + .playbutton button, .playbutton1 button, .playbutton2 button { - font-size: 16pt; + font-size: 16pt; } .background { - position: absolute; - display: none; - top: 0; - left: 0; - bottom: 0; - right: 0; + position: absolute; + display: none; + top: 0; + left: 0; + bottom: 0; + right: 0; } .statbar { - position: absolute; - display: none; - width: 154px; - min-height: 40px; - padding: 2px 4px; + position: absolute; + display: none; + width: 154px; + min-height: 40px; + padding: 2px 4px; } + .statbar strong { - margin: 0 -15px; - display: block; - text-align: center; - color: #222222; - text-shadow: #FFFFFF 1px 1px 0, #FFFFFF 1px -1px 0, #FFFFFF -1px 1px 0, #FFFFFF -1px -1px 0; + margin: 0 -15px; + display: block; + text-align: center; + color: #222222; + text-shadow: #FFFFFF 1px 1px 0, #FFFFFF 1px -1px 0, #FFFFFF -1px 1px 0, #FFFFFF -1px -1px 0; } + .statbar strong small { - font-weight: normal; + font-weight: normal; } + .statbar .hpbar { - position: relative; - border: 1px solid #777777; - background: #FCFEFF; - padding: 1px; - height: 8px; - margin: 0 0 0 0; - width: 151px; - border-radius: 4px; + position: relative; + border: 1px solid #777777; + background: #FCFEFF; + padding: 1px; + height: 8px; + margin: 0 0 0 0; + width: 151px; + border-radius: 4px; } + /* The declaration order of these hp* classes is significant. */ .statbar .hpbar .hp { - height: 4px; - border-top: 2px solid #00dd60; - background: #00bb51; - border-bottom: 2px solid #007734; - border-right: 1px solid #007734; - border-radius: 3px; + height: 4px; + border-top: 2px solid #00dd60; + background: #00bb51; + border-bottom: 2px solid #007734; + border-right: 1px solid #007734; + border-radius: 3px; } + .statbar .hpbar .hp-yellow { - border-top-color: #f8e379; - background-color: #f5d538; - border-bottom-color: #be9f0a; - border-right-color: #be9f0a; + border-top-color: #f8e379; + background-color: #f5d538; + border-bottom-color: #be9f0a; + border-right-color: #be9f0a; } + .statbar .hpbar .hp-red { - border-top-color: #f37f67; - background-color: #ee4928; - border-bottom-color: #a3260d; - border-right-color: #a3260d; + border-top-color: #f37f67; + background-color: #ee4928; + border-bottom-color: #a3260d; + border-right-color: #a3260d; } + /* The declaration order of these prevhp* classes is significant. */ .statbar .hpbar .prevhp { - background: #BBEECC; - height: 8px; - border-radius: 3px; + background: #BBEECC; + height: 8px; + border-radius: 3px; } + .statbar .hpbar .prevhp-yellow { - background-color: #fcf4ca; + background-color: #fcf4ca; } + .statbar .hpbar .prevhp-red { - background-color: #facec5; + background-color: #facec5; } + /****************/ .statbar .hpbar .hptext { - position: absolute; - background: #777777; - color: #EEEEEE; - text-shadow: #000000 0 1px 0; - text-stroke: 1px #000000; - font-size: 9px; - width: 32px; - height: 12px; - top: -1px; - text-align: center; + position: absolute; + background: #777777; + color: #EEEEEE; + text-shadow: #000000 0 1px 0; + text-stroke: 1px #000000; + font-size: 9px; + width: 32px; + height: 12px; + top: -1px; + text-align: center; } + .statbar .hpbar .hptextborder { - position: absolute; - background: transparent; - border-top: 1px solid #777777; - border-bottom: 1px solid #777777; - width: 4px; - top: -1px; - height: 10px; + position: absolute; + background: transparent; + border-top: 1px solid #777777; + border-bottom: 1px solid #777777; + width: 4px; + top: -1px; + height: 10px; } + .rstatbar .hpbar .hptext { - right: -32px; - border-radius: 0 4px 4px 0; + right: -32px; + border-radius: 0 4px 4px 0; } + .lstatbar .hpbar .hptext { - left: -32px; - border-radius: 4px 0 0 4px; + left: -32px; + border-radius: 4px 0 0 4px; } + .rstatbar .hpbar .hptextborder { - right: -3px; + right: -3px; } + .lstatbar .hpbar .hptextborder { - left: -3px; + left: -3px; } + .statbar .status { - min-height: 10px; - font-size: 7pt; + min-height: 10px; + font-size: 7pt; } + .statbar .status img { - vertical-align: top; - top: -2px; - position: relative; + vertical-align: top; + top: -2px; + position: relative; } + .statbar span { - padding: 0px 1px; - border: 1px solid #FF4400; - border-radius: 3px; + padding: 0px 1px; + border: 1px solid #FF4400; + border-radius: 3px; } + .statbar span.brn, .statbar span.psn, .statbar span.slp, .statbar span.par, .statbar span.frz { - padding: 1px 2px; - border: 0; - border-radius: 3px; + padding: 1px 2px; + border: 0; + border-radius: 3px; } + .statbar span.brn { - background: #EE5533; - color: #FFFFFF; + background: #EE5533; + color: #FFFFFF; } + .statbar span.psn { - background: #A4009A; - color: #FFFFFF; + background: #A4009A; + color: #FFFFFF; } + .statbar span.par { - background: #9AA400; - color: #FFFFFF; + background: #9AA400; + color: #FFFFFF; } + .statbar span.slp { - background: #AA77AA; - color: #FFFFFF; + background: #AA77AA; + color: #FFFFFF; } + .statbar span.frz { - background: #009AA4; - color: #FFFFFF; + background: #009AA4; + color: #FFFFFF; } + .statbar span.bad { - background: #FFE5E0; - color: #FF4400; - border-color: #FF4400; + background: #FFE5E0; + color: #FF4400; + border-color: #FF4400; } + .statbar span.good { - background: #E5FFE0; - color: #33AA00; - border-color: #33AA00; + background: #E5FFE0; + color: #33AA00; + border-color: #33AA00; } + .statbar span.neutral { - background: #F0F0F0; - color: #555555; - border-color: #555555; + background: #F0F0F0; + color: #555555; + border-color: #555555; } + .leftbar { - position: absolute; - top: 0; - left: 0; - height: 450px; - width: 100px; - background-color: #CCCCCC; - background-color: rgba(255,255,255,0.5); - border-right: 1px solid rgba(215,215,215,0.5); - color: #777777; + position: absolute; + top: 0; + left: 0; + height: 450px; + width: 100px; + background-color: #CCCCCC; + background-color: rgba(255, 255, 255, 0.5); + border-right: 1px solid rgba(215, 215, 215, 0.5); + color: #777777; } + .rightbar { - position: absolute; - top: 0; - right: 0; - height: 450px; - width: 100px; - background-color: #CCCCCC; - background-color: rgba(255,255,255,0.5); - border-left: 1px solid rgba(215,215,215,0.5); - color: #777777; + position: absolute; + top: 0; + right: 0; + height: 450px; + width: 100px; + background-color: #CCCCCC; + background-color: rgba(255, 255, 255, 0.5); + border-left: 1px solid rgba(215, 215, 215, 0.5); + color: #777777; } + .trainer { - text-align: center; - position: absolute; - left: 0; - right: 0; - bottom: 102px; + text-align: center; + position: absolute; + left: 0; + right: 0; + bottom: 75px; } + .rightbar .trainer { - bottom: 232px; + bottom: 232px; +} + +#p1 { + bottom: 75px; +} + +#p2 { + bottom: 232px; } + +#p3 { + bottom: 232px; +} + +#p4 { + bottom: 75px; +} + .trainer strong { - display: block; - font-size: 8pt; - margin-bottom: 2px; - word-wrap: break-word; + display: block; + font-size: 8pt; + margin-bottom: 2px; + word-wrap: break-word; } + .trainer div { - width: 86px; - height: 90px; - opacity: .8; - margin: 0 auto; - background: transparent none no-repeat scroll center top; + width: 86px; + height: 90px; + opacity: .8; + margin: 0 auto; + background: transparent none no-repeat scroll center top; } + .trainer div.teamicons { - width: 96px; - height: 30px; + width: 96px; + height: 30px; } + .teamicons span { - float: left; + float: left; } + .leftbar .trainer div.trainersprite, .leftbar .teamicons span { - -moz-transform: scaleX(-1); - -webkit-transform: scaleX(-1); - -o-transform: scaleX(-1); - -ms-transform: scaleX(-1); - transform: scaleX(-1); + -moz-transform: scaleX(-1); + -webkit-transform: scaleX(-1); + -o-transform: scaleX(-1); + -ms-transform: scaleX(-1); + transform: scaleX(-1); } + .trainersprite { - max-width: 80px; - max-height: 80px; + max-width: 80px; + max-height: 80px; } + .turn { - position: absolute; - display: block; - top: 10px; - left: 110px; - font-size: 13pt; - font-weight: bold; - margin: 0; - padding: 2px 8px; - border: 2px solid #332200; - border-radius: 6px; - color: #332200; - background: #FCFAF2; + position: absolute; + display: block; + top: 10px; + left: 110px; + font-size: 13pt; + font-weight: bold; + margin: 0; + padding: 2px 8px; + border: 2px solid #332200; + border-radius: 6px; + color: #332200; + background: #FCFAF2; } + .messagebar { - position: absolute; - display: none; - bottom: 10px; - left: 110px; - right: 110px; - color: #CCCCCC; - background: #222222; - background: rgba(0,0,0,0.75); - border-radius: 6px; - padding: 4px 6px 0 6px; - overflow: hidden; + position: absolute; + display: none; + bottom: 10px; + left: 110px; + right: 110px; + color: #CCCCCC; + background: #222222; + background: rgba(0, 0, 0, 0.75); + border-radius: 6px; + padding: 4px 6px 0 6px; + overflow: hidden; } + .messagebar strong { - color: #ffffff; - font-size: 12pt; + color: #ffffff; + font-size: 12pt; } + .messagebar small { - font-size: 8pt; + font-size: 8pt; } + .messagebar p { - display: none; - margin: 0; - padding: 0; + display: none; + margin: 0; + padding: 0; } + .weather { - position: absolute; - display: block; - top: 0; - left: 0; - right: 0; - bottom: 0; - text-shadow: #FFFFFF 1px 1px 0, #FFFFFF 1px -1px 0, #FFFFFF -1px 1px 0, #FFFFFF -1px -1px 0; - color: black; + position: absolute; + display: block; + top: 0; + left: 0; + right: 0; + bottom: 0; + text-shadow: #FFFFFF 1px 1px 0, #FFFFFF 1px -1px 0, #FFFFFF -1px 1px 0, #FFFFFF -1px -1px 0; + color: black; } + .weather em { - display: block; - margin: 24px 0 0 115px; - font-size: 12pt; + display: block; + margin: 24px 0 0 115px; + font-size: 12pt; } + .weather em small { - font-style: normal; + font-style: normal; } + .sunweather, .sunnydayweather, .desolatelandweather { - background: #FFEEBB url(../fx/weather-sunnyday.jpg) no-repeat scroll left top; - color: #664411; + background: #FFEEBB url(../fx/weather-sunnyday.jpg) no-repeat scroll left top; + color: #664411; } + .rainweather, .raindanceweather, .primordialseaweather { - background: #99BBFF url(../fx/weather-raindance.jpg) no-repeat scroll left top; - color: #0044BB; + background: #99BBFF url(../fx/weather-raindance.jpg) no-repeat scroll left top; + color: #0044BB; } + .sandstormweather { - background: #E6E0AC url(../fx/weather-sandstorm.png) no-repeat scroll left top; - color: #554433; + background: #E6E0AC url(../fx/weather-sandstorm.png) no-repeat scroll left top; + color: #554433; } + .hailweather { - background: #AADDEE url(../fx/weather-hail.png) no-repeat scroll left top; - color: #114455; + background: #AADDEE url(../fx/weather-hail.png) no-repeat scroll left top; + color: #114455; } + .deltastreamweather { - background: #AAAAAA url(../fx/weather-strongwind.png) no-repeat scroll left top; - color: #666666; + background: #AAAAAA url(../fx/weather-strongwind.png) no-repeat scroll left top; + color: #666666; } + .mistyterrainweather { - background: #EEAACC url(../fx/weather-mistyterrain.png) no-repeat scroll left top; - color: #551144; + background: #EEAACC url(../fx/weather-mistyterrain.png) no-repeat scroll left top; + color: #551144; } + .electricterrainweather { - background: #EEEEAA url(../fx/weather-electricterrain.png) no-repeat scroll left top; - color: #444411; + background: #EEEEAA url(../fx/weather-electricterrain.png) no-repeat scroll left top; + color: #444411; } + .grassyterrainweather { - background: #CCEEAA url(../fx/weather-grassyterrain.png) no-repeat scroll left top; - color: #335511; + background: #CCEEAA url(../fx/weather-grassyterrain.png) no-repeat scroll left top; + color: #335511; } + .psychicterrainweather { - background: #CCAAEE url(../fx/weather-psychicterrain.png) no-repeat scroll left top; - color: #441155; + background: #CCAAEE url(../fx/weather-psychicterrain.png) no-repeat scroll left top; + color: #441155; } + .pseudoweather { - background: #DDAAEE url(../fx/weather-trickroom.png) no-repeat scroll left top; - color: #661155; + background: #DDAAEE url(../fx/weather-trickroom.png) no-repeat scroll left top; + color: #661155; } .battle .result { - display: none; - position: absolute; - width: 150px; - text-align: center; + display: none; + position: absolute; + width: 150px; + text-align: center; } + .battle .result strong { - font-weight: bold; - padding: 1px 3px; - border-radius: 3px; + font-weight: bold; + padding: 1px 3px; + border-radius: 3px; } + .battle .badresult strong { - color: #FFFFFF; - background: #CC0000; + color: #FFFFFF; + background: #CC0000; } + .battle .goodresult strong { - color: #FFFFFF; - background: #00CC00; + color: #FFFFFF; + background: #00CC00; } + .battle .neutralresult strong { - color: #FFFFFF; - background: #999999; + color: #FFFFFF; + background: #999999; } + .battle .brnresult strong { - color: #FFFFFF; - background: #EE5533; + color: #FFFFFF; + background: #EE5533; } + .battle .psnresult strong { - color: #FFFFFF; - background: #A4009A; + color: #FFFFFF; + background: #A4009A; } + .battle .slpresult strong { - color: #FFFFFF; - background: #AA77AA; + color: #FFFFFF; + background: #AA77AA; } + .battle .parresult strong { - color: #FFFFFF; - background: #9AA400; + color: #FFFFFF; + background: #9AA400; } + .battle .frzresult strong { - color: #FFFFFF; - background: #009AA4; + color: #FFFFFF; + background: #009AA4; } + .battle .abilityresult strong { - color: #FFFFFF; - background: #0088AA; - border-radius: 0; - padding: 2px 6px; + color: #FFFFFF; + background: #0088AA; + border-radius: 0; + padding: 2px 6px; } + .sidecondition-auroraveil { - background: #88EEFF; - border: 1px solid #55BBCC; - display: none; - position: absolute; + background: #88EEFF; + border: 1px solid #55BBCC; + display: none; + position: absolute; } + .sidecondition-reflect { - background: #EEEEEE; - border: 1px solid #888888; - display: none; - position: absolute; + background: #EEEEEE; + border: 1px solid #888888; + display: none; + position: absolute; } + .sidecondition-lightscreen { - background: #CCCC00; - border: 1px solid #AAAA00; - display: none; - position: absolute; + background: #CCCC00; + border: 1px solid #AAAA00; + display: none; + position: absolute; } + .sidecondition-safeguard { - background: #DD88DD; - border: 1px solid #AA66AA; - display: none; - position: absolute; + background: #DD88DD; + border: 1px solid #AA66AA; + display: none; + position: absolute; } + .sidecondition-mist { - background: #AACCFF; - border: 1px solid #5577CC; - display: none; - position: absolute; + background: #AACCFF; + border: 1px solid #5577CC; + display: none; + position: absolute; } + .turnstatus-protect { - background: #DD88DD; - border: 1px solid #AA66AA; - display: none; - position: absolute; + background: #DD88DD; + border: 1px solid #AA66AA; + display: none; + position: absolute; } + .seeking { - display: block; - position: absolute; - top: 0; left: 0; bottom: 0; right: 0; - background: #FFFFFF; - color: #000000; + display: block; + position: absolute; + top: 0; + left: 0; + bottom: 0; + right: 0; + background: #FFFFFF; + color: #000000; } + .seeking strong { - display: block; - text-align: center; - padding-top: 180px; + display: block; + text-align: center; + padding-top: 180px; } #sm2-container { - position: relative; + position: relative; } .swf_timedout#sm2-container embed, @@ -562,76 +663,85 @@ License: GPLv2 .movieContainer#sm2-container embed, .movieContainer#sm2-container object, .movieContainer#sm2-container audio { - position: absolute; - height: 27px; - width: 66px; - top: -1px; - left: -1px; + position: absolute; + height: 27px; + width: 66px; + top: -1px; + left: -1px; } + .swf_timedout#sm2-container .inner, .movieContainer#sm2-container .inner { - visibility: hidden; + visibility: hidden; } + #sm2-container embed, #sm2-container object, #sm2-container audio, .swf_loaded#sm2-container embed, .swf_loaded#sm2-container object, .swf_loaded#sm2-container audio { - position: absolute; - height: 27px; - width: 27px; - top: -1px; - left: -87px; + position: absolute; + height: 27px; + width: 27px; + top: -1px; + left: -87px; } + #sm2-container .inner, .swf_loaded#sm2-container .inner { - visibility: visible; + visibility: visible; } .chooser { - float: right; - border: 1px solid #AAAAAA; - background: #EEF2F5; - padding: 0 0 0 0; - height: 25px; - font-size: 9pt; - margin: 0 5px 0 0; + float: right; + border: 1px solid #AAAAAA; + background: #EEF2F5; + padding: 0 0 0 0; + height: 25px; + font-size: 9pt; + margin: 0 5px 0 0; } + .leftchooser { - float: left; + float: left; } + .chooser em { - float: left; - padding: 5px 6px 0 6px; - height: 20px; - border-right: 1px solid #CCCCCC; - background: #EEEEEE; - font-weight: normal; + float: left; + padding: 5px 6px 0 6px; + height: 20px; + border-right: 1px solid #CCCCCC; + background: #EEEEEE; + font-weight: normal; } + .chooser div { - float: left; - padding: 3px 2px 0 2px; + float: left; + padding: 3px 2px 0 2px; } + .chooser button { - border: 0; - background: transparent; - padding: 2px 4px; - font-size: 9pt; - font-family: Verdana, sans-serif; - border-radius: 3px; - cursor: pointer; + border: 0; + background: transparent; + padding: 2px 4px; + font-size: 9pt; + font-family: Verdana, sans-serif; + border-radius: 3px; + cursor: pointer; } + .chooser button:hover { - border: 1px solid #BBBBBB; - padding: 1px 3px; - background: #EEEEEE; + border: 1px solid #BBBBBB; + padding: 1px 3px; + background: #EEEEEE; } + .chooser button.sel, .chooser button.sel:hover { - border: 1px solid #999999; - padding: 1px 3px; - background: #DDDDDD; + border: 1px solid #999999; + padding: 1px 3px; + background: #DDDDDD; } @@ -658,62 +768,84 @@ License: GPLv2 background: rgba(60,60,60,0.80); color: #CCCCCC; } */ + .dark .battle-log { - background: #333333; - color: #CCCCCC; + background: #333333; + color: #CCCCCC; } + .dark .chooser { - background: #666666; - color: #CCCCCC; + background: #666666; + color: #CCCCCC; } + .dark .chooser em { - background: #777777; - color: #CCCCCC; + background: #777777; + color: #CCCCCC; } + .dark .chooser button { - color: #CCCCCC; + color: #CCCCCC; } + .dark .chooser button:hover { - border: 1px solid #BBBBBB; - padding: 1px 3px; - background: #777777; - color: #EEEEEE; + border: 1px solid #BBBBBB; + padding: 1px 3px; + background: #777777; + color: #EEEEEE; } + .dark .chooser button.sel, .dark .chooser button.sel:hover { - border: 1px solid #CCCCCC; - padding: 1px 3px; - background: #999999; - color: #F3F3F3; + border: 1px solid #CCCCCC; + padding: 1px 3px; + background: #999999; + color: #F3F3F3; } .itemicon { - display: inline-block; - width: 24px; - height: 24px; + display: inline-block; + width: 24px; + height: 24px; } + .picon { - display: inline-block; - width: 40px; - height: 30px; + display: inline-block; + width: 40px; + height: 30px; } + .trainer .picon { - margin: 0 -4px; + margin: 0 -4px; } -.pixelated, .itemicon, .picon, .trainersprite { - image-rendering: -moz-crisp-edges; - image-rendering: pixelated; - -ms-interpolation-mode: nearest-neighbor; + +.pixelated, +.itemicon, +.picon, +.trainersprite { + image-rendering: -moz-crisp-edges; + image-rendering: pixelated; + -ms-interpolation-mode: nearest-neighbor; } -@media (-webkit-min-device-pixel-ratio: 1.05), (min-resolution: 1.05dppx) { - .pixelated, .itemicon, .picon, .trainersprite { - image-rendering: auto; - } + +@media (-webkit-min-device-pixel-ratio: 1.05), +(min-resolution: 1.05dppx) { + .pixelated, + .itemicon, + .picon, + .trainersprite { + image-rendering: auto; + } } -@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { - .pixelated, .itemicon, .picon, .trainersprite { - image-rendering: pixelated; - } + +@media (-webkit-min-device-pixel-ratio: 2), +(min-resolution: 2dppx) { + .pixelated, + .itemicon, + .picon, + .trainersprite { + image-rendering: pixelated; + } } @@ -722,51 +854,60 @@ License: GPLv2 *********************************************************/ #tooltipwrapper { - position: absolute; - top: 400px; - left: 100px; - text-align: left; - color: black; - pointer-events: none; + position: absolute; + top: 400px; + left: 100px; + text-align: left; + color: black; + pointer-events: none; } + #tooltipwrapper .tooltipinner { - position: relative; + position: relative; } + #tooltipwrapper .tooltip { - position: absolute; - bottom: 0; - left: 0; - width: 300px; - border: 1px solid #888888; - background: #EEEEEE; - background: rgba(240,240,240,.9); - border-radius: 5px; - z-index: 50; + position: absolute; + bottom: 0; + left: 0; + width: 300px; + border: 1px solid #888888; + background: #EEEEEE; + background: rgba(240, 240, 240, .9); + border-radius: 5px; + z-index: 50; } + #tooltipwrapper .tooltip h2 { - padding: 2px 4px; - margin: 0; - border-bottom: 1px solid #888888; - font-size: 10pt; + padding: 2px 4px; + margin: 0; + border-bottom: 1px solid #888888; + font-size: 10pt; } + #tooltipwrapper .tooltip h2 small { - font-weight: normal; + font-weight: normal; } + #tooltipwrapper .tooltip p { - padding: 2px 4px; - margin: 0; - font-size: 9pt; + padding: 2px 4px; + margin: 0; + font-size: 9pt; } + #tooltipwrapper .tooltip p small { - font-size: 8pt; + font-size: 8pt; } + #tooltipwrapper .tooltip p.section { - border-top: 1px solid #888888; + border-top: 1px solid #888888; } + #tooltipwrapper.tooltip-locked { - pointer-events: auto; + pointer-events: auto; } + #tooltipwrapper.tooltip-locked .tooltip { - border: 2px solid #444444; - background: #DEDEDE; -} + border: 2px solid #444444; + background: #DEDEDE; +} \ No newline at end of file diff --git a/style/client.css b/style/client.css index ea713352fd6..094b1aa733d 100644 --- a/style/client.css +++ b/style/client.css @@ -1851,6 +1851,13 @@ a.ilink.yours { width: 640px; background: #EEF2F5; } +.ps-room .ally-pokemon { + position: absolute; + top: 280px; + left: 0; + width: 640px; + background: #EEF2F5; +} .battle-chat-toggle { display: none; } @@ -1946,6 +1953,7 @@ a.ilink.yours { left: 0; display: block; } +.allyTeam button, .shiftselect button, .moveselect button, .switchselect button { @@ -1970,6 +1978,7 @@ a.ilink.yours { color: #445588; cursor: default; } +.allyparty button, .switchmenu button { position: relative; display: block; @@ -1982,11 +1991,14 @@ a.ilink.yours { white-space: pre; overflow: hidden; } +.allyparty button .picon, .switchmenu button .picon { float: left; margin: -6px -3px -6px -4px; opacity: 0.8; } + +.allyparty button .hpbar, .switchmenu button .hpbar { position: absolute; display: block; @@ -2000,6 +2012,7 @@ a.ilink.yours { /* The declaration order of these three hpbar* classes is significant. */ +.allyparty button .hpbar span, .switchmenu button .hpbar span { display: block; height: 1px; @@ -2007,10 +2020,14 @@ a.ilink.yours { border-top: 1px solid #3C0; border-radius: 1px; } + +.allyparty button .hpbar-yellow span, .switchmenu button .hpbar-yellow span { border-top-color: #a5aa53; background-color: #a2a822; } + +.allyparty button .hpbar-red span, .switchmenu button .hpbar-red span { border-top-color: #faa; background-color: #f55; @@ -2018,6 +2035,7 @@ a.ilink.yours { /****************/ +.allyparty button .status, .switchmenu button .status { position: absolute; display: block; @@ -2098,13 +2116,14 @@ a.ilink.yours { background: #E5E5E5; color: black; } - +.allyparty, .switchmenu, .movemenu { display: block; margin-right: -10px; padding-left: 4px; } +.allyparty button, .switchmenu button, .movemenu button { position: relative; @@ -2122,12 +2141,14 @@ a.ilink.yours { background: #e3e3e3; background: linear-gradient(to bottom, #f6f6f6, #e3e3e3); } +.allyparty button:hover, .switchmenu button:hover, .movemenu button:hover { background: #cfcfcf; background: linear-gradient(to bottom, #f2f2f2, #cfcfcf); border-color: #606060; } +.allyparty button:active, .switchmenu button:active, .movemenu button:active, .switchmenu button.pressed, @@ -2135,6 +2156,8 @@ a.ilink.yours { background: linear-gradient(to bottom, #cfcfcf, #f2f2f2); } +.allyparty button.disabled, +.allyparty button:disabled, .switchmenu button.disabled, .switchmenu button:disabled, .movemenu button:disabled { @@ -2181,6 +2204,7 @@ a.ilink.yours { display: none; padding: 0 75px 0 85px; } + .allyparty, .switchmenu { display: none; max-width: 325px; @@ -2192,6 +2216,7 @@ a.ilink.yours { left: 20px; bottom: 20px; } + .allyTeam, .switchselect { position: absolute; right: 20px;