diff options
| author | Darkelarious <darkelarious@333networks.com> | 2021-09-05 20:49:38 +0200 |
|---|---|---|
| committer | Darkelarious <darkelarious@333networks.com> | 2021-09-05 20:49:38 +0200 |
| commit | 153b89b5bc58eb239289698c3f483509911db20d (patch) | |
| tree | 2d902f2e1bfb61b4af0c1b508dbb59f95bdc7de2 | |
| parent | 3470e2605595bf52b3ba07bf0b3886e5a61d3e06 (diff) | |
| download | WebInterface-Perl-153b89b5bc58eb239289698c3f483509911db20d.tar.gz WebInterface-Perl-153b89b5bc58eb239289698c3f483509911db20d.zip | |
functional masterinterface with styles
49 files changed, 4528 insertions, 761 deletions
@@ -1,5 +1,12 @@ Changelog: +05-09-2021: functional masterinterface with styles +* remove json api documentation (now at 333networks.com/json) +* refine the information fields in server info +* add style generation code to utilities +* 333networks style as default style +* update readme with style generation instructions + 23-05-2021: first version of masterinterface * initial working version of webinterface compatible with MasterServer-Qt5 * descriptive readme with user instructions @@ -1,4 +1,4 @@ -## Web Interface for MasterServer-Qt5 +# Web Interface for MasterServer-Qt5 Web interface in Perl for MasterServer-Qt5. ## DESCRIPTION @@ -15,7 +15,8 @@ This repository contains software for a web interface to display information obt * The following CPAN modules: * DBI * DBD::SQLite - * TUWF (http://dev.yorhel.nl/tuwf) + * TUWF + * Image::Size (optional for style generation) ## INSTALL This repository consists of Perl modules and is run by a http deamon. First, the MasterServer-Qt5 repository should be installed and configured in order to run this web interface. This web interface requires access to the database generated and updated by MasterServer-Qt5. @@ -32,13 +33,13 @@ The 333networks masterserver interface comes with options. These options are fou Configure the path to the database that the masterserver uses. The location of this database is found in the documentation of `MasterServer-Qt5`. ``` # database connection - db_login => ["dbi:SQLite:dbname=/server/masterserver/qt5/data/masterserver.db",'',''], + db_login => ["dbi:SQLite:dbname=/path/to/your/data/masterserver.db",'',''], ``` When more than one website style exists, it can be selected in the following option. If no additional style files are (manually) installed, do not alter this option. ``` # display - style => "classic2", + style => "333networks", ``` By default, only servers that have updated in the last half hour are shown. To show servers for a shorter or longer period of time after the last update increase or decrease the value of the option `window_time`. This value is provided in seconds (3600 seconds is 1 hour). @@ -47,13 +48,37 @@ By default, only servers that have updated in the last half hour are shown. To s window_time => 1800, ``` -## Apache settings +## Style generation +It is possible to generate a website with your preferred colours, background textures and personal logo. To build a new style, create a folder and conf file at `s/style/SKINNAME/conf`. Fill in the following parameters: ``` -LoadModule rewrite_module modules/mod_rewrite.so -AddHandler cgi-script .cgi .pl +// name example description +//------------------------------------------------------------------------------ +name stylename description of the style/name of the style +author Darkelarious style author (commented in style.css for credits) + +// backgrounds +bodybg #222 body.gif body background (texture) +boxbg1 #333 box background (texture) +boxbg2 #111 menu backgrounds, buttons, thumbnail/image boxes (texture) +boxbg3 #222 odd row accents (texture) +shadow #222 shadow color (color) + +// text +textcol1 #ccc main text color +textcol2 #0af primary color for borders, links (color) +textcol3 #ff0 secondary color for link:hover, actions (color) +textcol4 #666 accent color for complementing main text color (color) + +// logos +bglogo 333networks.png logo in background (recommended 75 px high max) ``` -Update the vhost configuration for the Web Interface to match your repository folder path: +Some parameters can be colors, textures or both. Fields with the (texture) indication can be both images and colors, such as `#0af`, `#0af box.png`, `box.png`, but (color) implies color ONLY. + +To compile a skin, run the command `./skingen.pl SKINNAME` from the `util` directory, where skinname is the lowercase folder name of your skin. The generated stylesheet can now be used in your webinterface config file under the `style => skinname` option. + +## Apache settings +Update the vhost configuration for the Web Interface to match your repository folder path. You may be required to enable modules such as `mod_rewrite` and `fcgi`. ``` # diff --git a/data/style.css b/data/style.css new file mode 100755 index 0000000..5c674a1 --- /dev/null +++ b/data/style.css @@ -0,0 +1,558 @@ +/* * * * * * * * * * * * * * * * * * *\ +* Master Server Web Interface * +* A website by Darkelarious * +* See COPYING for additional details * +* on re-use. * +\* * * * * * * * * * * * * * * * * * */ + +/* Theme written by Darkelarious */ + +/*** Global ***/ +* { + margin: 0; + padding: 0; + border: 0; + outline:0; + } + +body { + text-align: center; + height: 100%; + color: $textcol1$; + font-family: 'Verdana'; + font-size: 10pt; + $_bodybg$ + } + +p { + margin-bottom:12pt; + } + +a, a:visited { + text-decoration: none; + color: $textcol2$; + } + +a:hover { + color: $textcol3$; + text-decoration: none; + } + +#body { + text-align: left; + width: 900px; + margin: 0 auto; + min-height: 100%; + $_bglogo$ + $_bgpadd$ + background-size: 500px; + } + +#footer { + padding: 90px 0 40px 0; + text-align:center; + font-size : x-small; + clear:both + } + +#footer a { + text-decoration: underline; + } + + +/* mainboxes */ +div.mainbox { + border: 1px solid $textcol2$; + margin-bottom:21px; + padding: 5px; + box-shadow: 2px 2px 5px $shadow$; + $_boxbg1$ + } + +div.mainbox h1, +div.mainbox h2, +div.mainbox h3 { + margin: -5px 0 10px 0; + text-decoration: none; + font-family: Tahoma; + font-weight: normal; + font-size: 16pt; + color: $textcol2$; + } + +div.mainbox h2 { + margin: 5px 0 5px 5px; + font-size: 12pt; + } +div.mainbox h3 { + margin: 5px 0 5px 10px; + font-size: 11pt; +} + +div.mainbox p, +div.mainbox ul, +div.mainbox ol { + margin: 5px 16px 0 8px; + padding: 0 5px 5px 25px; + text-align:left; + font-size: 9pt; + } +div.mainbox ul, +div.mainbox ol { + margin-left:20px; + } + + +div.mainbox div.header { + margin: -5px 2px 10px -5px; + padding:10px 0 0 10px; + display:block; + width:100%; + color: $textcol1$; + border-bottom:1px solid $textcol2$; + $_boxbg2$ + } + +/* navigation / search box "fieldset.search" */ + +form input { + border: 1px solid $textcol2$; + $_boxbg3$ + color: $textcol1$; +} + +form fieldset.search, +form fieldset#advancedsearch { + display: block; + margin:12px 0 12px 0; + width: 100%; + text-align:center; + height:22px; + } + +form fieldset.search input.text, +form fieldset#advancedsearch input.text { + width: 300px; + margin-left:20px; + padding:1px 1px 1px 5px; + font-style: italic; + } + +form fieldset.search input.submit { + display:none; + } + +form fieldset.search a { + padding: 1px 5px; + border: 1px solid $textcol2$; + margin: 0 6px; + } +form fieldset.search a.sel, +form fieldset.search a:hover { + border: 1px solid $textcol3$; + color: $textcol3$; + } + +form div.dropdown a { + display:block; + width:100%; + text-align:center; + font-size: x-small; +} + +form fieldset#advancedsearch { + display:none; +} +form fieldset#advancedsearch input.submit { + padding: 1px; + margin: auto 5px; +} + +/* TODO: advanced search function styling */ + + + +/* browse table tabs */ +ul.maintabs { + display: inline; + margin: 0; + } + +ul.maintabs.notfirst { + display: block; + height: 20px + } + +ul.maintabs li { + display: inline; + list-style-type: none + } + +ul.maintabs li a, +ul.maintabs li b { + float: right; + display: block; + height: 14px; + padding: 1px 7px 5px 7px; + margin: 0 0 0 10px; + } + +ul.maintabs li a { + margin-left: 5px; + border: 1px solid $textcol2$; + border-bottom: none; + $_boxbg3$ + } + +ul.maintabs.notfirst li a, +ul.maintabs.notfirst li b { + margin-top: 20px + } + +ul.maintabs.bottom li a, +ul.maintabs.bottom li b { + margin-top: 10px; + padding: 1px 7px 5px 7px + } + +ul.maintabs.bottom li a { + border-bottom: 1px solid $textcol2$; + border-top: none + } + +ul.maintabs li.left a, +ul.maintabs li.left b { + float: left; + margin-left: 0; + margin-right: 10px + } + +ul.maintabs li b { + margin-left: -2px; + margin-right: -7px + } + +ul.maintabs li.left b { + margin-left: -7px; + margin-right: -2px + } + +ul.maintabs li.tabselected a, +ul.maintabs li a:hover { + padding-bottom: 6px + } + +ul.maintabs.bottom li.tabselected a, +ul.maintabs.bottom li a:hover { + padding-top: 2px; + padding-bottom: 5px; + margin-top: 9px + } + +ul.maintabs.browsetabs li a { + margin-left: 5px; + $_boxbg1$; + } + +ul.maintabs.browsetabs li.left a { + margin-left: 0; + margin-right: 5px + } + + +/* game/server browse tables */ +div.mainbox.browse { + padding: 0; + } + +div.mainbox.browse table { + width: 100%; + table-layout:fixed; + border-collapse:collapse + } + +div.mainbox.browse table thead td { + font-weight: bold; + } + +div.mainbox.browse table thead tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:0; + border-bottom:1px solid $textcol2$; + color: $textcol2$; + padding:3px 10px 3px 5px; + font-weight:bold; + $_boxbg1$ + } + +div.mainbox.browse table tfoot tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:1px solid $textcol2$; + color: $textcol1$; + padding:3px 10px 3px 5px; + } + +div.mainbox.browse table tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + padding:1px 10px 1px 5px; + font-size:10pt; + } + +div.mainbox.browse table tr.s td a { + color: $textcol1$; + } + +div.mainbox.browse table tr.s td a:hover { + color: $textcol3$; + } + +div.mainbox.browse table tr.odd { + $_boxbg3$ + } + +/* specific game list table columns */ +div.mainbox.browse.gamelist table tr td.tc1 { + text-align:left; + padding-left:20px + } + +div.mainbox.browse.gamelist table tr td.tc2 { + width:100px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } + +div.mainbox.browse.gamelist table tr td.tc3 { + width:200px; + } + +/* specific serverlist table columns */ +div.mainbox.browse.serverlist table tr td.tc1 { + width:10px; + background-size: 20px 15px; + background-position: 50%; + background-repeat: no-repeat; + } + +div.mainbox.browse.serverlist table tr td.tc2 { + text-align:left; + } + +div.mainbox.browse.serverlist table tr td.tc3 { + width:46px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } +div.mainbox.browse.serverlist table tr td.tc3.icon a { + display:block; + margin:0 auto; + height:16px; + width:16px; +} + +div.mainbox.browse.serverlist table tr td.tc4 { + width:90px;text-align:left + } + +div.mainbox.browse.serverlist table tr td.tc5 { + width:70px; + text-align:center + } + +div.mainbox.browse.serverlist table tr td.tc6 { + width:140px; + text-align:left + } + + +/* serverinfo details */ +div.mainbox.detail { + padding:0 0 12px 0; + } +div.mainbox.detail div.header { + margin:0 0 12pt 0; + padding: 0; + display:inline-block; + width:100%; + height:48px; + } + +div.mainbox.detail div.header h1 { + font-weight:normal; + padding: 15px 15px 0 15px; + white-space: nowrap; + overflow:hidden; + display:block; + } + +div.mainbox.detail div.header div.serverflags { + float:right; + overflow:hidden; +} +div.mainbox.detail div.header div.serverflags div { + width:48px; + height:48px; + display:inline-block; + border-left:1px solid $textcol2$; + $_boxbg3$ +} + +/* server flag icons */ +div.mainbox.detail div.header div.serverflags div.direct {background: #131} +div.mainbox.detail div.header div.serverflags div.manual {background: #311} +div.mainbox.detail div.header div.serverflags div.authed {background: #131} +div.mainbox.detail div.header div.serverflags div.noauthed {background: #311} +div.mainbox.detail div.header div.serverflags div.noblacklist {background: #131} +div.mainbox.detail div.header div.serverflags div.blacklist {background: #311} +div.mainbox.detail div.header div.serverflags div.nopasswd {background: #131} +div.mainbox.detail div.header div.serverflags div.passwd {background: #311} + + +div.mainbox.detail table { + margin-bottom: 20px; + table-layout:fixed; + border-collapse:collapse; + text-align:left; + } +div.mainbox.detail table tr th { + font-weight:bold; + padding: 2px 8px; + margin-bottom:12pt; + border-bottom: 1px solid $textcol4$; + color: $textcol1$; + } +div.mainbox.detail table tr th.wc1 { + width:170px + } +div.mainbox.detail table tr td { + vertical-align:top; + padding:6px 5px 4px 15px; + } +div.mainbox.detail table tr td img.flag { + margin:-4px 2px -4px 0; + height:20px; + width:30px; + } +div.mainbox.detail table tr td input, +div.mainbox.detail table tr td textarea { + color: #ccc; + width:99%; + padding: 3px 1px 2px 5px; + border: 1px solid #0af; + font-family:"Lucida Console"; + font-size: 8pt; + $_boxbg3$ + } +div.mainbox.detail table.serverinfo, +div.mainbox.detail table.gameinfo { + width:63%; + } +div.mainbox.detail table { + width:96%; + } +div.mainbox.detail div.container { + float:right; + margin: 0 30px 8px 0; + } +div.mainbox.detail div.container div.thumbnail { + border:1px solid $textcol4$; + display:block; + box-shadow: 1px 1px 2px $shadow$; + $_boxbg3$ + } +div.mainbox.detail div.container div.thumbnail img { + height:256px; + width:256px; + border:1px solid $textcol1$; + display:block; + margin:10px 10px 2px 10px + } +div.mainbox.detail div.container div.thumbnail span { + text-align: right; + font-weight: normal; + padding:0 15px 4px 5px; + display:block; + font-size:x-small + } +div.mainbox.detail div.container div.updatenote { + padding: 2px 0 7px 0; + display:block; + font-style: italic; + font-size: x-small; + text-align: right; +} + +div.mainbox.detail div.container table.mapinfo { + width: 280px; + margin-bottom:0; + } +div.mainbox.detail div.container table.mapinfo tr td.wc1{ + width: 80px; + } +div.mainbox.detail table.players {text-align:left;} +div.mainbox.detail table.players tr.odd { + $_boxbg3$ + } +div.mainbox.detail table.players tr td { + padding:1px 5px 0px 15px; + overflow:hidden; + white-space: nowrap; + } +div.mainbox.detail table.players tr th.frags {width:50px} +div.mainbox.detail table.players tr th.mesh {width:140px} +div.mainbox.detail table.players tr th.skin {width:140px} +div.mainbox.detail table.players tr th.ping {width:50px} + +div.mainbox.detail table.shareopts tr th a { + color: $textcol1$; +} +div.mainbox.detail table.shareopts tr td { + border-right:1px solid $textcol4$; + border-bottom:1px solid $textcol4$; + font-family:"Lucida Console"; + font-size: 8pt; + text-align:left; + $_boxbg3$ +} + +/* warning box */ +div.mainbox.warning { + color:#ccc; + background-color: #411; + border: 1px solid #c00; +} +div.mainbox.warning div.header { + border-bottom:1px solid #c00; + background: #200; + color: #ccc; +} + +div.mainbox.warning div.header h1{ + color: #ccc; +} + +div.mainbox div.description { + display: block; + width: 500px; + margin: 10px auto + } + +span.hilit { + font-style: italic; + padding: 1px; + $_boxbg2$ +} + +.r {color:#f55} +.o {color:#c80} +.y {color:#ff3} +.g {color:#3f3} +.b {color:#33f} diff --git a/lib/MasterWebInterface/Database/Servers.pm b/lib/MasterWebInterface/Database/Servers.pm index d02bcd7..a305ce8 100755 --- a/lib/MasterWebInterface/Database/Servers.pm +++ b/lib/MasterWebInterface/Database/Servers.pm @@ -22,7 +22,7 @@ sub dbServerListGet { $o{search} ? ('LOWER(hostname) LIKE LOWER(?)' => "%$o{search}%") : (), $o{gametype} ? ('LOWER(gametype) LIKE LOWER(?)' => $o{gametype}) : (), $o{updated} ? ('dt_updated > ?' => (time-$o{updated})) : (), - ('hostport >= ?' => 0), # sanity check + ('hostport > ?' => 0), # sanity check (unresponsive servers or faulty queries tools) ); my @select = ( qw| id ip hostport hostname serverlist.gamename country numplayers maxplayers maptitle mapname gametype dt_added label dt_updated| ); diff --git a/lib/MasterWebInterface/Handler/ErrorPages.pm b/lib/MasterWebInterface/Handler/ErrorPages.pm index dc386fc..7a74355 100755 --- a/lib/MasterWebInterface/Handler/ErrorPages.pm +++ b/lib/MasterWebInterface/Handler/ErrorPages.pm @@ -57,14 +57,12 @@ sub handle500 br; txt 'and will be fixed shortly. Please try again later.'; end; - end; - if ($self->debug) - { - div class => "code warning"; - txt $error; - end; - } + if ($self->debug) + { + p $error; + } + end; end; $self->htmlFooter; } diff --git a/lib/MasterWebInterface/Handler/Games.pm b/lib/MasterWebInterface/Handler/Games.pm index bf50655..50e1d57 100755 --- a/lib/MasterWebInterface/Handler/Games.pm +++ b/lib/MasterWebInterface/Handler/Games.pm @@ -98,7 +98,7 @@ sub gamelist }) : (), header => [ ['Release Title', 'label' ], - ['Game', ''], + ['Game', 'gamename'], ['Servers', 'num_total' ], ], row => sub diff --git a/lib/MasterWebInterface/Handler/Json/ApiDoc.pm b/lib/MasterWebInterface/Handler/Json/ApiDoc.pm deleted file mode 100755 index bbfe620..0000000 --- a/lib/MasterWebInterface/Handler/Json/ApiDoc.pm +++ /dev/null @@ -1,437 +0,0 @@ -package MasterWebInterface::Handler::Json::ApiDoc; -use strict; -use TUWF ':html'; -use Exporter 'import'; -use JSON; - -TUWF::register( - qr{json} => \&json_docs, -); - -################################################################################ -# Json Documentation -# Documentation about the Json API -################################################################################ -sub json_docs -{ - my $self = shift; - $self->htmlHeader(title => "Json API"); - $self->htmlSearchBox(title => "Servers", action => "/s", sel => 'j', fq => ''); - - div class => "mainbox apidoc"; - div class => "header"; - h1 "Json API"; - p "333networks has a Json API. With this API, it is possible to obtain server lists and specific server information for your own banners, ubrowser or other application."; - end; - - # - # ToS - # - - h2 "Permission & Terms of Use"; - p; - txt "The following permissions and conditions are in effect for making use of the Json API: "; - end; - - p "You are allowed to access our API with any application and/or script, self-made or not, to obtain our server lists and server information on the condition that somewhere, anywhere in your application or script you mention that the information is obtained from 333networks."; - - p "You are not allowed to flood the API with requests or query our API continuously or with a short interval. If you draw too much network traffic from 333networks, we consider this flooding and will terminate your ability to query our API. Server information is updated every 15 minutes, there is no point in requesting information at a faster rate as there will be no new information available."; - - p "Intended use: use the serverlist request to get show a list of all servers. After loading the list, your visitors/users can select a single server to display detailed information. Do NOT use the serverlist to immediately show detailed information for ALL servers, this causes a ludicrous amount of information requests and will get you excluded from our API. Not sure whether you are doing it right? Contact us!"; - - # - # use - # - h2 "Use"; - p "The Json API consists of three functions to query for information. The methods occur over HTTP and are presented as Json data. The first function requests the \"Message of the Day\", often used to make announcements about the game. The second method returns a list of servers and can be manipulated by gamename. The third method returns detailed server information for an individual server."; - - - h2 "Message of the Day"; - p; - txt "It is possible to pull announcements from the 333networks Json API with the "; - span class => "code", "motd"; - txt " command. This command returns an html string with the current 333networks announcements for the selected "; - span class => "code", "gamename"; - txt ". This string is suitable for direct JQuery's "; - span class => "code", ".html()"; - txt " function. Additionally, it contains the amount of servers and players as described for the serverlist. This method can be used to announce service messages."; - end; - - div class => "code"; - txt "$self->{site_url}/json/(.[\\w]{1,20})/motd"; - end; - - - h2 "Serverlist"; - p "With the API you can pull a serverlist directly from the masterserver. The API applies the following regex to process your request:"; - div class => "code"; - txt "$self->{site_url}/json/(.[\\w]{1,20})"; - end; - p; - txt "In this regex, "; - span class => "code", "(.[\\w]{1,20})"; - txt " refers to the "; - span class => "ext", "gamename"; - txt ". This is the abbreviation that every game specifies in their masterserver protocol. A comprehensive list of gamenames is found on the "; - a href => "/g/all", "games"; - txt " page by looking at the last part of the URL."; - end; - - p; - txt "It is also possible to provide "; - span class => "code", "GET"; - txt " information in the url. Allowed options are:"; - end; - - ul; - li; - span class => "code", "s"; - txt " - sort by country, hostname, gametype, ip, hostport, numplayers and mapname."; - end; - li; - span class => "code", "o"; - txt " - sorting order: 'a' for ascending and 'd' for descending."; - end; - li; - span class => "code", "r"; - txt " - number of results. Defaults to 50 if not specified. Minimum 1, maximum 1000."; - end; - li; - span class => "code", "p"; - txt " - page. Show the specified page with results. Total number of entries is included in the result."; - end; - li; - span class => "code", "q"; - txt " - search query. Identical to the search query on the "; - a href => "/s", "servers"; - txt " page. Maximum query length is 90 characters."; - end; - end; - - # - # list request format - # - - h2 "Serverlist request examples:"; - p; - txt "The following examples have different outcomes. In the first example, we request a serverlist of "; - span class => "code", "all"; - txt " servers, regardless of type and/or name. The second example requests only servers of the game "; - span class => "code", "Unreal"; - txt ". In the last example, we request a serverlist with the gamename "; - span class => "code", "333networks"; - txt ", with only "; - span class => "code", "2"; - txt " results per page, page "; - span class => "code", "1"; - txt " and with the search word "; - span class => "code", "master"; - txt "."; - end; - - div class => "code"; - txt "$self->{site_url}/json/"; - span class => "ext", "all"; - br; - txt "$self->{site_url}/json/"; - span class => "ext", "unreal"; - br; - txt "$self->{site_url}/json/"; - span class => "ext", "333networks"; - txt "?r="; - span class => "ext", "2"; - txt "&p="; - span class => "ext", "1"; - txt "&q="; - span class => "ext", "master"; - end; - - h2 "Serverlist result examples:"; - p "The API returns Json data in the following format, using the third request as an example. This is example data and may vary from what you receive when performing the same query."; - - div class => "code"; - pre json_result_1(); - end; - - p; - txt "The result contains an array of server entries and the "; - span class => "code", "total"; - txt " amount of entries. In this case, that is "; - span class => "code", "2"; - txt " entries listed and "; - span class => "code", "5"; - txt " total entries, implying that there is one more server not shown or on a next page. With the specified number of results specified by the user and the total amount of servers provided by the API, you can calculate how many pages there are to be specified. If applicable, it also shows the current number of "; - span class => "code", "players"; - txt " that are currently in the selected servers. Every server entry has a number of unsorted keywords. Timestamps are linux epoch, in UTC."; - end; - - p "The available keywords that are returned by the API are: "; - div class => "code", join (" ", qw| id ip hostport hostname gamename label country numplayers maxplayers maptitle mapname gametype dt_added dt_updated|); - - p "There are more keywords available for individual servers. Detailed information about a server is obtained with the individual request as described below. Keywords of both requests are described in the tables below. "; - - - h2 "Server details"; - p "Your application or script can also request detailed information for a single server. This is done in a similar way as requesting a server list. The following general regex is used by 333networks:"; - - div class => "code"; - txt "$self->{site_url}/json/(.[\\w]{1,20})/([\\:\\.\\w]{9,35})"; - end; - - p; - txt "This restricts requests to the correct url with a gamename "; - span class => "code", "(.[\\w]{1,20})"; - txt " and an IP:port "; - span class => "code", "([\\:\\.\\w]{9,35})"; - txt " for IPv4 and IPv6 addresses and numerical port number. There are no additional query options or GET options. It is possible that the gamename specified does not match the "; - txt "gamename"; - txt " as stored in our database. The result will include the correct gamename that was specified in our database."; - end; - - p "The following example requests detailed information by IP address and hostport."; - - # - # individual server details request format - # - - h3 "Server details request:"; - div class => "code"; - txt "$self->{site_url}/json/"; - span class => "ext", "333networks"; - txt "/"; - span class => "ext", "84.83.176.234"; - txt ":"; - span class => "ext", "28900"; - end; - - h3 "Server details result:"; - p "The API returns Json data in the following format, using the requests above as an example. This is example data and may vary from what you receive when performing the same query."; - - div class => "code"; - # snippet 1, below - pre json_result_2(); - end; - - p "The result has a single entry of parameters with a number of unsorted keywords. The available keywords are in addition to the keywords are specified in multiple tables below."; - - p; - txt "The player object "; - span class => "code", "player_n"; - txt " represent the players in the server. This is a Json object as part of the larger object above. The available keywords are specified in the table below."; - end; - - h2 "Keyword reference"; - p "Values, type and descriptions of fields that are returned by the Json API:"; - - # generate reference tables - json_database_ref(); - - h2 "Feedback"; - p; - txt "We wrote the Json API with the intention to make the 333networks masterserver data as accessible as possible. If you feel like any functionality is missing or incorrectly shared, do not hesitate to contact us to provide feedback. Additionally, we request that you follow the advise on usage as we described under the Terms of Use on top of this page, so we can keep providing this API."; - end; - - end; # mainbox - $self->htmlFooter(last_change => "May 2021"); -} - -# list of value / type / descriptions directly from database -sub json_database_ref -{ - my @keyval = ( - { title => "Server identifier information", - table => [ - ["id", "int", "gameserver ID in list database"], - ["sid", "int", "reference ID for detailed information"], - ["ip", "text", "server IP address (in IPv6 format)"], - ["queryport", "int", "UDP status query port"], - ["hostport", "int", "hostport to join the server"], - ["hostname", "text", "name of the specific server"], - ["country", "text", "2-letter country code where the server is hosted"], - ["location", "text", "GameSpy regional indication (continent index or 0 for world)"], - ], - }, - { title => "Server flags \& datetime", - table => [ - ["f_protocol", "int", "protocol index to distinguish between GameSpy v0 and others"], - ["f_blacklist", "int", "server blacklisted?"], - ["f_auth", "int", "authenticated response to the secure/validate challenge?"], - ["f_direct", "int", "direct beacon to the masterserver?"], - ["dt_added", "long", "UTC epoch time that the server was added"], - ["dt_beacon", "long", "UTC epoch time that the server sent a heartbeat"], - ["dt_sync", "long", "UTC epoch time that the server was last synced from another masterserver"], - ["dt_updated", "long", "UTC epoch time that the server information was updated"], - ["dt_serverinfo", "long", "UTC epoch time that the detailed server information was updated"], - ], - }, - { title => "Gamedata", - table => [ - # gamedata - ["gamename", "text", "gamename of the server"], - ["label", "text", "comprehensible game title associated with gamename"], - ["gamever", "text", "game version of the server"], - ["minnetver", "text", "minimal required game version to join"], - ], - }, - { title => "Game settings (detailed information)", - table => [ - ["listenserver", "text", "dedicated server indication"], - ["adminname", "text", "server administrator's name"], - ["adminemail", "text", "server administrator's contact information"], - ["password", "text", "passworded or non-public server"], - ["gametype", "text", "type of game: capture the flag, deathmatch, assault and more"], - ["gamestyle", "text", "in-game playing style"], - ["changelevels", "text", "automatically change levels after match end"], - ["mapurl", "text", "direct url of the map thumbnail relative from this site's domain"], - ["mapname", "text", "filename of current map"], - ["maptitle", "text", "title or description of current map"], - ["minplayers", "int", "minimum number of players to start the game"], - ["numplayers", "int", "current number of players"], - ["maxplayers", "int", "maximum number of players simultaneously allowed on the server"], - ["botskill", "text", "skill level of bots"], - ["balanceteams", "text", "team balancing on join"], - ["playersbalanceteams", "text", "players can toggle automatic team balancing"], - ["friendlyfire", "text", "friendly fire rate"], - ["maxteams", "text", "maximum number of teams"], - ["timelimit", "text", "time limit per match"], - ["goalteamscore", "text", "score limit per match"], - ["fraglimit", "text", "score limit per deathmatch"], - ["mutators", "text", "comma-separated mutator/mod list"], - ["misc", "text", "miscellaneous server attributes (reserved)"], - ["player_#", "text", "player information as Json object for player #, see table below"], - ], - }, - { title => "Player information", - table => [ - ["sid", "int", "associated server ID (per player)"], - ["name", "text", "player display name"], - ["team", "text", "player indication as team number, color code or text string"], - ["frags", "int", "number of frags or points"], - ["mesh", "text", "player model / mesh"], - ["skin", "text", "player body texture"], - ["face", "text", "player facial texture"], - ["ping", "int", "player ping"], - ["misc", "text", "miscellaneous player attributes (reserved)"], - ["dt_player", "long", "UTC epoch time that the player information was updated"], - ], - }, - ); - - - use Data::Dumper 'Dumper'; - - for my $keytype (@keyval) - { - h3 $keytype->{title}; - table class => "keyval"; - Tr; - th class => "tc1", "Value"; - th class => "tc2", "Type"; - th "Description"; - end; - - for my $r (@{$keytype->{table}}) - { - my @tr = @{$r}; - Tr; - td class => "tc1"; - span class => "code", $tr[0]; - end; - td class => "tc2", $tr[1]; - td $tr[2]; - end; - } - end; - } -} - -# json output for example 1 -sub json_result_1 -{ - return '[ - [ - { - "id":1990, - "ip":"::ffff:84.83.176.234" - "hostport":28900, - "hostname":"master.333networks.com (333networks MasterServer)", - "gamename":"333networks", - "gametype":"MasterServer", - "label":"333networks Masterserver", - "country":"NL", - "numplayers":15, - "maxplayers":2966, - "maptitle":null, - "mapname":"333networks", - "dt_added":1616895602, - "dt_updated":1621019250, - }, - { - "id":1117, - "ip":"::ffff:162.154.33.129", - "hostport":28900 - "hostname":"master.gonespy.com", - "gamename":"333networks", - "gametype":"Masterserver", - "label":"333networks Masterserver", - "country":"US", - "numplayers":5, - "maxplayers":847, - "maptitle":"", - "mapname":"333networks", - "dt_added":1616593343, - "dt_updated":1621019247, - } - ], - { - "players":20, - "total":5 - } -]'; -} - -sub json_result_2 -{ - return '{ - "id":3, - "ip":"::ffff:45.74.100.250", - "hostport":10205, - "mapname":"DXMP_iceworld2", - "adminname":"Canna the visionary l Disciple Derp191 and RoninMastaFX", - "hostname":"~Canna\'s Buddhist Server~", - "mapurl":"/map/default/333networks.jpg", - "gamever":"1100", - "gametype":"CDX BDM", - "gamename":"deusex", - "country":"CA", - "dt_updated":1621022768, - "player_0": - { - "sid":3, - "name":"Dark191", - "team":"0", - "frags":8, - "mesh":"cmJCDenton", - "skin":"None", - "face":"" - "ping":63, - "dt_player":1621022768, - "misc":"", - }, - "player_1": - { - "sid":3, - "name":"Anya", - "team":"0", - "frags":12, - "mesh":"cmJCDenton", - "skin":"None", - "face":"" - "ping":54, - "dt_player":1621022768, - "misc":"", - }, - }'; -} - -1; diff --git a/lib/MasterWebInterface/Handler/ServInfo.pm b/lib/MasterWebInterface/Handler/ServInfo.pm index be30fd0..7dc5e55 100755 --- a/lib/MasterWebInterface/Handler/ServInfo.pm +++ b/lib/MasterWebInterface/Handler/ServInfo.pm @@ -16,7 +16,7 @@ TUWF::register( # values as possible. # Display error pages if not found or incorrect. ################################################################################ -sub show_server +sub show_server { my ($self, $gamename, $s_addr) = @_; @@ -96,10 +96,35 @@ sub show_server # serverinfo box div class => "mainbox detail"; - div class => "header"; + # server data flags in header (not country flags) + div class => "serverflags"; + + # uplink or manually added/through applet + if ( $info->{f_direct} ) + { div class => "direct", title => "This server uplinks directly to $self->{site_name}.", ""; } + else + { div class => "manual", title => "This server was added through master synchronisation and does not uplink to $self->{site_name}.", ""; } + + # authenticated through secure/validate + if ( $info->{f_auth} ) + { div class => "authed", title => "This server authenticated through the secure/validate challenge.", ""; } + else + { div class => "noauthed", title => "This server failed the secure/validate challenge or did not reply.", ""; } + + # server blacklisted? + if ( $info->{f_blacklist} ) + { div class => "blacklist", title => "This server is blacklisted for violating the $self->{site_name} Terms of Use or by request from the administrator.", ""; } + else + { div class => "noblacklist", title => "This server is not blacklisted by $self->{site_name}.", ""; } + + if ( $info->{passworded} and $info->{passworded} =~ /(true|1)/i ) + { div class => "passwd", title => "This server requires a password to join.", ""; } + else + { div class => "nopasswd", title => "This server is accessible for everybody.", "";} + end; h1 title => $info->{hostname} // "[unnamed $gamename server]", - $info->{hostname} // "[unnamed $gamename server]"; + $info->{hostname} // "[unnamed $gamename server]"; end; # @@ -143,36 +168,31 @@ sub show_server span $maptitle; end; - table class => "mapinfo"; - # numplayer field - Tr; - td class => "wc1", "Players:"; - td; - txt $info->{numplayers} // 0; - txt "/"; - txt $info->{maxplayers} // 0; - end; - end; - - - Tr; - td "Bots:"; - td; - if ($info->{botskill} or $info->{minplayers}) + # added / last seen + div class => "updatenote"; + span title => ("Server was added on ". strftime "%e %b %Y", gmtime ($info->{dt_added} // 0) ); + + txt "information updated "; + my @t = gmtime( time - ( $info->{dt_updated} // 0 ) ); + + my $diff; + $diff .= ($t[5]-70)*365 + $t[7] > 0 ? ( ($t[5]-70)*365 + $t[7])."d" : "" ; # years+days + $diff .= ($t[2] ? $t[2]."h" : ""); # hours + $diff .= ($t[1] ? $t[1]."m" : ""); # minutes + $diff .= ($t[0] ? sprintf "%02ds", $t[0] : ""); # seconds + + + if ( length $diff ) { - txt $info->{minplayers} // 0; - txt " "; - txt $info->{botskill} // ""; - txt " bot"; - txt ($info->{minplayers} && $info->{minplayers} == 1 ? "" : "s"); + span class => ( ($t[5]-70 or $t[7]) ? "r" : ($t[2] ? "o" : "g") ), $diff; + txt " ago."; } else { - txt "No"; + span class => "g", "right now."; } - end; - end; - end; #table + end; #span + end; # updatenote end; # container # @@ -205,19 +225,7 @@ sub show_server # always display contact Tr; td class => "wc1", "Contact:"; - td; - if ($info->{adminemail}) - { - txt $info->{adminemail} - } - else - { - i; - txt "This server has no contact information listed "; - a href => "https://ut99.org/viewtopic.php?f=33&t=6660", "[?]"; - end; - } - end; + td ($info->{adminemail} ? $info->{adminemail} : "-") ; end; # location data @@ -230,86 +238,36 @@ sub show_server txt " ". $country; end; end; - - # added / updated - Tr; - { - td "Added:"; - my @t = gmtime( time - ( $info->{dt_added} // 0 ) ); - my $sig = 0; - my $diff = ""; - if ($t[5]-70) - { - $diff .= $t[5]-70 - . " year" - . ( ($t[5]-70==1) ? "" : "s" ); - $sig++; - } - if ($t[7]) - { - $diff .= ($sig?", ":"") - . $t[7] - . " day" - . ( ($t[7]==1) ? "" : "s") - } - - if ($diff eq "") - { - $diff = "Less than one day"; - } - td $diff . " ago (" . (strftime "%e %b %Y", gmtime ($info->{dt_added} // 0) ) .")"; - } - end; - + + # numplayer field Tr; - { - td "Last seen:"; + td class => "wc1", "Players:"; td; - my @t = gmtime( time - ( $info->{dt_updated} // 0 ) ); - if ($t[5]-70 // $t[7]) - { - # more than 1 day? show date - span class => "r", (strftime "%e %b %Y", gmtime ($info->{dt_updated} // 0) ); - } - else - { - # less than 1 day? show "time ago" - my $diff = ""; - $diff .= ($t[2] ? $t[2]." hour" . ( $t[2]>1 ? "s, " : ", ") : ""); - $diff .= ($t[1] ? $t[1]." minute". ( $t[1]>1 ? "s, " : ", ") : ""); - $diff .= ($t[0] ? $t[0]." second". ( $t[0]>1 ? "s" : " " ) : "0 seconds"); - $diff .= " ago"; - span $diff; - } + txt $info->{numplayers} // 0; + txt "/"; + txt $info->{maxplayers} // 0; end; - } end; - # TODO: move flags to header Tr; - td "Flags: "; + td "Bots:"; td; - # uplink/sync - span title => "direct uplink or manually added?", - ($info->{f_direct} ? "💻 uplink" : "🤚 manual"); - - txt ", "; - - span title => "authenticated game server?", - ($info->{f_auth} ? "✅ authed" : "❌ insecure"); - txt ", "; - - span title => "server blacklisted for violating 333networks policy?", - ($info->{f_blacklist} ? "blacklisted" : "compliant"); - - txt ", "; - span title => "does the server require a password to join?", - ($info->{passworded} ? - ($info->{passworded} =~ /(true|1)/i ? "🔒 password" : "🔓 open") - : "🔓 open"); + if ($info->{botskill} or $info->{minplayers}) + { + txt $info->{minplayers} // 0; + txt " "; + txt $info->{botskill} // ""; + txt " bot"; + txt ($info->{minplayers} && $info->{minplayers} == 1 ? "" : "s"); + } + else + { + txt "No"; + } end; end; + end; # table serverinfo # @@ -420,7 +378,10 @@ sub show_server end; } end; # playerinfo - + + # disable stats that are considered irrelevant. can be re-enabled with "if (1)" + if (0) + { # # Team info table class => "teaminfo"; @@ -468,81 +429,19 @@ sub show_server td ($info->{fraglimit} // 0); end; end; + } # - # Share options (copy fields) - my $url = $self->{site_url} - . "/" - . $gamename - . "/" - . ( $self->to_ipv4_str($info->{ip}) // "0.0.0.0" ) - . ":" - . ($info->{hostport} // 0); - + # JSON URL (code inactive) table class => "shareopts"; Tr; - th class => "wc1", "Share"; - th ""; - end; - Tr; - td class => "tc1", "Link"; - td class => "tc2"; - input type => 'text', - class => 'text', - name => 'url', - value => $url; + th; + a href => "http://333networks.com/json", title => "For more info, click to go to 333networks.com/json", "Json API"; end; end; - Tr; - td class => "tc1"; - a href => "/json", - title => "The url to access this server over the 333networks Json API", - "Json API"; - end; - td class => "tc2"; - input type => 'text', - class => 'text', - name => 'url', - value => $self->{site_url} - . "/json/" - . $gamename - . "/" - . ( $self->to_ipv4_str($info->{ip}) // "0.0.0.0" ) - . ":" - . ($info->{hostport} // 0); - end; - end; - Tr; - td "Forum Link"; - td; - textarea type => 'textarea', - class => 'text', - rows => 3, - name => 'paste'; - txt "\[url=$url\]";lit "\n"; - txt $info->{hostname} // "[unnamed $gamename server]"; - lit "\n"; - txt "\[/url\]"; - end; - end; - end; - Tr; - td "HTML Code"; - td; - textarea type => 'textarea', - class => 'text', - rows => 3, - name => 'paste'; - txt "<a href=\"$url\">"; - lit "\n"; - txt $info->{hostname} // "[unnamed $gamename server]"; - lit "\n"; - txt "</a>"; - end; - end; - end; - end; # share options - + td ($self->{site_url} . "/json/" . $gamename . "/" . ( $self->to_ipv4_str($info->{ip}) // "0.0.0.0" ) . ":" . ($info->{hostport} // 0)); + end; + end; # mainbox details $self->htmlFooter; } diff --git a/lib/MasterWebInterface/Util/Layout.pm b/lib/MasterWebInterface/Util/Layout.pm index bf401c2..536aad7 100755 --- a/lib/MasterWebInterface/Util/Layout.pm +++ b/lib/MasterWebInterface/Util/Layout.pm @@ -18,7 +18,7 @@ sub htmlHeader if (my $overrideStyle = $self->reqParam("style") ) { # default to custom style if specified option doesn't exist - $style = ( -e "$self->{root}/s/style/$overrideStyle" ) ? $overrideStyle : "basic"; + $style = ( -e "$self->{root}/s/style/$overrideStyle" ) ? $overrideStyle : $self->{style}; } html lang => "en"; @@ -61,19 +61,14 @@ sub htmlHeader end; my $overrideStyle = $self->reqParam("style"); - if ($overrideStyle) { + if ($overrideStyle or $self->{style_box}) { # debug feature: force list of styles on floaty-box div class => "mainbox", style => "position:absolute; left: 20px; top: 20px; width:200px"; div class => "header"; h1 "Development"; - p class => "alttitle"; - txt "This site is under development. Find "; - a href => "http://333networks.com", "333networks.com here!"; - br; - txt "Use the list below to test different house styles."; - end; + p "This box allows for testing of multiple styles. Disable it from config."; end; ul style => "margin: 3px 20px 10pt 40px"; diff --git a/lib/SkinFile.pm b/lib/SkinFile.pm new file mode 100755 index 0000000..b890de2 --- /dev/null +++ b/lib/SkinFile.pm @@ -0,0 +1,67 @@ +package SkinFile; +use strict; +use warnings; +use Fcntl 'LOCK_SH', 'SEEK_SET'; + +sub new { + my($class, $root, $open) = @_; + my $self = bless { root => $root }, $class; + $self->open($open) if $open; + return $self; +} + +sub list { + return map /\/([^\/]+)\/conf/?$1:(), glob "$_[0]{root}/*/conf"; +} + +sub open { + my($self, $dir, $force) = @_; + return if $self->{"s_$dir"} && !$force; + my %o; + open my $F, '<:utf8', "$self->{root}/$dir/conf" or die "$self->{root}/$dir/conf -> $!"; + flock $F, LOCK_SH or die $!; + seek $F, 0, SEEK_SET or die $!; + local $_; + while(<$F>) { + chomp; + s/\r//g; + s{[\t\s]*//.+$}{}; + next if !/^([a-z0-9]+)[\t\s]+(.+)$/; + $o{$1} = $2; + } + close $F; + $self->{"s_$dir"} = \%o; + $self->{opened} = $dir; +} + +sub get { + my($self, $dir, $var) = @_; + $self->open($dir) if defined $var; + $var = $dir if !defined $var; + $var ? $self->{"s_$self->{opened}"}{$var} : keys %{$self->{"s_$self->{opened}"}}; +} + + +1; + +__END__ + +=pod + +=head1 NAME + +SkinFile - Simple object oriented interface to parsing skin configuration files + +=head1 USAGE + + use SkinFile; + my $s = SkinFile->new($dir); + my @skins = $s->list; + + $s->open($skins[0]); + my $name = $s->get('name'); + + # same as above, but in one function + my $name = $s->get($skins[0], 'name'); + + diff --git a/s/style/333networks/333networks.png b/s/style/333networks/333networks.png Binary files differnew file mode 100644 index 0000000..06f2c90 --- /dev/null +++ b/s/style/333networks/333networks.png diff --git a/s/style/default/body.gif b/s/style/333networks/body.gif Binary files differindex b34ad3c..b34ad3c 100755 --- a/s/style/default/body.gif +++ b/s/style/333networks/body.gif diff --git a/s/style/333networks/conf b/s/style/333networks/conf new file mode 100755 index 0000000..8b23887 --- /dev/null +++ b/s/style/333networks/conf @@ -0,0 +1,20 @@ +// template + +name 333networks +author Darkelarious + +// backgrounds +bodybg #222 body.gif +boxbg1 #333 +boxbg2 #111 +boxbg3 #222 +shadow #222 + +// text +textcol1 #ccc +textcol2 #0af +textcol3 #ff0 +textcol4 #666 + +// logos +bglogo 333networks.png diff --git a/s/style/default/style.css b/s/style/333networks/style.css index d754cb8..48017c9 100755..100644 --- a/s/style/default/style.css +++ b/s/style/333networks/style.css @@ -5,7 +5,7 @@ * on re-use. * \* * * * * * * * * * * * * * * * * * */ -/* Theme classic written by Darkelarious */ +/* Theme written by Darkelarious */ /*** Global ***/ * { @@ -21,7 +21,7 @@ body { color: #ccc; font-family: 'Verdana'; font-size: 10pt; - background: #222 url(/style/default/body.gif) repeat center top fixed; + background: #222 url(/style/333networks/body.gif) repeat center top fixed; } p { @@ -43,8 +43,9 @@ a:hover { width: 900px; margin: 0 auto; min-height: 100%; - padding-top:80px; - background: url(/style/default/333networks.png) no-repeat center 15px fixed; + background: url(/style/333networks/333networks.png) no-repeat center 10px fixed; + padding-top: 113px; + background-size: 500px; } #footer { @@ -62,8 +63,9 @@ a:hover { /* mainboxes */ div.mainbox { border: 1px solid #0af; - margin: 21px 0 -10px 0; + margin-bottom:21px; padding: 5px; + box-shadow: 2px 2px 5px #222; background: #333; } @@ -83,8 +85,8 @@ div.mainbox h2 { font-size: 12pt; } div.mainbox h3 { -margin: 5px 0 5px 10px; -font-size: 11pt; + margin: 5px 0 5px 10px; + font-size: 11pt; } div.mainbox p, @@ -106,7 +108,7 @@ div.mainbox div.header { padding:10px 0 0 10px; display:block; width:100%; - color: #0af; + color: #ccc; border-bottom:1px solid #0af; background: #111; } @@ -199,7 +201,7 @@ ul.maintabs li a { margin-left: 5px; border: 1px solid #0af; border-bottom: none; - background: #333; + background: #222; } ul.maintabs.notfirst li a, @@ -249,7 +251,7 @@ ul.maintabs.bottom li a:hover { ul.maintabs.browsetabs li a { margin-left: 5px; - background: #333; + background: #333;; } ul.maintabs.browsetabs li.left a { @@ -281,8 +283,8 @@ div.mainbox.browse table thead tr td { border-bottom:1px solid #0af; color: #0af; padding:3px 10px 3px 5px; - background: #111; - font-weight:bold + font-weight:bold; + background: #333; } div.mainbox.browse table tfoot tr td { @@ -371,29 +373,48 @@ div.mainbox.browse.serverlist table tr td.tc6 { } -/* serverlist details */ +/* serverinfo details */ div.mainbox.detail { padding:0 0 12px 0; } div.mainbox.detail div.header { margin:0 0 12pt 0; - padding:3px 0 0 0; - display:block; + padding: 0; + display:inline-block; width:100%; + height:48px; } div.mainbox.detail div.header h1 { font-weight:normal; - padding: 15px 5px 0 15px; + padding: 15px 15px 0 15px; white-space: nowrap; overflow:hidden; display:block; - width:830px; } -div.mainbox.detail div.header p { - color: #ccc; - padding: 0 0 5px 30px; - } + +div.mainbox.detail div.header div.serverflags { + float:right; + overflow:hidden; +} +div.mainbox.detail div.header div.serverflags div { + width:48px; + height:48px; + display:inline-block; + border-left:1px solid #0af; + background: #222; +} + +/* server flag icons */ +div.mainbox.detail div.header div.serverflags div.direct {background: #131} +div.mainbox.detail div.header div.serverflags div.manual {background: #311} +div.mainbox.detail div.header div.serverflags div.authed {background: #131} +div.mainbox.detail div.header div.serverflags div.noauthed {background: #311} +div.mainbox.detail div.header div.serverflags div.noblacklist {background: #131} +div.mainbox.detail div.header div.serverflags div.blacklist {background: #311} +div.mainbox.detail div.header div.serverflags div.nopasswd {background: #131} +div.mainbox.detail div.header div.serverflags div.passwd {background: #311} + div.mainbox.detail table { margin-bottom: 20px; @@ -405,7 +426,8 @@ div.mainbox.detail table tr th { font-weight:bold; padding: 2px 8px; margin-bottom:12pt; - border-bottom: 1px solid #996 + border-bottom: 1px solid #666; + color: #ccc; } div.mainbox.detail table tr th.wc1 { width:170px @@ -421,40 +443,35 @@ div.mainbox.detail table tr td img.flag { } div.mainbox.detail table tr td input, div.mainbox.detail table tr td textarea { - background: #222; color: #ccc; width:99%; padding: 3px 1px 2px 5px; border: 1px solid #0af; font-family:"Lucida Console"; font-size: 8pt; + background: #222; } div.mainbox.detail table.serverinfo, div.mainbox.detail table.gameinfo { width:63%; } -div.mainbox.detail table.teaminfo, -div.mainbox.detail table.limits, -div.mainbox.detail table.mutators, -div.mainbox.detail table.players, -div.mainbox.detail table.useropts, -div.mainbox.detail table.shareopts { +div.mainbox.detail table { width:96%; } div.mainbox.detail div.container { float:right; - margin-right:30px; + margin: 0 30px 8px 0; } div.mainbox.detail div.container div.thumbnail { border:1px solid #666; - background: #222; display:block; - margin-bottom:8px + box-shadow: 1px 1px 2px #222; + background: #222; } div.mainbox.detail div.container div.thumbnail img { height:256px; width:256px; - border:1px solid #996; + border:1px solid #ccc; display:block; margin:10px 10px 2px 10px } @@ -465,6 +482,14 @@ div.mainbox.detail div.container div.thumbnail span { display:block; font-size:x-small } +div.mainbox.detail div.container div.updatenote { + padding: 2px 0 7px 0; + display:block; + font-style: italic; + font-size: x-small; + text-align: right; +} + div.mainbox.detail div.container table.mapinfo { width: 280px; margin-bottom:0; @@ -472,6 +497,7 @@ div.mainbox.detail div.container table.mapinfo { div.mainbox.detail div.container table.mapinfo tr td.wc1{ width: 80px; } +div.mainbox.detail table.players {text-align:left;} div.mainbox.detail table.players tr.odd { background: #222; } @@ -485,10 +511,17 @@ div.mainbox.detail table.players tr th.mesh {width:140px} div.mainbox.detail table.players tr th.skin {width:140px} div.mainbox.detail table.players tr th.ping {width:50px} -div.mainbox.detail table.players tr td.frags, -div.mainbox.detail table.players tr th.frags, -div.mainbox.detail table.players tr td.ping, -div.mainbox.detail table.players tr th.ping {text-align:right;} +div.mainbox.detail table.shareopts tr th a { + color: #ccc; +} +div.mainbox.detail table.shareopts tr td { + border-right:1px solid #666; + border-bottom:1px solid #666; + font-family:"Lucida Console"; + font-size: 8pt; + text-align:left; + background: #222; +} /* warning box */ div.mainbox.warning { @@ -512,89 +545,14 @@ div.mainbox div.description { margin: 10px auto } -div.code.warning { - display:block; - margin:12pt auto; - width:90%; - font-family:"Lucida Console"; - font-size: 8pt; - text-align:left; - padding:5px; - border: 1px solid #c00; - overflow:hidden; - background: #222; - box-shadow: 10px 10px 5px #222; - } - span.hilit { - background: #111; font-style: italic; padding: 1px; + background: #111; } -div.mainbox.apidoc table { - table-layout:fixed; - border-collapse:collapse; - margin:0 auto 12pt auto; - width:90%; - box-shadow: 3px 3px 2px #222; - background: #2a2a2a; - border:1px solid #666; - } -div.mainbox.apidoc table tr td { - white-space:nowrap; - overflow:hidden; - text-align:center; - padding:1px 10px 1px 5px; - font-size:10pt; - } -div.mainbox.apidoc table tr th { -font-weight:bold; -color: #ccc; -} -div.mainbox.apidoc table tr th, -div.mainbox.apidoc table tr td { -vertical-align:top; -text-align:left; - padding:3px 6px; - border:1px solid #666; - border-left:0; - border-right:0; - font-size:9pt -} - -div.mainbox.apidoc table .tc1 {width:90px;text-align:left} -div.mainbox.apidoc table .tc2 {width:70px;text-align:center;} - -div.mainbox.apidoc p, -div.mainbox.apidoc ul, -div.mainbox.apidoc ol { - margin-bottom:6pt; -} - -pre.code, -div.code { - display:block; - margin:2px auto 12px auto; - width:90%; - font-family:"Lucida Console"; - font-size: 8pt; - text-align:left; - padding:10px 20px; - border: 1px solid #0af; - overflow:auto; - background: #2a2a2a; - box-shadow: 3px 3px 3px #222; - } -span.code { - font-family:"Lucida Console"; - font-size: 8pt; - text-align:left; - padding:2px; - background: #2a2a2a; -} - -span.ext { - color: #bbb; - font-style: italic; - } +.r {color:#f55} +.o {color:#c80} +.y {color:#ff3} +.g {color:#3f3} +.b {color:#33f} diff --git a/s/style/default/333networks.png b/s/style/default/333networks.png Binary files differdeleted file mode 100755 index 9803dc1..0000000 --- a/s/style/default/333networks.png +++ /dev/null diff --git a/s/style/errorist/body.gif b/s/style/errorist/body.gif Binary files differnew file mode 100755 index 0000000..b34ad3c --- /dev/null +++ b/s/style/errorist/body.gif diff --git a/s/style/errorist/conf b/s/style/errorist/conf new file mode 100755 index 0000000..8fc8595 --- /dev/null +++ b/s/style/errorist/conf @@ -0,0 +1,20 @@ +// template + +name errorist +author Syntax-Error + +// backgrounds +bodybg #222 body.gif +boxbg1 #333 +boxbg2 #111 +boxbg3 #1c1c1c +shadow #111 + +// text +textcol1 #ccc +textcol2 #88f +textcol3 #f88 +textcol4 #666 + +// logos +bglogo errorist.png diff --git a/s/style/errorist/errorist.png b/s/style/errorist/errorist.png Binary files differnew file mode 100755 index 0000000..0e4e6f0 --- /dev/null +++ b/s/style/errorist/errorist.png diff --git a/s/style/errorist/style.css b/s/style/errorist/style.css new file mode 100644 index 0000000..d656885 --- /dev/null +++ b/s/style/errorist/style.css @@ -0,0 +1,558 @@ +/* * * * * * * * * * * * * * * * * * *\ +* Master Server Web Interface * +* A website by Darkelarious * +* See COPYING for additional details * +* on re-use. * +\* * * * * * * * * * * * * * * * * * */ + +/* Theme written by Darkelarious */ + +/*** Global ***/ +* { + margin: 0; + padding: 0; + border: 0; + outline:0; + } + +body { + text-align: center; + height: 100%; + color: #ccc; + font-family: 'Verdana'; + font-size: 10pt; + background: #222 url(/style/errorist/body.gif) repeat center top fixed; + } + +p { + margin-bottom:12pt; + } + +a, a:visited { + text-decoration: none; + color: #88f; + } + +a:hover { + color: #f88; + text-decoration: none; + } + +#body { + text-align: left; + width: 900px; + margin: 0 auto; + min-height: 100%; + background: url(/style/errorist/errorist.png) no-repeat center 10px fixed; + padding-top: 76px; + background-size: 500px; + } + +#footer { + padding: 90px 0 40px 0; + text-align:center; + font-size : x-small; + clear:both + } + +#footer a { + text-decoration: underline; + } + + +/* mainboxes */ +div.mainbox { + border: 1px solid #88f; + margin-bottom:21px; + padding: 5px; + box-shadow: 2px 2px 5px #111; + background: #333; + } + +div.mainbox h1, +div.mainbox h2, +div.mainbox h3 { + margin: -5px 0 10px 0; + text-decoration: none; + font-family: Tahoma; + font-weight: normal; + font-size: 16pt; + color: #88f; + } + +div.mainbox h2 { + margin: 5px 0 5px 5px; + font-size: 12pt; + } +div.mainbox h3 { + margin: 5px 0 5px 10px; + font-size: 11pt; +} + +div.mainbox p, +div.mainbox ul, +div.mainbox ol { + margin: 5px 16px 0 8px; + padding: 0 5px 5px 25px; + text-align:left; + font-size: 9pt; + } +div.mainbox ul, +div.mainbox ol { + margin-left:20px; + } + + +div.mainbox div.header { + margin: -5px 2px 10px -5px; + padding:10px 0 0 10px; + display:block; + width:100%; + color: #ccc; + border-bottom:1px solid #88f; + background: #111; + } + +/* navigation / search box "fieldset.search" */ + +form input { + border: 1px solid #88f; + background: #1c1c1c; + color: #ccc; +} + +form fieldset.search, +form fieldset#advancedsearch { + display: block; + margin:12px 0 12px 0; + width: 100%; + text-align:center; + height:22px; + } + +form fieldset.search input.text, +form fieldset#advancedsearch input.text { + width: 300px; + margin-left:20px; + padding:1px 1px 1px 5px; + font-style: italic; + } + +form fieldset.search input.submit { + display:none; + } + +form fieldset.search a { + padding: 1px 5px; + border: 1px solid #88f; + margin: 0 6px; + } +form fieldset.search a.sel, +form fieldset.search a:hover { + border: 1px solid #f88; + color: #f88; + } + +form div.dropdown a { + display:block; + width:100%; + text-align:center; + font-size: x-small; +} + +form fieldset#advancedsearch { + display:none; +} +form fieldset#advancedsearch input.submit { + padding: 1px; + margin: auto 5px; +} + +/* TODO: advanced search function styling */ + + + +/* browse table tabs */ +ul.maintabs { + display: inline; + margin: 0; + } + +ul.maintabs.notfirst { + display: block; + height: 20px + } + +ul.maintabs li { + display: inline; + list-style-type: none + } + +ul.maintabs li a, +ul.maintabs li b { + float: right; + display: block; + height: 14px; + padding: 1px 7px 5px 7px; + margin: 0 0 0 10px; + } + +ul.maintabs li a { + margin-left: 5px; + border: 1px solid #88f; + border-bottom: none; + background: #1c1c1c; + } + +ul.maintabs.notfirst li a, +ul.maintabs.notfirst li b { + margin-top: 20px + } + +ul.maintabs.bottom li a, +ul.maintabs.bottom li b { + margin-top: 10px; + padding: 1px 7px 5px 7px + } + +ul.maintabs.bottom li a { + border-bottom: 1px solid #88f; + border-top: none + } + +ul.maintabs li.left a, +ul.maintabs li.left b { + float: left; + margin-left: 0; + margin-right: 10px + } + +ul.maintabs li b { + margin-left: -2px; + margin-right: -7px + } + +ul.maintabs li.left b { + margin-left: -7px; + margin-right: -2px + } + +ul.maintabs li.tabselected a, +ul.maintabs li a:hover { + padding-bottom: 6px + } + +ul.maintabs.bottom li.tabselected a, +ul.maintabs.bottom li a:hover { + padding-top: 2px; + padding-bottom: 5px; + margin-top: 9px + } + +ul.maintabs.browsetabs li a { + margin-left: 5px; + background: #333;; + } + +ul.maintabs.browsetabs li.left a { + margin-left: 0; + margin-right: 5px + } + + +/* game/server browse tables */ +div.mainbox.browse { + padding: 0; + } + +div.mainbox.browse table { + width: 100%; + table-layout:fixed; + border-collapse:collapse + } + +div.mainbox.browse table thead td { + font-weight: bold; + } + +div.mainbox.browse table thead tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:0; + border-bottom:1px solid #88f; + color: #88f; + padding:3px 10px 3px 5px; + font-weight:bold; + background: #333; + } + +div.mainbox.browse table tfoot tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:1px solid #88f; + color: #ccc; + padding:3px 10px 3px 5px; + } + +div.mainbox.browse table tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + padding:1px 10px 1px 5px; + font-size:10pt; + } + +div.mainbox.browse table tr.s td a { + color: #ccc; + } + +div.mainbox.browse table tr.s td a:hover { + color: #f88; + } + +div.mainbox.browse table tr.odd { + background: #1c1c1c; + } + +/* specific game list table columns */ +div.mainbox.browse.gamelist table tr td.tc1 { + text-align:left; + padding-left:20px + } + +div.mainbox.browse.gamelist table tr td.tc2 { + width:100px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } + +div.mainbox.browse.gamelist table tr td.tc3 { + width:200px; + } + +/* specific serverlist table columns */ +div.mainbox.browse.serverlist table tr td.tc1 { + width:10px; + background-size: 20px 15px; + background-position: 50%; + background-repeat: no-repeat; + } + +div.mainbox.browse.serverlist table tr td.tc2 { + text-align:left; + } + +div.mainbox.browse.serverlist table tr td.tc3 { + width:46px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } +div.mainbox.browse.serverlist table tr td.tc3.icon a { + display:block; + margin:0 auto; + height:16px; + width:16px; +} + +div.mainbox.browse.serverlist table tr td.tc4 { + width:90px;text-align:left + } + +div.mainbox.browse.serverlist table tr td.tc5 { + width:70px; + text-align:center + } + +div.mainbox.browse.serverlist table tr td.tc6 { + width:140px; + text-align:left + } + + +/* serverinfo details */ +div.mainbox.detail { + padding:0 0 12px 0; + } +div.mainbox.detail div.header { + margin:0 0 12pt 0; + padding: 0; + display:inline-block; + width:100%; + height:48px; + } + +div.mainbox.detail div.header h1 { + font-weight:normal; + padding: 15px 15px 0 15px; + white-space: nowrap; + overflow:hidden; + display:block; + } + +div.mainbox.detail div.header div.serverflags { + float:right; + overflow:hidden; +} +div.mainbox.detail div.header div.serverflags div { + width:48px; + height:48px; + display:inline-block; + border-left:1px solid #88f; + background: #1c1c1c; +} + +/* server flag icons */ +div.mainbox.detail div.header div.serverflags div.direct {background: #131} +div.mainbox.detail div.header div.serverflags div.manual {background: #311} +div.mainbox.detail div.header div.serverflags div.authed {background: #131} +div.mainbox.detail div.header div.serverflags div.noauthed {background: #311} +div.mainbox.detail div.header div.serverflags div.noblacklist {background: #131} +div.mainbox.detail div.header div.serverflags div.blacklist {background: #311} +div.mainbox.detail div.header div.serverflags div.nopasswd {background: #131} +div.mainbox.detail div.header div.serverflags div.passwd {background: #311} + + +div.mainbox.detail table { + margin-bottom: 20px; + table-layout:fixed; + border-collapse:collapse; + text-align:left; + } +div.mainbox.detail table tr th { + font-weight:bold; + padding: 2px 8px; + margin-bottom:12pt; + border-bottom: 1px solid #666; + color: #ccc; + } +div.mainbox.detail table tr th.wc1 { + width:170px + } +div.mainbox.detail table tr td { + vertical-align:top; + padding:6px 5px 4px 15px; + } +div.mainbox.detail table tr td img.flag { + margin:-4px 2px -4px 0; + height:20px; + width:30px; + } +div.mainbox.detail table tr td input, +div.mainbox.detail table tr td textarea { + color: #ccc; + width:99%; + padding: 3px 1px 2px 5px; + border: 1px solid #0af; + font-family:"Lucida Console"; + font-size: 8pt; + background: #1c1c1c; + } +div.mainbox.detail table.serverinfo, +div.mainbox.detail table.gameinfo { + width:63%; + } +div.mainbox.detail table { + width:96%; + } +div.mainbox.detail div.container { + float:right; + margin: 0 30px 8px 0; + } +div.mainbox.detail div.container div.thumbnail { + border:1px solid #666; + display:block; + box-shadow: 1px 1px 2px #111; + background: #1c1c1c; + } +div.mainbox.detail div.container div.thumbnail img { + height:256px; + width:256px; + border:1px solid #ccc; + display:block; + margin:10px 10px 2px 10px + } +div.mainbox.detail div.container div.thumbnail span { + text-align: right; + font-weight: normal; + padding:0 15px 4px 5px; + display:block; + font-size:x-small + } +div.mainbox.detail div.container div.updatenote { + padding: 2px 0 7px 0; + display:block; + font-style: italic; + font-size: x-small; + text-align: right; +} + +div.mainbox.detail div.container table.mapinfo { + width: 280px; + margin-bottom:0; + } +div.mainbox.detail div.container table.mapinfo tr td.wc1{ + width: 80px; + } +div.mainbox.detail table.players {text-align:left;} +div.mainbox.detail table.players tr.odd { + background: #1c1c1c; + } +div.mainbox.detail table.players tr td { + padding:1px 5px 0px 15px; + overflow:hidden; + white-space: nowrap; + } +div.mainbox.detail table.players tr th.frags {width:50px} +div.mainbox.detail table.players tr th.mesh {width:140px} +div.mainbox.detail table.players tr th.skin {width:140px} +div.mainbox.detail table.players tr th.ping {width:50px} + +div.mainbox.detail table.shareopts tr th a { + color: #ccc; +} +div.mainbox.detail table.shareopts tr td { + border-right:1px solid #666; + border-bottom:1px solid #666; + font-family:"Lucida Console"; + font-size: 8pt; + text-align:left; + background: #1c1c1c; +} + +/* warning box */ +div.mainbox.warning { + color:#ccc; + background-color: #411; + border: 1px solid #c00; +} +div.mainbox.warning div.header { + border-bottom:1px solid #c00; + background: #200; + color: #ccc; +} + +div.mainbox.warning div.header h1{ + color: #ccc; +} + +div.mainbox div.description { + display: block; + width: 500px; + margin: 10px auto + } + +span.hilit { + font-style: italic; + padding: 1px; + background: #111; +} + +.r {color:#f55} +.o {color:#c80} +.y {color:#ff3} +.g {color:#3f3} +.b {color:#33f} diff --git a/s/style/gonespy/conf b/s/style/gonespy/conf new file mode 100755 index 0000000..2c9623b --- /dev/null +++ b/s/style/gonespy/conf @@ -0,0 +1,20 @@ +// template + +name gonespy +author CougarXR7 + +// backgrounds +bodybg #000 +boxbg1 #333 +boxbg2 #222 +boxbg3 #1c1c1c +shadow #222 + +// text +textcol1 #eee +textcol2 #0e0 +textcol3 #0ee +textcol4 #777 + +// logos +bglogo gonespytm.png diff --git a/s/style/gonespy/gonespytm.png b/s/style/gonespy/gonespytm.png Binary files differnew file mode 100644 index 0000000..5557b0d --- /dev/null +++ b/s/style/gonespy/gonespytm.png diff --git a/s/style/gonespy/style.css b/s/style/gonespy/style.css new file mode 100644 index 0000000..21541bb --- /dev/null +++ b/s/style/gonespy/style.css @@ -0,0 +1,558 @@ +/* * * * * * * * * * * * * * * * * * *\ +* Master Server Web Interface * +* A website by Darkelarious * +* See COPYING for additional details * +* on re-use. * +\* * * * * * * * * * * * * * * * * * */ + +/* Theme written by Darkelarious */ + +/*** Global ***/ +* { + margin: 0; + padding: 0; + border: 0; + outline:0; + } + +body { + text-align: center; + height: 100%; + color: #eee; + font-family: 'Verdana'; + font-size: 10pt; + background: #000; + } + +p { + margin-bottom:12pt; + } + +a, a:visited { + text-decoration: none; + color: #0e0; + } + +a:hover { + color: #0ee; + text-decoration: none; + } + +#body { + text-align: left; + width: 900px; + margin: 0 auto; + min-height: 100%; + background: url(/style/gonespy/gonespytm.png) no-repeat center 10px fixed; + padding-top: 144px; + background-size: 500px; + } + +#footer { + padding: 90px 0 40px 0; + text-align:center; + font-size : x-small; + clear:both + } + +#footer a { + text-decoration: underline; + } + + +/* mainboxes */ +div.mainbox { + border: 1px solid #0e0; + margin-bottom:21px; + padding: 5px; + box-shadow: 2px 2px 5px #222; + background: #333; + } + +div.mainbox h1, +div.mainbox h2, +div.mainbox h3 { + margin: -5px 0 10px 0; + text-decoration: none; + font-family: Tahoma; + font-weight: normal; + font-size: 16pt; + color: #0e0; + } + +div.mainbox h2 { + margin: 5px 0 5px 5px; + font-size: 12pt; + } +div.mainbox h3 { + margin: 5px 0 5px 10px; + font-size: 11pt; +} + +div.mainbox p, +div.mainbox ul, +div.mainbox ol { + margin: 5px 16px 0 8px; + padding: 0 5px 5px 25px; + text-align:left; + font-size: 9pt; + } +div.mainbox ul, +div.mainbox ol { + margin-left:20px; + } + + +div.mainbox div.header { + margin: -5px 2px 10px -5px; + padding:10px 0 0 10px; + display:block; + width:100%; + color: #eee; + border-bottom:1px solid #0e0; + background: #222; + } + +/* navigation / search box "fieldset.search" */ + +form input { + border: 1px solid #0e0; + background: #1c1c1c; + color: #eee; +} + +form fieldset.search, +form fieldset#advancedsearch { + display: block; + margin:12px 0 12px 0; + width: 100%; + text-align:center; + height:22px; + } + +form fieldset.search input.text, +form fieldset#advancedsearch input.text { + width: 300px; + margin-left:20px; + padding:1px 1px 1px 5px; + font-style: italic; + } + +form fieldset.search input.submit { + display:none; + } + +form fieldset.search a { + padding: 1px 5px; + border: 1px solid #0e0; + margin: 0 6px; + } +form fieldset.search a.sel, +form fieldset.search a:hover { + border: 1px solid #0ee; + color: #0ee; + } + +form div.dropdown a { + display:block; + width:100%; + text-align:center; + font-size: x-small; +} + +form fieldset#advancedsearch { + display:none; +} +form fieldset#advancedsearch input.submit { + padding: 1px; + margin: auto 5px; +} + +/* TODO: advanced search function styling */ + + + +/* browse table tabs */ +ul.maintabs { + display: inline; + margin: 0; + } + +ul.maintabs.notfirst { + display: block; + height: 20px + } + +ul.maintabs li { + display: inline; + list-style-type: none + } + +ul.maintabs li a, +ul.maintabs li b { + float: right; + display: block; + height: 14px; + padding: 1px 7px 5px 7px; + margin: 0 0 0 10px; + } + +ul.maintabs li a { + margin-left: 5px; + border: 1px solid #0e0; + border-bottom: none; + background: #1c1c1c; + } + +ul.maintabs.notfirst li a, +ul.maintabs.notfirst li b { + margin-top: 20px + } + +ul.maintabs.bottom li a, +ul.maintabs.bottom li b { + margin-top: 10px; + padding: 1px 7px 5px 7px + } + +ul.maintabs.bottom li a { + border-bottom: 1px solid #0e0; + border-top: none + } + +ul.maintabs li.left a, +ul.maintabs li.left b { + float: left; + margin-left: 0; + margin-right: 10px + } + +ul.maintabs li b { + margin-left: -2px; + margin-right: -7px + } + +ul.maintabs li.left b { + margin-left: -7px; + margin-right: -2px + } + +ul.maintabs li.tabselected a, +ul.maintabs li a:hover { + padding-bottom: 6px + } + +ul.maintabs.bottom li.tabselected a, +ul.maintabs.bottom li a:hover { + padding-top: 2px; + padding-bottom: 5px; + margin-top: 9px + } + +ul.maintabs.browsetabs li a { + margin-left: 5px; + background: #333;; + } + +ul.maintabs.browsetabs li.left a { + margin-left: 0; + margin-right: 5px + } + + +/* game/server browse tables */ +div.mainbox.browse { + padding: 0; + } + +div.mainbox.browse table { + width: 100%; + table-layout:fixed; + border-collapse:collapse + } + +div.mainbox.browse table thead td { + font-weight: bold; + } + +div.mainbox.browse table thead tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:0; + border-bottom:1px solid #0e0; + color: #0e0; + padding:3px 10px 3px 5px; + font-weight:bold; + background: #333; + } + +div.mainbox.browse table tfoot tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:1px solid #0e0; + color: #eee; + padding:3px 10px 3px 5px; + } + +div.mainbox.browse table tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + padding:1px 10px 1px 5px; + font-size:10pt; + } + +div.mainbox.browse table tr.s td a { + color: #eee; + } + +div.mainbox.browse table tr.s td a:hover { + color: #0ee; + } + +div.mainbox.browse table tr.odd { + background: #1c1c1c; + } + +/* specific game list table columns */ +div.mainbox.browse.gamelist table tr td.tc1 { + text-align:left; + padding-left:20px + } + +div.mainbox.browse.gamelist table tr td.tc2 { + width:100px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } + +div.mainbox.browse.gamelist table tr td.tc3 { + width:200px; + } + +/* specific serverlist table columns */ +div.mainbox.browse.serverlist table tr td.tc1 { + width:10px; + background-size: 20px 15px; + background-position: 50%; + background-repeat: no-repeat; + } + +div.mainbox.browse.serverlist table tr td.tc2 { + text-align:left; + } + +div.mainbox.browse.serverlist table tr td.tc3 { + width:46px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } +div.mainbox.browse.serverlist table tr td.tc3.icon a { + display:block; + margin:0 auto; + height:16px; + width:16px; +} + +div.mainbox.browse.serverlist table tr td.tc4 { + width:90px;text-align:left + } + +div.mainbox.browse.serverlist table tr td.tc5 { + width:70px; + text-align:center + } + +div.mainbox.browse.serverlist table tr td.tc6 { + width:140px; + text-align:left + } + + +/* serverinfo details */ +div.mainbox.detail { + padding:0 0 12px 0; + } +div.mainbox.detail div.header { + margin:0 0 12pt 0; + padding: 0; + display:inline-block; + width:100%; + height:48px; + } + +div.mainbox.detail div.header h1 { + font-weight:normal; + padding: 15px 15px 0 15px; + white-space: nowrap; + overflow:hidden; + display:block; + } + +div.mainbox.detail div.header div.serverflags { + float:right; + overflow:hidden; +} +div.mainbox.detail div.header div.serverflags div { + width:48px; + height:48px; + display:inline-block; + border-left:1px solid #0e0; + background: #1c1c1c; +} + +/* server flag icons */ +div.mainbox.detail div.header div.serverflags div.direct {background: #131} +div.mainbox.detail div.header div.serverflags div.manual {background: #311} +div.mainbox.detail div.header div.serverflags div.authed {background: #131} +div.mainbox.detail div.header div.serverflags div.noauthed {background: #311} +div.mainbox.detail div.header div.serverflags div.noblacklist {background: #131} +div.mainbox.detail div.header div.serverflags div.blacklist {background: #311} +div.mainbox.detail div.header div.serverflags div.nopasswd {background: #131} +div.mainbox.detail div.header div.serverflags div.passwd {background: #311} + + +div.mainbox.detail table { + margin-bottom: 20px; + table-layout:fixed; + border-collapse:collapse; + text-align:left; + } +div.mainbox.detail table tr th { + font-weight:bold; + padding: 2px 8px; + margin-bottom:12pt; + border-bottom: 1px solid #777; + color: #eee; + } +div.mainbox.detail table tr th.wc1 { + width:170px + } +div.mainbox.detail table tr td { + vertical-align:top; + padding:6px 5px 4px 15px; + } +div.mainbox.detail table tr td img.flag { + margin:-4px 2px -4px 0; + height:20px; + width:30px; + } +div.mainbox.detail table tr td input, +div.mainbox.detail table tr td textarea { + color: #ccc; + width:99%; + padding: 3px 1px 2px 5px; + border: 1px solid #0af; + font-family:"Lucida Console"; + font-size: 8pt; + background: #1c1c1c; + } +div.mainbox.detail table.serverinfo, +div.mainbox.detail table.gameinfo { + width:63%; + } +div.mainbox.detail table { + width:96%; + } +div.mainbox.detail div.container { + float:right; + margin: 0 30px 8px 0; + } +div.mainbox.detail div.container div.thumbnail { + border:1px solid #777; + display:block; + box-shadow: 1px 1px 2px #222; + background: #1c1c1c; + } +div.mainbox.detail div.container div.thumbnail img { + height:256px; + width:256px; + border:1px solid #eee; + display:block; + margin:10px 10px 2px 10px + } +div.mainbox.detail div.container div.thumbnail span { + text-align: right; + font-weight: normal; + padding:0 15px 4px 5px; + display:block; + font-size:x-small + } +div.mainbox.detail div.container div.updatenote { + padding: 2px 0 7px 0; + display:block; + font-style: italic; + font-size: x-small; + text-align: right; +} + +div.mainbox.detail div.container table.mapinfo { + width: 280px; + margin-bottom:0; + } +div.mainbox.detail div.container table.mapinfo tr td.wc1{ + width: 80px; + } +div.mainbox.detail table.players {text-align:left;} +div.mainbox.detail table.players tr.odd { + background: #1c1c1c; + } +div.mainbox.detail table.players tr td { + padding:1px 5px 0px 15px; + overflow:hidden; + white-space: nowrap; + } +div.mainbox.detail table.players tr th.frags {width:50px} +div.mainbox.detail table.players tr th.mesh {width:140px} +div.mainbox.detail table.players tr th.skin {width:140px} +div.mainbox.detail table.players tr th.ping {width:50px} + +div.mainbox.detail table.shareopts tr th a { + color: #eee; +} +div.mainbox.detail table.shareopts tr td { + border-right:1px solid #777; + border-bottom:1px solid #777; + font-family:"Lucida Console"; + font-size: 8pt; + text-align:left; + background: #1c1c1c; +} + +/* warning box */ +div.mainbox.warning { + color:#ccc; + background-color: #411; + border: 1px solid #c00; +} +div.mainbox.warning div.header { + border-bottom:1px solid #c00; + background: #200; + color: #ccc; +} + +div.mainbox.warning div.header h1{ + color: #ccc; +} + +div.mainbox div.description { + display: block; + width: 500px; + margin: 10px auto + } + +span.hilit { + font-style: italic; + padding: 1px; + background: #222; +} + +.r {color:#f55} +.o {color:#c80} +.y {color:#ff3} +.g {color:#3f3} +.b {color:#33f} diff --git a/s/style/halloween/333hw1.png b/s/style/halloween/333hw1.png Binary files differnew file mode 100755 index 0000000..7528ccb --- /dev/null +++ b/s/style/halloween/333hw1.png diff --git a/s/style/halloween/b50.png b/s/style/halloween/b50.png Binary files differnew file mode 100755 index 0000000..8d33024 --- /dev/null +++ b/s/style/halloween/b50.png diff --git a/s/style/halloween/b75.png b/s/style/halloween/b75.png Binary files differnew file mode 100755 index 0000000..9e1406e --- /dev/null +++ b/s/style/halloween/b75.png diff --git a/s/style/halloween/conf b/s/style/halloween/conf new file mode 100755 index 0000000..92566da --- /dev/null +++ b/s/style/halloween/conf @@ -0,0 +1,20 @@ +// template + +name halloween +author Darkelarious + +// backgrounds +bodybg #000 hw1.png +boxbg1 g75.png +boxbg2 g50.png +boxbg3 prim.png +shadow #552500 + +// text +textcol1 #ccc +textcol2 #fa0 +textcol3 #ff0 +textcol4 #552500 + +// logos +bglogo 333hw1.png diff --git a/s/style/halloween/g50.png b/s/style/halloween/g50.png Binary files differnew file mode 100755 index 0000000..2cca936 --- /dev/null +++ b/s/style/halloween/g50.png diff --git a/s/style/halloween/g75.png b/s/style/halloween/g75.png Binary files differnew file mode 100755 index 0000000..f7099c3 --- /dev/null +++ b/s/style/halloween/g75.png diff --git a/s/style/halloween/hw1-o.png b/s/style/halloween/hw1-o.png Binary files differnew file mode 100755 index 0000000..89f3a6c --- /dev/null +++ b/s/style/halloween/hw1-o.png diff --git a/s/style/halloween/hw1.png b/s/style/halloween/hw1.png Binary files differnew file mode 100755 index 0000000..3379c6e --- /dev/null +++ b/s/style/halloween/hw1.png diff --git a/s/style/halloween/prim.png b/s/style/halloween/prim.png Binary files differnew file mode 100755 index 0000000..f1fd976 --- /dev/null +++ b/s/style/halloween/prim.png diff --git a/s/style/halloween/style.css b/s/style/halloween/style.css new file mode 100644 index 0000000..58c0865 --- /dev/null +++ b/s/style/halloween/style.css @@ -0,0 +1,558 @@ +/* * * * * * * * * * * * * * * * * * *\ +* Master Server Web Interface * +* A website by Darkelarious * +* See COPYING for additional details * +* on re-use. * +\* * * * * * * * * * * * * * * * * * */ + +/* Theme written by Darkelarious */ + +/*** Global ***/ +* { + margin: 0; + padding: 0; + border: 0; + outline:0; + } + +body { + text-align: center; + height: 100%; + color: #ccc; + font-family: 'Verdana'; + font-size: 10pt; + background: #000 url(/style/halloween/hw1.png) repeat center top fixed; + } + +p { + margin-bottom:12pt; + } + +a, a:visited { + text-decoration: none; + color: #fa0; + } + +a:hover { + color: #ff0; + text-decoration: none; + } + +#body { + text-align: left; + width: 900px; + margin: 0 auto; + min-height: 100%; + background: url(/style/halloween/333hw1.png) no-repeat center 10px fixed; + padding-top: 145px; + background-size: 500px; + } + +#footer { + padding: 90px 0 40px 0; + text-align:center; + font-size : x-small; + clear:both + } + +#footer a { + text-decoration: underline; + } + + +/* mainboxes */ +div.mainbox { + border: 1px solid #fa0; + margin-bottom:21px; + padding: 5px; + box-shadow: 2px 2px 5px #552500; + background: url(/style/halloween/g75.png) repeat center top; + } + +div.mainbox h1, +div.mainbox h2, +div.mainbox h3 { + margin: -5px 0 10px 0; + text-decoration: none; + font-family: Tahoma; + font-weight: normal; + font-size: 16pt; + color: #fa0; + } + +div.mainbox h2 { + margin: 5px 0 5px 5px; + font-size: 12pt; + } +div.mainbox h3 { + margin: 5px 0 5px 10px; + font-size: 11pt; +} + +div.mainbox p, +div.mainbox ul, +div.mainbox ol { + margin: 5px 16px 0 8px; + padding: 0 5px 5px 25px; + text-align:left; + font-size: 9pt; + } +div.mainbox ul, +div.mainbox ol { + margin-left:20px; + } + + +div.mainbox div.header { + margin: -5px 2px 10px -5px; + padding:10px 0 0 10px; + display:block; + width:100%; + color: #ccc; + border-bottom:1px solid #fa0; + background: url(/style/halloween/g50.png) repeat center top; + } + +/* navigation / search box "fieldset.search" */ + +form input { + border: 1px solid #fa0; + background: url(/style/halloween/prim.png) repeat center top; + color: #ccc; +} + +form fieldset.search, +form fieldset#advancedsearch { + display: block; + margin:12px 0 12px 0; + width: 100%; + text-align:center; + height:22px; + } + +form fieldset.search input.text, +form fieldset#advancedsearch input.text { + width: 300px; + margin-left:20px; + padding:1px 1px 1px 5px; + font-style: italic; + } + +form fieldset.search input.submit { + display:none; + } + +form fieldset.search a { + padding: 1px 5px; + border: 1px solid #fa0; + margin: 0 6px; + } +form fieldset.search a.sel, +form fieldset.search a:hover { + border: 1px solid #ff0; + color: #ff0; + } + +form div.dropdown a { + display:block; + width:100%; + text-align:center; + font-size: x-small; +} + +form fieldset#advancedsearch { + display:none; +} +form fieldset#advancedsearch input.submit { + padding: 1px; + margin: auto 5px; +} + +/* TODO: advanced search function styling */ + + + +/* browse table tabs */ +ul.maintabs { + display: inline; + margin: 0; + } + +ul.maintabs.notfirst { + display: block; + height: 20px + } + +ul.maintabs li { + display: inline; + list-style-type: none + } + +ul.maintabs li a, +ul.maintabs li b { + float: right; + display: block; + height: 14px; + padding: 1px 7px 5px 7px; + margin: 0 0 0 10px; + } + +ul.maintabs li a { + margin-left: 5px; + border: 1px solid #fa0; + border-bottom: none; + background: url(/style/halloween/prim.png) repeat center top; + } + +ul.maintabs.notfirst li a, +ul.maintabs.notfirst li b { + margin-top: 20px + } + +ul.maintabs.bottom li a, +ul.maintabs.bottom li b { + margin-top: 10px; + padding: 1px 7px 5px 7px + } + +ul.maintabs.bottom li a { + border-bottom: 1px solid #fa0; + border-top: none + } + +ul.maintabs li.left a, +ul.maintabs li.left b { + float: left; + margin-left: 0; + margin-right: 10px + } + +ul.maintabs li b { + margin-left: -2px; + margin-right: -7px + } + +ul.maintabs li.left b { + margin-left: -7px; + margin-right: -2px + } + +ul.maintabs li.tabselected a, +ul.maintabs li a:hover { + padding-bottom: 6px + } + +ul.maintabs.bottom li.tabselected a, +ul.maintabs.bottom li a:hover { + padding-top: 2px; + padding-bottom: 5px; + margin-top: 9px + } + +ul.maintabs.browsetabs li a { + margin-left: 5px; + background: url(/style/halloween/g75.png) repeat center top;; + } + +ul.maintabs.browsetabs li.left a { + margin-left: 0; + margin-right: 5px + } + + +/* game/server browse tables */ +div.mainbox.browse { + padding: 0; + } + +div.mainbox.browse table { + width: 100%; + table-layout:fixed; + border-collapse:collapse + } + +div.mainbox.browse table thead td { + font-weight: bold; + } + +div.mainbox.browse table thead tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:0; + border-bottom:1px solid #fa0; + color: #fa0; + padding:3px 10px 3px 5px; + font-weight:bold; + background: url(/style/halloween/g75.png) repeat center top; + } + +div.mainbox.browse table tfoot tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:1px solid #fa0; + color: #ccc; + padding:3px 10px 3px 5px; + } + +div.mainbox.browse table tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + padding:1px 10px 1px 5px; + font-size:10pt; + } + +div.mainbox.browse table tr.s td a { + color: #ccc; + } + +div.mainbox.browse table tr.s td a:hover { + color: #ff0; + } + +div.mainbox.browse table tr.odd { + background: url(/style/halloween/prim.png) repeat center top; + } + +/* specific game list table columns */ +div.mainbox.browse.gamelist table tr td.tc1 { + text-align:left; + padding-left:20px + } + +div.mainbox.browse.gamelist table tr td.tc2 { + width:100px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } + +div.mainbox.browse.gamelist table tr td.tc3 { + width:200px; + } + +/* specific serverlist table columns */ +div.mainbox.browse.serverlist table tr td.tc1 { + width:10px; + background-size: 20px 15px; + background-position: 50%; + background-repeat: no-repeat; + } + +div.mainbox.browse.serverlist table tr td.tc2 { + text-align:left; + } + +div.mainbox.browse.serverlist table tr td.tc3 { + width:46px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } +div.mainbox.browse.serverlist table tr td.tc3.icon a { + display:block; + margin:0 auto; + height:16px; + width:16px; +} + +div.mainbox.browse.serverlist table tr td.tc4 { + width:90px;text-align:left + } + +div.mainbox.browse.serverlist table tr td.tc5 { + width:70px; + text-align:center + } + +div.mainbox.browse.serverlist table tr td.tc6 { + width:140px; + text-align:left + } + + +/* serverinfo details */ +div.mainbox.detail { + padding:0 0 12px 0; + } +div.mainbox.detail div.header { + margin:0 0 12pt 0; + padding: 0; + display:inline-block; + width:100%; + height:48px; + } + +div.mainbox.detail div.header h1 { + font-weight:normal; + padding: 15px 15px 0 15px; + white-space: nowrap; + overflow:hidden; + display:block; + } + +div.mainbox.detail div.header div.serverflags { + float:right; + overflow:hidden; +} +div.mainbox.detail div.header div.serverflags div { + width:48px; + height:48px; + display:inline-block; + border-left:1px solid #fa0; + background: url(/style/halloween/prim.png) repeat center top; +} + +/* server flag icons */ +div.mainbox.detail div.header div.serverflags div.direct {background: #131} +div.mainbox.detail div.header div.serverflags div.manual {background: #311} +div.mainbox.detail div.header div.serverflags div.authed {background: #131} +div.mainbox.detail div.header div.serverflags div.noauthed {background: #311} +div.mainbox.detail div.header div.serverflags div.noblacklist {background: #131} +div.mainbox.detail div.header div.serverflags div.blacklist {background: #311} +div.mainbox.detail div.header div.serverflags div.nopasswd {background: #131} +div.mainbox.detail div.header div.serverflags div.passwd {background: #311} + + +div.mainbox.detail table { + margin-bottom: 20px; + table-layout:fixed; + border-collapse:collapse; + text-align:left; + } +div.mainbox.detail table tr th { + font-weight:bold; + padding: 2px 8px; + margin-bottom:12pt; + border-bottom: 1px solid #552500; + color: #ccc; + } +div.mainbox.detail table tr th.wc1 { + width:170px + } +div.mainbox.detail table tr td { + vertical-align:top; + padding:6px 5px 4px 15px; + } +div.mainbox.detail table tr td img.flag { + margin:-4px 2px -4px 0; + height:20px; + width:30px; + } +div.mainbox.detail table tr td input, +div.mainbox.detail table tr td textarea { + color: #ccc; + width:99%; + padding: 3px 1px 2px 5px; + border: 1px solid #0af; + font-family:"Lucida Console"; + font-size: 8pt; + background: url(/style/halloween/prim.png) repeat center top; + } +div.mainbox.detail table.serverinfo, +div.mainbox.detail table.gameinfo { + width:63%; + } +div.mainbox.detail table { + width:96%; + } +div.mainbox.detail div.container { + float:right; + margin: 0 30px 8px 0; + } +div.mainbox.detail div.container div.thumbnail { + border:1px solid #552500; + display:block; + box-shadow: 1px 1px 2px #552500; + background: url(/style/halloween/prim.png) repeat center top; + } +div.mainbox.detail div.container div.thumbnail img { + height:256px; + width:256px; + border:1px solid #ccc; + display:block; + margin:10px 10px 2px 10px + } +div.mainbox.detail div.container div.thumbnail span { + text-align: right; + font-weight: normal; + padding:0 15px 4px 5px; + display:block; + font-size:x-small + } +div.mainbox.detail div.container div.updatenote { + padding: 2px 0 7px 0; + display:block; + font-style: italic; + font-size: x-small; + text-align: right; +} + +div.mainbox.detail div.container table.mapinfo { + width: 280px; + margin-bottom:0; + } +div.mainbox.detail div.container table.mapinfo tr td.wc1{ + width: 80px; + } +div.mainbox.detail table.players {text-align:left;} +div.mainbox.detail table.players tr.odd { + background: url(/style/halloween/prim.png) repeat center top; + } +div.mainbox.detail table.players tr td { + padding:1px 5px 0px 15px; + overflow:hidden; + white-space: nowrap; + } +div.mainbox.detail table.players tr th.frags {width:50px} +div.mainbox.detail table.players tr th.mesh {width:140px} +div.mainbox.detail table.players tr th.skin {width:140px} +div.mainbox.detail table.players tr th.ping {width:50px} + +div.mainbox.detail table.shareopts tr th a { + color: #ccc; +} +div.mainbox.detail table.shareopts tr td { + border-right:1px solid #552500; + border-bottom:1px solid #552500; + font-family:"Lucida Console"; + font-size: 8pt; + text-align:left; + background: url(/style/halloween/prim.png) repeat center top; +} + +/* warning box */ +div.mainbox.warning { + color:#ccc; + background-color: #411; + border: 1px solid #c00; +} +div.mainbox.warning div.header { + border-bottom:1px solid #c00; + background: #200; + color: #ccc; +} + +div.mainbox.warning div.header h1{ + color: #ccc; +} + +div.mainbox div.description { + display: block; + width: 500px; + margin: 10px auto + } + +span.hilit { + font-style: italic; + padding: 1px; + background: url(/style/halloween/g50.png) repeat center top; +} + +.r {color:#f55} +.o {color:#c80} +.y {color:#ff3} +.g {color:#3f3} +.b {color:#33f} diff --git a/s/style/newbies/conf b/s/style/newbies/conf new file mode 100755 index 0000000..c7198ec --- /dev/null +++ b/s/style/newbies/conf @@ -0,0 +1,20 @@ +// newbiesplayground.net + +name newbies +author Strategy + +// backgrounds +bodybg #222 body.gif +boxbg1 #333 +boxbg2 #111 +boxbg3 #222 +shadow #2d851f + +// text +textcol1 #ccc +textcol2 #2d851f +textcol3 #3abe25 +textcol4 #666 + +// logos +bglogo newbs2.png diff --git a/s/style/newbies/newbs2.png b/s/style/newbies/newbs2.png Binary files differnew file mode 100755 index 0000000..3f559c3 --- /dev/null +++ b/s/style/newbies/newbs2.png diff --git a/s/style/newbies/style.css b/s/style/newbies/style.css new file mode 100644 index 0000000..8ffb4c7 --- /dev/null +++ b/s/style/newbies/style.css @@ -0,0 +1,558 @@ +/* * * * * * * * * * * * * * * * * * *\ +* Master Server Web Interface * +* A website by Darkelarious * +* See COPYING for additional details * +* on re-use. * +\* * * * * * * * * * * * * * * * * * */ + +/* Theme written by Darkelarious */ + +/*** Global ***/ +* { + margin: 0; + padding: 0; + border: 0; + outline:0; + } + +body { + text-align: center; + height: 100%; + color: #ccc; + font-family: 'Verdana'; + font-size: 10pt; + background: #222 url(/style/newbies/body.gif) repeat center top fixed; + } + +p { + margin-bottom:12pt; + } + +a, a:visited { + text-decoration: none; + color: #2d851f; + } + +a:hover { + color: #3abe25; + text-decoration: none; + } + +#body { + text-align: left; + width: 900px; + margin: 0 auto; + min-height: 100%; + background: url(/style/newbies/newbs2.png) no-repeat center 10px fixed; + padding-top: 101px; + background-size: 500px; + } + +#footer { + padding: 90px 0 40px 0; + text-align:center; + font-size : x-small; + clear:both + } + +#footer a { + text-decoration: underline; + } + + +/* mainboxes */ +div.mainbox { + border: 1px solid #2d851f; + margin-bottom:21px; + padding: 5px; + box-shadow: 2px 2px 5px #2d851f; + background: #333; + } + +div.mainbox h1, +div.mainbox h2, +div.mainbox h3 { + margin: -5px 0 10px 0; + text-decoration: none; + font-family: Tahoma; + font-weight: normal; + font-size: 16pt; + color: #2d851f; + } + +div.mainbox h2 { + margin: 5px 0 5px 5px; + font-size: 12pt; + } +div.mainbox h3 { + margin: 5px 0 5px 10px; + font-size: 11pt; +} + +div.mainbox p, +div.mainbox ul, +div.mainbox ol { + margin: 5px 16px 0 8px; + padding: 0 5px 5px 25px; + text-align:left; + font-size: 9pt; + } +div.mainbox ul, +div.mainbox ol { + margin-left:20px; + } + + +div.mainbox div.header { + margin: -5px 2px 10px -5px; + padding:10px 0 0 10px; + display:block; + width:100%; + color: #ccc; + border-bottom:1px solid #2d851f; + background: #111; + } + +/* navigation / search box "fieldset.search" */ + +form input { + border: 1px solid #2d851f; + background: #222; + color: #ccc; +} + +form fieldset.search, +form fieldset#advancedsearch { + display: block; + margin:12px 0 12px 0; + width: 100%; + text-align:center; + height:22px; + } + +form fieldset.search input.text, +form fieldset#advancedsearch input.text { + width: 300px; + margin-left:20px; + padding:1px 1px 1px 5px; + font-style: italic; + } + +form fieldset.search input.submit { + display:none; + } + +form fieldset.search a { + padding: 1px 5px; + border: 1px solid #2d851f; + margin: 0 6px; + } +form fieldset.search a.sel, +form fieldset.search a:hover { + border: 1px solid #3abe25; + color: #3abe25; + } + +form div.dropdown a { + display:block; + width:100%; + text-align:center; + font-size: x-small; +} + +form fieldset#advancedsearch { + display:none; +} +form fieldset#advancedsearch input.submit { + padding: 1px; + margin: auto 5px; +} + +/* TODO: advanced search function styling */ + + + +/* browse table tabs */ +ul.maintabs { + display: inline; + margin: 0; + } + +ul.maintabs.notfirst { + display: block; + height: 20px + } + +ul.maintabs li { + display: inline; + list-style-type: none + } + +ul.maintabs li a, +ul.maintabs li b { + float: right; + display: block; + height: 14px; + padding: 1px 7px 5px 7px; + margin: 0 0 0 10px; + } + +ul.maintabs li a { + margin-left: 5px; + border: 1px solid #2d851f; + border-bottom: none; + background: #222; + } + +ul.maintabs.notfirst li a, +ul.maintabs.notfirst li b { + margin-top: 20px + } + +ul.maintabs.bottom li a, +ul.maintabs.bottom li b { + margin-top: 10px; + padding: 1px 7px 5px 7px + } + +ul.maintabs.bottom li a { + border-bottom: 1px solid #2d851f; + border-top: none + } + +ul.maintabs li.left a, +ul.maintabs li.left b { + float: left; + margin-left: 0; + margin-right: 10px + } + +ul.maintabs li b { + margin-left: -2px; + margin-right: -7px + } + +ul.maintabs li.left b { + margin-left: -7px; + margin-right: -2px + } + +ul.maintabs li.tabselected a, +ul.maintabs li a:hover { + padding-bottom: 6px + } + +ul.maintabs.bottom li.tabselected a, +ul.maintabs.bottom li a:hover { + padding-top: 2px; + padding-bottom: 5px; + margin-top: 9px + } + +ul.maintabs.browsetabs li a { + margin-left: 5px; + background: #333;; + } + +ul.maintabs.browsetabs li.left a { + margin-left: 0; + margin-right: 5px + } + + +/* game/server browse tables */ +div.mainbox.browse { + padding: 0; + } + +div.mainbox.browse table { + width: 100%; + table-layout:fixed; + border-collapse:collapse + } + +div.mainbox.browse table thead td { + font-weight: bold; + } + +div.mainbox.browse table thead tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:0; + border-bottom:1px solid #2d851f; + color: #2d851f; + padding:3px 10px 3px 5px; + font-weight:bold; + background: #333; + } + +div.mainbox.browse table tfoot tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:1px solid #2d851f; + color: #ccc; + padding:3px 10px 3px 5px; + } + +div.mainbox.browse table tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + padding:1px 10px 1px 5px; + font-size:10pt; + } + +div.mainbox.browse table tr.s td a { + color: #ccc; + } + +div.mainbox.browse table tr.s td a:hover { + color: #3abe25; + } + +div.mainbox.browse table tr.odd { + background: #222; + } + +/* specific game list table columns */ +div.mainbox.browse.gamelist table tr td.tc1 { + text-align:left; + padding-left:20px + } + +div.mainbox.browse.gamelist table tr td.tc2 { + width:100px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } + +div.mainbox.browse.gamelist table tr td.tc3 { + width:200px; + } + +/* specific serverlist table columns */ +div.mainbox.browse.serverlist table tr td.tc1 { + width:10px; + background-size: 20px 15px; + background-position: 50%; + background-repeat: no-repeat; + } + +div.mainbox.browse.serverlist table tr td.tc2 { + text-align:left; + } + +div.mainbox.browse.serverlist table tr td.tc3 { + width:46px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } +div.mainbox.browse.serverlist table tr td.tc3.icon a { + display:block; + margin:0 auto; + height:16px; + width:16px; +} + +div.mainbox.browse.serverlist table tr td.tc4 { + width:90px;text-align:left + } + +div.mainbox.browse.serverlist table tr td.tc5 { + width:70px; + text-align:center + } + +div.mainbox.browse.serverlist table tr td.tc6 { + width:140px; + text-align:left + } + + +/* serverinfo details */ +div.mainbox.detail { + padding:0 0 12px 0; + } +div.mainbox.detail div.header { + margin:0 0 12pt 0; + padding: 0; + display:inline-block; + width:100%; + height:48px; + } + +div.mainbox.detail div.header h1 { + font-weight:normal; + padding: 15px 15px 0 15px; + white-space: nowrap; + overflow:hidden; + display:block; + } + +div.mainbox.detail div.header div.serverflags { + float:right; + overflow:hidden; +} +div.mainbox.detail div.header div.serverflags div { + width:48px; + height:48px; + display:inline-block; + border-left:1px solid #2d851f; + background: #222; +} + +/* server flag icons */ +div.mainbox.detail div.header div.serverflags div.direct {background: #131} +div.mainbox.detail div.header div.serverflags div.manual {background: #311} +div.mainbox.detail div.header div.serverflags div.authed {background: #131} +div.mainbox.detail div.header div.serverflags div.noauthed {background: #311} +div.mainbox.detail div.header div.serverflags div.noblacklist {background: #131} +div.mainbox.detail div.header div.serverflags div.blacklist {background: #311} +div.mainbox.detail div.header div.serverflags div.nopasswd {background: #131} +div.mainbox.detail div.header div.serverflags div.passwd {background: #311} + + +div.mainbox.detail table { + margin-bottom: 20px; + table-layout:fixed; + border-collapse:collapse; + text-align:left; + } +div.mainbox.detail table tr th { + font-weight:bold; + padding: 2px 8px; + margin-bottom:12pt; + border-bottom: 1px solid #666; + color: #ccc; + } +div.mainbox.detail table tr th.wc1 { + width:170px + } +div.mainbox.detail table tr td { + vertical-align:top; + padding:6px 5px 4px 15px; + } +div.mainbox.detail table tr td img.flag { + margin:-4px 2px -4px 0; + height:20px; + width:30px; + } +div.mainbox.detail table tr td input, +div.mainbox.detail table tr td textarea { + color: #ccc; + width:99%; + padding: 3px 1px 2px 5px; + border: 1px solid #0af; + font-family:"Lucida Console"; + font-size: 8pt; + background: #222; + } +div.mainbox.detail table.serverinfo, +div.mainbox.detail table.gameinfo { + width:63%; + } +div.mainbox.detail table { + width:96%; + } +div.mainbox.detail div.container { + float:right; + margin: 0 30px 8px 0; + } +div.mainbox.detail div.container div.thumbnail { + border:1px solid #666; + display:block; + box-shadow: 1px 1px 2px #2d851f; + background: #222; + } +div.mainbox.detail div.container div.thumbnail img { + height:256px; + width:256px; + border:1px solid #ccc; + display:block; + margin:10px 10px 2px 10px + } +div.mainbox.detail div.container div.thumbnail span { + text-align: right; + font-weight: normal; + padding:0 15px 4px 5px; + display:block; + font-size:x-small + } +div.mainbox.detail div.container div.updatenote { + padding: 2px 0 7px 0; + display:block; + font-style: italic; + font-size: x-small; + text-align: right; +} + +div.mainbox.detail div.container table.mapinfo { + width: 280px; + margin-bottom:0; + } +div.mainbox.detail div.container table.mapinfo tr td.wc1{ + width: 80px; + } +div.mainbox.detail table.players {text-align:left;} +div.mainbox.detail table.players tr.odd { + background: #222; + } +div.mainbox.detail table.players tr td { + padding:1px 5px 0px 15px; + overflow:hidden; + white-space: nowrap; + } +div.mainbox.detail table.players tr th.frags {width:50px} +div.mainbox.detail table.players tr th.mesh {width:140px} +div.mainbox.detail table.players tr th.skin {width:140px} +div.mainbox.detail table.players tr th.ping {width:50px} + +div.mainbox.detail table.shareopts tr th a { + color: #ccc; +} +div.mainbox.detail table.shareopts tr td { + border-right:1px solid #666; + border-bottom:1px solid #666; + font-family:"Lucida Console"; + font-size: 8pt; + text-align:left; + background: #222; +} + +/* warning box */ +div.mainbox.warning { + color:#ccc; + background-color: #411; + border: 1px solid #c00; +} +div.mainbox.warning div.header { + border-bottom:1px solid #c00; + background: #200; + color: #ccc; +} + +div.mainbox.warning div.header h1{ + color: #ccc; +} + +div.mainbox div.description { + display: block; + width: 500px; + margin: 10px auto + } + +span.hilit { + font-style: italic; + padding: 1px; + background: #111; +} + +.r {color:#f55} +.o {color:#c80} +.y {color:#ff3} +.g {color:#3f3} +.b {color:#33f} diff --git a/s/style/oldunreal/conf b/s/style/oldunreal/conf new file mode 100755 index 0000000..7c5910b --- /dev/null +++ b/s/style/oldunreal/conf @@ -0,0 +1,20 @@ +// Old Unreal + +name OldUnreal +author Smirftsch + +// backgrounds +bodybg #000 +boxbg1 #333 +boxbg2 #111 +boxbg3 #1c1c1c +shadow #222 + +// text +textcol1 #eee +textcol2 #0f0 +textcol3 #090 +textcol4 #777 + +// logos +bglogo oldunreal.png diff --git a/s/style/oldunreal/oldunreal.png b/s/style/oldunreal/oldunreal.png Binary files differnew file mode 100755 index 0000000..b836265 --- /dev/null +++ b/s/style/oldunreal/oldunreal.png diff --git a/s/style/oldunreal/style.css b/s/style/oldunreal/style.css new file mode 100644 index 0000000..d03b829 --- /dev/null +++ b/s/style/oldunreal/style.css @@ -0,0 +1,558 @@ +/* * * * * * * * * * * * * * * * * * *\ +* Master Server Web Interface * +* A website by Darkelarious * +* See COPYING for additional details * +* on re-use. * +\* * * * * * * * * * * * * * * * * * */ + +/* Theme written by Darkelarious */ + +/*** Global ***/ +* { + margin: 0; + padding: 0; + border: 0; + outline:0; + } + +body { + text-align: center; + height: 100%; + color: #eee; + font-family: 'Verdana'; + font-size: 10pt; + background: #000; + } + +p { + margin-bottom:12pt; + } + +a, a:visited { + text-decoration: none; + color: #0f0; + } + +a:hover { + color: #090; + text-decoration: none; + } + +#body { + text-align: left; + width: 900px; + margin: 0 auto; + min-height: 100%; + background: url(/style/oldunreal/oldunreal.png) no-repeat center 10px fixed; + padding-top: 102px; + background-size: 500px; + } + +#footer { + padding: 90px 0 40px 0; + text-align:center; + font-size : x-small; + clear:both + } + +#footer a { + text-decoration: underline; + } + + +/* mainboxes */ +div.mainbox { + border: 1px solid #0f0; + margin-bottom:21px; + padding: 5px; + box-shadow: 2px 2px 5px #222; + background: #333; + } + +div.mainbox h1, +div.mainbox h2, +div.mainbox h3 { + margin: -5px 0 10px 0; + text-decoration: none; + font-family: Tahoma; + font-weight: normal; + font-size: 16pt; + color: #0f0; + } + +div.mainbox h2 { + margin: 5px 0 5px 5px; + font-size: 12pt; + } +div.mainbox h3 { + margin: 5px 0 5px 10px; + font-size: 11pt; +} + +div.mainbox p, +div.mainbox ul, +div.mainbox ol { + margin: 5px 16px 0 8px; + padding: 0 5px 5px 25px; + text-align:left; + font-size: 9pt; + } +div.mainbox ul, +div.mainbox ol { + margin-left:20px; + } + + +div.mainbox div.header { + margin: -5px 2px 10px -5px; + padding:10px 0 0 10px; + display:block; + width:100%; + color: #eee; + border-bottom:1px solid #0f0; + background: #111; + } + +/* navigation / search box "fieldset.search" */ + +form input { + border: 1px solid #0f0; + background: #1c1c1c; + color: #eee; +} + +form fieldset.search, +form fieldset#advancedsearch { + display: block; + margin:12px 0 12px 0; + width: 100%; + text-align:center; + height:22px; + } + +form fieldset.search input.text, +form fieldset#advancedsearch input.text { + width: 300px; + margin-left:20px; + padding:1px 1px 1px 5px; + font-style: italic; + } + +form fieldset.search input.submit { + display:none; + } + +form fieldset.search a { + padding: 1px 5px; + border: 1px solid #0f0; + margin: 0 6px; + } +form fieldset.search a.sel, +form fieldset.search a:hover { + border: 1px solid #090; + color: #090; + } + +form div.dropdown a { + display:block; + width:100%; + text-align:center; + font-size: x-small; +} + +form fieldset#advancedsearch { + display:none; +} +form fieldset#advancedsearch input.submit { + padding: 1px; + margin: auto 5px; +} + +/* TODO: advanced search function styling */ + + + +/* browse table tabs */ +ul.maintabs { + display: inline; + margin: 0; + } + +ul.maintabs.notfirst { + display: block; + height: 20px + } + +ul.maintabs li { + display: inline; + list-style-type: none + } + +ul.maintabs li a, +ul.maintabs li b { + float: right; + display: block; + height: 14px; + padding: 1px 7px 5px 7px; + margin: 0 0 0 10px; + } + +ul.maintabs li a { + margin-left: 5px; + border: 1px solid #0f0; + border-bottom: none; + background: #1c1c1c; + } + +ul.maintabs.notfirst li a, +ul.maintabs.notfirst li b { + margin-top: 20px + } + +ul.maintabs.bottom li a, +ul.maintabs.bottom li b { + margin-top: 10px; + padding: 1px 7px 5px 7px + } + +ul.maintabs.bottom li a { + border-bottom: 1px solid #0f0; + border-top: none + } + +ul.maintabs li.left a, +ul.maintabs li.left b { + float: left; + margin-left: 0; + margin-right: 10px + } + +ul.maintabs li b { + margin-left: -2px; + margin-right: -7px + } + +ul.maintabs li.left b { + margin-left: -7px; + margin-right: -2px + } + +ul.maintabs li.tabselected a, +ul.maintabs li a:hover { + padding-bottom: 6px + } + +ul.maintabs.bottom li.tabselected a, +ul.maintabs.bottom li a:hover { + padding-top: 2px; + padding-bottom: 5px; + margin-top: 9px + } + +ul.maintabs.browsetabs li a { + margin-left: 5px; + background: #333;; + } + +ul.maintabs.browsetabs li.left a { + margin-left: 0; + margin-right: 5px + } + + +/* game/server browse tables */ +div.mainbox.browse { + padding: 0; + } + +div.mainbox.browse table { + width: 100%; + table-layout:fixed; + border-collapse:collapse + } + +div.mainbox.browse table thead td { + font-weight: bold; + } + +div.mainbox.browse table thead tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:0; + border-bottom:1px solid #0f0; + color: #0f0; + padding:3px 10px 3px 5px; + font-weight:bold; + background: #333; + } + +div.mainbox.browse table tfoot tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:1px solid #0f0; + color: #eee; + padding:3px 10px 3px 5px; + } + +div.mainbox.browse table tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + padding:1px 10px 1px 5px; + font-size:10pt; + } + +div.mainbox.browse table tr.s td a { + color: #eee; + } + +div.mainbox.browse table tr.s td a:hover { + color: #090; + } + +div.mainbox.browse table tr.odd { + background: #1c1c1c; + } + +/* specific game list table columns */ +div.mainbox.browse.gamelist table tr td.tc1 { + text-align:left; + padding-left:20px + } + +div.mainbox.browse.gamelist table tr td.tc2 { + width:100px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } + +div.mainbox.browse.gamelist table tr td.tc3 { + width:200px; + } + +/* specific serverlist table columns */ +div.mainbox.browse.serverlist table tr td.tc1 { + width:10px; + background-size: 20px 15px; + background-position: 50%; + background-repeat: no-repeat; + } + +div.mainbox.browse.serverlist table tr td.tc2 { + text-align:left; + } + +div.mainbox.browse.serverlist table tr td.tc3 { + width:46px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } +div.mainbox.browse.serverlist table tr td.tc3.icon a { + display:block; + margin:0 auto; + height:16px; + width:16px; +} + +div.mainbox.browse.serverlist table tr td.tc4 { + width:90px;text-align:left + } + +div.mainbox.browse.serverlist table tr td.tc5 { + width:70px; + text-align:center + } + +div.mainbox.browse.serverlist table tr td.tc6 { + width:140px; + text-align:left + } + + +/* serverinfo details */ +div.mainbox.detail { + padding:0 0 12px 0; + } +div.mainbox.detail div.header { + margin:0 0 12pt 0; + padding: 0; + display:inline-block; + width:100%; + height:48px; + } + +div.mainbox.detail div.header h1 { + font-weight:normal; + padding: 15px 15px 0 15px; + white-space: nowrap; + overflow:hidden; + display:block; + } + +div.mainbox.detail div.header div.serverflags { + float:right; + overflow:hidden; +} +div.mainbox.detail div.header div.serverflags div { + width:48px; + height:48px; + display:inline-block; + border-left:1px solid #0f0; + background: #1c1c1c; +} + +/* server flag icons */ +div.mainbox.detail div.header div.serverflags div.direct {background: #131} +div.mainbox.detail div.header div.serverflags div.manual {background: #311} +div.mainbox.detail div.header div.serverflags div.authed {background: #131} +div.mainbox.detail div.header div.serverflags div.noauthed {background: #311} +div.mainbox.detail div.header div.serverflags div.noblacklist {background: #131} +div.mainbox.detail div.header div.serverflags div.blacklist {background: #311} +div.mainbox.detail div.header div.serverflags div.nopasswd {background: #131} +div.mainbox.detail div.header div.serverflags div.passwd {background: #311} + + +div.mainbox.detail table { + margin-bottom: 20px; + table-layout:fixed; + border-collapse:collapse; + text-align:left; + } +div.mainbox.detail table tr th { + font-weight:bold; + padding: 2px 8px; + margin-bottom:12pt; + border-bottom: 1px solid #777; + color: #eee; + } +div.mainbox.detail table tr th.wc1 { + width:170px + } +div.mainbox.detail table tr td { + vertical-align:top; + padding:6px 5px 4px 15px; + } +div.mainbox.detail table tr td img.flag { + margin:-4px 2px -4px 0; + height:20px; + width:30px; + } +div.mainbox.detail table tr td input, +div.mainbox.detail table tr td textarea { + color: #ccc; + width:99%; + padding: 3px 1px 2px 5px; + border: 1px solid #0af; + font-family:"Lucida Console"; + font-size: 8pt; + background: #1c1c1c; + } +div.mainbox.detail table.serverinfo, +div.mainbox.detail table.gameinfo { + width:63%; + } +div.mainbox.detail table { + width:96%; + } +div.mainbox.detail div.container { + float:right; + margin: 0 30px 8px 0; + } +div.mainbox.detail div.container div.thumbnail { + border:1px solid #777; + display:block; + box-shadow: 1px 1px 2px #222; + background: #1c1c1c; + } +div.mainbox.detail div.container div.thumbnail img { + height:256px; + width:256px; + border:1px solid #eee; + display:block; + margin:10px 10px 2px 10px + } +div.mainbox.detail div.container div.thumbnail span { + text-align: right; + font-weight: normal; + padding:0 15px 4px 5px; + display:block; + font-size:x-small + } +div.mainbox.detail div.container div.updatenote { + padding: 2px 0 7px 0; + display:block; + font-style: italic; + font-size: x-small; + text-align: right; +} + +div.mainbox.detail div.container table.mapinfo { + width: 280px; + margin-bottom:0; + } +div.mainbox.detail div.container table.mapinfo tr td.wc1{ + width: 80px; + } +div.mainbox.detail table.players {text-align:left;} +div.mainbox.detail table.players tr.odd { + background: #1c1c1c; + } +div.mainbox.detail table.players tr td { + padding:1px 5px 0px 15px; + overflow:hidden; + white-space: nowrap; + } +div.mainbox.detail table.players tr th.frags {width:50px} +div.mainbox.detail table.players tr th.mesh {width:140px} +div.mainbox.detail table.players tr th.skin {width:140px} +div.mainbox.detail table.players tr th.ping {width:50px} + +div.mainbox.detail table.shareopts tr th a { + color: #eee; +} +div.mainbox.detail table.shareopts tr td { + border-right:1px solid #777; + border-bottom:1px solid #777; + font-family:"Lucida Console"; + font-size: 8pt; + text-align:left; + background: #1c1c1c; +} + +/* warning box */ +div.mainbox.warning { + color:#ccc; + background-color: #411; + border: 1px solid #c00; +} +div.mainbox.warning div.header { + border-bottom:1px solid #c00; + background: #200; + color: #ccc; +} + +div.mainbox.warning div.header h1{ + color: #ccc; +} + +div.mainbox div.description { + display: block; + width: 500px; + margin: 10px auto + } + +span.hilit { + font-style: italic; + padding: 1px; + background: #111; +} + +.r {color:#f55} +.o {color:#c80} +.y {color:#ff3} +.g {color:#3f3} +.b {color:#33f} diff --git a/s/style/rune/333runic-orig.png b/s/style/rune/333runic-orig.png Binary files differnew file mode 100755 index 0000000..92e9754 --- /dev/null +++ b/s/style/rune/333runic-orig.png diff --git a/s/style/rune/333runic.png b/s/style/rune/333runic.png Binary files differnew file mode 100755 index 0000000..973f2bc --- /dev/null +++ b/s/style/rune/333runic.png diff --git a/s/style/rune/b50.png b/s/style/rune/b50.png Binary files differnew file mode 100755 index 0000000..8d33024 --- /dev/null +++ b/s/style/rune/b50.png diff --git a/s/style/rune/b75.png b/s/style/rune/b75.png Binary files differnew file mode 100755 index 0000000..9e1406e --- /dev/null +++ b/s/style/rune/b75.png diff --git a/s/style/rune/background.jpg b/s/style/rune/background.jpg Binary files differnew file mode 100755 index 0000000..186fe4c --- /dev/null +++ b/s/style/rune/background.jpg diff --git a/s/style/rune/conf b/s/style/rune/conf new file mode 100755 index 0000000..788d530 --- /dev/null +++ b/s/style/rune/conf @@ -0,0 +1,18 @@ +name Rune +author Darkelarious + +// backgrounds +bodybg #000 background.jpg +boxbg1 g75.png +boxbg2 g50.png +boxbg3 #210 +shadow #552500 + +// text +textcol1 #ccc +textcol2 #fa0 +textcol3 #ff0 +textcol4 #552500 + +// logos +bglogo 333runic.png diff --git a/s/style/rune/conf2 b/s/style/rune/conf2 new file mode 100755 index 0000000..afd3dbb --- /dev/null +++ b/s/style/rune/conf2 @@ -0,0 +1,29 @@ +// Basic greyscale theme with 333networks logo +// see util/skingen/colortypes.txt for descriptions of colors. + +name halloween +author Darkelarious + +bodybg #000 background.jpg +bglogo 333runic.png + +boxbg1 g75.png +boxbg2 g50.png +boxbg3 #210 + +glow #552500 +shadow #fa0 + +textcol1 #ccc +textcol2 #aaa + +headercol #fa0 +themecol1 #552500 +themecol2 #888 +themecol3 #333 + +link #fa0 +linkhover #ff0 + + + diff --git a/s/style/rune/g50.png b/s/style/rune/g50.png Binary files differnew file mode 100755 index 0000000..2cca936 --- /dev/null +++ b/s/style/rune/g50.png diff --git a/s/style/rune/g75.png b/s/style/rune/g75.png Binary files differnew file mode 100755 index 0000000..f7099c3 --- /dev/null +++ b/s/style/rune/g75.png diff --git a/s/style/rune/style.css b/s/style/rune/style.css new file mode 100644 index 0000000..f8c55e9 --- /dev/null +++ b/s/style/rune/style.css @@ -0,0 +1,558 @@ +/* * * * * * * * * * * * * * * * * * *\ +* Master Server Web Interface * +* A website by Darkelarious * +* See COPYING for additional details * +* on re-use. * +\* * * * * * * * * * * * * * * * * * */ + +/* Theme written by Darkelarious */ + +/*** Global ***/ +* { + margin: 0; + padding: 0; + border: 0; + outline:0; + } + +body { + text-align: center; + height: 100%; + color: #ccc; + font-family: 'Verdana'; + font-size: 10pt; + background: #000 url(/style/rune/background.jpg) repeat center top fixed; + } + +p { + margin-bottom:12pt; + } + +a, a:visited { + text-decoration: none; + color: #fa0; + } + +a:hover { + color: #ff0; + text-decoration: none; + } + +#body { + text-align: left; + width: 900px; + margin: 0 auto; + min-height: 100%; + background: url(/style/rune/333runic.png) no-repeat center 10px fixed; + padding-top: 145px; + background-size: 500px; + } + +#footer { + padding: 90px 0 40px 0; + text-align:center; + font-size : x-small; + clear:both + } + +#footer a { + text-decoration: underline; + } + + +/* mainboxes */ +div.mainbox { + border: 1px solid #fa0; + margin-bottom:21px; + padding: 5px; + box-shadow: 2px 2px 5px #552500; + background: url(/style/rune/g75.png) repeat center top; + } + +div.mainbox h1, +div.mainbox h2, +div.mainbox h3 { + margin: -5px 0 10px 0; + text-decoration: none; + font-family: Tahoma; + font-weight: normal; + font-size: 16pt; + color: #fa0; + } + +div.mainbox h2 { + margin: 5px 0 5px 5px; + font-size: 12pt; + } +div.mainbox h3 { + margin: 5px 0 5px 10px; + font-size: 11pt; +} + +div.mainbox p, +div.mainbox ul, +div.mainbox ol { + margin: 5px 16px 0 8px; + padding: 0 5px 5px 25px; + text-align:left; + font-size: 9pt; + } +div.mainbox ul, +div.mainbox ol { + margin-left:20px; + } + + +div.mainbox div.header { + margin: -5px 2px 10px -5px; + padding:10px 0 0 10px; + display:block; + width:100%; + color: #ccc; + border-bottom:1px solid #fa0; + background: url(/style/rune/g50.png) repeat center top; + } + +/* navigation / search box "fieldset.search" */ + +form input { + border: 1px solid #fa0; + background: #210; + color: #ccc; +} + +form fieldset.search, +form fieldset#advancedsearch { + display: block; + margin:12px 0 12px 0; + width: 100%; + text-align:center; + height:22px; + } + +form fieldset.search input.text, +form fieldset#advancedsearch input.text { + width: 300px; + margin-left:20px; + padding:1px 1px 1px 5px; + font-style: italic; + } + +form fieldset.search input.submit { + display:none; + } + +form fieldset.search a { + padding: 1px 5px; + border: 1px solid #fa0; + margin: 0 6px; + } +form fieldset.search a.sel, +form fieldset.search a:hover { + border: 1px solid #ff0; + color: #ff0; + } + +form div.dropdown a { + display:block; + width:100%; + text-align:center; + font-size: x-small; +} + +form fieldset#advancedsearch { + display:none; +} +form fieldset#advancedsearch input.submit { + padding: 1px; + margin: auto 5px; +} + +/* TODO: advanced search function styling */ + + + +/* browse table tabs */ +ul.maintabs { + display: inline; + margin: 0; + } + +ul.maintabs.notfirst { + display: block; + height: 20px + } + +ul.maintabs li { + display: inline; + list-style-type: none + } + +ul.maintabs li a, +ul.maintabs li b { + float: right; + display: block; + height: 14px; + padding: 1px 7px 5px 7px; + margin: 0 0 0 10px; + } + +ul.maintabs li a { + margin-left: 5px; + border: 1px solid #fa0; + border-bottom: none; + background: #210; + } + +ul.maintabs.notfirst li a, +ul.maintabs.notfirst li b { + margin-top: 20px + } + +ul.maintabs.bottom li a, +ul.maintabs.bottom li b { + margin-top: 10px; + padding: 1px 7px 5px 7px + } + +ul.maintabs.bottom li a { + border-bottom: 1px solid #fa0; + border-top: none + } + +ul.maintabs li.left a, +ul.maintabs li.left b { + float: left; + margin-left: 0; + margin-right: 10px + } + +ul.maintabs li b { + margin-left: -2px; + margin-right: -7px + } + +ul.maintabs li.left b { + margin-left: -7px; + margin-right: -2px + } + +ul.maintabs li.tabselected a, +ul.maintabs li a:hover { + padding-bottom: 6px + } + +ul.maintabs.bottom li.tabselected a, +ul.maintabs.bottom li a:hover { + padding-top: 2px; + padding-bottom: 5px; + margin-top: 9px + } + +ul.maintabs.browsetabs li a { + margin-left: 5px; + background: url(/style/rune/g75.png) repeat center top;; + } + +ul.maintabs.browsetabs li.left a { + margin-left: 0; + margin-right: 5px + } + + +/* game/server browse tables */ +div.mainbox.browse { + padding: 0; + } + +div.mainbox.browse table { + width: 100%; + table-layout:fixed; + border-collapse:collapse + } + +div.mainbox.browse table thead td { + font-weight: bold; + } + +div.mainbox.browse table thead tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:0; + border-bottom:1px solid #fa0; + color: #fa0; + padding:3px 10px 3px 5px; + font-weight:bold; + background: url(/style/rune/g75.png) repeat center top; + } + +div.mainbox.browse table tfoot tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + border-top:1px solid #fa0; + color: #ccc; + padding:3px 10px 3px 5px; + } + +div.mainbox.browse table tr td { + white-space:nowrap; + overflow:hidden; + text-align:center; + padding:1px 10px 1px 5px; + font-size:10pt; + } + +div.mainbox.browse table tr.s td a { + color: #ccc; + } + +div.mainbox.browse table tr.s td a:hover { + color: #ff0; + } + +div.mainbox.browse table tr.odd { + background: #210; + } + +/* specific game list table columns */ +div.mainbox.browse.gamelist table tr td.tc1 { + text-align:left; + padding-left:20px + } + +div.mainbox.browse.gamelist table tr td.tc2 { + width:100px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } + +div.mainbox.browse.gamelist table tr td.tc3 { + width:200px; + } + +/* specific serverlist table columns */ +div.mainbox.browse.serverlist table tr td.tc1 { + width:10px; + background-size: 20px 15px; + background-position: 50%; + background-repeat: no-repeat; + } + +div.mainbox.browse.serverlist table tr td.tc2 { + text-align:left; + } + +div.mainbox.browse.serverlist table tr td.tc3 { + width:46px; + background-repeat: no-repeat; + background-position: center center; + background-size: 16px 16px; + } +div.mainbox.browse.serverlist table tr td.tc3.icon a { + display:block; + margin:0 auto; + height:16px; + width:16px; +} + +div.mainbox.browse.serverlist table tr td.tc4 { + width:90px;text-align:left + } + +div.mainbox.browse.serverlist table tr td.tc5 { + width:70px; + text-align:center + } + +div.mainbox.browse.serverlist table tr td.tc6 { + width:140px; + text-align:left + } + + +/* serverinfo details */ +div.mainbox.detail { + padding:0 0 12px 0; + } +div.mainbox.detail div.header { + margin:0 0 12pt 0; + padding: 0; + display:inline-block; + width:100%; + height:48px; + } + +div.mainbox.detail div.header h1 { + font-weight:normal; + padding: 15px 15px 0 15px; + white-space: nowrap; + overflow:hidden; + display:block; + } + +div.mainbox.detail div.header div.serverflags { + float:right; + overflow:hidden; +} +div.mainbox.detail div.header div.serverflags div { + width:48px; + height:48px; + display:inline-block; + border-left:1px solid #fa0; + background: #210; +} + +/* server flag icons */ +div.mainbox.detail div.header div.serverflags div.direct {background: #131} +div.mainbox.detail div.header div.serverflags div.manual {background: #311} +div.mainbox.detail div.header div.serverflags div.authed {background: #131} +div.mainbox.detail div.header div.serverflags div.noauthed {background: #311} +div.mainbox.detail div.header div.serverflags div.noblacklist {background: #131} +div.mainbox.detail div.header div.serverflags div.blacklist {background: #311} +div.mainbox.detail div.header div.serverflags div.nopasswd {background: #131} +div.mainbox.detail div.header div.serverflags div.passwd {background: #311} + + +div.mainbox.detail table { + margin-bottom: 20px; + table-layout:fixed; + border-collapse:collapse; + text-align:left; + } +div.mainbox.detail table tr th { + font-weight:bold; + padding: 2px 8px; + margin-bottom:12pt; + border-bottom: 1px solid #552500; + color: #ccc; + } +div.mainbox.detail table tr th.wc1 { + width:170px + } +div.mainbox.detail table tr td { + vertical-align:top; + padding:6px 5px 4px 15px; + } +div.mainbox.detail table tr td img.flag { + margin:-4px 2px -4px 0; + height:20px; + width:30px; + } +div.mainbox.detail table tr td input, +div.mainbox.detail table tr td textarea { + color: #ccc; + width:99%; + padding: 3px 1px 2px 5px; + border: 1px solid #0af; + font-family:"Lucida Console"; + font-size: 8pt; + background: #210; + } +div.mainbox.detail table.serverinfo, +div.mainbox.detail table.gameinfo { + width:63%; + } +div.mainbox.detail table { + width:96%; + } +div.mainbox.detail div.container { + float:right; + margin: 0 30px 8px 0; + } +div.mainbox.detail div.container div.thumbnail { + border:1px solid #552500; + display:block; + box-shadow: 1px 1px 2px #552500; + background: #210; + } +div.mainbox.detail div.container div.thumbnail img { + height:256px; + width:256px; + border:1px solid #ccc; + display:block; + margin:10px 10px 2px 10px + } +div.mainbox.detail div.container div.thumbnail span { + text-align: right; + font-weight: normal; + padding:0 15px 4px 5px; + display:block; + font-size:x-small + } +div.mainbox.detail div.container div.updatenote { + padding: 2px 0 7px 0; + display:block; + font-style: italic; + font-size: x-small; + text-align: right; +} + +div.mainbox.detail div.container table.mapinfo { + width: 280px; + margin-bottom:0; + } +div.mainbox.detail div.container table.mapinfo tr td.wc1{ + width: 80px; + } +div.mainbox.detail table.players {text-align:left;} +div.mainbox.detail table.players tr.odd { + background: #210; + } +div.mainbox.detail table.players tr td { + padding:1px 5px 0px 15px; + overflow:hidden; + white-space: nowrap; + } +div.mainbox.detail table.players tr th.frags {width:50px} +div.mainbox.detail table.players tr th.mesh {width:140px} +div.mainbox.detail table.players tr th.skin {width:140px} +div.mainbox.detail table.players tr th.ping {width:50px} + +div.mainbox.detail table.shareopts tr th a { + color: #ccc; +} +div.mainbox.detail table.shareopts tr td { + border-right:1px solid #552500; + border-bottom:1px solid #552500; + font-family:"Lucida Console"; + font-size: 8pt; + text-align:left; + background: #210; +} + +/* warning box */ +div.mainbox.warning { + color:#ccc; + background-color: #411; + border: 1px solid #c00; +} +div.mainbox.warning div.header { + border-bottom:1px solid #c00; + background: #200; + color: #ccc; +} + +div.mainbox.warning div.header h1{ + color: #ccc; +} + +div.mainbox div.description { + display: block; + width: 500px; + margin: 10px auto + } + +span.hilit { + font-style: italic; + padding: 1px; + background: url(/style/rune/g50.png) repeat center top; +} + +.r {color:#f55} +.o {color:#c80} +.y {color:#ff3} +.g {color:#3f3} +.b {color:#33f} diff --git a/util/skingen.pl b/util/skingen.pl new file mode 100755 index 0000000..4304b88 --- /dev/null +++ b/util/skingen.pl @@ -0,0 +1,182 @@ +#!/usr/bin/perl +use strict; +use warnings; +use Image::Size; +use Cwd 'abs_path'; + +################################################################################ +# CSS "Skin" generator for 333networks web interfaces +# +# Every skin is built in the following way. The SKIN AUTHOR needs to make a +# config file at $ROOT/s/style/SKINNAME/conf +# Here, SKINNAME is a lowercase folder and conf a plaintext file. In this folder +# you can opt to place textures, logos and other pictures used in your skin. +# +# In the conf file you describe the following color codes or textures: +# +# Options: +# +# name example description +# ------------------------------------------------------------------------------ +# name stylename description of the style/name of the style +# author Darkelarious style author (commented in style.css for credits) +# +#// backgrounds +# bodybg #222 body.gif body background (texture) +# boxbg1 #333 box background (texture) +# boxbg2 #111 menu backgrounds, buttons, thumbnail/image boxes (texture) +# boxbg3 #222 odd row accents (texture) +# shadow #222 shadow color (color) +# +# // text +# textcol1 #ccc main text color +# textcol2 #0af primary color for borders, links (color) +# textcol3 #ff0 secondary color for link:hover, actions (color) +# textcol4 #666 accent color for complementing main text color (color) +# +# // logos +# bglogo 333networks.png logo in background (recommended 75 px high max) +# +# ------------------------------------------------------------------------------ +# NOTE: some parameters can be colors, textures or both. (texture) can be both +# images and colors, such as #0af, #0af box.png, box.png, but (color) implies +# color ONLY. +# +# To compile a skin, run the command "./skingen.pl SKINNAME" where skinname is +# the lowercase folder name of your skin. The output is a style.css file in your +# folder. This style name can now be used in your webinterface config file under +# the "style => " option. +# +################################################################################ + +our($ROOT, %S); +BEGIN { ($ROOT = abs_path $0) =~ s{/util/skingen\.pl$}{}; } +use lib "$ROOT/lib"; +use SkinFile; + +# read styles to be compiled from commandline +if (scalar @ARGV) +{ + # for every style name/folder provided + for my $conf (@ARGV) + { + print "Parsing $conf\n"; + writeskin($conf); + } +} +else +{ + # minimalistic help command + print "Use: ./skingen.pl themename\n"; + print "\t themename is a folder like /s/style/themename\n"; + print "\t and contains a conf file with color codes. See\n"; + print "\t also comments in this script for more info.\n"; +} + +# args: theme name +sub writeskin +{ + my $name = shift; + my $skin = SkinFile->new("$ROOT/s/style", $name); + my %o = map +($_ => $skin->get($_)), $skin->get; + + # body background color / image + my @bg = split ' ', $o{bodybg}; + if (substr($bg[0], 0, 1) eq '#') + { + # col + img? + if ($bg[1] && $bg[1] =~ m/^\w+\.(gif|jpeg|jpg|png)$/i) + { + $o{_bodybg} .= "background: $bg[0] url(/style/$name/$bg[1]) repeat center top fixed;"; + } + else + { + $o{_bodybg} = "background: $bg[0];"; + } + } # only img + elsif ($bg[0] =~ m/^\w+\.(gif|jpeg|jpg|png)$/i) + { + $o{_bodybg} = "background: url(/style/$name/$bg[0]) repeat center top fixed;"; + } + + # box background color / image + @bg = split ' ', $o{boxbg1}; + + if (substr($bg[0], 0, 1) eq '#') + { + # col + img? + if ($bg[1] && $bg[1] =~ m/^\w+\.(gif|jpeg|jpg|png)$/i) + { + $o{_boxbg1} .= "background: $bg[0] url(/style/$name/$bg[1]) repeat center top;"; + } + else + { + $o{_boxbg1} = "background: $bg[0];"; + } + } # only img + elsif ($bg[0] =~ m/^\w+\.(gif|jpeg|jpg|png)$/i) + { + $o{_boxbg1} = "background: url(/style/$name/$bg[0]) repeat center top;"; + } + + # box background color / image boxtype 2 + @bg = split ' ', $o{boxbg2}; + if (substr($bg[0], 0, 1) eq '#') + { + # col + img? + if ($bg[1] && $bg[1] =~ m/^\w+\.(gif|jpeg|jpg|png)$/i) + { + $o{_boxbg2} .= "background: $bg[0] url(/style/$name/$bg[1]) repeat center top;"; + } + else + { + $o{_boxbg2} = "background: $bg[0];"; + } + } # only img + elsif ($bg[0] =~ m/^\w+\.(gif|jpeg|jpg|png)$/i) + { + $o{_boxbg2} = "background: url(/style/$name/$bg[0]) repeat center top;"; + } + + # box background color / image boxtype 3 + @bg = split ' ', $o{boxbg3}; + + if (substr($bg[0], 0, 1) eq '#') + { + # col + img? + if ($bg[1] && $bg[1] =~ m/^\w+\.(gif|jpeg|jpg|png)$/i) + { + $o{_boxbg3} .= "background: $bg[0] url(/style/$name/$bg[1]) repeat center top;"; + } + else + { + $o{_boxbg3} = "background: $bg[0];"; + } + } # only img + elsif ($bg[0] =~ m/^\w+\.(gif|jpeg|jpg|png)$/i) + { + $o{_boxbg3} = "background: url(/style/$name/$bg[0]) repeat center top;"; + } + + # site logo (overlay on background) + $o{_bglogo} = ""; + if (-e "$ROOT/s/style/$name/$o{bglogo}") + { + # get height + my ($w, $h) = imgsize("$ROOT/s/style/$name/$o{bglogo}") or die $!; + $o{_bglogo} = "background: url(/style/$name/$o{bglogo}) no-repeat center 10px fixed;"; + $o{_bgpadd} = "padding-top: " . int(500/$w*$h+20) . "px;"; + } + + # write the CSS + open my $CSS, '<', "$ROOT/data/style.css" or die "$ROOT/util/skingen/style.css $!"; + my $css = join '', <$CSS>; + close $CSS; + $css =~ s/\$$_\$/$o{$_}/g for (keys %o); + + my $f = "$ROOT/s/style/$name/style.css"; + open my $SKIN, '>', "$f~" or die $!; + print $SKIN $css; + close $SKIN; + rename "$f~", $f; +} |
