Button animations

src/components/comments.js

@@ -78,7 +78,6 @@ function Comment({ comment, index, onComment, onDelete, onReact, uid }) {
             </span>
             {own && (
               <span
-                className={styles.delete_bttn}
                 onClick={() => {
                   onDelete([index])
                 }}

src/components/comments.module.css

@@ -18,16 +18,6 @@
   color: gainsboro;
 }
 
-.delete_bttn {
-  font-size: 15px;
-  transition: width 0.5s, height 0.5s, ease-in 0.5s;
-}
-
-.delete_bttn:hover {
-  transition: width 0.5s, height 0.5s, ease-out 0.5s;
-  color: gainsboro;
-}
-
 .comment {
   margin-left: 10px;
   margin-right: 30px;

src/components/newsEntry.js

@@ -44,7 +44,6 @@ export default function NewsEntry({
       <div className={'actions'}>
         {uid === user ? (
           <span
-            className={styles.delete_bttn}
             onClick={() => {
               onPostDelete()
             }}

src/components/newsEntry.module.css

@@ -27,11 +27,6 @@
   margin: 5px 5px;
 }
 
-.delete_bttn {
-  font-size: 15px;
-  transition: width 0.5s, height 0.5s, ease-in 0.5s;
-}
-
 .adminPost {
   border-left: 4px solid var(--text-color);
 }

src/defaultStyles.css

@@ -361,6 +361,7 @@ input:focus {
   border-radius: 6px;
   cursor: pointer;
   user-select: none;
+  transition: width 0.5s, height 0.5s, ease-in 0.2s;
 }
 
 .actions > span:hover {