WordPress Ajax Search Lite Mark-Up
WordPress Plugin Ajax Search lite less mark-up - ready to use more or less..
Snippet options
Download: Download snippet as wordpress-ajax-search-lite-mark-up.less.
Copy snippet: For this you need a free my code stock.com account.
Embed code : You will find the embed code for this snippet at the end of the page, if you want to embed it into a website or a blog!
#ajaxsearchlite1 {
padding: 0;
margin: 0;
.probox {
.relative;
z-index: 120;
/* Search Icon */
.promagnifier {
svg {
fill: rgb(74,134,232);
.allTrans;
}
svg:hover {
fill: rgb(182,232,74);
}
}
.promagnifier {
}
/* Search Settings / Filter */
.prosettings {
background: rgb(74, 134, 232);
svg {
fill: rgb(74,134,232);
.allTrans;
}
}
.prosettings:hover {
svg {
fill: rgb(182,232,74);
.allTrans;
}
}
/* Input field */
.proinput {
background: @white;
padding: 0;
margin-left: 15px;
padding-bottom: 2px;
input {
border-bottom: 1px solid @primary!important;
color: @primary!important;
font-size: 16px;
font-family: 'Roboto Condensed';
.allTrans;
}
input:hover {
border-bottom: 1px solid @highlight!important;
}
}
/* Input field */
.proinput {
background: @white;
}
/* Load Icon */
.proloading {
margin-right: 15px;
background: @white;
.asl_loader {
.asl_loader-inner {
border-color: @primary;
}
}
}
/* Close Icon */
.proclose {
margin-right: 15px;
background: @white;
svg {
fill: rgb(74,134,232);
background: @white;
.allTrans;
}
}
.proclose:hover {
svg {
fill: rgb(182,232,74);
}
}
}
}
div[id*="ajaxsearchlite"] {
.noBorder;
.noShadow;
.probox {
.proinput {
margin-left: 0;
}
}
}
Create a free my code stock.com account now.
my code stok.com is a free service, which allows you to save and manage code snippes of any kind and programming language. We provide many advantages for your daily work with code-snippets, also for your teamwork. Give it a try!
Find out more and register nowYou can customize the height of iFrame-Codes as needed! You can find more infos in our API Reference for iframe Embeds.