[IMPROVE] add hover effect (#566)

* add hover effect * change class name
RocketChat · Mar 22, 2021 · ba9368b · ba9368b
1 parent a7f2220
commit ba9368b
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 1 deletion.
diff --git a/src/components/Footer/styles.scss b/src/components/Footer/styles.scss
@@ -39,6 +39,11 @@
 		font-weight: bold;
 		line-height: 1;
 
+		&:hover,
+		&:focus{
+			color: black;	
+		}
+
 		@include pressable-button(2px);
 	}
 

diff --git a/src/routes/Chat/component.js b/src/routes/Chat/component.js
@@ -199,7 +199,7 @@ export default class Chat extends Component {
 							handleEmojiClick={this.handleEmojiClick}
 							pre={(
 								<ComposerActions>
-									<ComposerAction onClick={this.toggleEmojiPickerState}>
+									<ComposerAction className={createClassName(styles, 'emoji-picker-icon')} onClick={this.toggleEmojiPickerState}>
 										<EmojiIcon width={20} height={20} />
 									</ComposerAction>
 								</ComposerActions>

diff --git a/src/routes/Chat/styles.scss b/src/routes/Chat/styles.scss
@@ -56,6 +56,14 @@
 
 		opacity: 0.6;
 	}
+
+	.emoji-picker-icon{
+		color:#696969;
+		&:hover,
+		&:focus{
+			color: black;	
+		}
+	}
 }
 
 @keyframes loader-rotate {