New AWS UI Theme Proposal

[bandinib-amzn]

Is your feature request related to a problem? Please describe.

I'd like to create a new theme to align with the AWS theme, aiming to build intuitive, inclusive, and meaningful AWS experiences at scale.

To quickly align the look and feel of OpenSearch-Dashboards with the AWS theme, we can modify the Sass variable listed in issue #1217.

[seraphjiang]

Awesome.
Could we start by working with the UX team to evaluate the effort required to support e.g. https://cloudscape.aws.dev/foundation/visual-foundation/colors

@kgcreative

[kgcreative]

Should this be an official OUI theme, or should we use this as an opportuity to explore a "Create your own theme" advanced setting option so others may benefit from additional custom branding options?

[bandinib-amzn]

Awesome. Could we start by working with the UX team to evaluate the effort required to support e.g. https://cloudscape.aws.dev/foundation/visual-foundation/colors

@kgcreative

Let's use #1217 to track sass variable value changes for new theme.

[BSFishy]

Should this be an official OUI theme, or should we use this as an opportuity to explore a "Create your own theme" advanced setting option so others may benefit from additional custom branding options?

I would love to use this as an opportunity to explore custom theming. I feel like @AMoo-Miki's preliminary work of moving a few variables to CSS variables gives us a good idea on how we could do it.

However, as a user, that experience may be a little strange, if the AWS theme isn't build into the system. As a user, I would expect a full theme, like the AWS theme should be, to be integrated in the system, and not just a top-level override.

But I think this also raises the question of whether this theme should exist in the upstream OUI repo. This feels like something specific to AOS. As a consumer, I would want an OpenSearch branded theme, a neutral theme, or a custom theme. I feel like if this is something that is targeted specifically towards AOS, then it shouldn't exist in upstream OUI.

[kgcreative]

@BSFishy -- that was my sense as well. I like the simple way that slack does theming, so we could have a "custom" option that exposes the named variables, which, if we use css vars, we could hot reload easily (although this would require a fairly significant rewrite of all our components to replace SASS vars with CSS vars, but, to be honest, this is probably needed)

That would mean that any user could define a custom theme, and any dashboards admin could set a theme in advanced settings

[kgcreative]

As a consumer, I would want an OpenSearch branded theme, a neutral theme, or a custom theme. I feel like if this is something that is targeted specifically towards AOS, then it shouldn't exist in upstream OUI.

Speaking specifically to this, I would love to hear from folks like Logz.io, Bitergia, etc on how they would prefer that custom theming be made available for them. This could be done as a set of overrides in opensearch dashboards.yml, for example, with an option to "name" the custom theme, and that would make it available (and potentially default) as the theme available in advanced settings.

[BSFishy]

This could be done as a set of overrides in opensearch dashboards.yml, for example, with an option to "name" the custom theme, and that would make it available (and potentially default) as the theme available in advanced settings.

You know, I hadn't thought about having a theme defined in this way, but I really like it! I was mainly imagining having an advanced settings section where the different themeable variables are settings, but that way enables any instance admin to add their own branded theme and integrate it in the system as if its built in with little to no effort.

I've discussed with a few people on how to get custom themes on their instance, and sadly had to point them to the OUI docs on that and basically say "you gotta make your own custom build of OSD", but this, in my eyes, is a best of both worlds

[kgcreative]

In an ideal world, a custom theme could be a saved object. that would allow you to add, edit, rename, add descriptions to it, import/export, potentially even attach an image to it, etc, but that could be an eventual incremental. I like the config option since that makes it feel like it's integrated