|
|
@@ -0,0 +1,242 @@
|
|
|
+.norm-form {
|
|
|
+ border-top: 3px solid @nonDashBodyBackground;
|
|
|
+ border-left: 3px solid @nonDashBodyBackground;
|
|
|
+ border-right: 3px solid @nonDashBodyBackground;
|
|
|
+ background: transparent;
|
|
|
+
|
|
|
+ &.last {
|
|
|
+ border-bottom: 1px solid @nonDashBodyBackground;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.borderless {
|
|
|
+ background: transparent;
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .checkbox-label {
|
|
|
+ display: inline;
|
|
|
+ padding-right: 4px;
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-container-no-item-borders {
|
|
|
+ border: 1px solid @nonDashBodyBackground;
|
|
|
+ border-bottom: none;
|
|
|
+
|
|
|
+ .norm-form, .norm-form-item, [type=text].norm-form-input, [type=text].norm-form-clear-input {
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+.spaced-form {
|
|
|
+ .norm-form {
|
|
|
+ margin: 7px 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.borderless {
|
|
|
+ .norm-form-item,
|
|
|
+ .norm-form-input {
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-container {
|
|
|
+ border-bottom: 1px solid @nonDashBodyBackground;
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-btn {
|
|
|
+ padding: 7px 12px;
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-list {
|
|
|
+ list-style: none;
|
|
|
+ margin: 0;
|
|
|
+ >li {
|
|
|
+ float: left;
|
|
|
+ background: @labelBackground;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-flex-wrapper {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ float: none !important;
|
|
|
+}
|
|
|
+
|
|
|
+.grafana-metric-options {
|
|
|
+ margin-top: 25px;
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-item {
|
|
|
+ padding: 8px 7px;
|
|
|
+ display: inline-block;
|
|
|
+ font-weight: normal;
|
|
|
+ border-right: 3px solid @nonDashBodyBackground;
|
|
|
+ color: @grayLighter;
|
|
|
+ display: inline-block;
|
|
|
+ .small;
|
|
|
+
|
|
|
+ .has-open-function & {
|
|
|
+ padding-top: 25px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .norm-form-disabled & {
|
|
|
+ color: @grafanaTargetColorHide;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:hover, &:focus {
|
|
|
+ text-decoration: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ &a:hover {
|
|
|
+ background: @grafanaTargetFuncBackground;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.last {
|
|
|
+ border-right: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+.norm-form-item-icon {
|
|
|
+ i {
|
|
|
+ width: 15px;
|
|
|
+ text-align: center;
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-func {
|
|
|
+ background: @grafanaTargetFuncBackground;
|
|
|
+ > a {
|
|
|
+ color: @grafanaTargetColor;
|
|
|
+ }
|
|
|
+ > a:hover {
|
|
|
+ color: @linkColor;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.show-function-controls {
|
|
|
+ padding-top: 5px;
|
|
|
+ min-width: 100px;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+input[type=text].norm-form-func-param {
|
|
|
+ background: transparent;
|
|
|
+ border: none;
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+input[type=text].norm-form-clear-input {
|
|
|
+ padding: 8px 7px;
|
|
|
+ border: none;
|
|
|
+ margin: 0px;
|
|
|
+ background: transparent;
|
|
|
+ color: @grafanaTargetColor;
|
|
|
+ border-radius: 0;
|
|
|
+ border-right: 2px solid @nonDashBodyBackground;
|
|
|
+}
|
|
|
+
|
|
|
+[type=text],
|
|
|
+[type=email],
|
|
|
+[type=number],
|
|
|
+[type=password] {
|
|
|
+ &.norm-form-input {
|
|
|
+ border: none;
|
|
|
+ border-right: 2px solid @nonDashBodyBackground;
|
|
|
+ margin: 0px;
|
|
|
+ border-radius: 0;
|
|
|
+ padding: 8px 6px;
|
|
|
+ height: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ &.last {
|
|
|
+ border-right: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+input[type=checkbox].norm-form-checkbox {
|
|
|
+ margin: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-textarea {
|
|
|
+ height: 200px;
|
|
|
+ margin: 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+select.norm-form-input {
|
|
|
+ border: none;
|
|
|
+ border-right: 1px solid @grafanaTargetSegmentBorder;
|
|
|
+ margin: 0px;
|
|
|
+ border-radius: 0;
|
|
|
+ height: 36px;
|
|
|
+ padding: 9px 3px;
|
|
|
+ &.last {
|
|
|
+ border-right: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-func-controls {
|
|
|
+ display: none;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ .fa-arrow-left {
|
|
|
+ float: left;
|
|
|
+ position: relative;
|
|
|
+ top: 2px;
|
|
|
+ }
|
|
|
+ .fa-arrow-right {
|
|
|
+ float: right;
|
|
|
+ position: relative;
|
|
|
+ top: 2px;
|
|
|
+ }
|
|
|
+ .fa-remove {
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-radio {
|
|
|
+ input[type=radio] {
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+ label {
|
|
|
+ display: inline;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-section {
|
|
|
+ margin-bottom: 20px;
|
|
|
+ margin-right: 40px;
|
|
|
+ vertical-align: top;
|
|
|
+ display: inline-block;
|
|
|
+ .norm-form {
|
|
|
+ margin-left: 20px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-align {
|
|
|
+ padding-left: 66px;
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-item-large { width: 115px; }
|
|
|
+.norm-form-item-xlarge { width: 150px; }
|
|
|
+.norm-form-item-xxlarge { width: 200px; }
|
|
|
+
|
|
|
+.norm-form-input.norm-form-item-xxlarge {
|
|
|
+ width: 215px;
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-auto {
|
|
|
+ width: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.norm-form-inner-box {
|
|
|
+ margin: 20px 0 20px 148px;
|
|
|
+ display: inline-block;
|
|
|
+}
|