Skip to content

Commit df01baf

Browse files
committed
Add the ability to specify a second custom logo for PatternFly 6
1 parent 2890ccc commit df01baf

File tree

1 file changed

+147
-0
lines changed

1 file changed

+147
-0
lines changed
Lines changed: 147 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,147 @@
1+
---
2+
title: custom-logos
3+
authors:
4+
- "@cajieh"
5+
reviewers:
6+
- "@jhadvig "
7+
- "@spadgett"
8+
- "@everettraven"
9+
- "@JoelSpeed"
10+
approvers:
11+
- "@spadgett"
12+
api-approvers:
13+
- "@JoelSpeed"
14+
creation-date: 2025-02-11
15+
last-updated: 2025-02-11
16+
---
17+
18+
# Custom Logos
19+
20+
## Summary
21+
22+
The OpenShift Container Platform (OCP) web console is currently being upgraded to PatternFly 6. In PatternFly 6, the masthead color changes based on the mode (light or dark). Consequently, a single custom logo may not be suitable for both theme modes.
23+
24+
Add the ability to specify custom logos to support light and dark theme modes for the masthead and favicon.
25+
26+
## Background info
27+
28+
The OpenShift Container Platform (OCP) web console is currently being upgraded to PatternFly 6. In PatternFly 6, the masthead color changes based on the mode (light or dark). Consequently, a single custom logo may not be suitable for both modes.
29+
30+
To address this, we need to allow users to add custom logos for both the masthead and favicon that are compatible with light and dark themes. This ensures that the logos are always visible and aesthetically pleasing, regardless of the theme mode.
31+
32+
The custom logos feature will enable users to specify different logos for the masthead and favicon based on the theme mode. This will involve exposing a new API endpoint to support custom logos for both light and dark themes.
33+
34+
## Motivation
35+
36+
The OpenShift Container Platform (OCP) web console is currently being upgraded to PatternFly 6. In PatternFly 6, the masthead color changes based on the mode (light or dark). Consequently, a single custom logo may not be suitable for both theme modes. This is evident with the existing OKD and OpenShift logos, which assume a dark masthead background and include white text.
37+
38+
### User Stories
39+
40+
* As an OpenShift web console user, I want to be able to add custom logos for light and dark theme modes in the masthead and favicon.
41+
42+
### Goals
43+
44+
This feature should allow users to add custom logos for the masthead and favicon that are compatible with both light and dark theme modes in the OpenShift web console.
45+
46+
### Non-Goals
47+
48+
49+
## Proposal
50+
51+
### Workflow Description
52+
53+
├── spec
54+
│ ├── customization
55+
│ ├── customLogos
56+
│ ├── type
57+
│ ├── themes
58+
│ ├── type
59+
│ ├── file
60+
│ ├── key
61+
│ ├── name
62+
└── ...
63+
64+
### Risks and Mitigations
65+
66+
1. Users could set both the `CustomLogoFile` and `CustomLogos` APIs. The `CustomLogos` API configuration will take precedence over the old `CustomLogoFile` field.
67+
68+
2. If only the dark or light theme is specified, the default OCP logo will be used for the unspecified theme.
69+
70+
3. Handling different custom logos for light and dark themes may increase the complexity of the backend and UI logic. Tests are added to validate the new logic and a fallback is implemented to default to the OCP logo if any theme is missing.
71+
72+
4. Users might experience confusion with the introduction of new logo configuration options, especially if they are familiar with the old method, which may soon be deprecated. Provide a comprehensive documentation and tools that guide users through the transition. Include clear instructions about the changes and their benefits.
73+
74+
75+
### Drawbacks
76+
77+
N/A
78+
79+
## API Design Details
80+
81+
The configuration for custom logos will include support for both masthead and favicon types, with separate files for light and dark themes:
82+
83+
```yaml
84+
customLogos:
85+
- type: Masthead
86+
themes:
87+
- type: Light
88+
file:
89+
key: logo-light.svg
90+
name: masthead-logo-light
91+
- type: Dark
92+
file:
93+
key: logo-dark.svg
94+
name: masthead-logo-dark
95+
- type: Favicon
96+
themes:
97+
- type: Light
98+
file:
99+
key: favicon-light.ico
100+
name: favicon-logo-light
101+
- type: Dark
102+
file:
103+
key: favicon-dark.ico
104+
name: favicon-logo-dark
105+
```
106+
107+
### Attributes Description
108+
109+
#### customLogos
110+
- `type`: Enumerate which specifies the type of custom logo. Available custom logo types are `Masthead` and `Favicon`.
111+
- `themes`: A list of themes for which the custom logo is defined.
112+
113+
#### themes
114+
- `type`: Enumerate which specifies the type of theme. Available theme types are `Light`, `Dark` and `Default`.
115+
- `file`: Contains the file details for the custom logo.
116+
117+
#### file
118+
- `key`: The key or path to the custom logo file.
119+
- `name`: The name of the ConfigMap containing the custom logo file.
120+
121+
### Test Plan
122+
123+
### Graduation Criteria
124+
125+
N/A
126+
127+
128+
#### Dev Preview -> Tech Preview
129+
130+
N/A
131+
132+
#### Tech Preview -> GA
133+
134+
N/A
135+
136+
#### Removing a deprecated feature
137+
138+
The current custom logo feature is deprecated and will be removed at some point in the future. Users are encouraged to transition to the new custom logos configuration that supports light and dark theme modes for the masthead and favicon. The new custom logos feature also includes support for a default theme for all unspecified themes.
139+
140+
N/A
141+
142+
#### Failure Modes
143+
144+
N/A
145+
146+
## Alternatives
147+

0 commit comments

Comments
 (0)