README.pt_br.md

CURTIU ? Deixe uma ⭐ : 😞

Botões para adicionar/remover contraste e aumentar/diminuir o tamanho da fonte.

Ler em outros idiomas.

🇺🇸

Instalação

npm install accessibility-buttons --save

Uso

Importante

• accessibility-buttons/dist/css/accessibility-buttons.css
• accessibility-buttons/dist/js/accessibility-buttons.js

Insira os botões

<button type="button" data-accessibility="font">+A</button>
<button type="button" data-accessibility="contrast">Add Contrast</button>

Inicializando após o DOM ser carregado

accessibilityButtons()

Observação: Font size só funciona com as unidades em ou rem.

Configurações

Para configurar os nomes dos botões e aria-labels, use os seguinte parâmetros:

// default values
accessibilityButtons({
    font: {
        nameButtonIncrease: '+A',
        ariaLabelButtonIncrease: 'Increase Font',
        nameButtonDecrease: '-A',
        ariaLabelButtonDecrease: 'Decrease Font'
    },

    contrast: {
        nameButtonAdd: 'Add Contrast',
        ariaLabelButtonAdd: 'Add Contrast',
        nameButtonRemove: 'Remove Contrast',
        ariaLabelButtonRemove: 'Remove Contrast'
    }
})

Font size e cores do contraste podem ser customizados sobrescrevendo as classes.

Exemplo

body {
    font-size: 1em;
    color: #a9a9a9;
    background: #000;
}

body input,
body textarea,
body select,
body button {
/* The default font-size of these elements is approximately 20% less than the body */
  font-size: 0.9em;
}

body.accessibility-font {
    font-size: 1.5em;
}

body.accessibility-font input,
body.accessibility-font textarea,
body.accessibility-font select,
body.accessibility-font button {
/* The default font-size of these elements is approximately 20% less than the body */
  font-size: 1.2em;
}

body.accessibility-contrast {
    color: #000;
    background: #a9a9a9;
}

Contribua

Veja como contribuir.

Créditos

Dica de acessibilidade arial-label - Bruno Pulis

Incluido o sinal $ no nome da variável dos elementos cacheados para facilitar a identificação - Adler Parnas

Licença

Accessibility Buttons é lançado sob os termos da licença MIT license.