/* ========================================================================== VisuRubriqueEncadre.css — feuille de style HAL / haltools Adaptée à l'identité du site personnel de Slim Ouni. À QUOI ELLE S'APPLIQUE Elle met en forme le bloc #res_script produit par haltools.inria.fr/Public/afficheRequetePubli.php, dont la structure est : #res_script div.annee_publi.annee_publi_2026 p.Rubrique → l'année div.typdoc.typdoc_COMM p.SousRubrique → « Conference papers » dl.NoticeRes → une publication dt.ChampRes → nom du champ (masqué) dd.ValeurRes.Titre dd.ValeurRes.Auteurs dd.ValeurRes.article → revue / conférence + DOI dd.ValeurRes.Fichier_joint → liens PDF et BibTeX PRINCIPE Aucune couleur n'est écrite en dur dans les règles : la feuille lit les variables CSS du site (--ink, --accent, --rule…). Le bloc HAL suit donc automatiquement le thème clair ou sombre de la page qui l'accueille. Si ces variables n'existent pas (aperçu sur haltools, autre site), les valeurs de repli ci-dessous prennent le relais et s'adaptent au thème du système. NB. Ne pas charger en même temps l'ancienne VisuGen.css : elle imposait un fond blanc et un texte noir, ce qui casse le mode sombre. ========================================================================== */ /* Polices du site. Indispensable si cette feuille est utilisée depuis haltools (paramètre css=…) : la page produite par haltools ne charge aucune police. Sur le site, l'adresse est identique à celle du , donc le navigateur ne la télécharge qu'une fois. */ @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,400&family=Public+Sans:ital,wght@0,400;0,500;0,600;1,400&display=swap'); /* -------------------------------------------------------------------------- 1. Jetons — hérités du site, avec repli autonome -------------------------------------------------------------------------- */ #res_script{ --hal-bg: var(--paper, #FCFBF8); --hal-ink: var(--ink, #191713); --hal-ink-2: var(--ink-2, #55514A); --hal-ink-3: var(--ink-3, #807A70); --hal-rule: var(--rule, #E4E0D7); --hal-rule-2: var(--rule-2, #CFC9BC); --hal-accent: var(--accent, #9E2B25); --hal-serif: Newsreader, Georgia, "Times New Roman", serif; --hal-sans: "Public Sans", "Helvetica Neue", Arial, Helvetica, sans-serif; --hal-mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace; --hal-sticky-top: 62px; /* hauteur de l'en-tête collant du site */ } @media (prefers-color-scheme: dark){ #res_script{ --hal-bg: var(--paper, #14130F); --hal-ink: var(--ink, #EDE9E0); --hal-ink-2: var(--ink-2, #B3ACA0); --hal-ink-3: var(--ink-3, #8A8478); --hal-rule: var(--rule, #302C24); --hal-rule-2: var(--rule-2, #463F34); --hal-accent: var(--accent, #E4837A); } } /* -------------------------------------------------------------------------- 2. Conteneur -------------------------------------------------------------------------- */ /* Sélecteur volontairement plus spécifique que « #res_script » : si la feuille d'origine de haltools est encore chargée à côté de celle-ci, ses « background-color:white » et « color:black » sont neutralisés quel que soit l'ordre de chargement. */ body #res_script{ border: 0; background: transparent; /* indispensable pour le mode sombre */ color: var(--hal-ink); font-family: var(--hal-sans); font-size: 17px; line-height: 1.6; margin: 0; padding: 0; } #res_script *{ box-sizing: border-box; } /* Titre de la requête renvoyé par haltools — inutile ici */ div.ZoneTitreResultat{ display: none; } /* -------------------------------------------------------------------------- 3. Regroupement par année -------------------------------------------------------------------------- */ #res_script .annee_publi{ margin: 0; } #res_script p.Rubrique{ font-family: var(--hal-serif); font-size: 1.5rem; font-weight: 600; letter-spacing: -.01em; color: var(--hal-ink); background: var(--hal-bg); border: 0; border-bottom: 1px solid var(--hal-rule-2); text-align: left; padding: 10px 0 8px; margin: 52px 0 0; /* l'année reste visible pendant qu'on parcourt sa section */ position: sticky; top: var(--hal-sticky-top); z-index: 1; } #res_script .annee_publi:first-child p.Rubrique{ margin-top: 0; } /* -------------------------------------------------------------------------- 4. Regroupement par type de document -------------------------------------------------------------------------- */ #res_script .typdoc{ margin: 0; } #res_script p.SousRubrique{ font-family: var(--hal-mono); font-size: 11px; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; color: var(--hal-ink-3); margin: 30px 0 2px; padding: 0; } /* -------------------------------------------------------------------------- 5. Une publication -------------------------------------------------------------------------- */ #res_script dl.NoticeRes{ margin: 0; padding: 17px 0; border-bottom: 1px solid var(--hal-rule); } #res_script .typdoc:last-child dl.NoticeRes:last-child{ border-bottom: 0; } /* Le nom du champ (« titre », « auteur »…) n'apporte rien : on le masque, mais il reste dans le DOM pour les lecteurs d'écran. */ #res_script dt.ChampRes{ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; } #res_script dd.ValeurRes{ margin: 0; padding: 0; color: var(--hal-ink-2); } /* Titre */ #res_script .ValeurRes.Titre{ font-family: var(--hal-serif); font-size: 1.09rem; font-weight: 600; line-height: 1.35; color: var(--hal-ink); } #res_script .ValeurRes.Titre a{ color: inherit; text-decoration: none; border-bottom: 1px solid transparent; } #res_script .ValeurRes.Titre a:hover, #res_script .ValeurRes.Titre a:focus-visible{ color: var(--hal-accent); border-bottom-color: var(--hal-accent); } /* Auteurs */ #res_script .ValeurRes.Auteurs{ font-size: .92rem; color: var(--hal-ink-2); margin-top: 5px; } /* Détail de publication : revue, conférence, thèse, brevet… */ #res_script .ValeurRes.article, #res_script .ValeurRes.Identifiant, #res_script .ValeurRes.DOI, #res_script .ValeurRes.Type_de_document, #res_script .ValeurRes.Audience, #res_script .detail_revue, #res_script .detail_conf, #res_script .detail_cours, #res_script .detail_ouv, #res_script .detail_hdr, #res_script .detail_these, #res_script .detail_autre, #res_script .detail_brevet, #res_script .detail_rapport, #res_script .detail_sans_ref{ font-family: var(--hal-mono); font-size: .76rem; line-height: 1.6; letter-spacing: .01em; color: var(--hal-ink-3); margin-top: 8px; } /* le nom du lieu de publication : lisible plutôt qu'italique en chasse fixe */ #res_script .ValeurRes.article i, #res_script .ValeurRes.article em, #res_script [class*="detail_"] i{ font-style: normal; color: var(--hal-ink-2); } /* DOI et autres liens à l'intérieur du détail */ #res_script .ValeurRes.article a, #res_script [class*="detail_"] a, #res_script .ValeurRes.DOI a{ color: var(--hal-accent); text-decoration: none; border-bottom: 1px solid transparent; } #res_script .ValeurRes.article a:hover, #res_script [class*="detail_"] a:hover, #res_script .ValeurRes.DOI a:hover{ border-bottom-color: currentColor; } /* Résumé, s'il est activé dans haltools */ #res_script .Debut_du_resume{ font-size: .93rem; color: var(--hal-ink-2); margin-top: 10px; max-width: 72ch; } /* -------------------------------------------------------------------------- 6. Liens PDF et BibTeX Les deux icônes PNG de haltools sont remplacées par des libellés typographiques, cohérents avec le reste du site et lisibles en mode sombre. -------------------------------------------------------------------------- */ #res_script .ValeurRes.Fichier_joint, #res_script .ValeurRes.LienBibtex{ display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 12px; } #res_script .ValeurRes.Fichier_joint img, #res_script .ValeurRes.LienBibtex img{ display: none; } #res_script .LienBibtexACoteFulltext{ display: inline-flex; } #res_script .ValeurRes.Fichier_joint > a, #res_script .LienBibtexACoteFulltext > a, #res_script .ValeurRes.LienBibtex > a{ display: inline-block; font-family: var(--hal-mono); font-size: .7rem; font-weight: 500; letter-spacing: .07em; text-transform: uppercase; text-decoration: none; color: var(--hal-ink-2); background: transparent; border: 1px solid var(--hal-rule-2); border-radius: 2px; padding: 4px 10px; line-height: 1.4; } #res_script .ValeurRes.Fichier_joint > a:hover, #res_script .LienBibtexACoteFulltext > a:hover, #res_script .ValeurRes.LienBibtex > a:hover{ color: var(--hal-accent); border-color: var(--hal-accent); } #res_script .ValeurRes.Fichier_joint > a::after{ content: "PDF"; } #res_script .LienBibtexACoteFulltext > a::after, #res_script .ValeurRes.LienBibtex > a::after{ content: "BibTeX"; } /* -------------------------------------------------------------------------- 7. Accessibilité et petits écrans -------------------------------------------------------------------------- */ #res_script a:focus-visible{ outline: 2px solid var(--hal-accent); outline-offset: 3px; border-radius: 2px; } @media (max-width: 640px){ #res_script{ font-size: 16px; } #res_script p.Rubrique{ font-size: 1.3rem; margin-top: 40px; } #res_script .ValeurRes.Titre{ font-size: 1.03rem; } #res_script .ValeurRes.article{ font-size: .73rem; } } /* L'année collante gêne à l'impression : on la fige. */ @media print{ #res_script p.Rubrique{ position: static; } #res_script .ValeurRes.Fichier_joint, #res_script .ValeurRes.LienBibtex{ display: none; } } /* -------------------------------------------------------------------------- 8. Cas particulier : page servie par haltools (paramètre css=…) Quand haltools génère la page, #res_script est un enfant DIRECT de . Ces règles habillent alors le document entier — fond, marges, largeur — pour que l'iframe ressemble au reste du site. Sur le site lui-même, #res_script est imbriqué dans .wrap > section, donc :has(> …) ne correspond pas et ces règles ne s'appliquent jamais. -------------------------------------------------------------------------- */ body:has(> #res_script){ margin: 0; padding: 8px 24px 40px; background: var(--paper, #FCFBF8); color: var(--ink, #191713); font-family: "Public Sans", "Helvetica Neue", Arial, Helvetica, sans-serif; } body:has(> #res_script) > #res_script{ max-width: 1120px; margin: 0 auto; } /* dans ce contexte l'en-tête du site n'existe pas : l'année colle en haut */ body:has(> #res_script) p.Rubrique{ top: 0; } @media (prefers-color-scheme: dark){ body:has(> #res_script){ background: var(--paper, #14130F); color: var(--ink, #EDE9E0); } }