28127 sujets

CSS et mise en forme, CSS3

Bonsoir
Je souhaite masquer plusieurs onglets comme Smiley publication qui surcharge trop le formulaire
jtest-ext.88h.ovh/index.php?option=com_dpcalendar&view=form&Itemid=165
Comment faire
Jai essayé sans succès avec ou sans important

#dp-tab-publishing{
	display: none!important  ;
	background-color:  #e7f1ff;
}

Modifié par HDcms (05 May 2024 - 21:18)
Modérateur
Salut,

#dp-tab-publishing c'est pas l'onglet c'est l'input juste avant. C'est le label ton onglet.
Bonjour
J'avai commençé avec le label en plus ... mais c'est le "+" qu'il fallut que je mette.
Merci de l'avoir dit

#dp-tab-publishing + label, #dp-tab-jmetadata + label{ 
	display: none  ;
}


Juste une question annexe, est-ce que l'on peut rentrer le terme "contenu" par "adresse" ?
Modérateur
HDcms a écrit :
Juste une question annexe, est-ce que l'on peut rentrer le terme "contenu" par "adresse" ?

"Remplacer" tu veux dire ? Bah pas de facon très propre / maintenable... mais t'as pas acces au code de base ?
Bonjour
_laurent a écrit :

"Remplacer" tu veux dire ? Bah pas de facon très propre / maintenable... mais t'as pas acces au code de base ?

Oui ce n'est pas très important, je trouvais juste judicieux pour l'utilisateur de mettre plutôt le terme "adresse"
Pour infos, je suis entrain de tester le code d'une autre personne qui me semble intéressant car il empêche la navigation accessible au clavier sauf que ce n'est pas terminé car le terme [Publication] reste

.dp-tabs__label[for="dp-tab-publishing"] {
  display: none;
}
#dp-tab-publishing:checked + .dp-tabs__label + .dp-tabs__tab {
  display: none;
}
résolu en js

const selector = [
    // onglet Publication
    "#dp-tab-publishing", // l'INPUT
    "#dp-tab-publishing + label", // le LABEL
    "#dp-tab-publishing + label + div", // la DIV content
    // onglet Métadonnées
    "#dp-tab-jmetadata",
    "#dp-tab-jmetadata + label",
    "#dp-tab-jmetadata + label + div",
  ]
  const elements = document.querySelectorAll(selector.join(","));
  elements.forEach((el) => {
    el.remove();
  });

Modifié par HDcms (10 May 2024 - 18:11)
Meilleure solution