Integrated the useful boostrap classes within our CSS

This commit is contained in:
Alexandre Bourlier
2018-04-22 18:01:07 +02:00
parent ed189a8129
commit 717542a812
7 changed files with 125 additions and 48 deletions

View File

@ -11,35 +11,4 @@
search-fields="firstname, lastname"
next="member"
></ldp-display>
<script>// Bootstrap compliance
const addBootstrapClassesToMembers = function() {
window.setTimeout(function() {
const FORM = document.querySelector("ldp-display > ldp-form");
if (FORM) {
FORM.classList.add("mt-4");
FORM.classList.add("mb-4");
FORM.classList.add("d-block");
FORM.querySelectorAll("ldp-form-text").forEach(function(el) {
el.classList.add("form-group");
el.classList.add("d-block");
});
FORM.querySelectorAll('input[type="text"]').forEach(function(el) {
el.classList.add("form-control");
});
FORM.querySelectorAll('label').forEach(function(el) {
el.classList.add("text-capitalize");
});
FORM.querySelector('input[type="submit"]').classList.add("btn", "btn-primary");
FORM.querySelector('input[type="reset"]').classList.add("btn", "btn-link");
}
else {
addBootstrapClassesToMembers();
}
}, 100)
};
window.onload = addBootstrapClassesToMembers();
</script>
</div>

View File

@ -1,19 +1,4 @@
<div id="projects" style="display: none">
<div class="page-header">
<h1>Projets</h1>
</div>
<!--<div id="projectsTable">-->
<!--<ol>-->
<!--<li id="categorieNumber">Numéro</li>-->
<!--<li id="categorieNumberAlt">N°</li>-->
<!--<li id="categorieTitle">Titre</li>-->
<!--<li id="categorieAssociate">Associé</li>-->
<!--<li id="categorieIncome">CA</li>-->
<!--<li id="categorieState">Etat</li>-->
<!--</ol>-->
<!--</div>-->
<ldp-display
id="projectsList"
data-src="http://localhost:8000/projects/"