Skip to content

Commit 7a0b35a

Browse files
figure style
1 parent c2d38e6 commit 7a0b35a

File tree

8 files changed

+188
-39
lines changed

8 files changed

+188
-39
lines changed

.gitignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,5 @@
11
__pycache__/mkdocs_config.cpython-312.pyc
22
__pycache__
3+
visited.log
4+
contents.txt
5+
broken-links.txt

collect-frontmatter.py

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
import os
2+
import re
3+
import yaml
4+
from pathlib import Path
5+
import json
6+
7+
FRONTMATTER_PATTERN = re.compile(r"^---\n(.*?)\n---\n", re.DOTALL)
8+
9+
10+
def parse_frontmatter(filepath):
11+
with open(filepath, "r", encoding="utf-8") as f:
12+
content = f.read()
13+
14+
match = FRONTMATTER_PATTERN.match(content)
15+
if not match:
16+
return None
17+
18+
try:
19+
frontmatter = yaml.safe_load(match.group(1))
20+
return {
21+
"title": frontmatter.get("title", ""),
22+
"description": frontmatter.get("description", ""),
23+
}
24+
except yaml.YAMLError:
25+
print(f"Failed to parse YAML in {filepath}")
26+
return None
27+
28+
29+
def collect_frontmatter_data():
30+
data = {}
31+
docs_path = Path("./docs")
32+
for md_file in docs_path.rglob("*.md"):
33+
parsed = parse_frontmatter(md_file)
34+
if parsed:
35+
data[str(md_file)] = parsed
36+
return data
37+
38+
39+
if __name__ == "__main__":
40+
result = collect_frontmatter_data()
41+
print(json.dumps(result, indent=2))

docs/assets/invariant.css

Lines changed: 49 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -401,7 +401,7 @@ span.llm-badge::before {
401401
background-color: rgb(199, 130, 199);
402402
display: inline-block;
403403
height: 18pt;
404-
404+
405405
padding: 2pt 4pt;
406406
border-radius: 4pt;
407407
}
@@ -416,7 +416,7 @@ span.detector-badge::before {
416416
background-color: var(--primary-blue);
417417
display: inline-block;
418418
height: 18pt;
419-
419+
420420
padding: 2pt 4pt;
421421
border-radius: 4pt;
422422
}
@@ -431,7 +431,7 @@ span.high-latency::before {
431431
background-color: var(--primary-red);
432432
display: inline-block;
433433
height: 18pt;
434-
434+
435435
padding: 2pt 4pt;
436436
border-radius: 4pt;
437437
}
@@ -446,7 +446,7 @@ span.parser-badge::before {
446446
background-color: #3A99FF;
447447
display: inline-block;
448448
height: 18pt;
449-
449+
450450
padding: 2pt 4pt;
451451
border-radius: 4pt;
452452
}
@@ -461,7 +461,7 @@ span.parser-badge::before {
461461
background-color: #3A99FF;
462462
display: inline-block;
463463
height: 18pt;
464-
464+
465465
padding: 2pt 4pt;
466466
border-radius: 4pt;
467467
}
@@ -470,7 +470,7 @@ span.parser-badge::before {
470470
font-size: 10pt;
471471
height: 16pt;
472472
padding: 0pt 3pt;
473-
top: 0pt;
473+
top: 0pt;
474474
margin-left: 0pt;
475475
}
476476

@@ -479,14 +479,14 @@ span.parser-badge::before {
479479
font-size: 10pt;
480480
height: 16pt;
481481
padding: 0pt 3pt;
482-
top: 0pt;
482+
top: 0pt;
483483
margin-left: 0pt;
484484
}
485485

486486

487487
.detector-badge {
488488
position: relative;
489-
}
489+
}
490490

491491
.detector-badge:hover::after {
492492
content: 'Detectors allow you to detect the presence of certain patterns and types of data in an input.';
@@ -516,7 +516,11 @@ span.parser-badge::before {
516516
content: 'BUILTIN DESCRIPTION';
517517
}
518518

519-
.parser-badge:hover::after, .detector-badge:hover::after, .llm-badge:hover::after, .builtin-badge:hover::after, .high-latency:hover::after {
519+
.parser-badge:hover::after,
520+
.detector-badge:hover::after,
521+
.llm-badge:hover::after,
522+
.builtin-badge:hover::after,
523+
.high-latency:hover::after {
520524
position: absolute;
521525
left: 50%;
522526
transform: translateX(-50%);
@@ -901,20 +905,20 @@ ul.md-nav__list {
901905
}
902906

903907
/* Set minimum widths for the first two columns */
904-
.md-typeset__table th:nth-child(1),
908+
.md-typeset__table th:nth-child(1),
905909
.md-typeset__table td:nth-child(1) {
906910
width: 22%;
907911
min-width: 100px;
908912
}
909913

910-
.md-typeset__table th:nth-child(2),
914+
.md-typeset__table th:nth-child(2),
911915
.md-typeset__table td:nth-child(2) {
912916
width: 25%;
913917
min-width: 250px;
914918
}
915919

916920
/* Let the description column take up remaining space */
917-
.md-typeset__table th:nth-child(3),
921+
.md-typeset__table th:nth-child(3),
918922
.md-typeset__table td:nth-child(3) {
919923
width: 50%;
920924
}
@@ -939,9 +943,9 @@ ul.md-nav__list {
939943
margin-top: -0.9rem;
940944
padding-left: 4px;
941945
font-style: italic;
942-
}
946+
}
947+
943948

944-
945949
.box.secondary {
946950
position: relative;
947951
}
@@ -1010,13 +1014,14 @@ ul.md-nav__list {
10101014
font-family: monospace;
10111015
}
10121016

1013-
.md-typeset ul li, .md-typeset ol li {
1017+
.md-typeset ul li,
1018+
.md-typeset ol li {
10141019
font-size: 14pt;
10151020
}
10161021

10171022
.md-sidebar--primary .md-sidebar__scrollwrap {
10181023
overflow-y: visible;
1019-
}
1024+
}
10201025

10211026
.md-header__title {
10221027
padding-left: 30pt;
@@ -1061,4 +1066,32 @@ ul.md-nav__list {
10611066
padding-left: 15pt;
10621067
font-weight: 500;
10631068
height: 30pt;
1069+
}
1070+
1071+
.styled-figure {
1072+
display: block;
1073+
margin: 0 auto;
1074+
width: 100%;
1075+
max-width: 800pt !important;
1076+
padding: 10pt;
1077+
background-color: rgb(238, 238, 238);
1078+
border-radius: 4pt;
1079+
}
1080+
1081+
.styled-figure.half {
1082+
max-width: 500pt !important;
1083+
}
1084+
1085+
.styled-figure img {
1086+
border: 1pt solid #efefef;
1087+
border-radius: 4pt;
1088+
}
1089+
1090+
.styled-figure figcaption {
1091+
margin-top: 5pt;
1092+
margin-bottom: -2.5pt;
1093+
}
1094+
1095+
.rounded-figure {
1096+
border-radius: 10pt;
10641097
}

docs/guardrails/explorer.md

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,10 @@ Learn how to configure and manage your guardrailing rules in Explorer.
1212

1313
It exposes a simple configuration interface, that allows you to configure, test and deploy guardrails to your agentic system, as well as inspect guardrail failures in detail.
1414

15-
<img src="site:/guardrails/guardrails-configuration-explorer.png" alt="Explorer Landing" class="invariant-architecture" style="display: block; margin: 0 auto; width: 100%; max-width: 650pt;"/>
15+
<figure class="styled-figure">
16+
<img src="site:/guardrails/guardrails-configuration-explorer.png" alt="Explorer Landing" class="invariant-architecture" style="display: block; margin: 0 auto; width: 100%; max-width: 650pt;"/>
17+
<figcaption style="text-align: center; font-size: 0.8em; color: #666;">Configuring guardrails in Explorer</figcaption>
18+
</figure>
1619

1720
## How Gateway and Explorer Work Together
1821

@@ -62,8 +65,10 @@ To learn more about how Gateway works, check out the [Gateway documentation](../
6265

6366
To configure guardrails, switch to the `Guardrails` tab in the top navigation bar of your Explorer project.
6467

65-
<br/><br/>
66-
<img src="site:/guardrails/guardrails-configuration-explorer.png" alt="Explorer Landing" class="invariant-architecture" style="display: block; margin: 0 auto; width: 100%; max-width: 650pt;"/>
68+
<figure class="styled-figure">
69+
<img src="site:/guardrails/guardrails-configuration-explorer.png" alt="Explorer Landing" class="invariant-architecture" style="display: block; margin: 0 auto; width: 100%; max-width: 650pt;"/>
70+
<figcaption style="text-align: center; font-size: 0.8em; color: #666;">Configuring guardrails in Explorer</figcaption>
71+
</figure>
6772

6873
Here, you are presented with two options:
6974

@@ -118,7 +123,7 @@ Lastly, to inspect guardrail failures in detail, navigate to the `Traces` tab in
118123

119124
Newly pushed traces with Guardrail violations will be automatically annotated with Guardrail violation annotations, highlighting the exact range and location of the guardrail violation in the agent trace.
120125

121-
<figure style="display: block; margin: 0 auto; width: 100%; max-width: 800pt !important; border: 2pt solid #efefef; padding: 10pt; background-color: white;">
126+
<figure class="styled-figure">
122127
<img src="site:/guardrails/guardrail-highlight.png" alt="New Guardrail" class="invariant-architecture" style="display: block; margin: 0 auto; width: 100%; max-width: 650pt;"/>
123128
<figcaption style="text-align: center; font-size: 0.8em; color: #666;">Guardrails precisely highlights the location and cause for guardrail violations in the agent trace, allowing users to exactly pinpoint the cause of the violation.</figcaption>
124129
</figure>

docs/guardrails/gateway.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -109,7 +109,7 @@ Explorer provides a comprehensive user interface to manage and configure your gu
109109

110110
Please see the chapter on [Guardrails in Explorer](./explorer.md) for more details on how to use Explorer to manage your guardrailing rules.
111111

112-
<figure style="display: block; margin: 0 auto; width: 100%; max-width: 800pt !important; border: 2pt solid #efefef; padding: 10pt; background-color: white;">
112+
<figure class="styled-figure half">
113113
<img src="site:/guardrails/guardrails-in-explorer-screenshot.png" alt="Screenshot showing Guardrails configuration in Explorer" class="guardrails-in-explorer-screenshot"/>
114114
<figcaption style="text-align: center; font-size: 0.8em; color: #666;">Screenshot showing Guardrails configuration in Explorer</figcaption>
115115
</figure>

docs/guardrails/index.md

Lines changed: 44 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -180,4 +180,47 @@ Invariant's Analysis models are still in early preview, but if you are interest
180180

181181
This chapter has introduced you to the fundamentals of guardrailing with Invariant. We have covered the basics of writing rules, and how to deploy and maintain them.
182182

183-
To learn more about the different types of rules and how to write them, please refer to the [Rule Language](./rules.md) chapter, which covers the different types of rules you can write with Invariant, and how to use them to secure your agentic systems.
183+
To learn more about the different types of rules and how to write them, please refer to the [Rule Language](./rules.md) chapter, which covers the different types of rules you can write with Invariant, and how to use them to secure your agentic systems.
184+
185+
## Next Steps
186+
187+
If you are interested in learning more about Guardrails, we recommend the following resources:
188+
189+
<div class='tiles'>
190+
191+
<a href="rules" class='tile primary'>
192+
<span class='tile-title'>Rule Language Reference →</span>
193+
<span class='tile-description'>Jump straight into the syntax and semantics of writing guardrailing rules.</span>
194+
</a>
195+
196+
<a href="tool-calls" class='tile primary'>
197+
<span class='tile-title'>Guard Tool Calls →</span>
198+
<span class='tile-description'>Constrain and validate the function/tool calls your agent can make.</span>
199+
</a>
200+
201+
<a href="dataflow-rules" class='tile primary'>
202+
<span class='tile-title'>Constrain Agent Dataflow →</span>
203+
<span class='tile-description'>Enforce security policies based on the flow of data through your agent.</span>
204+
</a>
205+
206+
<a href="prompt-injections" class='tile'>
207+
<span class='tile-title'>Prevent Prompt Injections →</span>
208+
<span class='tile-description'>Detect and block jailbreaks and malicious prompt behaviors.</span>
209+
</a>
210+
211+
<a href="moderation" class='tile'>
212+
<span class='tile-title'>Filter Toxic Content →</span>
213+
<span class='tile-description'>Apply moderation guardrails for unsafe or offensive outputs.</span>
214+
</a>
215+
216+
<a href="./gateway/" class='tile'>
217+
<span class='tile-title'>Deploy Rules with Gateway →</span>
218+
<span class='tile-description'>Use Invariant Gateway to enforce rules across your deployed agents.</span>
219+
</a>
220+
221+
<a href="./explorer/" class='tile'>
222+
<span class='tile-title'>Use Guardrails with Explorer →</span>
223+
<span class='tile-description'>Configure your guardrailing rules in Explorer, and visualize agent behavior.</span>
224+
</a>
225+
226+
</div>

docs/guardrails/logo.svg

Lines changed: 19 additions & 0 deletions
Loading

docs/index.md

Lines changed: 22 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ title: Invariant Agent Security
55
# Invariant Agent Security
66

77
<div class='subtitle'>
8-
Use Invariant Guardrails for high-precision agent security, monitoring and to ensure reliable and consistent behavior.
8+
High-precision guardrailing for agentic AI systems.
99
</div>
1010

1111
Invariant is a **security layer to protect agentic AI systems**. It helps you to prevent prompt injections, data leaks, steers your agent, and ensures strict compliance with behavioral and security policies for your AI systems.
@@ -234,33 +234,38 @@ You can click any of the boxes to learn more about the respective tool.
234234
<div class='tiles'>
235235
236236
<a href="gateway/" class='tile primary'>
237-
<span class='tile-title'>Gateway →</span>
238-
<span class='tile-description'>Setup the Invariant Gateway to trace and intercept LLM calls</span>
237+
<span class='tile-title'>Secure with Gateway →</span>
238+
<span class='tile-description'>Set up Invariant Gateway to intercept and control LLM calls from your agent.</span>
239239
</a>
240240
241241
<a href="explorer/" class='tile primary'>
242-
<span class='tile-title'>Observe and Debug →</span>
243-
<span class='tile-description'>Use Invariant Explorer to inspect and debug your AI agent traces</span>
242+
<span class='tile-title'>Inspect with Explorer →</span>
243+
<span class='tile-description'>Use Invariant Explorer to debug, visualize and annotate traces.</span>
244244
</a>
245245
246-
<a href="explorer/benchmarks" class='tile'>
247-
<span class='tile-title'>Benchmarks →</span>
248-
<span class='tile-description'>Submit your AI agent to the Invariant benchmark registry for comparison</span>
246+
<a href="guardrails/tool-calls" class='tile primary'>
247+
<span class='tile-title'>Guard Tool Calls →</span>
248+
<span class='tile-description'>Restrict and validate the tools and functions your agent can access.</span>
249249
</a>
250250
251-
<a href="testing/" class='tile primary'>
252-
<span class='tile-title'>Testing →</span>
253-
<span class='tile-description'>Use Invariant <code>testing</code> to build debuggable unit tests for your AI agents</span>
251+
<a href="guardrails/dataflow-rules" class='tile primary'>
252+
<span class='tile-title'>Enforce Dataflow Rules →</span>
253+
<span class='tile-description'>Ensure sensitive data doesn't leak through unintended channels.</span>
254254
</a>
255255
256-
<a href="explorer/api/trace-format" class='tile'>
257-
<span class='tile-title'>Trace Format →</span>
258-
<span class='tile-description'>Learn about the Invariant trace format and how to structure your traces for ingestion</span>
256+
<a href="guardrails/prompt-injections" class='tile'>
257+
<span class='tile-title'>Block Prompt Injections →</span>
258+
<span class='tile-description'>Prevent jailbreaks and malicious prompt manipulation.</span>
259+
</a>
260+
261+
<a href="guardrails/moderation" class='tile'>
262+
<span class='tile-title'>Filter Toxic Content →</span>
263+
<span class='tile-description'>Apply moderation filters for toxic or policy-violating output.</span>
259264
</a>
260265
261266
<a href="explorer/api/uploading-traces/push-api" class='tile'>
262-
<span class='tile-title'>Pushing Traces →</span>
263-
<span class='tile-description'>Learn about traces, datasets and annotations on Invariant.</span>
267+
<span class='tile-title'>Push Traces →</span>
268+
<span class='tile-description'>Programmatically upload traces and datasets to Explorer.</span>
264269
</a>
265270
266-
</div>
271+
</div>

0 commit comments

Comments
 (0)