EPHEMERIS | MODÈLE CSS [DEMANDE]
Traduit de l’anglais
![EPHEMERIS | CSS TEMPLATE [REQUEST]](https://ella.janitorai.com/bot-avatars/VX6cuKyBrRvnIoHZkVONW.webp?width=1200){kind=avatar}
by:@Ru1nous
ET SI ON IMAGINAIT QUE LES AVIONS DANS LE CIEL NOCTURNE SONT COMME DES ÉTOILES FILANTES
EPHEMERIS
UN MODÈLE DE PROFIL JANITORAI CIEL NOCTURNE | CODE DE BIO PAR @MONIE_
✦ COMMENT UTILISER CE GUIDE ✦
1 · Copiez TOUT | OR | (GOOGLE DOCS)
2 · Modifiez-le avec Rechercher (Ctrl/Cmd + F). Cherchez les noms de classe dans ce guide, comme nx-title.
3 · Sélectionnez tout, copiez et collez dans votre case About Me de JanitorAI. Enregistrez, actualisez, vérifiez sur votre téléphone.
✦ Pas de lignes vides. Pour un saut de ligne, tapez <br>.
✦ Liens d'images directs uniquement. Doivent se terminer par .png / .jpg / .gif. Laissez les images inutilisées en src="" et elles se masquent d'elles-mêmes.
✦ Ne changez que les mots entre "guillemets" ou entre > et <. Ne supprimez jamais les guillemets, < >, { } ou class=.
✦ Pas de commentaires ni de caractères * ~ dans la partie <style>. JanitorAI coupe la feuille de style à ces endroits.
✦ JanitorAI supprime url(), @import, data: images, variables CSS, <input>, <label>, et les propriétés CSS scale: et rotate:.
mon nom → nx-title
la ligne de bienvenue → nx-kicker
l'image de mon personnage → nx-sona
l'image de ma lune → nx-moon-pic
le texte du bandeau défilant (modifiez les deux copies) → nx-ticker-set
les cases About Me → nx-acc
les images About Me (3) → nx-portrait
Règles / FAQ → nx-rf · nx-rule
mes liens → nx-fl
amis → nx-friend
galerie (modifiez les deux groupes) → nx-gi
série → nx-cover
bannières → nx-banner
lecteur de musique → nx-mp-trk
guirlandes lumineuses → nx-fairy · nx-fairyb
mascotte de la page → nx-pet
le crédit → nx-credit
04 / CHAQUE PANNEAU
LES SECTIONS
ABOUT ME
Trois images dans le cadre arqué, une par case. Chaque case est un <details> : titre dans <summary>, texte dans <p>. Gardez les trois cases. Copiez un bloc entier pour en ajouter une.
✦ RÈGLES & FAQ — deux cartes image ; au survol ça glisse, au clic la liste s'ouvre. Les règles sont nx-rule (titre dans <b>, raison dans <span>). Les questions FAQ sont des <details>.
✦ RETROUVEZ-MOI — une ligne nx-fl par lien : symbole dans <i>, nom dans <b>, ligne dans <small>, lien dans href.
✦ AMIS — une ligne nx-friend chacun (nom, ligne, image, lien). Quatre tiennent ; au-delà ça défile.
✦ GALERIE — bande à défilement latéral. Il y a DEUX groupes identiques (nx-gset) : changez chaque image dans LES DEUX.
✦ SÉRIE — chaque série est UN bloc <details class="nx-cover"> ... </details>. Copiez un bloc entier pour en ajouter une ; ne collez jamais à l'intérieur d'un bloc.
✦ ABOUT · RÈGLES · LIENS · AMIS · GALERIE · SÉRIE ✦
Barre en verre dépoli le long du bas du hero. Retour arrière et avant passent entre 3 pistes (l'image du disque, le titre, l'artiste et le lien changent tous). Play ouvre le lien de cette piste.
Cherchez nx-mp-trk → trois blocs. Changez nx-mp-song, nx-mp-artist, le <img src=""> et le href de nx-mp-btn.
Lien de lecture automatique YouTube : https://www.youtube.com/watch?v=VIDEO_ID&list=PLAYLIST_ID&autoplay=1
Spotify ouvre la playlist mais on ne peut pas forcer la lecture automatique.
Deux guirlandes superposées d'étoiles scintillantes pendent du bas de la barre supérieure du site, avec des étoiles suspendues qui se balancent. Elles restent en place pendant le défilement et ne bloquent jamais les clics. La première est nx-fairy (7 festons réguliers), celle du dessus, plus chargée, est nx-fairyb (11 festons irréguliers).
Pour les déplacer vers le haut ou le bas → changez top:56px dans les deux règles (même nombre). Les téléphones utilisent top:44px dans la ligne @media (max-width:720px) près de la fin du CSS.
Pour en retirer une → supprimez son bloc <div class="nx-fairy..."> tout en haut du code. Ne supprimez le CSS correspondant que si vous voulez un code plus propre.
Placez un PNG transparent dans nx-moon-pic. Il cycle pendant 60 secondes : l'ombre glisse, l'image se retourne, l'ombre revient. Changez 60s dans les quatre règles de la lune (gardez-les égales) ; -12s est le point de départ. Si elle est décentrée, changez inset:-19% dans .nx-moon-pic.
Les couleurs sont écrites en toutes lettres dans chaque règle, donc Rechercher & Remplacer recolore tout.
#d9dce6 argent #b9a6d6 accent violet #5b5b66 bordures grises #ececf0 texte du corps
Version or : utilisez le Gold Template, ou remplacez #d9dce6 → #efddba et #b9a6d6 → #dfc277
Polices : seules les polices intégrées au site fonctionnent (pas de @import). Remplacez un nom avec Rechercher & Remplacer, vous pouvez trouver une liste des polices acceptées ICI.
♡ La page semble sans style — un * ~ ou /* */ s'est glissé dans <style>, ou un } a été supprimé
♡ Image manquante — le lien n'est pas direct, ou src="" est vide
♡ Le bandeau / la galerie saute — les deux copies ne correspondent pas
♡ Les boutons du lecteur ne font rien — name="nxmp" manque, ou deux pistes ont open
♡ L'accordéon ne bascule pas — un <details> a perdu son name= ou </details>
✔ Libre d'utilisation et de modification sur votre propre profil. Vous pouvez retirer la ligne de crédit.
Créé 24 oct.
Mis à jour 25 oct.
Publié 24 oct.
proxy autorisé