body {
font-family: 'Poppins', sans-serif;
background: linear-gradient(135deg, #1f1c2c, #928dab); /* Dunkel-Violett zu Hell-Lila */
color: rgb(0, 0, 0);
text-align: center;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.container {
background: rgba(255, 255, 255, 0.15);
padding: 20px;
border-radius: 15px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
backdrop-filter: blur(10px);
max-width: 600px;
width: 150%;
}
/* Für den Titel
*/
h1 {
font-size: 18px; /* Noch kleinere Schriftgröße für den Titel */
margin-bottom: 15px;
}
/* Eingabefeld */
input {
background: rgba(255, 255, 255, 0.540);
width: 80%;
padding: 10px;
margin: 8px 0;
border: none;
border-radius: 8px;
outline: none;
text-align: center;
font-size: 14px; /* Kleinere Schriftgröße im Eingabefeld */
}
/* Der Button */
button {
background: rgba(255, 255, 255, 0.640);
padding: 10px 16px;
border: none;
border-radius: 8px;
background: #ff7eb3;
color: rgb(0, 0, 0);
font-size: 14px; /* Kleinere Schriftgröße für den Button */
cursor: pointer;
transition: 0.3s;
}
button:hover {
background: #ff4f8a;
}
.card {
margin-top: 15px;
padding: 18px;
background: rgba(255, 255, 255, 0.15);
border-radius: 10px;
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.2);
backdrop-filter: blur(5px);
text-align: left;
}
.card h2 {
margin-bottom: 8px;
font-size: 18px; /* Kleinere Schriftgröße */
}
.card p {
margin: 6px 0;
}
.server-variables {
margin-top: 15px;
padding: 12px;
background: rgba(255, 255, 255, 0.15);
border-radius: 8px;
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.2);
backdrop-filter: blur(5px);
text-align: left;
}
.server-variables h3 {
font-size: 16px; /* Kleinere Schriftgröße */
margin-bottom: 12px;
}
.scripts {
margin-top: 18px;
padding: 10px;
background: rgba(255, 255, 255, 0.15);
border-radius: 10px;
box-shadow: 0 4px 8px rgba(255, 255, 255, 0.1);
backdrop-filter: blur(8px);
text-align: left;
}
.scripts h3 {
font-size: 14px; /* Noch kleinere Schriftgröße */
margin-bottom: 6px; /* Weniger Abstand */
color: #ff7eb3;
font-weight: bold;
text-shadow: 1px 1px 3px rgba(255, 255, 255, 0.1);
}
#toggleScriptsButton {
background-color: #ff7eb3;
padding: 6px 16px; /* Weniger Padding */
border-radius: 6px;
border: none;
color: rgb(0, 0, 0);
cursor: pointer;
transition: 0.3s;
font-size: 12px; /* Kleinere Schriftgröße */
box-shadow: 0 3px 8px rgba(255, 255, 255, 0.1);
}
#toggleScriptsButton:hover {
background-color: #ff4f8a;
transform: scale(1.05);
}
#searchScripts {
width: 100%;
padding: 8px;
margin: 10px 0;
border-radius: 6px;
border: none;
outline: none;
font-size: 12px; /* Noch kleinere Schriftgröße */
background-color: rgba(255, 255, 255, 0.15);
transition: 0.3s;
}
#searchScripts:focus {
background-color: rgba(255, 255, 255, 0.15);
box-shadow: 0 2px 5px rgba(255, 255, 255, 0.1);
}
#scriptsContainer {
max-height: 180px; /* Kleinere Höhe */
overflow-y: auto;
margin-top: 10px;
padding: 6px;
border-radius: 8px;
background-color: rgba(255, 255, 255, 0.15);
}
#scriptsContainer li {
padding: 8px 10px;
background-color: rgba(255, 255, 255, 0.15);
border-radius: 6px;
margin-bottom: 5px; /* Weniger Abstand */
list-style-type: none;
transition: background-color 0.3s, transform 0.3s;
}
#scriptsContainer li:hover {
background-color: rgba(255, 255, 255, 0.2);
transform: scale(1.02);
}
.scroll-container {
max-height: 180px; /* Kleinere Höhe */
overflow-y: auto;
border: 1px solid #000000;
padding: 6px;
background-color: rgba(255, 255, 255, 0.15);
}
footer {
text-align: center;
margin-top: 15px;
padding: 8px; /* Weniger Padding für Footer */
background: rgba(255, 255, 255, 0.1);
border-radius: 10px;
backdrop-filter: blur(5px);
}
.partners {
margin-top: 15px;
text-align: center;
padding: 6px; /* Weniger Padding für die Partner-Sektion */
background: rgba(255, 255, 255, 0.1);
border-radius: 5px;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
}
.partners p {
font-size: 10px; /* Noch kleinere Schriftgröße */
color: #000000;
margin: 3px 0;
}
.partners a {
text-decoration: none;
color: #ff7eb3;
font-weight: bold;
transition: color 0.3s ease;
}
.partners a:hover {
color: #ff4f8a;
}
.players {
margin-top: 15px;
padding: 10px;
background: rgba(255, 255, 255, 0.15);
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(8px);
text-align: left;
}
.players h3 {
font-size: 14px; /* Kleinere Schriftgröße */
margin-bottom: 6px; /* Weniger Abstand */
color: #ff7eb3;
font-weight: bold;
text-shadow: 1px 1px 3px rgba(255, 255, 255, 0.1);
}
#togglePlayersButton {
background-color: #ff7eb3;
padding: 6px 16px;
border-radius: 6px;
border: none;
color: rgb(0, 0, 0);
cursor: pointer;
transition: 0.3s;
font-size: 12px;
box-shadow: 0 3px 8px rgba(255, 255, 255, 0.1);
}
#togglePlayersButton:hover {
background-color: #ff4f8a;
transform: scale(1.05);
}
#searchPlayers {
width: 100%;
padding: 8px;
margin: 10px 0;
border-radius: 6px;
border: none;
outline: none;
font-size: 12px;
background-color: rgba(255, 255, 255, 0.15);
transition: 0.3s;
}
#searchPlayers:focus {
background-color: rgba(255, 255, 255, 0.15);
box-shadow: 0 2px 5px rgba(255, 255, 255, 0.1);
}
#playersContainer {
max-height: 180px; /* Kleinere Höhe */
overflow-y: auto;
margin-top: 10px;
padding: 6px;
border-radius: 8px;
background-color: rgba(255, 255, 255, 0.15);
}
#playersContainer li {
padding: 6px 10px;
background-color: rgba(255, 255, 255, 0.15);
border-radius: 6px;
margin-bottom: 5px;
list-style-type: none;
transition: background-color 0.3s, transform 0.3s;
}
#playersContainer li:hover {
background-color: rgba(255, 255, 0, 0.2);
transform: scale(1.02);
}