Commit Graph

149 Commits

Author SHA1 Message Date
Ashley Harrison
dab83c6855
Theme: Use Inter font by default (#59544)
* Switch to using Inter font by default

* run toggles_gen_test
2022-12-01 11:59:37 +00:00
Torkel Ödegaard
9f5e691994
Theme: Inter font (behind feature toggle) (#56441)
* Theme: Inter font change with new line-height

* Add it behind feature toggle

* make buildVariant easier to read + enforce integer multiples of 2 (#56486)

* Minor update

* Update

Co-authored-by: Ashley Harrison <ashley.harrison@grafana.com>
2022-10-15 16:22:33 +02:00
Jack Westbrook
dcc02a8ebe
Storybook: Fix asset paths for hosted storybooks (#56319)
* feat(sass): introduce font-file-path var to define where to load fonts from

* feat(storybook): introduce storybook sass theme styles to set font file paths

* chore(sass): change imports so treated as sass rather than css

* feat(storybook): filter assets so builds dont contain thousands of files
2022-10-05 12:10:29 +02:00
Torkel Ödegaard
c29e6fcb3a
Prometheus/Loki: Improve metric search highlight contrast (#49384)
* Prometheus/Loki: Improve metric search highlight contrast

* Update other places, and add reusable variables
2022-05-23 15:53:45 +02:00
Ashley Harrison
e1af78954f
Only modify table spacing (#44313) 2022-01-21 13:38:13 +00:00
Ashley Harrison
6a558582d5
Fix deprecated sass (#43753) 2022-01-06 13:09:52 +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
Uchechukwu Obasi
51a48e1869
Text Panel: fixes unnecessary scroll in markdown html tables (#40315)
* Text Panel: fixes unnecessary scroll in tables

* uses more robust solution that covers every edge case

* chore: uses variables instead and sets first child margins to zero

* override margin for only h1 and figure elements

* remove override styles for h1,table markdown contents
2021-10-14 16:43:33 +02:00
Torkel Ödegaard
863b412d54
Transformations: State feature (alpha/beta) and more (#36630)
* Adding plugin state feature to transforms

* initial help box

* New HelpBox component

* More progress

* Testing

* Removing HelpBox, simple new design, new active state for OperationRowAction

* Updated tests

* Fixed typing issue

* Removed AlphaNotice

* Made focus and enter key trigger OnClick and sorted transformations

* Fixed e2e tests
2021-07-12 16:42:04 +02:00
Armand Grillet
7fb233cfb1
Theme: Add margin-bottom to .markdown-html tables (#36415) 2021-07-05 08:40:56 +02:00
kay delaney
8143991b94
Security: Update default CSP template and fix firefox CSP issues (#34836)
* Security: Update default content_security_policy_template
- Add 'strict-dynamic' back to script-src
- Add ws(s)://$ROOT_PATH to connect-src
- Change onEvent to on-event in angular templates to fix CSP issues in firefox.
- Add blob: to style-src
2021-05-28 17:01:10 +02:00
Torkel Ödegaard
4fabade35c
v8: Update login page design (#33923)
* Theme: Initial draft of dark login page

* update

* Updated login background

* Updates

* anim test

* Anim tweak

* Animate login box

* Updates

* Updating login page

* Improve footer readability on login page

* Fix sign up button
2021-05-11 16:34:44 +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
Torkel Ödegaard
b6cfb65e40
Annotations: More fixes to the angular annotation editors (#33303)
* Annotations: Fixed angular editor issues

* More angular annotation fixes

* removed console.log
2021-04-23 14:06:30 +02:00
Torkel Ödegaard
66485b3e70
Theme: V8 Theme updates (#33050)
* GraphNG: Use new theme props

* Minor fix to letterspacing in button

* Minor tweaks

* Updated

* Revert to roboto

* Added concept of a dark or white base

* Style updates

* Sass

* Updated light text blue

* updates

* reverting button group design

* Fixed tests

* updates

* Updated tests
2021-04-16 09:48:52 +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
f081df0a4f
Theme: Use higher order theme color variables rather then is light/dark logic (#30939) 2021-02-06 18:01:22 +01:00
Torkel Ödegaard
d71073bd96
Links: Add underline on hover for links in NewsPanel (#30166) 2021-01-11 13:22:21 +01:00
Hugo Häggmark
9481b7bcf2
Datasource Config: adds back correct styles for autofill fields (#24671) 2020-05-14 11:56:00 +02:00
Ryan McKinley
17059489d8
Inspector: move Panel JSON and query inspector to the inspector (#23354)
* move Panel JSON to inspector

* move Panel JSON to inspector

* update test

* use stats display options

* move query inspector to inspector

* open inspector from the queries section

* subscribe to results

* subscribe to results

* open the right tab

* apply review feedback

* update menus (inspect tabs)

* Dashboard: extend dashnav to add custom content (#23433)

* Dashlist: Fixed dashlist broken in edit mode (#23426)

* Chore: Fix bunch of strict null error to fix master CI (#23443)

* Fix bunch of null error

* Fix failing test

* Another test fix

* Docs: Add SQL region annotation examples (#23268)

Add region annotation examples for SQL data sources in docs.

Co-authored-by: Marcus Efraimsson <marcus.efraimsson@gmail.com>

* Docs: Update contributing doc to install node@12. (#23450)

* NewPanelEdit: Minor style and description tweaks, AND PanelQueryRunner & autoMinMax (#23445)

* NewPanelEdit: Minor style and description tweaks

* Removed the worst snapshot of all time

* ReactTable: adds color text to field options (#23427)

* Feature: adds text color field config

* Refactor: created an extension point

* Refactor: uses HOC for extension instead

* Fix: fixes background styling from affecting cells without display.color

* Chore: export OptionsUIRegistryBuilder on grafana/data (#23444)

* export the ui registry

* add to utils index also

* DataLinks: Do not full page reload data links links (#23429)

* Templating: Fix global variable "__org.id" (#23362)

* Fixed global variable __org.id value

* correct orgId value

* reverted the change as variables moved to new file

* Chore: reduce null check errors to 788 (currently over 798) (#23449)

* Fixed ts errors so build will succeed

* Update packages/grafana-data/src/types/graph.ts

Co-Authored-By: Ryan McKinley <ryantxu@gmail.com>

* Feedback from code review

* Leaving out trivial typing's

* Fix error with color being undefined now.

* fix test with timezone issue

* Fixed test

Co-authored-by: Ryan McKinley <ryantxu@gmail.com>
Co-authored-by: Torkel Ödegaard <torkel@grafana.com>

* Cloudwatch: prefer webIdentity over EC2 role (#23452)

* Plugins: add a signature status flag (#23420)

* Progress

* fixed button

* Final touches

* now works from edit mode

* fix layout

* show raw objects

* move query inspector buttons to the bottom

* update snapshot

* Updated design

* Made full page reload work

* Fixed minor style issue

* Updated

* More fixes

* Removed unused imports

* Updated

* Moved to data tab out to seperate component

* fixed ts issue

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>
Co-authored-by: Agnès Toulet <35176601+AgnesToulet@users.noreply.github.com>
Co-authored-by: Andrej Ocenas <mr.ocenas@gmail.com>
Co-authored-by: Alexandre de Verteuil <alexandre@grafana.com>
Co-authored-by: Marcus Efraimsson <marcus.efraimsson@gmail.com>
Co-authored-by: Cyril Tovena <cyril.tovena@gmail.com>
Co-authored-by: Hugo Häggmark <hugo.haggmark@grafana.com>
Co-authored-by: Vikky Omkar <vikkyomkar@gmail.com>
Co-authored-by: Stephanie Closson <srclosson@gmail.com>
Co-authored-by: Dário Nascimento <dfrnascimento@gmail.com>
2020-04-15 16:51:51 +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
Jacky
1ff69db5cb
Make name unique to fix issue #22426 (#22458)
* make name unique

* delete mini class instead rename

Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com>
2020-04-10 17:02:18 +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
Agnès Toulet
646b74efbb
Icons: add reports icon (#22445) 2020-02-28 09:51:03 +01:00
Torkel Ödegaard
5b40b26744
UX: BackButton left arrow icon (#22369)
* Adding new svg for back arrow button

* Created new back button component

* same stroke width

* minor fix

* Style changes

* hover animation

* Minor tweak
2020-02-22 22:13:56 +01:00
Torkel Ödegaard
4f1fffb948
FontSize: Change base font size to 14px (#21104) 2019-12-16 17:45:33 +01:00
Dominik Prokop
64e609e19e
Forms: Introduce typographic form elements (#19879)
* Implement Label component

* Expose next-gen form components from grafana-ui under Forms namespace

* Minor Label update

* Add Legend component

* Test form story

* Expose Legend class name via getFormStyles

* Test

* FieldValidationMessage spacing

* Expose FieldValidationMessage styles via getFormStyles

* Update snapshot
2019-10-22 17:36:07 +02:00
Torkel Ödegaard
81dd57524d
Panels: Progress on new singlestat / BigValue (#19374)
* POC: friday hack

* exploring new singlestat styles

* minor changes

* Testing bizcharts

* style tweaks

* Updated

* minor progress

* updated

* Updated layout handling

* Updated editor

* added editor options

* adding mode

* progress on new display mode

* tweaks

* Added classic style

* Added final mode

* Minor tweak

* tweaks

* minor tweak

* Singlestat: Adjust colors for light theme

* fixed build issues with bizcharts

* fixed typescript issue

* updated snapshot

* Added demo dashboard
2019-10-04 12:01:42 +02:00
kay delaney
7985aa1e57
Performance/Webpack: Introduces more aggressive code-splitting and other perf improvements (#18544)
* Performance/Webpack: Introduces more aggressive code-splitting and other perf improvements
- Introduces dynamic imports for built-in plugins
- Uses dynamic imports for various packages (rst2html, brace)
- Introduces route-based dynamic imports
- Splits angular and moment into separate bundles
2019-09-03 09:29:02 +01:00
Patrick O'Carroll
d040e336c1 UI: Remove old icons (#16335)
* removed unsused grafana-icon classes, replaced grafana-icons with gicons

* replaced old dashboard and datasource icons with gicon, fixed so icons on plugin list are shown

* removed unsused grafana-icon classes, replaced grafana-icons with gicons

* replaced old dashboard and datasource icons with gicon, fixed so icons on plugin list are shown

* replaced fontawesome cog, eye, link and edit with gicons

* updated snapshot

* fixed color of cog in dashboard nav, removed icons from buttons, ran preitterier on some files

* changed opacity on getting started icons and fixed getting started button

* .5 -> 0.5 fix for prettier
2019-04-17 15:18:32 +02:00
Patrick O'Carroll
52851a38b8 Refactor: Theme input padding variables (#16048)
* removed input padding variables and replaced with new inset variables, also removed unused class in _gf-form

* removed last input padding variable

* removed table-cell-padding variable

* added input padding variable to template file

* fixed input-padding variable

* removed regualt inset variable(for now), added input-padding to a class

* removed empty line
2019-03-28 11:13:53 +01:00
Torkel Ödegaard
a0d2e5861d
Merge pull request #16136 from grafana/rem-removal-2
Replaced rems with pixels or variables (part 2)
2019-03-22 12:30:06 +01:00
ijin08
85bfb1dba8 replaced rems with pixels or variables 2019-03-21 15:44:14 +01:00
ijin08
2db02bd240 replaced rem with pixels or variables 2019-03-21 10:43:06 +01:00
ijin08
9e57195b1d removed dashboard variables, removed headings-font-family variable, created theme variables for links and z-index, removed unused class in _panel_editor and _dashboard 2019-03-20 09:48:19 +01:00
ijin08
e632309ab9 removed unused and very specific variables, also variables with same value as general variable 2019-03-13 09:40:56 +01:00
ijin08
7a15528223 removed gf-form-margin variable and replaced with space- variables where it was used 2019-03-12 12:30:34 +01:00
ijin08
204d21abbe removed headings-margin-bottom variable 2019-03-12 08:01:20 +01:00
ijin08
c5f4239703 changed root font to 100%(default 16px), changed font-size from px to rem, updated rem sizes in template and default.ts files, removed display classes and variables since not used, removed lead class and variables since not usedremoved serif font since not used and probably never should be used 2019-03-07 15:37:17 +01:00
Hugo Häggmark
062b5f26fe style: add gicon-shield to sidemenu class
Closes #15591
2019-03-05 13:46:22 +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
1eb804c655
Merge pull request #15411 from grafana/theme-files-cleanup
[wip]Cleaning up the theme .scss files
2019-02-18 20:23:40 +01:00
Torkel Ödegaard
df170aee16 Updated explore icon and style tweaks
Lowered icon size and improved paddings, tried to align placement between dashboard and explore
2019-02-18 18:26:24 +01:00
Patrick O'Carroll
65b4273551
Merge branch 'master' into theme-files-cleanup 2019-02-13 15:46:59 +01:00
Torkel Ödegaard
cfea8bdcae Prettier had not been running as a precommit hook for some time so had to run in on all files again 2019-02-13 11:14:53 +01:00
ijin08
09dbd6b1a6 removed _plugins.scss and _settings_permissions.scc, removed unused classes in _login.scss, reduced dark variabels in light theme and alignied light theme a bit with dark theme, turned blue-gray, dark-3 and panel-bg variables into one variable and removed gray-7 in dark theme 2019-02-13 11:04:22 +01:00
Torkel Ödegaard
962815169e Color tweaks 2019-02-11 14:58:11 +01:00
Patrick O'Carroll
c34021344a
Merge branch 'master' into ui-new-red-green-blue 2019-02-11 09:17:19 +01:00
ijin08
0642c52693 created new color variables, changed primary to blue, changed success-btns to primary-btns. 2019-02-05 12:05:02 +01:00
Peter Holmberg
b9c58d88dc basic layout 2019-02-04 16:48:27 +01:00