Playing an ugly sound when a timer is ringing

1 files changed, 14 insertions, 12 deletions

diff --git a/design/design.css b/design/design.css
index 257a017..681e770 100644
--- a/design/design.css
+++ b/design/design.css
@@ -13,6 +13,7 @@
   padding-left: 50px;
   padding-right: 50px;
   font-family: "DejaVu Serif";
+  transition: all 0.4s ease;
 }
 
 .title > button.addTimer {
@@ -24,6 +25,13 @@
   font-size: 50px;
   margin-top: 35px;
   margin-right: 50px;
+  transition: all 0.4s ease;
+}
+
+.title > button.addTimer:hover,
+.title > button.title:hover {
+  color: #CCCC88;
+  border-color: #CCCC88;
 }
 
 .timers {
@@ -45,26 +53,20 @@
   border-radius: 2px;
 }
 
-@keyframes ringing {
-  30% {
-    background-color: #FED5AE;
-  }
-  100% {
-    background-color: #FED5AE;
-  }
+.block:hover {
+  border: 1px solid #BBBBBB;
 }
 
-.timer.isRinging > :not(.remove) {
-  animation: ringing 2s linear infinite alternate;
+.timer.isRunning > :not(.remove) {
+  background-color: #CDE4C2;
 }
 
-.timer.isRunning > .time {
-  color: #33AA22;
+.timer.isRinging > :not(.remove) {
+  background-color: #FED5AE;
 }
 
 .timer > button.name {
   width: 300px;
-  border: none;
 }
 
 .timer > .time {