pydsigner/demo.html

## demo.html
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; UTF-8">
        <title>The Python Forum :: What's a good tutorial?</title>
        <link rel="stylesheet" type="text/css" href="style.css" />
        <meta name="keywords" content="python forum" />
    </head>
    <body>
        <header>
            <h1>The Python Forum</h1>
            <!--Logo and such-->
        </header>
        <nav>
            <div id="hierarchy">
                <a href="/">Python Forum</a>
                <a href="/noobs">Noobs</a>
                <a href="/noobs/12904">What's a good tutorial?</a>
            </div>
            <!--Other stuff in nav-->
        </nav>
        <div id="main">
            <div class="first-level" id="op">
                <div class="poster">
                    <img src="an-avatar.png">
                    <!--These classes should be put in by the template,
                    being different for mods, users, admins, and so on-->
                    <div class="poster-user">ima.noob94</div>
                    <!--Use CSS to do this!-->
                    <div class="poster-noob-stars"></div>
                </div>
                <div class="post-main">
                    <div class="post-info">

                    </div>
                    <div class="post-body">
                        I saw Python recommended for Linux scripting. Any good tutorials for learning it?
                    </div>
                    <hr />
                    <div class="post-sig">
                        i wanna python
                    </div>
                </div>
            </div>
            <div class="first-level" id="replies">
                <div class="post">
                    <div class="poster">
                        <img src="an-avatar.png">
                        <div class="poster-mod">guru</div>
                        <div class="poster-mod-stars"></div>
                        <!--<br style="height: 100px;" />-->
                        hh
                    </div>
                    <div class="post-main">
                        <div class="post-info">

                        </div>
                        <div class="post-body">
                            I would start by reading the Python Tutorial. Then just look around here for stuff to learn from.
                        </div>
                        <hr />
                        <div class="post-sig">
                            <b>Arch Linux | i3 | Python 2.7<br />
                            Ultrabook: 8GB DDR3 RAM, 256GB SSD, 3.2GHz 3rd gen i5</b><br />
                            <i>Either you have Python, or you don't.</i>
                        </div>
                    </div>
                </div>
                <div class="post">
                    <div class="poster">
                        <img src="an-avatar.png">
                        <div class="poster-mod">guru</div>
                        <div class="poster-mod-stars"></div>
                        <!--<br style="height: 100px;" />-->
                        hh
                    </div>
                    <div class="post-main">
                        <div class="post-info">

                        </div>
                        <div class="post-body">
                            I would start by reading the Python Tutorial. Then just look around here for stuff to learn from.
                        </div>
                        <hr />
                        <div class="post-sig">
                            <b>Arch Linux | i3 | Python 2.7<br />
                            Ultrabook: 8GB DDR3 RAM, 256GB SSD, 3.2GHz 3rd gen i5</b><br />
                            <i>Either you have Python, or you don't.</i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>

## style.css
/*******************
    Reset CSS
********************/

html, body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, pre, code, address,
variable, form, fieldset, blockquote {
    padding: 0;
    margin: 0;
    font-size: 100%;
    font-weight: normal;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

td, th, caption {
    font-weight: normal;
    text-align: left;
}

img, fieldset {
    border: 0;
}

ol {
    padding-left: 1.4em;
    list-style: decimal;
}

ul {
    padding-left: 1.4em;
    list-style: disc;
}

q:before, q:after {
    content:'';
}

/*******************
    Styles
*******************/

.first-level {
    background-color: #EEE;
    color: #333;
    padding: 10px;
    margin: 5px;
    border-radius: 8px;
}

.poster {
    float: left;
    /*margin-top: 4px;
    margin-bottom: 4px;*/
    width: 168px;
}

.post {
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 3px;
    margin-top: 3px;
}

.post-main {
    margin-left: 175px;
    padding-left: 10px;

    border-width: 0 0 0 1px;
    border-style: solid;
    border-color: #333;

}

.post-main > hr {
    margin-left: -6px;
}

#replies .post:nth-child(odd) {
    background-color: #DDD;
}
	<!DOCTYPE html>
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; UTF-8">
	<title>The Python Forum :: What's a good tutorial?</title>
	<link rel="stylesheet" type="text/css" href="style.css" />
	<meta name="keywords" content="python forum" />
	</head>
	<body>
	<header>
	<h1>The Python Forum</h1>
	<!--Logo and such-->
	</header>
	<nav>
	<div id="hierarchy">
	<a href="/">Python Forum</a>
	<a href="/noobs">Noobs</a>
	<a href="/noobs/12904">What's a good tutorial?</a>
	</div>
	<!--Other stuff in nav-->
	</nav>
	<div id="main">
	<div class="first-level" id="op">
	<div class="poster">
	<img src="an-avatar.png">
	<!--These classes should be put in by the template,
	being different for mods, users, admins, and so on-->
	<div class="poster-user">ima.noob94</div>
	<!--Use CSS to do this!-->
	<div class="poster-noob-stars"></div>
	</div>
	<div class="post-main">
	<div class="post-info">

	</div>
	<div class="post-body">
	I saw Python recommended for Linux scripting. Any good tutorials for learning it?
	</div>
	<hr />
	<div class="post-sig">
	i wanna python
	</div>
	</div>
	</div>
	<div class="first-level" id="replies">
	<div class="post">
	<div class="poster">
	<img src="an-avatar.png">
	<div class="poster-mod">guru</div>
	<div class="poster-mod-stars"></div>
	<!--<br style="height: 100px;" />-->
	hh
	</div>
	<div class="post-main">
	<div class="post-info">

	</div>
	<div class="post-body">
	I would start by reading the Python Tutorial. Then just look around here for stuff to learn from.
	</div>
	<hr />
	<div class="post-sig">
	<b>Arch Linux \| i3 \| Python 2.7<br />
	Ultrabook: 8GB DDR3 RAM, 256GB SSD, 3.2GHz 3rd gen i5</b><br />
	<i>Either you have Python, or you don't.</i>
	</div>
	</div>
	</div>
	<div class="post">
	<div class="poster">
	<img src="an-avatar.png">
	<div class="poster-mod">guru</div>
	<div class="poster-mod-stars"></div>
	<!--<br style="height: 100px;" />-->
	hh
	</div>
	<div class="post-main">
	<div class="post-info">

	</div>
	<div class="post-body">
	I would start by reading the Python Tutorial. Then just look around here for stuff to learn from.
	</div>
	<hr />
	<div class="post-sig">
	<b>Arch Linux \| i3 \| Python 2.7<br />
	Ultrabook: 8GB DDR3 RAM, 256GB SSD, 3.2GHz 3rd gen i5</b><br />
	<i>Either you have Python, or you don't.</i>
	</div>
	</div>
	</div>
	</div>
	</div>
	</body>
	</html>
	/*******************
	Reset CSS
	********************/

	html, body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, pre, code, address,
	variable, form, fieldset, blockquote {
	padding: 0;
	margin: 0;
	font-size: 100%;
	font-weight: normal;
	}

	table {
	border-collapse: collapse;
	border-spacing: 0;
	}

	td, th, caption {
	font-weight: normal;
	text-align: left;
	}

	img, fieldset {
	border: 0;
	}

	ol {
	padding-left: 1.4em;
	list-style: decimal;
	}

	ul {
	padding-left: 1.4em;
	list-style: disc;
	}

	q:before, q:after {
	content:'';
	}

	/*******************
	Styles
	*******************/

	.first-level {
	background-color: #EEE;
	color: #333;
	padding: 10px;
	margin: 5px;
	border-radius: 8px;
	}

	.poster {
	float: left;
	/*margin-top: 4px;
	margin-bottom: 4px;*/
	width: 168px;
	}

	.post {
	border-radius: 5px;
	padding: 10px;
	margin-bottom: 3px;
	margin-top: 3px;
	}

	.post-main {
	margin-left: 175px;
	padding-left: 10px;

	border-width: 0 0 0 1px;
	border-style: solid;
	border-color: #333;

	}

	.post-main > hr {
	margin-left: -6px;
	}

	#replies .post:nth-child(odd) {
	background-color: #DDD;
	}