Merge pull request #20 from chr15m/web-design

Web design changes, fixes, standards compliance.

Makefile-web

@@ -8,6 +8,7 @@ WEB_SUBDIRS=$(WEBDIR)/tarballs $(WEBDIR)/junkcode $(WEBDIR)/tarballs/with-deps $
 JUNKDIRS=$(wildcard junkcode/*)
 JUNKPAGES=$(JUNKDIRS:%=$(WEBDIR)/%.html)
 JUNKBALLS=$(JUNKDIRS:%=$(WEBDIR)/%.tar.bz2)
+PRETTIFY=$(WEBDIR)/prettify/src/run_prettify.js $(WEBDIR)/prettify/src/prettify.css
 
 upload: fastcheck modcheck
 	git push origin HEAD:master
@@ -18,20 +19,23 @@ modcheck:
 	@FOUND=$$(echo $$(find ccan -name _info | sed 's,ccan/\(.*\)/_info,\1,' | sort) ); LISTED=$$(echo $$(echo $(MODS) | tr ' ' '\012' | sort) ); if [ "$$FOUND" = "$$LISTED" ]; then exit 0; fi; while true; do a="$${FOUND%% *}"; b="$${LISTED%% *}"; if [ "$$a" != "$$b" ]; then echo "$$a found but $$b in MOD" >&2; exit 1; fi; FOUND="$${FOUND#* }"; LISTED="$${LISTED#* }"; done
 
 clean-tree:
-	! git status --porcelain | grep .
+	[ "$(WEBDEV)" ] || ! git status --porcelain | grep .
 
-webpages: modcheck clean-tree $(WEB_SUBDIRS) $(WEBDIR)/index.html $(WEBDIR)/upload.html $(WEBDIR)/uploader.php $(WEBDIR)/example-config.h $(WEBDIR)/ccan.jpg $(DIRECT_TARBALLS) $(DEPEND_TARBALLS) $(WEBDIR)/ccan.tar.bz2 $(WEBDIR)/Makefile-ccan $(ALL_PAGES) junkpages
+webpages: modcheck clean-tree $(WEB_SUBDIRS) $(PRETTIFY) $(WEBDIR)/index.html $(WEBDIR)/upload.html $(WEBDIR)/uploader.php $(WEBDIR)/example-config.h $(WEBDIR)/ccan.png $(WEBDIR)/ccan-bg.png $(WEBDIR)/ccan.css $(DIRECT_TARBALLS) $(DEPEND_TARBALLS) $(WEBDIR)/ccan.tar.bz2 $(WEBDIR)/Makefile-ccan $(ALL_PAGES) junkpages
 
 junkpages: $(WEBDIR)/list.html $(WEBDIR)/junkcode $(JUNKPAGES) $(JUNKBALLS)
 $(WEB_SUBDIRS): $(WEBDIR)
 	mkdir -p $@
 
+$(PRETTIFY):
+	svn checkout http://google-code-prettify.googlecode.com/svn/trunk/ $(WEBDIR)/prettify
+
 $(WEBDIR)/junkcode/%.tar.bz2: junkcode/% $(WEBDIR)/junkcode
 	git ls-files -z $< | xargs -0 -x tar cvfj $@ 
 
 $(WEBDIR)/junkcode/%.html: $(WEBDIR)/junkcode/%.tar.bz2
 	cd $(WEBDIR) && tar xfj junkcode/$*.tar.bz2
-	php5 web/staticjunkcode.php junkcode/$* $* > $@
+	URLPREFIX=../ php5 web/staticjunkcode.php junkcode/$* $* > $@
 
 # We want tarball to contain ccan/; we put junkcode in, but don't depend on it.
 $(WEBDIR)/ccan.tar.bz2: config.h Makefile Makefile-ccan $(shell git ls-files ccan tools licenses)
@@ -58,7 +62,13 @@ $(WEBDIR)/example-config.h: config.h
 $(WEBDIR)/Makefile-ccan: Makefile-ccan
 	cp $< $@
 
-$(WEBDIR)/ccan.jpg: web/ccan.jpg
+$(WEBDIR)/ccan.png: web/ccan.png
+	cp $< $@
+
+$(WEBDIR)/ccan-bg.png: web/ccan-bg.png
+	cp $< $@
+
+$(WEBDIR)/ccan.css: web/ccan.css
 	cp $< $@
 
 $(WEBDIR)/info/%.html: $(WEBDIR)/tarballs/%.tar.bz2 $(WEBDIR)/tarballs/with-deps/%.tar.bz2

web/ccan.css

@@ -0,0 +1,190 @@
+* {
+}
+
+html {
+    border: 0px;
+    margin: 0px;  
+    padding: 0px;
+}
+
+body {
+    background-color: transparent;
+    margin-left: auto;
+    margin-right: auto;
+    color: #333333;
+}
+
+.menulist {
+    border-radius: 5px;
+    margin-left: auto;
+    margin-right: auto;
+    background-image: url(ccan-bg.png);
+    background-position: initial initial;
+    background-repeat: initial initial;
+    font-family: FreeSans, Arial;
+}
+
+.menulist-inner {
+    max-width: 950px;
+    margin-left: auto;
+    margin-right: auto;
+    text-align: center;
+}
+
+ul.menu {
+    float: left;
+    margin-top: 0.75em;
+    margin-left: 0;
+    padding-left: 0;
+}
+
+.menu li {
+    list-style-type: none;
+    margin-left: auto;
+    display: inline-block !important;
+}
+
+/* On phones the menu should display stacked */
+@media screen and (max-width:420px) {
+    .menu li {
+        display: block !important;	
+        padding: 0.5em;
+    }
+    ul.menu {
+        float: none;
+    }
+    .search {
+        text-align: center !important;
+    }
+}
+
+.menu a {
+    font-weight: bold;
+    text-decoration: none;
+    color: darkblue !important;
+    margin-left: 0.5em;
+    margin-right: 0.5em;
+}
+
+.menu a:hover {
+	color: #222222 !important;
+}
+
+.search {
+    text-align: right;
+    padding-top: 0.5em;
+    padding-right: 0.5em;
+}
+
+.search input {
+    margin-bottom: 1em;
+}
+
+table {
+    background: none;
+    max-width: 850px;
+    margin-left: auto;
+    margin-right: auto;
+    padding: 0px;
+    width: 100%;
+}
+
+table a {
+}
+
+table a:hover {
+}
+
+table a:visited {
+}
+
+tbody {
+}
+
+tr {
+}
+
+td {
+}
+
+th {
+}
+
+hr {
+	display: none;
+}
+
+a {
+}
+
+a:hover {
+    color: #222222;
+}
+
+a:visited {
+    color: #0044aa;
+}
+
+p {
+    margin-left: 1em;
+}
+
+h1 {
+}
+
+h2 {
+}
+
+input {
+    padding: 0.25em;
+    border-radius: 2px;
+    border: 1px solid #555555;
+    padding-left: 1em;
+    padding-right: 1em;
+    font-weight: bold;
+    font-family: FreeSans, Arial;
+}
+
+img {
+}
+
+.content {
+    padding: 1em;
+    max-width: 950px;
+    margin-left: auto;
+    margin-right: auto;
+    font-family: FreeSans, Arial;
+}
+
+.logo {
+    padding: 1em;
+    padding-top: 0.5em;
+    margin-bottom: 1em;
+    padding-bottom: 1em;
+    background-color: white;
+    min-height: 63px;
+    font-family: 'Raleway', sans-serif;
+}
+
+.logo img {
+    width: 250px;
+    float: left;
+    margin-bottom: 1em;
+    margin-right: 1em;
+}
+
+.logo h1 {
+    font-size: 1.5em;
+    font-weight: 300;
+    width: 100%;
+    text-align: right;
+    margin-top: 0;
+}
+
+pre {
+    max-width: 95%;
+    overflow: auto;
+    *overflow: scroll;
+    border: 0px !important;
+}
+