feat(calendar): Enhance accessibility by adding visually hidden text …

[mryunt02]

Changes

• Added visually hidden text to the navigation buttons for improved accessibility:
  • <span class="visually-hidden">Previous Calendar View</span> was added to the previous button.
  • <span class="visually-hidden">Next Calendar View</span> was added to the next button.

CSS

• Added the following CSS class to hide the text visually while keeping it accessible to screen readers:

  .visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
  }

Related Issue

Fixes #939

[erbilnas]

Thank you so much for this finding about accessibility 🙏 Setting the label attribute for bl-button works simply fine—no need to add an extra class. Example: Icon-Only Buttons

[erbilnas]

Also, if you could apply the same for other buttons, we’d really appreciate it! 🧡