{"format":1,"api":2,"id":"fr.arcanescookie.scriptorium.lang.css","version":"1.0.0","category":"languages","author":"Les Arcanes de Cookie","color":"#2965f1","name":{"fr":"CSS","en":"CSS"},"description":{"fr":"Extraits CSS courants : flex, grille, media queries, variables, animations, ombres, texte tronqué… Pour CSS, SCSS et Less.","en":"Common CSS snippets: flex, grid, media queries, variables, animations, shadows, truncated text… For CSS, SCSS and Less."},"contributes":{"snippets":[{"language":"css","items":[{"prefix":"flexc","label":"Flex centré","body":"display: flex;\nalign-items: center;\njustify-content: center;"},{"prefix":"flexb","label":"Flex espacé","body":"display: flex;\nalign-items: ${1:center};\njustify-content: space-between;\ngap: ${2:1rem};"},{"prefix":"grid:auto","label":"Grille adaptative","body":"display: grid;\ngrid-template-columns: repeat(auto-fill, minmax(${1:220px}, 1fr));\ngap: ${2:1rem};"},{"prefix":"media","label":"Media query (largeur max)","body":"@media (max-width: ${1:768px}) {\n\t$0\n}"},{"prefix":"mq:dark","label":"Thème sombre du système","body":"@media (prefers-color-scheme: dark) {\n\t$0\n}"},{"prefix":"keyframes","label":"Animation @keyframes","body":"@keyframes ${1:nom} {\n\tfrom { $2 }\n\tto { $3 }\n}"},{"prefix":"root","label":"Variables :root","body":":root {\n\t--${1:couleur}: ${2:#8b5cf6};\n}"},{"prefix":"var","label":"Utiliser une variable","body":"var(--${1:couleur})"},{"prefix":"trans","label":"Transition","body":"transition: ${1:all} ${2:.2s} ${3:ease};"},{"prefix":"shadow","label":"Ombre portée","body":"box-shadow: 0 ${1:4px} ${2:12px} rgba(0, 0, 0, ${3:.25});"},{"prefix":"abs:fill","label":"Position absolue plein cadre","body":"position: absolute;\ninset: 0;"},{"prefix":"center","label":"Centrer un bloc","body":"margin: 0 auto;"},{"prefix":"trunc","label":"Texte tronqué (…)","body":"overflow: hidden;\ntext-overflow: ellipsis;\nwhite-space: nowrap;"},{"prefix":"reset","label":"Remise à zéro de base","body":"*, *::before, *::after { box-sizing: border-box; }\nbody { margin: 0; }\nimg { max-width: 100%; display: block; }"},{"prefix":"clamp","label":"Taille fluide (clamp)","body":"font-size: clamp(${1:1rem}, ${2:2.5vw}, ${3:2rem});"},{"prefix":"aspect","label":"Ratio d’aspect","body":"aspect-ratio: ${1:16 / 9};"},{"prefix":"snap","label":"Défilement par blocs","body":"scroll-snap-type: x mandatory;\noverflow-x: auto;"},{"prefix":"sticky","label":"En-tête collant","body":"position: sticky;\ntop: 0;\nz-index: ${1:10};"},{"prefix":"btn:style","label":"Style de bouton","body":"padding: ${1:.5rem 1rem};\nborder: 0;\nborder-radius: ${2:8px};\nbackground: ${3:#8b5cf6};\ncolor: ${4:#fff};\ncursor: pointer;"},{"prefix":"hover","label":"État :hover","body":"${1:.selecteur}:hover {\n\t$0\n}"},{"prefix":"focus","label":"État :focus-visible","body":"${1:.selecteur}:focus-visible {\n\toutline: 2px solid ${2:#8b5cf6};\n\toutline-offset: 2px;\n}"}]},{"language":"scss","items":[{"prefix":"flexc","label":"Flex centré","body":"display: flex;\nalign-items: center;\njustify-content: center;"},{"prefix":"flexb","label":"Flex espacé","body":"display: flex;\nalign-items: ${1:center};\njustify-content: space-between;\ngap: ${2:1rem};"},{"prefix":"grid:auto","label":"Grille adaptative","body":"display: grid;\ngrid-template-columns: repeat(auto-fill, minmax(${1:220px}, 1fr));\ngap: ${2:1rem};"},{"prefix":"media","label":"Media query (largeur max)","body":"@media (max-width: ${1:768px}) {\n\t$0\n}"},{"prefix":"mq:dark","label":"Thème sombre du système","body":"@media (prefers-color-scheme: dark) {\n\t$0\n}"},{"prefix":"keyframes","label":"Animation @keyframes","body":"@keyframes ${1:nom} {\n\tfrom { $2 }\n\tto { $3 }\n}"},{"prefix":"root","label":"Variables :root","body":":root {\n\t--${1:couleur}: ${2:#8b5cf6};\n}"},{"prefix":"var","label":"Utiliser une variable","body":"var(--${1:couleur})"},{"prefix":"trans","label":"Transition","body":"transition: ${1:all} ${2:.2s} ${3:ease};"},{"prefix":"shadow","label":"Ombre portée","body":"box-shadow: 0 ${1:4px} ${2:12px} rgba(0, 0, 0, ${3:.25});"},{"prefix":"abs:fill","label":"Position absolue plein cadre","body":"position: absolute;\ninset: 0;"},{"prefix":"center","label":"Centrer un bloc","body":"margin: 0 auto;"},{"prefix":"trunc","label":"Texte tronqué (…)","body":"overflow: hidden;\ntext-overflow: ellipsis;\nwhite-space: nowrap;"},{"prefix":"reset","label":"Remise à zéro de base","body":"*, *::before, *::after { box-sizing: border-box; }\nbody { margin: 0; }\nimg { max-width: 100%; display: block; }"},{"prefix":"clamp","label":"Taille fluide (clamp)","body":"font-size: clamp(${1:1rem}, ${2:2.5vw}, ${3:2rem});"},{"prefix":"aspect","label":"Ratio d’aspect","body":"aspect-ratio: ${1:16 / 9};"},{"prefix":"snap","label":"Défilement par blocs","body":"scroll-snap-type: x mandatory;\noverflow-x: auto;"},{"prefix":"sticky","label":"En-tête collant","body":"position: sticky;\ntop: 0;\nz-index: ${1:10};"},{"prefix":"btn:style","label":"Style de bouton","body":"padding: ${1:.5rem 1rem};\nborder: 0;\nborder-radius: ${2:8px};\nbackground: ${3:#8b5cf6};\ncolor: ${4:#fff};\ncursor: pointer;"},{"prefix":"hover","label":"État :hover","body":"${1:.selecteur}:hover {\n\t$0\n}"},{"prefix":"focus","label":"État :focus-visible","body":"${1:.selecteur}:focus-visible {\n\toutline: 2px solid ${2:#8b5cf6};\n\toutline-offset: 2px;\n}"}]},{"language":"less","items":[{"prefix":"flexc","label":"Flex centré","body":"display: flex;\nalign-items: center;\njustify-content: center;"},{"prefix":"flexb","label":"Flex espacé","body":"display: flex;\nalign-items: ${1:center};\njustify-content: space-between;\ngap: ${2:1rem};"},{"prefix":"grid:auto","label":"Grille adaptative","body":"display: grid;\ngrid-template-columns: repeat(auto-fill, minmax(${1:220px}, 1fr));\ngap: ${2:1rem};"},{"prefix":"media","label":"Media query (largeur max)","body":"@media (max-width: ${1:768px}) {\n\t$0\n}"},{"prefix":"mq:dark","label":"Thème sombre du système","body":"@media (prefers-color-scheme: dark) {\n\t$0\n}"},{"prefix":"keyframes","label":"Animation @keyframes","body":"@keyframes ${1:nom} {\n\tfrom { $2 }\n\tto { $3 }\n}"},{"prefix":"root","label":"Variables :root","body":":root {\n\t--${1:couleur}: ${2:#8b5cf6};\n}"},{"prefix":"var","label":"Utiliser une variable","body":"var(--${1:couleur})"},{"prefix":"trans","label":"Transition","body":"transition: ${1:all} ${2:.2s} ${3:ease};"},{"prefix":"shadow","label":"Ombre portée","body":"box-shadow: 0 ${1:4px} ${2:12px} rgba(0, 0, 0, ${3:.25});"},{"prefix":"abs:fill","label":"Position absolue plein cadre","body":"position: absolute;\ninset: 0;"},{"prefix":"center","label":"Centrer un bloc","body":"margin: 0 auto;"},{"prefix":"trunc","label":"Texte tronqué (…)","body":"overflow: hidden;\ntext-overflow: ellipsis;\nwhite-space: nowrap;"},{"prefix":"reset","label":"Remise à zéro de base","body":"*, *::before, *::after { box-sizing: border-box; }\nbody { margin: 0; }\nimg { max-width: 100%; display: block; }"},{"prefix":"clamp","label":"Taille fluide (clamp)","body":"font-size: clamp(${1:1rem}, ${2:2.5vw}, ${3:2rem});"},{"prefix":"aspect","label":"Ratio d’aspect","body":"aspect-ratio: ${1:16 / 9};"},{"prefix":"snap","label":"Défilement par blocs","body":"scroll-snap-type: x mandatory;\noverflow-x: auto;"},{"prefix":"sticky","label":"En-tête collant","body":"position: sticky;\ntop: 0;\nz-index: ${1:10};"},{"prefix":"btn:style","label":"Style de bouton","body":"padding: ${1:.5rem 1rem};\nborder: 0;\nborder-radius: ${2:8px};\nbackground: ${3:#8b5cf6};\ncolor: ${4:#fff};\ncursor: pointer;"},{"prefix":"hover","label":"État :hover","body":"${1:.selecteur}:hover {\n\t$0\n}"},{"prefix":"focus","label":"État :focus-visible","body":"${1:.selecteur}:focus-visible {\n\toutline: 2px solid ${2:#8b5cf6};\n\toutline-offset: 2px;\n}"}]}]}}