Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make hints lightbulb button more obvious #273

Closed
alexmojaki opened this issue Jan 13, 2022 · 1 comment · Fixed by #399
Closed

Make hints lightbulb button more obvious #273

alexmojaki opened this issue Jan 13, 2022 · 1 comment · Fixed by #399
Labels
frontend The Javascript user interface

Comments

@alexmojaki
Copy link
Owner

Some users don't notice it at all

@alexmojaki alexmojaki added the frontend The Javascript user interface label Jan 13, 2022
@spamegg1
Copy link
Collaborator

I offer 8 options:

  1. No change:
    0

  2. Simply make the icon larger:

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

1

  1. 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";

2

  1. Make it animated, AND larger:
    3

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;
}

4

5

6

7

Or something else... (beyond my ability)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
frontend The Javascript user interface
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants