css support
authorjoey <joey@0fa5a96a-9a0e-0410-b3b2-a0fd24251071>
Wed, 29 Mar 2006 07:24:03 +0000 (07:24 +0000)
committerjoey <joey@0fa5a96a-9a0e-0410-b3b2-a0fd24251071>
Wed, 29 Mar 2006 07:24:03 +0000 (07:24 +0000)
IkiWiki/CGI.pm
IkiWiki/Render.pm
basewiki/style.css [new file with mode: 0644]
doc/todo/html.mdwn
ikiwiki
templates/blogpost.tmpl
templates/editpage.tmpl
templates/inlinepagetitle.tmpl
templates/misc.tmpl
templates/page.tmpl
templates/recentchanges.tmpl

index 52da67b9a13453ba4c83fc81edc474a4da89d360..67bce67952c044d00007471b459bf7ab2fd7cd8a 100644 (file)
@@ -38,6 +38,7 @@ sub cgi_recentchanges ($) { #{{{
                indexlink => indexlink(),
                wikiname => $config{wikiname},
                changelog => [rcs_recentchanges(100)],
                indexlink => indexlink(),
                wikiname => $config{wikiname},
                changelog => [rcs_recentchanges(100)],
+               styleurl => styleurl(),
        );
        print $q->header, $template->output;
 } #}}}
        );
        print $q->header, $template->output;
 } #}}}
@@ -64,7 +65,8 @@ sub cgi_signin ($$) { #{{{
                action => $q->request_uri,
                header => 0,
                template => (-e "$config{templatedir}/signin.tmpl" ?
                action => $q->request_uri,
                header => 0,
                template => (-e "$config{templatedir}/signin.tmpl" ?
-                             "$config{templatedir}/signin.tmpl" : "")
+                             "$config{templatedir}/signin.tmpl" : ""),
+               stylesheet => styleurl(),
        );
        
        $form->field(name => "name", required => 0);
        );
        
        $form->field(name => "name", required => 0);
@@ -228,7 +230,8 @@ sub cgi_prefs ($$) { #{{{
                params => $q,
                action => $q->request_uri,
                template => (-e "$config{templatedir}/prefs.tmpl" ?
                params => $q,
                action => $q->request_uri,
                template => (-e "$config{templatedir}/prefs.tmpl" ?
-                             "$config{templatedir}/prefs.tmpl" : "")
+                             "$config{templatedir}/prefs.tmpl" : ""),
+               stylesheet => styleurl(),
        );
        my @buttons=("Save Preferences", "Logout", "Cancel");
        
        );
        my @buttons=("Save Preferences", "Logout", "Cancel");
        
@@ -323,6 +326,7 @@ sub cgi_editpage ($$) { #{{{
        $form->tmpl_param("indexlink", indexlink());
        $form->tmpl_param("helponformattinglink",
                htmllink("", "HelpOnFormatting", 1));
        $form->tmpl_param("indexlink", indexlink());
        $form->tmpl_param("helponformattinglink",
                htmllink("", "HelpOnFormatting", 1));
+       $form->tmpl_param("styleurl", styleurl());
        if (! $form->submitted) {
                $form->field(name => "rcsinfo", value => rcs_prepedit($file),
                        force => 1);
        if (! $form->submitted) {
                $form->field(name => "rcsinfo", value => rcs_prepedit($file),
                        force => 1);
index 1fc047a62f78ed8b21d2cde47940363a65930d09..7d1e8ee53fb98884b7a2e8a45157f9b0b83bb0af 100644 (file)
@@ -227,6 +227,7 @@ sub genpage ($$$) { #{{{
                backlinks => [backlinks($page)],
                discussionlink => htmllink($page, "Discussion", 1, 1),
                mtime => scalar(gmtime($mtime)),
                backlinks => [backlinks($page)],
                discussionlink => htmllink($page, "Discussion", 1, 1),
                mtime => scalar(gmtime($mtime)),
+               styleurl => styleurl($page),
        );
        
        return $template->output;
        );
        
        return $template->output;
diff --git a/basewiki/style.css b/basewiki/style.css
new file mode 100644 (file)
index 0000000..82a01d8
--- /dev/null
@@ -0,0 +1,68 @@
+#header h1 {
+       margin: 0;
+       padding: 2px 0;
+}
+
+#actions ul {
+       margin: 0;
+       padding: 2px;
+       list-style-type: none;
+       border-bottom: 1px solid #000;
+}
+
+#actions li {
+       display: inline;
+       padding: .2em .4em;
+}
+
+#content {
+       border-bottom: 1px solid #000;
+}
+
+/* Used for adding a blog page. */
+#blogform {
+       padding: 10px 10px;
+       border: 1px solid #aaa;
+       background: #eee;
+}
+
+#backlinks {
+       margin: 1em 0;
+}
+
+#footer {
+       margin: 1em 0;
+}
+
+#pageinfo {
+       font-style: italic;
+}
+
+/* Used for invalid form fields. */
+.fb_invalid {
+       color: red;
+}
+
+/* Used for required form fields. */
+.fb_required {
+       fornt-style: bold;
+}
+
+/* RSS button. */
+.rssbutton {
+       background: #ff6600;
+       color: white !important;
+       border-left: 1px solid #cc9966;
+       border-top: 1px solid #ccaa99;
+       border-right: 1px solid #993300;
+       border-bottom: 1px solid #331100;
+       padding: 0px 0.5em 0px 0.5em;
+       font-family: helvetica, arial, sans-serif;
+       font-weight: bold;
+       font-size: small;
+       text-decoration: none;
+       margin-top: 1em;
+}
+.rssbutton:hover {
+       background: #ff9900;
+}
index c6feb1b667753738e9467c5d0987d107eebe0f9a..741b42ccda514c7c3abb89bdf600669d7612ea36 100644 (file)
@@ -1,8 +1,8 @@
-Add css and prettify. Make RecentChanges use table for
+Create some nice stylesheets. Make RecentChanges use table for
 formatting, and images to indicate web vs svn commits and to link to diffs.
 
 All of this should be doable w/o touching a single line of code, just
 formatting, and images to indicate web vs svn commits and to link to diffs.
 
 All of this should be doable w/o touching a single line of code, just
-editing the [[templates]] BTW.
+editing the [[templates]] and/or editing [[style.css]] BTW.
 
 ## html validation
 
 
 ## html validation
 
@@ -41,6 +41,5 @@ editing the [[templates]] BTW.
        markdown enclosing it in other spanning tags in some cases.
        I've implemented this hack now. :-/ --[[Joey]]
 
        markdown enclosing it in other spanning tags in some cases.
        I've implemented this hack now. :-/ --[[Joey]]
 
-  * This page is now valid, although the validator conplains at having to guess the encoding. Should the encoding be forced to utf-8 in the templates?
-
+This page is now valid.
 Test: [validate this page](http://validator.w3.org/check?url=referer)
 Test: [validate this page](http://validator.w3.org/check?url=referer)
diff --git a/ikiwiki b/ikiwiki
index d1173d399fe330f503c173f916dca2ff5fe1851d..7a16be3ca907a411d907dd467985b289e05434de 100755 (executable)
--- a/ikiwiki
+++ b/ikiwiki
@@ -265,6 +265,16 @@ sub cgiurl (@) { #{{{
        return $config{cgiurl}."?".join("&amp;", map "$_=$params{$_}", keys %params);
 } #}}}
 
        return $config{cgiurl}."?".join("&amp;", map "$_=$params{$_}", keys %params);
 } #}}}
 
+sub styleurl (;$) { #{{{
+       my $page=shift;
+
+       return "$config{url}/style.css" if ! defined $page;
+       
+       $page=~s/[^\/]+$//;
+       $page=~s/[^\/]+\//..\//g;
+       return $page."style.css";
+} #}}}
+
 sub htmllink ($$;$$$) { #{{{
        my $page=shift;
        my $link=shift;
 sub htmllink ($$;$$$) { #{{{
        my $page=shift;
        my $link=shift;
@@ -300,7 +310,7 @@ sub htmllink ($$;$$$) { #{{{
        $bestlink=File::Spec->abs2rel($bestlink, dirname($page));
        
        if (! $noimageinline && isinlinableimage($bestlink)) {
        $bestlink=File::Spec->abs2rel($bestlink, dirname($page));
        
        if (! $noimageinline && isinlinableimage($bestlink)) {
-               return "<img src=\"$bestlink\" alt=\"$linktext\">";
+               return "<img src=\"$bestlink\" alt=\"$linktext\" />";
        }
        return "<a href=\"$bestlink\">$linktext</a>";
 } #}}}
        }
        return "<a href=\"$bestlink\">$linktext</a>";
 } #}}}
@@ -395,6 +405,7 @@ sub misctemplate ($$) { #{{{
                indexlink => indexlink(),
                wikiname => $config{wikiname},
                pagebody => $pagebody,
                indexlink => indexlink(),
                wikiname => $config{wikiname},
                pagebody => $pagebody,
+               styleurl => styleurl(),
        );
        return $template->output;
 }#}}}
        );
        return $template->output;
 }#}}}
index 8e4bb6a7dcba9b29ee944100739c131a9418e293..22253d60bcf828b4c37ac08d38f0fb930c6b669b 100644 (file)
@@ -1,9 +1,9 @@
-<hr />
-<form action="<TMPL_VAR CGIURL>" method="GET">
-<input type="hidden" name="do" value="blog">
-<input type="hidden" name="from" value="<TMPL_VAR ROOTPAGE>">
-<input type="hidden" name="subpage" value="1">
-Add a new post titled: <input name=title size=40>
-<input type="submit" value="Edit">
+<form action="<TMPL_VAR CGIURL>" method="get">
+<div id="blogform">
+<input type="hidden" name="do" value="blog" />
+<input type="hidden" name="from" value="<TMPL_VAR ROOTPAGE>" />
+<input type="hidden" name="subpage" value="1" />
+Add a new post titled: <input name="title" size="40" />
+<input type="submit" value="Edit" />
+</div>
 </form>
 </form>
-<hr />
index f77f450364c30af85589d522d3a8243557fefe77..1733483d311b1618e2c6e5f2b76da00e3f209b61 100644 (file)
@@ -1,7 +1,11 @@
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html>
-<head><title><TMPL_VAR FORM-TITLE></title></head>
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<title><TMPL_VAR FORM-TITLE></title>
+<link rel="stylesheet" href="<TMPL_VAR STYLEURL>" type="text/css" />
+</head>
 <body>
 <TMPL_IF NAME="PAGE_CONFLICT">
 <p>
 <body>
 <TMPL_IF NAME="PAGE_CONFLICT">
 <p>
@@ -31,8 +35,12 @@ Optional comment about this change:<br />
 <TMPL_VAR FORM-END>
 <hr />
 <TMPL_IF NAME="PAGE_PREVIEW">
 <TMPL_VAR FORM-END>
 <hr />
 <TMPL_IF NAME="PAGE_PREVIEW">
+<div id="header">
 <h1>Page preview:</h1>
 <h1>Page preview:</h1>
+</div>
+<div id="content">
 <TMPL_VAR PAGE_PREVIEW>
 <TMPL_VAR PAGE_PREVIEW>
+</div>
 <TMPL_ELSE>
 <TMPL_VAR HELPONFORMATTINGLINK>
 </TMPL_IF>
 <TMPL_ELSE>
 <TMPL_VAR HELPONFORMATTINGLINK>
 </TMPL_IF>
index 06af446ef42df0899ed3937ce6bc88da3bf2b1fb..91f34b1d3b903697440145ffb3263cd4ae05df02 100644 (file)
@@ -1,4 +1,4 @@
 <p>
 <p>
-<TMPL_VAR PAGELINK><br>
+<TMPL_VAR PAGELINK><br />
 <i>(posted <TMPL_VAR CTIME>)</i>
 </p>
 <i>(posted <TMPL_VAR CTIME>)</i>
 </p>
index 3e78c31622d3266d87b60691fb7d9418ceaec4c7..98d60d7032c98df09e6907345737caad1d2003aa 100644 (file)
@@ -1,7 +1,11 @@
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html>
-<head><title><TMPL_VAR TITLE></title></head>
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<title><TMPL_VAR TITLE></title>
+<link rel="stylesheet" href="<TMPL_VAR STYLEURL>" type="text/css" />
+</head>
 <body>
 
 <h1>
 <body>
 
 <h1>
index e221693237e33f6ad64cd156b8fdb990c84a51e7..8b018ddfb0d6d33b1ad526b09ebab0ecf64c2079 100644 (file)
@@ -1,57 +1,66 @@
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html>
-<head><title><TMPL_VAR TITLE></title></head>
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<title><TMPL_VAR TITLE></title>
+<link rel="stylesheet" href="<TMPL_VAR STYLEURL>" type="text/css" />
+</head>
 <body>
 
 <body>
 
+<div id="header">
 <h1>
 <TMPL_LOOP NAME="PARENTLINKS">
 <a href="<TMPL_VAR NAME=URL>"><TMPL_VAR NAME=PAGE></a>/ 
 </TMPL_LOOP>
 <TMPL_VAR TITLE>
 </h1>
 <h1>
 <TMPL_LOOP NAME="PARENTLINKS">
 <a href="<TMPL_VAR NAME=URL>"><TMPL_VAR NAME=PAGE></a>/ 
 </TMPL_LOOP>
 <TMPL_VAR TITLE>
 </h1>
+</div>
 
 
-<p>
+<div id="actions">
+<ul>
 <TMPL_IF NAME="EDITURL">
 <TMPL_IF NAME="EDITURL">
-<a href="<TMPL_VAR EDITURL>">Edit</a>&nbsp;
+<li><a href="<TMPL_VAR EDITURL>">Edit</a></li>
 </TMPL_IF>
 
 <TMPL_IF NAME="RECENTCHANGESURL">
 </TMPL_IF>
 
 <TMPL_IF NAME="RECENTCHANGESURL">
-<a href="<TMPL_VAR RECENTCHANGESURL>">RecentChanges</a>&nbsp;
+<li><a href="<TMPL_VAR RECENTCHANGESURL>">RecentChanges</a></li>
 </TMPL_IF>
 
 <TMPL_IF NAME="HISTORYURL">
 </TMPL_IF>
 
 <TMPL_IF NAME="HISTORYURL">
-<a href="<TMPL_VAR HISTORYURL>">History</a>&nbsp;
+<li><a href="<TMPL_VAR HISTORYURL>">History</a></li>
 </TMPL_IF>
 
 <TMPL_IF NAME="PREFSURL">
 </TMPL_IF>
 
 <TMPL_IF NAME="PREFSURL">
-<a href="<TMPL_VAR PREFSURL>">Preferences</a>&nbsp;
+<li><a href="<TMPL_VAR PREFSURL>">Preferences</a></li>
 </TMPL_IF>
 
 </TMPL_IF>
 
-<TMPL_VAR DISCUSSIONLINK><br />
-</p>
+<li><TMPL_VAR DISCUSSIONLINK><br /></li>
+</ul>
+</div>
 
 
-<hr />
+<div id="content">
 <TMPL_VAR CONTENT>
 <TMPL_VAR CONTENT>
-<hr />
+</div>
 
 
+<div id="backlinks">
 <TMPL_IF NAME="BACKLINKS">
 <TMPL_IF NAME="BACKLINKS">
-<p>Links:
+Links:
 <TMPL_LOOP NAME="BACKLINKS">
 <a href="<TMPL_VAR NAME=URL>"><TMPL_VAR NAME=PAGE></a>
 </TMPL_LOOP>
 <TMPL_LOOP NAME="BACKLINKS">
 <a href="<TMPL_VAR NAME=URL>"><TMPL_VAR NAME=PAGE></a>
 </TMPL_LOOP>
-</p>
 </TMPL_IF>
 </TMPL_IF>
+</div>
 
 
-<p>
-<i>
+<div id="footer">
+<span id="pageinfo">
 <!-- from <TMPL_VAR NAME=WIKINAME> -->
 Last edited <TMPL_VAR NAME=MTIME>
 <!-- from <TMPL_VAR NAME=WIKINAME> -->
 Last edited <TMPL_VAR NAME=MTIME>
+</span>
 <TMPL_IF NAME="RSSURL">
 <TMPL_IF NAME="RSSURL">
-; <a type="application/rss+xml" href="<TMPL_VAR NAME=RSSURL>">RSS</a>
+<a class="rssbutton" type="application/rss+xml" href="<TMPL_VAR NAME=RSSURL>">RSS</a>
 </TMPL_IF>
 </TMPL_IF>
-</i>
-</p>
+</div>
 
 </body>
 </html>
 
 </body>
 </html>
index 4ab53b89222463b5bad7ff71d8fc2b5a041ce23f..9836e1f2af7153617fad760d400fd9bc8902dac7 100644 (file)
@@ -1,15 +1,20 @@
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html>
-<head><title><TMPL_VAR TITLE></title></head>
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<title><TMPL_VAR TITLE></title>
+<link rel="stylesheet" href="<TMPL_VAR STYLEURL>" type="text/css" />
+</head>
 <body>
 
 <body>
 
+<div id="header">
 <h1>
 <TMPL_VAR INDEXLINK>/ <TMPL_VAR TITLE>
 </h1>
 <h1>
 <TMPL_VAR INDEXLINK>/ <TMPL_VAR TITLE>
 </h1>
+</div>
 
 
-<hr />
-
+<div id="content">
 <ul>
 <TMPL_LOOP NAME="CHANGELOG">
        <li> <!-- <TMPL_VAR NAME="REV"> -->
 <ul>
 <TMPL_LOOP NAME="CHANGELOG">
        <li> <!-- <TMPL_VAR NAME="REV"> -->
@@ -32,6 +37,7 @@
        </li>
 </TMPL_LOOP>
 </ul>
        </li>
 </TMPL_LOOP>
 </ul>
+</div>
 
 <!-- from <TMPL_VAR NAME=WIKINAME> -->
 
 
 <!-- from <TMPL_VAR NAME=WIKINAME> -->