01.10.2023 | Transition Buttons

U-Bodigat · Oct 1, 2023 · c428995 · c428995
1 parent 8069f2e
commit c428995
Show file tree

Hide file tree

Showing 22 changed files with 847 additions and 3 deletions.
diff --git a/Games/Memory/style.css b/Games/Memory/style.css
@@ -70,6 +70,7 @@ header p {
 }
 
 .button {
+    transition: 0.5s;
     background-color: #012f6b;
     color: #fff;
     text-decoration: none;
@@ -83,10 +84,12 @@ header p {
 }
 
 .button:hover {
+    transition: 0.5s;
     background-color: #006eff;
 }
 
 .button a {
+    transition: 0.5s;
     color: #fff;
     text-decoration: none;
 }
@@ -254,6 +257,7 @@ body {
 }
 
 #reset-button {
+    transition: 0.5s;
     padding: 12px 34px;
     font-size: 20px;
     border: none;
@@ -268,6 +272,7 @@ body {
 }
 
 #reset-button:hover {
+    transition: 0.5s;
     cursor: pointer;
     background-color: #00ff0d;
     color: #575757;

diff --git a/Games/PingPong/style.css b/Games/PingPong/style.css
@@ -71,6 +71,7 @@ header p {
 }
 
 .button {
+    transition: 0.5s;
     background-color: #012f6b;
     color: #fff;
     text-decoration: none;
@@ -84,10 +85,12 @@ header p {
 }
 
 .button:hover {
+    transition: 0.5s;
     background-color: #006eff;
 }
 
 .button a {
+    transition: 0.5s;
     color: #fff;
     text-decoration: none;
 }
@@ -159,6 +162,7 @@ header p {
 }
 
 #startButton {
+    transition: 0.5s;
     padding: 12px 34px;
     font-size: 20px;
     border: none;
@@ -170,13 +174,15 @@ header p {
 }
 
 #startButton:hover {
+    transition: 0.5s;
     background-color: #00ff0d;
     color: #575757;
     font-weight: 700;
     cursor: pointer;
 }
 
 #resetButton {
+    transition: 0.5s;
     padding: 12px 34px;
     font-size: 20px;
     border: none;
@@ -190,6 +196,7 @@ header p {
 }
 
 #resetButton:hover {
+    transition: 0.5s;
     cursor: pointer;
     background-color: #00ff0d;
     color: #575757;

diff --git a/Games/Schach/styles.css b/Games/Schach/styles.css
@@ -70,6 +70,7 @@ header p {
 }
 
 .button {
+    transition: 0.5s;
     background-color: #012f6b;
     color: #fff;
     text-decoration: none;
@@ -83,10 +84,12 @@ header p {
 }
 
 .button:hover {
+    transition: 0.5s;
     background-color: #006eff;
 }
 
 .button a {
+    transition: 0.5s;
     color: #fff;
     text-decoration: none;
 }
@@ -270,6 +273,7 @@ div.piece_container {
 }
 
 #startbutton {
+    transition: 0.5s;
     background-color: #012f6b;
     color: #fff;
     text-decoration: none;
@@ -293,13 +297,15 @@ div.piece_container {
 }
 
 #startbutton:hover {
+    transition: 0.5s;
     cursor: pointer;
     background-color: #0077ff;
     color: #333333;
     font-weight: 900;
 }
 
 #schwirigkeitenhintergrund {
+    transition: 0.5s;
     text-align: start;
     margin-left: 40px;
     background-color: #14291f;
@@ -311,16 +317,19 @@ div.piece_container {
 }
 
 #schwirigkeitenhintergrund label.radio-label {
+    transition: 0.5s;
     display: block;
     margin-bottom: 5px;
     cursor: pointer;
 }
 
 #schwirigkeitenhintergrund label.radio-label:hover {
+    transition: 0.5s;
     color: #00c3ff;
 }
 
 #schwirigkeitenhintergrund input[type="radio"] {
+    transition: 0.5s;
     appearance: none;
     -webkit-appearance: none;
     -moz-appearance: none;
@@ -335,12 +344,14 @@ div.piece_container {
 }
 
 #schwirigkeitenhintergrund input[type="radio"]:checked {
+    transition: 0.5s;
     cursor: pointer;
     background-color: #00c3ff;
     border-color: #00c3ff;
 }
 
 #schwirigkeitenhintergrund input:checked {
+    transition: 0.5s;
     cursor: pointer;
     color: #00c3ff;
     background-color: #00c3ff;

diff --git a/Games/Snake/style.css b/Games/Snake/style.css
@@ -60,6 +60,7 @@ header:hover {
 }
 
 .button {
+    transition: 0.5s;
     background-color: #012f6b;
     color: #fff;
     text-decoration: none;
@@ -73,10 +74,12 @@ header:hover {
 }
 
 .button:hover {
+    transition: 0.5s;
     background-color: #006eff;
 }
 
 .button a {
+    transition: 0.5s;
     color: #fff;
     text-decoration: none;
 }
@@ -91,6 +94,7 @@ header:hover {
 }
 
 #tastenbelegungen {
+    transition: 0.5s;
     text-align: center;
     justify-content: center;
     background-color: #00461e;
@@ -107,6 +111,7 @@ header:hover {
 }
 
 #tastenbelegungen:hover {
+    transition: 0.5s;
     font-weight: 700;
     cursor: crosshair;
     color: #000000;

diff --git a/Games/tictactoe/style.css b/Games/tictactoe/style.css
@@ -70,6 +70,7 @@ header p {
 }
 
 .button {
+    transition: 0.5s;
     background-color: #012f6b;
     color: #fff;
     text-decoration: none;
@@ -83,10 +84,12 @@ header p {
 }
 
 .button:hover {
+    transition: 0.5s;
     background-color: #006eff;
 }
 
 .button a {
+    transition: 0.5s;
     color: #fff;
     text-decoration: none;
 }
@@ -286,6 +289,7 @@ body {
 }
 
 button#restart-button {
+    transition: 0.5s;
     display: none;
     margin-top: 20px;
     background-color: #4CAF50;
@@ -301,6 +305,7 @@ button#restart-button {
 }
 
 button#restart-button:hover {
+    transition: 0.5s;
     cursor: pointer;
     background-color: #00ff0d;
     color: #575757;