zoe/autojanet
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
autojanet/skills/understand/languages/css.md
Zoë cc74ad0bd0
Some checks failed
ci/woodpecker/push/woodpecker Pipeline failed
Details
fix: use library/ Harbor project, add skills, fix pipeline secrets 
- .woodpecker.yaml: image paths -> library/autojanet-{agent,dispatcher}
- .woodpecker.yaml: secret names RS_HARBOR_USER / RS_HARBOR_PASS (global)
- container/Dockerfile: restore COPY skills/, skills/ populated from opencode config
- skills/: 84 opencode skills bundled into image
- k8s/manifests: update image refs to library/
2026-05-30 15:43:14 -07:00

2 KiB
Raw Permalink Blame History

CSS Language Prompt Snippet

Key Concepts

  • Selectors: Element, class (.name), ID (#name), attribute ([attr]), and pseudo-class (:hover) targeting
  • Specificity: Inline > ID > Class > Element cascade priority determining which rules win
  • Box Model: margin, border, padding, content dimensions controlling element sizing
  • Flexbox: display: flex with justify-content, align-items for one-dimensional layouts
  • Grid: display: grid with grid-template-columns/rows for two-dimensional layouts
  • Custom Properties (Variables): --name: value with var(--name) for reusable design tokens
  • Media Queries: @media (max-width: ...) for responsive design breakpoints
  • SCSS/Sass Features: Nesting, $variables, @mixin, @include, @extend, @use, @forward
  • CSS Modules: Scoped class names (.module.css) preventing global style collisions
  • Cascade Layers: @layer for explicit control over cascade ordering

Notable File Patterns

  • *.css — Standard CSS stylesheets
  • *.scss / *.sass — Sass/SCSS preprocessor files
  • *.less — Less preprocessor files
  • *.module.css / *.module.scss — CSS Modules (scoped styles)
  • globals.css / reset.css / normalize.css — Global base styles
  • tailwind.config.js — Tailwind CSS configuration (though a JS file)
  • variables.scss / _variables.scss — Design token definitions

Edge Patterns

  • CSS files are related to the HTML or component files that import them for styling
  • SCSS partial files (_*.scss) are depends_on by the main stylesheet that @uses them
  • CSS variable definition files are related to all stylesheets that reference those variables
  • CSS Modules are related to the component files that import them

Summary Style

"Global stylesheet defining CSS custom properties for the design system color palette and typography." "Responsive layout styles with flexbox and grid for the dashboard page across 3 breakpoints." "SCSS partial defining shared mixins for spacing, shadows, and media query breakpoints."