Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jetstream theme support #158

Draft
wants to merge 8 commits into
base: master
Choose a base branch
from
Draft

Conversation

fajar-apri-alaska
Copy link

@fajar-apri-alaska fajar-apri-alaska commented May 20, 2024

Alaska Airlines Pull Request

Please include a summary of the change and which issue is fixed. Please also include relevant motivation and context. List any dependencies that are required for this change.

Resolves: #152 #164

Summary:

Type of change:

Please delete options that are not relevant.

  • New capability
  • Revision of an existing capability
  • Infrastructure change (automation, etc.)
  • Other (please elaborate)

Checklist:

  • My update follows the CONTRIBUTING guidelines of this project
  • I have performed a self-review of my own update

By submitting this Pull Request, I confirm that my contribution is made under the terms of the Apache 2.0 license.

Pull Requests will be evaluated by their quality of update and whether it is consistent with the goals and values of this project. Any submission is to be considered a conversation between the submitter and the maintainers of this project and may require changes to your submission.

Thank you for your submission!

-- Auro Design System Team

@fajar-apri-alaska fajar-apri-alaska self-assigned this May 20, 2024
@fajar-apri-alaska fajar-apri-alaska requested a review from a team as a code owner May 20, 2024 09:20
Copy link
Author

@fajar-apri-alaska fajar-apri-alaska left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All value changes / addition in this PR also needs testing/validation from GD.
Utilizing https://jetstream-rouge.vercel.app/ with hardcoded build files is a way for testing.

@blackfalcon blackfalcon linked an issue May 20, 2024 that may be closed by this pull request
@blackfalcon blackfalcon changed the title Jetstream theme support BLOCKED: Jetstream theme support May 20, 2024
@blackfalcon blackfalcon marked this pull request as draft May 20, 2024 23:57
@braven112 braven112 changed the title BLOCKED: Jetstream theme support Jetstream theme support May 28, 2024
@fajar-apri-alaska fajar-apri-alaska force-pushed the fajarapri/jetstreamTheme branch 2 times, most recently from 4f81d4d to 37b42d8 Compare May 31, 2024 09:31
@fajar-apri-alaska fajar-apri-alaska marked this pull request as ready for review May 31, 2024 09:35
@fajar-apri-alaska fajar-apri-alaska marked this pull request as draft June 4, 2024 12:19
@fajar-apri-alaska fajar-apri-alaska marked this pull request as ready for review June 6, 2024 03:17
@braven112
Copy link
Member

@fajar-apri-alaska For #164 we'll also need the same CSS file configurations for the Excursion theme so it also has CSS output like Jetstream.

@fajar-apri-alaska
Copy link
Author

@fajar-apri-alaska For #164 we'll also need the same CSS file configurations for the Excursion theme so it also has CSS output like Jetstream.

I see, then I will provide the same for Excursion theme.

scripts/config-excursion.json Show resolved Hide resolved
scripts/config-jetstream-darkmode.json Show resolved Hide resolved
@@ -0,0 +1,56 @@
{
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It appears that the Tier2 tokens here were based on the old version of the AuroDesignTokens. While jetstream may have unique brand and base color tokens, the rest of the tokens "must" match the tokens that are currently released in the repo. I can tell that they currently do not because --ds-color-alert... tokens were all deprecated in a recent release.

Please let me know if you need further clarification on what this means for the requested change.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I see, thanks for letting me know, I will ask some help from the Jetstream's GD to adjust this.
Will come back to talk to you later.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think I wasn't clear here @fajar-apri-alaska all of these files with Tier 2 tokens (everything except brand.json and base.json) appear to be outdated, not just the alert file.

Copy link
Author

@fajar-apri-alaska fajar-apri-alaska Jun 13, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, I got your point on the first time, but I couldn't reach Andri (yet) as it seems He's on leave.
So I tried to double check the json again myself, with the document that He gave. In the end, maybe He is the one who can confirm if the value is still okay or some value needs to be updated. I will try to reach Him again today.

@fajar-apri-alaska fajar-apri-alaska marked this pull request as draft June 12, 2024 05:15
@fajar-apri-alaska fajar-apri-alaska force-pushed the fajarapri/jetstreamTheme branch from 703330b to bf69d66 Compare June 12, 2024 14:26
@fajar-apri-alaska fajar-apri-alaska marked this pull request as ready for review June 12, 2024 14:27
@jason-capsule42 jason-capsule42 linked an issue Jun 12, 2024 that may be closed by this pull request
scripts/config-jetstream-darkmode.json Show resolved Hide resolved
@@ -0,0 +1,56 @@
{
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think I wasn't clear here @fajar-apri-alaska all of these files with Tier 2 tokens (everything except brand.json and base.json) appear to be outdated, not just the alert file.

- generate json flat & nested theme files for jetstream theme
- css value taken from
Alaska-ITS/JetstreamDesignTokens#5
with some modification needed
- added "jetstream" base color
- update "color.base" to "color.jetstream" prefix value in jetstream theme

Changes to be committed:
	new file:   scripts/config-jetstream-darkmode.json
	new file:   scripts/config-jetstream.json
	modified:   scripts/styleDictionary.js
	new file:   src/themes/jetstream/color-darkmode/alert.json
	new file:   src/themes/jetstream/color-darkmode/background.json
	new file:   src/themes/jetstream/color-darkmode/base.json
	new file:   src/themes/jetstream/color-darkmode/border.json
	new file:   src/themes/jetstream/color-darkmode/brand.json
	new file:   src/themes/jetstream/color-darkmode/elevation.json
	new file:   src/themes/jetstream/color-darkmode/icon.json
	new file:   src/themes/jetstream/color-darkmode/text.json
	new file:   src/themes/jetstream/color-darkmode/tier.json
	new file:   src/themes/jetstream/color-darkmode/ui.json
	new file:   src/themes/jetstream/color/alert.json
	new file:   src/themes/jetstream/color/background.json
	new file:   src/themes/jetstream/color/base.json
	new file:   src/themes/jetstream/color/border.json
	new file:   src/themes/jetstream/color/brand.json
	new file:   src/themes/jetstream/color/elevation.json
	new file:   src/themes/jetstream/color/icon.json
	new file:   src/themes/jetstream/color/text.json
	new file:   src/themes/jetstream/color/tier.json
	new file:   src/themes/jetstream/color/ui.json
	new file:   src/themes/jetstream/grid-breakpoint.json
	new file:   src/themes/jetstream/text.json
Changes to be committed:
	modified:   scripts/config-jetstream-darkmode.json
	modified:   scripts/config-jetstream.json
	modified:   src/themes/jetstream/color/base.json
	modified:   src/themes/jetstream/color/brand.json
	modified:   src/themes/jetstream/color/text.json
	modified:   src/themes/jetstream/color/tier.json
	new file:   src/themes/jetstream/comments.json
- add configuration css for jetstream
- add configuration css for jetstream darkmode

Changes to be committed:
	modified:   scripts/config-jetstream-darkmode.json
	modified:   scripts/config-jetstream.json
- Add configuration scripts for excursion theme
to generate css & scss files.

Changes to be committed:
	modified:   scripts/config-excursion.json
- Remove unused platform from jetstream and excursion
theme config file, leaving only css platform for jetstream,
and also with json format for excursion.

Changes to be committed:
	modified:   scripts/config-excursion.json
	modified:   scripts/config-jetstream-darkmode.json
	modified:   scripts/config-jetstream.json
@fajar-apri-alaska fajar-apri-alaska force-pushed the fajarapri/jetstreamTheme branch from bf69d66 to bca8ac9 Compare July 2, 2024 05:30
@fajar-apri-alaska fajar-apri-alaska marked this pull request as draft July 2, 2024 05:31
@fajar-apri-alaska
Copy link
Author

Moving this to DRAFT for now, until values are updated and validated.

- update config file for jetstream theme
- remove unused tokens
- update some tokens value per document

Changes to be committed:
	modified:   scripts/config-jetstream-darkmode.json
	modified:   scripts/config-jetstream.json
	renamed:    src/themes/excursion/depth copy.json -> src/themes/excursion/depth.json
	modified:   src/themes/jetstream/color-darkmode/alert.json
	modified:   src/themes/jetstream/color-darkmode/background.json
	modified:   src/themes/jetstream/color-darkmode/base.json
	modified:   src/themes/jetstream/color-darkmode/border.json
	modified:   src/themes/jetstream/color-darkmode/brand.json
	modified:   src/themes/jetstream/color-darkmode/icon.json
	modified:   src/themes/jetstream/color-darkmode/text.json
	modified:   src/themes/jetstream/color-darkmode/ui.json
	modified:   src/themes/jetstream/color/alert.json
	modified:   src/themes/jetstream/color/background.json
	modified:   src/themes/jetstream/color/base.json
	modified:   src/themes/jetstream/color/brand.json
	modified:   src/themes/jetstream/color/text.json
	modified:   src/themes/jetstream/color/tier.json
	modified:   src/themes/jetstream/color/ui.json
	modified:   src/themes/jetstream/text.json
@jason-capsule42 jason-capsule42 force-pushed the fajarapri/jetstreamTheme branch from bca8ac9 to c274429 Compare July 4, 2024 15:49
@jason-capsule42
Copy link
Member

This worked is currently blocked as we await guidance from Andri. Meeting is scheduled to unblock this work on July 5th.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Auro design tokens: Excursion/Jetstream CSS Auro design tokens: Jetstream Theme
3 participants