Project

General

Profile

« Previous | Next » 

Revision 07aafc0f

Added by dsorber about 11 years ago

A few more UI changes including a header and footer and a few other refinements.

View differences:

software/bookmark_library/bmklib/web/htdocs/css/bmk_form.css
input {
font-size: 20px;
font-size: 18px;
padding: 0.3em;
width:100%;
box-sizing: border-box; /* For IE and modern versions of Chrome */
......
}
textarea {
font-size: 20px;
font-size: 16px;
padding: 0.3em;
width:100%;
height:100%;
......
font-size: 14px;
}
div.container {
border: 0px;
border-spacing: 0px;
width: 80%;
margin-left: auto;
margin-right: auto;
}
div.container p {
div#container p {
font-size: 20px;
margin-top: 0.1em;
}
software/bookmark_library/bmklib/web/htdocs/css/bmk_list.css
table {
border: 1px solid #000000;
border-spacing: 0px;
width: 100%;
}
table a:link {
color: #000000;
text-decoration: none;
}
table a:visited {
color: #000000;
text-decoration: none;
}
table a:hover {
color: #000000;
text-decoration: underline;
}
tr.even {
background-color: #FFFFFF;
}
tr.odd {
background-color: #EEEEEE;
}
th {
padding: 10px;
border-spacing: 2px;
}
td {
padding: 4px 5px;
}
.tag {
font-size: 7pt;
font-weight: bold;
background-color: #003399;
color: #FFF;
padding: 0.4em 1em;
display: inline;
border-radius: 8px;
margin-left: 1.5em;
vertical-align: middle;
}
.detail_link {
font-size: 10px;
}
software/bookmark_library/bmklib/web/htdocs/css/bmk_main.css
body {
font-family: sans-serif;
font-size: 16px
font-size: 16px;
margin-left: 0px;
margin-right: 0px;
}
h1 {
margin-left: 0.2em;
}
h3 {
font-size: 24px;
}
table {
border: 1px solid #000;
border-spacing: 0px;
margin-left: 2em;
margin-right: auto;
div#nav_bar {
width: 100%;
background-color: #CC0000;
padding: 0.2em 0em;
margin-bottom: 1em;
border-top: 1px solid #666666;
border-bottom: 1px solid #666666;
}
table a:link {
color: #000;
div#nav_bar a {
height: 100%;
display: block-inline;
text-decoration: none;
margin-left: 1em;
color: #FFFFFF;
font-size: 9pt;
font-family: sans-serif;
font-weight: bold;
}
table a:visited {
color: #000;
div#nav_bar a:hover {
display: block-inline;
text-decoration: none;
}
table a:hover {
margin-left: 1em;
color: #000;
text-decoration: underline;
}
tr.even {
background-color: #FFF;
}
tr.odd {
background-color: #FFC;
}
th {
border: 1px solid #000;
padding: 10px;
border-spacing: 2px;
font-size: 9pt;
font-family: sans-serif;
font-weight: bold;
}
td {
border-top: 1px solid #000;
padding: 2px 5px;
div#container {
border: 0px;
border-spacing: 0px;
width: 80%;
margin-left: auto;
margin-right: auto;
}
.tag {
background-color: #DDD;
font-size: 12px
padding: 0.5em;
border-right: 2px;
div#footer {
margin-top: 2em;
font-family: arial, sans-serif;
}
.detail_link {
font-size: 10px;
div#footer p.legalese {
font-size: 8pt;
}
software/bookmark_library/bmklib/web/htdocs/js/add_tags.js
$(document).ready(function() {
$("input[type='button']#back_button").click(function() {
history.back();
return false;
});
// Function to add new tags
$("input[name='add_category_tag']").click(function() {
// Get list of existing category tags
software/bookmark_library/bmklib/web/templates/all_bookmarks.html
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:xi="http://www.w3.org/2001/XInclude"
xmlns:py="http://genshi.edgewall.org/">
<xi:include href="layout.html" />
<head>
<title>Bookmark Library</title>
<link rel="stylesheet" type="text/css" href="http://127.0.0.1/htdocs/css/bmk_main.css"></link>
<link rel="stylesheet" type="text/css" href="/htdocs/css/bmk_list.css"></link>
</head>
<body>
<h1>All Bookmarks</h1>
<h3>All Bookmarks</h3>
<p>${page_idx} of ${max_page_idx}</p>
<table>
<tr py:for="idx, bookmark in enumerate(bookmarks)" class="${idx % 2 == 1 and 'odd' or 'even'}">
<td>${idx + ((page_idx - 1) * len(bookmarks)) + 1} <a class="detail_link" href="${update_link}/${bookmark.id}">+</a></td>
<td><a href="${bookmark.url}">${bookmark.title and bookmark.title or 'no title'}</a></td>
<td><py:for each="tag in bookmark.category_tags"><span class="tag">${tag.value}</span></py:for></td>
<td><a href="${bookmark.url}">${bookmark.title and bookmark.title or 'no title'}</a><py:for each="tag in bookmark.category_tags"><span class="tag">${tag.value}</span></py:for></td>
<!--
<td><py:for each="tag in bookmark.description_tags"><span class="tag">${tag.value}</span></py:for></td>
-->
</tr>
</table>
software/bookmark_library/bmklib/web/templates/bookmark.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:xi="http://www.w3.org/2001/XInclude"
xmlns:py="http://genshi.edgewall.org/">
<xi:include href="layout.html" />
<head>
<title>Bookmark Library</title>
<link rel="stylesheet" type="text/css" href="http://127.0.0.1/htdocs/css/bmk_form.css"></link>
<link rel="stylesheet" type="text/css" href="http://127.0.0.1/htdocs/css/bmk_main.css"></link>
<script src="http://127.0.0.1/htdocs/js/jquery-2.1.3.min.js"></script>
<link rel="stylesheet" type="text/css" href="/htdocs/css/bmk_form.css"></link>
<link rel="stylesheet" type="text/css" href="/htdocs/css/bmk_main.css"></link>
<script src="/htdocs/js/jquery-2.1.3.min.js"></script>
<script src="/htdocs/js/add_tags.js"></script>
</head>
<body>
<h1>Bookmarks</h1>
<a href="/bmk/bookmarks">All bookmarks</a>
<py:choose test="invalid">
<py:when test="True">
......
<span class="form_label">Description Tags:</span>
<ul>
<li py:for="desc_tag in bookmark.description_tags">${desc_tag.value}</li>
</ul>
</ul>
</div>
<input id="back_button" class="button" type="button" value="Cancel" />
<input class="button" type="submit" value="Update" />
</div>
</form>
software/bookmark_library/bmklib/web/templates/layout.html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:py="http://genshi.edgewall.org/" py:strip="">
<py:match path="head" once="true">
<head py:attrs="select('@*')">
<title py:with="title = list(select('title/text()'))">
Geddit<py:if test="title">: ${title}</py:if>
</title>
<!--
<link rel="stylesheet" href="${url('/media/layout.css')}" type="text/css" />
<script type="text/javascript" src="${url('/media/jquery.js')}"></script>
-->
<link rel="stylesheet" type="text/css" href="/htdocs/css/bmk_main.css"></link>
${select('*[local-name()!="title"]')}
</head>
</py:match>
<py:match path="body" once="true">
<body py:attrs="select('@*')">
<h1>Bookmarks</h1>
<div id="nav_bar">
<a href="/bmk/">Home</a>
<a href="/bmk/bookmarks">All bookmarks</a>
<a href="/bmk/tags">All tags</a>
</div>
<div id="container">
${select('*|text()')}
</div>
<div id="footer">
<hr />
<p class="legalese">© 2015 DBS patent pending trademark</p>
</div>
</body>
</py:match>
</html>

Also available in: Unified diff