updated UI

This commit is contained in:
briandilley 2004-10-24 10:14:10 +00:00
parent 1db48ad420
commit 9a1f6b2f0c
7 changed files with 142 additions and 170 deletions

View File

@ -1,2 +1,2 @@
Thank you for using Kwotes!<br />
Thank you for adding your kwote, here's a link to it: <a href="?action=show&amp;id=${KWOTE_ID}">#${KWOTE_ID}</a> Your quote may be accessed here:&nbsp;<a href="?action=show&amp;id=${KWOTE_ID}">#${KWOTE_ID}</a>.

View File

@ -1,7 +1,8 @@
<div class="search-container"> <form action="${SCRIPT_NAME}" method="POST">
<form action="${SCRIPT_NAME}" method="POST"> <input type="hidden" name="action" value="doadd" />
<input type="hidden" name="action" value="doadd" />
<textarea rows="15" cols="60" name="content"></textarea><br /> <div style="margin: 5px;">
<input type="submit" value="Submit" /> <textarea cols="80" rows="20" name="content"></textarea><br />
</form> <input type="submit" value="Submit Quote" />
</div> </div>
</form>

View File

@ -1,40 +1,13 @@
<p> Welcome to Kwotes, a chat quote database system with a twist.
The quotes are publicly moderated, so it's up to YOU to maintain the quality.
All quotes are accepted and if their ranking falls too low for too long, they are deleted.
</p>
This system has advantages over existing systems. Here are a few:
<div> <ul>
<h3>Welcome</h3> <li>You can vote for a quote without it going to a new page--causing you to lose your place in the process.</li>
We need to add some content here, soon! Anyway, this is kwotes. It's <li>The system is publicly moderated, so all submissions are accepted. The users determine what is funny!</li>
a chat quote database system, with a twist. This chat quote database <li>Users may only submit a limited number of quotes per hour.</li>
is publicly moderated... so ALL of your submissions are accepted, and <li>A Simple, standards-compliant design that works in all modern browsers(sorry NS4/IE3 users!)</li>
it's up to the general public to determine wether or not it's funny... <li>The system is open source. You can download the source code using the link at the bottom of the page.</li>
no stupid moderators who wouldn't know funny if it grabed them by the </ul>
asshole and ripped them apart. Anyway, this system has some advantages
over existing systems, here are a few:
<ul>
<li>
You can vote for a quote without it going to a new page and
you losing your place in your current view.
</li>
<li>
The system is publicly moderated so that all submissions are
accepted, submissions that are less than zero for more than
a certain period of time are removed from the system (maybe...)
</li>
<li>
Users may only submit 4 quotes per hour.
</li>
<li>
The system is opensource, you can download the source code
using the link at the bottom of the page. Work is being
done to setup a CVS repository and such.
</li>
<li>
Slim sleek design... all browsers like us :)
</li>
</ul>
We're thinking about creating an egdrop script for auto submiting
quotes to the system, we'll see how that goes :)
</div>

View File

@ -1,28 +1,32 @@
<form action="${SCRIPT_NAME}" method="get">
<input type="hidden" name="action" value="list" />
<input type="hidden" name="s" value="0" />
<form action="${SCRIPT_NAME}" method="get"> <div style="margin-left: auto; margin-right: auto; width: 400px;">
<div class="search-container"> <div>
<input type="hidden" name="action" value="list" /> <span style="margin-right: 10px;">Search Text:</span>
<input type="hidden" name="s" value="0" /> <input type="text" size="15" name="ss" /> <input type="submit" value="Search" />
</div>
<span>Search:&nbsp;</span><input type="text" name="ss" />&nbsp;<input type="submit" value="Search" /> <span style="margin-right: 10px;">
&nbsp;&nbsp; Sort by:
<select name="o">
<option value="date">Date</option>
<option value="rating">Rating</option>
</select>
</span>
Kwotes per page: <span>
<select name="m"> Per page:
<option value="5">5</option> <select name="m">
<option value="20">20</option> <option value="5">5</option>
<option value="30">30</option> <option value="20">20</option>
<option value="40">40</option> <option value="30">30</option>
<option value="50">50</option> <option value="40">40</option>
<option value="100">100</option> <option value="50">50</option>
<option value="200">200</option> <option value="100">100</option>
</select> <option value="200">200</option>
&nbsp;&nbsp; </select>
</span>
Sort by: </div>
<select name="o"> </form>
<option value="date">Date</option>
<option value="rating">Rating</option>
</select>
</div>
</form>

View File

@ -1,19 +1,16 @@
<div class="quote"> <div class="kwote">
<div class="quote-header"> <span class="kwote-id"><a href="?action=show&amp;id=${KWOTE_ID}">#${KWOTE_ID}</a></span>
<span><a href="?action=show&amp;id=${KWOTE_ID}">#${KWOTE_ID}</a></span> <span class="vote-controls">
<span class="vote-controls"> <a href="?action=hate&amp;kid=${KWOTE_ID}"
<a href="?action=hate&amp;kid=${KWOTE_ID}" onclick="vote(${KWOTE_ID},'hate'); return false;"
onclick="vote(${KWOTE_ID},'hate'); return false;" id="hate${KWOTE_ID}">-</a>
id="hate${KWOTE_ID}" <span id="rating${KWOTE_ID}">${KWOTE_RATING}</span>
>-</a> <a href="?action=love&amp;kid=${KWOTE_ID}"
&nbsp;<span id="rating${KWOTE_ID}">${KWOTE_RATING}</span>&nbsp; onclick="vote(${KWOTE_ID},'love'); return false"
<a href="?action=love&amp;kid=${KWOTE_ID}" id="love${KWOTE_ID}">+</a>
onclick="vote(${KWOTE_ID},'love'); return false" </span>
id="love${KWOTE_ID}"
>+</a> <div class="kwote-content">
</span> ${KWOTE_TEXT}
</div> </div>
<div class="quote-content"> </div>
${KWOTE_TEXT}
</div>
</div>

View File

@ -1,19 +1,15 @@
</div> <div class="footer">
<a href="http://validator.w3.org/check?uri=referer">Valid XHTML 1.1</a>
<div class="footer"> <a href="http://jigsaw.w3.org/css-validator/check/referer">Valid CSS</a>
<a href="http://validator.w3.org/check?uri=referer">Valid XHTML 1.0 Strict</a> <a href="http://sourceforge.net/projects/kwotes/">Project Page</a>
&nbsp;-&nbsp; <a href="http://sourceforge.net">
<a href="http://sourceforge.net/projects/kwotes/">download the source</a>
&nbsp;-&nbsp;
${KWOTE_COUNT} live kwotes, ${KWOTE_BACKUP_COUNT} deleted kwotes
&nbsp;-&nbsp;
<a href="http://sourceforge.net">
<img src="http://sourceforge.net/sflogo.php?group_id=121598&amp;type=1" <img src="http://sourceforge.net/sflogo.php?group_id=121598&amp;type=1"
width="88" width="88" height="31" alt="SourceForge.net!" />
height="31" </a>
class="sf-logo"
alt="SourceForge.net Logo" /></a> <span style="float: right;">${KWOTE_COUNT} Live Kwotes, ${KWOTE_BACKUP_COUNT} Deleted Kwotes</span>
</div>
</div> </div>
</body> </div>
</body>
</html> </html>

View File

@ -1,61 +1,62 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" > <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>${TITLE}</title>
<link rel="stylesheet" type="text/css" href="html/quotes.css" />
<!--[if IE]> <head>
<link rel="stylesheet" type="text/css" href="html/quotes-ie.css" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<![endif]-->
<script type="text/javascript"> <title>${TITLE}</title>
function vote(kid,type) { <link rel="stylesheet" type="text/css" href="html/kwotes.css" />
var img = new Image();
img.src = "?action="+escape(type)
+unescape("%26")+"kid="+escape(kid)
+unescape("%26")+"rnd="+Math.random();
hideElementById("hate"+kid);
hideElementById("love"+kid);
var ratingElem = document.getElementById("rating"+kid); <!--[if IE]>
if (ratingElem) { <link rel="stylesheet" type="text/css" href="html/kwotes-ie.css" />
var html = ratingElem.innerHTML; <![endif]-->
var rating = parseInt(html)+( (type=="love")?1:-1 );
ratingElem.innerHTML = rating;
}
}
function hideElementById(id) { <script type="text/javascript">
var elem = document.getElementById(id); function vote( kid, type )
if (elem) { {
elem.style.display = "none"; var img = new Image();
} img.src = "?action="+escape(type)
} +unescape("%26")+"kid="+escape(kid)
+unescape("%26")+"rnd="+Math.random();
hideElementById("hate"+kid);
hideElementById("love"+kid);
</script> var ratingElem = document.getElementById("rating"+kid);
</head> if (ratingElem)
<body> {
<div class="container"> var html = ratingElem.innerHTML;
<span style="font-weight: bold;">Kwotes.org - The publicly moderated chat quote database</span> var rating = parseInt(html)+( (type=="love")?1:-1 );
ratingElem.innerHTML = rating;
}
}
<ul class="tab-list"> function hideElementById( id )
<li class="tab"><a href="?">Home</a></li> {
<li class="tab"><a href="?action=add">Add</a></li> var elem = document.getElementById(id);
<li class="tab"><a href="?action=list&amp;o=date">Latest</a></li> if (elem) {
<li class="tab"><a href="?action=list&amp;o=rating&amp;s=0&amp;m=20&amp;mr=50">Top 100</a></li> elem.style.display = "none";
<li class="tab"><a href="?action=list&amp;o=rating&amp;s=0&amp;m=20&amp;mr=50&amp;so=reverse">Bottom 100</a></li> }
<li class="tab"><a href="?action=search">Search</a></li> }
</ul> </script>
</head>
<body>
<div class="container">
<div style="margin-bottom: 2px;">
<form action="${SCRIPT_NAME}" method="get"> <form action="${SCRIPT_NAME}" method="get">
<div class="direct-form">
<span>Kwote #</span>
<input type="hidden" name="action" value="show" /> <input type="hidden" name="action" value="show" />
<input type="text" name="id" /> <span class="id-search">Kwote #&nbsp;<input type="text" size="5" /></span>
</div>
</form> </form>
<span class="title">Kwotes - For happy goodness!</span>
</div>
<ul class="tab-menu">
<li class="tab"><a href="?">Home</a></li>
<li class="tab"><a href="?action=add">Add</a></li>
<li class="tab"><a href="?action=list&amp;o=date">Latest</a></li>
<li class="tab"><a href="?action=list&amp;o=rating&amp;s=0&amp;m=20&amp;mr=50">Top 100</a></li>
<li class="tab"><a href="?action=list&amp;o=rating&amp;s=0&amp;m=20&amp;mr=50&amp;so=reverse">Bottom 100</a></li>
<li class="tab"><a href="?action=search">Search</a></li>
</ul>
<div class="body-container">