Add initial attempt at 'better' theme
This commit is contained in:
parent
fdf1419ea2
commit
38927ce282
|
@ -54,7 +54,6 @@ div.field-wrapper.error {
|
|||
}
|
||||
|
||||
div.field-wrapper label {
|
||||
color: #000000;
|
||||
display: block;
|
||||
float: left;
|
||||
width: 15em;
|
||||
|
|
120
tailbone/static/css/theme-better.css
Normal file
120
tailbone/static/css/theme-better.css
Normal file
|
@ -0,0 +1,120 @@
|
|||
|
||||
/**********************************************************************
|
||||
* styles for 'better' theme
|
||||
**********************************************************************/
|
||||
|
||||
/****************************************
|
||||
* core overrides
|
||||
****************************************/
|
||||
|
||||
a {
|
||||
color: #0972a5;
|
||||
}
|
||||
|
||||
.flash-messages,
|
||||
.error-messages {
|
||||
margin: 0.5em 0 0 0;
|
||||
}
|
||||
|
||||
#context-menu {
|
||||
margin: 0.5em;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.form {
|
||||
padding-left: 5em;
|
||||
}
|
||||
|
||||
.newgrid-wrapper .grid-header #context-menu {
|
||||
float: none;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/****************************************
|
||||
* header
|
||||
****************************************/
|
||||
|
||||
header .global {
|
||||
background-color: #eaeaea;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
header .global a.home,
|
||||
header .global a.global,
|
||||
header .global span.global {
|
||||
display: block;
|
||||
float: left;
|
||||
font-size: 2em;
|
||||
font-weight: bold;
|
||||
line-height: 60px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
header .global a.home img {
|
||||
display: block;
|
||||
float: left;
|
||||
padding: 5px 5px 5px 30px;
|
||||
}
|
||||
|
||||
header .global .grid-nav {
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
line-height: 60px;
|
||||
margin-left: 5em;
|
||||
}
|
||||
|
||||
header .global .grid-nav .ui-button,
|
||||
header .global .grid-nav span.viewing {
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
header .global .feedback {
|
||||
float: right;
|
||||
line-height: 60px;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
header .page h1 {
|
||||
border-bottom: 1px solid lightgrey;
|
||||
margin: 0;
|
||||
padding: 0 0 0 0.5em;
|
||||
}
|
||||
|
||||
/****************************************
|
||||
* content
|
||||
****************************************/
|
||||
|
||||
body > #body-wrapper {
|
||||
margin: 0px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.content-wrapper {
|
||||
height: 100%;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
|
||||
#scrollpane {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#scrollpane .inner-content {
|
||||
padding: 0 0.5em 0.5em 0.5em;
|
||||
}
|
||||
|
||||
/****************************************
|
||||
* footer
|
||||
****************************************/
|
||||
|
||||
#footer {
|
||||
border-top: 1px solid lightgray;
|
||||
bottom: 0;
|
||||
font-size: 9pt;
|
||||
height: 20px;
|
||||
left: 0;
|
||||
line-height: 20px;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
|
@ -135,9 +135,13 @@
|
|||
${h.javascript_link(request.static_url('tailbone:static/js/tailbone.js'))}
|
||||
</%def>
|
||||
|
||||
<%def name="core_styles()">
|
||||
<%def name="core_styles(jquery_theme=None)">
|
||||
${h.stylesheet_link(request.static_url('tailbone:static/css/normalize.css'))}
|
||||
${self.jquery_theme()}
|
||||
% if jquery_theme:
|
||||
${jquery_theme()}
|
||||
% else:
|
||||
${self.jquery_smoothness_theme()}
|
||||
% endif
|
||||
${h.stylesheet_link(request.static_url('tailbone:static/css/jquery.ui.menubar.css'))}
|
||||
${h.stylesheet_link(request.static_url('tailbone:static/css/jquery.loadmask.css'))}
|
||||
${h.stylesheet_link(request.static_url('tailbone:static/css/jquery.ui.timepicker.css'))}
|
||||
|
@ -150,7 +154,7 @@
|
|||
${h.stylesheet_link(request.static_url('tailbone:static/css/newgrids.css'))}
|
||||
</%def>
|
||||
|
||||
<%def name="jquery_theme()">
|
||||
<%def name="jquery_smoothness_theme()">
|
||||
${h.stylesheet_link('https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.min.css')}
|
||||
</%def>
|
||||
|
||||
|
|
132
tailbone/templates/themes/better/base.mako
Normal file
132
tailbone/templates/themes/better/base.mako
Normal file
|
@ -0,0 +1,132 @@
|
|||
## -*- coding: utf-8 -*-
|
||||
<%namespace name="base" file="tailbone:templates/base.mako" />
|
||||
<%namespace file="/menu.mako" import="main_menu_items" />
|
||||
<%namespace file="/newgrids/nav.mako" import="grid_index_nav" />
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
||||
<title>${self.global_title()} » ${capture(self.title)}</title>
|
||||
${self.favicon()}
|
||||
${base.core_javascript()}
|
||||
${self.extra_javascript()}
|
||||
${base.core_styles(jquery_theme=self.jquery_theme)}
|
||||
${self.extra_styles()}
|
||||
|
||||
% if not request.rattail_config.production():
|
||||
<style type="text/css">
|
||||
body { background-image: url(${request.static_url('tailbone:static/img/testing.png')}); }
|
||||
</style>
|
||||
% endif
|
||||
|
||||
${self.head_tags()}
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="body-wrapper">
|
||||
|
||||
<header>
|
||||
<nav>
|
||||
<ul class="menubar">
|
||||
${main_menu_items()}
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<div class="global">
|
||||
<a class="home" href="${url('home')}">
|
||||
${self.header_logo()}
|
||||
<span>${self.global_title()}</span>
|
||||
</a>
|
||||
% if master:
|
||||
<span class="global">»</span>
|
||||
% if master.listing:
|
||||
<span class="global">${model_title_plural}</span>
|
||||
% else:
|
||||
${h.link_to(model_title_plural, index_url, class_='global')}
|
||||
% if master.viewing and grid_index:
|
||||
${grid_index_nav()}
|
||||
% endif
|
||||
% endif
|
||||
% endif
|
||||
|
||||
<div class="feedback">
|
||||
${h.link_to("Feedback", url('feedback'), class_='button')}
|
||||
</div>
|
||||
|
||||
</div><!-- global -->
|
||||
|
||||
<div class="page">
|
||||
${self.content_title()}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="content-wrapper">
|
||||
|
||||
<div id="scrollpane">
|
||||
<div id="content">
|
||||
<div class="inner-content">
|
||||
|
||||
% if request.session.peek_flash('error'):
|
||||
<div class="error-messages">
|
||||
% for error in request.session.pop_flash('error'):
|
||||
<div class="ui-state-error ui-corner-all">
|
||||
<span style="float: left; margin-right: .3em;" class="ui-icon ui-icon-alert"></span>
|
||||
${error}
|
||||
</div>
|
||||
% endfor
|
||||
</div>
|
||||
% endif
|
||||
|
||||
% if request.session.peek_flash():
|
||||
<div class="flash-messages">
|
||||
% for msg in request.session.pop_flash():
|
||||
<div class="ui-state-highlight ui-corner-all">
|
||||
<span style="float: left; margin-right: .3em;" class="ui-icon ui-icon-info"></span>
|
||||
${msg|n}
|
||||
</div>
|
||||
% endfor
|
||||
</div>
|
||||
% endif
|
||||
|
||||
${self.body()}
|
||||
|
||||
</div><!-- inner-content -->
|
||||
</div><!-- content -->
|
||||
</div><!-- scrollpane -->
|
||||
|
||||
</div><!-- content-wrapper -->
|
||||
|
||||
<div id="footer">
|
||||
${self.footer()}
|
||||
</div>
|
||||
|
||||
</div><!-- body-wrapper -->
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<%def name="global_title()">${"[STAGE] " if not request.rattail_config.production() else ''}Rattail</%def>
|
||||
|
||||
<%def name="content_title()">
|
||||
<h1>${self.title()}</h1>
|
||||
</%def>
|
||||
|
||||
<%def name="favicon()"></%def>
|
||||
|
||||
<%def name="jquery_theme()">
|
||||
${h.stylesheet_link('https://code.jquery.com/ui/1.11.4/themes/dark-hive/jquery-ui.css')}
|
||||
</%def>
|
||||
|
||||
<%def name="extra_javascript()"></%def>
|
||||
|
||||
<%def name="extra_styles()">
|
||||
${h.stylesheet_link(request.static_url('tailbone:static/css/theme-better.css'))}
|
||||
</%def>
|
||||
|
||||
<%def name="head_tags()"></%def>
|
||||
|
||||
<%def name="header_logo()"></%def>
|
||||
|
||||
<%def name="footer()">
|
||||
powered by ${h.link_to("Rattail {}".format(rattail.__version__), 'https://rattailproject.org/', target='_blank')}
|
||||
</%def>
|
6
tailbone/templates/themes/better/master/create.mako
Normal file
6
tailbone/templates/themes/better/master/create.mako
Normal file
|
@ -0,0 +1,6 @@
|
|||
## -*- coding: utf-8 -*-
|
||||
<%inherit file="tailbone:templates/master/create.mako" />
|
||||
|
||||
<%def name="context_menu_items()"></%def>
|
||||
|
||||
${parent.body()}
|
18
tailbone/templates/themes/better/master/edit.mako
Normal file
18
tailbone/templates/themes/better/master/edit.mako
Normal file
|
@ -0,0 +1,18 @@
|
|||
## -*- coding: utf-8 -*-
|
||||
<%inherit file="tailbone:templates/master/edit.mako" />
|
||||
|
||||
<%def name="title()">Edit: ${instance_title}</%def>
|
||||
|
||||
<%def name="context_menu_items()">
|
||||
% if master.viewable and request.has_perm('{}.view'.format(permission_prefix)):
|
||||
<li>${h.link_to("View this {}".format(model_title), action_url('view', instance))}</li>
|
||||
% endif
|
||||
% if master.deletable and instance_deletable and request.has_perm('{}.delete'.format(permission_prefix)):
|
||||
<li>${h.link_to("Delete this {}".format(model_title), action_url('delete', instance))}</li>
|
||||
% endif
|
||||
% if master.creatable and request.has_perm('{}.create'.format(permission_prefix)):
|
||||
<li>${h.link_to("Create a new {}".format(model_title), url('{}.create'.format(route_prefix)))}</li>
|
||||
% endif
|
||||
</%def>
|
||||
|
||||
${parent.body()}
|
6
tailbone/templates/themes/better/master/index.mako
Normal file
6
tailbone/templates/themes/better/master/index.mako
Normal file
|
@ -0,0 +1,6 @@
|
|||
## -*- coding: utf-8 -*-
|
||||
<%inherit file="tailbone:templates/master/index.mako" />
|
||||
|
||||
<%def name="content_title()"></%def>
|
||||
|
||||
${parent.body()}
|
21
tailbone/templates/themes/better/master/view.mako
Normal file
21
tailbone/templates/themes/better/master/view.mako
Normal file
|
@ -0,0 +1,21 @@
|
|||
## -*- coding: utf-8 -*-
|
||||
<%inherit file="tailbone:templates/master/view.mako" />
|
||||
|
||||
<%def name="content_title()">
|
||||
<h1>${instance_title}</h1>
|
||||
</%def>
|
||||
|
||||
<%def name="context_menu_items()">
|
||||
<li>${h.link_to("Permalink for this {}".format(model_title), action_url('view', instance))}</li>
|
||||
% if master.editable and instance_editable and request.has_perm('{}.edit'.format(permission_prefix)):
|
||||
<li>${h.link_to("Edit this {}".format(model_title), action_url('edit', instance))}</li>
|
||||
% endif
|
||||
% if master.deletable and instance_deletable and request.has_perm('{}.delete'.format(permission_prefix)):
|
||||
<li>${h.link_to("Delete this {}".format(model_title), action_url('delete', instance))}</li>
|
||||
% endif
|
||||
% if master.creatable and request.has_perm('{}.create'.format(permission_prefix)):
|
||||
<li>${h.link_to("Create a new {}".format(model_title), url('{}.create'.format(route_prefix)))}</li>
|
||||
% endif
|
||||
</%def>
|
||||
|
||||
${parent.body()}
|
Loading…
Reference in a new issue