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

Merge branch 'feature/clear-search-field-11835'

Browse Source 
resolves #11835
This commit is contained in:
Eric Lippmann 2016-11-16 12:55:19 +01:00
commit 436cc89fb1
3 changed files with 68 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
application/views/scripts/layout/menu.phtml
View File

@ -6,11 +6,11 @@ $searchDashboard = new SearchDashboard();
$searchDashboard->setUser($this->Auth()->getUser()); $searchDashboard->setUser($this->Auth()->getUser());
if ($searchDashboard->search('dummy')->getPane('search')->hasDashlets()): ?> if ($searchDashboard->search('dummy')->getPane('search')->hasDashlets()): ?>
<form action="<?= $this->href('search') ?>" method="get" role="search"> <form action="<?= $this->href('search') ?>" method="get" role="search" class="search-control">
<input <input type="text" name="q" id="search" class="search search-input"
type="text" name="q" id="search" class="search" placeholder="<?= $this->translate('Search') ?> &hellip;" placeholder="<?= $this->translate('Search') ?> &hellip;"
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" required="required">
/> <button class="search-reset icon-cancel" type="reset"></button>
</form> </form>
<?php endif; ?> <?php endif; ?>
<?= $menuRenderer->setCssClass('primary-nav')->setElementTag('nav')->setHeading(t('Navigation')); ?> <?= $menuRenderer->setCssClass('primary-nav')->setElementTag('nav')->setHeading(t('Navigation')); ?>

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

@ -53,10 +53,6 @@ input::-webkit-input-placeholder {
color: inherit; color: inherit;
} }
input[placeholder] {
color: inherit;
}
input.search { input.search {
background: transparent url("../img/icons/search.png") no-repeat scroll 0.1em center; background: transparent url("../img/icons/search.png") no-repeat scroll 0.1em center;
background-size: 1em 1em; background-size: 1em 1em;

65
public/css/icinga/menu.less
View File

@ -167,7 +167,6 @@
} }
// Accessibility skip links // Accessibility skip links
.skip-links { .skip-links {
position: relative; position: relative;
ul { ul {
@ -178,13 +177,15 @@
display: block; display: block;
a, button[type="submit"] { a, button[type="submit"] {
background-color: @body-bg-color; background-color: @body-bg-color;
border: none;
left: -999px; left: -999px;
padding: @vertical-padding @horizontal-padding; padding: @vertical-padding @horizontal-padding;
position: absolute; position: absolute;
width: 100%; width: 100%;
z-index: 1;
&:focus { &:focus {
left: 0; left: 0;
outline: 1px dotted black; outline-offset: -3px;
} }
} }
button[type="submit"] { button[type="submit"] {
@ -198,3 +199,63 @@
bottom: 0 !important; bottom: 0 !important;
height: auto !important; height: auto !important;
} }
.search-control {
position: relative;
}
.search-reset {
background: none;
border: 0;
cursor: pointer;
display: none;
height: 100%;
padding: 0;
position: absolute;
right: 0;
top: 0;
user-select: none;
}
.search-reset:focus {
outline: 0;
}
// Override forms.less
input[type=text].search-input {
padding-right: 1.4em;
text-overflow: ellipsis;
}
.search-input:-moz-placeholder { // FF 18-
color: @gray-light;
}
.search-input::-moz-placeholder { // FF 19+
color: @gray-light;
}
.search-input:-ms-input-placeholder {
color: @gray-light;
}
.search-input::-webkit-input-placeholder {
color: @gray-light;
}
.search-input:valid ~ .search-reset {
animation-duration: .4s;
animation-name: search-reset-in;
display: block;
}
@keyframes search-reset-in {
0% {
opacity: 0;
transform: translate3d(-20%, 0, 0);
}
100% {
opacity: 1;
transform: none;
}
}