From c4809026c6677c86a101295c1785659b01dff5ee Mon Sep 17 00:00:00 2001
From: Brad Fitzpatrick <brad@danga.com>
Date: Sun, 23 Jan 2011 21:48:04 -0800
Subject: [PATCH] Shell of a website.

---
 website/content/code         |   3 +
 website/content/contributors |  13 +++
 website/content/index.html   |  24 ++++-
 website/static/all.css       | 198 +++++++----------------------------
 website/tmpl/page.html       |  58 +++++-----
 5 files changed, 104 insertions(+), 192 deletions(-)
 create mode 100644 website/content/code
 create mode 100644 website/content/contributors

diff --git a/website/content/code b/website/content/code
new file mode 100644
index 000000000..3c102df43
--- /dev/null
+++ b/website/content/code
@@ -0,0 +1,3 @@
+<h1>Code</h1>
+
+<p>Sorry, still setting up various hosting bits...</p>
diff --git a/website/content/contributors b/website/content/contributors
new file mode 100644
index 000000000..b79579837
--- /dev/null
+++ b/website/content/contributors
@@ -0,0 +1,13 @@
+<h1>Contributors</h1>
+
+<p>Camlistore contributors include:</p>
+
+<ul>
+<li><a href="http://bradfitz.com/">Brad Fitzpatrick</a></li>
+<li><a href="http://www.google.com/profiles/bslatkin">Brett Slatin</a></li>
+<li><a href="http://www.erat.org/">Dan Erat</a></li>
+<li><a href="http://neugierig.org/">Evan Martin</a></li>
+<li><a href="http://www.imperialviolet.org/">Adam Langley</a></li>
+<li><a href="http://nf.id.au/">Andrew Gerrand</a></li>
+</ul>
+
diff --git a/website/content/index.html b/website/content/index.html
index 51c0870e7..305364b13 100644
--- a/website/content/index.html
+++ b/website/content/index.html
@@ -1,3 +1,25 @@
 <h1>What is Camlistore?</h1>
-<p>Camlistore is a way of storing, syncing, sharing, modelling and backing up content.</p>
 
+<p>Camlistore is:</p>
+<ul>
+  <li>a way to store, sync, share, model and back up content</li>
+  <li>a work in progress</li>
+  <li>Open Source (Apache licensed)</li>
+  <li>an acronym for <i>"Content-Addressable Multi-Layer Indexed Storage"</i>, hinting that Camlistore is about:
+      <ul>
+        <li>content-addressable storage</li>
+        <li>separate interoperable parts (storage, sync, sharing,
+        modeling), with well-defined protocols and roles</li>
+      </ul></li>
+  <li>your "home directory for the web"</li>
+  <li>pro-JSON (yet aggressively format agnostic)</li>
+  <li>pro-GnuPG (for signing claims)</li>
+  <li>pro-paranoia and privacy</li>
+  <li>ambitious, but ...</li>
+  <li>simple!</li>
+  <li>programning language-agnostic (parts and different implementations in <a href="http://golang.org/">Go</a>, Python, Java, Perl, Bash, ... the language doesn't matter.)</li>
+  <li>neither "Cloud" nor "Local".  happily both.</li>
+  <li>a "20% project" from a few Google employees, but not Google-centric nor endorsed by Google (other than them letting us open source our side project)</li>
+  <li>not yet ready for users</li>
+  <li>ready for developers (at least those without strong color preferences)</li>
+</ul>
diff --git a/website/static/all.css b/website/static/all.css
index c8a6f20af..184348201 100644
--- a/website/static/all.css
+++ b/website/static/all.css
@@ -1,173 +1,55 @@
-/* General Styles */
 body {
-  font-family: "Helvetica", Arial, sans-serif;
-  font-size: 84.25%;
-  line-height: 1.23em;
-  padding: 0;
-  margin: 1.23em;
-  background: white;
-  color: black;
-}
-a {
-  color: #04a;
-  text-decoration: none;
-}
-a:visited {
-  color: #04a;
-}
-a:hover {
-  color: #a40;
-  text-decoration: underline;
-}
-a:active {
-  color: #c00;
-}
-code, pre {
-  font-size: 1.2em; 
-}
-pre {
-  background: #F0F0F0;
-  padding: 0.5em 1em;
+  margin-top: 0;
+  font-family: 'Droid Sans', arial, serif;
 }
 
-/* Top bar */
-#container {
-  width: 100%;
-  margin: auto;
-}
-#topnav {
-  height: 55px;
-  background: url(/static/logo.png) no-repeat top left;
-}
-a#logo-box {
-  display: block;
-  height: 55px;
-}
-h1#title {
-  display: none;
-}
-#nav-main {
-  float: right;
-  width: 500px;
-  margin-top: -5px;
+#header {
   text-align: center;
 }
-#nav-main ul {
-  padding-left: 0;
-  margin-left: 0;
-  margin-bottom: 0.5em;
-}
-#nav-main li a {
-  display: inline;
-  display: inline-block;
-  padding: .46em .62em .38em .62em;
-}
-#nav-main li a:link,
-#nav-main li a:visited {
-  color: #000;
-}
-#nav-main li {
-  display: inline;
-  display: inline-block;
-  background: #e6e6e6 url(/doc/button_background.png) repeat-x;
-  border: solid 1px #999;
-  margin-left: -1px;
-  text-shadow: #fff 0 1px 0;
-  box-shadow: 0 1px 1px #ccc;
-  -moz-box-shadow: 0 1px 1px #ccc;
-  -webkit-box-shadow: 0 1px 1px #ccc;
-}
-#nav-main li:first-child {
-  -moz-border-top-left-radius: 4px;
-  border-top-left-radius: 4px;
-  -moz-border-bottom-left-radius: 4px;
-  border-bottom-left-radius: 4px;
-}
-#nav-main li:last-child {
-  -moz-border-top-right-radius: 4px;
-  border-top-right-radius: 4px;
-  -moz-border-bottom-right-radius: 4px;
-  border-bottom-right-radius: 4px;
-}
-#nav-main .quickref {
-  color: #444;
-}
-#nav-main .quickref .sep {
-  color: #999;
-}
-#search {
-  width: 100px;
-  margin-left: 0.5em;
-}
-#search.inactive {
-  text-align: center;
-  color: #444;
-}
 
-/* Footer */
-#site-info {
-  position: relative;
+div.bar {
+  height: 43px;
+  width: 788;
   text-align: center;
-}
-#site-info, #site-info a:link, #site-info a:visited {
-  color: #aaa;
-}
-
-/* Content */
-#content {
-  clear: both;
-  padding: 0;
-  position: relative;
-  margin-top: 1.5em;
-  margin-bottom: 1.5em;
-  border-top: solid 1px #aaa;
-  border-bottom: solid 1px #aaa;
-}
-.left-column {
-  width: 49%;
-  float: left;
-}
-.right-column {
-  width: 49%;
-  float: right;
-}
-.end-columns {
-  clear: both;
-}
-#content h1 {
-  margin-bottom: -0em;
-  padding: 0;
-}
-#content h2 {
-  border-top: 1px solid #ddd;
-  background: #E2E7F0;
-  padding: 5px;
-  margin: 1.5em 0 0;
-}
-#content .subtitle {
+  background: url(camli-bar-background.png);
+  margin-left: auto;
+  margin-right: auto;
   margin-top: 1em;
-  display: block;
-}
-.navtop a {
-  font-weight: normal; font-size: 7pt; 
-  float: right; color: #999;
+  margin-bottom: 1em;
 }
 
-/* Content and Code Highlighting */
-span.comment {
-  color: #002090;
+div.bar div.hatecss {
+  display: table-cell;
+  vertical-align: middle;
+  text-align: center;
+  width: 788px;
+  height: 43px;
+  /* border: 1px solid red; */
+  margin: 0;
+  font-weight: bold;
+  font-size: 18px;
+  color: #fff;
+  font-family: 'Droid Sans', arial, serif;
+  text-transform: uppercase; 
 }
-span.highlight {
-  background: #FFFF90;
-  font-weight: bold;}
 
-span.alert {
-  color: #D00000;
+div.bar div.hatecss a {
+  color: #fff;
+  margin-left: 0.4em;
+  margin-right: 0.4em;
 }
-#nav table {
-  width: 100%;
+
+div.content {
+  width: 788px;
+  margin-left: auto;
+  margin-right: auto;
+  margin-top: 1em;
+  margin-bottom: 1em;
+  line-height: 140%;
 }
-.detail {
-  padding: 0.25em 1em;
-  background: #F4F4F4;
+
+#props {
+  margin-top:2em;
+  text-align: center;
+  font-size: small;
 }
diff --git a/website/tmpl/page.html b/website/tmpl/page.html
index beb4ef51e..bb57d7293 100644
--- a/website/tmpl/page.html
+++ b/website/tmpl/page.html
@@ -1,4 +1,3 @@
-<!DOCTYPE html>
 <html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
@@ -9,45 +8,38 @@
 {.end}
 <link rel="icon" href="/static/favicon.ico" type="image/x-icon">
 <link rel="shortcut icon" href="/static/favicon.ico" type="image/x-icon">
+<link href='http://fonts.googleapis.com/css?family=Droid+Sans:regular,bold' rel='stylesheet' type='text/css'>
 <link rel="stylesheet" href="/static/all.css" type="text/css" media="all" charset="utf-8">
-<!--[if lt IE 8]>
-<link rel="stylesheet" href="/static/ie.css" type="text/css">
-<![endif]-->
 </head>
 <body>
-<div id="container">
-  <div id="topnav">
-    <h1 id="title">Camlistore</h1>
-    <div id="nav-main">
-      <ul>
-      <li><a href="/">Home</a></li>
-      <li><a href="/use-cases.html">Use Cases</a></li> 
-      <li><a href="/code.html">Code</a></li> 
-      <li><a href="/terminology.html">Terminology</a></li> 
-      <li><a href="/community.html">Community</a></li> 
-      </ul>
-    </div>
-    <a id="logo-box" href="/"></a>
-  </div>
-  <div id="content">
-  <!-- Menu is HTML-escaped elsewhere -->
+
+<div id='header'>
+<a href="/"><img width='788' height='161' src='/static/camli-header.png' title="Camlistore" border='0' /></a>
+</div>
+
+<div class='bar'><div class='hatecss'>
+  <a href='/'>About</a>
+  <a href='/code'>Code</a>
+  <a href='/contributors'>Contributors</a>
+  <a href='http://groups.google.com/group/camlistore/'>Mailing List</a>
+  <a href='http://code.google.com/p/camlistore/w/list'>Wiki</a>
+  <a href='http://code.google.com/p/camlistore/issues/list'>Bugs</a>
+</div></div>
 
   {.section Title}
-    <h1 id="generatedHeader">{@|html-esc}</h1>
+    <h1>{@|html-esc}</h1>
   {.end}
-  {.section Subtitle}
-    <span class="subtitle">{@|html-esc}</span>
-  {.end}
-
-  <p>
-  <!-- The Table of Contents is automatically inserted in this <div>.
-       Do not delete this <div>. -->
-  <div id="nav"></div>
-  </p>
-
-  <!-- Content is HTML-escaped elsewhere -->
+ 
+<div class='content'>
+   <!-- Content is HTML-escaped elsewhere -->
   {Content}
-  </div>
 </div>
+
+<div class='bar'><div class='hatecss'>
+</div></div>
+<div id='props'>
+Website design inspired by <a href="http://git-scm.com/">git</a> and <a href="http://memcached.org/">memcached</a>.
+</div>
+
 </body>
 </html>