Skip to content

C
coopwire-hypothesis
Commit 0eb95a36 authored by Kyle Keating's avatar Kyle Keating Committed by Kyle Keating
Browse files
Options

Change markdown editor :focus styling to look more like button 

This makes the focus outline behave with a rounded radius.
parent 5042fddc
Hide whitespace changes
Inline Side-by-side
Showing with 13 additions and 14 deletions
src/styles/sidebar/components/MarkdownEditor.scss
View file @ 0eb95a36
...@@ -28,26 +28,24 @@ ...@@ -28,26 +28,24 @@
} }
.MarkdownEditor__toolbar-button { .MarkdownEditor__toolbar-button {
@include buttons.reset-native-btn-styles; @include buttons.button--icon-only($with-active-state: false);
@include layout.row(center, center);
appearance: none;
min-width: 24px; min-width: 24px;
min-height: 24px; min-height: 24px;
color: var.$grey-5; padding-top: 0;
padding-bottom: 0;
&:hover, color: var.$grey-5;
&:focus { transition: none;
color: var.$grey-7;
}
&:disabled { &:disabled {
color: var.$grey-3; color: var.$grey-3;
} }
}
&-icon { svg.MarkdownEditor__toolbar-button-icon {
@include utils.icon--xsmall; // Stronger specificity to override mixin button styling
} @include utils.icon--xsmall;
} }
.MarkdownEditor__preview { .MarkdownEditor__preview {
...@@ -91,9 +89,10 @@ ...@@ -91,9 +89,10 @@
.MarkdownEditor__toolbar-button { .MarkdownEditor__toolbar-button {
min-width: var.$touch-target-size; min-width: var.$touch-target-size;
min-height: var.$touch-target-size; min-height: var.$touch-target-size;
}
&-icon { svg.MarkdownEditor__toolbar-button-icon {
@include utils.icon--small; // Stronger specificity to override mixin button styling
} @include utils.icon--small;
} }
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment