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

Form Tweaking

Browse Source
This commit is contained in:
reverend
2020-07-31 23:35:17 +02:00
parent 013769597d
commit 60e231d1ca
3 changed files with 12 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
components/02_Molecules/_molecules.scss
View File

@@ -1,5 +1,5 @@
@import 'logo/logo';
@import 'textSection/textSection';
@import 'place/place';
@import 'placeTeaser/placeTeaser';
@import 'securityMeasureList/securityMeasureList';
@import 'form/form';

5
components/02_Molecules/form/_form.scss
View File

@@ -15,7 +15,7 @@
.LP-Form__Field{
flex: 3 1 100px;
padding: 0 15px;
padding: 6px 15px;
&--wider{
flex: 5 1 200px;
@@ -62,7 +62,8 @@
justify-content: space-between;
.LP-Form__Field{
flex: 3 1 100px;
flex: 3 1 100px;
padding: 12px 15px;
}
}
}

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

@@ -16,7 +16,13 @@
<input type="text" id="input123" class="LP-Input__Field"/>
</div>
</div>
</div>
<div class="LP-Form__Field LP-Form__Field--narrower">
<div class="LP-Input LP-Input--disabled">
<label for="input123" class="LP-Input__Label">Age</label>
<input type="text" id="input123" class="LP-Input__Field" disabled="disabled"/>
</div>
</div>
</div>
<div class="LP-Form__Composition">
<div class="LP-Form__Field LP-Form__Field--wider LP-Input">
@@ -24,16 +30,11 @@
<input type="text" id="input123" class="LP-Input__Field"/>
<span class="LP-Input__Message">We won't send any stalkers, promise</span>
</div>
<div class="LP-Form__Field LP-Form__Field--narrower LP-Input">
<div class="LP-Form__Field LP-Form__Field--narrow LP-Input">
<label for="input123" class="LP-Input__Label">House no</label>
<input type="text" id="input123" class="LP-Input__Field"/>
<span class="LP-Input__Message">Field is required</span>
</div>
<div class="LP-Form__Field LP-Form__Field--narrower LP-Input LP-Input--disabled">
<label for="input123" class="LP-Input__Label">Disabled</label>
<input type="text" id="input123" class="LP-Input__Field" disabled="disabled"/>
<span class="LP-Input__Message">Field is required</span>
</div>
</div>
<div class="LP-Form__Composition">