Improved appearance of the document tag widget
This commit is contained in:
@@ -41,6 +41,66 @@
|
||||
right: 20px;
|
||||
left: auto;
|
||||
}
|
||||
|
||||
.tags {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
right: 24px;
|
||||
bottom: -12px;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.tags li {
|
||||
float:left;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
position:relative;
|
||||
font-size: 11px;
|
||||
margin-left: 15px;
|
||||
padding: 0 5px 0 15px;
|
||||
background: #0089e0;
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
-moz-border-radius-bottomright: 4px;
|
||||
-webkit-border-bottom-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
-moz-border-radius-topright: 4px;
|
||||
-webkit-border-top-right-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
|
||||
border-top-left-radius: 12px;
|
||||
-moz-border-radius-topleft: 12px;
|
||||
-webkit-border-top-left-radius: 12px;
|
||||
|
||||
border-bottom-left-radius: 12px;
|
||||
-moz-border-radius-bottomleft: 12px;
|
||||
-webkit-border-bottom-left-radius: 12px;
|
||||
|
||||
/*border:1px solid #ccc;*/
|
||||
border: 1px solid rgba(0, 0, 0, 0.4);
|
||||
-moz-box-shadow: 1px 1px 2px #888;
|
||||
-webkit-box-shadow: 1px 1px 2px #888;
|
||||
box-shadow: 1px 1px 2px #888;
|
||||
|
||||
text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #fff, 0 0 70px #fff, 0 0 80px #fff, 0 0 100px #fff, 0 0 150px #fff;
|
||||
}
|
||||
|
||||
.tags li:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 7px;
|
||||
left: 5px;
|
||||
float: left;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-moz-border-radius: 2px;
|
||||
-webkit-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
background: #fff;
|
||||
-moz-box-shadow: -1px -1px 2px #004977;
|
||||
-webkit-box-shadow: -1px -1px 2px #004977;
|
||||
box-shadow: -1px -1px 2px #004977;
|
||||
}
|
||||
</style>
|
||||
{% block stylesheets %}{% endblock %}
|
||||
{% endblock %}
|
||||
|
||||
@@ -7,7 +7,6 @@ def get_tags_inline_widget(document):
|
||||
A tag widget that includes the total tag count for a given document
|
||||
"""
|
||||
tags_template = []
|
||||
tag_block_template = u'<div style="padding: 0px 5px 0px 5px; border: 1px solid black; background: %s;">%s</div>'
|
||||
tag_count = document.tags.count()
|
||||
if tag_count:
|
||||
tags_template.append(u'<div class="tc">')
|
||||
@@ -15,8 +14,9 @@ def get_tags_inline_widget(document):
|
||||
'tag_string': _(u'Tags'), 'tag_count': tag_count})
|
||||
|
||||
for tag in document.tags.all():
|
||||
tags_template.append(tag_block_template % (tag.tagproperties_set.get().get_color_code(), tag.name))
|
||||
|
||||
tags_template.append(u'<ul class="tags"><li style="background: %s; margin-bottom: 2px;">%s</li></ul>' % (tag.tagproperties_set.get().get_color_code(), tag.name))
|
||||
|
||||
tags_template.append(u'<div style="clear:both;"></div>')
|
||||
tags_template.append(u'</div>')
|
||||
return mark_safe(u''.join(tags_template))
|
||||
|
||||
@@ -27,15 +27,15 @@ def get_tags_inline_widget_simple(document):
|
||||
given document
|
||||
"""
|
||||
tags_template = []
|
||||
tag_block_template = u'<div style="padding: 0px 5px 0px 5px; border: 1px solid black; background: %s;">%s</div>'
|
||||
|
||||
tag_count = document.tags.count()
|
||||
if tag_count:
|
||||
tags_template.append(u'<div class="tc">')
|
||||
|
||||
tags_template.append('<ul class="tags">')
|
||||
for tag in document.tags.all():
|
||||
tags_template.append(tag_block_template % (tag.tagproperties_set.get().get_color_code(), tag.name))
|
||||
tags_template.append('<li style="background: %s">%s</li>' % (tag.tagproperties_set.get().get_color_code(), tag.name))
|
||||
|
||||
tags_template.append('</ul>')
|
||||
|
||||
tags_template.append(u'</div>')
|
||||
return mark_safe(u''.join(tags_template))
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user