Merge 'better' theme into base templates

i.e. for now there is no 'better' (or any other) theme
This commit is contained in:
Lance Edgar 2017-08-13 19:11:53 -05:00
parent c0a28716f5
commit 7d0bb80a90
15 changed files with 241 additions and 423 deletions

View file

@ -1,4 +1,4 @@
# -*- coding: utf-8 -*-
# -*- coding: utf-8; -*-
################################################################################
#
# Rattail -- Retail Software Framework
@ -175,9 +175,7 @@ def main(global_config, **settings):
"""
This function returns a Pyramid WSGI application.
"""
settings.setdefault('mako.directories', [
'tailbone:templates/themes/better',
'tailbone:templates'])
settings.setdefault('mako.directories', ['tailbone:templates'])
rattail_config = make_rattail_config(settings)
pyramid_config = make_pyramid_config(settings)
pyramid_config.include('tailbone')

View file

@ -13,7 +13,7 @@ body {
}
a {
color: #3D6E1C;
color: #0972a5;
text-decoration: none;
}
@ -76,6 +76,11 @@ div.error-messages div.ui-state-error {
margin-bottom: 8px;
}
.flash-messages,
.error-messages {
margin: 0.5em 0 0 0;
}
div.error {
color: #dd6666;
font-weight: bold;

View file

@ -36,6 +36,10 @@ div.fieldset {
margin-top: 10px;
}
.form {
padding-left: 5em;
}
/******************************
* Fieldsets

View file

@ -21,6 +21,11 @@
white-space: nowrap;
}
.grid-wrapper .grid-header #context-menu {
float: none;
margin: 0;
}
.grid-wrapper .grid-header td.tools {
margin: 0;
padding: 0;

View file

@ -57,6 +57,59 @@ body > #body-wrapper {
margin-left: 0.5em;
}
/* new stuff from 'better' theme begins here */
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 {
border-bottom: 1px solid lightgrey;
padding: 0.5em;
}
header .page h1 {
margin: 0;
padding: 0 0 0 0.5em;
}
/******************************
* Logo
******************************/
@ -67,6 +120,29 @@ body > #body-wrapper {
}
/****************************************
* 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;
}
/******************************
* context menu
******************************/
@ -74,7 +150,9 @@ body > #body-wrapper {
#context-menu {
float: right;
list-style-type: none;
margin: 0.5em;
text-align: right;
white-space: nowrap;
}
@ -110,3 +188,19 @@ body > #body-wrapper {
overflow: auto;
padding: 5px;
}
/****************************************
* 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%;
}

View file

@ -1,124 +0,0 @@
/**********************************************************************
* 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;
}
.grid-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 {
border-bottom: 1px solid lightgrey;
padding: 0.5em;
}
header .page h1 {
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%;
}

View file

@ -1,84 +1,73 @@
## -*- coding: utf-8 -*-
## -*- coding: utf-8; -*-
<%namespace file="/menu.mako" import="main_menu_items" />
<%namespace file="/grids/nav.mako" import="grid_index_nav" />
<!DOCTYPE html>
<html style="direction: ltr;" xmlns="http://www.w3.org/1999/xhtml" lang="en-us">
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>${self.global_title()} &raquo; ${capture(self.title)}</title>
<link rel="icon" type="image/x-icon" href="${request.static_url('tailbone:static/img/rattail.ico')}" />
${self.core_javascript()}
${self.core_styles()}
${self.extra_styles()}
<title>${self.global_title()} &raquo; ${capture(self.title)|n}</title>
${self.favicon()}
${self.header_core()}
% 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">
<div id="header">
<h1>${h.link_to(capture(self.global_title), url('home'))}</h1>
<h1 class="title">&raquo; ${self.title()}</h1>
<div class="login">
% if request.user:
${h.link_to(request.user.display_name, url('change_password'))}
(${h.link_to("logout", url('logout'))})
% else:
${h.link_to("login", url('login'))}
% endif
</div>
</div><!-- header -->
<header>
<nav>
<ul class="menubar">
<li>
<a>Products</a>
<ul>
<li>${h.link_to("Products", url('products'))}</li>
<li>${h.link_to("Brands", url('brands'))}</li>
</ul>
</li>
<li>
<a>Customers</a>
<ul>
<li>${h.link_to("Customers", url('customers'))}</li>
<li>${h.link_to("Customer Groups", url('customer_groups'))}</li>
</ul>
</li>
<li>
<a>Employees</a>
<ul>
<li>${h.link_to("Employees", url('employees'))}</li>
</ul>
</li>
<li>
<a>Vendors</a>
<ul>
<li>${h.link_to("Vendors", url('vendors'))}</li>
</ul>
</li>
<li>
<a>Stores</a>
<ul>
<li>${h.link_to("Stores", url('stores'))}</li>
<li>${h.link_to("Departments", url('departments'))}</li>
<li>${h.link_to("Subdepartments", url('subdepartments'))}</li>
</ul>
</li>
% if request.has_perm('users.list') or request.has_perm('roles.list'):
<li>
<a>Auth</a>
<ul>
% if request.has_perm('users.list'):
<li>${h.link_to("Users", url('users'))}</li>
% endif
% if request.has_perm('roles.list'):
<li>${h.link_to("Roles", url('roles'))}</li>
% endif
</ul>
</li>
% endif
${main_menu_items()}
</ul>
</nav>
<div id="body">
<div class="global">
<a class="home" href="${url('home')}">
${self.header_logo()}
<span class="title">${self.global_title()}</span>
</a>
% if master:
<span class="global">&raquo;</span>
% if master.listing:
<span class="global">${index_title}</span>
% else:
${h.link_to(index_title, index_url, class_='global')}
% if parent_url is not Undefined:
<span class="global">&raquo;</span>
${h.link_to(parent_title, parent_url, class_='global')}
% elif instance_url is not Undefined:
<span class="global">&raquo;</span>
${h.link_to(instance_title, instance_url, class_='global')}
% endif
% 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">
@ -104,21 +93,40 @@
${self.body()}
</div><!-- body -->
</div><!-- inner-content -->
</div><!-- content -->
</div><!-- scrollpane -->
</div><!-- body-wrapper -->
</div><!-- content-wrapper -->
<div id="footer">
powered by ${h.link_to("Rattail", 'http://rattailproject.org/', target='_blank')}
${self.footer()}
</div>
</div><!-- body-wrapper -->
</body>
</html>
<%def name="global_title()">Tailbone</%def>
<%def name="app_title()">Rattail</%def>
<%def name="global_title()">${"[STAGE] " if not request.rattail_config.production() else ''}${self.app_title()}</%def>
<%def name="title()"></%def>
<%def name="content_title()">
<h1>${self.title()}</h1>
</%def>
<%def name="favicon()"></%def>
<%def name="header_core()">
${base.core_javascript()}
${self.extra_javascript()}
${base.core_styles(jquery_theme=self.jquery_theme)}
${self.extra_styles()}
</%def>
<%def name="core_javascript()">
${h.javascript_link('https://code.jquery.com/jquery-1.12.4.min.js')}
${h.javascript_link('https://code.jquery.com/ui/{}/jquery-ui.min.js'.format(request.rattail_config.get('tailbone', 'jquery_ui.version', default='1.11.4')))}
@ -133,12 +141,14 @@
${h.javascript_link(request.static_url('tailbone:static/js/tailbone.js'))}
</%def>
<%def name="extra_javascript()"></%def>
<%def name="core_styles(jquery_theme=None)">
${h.stylesheet_link(request.static_url('tailbone:static/css/normalize.css'))}
% if jquery_theme:
${jquery_theme()}
% else:
${self.jquery_smoothness_theme()}
${self.jquery_dark_hive_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'))}
@ -152,10 +162,29 @@
${h.stylesheet_link(request.static_url('tailbone:static/css/diffs.css'))}
</%def>
<%def name="jquery_smoothness_theme()">
${h.stylesheet_link('https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.min.css')}
<%def name="jquery_dark_hive_theme()">
${h.stylesheet_link('https://code.jquery.com/ui/1.11.4/themes/dark-hive/jquery-ui.css')}
</%def>
## <%def name="jquery_smoothness_theme()">
## ${h.stylesheet_link('https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.min.css')}
## </%def>
<%def name="extra_styles()"></%def>
<%def name="head_tags()"></%def>
<%def name="header_logo()"></%def>
<%def name="footer()">
powered by ${h.link_to("Rattail", url('about'))}
</%def>
<%def name="wtfield(form, name, **kwargs)">
<div class="field-wrapper${' error' if form[name].errors else ''}">
<label for="${name}">${form[name].label}</label>
<div class="field">
${form[name](**kwargs)}
</div>
</div>
</%def>

View file

@ -35,11 +35,7 @@
</script>
</%def>
<%def name="context_menu_items()">
% if request.has_perm('{}.list'.format(permission_prefix)):
<li>${h.link_to("Back to {}".format(model_title_plural), index_url)}</li>
% endif
</%def>
<%def name="context_menu_items()"></%def>
<ul id="context-menu">
${self.context_menu_items()}

View file

@ -1,7 +1,7 @@
## -*- coding: utf-8; -*-
<%inherit file="/base.mako" />
<%def name="title()">Edit ${model_title}: ${instance_title}</%def>
<%def name="title()">Edit: ${instance_title}</%def>
<%def name="extra_javascript()">
${parent.extra_javascript()}
@ -32,7 +32,6 @@
</%def>
<%def name="context_menu_items()">
<li>${h.link_to("Back to {}".format(model_title_plural), url(route_prefix))}</li>
% 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

View file

@ -10,6 +10,8 @@
<%def name="title()">${index_title}</%def>
<%def name="content_title()"></%def>
<%def name="extra_javascript()">
${parent.extra_javascript()}
${h.javascript_link(request.static_url('tailbone:static/js/jquery.ui.tailbone.js'))}

View file

@ -1,154 +0,0 @@
## -*- coding: utf-8; -*-
<%namespace name="base" file="tailbone:templates/base.mako" />
<%namespace file="/menu.mako" import="main_menu_items" />
<%namespace file="/grids/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()} &raquo; ${capture(self.title)|n}</title>
${self.favicon()}
${self.header_core()}
% 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 class="title">${self.global_title()}</span>
</a>
% if master:
<span class="global">&raquo;</span>
% if master.listing:
<span class="global">${index_title}</span>
% else:
${h.link_to(index_title, index_url, class_='global')}
% if parent_url is not Undefined:
<span class="global">&raquo;</span>
${h.link_to(parent_title, parent_url, class_='global')}
% elif instance_url is not Undefined:
<span class="global">&raquo;</span>
${h.link_to(instance_title, instance_url, class_='global')}
% endif
% 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="app_title()">Rattail</%def>
<%def name="global_title()">${"[STAGE] " if not request.rattail_config.production() else ''}${self.app_title()}</%def>
<%def name="content_title()">
<h1>${self.title()}</h1>
</%def>
<%def name="favicon()"></%def>
<%def name="header_core()">
${base.core_javascript()}
${self.extra_javascript()}
${base.core_styles(jquery_theme=self.jquery_theme)}
${self.extra_styles()}
</%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", url('about'))}
</%def>
<%def name="wtfield(form, name, **kwargs)">
<div class="field-wrapper${' error' if form[name].errors else ''}">
<label for="${name}">${form[name].label}</label>
<div class="field">
${form[name](**kwargs)}
</div>
</div>
</%def>

View file

@ -1,6 +0,0 @@
## -*- coding: utf-8 -*-
<%inherit file="tailbone:templates/master/create.mako" />
<%def name="context_menu_items()"></%def>
${parent.body()}

View file

@ -1,18 +0,0 @@
## -*- 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()}

View file

@ -1,6 +0,0 @@
## -*- coding: utf-8; -*-
<%inherit file="tailbone:templates/master/index.mako" />
<%def name="content_title()"></%def>
${parent.body()}

View file

@ -1,6 +0,0 @@
## -*- coding: utf-8; -*-
<%inherit file="tailbone:templates/master/view.mako" />
## TODO: remove this once it's safe (no callers use it)...
${parent.body()}