ldp-display { ldp-form { display: block; background-color: #F3F3F3; padding: 15px; box-sizing: content-box; form { @extend %self-clear; ldp-form-text { position: relative; display: block; margin-bottom: 1rem; &::before { position: absolute; top: 3px; bottom: 0px; left: 10px; margin: auto; font-family: FontAwesome; content: "\f002"; color: gray; } label { text-transform: capitalize; display: none; } input[type="text"] { @extend %form-control; @extend %form-control-sm; padding-left: 30px; } } input[type="submit"], input[type="reset"] { @extend %btn; float: right; } input[type="submit"] { @extend %btn-primary; } input[type="reset"] { @extend %btn-link; } } } } ldp-form.edit-form { ldp-form-text { @extend %form-group; label { text-transform: capitalize; } input { @extend %form-control; @extend %form-control-sm; } } input[type="submit"] { @extend %btn; @extend %btn-primary; } } sib-form { sib-form-text { label { text-transform: capitalize; } input { margin-right: .5em; padding: .375em .75em; font-size: 1rem; line-height: 1.5; color: #495057; background-color: #fff; border: 1px solid #ced4da; border-radius: .25rem; vertical-align: top; } } input[type="submit"], input[type="reset"] { @extend %btn; @extend %btn-primary; margin-right: .5em; } }