Skip to content

N
nexpie-grafana-theme
Commit 8e516673 by Torkel Ödegaard Committed by GitHub
Options

Merge pull request #15828 from grafana/15771-datasource-url-icon 

Add padding to all input fields with help icon
parents 8ba4eb47 e7297fef
Showing with 45 additions and 37 deletions
public/app/features/alerting/partials/alert_tab.html
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
</div> </div>
<div class="gf-form max-width-11"> <div class="gf-form max-width-11">
<label class="gf-form-label width-5">For</label> <label class="gf-form-label width-5">For</label>
<input type="text" class="gf-form-input max-width-6" ng-model="ctrl.alert.for" <input type="text" class="gf-form-input max-width-6 gf-form-input--has-help-icon" ng-model="ctrl.alert.for"
spellcheck='false' placeholder="5m"> spellcheck='false' placeholder="5m">
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
If an alert rule has a configured For and the query violates the configured If an alert rule has a configured For and the query violates the configured
......
public/app/features/datasources/partials/http_settings.html
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form max-width-30"> <div class="gf-form max-width-30">
<span class="gf-form-label width-10">URL</span> <span class="gf-form-label width-10">URL</span>
<input class="gf-form-input" type="text" <input class="gf-form-input gf-form-input--has-help-icon" type="text"
ng-model='current.url' placeholder="{{suggestUrl}}" ng-model='current.url' placeholder="{{suggestUrl}}"
bs-typeahead="getSuggestUrls" min-length="0" bs-typeahead="getSuggestUrls" min-length="0"
ng-pattern="/^(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?$/" required></input> ng-pattern="/^(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?$/" required></input>
...@@ -59,7 +59,7 @@ ...@@ -59,7 +59,7 @@
<div class="gf-form-inline" ng-if="current.access=='proxy'"> <div class="gf-form-inline" ng-if="current.access=='proxy'">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-10">Whitelisted Cookies</span> <span class="gf-form-label width-10">Whitelisted Cookies</span>
<bootstrap-tagsinput ng-model="current.jsonData.keepCookies" width-class="width-20" tagclass="label label-tag" placeholder="Add Name"> <bootstrap-tagsinput ng-model="current.jsonData.keepCookies" width-class="width-20 gf-form-input--has-help-icon" tagclass="label label-tag" placeholder="Add Name">
</bootstrap-tagsinput> </bootstrap-tagsinput>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
Grafana Proxy deletes forwarded cookies by default. Specify cookies by name that should be forwarded to the data source. Grafana Proxy deletes forwarded cookies by default. Specify cookies by name that should be forwarded to the data source.
......
public/app/plugins/datasource/cloudwatch/partials/config.html
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<div class="gf-form" ng-show='ctrl.current.jsonData.authType == "credentials"'> <div class="gf-form" ng-show='ctrl.current.jsonData.authType == "credentials"'>
<label class="gf-form-label width-13">Credentials profile name</label> <label class="gf-form-label width-13">Credentials profile name</label>
<input type="text" class="gf-form-input max-width-18" ng-model='ctrl.current.database' placeholder="default"></input> <input type="text" class="gf-form-input max-width-18 gf-form-input--has-help-icon" ng-model='ctrl.current.database' placeholder="default"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
Credentials profile name, as specified in ~/.aws/credentials, leave blank for default Credentials profile name, as specified in ~/.aws/credentials, leave blank for default
</info-popover> </info-popover>
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
<div class="gf-form" ng-show='ctrl.current.jsonData.authType == "arn"'> <div class="gf-form" ng-show='ctrl.current.jsonData.authType == "arn"'>
<label class="gf-form-label width-13">Assume Role ARN</label> <label class="gf-form-label width-13">Assume Role ARN</label>
<input type="text" class="gf-form-input max-width-18" ng-model='ctrl.current.jsonData.assumeRoleArn' placeholder="arn:aws:iam:*"></input> <input type="text" class="gf-form-input max-width-18 gf-form-input--has-help-icon" ng-model='ctrl.current.jsonData.assumeRoleArn' placeholder="arn:aws:iam:*"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
ARN of Assume Role ARN of Assume Role
</info-popover> </info-popover>
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
</div> </div>
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label width-13">Custom Metrics</label> <label class="gf-form-label width-13">Custom Metrics</label>
<input type="text" class="gf-form-input max-width-18" ng-model='ctrl.current.jsonData.customMetricsNamespaces' placeholder="Namespace1,Namespace2"></input> <input type="text" class="gf-form-input max-width-18 gf-form-input--has-help-icon" ng-model='ctrl.current.jsonData.customMetricsNamespaces' placeholder="Namespace1,Namespace2"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
Namespaces of Custom Metrics Namespaces of Custom Metrics
</info-popover> </info-popover>
......
public/app/plugins/datasource/elasticsearch/partials/config.html
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">Min time interval</span> <span class="gf-form-label width-9">Min time interval</span>
<input type="text" class="gf-form-input width-6" ng-model="ctrl.current.jsonData.timeInterval" spellcheck='false' placeholder="10s"></input> <input type="text" class="gf-form-input width-6 gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.timeInterval" spellcheck='false' placeholder="10s"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
A lower limit for the auto group by time interval. Recommended to be set to write frequency, A lower limit for the auto group by time interval. Recommended to be set to write frequency,
for example <code>1m</code> if your data is written every minute. for example <code>1m</code> if your data is written every minute.
......
public/app/plugins/datasource/grafana-azure-monitor-datasource/partials/config.html
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">Subscription Id</span> <span class="gf-form-label width-9">Subscription Id</span>
<input class="gf-form-input width-30" type="text" ng-model="ctrl.current.jsonData.subscriptionId" placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"></input> <input class="gf-form-input width-30 gf-form-input--has-help-icon" type="text" ng-model="ctrl.current.jsonData.subscriptionId" placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
<p>In the Azure Portal, navigate to Subscriptions -> Choose subscription -> Overview -> Subscription ID.</p> <p>In the Azure Portal, navigate to Subscriptions -> Choose subscription -> Overview -> Subscription ID.</p>
<a target="_blank" href="https://docs.microsoft.com/en-us/azure/azure-resource-manager/resource-group-create-service-principal-portal">**Click <a target="_blank" href="https://docs.microsoft.com/en-us/azure/azure-resource-manager/resource-group-create-service-principal-portal">**Click
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">Tenant Id</span> <span class="gf-form-label width-9">Tenant Id</span>
<input class="gf-form-input width-30" type="text" ng-model="ctrl.current.jsonData.tenantId" placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"></input> <input class="gf-form-input width-30 gf-form-input--has-help-icon" type="text" ng-model="ctrl.current.jsonData.tenantId" placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
<p>In the Azure Portal, navigate to Azure Active Directory -> Properties -> Directory ID.</p> <p>In the Azure Portal, navigate to Azure Active Directory -> Properties -> Directory ID.</p>
<a target="_blank" href="https://docs.microsoft.com/en-us/azure/azure-resource-manager/resource-group-create-service-principal-portal">**Click <a target="_blank" href="https://docs.microsoft.com/en-us/azure/azure-resource-manager/resource-group-create-service-principal-portal">**Click
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">Client Id</span> <span class="gf-form-label width-9">Client Id</span>
<input class="gf-form-input width-30" type="text" ng-model="ctrl.current.jsonData.clientId" placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"></input> <input class="gf-form-input width-30 gf-form-input--has-help-icon" type="text" ng-model="ctrl.current.jsonData.clientId" placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
<p>In the Azure Portal, navigate to Azure Active Directory -> App Registrations -> Choose your app -> <p>In the Azure Portal, navigate to Azure Active Directory -> App Registrations -> Choose your app ->
Application ID.</p> Application ID.</p>
...@@ -50,7 +50,7 @@ ...@@ -50,7 +50,7 @@
<div class="gf-form-inline" ng-if="!ctrl.current.secureJsonFields.clientSecret"> <div class="gf-form-inline" ng-if="!ctrl.current.secureJsonFields.clientSecret">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">Client Secret</span> <span class="gf-form-label width-9">Client Secret</span>
<input class="gf-form-input width-30" type="text" ng-model="ctrl.current.secureJsonData.clientSecret" placeholder=""></input> <input class="gf-form-input width-30 gf-form-input--has-help-icon" type="text" ng-model="ctrl.current.secureJsonData.clientSecret" placeholder=""></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
<p>To create a new key, log in to Azure Portal, navigate to Azure Active Directory -> App Registrations -> <p>To create a new key, log in to Azure Portal, navigate to Azure Active Directory -> App Registrations ->
Choose your Choose your
...@@ -83,7 +83,7 @@ ...@@ -83,7 +83,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">Subscription Id</span> <span class="gf-form-label width-9">Subscription Id</span>
<input class="gf-form-input width-30" type="text" ng-model="ctrl.current.jsonData.logAnalyticsSubscriptionId" <input class="gf-form-input width-30 gf-form-input--has-help-icon" type="text" ng-model="ctrl.current.jsonData.logAnalyticsSubscriptionId"
placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX" /> placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX" />
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
<p>In the Azure Portal, navigate to Subscriptions -> Choose subscription -> Overview -> Subscription ID.</p> <p>In the Azure Portal, navigate to Subscriptions -> Choose subscription -> Overview -> Subscription ID.</p>
...@@ -95,7 +95,7 @@ ...@@ -95,7 +95,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">Tenant Id</span> <span class="gf-form-label width-9">Tenant Id</span>
<input class="gf-form-input width-30" type="text" ng-model="ctrl.current.jsonData.logAnalyticsTenantId" <input class="gf-form-input width-30 gf-form-input--has-help-icon" type="text" ng-model="ctrl.current.jsonData.logAnalyticsTenantId"
placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX" /> placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX" />
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
<p>In the Azure Portal, navigate to Azure Active Directory -> Properties -> Directory ID.</p> <p>In the Azure Portal, navigate to Azure Active Directory -> Properties -> Directory ID.</p>
...@@ -107,7 +107,7 @@ ...@@ -107,7 +107,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">Client Id</span> <span class="gf-form-label width-9">Client Id</span>
<input class="gf-form-input width-30" type="text" ng-model="ctrl.current.jsonData.logAnalyticsClientId" <input class="gf-form-input width-30 gf-form-input--has-help-icon" type="text" ng-model="ctrl.current.jsonData.logAnalyticsClientId"
placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"></input> placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
<p>In the Azure Portal, navigate to Azure Active Directory -> App Registrations -> Choose your app -> <p>In the Azure Portal, navigate to Azure Active Directory -> App Registrations -> Choose your app ->
...@@ -121,7 +121,7 @@ ...@@ -121,7 +121,7 @@
<div class="gf-form-inline" ng-if="!ctrl.current.secureJsonFields.logAnalyticsClientSecret"> <div class="gf-form-inline" ng-if="!ctrl.current.secureJsonFields.logAnalyticsClientSecret">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">Client Secret</span> <span class="gf-form-label width-9">Client Secret</span>
<input class="gf-form-input width-30" type="text" ng-model="ctrl.current.secureJsonData.logAnalyticsClientSecret" <input class="gf-form-input width-30 gf-form-input--has-help-icon" type="text" ng-model="ctrl.current.secureJsonData.logAnalyticsClientSecret"
placeholder="" /> placeholder="" />
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
<p>To create a new key, log in to Azure Portal, navigate to Azure Active Directory -> App Registrations -> <p>To create a new key, log in to Azure Portal, navigate to Azure Active Directory -> App Registrations ->
...@@ -168,7 +168,7 @@ ...@@ -168,7 +168,7 @@
<div class="gf-form-inline" ng-if="!ctrl.current.secureJsonFields.appInsightsApiKey"> <div class="gf-form-inline" ng-if="!ctrl.current.secureJsonFields.appInsightsApiKey">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">API Key</span> <span class="gf-form-label width-9">API Key</span>
<input class="gf-form-input width-30" type="text" ng-model="ctrl.current.secureJsonData.appInsightsApiKey" <input class="gf-form-input width-30 gf-form-input--has-help-icon" type="text" ng-model="ctrl.current.secureJsonData.appInsightsApiKey"
placeholder="" /> placeholder="" />
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
<p>Section 2 of the Quickstart guide shows where to find/create the API Key:</p> <p>Section 2 of the Quickstart guide shows where to find/create the API Key:</p>
...@@ -185,7 +185,7 @@ ...@@ -185,7 +185,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">Application Id</span> <span class="gf-form-label width-9">Application Id</span>
<input class="gf-form-input width-30" type="text" ng-model="ctrl.current.jsonData.appInsightsAppId" placeholder="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"></input> <input class="gf-form-input width-30 gf-form-input--has-help-icon" type="text" ng-model="ctrl.current.jsonData.appInsightsAppId" placeholder="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
<p>Section 2 of the Quickstart guide shows where to find the Application ID:</p> <p>Section 2 of the Quickstart guide shows where to find the Application ID:</p>
<a target="_blank" href="https://dev.applicationinsights.io/quickstart/">**Click here to open the Application <a target="_blank" href="https://dev.applicationinsights.io/quickstart/">**Click here to open the Application
......
public/app/plugins/datasource/influxdb/partials/config.html
...@@ -41,7 +41,7 @@ ...@@ -41,7 +41,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label">Min time interval</span> <span class="gf-form-label">Min time interval</span>
<input type="text" class="gf-form-input width-6" ng-model="ctrl.current.jsonData.timeInterval" spellcheck='false' placeholder="10s"></input> <input type="text" class="gf-form-input width-6 gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.timeInterval" spellcheck='false' placeholder="10s"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
A lower limit for the auto group by time interval. Recommended to be set to write frequency, A lower limit for the auto group by time interval. Recommended to be set to write frequency,
for example <code>1m</code> if your data is written every minute. for example <code>1m</code> if your data is written every minute.
......
public/app/plugins/datasource/loki/partials/config.html
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-8">Maximum lines</span> <span class="gf-form-label width-8">Maximum lines</span>
<input type="text" class="gf-form-input width-8" ng-model="ctrl.current.jsonData.maxLines" spellcheck='false' placeholder="1000"></input> <input type="text" class="gf-form-input width-8 gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.maxLines" spellcheck='false' placeholder="1000"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
Loki queries must contain a limit of the maximum number of lines returned (default: 1000). Loki queries must contain a limit of the maximum number of lines returned (default: 1000).
Increase this limit to have a bigger result set for ad-hoc analysis. Increase this limit to have a bigger result set for ad-hoc analysis.
......
public/app/plugins/datasource/mssql/partials/config.html
...@@ -50,7 +50,7 @@ ...@@ -50,7 +50,7 @@
<div class="gf-form-group"> <div class="gf-form-group">
<div class="gf-form max-width-15"> <div class="gf-form max-width-15">
<span class="gf-form-label width-7">Max open</span> <span class="gf-form-label width-7">Max open</span>
<input type="number" min="0" class="gf-form-input" ng-model="ctrl.current.jsonData.maxOpenConns" placeholder="unlimited"></input> <input type="number" min="0" class="gf-form-input gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.maxOpenConns" placeholder="unlimited"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
The maximum number of open connections to the database. If <i>Max idle connections</i> is greater than 0 and the The maximum number of open connections to the database. If <i>Max idle connections</i> is greater than 0 and the
<i>Max open connections</i> is less than <i>Max idle connections</i>, then <i>Max idle connections</i> will be <i>Max open connections</i> is less than <i>Max idle connections</i>, then <i>Max idle connections</i> will be
...@@ -60,7 +60,7 @@ ...@@ -60,7 +60,7 @@
</div> </div>
<div class="gf-form max-width-15"> <div class="gf-form max-width-15">
<span class="gf-form-label width-7">Max idle</span> <span class="gf-form-label width-7">Max idle</span>
<input type="number" min="0" class="gf-form-input" ng-model="ctrl.current.jsonData.maxIdleConns" placeholder="2"></input> <input type="number" min="0" class="gf-form-input gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.maxIdleConns" placeholder="2"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
The maximum number of connections in the idle connection pool. If <i>Max open connections</i> is greater than 0 but The maximum number of connections in the idle connection pool. If <i>Max open connections</i> is greater than 0 but
less than the <i>Max idle connections</i>, then the <i>Max idle connections</i> will be reduced to match the less than the <i>Max idle connections</i>, then the <i>Max idle connections</i> will be reduced to match the
...@@ -69,7 +69,7 @@ ...@@ -69,7 +69,7 @@
</div> </div>
<div class="gf-form max-width-15"> <div class="gf-form max-width-15">
<span class="gf-form-label width-7">Max lifetime</span> <span class="gf-form-label width-7">Max lifetime</span>
<input type="number" min="0" class="gf-form-input" ng-model="ctrl.current.jsonData.connMaxLifetime" placeholder="14400"></input> <input type="number" min="0" class="gf-form-input gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.connMaxLifetime" placeholder="14400"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
The maximum amount of time in seconds a connection may be reused. If set to 0, connections are reused forever. The maximum amount of time in seconds a connection may be reused. If set to 0, connections are reused forever.
</info-popover> </info-popover>
...@@ -82,7 +82,7 @@ ...@@ -82,7 +82,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">Min time interval</span> <span class="gf-form-label width-9">Min time interval</span>
<input type="text" class="gf-form-input width-6" ng-model="ctrl.current.jsonData.timeInterval" spellcheck='false' placeholder="1m"></input> <input type="text" class="gf-form-input width-6 gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.timeInterval" spellcheck='false' placeholder="1m"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
A lower limit for the auto group by time interval. Recommended to be set to write frequency, A lower limit for the auto group by time interval. Recommended to be set to write frequency,
for example <code>1m</code> if your data is written every minute. for example <code>1m</code> if your data is written every minute.
......
public/app/plugins/datasource/mysql/partials/config.html
...@@ -44,7 +44,7 @@ ...@@ -44,7 +44,7 @@
<div class="gf-form-group"> <div class="gf-form-group">
<div class="gf-form max-width-15"> <div class="gf-form max-width-15">
<span class="gf-form-label width-7">Max open</span> <span class="gf-form-label width-7">Max open</span>
<input type="number" min="0" class="gf-form-input" ng-model="ctrl.current.jsonData.maxOpenConns" placeholder="unlimited"></input> <input type="number" min="0" class="gf-form-input gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.maxOpenConns" placeholder="unlimited"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
The maximum number of open connections to the database. If <i>Max idle connections</i> is greater than 0 and the The maximum number of open connections to the database. If <i>Max idle connections</i> is greater than 0 and the
<i>Max open connections</i> is less than <i>Max idle connections</i>, then <i>Max idle connections</i> will be <i>Max open connections</i> is less than <i>Max idle connections</i>, then <i>Max idle connections</i> will be
...@@ -54,7 +54,7 @@ ...@@ -54,7 +54,7 @@
</div> </div>
<div class="gf-form max-width-15"> <div class="gf-form max-width-15">
<span class="gf-form-label width-7">Max idle</span> <span class="gf-form-label width-7">Max idle</span>
<input type="number" min="0" class="gf-form-input" ng-model="ctrl.current.jsonData.maxIdleConns" placeholder="2"></input> <input type="number" min="0" class="gf-form-input gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.maxIdleConns" placeholder="2"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
The maximum number of connections in the idle connection pool. If <i>Max open connections</i> is greater than 0 but The maximum number of connections in the idle connection pool. If <i>Max open connections</i> is greater than 0 but
less than the <i>Max idle connections</i>, then the <i>Max idle connections</i> will be reduced to match the less than the <i>Max idle connections</i>, then the <i>Max idle connections</i> will be reduced to match the
...@@ -63,7 +63,7 @@ ...@@ -63,7 +63,7 @@
</div> </div>
<div class="gf-form max-width-15"> <div class="gf-form max-width-15">
<span class="gf-form-label width-7">Max lifetime</span> <span class="gf-form-label width-7">Max lifetime</span>
<input type="number" min="0" class="gf-form-input" ng-model="ctrl.current.jsonData.connMaxLifetime" placeholder="14400"></input> <input type="number" min="0" class="gf-form-input gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.connMaxLifetime" placeholder="14400"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
The maximum amount of time in seconds a connection may be reused. If set to 0, connections are reused forever.<br/><br/> The maximum amount of time in seconds a connection may be reused. If set to 0, connections are reused forever.<br/><br/>
This should always be lower than configured <a href="https://dev.mysql.com/doc/refman/8.0/en/server-system-variables.html#sysvar_wait_timeout" target="_blank">wait_timeout</a> in MySQL. This should always be lower than configured <a href="https://dev.mysql.com/doc/refman/8.0/en/server-system-variables.html#sysvar_wait_timeout" target="_blank">wait_timeout</a> in MySQL.
...@@ -77,7 +77,7 @@ ...@@ -77,7 +77,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">Min time interval</span> <span class="gf-form-label width-9">Min time interval</span>
<input type="text" class="gf-form-input width-6" ng-model="ctrl.current.jsonData.timeInterval" spellcheck='false' placeholder="1m"></input> <input type="text" class="gf-form-input width-6 gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.timeInterval" spellcheck='false' placeholder="1m"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
A lower limit for the auto group by time interval. Recommended to be set to write frequency, A lower limit for the auto group by time interval. Recommended to be set to write frequency,
for example <code>1m</code> if your data is written every minute. for example <code>1m</code> if your data is written every minute.
......
public/app/plugins/datasource/opentsdb/partials/query.editor.html
...@@ -49,7 +49,7 @@ ...@@ -49,7 +49,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form max-width-25"> <div class="gf-form max-width-25">
<label class="gf-form-label query-keyword width-8">Down sample</label> <label class="gf-form-label query-keyword width-8">Down sample</label>
<input type="text" class="gf-form-input" <input type="text" class="gf-form-input gf-form-input--has-help-icon"
ng-model="ctrl.target.downsampleInterval" ng-model="ctrl.target.downsampleInterval"
ng-model-onblur ng-model-onblur
ng-change="ctrl.targetBlur()" ng-change="ctrl.targetBlur()"
...@@ -139,7 +139,7 @@ ...@@ -139,7 +139,7 @@
</div> </div>
<gf-form-switch class="gf-form" <gf-form-switch class="gf-form"
label="Group by" label="Group by"
label-class="query-keyword" label-class="query-keyword"
checked="ctrl.target.currentFilterGroupBy" checked="ctrl.target.currentFilterGroupBy"
on-change="ctrl.targetBlur()"> on-change="ctrl.targetBlur()">
......
public/app/plugins/datasource/postgres/partials/config.html
...@@ -43,7 +43,7 @@ ...@@ -43,7 +43,7 @@
<div class="gf-form-group"> <div class="gf-form-group">
<div class="gf-form max-width-15"> <div class="gf-form max-width-15">
<span class="gf-form-label width-7">Max open</span> <span class="gf-form-label width-7">Max open</span>
<input type="number" min="0" class="gf-form-input" ng-model="ctrl.current.jsonData.maxOpenConns" placeholder="unlimited"></input> <input type="number" min="0" class="gf-form-input gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.maxOpenConns" placeholder="unlimited"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
The maximum number of open connections to the database. If <i>Max idle connections</i> is greater than 0 and the The maximum number of open connections to the database. If <i>Max idle connections</i> is greater than 0 and the
<i>Max open connections</i> is less than <i>Max idle connections</i>, then <i>Max idle connections</i> will be <i>Max open connections</i> is less than <i>Max idle connections</i>, then <i>Max idle connections</i> will be
...@@ -53,7 +53,7 @@ ...@@ -53,7 +53,7 @@
</div> </div>
<div class="gf-form max-width-15"> <div class="gf-form max-width-15">
<span class="gf-form-label width-7">Max idle</span> <span class="gf-form-label width-7">Max idle</span>
<input type="number" min="0" class="gf-form-input" ng-model="ctrl.current.jsonData.maxIdleConns" placeholder="2"></input> <input type="number" min="0" class="gf-form-input gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.maxIdleConns" placeholder="2"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
The maximum number of connections in the idle connection pool. If <i>Max open connections</i> is greater than 0 but The maximum number of connections in the idle connection pool. If <i>Max open connections</i> is greater than 0 but
less than the <i>Max idle connections</i>, then the <i>Max idle connections</i> will be reduced to match the less than the <i>Max idle connections</i>, then the <i>Max idle connections</i> will be reduced to match the
...@@ -62,7 +62,7 @@ ...@@ -62,7 +62,7 @@
</div> </div>
<div class="gf-form max-width-15"> <div class="gf-form max-width-15">
<span class="gf-form-label width-7">Max lifetime</span> <span class="gf-form-label width-7">Max lifetime</span>
<input type="number" min="0" class="gf-form-input" ng-model="ctrl.current.jsonData.connMaxLifetime" placeholder="14400"></input> <input type="number" min="0" class="gf-form-input gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.connMaxLifetime" placeholder="14400"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
The maximum amount of time in seconds a connection may be reused. If set to 0, connections are reused forever. The maximum amount of time in seconds a connection may be reused. If set to 0, connections are reused forever.
</info-popover> </info-popover>
...@@ -95,7 +95,7 @@ ...@@ -95,7 +95,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-9">Min time interval</span> <span class="gf-form-label width-9">Min time interval</span>
<input type="text" class="gf-form-input width-6" ng-model="ctrl.current.jsonData.timeInterval" spellcheck='false' placeholder="1m"></input> <input type="text" class="gf-form-input width-6 gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.timeInterval" spellcheck='false' placeholder="1m"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
A lower limit for the auto group by time interval. Recommended to be set to write frequency, A lower limit for the auto group by time interval. Recommended to be set to write frequency,
for example <code>1m</code> if your data is written every minute. for example <code>1m</code> if your data is written every minute.
......
public/app/plugins/datasource/prometheus/partials/config.html
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-8">Scrape interval</span> <span class="gf-form-label width-8">Scrape interval</span>
<input type="text" class="gf-form-input width-8" ng-model="ctrl.current.jsonData.timeInterval" spellcheck='false' placeholder="15s"></input> <input type="text" class="gf-form-input width-8 gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.timeInterval" spellcheck='false' placeholder="15s"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
Set this to your global scrape interval defined in your Prometheus config file. This will be used as a lower limit for the Set this to your global scrape interval defined in your Prometheus config file. This will be used as a lower limit for the
Prometheus step query parameter. Prometheus step query parameter.
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-8">Query timeout</span> <span class="gf-form-label width-8">Query timeout</span>
<input type="text" class="gf-form-input width-8" ng-model="ctrl.current.jsonData.queryTimeout" spellcheck='false' placeholder="60s"></input> <input type="text" class="gf-form-input width-8 gf-form-input--has-help-icon" ng-model="ctrl.current.jsonData.queryTimeout" spellcheck='false' placeholder="60s"></input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
Set the Prometheus query timeout. Set the Prometheus query timeout.
</info-popover> </info-popover>
......
public/app/plugins/datasource/prometheus/partials/query.editor.html
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label">Legend</label> <label class="gf-form-label">Legend</label>
<input type="text" class="gf-form-input" ng-model="ctrl.target.legendFormat" spellcheck='false' placeholder="legend format" <input type="text" class="gf-form-input gf-form-input--has-help-icon" ng-model="ctrl.target.legendFormat" spellcheck='false' placeholder="legend format"
data-min-length=0 data-items=1000 ng-model-onblur ng-change="ctrl.refreshMetricData()"> data-min-length=0 data-items=1000 ng-model-onblur ng-change="ctrl.refreshMetricData()">
</input> </input>
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label width-6">Min step</label> <label class="gf-form-label width-6">Min step</label>
<input type="text" class="gf-form-input width-8" ng-model="ctrl.target.interval" data-placement="right" spellcheck='false' <input type="text" class="gf-form-input width-8 gf-form-input--has-help-icon" ng-model="ctrl.target.interval" data-placement="right" spellcheck='false'
placeholder="{{ctrl.panelCtrl.interval}}" data-min-length=0 data-items=100 ng-model-onblur ng-change="ctrl.refreshMetricData()" placeholder="{{ctrl.panelCtrl.interval}}" data-min-length=0 data-items=100 ng-model-onblur ng-change="ctrl.refreshMetricData()"
/> />
<info-popover mode="right-absolute"> <info-popover mode="right-absolute">
......
public/sass/components/_gf-form.scss
...@@ -250,6 +250,10 @@ $input-border: 1px solid $input-border-color; ...@@ -250,6 +250,10 @@ $input-border: 1px solid $input-border-color;
&--plaintext { &--plaintext {
white-space: unset; white-space: unset;
} }
&--has-help-icon {
padding-right: $input-padding-x * 3;
}
} }
.gf-form-hint { .gf-form-hint {
......
public/sass/components/_tagsinput.scss
...@@ -15,6 +15,10 @@ ...@@ -15,6 +15,10 @@
height: 100%; height: 100%;
width: 5rem; width: 5rem;
box-sizing: border-box; box-sizing: border-box;
&.gf-form-input--has-help-icon {
padding-right: $input-padding-x * 3;
}
} }
.tag { .tag {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment