tyler.durden/icingaweb2
1
0
Fork 0
mirror of https://github.com/Icinga/icingaweb2.git synced 2025-07-29 08:44:10 +02:00
Code Issues Packages Projects Releases Wiki Activity

CSS: Move controls styles to controls.less

Browse Source 
refs #3676
This commit is contained in:
Florian Strohmaier 2019-06-26 17:06:06 +02:00 committed by Johannes Meyer
parent 54ba112d64
commit e04d42b7a9
2 changed files with 30 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
public/css/icinga/controls.less
View File

@ -23,6 +23,28 @@
} }
} }
.controls input.search,
input.search {
.transition(border 0.3s ease);
.transition(background-image 0.2s ease);
background-image: url(../img/icons/search.png);
background-repeat: no-repeat;
background-size: 1em 1em;
background-position: .25em center;
outline: none;
padding-left: 1.5em;
width: 20em;
&:focus {
background-image: url(../img/icons/search_icinga_blue.png);
}
&:focus:not([readonly]) {
border-color: @icinga-blue;
}
}
.backend-selection, .backend-selection,
.pagination-control, .pagination-control,
.selection-info, .selection-info,
@ -30,13 +52,6 @@
margin-bottom: 0.5em; margin-bottom: 0.5em;
} }
.backend-selection,
.pagination-control,
.sort-controls-container {
// Select controls may not respect font-size thus leading to improperly vertical alignment w/o big enough line-height
/*line-height: 2em;*/
}
.filter { .filter {
// Display filter control on a new line // Display filter control on a new line
clear: both; clear: both;
@ -146,7 +161,6 @@
.sort-controls-container { .sort-controls-container {
clear: right; clear: right;
float: right; float: right;
line-height: 1;
> * { > * {
vertical-align: middle; vertical-align: middle;

37
public/css/icinga/forms.less
View File

@ -125,9 +125,10 @@ select ~ .spinner:before {
form input[type="text"], form input[type="text"],
form input[type="password"], form input[type="password"],
form input[type="number"], form input[type="number"],
form input[type="datetime-local"],
form textarea, form textarea,
form select { form select {
background: @low-sat-blue; background-color: @low-sat-blue;
flex: 1; flex: 1;
} }
@ -173,8 +174,8 @@ form input {
input, input,
select { select {
line-height: 1.5em; line-height: 1em;
padding: 0 .5625em; padding: .3625em .5625em;
max-width: 16em; max-width: 16em;
} }
@ -206,28 +207,6 @@ form select:not([multiple]) {
specific input styles specific input styles
***********************************************************************************************************************/ ***********************************************************************************************************************/
input.search {
.transition(border 0.3s ease);
.transition(background-image 0.2s ease);
background: transparent url(../img/icons/search.png) no-repeat scroll 0.1em center;
background-size: 1em 1em;
border: none;
border-bottom: 1px solid @gray-light;
outline: none;
padding: @vertical-padding / 2 @horizontal-padding / 2;
padding-left: 1.5em;
width: 20em;
&:focus {
background-color: @body-bg-color;
background-image: url(../img/icons/search_icinga_blue.png);
}
&:focus:not([readonly]) {
border-color: @icinga-blue;
}
}
.link-button { .link-button {
.action-link(); .action-link();
// Reset defaults // Reset defaults
@ -448,21 +427,21 @@ input:checked + .toggle-slider:before {
***********************************************************************************************************************/ ***********************************************************************************************************************/
input:-moz-placeholder { // FF 18- input:-moz-placeholder { // FF 18-
color: @gray-light; color: @gray;
opacity: 1; opacity: 1;
} }
input::-moz-placeholder { // FF 19+ input::-moz-placeholder { // FF 19+
color: @gray-light; color: @gray;
opacity: 1; opacity: 1;
} }
input:-ms-input-placeholder { input:-ms-input-placeholder {
color: @gray-light; color: @gray;
} }
input::-webkit-input-placeholder { input::-webkit-input-placeholder {
color: @gray-light; color: @gray;
} }