Commit Graph

84 Commits

Author SHA1 Message Date
Torkel Ödegaard
ef5cbee2b3
Search: Improvements to design (#23874)
* Search: updated design

* Fixed z-index

* Fixes

* Minor pixel push
2020-04-25 07:43:54 +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
08c95c3419
UI: Theme changes (#22880)
* Theme: Updates the theme to align panel & page background colors

* Updated dashboard settings view to be similar to new panel edit

* Updated themes

* Added shadow

* Updates generated files

* Minor fix to inspect drawer

* Clean up old dashboard setttings stuff

* Polish to search

* Updated truth image

* Minor tweaks to dropdown menu

* Updates and alignments between inspect drawer and explore rich history

* removed unused variables

* Minor tweak to light page header bg
2020-03-24 10:30:53 +01:00
maximka
be73dcd2eb
Search: Improve tags layout , #22804 (#22830) 2020-03-18 08:14:56 +01:00
Johannes Schill
ceb21bd653 Search: Set element height to 100% to avoid Chrome 74's overflow (#17054)
Fixes #16981
2019-05-14 11:08:36 +02:00
Dominik Prokop
7194c6d9bf Search: Enable filtering dashboards in search by current folder (#16790)
* Added search-query-parser package

* Migrate search input field to react and enable current folter filtering

* Reveiw changes

* FIx tags

* Fix event handlers  passed to html elements directly

* noImplicitAny fix

* Debounce search method in search controller

* Search: have clear reset query as well
2019-05-02 08:49:03 +02:00
Torkel Ödegaard
e38762665b
UX: Improve Grafana usage for smaller screens (#16783)
* Mobile: Switch to mobile view already at md or lower breakpoint

* UX: Tweaked breakpoint so that media-breakpoint-up(md) will only apply to screens larger than normal ipad

* Updated snapshots
2019-04-26 19:16:03 +02:00
Patrick O'Carroll
75e3d3e59a Chore: Theme consistency, rems => pixels (#16145)
* replaced rem with pixels or variables

* replaced rems with pixels or variables

* repalced rems with pixels and variables
2019-03-27 08:48:24 +01:00
ijin08
a9c5fe5be1 updated colors in light, dark and theme files, in template file basic colors uses variables from dark/light files, also changed to -basic in some files 2019-02-20 16:11:36 +01:00
Dominik Prokop
88a46e6dd4 Bump Prettier version (#15532)
* Fix prettier version to 1.16.4
2019-02-19 15:41:35 +01:00
Torkel Ödegaard
9565e48f03 Fixed issue where double clicking on back button closes sidemenu 2019-02-11 09:37:13 +01:00
Torkel Ödegaard
30eda62fe7 css: minor fix to search 2018-10-03 11:07:20 -07:00
Patrick O'Carroll
9c889f8d68 centered dashboard icon in search with flexbox 2018-10-03 11:42:18 +02:00
Patrick O'Carroll
953bdc4dc0 put folder name under dashboard name, tweaked aliginments in search results 2018-09-11 14:53:38 +02:00
Patrick O'Carroll
1599806b75 Merge remote-tracking branch 'origin' into 11056-folder-m 2018-09-11 09:50:15 +02:00
Torkel Ödegaard
dc236b5063 refatoring: minor changes to PR #13149 2018-09-05 12:09:16 +02:00
Patrick O'Carroll
8419cc0553 made folder text smaller 2018-06-04 13:32:19 +02:00
Patrick O'Carroll
83a73327cf removed italic 2018-06-01 15:16:22 +02:00
Patrick O'Carroll
18e4271abd added span with folder title that is shown for recently and starred, created a new class for folder title 2018-06-01 10:34:57 +02:00
Alexander Zobnin
9f07ae72ee scrollbar: fix search scroller in mobile view 2018-04-05 16:47:20 +03:00
Alexander Zobnin
d6233714d2 Merge remote-tracking branch 'upstream/master' into fix-11053 2018-04-05 16:30:46 +03:00
Daniel Lee
32b833e488
Merge pull request #11271 from grafana/11073_dashboard_folder_indent
added indent to dashboards inside folder in search dropdown…
2018-04-05 11:12:17 +02:00
Patrick O'Carroll
b321a21cb5 removed indent for manage dashboards 2018-04-05 11:00:15 +02:00
Alexander Zobnin
77d2ee9add Initially move to baron scrollbar 2018-04-02 14:59:49 +03:00
Patrick O'Carroll
d4be953d23 fixed alignment in search + fixed issue ie popup 2018-03-27 12:36:13 +02:00
Patrick O'Carroll
fc9014f920 added indent to dashboards inside folder in search dropdown, and added indent to dashboard icon in search item 2018-03-16 12:36:36 +01:00
Torkel Ödegaard
162f4941f0 fix: restored tags to search 2018-02-03 10:14:45 +01:00
Torkel Ödegaard
b6ce16ebae ux: minor tweak of #10634 2018-01-29 10:41:06 +01:00
Patrick O'Carroll
ffff75b01a reverted media queries 2018-01-26 16:59:16 +01:00
Patrick O'Carroll
2f891726c3 fix for sm 2018-01-26 14:57:55 +01:00
Patrick O'Carroll
08822fbdca added media break for md and sm 2018-01-26 14:46:52 +01:00
Torkel Ödegaard
11ba8070b8
Tag filters in search (#10521)
* tag filter: initial react component

* dashboard: move tag filter to filterbox

* tag filter: customize value rendering

* tag filter: get color from name

* tag filter:  custom option renderer

* tag filter: mode with tags in different container

* tag filter: refactor

* refactoring PR #10519

* tag filter: refactor of PR #10521
2018-01-16 12:52:13 +01:00
Torkel Ödegaard
908b6c8d0b tech: ran prettier on all scss files 2017-12-19 16:22:41 +01:00
Torkel Ödegaard
313735bd75 search: worked on search results 2017-12-13 15:51:59 +01:00
Torkel Ödegaard
271c597c9b ux: style tweaks 2017-12-12 15:13:47 +01:00
Torkel Ödegaard
d379b501aa ux: search look update 2017-12-12 13:55:32 +01:00
Patrick O'Carroll
515faa9ec5 new dashboard and folder in search (#10152)
* new dashboard and folder in search

* code formatting fixes
2017-12-12 11:26:15 +01:00
Patrick O'Carroll
9cae579c75 fix for search dropdown on small screen + icon overlapping fix (#10091)
* fix for search dropdown on small screen + icon overlapping fix

* fixing search filter for small screen

* hid tags and filter box

* iphone input zoom fix

* moved input styling to old-responsive
2017-12-08 13:37:37 +01:00
Marcus Efraimsson
ff535a5e9a dashfolders: css fix 2017-12-07 18:05:47 +01:00
Marcus Efraimsson
f87b9aaa8a dashboard: keyboard nav in dashboard search - closes #10100
Pressing enter/return for a folder toggles it.
Pressing enter/return for a dashboard navigates to it.
2017-12-06 20:34:41 +01:00
Daniel Lee
781349d360 dashboard: dashboard search results component. closes #10080 2017-12-05 14:20:44 +01:00
Torkel Ödegaard
3d2d789ca2 ux: search filter box 2017-11-29 17:15:27 +01:00
Matt
ce494fbedb Added border radius and tightened up the folder boxes. Still needs to have the bottom margin expanded to 8px when in opened state (this needs @torkelo) 2017-11-29 14:45:12 +01:00
Torkel Ödegaard
d981fe4f04 ux: search design update 2017-11-29 13:21:42 +01:00
Torkel Ödegaard
00df24b348 ux: search progress 2017-11-24 16:54:55 +01:00
Torkel Ödegaard
b3ddcc8077 ux: sass fixes and polish 2017-11-23 20:41:16 +01:00
Marcus Efraimsson
7ee57b774a dashlist: When searching should reset checked state to false 2017-11-23 14:59:52 +01:00
Torkel Ödegaard
84c46f0cd3 ux: fixed sass issue 2017-11-23 13:01:19 +01:00