opensearch-project / dashboards-observability

Visualize and explore your logs, traces and metrics data in OpenSearch Dashboards
https://opensearch.org/docs/latest/observability-plugin/index/
Apache License 2.0
16 stars 55 forks source link

[Look&Feel] Integrations Density and Consistency Improvements #2071

Closed danieldong51 closed 2 months ago

danieldong51 commented 3 months ago

Description

This PR applies the Look & Feel density and consistency changes to the Integrations folder:

  1. Use small context menus
  2. Use small tabs
  3. Standardize paragraph size (15.75px next theme / 14px V7 theme)
  4. Use semantic headers (H1s on main pages, H2s on modals/flyouts)
  5. Modal/Flyout Typography
  6. Buttons for actions, only using primary buttons for primary calls to action
  7. Use small padding on popovers

Screenshots

Small context Menu

Scope Before After
Integrations Integration Home context menu before Integration Home context menu post

Small tabs

Scope Before After
Integration: Home Integration Home before Integration Home post
Integration: Details Integration Tab before Integration Tab post

Paragraph size

Scope Before After
Integration: Details Integration Details P Before Integration Details P Post

Semantic Headers

Scope Before After
Integrations: Overview Integration Overview Header Before Integration Overview Header Post
Integrations: Header Integration Header Before Integration Header Post
Integrations: Setup Integration Set up before Integration Set up post
Integrations: Added Integrations Added title before Integrations Added title post

Flyouts and Modals

Scope Before After
Integrations: Upload Integration Upload Before Integration Upload Post
Integrations: Delete Integration Delete Header Before Integration Delete Header Post
Integrations: Delete Integration Delete p Before Integration Delete p Post

Check List

By submitting this pull request, I confirm that my contribution is made under the terms of the Apache 2.0 license. For more information on following Developer Certificate of Origin and signing off your commits, please check here.

codecov[bot] commented 3 months ago

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 54.75%. Comparing base (c3ab50f) to head (0a629db). Report is 58 commits behind head on main.

Additional details and impacted files ```diff @@ Coverage Diff @@ ## main #2071 +/- ## ========================================== - Coverage 57.85% 54.75% -3.10% ========================================== Files 372 394 +22 Lines 14081 15244 +1163 Branches 3712 4124 +412 ========================================== + Hits 8146 8347 +201 - Misses 5871 6816 +945 - Partials 64 81 +17 ``` | [Flag](https://app.codecov.io/gh/opensearch-project/dashboards-observability/pull/2071/flags?src=pr&el=flags&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=opensearch-project) | Coverage Δ | | |---|---|---| | [dashboards-observability](https://app.codecov.io/gh/opensearch-project/dashboards-observability/pull/2071/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=opensearch-project) | `54.75% <100.00%> (-3.10%)` | :arrow_down: | Flags with carried forward coverage won't be shown. [Click here](https://docs.codecov.io/docs/carryforward-flags?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=opensearch-project#carryforward-flags-in-the-pull-request-comment) to find out more.

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.