diff flowerbed.html @ 5:550dede362d5 default tip

example flowerbed markup
author Jeff Hammel <jhammel@mozilla.com>
date Sat, 25 Dec 2010 16:01:29 -0800
parents
children
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/flowerbed.html	Sat Dec 25 16:01:29 2010 -0800
@@ -0,0 +1,110 @@
+<html>
+<head>
+<title>flowerbed</title>
+
+<style type="text/css">
+dt {
+float: left;
+clear: left;
+font-style: italic;
+}
+
+dt::after { content: ": "; 
+}
+
+dd {
+font-family: monospace;
+}
+
+div.app, div.conditions { 
+text-align: center;
+align: center;
+}
+
+div.app { 
+width: 200px; 
+margin: 10px;
+}
+
+div.app {
+border: thin black solid;
+background: red;
+}
+
+div.conditions {
+background: lightblue;
+}
+
+div.options {
+background: orange;
+}
+
+ol {
+list-style-type: square;
+}
+
+div.apps > span:first-child,
+div.app > span:first-child
+{
+font-family: sans-serif;
+font-weight: bold;
+color: #222;
+}
+
+div.apps > span:first-child {
+border: thin solid black;
+background: red;
+}
+
+</style>
+
+</head>
+<body>
+<div class="apps">
+  <span class="name">Your site</span>
+  <ol class="apps">
+    <li class="app">
+      <div class="app">
+        <span class="name">config</span>
+        <div class="conditions">
+          <span class="name">conditions</span>
+          <dl></dl>
+          <input type="button" value="+"/>
+        </div>
+        <div class="options">
+          <dl>
+            <dt>factory</dt>
+            <dd>%(self)s</dd>
+          </dl>
+        </div>
+      </div>
+    </li>
+    <li class="app">
+      <div class="app">
+        <span class="name">json</span>
+
+        <div class="conditions">
+          <span class="name">conditions</span>
+          <dl class="conditions">
+            <dt>path</dt><dd>/json</dd>
+          </dl>
+          <input type="button" value="+"/>
+        </div>
+
+        <div class="options">
+          <span class="name">options</span>
+          <dl>
+            <dt>factory</dt>
+            <dd>%(self)s</dd>
+          </dl>
+        </div>
+      </div>
+    </li>
+    <li>
+      <input type="button" value="+"/>
+    </li>
+  </ol>
+</span>
+
+</body>
+</html>