Updated Search widget
Migrated from 3rd party search service swiftype to open source SOLR due to cost increase. Change-Id: I7f07ebb0014a60213e0ab48056183445f3217e4b
This commit is contained in:
parent
4fb78b7ead
commit
31c3a65183
|
@ -10,6 +10,9 @@
|
|||
<!-- Custom CSS -->
|
||||
<link href="{{pathto('_static/css/combined.css', 1)}}" rel="stylesheet">
|
||||
|
||||
<!-- Search CSS -->
|
||||
<link href="{{pathto('_static/css/search.css', 1)}}" rel="stylesheet">
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
{% else %}{# a template was rendered directly #}
|
||||
<!-- TEMPLATE_NAME: {{pagename}} -->
|
||||
{% endif %}
|
||||
{% include 'swiftype_search_install.html' %}
|
||||
{% include 'os_search_install.html' %}
|
||||
<nav class="navbar navbar-default" role="navigation">
|
||||
<div class="container">
|
||||
<!-- Brand and toggle get grouped for better mobile display -->
|
||||
|
@ -19,14 +19,9 @@
|
|||
</div>
|
||||
<div class="search-icon show"><i class="fa fa-search"></i> Search</div></div>
|
||||
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
||||
<div class="search-container tiny">
|
||||
{% include 'swiftype_search.html' %}
|
||||
<i class="fa fa-times close-search"></i>
|
||||
</div>
|
||||
{% include 'os_search.html' %}
|
||||
<ul class="nav navbar-nav navbar-main show">
|
||||
<li>
|
||||
{% include 'swiftype_search_mobile.html' %}
|
||||
</li>
|
||||
{% include 'os_search_mobile.html' %}
|
||||
<li>
|
||||
<a href="https://www.openstack.org/software/" class="drop" id="dropdownMenuSoftware">Software <i class="fa fa-caret-down"></i></a>
|
||||
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenuSoftware">
|
||||
|
|
|
@ -0,0 +1,3 @@
|
|||
<div class="search-container tiny">
|
||||
<div class="openstack-search-bar" data-baseUrl="search.openstack.org" data-context="docs-openstack"></div>
|
||||
</div>
|
|
@ -0,0 +1,10 @@
|
|||
<script>
|
||||
(function (window, document) {
|
||||
var loader = function () {
|
||||
var script = document.createElement("script"), tag = document.getElementsByTagName("script")[0];
|
||||
script.src = "https://search.openstack.org/widget/embed.min.js?t="+Date.now();
|
||||
tag.parentNode.insertBefore(script, tag);
|
||||
};
|
||||
window.addEventListener ? window.addEventListener("load", loader, false) : window.attachEvent("onload", loader);
|
||||
})(window, document);
|
||||
</script>
|
|
@ -0,0 +1,3 @@
|
|||
<li class="search-container-mobile">
|
||||
<div class="openstack-search-bar" data-baseUrl="search.openstack.org" data-context="docs-openstack"></div>
|
||||
</li>
|
|
@ -776,22 +776,6 @@ span.message {
|
|||
font-weight: bold;
|
||||
color: #CE332C; }
|
||||
|
||||
.gsc-control-cse {
|
||||
padding: 0px !important; }
|
||||
|
||||
#gcse {
|
||||
width: 80%;
|
||||
height: 60px; }
|
||||
|
||||
input.gsc-search-button, input.gsc-search-button:hover, input.gsc-search-button:focus {
|
||||
background: #C43422 !important;
|
||||
border: none !important; }
|
||||
|
||||
.gsc-input-box {
|
||||
border-color: #D3E9EF !important; }
|
||||
|
||||
.gs-visibleUrl, .gs-visibleUrl-long {
|
||||
color: #A5A5A5 !important; }
|
||||
|
||||
.roundedButton-margin {
|
||||
margin-left: 5px; }
|
||||
|
@ -960,175 +944,6 @@ i.fa-caret-right {
|
|||
height: 3px;
|
||||
border-radius: 3px; }
|
||||
|
||||
.search-container {
|
||||
position: relative;
|
||||
display: none;
|
||||
float: left;
|
||||
width: 84%; }
|
||||
|
||||
@media (min-width: 768px) and (max-width: 1200px) {
|
||||
.search-container
|
||||
{
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px), only screen and (max-device-width: 1024px) {
|
||||
.search-container
|
||||
{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.search-icon {
|
||||
display: none;
|
||||
padding: 17px 20px 16px;
|
||||
float: left;
|
||||
text-transform: uppercase;
|
||||
color: #8a959e;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.search-icon:hover {
|
||||
cursor: pointer;
|
||||
color: #8a959e;
|
||||
}
|
||||
|
||||
.search-icon i {
|
||||
margin-right: 5px;
|
||||
color: #8a959e;
|
||||
}
|
||||
|
||||
@media (max-width: 767px), only screen and (max-device-width: 1024px) {
|
||||
.search-icon
|
||||
{
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1040px) {
|
||||
.header-search-text
|
||||
{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px), only screen and (max-device-width: 1024px) {
|
||||
.header-search-form
|
||||
{
|
||||
display: none;
|
||||
}
|
||||
.custom-search-box
|
||||
{
|
||||
position: relative !important;
|
||||
left: 0px !important;;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-search-box {
|
||||
color: #30739C !important;
|
||||
font-size: 12px !important;
|
||||
text-transform: lowercase !important;
|
||||
font-weight: 400 !important;
|
||||
width: 100% !important;
|
||||
position: relative;
|
||||
top: 15px;
|
||||
}
|
||||
|
||||
.custom-search-box-mobile
|
||||
{
|
||||
display: none !important;
|
||||
position: relative;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
@media (max-width: 767px), only screen and (max-device-width: 1024px) {
|
||||
.custom-search-box-mobile
|
||||
{
|
||||
display: block !important;
|
||||
}
|
||||
.custom-search-box {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.header-search, .custom-search-box, .custom-search-box-mobile {
|
||||
border: 2px solid #dae5ee !important;
|
||||
border-radius: 4px !important;
|
||||
height: 37px !important;
|
||||
margin: 7px 0 0 0 !important;
|
||||
padding: 0 !important;
|
||||
padding-left: 10px !important;
|
||||
background: #fff !important;
|
||||
width: 100% !important;
|
||||
-webkit-transition: width 4s !important;
|
||||
transition: width 4s !important;
|
||||
-webkit-border-horizontal-spacing: 0 !important;
|
||||
-webkit-border-vertical-spacing: 0 !important;
|
||||
}
|
||||
|
||||
.header-search contenteditable .custom-search-box-mobile:hover, .custom-search-box-mobile:focus, .custom-search-box:hover, .custom-search-box:focus {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.header-search::-webkit-input-placeholder, .custom-search-box::-webkit-input-placeholder,custom-search-box-mobile::-webkit-input-placeholder {
|
||||
color: #C0CDDB;
|
||||
font-size: 12px;
|
||||
text-transform: lowercase;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.header-search:-moz-placeholder, .custom-search-box-mobile:-moz-placeholder, custom-search-box:-moz-placeholder {
|
||||
/* Firefox 18- */
|
||||
color: #C0CDDB;
|
||||
font-size: 12px;
|
||||
text-transform: lowercase;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.header-search::-moz-placeholder, .custom-search-box::-moz-placeholder, custom-search-box-mobile::-moz-placeholder {
|
||||
/* Firefox 19+ */
|
||||
color: #C0CDDB;
|
||||
font-size: 12px;
|
||||
text-transform: lowercase;
|
||||
font-weight: 400; }
|
||||
|
||||
.header-search:-ms-input-placeholder, .custom-search-box:-ms-input-placeholder, custom-search-box-mobile:-ms-input-placeholder {
|
||||
color: #C0CDDB;
|
||||
font-size: 12px;
|
||||
text-transform: lowercase;
|
||||
font-weight: 400; }
|
||||
|
||||
.header-search:focus, .custom-search-box:focus, .custom-search-box-mobile:focus {
|
||||
border-radius: 4px;
|
||||
outline: none;
|
||||
border: 2px solid #30739C !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.close-search {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
right: 10px;
|
||||
color: #dae5ee;
|
||||
z-index: 1001;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.close-search:hover
|
||||
{
|
||||
color: #30739C;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@media (max-width: 767px), only screen and (max-device-width: 1024px) {
|
||||
.close-search
|
||||
{
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.show
|
||||
{
|
||||
display: block;
|
||||
|
|
|
@ -0,0 +1,49 @@
|
|||
.search-container-mobile
|
||||
{
|
||||
display: none !important;
|
||||
position: relative !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.search-container {
|
||||
position: relative;
|
||||
display: none;
|
||||
float: left;
|
||||
width: 84%;
|
||||
top:10px;
|
||||
}
|
||||
|
||||
@media (max-width: 767px), only screen and (max-device-width: 1024px) {
|
||||
.search-container-mobile
|
||||
{
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.search-icon{
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.search-container {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.search-icon {
|
||||
display: none;
|
||||
padding: 17px 20px 16px;
|
||||
float: left;
|
||||
text-transform: uppercase;
|
||||
color: #8a959e;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.search-icon:hover {
|
||||
cursor: pointer;
|
||||
color: #8a959e;
|
||||
}
|
||||
|
||||
.search-icon i {
|
||||
margin-right: 5px;
|
||||
color: #8a959e;
|
||||
}
|
|
@ -1,21 +1,3 @@
|
|||
// Open header search bar
|
||||
$(function() {
|
||||
$(".search-icon").click(function() {
|
||||
$(".navbar-main").toggleClass("show");
|
||||
$(".search-container").toggleClass("show");
|
||||
$(".search-icon").toggleClass("show");
|
||||
$('#gsc-i-id1').focus();
|
||||
});
|
||||
});
|
||||
|
||||
// Close header search bar
|
||||
$(function() {
|
||||
$(".close-search").click(function() {
|
||||
$(".navbar-main").toggleClass("show");
|
||||
$(".search-container").toggleClass("show")
|
||||
$(".search-icon").toggleClass("show");
|
||||
});
|
||||
});
|
||||
|
||||
// Open header drop downs on hover
|
||||
jQuery(document).ready(function(){
|
||||
|
@ -29,7 +11,20 @@ jQuery(document).ready(function(){
|
|||
} else {
|
||||
$('ul.navbar-main li ul.dropdown-menu').removeClass('dropdown-hover');
|
||||
}
|
||||
|
||||
$(document).on('click', ".ossw-search-bar-close", function() {
|
||||
$(".navbar-main").toggleClass("show");
|
||||
$(".search-container").toggleClass("show");
|
||||
$(".search-icon").toggleClass("show");
|
||||
});
|
||||
|
||||
$(document).on('click', ".search-icon", function() {
|
||||
$(".navbar-main").toggleClass("show");
|
||||
$(".search-container").toggleClass("show");
|
||||
$(".search-icon").toggleClass("show");
|
||||
});
|
||||
});
|
||||
|
||||
jQuery(window).resize(function () {
|
||||
if (jQuery(window).width() > 767) {
|
||||
$('ul.navbar-main li ul.dropdown-menu').addClass('dropdown-hover');
|
||||
|
@ -59,9 +54,3 @@ jQuery(window).resize(function () {
|
|||
}
|
||||
});
|
||||
|
||||
// Show placeholder text in Google Search
|
||||
setTimeout( function() {
|
||||
$(".gsc-input").attr("placeholder", "search docs.openstack.org");
|
||||
}, 1000 );
|
||||
|
||||
|
||||
|
|
|
@ -1,3 +0,0 @@
|
|||
<form class="docs-main-search-form">
|
||||
<input type="text" class="st-default-search-input custom-search-box" placeholder="Search OpenStack">
|
||||
</form>
|
|
@ -1,8 +0,0 @@
|
|||
<script type="text/javascript">
|
||||
(function(w,d,t,u,n,s,e){w['SwiftypeObject']=n;w[n]=w[n]||function(){
|
||||
(w[n].q=w[n].q||[]).push(arguments);};s=d.createElement(t);
|
||||
e=d.getElementsByTagName(t)[0];s.async=1;s.src=u;e.parentNode.insertBefore(s,e);
|
||||
})(window,document,'script','//s.swiftypecdn.com/install/v2/st.js','_st');
|
||||
|
||||
_st('install','aDn5L_vgZ2yzRcE893kK','2.0.0');
|
||||
</script>
|
|
@ -1,3 +0,0 @@
|
|||
<li>
|
||||
<input type="text" class="st-default-search-input custom-search-box-mobile" placeholder="Search OpenStack">
|
||||
</li>
|
Loading…
Reference in New Issue