{
  "context": "Evaluates whether the solution uses @fortawesome/vue-fontawesome to render the configured icons with the styling and layout props (size, border, fixedWidth, pull, rotation) defined in the spec. Scoring checks that each requirement is satisfied through FontAwesomeIcon props rather than custom CSS or substitute components.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "Icon component",
      "description": "Renders every listed icon via the FontAwesomeIcon component imported from @fortawesome/vue-fontawesome, not via plain SVG or img elements.",
      "max_score": 20
    },
    {
      "name": "Size prop",
      "description": "Passes the size prop on FontAwesomeIcon using the provided per-icon size or the defaultSize fallback so generated class names (e.g., fa-2x) come from the library rather than manual classes.",
      "max_score": 20
    },
    {
      "name": "Border prop",
      "description": "Uses the border prop on FontAwesomeIcon whenever an icon is marked as bordered, relying on the library to apply border styling classes.",
      "max_score": 15
    },
    {
      "name": "Fixed width",
      "description": "Sets the fixedWidth prop on FontAwesomeIcon to align items with equal widths when requested, avoiding custom width hacks.",
      "max_score": 15
    },
    {
      "name": "Pull alignment",
      "description": "Maps pull values ('left'/'right') from the config directly into the pull prop on FontAwesomeIcon to position icons relative to text.",
      "max_score": 15
    },
    {
      "name": "Rotation",
      "description": "Applies rotation values (90/180/270) through the rotation prop on FontAwesomeIcon rather than using CSS transforms, producing the library's rotation classes.",
      "max_score": 15
    }
  ]
}