vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Docs for filled input

pull/358/head
cagataycivici 2020-06-20 13:12:24 +03:00
parent 493a0c303c
commit 78a97d9a39
1 changed files with 19 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/views/inputtext/InputTextDoc.vue
View File

@ -44,6 +44,21 @@ import InputText from 'primevue/inputtext';
<InputText type="text" class="p-inputtext-sm" placeholder="Small" /> <InputText type="text" class="p-inputtext-sm" placeholder="Small" />
<InputText type="text" placeholder="Normal" /> <InputText type="text" placeholder="Normal" />
<InputText type="text" class="p-inputtext-lg" placeholder="Large" /> <InputText type="text" class="p-inputtext-lg" placeholder="Large" />
</CodeHighlight>
<h5>Outlined vs Filled</h5>
<p>Input fields come in two styles, default is <i>outlined</i> with borders around the field whereas <i>filled</i> alternative adds a background color
to the field. Appling <i>p-input-filled</i> to an element or wrapping the container with <i>p-input-filled</i> enables the filled style. If you prefer
to use filled inputs in the entire application, use a global container such as document body or the application container to apply the style class.</p>
<CodeHighlight>
&lt;InputText type="text" class="p-input-filled" /&gt;
</CodeHighlight>
<CodeHighlight>
&lt;div class="p-input-filled"&gt;
&lt;InputText type="text" /&gt;
&lt;/div&gt;
</CodeHighlight> </CodeHighlight>
<h5>Properties</h5> <h5>Properties</h5>
@ -74,6 +89,10 @@ import InputText from 'primevue/inputtext';
<tr> <tr>
<td>p-inputtext-lg</td> <td>p-inputtext-lg</td>
<td>Larger input element</td> <td>Larger input element</td>
</tr>
<tr>
<td>p-inputtext-filled</td>
<td>Filled input style.</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>