tpitre

Native Figma MCP Alpha Evaluation Report

Date: 2026-03-22 Evaluator: TJ Pitre (via Claude Code) Test File: Altitude Design System (y83n4o9LOGs74oAoguFcGS) Test Codebase: Altitude Web Components (Lit-based) Confidential — Alpha Testing Group Only

---

Executive Summary

tpitre

---

title: Checkbox description: The Checkbox component provides a binary selection control that allows users to toggle options on or off, with support for labels, descriptions, and various visual states to communicate selection status and interactivity. Within CampusIQ, checkboxes enable users to select preferences, configure settings, filter data, agree to terms, and make multi-select choices across forms and configuration interfaces. status: stable version: 1.0.0 category: components tags: [checkbox, variants, configurable] figma: https://www.figma.com/design/ioFDU1TszfuEsopivSB6Ox/CollegeTown%20Design%20System?node-id=46-112 source: src/components/checkbox/checkbox.tsx canonical: reconciled

tpitre

tpitre

# Loop through the CSV file and run the WP CLI command
while IFS=, read orig new; do
    terminus wp pom-ool.dev --skip-themes --skip-plugins search-replace "$orig" "$new" wp_posts --include-columns=post_content --verbose
done < ool-cleanup-tab1-2.csv

tpitre

{% if card %}
  <div class="c-card{{ card.classes ? ' ' ~ card.classes }}">
    {% include "@atoms/images/image/figure.twig" with {
      "figure": {
        "link": {
          "url": card.link
        },
        "image": {
          "src": card.thumbnail.src,
          "alt": card.thumbnail.alt

tpitre

{% if card_grid %}
  <section class="c-card-grid{{ card_grid.classes ? ' ' ~ card_grid.classes }}">
    <div data-bp="container">
      <div class="l-wrap">
        <div class="c-card-grid__container u-spacing">
        
          {% if card_grid.heading or card_grid.dek %}
            <div class="c-card-grid__header l-conatiner--m u-spacing--half">
              {% include "@atoms/text/heading/heading.twig" with {
                "heading": {

tpitre

{# Pull in the layout wrapper #}
{% extends "@templates/_layout.twig" %}

{# Fill in the "content" block defined in _layout.twig #}
{% block content %}

  <div class="c-content{{ content.classes ? ' ' ~ content.classes }} u-spacing--and-half u-space--bottom">
    <div data-bp="container">
      <div class="l-wrap">

tpitre

<?php
/**
 * The template for main archive pages.
 *
 * Methods for TimberHelper can be found in the /lib sub-directory
 *
 * @package  WordPress
 * @subpackage  Timber
 * @since    Timber 0.1
 */

tpitre

Andover component library

Storybook for Vue component libary for rapid development.

Dependecies

This component library utilizes the following dependecies.

• Node.js
• Vue.js

tpitre

<div class="o-mini-modal o-mini-modal--share u-background-color--secondary u-corner-rounded u-align--center">
  <div class="o-mini-modal__inner">
    <button class="o-mini-modal__close o-close o-icon u-icon--s js-toggle" data-remove-class="share-modal-is-active">
      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30">
        <polygon points="30 28.349 16.652 15.001 29.999 1.653 28.349 0 15 13.349 1.652 0.001 0 1.652 13.349 15 0.001 28.349 1.652 30 15 16.652 28.348 29.999 30 28.349"></polygon>
      </svg>
    </button>
    <h3 class="u-font--body u-space--bottom">Share this</h3>
    <div class="c-utility-links c-utility-links--share">
      <a target="_blank" href="https://facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww.womensrunning.com%2Fculture%2Fnews%2Fdesiree-lindens-50k-world-record-attempt%2F?utm_medium=social%26utm_source=facebook%26utm_campaign=onsiteshare" class="c-utility-links__link o-icon o-icon--facebook " data-analytics-event="click" data-analytics-data="{&quot;name&quot;: &quot;