.upptimerc.yml

owner: paperclipinc
repo: status

sites:
  - name: Marketing site
    url: https://paperclip.inc/
  - name: Docs
    url: https://paperclip.inc/docs
  - name: Auth
    url: https://paperclip.inc/auth/sign-in
  - name: Health API
    url: https://paperclip.inc/api/healthz

i18n:
  allSystemsOperational: All systems operational
  partialOutage: Some systems are degraded
  completeOutage: One service is down
  activeIncidents: Active incidents
  pastIncidents: Recent incidents
  pastScheduledMaintenance: Past maintenance
  footer: This page is [open source]($REPO), powered by [Upptime](https://upptime.js.org).

status-website:
  cname: status.paperclip.inc
  logoUrl: https://paperclip.inc/favicon.svg
  favicon: https://paperclip.inc/favicon.ico
  faviconSvg: https://paperclip.inc/favicon.svg
  name: Paperclip.inc Status
  introTitle: Paperclip.inc status
  introMessage: Real-time status for [paperclip.inc](https://paperclip.inc).
  navbar:
    - title: Status
      href: /
    - title: paperclip.inc
      href: https://paperclip.inc
    - title: Subscribe
      href: https://github.com/$OWNER/$REPO/issues
    - title: GitHub
      href: https://github.com/$OWNER/$REPO
  metaTags:
    - name: theme-color
      content: "#f7f7f4"
    - name: description
      content: Real-time status for paperclip.inc.
  js: |
    (function () {
      document.querySelectorAll('meta[name="theme-color"]').forEach(function (m) {
        m.setAttribute('content', '#f7f7f4');
      });
      fetch('/api/summary.json')
        .then(function (r) { return r.json(); })
        .then(function (d) {
          if (!d || !d.lastUpdate) return;
          var last = new Date(d.lastUpdate);
          var mins = Math.max(0, Math.round((Date.now() - last.getTime()) / 60000));
          var text = mins < 1
            ? 'Updated just now'
            : mins === 1
              ? 'Updated 1 minute ago'
              : 'Updated ' + mins + ' minutes ago';
          var h1 = document.querySelector('main h1, .intro h1, h1');
          if (!h1) return;
          var sub = document.createElement('p');
          sub.className = 'paperclip-last-update';
          sub.textContent = text;
          h1.parentNode.insertBefore(sub, h1.nextSibling);
        })
        .catch(function () {});
    })();
  css: |
    /* paperclip.inc status page — editorial monochrome, per DESIGN.md */

    :root {
      --color-canvas: #f7f7f4;
      --color-ink: #26251e;
      --color-body: #5a5852;
      --color-muted: #807d72;
      --color-hairline: #e6e5e0;
      --color-hairline-soft: #efeee8;
      --color-success: #1f8a65;
      --color-warning: #c08532;
      --color-error: #cf2d56;

      --body-background-color: var(--color-canvas) !important;
      --body-text-color: var(--color-ink) !important;
      --card-background-color: transparent !important;
      --card-border-color: transparent !important;
      --nav-background-color: var(--color-canvas) !important;
      --nav-border-bottom-color: var(--color-hairline) !important;
      --nav-current-border-bottom-color: var(--color-ink) !important;
      --down-border-left-color: var(--color-error) !important;
      --down-background-color: transparent !important;
      --down-color-color: var(--color-ink) !important;
      --degraded-border-left-color: var(--color-warning) !important;
      --degraded-color-color: var(--color-ink) !important;
      --up-border-left-color: var(--color-success) !important;
      --up-color-color: var(--color-ink) !important;
      --tag-color: var(--color-muted) !important;
      --tag-up-background-color: transparent !important;
      --tag-down-background-color: transparent !important;
      --tag-degraded-background-color: transparent !important;
      --code-color: var(--color-ink) !important;
      --code-background-color: transparent !important;
      --error-button-border-color: rgba(38, 37, 30, 0.2) !important;
      --error-button-background-color: transparent !important;
      --error-button-color: var(--color-ink) !important;
      --submit-button-background-color: var(--color-ink) !important;
      --submit-button-color: var(--color-canvas) !important;
      --submit-button-border-color: var(--color-ink) !important;
    }

    body {
      font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
      background: var(--color-canvas) !important;
      color: var(--color-ink) !important;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }

    h1, h2, h3, h4, h5, h6 {
      font-family: inherit !important;
      color: var(--color-ink) !important;
      font-weight: 400;
      letter-spacing: -0.01em;
    }

    /* Hero h1 — display-lg */
    main h1, .intro h1 {
      font-size: 36px;
      font-weight: 400;
      line-height: 1.2;
      letter-spacing: -0.72px;
      margin: 0 0 8px;
    }

    /* "Recent incidents" — display-md */
    main h2, .changed h2 {
      font-size: 26px;
      font-weight: 400;
      line-height: 1.25;
      letter-spacing: -0.325px;
      margin: 80px 0 24px;
    }

    /* Row title — title-md */
    article h3 {
      font-size: 18px !important;
      font-weight: 600 !important;
      letter-spacing: 0 !important;
      color: var(--color-ink) !important;
      opacity: 1 !important;
      margin: 0 0 4px !important;
    }

    /* "Updated N minutes ago" sub */
    .paperclip-last-update {
      font-size: 16px;
      color: var(--color-muted);
      margin: 0 0 64px;
    }

    .lead, .lead p {
      color: var(--color-muted) !important;
      font-size: 16px !important;
      font-weight: 400 !important;
    }

    a {
      color: var(--color-ink) !important;
      text-decoration: underline;
      text-decoration-color: rgba(38, 37, 30, 0.3);
      text-underline-offset: 2px;
      transition: text-decoration-color 0.15s ease;
    }
    a:hover {
      text-decoration-color: var(--color-ink) !important;
    }

    /* Nav: flat canvas, hairline baseline, no glassmorphism */
    nav {
      position: sticky !important;
      top: 0 !important;
      z-index: 100 !important;
      background: var(--color-canvas) !important;
      border-bottom: 1px solid var(--color-hairline) !important;
      padding: 0 !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }
    nav .container {
      padding-top: 18px !important;
      padding-bottom: 18px !important;
    }
    nav a {
      color: var(--color-muted) !important;
      text-decoration: none !important;
      font-size: 14px !important;
      font-weight: 500 !important;
    }
    nav a:hover { color: var(--color-ink) !important; }
    nav .logo div {
      color: var(--color-ink) !important;
      font-weight: 600 !important;
      font-size: 16px !important;
    }
    [aria-current] {
      color: var(--color-ink) !important;
      border-bottom: none !important;
    }

    /* 720px max, generous gutters */
    .container {
      max-width: 720px !important;
      padding-left: 24px !important;
      padding-right: 24px !important;
    }

    /* Hero top breathing room */
    main > section:first-of-type,
    .intro {
      padding-top: 80px !important;
    }

    /* Service rows: flat editorial, dot at left */
    article {
      background: transparent !important;
      border: 0 !important;
      border-bottom: 1px solid var(--color-hairline-soft) !important;
      border-radius: 0 !important;
      padding: 20px 0 20px 20px !important;
      margin: 0 !important;
      position: relative !important;
    }
    article + article { margin-top: 0 !important; }

    /* The 6px status dot (only color on the page) */
    article::before {
      content: '';
      position: absolute;
      left: 0;
      top: 28px;
      width: 6px;
      height: 6px;
      border-radius: 9999px;
      background: var(--color-success);
    }
    article.up::before       { background: var(--color-success); }
    article.degraded::before { background: var(--color-warning); }
    article.down::before     { background: var(--color-error); }

    article.down-active {
      background: rgba(207, 45, 86, 0.04) !important;
      border-color: rgba(207, 45, 86, 0.2) !important;
    }

    /* Status word at right — caption-uppercase but lowercased */
    .tag {
      background: transparent !important;
      color: var(--color-muted) !important;
      font-size: 11px !important;
      font-weight: 600 !important;
      letter-spacing: 0.88px !important;
      text-transform: lowercase !important;
      padding: 0 !important;
      border-radius: 0 !important;
    }

    /* Time-range form labels (Upptime shows day/week/month/year switcher) */
    form label {
      color: var(--color-muted) !important;
      font-size: 14px !important;
    }
    input[type="radio"]:checked + label { color: var(--color-ink) !important; }

    /* Footer — body-sm muted, hairline top */
    footer {
      color: var(--color-muted) !important;
      border-top: 1px solid var(--color-hairline) !important;
      font-size: 14px !important;
      padding: 32px 0 !important;
      margin-top: 80px !important;
    }
    footer a { color: var(--color-muted) !important; }
    footer a:hover { color: var(--color-ink) !important; }

    /* Loading spinner — muted, calm */
    .loading svg { stroke: var(--color-muted) !important; }