Code

Renders its slotted content as a styled inline <code> element in a brand, info or success color.

Code

Framework

HTML

React

Angular

Brand

brand colored code

Toggle dark mode

<certara-code color="brand">brand colored code</certara-code>

import { CertaraCode } from '@certara/certara-ui-react';

<CertaraCode color="brand">brand colored code</CertaraCode>

// In your module (e.g., app.module.ts)
import { CertaraUiAngularModule } from '@certara/certara-ui-angular';

@NgModule({
  imports: [CertaraUiAngularModule]
})

// In your template:
<certara-code color="brand">brand colored code</certara-code>

Info

info colored code

Toggle dark mode

<certara-code color="info">info colored code</certara-code>

import { CertaraCode } from '@certara/certara-ui-react';

<CertaraCode color="info">info colored code</CertaraCode>

// In your module (e.g., app.module.ts)
import { CertaraUiAngularModule } from '@certara/certara-ui-angular';

@NgModule({
  imports: [CertaraUiAngularModule]
})

// In your template:
<certara-code color="info">info colored code</certara-code>

Success

success colored code

Toggle dark mode

<certara-code color="success">success colored code</certara-code>

import { CertaraCode } from '@certara/certara-ui-react';

<CertaraCode color="success">success colored code</CertaraCode>

// In your module (e.g., app.module.ts)
import { CertaraUiAngularModule } from '@certara/certara-ui-angular';

@NgModule({
  imports: [CertaraUiAngularModule]
})

// In your template:
<certara-code color="success">success colored code</certara-code>

certara-code

Properties

color

Attribute	color
Type	"brand" | "info" | "success"
Default	'brand'
Required	false
Description

Events

There are no events available for this component

Methods

There are no public methods available for this component

Slots

There are no slots available for this component