MediaWiki:PartyQuest.css

From CoraTO Wiki - Official Wiki
Revision as of 08:33, 2 January 2026 by Noorisei (talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* PartyQuest styles: specific and scoped for Party Quest cards */

.token-card .partyquest-tabs {
  display: flex;
  gap: 8px;
  margin: 12px 0 16px;
  list-style: none;
  padding: 0;
}


.token-card .partyquest-info-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

.token-card .partyquest-info-card {
  background: var(--bg-1);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 6px 24px var(--shadow-soft);
  padding: 12px;
}

.token-card .partyquest-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.token-card .partyquest-card-header h4 {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  margin: 0;
}

.token-card .partyquest-card-header h4 a {
  color: var(--link);
  text-decoration: none;
}

.token-card .partyquest-monster-icon {
  width: 24px;
  height: 24px;
  border-radius: 6px;
}

.token-card .partyquest-level-badge {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  background: var(--bg-1);
  color: var(--heading);
  border: 1px solid var(--border);
  padding: 3px 8px;
  border-radius: 999px;
}

.token-card .partyquest-stats-details {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.token-card .partyquest-stat-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-1);
}

.token-card .partyquest-stat-label {
  font-weight: 700;
  color: var(--heading);
}

.token-card .partyquest-stat-value {
  color: var(--text-muted);
}

/* Light theme accents for special rows */
.token-card .partyquest-stat-info.partyquest-reward {
  background: var(--bg-1);
  border: 1px solid var(--border);
}
.token-card .partyquest-stat-info.partyquest-condition {
  background: var(--negative-bg);
  border: 1px solid var(--danger);
}

/* Header image sizing to prevent overflow */
#tab-party .token-card .token-card-header .image-container {
  flex: 0 0 auto;
}
#tab-party .token-card .token-card-header .image-container img {
  width: 64px;
  height: 64px;
  border-radius: 12px;
  max-width: 100%;
}

@media (max-width: 480px) {
  #tab-party .token-card .token-card-header {
    flex-wrap: wrap;
  }
  #tab-party .token-card .token-card-header .image-container img {
    width: 56px;
    height: 56px;
  }
}

/* Nested content visibility (leverages existing JS) */
.token-card .nested-content {
  display: none;
}
.token-card .nested-content.active {
  display: block;
}