Fixing green button focus (#391)

MicroPad · Jan 24, 2022 · f67076f · f67076f
1 parent 6f9befc
commit f67076f
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 5 deletions.
diff --git a/app/src/app/DynamicAppCss.ts b/app/src/app/DynamicAppCss.ts
@@ -42,11 +42,6 @@ export function createDynamicCss(store: Store<IStoreState, MicroPadAction>): voi
 			input:not([type]):focus:not([readonly])+label, input[type=text]:not(.browser-default):focus:not([readonly])+label, input[type=password]:not(.browser-default):focus:not([readonly])+label, input[type=email]:not(.browser-default):focus:not([readonly])+label, input[type=url]:not(.browser-default):focus:not([readonly])+label, input[type=time]:not(.browser-default):focus:not([readonly])+label, input[type=date]:not(.browser-default):focus:not([readonly])+label, input[type=datetime]:not(.browser-default):focus:not([readonly])+label, input[type=datetime-local]:not(.browser-default):focus:not([readonly])+label, input[type=tel]:not(.browser-default):focus:not([readonly])+label, input[type=number]:not(.browser-default):focus:not([readonly])+label, input[type=search]:not(.browser-default):focus:not([readonly])+label, textarea.materialize-textarea:focus:not([readonly])+label {
 				color: ${theme.background === '#fff' ? theme.chrome : theme.text} !important;
 			}
-
-			.btn:hover, .btn-flat:hover, .btn-large:hover, .btn-small:hover {
-				background-color: ${theme.accent};
-				color: ${theme.accentContent};
-			}
 			
 			.modal {
 				background-color: ${theme.background};

diff --git a/app/src/app/root.css b/app/src/app/root.css
@@ -166,3 +166,16 @@ strong {
 	border-bottom: 2px solid var(--mp-theme-accentContent);
 }
 
+.btn:hover, .btn-flat:hover, .btn-large:hover, .btn-small:hover {
+	background-color: var(--mp-theme-accent);
+	color: var(--mp-theme-accentContent);
+}
+
+.red.btn, .red.btn-large, .red.btn-small {
+	color: #fff !important;
+}
+
+.btn:focus, .btn-large:focus, .btn-small:focus, .btn-floating:focus {
+	background-color: var(--mp-theme-chrome);
+	color: var(--mp-theme-explorerContent);
+}