Commander1024/lostplaces-frontend
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Refactoring markup

Browse Source
This commit is contained in:
reverend 2020-07-31 23:12:40 +02:00
parent ab7c6c8d84
commit 907e0602ce
1 changed files with 23 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
components/02_Molecules/form/form.hbs
View File

@ -3,44 +3,48 @@
<legend class="LP-Form__Legend">Basic data</legend> <legend class="LP-Form__Legend">Basic data</legend>
<div class="LP-Form__Composition LP-Form__Composition--breakable"> <div class="LP-Form__Composition LP-Form__Composition--breakable">
<span class="LP-Form__Field LP-Input LP-Input--error"> <div class="LP-Form__Field">
<label for="input123" class="LP-Input__Label">First name</label> <div class="LP-Input LP-Input--error">
<input type="text" id="input123" class="LP-Input__Field"/> <label for="input123" class="LP-Input__Label">First name</label>
<span class="LP-Input__Message">Field is required</span> <input type="text" id="input123" class="LP-Input__Field" placeholder="Peter"/>
</span> <span class="LP-Input__Message">Field is required</span>
<span class="LP-Form__Field LP-Input"> </div>
<label for="input123" class="LP-Input__Label">Last name</label> </div>
<input type="text" id="input123" class="LP-Input__Field"/> <div class="LP-Form__Field">
</span> <div class="LP-Input">
<label for="input123" class="LP-Input__Label">Last name</label>
<input type="text" id="input123" class="LP-Input__Field"/>
</div>
</div>
</div> </div>
<div class="LP-Form__Composition"> <div class="LP-Form__Composition">
<span class="LP-Form__Field LP-Form__Field--wider LP-Input"> <div class="LP-Form__Field LP-Form__Field--wider LP-Input">
<label for="input123" class="LP-Input__Label">Street</label> <label for="input123" class="LP-Input__Label">Street</label>
<input type="text" id="input123" class="LP-Input__Field"/> <input type="text" id="input123" class="LP-Input__Field"/>
<span class="LP-Input__Message">We won't send any stalkers, promise</span> <span class="LP-Input__Message">We won't send any stalkers, promise</span>
</span> </div>
<span class="LP-Form__Field LP-Form__Field--narrower LP-Input"> <div class="LP-Form__Field LP-Form__Field--narrower LP-Input">
<label for="input123" class="LP-Input__Label">House no</label> <label for="input123" class="LP-Input__Label">House no</label>
<input type="text" id="input123" class="LP-Input__Field"/> <input type="text" id="input123" class="LP-Input__Field"/>
<span class="LP-Input__Message">Field is required</span> <span class="LP-Input__Message">Field is required</span>
</span> </div>
<span class="LP-Form__Field LP-Form__Field--narrower LP-Input"> <div class="LP-Form__Field LP-Form__Field--narrower LP-Input LP-Input--disabled">
<label for="input123" class="LP-Input__Label">Disabled</label> <label for="input123" class="LP-Input__Label">Disabled</label>
<input type="text" id="input123" class="LP-Input__Field" disabled="disabled"/> <input type="text" id="input123" class="LP-Input__Field" disabled="disabled"/>
<span class="LP-Input__Message">Field is required</span> <span class="LP-Input__Message">Field is required</span>
</span> </div>
</div> </div>
<div class="LP-Form__Composition"> <div class="LP-Form__Composition">
<span class="LP-Form__Field LP-Form__Field--narrow LP-Input"> <div class="LP-Form__Field LP-Form__Field--narrow LP-Input">
<label for="input123" class="LP-Input__Label">Postal Code</label> <label for="input123" class="LP-Input__Label">Postal Code</label>
<input type="text" id="input123" class="LP-Input__Field"/> <input type="text" id="input123" class="LP-Input__Field"/>
</span> </div>
<span class="LP-Form__Field LP-Form__Field--wide LP-Input"> <div class="LP-Form__Field LP-Form__Field--wide LP-Input">
<label for="input123" class="LP-Input__Label">Town</label> <label for="input123" class="LP-Input__Label">Town</label>
<input type="text" id="input123" class="LP-Input__Field"/> <input type="text" id="input123" class="LP-Input__Field"/>
</span> </div>
</div> </div>
</fieldset> </fieldset>