x
1
2
3
<div class="lui-app_logo"> <img class="lui-app_logo_image" src="/assets/app_logos/logo_core_expanded-a6a2e4d9.svg" /></div>AppLogo
Description
Related components
| Used Components | Components where is Used |
|---|---|
| Label |
Usage rules
- ✅ Do
- ❌ Don't
1
<%= render LooposUi::AppLogo.new(**preview_params) %>No notes provided.
| Param | Description | Input |
|---|---|---|
|
— |
|
|
|
— |
|
AppLogo Component
AppLogo is a component that displays application-specific logos for different LoopOS applications. It supports both standard and expanded logo variants and automatically selects the appropriate logo file based on the application type.
Arguments
| Property | Type | Default | Required | Description |
|---|---|---|---|---|
app |
Symbol | - | ✓ | The application type to display logo for |
expanded |
Boolean | false |
✗ | Whether to show the expanded version of logo |
App Types
The app argument accepts one of the following symbols:
:manager- Displays the main LoopOS logo:core- Core application logo:submission- Submission application logo:validation- Validation application logo:handling- Handling application logo:hubs- Hubs application logo
Expanded Variant
When expanded is set to true, the component will display the expanded version of the logo (suffixed with _expanded.svg). When false (default), it displays the standard logo (suffixed with .svg).
Usage Examples
<!-- Standard LoopOS logo --><%= render LooposUi::AppLogo.new(app: :manager) %><!-- Expanded LoopOS logo --><%= render LooposUi::AppLogo.new(app: :manager, expanded: true) %><!-- Core application logo --><%= render LooposUi::AppLogo.new(app: :core) %><!-- Submission application expanded logo --><%= render LooposUi::AppLogo.new(app: :submission, expanded: true) %>File Structure
The component expects logo files to be located in the app_logos/ directory with the following naming convention:
- Standard logos:
logo_{app_name}.svg - Expanded logos:
logo_{app_name}_expanded.svg - Special case:
:managerapp useslogo_loopos.svgandlogo_loopos_expanded.svg