Change to more minimalistic website design + few HTML modernizations
I didn't touch the actual man page pages yet, but they seem to have mostly survived my CSS changes. There's a LOT of general UI improvements to be done, while this commit is really just a different style of paint.
This commit is contained in:
parent
b531f71ab0
commit
3db1283a16
5 changed files with 152 additions and 204 deletions
Binary file not shown.
|
Before Width: | Height: | Size: 183 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
217
www/index.pl
217
www/index.pl
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
use v5.26;
|
use v5.26;
|
||||||
use warnings;
|
use warnings;
|
||||||
use TUWF ':html_', ':xml';
|
use TUWF ':html5_', ':xml';
|
||||||
use POSIX 'ceil';
|
use POSIX 'ceil';
|
||||||
use SQL::Interp 'sql', 'sql_interp';
|
use SQL::Interp 'sql', 'sql_interp';
|
||||||
use Time::Local 'timegm';
|
use Time::Local 'timegm';
|
||||||
|
|
@ -196,26 +196,25 @@ sub framework_ {
|
||||||
|
|
||||||
html_ sub {
|
html_ sub {
|
||||||
head_ sub {
|
head_ sub {
|
||||||
link_ rel => 'stylesheet', type => 'text/css', href => '/man.css?4';
|
link_ rel => 'stylesheet', type => 'text/css', href => '/man.css?5';
|
||||||
title_ $o{title}.' - manned.org';
|
title_ $o{title}.' - manned.org';
|
||||||
};
|
};
|
||||||
body_ sub {
|
body_ sub {
|
||||||
div_ id => 'header', sub {
|
header_ sub {
|
||||||
a_ href => '/', 'manned.org';
|
a_ href => '/', 'Manned.org';
|
||||||
form_ action => '/browse/search', method => 'get', sub {
|
form_ action => '/browse/search', method => 'get', sub {
|
||||||
input_ type => 'text', name => 'q', id => 'q', tabindex => 1;
|
input_ type => 'text', name => 'q', id => 'q', tabindex => 1;
|
||||||
input_ type => 'submit', value => ' ';
|
input_ type => 'submit', value => 'Search';
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
div_ id => 'body', sub {
|
main_ class => $o{mainclass}, $content;
|
||||||
$content->();
|
footer_ sub {
|
||||||
br_ style => 'clear: both';
|
span_ sub {
|
||||||
};
|
a_ href => '/info/about', 'about'; txt_ ' | ';
|
||||||
div_ id => 'footer', sub {
|
a_ href => 'mailto:contact@manned.org', 'contact'; txt_ ' | ';
|
||||||
lit_ 'All manual pages are copyrighted by their respective authors.
|
a_ href => 'https://code.blicky.net/yorhel/manned', 'source';
|
||||||
| <a href="/info/about">About manned.org</a>
|
};
|
||||||
| <a href="mailto:contact@manned.org">Contact</a>
|
span_ 'all manual pages are copyrighted by their respective authors.';
|
||||||
| <a href="https://code.blicky.net/yorhel/manned">Source</a>';
|
|
||||||
};
|
};
|
||||||
script_ type => 'text/javascript', src => '/man.js', '';
|
script_ type => 'text/javascript', src => '/man.js', '';
|
||||||
}
|
}
|
||||||
|
|
@ -253,7 +252,7 @@ sub paginate_ {
|
||||||
};
|
};
|
||||||
|
|
||||||
my $lp = ceil($count/$perpage);
|
my $lp = ceil($count/$perpage);
|
||||||
p_ class => 'paginate', sub {
|
nav_ class => 'paginate', sub {
|
||||||
l_ 1 if $p > 1+4;
|
l_ 1 if $p > 1+4;
|
||||||
b_ '...' if $p > 1+5;
|
b_ '...' if $p > 1+5;
|
||||||
l_ $_ for (($p > 4 ? $p-4 : 1)..($p+4 > $lp ? $lp : $p+4));
|
l_ $_ for (($p > 4 ? $p-4 : 1)..($p+4 > $lp ? $lp : $p+4));
|
||||||
|
|
@ -278,47 +277,48 @@ TUWF::get '/' => sub {
|
||||||
|
|
||||||
sub num { local $_=shift; 1 while(s/(\d)(\d{3})($|,)/$1,$2/); $_ };
|
sub num { local $_=shift; 1 while(s/(\d)(\d{3})($|,)/$1,$2/); $_ };
|
||||||
|
|
||||||
framework_ title => 'Man Pages Archive', sub {
|
framework_ title => 'Man Pages Archive', mainclass => 'thin', sub {
|
||||||
h1_ 'Man Pages Archive';
|
h1_ 'Welcome to Manned.org';
|
||||||
p_ class => 'txt', sub {
|
h2_ 'The archive for man pages';
|
||||||
lit sprintf <<' _', map num($stats->{$_}), qw|hashes mans files packages|;
|
lit sprintf <<' _', map num($stats->{$_}), qw|hashes mans files packages|;
|
||||||
Indexing <b>%s</b> versions of <b>%s</b> manual pages found in <b>%s</b>
|
<p>
|
||||||
files of <b>%s</b> packages.
|
Indexing <b>%s</b> versions of <b>%s</b> manual pages found in
|
||||||
<br /><br />
|
<b>%s</b> files of <b>%s</b> packages.
|
||||||
Manned.org aims to index all manual pages from a variety of systems, both
|
</p><p>
|
||||||
old and new, and provides a convenient interface for looking up and viewing
|
Manned.org aims to index all manual pages from a variety of systems, both
|
||||||
the various versions of each man page.
|
old and new, and provides a convenient interface for looking up and viewing
|
||||||
<a href="/info/about">About manned.org »</a>
|
the various versions of each man page.
|
||||||
_
|
<a href="/info/about">More information »</a>
|
||||||
};
|
</p>
|
||||||
|
_
|
||||||
|
|
||||||
h2_ 'Browse the manuals';
|
h2_ 'Indexed systems';
|
||||||
ul_ id => 'systems', sub {
|
div_ class => 'systems', sub {
|
||||||
my %sys;
|
my %sys;
|
||||||
push $sys{$_->{name}}->@*, $_ for(systems->@*);
|
push $sys{$_->{name}}->@*, $_ for systems->@*;
|
||||||
li_ sub {
|
div_ sub {
|
||||||
my $sys = $sys{$_};
|
my $sys = $sys{$_};
|
||||||
my $img = $sys->[0]{short} =~ s/^(.+)-.+$/$1/r;
|
my $img = $sys->[0]{short} =~ s/^(.+)-.+$/$1/r;
|
||||||
if(@$sys == 1) {
|
if(@$sys == 1) {
|
||||||
a_ href => "/pkg/$sys->[0]{short}", sub {
|
a_ href => "/pkg/$sys->[0]{short}", sub {
|
||||||
span_ style => "background-image: url('images/$img.png')", '';
|
img_ src => "images/$img.png";
|
||||||
b_ $sys->[0]{name};
|
b_ $sys->[0]{name};
|
||||||
};
|
};
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
span_ style => "background-image: url('images/$img.png')", '';
|
img_ src => "images/$img.png";
|
||||||
b_ $sys->[0]{name};
|
div_ sub {
|
||||||
my $i = 0;
|
b_ $sys->[0]{name};
|
||||||
for(reverse @$sys) {
|
for(reverse @$sys) {
|
||||||
a_ href => "/pkg/$_->{short}", ++$i > 3 ? (class => 'hidden') : (), $_->{release};
|
a_ href => "/pkg/$_->{short}", $_->{release};
|
||||||
lit_ ' ';
|
lit_ ' ';
|
||||||
}
|
}
|
||||||
a_ href => '#', class => 'more', 'more...' if $i > 3;
|
};
|
||||||
} for sort keys %sys;
|
} for sort keys %sys;
|
||||||
};
|
};
|
||||||
|
|
||||||
h2_ 'Other sites';
|
h2_ 'Other relevant sites';
|
||||||
ul_ id => 'external', sub {
|
ul_ sub {
|
||||||
li_ sub { a_ href => 'http://man7.org/linux/man-pages/index.html', 'man7.org'; txt_ ' - Linux man pages from several upstream projects.' };
|
li_ sub { a_ href => 'http://man7.org/linux/man-pages/index.html', 'man7.org'; txt_ ' - Linux man pages from several upstream projects.' };
|
||||||
li_ sub { a_ href => 'https://manpag.es/', 'ManPag.es'; txt_ ' - Man pages from several Linux distributions.' };
|
li_ sub { a_ href => 'https://manpag.es/', 'ManPag.es'; txt_ ' - Man pages from several Linux distributions.' };
|
||||||
li_ sub { a_ href => 'https://www.mankier.com/', 'ManKier'; txt_ ' - Fedora Rawhide + some manually imported man pages; Nicely formatted and with some unique features.' };
|
li_ sub { a_ href => 'https://www.mankier.com/', 'ManKier'; txt_ ' - Fedora Rawhide + some manually imported man pages; Nicely formatted and with some unique features.' };
|
||||||
|
|
@ -336,16 +336,15 @@ TUWF::get '/' => sub {
|
||||||
li_ sub { a_ href => 'https://manpages.ubuntu.com/', 'Ubuntu Manuals' };
|
li_ sub { a_ href => 'https://manpages.ubuntu.com/', 'Ubuntu Manuals' };
|
||||||
li_ sub { a_ href => 'https://man.voidlinux.org/', 'Void Linux manpages' };
|
li_ sub { a_ href => 'https://man.voidlinux.org/', 'Void Linux manpages' };
|
||||||
};
|
};
|
||||||
}
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
TUWF::get '/info/about' => sub {
|
TUWF::get '/info/about' => sub {
|
||||||
framework_ title => 'About', sub {
|
framework_ title => 'About', mainclass => 'thin', sub {
|
||||||
h1_ 'About Manned.org';
|
h1_ 'About Manned.org';
|
||||||
div_ id => 'about', sub {
|
lit <<' _';
|
||||||
lit <<' _';
|
<h2 id="goal">Goal</h2>
|
||||||
<h2>Goal</h2>
|
|
||||||
<p>
|
<p>
|
||||||
The state of online indices of manual pages used to be a sad one. Existing
|
The state of online indices of manual pages used to be a sad one. Existing
|
||||||
sites used to only offer you a single version of a man page: From one
|
sites used to only offer you a single version of a man page: From one
|
||||||
|
|
@ -355,7 +354,7 @@ TUWF::get '/info/about' => sub {
|
||||||
harder to find a manual for a specific system. Additionally, some sites
|
harder to find a manual for a specific system. Additionally, some sites
|
||||||
rendered the manuals in an unreadable way, didn't correctly handle special
|
rendered the manuals in an unreadable way, didn't correctly handle special
|
||||||
formatting - like tables - or didn't correctly display non-ASCII characters.
|
formatting - like tables - or didn't correctly display non-ASCII characters.
|
||||||
<br /><br />
|
</p><p>
|
||||||
Nowadays there are many good alternatives, but Manned.org was one of the
|
Nowadays there are many good alternatives, but Manned.org was one of the
|
||||||
sites created in order to improve that situation. This site aims to index
|
sites created in order to improve that situation. This site aims to index
|
||||||
the manual pages from a variaty of systems, both old and new, and allows you
|
the manual pages from a variaty of systems, both old and new, and allows you
|
||||||
|
|
@ -363,14 +362,14 @@ TUWF::get '/info/about' => sub {
|
||||||
system behaves. The manuals are stored in the database as UTF-8, and are
|
system behaves. The manuals are stored in the database as UTF-8, and are
|
||||||
passed through <a href="http://www.gnu.org/software/groff/">groff</a> to
|
passed through <a href="http://www.gnu.org/software/groff/">groff</a> to
|
||||||
render them in (mostly) the same way as they are displayed in your terminal.
|
render them in (mostly) the same way as they are displayed in your terminal.
|
||||||
<br /><br />
|
</p><p>
|
||||||
This website is <a href="https://code.blicky.net/yorhel/manned">open
|
This website is <a href="https://code.blicky.net/yorhel/manned">open
|
||||||
source</a> (MIT licensed) and written in a combination of Perl and Rust. The
|
source</a> (MIT licensed) and written in a combination of Perl and Rust.
|
||||||
entire PostgreSQL database is available for download (see "Database
|
The entire PostgreSQL database is available
|
||||||
download" below).
|
<a href="#database-download">for download</a>.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h2>URL format</h2>
|
<h2 id="url-format">URL format</h2>
|
||||||
<p>You can link to specific packages and man pages with several URL formats.
|
<p>You can link to specific packages and man pages with several URL formats.
|
||||||
These URLs will keep working in the future, so you should not have to worry
|
These URLs will keep working in the future, so you should not have to worry
|
||||||
about eventual dead links.</p>
|
about eventual dead links.</p>
|
||||||
|
|
@ -419,7 +418,7 @@ TUWF::get '/info/about' => sub {
|
||||||
pages; Linking to a package that doesn't have any will result in a 404
|
pages; Linking to a package that doesn't have any will result in a 404
|
||||||
page.</p>
|
page.</p>
|
||||||
|
|
||||||
<h2>The indexing process</h2>
|
<h2 id="indexing">The indexing process</h2>
|
||||||
<p>
|
<p>
|
||||||
All man pages are fetched right from the (binary) packages available on the
|
All man pages are fetched right from the (binary) packages available on the
|
||||||
public repositories of Linux distributions. In particular:<br />
|
public repositories of Linux distributions. In particular:<br />
|
||||||
|
|
@ -491,7 +490,7 @@ TUWF::get '/info/about' => sub {
|
||||||
The repositories are scanned for new packages on a daily basis.
|
The repositories are scanned for new packages on a daily basis.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h2>Database download</h2>
|
<h2 id="database-download">Database download</h2>
|
||||||
<p>
|
<p>
|
||||||
This site is backed by a PostgreSQL database containing all the man pages.
|
This site is backed by a PostgreSQL database containing all the man pages.
|
||||||
Weekly dumps of the full database are available for download at
|
Weekly dumps of the full database are available for download at
|
||||||
|
|
@ -508,7 +507,7 @@ TUWF::get '/info/about' => sub {
|
||||||
major version bumps may occur.
|
major version bumps may occur.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h2>Other systems</h2>
|
<h2 id="other-systems">Other systems</h2>
|
||||||
<p>
|
<p>
|
||||||
Suggestions for new (or old) systems to index are welcome.
|
Suggestions for new (or old) systems to index are welcome.
|
||||||
<br /><br />
|
<br /><br />
|
||||||
|
|
@ -524,7 +523,7 @@ TUWF::get '/info/about' => sub {
|
||||||
here. :-(
|
here. :-(
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h2>Future plans</h2>
|
<h2 id="future-plans">Future plans</h2>
|
||||||
<p>
|
<p>
|
||||||
This site isn't nearly as awesome yet as it could be. Here's some ideas that
|
This site isn't nearly as awesome yet as it could be. Here's some ideas that
|
||||||
would be nice to have in the future:
|
would be nice to have in the future:
|
||||||
|
|
@ -538,7 +537,7 @@ TUWF::get '/info/about' => sub {
|
||||||
</ul>
|
</ul>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h2>Copyright</h2>
|
<h2 id="copyright">Copyright</h2>
|
||||||
<p>
|
<p>
|
||||||
All manual pages are copyrighted by their respective authors. The manuals
|
All manual pages are copyrighted by their respective authors. The manuals
|
||||||
have been fetched from publically available repositories of free and
|
have been fetched from publically available repositories of free and
|
||||||
|
|
@ -549,7 +548,7 @@ TUWF::get '/info/about' => sub {
|
||||||
know and I will have it removed as soon as possible.
|
know and I will have it removed as soon as possible.
|
||||||
</p>
|
</p>
|
||||||
_
|
_
|
||||||
} }
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -576,20 +575,19 @@ TUWF::get '/browse/search' => sub {
|
||||||
my $man = search_man $q, 150;
|
my $man = search_man $q, 150;
|
||||||
return tuwf->resRedirect("/$man->[0]{name}.$man->[0]{section}", 'temp') if @$man == 1;
|
return tuwf->resRedirect("/$man->[0]{name}.$man->[0]{section}", 'temp') if @$man == 1;
|
||||||
|
|
||||||
framework_ title => 'Search results for '.$q, sub {
|
framework_ title => 'Search results for '.$q, mainclass => 'searchres', sub {
|
||||||
h1_ 'Search results for '.$q;
|
h1_ 'Search results for '.$q;
|
||||||
# Package search would also be useful.
|
# Package search would also be useful.
|
||||||
p_ 'Note: This is just a simple case-insensitive prefix match on the man names. In the future we\'ll have more powerful search functionality. Hopefully.';
|
p_ 'Note: This is just a simple case-insensitive prefix match on the man names. In the future we\'ll have more powerful search functionality. Hopefully.';
|
||||||
if(@$man) {
|
if(@$man) {
|
||||||
ul_ id => 'searchres', sub {
|
ul_ sub {
|
||||||
li_ sub {
|
li_ sub {
|
||||||
a_ href => "/$_->{name}.$_->{section}", $_->{name};
|
a_ href => "/$_->{name}.$_->{section}", $_->{name};
|
||||||
i_ " $_->{section}";
|
small_ " $_->{section}";
|
||||||
} for @$man;
|
} for @$man;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
br_; br_;
|
p_ 'No results :-(';
|
||||||
b_ 'No results :-(';
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
@ -785,31 +783,32 @@ TUWF::get qr{/pkg/([^/]+)} => sub {
|
||||||
$f->{c} ne 'all' ? ('AND LOWER(SUBSTR(name, 1, 1)) =', \$f->{c}) : ();
|
$f->{c} ne 'all' ? ('AND LOWER(SUBSTR(name, 1, 1)) =', \$f->{c}) : ();
|
||||||
my $count = tuwf->dbVali('SELECT count(*) FROM', $packages_with_man, 'p WHERE', $where);
|
my $count = tuwf->dbVali('SELECT count(*) FROM', $packages_with_man, 'p WHERE', $where);
|
||||||
my $pkg = tuwf->dbPagei({ results => 200, page => $f->{p} },
|
my $pkg = tuwf->dbPagei({ results => 200, page => $f->{p} },
|
||||||
'SELECT id, system, name, category FROM', $packages_with_man, 'p WHERE', $where, 'ORDER BY name'
|
'SELECT id, system, name, category FROM', $packages_with_man, 'p WHERE', $where, 'ORDER BY name, category'
|
||||||
);
|
);
|
||||||
|
|
||||||
my $title = "Packages for $sys->{name}".($sys->{release}?" $sys->{release}":"");
|
my $title = $sys->{name}.($sys->{release}?" $sys->{release}":"");
|
||||||
framework_ title => $title, sub {
|
framework_ title => $title, mainclass => 'pkglist', sub {
|
||||||
div_ id => 'pkglist', sub {
|
div_ sub {
|
||||||
h1_ $title;
|
div_ sub {
|
||||||
|
h1_ $title;
|
||||||
p_ class => 'charselect', sub {
|
};
|
||||||
|
nav_ class => 'charselect', sub {
|
||||||
for('all', 0, 'a'..'z') {
|
for('all', 0, 'a'..'z') {
|
||||||
a_ href => "/pkg/$short?c=$_", $_?uc$_:'#' if $_ ne $f->{c};
|
a_ href => "/pkg/$short?c=$_", $_?uc$_:'#' if $_ ne $f->{c};
|
||||||
b_ $_?uc$_:'#' if $_ eq $f->{c};
|
b_ $_?uc$_:'#' if $_ eq $f->{c};
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
};
|
||||||
|
small_ '(Packages without man pages are not listed)';
|
||||||
|
|
||||||
p_ 'Note: Packages without man pages are not listed.';
|
paginate_ "/pkg/$short?c=$f->{c};p=", $count, 200, $f->{p};
|
||||||
paginate_ "/pkg/$short?c=$f->{c};p=", $count, 200, $f->{p};
|
ul_ sub {
|
||||||
ul_ id => 'packages', sub {
|
li_ sub {
|
||||||
li_ sub {
|
a_ href => "/pkg/$short/$_->{category}/$_->{name}", $_->{name};
|
||||||
a_ href => "/pkg/$short/$_->{category}/$_->{name}", $_->{name};
|
small_ ' '.$_->{category};
|
||||||
i_ ' '.$_->{category};
|
} for @$pkg;
|
||||||
} for @$pkg;
|
};
|
||||||
};
|
paginate_ "/pkg/$short?c=$f->{c};p=", $count, 200, $f->{p};
|
||||||
paginate_ "/pkg/$short?c=$f->{c};p=", $count, 200, $f->{p};
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -846,33 +845,39 @@ TUWF::get qr{/pkg/([^/]+)/(.+)} => sub {
|
||||||
# Latest version of this package determines last modification date of the page.
|
# Latest version of this package determines last modification date of the page.
|
||||||
tuwf->resLastMod($vers->[0]{released});
|
tuwf->resLastMod($vers->[0]{released});
|
||||||
|
|
||||||
my $title = "$sys->{name}".($sys->{release}?" $sys->{release}":"")." / $pkg->{category} / $pkg->{name}";
|
my $sysname = $sys->{name}.($sys->{release}?" $sys->{release}":"");
|
||||||
framework_ title => "$title $sel->{version}", sub {
|
my $subtitle = " / $pkg->{category} / $pkg->{name}";
|
||||||
h1_ $title;
|
framework_ title => "$sysname$subtitle $sel->{version}", mainclass => 'pkgpage', sub {
|
||||||
|
h1_ sub {
|
||||||
div_ id => 'pkgversions', sub {
|
a_ href => "/pkg/$sys->{short}", $sysname;
|
||||||
h2_ 'Versions';
|
txt_ $subtitle;
|
||||||
ul_ sub {
|
|
||||||
li_ sub {
|
|
||||||
a_ href => "/pkg/$sys->{short}/$pkg->{category}/$pkg->{name}/$_->{version}", $_->{version} if $_ != $sel;
|
|
||||||
b_ " $_->{version}" if $_ == $sel;
|
|
||||||
i_ " $_->{released}";
|
|
||||||
} for(@$vers);
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
div_ id => 'pkgmans', sub {
|
div_ sub {
|
||||||
h2_ "Manuals for version $sel->{version}";
|
section_ sub {
|
||||||
paginate_ "/pkg/$sys->{short}/$pkg->{category}/$pkg->{name}/$sel->{version}?p=", $count, 200, $p;
|
h2_ 'Versions';
|
||||||
ul_ sub {
|
ul_ sub {
|
||||||
li_ sub {
|
li_ sub {
|
||||||
a_ href => "/$_->{name}/".substr($_->{hash},0,8), "$_->{name}($_->{section})";
|
a_ href => "/pkg/$sys->{short}/$pkg->{category}/$pkg->{name}/$_->{version}", $_->{version} if $_ != $sel;
|
||||||
b_ " $_->{locale}" if $_->{locale};
|
b_ " $_->{version}" if $_ == $sel;
|
||||||
i_ " $_->{filename}";
|
small_ " $_->{released}";
|
||||||
} for(@$mans);
|
} for(@$vers);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
paginate_ "/pkg/$sys->{short}/$pkg->{category}/$pkg->{name}/$sel->{version}?p=", $count, 200, $p;
|
|
||||||
}
|
section_ sub {
|
||||||
|
h2_ "Manuals for version $sel->{version}";
|
||||||
|
paginate_ "/pkg/$sys->{short}/$pkg->{category}/$pkg->{name}/$sel->{version}?p=", $count, 200, $p;
|
||||||
|
ul_ sub {
|
||||||
|
li_ sub {
|
||||||
|
a_ href => "/$_->{name}/".substr($_->{hash},0,8), "$_->{name}($_->{section})";
|
||||||
|
b_ " $_->{locale}" if $_->{locale};
|
||||||
|
small_ " $_->{filename}";
|
||||||
|
} for(@$mans);
|
||||||
|
};
|
||||||
|
paginate_ "/pkg/$sys->{short}/$pkg->{category}/$pkg->{name}/$sel->{version}?p=", $count, 200, $p;
|
||||||
|
};
|
||||||
|
};
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
118
www/man.css
118
www/man.css
|
|
@ -1,85 +1,54 @@
|
||||||
/* TODO: column-width is better done in Perl? (More like a column-count, then) */
|
* { margin: 0; padding: 0; font-size: inherit; font-family: "Trebuchet MS", sans-serif; }
|
||||||
|
html { background: #fff; padding: 0 10px; color: #000 }
|
||||||
* { margin: 0; padding: 0; font-family: "Trebuchet MS", sans-serif; }
|
body { margin: 10px auto 50px auto; max-width: 1100px; border-collapse: separate; padding-bottom: 10px }
|
||||||
html { background: #333; padding: 0 10px; }
|
h1 { font-size: 24px; font-weight: normal }
|
||||||
body { margin: 10px auto 50px auto; max-width: 1100px; border-collapse: separate; padding-bottom: 10px; border-radius: 10px; box-shadow: 0 10px 10px #def; }
|
h2 { font-size: 21px; margin-top: 35px; margin-bottom: 7px; font-weight: normal; border-bottom: 1px solid #ccc }
|
||||||
h1 { font-size: 24px; font-weight: normal; color: #abc; }
|
h3 { font-size: 18px; margin-top: 20px; margin-bottom: 5px; font-weight: normal }
|
||||||
h2 { font-size: 21px; margin-top: 40px; color: #468; font-weight: normal; clear: left }
|
a { color: #048; text-decoration: none }
|
||||||
h2 + i { font-size: 12px; }
|
|
||||||
h3 { font-size: 16px; margin-top: 20px; color: #468; font-weight: normal }
|
|
||||||
a { color: #048; }
|
|
||||||
a:hover { text-decoration: underline; color: #48B;}
|
a:hover { text-decoration: underline; color: #48B;}
|
||||||
code { font-family: "Lucida Console", Monospace; font-size: 12px; background-color: #f0f8ff }
|
p { margin-bottom: 15px }
|
||||||
|
dl { margin-bottom: 15px }
|
||||||
|
dt { margin: 0 0 5px 0 }
|
||||||
|
dd { margin: 0 0 10px 10px; }
|
||||||
|
ul { margin: 0 0 15px 20px }
|
||||||
|
input { font-size: 0.9em; padding: 1px 2px }
|
||||||
|
code { font-family: "Lucida Console", Monospace; font-size: 12px; background-color: #f0f8ff; padding: 1px }
|
||||||
|
small { color: #aaa }
|
||||||
.hidden { display: none!important; }
|
.hidden { display: none!important; }
|
||||||
|
|
||||||
#header { padding: 4px 20px; border-bottom: 1px solid #888; font: 24px "Arial"; background: url('images/gradients.png') repeat-x; border-radius: 8px 8px 0 0; }
|
header { border-bottom: 3px dotted #ccc; display: flex; justify-content: space-between; align-items: end; flex-wrap: wrap }
|
||||||
#header a { color: #f8f8f8; text-decoration: none; font-weight: bold; }
|
header a { font: 24px "Arial", serif; font-weight: bold }
|
||||||
#header a:hover { background: none; }
|
header form { padding-bottom: 3px }
|
||||||
#header form { float: right; }
|
header input[type=text] { width: 100px }
|
||||||
#header input[type=text] { color: #000; width: 260px; padding: 1px 2px 1px 15px; border-radius: 12px 0 0 12px; border: 1px solid #444;
|
|
||||||
box-shadow: 1px 1px 3px #fff, -1px -1px 2px #234; background: url('images/gradients.png') 0 -105px repeat-x; height: 15px; }
|
|
||||||
#header input[type=text]:hover, #header input[type=text]:focus { background: url('images/gradients.png') 0 -122px repeat-x; outline: none; }
|
|
||||||
#header input[type=submit] { height: 23px; width: 62px; background-image: url('images/search.png'); border: 0; margin: 0 0 0 -5px; cursor: pointer }
|
|
||||||
|
|
||||||
#body { padding: 10px 10px 20px 10px; background: #fff }
|
footer { border-top: 3px dotted #ccc; color: #666; font-size: 12px; display: flex; justify-content: space-between; flex-wrap: wrap }
|
||||||
|
|
||||||
#systems a,
|
main { padding: 10px 0 25px 0 }
|
||||||
.charselect a,
|
main.thin { max-width: 700px; margin: 0 auto }
|
||||||
.paginate a { color: #048; font-family: "Verdana"; font-weight: normal; text-decoration: none; padding: 3px 5px; border-radius: 4px; }
|
|
||||||
|
|
||||||
.charselect b,
|
.systems > div { margin: 25px 0; display: flex; align-items: start }
|
||||||
.paginate b { font-family: "Verdana"; padding: 3px }
|
.systems > div > a { display: flex; align-items: center }
|
||||||
|
.systems img { width: 50px; height: 50px; margin-right: 10px }
|
||||||
|
.systems b { font-size: 24px; display: block }
|
||||||
|
.systems > div > div > a { padding-right: 10px }
|
||||||
|
|
||||||
#systems a:hover,
|
.searchres ul { margin: 20px 0; list-style-type: none; column-width: 300px }
|
||||||
.charselect a:hover,
|
.searchres a { padding-right: 2px }
|
||||||
.paginate a:hover { background: #cde; }
|
|
||||||
|
|
||||||
p.txt { margin: 5px 0 0 10px; max-width: 700px }
|
.charselect a, .paginate a { display: inline-block; padding: 3px 5px }
|
||||||
#external { list-style-type: none; margin-left: 10px }
|
.charselect b, .paginate b { display: inline-block; padding: 3px 5px }
|
||||||
|
|
||||||
i.grayedout { color: #aaa; font-size: 13px; }
|
.pkglist > div { display: flex; align-items: start; justify-content: space-between; flex-wrap: wrap }
|
||||||
|
.pkglist .paginate { margin: 10px 0; text-align: center }
|
||||||
|
.pkglist ul { margin: 20px 0; list-style-type: none; column-width: 300px }
|
||||||
|
.pkglist ul a { padding-right: 2px }
|
||||||
|
|
||||||
#about { max-width: 700px }
|
.pkgpage > div { display: flex; flex-wrap: wrap; margin-top: 15px }
|
||||||
#about h2 { margin-bottom: 5px }
|
.pkgpage h2 { border-bottom: 0; margin: 0 0 10px 0 }
|
||||||
#about dl { margin-bottom: 5px }
|
.pkgpage ul { margin: 0; list-style-type: none }
|
||||||
#about dt { margin: 5px 0 0 10px }
|
.pkgpage section:first-child { border-right: 1px dashed #468; padding: 0 10px }
|
||||||
#about p { margin: 0 0 0 10px; }
|
.pkgpage section:last-child { padding: 0 10px }
|
||||||
#about dd { margin: 0 0 0 20px; }
|
|
||||||
#about ul { padding: 5px 0 5px 30px }
|
|
||||||
|
|
||||||
#systems li { display: block; float: left; width: 300px; min-height: 80px; margin: 15px 10px; padding-left: 60px }
|
|
||||||
#systems span { display: block; margin-left: -55px; float: left; width: 50px; height: 50px; background-repeat: no-repeat; }
|
|
||||||
#systems a span { margin-top: 10px }
|
|
||||||
#systems b { font-size: 24px; display: block }
|
|
||||||
|
|
||||||
#pkglist .charselect { float: right }
|
|
||||||
#pkglist .paginate { display: block; margin: 10px; width: 100%; text-align: center }
|
|
||||||
|
|
||||||
#packages { margin: 20px 0; -webkit-column-width: 300px; -moz-column-width: 300px; column-width: 300px }
|
|
||||||
#packages li { display: block; }
|
|
||||||
#packages i { color: #aaa; font-size: 13px; }
|
|
||||||
#packages a { padding-right: 2px }
|
|
||||||
|
|
||||||
#searchres { margin: 20px 0; -webkit-column-width: 300px; -moz-column-width: 300px; column-width: 300px }
|
|
||||||
#searchres li { display: block; }
|
|
||||||
#searchres i { color: #aaa; font-size: 13px; }
|
|
||||||
#searchres a { padding-right: 2px }
|
|
||||||
|
|
||||||
#pkgversions { margin-top: 10px }
|
|
||||||
#pkgversions h2 { margin: 0 }
|
|
||||||
#pkgversions { float: left; padding: 0 10px; }
|
|
||||||
#pkgversions ul { margin: 10px 0; padding-right: 10px; border-right: 1px dashed #468 }
|
|
||||||
#pkgversions li { display: block; }
|
|
||||||
#pkgversions i { color: #aaa; font-size: 13px; }
|
|
||||||
#pkgversions a { padding-right: 2px }
|
|
||||||
|
|
||||||
#pkgmans { margin-top: 10px }
|
|
||||||
#pkgmans h2 { margin: 0 }
|
|
||||||
#pkgmans { float: left }
|
|
||||||
#pkgmans .paginate { margin: 10px 0 }
|
|
||||||
#pkgmans ul { margin: 10px 0 }
|
|
||||||
#pkgmans li { display: block }
|
|
||||||
#pkgmans i { color: #aaa; font-size: 13px; }
|
|
||||||
|
|
||||||
#manbuttons h1 { display: inline; margin: 0 20px 0 0; vertical-align: middle }
|
#manbuttons h1 { display: inline; margin: 0 20px 0 0; vertical-align: middle }
|
||||||
#manbuttons ul { list-style-type: none; display: inline-block }
|
#manbuttons ul { list-style-type: none; display: inline-block }
|
||||||
|
|
@ -92,7 +61,7 @@ i.grayedout { color: #aaa; font-size: 13px; }
|
||||||
|
|
||||||
#manres { margin: 0 0 10px 0; width: 70%; padding: 10px; box-sizing: border-box; background: #f0f8ff; border-radius: 10px; border-left: 1px dashed #333; border-right: 1px dashed #333 }
|
#manres { margin: 0 0 10px 0; width: 70%; padding: 10px; box-sizing: border-box; background: #f0f8ff; border-radius: 10px; border-left: 1px dashed #333; border-right: 1px dashed #333 }
|
||||||
#manres i { color: #aaa; font-size: 13px; margin-left: 7px }
|
#manres i { color: #aaa; font-size: 13px; margin-left: 7px }
|
||||||
#manres ul { list-style-type: none }
|
#manres ul { list-style-type: none; margin-bottom: 0 }
|
||||||
#manres ul a { outline: none; text-decoration: none }
|
#manres ul a { outline: none; text-decoration: none }
|
||||||
#manres ul .oldver a { color: #aaa; font-size: 13px }
|
#manres ul .oldver a { color: #aaa; font-size: 13px }
|
||||||
#manres div > ul { margin-top: 5px } /* System names */
|
#manres div > ul { margin-top: 5px } /* System names */
|
||||||
|
|
@ -117,11 +86,6 @@ i.grayedout { color: #aaa; font-size: 13px; }
|
||||||
|
|
||||||
#contents { margin: 10px 0 0 0 }
|
#contents { margin: 10px 0 0 0 }
|
||||||
|
|
||||||
#footer { height: 60px; clear: both; padding: 4px 10px; color: #f8f8f8; margin: 0 0 -20px 0;
|
|
||||||
border-top: 1px solid #888; font-size: 13px; background: url('images/gradients.png') 0 -37px repeat-x; border-radius: 0 0 8px 8px; }
|
|
||||||
#footer a { font-size: 13px; padding: 0; color: #f8f8f8; }
|
|
||||||
#footer a:hover { background: none; }
|
|
||||||
|
|
||||||
pre, pre * { font-family: "Lucida Console", Monospace; font-size: 15px }
|
pre, pre * { font-family: "Lucida Console", Monospace; font-size: 15px }
|
||||||
pre b, pre em, pre a { color: #369; font-weight: normal; text-decoration: none }
|
pre b, pre em, pre a { color: #369; font-weight: normal; text-decoration: none }
|
||||||
pre em { font-style: italic }
|
pre em { font-style: italic }
|
||||||
|
|
|
||||||
21
www/man.js
21
www/man.js
|
|
@ -459,24 +459,3 @@ function dsResults(hr, obj) {
|
||||||
'locations')));
|
'locations')));
|
||||||
})();
|
})();
|
||||||
})();
|
})();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// The "more..." links on the homepage.
|
|
||||||
(function(){
|
|
||||||
var sys = byId('systems');
|
|
||||||
if(!sys)
|
|
||||||
return;
|
|
||||||
var f = function() {
|
|
||||||
var l = byName(this.parentNode, 'a');
|
|
||||||
var show = hasClass(l[3], 'hidden');
|
|
||||||
for(var i=3; i<l.length-1; i++)
|
|
||||||
setClass(l[i], 'hidden', !show);
|
|
||||||
setText(this, show ? '...less' : 'more...');
|
|
||||||
return false
|
|
||||||
};
|
|
||||||
var l = byClass(sys, 'a', 'more');
|
|
||||||
for(var i=0; i<l.length; i++)
|
|
||||||
l[i].onclick = f;
|
|
||||||
})();
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue