branch: new-master
commit d2d8dd08c077a37abec92a6c4c45a06230d86402
Author: Nicolas Petton <nico...@petton.fr>
Commit: Nicolas Petton <nico...@petton.fr>
Better generated HTML pages
* admin/archive-contents.el: Better HTML generation.
* html/index.html: Improvements of the page.
* html/javascript/jquery.filtertable.min.js:
* html/layout.css: New css rules
* html/favicon.png:
* html/images/elpa-small.png:
* html/images/elpa.png:
* html/javascript/jquery.min.js:
* html/javascript/package-search.js: New files.
---
html/favicon.png | Bin 0 -> 624 bytes
html/images/elpa-small.png | Bin 0 -> 1694 bytes
html/images/elpa.png | Bin 0 -> 9096 bytes
html/index.html | 100 +++++++----
html/javascript/jquery.filtertable.min.js | 13 ++
html/javascript/jquery.min.js | 5 +
html/javascript/package-search.js | 6 +
html/layout.css | 282 ++++++++++++++++++++++++------
8 files changed, 313 insertions(+), 93 deletions(-)
diff --git a/html/favicon.png b/html/favicon.png
new file mode 100644
index 0000000..6b139ea
Binary files /dev/null and b/html/favicon.png differ
diff --git a/html/images/elpa-small.png b/html/images/elpa-small.png
new file mode 100644
index 0000000..4fdf2e7
Binary files /dev/null and b/html/images/elpa-small.png differ
diff --git a/html/images/elpa.png b/html/images/elpa.png
new file mode 100644
index 0000000..238480c
Binary files /dev/null and b/html/images/elpa.png differ
diff --git a/html/index.html b/html/index.html
index 4afe884..187e89c 100644
--- a/html/index.html
+++ b/html/index.html
@@ -1,39 +1,65 @@
-<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
+<!doctype html>
<html>
-<head>
- <title>GNU Emacs Lisp Package Archive</title>
- <link rel="icon" type="image/png" href="gnu-head-mini.png">
- <link rel="stylesheet" type="text/css" href="layout.css">
-</head>
-<body>
-
-<h1>GNU Emacs Lisp Package Archive</h1>
-
-<p>
-This is the default package repository for
-<a href="http://www.gnu.org/software/emacs/";>GNU Emacs</a>.
-</p>
-
-<p>
-To use it, type <tt>M-x list-packages</tt> in Emacs.
-(This requires Emacs version 24.1 or higher.) <br/>
-Since you'll probably want to use your installed packages, it's also
-<a
href="https://www.gnu.org/software/emacs/manual/html_node/emacs/Package-Installation.html#Package-Installation";>recommended</a>
-that you add <code>(package-initialize)</code> somewhere
-in your <code>~/.emacs</code> file.
-</p>
-
-<p>Or you can just browse the <a href="packages/">list of packages</a>.</p>
-
-<p>
-Packages are managed through the
-<a href="http://git.savannah.gnu.org/cgit/emacs/elpa.git";>GNU ELPA
repository</a>
-(see the <a href="https://savannah.gnu.org/projects/emacs";>GNU Emacs project
page</a>
-for clone instructions). <br>
-To contribute new packages refer to the
-<a
href="http://git.savannah.gnu.org/cgit/emacs/elpa.git/plain/README";>README</a>.
-</p>
-
-<!-- <p> You can grab the <a href="emacs-packages-latest.tgz">latest package
snapshot</a>. -->
-</body>
+ <head>
+ <title>GNU Emacs Lisp Package Archive</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <link rel="shortcut icon" type="image/png" href="favicon.png">
+ <link rel="stylesheet" href="//code.cdn.mozilla.net/fonts/fira.css">
+ <link rel="stylesheet" type="text/css" href="layout.css">
+ <meta name="viewport"
content="initial-scale=1.0,maximum-scale=1.0,width=device-width" />
+ </head>
+
+ <body>
+ <div class="wrapper">
+ <div class="header">
+ <div class="container">
+ <img src="images/elpa.png" alt="ELPA"/>
+ <h1>GNU Emacs Lisp Package Archive</h1>
+
+ <p>
+ The default package repository for
+ <a href="http://www.gnu.org/software/emacs/";>GNU
Emacs</a>.
+ </p>
+ </div>
+ </div>
+
+ <div class="container">
+ <p>
+ To use it, type <tt>M-x list-packages</tt> in Emacs.
+ (This requires Emacs version 24.1 or higher.) <br/>
+
+ Since you'll probably want to use your installed packages,
it's also
+ <a
href="https://www.gnu.org/software/emacs/manual/html_node/emacs/Package-Installation.html#Package-Installation";>recommended</a>
+ that you add <code>(package-initialize)</code> somewhere
+ in your <code>~/.emacs</code> file.
+ </p>
+
+ <p class="centered"><a class="button" href="packages/">Browse
the packages</a></p>
+
+ <p>
+ Packages are managed through the
+ <a
href="http://git.savannah.gnu.org/cgit/emacs/elpa.git";>GNU ELPA repository</a>
+ (see the <a
href="https://savannah.gnu.org/projects/emacs";>GNU Emacs project page</a>
+ for clone instructions).
+ </p>
+
+ <p>
+ To contribute new packages refer to the
+ <a
href="http://git.savannah.gnu.org/cgit/emacs/elpa.git/plain/README";>README</a>.
+ </p>
+
+ <!-- <p> You can grab the <a
href="emacs-packages-latest.tgz">latest package snapshot</a>. -->
+ </div>
+ <div class="push"></div>
+ </div>
+
+ <div class="footer">
+ <div class="container">
+ <p>
+ Copyright 2015 Free Software Foundation, Inc.
+ </p>
+ </div>
+ </div>
+
+ </body>
</html>
diff --git a/html/javascript/jquery.filtertable.min.js
b/html/javascript/jquery.filtertable.min.js
new file mode 100644
index 0000000..fe3b588
--- /dev/null
+++ b/html/javascript/jquery.filtertable.min.js
@@ -0,0 +1,13 @@
+/**
+ * jquery.filterTable
+ *
+ * This plugin will add a search filter to tables. When typing in the filter,
+ * any rows that do not contain the filter will be hidden.
+ *
+ * Utilizes bindWithDelay() if available.
https://github.com/bgrins/bindWithDelay
+ *
+ * @version v1.5.5
+ * @author Sunny Walker, swal...@hawaii.edu
+ * @license MIT
+ */
+!function($){var
e=$.fn.jquery.split("."),t=parseFloat(e[0]),n=parseFloat(e[1]);2>t&&8>n?($.expr[":"].filterTableFind=function(e,t,n){return
$(e).text().toUpperCase().indexOf(n[3].toUpperCase())>=0},$.expr[":"].filterTableFindAny=function(e,t,n){var
i=n[3].split(/[\s,]/),r=[];return $.each(i,function(e,t){var
n=t.replace(/^\s+|\s$/g,"");n&&r.push(n)}),r.length?function(e){var t=!1;return
$.each(r,function(n,i){return
$(e).text().toUpperCase().indexOf(i.toUpperCase())>=0?(t=!0,!1):void 0} [...]
\ No newline at end of file
diff --git a/html/javascript/jquery.min.js b/html/javascript/jquery.min.js
new file mode 100644
index 0000000..0f60b7b
--- /dev/null
+++ b/html/javascript/jquery.min.js
@@ -0,0 +1,5 @@
+/*! jQuery v1.11.3 | (c) 2005, 2015 jQuery Foundation, Inc. |
jquery.org/license */
+!function(a,b){"object"==typeof module&&"object"==typeof
module.exports?module.exports=a.document?b(a,!0):function(a){if(!a.document)throw
new Error("jQuery requires a window with a document");return
b(a)}:b(a)}("undefined"!=typeof window?window:this,function(a,b){var
c=[],d=c.slice,e=c.concat,f=c.push,g=c.indexOf,h={},i=h.toString,j=h.hasOwnProperty,k={},l="1.11.3",m=function(a,b){return
new
m.fn.init(a,b)},n=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g,o=/^-ms-/,p=/-([\da-z])/gi,q=function(a,b
[...]
+
+return!0}function Q(a,b,d,e){if(m.acceptData(a)){var
f,g,h=m.expando,i=a.nodeType,j=i?m.cache:a,k=i?a[h]:a[h]&&h;if(k&&j[k]&&(e||j[k].data)||void
0!==d||"string"!=typeof b)return
k||(k=i?a[h]=c.pop()||m.guid++:h),j[k]||(j[k]=i?{}:{toJSON:m.noop}),("object"==typeof
b||"function"==typeof
b)&&(e?j[k]=m.extend(j[k],b):j[k].data=m.extend(j[k].data,b)),g=j[k],e||(g.data||(g.data={}),g=g.data),void
0!==d&&(g[m.camelCase(b)]=d),"string"==typeof
b?(f=g[b],null==f&&(f=g[m.camelCase(b)])):f=g,f}}fu [...]
+return new
Za.prototype.init(a,b,c,d,e)}m.Tween=Za,Za.prototype={constructor:Za,init:function(a,b,c,d,e,f){this.elem=a,this.prop=c,this.easing=e||"swing",this.options=b,this.start=this.now=this.cur(),this.end=d,this.unit=f||(m.cssNumber[c]?"":"px")},cur:function(){var
a=Za.propHooks[this.prop];return
a&&a.get?a.get(this):Za.propHooks._default.get(this)},run:function(a){var
b,c=Za.propHooks[this.prop];return
this.options.duration?this.pos=b=m.easing[this.easing](a,this.options.duration*a,
[...]
diff --git a/html/javascript/package-search.js
b/html/javascript/package-search.js
new file mode 100644
index 0000000..4713404
--- /dev/null
+++ b/html/javascript/package-search.js
@@ -0,0 +1,6 @@
+$(document).ready(function() {
+ $('table').filterTable({
+ label: '',
+ placeholder: 'Search packages...'
+ });
+});
diff --git a/html/layout.css b/html/layout.css
index f6c1395..0744ab9 100644
--- a/html/layout.css
+++ b/html/layout.css
@@ -1,87 +1,257 @@
-/* This is heavily cut-down version of http://www.gnu.org/layout.css */
+/* Begin of reset */
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ font-size: 100%;
+ font: inherit;
+ vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+ display: block;
+}
+body {
+ line-height: 1;
+}
+ol, ul {
+ list-style: none;
+}
+blockquote, q {
+ quotes: none;
+}
+blockquote:before, blockquote:after,
+q:before, q:after {
+ content: '';
+ content: none;
+}
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
+
+/* End of reset */
+
+body {
+ font-family: "fira sans", sans;
+ line-height: 1.5em;
+ font-size: 1.2em;
+ color: #333;
+}
+
+html, body {
+ height: 100%;
+}
+.wrapper {
+ min-height: 100%;
+ height: auto !important; /* This line and the next line are not necessary
unless you need IE6 support */
+ height: 100%;
+ margin: 0 auto -50px; /* the bottom margin is the negative value of the
footer's height */
+}
+.footer, .push {
+ height: 50px; /* .push must be the same height as .footer */
+}
+
+h1 {
+ font-size: 2em;
+ margin: 0.4em;
+}
-/*
-layout.css -- css stylesheet used on www.gnu.org
+h2 {
+ font-size: 1.2em;
+ margin: 1.2em 0px;
+}
-Copyright (C) 2006, 2007, 2008, 2009 Free Software Foundation
+a {
+ color: #c73a6c;
+ text-decoration: underline;
+}
-Permission is hereby granted, free of charge, to any person
-obtaining a copy of this software and associated documentation
-files (the "Software"), to deal in the Software without
-restriction, including without limitation the rights to use,
-copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the
-Software is furnished to do so, subject to the following
-conditions:
+a:hover {
+ color: white;
+ background-color: #973066;
+ text-decoration: none;
+}
-The above copyright notice and this permission notice shall be
-included in all copies or substantial portions of the Software.
-*/
+tt, code {
+ background-color: rgb(238, 238, 238);
+ border: 1px solid rgb(187, 187, 187);
+ padding: 0px 6px;
+ border-radius: 4px;
+}
-html, body{
- padding: 0;
- color: #35382a;
- max-width: 58em; margin: 0 auto 0; position: relative; min-width:
902px;
- padding-left: 10px; padding-right: 10px;
- background-color: #fff; padding-bottom: 1.8em; margin-top: 0.5em;
+p {
+ margin-bottom: 2em;
}
-body{
- font-family: sans-serif;
+p.centered {
+ text-align: center;
+ margin: 3em 0;
}
-a:hover{ color: red; }
+.button {
+ border: 2px solid;
+ padding: 10px;
+ border-radius: 10px;
+ text-decoration: none;
+ font-weight: bold;
+ font-size: 1.2em;
+}
-h1 {
- background-color: #3465a4; color: white; font-size: 2em;
- margin-bottom: 0.3em; font-weight:bold; text-align: center; line-height:
1.6em; }
+.container {
+ padding: 80px 20px;
+ width: 960px;
+ margin: 0 auto;
+}
-h2, h3, {line-height: 1.5em;}
+.header {
+ color: white;
+ text-align: center;
+ background-color: #bb3955;
+ background: #bb3955 linear-gradient(135deg, #c73a6c, #bb3955, #973066)
repeat scroll 0% 0%;
+ border-bottom: 6px solid #691240;
+}
+
+.header p {
+ margin: 0;
+}
+
+.header a {
+ color: rgb(240, 255, 135);
+ text-decoration: none;
+}
+
+.header a:hover {
+ color: rgb(240, 255, 135);
+ text-decoration: underline;
+ background: transparent;
+}
+
+.header.small {
+ text-align: left;
+ border-width: 3px;
+}
+
+.header.small h1 {
+ display: inline;
+ font-size: 1.5em;
+ margin: 0;
+ background: url(images/elpa-small.png) center left no-repeat;
+ padding: 10px;
+ padding-left: 120px;
+}
+
+.header.small .container {
+ padding: 20px;
+}
-h2{ font-size: 1.6em; }
+input[type="search"] {
+ border: 3px solid #ddd;
+ padding: 10px;
+ width: 100%;
+ font-size: 1.1em;
+ background: #fcfcfc;
+}
-h3{ font-size: 1.3em; }
+input[type="search"]:focus {
+ border-color: #bbb;
+ background: #fafafa;
+}
-img{ border: 0; }
+input[type="search"][placeholder] {
+ color: #666;
+}
-.nocenter{ text-align: left; }
+.filter-table .quick { margin-left: 0.5em; font-size: 0.8em; text-decoration:
none; }
+.fitler-table .quick:hover { text-decoration: underline; }
+td.alt { background-color: #ffc; background-color: rgba(255, 255, 0, 0.2); }
-ul { list-style: square; margin-left: 1.4em; list-style-image:url(bullet.gif);
}
+td, th {
+ padding: 6px;
+}
-ol{ list-style: decimal; margin-left: 1.9em; }
+th {
+ text-align: left;
+ border-bottom: 2px solid #ddd;
+ background: #fafafa;
+ font-weight: bold;
+}
-li, dd, p{
- padding-bottom: 1em; line-height: 1.5em; }
+td {
+ border-bottom: 1px solid #ddd;
+}
-dt{ font-weight: bold; }
+.footer {
+ border-top: 1px solid #999;
+ text-align:center;
+ font-size: 0.9em;
+ background-color: #eee;
+ color: #666;
+}
-pre {
-padding-left: 1.5em;
-padding-right: 1.5em;
-margin-top: 1em;
-margin-bottom: 1em;
-font-size: 0.9em;
-display: block;
-background-color: #eeeeee;
-color: #000000;
-font-family: monospace;
+.footer .container {
+ padding: 5px;
}
-strong, b{ font-weight: bold; }
+.footer p {
+ margin: 5px;
+ font-size: .8em;
+}
-em, i, var{ font-style: italic; }
+@media screen and (max-width: 999px) {
+ .container {
+ width: 600px;
+ }
+}
-blockquote{ margin: 1em; font-style: italic; }
+@media screen and (max-width: 639px) {
+ body {
+ font-size: 1em;
+ }
-code, kbd, samp, tt{ font-family: monospace; }
+ table {
+ width: 100%;
+ }
+
+ .container {
+ width: 90%;
+ padding: 40px 5%;
+ }
-.center{ text-align:center; }
+ h1 {
+ font-size: 1.4em;
+ }
-.big{ font-size: 130%; padding-top: 0.7em; }
+ .header img {
+ width: 300px;
+ }
-.inline-list li { display: inline }
+ td:last-child, th:last-child {
+ display: none;
+ }
+}
-.highlight{background-color: #ff6;}
+@media screen and (max-width: 439px) {
-h2 a{color: yellow !important;}
+ .header img {
+ width: 250px;
+ }
+
+ h1 {
+ font-size: 1.2em;
+ }
+}
