krikkert/habitica
1
0
Fork 0
mirror of https://github.com/HabitRPG/habitica.git synced 2025-12-18 23:27:26 +01:00
Code Issues Packages Projects Releases Wiki Activity

Update :focus outline for men icons

Browse Source 
Make the .svg-icon focus style match its hover style.
This commit is contained in:
Ian Oxley
2019-03-14 20:44:09 +00:00
parent 3d99a64e96
commit bd9d9d31c3
2 changed files with 7 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
website/client/components/header/menu.vue
View File

@@ -288,6 +288,7 @@ div
margin-right: 24px; margin-right: 24px;
} }
&:focus /deep/ .top-menu-icon.svg-icon,
&:hover /deep/ .top-menu-icon.svg-icon { &:hover /deep/ .top-menu-icon.svg-icon {
color: $white; color: $white;
} }

6
website/client/components/ui/customMenuDropdown.vue
View File

@@ -12,6 +12,12 @@ A simplified dropdown component that doesn't rely on buttons as toggles like bo
<style lang="scss"> <style lang="scss">
@import '~client/assets/scss/colors.scss'; @import '~client/assets/scss/colors.scss';
.habitica-menu-dropdown {
&:hover,
&:focus { // NB focus styles match the hover styles for .svg-icon
outline: none;
}
}
.habitica-menu-dropdown.open { .habitica-menu-dropdown.open {
.habitica-menu-dropdown-toggle .svg-icon { .habitica-menu-dropdown-toggle .svg-icon {