General
Template
Layout
Typography
Navigational
Informational
- Info Boxes
- Output Boxes
-
Code Boxes
- Cards
Data
Input
Images
Header
Footer
Components
Components - Output Containers
Output boxes to display output results
Output Containers
Simple output Containers
Just a simple container with a box. With required margins and padding added by default.
Implementation Code and the output
<body class="neon-ui">
<div class="output-container">
<i class="ph-bold ph-info"></i>
Sample output content
</div>
</body>
Copy
Sample output content
Implementation Code and the output
If a list is to be shown in an output container, following is the implementation code and the sample output.
<body class="neon-ui">
<div class="output-container">
<ol class="list-nums">
<li>list-topics: Open the terminal</li>
<li>list-topics: Enter the following command</li>
<li>list-topics: Close the terminal</li>
<li>list-topics: Close the system</li>
</ol>
</div>
</body>
Copy
- list-topics: Open the terminal
- list-topics: Enter the following command
- list-topics: Close the terminal
- list-topics: Close the system