From 2860a50065744ef20df53426c5abba52537a719d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Fri, 5 Oct 2018 12:55:34 -0700 Subject: [PATCH] ux: tweaks to add datasource page and datasource settings page --- .../features/plugins/partials/ds_edit.html | 9 +- .../plugins/partials/ds_http_settings.html | 254 +++++++++--------- public/sass/_variables.dark.scss | 2 +- public/sass/components/_add_data_source.scss | 3 +- 4 files changed, 125 insertions(+), 143 deletions(-) diff --git a/public/app/features/plugins/partials/ds_edit.html b/public/app/features/plugins/partials/ds_edit.html index 41605a99d02..0fbb00d9a95 100644 --- a/public/app/features/plugins/partials/ds_edit.html +++ b/public/app/features/plugins/partials/ds_edit.html @@ -12,7 +12,7 @@
- Name + Name The name is used when you select the data source in panels. @@ -22,13 +22,6 @@
- -
- Type -
- -
-
diff --git a/public/app/features/plugins/partials/ds_http_settings.html b/public/app/features/plugins/partials/ds_http_settings.html index 6d014af567c..c03c1befa12 100644 --- a/public/app/features/plugins/partials/ds_http_settings.html +++ b/public/app/features/plugins/partials/ds_http_settings.html @@ -1,9 +1,9 @@
-

HTTP

+

HTTP

- URL + URL
-
+
-
-
- Access -
- -
-
-
- -
-
+
+
+ Access +
+ +
+
+
+ +
+
-
-
-

- Access mode controls how requests to the data source will be handled. - Server should be the preferred way if nothing else stated. -

-
Server access mode (Default):
-

- All requests will be made from the browser to Grafana backend/server which in turn will forward the requests to the data source - and by that circumvent possible Cross-Origin Resource Sharing (CORS) requirements. - The URL needs to be accessible from the grafana backend/server if you select this access mode. -

-
Browser access mode:
-

- All requests will be made from the browser directly to the data source and may be subject to - Cross-Origin Resource Sharing (CORS) requirements. The URL needs to be accessible from the browser if you select this - access mode. -

-
-
-
+
+

+ Access mode controls how requests to the data source will be handled. + Server should be the preferred way if nothing else stated. +

+
Server access mode (Default):
+

+ All requests will be made from the browser to Grafana backend/server which in turn will forward the requests to the data source + and by that circumvent possible Cross-Origin Resource Sharing (CORS) requirements. + The URL needs to be accessible from the grafana backend/server if you select this access mode. +

+
Browser access mode:
+

+ All requests will be made from the browser directly to the data source and may be subject to + Cross-Origin Resource Sharing (CORS) requirements. The URL needs to be accessible from the browser if you select this + access mode. +

-

Auth

-
-
- - -
-
- - -
-
+
+
+ Whitelisted Cookies + + + + Grafana Proxy deletes forwarded cookies by default. Specify cookies by name that should be forwarded to the data source. + +
+
+
-
- -
+

Auth

+
+
+ + +
+
+ + +
+
+ +
+
+ +
+
Basic Auth Details
+
+ User + +
+
+ Password + +
+
+ +
+
+
TLS Auth Details
+ TLS Certs are encrypted and stored in the Grafana database. +
+
+
+
+ +
+
+ +
+ +
+ + reset +
+
+
+ +
+
+
+ +
+
+ +
+
+ + reset +
+
+ +
+
+ +
+
+ +
+
+ + reset +
+
+
-
-
Basic Auth Details
-
- - User - - -
- -
- - Password - - -
-
- -
-
-
TLS Auth Details
- TLS Certs are encrypted and stored in the Grafana database. -
-
-
-
- -
-
- -
- -
- - reset -
-
-
- -
-
-
- -
-
- -
-
- - reset -
-
- -
-
- -
-
- -
-
- - reset -
-
-
-
- -

Advanced HTTP Settings

-
-
-
- Whitelisted Cookies - - - - Grafana Proxy deletes forwarded cookies by default. Specify cookies by name that should be forwarded to the data source. - -
-
-
diff --git a/public/sass/_variables.dark.scss b/public/sass/_variables.dark.scss index a878db0d9f4..8a012ea0a32 100644 --- a/public/sass/_variables.dark.scss +++ b/public/sass/_variables.dark.scss @@ -120,7 +120,7 @@ $code-tag-border: lighten($code-tag-bg, 2%); // cards $card-background: linear-gradient(135deg, #2f2f32, #262628); -$card-background-hover: linear-gradient(135deg, #343436, #262628); +$card-background-hover: linear-gradient(135deg, $dark-3, $dark-2); $card-shadow: -1px -1px 0 0 hsla(0, 0%, 100%, 0.1), 1px 1px 0 0 rgba(0, 0, 0, 0.3); // Lists diff --git a/public/sass/components/_add_data_source.scss b/public/sass/components/_add_data_source.scss index a4c805512f4..d46974fe97e 100644 --- a/public/sass/components/_add_data_source.scss +++ b/public/sass/components/_add_data_source.scss @@ -1,5 +1,6 @@ .add-data-source-header { - margin-bottom: $panel-margin * 4; + margin-bottom: $spacer * 2; + padding-top: $spacer; text-align: center; }