diff --git a/src/plugins/timelion/public/_app.scss b/src/plugins/timelion/public/_app.scss
index 8b9078caba5a8..d8a6eb423a670 100644
--- a/src/plugins/timelion/public/_app.scss
+++ b/src/plugins/timelion/public/_app.scss
@@ -15,7 +15,69 @@
margin: $euiSizeM;
}
+.timApp__title {
+ display: flex;
+ align-items: center;
+ padding: $euiSizeM $euiSizeS;
+ font-size: $euiSize;
+ font-weight: $euiFontWeightBold;
+ border-bottom: 1px solid $euiColorLightShade;
+ flex-grow: 1;
+ background-color: $euiColorEmptyShade;
+}
+
.timApp__stats {
font-weight: $euiFontWeightRegular;
color: $euiColorMediumShade;
}
+
+.timApp__form {
+ display: flex;
+ align-items: flex-start;
+ margin-top: $euiSize;
+ margin-bottom: $euiSize;
+}
+
+.timApp__expression {
+ display: flex;
+ flex: 1;
+ margin-right: $euiSizeS;
+}
+
+.timApp__button {
+ margin-top: $euiSizeS;
+ padding: $euiSizeXS $euiSizeM;
+ font-size: $euiSize;
+ border: none;
+ border-radius: $euiSizeXS;
+ color: $euiColorEmptyShade;
+ background-color: $euiColorPrimary;
+}
+
+.timApp__button--secondary {
+ margin-top: $euiSizeS;
+ padding: $euiSizeXS $euiSizeM;
+ font-size: $euiSize;
+ border: 1px solid $euiColorPrimary;
+ border-radius: $euiSizeXS;
+ color: $euiColorPrimary;
+ width: 100%;
+}
+
+.timApp__sectionTitle {
+ margin-bottom: $euiSizeM;
+ font-size: 18px;
+ color: $euiColorDarkestShade;
+}
+
+.timApp__helpText {
+ margin-bottom: $euiSize;
+ font-size: 14px;
+ color: $euiColorDarkShade;
+}
+
+.timApp__label {
+ font-size: $euiSize;
+ line-height: 1.5;
+ font-weight: $euiFontWeightBold;
+}
diff --git a/src/plugins/timelion/public/directives/_form.scss b/src/plugins/timelion/public/directives/_form.scss
index 3fcf70700a864..370dd25f8263f 100644
--- a/src/plugins/timelion/public/directives/_form.scss
+++ b/src/plugins/timelion/public/directives/_form.scss
@@ -34,3 +34,51 @@ select.form-control {
.fullWidth {
width: 100%;
}
+
+.timDropdownWarning {
+ margin-bottom: $euiSize;
+ padding: $euiSizeXS $euiSizeS;
+ color: $euiColorDarkestShade;
+ border-left: solid 2px $euiColorDanger;
+ font-size: $euiSizeM;
+}
+
+.timFormCheckbox {
+ display: flex;
+ align-items: center;
+ line-height: 1.5;
+ position: relative;
+}
+
+.timFormCheckbox__input {
+ appearance: none;
+ background-color: $euiColorLightestShade;
+ border: 1px solid $euiColorLightShade;
+ border-radius: $euiSizeXS;
+ width: $euiSize;
+ height: $euiSize;
+ font-size: $euiSizeM;
+ transition: background-color .1s linear;
+}
+
+.timFormCheckbox__input:checked {
+ border-color: $euiColorPrimary;
+ background-color: $euiColorPrimary;
+}
+
+.timFormCheckbox__icon {
+ position: absolute;
+ top: 0;
+ left: 2px;
+}
+
+.timFormTextarea {
+ padding: $euiSizeXS $euiSizeM;
+ font-size: $euiSize;
+ line-height: 1.5;
+ color: $euiColorDarkestShade;
+ background-color: $euiFormBackgroundColor;
+ border: 1px solid $euiColorLightShade;
+ border-radius: $euiSizeXS;
+ transition: border-color .1s linear;
+}
diff --git a/src/plugins/timelion/public/directives/_saved_object_finder.scss b/src/plugins/timelion/public/directives/_saved_object_finder.scss
index e1a055a5f49e9..3a2489afb5721 100644
--- a/src/plugins/timelion/public/directives/_saved_object_finder.scss
+++ b/src/plugins/timelion/public/directives/_saved_object_finder.scss
@@ -27,6 +27,42 @@
saved-object-finder {
+ .timSearchBar {
+ display: flex;
+ align-items: center;
+ }
+
+ .timSearchBar__section {
+ position: relative;
+ margin-right: $euiSize;
+ flex: 1;
+ }
+
+ .timSearchBar__icon {
+ position: absolute;
+ top: $euiSizeS;
+ left: $euiSizeS;
+ font-size: $euiSize;
+ color: $euiColorDarkShade;
+ }
+
+ .timSearchBar__input {
+ padding: $euiSizeS $euiSizeM;
+ color: $euiColorDarkestShade;
+ background-color: $euiColorEmptyShade;
+ border: 1px solid $euiColorLightShade;
+ border-radius: $euiSizeXS;
+ transition: border-color .1s linear;
+ padding-left: $euiSizeXL;
+ width: 100%;
+ font-size: $euiSize;
+ }
+
+ .timSearchBar__pagecount {
+ font-size: $euiSize;
+ color: $euiColorDarkShade;
+ }
+
.list-sort-button {
border-top-left-radius: 0;
border-top-right-radius: 0;
@@ -34,6 +70,7 @@ saved-object-finder {
padding: $euiSizeS $euiSize;
font-weight: $euiFontWeightRegular;
background-color: $euiColorLightestShade;
+ margin-top: $euiSize;
}
.li-striped {
diff --git a/src/plugins/timelion/public/directives/cells/_cells.scss b/src/plugins/timelion/public/directives/cells/_cells.scss
index 899bf984e72c8..6cd71378a81de 100644
--- a/src/plugins/timelion/public/directives/cells/_cells.scss
+++ b/src/plugins/timelion/public/directives/cells/_cells.scss
@@ -33,7 +33,6 @@
text-align: center;
width: $euiSizeL;
height: $euiSizeL;
- line-height: $euiSizeL;
border-radius: $euiSizeL / 2;
border: $euiBorderThin;
background-color: $euiColorLightestShade;
diff --git a/src/plugins/timelion/public/directives/cells/cells.html b/src/plugins/timelion/public/directives/cells/cells.html
index 6be1b089d2deb..f90b85abaf920 100644
--- a/src/plugins/timelion/public/directives/cells/cells.html
+++ b/src/plugins/timelion/public/directives/cells/cells.html
@@ -25,7 +25,7 @@
tooltip-append-to-body="1"
aria-label="{{ ::'timelion.cells.actions.removeAriaLabel' | i18n: { defaultMessage: 'Remove chart' } }}"
>
-
+