Add SVG logo spinner #387

kgcreative · 2021-05-27T23:26:27Z

Signed-off-by: kgcreative kvngar@amazon.com

Description

Add SVG logo spinner, remove horizontal loader.

Before

After

Update primary dashboards card to use primary brand color.

Before

After

Issues Resolved

Fix OpenSearch mark loading spinner line item on [Branding] OpenSearch Dashboards Branding #372,
Change color on Primary "OpenSearch Dashboards" card in the main home landing page on [Branding] OpenSearch Dashboards Branding #372

Check List

New functionality includes testing.
- All tests pass
New functionality has been documented.
- New functionality has javadoc added
Commits are signed per the DCO using --signoff

Signed-off-by: kgcreative <kvngar@amazon.com>

opensearch-ci-bot · 2021-05-27T23:27:59Z

✅ DCO Check Passed 6f5a26f

… landing page Signed-off-by: kgcreative <kvngar@amazon.com>

opensearch-ci-bot · 2021-05-27T23:42:00Z

✅ DCO Check Passed 0c29305

tmarkley · 2021-05-28T20:44:26Z

Hey Kevin, did you run tests as described in the README?

Signed-off-by: kgcreative <kvngar@amazon.com>

kgcreative · 2021-05-28T21:25:19Z

Hey Kevin, did you run tests as described in the README?

All tests pass. Updated two snapshots.

opensearch-ci-bot · 2021-05-28T21:25:55Z

✅ DCO Check Passed 927568d

tmarkley · 2021-05-28T22:07:44Z

Great! Can you also add some screenshots just for reference?

kgcreative · 2021-05-28T22:52:48Z

Great! Can you also add some screenshots just for reference?

Done and done! updated original PR with before/after screenshots.

mihirsoni

LGTM !! Thanks for making changes Kevin.

kavilla · 2021-05-30T09:39:44Z

@kgcreative looks great! Thanks!

Ran the functional tests and they all pass just so you know!

For the card do we think we can update it to look better in dark mode or did we just want to leave it since it already was hard to read in the previous view, it looks like this:

Previous had the same dark text but maybe a little bit easier to read since a vibrant green color against with black text (but still looked compared to white text).

In terms on the actual SVG, do you know if we have a polyfill for animateTransform somewhere hidden? Our is there specific documentation that calls out what browsers are supported for OpenSearch Dashboards? I'm not able to find it, as far as I am aware the source of the fork fully supported IE11 from a forum in 2018. But looking at the MDN web docs it looks like it isn't supported in IE11 [link to doc]

Pretty weird but I pulled this down and ran the unit tests (even with the snapshot) and the unit tests keep failing with a date mismatch. So I ran on them on a pipeline and they passed, then I ran the main repo's main branch multiple times but that passes for me. It just keeps failing on the unit tests when I try your branch locally, even if I clear my node modules, which is weird. Could someone else give this a run as well locally? If another person's unit tests pass then I'm okay with merging.

Thanks!

kavilla

Even though I left a comment if I want to mark this review with "With Comments" github requires me to enter a comment with the popup while responding to the review 😤.

kgcreative · 2021-05-30T17:07:47Z

Thanks @kavilla - Re: Browser support, as of 7.9, kibana (and EUI) no longer supports IE11. See this matrix: https://www.elastic.co/support/matrix#matrix_browsers - With that in mind, do we need to revisit or create a browser support list for OpenSearch Dshboards 1.0?

Re: Dark mode, let me dig into the CSS a bit and see what I can do - perhaps that might need to be a follow-up issue.

How did you trigger dark mode? Switch via the OS? (I just want to make sure I can reproduce and test visually locally)

kgcreative · 2021-05-30T17:17:53Z

(even with the snapshot) and the unit tests keep failing with a date mismatch.

The weird thing is the date mismatch was happening on a component I didn't even touch. I'm wondering if something else is going on with that

kavilla · 2021-05-30T21:04:23Z

With that in mind, do we need to revisit or create a browser support list for OpenSearch Dshboards 1.0?

Thanks! Yeah I think its worth it I think. Created an issue in the docs repo: opensearch-project/documentation-website#38

How did you trigger dark mode? Switch via the OS? (I just want to make sure I can reproduce and test visually locally)

Just go to Stack Management --> Advanced Settings --> Search for Dark Mode

The weird thing is the date mismatch was happening on a component I didn't even touch. I'm wondering if something else is going on with that

Might be local setup thing. If someone else pulls this down and it passes with your commit then I'm fine with just merging and looking deeper post merge.

tmarkley · 2021-06-02T16:00:46Z

I pulled this PR down, ran yarn osd clean and yarn osd bootstrap, and then ran unit tests. Those two snapshot tests also failed for me due to a date mismatch.

kavilla · 2021-06-02T21:39:34Z

I pulled this PR down, ran yarn osd clean and yarn osd bootstrap, and then ran unit tests. Those two snapshot tests also failed for me due to a date mismatch.

@kgcreative since this is the case, did we want to revert the updating snapshot commit. Also curious how your local setup.

kgcreative · 2021-06-02T21:43:57Z

I pulled this PR down, ran yarn osd clean and yarn osd bootstrap, and then ran unit tests. Those two snapshot tests also failed for me due to a date mismatch.

@kgcreative since this is the case, did we want to revert the updating snapshot commit. Also curious how your local setup.

Yeah, i can revert the snapshot update commit and see if that helps. For my local setup, I followed the developer guide verbatim. Is there anything I can provide you that might help troubleshoot if it's a local build issue?

This reverts commit 927568d. Signed-off-by: kgcreative <kvngar@amazon.com>

opensearch-ci-bot · 2021-06-02T21:55:58Z

✅ DCO Check Passed 74ae8fa

kgcreative · 2021-06-02T22:06:02Z

@kavilla - After reverting the snapshot update, i'm getting a date mismatch on my jest test suite (There seems to be a 1 day date mismatch on two VegaVisualization snapshot tests, and I'm seeing the following message along with it: ● VegaVisualizations › VegaVisualization - basics › should show vegalite graph and update on resize (may fail in dev env) - With that in mind, i'm tempted to leave that one alone on my end.

…ontrast Signed-off-by: kgcreative <kvngar@amazon.com>

kgcreative · 2021-06-02T23:35:19Z

@kavilla - I updated the CSS color reference in the card to use the primary color token so the Dark Mode contrast is a bit better:

opensearch-ci-bot · 2021-06-02T23:35:58Z

✅ DCO Check Passed 1497154

kavilla · 2021-06-03T18:34:41Z

@kavilla - After reverting the snapshot update, i'm getting a date mismatch on my jest test suite (There seems to be a 1 day date mismatch on two VegaVisualization snapshot tests, and I'm seeing the following message along with it: ● VegaVisualizations › VegaVisualization - basics › should show vegalite graph and update on resize (may fail in dev env) - With that in mind, i'm tempted to leave that one alone on my end.

Yeah I pull everything down so I can run it to verify, and we can potentially create an issue to figure out if we can recreate on other machines.

kavilla · 2021-06-03T18:35:12Z

@kavilla - I updated the CSS color reference in the card to use the primary color token so the Dark Mode contrast is a bit better:

Looks really good thank you so much!

kavilla

linter, unit tests, integ test, and functional tests all good. looks really slick too! thank you

* Add SVG logo spinner, remove horizontal loader * Change color on Primary "OpenSearch Dashboards" card in the main home landing page * replace hardcoded CSS value with token so dark mode card has enough contrast Signed-off-by: kgcreative <kvngar@amazon.com>

Add SVG logo spinner, remove horizontal loader

6f5a26f

Signed-off-by: kgcreative <kvngar@amazon.com>

kgcreative mentioned this pull request May 27, 2021

Add loading spinner SVG #386

Closed

5 tasks

Change color on Primary "OpenSearch Dashboards" card in the main home…

0c29305

… landing page Signed-off-by: kgcreative <kvngar@amazon.com>

update snapshot

927568d

Signed-off-by: kgcreative <kvngar@amazon.com>

mihirsoni previously approved these changes May 30, 2021

View reviewed changes

kavilla self-requested a review May 30, 2021 09:40

kavilla reviewed May 30, 2021

View reviewed changes

kavilla mentioned this pull request May 30, 2021

[PROPOSAL] Browser support matrix opensearch-project/documentation-website#38

Closed

tmarkley added the branding label Jun 2, 2021

Revert "update snapshot"

74ae8fa

This reverts commit 927568d. Signed-off-by: kgcreative <kvngar@amazon.com>

kgcreative dismissed mihirsoni’s stale review via 74ae8fa June 2, 2021 21:54

replace hardcoded CSS value with token so dark mode card has enough c…

1497154

…ontrast Signed-off-by: kgcreative <kvngar@amazon.com>

kgcreative requested review from kavilla and mihirsoni June 3, 2021 18:46

kavilla approved these changes Jun 3, 2021

View reviewed changes

boktorbb self-requested a review June 3, 2021 20:06

tmarkley approved these changes Jun 3, 2021

View reviewed changes

kavilla merged commit f36a50c into opensearch-project:main Jun 3, 2021

KrooshalUX mentioned this pull request Feb 28, 2023

Create component OuiLoadingDashboards opensearch-project/oui#265

Closed

2 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add SVG logo spinner #387

Add SVG logo spinner #387

kgcreative commented May 27, 2021 •

edited

Loading

opensearch-ci-bot commented May 27, 2021

opensearch-ci-bot commented May 27, 2021

tmarkley commented May 28, 2021

kgcreative commented May 28, 2021 •

edited

Loading

opensearch-ci-bot commented May 28, 2021

tmarkley commented May 28, 2021

kgcreative commented May 28, 2021

mihirsoni left a comment

kavilla commented May 30, 2021 •

edited

Loading

kavilla left a comment •

edited

Loading

kgcreative commented May 30, 2021

kgcreative commented May 30, 2021

kavilla commented May 30, 2021 •

edited

Loading

tmarkley commented Jun 2, 2021

kavilla commented Jun 2, 2021

kgcreative commented Jun 2, 2021

opensearch-ci-bot commented Jun 2, 2021

kgcreative commented Jun 2, 2021

kgcreative commented Jun 2, 2021

opensearch-ci-bot commented Jun 2, 2021

kavilla commented Jun 3, 2021

kavilla commented Jun 3, 2021

kavilla left a comment

Add SVG logo spinner #387

Add SVG logo spinner #387

Conversation

kgcreative commented May 27, 2021 • edited Loading

Description

Before

After

Before

After

Issues Resolved

Check List

opensearch-ci-bot commented May 27, 2021

opensearch-ci-bot commented May 27, 2021

tmarkley commented May 28, 2021

kgcreative commented May 28, 2021 • edited Loading

opensearch-ci-bot commented May 28, 2021

tmarkley commented May 28, 2021

kgcreative commented May 28, 2021

mihirsoni left a comment

Choose a reason for hiding this comment

kavilla commented May 30, 2021 • edited Loading

kavilla left a comment • edited Loading

Choose a reason for hiding this comment

kgcreative commented May 30, 2021

kgcreative commented May 30, 2021

kavilla commented May 30, 2021 • edited Loading

tmarkley commented Jun 2, 2021

kavilla commented Jun 2, 2021

kgcreative commented Jun 2, 2021

opensearch-ci-bot commented Jun 2, 2021

kgcreative commented Jun 2, 2021

kgcreative commented Jun 2, 2021

opensearch-ci-bot commented Jun 2, 2021

kavilla commented Jun 3, 2021

kavilla commented Jun 3, 2021

kavilla left a comment

Choose a reason for hiding this comment

kgcreative commented May 27, 2021 •

edited

Loading

kgcreative commented May 28, 2021 •

edited

Loading

kavilla commented May 30, 2021 •

edited

Loading

kavilla left a comment •

edited

Loading

kavilla commented May 30, 2021 •

edited

Loading