Communitygithub.com

husheng-web/personal-website-skills

Ajoute ou révise un lecteur accessible de prévisualisation de projet pour des images longues ordonnées, des pages de document ou des modules visuels organisés.

Qu'est-ce que personal-website-skills ?

Cette compétence permet d'intégrer ou de réviser un lecteur de prévisualisation de projet à l'intérieur d'une archive existante, sans interrompre le flux de navigation. Elle est conçue pour les portfolios web nécessitant une présentation accessible et ordonnée de longues images, pages de documents ou modules visuels. Elle s'appuie sur un mécanisme de dialogue ou d'archive préexistant et respecte l'ordre source déclaré des ressources. La compétence garantit que chaque page ou module reçoive un label localisé accessible, que la surface de lecture soit verticale et contenue, et que les comportements du clavier (comme la touche Échap), la restauration du focus et le verrouillage du défilement soient préservés. Une route de détail n'est exposée que si elle est publiable, évitant ainsi les destinations cassées ou en double. La validation inclut le chargement de tous les actifs, la présence des labels ordonnés, et l'absence de débordement horizontal sur les écrans de bureau et mobiles.

Compatible avec~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/husheng-web/personal-website-skills/tree/HEAD/skills/portfolio-project-preview-reader

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

Documentation

Lecteur de Prévisualisation de Projet Portfolio

Présente les visuels longs de projet approuvés à l'intérieur d'une archive existante sans interrompre le flux de navigation environnant.

Avant l'implémentation

Inspectez le modèle d'état de l'archive/dialogue, les chemins de lecture de documents existants, le registre des projets, l'ordre source des ressources et les styles mobiles. Généralisez uniquement un comportement réellement répété ; conservez les règles propres à un projet locales lorsqu'aucune abstraction réutilisable n'est justifiée.

Exigences

  • Préservez l'ordre source déclaré et attribuez à chaque page ou module un label localisé accessible.
  • Utilisez une surface de lecture verticale contenue ; n'étendez pas la page de manière inattendue et n'introduisez pas de débordement horizontal.
  • Préservez la fermeture, la touche Échap, la restauration du focus, le verrouillage du défilement et le comportement du clavier déjà fournis par le dialogue de prévisualisation.
  • Acheminez vers une page de détail uniquement lorsqu'elle est publiable ; n'exposez pas une destination cassée ou sémantiquement en double.

Validation

Vérifiez que toutes les ressources se chargent, que les labels ordonnés sont présents, que l'ouverture/fermeture de la prévisualisation fonctionne, et que la largeur du lecteur n'a pas de débordement horizontal sur les écrans de bureau et mobiles. Exécutez les vérifications de type, de lint et de build de production après les modifications de code.

Individual skills in this repo

This repo contains 7 individual skills — each has its own dedicated page.

Skills associés