Code block
Overview
A code block is formatted text within a container.

Status
- Figma library:
-
Ready - RH Elements:
-
Ready - WebRH:
-
Ready
Sample element
Demo
View a live version of this element to see how it can be customized.
<rh-code-block>
<script type="text/text">Error: Error creating network Load Balancer: AccessDenied: User:
arn:aws:sts::970xxxxxxxxx:assumed-role/ManagedOpenShift-Installer-Role/163xxxxxxxxxxxxxxxx is
not authorized to perform: iam:CreateServiceLinkedRole on resource:
arn:aws:iam::970xxxxxxxxx:role/aws-service-role/elasticloadbalancing.amazonaws.com/
AWSServiceRoleForElasticLoadBalancing</script>
</rh-code-block>
<script type="module">
import '@rhds/elements/rh-code-block/rh-code-block.js';
</script>
When to use
- When you need to highlight a block of code while maintaining the formatting
Status checklist
Property | Status | Meaning |
---|---|---|
Figma library |
|
Component is available in the Figma library |
RH Elements |
|
Component is available in the RH Elements repo |
WebRH |
|
Component is available in the WebRH repo |
Other libraries
To learn more about our other libraries, visit this page.
Feedback
To give feedback about anything on this page, contact us.