114 lines
2.9 KiB
CSS
114 lines
2.9 KiB
CSS
body {
|
|
font-family: Arial, sans-serif;
|
|
background-color: #382d3d;
|
|
color: #ffffff;
|
|
margin: 0;
|
|
padding: 2px;
|
|
}
|
|
|
|
/* Stil für den Event-Kasten */
|
|
details {
|
|
background-color: #eeeeee; /* Helles Grau für den zusammengeklappten Zustand */
|
|
margin-bottom: 5px; /* Abstand zwischen den Event-Kästen */
|
|
border-radius: 5px; /* Abgerundete Ecken */
|
|
padding: 5px; /* Innenabstand innerhalb des details Elements */
|
|
border: 1px solid #ccc; /* Leichter Rahmen um das Element */
|
|
}
|
|
|
|
/* Stil für den aufklappbaren Teil des Event-Kastens */
|
|
summary {
|
|
font-weight: bold;
|
|
color: #382d3d; /* Dunkle Schrift für den Event-Titel */
|
|
cursor: pointer;
|
|
}
|
|
|
|
pre {
|
|
background-color: #ffffff; /* Weißer Hintergrund für JSON-Inhalte */
|
|
color: #382d3d; /* Dunkle Schriftfarbe für JSON-Inhalte */
|
|
border: none; /* Entfernt jeglichen Rahmen */
|
|
overflow-x: auto; /* Ermöglicht horizontales Scrollen bei langen Zeilen */
|
|
white-space: pre-wrap; /* Ermöglicht den Zeilenumbruch bei Bedarf */
|
|
padding: 5px; /* Innenabstand für bessere Lesbarkeit */
|
|
}
|
|
|
|
/* Farben und Stil für die Eigenschaftsnamen innerhalb des JSON-Objekts */
|
|
.json-property-name {
|
|
color: #fe6845; /* Farbe für die Eigenschaftsnamen */
|
|
font-weight: bold;
|
|
}
|
|
|
|
/* Stil für die Werte innerhalb des JSON-Objekts, wenn benötigt */
|
|
.json-property-value {
|
|
color: #382d3d;
|
|
}
|
|
|
|
.container {
|
|
max-width: 600px;
|
|
margin: auto;
|
|
background: #382d3d;
|
|
padding: 5px;
|
|
border-radius: 8px;
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
|
min-width: 300px;
|
|
}
|
|
|
|
.label {
|
|
font-weight: bold;
|
|
color: #fe6845;
|
|
}
|
|
|
|
.value {
|
|
color: #ffffff;
|
|
}
|
|
|
|
.events, .channels {
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.event-details, .channel-details {
|
|
color: #382d3d;
|
|
padding: 10px;
|
|
border-radius: 4px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.event-details summary, .channel-details summary {
|
|
cursor: pointer;
|
|
font-weight: bold;
|
|
color: #382d3d; /* Dunkelviolett für Event-Namen */
|
|
}
|
|
|
|
.event-details pre, .channel-details pre {
|
|
background: #fff;
|
|
color: #382d3d;
|
|
padding: 10px;
|
|
border-radius: 4px;
|
|
overflow: auto;
|
|
max-height: 200px;
|
|
font-family: monospace; /* Schriftart für bessere Lesbarkeit von JSON */
|
|
}
|
|
|
|
.event-details pre .key, .channel-details pre .key {
|
|
color: #fe6845; /* Orange für JSON-Schlüssel/Eigenschaftsnamen */
|
|
}
|
|
|
|
.event-details pre .string, .event-details pre .number, .channel-details pre .string, .channel-details pre .number {
|
|
color: #382d3d; /* Dunkelviolett für Werte im JSON */
|
|
}
|
|
|
|
#options-link {
|
|
position: absolute; /* Absolut positioniert, relativ zum nächstgelegenen positionierten Vorfahren */
|
|
top: 5px; /* Abstand von oben */
|
|
right: 5px; /* Abstand von rechts */
|
|
color: #ccc7aa; /* Linkfarbe */
|
|
padding: 5px 5px;
|
|
border-radius: 5px;
|
|
text-decoration: none;
|
|
font-weight: normal; /* Entfernt fettgedrucktes Styling */
|
|
font-size: 10px;
|
|
}
|
|
|
|
#options-link:hover {
|
|
background-color: #fe6845;
|
|
color: #382d3d;
|
|
} |