Template documentation

A complete HTML workspace for the people who make customer support feel human. The template combines help desk workflows with reusable forms, components, authentication screens, and utility pages.

Open it. Make it yours.

Every page is ready to open in a browser. All fonts, icons, CSS, and JavaScript are included locally. You can copy this entire folder into your project without installing dependencies.

Open index.html to view the admin workspace. Open front/index.html from the release folder for the customer portal. Each folder is self-contained and can be hosted independently. For consistent demo storage across pages, serve the folder through a static web server.

Type that feels like TDesk

Plus Jakarta Sans is served locally at weights 400–700. Page titles use 28–32px, section headings 17–20px, body 13–15px, and mobile fields 16px. Keep sentences clear and actions specific.

Space with a purpose

Use the 4px spacing scale, 12px controls, 20px panels, and larger conversation shapes sparingly. White working surfaces sit on a quiet cool canvas. Status is always expressed in text as well as color.

admin/
  index.html     Support overview
  *.html         Editable admin pages
  assets/        Styles, scripts, fonts, and images
  vendor/        Local third-party assets and notices

front/
  index.html     Customer help center
  *.html         Editable customer pages
  assets/        Styles, scripts, fonts, and images
  vendor/        Local third-party assets and notices

Edit the HTML, CSS, and JavaScript directly. No install, generator, or build is needed.

The browser demo supports ticket creation, replies, assignments, filters, saved drafts, local settings, table exports, form validation, command search, and UI components. These changes stay in this browser under the sami.admin.v1. storage prefix.

Authentication screens validate input and show the next interface state. They do not authenticate users, send email, enforce permissions, or store passwords. Team invitations, SLA policies, and automations are local configuration examples. Attachments are selected locally, not uploaded.

• Replace browser-local stores with your ticket, customer, article, and workspace APIs.
• Implement server-side sessions, password hashing, recovery tokens, rate limits, and access enforcement.
• Validate every request on the server. Client-side validation helps the interface but cannot enforce trust.
• Sanitize rich content and file uploads, verify file type and size, and store attachments with authorized access.
• Connect real event data to reports and SLA calculations. Run automation rules on the server.
• Review email templates, copy, privacy information, and permissions for your product before launch.

Pages include a skip link, semantic landmarks, visible focus rings, labeled controls, inline validation errors, text status labels, native dialogs, and reduced-motion support. Wide tables scroll within their own region and dashboards include readable data summaries.

Use Ctrl + K (or ⌘ + K) for page search. Press Escape to close a dialog or the mobile navigation drawer. The static shell and page content remain readable without JavaScript.

Bootstrap 5.3.8 (MIT), Font Awesome Free 7.3.1 (fonts OFL, code MIT, icons CC BY), and Plus Jakarta Sans (OFL) are included with their license notices. Existing dependency versions are preserved. Ordinary application behavior uses native JavaScript.

The included libraries have their own licenses; retain their notices when distributing your template.