CSS code for tagging

This commit is contained in:
Jeremy Goecks
2009-08-28 15:29:47 -04:00
parent df95324e7f
commit d0acb4372f
2 changed files with 266 additions and 0 deletions
@@ -0,0 +1,133 @@
/****************************************************************************/
/* JQuery autocomplete code */
/****************************************************************************/
.ac_results {
padding: 0px;
border: 1px solid black;
background-color: white;
overflow: hidden;
z-index: 99999;
}
.ac_results ul {
width: 100%;
list-style-position: outside;
list-style: none;
padding: 0;
margin: 0;
}
.ac_results li {
padding: 2px 5px;
cursor: default;
display: block;
/*
if width will be 100% horizontal scrollbar will apear
when scroll mode will be used
*/
/*width: 100%;*/
/* font: menu; */
font-size: 12px;
/*
it is very important, if line-height not setted or setted
in relative units scroll will be broken in firefox
*/
line-height: 16px;
overflow: hidden;
}
.ac_loading {
background: white url('indicator.gif') right center no-repeat;
}
.ac_odd {
background-color: #fff; /* #eee */
margin-left: 0.3em;
}
.ac_even {
margin-left: 0.3em;
}
.ac_over {
background-color: #0A246A;
color: white;
}
.ac_header {
font-style: normal;
color: gray;
border-bottom: 0.1em solid gray;
}
/****************************************************************************/
/* Custom code for supporting tags */
/****************************************************************************/
.tag-area {
width: 100%;
cursor: pointer;
border: solid 1px #eee;
}
.active-tag-area {
background-color: white;
}
.toggle-link
{
font-weight: bold;
padding: 0.3em;
margin-bottom: 1em;
width: 100%;
padding: 0.2em 0em 0.2em 0em;
}
.tag-button {
width: auto;
color: #444;
text-decoration: none;
display: inline-block;
cursor: pointer;
margin: 0.2em;
border: 0;
padding: 0.1em 0.5em 0.1em 0.5em;
-moz-border-radius: .5em;
-webkit-border-radius: .5em;
border-radius: .5em;
background:#bbb;
}
.tag-button img
{
padding-left: 0.4em;
}
.tag-button .tag-name:hover
{
color: white;
}
.add-tag-button
{
margin-bottom: 0.3em;
vertical-align: middle;
padding: 0.3em;
}
.add-tag-button:hover
{
cursor: pointer;
}
.tag-input {
vertical-align: bottom;
border: none;
outline: none;
}
.delete-tag-img
{
margin-left: 0.3em
}
@@ -0,0 +1,133 @@
/****************************************************************************/
/* JQuery autocomplete code */
/****************************************************************************/
.ac_results {
padding: 0px;
border: 1px solid black;
background-color: white;
overflow: hidden;
z-index: 99999;
}
.ac_results ul {
width: 100%;
list-style-position: outside;
list-style: none;
padding: 0;
margin: 0;
}
.ac_results li {
padding: 2px 5px;
cursor: default;
display: block;
/*
if width will be 100% horizontal scrollbar will apear
when scroll mode will be used
*/
/*width: 100%;*/
/* font: menu; */
font-size: 12px;
/*
it is very important, if line-height not setted or setted
in relative units scroll will be broken in firefox
*/
line-height: 16px;
overflow: hidden;
}
.ac_loading {
background: white url('indicator.gif') right center no-repeat;
}
.ac_odd {
background-color: #fff; /* #eee */
margin-left: 0.3em;
}
.ac_even {
margin-left: 0.3em;
}
.ac_over {
background-color: #0A246A;
color: white;
}
.ac_header {
font-style: normal;
color: gray;
border-bottom: 0.1em solid gray;
}
/****************************************************************************/
/* Custom code for supporting tags */
/****************************************************************************/
.tag-area {
width: 100%;
cursor: pointer;
border: solid 1px #eee;
}
.active-tag-area {
background-color: white;
}
.toggle-link
{
font-weight: bold;
padding: 0.3em;
margin-bottom: 1em;
width: 100%;
padding: 0.2em 0em 0.2em 0em;
}
.tag-button {
width: auto;
color: #444;
text-decoration: none;
display: inline-block;
cursor: pointer;
margin: 0.2em;
border: 0;
padding: 0.1em 0.5em 0.1em 0.5em;
-moz-border-radius: .5em;
-webkit-border-radius: .5em;
border-radius: .5em;
background:#bbb;
}
.tag-button img
{
padding-left: 0.4em;
}
.tag-button .tag-name:hover
{
color: white;
}
.add-tag-button
{
margin-bottom: 0.3em;
vertical-align: middle;
padding: 0.3em;
}
.add-tag-button:hover
{
cursor: pointer;
}
.tag-input {
vertical-align: bottom;
border: none;
outline: none;
}
.delete-tag-img
{
margin-left: 0.3em
}