* Set up a style sheet (sitestyle.css) for the whole system. Thanks to
authorArt Cancro <ajc@citadel.org>
Sat, 21 Feb 2004 22:27:34 +0000 (22:27 +0000)
committerArt Cancro <ajc@citadel.org>
Sat, 21 Feb 2004 22:27:34 +0000 (22:27 +0000)
  our clever header/footer PHP code, it was very easy.  :)

ctdlphp/ctdlheader.php
ctdlphp/sitestyle.css [new file with mode: 0644]

index 3eaa8a855192604a5980b63868f3599686ebdf54..7ae0132d85f5f28499e1e6e743d087ec4cb5a7df 100644 (file)
@@ -28,6 +28,7 @@ function bbs_page_header() {
 <html>
 <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
+       <link rel="stylesheet" href="sitestyle.css" type="text/css" />
        <meta name="Description" content="Citadel BBS">
        <meta name="Keywords" content="citadel,bbs">
        <meta name="MSSmartTagsPreventParsing" content="TRUE">
@@ -56,37 +57,45 @@ LITERAL;
 
 LITERAL;
 
+       echo '<div id="Header">';
        echo '<TABLE BORDER=0 WIDTH=100%>';
        echo '<TR>';
        echo '<TD>' . $_SESSION["serv_humannode"] . '</TD>' ;
        echo '<TD>' . $_SESSION["username"] . '</TD>' ;
        echo '<TD>' . $_SESSION["room"] . '</TD>' ;
        echo '<TD ALIGN=RIGHT><A HREF="logout.php">Log out</A></TD>' ;
-       echo '</TR></TABLE><BR>';
+       echo '</TR></TABLE>';
+       echo '</div>';
 
        // Temporary menu
        if ($_SESSION["logged_in"]) {
-               echo    '<a href="listrooms.php">' .
-                       'room list</A> ' .
+               echo    '<div id="Menu">' .
+                       '<a href="listrooms.php">' .
+                       'room list</A><BR>' .
                        '<a href="readmsgs.php?mode=all&count=0">' .
-                       'Read all messages</a> ' .
+                       'Read all</a><BR>' .
                        '<a href="readmsgs.php?mode=new&count=0">' .
-                       'Read new messages</a> ' .
+                       'Read new</a><BR>' .
                        '<a href="display_enter.php">' .
-                       'Enter a message</a> ' .
+                       'Enter msg</a><BR>' .
                        '<a href="who.php">' .
-                       'Who is online?</a> ' .
+                       'Who is online?</a><BR>' .
                        '<A HREF="logout.php">' .
-                       'Log out</A><HR>' ;
+                       'Log out</A>' .
+                       '</div>' ;
        }
 
+       echo '<div id="Content">' ;
+
 }
 
 
 function bbs_page_footer() {
-       echo "<HR>";
-       echo "Powered by Citadel.  And a few cups of coffee.<BR>\n";
-       echo "</BODY></HTML>\n";
+       //echo "<HR>";
+       //echo "Powered by Citadel.  And a few cups of coffee.<BR>\n";
+
+       echo '</div>' ;
+       echo '</BODY></HTML>\n';
 }
 
 
diff --git a/ctdlphp/sitestyle.css b/ctdlphp/sitestyle.css
new file mode 100644 (file)
index 0000000..d2944ab
--- /dev/null
@@ -0,0 +1,108 @@
+/*
+ * $Id$
+ *
+ * Shamelessly swiped from ESR's home page.  http://www.catb.org/~esr/
+ *
+ * Originally cribbed from http://bluerobot.com/web/layouts/layout1.html
+ * However, people who merge the hotlink colors are evil and should be killed, 
+ * so I removed that.  Fixing font sizes in pixels is evil, too; is much as 
+ * possible I has move all dimensions to be relative to the associated font 
+ * size. Finally, light grey is a great background color, but lousy for
+ * foreground text on white.
+ */
+
+body {
+       margin:0;
+       padding:0;
+       font-family: bitstream vera sans, helvetica, sans-serif;
+       color:#333;
+       background-color:white;
+       }
+p {
+       font-family: bitstream vera sans, helvetica, sans-serif;
+       margin:0 0 1em 0;
+       padding:0;
+       }
+#Content>p {text-indent:2em; margin:0;}
+#Content>p+p {text-indent:2em;}
+
+h1 {
+       font-size: x-large;
+       margin-bottom: 0.25ex;
+       }
+h2 {
+       font-size: large;
+       margin-bottom: 0.25ex;
+       }
+
+a {
+       text-decoration:none;
+       font-family:verdana, arial, bitstream vera sans, helvetica, sans-serif;
+       }
+a:hover {background-color:#ccc;}
+
+#Header {
+       font-weight:600;
+       font-size: x-large;     /* should be same as an h1 header */
+       margin:20px 0 10px 0;
+       padding:0.3ex 0 1.3ex 20px;
+       border-style:solid;
+       border-color:black;
+       border-width:1px 0;
+       background-color:#eee;
+
+/* Here is the ugly brilliant hack that protects IE5/Win from its own
+stupidity.  Thanks to Tantek Celik for the hack and to Eric Costello
+for publicizing it.  IE5/Win incorrectly parses the "\"}"" value,
+prematurely closing the style declaration. The incorrect IE5/Win value
+is above, while the correct value is below. See
+http://glish.com/css/hacks.asp for details. */
+
+       voice-family: "\"}\"";
+       voice-family:inherit;
+       height:1ex+3px; /* UNTESTED!  Was 14px */
+       }
+/* I've heard this called the "be nice to Opera 5" rule. Basically, it
+feeds correct length values to user agents that exhibit the parsing
+error exploited above yet get the CSS box model right and understand
+the CSS2 parent-child selector. ALWAYS include a "be nice to Opera 5"
+rule every time you use the Tantek Celik hack (above). */
+body>#Header {height:14px;}
+
+#Content {
+       /* Left margin is menu width + 3em
+        */
+       margin:0 50px 50px 11em;
+       padding:10px;
+       }
+
+#Menu {
+       position:absolute;
+       top:80px;
+       left:20px;
+       width:8em;
+       padding:0.5em;
+       background-color:#eee;
+       border:1px dashed #999;
+/* Again, the ugly brilliant hack. */
+       voice-family: "\"}\"";
+       voice-family:inherit;
+       width:8em;
+       }
+/* Again, "be nice to Opera 5". */
+body>#Menu {width:8em;}
+
+/* For convenience */
+.centered {
+       text-align: center;
+       margin-left: auto;
+       margin-right: auto;
+       }
+
+.notebox {
+       background-color:#eee;
+       border:1px dashed #999;
+       margin: 15px;
+       font-size:small;
+       text-indent: 0;
+}