shown in Example 14-7. Here you find the aforementioned parameters (comments, add-
comment) again. You also find references to standard HTML tags, like h1 for the highest-
ranking header. All information provided after a custom class name, like comments, or a
standard tag, like h1, defines or changes certain style elements (e.g., font type and/or size)
of the relevant object.
This style information is the final ingredient defining the look of the Tradechat application
and explaining why, for example, the “Tradechat” heading is displayed in blue (namely,
due to the line a, h1, h2 { color: #0066cc; }).
Example 14-7. CSS stylesheet for Tradechat application
body { font-family: sans-serif; background: #eee; }
a, h1, h2 { color: #0066cc; }
h1, h2 { font-family: ‘Helvetica’, sans-serif; margin: 0 ; }
h1 { font-size: 1.4em; border-bottom: 2px solid #eee; }
h2 { font-size: 1.0em; }
.page { margin: 2em auto; width: 35em; border: 1px solid #ccc;
padding: 0.8em; background: white; }
.comments { list-style: none; margin: 0 ; padding: 0 ; }
.comments li { margin: 0.8em 1.2em; }
.comments li h2 { margin-left: -1em; }
.add-comment { color: #0066cc; font-size: 0.7em; border-bottom: 1px solid #ccc; }
.add-comment dl { font-weight: bold; }
.metanav { text-align: right; font-size: 0.8em; padding: 0.3em;
margin-bottom: 1em; background: #fafafa; }
.flash { color: #b9b9b9; font-size: 0.7em; }
.error { color: #ff4629; font-size: 0.7em; padding: 0.5em; }
If you have followed every step, your tradechat directory should now contain the same
files listed here:
In [ 86 ]: import os
for path, dirs, files in os.walk(‘../python/tradechat’):
print path
for f in files:
print f
Out[86]: ../python/tradechat
tables.sql
tradechat.db
tradechat.py
../python/tradechat/static
style.css
../python/tradechat/templates
layout.html
login.html
register.html
show_entries.html
You can now run the main script from the shell as follows and start the application:
$ python tradechat.py