admin: evolve backoffice style (#7454)
This commit is contained in:
parent
ccdcfcea60
commit
8f2e98d54d
|
|
@ -175,6 +175,8 @@ class CategoriesDirectory(Directory):
|
|||
html_top('categories', title = _('Categories'))
|
||||
r = TemplateIO(html=True)
|
||||
|
||||
r += htmltext('<div class="bo-block">')
|
||||
r += htmltext('<h2>%s</h2>') % _('Categories')
|
||||
r += htmltext('<ul class="biglist sortable" id="category-list">')
|
||||
categories = Category.select()
|
||||
Category.sort_by_position(categories)
|
||||
|
|
@ -185,6 +187,7 @@ class CategoriesDirectory(Directory):
|
|||
r += htmltext('<p class="details">')
|
||||
r += htmltext('</p></li>')
|
||||
r += htmltext('</ul>')
|
||||
r += htmltext('</div>')
|
||||
return r.getvalue()
|
||||
|
||||
def get_sidebar(self):
|
||||
|
|
|
|||
|
|
@ -1464,12 +1464,12 @@ class FormsDirectory(AccessControlled, Directory):
|
|||
else:
|
||||
r += htmltext('<li>')
|
||||
r += htmltext('<strong class="label"><a href="%s/">%s</a></strong>') % (formdef.id, formdef.name)
|
||||
r += htmltext('<p class="details">')
|
||||
if formdef.disabled and formdef.disabled_redirection:
|
||||
r += htmltext('<p class="details">')
|
||||
r += htmltext('(<a href="%s">') % formdef.disabled_redirection
|
||||
r += _('redirection')
|
||||
r += htmltext('</a>) ')
|
||||
r += htmltext('</p>')
|
||||
r += htmltext('</p>')
|
||||
r += htmltext('</li>')
|
||||
r += htmltext('</ul>')
|
||||
r += htmltext('</div>')
|
||||
|
|
|
|||
|
|
@ -206,6 +206,8 @@ class RolesDirectory(Directory):
|
|||
html_top('roles', title = _('Roles'))
|
||||
r = TemplateIO(html=True)
|
||||
|
||||
r += htmltext('<div class="bo-block">')
|
||||
r += htmltext('<h2>%s</h2>') % _('Roles')
|
||||
r += htmltext('<ul class="biglist">')
|
||||
for role in Role.select(order_by = 'name'):
|
||||
r += htmltext('<li>')
|
||||
|
|
@ -213,6 +215,7 @@ class RolesDirectory(Directory):
|
|||
r += htmltext('<p class="details">')
|
||||
r += htmltext('</p></li>')
|
||||
r += htmltext('</ul>')
|
||||
r += htmltext('</div>')
|
||||
return r.getvalue()
|
||||
|
||||
def get_sidebar(self):
|
||||
|
|
|
|||
|
|
@ -372,6 +372,8 @@ class UsersDirectory(Directory):
|
|||
|
||||
r += htmltext('</ul>')
|
||||
|
||||
r += htmltext('<div class="bo-block">')
|
||||
r += htmltext('<h2>%s</h2>') % _('Users')
|
||||
r += htmltext('<ul class="biglist">')
|
||||
for user in users:
|
||||
if user.is_admin:
|
||||
|
|
@ -381,13 +383,15 @@ class UsersDirectory(Directory):
|
|||
else:
|
||||
r += htmltext('<li class="simple-user">')
|
||||
r += htmltext('<strong class="label"><a href="%s/">%s</a></strong>') % (user.id, user.display_name)
|
||||
r += htmltext('<p class="details">')
|
||||
if user.email:
|
||||
if user.email and False:
|
||||
r += htmltext('<p class="details">')
|
||||
r += user.email
|
||||
r += htmltext('</p></li>')
|
||||
r += htmltext('</p>')
|
||||
r += htmltext('</li>')
|
||||
r += htmltext('</ul>')
|
||||
|
||||
r += pagination_links(offset, limit, filtered_count)
|
||||
r += htmltext('</div>')
|
||||
|
||||
r += htmltext('</div>')
|
||||
|
||||
|
|
|
|||
|
|
@ -1023,13 +1023,15 @@ class WorkflowsDirectory(Directory):
|
|||
|
||||
get_response().filter['sidebar'] = self.get_sidebar()
|
||||
|
||||
r += htmltext('<div class="bo-block">')
|
||||
r += htmltext('<h2>%s</h2>') % _('Workflows')
|
||||
r += htmltext('<ul class="biglist">')
|
||||
for workflow in [Workflow.get_default_workflow()] + Workflow.select(order_by = 'name'):
|
||||
r += htmltext('<li>')
|
||||
r += htmltext('<strong class="label"><a href="%s/">%s</a></strong>') % (workflow.id, workflow.name)
|
||||
r += htmltext('<p class="details">')
|
||||
r += htmltext('</p></li>')
|
||||
r += htmltext('</li>')
|
||||
r += htmltext('</ul>')
|
||||
r += htmltext('</div>') # .bo-block
|
||||
return r.getvalue()
|
||||
|
||||
def get_sidebar(self):
|
||||
|
|
|
|||
|
|
@ -219,7 +219,7 @@ class ManagementDirectory(Directory):
|
|||
|
||||
def display_forms(self, forms_list):
|
||||
r = TemplateIO(html=True)
|
||||
r += htmltext('<ul>')
|
||||
r += htmltext('<ul class="biglist">')
|
||||
cats = Category.select(order_by = 'name')
|
||||
for c in cats + [None]:
|
||||
if c is None:
|
||||
|
|
@ -230,17 +230,20 @@ class ManagementDirectory(Directory):
|
|||
cat_name = c.name
|
||||
if not l2:
|
||||
continue
|
||||
r += htmltext('<li>%s</li>') % cat_name
|
||||
r += htmltext('<ul>')
|
||||
r += htmltext('<li><h3>%s</h3></li>') % cat_name
|
||||
for formdef, no_pending, no_total in l2:
|
||||
r += htmltext('<li><a href="%s/">%s</a>') % (formdef.url_name, formdef.name)
|
||||
r += htmltext('<li><strong><a href="%s/">%s</a></strong>') % (formdef.url_name, formdef.name)
|
||||
klass = ''
|
||||
if no_total:
|
||||
klass = 'badge'
|
||||
r += htmltext('<p class="details %s">' % klass)
|
||||
if no_pending:
|
||||
r += _(': %(pending)s open on %(total)s') % {'pending': no_pending,
|
||||
r += _('%(pending)s open on %(total)s') % {'pending': no_pending,
|
||||
'total': no_total}
|
||||
else:
|
||||
r += _(': %(total)s items') % {'total': no_total}
|
||||
r += _('%(total)s items') % {'total': no_total}
|
||||
r += htmltext('</p>')
|
||||
r += htmltext('</li>')
|
||||
r += htmltext('</ul>')
|
||||
r += htmltext('</ul>')
|
||||
return r.getvalue()
|
||||
|
||||
|
|
|
|||
|
|
@ -33,23 +33,10 @@ def pagination_links(offset, limit, total_count):
|
|||
query['limit'] = limit
|
||||
if 'ajax' in query:
|
||||
del query['ajax']
|
||||
r += htmltext('<a data-offset="%s" href="?%s">%s</a>') % (
|
||||
r += htmltext('<a class="previous-page" data-offset="%s" href="?%s"><!--%s--></a>') % (
|
||||
query['offset'], urllib.urlencode(query, doseq=1), _('Previous Page'))
|
||||
else:
|
||||
r += _('Previous Page')
|
||||
|
||||
r += ' - '
|
||||
|
||||
if offset + limit < total_count:
|
||||
# link to next page
|
||||
query['offset'] = offset+limit
|
||||
query['limit'] = limit
|
||||
if 'ajax' in query:
|
||||
del query['ajax']
|
||||
r += htmltext('<a data-offset="%s" href="?%s">%s</a>') % (
|
||||
query['offset'], urllib.urlencode(query, doseq=1), _('Next Page'))
|
||||
else:
|
||||
r += _('Next Page')
|
||||
r += htmltext('<span class="previous-page"><!--%s--></span>') % _('Previous Page')
|
||||
|
||||
# display links to individual pages
|
||||
page_range = 7
|
||||
|
|
@ -84,5 +71,17 @@ def pagination_links(offset, limit, total_count):
|
|||
page_number)
|
||||
r += htmltext('</span>') # <!-- .pages -->
|
||||
|
||||
if offset + limit < total_count:
|
||||
# link to next page
|
||||
query['offset'] = offset+limit
|
||||
query['limit'] = limit
|
||||
if 'ajax' in query:
|
||||
del query['ajax']
|
||||
r += htmltext('<a class="next-page" data-offset="%s" href="?%s"><!--%s--></a>') % (
|
||||
query['offset'], urllib.urlencode(query, doseq=1), _('Next Page'))
|
||||
else:
|
||||
r += htmltext('<span class="next-page"><!--%s--></span>') % _('Next Page')
|
||||
|
||||
|
||||
r += htmltext('</div>')
|
||||
return r.getvalue()
|
||||
|
|
|
|||
|
|
@ -37,15 +37,14 @@ li.biglistitem {
|
|||
|
||||
ul.biglist li .details,
|
||||
li.biglistitem .details {
|
||||
display: block;
|
||||
margin: 0;
|
||||
color: #555;
|
||||
font-size: 80%;
|
||||
display: inline;
|
||||
padding-left: 10px;
|
||||
font-style: italic;
|
||||
padding: 0 1ex;
|
||||
}
|
||||
|
||||
|
||||
ul.biglist li p.commands,
|
||||
li.biglistitem p.commands {
|
||||
float: right;
|
||||
|
|
@ -375,12 +374,11 @@ div.page-nav span.page-count-label {
|
|||
margin: 0 1ex;
|
||||
}
|
||||
|
||||
ul.biglist li.user-is-admin {
|
||||
div.bo-block ul.biglist li.user-is-admin strong a {
|
||||
border-left: 5px solid #0099ff;
|
||||
}
|
||||
|
||||
ul.biglist li.user-has-roles {
|
||||
border-left-color: green;
|
||||
div.bo-block ul.biglist li.user-has-roles strong a {
|
||||
border-left: 5px solid #cc00ff;
|
||||
}
|
||||
|
||||
|
|
@ -513,7 +511,68 @@ div#sidebar div.bo-block {
|
|||
}
|
||||
|
||||
div.bo-block ul.biglist {
|
||||
padding-left: 0em;
|
||||
margin: 0 -1ex -1ex -1ex;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
div.bo-block h2 {
|
||||
font-size: 200%;
|
||||
border: none;
|
||||
/*
|
||||
padding: 0.5ex 1ex 0.5ex 1ex;
|
||||
margin: -1ex -1ex -0 -1ex;
|
||||
background: white;
|
||||
*/
|
||||
|
||||
padding: 0.5ex 0 0.5ex 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
div.bo-block ul.biglist li {
|
||||
border-width: 1px 0 0 0;
|
||||
border-color: #e4e4e4;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
div.bo-block ul.biglist h3 {
|
||||
padding: 1ex;
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
div.bo-block ul.biglist li.disabled {
|
||||
background: none;
|
||||
}
|
||||
|
||||
div.bo-block ul.biglist li.disabled a {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
div.bo-block ul.biglist li > a,
|
||||
div.bo-block ul.biglist strong a {
|
||||
display: block;
|
||||
padding: 0.5ex 1ex;
|
||||
border: none;
|
||||
font-weight: normal;
|
||||
color: #215D9C;
|
||||
transition: all 0.25s ease 0s;
|
||||
}
|
||||
|
||||
div.bo-block ul.biglist p.details {
|
||||
position: absolute;
|
||||
top: 0.5ex;
|
||||
right: 1ex;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
div.bo-block ul.biglist p.details.badge {
|
||||
background-color: #AD7C6D;
|
||||
border-radius: 5px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
div.bo-block ul.biglist a:hover {
|
||||
background: #ccc;
|
||||
}
|
||||
|
||||
div.bo-block span.disabled a {
|
||||
|
|
@ -579,21 +638,39 @@ h3 span.change {
|
|||
}
|
||||
|
||||
div#page-links {
|
||||
margin: 1em 0;
|
||||
margin: 1em -1ex;
|
||||
padding: 2ex 1ex 0 1ex;
|
||||
}
|
||||
|
||||
#page-links .previous-page,
|
||||
#page-links .next-page {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#page-links .previous-page:before {
|
||||
content: "<";
|
||||
}
|
||||
|
||||
#page-links .next-page:before {
|
||||
content: ">";
|
||||
}
|
||||
|
||||
|
||||
div#page-links span.pages {
|
||||
border-left: 1px solid #666;
|
||||
padding-left: 2ex;
|
||||
margin-left: 2ex;
|
||||
padding-left: 1ex;
|
||||
margin-left: 1ex;
|
||||
}
|
||||
|
||||
div#page-links span.pages a {
|
||||
padding: 0 2px;
|
||||
div#page-links a {
|
||||
padding: 1ex 1.5ex;
|
||||
border: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
div#page-links span.pages a.current {
|
||||
font-weight: bold;
|
||||
background: #EE6E73;
|
||||
color: white;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
ul#fields-filter {
|
||||
|
|
@ -706,6 +783,19 @@ div.SubmitWidget input:hover, input[type=submit]:hover {
|
|||
border-color: #666;
|
||||
}
|
||||
|
||||
div.DataSourceSelectionWidget div.content input[type=text],
|
||||
div.PrefillSelectionWidget div.content input[type=text] {
|
||||
max-width: 50%;
|
||||
margin: 0 1ex;
|
||||
}
|
||||
|
||||
div.DataSourceSelectionWidget div.content input[type=submit],
|
||||
div.PrefillSelectionWidget div.content input[type=submit] {
|
||||
padding: 0 1ex;
|
||||
margin: 0 0 0 1ex;
|
||||
height: 1.8em;
|
||||
}
|
||||
|
||||
ul#field-filter,
|
||||
ul#columns-filter {
|
||||
list-style: none;
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 53 KiB |
|
|
@ -98,8 +98,7 @@ ul.user-info a {
|
|||
/* header */
|
||||
|
||||
div#header {
|
||||
background: #ff7800;
|
||||
background: linear-gradient(to bottom, #f13600 5%, #ff7800 30%) top right no-repeat;
|
||||
background: #AD7C6D url(adwaita-lock.jpg);
|
||||
color: white;
|
||||
padding-left: 25px;
|
||||
border-bottom: 1px solid #888;
|
||||
|
|
@ -107,18 +106,6 @@ div#header {
|
|||
height: 5em;
|
||||
}
|
||||
|
||||
div#header h1:after {
|
||||
content: "";
|
||||
display: block;
|
||||
background: url(../images/banner-green.jpg) top right no-repeat;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0px;
|
||||
width: calc(100% - 15em);
|
||||
max-width: 75%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
div#header h1 {
|
||||
margin: 0;
|
||||
padding: 15px 0 25px 0;
|
||||
|
|
@ -130,9 +117,9 @@ div#header h1 {
|
|||
|
||||
div#main-content {
|
||||
width: 95%;
|
||||
margin-left: 2%;
|
||||
padding: 0 6px;
|
||||
border: 1px solid #888;
|
||||
margin-left: 0;
|
||||
padding: 0 6px 0 16px;
|
||||
border: 1px solid #ccc;
|
||||
border-width: 0 1px 1px 0;
|
||||
background: white;
|
||||
float: left;
|
||||
|
|
@ -175,10 +162,10 @@ span#breadcrumb {
|
|||
}
|
||||
|
||||
span#breadcrumb a {
|
||||
display: inline;
|
||||
display: inline-block;
|
||||
padding-left: 20px;
|
||||
position: relative;
|
||||
height: 26px;
|
||||
height: 14px;
|
||||
margin-left: -4px;
|
||||
}
|
||||
|
||||
|
|
@ -189,8 +176,8 @@ span#breadcrumb a:first-child {
|
|||
|
||||
span#breadcrumb a:after {
|
||||
content: "";
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
height: 22px;
|
||||
width: 22px;
|
||||
-webkit-transform: scale(0.4, 0.707) rotate(45deg);
|
||||
-moz-transform: scale(0.4, 0.707) rotate(45deg);
|
||||
transform: scale(0.4, 0.707) rotate(45deg);
|
||||
|
|
@ -332,8 +319,8 @@ a[class^="icon-"], a[class*=" icon-"] {
|
|||
color: #FF7800;
|
||||
}
|
||||
|
||||
.icon-home-space:before { content: "\f015 "; }
|
||||
.icon-remove-sign:before { content: "\f057"; }
|
||||
.icon-home-space:before { content: "\f015\00a0\00a0"; }
|
||||
.icon-remove-sign:before { content: "\f057"; }
|
||||
|
||||
/* misc */
|
||||
|
||||
|
|
@ -429,13 +416,6 @@ a.button {
|
|||
padding-bottom: calc(1ex + 1px);
|
||||
}
|
||||
|
||||
a.button.disabled, button[disabled] {
|
||||
background: #f9f9f9;
|
||||
color: #888;
|
||||
box-shadow: none;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
input[type="submit"][name="submit"] {
|
||||
background: #283c54;
|
||||
background-image: linear-gradient(to bottom, #1cabe7, #1999cd);
|
||||
|
|
@ -447,6 +427,36 @@ input[type=submit]:hover {
|
|||
border-color: #666;
|
||||
}
|
||||
|
||||
/* disabled items */
|
||||
textarea.disabled:focus,
|
||||
input.disabled[type="text"]:focus,
|
||||
input.disabled[type="email"]:focus,
|
||||
input.disabled[type="password"]:focus,
|
||||
textarea.disabled,
|
||||
input.disabled[type="text"],
|
||||
input.disabled[type="email"],
|
||||
input.disabled[type="password"],
|
||||
textarea.disabled:focus,
|
||||
input.disabled[type="text"]:focus,
|
||||
input.disabled[type="email"]:focus,
|
||||
input.disabled[type="password"]:focus,
|
||||
a.button.disabled, button.disabled, button[disabled] {
|
||||
border: 1px solid #bbb;
|
||||
background: #f9f9f9;
|
||||
cursor: default;
|
||||
box-shadow: none;
|
||||
color: #888;
|
||||
}
|
||||
|
||||
a.disabled {
|
||||
color: #888;
|
||||
text-decoration: none;
|
||||
border: none;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
/* dialog styling */
|
||||
|
||||
.ui-dialog .ui-widget-content .ui-state-default.delete-button {
|
||||
background: #bc4c38;
|
||||
background-image: linear-gradient(to bottom, #dc2c18, #a43c28);
|
||||
|
|
@ -550,7 +560,6 @@ form.small button + a.button {
|
|||
#sidepage {
|
||||
position: absolute;
|
||||
z-index: 100;
|
||||
background: black;
|
||||
width: 30ex;
|
||||
height: 2em;
|
||||
text-align: left;
|
||||
|
|
@ -563,16 +572,20 @@ form.small button + a.button {
|
|||
}
|
||||
|
||||
#main.enable-transitions,
|
||||
#sidepage.enable-transitions ul#sidepage-menu,
|
||||
#sidepage.enable-transitions {
|
||||
transition-duration: 100ms;
|
||||
transition-duration: 400ms;
|
||||
}
|
||||
|
||||
#sidepage.sidepage-expanded {
|
||||
height: 100%;
|
||||
background: #23282d url(texture.png);
|
||||
overflow: initial;
|
||||
}
|
||||
|
||||
#sidepage.sidepage-expanded ul#sidepage-menu {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
#main {
|
||||
transition: margin-left 0ms ease-in;
|
||||
}
|
||||
|
|
@ -588,6 +601,14 @@ form.small button + a.button {
|
|||
#sidepage ul#sidepage-menu {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
padding-top: 1em;
|
||||
margin: 0;
|
||||
background: #23282d url(texture.png);
|
||||
height: 100%;
|
||||
height: calc(100% - 3em); /* #top 2em, padding-top: 1em */
|
||||
transition: all 0ms ease;
|
||||
transform: scale(1, 0);
|
||||
transform-origin: 0 0;
|
||||
}
|
||||
|
||||
#sidepage ul#sidepage-menu a {
|
||||
|
|
|
|||
Loading…
Reference in New Issue