added default iconic.css for better autocomplete styling
This commit is contained in:
parent
7e072f5e88
commit
2438b51c1c
48
gazetteer/static/css/iconic.css
Normal file
48
gazetteer/static/css/iconic.css
Normal file
|
@ -0,0 +1,48 @@
|
|||
/*
|
||||
most of the css that makes it look good is in the jquery.autocomplete.css that comes with the autocomplete plugin.
|
||||
that formats the dropdown of search results.
|
||||
|
||||
one class is used on the html interface itself and that's the X that allows you to remove an item.
|
||||
here is the styling I use. add this to your main css file and season to taste.
|
||||
*/
|
||||
.iconic {
|
||||
background: #fff;
|
||||
color: #000;
|
||||
border: 1px solid #ddd;
|
||||
padding: 2px 4px;
|
||||
font-weight: bold;
|
||||
font-family: Courier;
|
||||
text-decoration: none;
|
||||
}
|
||||
.iconic:hover {
|
||||
text-decoration: none;
|
||||
color: #fff;
|
||||
background: #000;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input.ac_loading {
|
||||
background: #FFF url('../images/loading-indicator.gif') no-repeat;
|
||||
background-position: right;
|
||||
}
|
||||
|
||||
|
||||
/* change the X to an image */
|
||||
.results_on_deck .iconic, .results_on_deck .iconic:hover {
|
||||
float: left;
|
||||
background: url(../shared/images/Trashcan.gif) no-repeat;
|
||||
color: transparent;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* specific to a site I worked on. the formatted results were tables. I sized them and floated them left, next to the icon */
|
||||
.results_on_deck div table {
|
||||
float: left;
|
||||
width: 300px;
|
||||
border: 0;
|
||||
}
|
||||
/* and each div in the result clears to start a new row */
|
||||
.results_on_deck > div {
|
||||
clear: both;
|
||||
}
|
||||
|
|
@ -8,6 +8,7 @@
|
|||
<script type="text/javascript" src="/static/js/feature_admin.js"></script>
|
||||
<link rel="stylesheet" href="/static/css/feature_admin.css" />
|
||||
<link rel="stylesheet" href="/static/css/jquery.autocomplete.css" />
|
||||
<link rel="stylesheet" href="/static/css/iconic.css" />
|
||||
<script type="text/javascript">
|
||||
FEATURE_ID = {{ object_id }}
|
||||
</script>
|
||||
|
|
Loading…
Reference in New Issue
Block a user