Commit Graph

433 Commits

Author SHA1 Message Date
Ashley Harrison
27fa544f72
SCSS: remove some low hanging dead fruit (#87260)
* remove some low hanging fruit

* restore json_explorer
2024-05-07 15:26:43 +01:00
Christopher Zinda
60fa462a2d
Grafana UI: Use correct path to 'online.svg', 'warn-tiny.svg', 'critical.svg' and 'background_tease.jpg' (#78273)
Bug fix: Use correct path to 'online.svg', 'warn-tiny.svg', 'critical.svg' and 'background_tease.jpg'
2024-01-02 10:28:11 +00:00
Leon Sorokin
6fc4e93f73
Dashboard: Reduce scope of contain: strict to TextPanel (#75499) 2023-09-27 13:14:35 -05:00
Dominik Prokop
918f11d81e
Revert "Dashboard: Reduce scope of contain: strict to TextPanel (#75466)
Revert "Dashboard: Reduce scope of `contain: strict` to TextPanel (#75329)"

This reverts commit ade0de5ae9.
2023-09-26 08:51:26 -07:00
Leon Sorokin
ade0de5ae9
Dashboard: Reduce scope of contain: strict to TextPanel (#75329) 2023-09-25 23:47:38 +03:00
Torkel Ödegaard
17b2240d52
GrafanaUI: Update FilterPill active state and ToolbarButton active state (#70396) 2023-07-10 11:41:33 +02:00
Torkel Ödegaard
6fd547881a
Page: Remove page shadow and replace with panel border (#63453) 2023-02-21 15:42:37 +01:00
Ida Štambuk
3544250baf
Accessibility: Make QueryEditorHelp examples keyboard interactive (#59355)
* Cloudwatch: A11y - Make example log keyboard interactive

* Change all cheat sheets to buttons

* Make suggestions block
2022-12-05 16:03:24 +01:00
Laura Benz
d429ec18a0
grafana/ui: convert sass to emotion (#52541)
* refactor: convert .elapsed-time

* refactor: elapsedTime styling not required

* refactor: logs-rows styling not defined, remove classname

* refactor: logs-meta-item__labels styling not defined, remove classname

* refactor: transfer .label-slider styling to its own element

* refactor: clean up .slider styling

* refactor: muted styling not defined, remove classname

* refactor: transfer .space-between styling to its own element + clean up

* refactor: remove icon
2022-07-26 08:31:40 +02:00
kay delaney
3131d12738
Panels: Prevent panel content from escaping its bounds (#52167) 2022-07-14 11:17:40 +01:00
Laura Benz
d71735d431
grafana/ui: convert sass to emotion explore classes (#52078)
* refactor: move .explore styling

* refactor: make new theme run

* refactor: convert .explore-split

* refactor: remove .explore and .explore-split

* refactor: cleanup ExplorePaneContainer

* refactor: convert .explore-wrapper

* refactor: move .page-scrollbar-wrapper

* refactor: apply changes from code review

* refactor: add theme to class interface

* refactor: remove typecheck errors
2022-07-13 15:45:27 +02:00
Laura
b09df60464
Revert "Explore: Convert SASS styles of explore-active-button to emotion (#50061)" (#50882)
This reverts commit 85ecf997be.
2022-06-16 14:39:54 +02:00
Laura
85ecf997be
Explore: Convert SASS styles of explore-active-button to emotion (#50061)
* Chore: replace sass styling by emotion incl. new theme

* Chore: remove sass styling

* Chore: change colour

* Chore: change colour

* Chore: clean up

Co-authored-by: Giordano Ricci <me@giordanoricci.com>

Co-authored-by: Giordano Ricci <me@giordanoricci.com>
2022-06-10 16:01:28 +02:00
Laura
ebc6d3a63c
Laura/chore/refactor styling of explore container (#49324)
* Chore: convert styling from sass to emotion

* Chore: delete sass styling
2022-05-23 10:55:04 +02:00
Giordano Ricci
13db125558
Explore: Use PageToolbar component & some cleanup (#41318)
* Explore: Use PageToolbar component & some cleanup

* remove unneeded getStyles

* remove unneeded fragment

* restore cancelQueries action handler in reducer

* avoid nested ternary operator

* Clean up explore e2e
2021-11-12 10:09:25 +00:00
Jack Westbrook
6e2237c02f
Chore: Replace Sass-lint with Stylelint (#40617)
* chore(sass): introduce stylelint

* chore(sass): introduce stylelint config that closely matches sass-lint config

* chore: remove sass-lint from codebase

* style(theme): disable stylelint string-quotes rule

* chore(sass): introduce stylelint-prettier-config to prevent config conflicts

* chore: delete sass-lint file

* style(sass): fix remaining stylelint errors
2021-10-20 11:34:24 +02:00
Giordano Ricci
95d9722afa
Fix: prevent queryDisplyText in QueryRowHeader from overflowing (#40094)
* Revert "Fix Query Editor Row horizontal overflow (#39419)"

This reverts commit 42b1fa0f62.

* fix: prevent queryDisplyText in QueryRowHeader from overflowing
2021-10-07 09:13:07 +01:00
Marcus Andersson
b626ba223f
Hooks: Adding possibility to display banner on the top of the page (#39099)
* adding working version of notificaion banner trigger.

* Move it to enterprise

* Fixing csss, none of the pages showed our CustomScrollbar or had double scrollbars

* fixing explore

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>
2021-09-29 08:28:07 +02:00
Ashley Harrison
4aed940738
VersionHistory: Remove global scss causing conflicts elsewhere (#39437) 2021-09-23 09:54:53 +01:00
Giordano Ricci
42b1fa0f62
Fix Query Editor Row horizontal overflow (#39419) 2021-09-21 09:14:41 +01:00
Torkel Ödegaard
f0cac149da
DashboardGrid: Refactorings and performance improvements (#35942)
* add back only re-render dashboard first time on layout change

* remove panel refs

* Updates

* Improved is in view logic

* Updates

* Remove unnessary auto sizer

* Found another approach that works with resize as well

* Updates

* fixing test

* Fixing ref issues

* Fixed mobile size handling, and view panel handling, removed now unnessary logic

* Updated snapshot
2021-06-22 14:44:18 +02:00
Torkel Ödegaard
7375115a98
Theme: Updating old theme variables to use the new theme higher contrast colors (#34305) 2021-05-18 18:00:30 +02:00
Jack Westbrook
8f62e42554
Plugins: add level and signature badges to plugin details page (#33553)
* feat(grafana-ui): badge can accept react node for text, add shield-exclamation to icons

* feat(plugins): add PluginSignatureType type

* feat(pluginpage): introduce PluginSignatureDetailsBadge. Fix sidebar icon margin

* feat(pluginlistpage): update filterinput placeholder, introduce filter by plugin type
2021-04-30 11:00:41 +02:00
Torkel Ödegaard
f6ecded86b
Theme: Page styles move to emotion global styles and design tweaks (#33529)
* Theme: Page styles move to emotion global styles and design tweaks

* More style tweaks

* tweaks

* Updating snapshots

* Another fix

* Another fix

* minor fix

* More style tweaks to page toolbar and alert rule page

* minor polish
2021-04-30 10:04:01 +02:00
Uchechukwu Obasi
99b85d8af3
DashboardPage: refactored styles from sass to emotion (#32955)
* DashboardPage: refactored styles from sass to emotion

* refactored dashboardPage component to be alot easier to read and understand

* more refactoring...

* more cleaning...

* fixes frontend test

* fixes frontend test- I hope

* fixes frontend test- I hope

* moves dashboard scss styles back to it's standalone file
2021-04-15 11:21:36 +01:00
Ivana Huckova
501d5fbcc2
Explore: Scroll split panes in Explore independently (#32978)
* Change default prometheus to latest and prometheus v1 to prometheus1

* Update README

* Remove prometheus1 block as not used

* Explore: Separatae scrolling in split view

* Update snapshot
2021-04-15 10:44:25 +02:00
Torkel Ödegaard
bcd0958849
Theme: Updated font to Inter, updates typography, a start of moving legacy & global styles from sass to emotion (#32988)
* Testing inter font

* new fonts and global styles

* Added Typography component and storybook

* Moving more global legacy types to emotion global styles

* Updated snapshot

* mapp bold to 500

* Updates

* Fixes and moved html & body styles to emotion

* moved helper function down

* Updated snapshot

* More tweaks

* Updates

* added internal tag

* Updated snapshot
2021-04-14 21:49:38 +02:00
Torkel Ödegaard
629603dd92
Theming: Updates to select styles and theme model progress (#32797)
* Theming: Updates to select styles and theme model progress

* Progress

* Update menu

* Updated menu group

* Improving button styles

* Added transitions to theme

* solving the hover & selected, focus issues

* Updated snapshot

* adding some colors from figma, but waiting to use them as not enough components use new layer colors

* Updates

* Updates

* Progress

* Renames

* Improvements to theme overview

* updated test

* demo update

* More new theme colors

* Wip new card styles

* Card tweaks hover is not working

* Updates more colors from figma

* Progress

* Progress

* Updated radio button styles

* Progress on new colors

* Progress

* New page toolbar and toolbar button design

* New toolbar button design

* Reverted to older toolbar and button look

* Updated snapshot

* Updated generated files

* Updated design

* Updates

* Added card hover

* Fixed button group

* Updates
2021-04-12 14:23:00 +02:00
Torkel Ödegaard
80294b2dbf
TimeRangePicker: Updates components to use new ToolbarButton & ButtonGroup (#30570)
* WIP: Using new components

* Progress

* Everything looks to be working

* Explore: Replaces navbar-button and overriden explore button css classes with ToolbarButton and cleans up scss & markup, removes ResponsiveButton (#30571)

* Explore: Replaces navbar-button and overriden explore button css classes with ToolbarButton and cleans up scss & markup, removes ResponsiveButton

* Change live button text when paused

* Fixed story

* For the dashboard toolbar button I need a transparent button so I refactored the states/variants into a new ToolbarButtonVariatn

* Changing my mind on the transparent variant

* review fixes

* Review fixes
2021-01-25 14:01:54 +01:00
Torkel Ödegaard
2a21f067b7
ButtonSelect & RefreshPicker: Rewrite of components to use new emotion based ToolbarButton & Menu (#30510)
* ButtonSelect: Trying to rewrite the button select to use ToggleButtonGroup & Menu

* minor update

* Progress

* Updated

* Moving all the explore scenarios into the refresh picker component

* Minor fixes

* Fixed responsive part of run button

* More minor fixes

* typescript fix

* Update packages/grafana-ui/src/components/Icon/Icon.tsx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

* Update packages/grafana-ui/src/components/Menu/Menu.tsx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

* Review feedback fixes and more

* Fixes small ts issue

* Updated return to dashboard button and tests, moved ButtonSelect out of LegacyForms

* fixed ts issue

* Fixed test

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>
2021-01-23 08:17:50 +01:00
Ivana Huckova
56fb04e94c
Explore: Update styling of buttons (#30493)
* Switch deprecared toggle group for radio buttons

* Create transparent version of field, label and witch

* Replace divs wiith components

* Move styling from scss to js

* Update buttons

* Remove log generating file

* Update level button
2021-01-21 15:49:38 +01:00
Ivana Huckova
e313c0cea0
@grafana/ui: Fix UI issues for cascader button dropdown and query input (#29727)
* Fix broken cascader width

* Remove text cursor in area where it does not affect slate
2020-12-09 19:01:28 +01:00
Jack Westbrook
87ba1b67b7
Dashboard: fix view panel mode for Safari / iOS (#28702)
* fix(dashboard): flex-basis so child height percentages are respected

* fix(dashboard): reset scrollTop when entering view panel mode
2020-11-02 16:52:41 +01:00
Torkel Ödegaard
a20875bd6c
Dashboard: Fixed issue accessing horizontal table scrollbar when placed at bottom of dashboard (#28250) 2020-10-14 16:47:31 +02:00
Torkel Ödegaard
7417ff015d
Dashboard: Fix empty panels after scrolling on Safari/iOS (#26495) 2020-07-22 13:42:29 +02:00
Torkel Ödegaard
2288609195
Dashboard: Refactor container css to use flex for height instead of calc (#24009)
* Dashboard: Ability to hide dashboard toolbar

* Updated snapshot
2020-06-16 16:33:25 +02:00
Ivana Huckova
e4832fa1ee
Explore: Fix very narrow Query fields on mobile (#25148)
* Fix Loki and Prometheus query fields on mobile devices

* Add min widt to Elasticsearch Query Field

* Remove width for Elastic, works nicely without updating it

* Update public/app/plugins/datasource/loki/components/LokiQueryFieldForm.tsx

Co-authored-by: Zoltán Bedi <zoltan.bedi@gmail.com>

Co-authored-by: Zoltán Bedi <zoltan.bedi@gmail.com>
2020-06-01 10:52:57 +02:00
Torkel Ödegaard
726009870b
LoginPage: New design (#23892)
* LoginPage: initial poc

* wIP

* Prgress

* Start Forms migration

* Fix layout and change password animation

* Migrate style to emotion

* Fix small things

* Remove classes

* Fix logo and title

* Disable disabled button

* Add custom fields and fix layout

* Update flyin animation

* Change animation timing

* Update comment

* Same styles for submit button

* Update snapshot

* Minor tweaks and made slogan random

Co-authored-by: Tobias Skarhed <tobias.skarhed@gmail.com>
2020-05-04 21:14:37 +02:00
kay delaney
f48ba11d4c
Datasource/Cloudwatch: Adds support for Cloudwatch Logs (#23566)
* Datasource/Cloudwatch: Adds support for Cloudwatch Logs

* Fix rebase leftover

* Use jsurl for AWS url serialization

* WIP: Temporary workaround for CLIQ metrics

* Only allow up to 20 log groups to be selected

* WIP additional changes

* More changes based on feedback

* More changes based on PR feedback

* Fix strict null errors
2020-04-25 22:48:20 +02:00
Ivana Huckova
66e5a1c0b3
Rich history: Fix create url and run query & style updates (#23627)
* Styling updates

* Create getQueryFromDisplayText method for Jaeger, Loki, Prometheus

* Fix createLink and runQuery methods for all datasources

* Update test

* Update Select from Legacy to current

* Update filtering

* Update public/app/core/utils/richHistory.test.ts

* Fix strictnullcheck errors

* Remove getQueryFromDisplayText method, as not needed

* Update saving of full query and use displayText for formatting

* Update tests

* Refactor create data query

* Remove parsing, store object instead

* Fix formatting error

* Remove object checking, transform everything to DataQuery

* Remove console.log

* Rename migrate function, add datasourceName as a useEffect dependency

* Fix z-index, move query
2020-04-24 18:23:31 +02:00
Torkel Ödegaard
4d9d3270af
CSS: Various css bug fixes (Safari fix for graph panels and more) (#23704)
* CSS: Various css bug fixes

* Updated
2020-04-21 09:12:34 +02:00
Ryan McKinley
6c021f7bb9
Table: add a select option when multiple tables exist (#23545)
* add a table picker

* move picker to the top

* add missing change

* Removed overflow from panel-content so dropdown menus can extend a panel, moved the select to the bottom

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>
2020-04-16 21:35:58 +02:00
Ivana Huckova
6937f3549b
@grafana/ui: Various smaller Icon updates (#23588)
* Remove icon types duplicates, update getAllIcons

* Update Explore-related icons, positioning

* Update Getting started icons

* Update navmodel

* Style adjustments, css changes

* Update tests

* Updatee icon name in test file
2020-04-16 13:49:58 +02:00
Torkel Ödegaard
bc60f9c403
Theme: Typography variables overhaul, theme cleanup, improvents to storybook ThemeColors component (#23531)
* Began text theme refactoring

* Consolidating blue varaibles

* Theme: Typography overhaul and theme cleanup

* Theme updates, alignment and fixes

* Updated snapshots

* Restored template variable class

* Updates

* added container

* Updated snapshot
2020-04-14 11:32:14 +02:00
Ivana Huckova
1c58202b26
@grafana/ui: Replace various icons using Icon component (#23442)
* Replace icons in dashboard and settings

* Replace icons in alerting

* Update batch of icons

* Implement icons accross various files

* Style updates

* Search: Fix recent and starred icons

* Update styling and details

* Replace new icon created by unicons

* Fix e2e test, styling

* Minor styling updates

Co-authored-by: Clarity-89 <homes89@ukr.net>
2020-04-12 22:20:02 +02:00
Torkel Ödegaard
1ba8f1647e
Theme: Refactoring theme colors variables (#23513)
* Theme: Typography updates

* Updated

* Updated snapshot

* Renamed colors to palette

* Introduce colors namespace

* Massive theme color move

* Removing color selection logic with more abstract concepts

* Updates

* Minor sidemenu change
2020-04-12 15:05:49 +02:00
Ivana Huckova
431f454d57
@grafana/ui: Create Icon component and replace part of the icons (#23402)
* Part1: Unicons implementation (#23197)

* Create a new Icon component

* Update icons in main sidebar

* Update icons in Useful links and in react components on  main site

* Update icons in Useful links and in main top navigation

* Adjust sizing

* Update panel navigation and timepicker

* Update icons in Panel menu

* NewPanelEditor: Fixed so that test alert rule works in new edit mode (#23179)

* Update icons in add panel widget

* Resolve merge conflict

* Fix part of the test errors and type errors

* Fix storybook errors

* Update getAvailableIcons import in storybook knobs

* Fix import path

* Fix SyntaxError: Cannot use import statement outside a module in test environment error

* Remove dynamic imports

* Remove types as using @ts-ignore

* Update snapshot test

* Add @iconscout/react-unicons to the shouldExclude list as it is blundled with es2015 syntax

* Remove color prop from icon, remove color implemetation in mono icons

* Update navbar styling

* Move toPascalCase to utils/string

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>

* Resolve type errors resulted from merge

* Part2: Unicons implementation (#23266)

* Create a new Icon component

* Update icons in main sidebar

* Update icons in Useful links and in react components on  main site

* Update icons in Useful links and in main top navigation

* Adjust sizing

* Update panel navigation and timepicker

* Update icons in Panel menu

* Update icons in add panel widget

* Resolve merge conflict

* Fix part of the test errors and type errors

* Fix storybook errors

* Update getAvailableIcons import in storybook knobs

* Fix import path

* Fix SyntaxError: Cannot use import statement outside a module in test environment error

* Remove dynamic imports

* Remove types as using @ts-ignore

* Update snapshot test

* Add @iconscout/react-unicons to the shouldExclude list as it is blundled with es2015 syntax

* Implment icons in Tabs

* Implement icons in search items and  empty  list

* Update buttons

* Update button-related snapshot tests

* Update icons in modals and page headers

* Create anfular wrapper and update all icons on search screen

* Update sizing, remove colors, update snapshot tests

* Remove color prop from icon, remove color implemetation in mono icons

* Remove color props from monochrome icons

* Complete update of icons for search screen

* Update icons for infor tooltips, playlist, permissions

* Support temporarly font awesome icons used in enterprise grafana

* Part1: Unicons implementation (#23197)

* Create a new Icon component

* Update icons in main sidebar

* Update icons in Useful links and in react components on  main site

* Update icons in Useful links and in main top navigation

* Adjust sizing

* Update panel navigation and timepicker

* Update icons in Panel menu

* NewPanelEditor: Fixed so that test alert rule works in new edit mode (#23179)

* Update icons in add panel widget

* Resolve merge conflict

* Fix part of the test errors and type errors

* Fix storybook errors

* Update getAvailableIcons import in storybook knobs

* Fix import path

* Fix SyntaxError: Cannot use import statement outside a module in test environment error

* Remove dynamic imports

* Remove types as using @ts-ignore

* Update snapshot test

* Add @iconscout/react-unicons to the shouldExclude list as it is blundled with es2015 syntax

* Remove color prop from icon, remove color implemetation in mono icons

* Update navbar styling

* Move toPascalCase to utils/string

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>

* Icons update

* Add optional chaining to for isFontAwesome variable

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>

* Part3:  Unicons implementation (#23356)

* Create a new Icon component

* Update icons in main sidebar

* Update icons in Useful links and in react components on  main site

* Update icons in Useful links and in main top navigation

* Adjust sizing

* Update panel navigation and timepicker

* Update icons in Panel menu

* Update icons in add panel widget

* Resolve merge conflict

* Fix part of the test errors and type errors

* Fix storybook errors

* Update getAvailableIcons import in storybook knobs

* Fix import path

* Fix SyntaxError: Cannot use import statement outside a module in test environment error

* Remove dynamic imports

* Remove types as using @ts-ignore

* Update snapshot test

* Add @iconscout/react-unicons to the shouldExclude list as it is blundled with es2015 syntax

* Implment icons in Tabs

* Implement icons in search items and  empty  list

* Update buttons

* Update button-related snapshot tests

* Update icons in modals and page headers

* Create anfular wrapper and update all icons on search screen

* Update sizing, remove colors, update snapshot tests

* Remove color prop from icon, remove color implemetation in mono icons

* Remove color props from monochrome icons

* Complete update of icons for search screen

* Update icons for infor tooltips, playlist, permissions

* Support temporarly font awesome icons used in enterprise grafana

* Part1: Unicons implementation (#23197)

* Create a new Icon component

* Update icons in main sidebar

* Update icons in Useful links and in react components on  main site

* Update icons in Useful links and in main top navigation

* Adjust sizing

* Update panel navigation and timepicker

* Update icons in Panel menu

* NewPanelEditor: Fixed so that test alert rule works in new edit mode (#23179)

* Update icons in add panel widget

* Resolve merge conflict

* Fix part of the test errors and type errors

* Fix storybook errors

* Update getAvailableIcons import in storybook knobs

* Fix import path

* Fix SyntaxError: Cannot use import statement outside a module in test environment error

* Remove dynamic imports

* Remove types as using @ts-ignore

* Update snapshot test

* Add @iconscout/react-unicons to the shouldExclude list as it is blundled with es2015 syntax

* Remove color prop from icon, remove color implemetation in mono icons

* Update navbar styling

* Move toPascalCase to utils/string

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>

* Update icons in Explore

* Update icons in alerting

* Update + and x buttons

* Update icons in configurations and settings

* Update close icons

* Update icons in rich history

* Update alert messages

* Add optional chaining to for isFontAwesome variable

* Remove icon mock, set up jest.config

* Fix navbar plus icon

* Fir enable-bacground to enableBackgournd

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>

* Merge remote branch origin master to icons-unicons

* Revert "Merge remote branch origin master to icons-unicons"

This reverts commit 3f25d50a39.

* Size-up dashnav icons

* Fix alerting icons, panel headers, update tests

* Fix typecheck error

* Adjustments - add panel icon, spacing

* Set TerserPlugin sourceMap to false to prevent running out of memory when publishing storybook

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>
2020-04-08 14:33:31 +02:00
Torkel Ödegaard
69bdcccd10
NewPanelEdit: Minor style tweaks & fix to transparent panels (#23353)
* NewPanelEdit: Minor style tweaks

* Fixed ts issue

* Tweaked breakpoint
2020-04-06 08:22:49 +02:00
Torkel Ödegaard
2106f0afc6
Theme: Updates gf-form & form-field to better match new form styles (#23345)
* Theme: Updates old gf-form-styles

* Removed margin buttom

* updated

* updated

* This will take some time

* More style tweaks to both light and dark theme

* Minor change

* Tweaked table styles
2020-04-05 20:02:52 +02:00
Ivana Huckova
2be4d8dfd0
Explore: Refactor active buttons css (#22124) 2020-02-12 20:11:40 +01:00