Skip to content

Update Kibana overview graphics#79534

Merged
cqliu1 merged 1 commit intoelastic:kibana-overviewfrom
ryankeairns:rk/kibana-overview-graphics
Oct 5, 2020
Merged

Update Kibana overview graphics#79534
cqliu1 merged 1 commit intoelastic:kibana-overviewfrom
ryankeairns:rk/kibana-overview-graphics

Conversation

@ryankeairns
Copy link
Contributor

@ryankeairns ryankeairns commented Oct 5, 2020

Summary

In response to feedback in the parent PR, this set of changes converts PNGs to SVGs and uses actual chart colors.

Screeshots

No data (light)

Screen Shot 2020-10-05 at 1 09 50 PM

Has data (light)

Screen Shot 2020-10-05 at 12 51 03 PM

No data (dark)

Screen Shot 2020-10-05 at 1 10 25 PM

Has data (dark)

Screen Shot 2020-10-05 at 12 51 43 PM

@ryankeairns ryankeairns requested a review from cqliu1 October 5, 2020 18:22
@cqliu1 cqliu1 merged commit 49b7d56 into elastic:kibana-overview Oct 5, 2020
@ryankeairns ryankeairns mentioned this pull request Oct 5, 2020
Merged
7 tasks
@kibanamachine
Copy link
Contributor

kibanamachine commented Oct 5, 2020 •
edited
Loading

💔 Build Failed

Failed CI Steps

Test Failures

Jest Tests.src/plugins/kibana_overview/public/components/getting_started.GettingStarted render

Link to Jenkins

Standard Out

Failed Tests Reporter:
  - Test has not failed recently on tracked branches

Stack Trace

Error: expect(received).toMatchSnapshot()

Snapshot name: `GettingStarted render 1`

- Snapshot  - 1
+ Received  + 1

@@ -183,10 +183,10 @@
      <EuiFlexItem
        className="kbnOverviewGettingStarted__graphic"
      >
        <EuiImage
          alt="Kibana visualizations illustration"
-         url="/plugins/kibanaOverview/assets/kibana_montage_light_2x.png"
+         url="/plugins/kibanaOverview/assets/kibana_montage_light.svg"
        />
      </EuiFlexItem>
    </EuiFlexGroup>
  </section>
    at Object.test (/dev/shm/workspace/parallel/5/kibana/src/plugins/kibana_overview/public/components/getting_started/getting_started.test.tsx:110:23)
    at Object.asyncJestTest (/dev/shm/workspace/kibana/node_modules/jest-jasmine2/build/jasmineAsyncInstall.js:106:37)
    at resolve (/dev/shm/workspace/kibana/node_modules/jest-jasmine2/build/queueRunner.js:45:12)
    at new Promise (<anonymous>)
    at mapper (/dev/shm/workspace/kibana/node_modules/jest-jasmine2/build/queueRunner.js:28:19)
    at promise.then (/dev/shm/workspace/kibana/node_modules/jest-jasmine2/build/queueRunner.js:75:41)
    at process._tickCallback (internal/process/next_tick.js:68:7)
Jest Tests.src/plugins/kibana_overview/public/components/getting_started.GettingStarted dark mode on

Link to Jenkins

Standard Out

Failed Tests Reporter:
  - Test has not failed recently on tracked branches

Stack Trace

Error: expect(received).toMatchSnapshot()

Snapshot name: `GettingStarted dark mode on 1`

- Snapshot  - 1
+ Received  + 1

@@ -183,10 +183,10 @@
      <EuiFlexItem
        className="kbnOverviewGettingStarted__graphic"
      >
        <EuiImage
          alt="Kibana visualizations illustration"
-         url="/plugins/kibanaOverview/assets/kibana_montage_dark_2x.png"
+         url="/plugins/kibanaOverview/assets/kibana_montage_dark.svg"
        />
      </EuiFlexItem>
    </EuiFlexGroup>
  </section>
    at Object.test (/dev/shm/workspace/parallel/5/kibana/src/plugins/kibana_overview/public/components/getting_started/getting_started.test.tsx:116:23)
    at Object.asyncJestTest (/dev/shm/workspace/kibana/node_modules/jest-jasmine2/build/jasmineAsyncInstall.js:106:37)
    at resolve (/dev/shm/workspace/kibana/node_modules/jest-jasmine2/build/queueRunner.js:45:12)
    at new Promise (<anonymous>)
    at mapper (/dev/shm/workspace/kibana/node_modules/jest-jasmine2/build/queueRunner.js:28:19)
    at promise.then (/dev/shm/workspace/kibana/node_modules/jest-jasmine2/build/queueRunner.js:75:41)
    at process._tickCallback (internal/process/next_tick.js:68:7)

Metrics [docs]

async chunks size

id before after diff
kibanaOverview 28.1KB 28.1KB -6.0B

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

cqliu1 added a commit that referenced this pull request Oct 6, 2020
@cqliu1 @MichaelMarcialis @ryankeairns
[Core UI] Kibana Overview Page (#75827)
63b76f2 
* Added kibana landing page

Created kivana_overview plugin

Removed test from home plugin

Added CSS

Fixed page header links

Added news feed

Fixed spacers between news items

[Core UI] Kibana Overview Page Style Tweaks (#76712)

Fixed link to index management

Added solution cards to kibana landing page

Added solution links

Fixed ts errors

Using publishReplay() to support multiple consumers in newsfeed plugin

Added createNewsFeed$ to newsfeed plugin start

Added tests

Removed unnecessary export

Hides overview link when other Kibana apps are not available

Added icon to overview plugin

Removed question mark from news feed title

Updated plugin-list

Fixed i18n errors

Revert snapshot

Updated getting started page copy

Hide news feed when no news feed results

Disables Kibana overview page when kibana apps are unavailable

Updated snapshots

Refactor to use KibanaContextProvider

Fixed security tests

Fixed newsfeed api test

Moved overview_footer and overview_header to kibana-react plugin

[Core UI] Kibana Overview Page Style Fixes (#78677)

* Fixed a11y issues

* Made newsfeed optional dep of kibana overview plugin

* Removed duplicate license copy

* Fixed management security test

* Added toast to change default route button

* Updated snapshots

* Simplified toast notification

* Fixed i18n error

* Assigned kibana_overview plugin to Core UI in CODEOWNERS

* Updated snapshots

* Fix import

* [Core UI] Kibana Overview Page Style Fixes, Part 3 (#78970)

* fix overview cards not stretching height equally

* change var name for better specificity

* [Core UI] Kibana Overview Page Style Fixes, Part 4 (#79136)

* Adds support for all newsfeed plugin config settings in createNewsFeed$

* Fixed type

* Updated kibana overview page route

* Fixed imports in page_footer and page_header

* Update Kibana overview graphics (#79534)

* Updated snapshots

* Updated snapshots

* Changes newsfeed endpoint to kibana analytics in kibana_overview plugin

* Renamed components

* Fixed overview page footer and header component class names

* Removed extraneous files

* Fixed import

* Replaced SVGs with optimized SVGs

* Fixed header and footer in home and kibana overview pages

* Updated snapshots

* Changed url_forwarding plugin appRoute

* Fixed aria-labelledby value

* Updated snapshots

* Added base paths

Co-authored-by: Michael Marcialis <michael.marcialis@elastic.co>
Co-authored-by: Ryan Keairns <contactryank@gmail.com>
cqliu1 added a commit to cqliu1/kibana that referenced this pull request Oct 6, 2020
@cqliu1 @MichaelMarcialis @ryankeairns
[Core UI] Kibana Overview Page (elastic#75827)
150dd11 
* Added kibana landing page

Created kivana_overview plugin

Removed test from home plugin

Added CSS

Fixed page header links

Added news feed

Fixed spacers between news items

[Core UI] Kibana Overview Page Style Tweaks (elastic#76712)

Fixed link to index management

Added solution cards to kibana landing page

Added solution links

Fixed ts errors

Using publishReplay() to support multiple consumers in newsfeed plugin

Added createNewsFeed$ to newsfeed plugin start

Added tests

Removed unnecessary export

Hides overview link when other Kibana apps are not available

Added icon to overview plugin

Removed question mark from news feed title

Updated plugin-list

Fixed i18n errors

Revert snapshot

Updated getting started page copy

Hide news feed when no news feed results

Disables Kibana overview page when kibana apps are unavailable

Updated snapshots

Refactor to use KibanaContextProvider

Fixed security tests

Fixed newsfeed api test

Moved overview_footer and overview_header to kibana-react plugin

[Core UI] Kibana Overview Page Style Fixes (elastic#78677)

* Fixed a11y issues

* Made newsfeed optional dep of kibana overview plugin

* Removed duplicate license copy

* Fixed management security test

* Added toast to change default route button

* Updated snapshots

* Simplified toast notification

* Fixed i18n error

* Assigned kibana_overview plugin to Core UI in CODEOWNERS

* Updated snapshots

* Fix import

* [Core UI] Kibana Overview Page Style Fixes, Part 3 (elastic#78970)

* fix overview cards not stretching height equally

* change var name for better specificity

* [Core UI] Kibana Overview Page Style Fixes, Part 4 (elastic#79136)

* Adds support for all newsfeed plugin config settings in createNewsFeed$

* Fixed type

* Updated kibana overview page route

* Fixed imports in page_footer and page_header

* Update Kibana overview graphics (elastic#79534)

* Updated snapshots

* Updated snapshots

* Changes newsfeed endpoint to kibana analytics in kibana_overview plugin

* Renamed components

* Fixed overview page footer and header component class names

* Removed extraneous files

* Fixed import

* Replaced SVGs with optimized SVGs

* Fixed header and footer in home and kibana overview pages

* Updated snapshots

* Changed url_forwarding plugin appRoute

* Fixed aria-labelledby value

* Updated snapshots

* Added base paths

Co-authored-by: Michael Marcialis <michael.marcialis@elastic.co>
Co-authored-by: Ryan Keairns <contactryank@gmail.com>
# Conflicts:
#	.github/CODEOWNERS
cqliu1 added a commit that referenced this pull request Oct 6, 2020
@cqliu1 @kibanamachine
[7.x] [Core UI] Kibana Overview Page (#75827) (#79708)
6e16d85 
* [Core UI] Kibana Overview Page (#75827)

* Added kibana landing page

Created kivana_overview plugin

Removed test from home plugin

Added CSS

Fixed page header links

Added news feed

Fixed spacers between news items

[Core UI] Kibana Overview Page Style Tweaks (#76712)

Fixed link to index management

Added solution cards to kibana landing page

Added solution links

Fixed ts errors

Using publishReplay() to support multiple consumers in newsfeed plugin

Added createNewsFeed$ to newsfeed plugin start

Added tests

Removed unnecessary export

Hides overview link when other Kibana apps are not available

Added icon to overview plugin

Removed question mark from news feed title

Updated plugin-list

Fixed i18n errors

Revert snapshot

Updated getting started page copy

Hide news feed when no news feed results

Disables Kibana overview page when kibana apps are unavailable

Updated snapshots

Refactor to use KibanaContextProvider

Fixed security tests

Fixed newsfeed api test

Moved overview_footer and overview_header to kibana-react plugin

[Core UI] Kibana Overview Page Style Fixes (#78677)

* Fixed a11y issues

* Made newsfeed optional dep of kibana overview plugin

* Removed duplicate license copy

* Fixed management security test

* Added toast to change default route button

* Updated snapshots

* Simplified toast notification

* Fixed i18n error

* Assigned kibana_overview plugin to Core UI in CODEOWNERS

* Updated snapshots

* Fix import

* [Core UI] Kibana Overview Page Style Fixes, Part 3 (#78970)

* fix overview cards not stretching height equally

* change var name for better specificity

* [Core UI] Kibana Overview Page Style Fixes, Part 4 (#79136)

* Adds support for all newsfeed plugin config settings in createNewsFeed$

* Fixed type

* Updated kibana overview page route

* Fixed imports in page_footer and page_header

* Update Kibana overview graphics (#79534)

* Updated snapshots

* Updated snapshots

* Changes newsfeed endpoint to kibana analytics in kibana_overview plugin

* Renamed components

* Fixed overview page footer and header component class names

* Removed extraneous files

* Fixed import

* Replaced SVGs with optimized SVGs

* Fixed header and footer in home and kibana overview pages

* Updated snapshots

* Changed url_forwarding plugin appRoute

* Fixed aria-labelledby value

* Updated snapshots

* Added base paths

Co-authored-by: Michael Marcialis <michael.marcialis@elastic.co>
Co-authored-by: Ryan Keairns <contactryank@gmail.com>
# Conflicts:
#	.github/CODEOWNERS

* Updated kibana_overview application order

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
@timroes
Copy link
Contributor

timroes commented Oct 16, 2020

Thanks a lot :-) I think it would still have been nicer, if we'd just have used one SVG, since it seems to look exactly the same despite colors between dark and light mode, and just used css classes in there and have a light and dark color styling in CSS for that one SVG, but that's def already a step forward from PNG. Thanks :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@cqliu1 cqliu1 cqliu1 approved these changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

4 participants

@ryankeairns @kibanamachine @timroes @cqliu1