- From: Olivier Thereaux via cvs-syncmail <cvsmail@w3.org>
- Date: Thu, 31 May 2007 02:32:16 +0000
- To: www-validator-cvs@w3.org
Update of /sources/public/validator/htdocs
In directory hutz:/tmp/cvs-serv8394/htdocs
Modified Files:
detailed.html footer.html header.html index.html
Log Message:
In collaboration with (and mostly courtesy of) Valerio Proietti (mad4milk/mootools),
cleanup and revamp of the CSS and scripting used, mostly by the main UI of the validator.
Changes include:
* cleaner CSS for the UI
* (more) accessible, gracefully degrading tab and toggle scripting
* smooth, unobtrusive transition effects
* form styling
* Toggle and tab scripting now use mootools as framework, allowing for addressing of each "view"
(e.g one can link directly to the "by upload", "with options toggled on"
this was an issue in earlier toggle script versions for the CSS validator
* scripting with smaller footprint
* minor CSS changes (page and UI takes all width, etc)
Index: detailed.html
===================================================================
RCS file: /sources/public/validator/htdocs/detailed.html,v
retrieving revision 1.24
retrieving revision 1.25
diff -u -d -r1.24 -r1.25
--- detailed.html 24 Apr 2007 01:35:15 -0000 1.24
+++ detailed.html 31 May 2007 02:32:14 -0000 1.25
@@ -4,12 +4,12 @@
--><!--#set var="relroot" value="./"
--><!--#include virtual="header.html" -->
-<p id="tagline">
-Check the markup (HTML, XHTML) of Web documents
-</p>
-
<div id="frontforms">
-<ul class="tabset_tabs"><li><a href="#validate-by-uri" class="active">by URI</a></li><li><a href="#validate-by-upload">by File Upload</a></li><li><a href="#validate-by-input">by direct Input</a></li></ul>
+ <ul id="tabset_tabs">
+ <li><a href="#validate-by-uri"><span>Validate by</span> URI</a></li>
+ <li><a href="#validate-by-upload"><span>Validate by</span> File Upload</a></li>
+ <li><a href="#validate-by-input"><span>Validate by</span> Direct Input</a></li>
+ </ul>
<div id="fields">
<fieldset id="validate-by-uri" class="tabset_content front"><legend class="tabset_label">Validate by URI</legend>
@@ -22,12 +22,21 @@
<input type="text" name="uri" id="uri" size="45" />
</p>
<fieldset id="extra_opt_uri" class="moreoptions">
- <legend><a href="./#validate-by-uri" title="hide the options - see the simple interface"><img alt="*" src="./images/arrow-down.gif" /> Options</a> - ( <a title="Explanation for these options" href="docs/users.html#Options">Need Help?</a> ) </legend>
+ <legend class="toggletext">More Options</legend>
+ <div class="options">
+
<!--#set var="fieldset_id" value="uri"-->
<!--#include virtual="detailed-form.html" -->
+ </div>
</fieldset>
- <p class="submit_button"><label title="Submit file for validation"><input type="submit" value="Check" /></label></p>
+
+ <p class="submit_button">
+ <label title="Submit for validation">
+ <input type="submit" value="Check" />
+ </label>
+ </p>
+
</form>
</fieldset>
@@ -37,11 +46,19 @@
<p><label title="Choose a Local File to Upload and Validate" for="uploaded_file">File:</label>
<input type="file" id="uploaded_file" name="uploaded_file" size="30" /></p>
<fieldset id="extra_opt_upload" class="moreoptions">
- <legend><a href="./#validate-by-upload" title="hide the options - see the simple interface"><img alt="*" src="./images/arrow-down.gif" /> Options</a> - ( <a title="Explanation for these options" href="docs/users.html#Options">Need Help?</a> ) </legend>
+ <legend class="toggletext">More Options</legend>
+ <div class="options">
<!--#set var="fieldset_id" value="upload"-->
- <!--#include virtual="detailed-form.html" -->
+ <!--#include virtual="detailed-form.html" -->
+ </div>
</fieldset><!-- invisible -->
- <p class="submit_button"><label title="Submit file for validation"><input type="submit" value="Check" /></label></p>
+
+ <p class="submit_button">
+ <label title="Submit for validation">
+ <input type="submit" value="Check" />
+ </label>
+ </p>
+
</form>
<p><strong>Note</strong>: file upload may not work with Internet
Explorer on some versions of Windows XP Service Pack 2, see our
@@ -61,17 +78,23 @@
</select> -->
</p>
<fieldset id="extra_opt_direct" class="moreoptions">
- <legend><a href="./#validate-by-input" title="hide the options - see the simple interface"><img alt="*" src="./images/arrow-down.gif" /> Options</a> - ( <a title="Explanation for these options" href="docs/users.html#Options">Need Help?</a> ) </legend>
+ <legend class="toggletext">More Options</legend>
+ <div class="options">
+
<table>
<!--#set var="fieldset_id" value="direct"-->
<!--#include virtual="detailed-form_directinput.html" -->
</table>
- </fieldset>
- <p> </p>
+ </div>
+ </fieldset>
+
+
+ <p class="submit_button">
+ <label title="Submit for validation">
+ <input type="submit" value="Check" />
+ </label>
+ </p>
- <p class="submit_button">
- <input type="submit" value="Validate this document" />
- </p>
</form>
</fieldset>
Index: index.html
===================================================================
RCS file: /sources/public/validator/htdocs/index.html,v
retrieving revision 1.89
retrieving revision 1.90
diff -u -d -r1.89 -r1.90
--- index.html 24 Apr 2007 01:35:15 -0000 1.89
+++ index.html 31 May 2007 02:32:14 -0000 1.90
@@ -4,12 +4,12 @@
--><!--#set var="relroot" value="./"
--><!--#include virtual="header.html" -->
-<p id="tagline">
-Check the markup (HTML, XHTML) of Web documents
-</p>
-
<div id="frontforms">
-<ul class="tabset_tabs"><li><a href="#validate-by-uri" class="active">by URI</a></li><li><a href="#validate-by-upload">by File Upload</a></li><li><a href="#validate-by-input">by direct Input</a></li></ul>
+ <ul id="tabset_tabs">
+ <li><a href="#validate-by-uri"><span>Validate by</span> URI</a></li>
+ <li><a href="#validate-by-upload"><span>Validate by</span> File Upload</a></li>
+ <li><a href="#validate-by-input"><span>Validate by</span> Direct Input</a></li>
+ </ul>
<div id="fields">
<fieldset id="validate-by-uri" class="tabset_content front"><legend class="tabset_label">Validate by URI</legend>
@@ -21,8 +21,22 @@
<label title="Address of page to Validate" for="uri">Address:</label>
<input type="text" name="uri" id="uri" size="45" />
</p>
- <p><a href="detailed.html#validate-by-uri" title="choose options from the detailed interface"><img alt="*" src="./images/arrow-right.gif"/> Options</a></p>
- <p class="submit_button"><label title="Submit file for validation"><input type="submit" value="Check" /></label></p>
+ <fieldset id="extra_opt_uri" class="moreoptions">
+ <legend class="toggletext">More Options</legend>
+ <div class="options">
+
+ <!--#set var="fieldset_id" value="uri"-->
+ <!--#include virtual="detailed-form.html" -->
+ </div>
+ </fieldset>
+
+
+ <p class="submit_button">
+ <label title="Submit for validation">
+ <input type="submit" value="Check" />
+ </label>
+ </p>
+
</form>
</fieldset>
@@ -31,8 +45,20 @@
<p class="instructions">Upload a document for validation:</p>
<p><label title="Choose a Local File to Upload and Validate" for="uploaded_file">File:</label>
<input type="file" id="uploaded_file" name="uploaded_file" size="30" /></p>
- <p><a href="detailed.html#validate-by-upload" title="choose options from the detailed interface"><img alt="*" src="./images/arrow-right.gif"/> Options</a></p>
- <p class="submit_button"><label title="Submit file for validation"><input type="submit" value="Check" /></label></p>
+ <fieldset id="extra_opt_upload" class="moreoptions">
+ <legend class="toggletext">More Options</legend>
+ <div class="options">
+ <!--#set var="fieldset_id" value="upload"-->
+ <!--#include virtual="detailed-form.html" -->
+ </div>
+ </fieldset><!-- invisible -->
+
+ <p class="submit_button">
+ <label title="Submit for validation">
+ <input type="submit" value="Check" />
+ </label>
+ </p>
+
</form>
<p><strong>Note</strong>: file upload may not work with Internet
Explorer on some versions of Windows XP Service Pack 2, see our
@@ -40,31 +66,41 @@
on the W3C QA Website.</p>
</fieldset>
-
-
<fieldset id="validate-by-input" class="tabset_content front"><legend class="tabset_label">Validate by direct input</legend>
<form method="post" enctype="multipart/form-data" action="check">
<p class="instructions"><label title="Paste a complete (HTML) Document here" for="fragment">Enter the Markup (Full Document) to validate</label>:<br />
<textarea id="fragment" name="fragment" rows="12" cols="80"></textarea>
- <!-- <br /><label for="parsemodel">Treat as:</label>
+ <!-- <br /><label for="parsemodel">Treat as:</label>
<select id="parsemodel" name="parsemodel">
<option value="sgml">HTML</option>
<option value="xml">XML (and XHTML)</option>
</select> -->
</p>
- <p><a href="detailed.html#validate-by-input" title="choose options from the detailed interface"><img alt="*" src="./images/arrow-right.gif"/> Options</a></p>
+ <fieldset id="extra_opt_direct" class="moreoptions">
+ <legend class="toggletext">More Options</legend>
+ <div class="options">
+
+ <table>
+ <!--#set var="fieldset_id" value="direct"-->
+ <!--#include virtual="detailed-form_directinput.html" -->
+ </table>
+ </div>
+ </fieldset>
+
+
+ <p class="submit_button">
+ <label title="Submit for validation">
+ <input type="submit" value="Check" />
+ </label>
+ </p>
- <p class="submit_button">
- <input type="submit" value="Validate this document" />
- </p>
</form>
</fieldset>
</div><!-- fields -->
</div> <!-- frontforms -->
- <!--#include virtual="intro.html" -->
-
+<!--#include virtual="intro.html" -->
<!--#include virtual="footer.html" -->
</body>
</html>
Index: footer.html
===================================================================
RCS file: /sources/public/validator/htdocs/footer.html,v
retrieving revision 1.17
retrieving revision 1.18
diff -u -d -r1.17 -r1.18
--- footer.html 20 Apr 2007 00:23:41 -0000 1.17
+++ footer.html 31 May 2007 02:32:14 -0000 1.18
@@ -1,12 +1,13 @@
<ul class="navbar" id="menu">
- <a href="<!--#echo var="relroot" -->" accesskey="1" title="Go to the Home Page for The W3C Markup Validation Service"><strong>Home</strong></a></li>
- <li><a href="<!--#echo var="relroot" -->about.html" title="Information About this Service">About...</a></li>
- <li><a href="<!--#echo var="relroot" -->whatsnew.html" title="The changes made to this service recently">News</a></li>
- <li><a href="<!--#echo var="relroot" -->docs/" accesskey="3" title="Documentation for this Service">Docs</a></li>
- <li><a href="<!--#echo var="relroot" -->docs/help.html" title="Help and answers to frequently asked questions">Help & <acronym title="Frequently Asked Questions">FAQ</acronym></a></li>
+ <li><a href="<!--#echo var="relroot" -->" accesskey="1" title="Go to the Home Page for The W3C Markup Validation Service">Home</a><span> | </span></li>
+ <li><a href="<!--#echo var="relroot" -->about.html" title="Information About this Service">About...</a><span> | </span></li>
+ <li><a href="<!--#echo var="relroot" -->whatsnew.html" title="The changes made to this service recently">News</a><span> | </span></li>
+ <li><a href="<!--#echo var="relroot" -->docs/" accesskey="3" title="Documentation for this Service">Docs</a><span> | </span></li>
+ <li><a href="<!--#echo var="relroot" -->docs/help.html" title="Help and answers to frequently asked questions">Help & <acronym title="Frequently Asked Questions">FAQ</acronym></a><span> | </span></li>
<li><a href="<!--#echo var="relroot" -->feedback.html" accesskey="4" title="How to provide feedback on this service">Feedback</a></li>
</ul>
+<div id="footer">
<p id="activity_logos">
<a href="http://www.w3.org/QA/" title="W3C's Quality Assurance Activity, bringing you free Web quality tools and more">
@@ -45,3 +46,4 @@
<a href="http://www.w3.org/Consortium/Legal/privacy-statement#Members">Member</a> privacy
statements.
</p>
+</div>
\ No newline at end of file
Index: header.html
===================================================================
RCS file: /sources/public/validator/htdocs/header.html,v
retrieving revision 1.48
retrieving revision 1.49
diff -u -d -r1.48 -r1.49
--- header.html 19 Apr 2007 19:41:42 -0000 1.48
+++ header.html 31 May 2007 02:32:14 -0000 1.49
@@ -6,12 +6,11 @@
<title><!--#echo var="title" --></title>
<link rev="made" href="mailto:www-validator@w3.org" />
<link rev="start" href="<!--#echo var="relroot" -->" title="Home Page" />
- <style type="text/css" media="all">@import "<!--#echo var="relroot" -->style/base.css";
-</style>
- <script type="text/javascript" src="<!--#echo var="relroot" -->scripts/tabtastic/addclasskillclass.js"></script>
- <script type="text/javascript" src="<!--#echo var="relroot" -->scripts/tabtastic/attachevent.js"></script>
- <script type="text/javascript" src="<!--#echo var="relroot" -->scripts/tabtastic/addcss.js"></script>
- <script type="text/javascript" src="<!--#echo var="relroot" -->scripts/tabtastic/tabtastic.js"></script>
+ <style type="text/css" media="all">
+ @import "<!--#echo var="relroot" -->style/base.css";
+ </style>
+ <script type="text/javascript" src="scripts/mootools.js"></script>
+ <script type="text/javascript" src="scripts/w3c-validator.js"></script>
<meta name="revision" content="$Id$" />
<meta name="keywords" content="HTML, HyperText Markup Language, Validation,
W3C Markup Validation Service" />
@@ -27,8 +26,11 @@
<body>
<div id="banner">
- <h1 id="title"><a href="http://www.w3.org/"><img height="48" alt="W3C" id="logo" src="http://www.w3.org/Icons/WWW/w3c_home_nb" /></a>
- <a href="<!--#echo var="relroot" -->"><img src="<!--#echo var="relroot" -->images/markup_validation_service.png" alt="Markup Validation Service" /></a></h1>
+ <h1 id="title">
+ <a href="http://www.w3.org/"><img alt="W3C" width="110" height="61" id="logo" src="<!--#echo var="relroot" -->images/w3c.png" /></a>
+ <a href="<!--#echo var="relroot" -->"><span>Markup Validation Service</span></a>
+ </h1>
+ <p id="tagline">Check the markup (HTML, XHTML) of Web documents</p>
</div>
Received on Thursday, 31 May 2007 02:32:29 UTC