Add CSS stylesheet for the text and tables in Common Test and Test Server

Also make general improvements of presentation of results.

OTP-9706

4 files changed, 526 insertions, 193 deletions

diff --git a/lib/common_test/priv/Makefile.in b/lib/common_test/priv/Makefile.in
index f4a0c181f9..d9033f6ef1 100644
--- a/lib/common_test/priv/Makefile.in
+++ b/lib/common_test/priv/Makefile.in
@@ -59,6 +59,7 @@ ifneq ($(findstring win32,$(TARGET)),win32)
 FILES = vts.tool
 SCRIPTS = 
 IMAGES = tile1.jpg
+CSS = ct_default.css
 
 #
 # Rules
@@ -85,11 +86,11 @@ include $(ERL_TOP)/make/otp_release_targets.mk
 ifeq ($(XNIX),true)
 release_spec: opt
 	$(INSTALL_DIR) $(RELSYSDIR)/priv
-	$(INSTALL_DATA) $(FILES) $(IMAGES) $(RELSYSDIR)/priv
+	$(INSTALL_DATA) $(FILES) $(IMAGES) $(CSS) $(RELSYSDIR)/priv
 else
 release_spec: opt
 	$(INSTALL_DIR) $(RELSYSDIR)/priv
-	$(INSTALL_DATA) $(FILES) $(IMAGES) $(RELSYSDIR)/priv
+	$(INSTALL_DATA) $(FILES) $(IMAGES) $(CSS) $(RELSYSDIR)/priv
 endif
 
 release_docs_spec:
@@ -105,6 +106,7 @@ else
 #
 FILES = vts.tool 
 IMAGES = tile1.jpg
+CSS = ct_default.css
 
 #
 # Rules
@@ -124,7 +126,7 @@ include $(ERL_TOP)/make/otp_release_targets.mk
 
 release_spec: opt
 	$(INSTALL_DIR) $(RELSYSDIR)/priv
-	$(INSTALL_DATA) $(FILES) $(IMAGES) $(RELSYSDIR)/priv
+	$(INSTALL_DATA) $(FILES) $(IMAGES) $(CSS) $(RELSYSDIR)/priv
 
 release_docs_spec:
 
diff --git a/lib/common_test/priv/ct_default.css b/lib/common_test/priv/ct_default.css
new file mode 100644
index 0000000000..94baf1f6f9
--- /dev/null
+++ b/lib/common_test/priv/ct_default.css
@@ -0,0 +1,185 @@
+/* Stylesheet for Common Test */
+
+body {
+    padding: 10px; margin: 10px;
+    -webkit-font-smoothing: antialiased; 
+    background-color: #FBFFFC;
+}
+
+a:link {
+    color: #2B507D;
+}
+
+a:visited {
+    color: #85ABD5
+}
+
+h1 {
+    font-family: verdana, arial, sans-serif; font-size: 200%; 
+    letter-spacing: -2.5px; word-spacing: 2px; font-weight: bold;
+    color: #3F3F3F;
+}
+
+h2 {
+    font-family: verdana, arial, sans-serif; font-size: 175%;
+    letter-spacing: -2.5px; word-spacing: 2px; font-weight: normal;
+    color: #3F3F3F;
+}
+
+h3 {
+    font-family: verdana, arial, sans-serif; font-size: 140%;
+    letter-spacing: -2.5px; word-spacing: 2px; font-weight: bold;
+    color: #3F3F3F;
+}
+
+h4 {
+    font-family: verdana, arial, sans-serif; font-size: 120%;
+    letter-spacing: -2.5px; word-spacing: 2px; font-weight: normal;
+    color: #3F3F3F;
+}
+
+p {
+    font-family: "Trebuchet MS", "Lucida Sans Unicode", verdana, arial, sans-serif;
+    font-size: .9em; color: #000000;
+}
+
+ul {
+    list-style-type: none;
+    padding: 0em;
+    margin:  1em;
+}
+li {
+    font-family: "Trebuchet MS", "Lucida Sans Unicode", verdana, arial, sans-serif;
+    font-size: .9em; color: #000000;
+    margin: .4em 0;
+}
+
+pre {
+    color: black; 
+    font-family: "Monaco", "Andale Mono", "Consolas", monospace;
+    font-size: .8em;
+    }
+
+code {
+    color: black; 
+    font-family: "Monaco", "Andale Mono", "Consolas", monospace;
+    font-size: .8em;
+}
+
+div.mono_sm {
+    font-family: "Courier New", monospace; font-size: 80%;
+    word-spacing: 1px; color: #000000;
+}
+
+div.mono_la {
+    font-family: "Courier New", monospace; font-size: 100%;
+    color: #000000;
+}
+
+div.copyright {
+    padding: 20px 0px 0px 0px; 
+    font-family: "Courier New", monospace; font-size: 80%;
+    color: #000000;
+}
+
+div.ct_internal { 
+    background: lightgrey; color: black; 
+    font-family: "Monaco", "Andale Mono", "Consolas", monospace;
+    font-size: 90%;
+}
+
+div.default { 
+    background: lightgreen; color: black; 
+    font-family: "Monaco", "Andale Mono", "Consolas", monospace;
+    font-size: 90%;
+}
+
+div.label {
+    font-family: verdana, arial, sans-serif; font-size: 200%; 
+    letter-spacing: -2.5px; word-spacing: 2px;
+    font-weight: bold; color: #2B507D;
+}
+
+table {
+    border-collapse: collapse; border: 6px solid #3F3F3F;
+    background: #FFFFFF;
+    font: .8em/1.2em "Lucida Sans Unicode", verdana, arial, sans-serif; 
+    color: #222;
+}
+
+caption {
+    font-size: 1.3em; font-weight: bold;
+    text-align: center; padding: 1em 4px;
+}
+
+td, th {
+    padding: .5em 7px .5em 7px; line-height: 1.3em; 
+    border-bottom: 3px solid #F5C4C1;
+    border-left: 2px dashed #809FFF;
+}
+
+th {
+    background: #3F3F3F; color: #fff; 
+    font-family: arial, sans-serif; font-size: 120%;
+    letter-spacing: -0.5px;
+    font-weight: bold; text-align: center; 
+    padding-right: .5em; vertical-align: top;
+}
+
+thead th {
+    background: #2C5755; text-align: center;
+}
+
+.odd td {
+    background: #F3F3F3;
+}
+.odd th {
+    background: #F3F3F3;
+}
+
+td a, td a:link {
+    color: #2B507D;
+}
+
+td a:visited {
+    color: #85ABD5;
+}
+
+tr:hover th[scope=row], tr:hover td { 
+    background-color: #808080;
+    color: #fff;
+} 
+
+td a:hover, td a:focus {
+    color: #85ABD5;
+}
+
+th a, td a:active {
+    color: #85ABD5;
+}
+
+tfoot th, tfoot td {
+    background: #3F3F3F; color: #fff;
+}
+
+th + td {
+    padding-left: .5em;
+}
+
+#button_holder {
+    display: block; float: center;
+    font-family: arial, verdana, sans-serif;
+    font-size: 12px; text-shadow: 1px 1px lightgray;
+} 
+
+.btn a {
+    padding: 6px 12px; float: center; 
+    text-decoration: none; color: #3F3F3F;
+    font-weight: bold; border: 3px outset #3F3F3F;
+    background-color: #F3F3F3;
+}
+
+.btn a:hover {
+    color: #fff;
+    background-color: #809FFF;
+}
diff --git a/lib/common_test/src/ct_framework.erl b/lib/common_test/src/ct_framework.erl
index 482c5242ce..26c71dfb42 100644
--- a/lib/common_test/src/ct_framework.erl
+++ b/lib/common_test/src/ct_framework.erl
@@ -27,7 +27,7 @@
 -export([init_tc/3, end_tc/3, end_tc/4, get_suite/2, get_all_cases/1]).
 -export([report/2, warn/1, error_notification/4]).
 
--export([get_logopts/0, format_comment/1, overview_html_header/1]).
+-export([get_logopts/0, format_comment/1, get_html_wrapper/2]).
 
 -export([error_in_suite/1, ct_init_per_group/2, ct_end_per_group/2]).
 
@@ -1411,30 +1411,6 @@ format_comment(Comment) ->
     "<font color=\"green\">" ++ Comment ++ "</font>".
 
 %%%-----------------------------------------------------------------
-%%% @spec overview_html_header(TestName) -> Header
-overview_html_header(TestName) ->
-    TestName1 = lists:flatten(io_lib:format("~p", [TestName])),
-    Label = case application:get_env(common_test, test_label) of
-		{ok,Lbl} when Lbl =/= undefined ->
-		    "<H1><FONT color=\"green\">" ++ Lbl ++ "</FONT></H1>\n";
-		_        ->
-		    ""
-	    end,
-    Bgr = case ct_logs:basic_html() of
-	      true ->
-		  "";
-	      false ->
-		  CTPath = code:lib_dir(common_test),
-		  TileFile = filename:join(filename:join(CTPath,"priv"),"tile1.jpg"),
-		  " background=\"" ++ TileFile ++ "\""
-	  end,
-
-    ["<html>\n",
-     "<head><title>Test ", TestName1, " results</title>\n",
-     "<meta http-equiv=\"cache-control\" content=\"no-cache\">\n",
-     "</head>\n",
-     "<body", Bgr, " bgcolor=\"white\" text=\"black\" ",
-     "link=\"blue\" vlink=\"purple\" alink=\"red\">\n",
-     Label,
-     "<H2>Results from test ", TestName1, "</H2>\n"].
-
+%%% @spec get_html_wrapper(TestName, PrintLabel) -> Header
+get_html_wrapper(TestName, PrintLabel) ->
+    ct_logs:get_ts_html_wrapper(TestName, PrintLabel).
diff --git a/lib/common_test/src/ct_logs.erl b/lib/common_test/src/ct_logs.erl
index c1523509a5..af45ecf235 100644
--- a/lib/common_test/src/ct_logs.erl
+++ b/lib/common_test/src/ct_logs.erl
@@ -29,11 +29,13 @@
 -module(ct_logs).
 
 -export([init/1,close/2,init_tc/1,end_tc/1]).
--export([get_log_dir/0,log/3,start_log/1,cont_log/2,end_log/0]).
+-export([get_log_dir/0,get_log_dir/1]).
+-export([log/3,start_log/1,cont_log/2,end_log/0]).
 -export([set_stylesheet/2,clear_stylesheet/1]).
 -export([add_external_logs/1,add_link/3]).
 -export([make_last_run_index/0]).
 -export([make_all_suites_index/1,make_all_runs_index/1]).
+-export([get_ts_html_wrapper/2]).
 
 %% Logging stuff directly from testcase
 -export([tc_log/3,tc_print/3,tc_pal/3,ct_log/3,
@@ -162,7 +164,12 @@ clear_stylesheet(TC) ->
 %%%-----------------------------------------------------------------
 %%% @spec get_log_dir() -> {ok,Dir} | {error,Reason}
 get_log_dir() ->
-    call(get_log_dir).
+    call({get_log_dir,false}).
+
+%%%-----------------------------------------------------------------
+%%% @spec get_log_dir(Abs) -> {ok,Dir} | {error,Reason}
+get_log_dir(Abs) ->
+    call({get_log_dir,Abs}).
 
 %%%-----------------------------------------------------------------
 %%% make_last_run_index() -> ok
@@ -437,6 +444,8 @@ log_timestamp({MS,S,US}) ->
 logger(Parent,Mode) ->
     register(?MODULE,self()),
 
+    put(basic_html, basic_html()),
+
     %%! Below is a temporary workaround for the limitation of
     %%! max one test run per second. 
     %%! --->
@@ -456,8 +465,9 @@ logger(Parent,Mode) ->
     %%! <---
 
     file:make_dir(Dir),
+    AbsDir = ?abs(Dir),
     ct_event:notify(#event{name=start_logging,node=node(),
-			   data=?abs(Dir)}),
+			   data=AbsDir}),
     make_all_runs_index(start),
     make_all_suites_index(start),
     case Mode of
@@ -472,7 +482,7 @@ logger(Parent,Mode) ->
     Parent ! {started,self(),{Time,filename:absname("")}},
     set_evmgr_gl(CtLogFd),
     logger_loop(#logger_state{parent=Parent,
-			      log_dir=Dir,
+			      log_dir=AbsDir,
 			      start_time=Time,
 			      orig_GL=group_leader(),
 			      ct_log_fd=CtLogFd,
@@ -536,12 +546,15 @@ logger_loop(State) ->
 	    set_evmgr_gl(State#logger_state.ct_log_fd),
 	    return(From,ok),
 	    logger_loop(State#logger_state{tc_groupleaders=rm_tc_gl(TCPid,State)});
-	{get_log_dir,From} ->
+	{{get_log_dir,true},From} ->
 	    return(From,{ok,State#logger_state.log_dir}),
 	    logger_loop(State);
+	{{get_log_dir,false},From} ->
+	    return(From,{ok,filename:basename(State#logger_state.log_dir)}),
+	    logger_loop(State);
 	{make_last_run_index,From} ->
 	    make_last_run_index(State#logger_state.start_time),
-	    return(From,State#logger_state.log_dir),
+	    return(From,filename:basename(State#logger_state.log_dir)),
 	    logger_loop(State);
 	{set_stylesheet,_,SSFile} when State#logger_state.stylesheet == SSFile ->
 	    logger_loop(State);
@@ -657,7 +670,7 @@ set_evmgr_gl(GL) ->
 
 open_ctlog() ->
     {ok,Fd} = file:open(?ct_log_name,[write]),
-    io:format(Fd,header("Common Test Framework"),[]),
+    io:format(Fd,header("Common Test Framework Log"),[]),
     case file:consult(ct_run:variables_file_name("../")) of
 	{ok,Vars} ->
 	    io:format(Fd, config_table(Vars), []);
@@ -672,17 +685,22 @@ open_ctlog() ->
     end,
     print_style(Fd,undefined),
     io:format(Fd, 
-	      "<br><br><h2>Progress Log</h2>\n"
-	      "<pre>\n",[]),
+	      xhtml("<br><br><h2>Progress Log</h2>\n<pre>\n",
+		    "<br /><br /><h4>PROGRESS LOG</h4>\n<pre>\n"), []),
     Fd.
 
 print_style(Fd,undefined) ->
-    io:format(Fd,
-	      "<style>\n"
-	      "div.ct_internal { background:lightgrey; color:black }\n"
-	      "div.default     { background:lightgreen; color:black }\n"
-	      "</style>\n",
-	      []);
+    case basic_html() of
+	true ->
+	    io:format(Fd,
+		      "<style>\n"
+		      "div.ct_internal { background:lightgrey; color:black; }\n"
+		      "div.default     { background:lightgreen; color:black; }\n"
+		      "</style>\n",
+		      []);
+	_ ->
+	    ok
+    end;
 
 print_style(Fd,StyleSheet) ->
     case file:read_file(StyleSheet) of
@@ -854,8 +872,8 @@ make_one_index_entry1(SuiteName, Link, Label, Success, Fail, UserSkip, AutoSkip,
 			    CrashDumpName = SuiteName ++ "_erl_crash.dump",
 			    case filelib:is_file(CrashDumpName) of
 				true ->
-				    ["&nbsp;<A HREF=\"", CrashDumpName,
-				     "\">(CrashDump)</A>"];
+				    ["&nbsp;<a href=\"", CrashDumpName,
+				     "\">(CrashDump)</a>"];
 				false ->
 				    ""
 			    end
@@ -869,32 +887,41 @@ make_one_index_entry1(SuiteName, Link, Label, Success, Fail, UserSkip, AutoSkip,
 			    0 -> "-";
 			    _ -> NodeOrDate
 			end,
-		N = ["<TD ALIGN=right><FONT SIZE=-1>",Node1,"</FONT></TD>\n"],
-		L = ["<TD ALIGN=center><FONT SIZE=-1><B>",Label,"</FONT></B></TD>\n"],
-		T = ["<TD><FONT SIZE=-1>",timestamp(CtRunDir),"</FONT></TD>\n"],
+		TS = timestamp(CtRunDir),
+		N = xhtml(["<td align=right><font size=\"-1\">",Node1,
+			   "</font></td>\n"],
+			  ["<td align=right>",Node1,"</td>\n"]),
+		L = xhtml(["<td align=center><font size=\"-1\"><b>",Label,
+			   "</font></b></td>\n"],
+			  ["<td align=center><b>",Label,"</b></td>\n"]),
+		T = xhtml(["<td><font size=\"-1\">",TS,"</font></td>\n"],
+			  ["<td>",TS,"</td>\n"]),
 		CtLogFile = filename:join(CtRunDir,?ct_log_name),
 		OldRunsLink = 
 		    case OldRuns of
 			[] -> "none";
-			_ ->  "<A HREF=\""++?all_runs_name++"\">Old Runs</A>"
+			_ ->  "<a href=\""++?all_runs_name++"\">Old Runs</a>"
 		    end,
-		A=["<TD><FONT SIZE=-1><A HREF=\"",CtLogFile,"\">CT Log</A></FONT></TD>\n",
-		   "<TD><FONT SIZE=-1>",OldRunsLink,"</FONT></TD>\n"],
+		A = xhtml(["<td><font size=\"-1\"><a href=\"",CtLogFile,
+			   "\">CT Log</a></font></td>\n",
+			   "<td><font size=\"-1\">",OldRunsLink,"</font></td>\n"],
+			  ["<td><a href=\"",CtLogFile,"\">CT Log</a></td>\n",
+			   "<td>",OldRunsLink,"</td>\n"]),
 		{L,T,N,A};
 	    false ->
 		{"","","",""}
 	end,
     NotBuiltStr =
 	if NotBuilt == 0 ->
-		["<TD ALIGN=right>",integer_to_list(NotBuilt),"</TD>\n"];
+		["<td align=right>",integer_to_list(NotBuilt),"</td>\n"];
 	   true ->
-		["<TD ALIGN=right><A HREF=\"",filename:join(CtRunDir,?ct_log_name),"\">",
-		integer_to_list(NotBuilt),"</A></TD>\n"]
+		["<td align=right><a href=\"",filename:join(CtRunDir,?ct_log_name),"\">",
+		integer_to_list(NotBuilt),"</a></td>\n"]
 	end,
     FailStr =
 	if Fail > 0 ->  
-		["<FONT color=\"red\">",
-		 integer_to_list(Fail),"</FONT>"];
+		["<font color=\"red\">",
+		 integer_to_list(Fail),"</font>"];
 	   true ->
 		integer_to_list(Fail)
 	end,
@@ -902,31 +929,33 @@ make_one_index_entry1(SuiteName, Link, Label, Success, Fail, UserSkip, AutoSkip,
 	if AutoSkip == undefined -> {UserSkip,"?","?"};
 	   true ->
 		ASStr = if AutoSkip > 0 ->
-				["<FONT color=\"brown\">",
-				 integer_to_list(AutoSkip),"</FONT>"];
+				["<font color=\"brown\">",
+				 integer_to_list(AutoSkip),"</font>"];
 			   true -> integer_to_list(AutoSkip)
 			end,
 		{UserSkip+AutoSkip,integer_to_list(UserSkip),ASStr}
 	end,
-    ["<TR valign=top>\n",
-     "<TD><FONT SIZE=-1><A HREF=\"",LogFile,"\">",SuiteName,"</A>",CrashDumpLink,"</FONT></TD>\n",
-     Lbl,
-     Timestamp,
-     "<TD ALIGN=right>",integer_to_list(Success),"</TD>\n",
-     "<TD ALIGN=right>",FailStr,"</TD>\n",
-     "<TD ALIGN=right>",integer_to_list(AllSkip),
-     " (",UserSkipStr,"/",AutoSkipStr,")</TD>\n",  
-     NotBuiltStr,
-     Node,
-     AllInfo,
-     "</TR>\n"].
+    [xhtml("<tr valign=top>\n",
+	   ["<tr class=\"",odd_or_even(),"\">\n"]),
+     xhtml("<td><font size=\"-1\"><a href=\"", "<td><a href=\""),
+     LogFile,"\">",SuiteName,"</a>", CrashDumpLink,
+     xhtml("</font></td>\n", "</td>\n"),
+     Lbl, Timestamp,
+     "<td align=right>",integer_to_list(Success),"</td>\n",
+     "<td align=right>",FailStr,"</td>\n",
+     "<td align=right>",integer_to_list(AllSkip),
+     " (",UserSkipStr,"/",AutoSkipStr,")</td>\n",  
+     NotBuiltStr, Node, AllInfo, "</tr>\n"].
+
 total_row(Success, Fail, UserSkip, AutoSkip, NotBuilt, All) ->
     {Label,TimestampCell,AllInfo} =
 	case All of
 	    true ->
-		{"<TD>&nbsp;</TD>\n",
-		 "<TD>&nbsp;</TD>\n",
-		 "<TD>&nbsp;</TD>\n<TD>&nbsp;</TD>\n"};
+		{"<td>&nbsp;</td>\n",
+		 "<td>&nbsp;</td>\n",
+		 "<td>&nbsp;</td>\n"
+		 "<td>&nbsp;</td>\n"
+		 "<td>&nbsp;</td>\n"};
 	    false ->
 		{"","",""}
 	end,
@@ -936,17 +965,15 @@ total_row(Success, Fail, UserSkip, AutoSkip, NotBuilt, All) ->
 	   true -> {UserSkip+AutoSkip,
 		    integer_to_list(UserSkip),integer_to_list(AutoSkip)}
 	end,
-    ["<TR valign=top>\n",
-     "<TD><B>Total</B></TD>",
-     Label,
-     TimestampCell,
-     "<TD ALIGN=right><B>",integer_to_list(Success),"<B></TD>\n",
-     "<TD ALIGN=right><B>",integer_to_list(Fail),"<B></TD>\n",
-     "<TD ALIGN=right>",integer_to_list(AllSkip),
-     " (",UserSkipStr,"/",AutoSkipStr,")</TD>\n",  
-     "<TD ALIGN=right><B>",integer_to_list(NotBuilt),"<B></TD>\n",
-     AllInfo,
-     "</TR>\n"].
+    [xhtml("<tr valign=top>\n", 
+	   ["<tr class=\"",odd_or_even(),"\">\n"]),
+     "<td><b>Total</b></td>\n", Label, TimestampCell,
+     "<td align=right><b>",integer_to_list(Success),"<b></td>\n",
+     "<td align=right><b>",integer_to_list(Fail),"<b></td>\n",
+     "<td align=right>",integer_to_list(AllSkip),
+     " (",UserSkipStr,"/",AutoSkipStr,")</td>\n",  
+     "<td align=right><b>",integer_to_list(NotBuilt),"<b></td>\n",
+     AllInfo, "</tr>\n"].
 
 not_built(_BaseName,_LogDir,_All,[]) ->
     0;
@@ -1005,41 +1032,52 @@ index_header(Label, StartTime) ->
 	    undefined ->
 		header("Test Results", format_time(StartTime));
 	    _ ->
-		header("Test Results for \"" ++ Label ++ "\"",
+		header("Test Results for '" ++ Label ++ "'",
 		       format_time(StartTime))
 	end,
     [Head |
-     ["<CENTER>\n",
-      "<P><A HREF=\"",?ct_log_name,"\">Common Test Framework Log</A></P>",
-      "<TABLE border=\"3\" cellpadding=\"5\" "
-      "BGCOLOR=\"",?table_color3,"\">\n"
-      "<th><B>Test Name</B></th>\n",
-            "<th><font color=\"",?table_color3,"\">_</font>Ok"
-          "<font color=\"",?table_color3,"\">_</font></th>\n"
+     ["<center>\n",
+      xhtml(["<p><a href=\"",?ct_log_name,
+	     "\">Common Test Framework Log</a></p>"],
+	    ["<br />"
+	     "<div id=\"button_holder\" class=\"btn\">\n"
+	     "<a href=\"",?ct_log_name,
+	     "\">COMMON TEST FRAMEWORK LOG</a>\n</div>"]),
+      xhtml("<br>\n", "<br /><br /><br />\n"),
+      xhtml(["<table border=\"3\" cellpadding=\"5\" "
+	     "bgcolor=\"",?table_color3,"\">\n"], "<table>\n"),
+      "<th><b>Test Name</b></th>\n",
+      xhtml(["<th><font color=\"",?table_color3,"\">_</font>Ok"
+	     "<font color=\"",?table_color3,"\">_</font></th>\n"],
+	    "<th>Ok</th>\n"),
       "<th>Failed</th>\n",
-      "<th>Skipped<br>(User/Auto)</th>\n"
-      "<th>Missing<br>Suites</th>\n"
+      "<th>Skipped", xhtml("<br>", "<br />"), "(User/Auto)</th>\n"
+      "<th>Missing", xhtml("<br>", "<br />"), "Suites</th>\n"
       "\n"]].
 
-
 all_suites_index_header() ->
     {ok,Cwd} = file:get_cwd(),
     all_suites_index_header(Cwd).
 
 all_suites_index_header(IndexDir) ->
     LogDir = filename:basename(IndexDir),
-    AllRuns = "All test runs in \"" ++ LogDir ++ "\"",
+    AllRuns = xhtml(["All test runs in \"" ++ LogDir ++ "\""],
+		    "ALL RUNS"),
+    AllRunsLink = xhtml(["<a href=\"",?all_runs_name,"\">",AllRuns,"</a>\n"],
+			["<div id=\"button_holder\" class=\"btn\">\n"
+			 "<a href=\"",?all_runs_name,"\">",AllRuns,"</a>\n</div>"]),
     [header("Test Results") | 
-     ["<CENTER>\n",
-      "<A HREF=\"",?all_runs_name,"\">",AllRuns,"</A>\n",
-      "<br><br>\n",
-      "<TABLE border=\"3\" cellpadding=\"5\" "
-      "BGCOLOR=\"",?table_color2,"\">\n"
+     ["<center>\n",
+      AllRunsLink,
+      xhtml("<br><br>\n", "<br /><br />\n"),
+      xhtml(["<table border=\"3\" cellpadding=\"5\" "
+	     "bgcolor=\"",?table_color2,"\">\n"], "<table>\n"),
       "<th>Test Name</th>\n",
       "<th>Label</th>\n",
       "<th>Test Run Started</th>\n",
-      "<th><font color=\"",?table_color2,"\">_</font>Ok"
-          "<font color=\"",?table_color2,"\">_</font></th>\n"
+      xhtml(["<th><font color=\"",?table_color2,"\">_</font>Ok"
+	     "<font color=\"",?table_color2,"\">_</font></th>\n"],
+	    "<th>Ok</th>\n"),
       "<th>Failed</th>\n",
       "<th>Skipped<br>(User/Auto)</th>\n"
       "<th>Missing<br>Suites</th>\n"
@@ -1052,17 +1090,25 @@ all_runs_header() ->
     {ok,Cwd} = file:get_cwd(),
     LogDir = filename:basename(Cwd),
     Title = "All test runs in \"" ++ LogDir ++ "\"",
+    IxLink = [xhtml(["<p><a href=\"",?index_name,
+		     "\">Test Index Page</a></p>"],
+		    ["<div id=\"button_holder\" class=\"btn\">\n"
+		     "<a href=\"",?index_name,
+		     "\">TEST INDEX PAGE</a>\n</div>"]),
+	      xhtml("<br>\n", "<br /><br />\n")],
     [header(Title) |
-     ["<CENTER><TABLE border=\"3\" cellpadding=\"5\" "
-      "BGCOLOR=\"",?table_color1,"\">\n"
-      "<th><B>History</B></th>\n"
-      "<th><B>Node</B></th>\n"
-      "<th><B>Label</B></th>\n"
+     ["<center>\n", IxLink,
+      xhtml(["<table border=\"3\" cellpadding=\"5\" "
+	     "bgcolor=\"",?table_color1,"\">\n"], "<table>\n"),
+      "<th><b>History</b></th>\n"
+      "<th><b>Node</b></th>\n"
+      "<th><b>Label</b></th>\n"
       "<th>Tests</th>\n"
-      "<th><B>Test Names</B></th>\n"
-      "<th>Total</th>\n"
-      "<th><font color=\"",?table_color1,"\">_</font>Ok"
-          "<font color=\"",?table_color1,"\">_</font></th>\n"
+      "<th><b>Test Names</b></th>\n"
+      "<th>Total</th>\n",
+      xhtml(["<th><font color=\"",?table_color1,"\">_</font>Ok"
+	     "<font color=\"",?table_color1,"\">_</font></th>\n"],
+	    "<th>Ok</th>\n"),
       "<th>Failed</th>\n"
       "<th>Skipped<br>(User/Auto)</th>\n"
       "<th>Missing<br>Suites</th>\n"
@@ -1075,60 +1121,56 @@ header(Title, SubTitle) ->
 
 header1(Title, SubTitle) ->
     SubTitleHTML = if SubTitle =/= "" ->
-			   ["<CENTER>\n",
-			    "<H2>" ++ SubTitle ++ "</H2>\n",
-			    "</CENTER>\n<BR>\n"];
-		      true -> "<BR>\n"
+			   ["<center>\n",
+			    "<h3>" ++ SubTitle ++ "</h3>\n",
+			    xhtml("</center>\n<br>\n", "</center>\n<br />\n")];
+		      true -> xhtml("<br>\n", "<br />\n")
 		   end,
-    ["<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 3.2 Final//EN\">\n"
-     "<!-- autogenerated by '"++atom_to_list(?MODULE)++"'. -->\n"
-     "<HTML>\n",
-     "<HEAD>\n",
-
-     "<TITLE>" ++ Title ++ " " ++ SubTitle ++ "</TITLE>\n",
-     "<META HTTP-EQUIV=\"CACHE-CONTROL\" CONTENT=\"NO-CACHE\">\n",
-
-     "</HEAD>\n",
-
-     body_tag(),
-
-     "<!-- ---- DOCUMENT TITLE  ---- -->\n",
-
-     "<CENTER>\n",
-     "<H1>" ++ Title ++ "</H1>\n",
-     "</CENTER>\n",
-     SubTitleHTML,
-
-     "<!-- ---- CONTENT ---- -->\n"].
+    CTPath = code:lib_dir(common_test),
+    CSSFile = filename:join(filename:join(CTPath, "priv"), "ct_default.css"),
+    [xhtml(["<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 3.2 Final//EN\">\n",
+	    "<html>\n"],
+	   ["<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\"\n",
+	    "\"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">\n",
+	    "<html xmlns=\"http://www.w3.org/1999/xhtml\" xml:lang=\"en\" lang=\"en\">\n"]),
+    "<!-- autogenerated by '"++atom_to_list(?MODULE)++"' -->\n",
+    "<head>\n",
+    "<title>" ++ Title ++ " " ++ SubTitle ++ "</title>\n",
+    "<meta http-equiv=\"cache-control\" content=\"no-cache\">\n",
+    xhtml("",
+	  ["<link rel=\"stylesheet\" href=\"file:///",CSSFile,"\" type=\"text/css\">"]),
+    "</head>\n",
+    body_tag(),
+    "<center>\n",
+    "<h1>" ++ Title ++ "</h1>\n",
+    "</center>\n",
+    SubTitleHTML,"\n"].
 
 index_footer() ->
-    ["</TABLE>\n"
-     "</CENTER>\n" | footer()].
+    ["</table>\n"
+     "</center>\n" | footer()].
 
 footer() ->
-     ["<P><CENTER>\n"
-      "<BR><BR>\n"
-      "<HR>\n"
-      "<P><FONT SIZE=-1>\n"
+     ["<center>\n",
+      xhtml("<br><br>\n<hr>\n", "<br /><br />\n"),
+      xhtml("<p><font size=\"-1\">\n", "<div class=\"copyright\">"),
       "Copyright &copy; ", year(),
-      " <A HREF=\"http://erlang.ericsson.se\">Open Telecom Platform</A><BR>\n"
-      "Updated: <!date>", current_time(), "<!/date><BR>\n"
-      "</FONT>\n"
-      "</CENTER>\n"
+      " <a href=\"http://www.erlang.org\">Open Telecom Platform</a>",
+      xhtml("<br>\n", "<br />\n"),
+      "Updated: <!date>", current_time(), "<!/date>",
+      xhtml("<br>\n", "<br />\n"),
+      xhtml("</font></p>\n", "</div>\n"),
+      "</center>\n"
       "</body>\n"].
 
 
 body_tag() ->
-    case basic_html() of
-	true ->
-	    "<body bgcolor=\"#FFFFFF\" text=\"#000000\" link=\"#0000FF\" "
-		"vlink=\"#800080\" alink=\"#FF0000\">\n";
-	false ->
-	    CTPath = code:lib_dir(common_test),
-	    TileFile = filename:join(filename:join(CTPath,"priv"),"tile1.jpg"),
-	    "<body background=\"" ++ TileFile ++ "\" bgcolor=\"#FFFFFF\" text=\"#000000\" link=\"#0000FF\" "
-		"vlink=\"#800080\" alink=\"#FF0000\">\n"
-    end.
+    CTPath = code:lib_dir(common_test),
+    TileFile = filename:join(filename:join(CTPath,"priv"),"tile1.jpg"),
+    xhtml("<body background=\"" ++ TileFile ++
+	      "\" bgcolor=\"#FFFFFF\" text=\"#000000\" link=\"#0000FF\" "
+	  "vlink=\"#800080\" alink=\"#FF0000\">\n",
+	  "<body>\n").
 
 current_time() ->
     format_time(calendar:local_time()).
@@ -1258,20 +1300,25 @@ config_table(Vars) ->
     [config_table_header()|config_table1(Vars)].
 
 config_table_header() ->
-    ["<h2>Configuration</h2>\n",
-     "<table border=\"3\" cellpadding=\"5\" bgcolor=\"",?table_color1,
-     "\"\n",
+    [
+     xhtml(["<h2>Configuration</h2>\n"
+	    "<table border=\"3\" cellpadding=\"5\" bgcolor=\"",?table_color1,"\"\n"],
+	   "<h4>CONFIGURATION</h4>\n<table>\n"),
      "<tr><th>Key</th><th>Value</th></tr>\n"].
 
 config_table1([{Key,Value}|Vars]) ->
-    ["<tr><td>", atom_to_list(Key), "</td>\n",
-     "<td><pre>",io_lib:format("~p",[Value]),"</pre></td></tr>\n" | 
+    [xhtml(["<tr><td>", atom_to_list(Key), "</td>\n",
+	   "<td><pre>",io_lib:format("~p",[Value]),"</pre></td></tr>\n"],
+	   ["<tr class=\"", odd_or_even(), "\">\n",
+	    "<td>", atom_to_list(Key), "</td>\n",
+	    "<td>", io_lib:format("~p",[Value]), "</td>\n</tr>\n"]) | 
      config_table1(Vars)];
 config_table1([]) ->
     ["</table>\n"].
 
 
 make_all_runs_index(When) ->
+    put(basic_html, basic_html()),
     AbsName = ?abs(?all_runs_name),
     notify_and_lock_file(AbsName),
     if When == start -> ok;
@@ -1280,8 +1327,7 @@ make_all_runs_index(When) ->
     Dirs = filelib:wildcard(logdir_prefix()++"*.*"),
     DirsSorted = (catch sort_all_runs(Dirs)),
     Header = all_runs_header(),
-    BasicHtml = basic_html(),
-    Index = [runentry(Dir, BasicHtml) || Dir <- DirsSorted],
+    Index = [runentry(Dir) || Dir <- DirsSorted],
     Result = file:write_file(AbsName,Header++Index++index_footer()),
     if When == start -> ok;
        true -> io:put_chars("done\n")
@@ -1309,22 +1355,22 @@ sort_all_runs(Dirs) ->
 interactive_link() ->
     [Dir|_] = lists:reverse(filelib:wildcard(logdir_prefix()++"*.*")),
     CtLog = filename:join(Dir,"ctlog.html"),
-    Body = ["Log from last interactive run: <A HREF=\"",CtLog,"\">",
-	    timestamp(Dir),"</A>"],
+    Body = ["Log from last interactive run: <a href=\"",CtLog,"\">",
+	    timestamp(Dir),"</a>"],
     file:write_file("last_interactive.html",Body),
     io:format("~n~nUpdated ~s\n"
 	      "Any CT activities will be logged here\n",
 	      [?abs("last_interactive.html")]).
 
-runentry(Dir, BasicHtml) ->
+runentry(Dir) ->
     TotalsFile = filename:join(Dir,?totals_name),
     TotalsStr =
 	case read_totals_file(TotalsFile) of
 	    {Node,Label,Logs,{TotSucc,TotFail,UserSkip,AutoSkip,NotBuilt}} ->
 		TotFailStr =
 		    if TotFail > 0 ->  
-			    ["<FONT color=\"red\">",
-			     integer_to_list(TotFail),"</FONT>"];
+			    ["<font color=\"red\">",
+			     integer_to_list(TotFail),"</font>"];
 		       true ->
 			    integer_to_list(TotFail)
 		    end,
@@ -1332,8 +1378,8 @@ runentry(Dir, BasicHtml) ->
 		    if AutoSkip == undefined -> {UserSkip,"?","?"};
 		       true ->
 			    ASStr = if AutoSkip > 0 ->
-					    ["<FONT color=\"brown\">",
-					     integer_to_list(AutoSkip),"</FONT>"];
+					    ["<font color=\"brown\">",
+					     integer_to_list(AutoSkip),"</font>"];
 				       true -> integer_to_list(AutoSkip)
 				    end,
 			    {UserSkip+AutoSkip,integer_to_list(UserSkip),ASStr}
@@ -1365,30 +1411,49 @@ runentry(Dir, BasicHtml) ->
 			    lists:flatten(io_lib:format("~s...",[Trunc]))
 		    end,
 		Total = TotSucc+TotFail+AllSkip,
-		A = ["<TD ALIGN=center><FONT SIZE=-1>",Node,"</FONT></TD>\n",
-		     "<TD ALIGN=center><FONT SIZE=-1><B>",Label,"</B></FONT></TD>\n",
-		     "<TD ALIGN=right>",NoOfTests,"</TD>\n"],
-		B = if BasicHtml ->
-			    ["<TD ALIGN=center><FONT SIZE=-1>",TestNamesTrunc,"</FONT></TD>\n"];
-		       true ->		     
-			    ["<TD ALIGN=center TITLE='",TestNames,"'><FONT SIZE=-1> ",
-			     TestNamesTrunc,"</FONT></TD>\n"]
-		    end,
-		C = ["<TD ALIGN=right>",integer_to_list(Total),"</TD>\n",
-		     "<TD ALIGN=right>",integer_to_list(TotSucc),"</TD>\n",
-		     "<TD ALIGN=right>",TotFailStr,"</TD>\n",
-		     "<TD ALIGN=right>",integer_to_list(AllSkip),
-		     " (",UserSkipStr,"/",AutoSkipStr,")</TD>\n",
-		     "<TD ALIGN=right>",integer_to_list(NotBuilt),"</TD>\n"],
+		A = xhtml(["<td align=center><font size=\"-1\">",Node,
+			   "</font></td>\n",
+			   "<td align=center><font size=\"-1\"><b>",Label,
+			   "</b></font></td>\n",
+			   "<td align=right>",NoOfTests,"</td>\n"],
+			  ["<td align=center>",Node,"</td>\n",
+			   "<td align=center><b>",Label,"</b></td>\n",
+			   "<td align=right>",NoOfTests,"</td>\n"]),
+		B = xhtml(["<td align=center title='",TestNames,"'><font size=\"-1\"> ",
+			   TestNamesTrunc,"</font></td>\n"],
+			  ["<td align=center title='",TestNames,"'> ",
+			   TestNamesTrunc,"</td>\n"]),
+		C = ["<td align=right>",integer_to_list(Total),"</td>\n",
+		     "<td align=right>",integer_to_list(TotSucc),"</td>\n",
+		     "<td align=right>",TotFailStr,"</td>\n",
+		     "<td align=right>",integer_to_list(AllSkip),
+		     " (",UserSkipStr,"/",AutoSkipStr,")</td>\n",
+		     "<td align=right>",integer_to_list(NotBuilt),"</td>\n"],
 		A++B++C;
 	    _ ->
-		["<TD ALIGN=center><FONT size=-1 color=\"red\">",
-		 "Test data missing or corrupt","</FONT></TD>\n"]
+		A = xhtml(["<td align=center><font size=\"-1\" color=\"red\">"
+			   "Test data missing or corrupt</font></td>\n",
+			   "<td align=center><font size=\"-1\">?</font></td>\n",
+			   "<td align=right>?</td>\n"],
+			  ["<td align=center><font color=\"red\">"
+			   "Test data missing or corrupt</font></td>\n",
+			   "<td align=center>?</td>\n",
+			   "<td align=right>?</td>\n"]),
+		B = xhtml(["<td align=center><font size=\"-1\">?</font></td>\n"],
+			  ["<td align=center>?</td>\n"]),
+		C = ["<td align=right>?</td>\n",
+		     "<td align=right>?</td>\n",
+		     "<td align=right>?</td>\n",
+		     "<td align=right>?</td>\n",
+		     "<td align=right>?</td>\n"],
+		A++B++C
 	end,	    
     Index = filename:join(Dir,?index_name),
-    ["<TR>\n"
-     "<TD><FONT SIZE=-1><A HREF=\"",Index,"\">",timestamp(Dir),"</A>",TotalsStr,"</FONT></TD>\n"
-     "</TR>\n"].
+    [xhtml("<tr>\n", ["<tr class=\"",odd_or_even(),"\">\n"]),
+     xhtml(["<td><font size=\"-1\"><a href=\"",Index,"\">",timestamp(Dir),"</a>",
+	    TotalsStr,"</font></td>\n"],
+	   ["<td><a href=\"",Index,"\">",timestamp(Dir),"</a>",TotalsStr,"</td>\n"]),
+     "</tr>\n"].
 
 write_totals_file(Name,Label,Logs,Totals) ->
     AbsName = ?abs(Name),
@@ -1482,6 +1547,7 @@ timestamp(Dir) ->
 %% Creates the top level index file. When == start | refresh.
 %% A copy of the dir tree under logdir is cached as a result.
 make_all_suites_index(When) when is_atom(When) ->
+    put(basic_html, basic_html()),
     AbsIndexName = ?abs(?index_name),
     notify_and_lock_file(AbsIndexName),
     LogDirs = filelib:wildcard(logdir_prefix()++".*/*"++?logdir_ext),
@@ -1493,6 +1559,7 @@ make_all_suites_index(When) when is_atom(When) ->
 %% This updates the top level index file using cached data from
 %% the initial index file creation.
 make_all_suites_index(NewTestData = {_TestName,DirName}) ->
+    put(basic_html, basic_html()),
     %% AllLogDirs = [{TestName,Label,Missing,{LastLogDir,Summary},OldDirs}|...]
     {AbsIndexName,LogDirData} = ct_util:get_testdata(test_index),
 
@@ -1850,6 +1917,32 @@ last_test([], Latest) ->
     Latest.
 
 %%%-----------------------------------------------------------------
+%%% @spec xhtml(HTML, XHTML) -> HTML | XHTML
+%%%
+%%% @doc
+%%%
+xhtml(HTML, XHTML) ->
+    case get(basic_html) of
+	true -> HTML;
+	_ -> XHTML
+    end.
+
+%%%-----------------------------------------------------------------
+%%% @spec odd_or_even() -> "odd" | "even"
+%%%
+%%% @doc
+%%%
+odd_or_even() ->
+    case get(odd_or_even) of
+	even ->
+	    put(odd_or_even, odd),
+	    "even";
+	_ ->
+	    put(odd_or_even, even),
+	    "odd"
+    end.
+
+%%%-----------------------------------------------------------------
 %%% @spec basic_html() -> true | false
 %%%
 %%% @doc
@@ -1861,3 +1954,80 @@ basic_html() ->
 	_ ->
 	    false
     end.
+
+%%%-----------------------------------------------------------------
+%%% @spec get_ts_html_wrapper(TestName, PrintLabel) -> {Mode,Header,Footer}
+%%%
+%%% @doc
+%%%
+get_ts_html_wrapper(TestName, PrintLabel) ->
+    TestName1 = lists:flatten(io_lib:format("~p", [TestName])),
+    Basic = basic_html(),
+    LabelStr =
+	if not PrintLabel ->
+		"";
+	   true ->
+		case {Basic,application:get_env(common_test, test_label)} of
+		    {true,{ok,Lbl}} when Lbl =/= undefined ->
+			"<h1><font color=\"green\">" ++ Lbl ++ "</font></h1>\n";
+		    {_,{ok,Lbl}} when Lbl =/= undefined ->
+			"<div class=\"label\">'" ++ Lbl ++ "'</div>\n";
+		    _ ->
+			""
+		end
+	end,
+    CTPath = code:lib_dir(common_test),
+    {ok,CtLogdir} = get_log_dir(true),
+    AllRuns = filename:join(filename:dirname(CtLogdir), ?all_runs_name),
+    TestIndex = filename:join(filename:dirname(CtLogdir), ?index_name),
+    case Basic of
+	true ->
+	    TileFile = filename:join(filename:join(CTPath,"priv"),"tile1.jpg"),
+	    Bgr = " background=\"" ++ TileFile ++ "\"",
+	    Copyright =
+		     ["<p><font size=\"-1\">\n",
+		      "Copyright &copy; ", year(),
+		      " <a href=\"http://www.erlang.org\">",
+		      "Open Telecom Platform</a><br>\n",
+		      "Updated: <!date>", current_time(), "<!/date>",
+		      "<br>\n</font></p>\n"],
+	    {basic_html,
+	     ["<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 3.2 Final//EN\">\n",
+	      "<html>\n",
+	      "<head><title>Test ", TestName1, " results</title>\n",
+	      "<meta http-equiv=\"cache-control\" content=\"no-cache\">\n",
+	      "</head>\n",
+	      "<body", Bgr, " bgcolor=\"white\" text=\"black\" ",
+	      "link=\"blue\" vlink=\"purple\" alink=\"red\">\n",
+	      LabelStr, "\n"],
+	     ["<center>\n<br><hr><p>\n",
+	      "<a href=\"", AllRuns,
+	      "\">Test run history\n</a>  |  ",
+	      "<a href=\"", TestIndex,
+	      "\">Top level test index\n</a>\n</p>\n",
+	      Copyright,"</center>\n</body>\n</html>\n"]};
+	_ ->
+	    Copyright = 
+		["<div class=\"copyright\">",
+		 "Copyright &copy; ", year(),
+		 " <a href=\"http://www.erlang.org\">",
+		 "Open Telecom Platform</a><br />\n",
+		 "Updated: <!date>", current_time(), "<!/date>",
+		 "<br />\n</div>\n"],
+	    CSSFile = filename:join(filename:join(CTPath, "priv"), "ct_default.css"),
+	    {xhtml,
+	     ["<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\"\n",
+	      "\"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">\n",
+	      "<html xmlns=\"http://www.w3.org/1999/xhtml\" xml:lang=\"en\" lang=\"en\">\n",
+	      "<head>\n<title>Test ", TestName1, " results</title>\n",
+	      "<meta http-equiv=\"cache-control\" content=\"no-cache\">\n",
+	      "<link rel=\"stylesheet\" href=\"file:///", CSSFile, "\" type=\"text/css\">",
+	      "</head>\n","<body>\n", 
+	      LabelStr, "\n"],
+	     ["<center>\n<br /><hr /><p>\n",
+	      "<a href=\"", AllRuns,
+	      "\">Test run history\n</a>  |  ",
+	      "<a href=\"", TestIndex,
+	      "\">Top level test index\n</a>\n</p>\n",
+	      Copyright,"</center>\n</body>\n</html>\n"]}
+    end.