diff --git a/index.html b/index.html
index 388e80c..b899255 100644
--- a/index.html
+++ b/index.html
@@ -2413,9 +2413,11 @@
background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
border: 3px solid #e94560;
border-radius: 20px;
- padding: 25px 30px;
+ padding: 20px 24px;
max-width: 480px;
width: 95%;
+ max-height: 90vh;
+ overflow-y: auto;
color: white;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
box-shadow: 0 0 40px rgba(233, 69, 96, 0.4);
@@ -2495,12 +2497,12 @@
}
.combat-log {
background: rgba(0, 0, 0, 0.5);
- border-radius: 10px;
- padding: 12px 15px;
- height: 100px;
+ border-radius: 8px;
+ padding: 8px 12px;
+ height: 70px;
overflow-y: auto;
- margin-bottom: 18px;
- font-size: 13px;
+ margin-bottom: 12px;
+ font-size: 12px;
border: 1px solid #333;
}
.combat-log-entry {
@@ -2533,37 +2535,49 @@
.combat-skills {
display: grid;
grid-template-columns: repeat(2, 1fr);
- gap: 10px;
- margin-bottom: 12px;
+ gap: 8px;
+ margin-bottom: 10px;
}
.skill-btn {
background: linear-gradient(135deg, #0f3460 0%, #16213e 100%);
border: 2px solid #e94560;
color: white;
- padding: 14px 10px;
+ padding: 8px 6px;
border-radius: 10px;
cursor: pointer;
transition: all 0.2s;
text-align: center;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ min-height: 70px;
}
.skill-btn:hover:not(:disabled) {
background: linear-gradient(135deg, #e94560 0%, #c73e54 100%);
- transform: scale(1.03);
- box-shadow: 0 0 15px rgba(233, 69, 96, 0.4);
+ transform: scale(1.02);
+ box-shadow: 0 0 12px rgba(233, 69, 96, 0.4);
}
.skill-btn:disabled {
opacity: 0.4;
cursor: not-allowed;
transform: none;
}
+ .skill-btn .skill-icon-wrapper {
+ margin-bottom: 3px;
+ }
+ .skill-btn .skill-icon-wrapper img {
+ width: 28px;
+ height: 28px;
+ }
.skill-btn .skill-name {
font-weight: bold;
- display: block;
- font-size: 13px;
- margin-bottom: 3px;
+ font-size: 11px;
+ margin-bottom: 2px;
+ line-height: 1.2;
}
.skill-btn .skill-cost {
- font-size: 11px;
+ font-size: 10px;
color: #4ecdc4;
}
.skill-btn .skill-cost.free {
@@ -2585,11 +2599,12 @@
background: #333;
border: 2px solid #555;
color: #aaa;
- padding: 12px;
+ padding: 10px;
border-radius: 8px;
cursor: pointer;
- font-size: 14px;
+ font-size: 13px;
transition: all 0.2s;
+ margin-top: 8px;
}
.combat-flee-btn:hover {
background: #444;
@@ -14745,14 +14760,15 @@
if (baseSkill.type === 'utility') return;
const displayName = skillInfo?.displayName || hardcodedSkill?.name || dbSkill?.name || skillId;
- const iconHtml = renderSkillIcon(skillId, 'class', playerStats.class, 20);
+ const iconHtml = renderSkillIcon(skillId, 'class', playerStats.class, 28);
const mpCost = hardcodedSkill?.mpCost || dbSkill?.mpCost || 0;
const btn = document.createElement('button');
btn.className = 'skill-btn';
btn.dataset.skillId = skillId;
btn.innerHTML = `
- ${iconHtml} ${displayName}
+ ${iconHtml}
+ ${displayName}
${mpCost > 0 ? mpCost + ' MP' : 'Free'}
`;
btn.onclick = () => executePlayerSkill(skillId);
@@ -14767,7 +14783,8 @@
btn.dataset.skillId = 'admin_banish';
btn.style.borderColor = '#ff6b35';
btn.innerHTML = `
- ${adminSkill.icon} ${adminSkill.name}
+ ${adminSkill.icon}
+ ${adminSkill.name}
Admin
`;
btn.onclick = () => executePlayerSkill('admin_banish');