mdbootstrap/mdb-ui-kit
1
1
Fork 0
mirror of https://github.com/mdbootstrap/mdb-ui-kit.git synced 2025-07-15 10:42:32 +03:00
Code Issues Packages Projects Releases Wiki Activity

Fix input type DATE bug, for issue #1377

Browse Source 
Input type text overwrite label text, making incorrect layout.
Add input type DATE to docs.
This commit is contained in:
Valronn 2019-08-31 13:02:17 +03:00
parent 4c3921fed5
commit e51309d5ea
2 changed files with 19 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
docs/4.0/material-design/forms.md
View File

@ -43,6 +43,10 @@ Form controls flavored by Material Design for Bootstrap customizations such as `
<option>5</option> <option>5</option>
</select> </select>
</div> </div>
<div class="form-group">
<label for="exampleFormControlDateType1">Example date</label>
<input type="date" class="form-control" id="exampleFormControlDateType1">
</div>
<div class="form-group"> <div class="form-group">
<label for="exampleTextarea" class="bmd-label-floating">Example textarea</label> <label for="exampleTextarea" class="bmd-label-floating">Example textarea</label>
<textarea class="form-control" id="exampleTextarea" rows="3"></textarea> <textarea class="form-control" id="exampleTextarea" rows="3"></textarea>

15
scss/_forms.scss
View File

@ -227,3 +227,18 @@ select {
} }
} }
} }
// Fix input type data
// Type text overwriting label-floating, making it's layout incorrect
input[type="date"]::-webkit-datetime-edit {
color: transparent;
}
input[type="date"]:focus::-webkit-datetime-edit {
color: black !important;
}
.is-filled {
input[type="date"]::-webkit-datetime-edit {
color: black !important;
}
}
//-------------------------------------------------------------------