Valider a7b8b76f rédigé par tcharlss's avatar tcharlss Validation de Gitea
Parcourir les fichiers

Refacto des listes d'objets (#4753) 

On aligne l'habillage des listes d'objets avec celui des boîtes et des formulaires.
Pour ce faire un mutualise une partie des variables CSS des boîtes, tout en laissant une certaine autonomie aux listes et aux formulaires s'il y a besoin d'ajustements.

Pour le tableau lui-même, on suit ces quelques règles :

* une seule taille de texte, hormis les éventuels `<small>`
* pas de largeur fixe pour les colonnes, à part quelques cas précis (id, picto, statut…)
* plus d'espacements

Dans les colonnes latérales, toutes les colonnes sont masquées à l'exception des .important et de quelques unes choisies manuellement : id, statut
parent 0911bbee

prive/themes/spip/box_skins.css.html

+83 −43
Numéro de ligne d'origine Numéro de ligne de diff Ligne de diff
@@ -35,38 +35,81 @@ 
 * ============

 * 0. Variables

 * ============

 *

 * LISEZ MOI :)

 *

 * Certains aspects de ce composant sont mutualisés avec les formulaires et les listes,

 * qui sont également de sortes de « boîtes » avec entête, corps et pieds.

 * On essaie de garder une unité graphique entre les 3 : bordure, espacements…

 *

 * Pour cela il y a une série de variables réutilisées entre eux.

 * Leurs valeurs pouvant changer selon les breakpoints ou les variantes de tailles,

 * on est obligé de passer par des variables intermédiaires --spip-box-xxx-mini

 * plutôt que de réutiliser directement --spip-box-xxx ailleurs : cela ne fonctionnerait pas tout le temps.

 */





/* Nb : la media-query au début sinon pb (?) */

@media (min-width: 768px) {

/* D'abord les variable intermédiaires mutualisées : ne pas les utiliser directement. */

:root {

		--spip-box-iconsize: 32px;

		--spip-box-highlightsize: 1.5rem;

	}

}

/* On reprend certaines valeurs des formulaires pour harmoniser */

	/* Taille réduite */

	--spip-box-spacing-x-mini: 0.66rem;

	--spip-box-spacing-y-mini: 0.66rem;

	--spip-box-heading-fontsize-mini: 1em;

	--spip-box-heading-iconsize-mini: 16px;

	/* Taille normale */

	--spip-box-spacing-x-normal: 1.15rem;

	--spip-box-spacing-y-normal: 1.15rem;

	--spip-box-heading-fontsize-normal: 1.125em;

	--spip-box-heading-iconsize-normal: 24px;

}



/* Puis les variables propres à ce composant */

:root {

	/* base pour les espacements internes */

	--spip-box-spacing-x: var(--spip-form-spacing-x);

	--spip-box-spacing-y: var(--spip-form-spacing-y);

	/* couleurs */

	--spip-box-sep-color: hsla(0, 0%, 0%, 0.125);

	--spip-box-border-color: hsla(0, 0%, 0%, 0.125); /* bordure basique */

	--spip-box-sep-color-inverse: hsla(0, 0%, 100%, 0.1);

	/* divers */

	--spip-box-border-radius: var(--spip-form-border-radius);

	--spip-box-iconsize: 24px;

	--spip-box-highlightsize: 1rem; /* largeur bordure colorée sur boîtes d'états */

	/* Espacements */

	--spip-box-spacing-x: var(--spip-box-spacing-x-mini);

	--spip-box-spacing-y: var(--spip-box-spacing-x-mini);

	/* Entête */

	--spip-box-heading-fontsize: var(--spip-box-heading-fontsize-mini);

	--spip-box-heading-iconsize: var(--spip-box-heading-iconsize-mini);

	--spip-box-heading-iconpadding: calc(var(--spip-box-heading-iconsize-mini) + (var(--spip-box-spacing-x-mini) * 1.5));

	/* Couleurs */

	--spip-box-border-color: hsla(0, 0%, 0%, 0.125); /* bordure externe */

	--spip-box-border-color-plus: hsla(0, 0%, 0%, 0.2); /* bordure + foncée pour démarquer si fond de couleur :-/ */

	--spip-box-sep-color: hsla(0, 0%, 0%, 0.085); /* bordures séparations internes */

	/* Titre */

	--spip-box-heading-fontweight: 600;

	/* Divers */

	--spip-box-border-radius: var(--spip-border-radius);

	--spip-box-highlightsize: 1rem;

	--spip-box-caretsize: 2rem; /* picto dépliant */

}

.lat .box,

.box.mini {

	--spip-box-iconsize: 24px;

@media (min-width: 768px) {

	:root {

		/* Espacements */

		--spip-box-spacing-x: var(--spip-box-spacing-x-normal);

		--spip-box-spacing-y: var(--spip-box-spacing-x-normal);

		/* Entête */

		--spip-box-heading-fontsize: var(--spip-box-heading-fontsize-normal);

		--spip-box-heading-iconsize: var(--spip-box-heading-iconsize-normal);

		--spip-box-heading-iconpadding: calc(var(--spip-box-heading-iconsize-normal) + (var(--spip-box-spacing-x-normal) * 1.5));

		/* Divers */

		--spip-box-highlightsize: 1.5rem;

	}

	/* Taille réduite */

	.box.mini,

	.lat,

	.affiche_milieu,

	.formulaire_editer_liens,

	.formulaire_dater {

		/* Espacements */

		--spip-box-spacing-x: var(--spip-box-spacing-x-mini);

		--spip-box-spacing-y: var(--spip-box-spacing-x-mini);

		/* Entête */

		--spip-box-heading-fontsize: var(--spip-box-heading-fontsize-mini);

		--spip-box-heading-iconsize: var(--spip-box-heading-iconsize-mini);

		--spip-box-heading-iconpadding: calc(var(--spip-box-heading-iconsize-mini) + (var(--spip-box-spacing-x-mini) * 1.5));

		/* Divers */

		--spip-box-highlightsize: 1rem;

	/* Obligé de reprendre à la main les mêmes valeurs que les forms */

	--spip-box-spacing-x: 0.75rem;

	--spip-box-spacing-y: 0.75rem;

}

}
@@ -161,23 +204,12 @@ 
}



/* Titres

   Règle : si h3, c'est le style par défaut, et on mutualise avec les titres des formulaires (taille, graisse, …).

   Règle : si h3, c'est le style par défaut.

   Si autre balise et qu'on veut forcer le style par défaut, utiliser la variante .titrem sur le header. */

.box__header h3,

.box__header.titrem h1, .box__header.titrem h2, .box__header.titrem h3, .box__header.titrem h4, .box__header.titrem h5, .box__header.titrem h6,

.formulaire_spip .titrem {

	font-size: 1.2em;

	font-weight: 800;

	/* color: var(--spip-color-theme-dark); */

}



/* En colonne latérale (+ voir variables au début) */

.lat .box {

	font-size: 0.95em;

}

.lat .box__header h1, .lat .box__header h2, .lat .box__header h3, .lat .box__header h4, .lat .box__header h5, .lat .box__header h6,

.lat .formulaire_spip .titrem  {

	font-size: 1em;

.box__header.titrem h1, .box__header.titrem h2, .box__header.titrem h4, .box__header.titrem h5, .box__header.titrem h6 {

	font-size: var(--spip-box-heading-fontsize);

	font-weight: var(--spip-box-heading-fontweight);

}
@@ -260,7 +292,7 @@ 
.box.notice .box__header, .box.error .box__header, .box.success .box__header,

.box.notice .box__body, .box.error .box__body, .box.success .box__body {

	background-repeat: no-repeat;

	background-size: var(--spip-box-iconsize);

	background-size: var(--spip-box-heading-iconsize);

	background-position: var(--spip-left) var(--spip-box-spacing-x) center;

}

/* Décommenter s'il faut centrer l'icône sur la 1ère ligne de texte dans le body */
@@ -270,7 +302,7 @@ 
/* Espacement pour l'icône selon qu'elle soit dans le header ou dans le body */

.box.notice .box__header, .box.error .box__header, .box.success .box__header,

.box.notice .box__body:first-child, .box.error .box__body:first-child, .box.success .box__body:first-child {

	padding-#LEFT: calc(var(--spip-box-iconsize) + (var(--spip-box-spacing-x) * 2));

	padding-#LEFT: var(--spip-box-heading-iconpadding);

}

/* Bordure sur le côté */

.box.notice .box__header, .box.error .box__header, .box.success .box__header,
@@ -340,6 +372,14 @@ 
 */





/* En colonne latérale : cf. variables */

.lat .box {}





/* Taille réduite : cf. variables */

.box.mini {}





/* Flat : sans ombre portée.

   Peut se conjuguer aux autres quand on veut forcer.

   Certaines le sont d'office, notamment les boîtes imbriquées.

prive/themes/spip/forms.css.html

+103 −79
Numéro de ligne d'origine Numéro de ligne de diff Ligne de diff
@@ -48,56 +48,79 @@ 
 * ============

 * 0. Variables

 * ============

 *

 * Nb : garder des variables propres à ce composant même dans les cas où on réutilise les variables de --spip-box,

 * cela permet de garder une autonomie pour les ajustements éventuels.

 * De plus il est parfois nécessaire d'accéder à ces variables en dehors de ce composant.

 */





:root {

	/* espacements externes (entre les inputs et cie) */

	--spip-form-spacing-x: 0.75rem;

	--spip-form-spacing-y: 0.75rem;

	/* espacements internes (à l'intérieur des inputs et cie) */

	--spip-form-padding-input-x: 0.33rem;

	--spip-form-padding-input-y: 0.33rem;

	/* fieldsets */

	/* Espacements */

	--spip-form-spacing-x: var(--spip-box-spacing-x-mini);

	--spip-form-spacing-y: var(--spip-box-spacing-y-mini);

	/* Entête */

	--spip-form-heading-fontweight: var(--spip-box-heading-fontweight);

	--spip-form-heading-fontsize: var(--spip-box-heading-fontsize-mini);

	--spip-form-heading-iconsize: var(--spip-box-heading-iconsize-mini);

	--spip-from-heading-iconpadding: calc(var(--spip-from-heading-iconsize) + (var(--spip-from-spacing-x) * 1.5));

	/* Fieldsets */

	--spip-form-fieldset-offset: 1.5em; /* décalage quand imbriqué */

	--spip-form-fieldset-spacing: calc(var(--spip-form-spacing-y) / 2); /* espacement en plus */

	/* layout labels */

	/* Layout labels */

	--spip-form-label-width: 12rem;

	--spip-form-label-long-width: 19rem; /* ne pas dépendre de la taille de la font-size du label qui peut varier */

	/* couleurs */

	--spip-form-border-color: hsla(0, 0%, 0%, 0.2); /* couleur bordure inputs et cie */

	--spip-form-sep-color: hsla(0, 0%, 0%, 0.125); /* couleur trait de séparation */

	/* Couleurs */

	--spip-form-color-focus: hsla(var(--spip-color-theme--h), calc(var(--spip-color-theme--s) * 3), var(--spip-color-theme--l), 0.25); /* outline focus inputs et cie */

	--spip-form-color-text: var(--spip-color-gray-darkest); /* défaut */

	--spip-form-color-text-light: var(--spip-color-gray-darker); /* labels et cie */

	--spip-form-color-text-lightest: var(--spip-color-gray); /* placeholder */

	/* divers */

	--spip-form-border-radius: var(--spip-border-radius); /* bordure inputs et cie */

	--spip-form-input-height: calc((var(--spip-form-padding-input-y) * 2) + var(--spip-line-height)); /* à toute fin utile */

	/* Divers */

	--spip-form-border-radius: var(--spip-box-border-radius);

	/* Inputs */

	--spip-form-input-padding-x: 0.33rem;

	--spip-form-input-padding-y: 0.33rem;

	--spip-form-input-border-color: hsla(0, 0%, 0%, 0.2);

	--spip-form-input-border-radius: var(--spip-border-radius);

	--spip-form-input-height: calc((var(--spip-form-input-padding-y) * 2) + var(--spip-line-height)); /* à toute fin utile */

}

@media (min-width: 768px) {

	/* Taille normale */

	:root {

		/* espacements externes (entre les inputs et cie) */

		--spip-form-spacing-x: 1.15rem;

		--spip-form-spacing-y: 1.15rem;

		/* espacements internes (à l'intérieur des inputs et cie) */

		--spip-form-padding-input-x: 0.66rem;

		--spip-form-padding-input-y: 0.66rem;

		/* décalage des fieldsets imbriqués */

		/* Espacements */

		--spip-form-spacing-x: var(--spip-box-spacing-x-normal);

		--spip-form-spacing-y: var(--spip-box-spacing-y-normal);

		/* Entête */

		--spip-form-heading-fontsize: var(--spip-box-heading-fontsize-normal);

		--spip-form-heading-iconsize: var(--spip-box-heading-iconsize-normal);

		--spip-from-heading-iconpadding: calc(var(--spip-from-heading-iconsize) + (var(--spip-from-spacing-x) * 1.5));

		/* Inputs */

		--spip-form-input-padding-x: 0.66rem;

		--spip-form-input-padding-y: 0.66rem;

		/* Décalage des fieldsets imbriqués */

		--spip-form-fieldset-offset: 2.5em;

	}

}

.lat .formulaire_spip,

.formulaire_spip.mini {

	/* espacements externes (entre les inputs et cie) */

	--spip-form-spacing-x: 0.75rem;

	--spip-form-spacing-y: 0.75rem;

	/* espacements internes (à l'intérieur des inputs et cie) */

	--spip-form-padding-input-x: 0.33rem;

	--spip-form-padding-input-y: 0.33rem;

	/* décalage des fieldsets imbriqués */

	/* Taille réduite */

	.formulaire_spip.mini,

	.lat,

	.affiche_milieu,

	.formulaire_editer_liens,

	.formulaire_dater {

		/* Espacements  */

		--spip-form-spacing-x: var(--spip-box-spacing-x-mini);

		--spip-form-spacing-y: var(--spip-box-spacing-y-mini);

		/* Entête */

		--spip-form-heading-fontsize: var(--spip-box-heading-fontsize-mini);

		--spip-form-heading-iconsize: var(--spip-box-heading-iconsize-mini);

		--spip-from-heading-iconpadding: calc(var(--spip-from-heading-iconsize) + (var(--spip-from-spacing-x) * 1.5));

		/* Inputs */

		--spip-form-input-padding-x: 0.33rem;

		--spip-form-input-padding-y: 0.33rem;

		/* Décalage des fieldsets imbriqués */

	--spip-form-fieldset-offset: 1.5em;

}

}







/**
@@ -269,13 +292,13 @@ 
	padding-bottom: calc(var(--spip-form-spacing-y) / 2);

	overflow: hidden;

	background: var(--spip-color-white);

	border-bottom: 1px solid var(--spip-form-sep-color);

	border-top-left-radius: var(--spip-border-radius);

	border-top-right-radius: var(--spip-border-radius);

	border-bottom: 1px solid var(--spip-box-sep-color);

	border-top-left-radius: var(--spip-form-border-radius);

	border-top-right-radius: var(--spip-form-border-radius);

	box-shadow: var(--spip-box-shadow);

}

.formulaire_spip .cadre {

	border: 1px solid var(--spip-form-border-color);

	border: 1px solid var(--spip-box-border-color);

}

.entete-formulaire + .formulaire_spip,

.entete-formulaire + .formedit .formulaire_spip,
@@ -303,7 +326,7 @@ 
	margin: calc(var(--spip-margin-bottom) * 1.5) 0;

	color: var(--spip-form-color-text);

	background-color: var(--spip-color-white);

	border-radius: var(--spip-border-radius);

	border-radius: var(--spip-form-border-radius);

	box-shadow: var(--spip-box-shadow);

	z-index: 2; /* passer par dessus l'entête */

	transition: box-shadow 0.2s;
@@ -314,9 +337,7 @@ 
	box-shadow: var(--spip-box-shadow-hover);

}



/* Titre optionnel

   Une partie de l'habillage est mutualisée avec ceux des boîtes : taille, graisse….

	 Voir dans box_skins.css */

/* Titre optionnel */

.formulaire_spip .titrem {

	display: flex;

	align-items: center;
@@ -324,7 +345,9 @@ 
	padding-bottom: var(--spip-form-spacing-y);

	border-top-left-radius: inherit;

	border-top-right-radius: inherit;

	border-bottom: 1px solid var(--spip-form-sep-color);

	border-bottom: 1px solid var(--spip-box-sep-color);

	font-size: var(--spip-form-heading-fontsize);

	font-weight: var(--spip-form-heading-fontweight);

}



/* Conteneur des saisies */
@@ -367,7 +390,7 @@ 
	width: var(--spip-form-label-width);

	margin-#LEFT: calc((var(--spip-form-label-width) + var(--spip-form-spacing-x)) * -1); /* inverse largeur + marge */

	margin-bottom: calc(var(--spip-form-spacing-y) / 4);

	padding: calc(var(--spip-form-padding-input-y) + 1px) 0 0; /* décaler pour aligner avec texte input → padding + border */

	padding: calc(var(--spip-form-input-padding-y) + 1px) 0 0; /* décaler pour aligner avec texte input → padding + border */

	background: transparent;

	color: var(--spip-form-color-text-light);

	text-align: var(--spip-left);
@@ -418,8 +441,8 @@ 
	padding: calc(var(--spip-form-spacing-y) / 2)  var(--spip-form-spacing-x);

	text-align: var(--spip-right);

	background-color: var(--spip-color-theme-lightest);

	border-bottom-left-radius: var(--spip-form-border-radius);

	border-bottom-right-radius: var(--spip-form-border-radius);

	border-bottom-left-radius: var(--spip-form-input-border-radius);

	border-bottom-right-radius: var(--spip-form-input-border-radius);

}

.formulaire_spip .boutons .image_loading {

	float: none;
@@ -439,13 +462,13 @@ 
	min-width: 0; /* nécessaire ? */

	width: auto;

	border: 0;

	border-top: 1px solid var(--spip-form-sep-color);

	border-top: 1px solid var(--spip-box-sep-color);

}



/* Légendes */

.formulaire_spip fieldset legend:not(.label),

.formulaire_spip fieldset .legend {

	padding: var(--spip-form-padding-input-y) var(--spip-form-padding-input-x);

	padding: var(--spip-form-input-padding-y) var(--spip-form-input-padding-x);

	background-color: var(--spip-color-gray-lightest);

	/* color: var(--spip-color-theme-darker); */

	font-weight: 800;
@@ -489,7 +512,7 @@ 
.formulaire_spip form > div > fieldset + *:not(fieldset):not(.fieldset):not(.boutons),

.formulaire_spip form > div > .fieldset + *:not(fieldset):not(.fieldset):not(.boutons),

.formulaire_spip form > div > .editer-groupe > .fieldset + *:not(.fieldset):not(.boutons) {

	border-top: 1px solid var(--spip-form-sep-color);

	border-top: 1px solid var(--spip-box-sep-color);

	margin-top: calc(var(--spip-form-fieldset-spacing) * -1);

	padding-top: var(--spip-form-spacing-y);

}
@@ -513,10 +536,10 @@ 
/* Ceux avec un cadre */

.formulaire_spip div.choix {

	background-color: var(--spip-color-white);

	padding: calc(var(--spip-form-padding-input-y) / 2) var(--spip-form-padding-input-x);

	border: 1px solid var(--spip-form-border-color);

	border-top-left-radius: var(--spip-form-border-radius);

	border-top-right-radius: var(--spip-form-border-radius);

	padding: calc(var(--spip-form-input-padding-y) / 2) var(--spip-form-input-padding-x);

	border: 1px solid var(--spip-form-input-border-color);

	border-top-left-radius: var(--spip-form-input-border-radius);

	border-top-right-radius: var(--spip-form-input-border-radius);

	border-bottom: 0;

	z-index: 1; /* passer par dessus fond explication qui suit */

	transition: box-shadow 0.2s; /* idem inputs */
@@ -529,17 +552,17 @@ 
}

.formulaire_spip div.choix:last-of-type,

.formulaire_spip div.choix:last-child {

	border-bottom-left-radius: var(--spip-form-border-radius);

	border-bottom-right-radius: var(--spip-form-border-radius);

	border-bottom: 1px solid var(--spip-form-border-color);

	padding-bottom: var(--spip-form-padding-input-y);

	border-bottom-left-radius: var(--spip-form-input-border-radius);

	border-bottom-right-radius: var(--spip-form-input-border-radius);

	border-bottom: 1px solid var(--spip-form-input-border-color);

	padding-bottom: var(--spip-form-input-padding-y);

	position: relative;

}

.formulaire_spip div.choix:first-of-type {

	border-top-left-radius: var(--spip-form-border-radius);

	border-top-right-radius: var(--spip-form-border-radius);

	border-top: 1px solid var(--spip-form-border-color);

	padding-top: var(--spip-form-padding-input-y);

	border-top-left-radius: var(--spip-form-input-border-radius);

	border-top-right-radius: var(--spip-form-input-border-radius);

	border-top: 1px solid var(--spip-form-input-border-color);

	padding-top: var(--spip-form-input-padding-y);

	position: relative;

}
@@ -569,7 +592,7 @@ 


/* Espacements entre inputs et labels, indépendamment de la position du label (on sait qu'ils vont par paire, ça suffit) */

.formulaire_spip .choix > *:nth-child(odd) {

	margin-#RIGHT: calc(var(--spip-form-padding-input-x) * 3/4); /* entre input et label */

	margin-#RIGHT: calc(var(--spip-form-input-padding-x) * 3/4); /* entre input et label */

}

/* Espacement entre plusieurs options dans un même .choix, et entre .choix inline successifs */

.formulaire_spip .choix > *:nth-child(3n+3),
@@ -722,11 +745,11 @@ 
.formulaire_spip select {

	position: relative;

	z-index: 2;

	padding: var(--spip-form-padding-input-y) var(--spip-form-padding-input-x);

	padding: var(--spip-form-input-padding-y) var(--spip-form-input-padding-x);

	margin: 0;

	width: 100%;

	border: 1px solid var(--spip-form-border-color);

	border-radius: var(--spip-form-border-radius);

	border: 1px solid var(--spip-form-input-border-color);

	border-radius: var(--spip-form-input-border-radius);

	background-color: var(--spip-color-white);

	transition: box-shadow 0.1s;

}
@@ -770,14 +793,14 @@ 
	min-height: 2.75em; /* À la louche, à calculer auto. si possible */

	min-width: 2.75em; /* Carré */

	width: auto;

	padding: calc(var(--spip-form-padding-input-y) / 2);

	padding: calc(var(--spip-form-input-padding-y) / 2);

	cursor: pointer;

}



/* Input de recherche */

.formulaire_spip input.search,

.formulaire_spip input[type="search"] {

	border-radius: var(--spip-form-border-radius);

	border-radius: var(--spip-form-input-border-radius);

}



/* Boutons de soumission (voir aussi dans boutons.css) */
@@ -815,18 +838,18 @@ 
.formulaire_spip .attention {

	display: block;

	position: relative;

	padding: var(--spip-form-padding-input-y) var(--spip-form-padding-input-x);

	padding: var(--spip-form-input-padding-y) var(--spip-form-input-padding-x);

	font-size: 0.9em;

	line-height: 1.25;

	color: var(--spip-color-gray-dark);

	border-top-#RIGHT-radius: var(--spip-form-border-radius);

	border-bottom-#RIGHT-radius: var(--spip-form-border-radius);

	border-top-#RIGHT-radius: var(--spip-form-input-border-radius);

	border-bottom-#RIGHT-radius: var(--spip-form-input-border-radius);

	border-left-width: 0.3em;

	border-left-style: solid;

}

.formulaire_spip .explication {

	background-color: hsla(0, 0%, 0%, 0.05); /* transparent sinon on voit pas sur les champs avec le même fond */

	border-#LEFT-color: var(--spip-form-border-color);

	border-#LEFT-color: var(--spip-form-input-border-color);

}

.formulaire_spip .attention {

	color: hsl(var(--spip-color-notice--h), var(--spip-color-notice--s), 22%);
@@ -847,7 +870,7 @@ 
	margin-top: 0;

	border-bottom-left-radius: 0;

	border-bottom-right-radius: 0;

	border-top-#LEFT-radius: var(--spip-form-border-radius);

	border-top-#LEFT-radius: var(--spip-form-input-border-radius);

	border: 0;

}

.formulaire_spip .editer .explication > :last-child,
@@ -856,7 +879,7 @@ 
}

.formulaire_spip .editer .explication:last-child,

.formulaire_spip .editer .attention:last-child {

	border-radius: var(--spip-form-border-radius);

	border-radius: var(--spip-form-input-border-radius);

}

.formulaire_spip .explication + input.text,

.formulaire_spip .attention + input.text,
@@ -885,7 +908,7 @@ 
.formulaire_spip .editer select + .attention,

.formulaire_spip .editer div.choix:last-of-type + .explication,

.formulaire_spip .editer div.choix:last-of-type + .attention {

	border-radius: var(--spip-form-border-radius);

	border-radius: var(--spip-form-input-border-radius);

	border-top-left-radius: 0;

	border-top-right-radius: 0;

	position: relative
@@ -903,8 +926,8 @@ 
	content: "";

	display: block;

	position: absolute;

	top: calc(var(--spip-form-border-radius) * -1);

	height: var(--spip-form-border-radius);

	top: calc(var(--spip-form-input-border-radius) * -1);

	height: var(--spip-form-input-border-radius);

	width: 100%;

	left: 0;

	background-color: inherit;
@@ -992,12 +1015,12 @@ 
}

.formulaire_editer_auteur .editer.editer_statut .instituer_auteur {

	margin-#LEFT: calc((var(--spip-form-label-width) * -1) + var(--spip-form-spacing-x));

	margin-top: var(--spip-form-padding-input-y);

	margin-top: var(--spip-form-input-padding-y);

}

.formulaire_editer_auteur .editer.editer_statut .rubriques_restreintes > p {

	margin-#LEFT: 0;

	margin-bottom: 0;

	margin-top: var(--spip-form-padding-input-y);

	margin-top: var(--spip-form-input-padding-y);

}

.formulaire_editer_auteur .editer.editer_statut .rubriques_restreintes label {

	float: none;
@@ -1436,11 +1459,11 @@ 


/* Menu favoris */

.formulaire_configurer_preferences_menus .menus_favoris input.text {

	padding: calc(var(--spip-form-padding-input-y) / 2) calc(var(--spip-form-padding-input-y) / 2);

	padding: calc(var(--spip-form-input-padding-y) / 2) calc(var(--spip-form-input-padding-y) / 2);

	width: 2em;

}

.formulaire_configurer_preferences_menus .menus_favoris .choix {

	padding: calc(var(--spip-form-padding-input-y) / 2) calc(var(--spip-form-padding-input-x) / 2);

	padding: calc(var(--spip-form-input-padding-y) / 2) calc(var(--spip-form-input-padding-x) / 2);

}
@@ -1485,9 +1508,10 @@ img.aide { 


/* Toggle box link */

.formulaire_spip .toggle_box_link {

	display: inline-flex; /* éviter des espacements indésirables */

	position: absolute;

	top: 6px;

	#RIGHT: 6px;

	top: var(--spip-box-spacing-y);

	#RIGHT: var(--spip-box-spacing-x);

	opacity: 0.6;

	filter: alpha(opacity=60);

	z-index: 1;

prive/themes/spip/lists.css.html

+837 −150

Fichier modifié.

La taille limite d'aperçu a été dépassée, l'affichage des modifications a donc été réduit.

prive/themes/spip/theme.css.html

+0 −21
Numéro de ligne d'origine Numéro de ligne de diff Ligne de diff
@@ -47,27 +47,6 @@ body { 
h1 {font-size: 2em;line-height: 125%;}

.h1 {font-size: 2em;line-height: 125%;}



.liste-objets {border:1px solid #e5e5e5;border-top-left-radius:5px;border-top-right-radius:5px;position: relative;z-index: 1;display: block;}



/*

.liste-objets:hover {box-shadow:0px 0px 0px #dddddd;position:relative;}

.liste-objets:before {box-shadow:0 15px 10px rgba(0, 0, 0, .5);-moz-transform:rotate(-3deg);-webkit-transform:rotate(-3deg);-khtml-transform:rotate(-3deg);-ms-transform:rotate(-3deg);-o-transform:rotate(-3deg);transform:rotate(-3deg);position: absolute;left: 10px;bottom: 20px;z-index: -1;width: 50%;max-width: 300px;height: 20%;content: "";}



.liste-objets:after {box-shadow:0 15px 10px rgba(0, 0, 0, .5);-moz-transform:rotate(-3deg);-webkit-transform:rotate(-3deg);-khtml-transform:rotate(-3deg);-ms-transform:rotate(-3deg);-o-transform:rotate(-3deg);transform:rotate(-3deg);position: absolute;left: 10px;bottom: 20px;z-index: -1;width: 50%;max-width: 300px;height: 20%;content: "";}

.liste-objets:after {-moz-transform:rotate(3deg);-webkit-transform:rotate(3deg);-khtml-transform:rotate(3deg);-ms-transform:rotate(3deg);-o-transform:rotate(3deg);transform:rotate(3deg);left: auto;right: 10px;}

*/

.liste-objets.selection-articles table {background-color: white;border-bottom: 1px solid #ccc;}

.liste-objets.selection-articles form {background-color: #[(#ENV{claire}|couleur_luminance{0.25})];}

.liste-objets table {background: transparent;}

.liste-objets table caption {background: #e5e5e5;}

.liste-objets table caption strong.caption { padding-top: 8px; padding-bottom: 8px; color: #444; background-color: transparent; font-size: 0.85em; line-height: 120%; }

.liste-objets table thead {font-size: 0.85em;line-height: 120%;}

.liste-objets table thead th {padding-top: 5px;padding-bottom: 5px;}

.liste-objets table tbody > tr:last-child td {border-bottom: 0;}

.liste-objets table tr td {line-height: 120%;}

.liste-objets-lies.auteurs thead {display: none;}

.liste-objets-lies.mots thead {display: none;}



.en-edition {line-height: 120%;}



#chemin {}

Forge communautaire SPIP | Charte d'utilisation | Signaler un problème sur ce site