## Summary To indicate they accept droppable data providers, this PR applies highlighting to the Timeline flyout badge and data providers drop area. Tested in dark and light mode in: - Chrome `76.0.3809.132` - Firefox `69.0` - Safari `12.1.2` ## Timeline data providers (drop area) highlighting behavior - While a data provider is being dragged, in a page or from within the timeline itself, apply `euiColorSuccess` to the timeline data providers drop area's dashed borders and "plain" text, but NOT to the other primitives, i.e. data provider badges, `AND` / `OR` circular badges, lines, etc - While a data provider is being dragged, in a page or from within the timeline itself, but NOT hovering over the data providers drop area, apply the `euiColorSuccess` color with `10%` alpha channel to the background of the data providers drop area - While a data provider is being dragged over the drop target area inside the data providers drop zone, apply the `euiColorSuccess` color with `20%` alpha channel to the background of the data providers drop area - While a data provider is being dragged over the drop target area inside the data providers drop zone that will add the data provider as an `AND` clause, apply `euiColorSuccess` color to the dashed border, and fill the background with the `euiColorSuccess` color with `30%` alpha channel to the background of the data providers drop area - Do NOT apply highlighting styles when a column or field (non-data provider) is dragged from the timeline or the `Events` widget ### Dark mode ![timeline-highlighting-dark](https://user-images.githubusercontent.com/4459398/64755303-ebcb1680-d4e7-11e9-8452-0f91ddae85d1.gif) ### Light mode ![timeline-highlighting-light](https://user-images.githubusercontent.com/4459398/64755318-fc7b8c80-d4e7-11e9-8621-a7eb918468aa.gif) ## Flyout button highlighting behavior - The (default) timeline flyout button is styled as non-filled EUI button - The button text reads `Timeline ^` (with a trailing caret), instead of `T I M E L I N E` - Hovering over the flyout button while NOT dragging underlines the flyout button text, but does not fill the background - When a user starts dragging a data provider, apply `euiColorSuccess` to all visible flyout button properties (e.g. border, text) - While a data provider is being dragged, in a page or from within the timeline itself, but NOT hovering over the flyout, apply the `euiColorSuccess` color with `10%` alpha channel to the background of the flyout button - While a data provider is being dragged, in a page or from within the timeline itself, AND hovering over the flyout such that it's in a droppable state, apply the `euiColorSuccess` color with `20%` alpha channel to the background of the flyout button - While a data provider is being dragged, in a page or from within the timeline itself, AND hovering over the flyout such that it's in a droppable state, replace the `Timeline ^` with a circle containing a `+` plus sign - Apply `EuiNotificationBadge` styling to the data providers badge count, and position it in the upper left-hand corner - Do NOT apply highlighting styles when a column or field (non-data provider) is dragged from the timeline or the `Events` widget ### Dark mode ![timeline-badge-dark](https://user-images.githubusercontent.com/4459398/64755512-5ed48d00-d4e8-11e9-9be2-02da70ac4e16.gif) ### Light mode ![timeline-badge-light](https://user-images.githubusercontent.com/4459398/64755531-7449b700-d4e8-11e9-9239-62ee78a6e652.gif) Resolves https://github.com/elastic/siem-team/issues/457 |
||
---|---|---|
.ci | ||
.github | ||
bin | ||
common/graphql | ||
config | ||
data | ||
docs | ||
licenses | ||
packages | ||
rfcs | ||
scripts | ||
src | ||
style_guides | ||
tasks | ||
test | ||
typings | ||
utilities | ||
webpackShims | ||
x-pack | ||
.backportrc.json | ||
.browserslistrc | ||
.editorconfig | ||
.eslintignore | ||
.eslintrc.js | ||
.gitattributes | ||
.gitignore | ||
.i18nrc.json | ||
.node-version | ||
.nvmrc | ||
.prettierrc | ||
.sass-lint.yml | ||
.yarnrc | ||
CONTRIBUTING.md | ||
FAQ.md | ||
github_checks_reporter.json | ||
Gruntfile.js | ||
Jenkinsfile | ||
kibana.d.ts | ||
LICENSE.txt | ||
NOTICE.txt | ||
package.json | ||
preinstall_check.js | ||
README.md | ||
renovate.json5 | ||
STYLEGUIDE.md | ||
tsconfig.browser.json | ||
tsconfig.json | ||
tsconfig.types.json | ||
TYPESCRIPT.md | ||
yarn.lock |
Kibana
Kibana is your window into the Elastic Stack. Specifically, it's a browser-based analytics and search dashboard for Elasticsearch.
- Getting Started
- Documentation
- Version Compatibility with Elasticsearch
- Questions? Problems? Suggestions?
Getting Started
If you just want to try Kibana out, check out the Elastic Stack Getting Started Page to give it a whirl.
If you're interested in diving a bit deeper and getting a taste of Kibana's capabilities, head over to the Kibana Getting Started Page.
Using a Kibana Release
If you want to use a Kibana release in production, give it a test run, or just play around:
- Download the latest version on the Kibana Download Page.
- Learn more about Kibana's features and capabilities on the Kibana Product Page.
- We also offer a hosted version of Kibana on our Cloud Service.
Building and Running Kibana, and/or Contributing Code
You might want to build Kibana locally to contribute some code, test out the latest features, or try out an open PR:
- CONTRIBUTING.md will help you get Kibana up and running.
- If you would like to contribute code, please follow our STYLEGUIDE.md.
- Learn more about our UI code with UI_SYSTEMS.md.
- For all other questions, check out the FAQ.md and wiki.
Documentation
Visit Elastic.co for the full Kibana documentation.
For information about building the documentation, see the README in elastic/docs.
Version Compatibility with Elasticsearch
Ideally, you should be running Elasticsearch and Kibana with matching version numbers. If your Elasticsearch has an older version number or a newer major number than Kibana, then Kibana will fail to run. If Elasticsearch has a newer minor or patch number than Kibana, then the Kibana Server will log a warning.
Note: The version numbers below are only examples, meant to illustrate the relationships between different types of version numbers.
Situation | Example Kibana version | Example ES version | Outcome |
---|---|---|---|
Versions are the same. | 5.1.2 | 5.1.2 | 💚 OK |
ES patch number is newer. | 5.1.2 | 5.1.5 | ⚠️ Logged warning |
ES minor number is newer. | 5.1.2 | 5.5.0 | ⚠️ Logged warning |
ES major number is newer. | 5.1.2 | 6.0.0 | 🚫 Fatal error |
ES patch number is older. | 5.1.2 | 5.1.0 | ⚠️ Logged warning |
ES minor number is older. | 5.1.2 | 5.0.0 | 🚫 Fatal error |
ES major number is older. | 5.1.2 | 4.0.0 | 🚫 Fatal error |
Questions? Problems? Suggestions?
- If you've found a bug or want to request a feature, please create a GitHub Issue. Please check to make sure someone else hasn't already created an issue for the same topic.
- Need help using Kibana? Ask away on our Kibana Discuss Forum and a fellow community member or Elastic engineer will be glad to help you out.