diff --git a/css/startScreenLayout.css b/css/startScreenLayout.css new file mode 100644 index 0000000..5652c35 --- /dev/null +++ b/css/startScreenLayout.css @@ -0,0 +1,52 @@ +body, h1, button { + margin: 0; + padding: 0; + font-family: 'Arial', sans-serif; +} + +body { + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + background: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%); +} + +#spielRaum { + text-align: center; + padding: 20px; + background-color: #ffffffcc; + border-radius: 15px; + box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); +} + + +h1 { + font-size: 2.5em; + color: #333; + margin-bottom: 20px; + text-shadow: 1px 1px 2px #fff; +} + +button { + background-color: #4CAF50; + color: white; + border: none; + padding: 15px 30px; + border-radius: 25px; + cursor: pointer; + font-size: 1.2em; + transition: background-color 0.3s, transform 0.3s; +} + + +button:hover { + background-color: #45a049; + transform: scale(1.1); +} + + +button:focus { + outline: none; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); +} diff --git a/js/startjs.js b/js/startjs.js new file mode 100644 index 0000000..944fb86 --- /dev/null +++ b/js/startjs.js @@ -0,0 +1,5 @@ +const startButton = document.querySelector("#startScreen button"); + +startButton.addEventListener("click", ()=>{ + window.location.href = 'index.html'; +}); \ No newline at end of file diff --git a/startScreen.html b/startScreen.html new file mode 100644 index 0000000..ff7bd7a --- /dev/null +++ b/startScreen.html @@ -0,0 +1,20 @@ + + +
+ + + +