mirror of
https://github.com/grafana/grafana.git
synced 2025-01-09 23:53:25 -06:00
Beginnings of form restyling, nowhere near merge yet
This commit is contained in:
parent
89ef019b7c
commit
21b0945d08
@ -3,7 +3,7 @@ init_cmds = [
|
||||
["go", "build", "-o", "./bin/grafana-server"],
|
||||
["./bin/grafana-server"]
|
||||
]
|
||||
watch_all = true
|
||||
watch_all = false
|
||||
watch_dirs = [
|
||||
"$WORKDIR/pkg",
|
||||
"$WORKDIR/public/views",
|
||||
|
@ -32,6 +32,7 @@
|
||||
"grunt-git-describe": "~2.3.2",
|
||||
"grunt-karma": "~0.12.1",
|
||||
"grunt-ng-annotate": "^1.0.1",
|
||||
"grunt-notify": "^0.4.3",
|
||||
"grunt-string-replace": "~1.2.1",
|
||||
"grunt-systemjs-builder": "^0.2.5",
|
||||
"grunt-tslint": "^3.0.1",
|
||||
|
@ -11,17 +11,17 @@
|
||||
<h2 ng-show="!isNew">Edit data source</h2>
|
||||
|
||||
<form name="editForm">
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 80px">
|
||||
<div class="norm-form">
|
||||
<ul class="norm-form-list">
|
||||
<li class="norm-form-item small" style="width: 80px">
|
||||
Name
|
||||
</li>
|
||||
<li>
|
||||
<li>
|
||||
<input type="text" class="input-xlarge tight-form-input" ng-model="current.name" placeholder="my data source name" required>
|
||||
<input type="text" class="input-xlarge norm-form-input" ng-model="current.name" placeholder="my data source name" required>
|
||||
</li>
|
||||
</li>
|
||||
<li class="tight-form-item">
|
||||
<li class="norm-form-item">
|
||||
Default
|
||||
<input class="cr1" id="current.isDefault" type="checkbox" ng-model="current.isDefault" ng-checked="current.isDefault">
|
||||
<label for="current.isDefault" class="cr1"></label>
|
||||
@ -29,13 +29,13 @@
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 80px">
|
||||
<div class="norm-form last">
|
||||
<ul class="norm-form-list">
|
||||
<li class="norm-form-item" style="width: 80px">
|
||||
Type
|
||||
</li>
|
||||
<li>
|
||||
<select class="input-xlarge tight-form-input" ng-model="current.type" ng-options="k as v.name for (k, v) in types" ng-change="typeChanged()"></select>
|
||||
<select class="input-xlarge norm-form-input" ng-model="current.type" ng-options="k as v.name for (k, v) in types" ng-change="typeChanged()"></select>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
|
@ -1,53 +1,53 @@
|
||||
<br>
|
||||
<h4>Http settings</h4>
|
||||
<div class="tight-form-container">
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 80px">
|
||||
<div class="norm-form-container">
|
||||
<div class="norm-form">
|
||||
<ul class="norm-form-list">
|
||||
<li class="norm-form-item" style="width: 80px">
|
||||
Url
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" class="tight-form-input input-xlarge" ng-model='current.url' placeholder="http://my.server.com:8080" ng-pattern="/^(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?$/" required></input>
|
||||
<input type="text" class="norm-form-input input-xlarge" ng-model='current.url' placeholder="http://my.server.com:8080" ng-pattern="/^(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?$/" required></input>
|
||||
</li>
|
||||
<li class="tight-form-item">
|
||||
<li class="norm-form-item">
|
||||
Access <tip>Direct = url is used directly from browser, Proxy = Grafana backend will proxy the request</tip>
|
||||
</li>
|
||||
<li>
|
||||
<select class="input-medium tight-form-input" ng-model="current.access" ng-options="f for f in ['direct', 'proxy']"></select>
|
||||
<select class="input-medium norm-form-input" ng-model="current.access" ng-options="f for f in ['direct', 'proxy']"></select>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 80px">
|
||||
<div class="norm-form">
|
||||
<ul class="norm-form-list">
|
||||
<li class="norm-form-item" style="width: 80px">
|
||||
Http Auth
|
||||
</li>
|
||||
<li class="tight-form-item">
|
||||
<li class="norm-form-item">
|
||||
<editor-checkbox text="Basic Auth" model="current.basicAuth"></editor-checkbox>
|
||||
</li>
|
||||
<li class="tight-form-item">
|
||||
<li class="norm-form-item">
|
||||
<editor-checkbox text="With Credentials" model="current.withCredentials"></editor-checkbox>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form" ng-if="current.basicAuth">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 80px">
|
||||
<div class="norm-form" ng-if="current.basicAuth">
|
||||
<ul class="norm-form-list">
|
||||
<li class="norm-form-item" style="width: 80px">
|
||||
<i class="fa fa-remove invisible"></i>
|
||||
</li>
|
||||
<li class="tight-form-item">
|
||||
<li class="norm-form-item">
|
||||
User
|
||||
</li>
|
||||
<li ng-if="current.basicAuth">
|
||||
<input type="text" class="tight-form-input input-medium" style="width: 136px" ng-model='current.basicAuthUser' placeholder="user" required></input>
|
||||
<input type="text" class="norm-form-input input-medium" style="width: 136px" ng-model='current.basicAuthUser' placeholder="user" required></input>
|
||||
</li>
|
||||
<li class="tight-form-item" style="width: 66px" ng-if="current.basicAuth">
|
||||
<li class="norm-form-item" style="width: 66px" ng-if="current.basicAuth">
|
||||
Password
|
||||
</li>
|
||||
<li ng-if="current.basicAuth">
|
||||
<input type="password" class="tight-form-input input-medium" ng-model='current.basicAuthPassword' placeholder="password" required></input>
|
||||
<input type="password" class="norm-form-input input-medium" ng-model='current.basicAuthPassword' placeholder="password" required></input>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
|
@ -33,7 +33,7 @@ body {
|
||||
height: 100%;
|
||||
//#gradient > .vertical (@bodyBackground, #252A30);
|
||||
//background: @bodyBackground;
|
||||
background: @bodyBackground;
|
||||
background: @nonDashBodyBackground;
|
||||
// url('../img/cubes.png') repeat right top;
|
||||
}
|
||||
|
||||
|
@ -18,8 +18,8 @@
|
||||
}
|
||||
|
||||
.filter-table tr {
|
||||
background: @grafanaPanelBackground;
|
||||
border-bottom: 2px solid @bodyBackground;
|
||||
background: @grafanaListBackground;
|
||||
border-bottom: 2px solid @nonDashBodyBackground;
|
||||
}
|
||||
|
||||
.filter-table th {
|
||||
|
@ -12,6 +12,7 @@
|
||||
@import "panel.less";
|
||||
@import "forms.less";
|
||||
@import "tightform.less";
|
||||
@import "normform.less";
|
||||
@import "sidemenu.less";
|
||||
@import "navbar.less";
|
||||
@import "gfbox.less";
|
||||
@ -405,6 +406,6 @@
|
||||
border-image: linear-gradient(to right, rgba(255,213,0,1) 0%, rgba(255,68,0,1) 99%, rgba(255,68,0,1) 100%);
|
||||
border-image-slice: 1;
|
||||
border-bottom: 2px solid transparent;
|
||||
padding: 1.2rem 3rem 0.8rem 3rem;
|
||||
padding: 1.2rem .2rem .4rem .2rem;
|
||||
}
|
||||
}
|
||||
|
@ -53,6 +53,7 @@
|
||||
// Scaffolding
|
||||
// -------------------------
|
||||
@bodyBackground: rgb(22,22,22);
|
||||
@nonDashBodyBackground: @grayDarker;
|
||||
@textColor: @grayLighter;
|
||||
|
||||
// Links
|
||||
@ -156,6 +157,8 @@
|
||||
@inputDisabledBackground: #555;
|
||||
@formActionsBackground: transparent;
|
||||
@inputHeight: @baseLineHeight + 10px; // base line-height + 8px vertical padding + 2px top/bottom border
|
||||
@labelBackground: @grayDark;
|
||||
|
||||
|
||||
// Sidemenu
|
||||
// -------------------------
|
||||
|
@ -33,9 +33,9 @@
|
||||
|
||||
// Status colors
|
||||
// -------------------------
|
||||
@online: #10a345;
|
||||
@warn: #ffc03c;
|
||||
@critical: #ed2e18;
|
||||
@online: #01A64F;
|
||||
@warn: #F79520;
|
||||
@critical: #EC2128;
|
||||
|
||||
// grafana Variables
|
||||
// -------------------------
|
||||
@ -66,6 +66,7 @@
|
||||
// Scaffolding
|
||||
// -------------------------
|
||||
@bodyBackground: #EFEFEF;
|
||||
@nonDashBodyBackground: @grayLighter;
|
||||
@textColor: @gray;
|
||||
|
||||
// Links
|
||||
@ -170,6 +171,8 @@
|
||||
@formActionsBackground: #f5f5f5;
|
||||
@inputHeight: @baseLineHeight + 10px; // base line-height + 8px vertical padding + 2px top/bottom border
|
||||
@inputText: #020202;
|
||||
@labelBackground: #f8f8f8;
|
||||
|
||||
|
||||
// Sidemenu
|
||||
// -------------------------
|
||||
|
Loading…
Reference in New Issue
Block a user