Initial pass at page format and styling
This commit is contained in:
parent
af819ae597
commit
8ba6ca3ec0
|
@ -0,0 +1,59 @@
|
||||||
|
|
||||||
|
$gray: #757575;
|
||||||
|
$white: #fff;
|
||||||
|
|
||||||
|
body {
|
||||||
|
width: 750px;
|
||||||
|
border: 1px solid $gray;
|
||||||
|
margin: 20px auto;
|
||||||
|
color: $gray;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav, footer {
|
||||||
|
background-color: $gray;
|
||||||
|
color: $white;
|
||||||
|
height: 20px;
|
||||||
|
line-height: 20px;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
h1 {
|
||||||
|
margin: .67em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
nav {
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
min-height:300px;
|
||||||
|
|
||||||
|
table {
|
||||||
|
margin: 10px;
|
||||||
|
width: 730px;
|
||||||
|
tbody {
|
||||||
|
border: 1px solid $gray;
|
||||||
|
|
||||||
|
}
|
||||||
|
tr {
|
||||||
|
border-bottom: 1px solid $gray;
|
||||||
|
th {
|
||||||
|
text-align: left;
|
||||||
|
padding: 20px;
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
||||||
|
td {
|
||||||
|
padding: 10px;
|
||||||
|
width: 30%;
|
||||||
|
}
|
||||||
|
td + td {
|
||||||
|
width: 70%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
text-align: center;
|
||||||
|
}
|
|
@ -10,9 +10,120 @@
|
||||||
<title>ifconfig.io</title>
|
<title>ifconfig.io</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header></header>
|
<header>
|
||||||
|
<h1>What is my ip address? - <small>ifconfig.io</small></h1>
|
||||||
|
</header>
|
||||||
<nav></nav>
|
<nav></nav>
|
||||||
<main></main>
|
<main>
|
||||||
<footer></footer>
|
<table>
|
||||||
|
<thead>
|
||||||
|
<tr><th colspan="2">Your Connection</th></tr>
|
||||||
|
</thead>
|
||||||
|
<tfoot></tfoot>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td>IP Address</td><td>{{ ip_address }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Remote Host</td><td>{{ remote_host }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>User Agent</td><td>{{ user_agent }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Port</td><td>{{ port }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Language</td><td>{{ language }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Referer</td><td>{{ referer }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Connection</td><td>{{ connection }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>KeepAlive</td><td>{{ keep_alive }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Method</td><td>{{ method }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Encoding</td><td>{{ encoding }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>MIME Type</td><td>{{ mime_type }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Charset</td><td>{{ charset }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Via</td><td>{{ via }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>X-Forwarded-For</td><td>{{ x_forwarded_for }}</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
<table>
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th colspan="2">Command Line Interface</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tfoot></tfoot>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io</td><td>{{ ipaddr }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/ip</td><td>{{ ipaddr }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/host</td><td>{{ hostname }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/ua</td><td>{{ useragent }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/port</td><td>{{ port }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/lang</td><td>{{ language }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/keepalive</td><td>{{ keepalive }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/connection</td><td>{{ keep_alive }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/encoding</td><td>{{ encoding }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/mime</td><td>{{ mime_type }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/charset</td><td>{{ charset }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/via</td><td>{{ via }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/forwarded</td><td>{{ x_forwarded_for }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/all</td><td>{{ hash as yaml }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/all.xml</td><td>{{ hash as xml }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>$ curl ifconfig.io/all.json</td><td>{{ hash as json }}</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</main>
|
||||||
|
<footer>© 2014 ifconfig.io</footer>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Reference in New Issue