futurecoder
futurecoder copied to clipboard
Make hints lightbulb button more obvious
Some users don't notice it at all
I offer 8 options:
-
No change:

-
Simply make the icon larger:
// main.scss
.hint-icon {
position: fixed;
bottom: 10%;
right: 10px;
//width: 48px;
width: 72px;
//height: 48px;
height: 72px;
}

- Make it animated (same size). It blinks between white/red background once per second:
// Hints.js
//import hintIcon from "./img/hint.png";
import hintIcon from "./img/hint.gif";

- Make it animated, AND larger:

Then: basically the same as 0,1,2,3 but, in the middle of the screen, and slightly more elevated from the bottom:
// main.scss
.hint-icon {
position: fixed;
//bottom: 10px;
bottom: 10%;
//right: 10px;
right: 50%;
width: 48px;
height: 48px;
}




Or something else... (beyond my ability)