New Character Sheet: Adventure Islands / Neues Charakterblatt: Adventure Islands

AdventureIslands/AdventureIslands.css

@@ -0,0 +1,255 @@
+/* ================================
+   GLOBAL / GRUNDLAYOUT
+   ================================ */
+
+/* Gesamte Charakterbogen-Fläche */
+.charsheet {
+  font-family: Arial, sans-serif;
+  font-size: 12px;
+  background: #d4f2f5;         /* türkisblauer Gesamt-Hintergrund */
+  color: #000;                 /* Standardschrift: schwarz */
+  padding: 8px;
+}
+
+/* Haupt-Container der neuen Version */
+.sheet-ai2 {
+  max-width: 1250px;
+  margin: 0 auto;
+  padding: 8px;
+}
+
+/* Überschriften in Gold */
+.charsheet h1,
+.charsheet h2,
+.charsheet h3,
+.sheet-ai2-block-title {
+  color: #d4af37;              /* goldener Farbton */
+}
+
+/* Standardtext explizit schwarz halten */
+.charsheet p,
+.charsheet span,
+.charsheet label,
+.charsheet td,
+.charsheet th {
+  color: #000;
+}
+
+/* ================================
+   TABS (Seitenumschaltung)
+   ================================ */
+
+.sheet-ai2-tab {
+  margin-right: 8px;
+}
+
+/* Seiten standardmäßig ausblenden */
+.sheet-ai2-page {
+  display: none;
+  margin-top: 6px;
+  padding: 8px;
+  background: #fdfcf8;         /* helles „Karten“-Beige */
+  border: 1px solid #b0c4c7;
+  border-radius: 4px;
+  box-shadow: 0 1px 3px rgba(0,0,0,0.18);
+}
+
+/* Sichtbare Seite je nach Tab */
+.sheet-ai2-tab1:checked ~ .sheet-ai2-page1 { display: block; }
+.sheet-ai2-tab2:checked ~ .sheet-ai2-page2 { display: block; }
+.sheet-ai2-tab3:checked ~ .sheet-ai2-page3 { display: block; }
+.sheet-ai2-tab4:checked ~ .sheet-ai2-page4 { display: block; }
+.sheet-ai2-tab5:checked ~ .sheet-ai2-page5 { display: block; }
+
+/* ================================
+   BLOECKE / KARTEN
+   ================================ */
+
+.sheet-ai2-block {
+  border: 1px solid #c7d3d6;
+  border-radius: 4px;
+  padding: 6px 8px;
+  margin-bottom: 8px;
+  background: #ffffff;          /* heller Block auf beigem Seiten-Hintergrund */
+}
+
+.sheet-ai2-block-title {
+  font-weight: bold;
+  font-size: 0.95em;
+  border-bottom: 1px solid #d9d9d9;
+  margin: -2px -4px 4px -4px;
+  padding: 2px 4px;
+}
+
+/* ================================
+   GRIDS
+   ================================ */
+
+.sheet-ai2-grid2 {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 4px 8px;
+}
+
+.sheet-ai2-grid3 {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 4px 8px;
+}
+
+.sheet-ai2-grid4 {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 4px 8px;
+}
+
+/* ================================
+   LABELS & FELDER
+   ================================ */
+
+.sheet-ai2-block label {
+  display: block;
+  font-weight: bold;
+  font-size: 11px;
+  margin-bottom: 2px;
+}
+
+.sheet-ai2-block input[type="text"],
+.sheet-ai2-block input[type="number"],
+.sheet-ai2-block textarea,
+.sheet-ai2-block select {
+  width: 100%;
+  box-sizing: border-box;
+  font-size: 11px;
+  padding: 2px 3px;
+  margin-top: 1px;
+  border: 1px solid #b8c2c5;
+  border-radius: 3px;
+  background: #fdfdfd;
+  color: #000;
+}
+
+.sheet-ai2-block textarea {
+  min-height: 40px;
+  resize: vertical;
+}
+
+/* ================================
+   TABELLEN / ZEILEN (Fertigkeiten etc.)
+   ================================ */
+
+/* „Tabelle“ als Container */
+.sheet-ai2-table {
+  width: 100%;
+}
+
+/* Jede Zeile wird ein Flex-Container */
+.sheet-ai2-row {
+  display: flex;
+  align-items: center;
+  gap: 2px;
+  margin-bottom: 2px;
+}
+
+/* Spalten gleichmäßig verteilen */
+.sheet-ai2-row > span {
+  flex: 1 1 0;
+}
+
+/* Header-Zeile */
+.sheet-ai2-row.sheet-ai2-header > span {
+  font-weight: bold;
+  border-bottom: 1px solid #b0b0b0;
+  padding-bottom: 2px;
+}
+
+/* Inputs/Selects in Tabellen vollbreit */
+.sheet-ai2-row input,
+.sheet-ai2-row select,
+.sheet-ai2-row textarea {
+  width: 100%;
+  box-sizing: border-box;
+}
+
+/* ================================
+   ROLL-BUTTONS & SONSTIGES
+   ================================ */
+
+.sheet-ai2 button[type="roll"],
+.sheet-ai2 button[type="action"] {
+  width: 100%;
+  font-size: 11px;
+  padding: 2px;
+  border-radius: 3px;
+  border: 1px solid #a0b5c0;
+  background: #e0f2f7;
+  color: #000;
+  cursor: pointer;
+}
+
+.sheet-ai2 button[type="roll"]:hover,
+.sheet-ai2 button[type="action"]:hover {
+  background: #cbe6f0;
+}
+
+/* Zustände (Checkbox-Zeile auf Seite 2) */
+.sheet-ai2-conditions label {
+  display: inline-block;
+  margin-right: 8px;
+  margin-bottom: 2px;
+  font-weight: normal;
+}
+
+.sheet-ai2-conditions input[type="checkbox"] {
+  margin-right: 2px;
+}
+
+/* ================================
+   ALTES TAB-GERUEST .sheet-ai
+   (falls noch im HTML, schlicht halten)
+   ================================ */
+
+.sheet-ai {
+  font-family: Arial, sans-serif;
+  font-size: 12px;
+  padding: 5px;
+}
+
+.sheet-ai .sheet-tab {
+  margin: 4px 4px 0 0;
+}
+
+.sheet-page {
+  display: none;
+  margin-top: 8px;
+  padding-top: 4px;
+  border-top: 1px solid #999;
+}
+
+input.sheet-tab1:checked ~ .sheet-page1 { display: block; }
+input.sheet-tab2:checked ~ .sheet-page2 { display: block; }
+input.sheet-tab3:checked ~ .sheet-page3 { display: block; }
+input.sheet-tab4:checked ~ .sheet-page4 { display: block; }
+input.sheet-tab5:checked ~ .sheet-page5 { display: block; }
+
+/* Mindestbreite für Text- und Zahlenfelder,
+   damit sie nie super schmal werden */
+.sheet-ai2-block input[type="text"],
+.sheet-ai2-block input[type="number"] {
+  min-width: 80px;   /* bei Bedarf auf 100px erhöhen */
+}
+/* Vorschau der Spieler-Flagge */
+.sheet-flag-preview {
+  margin-top: 4px;
+  text-align: center;
+}
+
+.sheet-flag-preview img {
+  max-width: 100%;
+  max-height: 80px;              /* Höhe bei Bedarf anpassen */
+  border: 1px solid #b8c2c5;
+  border-radius: 3px;
+  background: #fdfdfd;
+}
+
+/* ===== Ende Adventure Islands – V2 (CSS) ===== */