Adding tabbable events

[schoettler]

Switching EventWrapper content into <button> for accessibility purposes (navigation by tab).

[jquense]

Looks great just two small notes

[jquense]

can we rely on the default focus outline instead? that will also avoid the shifting of buttons as you tab and their border grows

[schoettler]

Hmmm I think only Chrome has a default focus outline.

Looking at the agent stylesheet it seems to be:
outline-color: rgb(59, 153, 252)

[schoettler]

Perhaps we can override that behaviour for the events, since outline doesn't really respect the border-radius:

With:

 &:focus {
    border: 2px solid rgb(59, 153, 252); // (or hex equivalent, saved as variable)
    outline: none;
}

And defaulting to:

.rbc-event {
  border: 2px solid @event-color;
}

[jquense]

you don't see an focus outline when tabbing through buttons on FF et all? They should all have something.

The main reason i want to stick what the browser default here is it's easier for folks to reset and control themselves, as opposed to having to undo our styles and add something else. It doesn't need to be pretty, just easily changeable

[schoettler]

... Or append Chrome's default to all browsers, so it remains untouched in Chrome but has a default focus for other browsers:
outline: 5px auto rgb(59, 153, 252);

[jquense]

i think we probably need a more aggressive button style reset if we are gonna use the button tag. e.g.

button {
  padding: 0;
  margin: 0;
  border: none;
  box-shadow: none;
  background: none;
}

[jquense]

this will reset all buttons, we need to scope this to just events

[schoettler]

Does it look good now? Will probably include readable content (aria labels) for screen readers to complete the accessibility parts on the events in the future o/

[jquense]

instead lets do display:block; maybe?

[schoettler]

display: block doesn't seem to apply the full width, how about both?

[schoettler]

Hmm display: block seems to ruin the +5 more behaviour when events can't fit vertically

[jquense]

its fine to move this up to the event.less file and combine the selector

[schoettler]

Under the same .rbc-event rule of event.less?

[schoettler]

Should we merge this? @jquense

[jquense]

thanks @schoettler !