Battle CSS

These are some helpful Battle CSS that I have curated from various sources. I keep forgetting who helped me with these, if this is your code I would be happy to add your name to the credits section (or even delete this thread and let the person that made the code just repost it.)

No Jerking Battles

/* No jerking battles */
 {
height: 147px;
}
 {
height: 147px;
}

Credit: Sorcerer? Note: I used this for years, but I think its now unnecessary with some of the more advanced CSS. This is great for a small tweak instead of a huge alteration that some of of the more advanced CSS provides.

Bigger End Battle Button

/* bigger end battle button */
 -ui-main .endBattle a.end-game-btn {
width: 80%;
}

Credit: Sorcerer? Note: I used this for years, but I think its now unnecessary with some of the more advanced CSS.

Remove Preselect Button

/* remove preselect button */
div.ui.message {
display:none;
}

Credit: I think I might have made this myself? Notes: Very impressive I know.

Customize Weapons Page Alterations


/* Fix Customize Weapons Page */
.ten.wide.column > table {width:370px; height: 225px; overflow:scroll; display:block; }
.six.wide.column table {width:100px !important; }
.ten.wide.column label img {width:70px !important; }
.ui.grid h2 {font-size:22px !important; }
,  {height:414px; overflow: auto; }
 > .ui.segment.attached > .ui.grid > .three.wide.column,  > .ui.segment.attached > .ui.grid > .three.wide.column {display:none; }
 .ui.segment.attached,  .ui.segment.attached {padding:3px !important; }
.ui.segment.attached.bottom label {width: 100% !important; cursor:pointer !important; background-color:; }
div[style="border: 1px solid ; -moz-border-radius: 5px; -webkit-border-radius: 5px; min-height: 75px; text-align: left; max-height: 300px; overflow: auto;"] {max-height:450px !important; width:750px !important;}

{margin-top: 100px; width: 215% !important; display: table;} Credit: Maskros

Reorder weapons by Tier on Challenge Pages


/-- Orders the weapon selection box by Tier, with selected weapons at the top
Change the 'order: [number]' to alter the sorting --/
 {
display: grid;
scrollbar-gutter: stable;
box-sizing: border-box;
max-height: 1440px !important;
grid-template-columns: 6.25% 6.25% 6.25% 6.25% 6.25% 6.25% 6.25% 6.25% 6.25% 6.25% 6.25% 6.25% 6.25% 6.25% 6.25% 6.25%;
}
 div {
width: 100% !important;
word-break: break-word;
}
 div[data-tier="12"] {order: 2;}
 div[data-tier="11"] {order: 3;}
 div[data-tier="10"] {order: 4;}
 div[data-tier="9"] {order: 5;}
 div[data-tier="8"] {order: 6;}
 div[data-tier="7"] {order: 7;}
 div[data-tier="6"] {order: 8;}
 div[data-tier="5"] {order: 9;}
 div[data-tier="4"] {order: 10;}
 div[data-tier="3"] {order: 11;}
 div[data-tier="2"] {order: 12;}
 div[data-tier="1"] {order: 13;}
 div[data-id="1356313"] {order: 1;}

div.selected_weapon {order: 0;} Credit: Maskros Notes: I think this code somewhat breaks the Edit Weapon set code.

Fixed Battle UI button Locations

/* prep battle ui (and adjust for scrolldown */
-ui-main .battle-ui-arena { float: left; width: calc(100% - 325px); }
-ui-main .battle-ui-controls { position: static; float: left; overflow: visible; }
-ui-main { top: 185px; padding: 0 !important; }
/* Make Your Turn, See Results */
, .end-game-btn {
position: absolute; top: -46px; left: 15px;
margin: 0; margin-top: 0 !important;
width: calc(100% - 26px) !important;
}
/* prep battle results page */
.battle-menu + center { position: relative; }
.battle-menu + center > img:first-child { margin-top: 65px; }
/* Fight This Opponent Again! /
a[href^="challenge.php?act=battle&"] + a[href="challenge.php"] { display: none; }
a[href^="challenge.php?act=battle&"] .btn {
position: absolute; top: 20px; left: 16px;
width: calc(100% - 28px);
}
/ ... in combination with Battle Quests */
a[href$="battle/quest.php"] ~ p a[href^="challenge.php?act=battle&"] .btn {
width: calc(50% - 16px - 14px);
}
.battle-menu + center a.button[href$="battle/quest.php"] {
position: absolute; top: 20px; left: calc(50% + 13px); right: 12px;
}
/* prep battle quest pages */
.battle-menu + .row:not(.w-100)  { position: relative; }
.battle-menu + .row:not(.w-100) > div:nth-child(2)  { position: static; }
.battle-menu + .row:not(.w-100) img[src$="npc_reischen.gif"],
.battle-menu + .row:not(.w-100) > div:nth-child(2) { margin-top: 65px; }
/* Challenge Opponent, Start Level N */
.battle-menu + .row:not(.w-100) a[href$="battle/quest.php/start"].button,
.battle-menu + .row:not(.w-100) a[href$="battle/quest.php/start"] .btn,
.battle-menu + .row:not(.w-100) a[href^="/games/battle/challenge.php?act=battle"] .btn {
position: absolute; top: 20px; left: 31px;
width: calc(100% - 58px);
}
/* You are already in a battle! */
.battle-menu + center > .alert-danger a[href$="battle.php"] {
display: block; background-color: ;
}
.battle-menu + center > .alert-danger > b + br { display: none; }

/* style different button types to same size/shape */ .battle-menu + center a[href$="battle/quest.php"].button, .battle-menu + .row:not(.w-100) a[href$="battle/quest.php/start"].button, .battle-menu + .row:not(.w-100) a[href^="/games/battle/challenge.php?act=battle"] .btn, .battle-menu + center .alert-danger a[href$="battle.php"] { font-size: 14px !important; padding: calc(.375rem + 1px) calc(.75rem + 1px); line-height: 1.5; border-radius: 0.25rem; border: none; } Credit: Maskros

Jumping pets


.battle-image{
font-weight: bold;
position: relative;
animation: petJump 1s infinite;
}

 petJump{
0%       { bottom:5px; }
25%, 75% { bottom:15px; }
50%      { bottom:20px; }
100%     {bottom:0;}
}

Credit: Evil

Logged Out

Battle CSS

Replies