WordPress.org
Get WordPress

Making WordPress.org

Ticket #366: meta-366.diff

File meta-366.diff, 7.1 KB (added by celloexpressions, 12 years ago)

Visual refresh of IRC Logs, including better responsiveness.

  • irc-logger/public_html/chanlog.php

     
    33require dirname(__FILE__) . '/header.php';
    44
    55if ( isset( $_GET['search'] ) ) {
    6         echo "<h1>#" . htmlentities( $_GET['channel'] ) . " search results for &quot;" . htmlentities( $_GET['search'] ) . "&quot;</h1><hr />";
     6        echo "<h1>#" . htmlentities( $_GET['channel'] ) . " search results for &quot;" . htmlentities( $_GET['search'] ) . "&quot;</h1>";
    77        $rx = $_GET['search'];
    88        foreach ( search_log( '%' . $_GET['search'] . '%' ) as $row ) {
    99                display_log_row( $row, $rx );
    1010        }
    1111} elseif ( isset( $_GET['day'] ) ) {
    12         echo "<h1>#" . htmlentities( $_GET['channel'] ) . " logs for " . htmlentities( $_GET['day'] ) . "</h1><hr />";
     12        echo "<h1>#" . htmlentities( $_GET['channel'] ) . " logs for " . htmlentities( $_GET['day'] ) . "</h1>";
    1313        show_day_log( $_GET['day'] );
    1414}
    1515

  • irc-logger/public_html/header.php

     
    2222?><html>
    2323        <head>
    2424                <style>
    25                         body { font-family: 'Lucida Grande', Arial, sans-serif; font-size: 80%; }
    26                         body div div { -moz-border-radius: 10px; -webkit-border-radius: 10px;
    27                         padding: 10px !important; }
    28                         h1 { text-align: center; font-family: Georgia, 'Times New Roman',
    29                         serif; color: #21759B; }
     25                        body { font-family: 'Open Sans', sans-serif; font-size: 80%; margin: 0; }
     26                        .header-controls { background: #222; padding: 12px; color: #eee; }
     27                        body div div { float: left; padding: 10px; height: 26px; }
     28                        h1 { text-align: center; font-family: 'Open Sans', sans-serif; color: #555; font-size: 28px; line-height: 1.5em; text-shadow: #fff 0px 1px 0px; margin: 0; padding: 8px 0 10px 0; width: 100%; background: #f7f7f7; border-bottom: 1px solid #dfdfdf; }
    3029                        h1 span.highlight { background: white; padding: 0; }
    3130                        hr { color: #ddd; }
     31                        a { color: #0074a2; }
     32                        a:hover, a:active, a:focus, a:visited { color: #2ea2cc; }
    3233                        span.highlight { background: yellow; padding-left: 3px; padding-right:
    3334                        3px; padding-top: 1px; padding-bottom: 1px;}
    3435                        ul.entry { list-style: none; margin: 0; }
    3536                        ul.entry li { float: left; margin-right: 3px; padding: 4px 3px; }
    36                         ul:hover { background: #fff5af; }
     37                        ul:hover { background: #e4f2fd; }
    3738                        ul.entry li.msg:hover {  }
    3839                        ul.entry li.ts { font-size: 70%; float: right; margin-right: 40px; }
    3940                        ul.entry li.ts a { text-decoration: none; color: #808080; }
    40                         ul.entry li.nick a { color: #f90; text-decoration: none; font-weight: bold; float: left; }
     41                        ul.entry li.nick a { color: #0074a2; text-decoration: none; font-weight: bold; float: left; }
    4142                        ul.entry li.msg { float: none; }
     43                        @-ms-viewport { width: device-width; }
     44                        @viewport { width: device-width; }
     45                        input[type="submit"] { border: 1px solid #ccc; background: #f7f7f7; color: #555; -webkit-box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba(0,0,0,.08); box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba(0,0,0,.08);
     46                        border-radius: 3px; height: 28px; font-size: 13px; cursor: pointer; padding: 0 10px 1px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; vertical-align: top; }
     47                        input[type="submit"]:hover { background: #fafafa; border-color: #999; color: #222; }
     48                        input[type="submit"]:active { background: #eee; border-color: #999; color: #333; -webkit-box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 ); box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 ); }
     49                        select { border: none; height: 27px; vertical-align: top; }
     50                        input[type="text"] { border: none; height: 27px; padding: 0 5px; }
    4251                </style>
     52                <link href="//fonts.googleapis.com/css?family=Open+Sans:400&amp;subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic" rel="stylesheet" type="text/css">
     53                <meta name="viewport" content="width=device-width">
    4354                <script type="text/javascript" src="searchhi_slim.js"></script>
    4455        </head>
    4556<body>
    46 <div>
     57<div class="header-controls">
    4758
    48         <div style="float: left; padding: 2px; border: 1px solid #aaa; background: #ddd; margin: 2px; height: 22px;">
     59        <div>
    4960                <?php if ( $db ) { ?>
    5061                        <strong><u>#<?php echo htmlentities( $channel ); ?></u></strong>
    5162                <?php } else { ?>
    … …  
    5465        </div>
    5566
    5667        <?php if ( $db ) { ?>
    57         <div style="float: left; padding: 2px; margin: 2px; height: 22px;"> actions: </div>
     68        <div> actions: </div>
    5869        <?php } ?>
    5970
    60         <div style="float: left; padding: 2px; border: 1px solid #aaa; background: #ddd; margin: 2px; height: 22px;">
     71        <div>
    6172                <form method="GET">
    6273                <select name="channel">
    6374                <?php
    … …  
    8293
    8394        <?php if ( $db ) { ?>
    8495
    85         <div style="float: left; padding: 2px; margin: 2px; height: 22px;"> or </div>
     96        <div> or </div>
    8697
    87                 <div style="float: left; padding: 2px; border: 1px solid #aaa; background: #ddd; margin: 2px; height: 22px;">
     98                <div>
    8899                        <form method="GET"/>
    89100                        <input type="hidden" name="channel" value="<?php echo htmlentities($channel); ?>" />
    90101                        <select name="day" id="day" />
    … …  
    105116                        </form>
    106117                </div>
    107118
    108                 <div style="float: left; padding: 2px; margin: 2px; height: 22px;"> or </div>
     119                <div> or </div>
    109120
    110                 <div style="float: left; padding: 2px; border: 1px solid #aaa; background: #ddd; margin: 2px; height: 22px;">
     121                <div>
    111122                        <form method="GET"/>
    112123                        <input type="hidden" name="channel" value="<?php echo htmlentities($channel); ?>" />
    113124                        <input type="text" name="search" value="<?php if ( isset( $_GET['search'] ) ) echo htmlentities( $_GET['search'] ); ?>"/>
    … …  
    122133        <?php } ?>
    123134
    124135        <br style="clear: both;" />
    125         <hr />
    126136</div>

  • irc-logger/public_html/index.php

     
    11<html>
    22<head>
    33        <style>
    4                 body { padding: 30px; }
    5                 a { color: steelblue; font-size: 1.5em; text-decoration: none; }
     4                body { font-family: "Open Sans", sans-serif; padding: 0; margin: 0; }
     5                a { color: #0074a2; font-size: 1.5em; text-decoration: none; }
    66                a:hover { text-decoration: underline; }
     7                h1 { font-size: 26px; text-align: center; }
    78                ul { list-style: none; margin: none; padding: none; }
    8                 li { background: #ccc; border: 1px solid #aaa; margin: 5px; padding: 3px; width: 360px; text-align: center;}
     9                li { background: #ccc; border: 1px solid #aaa; margin: 5px; padding: 3px; max-width: 360px; text-align: center;}
    910                li:hover { background: #ddd; }
     11                @-ms-viewport { width: device-width; }
     12                @viewport { width: device-width; }
    1013        </style>
     14        <link href="//fonts.googleapis.com/css?family=Open+Sans:400&amp;subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic" rel="stylesheet" type="text/css">
     15        <meta name="viewport" content="width=device-width">
    1116</head>
    1217<body>
    13 <div style="margin-left: auto; margin-right: auto; width: 460px;">
     18<div style="margin-left: auto; margin-right: auto; width: 100%; max-width: 460px; padding: 30px 0;">
    1419<h1>Please Choose A Logged Channel</h1>
    1520<ul>
    1621<?php