vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-09 00:42:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

Text cosmetics

Browse source
This commit is contained in:
Cagatay Civici 2023-03-21 11:31:13 +03:00
parent 8309633198
commit 3456b5bd35
7 changed files with 98 additions and 83 deletions
Download patch file Download diff file Expand all files Collapse all files

18
doc/accessibility/FormControlsDoc.vue
View file

@ -10,22 +10,28 @@
</code></pre>
<p class="doc-section-description">On the other hand, a fancy css based button using a div has no keyboard or screen reader support.</p>
<div class="doc-section-description">
<p>On the other hand, a fancy css based button using a div has no keyboard or screen reader support.</p>
</div>
<pre v-code.script><code>
&lt;div class="fancy-button" @click="onButtonClick(event)"&gt;Click&lt;/div&gt;
</code></pre>
<p class="doc-section-description">
<i>tabindex</i> is required to make a div element accessible in addition to use a keydown to bring the keyboard support back. To avoid the overload and implementing functionality that is already provided by the browser, native form controls
should be preferred.
</p>
<div class="doc-section-description">
<p>
<i>tabindex</i> is required to make a div element accessible in addition to use a keydown to bring the keyboard support back. To avoid the overload and implementing functionality that is already provided by the browser, native form
controls should be preferred.
</p>
</div>
<pre v-code.script><code>
&lt;div class="fancy-button" @click="onClick(event)" @keydown="onKeyDown(event)" tabindex="0"&gt;Click&lt;/div&gt;
</code></pre>
<p class="doc-section-description">Form components must be related to another element that describes what the form element is used for. This is usually achieved with the <i>label</i> element.</p>
<div class="doc-section-description">
<p>Form components must be related to another element that describes what the form element is used for. This is usually achieved with the <i>label</i> element.</p>
</div>
<pre v-code.script><code>
&lt;label for="myinput"&gt;Username:&lt;/label&gt;
&lt;input id="myinput" type="text" name="username" /&gt;