Add password to float label and invalid state demos

pull/938/head
Cagatay Civici 2021-02-03 12:52:30 +03:00
parent 8fd94987ac
commit 9379f05b8e
2 changed files with 36 additions and 3 deletions

View File

@ -91,12 +91,18 @@
<label for="multiselect">MultiSelect</label> <label for="multiselect">MultiSelect</label>
</span> </span>
</div> </div>
<div class="p-field p-col-12"> <div class="p-field p-col-12 p-md-4">
<span class="p-float-label"> <span class="p-float-label">
<Textarea id="textarea" v-model="value10" rows="3" /> <Textarea id="textarea" v-model="value10" rows="3" />
<label for="textarea">Textarea</label> <label for="textarea">Textarea</label>
</span> </span>
</div> </div>
<div class="p-field p-col-12 p-md-4">
<span class="p-float-label">
<Password id="password" v-model="value11" />
<label for="password">Password</label>
</span>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -190,12 +196,18 @@
&lt;label for="multiselect"&gt;MultiSelect&lt;/label&gt; &lt;label for="multiselect"&gt;MultiSelect&lt;/label&gt;
&lt;/span&gt; &lt;/span&gt;
&lt;/div&gt; &lt;/div&gt;
&lt;div class="p-field p-col-12"&gt; &lt;div class="p-field p-col-12 p-md-4"&gt;
&lt;span class="p-float-label"&gt; &lt;span class="p-float-label"&gt;
&lt;Textarea id="textarea" v-model="value10" rows="3" /&gt; &lt;Textarea id="textarea" v-model="value10" rows="3" /&gt;
&lt;label for="textarea"&gt;Textarea&lt;/label&gt; &lt;label for="textarea"&gt;Textarea&lt;/label&gt;
&lt;/span&gt; &lt;/span&gt;
&lt;/div&gt; &lt;/div&gt;
&lt;div class="p-field p-col-12 p-md-4"&gt;
&lt;span class="p-float-label"&gt;
&lt;Password id="password" v-model="value11" /&gt;
&lt;label for="password"&gt;Password&lt;/label&gt;
&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt; &lt;/div&gt;
&lt;/div&gt; &lt;/div&gt;
</template> </template>
@ -227,6 +239,7 @@ export default {
value8: null, value8: null,
value9: null, value9: null,
value10: null, value10: null,
value11: null,
selectedCity: null, selectedCity: null,
cascadeCountries: [ cascadeCountries: [
{ {
@ -362,6 +375,7 @@ export default {
value8: null, value8: null,
value9: null, value9: null,
value10: null, value10: null,
value11: null,
valueIconLeft: null, valueIconLeft: null,
valueIconRight: null, valueIconRight: null,
selectedCity: null, selectedCity: null,
@ -528,12 +542,18 @@ export default {
<label for="multiselect">MultiSelect</label> <label for="multiselect">MultiSelect</label>
</span> </span>
</div> </div>
<div class="p-field p-col-12"> <div class="p-field p-col-12 p-md-4">
<span class="p-float-label"> <span class="p-float-label">
<Textarea id="textarea" v-model="value10" rows="3" /> <Textarea id="textarea" v-model="value10" rows="3" />
<label for="textarea">Textarea</label> <label for="textarea">Textarea</label>
</span> </span>
</div> </div>
<div class="p-field p-col-12 p-md-4">
<span class="p-float-label">
<Password id="password" v-model="value11" />
<label for="password">Password</label>
</span>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -564,6 +584,7 @@ export default {
value8: null, value8: null,
value9: null, value9: null,
value10: null, value10: null,
value11: null,
selectedCity: null, selectedCity: null,
cascadeCountries: [ cascadeCountries: [
{ {

View File

@ -42,6 +42,9 @@
<div class="p-field p-col-12 p-md-4"> <div class="p-field p-col-12 p-md-4">
<Textarea id="textarea" v-model="value9" rows="3" placeholder="Textarea" class="p-invalid" /> <Textarea id="textarea" v-model="value9" rows="3" placeholder="Textarea" class="p-invalid" />
</div> </div>
<div class="p-field p-col-12 p-md-4">
<Password id="password" v-model="value10" placeholder="Password" class="p-invalid" />
</div>
</div> </div>
</div> </div>
</div> </div>
@ -86,6 +89,9 @@
&lt;div class="p-field p-col-12 p-md-4"&gt; &lt;div class="p-field p-col-12 p-md-4"&gt;
&lt;Textarea id="textarea" v-model="value9" rows="3" placeholder="Textarea" class="p-invalid" /&gt; &lt;Textarea id="textarea" v-model="value9" rows="3" placeholder="Textarea" class="p-invalid" /&gt;
&lt;/div&gt; &lt;/div&gt;
&lt;div class="p-field p-col-12 p-md-4"&gt;
&lt;Password id="password" v-model="value10" placeholder="Password" class="p-invalid" /&gt;
&lt;/div&gt;
&lt;/div&gt; &lt;/div&gt;
</template> </template>
</code></pre> </code></pre>
@ -115,6 +121,7 @@ export default {
value7: null, value7: null,
value8: null, value8: null,
value9: null, value9: null,
value10: null,
selectedCity: null, selectedCity: null,
cascadeCountries: [ cascadeCountries: [
{ {
@ -249,6 +256,7 @@ export default {
value7: null, value7: null,
value8: null, value8: null,
value9: null, value9: null,
value10: null,
selectedCity: null, selectedCity: null,
cascadeCountries: [ cascadeCountries: [
{ {
@ -364,6 +372,9 @@ export default {
<div class="p-field p-col-12 p-md-4"> <div class="p-field p-col-12 p-md-4">
<Textarea id="textarea" v-model="value9" rows="3" placeholder="Textarea" class="p-invalid" /> <Textarea id="textarea" v-model="value9" rows="3" placeholder="Textarea" class="p-invalid" />
</div> </div>
<div class="p-field p-col-12 p-md-4">
<Password id="password" v-model="value10" placeholder="Password" class="p-invalid" />
</div>
</div> </div>
</div> </div>
</div> </div>
@ -392,6 +403,7 @@ export default {
value7: null, value7: null,
value8: null, value8: null,
value9: null, value9: null,
value10: null,
selectedCity: null, selectedCity: null,
cascadeCountries: [ cascadeCountries: [
{ {