Page Layout
Read about our dashboard design system and its visual components.
Version 1.0
There are two types of tables available to choose from. Card based tables contain table cell content that spans multipel rows or require unique visual styling. The table below is an example of a card based table taken from the threats view. Do not include too many columns to ensure correct column tightness.
Date | Risk | Action | User Info | Signals | Policy | |
---|---|---|---|---|---|---|
Oct 15 14:58 |
95
|
Deny |
johan@castle.io (Apple; iOS 12.3.2) Opera on iOS 12.3.2 |
Fast Travel New Device New Browser | Malicious Logins ATO |
|
Oct 14 11:24 |
65
|
Challenge |
lisa@castle.io (Apple; iOS 12.3.2) Opera on iOS 12.3.2 |
Datacenter VPN | Malicious Logins ATO |
|
Oct 10 21:45 |
35
|
Allow |
jin@castle.io (Windows; OS 12.3.2) Firefox on Windows 10 12.3.20.20.10.25 |
New Country | Malicious Logins ATO |
|
Text based tables are tables that include single row text content inside table cells. The following example was taken from the debugger view within the app. When determining the responsive nature of each table, truncate the column with the most varied with ellipsis when text overflows.
Timestamp | URL | Event | JSON | |
---|---|---|---|---|
2020-10-15 14:58 |
/v1/authenticate
|
$login.succeeded |
{ "properties": { "login_type": "$password" }, "context": { "client_id": false, "ip": "172.58.43.135", "user_agent": "(Apple; iOS 12.3.2) Opera/62.17 _hx0010000001", "headers": { "Accept-Language": "en-us,en;q=0.5", "Referer": "https://demo.castle.io//authenticate" } }
|
|
2020-10-15 14:58 |
/v1/authenticate
|
$login.succeeded |
{ "properties": { "login_type": "$password" }, "context": { "client_id": false, "ip": "172.58.43.135", "user_agent": "(Apple; iOS 12.3.2) Opera/62.17 _hx0010000001", "headers": { "Accept-Language": "en-us,en;q=0.5", "Referer": "https://demo.castle.io//authenticate" } }
|
|
2020-10-15 14:58 |
/v1/authenticate
|
$login.succeeded |
{ "properties": { "login_type": "$password" }, "context": { "client_id": false, "ip": "172.58.43.135", "user_agent": "(Apple; iOS 12.3.2) Opera/62.17 _hx0010000001", "headers": { "Accept-Language": "en-us,en;q=0.5", "Referer": "https://demo.castle.io//authenticate" } }
|
|
2020-10-15 14:58 |
/v1/authenticate
|
$registration.succeeded |
{ "properties": { "login_type": "$password" }, "context": { "client_id": false, "ip": "172.58.43.135", "user_agent": "(Apple; iOS 12.3.2) Opera/62.17 _hx0010000001", "headers": { "Accept-Language": "en-us,en;q=0.5", "Referer": "https://demo.castle.io//authenticate" } }
|
|