Skip to content

This page demonstrates all reusable Vue components available in the SSM documentation system. Use this as a reference for how to implement and style each component.

Table of Contents


PlatformNote

This is a macOS-specific note.

CopyButton

NextStepCard

👉
Next Step

Go to the next guide

SectionHeader

Section Title

FeatureGrid & FeatureCard

ComponentInfoGrid & ComponentInfoCard

Sample Component

Purpose: This is a demonstration of the ComponentInfoCard within a ComponentInfoGrid.

Stores:

  • Data point A
  • Configuration B
  • Metric C
Another Component

Purpose: Illustrates how multiple cards appear in the grid layout.

Stores:

  • Log file X
  • User preference Y
  • Cache entry Z

RequirementsGrid

Docker Host
Docker 20.10+
2GB RAM
Target Devices
SSH access
Python 3.8+

StepPath

1

Step One

First step

Learn more
2

Step Two

Second step

Next

PlaybookCodeExample

📄

---
- name: Example
  hosts: all
  tasks:
    - debug: msg='Hello'

PlaybookModelDiagram

Playbook Model Architecture
📘
Playbook
Ansible-based automation script
🏗️
Structure
  • Plays
  • Tasks
  • Handlers
  • Roles
💾
Storage
  • Local
  • Remote Git
  • Version Control
▶️
Execution
  • Manual
  • Scheduled
  • Triggered
🔄
Variables
  • Inventory
  • Playbook
  • Extra

DeviceModelDiagram

🖥️

Device Data Model

This interactive diagram will show the relationships between Device, SSH Connection, Docker Engine, Containers, and Metrics.

🖥️ Device
id, name, ip, status...
🔑 SSH Connection
host, port, username...
🐳 Docker Engine
version, status...
📦 Containers
id, name, image...
📊 Metrics
cpu, memory, disk...

MentalModelDiagram

Device Architecture
Device Architecture Diagram
Figure 1: The Device Architecture in SSM

ProcessSteps

1

Step 1

Do this first.

2

Step 2

Then do this.

CardList

Diagram

SSHSSHSSH (Statistics)

Swiper

Devices
Devices
Manage all your devices effortlessly
Containers
Containers
Monitor and manage your containers seamlessly
Dashboard
Dashboard
Track CPU and memory usage efficiently
Deploy
Deploy
Deploy containers to your devices effortlessly
Add Device
Add Device
Add devices with ease

Made with love