First steps towards new forum design.
This commit is contained in:
Dominik Picheta
parent
e520df80da
commit
4de7e58511
19 changed files with 736 additions and 859 deletions
120
forms.tmpl
120
forms.tmpl
|
|
@ -13,43 +13,61 @@
|
|||
#
|
||||
# result = ""
|
||||
# count = 0
|
||||
<table id="threads">
|
||||
<tr>
|
||||
<th>Topics</th>
|
||||
<th>Author</th>
|
||||
<th>Posts</th>
|
||||
<th>Views</th>
|
||||
<th>Last reply</th>
|
||||
</tr>
|
||||
<div id="talk-heads">
|
||||
<div class="topic"><div>Topic</div></div>
|
||||
<div class="reply"><div>Last</div></div>
|
||||
<div class="detail"><div>Details</div></div>
|
||||
<div class="author"><div>Author</div></div>
|
||||
</div>
|
||||
<div id="talk-threads">
|
||||
# for row in rows(db, query, $((c.pageNum-1) * ThreadsPerPage), $ThreadsPerPage):
|
||||
# inc(count)
|
||||
<tr>
|
||||
<td class="topic">
|
||||
${UrlButton(c, xmlEncode(%name), c.genThreadUrl(threadid = %threadid))}
|
||||
${genPagenumLocalNav(c, (%threadid).parseInt)}
|
||||
</td>
|
||||
#let authorName = getValue(db, sql("select name from person where id = " &
|
||||
# "(select author from post where id = " &
|
||||
# "(select min(id) from post where thread = ?))"), %threadId)
|
||||
#let profileUrl = c.req.makeUri("profile/", false) & xmlEncode(authorName)
|
||||
<td class="author"><a href="$profileUrl">${authorName}</a></td>
|
||||
# let posts = getValue(db, sql"select count(*) from post where thread = ?", %threadId)
|
||||
<td class="posts">$posts</td>
|
||||
<td class="views">${xmlEncode(%views)}</td>
|
||||
<div>
|
||||
<div class="topic">
|
||||
<div>
|
||||
${UrlButton(c, xmlEncode(%name), c.genThreadUrl(threadid = %threadid))}
|
||||
${genPagenumLocalNav(c, (%threadid).parseInt)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
#let latestReplyAuthor = getValue(db, sql("select name from person where id = " &
|
||||
# "(select author from post where id = " &
|
||||
# "(select max(id) from post where thread = ?))"), %threadId)
|
||||
#let latestReplyDate = getValue(db, sql("SELECT strftime('%s', " &
|
||||
# "(select creation from post where id = (select max(id) from post where thread = ?)))"), %threadId)
|
||||
<td class="lastreply">
|
||||
<span>${formatTimestamp(latestReplyDate.parseInt())}</span><br/>
|
||||
#let replyProfileUrl = c.req.makeUri("profile/", false) &
|
||||
# xmlEncode(latestReplyAuthor)
|
||||
<span><a href="$replyProfileUrl">${latestReplyAuthor}</a></span>
|
||||
</td>
|
||||
</tr>
|
||||
#let timeStr = formatTimestamp(latestReplyDate.parseInt())
|
||||
#let replyProfileUrl = c.req.makeUri("profile/", false) &
|
||||
# xmlEncode(latestReplyAuthor)
|
||||
<div class="reply">
|
||||
<div>
|
||||
<a href="$replyProfileUrl" title="$timeStr">$latestReplyAuthor</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
# let posts = getValue(db, sql"select count(*) from post where thread = ?", %threadId)
|
||||
<div class="detail">
|
||||
<div><div>${xmlEncode(%views)}</div></div>
|
||||
<div><div>$posts</div></div>
|
||||
</div>
|
||||
|
||||
#let authorName = getValue(db, sql("select name from person where id = " &
|
||||
# "(select author from post where id = " &
|
||||
# "(select min(id) from post where thread = ?))"), %threadId)
|
||||
#let profileUrl = c.req.makeUri("profile/", false) & xmlEncode(authorName)
|
||||
<div class="author">
|
||||
<div><a href="$profileUrl">$authorName</a></div>
|
||||
</div>
|
||||
</div>
|
||||
# end for
|
||||
</table>
|
||||
|
||||
<div>
|
||||
<div class="topic"><div><a href="http://reign-studios.net/philipwitte/nim/forum-thread.htm">Cannot generate code for N (static[int]) in template</a></div></div>
|
||||
<div class="reply"><div><a href="#" title="Mon, 29 Sep 2014 23:11 UTC">marcianx</a></div></div>
|
||||
<div class="detail"><div><div>135</div></div><div><div>8</div></div></div>
|
||||
<div class="author"><div><a href="#">marcianx</a></div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
#end proc
|
||||
#
|
||||
#
|
||||
|
|
@ -205,38 +223,14 @@
|
|||
#
|
||||
#proc genListOnline(c: var TForumData, stats: TForumStats): string =
|
||||
# result = ""
|
||||
<div id="whoisonline">
|
||||
<div class="wioHeader">
|
||||
<span>Who is online?<span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<span>Out of ${stats.totalUsers} users ${stats.activeUsers.len} are online${if stats.activeUsers.len == 0: "." else: ":"}
|
||||
#for index, usr in stats.activeUsers:
|
||||
# let profileHref = """<a href="""" & c.req.makeUri("profile/", false) &
|
||||
# xmlEncode(usr.nick) & """">"""
|
||||
# let hrefEnd = """</a>"""
|
||||
# if usr.isAdmin:
|
||||
#if index != 0: result.add ','
|
||||
#end if
|
||||
#result.add("""<span class="user admin"> """ & profileHref &
|
||||
# usr.nick & hrefEnd & """</span>""")
|
||||
# else:
|
||||
#if index != 0: result.add ','
|
||||
#end if
|
||||
#result.add("""<span class="user"> """ & profileHref &
|
||||
# usr.nick & hrefEnd & """</span>""")
|
||||
# end if
|
||||
#end for
|
||||
</span>
|
||||
<hr/>
|
||||
#if stats.newestMember.nick != "":
|
||||
#let profileUrl = c.req.makeUri("profile/", false) &
|
||||
# xmlEncode(stats.newestMember.nick)
|
||||
<span>Total threads: ${stats.totalThreads} | Total posts: ${stats.totalPosts} | Newest member: <a href="$profileUrl">${stats.newestMember.nick}</a></span>
|
||||
#else:
|
||||
<span>Total threads: ${stats.totalThreads} | Total posts: ${stats.totalPosts}</span>
|
||||
#end if
|
||||
</div>
|
||||
</div>
|
||||
|
||||
# var active: seq[string] = @[]
|
||||
# for i in stats.activeUsers:
|
||||
# active.add(i.nick)
|
||||
# end for
|
||||
# let profileUrl = c.req.makeUri("profile/", false) &
|
||||
# xmlEncode(stats.newestMember.nick)
|
||||
<span class="forum-user-info" title="${active.join(", ")}">
|
||||
<b>${stats.activeUsers.len}</b> of <b>${stats.totalUsers}</b> users online</span> |
|
||||
<b>${stats.totalThreads}</b> threads | <b>${stats.totalPosts}</b> posts |
|
||||
newest member: <a href="$profileUrl">${stats.newestMember.nick}</a>
|
||||
#end proc
|
||||
|
|
|
|||
42
forum.nim
42
forum.nim
|
|
@ -485,7 +485,7 @@ proc genPagenumNav(c: var TForumData, stats: TForumStats): string =
|
|||
nextUrl = c.req.makeUri("/page/" & $(c.pageNum+1))
|
||||
else:
|
||||
firstUrl = c.req.makeUri("/t/" & $c.threadId)
|
||||
if c.pageNum == 1:
|
||||
if c.pageNum == 1:
|
||||
prevUrl = firstUrl
|
||||
else:
|
||||
prevUrl = c.req.makeUri(firstUrl & "/" & $(c.pageNum-1))
|
||||
|
|
@ -499,26 +499,13 @@ proc genPagenumNav(c: var TForumData, stats: TForumStats): string =
|
|||
var firstTag = ""
|
||||
var prevTag = ""
|
||||
if c.pageNum == 1:
|
||||
firstTag = span("First")
|
||||
prevTag = span("Prev")
|
||||
firstTag = span("<<")
|
||||
prevTag = span("<••")
|
||||
else:
|
||||
firstTag = htmlgen.a(href=firstUrl, "First")
|
||||
prevTag = htmlgen.a(href=prevUrl, "Prev")
|
||||
result.add(htmlgen.`div`(class = "left",
|
||||
firstTag,
|
||||
prevTag))
|
||||
# Right
|
||||
var lastTag = ""
|
||||
var nextTag = ""
|
||||
if c.pageNum == totalPages:
|
||||
lastTag = span("Last")
|
||||
nextTag = span("Next")
|
||||
else:
|
||||
lastTag = htmlgen.a(href=lastUrl, "Last")
|
||||
nextTag = htmlgen.a(href=nextUrl, "Next")
|
||||
result.add(htmlgen.`div`(class = "right",
|
||||
nextTag,
|
||||
lastTag))
|
||||
firstTag = htmlgen.a(href=firstUrl, "<<")
|
||||
prevTag = htmlgen.a(href=prevUrl, "<••")
|
||||
result.add(firstTag)
|
||||
result.add(prevTag)
|
||||
|
||||
# Numbers
|
||||
var pages = "" # Tags
|
||||
|
|
@ -533,10 +520,19 @@ proc genPagenumNav(c: var TForumData, stats: TForumStats): string =
|
|||
pageUrl = c.req.makeUri(firstUrl & "/" & $(i))
|
||||
|
||||
pages.add(htmlgen.a(href = pageUrl, $(i)))
|
||||
result.add(htmlgen.`div`(class = "middle",
|
||||
pages))
|
||||
result.add(pages)
|
||||
|
||||
result = htmlgen.`div`(id = "pagenumbers", result)
|
||||
# Right
|
||||
var lastTag = ""
|
||||
var nextTag = ""
|
||||
if c.pageNum == totalPages:
|
||||
lastTag = span(">>")
|
||||
nextTag = span("••>")
|
||||
else:
|
||||
lastTag = htmlgen.a(href=lastUrl, ">>")
|
||||
nextTag = htmlgen.a(href=nextUrl, "••>")
|
||||
result.add(lastTag)
|
||||
result.add(nextTag)
|
||||
|
||||
proc gatherTotalPostsByID(c: var TForumData, thrid: int): int =
|
||||
## Gets the total post count of a thread.
|
||||
|
|
|
|||
163
main.tmpl
163
main.tmpl
|
|
@ -11,76 +11,109 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<title>${xmlEncode(title)}</title>
|
||||
<link rel="stylesheet" href="${c.req.makeUri("css/normalize.css", absolute = false)}">
|
||||
<link rel="stylesheet" href="${c.req.makeUri("css/style.css", absolute = false)}">${additional_headers}
|
||||
<link rel="stylesheet" href="${c.req.makeUri("css/style.css", absolute = false)}">
|
||||
<link rel="shortcut icon" href="${c.req.makeUri("favicon.ico", absolute = false)}">${additional_headers}
|
||||
<meta charset="UTF-8">
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
#let frontQuery = c.req.makeUri("/")
|
||||
<div id="nimbtn">
|
||||
<a href="${frontQuery}">Forum</a>
|
||||
<!--- #head --->
|
||||
#let frontQuery = c.req.makeUri("/")
|
||||
<header id="head" class="forum">
|
||||
<div class="wide-layout tall">
|
||||
<div id="head-logo"></div>
|
||||
<a id="head-logo-link" href="home.htm"></a>
|
||||
<nav id="head-links">
|
||||
<a href="http://nim-lang.org/">home</a>
|
||||
<a href="http://nim-lang.org/">docs</a>
|
||||
<a href="http://nim-lang.org/">learn</a>
|
||||
<a href="${frontQuery}" class="active">forum</a>
|
||||
<a href="#">download</a>
|
||||
<a href="#">faq</a>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!--- #neck --->
|
||||
<section id="neck">
|
||||
<div class="wide-layout tall">
|
||||
<div style="right: 131px;" id="glow-arrow" class="forum"></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!--- #body --->
|
||||
<section id="body" class="forum">
|
||||
<div id="body-border"></div>
|
||||
<div id="body-border-left"></div>
|
||||
<div id="body-border-right"></div>
|
||||
<div id="body-border-bottom"></div>
|
||||
<div id="glow-line"></div>
|
||||
<div id="glow-line-bottom"></div>
|
||||
<div class="talk-layout">
|
||||
<article id="content">
|
||||
${content}
|
||||
#if c.isThreadsList:
|
||||
<div id="talk-info">
|
||||
<div class="info">
|
||||
<div>
|
||||
#if c.loggedIn:
|
||||
#let profileUrl = c.req.makeUri("profile/", false) &
|
||||
# xmlEncode(c.username)
|
||||
<span>Welcome <a href="$profileUrl">${c.username}!</a></span>
|
||||
|
|
||||
<!--<a href="$profileUrl">${genGravatar(c.email, 26)}</a>-->
|
||||
#end if
|
||||
${c.genListOnline(stats)}
|
||||
</div>
|
||||
</div>
|
||||
<div class="user">
|
||||
<div>
|
||||
#if c.loggedIn:
|
||||
<a href="${frontQuery}newthread">new thread</a>
|
||||
|
|
||||
<a href="${frontQuery}logout">logout</a>
|
||||
#else:
|
||||
<a href="${frontQuery}login">login</a>
|
||||
|
|
||||
<a href="${frontQuery}register">register</a>
|
||||
#end if
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
#end if
|
||||
<div id="talk-nav">
|
||||
${genPagenumNav(c, stats)}
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!--- #foot --->
|
||||
<footer id="foot" class="forum">
|
||||
<div class="talk-layout tall">
|
||||
<div id="foot-links">
|
||||
<div>
|
||||
<h4>Documentation</h4>
|
||||
<a href="http://reign-studios.net/philipwitte/nim/docs.htm">Stable Documentation</a>
|
||||
<a href="http://reign-studios.net/philipwitte/nim/docs.htm">Development Documentation</a>
|
||||
<a href="https://github.com/Araq/Nimrod">Github Issues & Requests</a>
|
||||
</div>
|
||||
<div>
|
||||
<h4>Community</h4>
|
||||
<a href="http://reign-studios.net/philipwitte/nim/forum.htm">User Forum</a>
|
||||
<a href="http://webchat.freenode.net/?channels=nimlang">Online IRC</a>
|
||||
<a href="http://build.nimrod-lang.org/irclogs/">IRC Logs</a>
|
||||
</div>
|
||||
</div>
|
||||
<div id="foot-legal">
|
||||
<h4>Written in Nim - Powered by <a href="#">Jester</a></h4>
|
||||
Web Design by <a href="#">Philip Witte</a> & <a href="#">Dominik Picheta</a><br>
|
||||
Copyright © 2014 - <a href="#">Andreas Rumpf</a> & <a href="#">Contributors</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<div id="header">
|
||||
<span>Nimrod's <a href="http://nimrod-lang.org/">homepage</a></span>
|
||||
<span><a href="http://nimrod-lang.org/documentation.html">stable docs</a></span>
|
||||
<span><a href="http://build.nimrod-lang.org/docs/overview.html">development docs</a></span>
|
||||
<span><a href="https://github.com/Araq/Nimrod/issues">github issues</a></span>
|
||||
#if c.loggedIn:
|
||||
<a href="${frontQuery}logout" class="right">Logout</a>
|
||||
#let profileUrl = c.req.makeUri("profile/", false) &
|
||||
# xmlEncode(c.username)
|
||||
<span id="welcome"><a href="${profileUrl}">$c.username</a></span>
|
||||
<a href="$profileUrl">${genGravatar(c.email, 26)}</a>
|
||||
#else:
|
||||
<a href="${frontQuery}register" class="right">Register</a>
|
||||
<a href="${frontQuery}login" class="right">Login</a>
|
||||
#end if
|
||||
</div>
|
||||
|
||||
<div id="topbar">
|
||||
${c.genActionMenu}
|
||||
</div>
|
||||
|
||||
<div id="content">
|
||||
$content
|
||||
<span style="color:red">$c.errorMsg</span>
|
||||
</div>
|
||||
#if c.req.pathInfo.normalizeUri notin noPageNums:
|
||||
${c.genPagenumNav(stats)}
|
||||
#end if
|
||||
<div id="topbar">
|
||||
${c.genActionMenu}
|
||||
</div>
|
||||
|
||||
#if c.isThreadsList:
|
||||
${c.genListOnline(stats)}
|
||||
#end if
|
||||
|
||||
#if showRssLinks:
|
||||
<span id="rss">
|
||||
<a href="${c.req.makeUri("/threadActivity.xml")}"
|
||||
><img
|
||||
src="${c.req.makeUri("/images/Feed-icon.svg", absolute = false)}"
|
||||
class="rssfeed"
|
||||
>Thread activity</a>
|
||||
<a href="${c.req.makeUri("/postActivity.xml")}"
|
||||
><img
|
||||
src="${c.req.makeUri("/images/Feed-icon.svg", absolute = false)}"
|
||||
class="rssfeed"
|
||||
>Posts activity</a>
|
||||
</span>
|
||||
#end if
|
||||
|
||||
<div id="footerPush"></div>
|
||||
</div>
|
||||
<div id="footer">
|
||||
<span>Written in <a href="http://nimrod-lang.org/">Nimrod</a> using <a href="https://github.com/dom96/jester">Jester</a></span>
|
||||
<span> | <a href="https://github.com/nimrod-code/nimforum">Fork on Github</a></span>
|
||||
<span> | User contributions licensed under <a href="http://creativecommons.org/licenses/by-sa/3.0/">cc-wiki</a> with <a href="/license">attribution required</a></span>
|
||||
<span style="float:right;">Generated in ${int((epochTime()-c.startTime)*1000.0)}ms</span>
|
||||
</div>
|
||||
<script src="${frontQuery}js/arrow.js"></script>
|
||||
<script src="${frontQuery}js/forum.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
#end proc
|
||||
|
|
|
|||
12
public/css/arrow.js
Normal file
12
public/css/arrow.js
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
"use strict";
|
||||
|
||||
function positionGlowArrow() {
|
||||
var headLinks = document.getElementById("head-links");
|
||||
var activeLink = headLinks.getElementsByClassName("active")[0]
|
||||
if (activeLink == undefined || activeLink == null)
|
||||
return;
|
||||
|
||||
var offset = (headLinks.offsetWidth - activeLink.offsetLeft) - (activeLink.offsetWidth / 2) - 133;
|
||||
var glowArrow = document.getElementById("glow-arrow");
|
||||
glowArrow.style.right = offset + "px";
|
||||
}
|
||||
5
public/css/forum.js
Normal file
5
public/css/forum.js
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
"use strict";
|
||||
|
||||
window.onload = function() {
|
||||
positionGlowArrow();
|
||||
};
|
||||
284
public/css/normalize.css
vendored
284
public/css/normalize.css
vendored
|
|
@ -1,284 +0,0 @@
|
|||
/*
|
||||
* HTML5 Boilerplate
|
||||
*
|
||||
* What follows is the result of much research on cross-browser styling.
|
||||
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
|
||||
* Kroc Camen, and the H5BP dev community and team.
|
||||
*
|
||||
* Detailed information about this CSS: h5bp.com/css
|
||||
*
|
||||
* ==|== normalize ==========================================================
|
||||
*/
|
||||
|
||||
|
||||
/* =============================================================================
|
||||
HTML5 display definitions
|
||||
========================================================================== */
|
||||
|
||||
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
|
||||
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
|
||||
audio:not([controls]) { display: none; }
|
||||
[hidden] { display: none; }
|
||||
|
||||
|
||||
/* =============================================================================
|
||||
Base
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
|
||||
* 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
|
||||
*/
|
||||
|
||||
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
|
||||
|
||||
html, button, input, select, textarea { font-family: sans-serif; color: #222; }
|
||||
|
||||
body { margin: 0; font-size: 1em; line-height: 1.4; }
|
||||
|
||||
|
||||
/* =============================================================================
|
||||
Links
|
||||
========================================================================== */
|
||||
|
||||
a { color: #00e; }
|
||||
a:visited { color: #551a8b; }
|
||||
a:hover { color: #06e; }
|
||||
a:focus { outline: thin dotted; }
|
||||
|
||||
/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
|
||||
a:hover, a:active { outline: 0; }
|
||||
|
||||
|
||||
/* =============================================================================
|
||||
Typography
|
||||
========================================================================== */
|
||||
|
||||
abbr[title] { border-bottom: 1px dotted; }
|
||||
|
||||
b, strong { font-weight: bold; }
|
||||
|
||||
blockquote { margin: 1em 40px; }
|
||||
|
||||
dfn { font-style: italic; }
|
||||
|
||||
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
|
||||
|
||||
ins { background: #ff9; color: #000; text-decoration: none; }
|
||||
|
||||
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
|
||||
|
||||
/* Redeclare monospace font family: h5bp.com/j */
|
||||
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
|
||||
|
||||
/* Improve readability of pre-formatted text in all browsers */
|
||||
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
|
||||
|
||||
q { quotes: none; }
|
||||
q:before, q:after { content: ""; content: none; }
|
||||
|
||||
small { font-size: 85%; }
|
||||
|
||||
/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
|
||||
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
|
||||
sup { top: -0.5em; }
|
||||
sub { bottom: -0.25em; }
|
||||
|
||||
|
||||
/* =============================================================================
|
||||
Lists
|
||||
========================================================================== */
|
||||
|
||||
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
|
||||
dd { margin: 0 0 0 40px; }
|
||||
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
|
||||
|
||||
|
||||
/* =============================================================================
|
||||
Embedded content
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* 1. Improve image quality when scaled in IE7: h5bp.com/d
|
||||
* 2. Remove the gap between images and borders on image containers: h5bp.com/i/440
|
||||
*/
|
||||
|
||||
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
|
||||
|
||||
/*
|
||||
* Correct overflow not hidden in IE9
|
||||
*/
|
||||
|
||||
svg:not(:root) { overflow: hidden; }
|
||||
|
||||
|
||||
/* =============================================================================
|
||||
Figures
|
||||
========================================================================== */
|
||||
|
||||
figure { margin: 0; }
|
||||
|
||||
|
||||
/* =============================================================================
|
||||
Forms
|
||||
========================================================================== */
|
||||
|
||||
form { margin: 0; }
|
||||
fieldset { border: 0; margin: 0; padding: 0; }
|
||||
|
||||
/* Indicate that 'label' will shift focus to the associated form element */
|
||||
label { cursor: pointer; }
|
||||
|
||||
/*
|
||||
* 1. Correct color not inheriting in IE6/7/8/9
|
||||
* 2. Correct alignment displayed oddly in IE6/7
|
||||
*/
|
||||
|
||||
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
|
||||
|
||||
/*
|
||||
* 1. Correct font-size not inheriting in all browsers
|
||||
* 2. Remove margins in FF3/4 S5 Chrome
|
||||
* 3. Define consistent vertical alignment display in all browsers
|
||||
*/
|
||||
|
||||
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
|
||||
|
||||
/*
|
||||
* 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
|
||||
*/
|
||||
|
||||
button, input { line-height: normal; }
|
||||
|
||||
/*
|
||||
* 1. Display hand cursor for clickable form elements
|
||||
* 2. Allow styling of clickable form elements in iOS
|
||||
* 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
|
||||
*/
|
||||
|
||||
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
|
||||
|
||||
/*
|
||||
* Re-set default cursor for disabled elements
|
||||
*/
|
||||
|
||||
button[disabled], input[disabled] { cursor: default; }
|
||||
|
||||
/*
|
||||
* Consistent box sizing and appearance
|
||||
*/
|
||||
|
||||
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
|
||||
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
|
||||
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
|
||||
|
||||
/*
|
||||
* Remove inner padding and border in FF3/4: h5bp.com/l
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
|
||||
|
||||
/*
|
||||
* 1. Remove default vertical scrollbar in IE6/7/8/9
|
||||
* 2. Allow only vertical resizing
|
||||
*/
|
||||
|
||||
textarea { overflow: auto; vertical-align: top; resize: vertical; }
|
||||
|
||||
/* Colors for form validity */
|
||||
input:valid, textarea:valid { }
|
||||
input:invalid, textarea:invalid { background-color: #f0dddd; }
|
||||
|
||||
|
||||
/* =============================================================================
|
||||
Tables
|
||||
========================================================================== */
|
||||
|
||||
table { border-collapse: collapse; border-spacing: 0; }
|
||||
td { vertical-align: top; }
|
||||
|
||||
|
||||
/* =============================================================================
|
||||
Chrome Frame Prompt
|
||||
========================================================================== */
|
||||
|
||||
.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }
|
||||
|
||||
|
||||
/* ==|== primary styles =====================================================
|
||||
Author:
|
||||
========================================================================== */
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* ==|== media queries ======================================================
|
||||
EXAMPLE Media Query for Responsive Design.
|
||||
This example overrides the primary ('mobile first') styles
|
||||
Modify as content requires.
|
||||
========================================================================== */
|
||||
|
||||
@media only screen and (min-width: 35em) {
|
||||
/* Style adjustments for viewports that meet the condition */
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* ==|== non-semantic helper classes ========================================
|
||||
Please define your styles before this section.
|
||||
========================================================================== */
|
||||
|
||||
/* For image replacement */
|
||||
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
|
||||
.ir br { display: none; }
|
||||
|
||||
/* Hide from both screenreaders and browsers: h5bp.com/u */
|
||||
.hidden { display: none !important; visibility: hidden; }
|
||||
|
||||
/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
|
||||
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
|
||||
|
||||
/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
|
||||
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
|
||||
|
||||
/* Hide visually and from screenreaders, but maintain layout */
|
||||
.invisible { visibility: hidden; }
|
||||
|
||||
/* Contain floats: h5bp.com/q */
|
||||
.clearfix:before, .clearfix:after { content: ""; display: table; }
|
||||
.clearfix:after { clear: both; }
|
||||
.clearfix { *zoom: 1; }
|
||||
|
||||
|
||||
|
||||
/* ==|== print styles =======================================================
|
||||
Print styles.
|
||||
Inlined to avoid required HTTP connection: h5bp.com/r
|
||||
========================================================================== */
|
||||
|
||||
@media print {
|
||||
* { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
|
||||
a, a:visited { text-decoration: underline; }
|
||||
a[href]:after { content: " (" attr(href) ")"; }
|
||||
abbr[title]:after { content: " (" attr(title) ")"; }
|
||||
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
|
||||
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
|
||||
thead { display: table-header-group; } /* h5bp.com/t */
|
||||
tr, img { page-break-inside: avoid; }
|
||||
img { max-width: 100% !important; }
|
||||
@page { margin: 0.5cm; }
|
||||
p, h2, h3 { orphans: 3; widows: 3; }
|
||||
h2, h3 { page-break-after: avoid; }
|
||||
}
|
||||
|
|
@ -1,425 +1,529 @@
|
|||
html, body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#wrapper {
|
||||
min-height: 100%;
|
||||
height: auto !important;
|
||||
height: 100%;
|
||||
margin: 0 auto -21pt; /* the bottom margin is the negative value of the footer's height */
|
||||
}
|
||||
|
||||
div#header {
|
||||
background-color: #3d3d3d;
|
||||
color: #ffffff;
|
||||
padding-top: 3pt;
|
||||
padding-bottom: 3pt;
|
||||
}
|
||||
|
||||
div#header span#welcome {
|
||||
float: right;
|
||||
padding: 0;
|
||||
padding-right: 7pt;
|
||||
}
|
||||
div#header img {
|
||||
float: right;
|
||||
margin-top: -2pt;
|
||||
padding-right: 7pt;
|
||||
}
|
||||
|
||||
div#header span, #nimbtn span {
|
||||
margin: 0;
|
||||
padding: 5pt;
|
||||
}
|
||||
|
||||
div#header a.right, #nimbtn a {
|
||||
float: right;
|
||||
|
||||
color: #ffffff;
|
||||
margin-right: 6pt;
|
||||
}
|
||||
|
||||
div#header a {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
div#header a:visited, #nimbtn a:visited {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
div#header a:hover, #nimbtn a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#nimbtn a {
|
||||
margin-left: 6pt;
|
||||
}
|
||||
|
||||
#nimbtn {
|
||||
float: left;
|
||||
background-color: #2a2a2a;
|
||||
color: #ffffff;
|
||||
padding-top: 3pt;
|
||||
padding-bottom: 3pt;
|
||||
}
|
||||
|
||||
#content {
|
||||
margin: 5pt;
|
||||
}
|
||||
|
||||
#content table#threads {
|
||||
width: 100%;
|
||||
border-collapse: separate;
|
||||
text-align: center;
|
||||
border: #ffffff solid 1px;
|
||||
font-size: 10pt;
|
||||
}
|
||||
|
||||
#content table#threads th {
|
||||
background-color: #5D5D5D;
|
||||
background: -moz-linear-gradient(top, #5D5D5D, #4D4D4D);
|
||||
background: -webkit-linear-gradient(top, #5D5D5D, #4d4d4d);
|
||||
background: -o-linear-gradient(top, #5D5D5D, #4d4d4d);
|
||||
color: #ffffff;
|
||||
border-bottom: #2d2d2d solid 2px;
|
||||
border-right: #2d2d2d solid 1px;
|
||||
}
|
||||
|
||||
#content table#threads tr:nth-child(even) {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
#content table#threads td {
|
||||
vertical-align: middle;
|
||||
border-right: #9d9d9d solid 1px;
|
||||
border-bottom: #9d9d9d solid 1px;
|
||||
}
|
||||
|
||||
#content table#threads>tbody>tr>td:first-child {
|
||||
border-left: #9d9d9d solid 1px;
|
||||
|
||||
}
|
||||
|
||||
#content table#threads>tbody>tr>td:last-child {
|
||||
border-right: #9d9d9d solid 1px;
|
||||
}
|
||||
|
||||
#content table#threads td:hover {
|
||||
border-right-color: #9d9d9d;
|
||||
}
|
||||
|
||||
#content table#threads td.topic {
|
||||
text-align: left;
|
||||
padding: 5pt;
|
||||
}
|
||||
#content table#threads td.author {
|
||||
width: 10%;
|
||||
}
|
||||
#content table#threads td.posts {
|
||||
width: 10%;
|
||||
}
|
||||
#content table#threads td.views {
|
||||
width: 10%;
|
||||
}
|
||||
#content table#threads td.lastreply {
|
||||
width: 15%;
|
||||
}
|
||||
|
||||
span#rss {
|
||||
margin: 5pt;
|
||||
font-size: 9pt;
|
||||
}
|
||||
|
||||
img.rssfeed {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
padding-right:3pt;
|
||||
margin-top:-1pt;
|
||||
|
||||
}
|
||||
|
||||
#whoisonline {
|
||||
margin: 5pt;
|
||||
font-size: 9pt;
|
||||
}
|
||||
|
||||
#whoisonline .wioHeader {
|
||||
background-color: #5D5D5D;
|
||||
background: -moz-linear-gradient(top, #5D5D5D, #4D4D4D);
|
||||
background: -webkit-linear-gradient(top, #5D5D5D, #4d4d4d);
|
||||
background: -o-linear-gradient(top, #5D5D5D, #4d4d4d);
|
||||
color: #ffffff;
|
||||
border-bottom: #2d2d2d solid 1px;
|
||||
padding: 3px;
|
||||
padding-left: 5pt;
|
||||
}
|
||||
|
||||
#whoisonline .content {
|
||||
border: #9d9d9d solid 1px;
|
||||
border-top: #2D2D2D solid 1px;
|
||||
padding: 5pt;
|
||||
}
|
||||
|
||||
#whoisonline .content hr {
|
||||
margin-top: 5pt;
|
||||
margin-bottom: 5pt;
|
||||
}
|
||||
|
||||
#footerPush {
|
||||
height: 24pt;
|
||||
}
|
||||
|
||||
#footer {
|
||||
background-color: #5D5D5D;
|
||||
background: -moz-linear-gradient(top, #5D5D5D, #4D4D4D);
|
||||
background: -webkit-linear-gradient(top, #5D5D5D, #4d4d4d);
|
||||
background: -o-linear-gradient(top, #5D5D5D, #4d4d4d);
|
||||
color: #ffffff;
|
||||
|
||||
padding-top: 1.5pt;
|
||||
padding-bottom: 1.5pt;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
height: 18pt;
|
||||
}
|
||||
|
||||
#footer a:link, #footer a:visited {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
#footer a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#topbar {
|
||||
margin: 5pt;
|
||||
}
|
||||
|
||||
div#topbar span#rss {
|
||||
float: right;
|
||||
padding: 0;
|
||||
padding-right: 7pt;
|
||||
}
|
||||
|
||||
#content .post {
|
||||
border: #4d4d4d solid 2px;
|
||||
width: 100%;
|
||||
margin-bottom: 5pt;
|
||||
}
|
||||
|
||||
#content .post th {
|
||||
background-color: #5D5D5D;
|
||||
background: -moz-linear-gradient(top, #5D5D5D, #4D4D4D);
|
||||
background: -webkit-linear-gradient(top, #5D5D5D, #4d4d4d);
|
||||
background: -o-linear-gradient(top, #5D5D5D, #4d4d4d);
|
||||
color: #ffffff;
|
||||
padding-left: 5pt;
|
||||
padding-right: 5pt;
|
||||
padding-top: 3pt;
|
||||
padding-bottom: 3pt;
|
||||
text-align: left;
|
||||
font-size: 9pt;
|
||||
}
|
||||
|
||||
#content .post .left {
|
||||
border-left: #4d4d4d solid 2px;
|
||||
background-color: #eee;
|
||||
padding: 7pt;
|
||||
width: 15%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
#content .post .left hr {
|
||||
margin: 0;
|
||||
margin-bottom: 5pt;
|
||||
margin-top: 2pt;
|
||||
}
|
||||
|
||||
#content .post .content {
|
||||
padding: 6pt;
|
||||
}
|
||||
|
||||
div#replywrapper {
|
||||
width: 70%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
border: #4d4d4d solid 2px;
|
||||
}
|
||||
|
||||
div#replywrapper div#replytop {
|
||||
background-color: #5D5D5D;
|
||||
background: -moz-linear-gradient(top, #5D5D5D, #4D4D4D);
|
||||
background: -webkit-linear-gradient(top, #5D5D5D, #4d4d4d);
|
||||
background: -o-linear-gradient(top, #5D5D5D, #4d4d4d);
|
||||
font-size: 9pt;
|
||||
color: #ffffff;
|
||||
padding: 5pt;
|
||||
|
||||
}
|
||||
|
||||
div#replywrapper form textarea {
|
||||
width: 99%;
|
||||
}
|
||||
|
||||
div#replywrapper form > input:first-child {
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
div#replywrapper form {
|
||||
padding: 8pt;
|
||||
}
|
||||
|
||||
div#pagenumbers {
|
||||
font-size: 11pt;
|
||||
height: 21px;
|
||||
margin: 5.9pt;
|
||||
padding: 2pt;
|
||||
padding-left: 4pt;
|
||||
padding-right: 4pt;
|
||||
border-top: 1px solid #9d9d9d;
|
||||
border-bottom: 1px solid #9d9d9d;
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
div#pagenumbers div.left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
div#pagenumbers div.middle {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div#pagenumbers div.middle a, div#pagenumbers div.middle span {
|
||||
padding-right: 4pt;
|
||||
}
|
||||
|
||||
div#pagenumbers div.middle span {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
div#pagenumbers div.left span, div#pagenumbers div.left a {
|
||||
padding-right: 8pt;
|
||||
}
|
||||
|
||||
div#pagenumbers div.right span, div#pagenumbers div.right a {
|
||||
padding-left: 8pt;
|
||||
}
|
||||
|
||||
|
||||
div#pagenumbers div.right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
#content #threads .localnums {
|
||||
display: inline;
|
||||
float: right;
|
||||
border-top: 1px solid #9d9d9d;
|
||||
border-bottom: 1px solid #9d9d9d;
|
||||
padding-left: 4pt;
|
||||
padding-right: 4pt;
|
||||
}
|
||||
|
||||
#content #threads .localnums a:first-child {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
#content #threads .localnums a {
|
||||
padding-left: 6pt;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#content #threads .localnums span {
|
||||
padding-left: 3pt;
|
||||
margin-right: -3pt;
|
||||
}
|
||||
|
||||
#profile {
|
||||
margin-left: 1.30em;
|
||||
}
|
||||
|
||||
#profile #left {
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
#profile #left #info table th {
|
||||
text-align: left;
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
|
||||
#profile #left #info table {
|
||||
font-size: 10.5pt;
|
||||
}
|
||||
|
||||
|
||||
#profile #left #avatar {
|
||||
border-bottom: 2px solid #6d6d6d;
|
||||
padding-bottom: 0.75em;
|
||||
margin-bottom: 0.50em;
|
||||
}
|
||||
|
||||
/* For RST nimrod syntax highlighter */
|
||||
span.DecNumber {color: blue}
|
||||
span.BinNumber {color: blue}
|
||||
span.HexNumber {color: blue}
|
||||
span.OctNumber {color: blue}
|
||||
span.FloatNumber {color: blue}
|
||||
span.Identifier {color: black}
|
||||
span.Keyword {font-weight: bold}
|
||||
span.StringLit {color: blue}
|
||||
span.LongStringLit {color: blue}
|
||||
span.CharLit {color: blue}
|
||||
span.EscapeSequence {color: black}
|
||||
span.Operator {color: black}
|
||||
span.Punctation {color: black}
|
||||
span.Comment, span.LongComment {font-style:italic; color: green}
|
||||
span.RegularExpression {color: DarkViolet}
|
||||
span.TagStart {color: DarkViolet}
|
||||
span.TagEnd {color: DarkViolet}
|
||||
span.Key {color: blue}
|
||||
span.Value {color: black}
|
||||
span.RawData {color: blue}
|
||||
span.Assembler {color: blue}
|
||||
span.Preprocessor {color: DarkViolet}
|
||||
span.Directive {color: DarkViolet}
|
||||
span.Command, span.Rule, span.Hyperlink, span.Label, span.Reference,
|
||||
span.Other {color: black}
|
||||
|
||||
/* Buttons */
|
||||
a.button {
|
||||
border-radius: 2px 2px 2px 2px;
|
||||
background: -moz-linear-gradient(top, #f7f7f7, #ebebeb);
|
||||
background: -webkit-linear-gradient(top, #f7f7f7, #ebebeb);
|
||||
background: -o-linear-gradient(top, #f7f7f7, #ebebeb);
|
||||
text-decoration: none;
|
||||
color: #3d3d3d;
|
||||
padding: 5px;
|
||||
border: solid 1px #9d9d9d;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
font-size: small;
|
||||
}
|
||||
|
||||
a.button.left {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
a.button.middle {
|
||||
border-radius: 0;
|
||||
border-left: 0;
|
||||
}
|
||||
|
||||
a.button.right {
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
border-left: 0;
|
||||
}
|
||||
|
||||
a.button:hover {
|
||||
background: -moz-linear-gradient(top, #0099c7, #0294C1);
|
||||
background: -webkit-linear-gradient(top, #0099c7, #0294C1);
|
||||
background: -o-linear-gradient(top, #0099c7, #0294C1);
|
||||
border: solid 1px #077A9C;
|
||||
color: #ffffff;
|
||||
}
|
||||
* { cursor:default; }
|
||||
a, a * { cursor:pointer; }
|
||||
|
||||
html { margin:0; overflow-x:auto; }
|
||||
body {
|
||||
overflow-x:hidden;
|
||||
min-width:1030px;
|
||||
margin:0;
|
||||
font:13pt "arial";
|
||||
background:#152534 url("/images/bg.jpg") no-repeat fixed center top; }
|
||||
|
||||
pre { color:#5997AF;}
|
||||
pre, pre * { cursor:text; }
|
||||
pre .cmt { color:#6D6D6D; font-style:italic; }
|
||||
pre .kwd { color:#43A8CF; font-weight:bold; }
|
||||
pre .typ { color:#128B7D; font-weight:bold; }
|
||||
pre .atr { color:#128B7D; font-weight:bold; font-style:italic; }
|
||||
pre .def { color:#CAD6E4; font-weight:bold; font-style:italic; }
|
||||
pre .prg { color:#854D6A; font-weight:bold; font-style:italic; }
|
||||
pre .val { color:#8AB647; font-style:italic; }
|
||||
pre .tab { border-left:1px dotted rgba(67,168,207,0.4); }
|
||||
pre .end { background:url("/images/tabEnd.png") no-repeat left bottom; }
|
||||
|
||||
.tall { height:100%; }
|
||||
.pre { padding:0 5px; font:11pt monospace; background:rgba(255,255,255,.15); border-radius:3px; }
|
||||
|
||||
.page-layout { margin:0 auto; width:1000px; }
|
||||
.docs-layout { margin:0 40px; }
|
||||
.talk-layout { margin:0 40px; }
|
||||
.wide-layout { margin:0 auto; }
|
||||
|
||||
#head { height:100px; background:url("/images/head.png") repeat-x bottom; }
|
||||
#head.docs { margin-left:280px; background:rgba(0,0,0,.25) url("/images/head-fade.png") no-repeat right top; }
|
||||
#head > div { position:relative }
|
||||
|
||||
#head-logo {
|
||||
position:absolute;
|
||||
left:-390px;
|
||||
top:0;
|
||||
width:917px;
|
||||
height:268px;
|
||||
pointer-events:none;
|
||||
background:url("/images/logo.png") no-repeat; }
|
||||
#head.docs #head-logo { left:-381px; position:fixed; }
|
||||
#head.forum #head-logo { left:-370px; }
|
||||
|
||||
#head-logo-link {
|
||||
position:absolute;
|
||||
display:block;
|
||||
top:10px;
|
||||
left:10px;
|
||||
width:236px;
|
||||
height:85px; }
|
||||
#head.docs #head-logo-link { left:-260px; }
|
||||
#head.forum #head-logo-link { left:30px; }
|
||||
|
||||
#head-links { position:absolute; right:0; bottom:13px; }
|
||||
#head.docs #head-links,
|
||||
#head.forum #head-links { right:20px; }
|
||||
#head-links > a {
|
||||
display:block;
|
||||
float:left;
|
||||
padding:10px 25px 25px 25px;
|
||||
color:rgba(255,255,255,.5);
|
||||
font-size:14pt;
|
||||
text-decoration:none;
|
||||
letter-spacing:1px;
|
||||
background:url("/images/head-link.png") no-repeat center bottom;
|
||||
transition:
|
||||
color 0.3s ease-in-out,
|
||||
text-shadow 0.4s ease-in-out; }
|
||||
#head-links > a:hover,
|
||||
#head-links > a.active {
|
||||
color:#1cb3ec;
|
||||
text-shadow:0 0 4px rgba(28,179,236,.8);
|
||||
background-image:url("/images/head-link_hover.png"); }
|
||||
|
||||
#head-banner { width:200px; height:100px; background:#000; }
|
||||
|
||||
#neck { z-index:0; height:40px; }
|
||||
#neck.home { height:370px; }
|
||||
#neck > div { position:relative }
|
||||
|
||||
#glow-arrow {
|
||||
position:absolute;
|
||||
top:-9px;
|
||||
left:0;
|
||||
right:-16px;
|
||||
height:48px;
|
||||
background:url("/images/glow-arrow.png") no-repeat right; }
|
||||
glow-arrow.docs { left:280px; }
|
||||
|
||||
#glow-line-vert {
|
||||
position:fixed;
|
||||
top:100px;
|
||||
left:280px;
|
||||
width:3px;
|
||||
height:844px;
|
||||
background:url("/images/glow-line-vert.png") no-repeat; }
|
||||
|
||||
#slideshow { position:absolute; top:10px; left:10px; width:700px; }
|
||||
#slideshow > div { visibility:hidden; opacity:0; position:absolute; transition:visibility 0s linear 1s, opacity 1s ease-in-out; }
|
||||
#slideshow > div.active { visibility:visible; opacity:1; transition-delay:0s; }
|
||||
#slideshow > div.init { transition-delay:0s; }
|
||||
#slideshow-nav { z-index:3; position:absolute; top:110px;; right:-12px; }
|
||||
#slideshow-nav > div { margin:5px 0; width:23px; height:23px; background:url("/images/slideshow-nav.png") no-repeat; }
|
||||
#slideshow-nav > div:hover { background-image:url("/images/slideshow-nav_active.png"); opacity:0.5; }
|
||||
#slideshow-nav > div.active { background-image:url("/images/slideshow-nav_active.png"); opacity:1; }
|
||||
|
||||
#slide0 { margin:30px 0 0 10px; }
|
||||
#slide0 > div { float:left; width:320px; font:10pt monospace; }
|
||||
#slide0 > div:first-child { margin:0 40px 0 0; }
|
||||
#slide0 > div > h2 { margin:0 0 5px 0; color:rgba(162,198,223,.78); }
|
||||
#slide0 > div > pre {
|
||||
margin:0;
|
||||
padding:15px 10px;
|
||||
line-height:14pt;
|
||||
background:rgba(0,0,0,.4);
|
||||
border-left:8px solid rgba(0,0,0,.3);
|
||||
box-shadow:1px 2px 16px rgba(28,180,236,.4); }
|
||||
|
||||
#slide1 { margin-top:50px; }
|
||||
#slide1 > p {
|
||||
padding:40px 20px 0 20px;
|
||||
font-style:italic;
|
||||
color:rgba(162,198,223,.78);
|
||||
letter-spacing:1px;
|
||||
line-height:25pt;
|
||||
background:url("/images/quotes.png") top left no-repeat; }
|
||||
#slide1 > div {
|
||||
float:right;
|
||||
margin-right:40px;
|
||||
font-style:italic;
|
||||
font-weight:bold;
|
||||
color:rgba(93,155,199,.44); }
|
||||
|
||||
#sidebar {
|
||||
z-index:2;
|
||||
position:absolute;
|
||||
top:5px; right:0;
|
||||
width:275px;
|
||||
height:726px;
|
||||
padding:210px 0 0 0;
|
||||
background:url("/images/sidebar.png") no-repeat; }
|
||||
#sidebar > h3 { margin:0 30px 0 30px; color:rgba(255,255,255,.5); }
|
||||
#sidebar > h3.blue { color:rgba(28,180,236,.5); }
|
||||
#sidebar-links,
|
||||
#sidebar-news {
|
||||
margin:10px 30px 50px 30px;
|
||||
padding:10px 0;
|
||||
background:rgba(0,0,0,.6); }
|
||||
#sidebar-links { box-shadow:1px 2px 12px rgba(255,255,255,.4); }
|
||||
#sidebar-news { box-shadow:1px 2px 12px rgba(28,180,236,.6); }
|
||||
#sidebar-links > a {
|
||||
display:block;
|
||||
margin-left:15px;
|
||||
padding:12px 20px 12px 45px;
|
||||
font-weight:bold;
|
||||
text-decoration:none;
|
||||
letter-spacing:1px;
|
||||
color:rgba(255,255,255,.4);
|
||||
transition:
|
||||
color 0.1s ease-in-out,
|
||||
text-shadow 0.2s ease-in-out; }
|
||||
#sidebar-news > a { transition: color 0.3s ease-in-out; }
|
||||
#sidebar-news > a > h4 { transition: color 0.1s ease-in-out, text-shadow 0.2s ease-in-out; }
|
||||
#sidebar-links > a:hover { color:#fff; text-shadow:0 0 6px #fff; }
|
||||
#sidebar-news > a { display:block; padding:15px; color:rgba(255,255,255,.4); text-decoration:none; }
|
||||
#sidebar-news > a > h4 { margin:0 0 5px 0; color:rgba(28,180,236,.5); }
|
||||
#sidebar-news > a:hover > h4 { margin:0 0 5px 0; color:rgba(28,180,236,.8); text-shadow:0 0 6px rgba(28,180,236,.6); }
|
||||
#sidebar-news > a:hover { color:rgba(255,255,255,1); }
|
||||
#sidebar-news > a.blue { color:rgba(28,180,236,.5); font-weight:bold; }
|
||||
#sidebar-news > a.blue:hover { color:#fff; }
|
||||
|
||||
#links-forum { background:url("/images/more-links_forum.png") no-repeat left center; }
|
||||
#links-github { background:url("/images/more-links_github.png") no-repeat left center; }
|
||||
#links-editors { background:url("/images/more-links_editors.png") no-repeat left center; }
|
||||
#links-nimbuild { background:url("/images/more-links_nimbuild.png") no-repeat left center; }
|
||||
|
||||
#overview-bg {
|
||||
position:fixed;
|
||||
top:0;
|
||||
bottom:0;
|
||||
left:0;
|
||||
width:280px;
|
||||
background:rgba(0,0,0,0.25); }
|
||||
#overview {
|
||||
z-index:3;
|
||||
position:fixed;
|
||||
overflow:auto;
|
||||
top:115px;
|
||||
bottom:20px;
|
||||
left:20px;
|
||||
width:245px; }
|
||||
#overview::-webkit-scrollbar { width:5px; }
|
||||
#overview::-webkit-scrollbar-track { border-radius:2px; background:rgba(255,255,255,.03); }
|
||||
#overview::-webkit-scrollbar-thumb { border-radius:2px; background:rgba(28,179,236,.5); }
|
||||
#overview > div { overflow:auto; margin-bottom:40px; }
|
||||
#overview a {
|
||||
display:block;
|
||||
padding:0 10px;
|
||||
margin:2px 5px 2px 0;
|
||||
color:rgba(255,255,255,.6);
|
||||
background:rgba(255,255,255,0.03);
|
||||
border-radius:2px;
|
||||
letter-spacing:1px;
|
||||
text-decoration:none; }
|
||||
#overview a:hover { color:#fff; background:rgba(255,255,255,0.05); }
|
||||
#overview > .types a { border-left:2px solid rgba(28,179,236,.4); }
|
||||
#overview > .procs a { border-left:2px solid rgba(255,223,53,.4); }
|
||||
#overview > .iters a { border-left:2px solid rgba(255,134,53,.4); }
|
||||
#overview > div > h4 {
|
||||
margin:0 5px 10px 0;
|
||||
padding:5px 10px;
|
||||
letter-spacing:1px;
|
||||
color:#fff;
|
||||
border-left:2px solid #fff;
|
||||
border-radius:2px;
|
||||
background:rgba(255,255,255,0.1); }
|
||||
#overview > .types h4 { color:#1cb3ec; border-color:#1cb3ec; }
|
||||
#overview > .procs h4 { color:#ffdf35; border-color:#ffdf35; }
|
||||
#overview > .iters h4 { color:#ff8635; border-color:#ff8635; }
|
||||
#overview h5 {
|
||||
color:rgba(28,179,236,.6);
|
||||
margin:10px 0 5px 0;
|
||||
padding:5px 5px;
|
||||
letter-spacing:1px; }
|
||||
|
||||
#body { z-index:1; position:relative; background:rgba(220,231,248,.6); }
|
||||
#body.docs { margin:0 40px 20px 320px; }
|
||||
#body.forum { margin:0 40px 20px 40px; }
|
||||
|
||||
#body-border {
|
||||
position:absolute;
|
||||
top:-25px;
|
||||
left:0;
|
||||
right:0;
|
||||
height:35px;
|
||||
background:rgba(0,0,0,.25); }
|
||||
|
||||
#body-border-left {
|
||||
position:absolute;
|
||||
left:-25px;
|
||||
top:-25px;
|
||||
bottom:-25px;
|
||||
width:35px;
|
||||
background:rgba(0,0,0,.25); }
|
||||
|
||||
#body-border-right {
|
||||
position:absolute;
|
||||
right:-25px;
|
||||
top:-25px;
|
||||
bottom:-25px;
|
||||
width:35px;
|
||||
background:rgba(0,0,0,.25); }
|
||||
|
||||
#body-border-bottom {
|
||||
position:absolute;
|
||||
left:10px;
|
||||
right:10px;
|
||||
bottom:-25px;
|
||||
height:35px;
|
||||
background:rgba(0,0,0,.25); }
|
||||
|
||||
#body.docs #body-border,
|
||||
#body.forum #body-border { left:10px; right:10px; }
|
||||
|
||||
#glow-line {
|
||||
position:absolute;
|
||||
top:-27px;
|
||||
left:100px;
|
||||
right:-25px;
|
||||
height:3px;
|
||||
background:url("/images/glow-line.png") no-repeat left; }
|
||||
#glow-line-bottom {
|
||||
position:absolute;
|
||||
bottom:-27px;
|
||||
left:-25px;
|
||||
right:100px;
|
||||
height:3px;
|
||||
background:url("/images/glow-line2.png") no-repeat right; }
|
||||
|
||||
#content { padding:40px 0; line-height:150%; }
|
||||
#content.page { width:680px; min-height:800px; padding-left:20px; }
|
||||
#content h1 { font-size:20pt; letter-spacing:1px; color:rgba(0,0,0,.75); }
|
||||
#content h2 { font-size:16pt; letter-spacing:1px; color:rgba(0,0,0,.7); margin-top:40px; }
|
||||
#content p { text-align:justify; color:rgba(0,0,0,.8); }
|
||||
#content a { color:#CEDAE9; text-decoration:none; }
|
||||
#content a:hover { color:#fff; }
|
||||
#content ul { padding-left:20px; }
|
||||
#content li { margin-bottom:10px; text-align:justify; }
|
||||
|
||||
#body.docs #content > div { margin-top:40px; padding-top:40px; border-top:1px dashed rgba(0,0,0,.25); }
|
||||
#body.docs #content > div:first-child { margin-top:0; padding-top:0; border:none; }
|
||||
#body.docs #content > div > h3 {
|
||||
color:#fff;
|
||||
margin:0 0 10px 0;
|
||||
padding:10px 20px;
|
||||
letter-spacing:1px;
|
||||
border-left:8px solid #fff;
|
||||
border-radius:3px;
|
||||
background:rgba(0,0,0,.7);
|
||||
box-shadow:1px 3px 12px rgba(0,0,0,.4); }
|
||||
#body.docs #content > #types-wrap > h3 { color:#1cb3ec; border-color:#1cb3ec; }
|
||||
#body.docs #content > #procs-wrap > h3 { color:#ffdf35; border-color:#ffdf35; }
|
||||
#body.docs #content > #iters-wrap > h3 { color:#ff8635; border-color:#ff8635; }
|
||||
#body.docs #content > div > div > div {
|
||||
overflow:auto;
|
||||
margin:10px 0;
|
||||
border-left:8px solid #fff;
|
||||
border-radius:3px;
|
||||
background:rgba(0,0,0,.1); }
|
||||
#body.docs #content > #types-wrap > div > div { border-color:rgba(28,179,236,.5); }
|
||||
#body.docs #content > #procs-wrap > div > div { border-color:rgba(255,223,53,.5); }
|
||||
#body.docs #content > #iters-wrap > div > div { border-color:rgba(255,134,53,.5); }
|
||||
#body.docs #content > #procs-wrap > div > div.overload-head { margin-bottom:0; }
|
||||
#body.docs #content > #procs-wrap > div > div.overload-tail { margin-top:0; border-top:1px dashed rgba(255,223,53,.5); }
|
||||
#body.docs #content > #procs-wrap > div > div.overload { margin-top:0; margin-bottom:0; border-top:1px dashed rgba(255,223,53,.5); }
|
||||
#body.docs #content > #iters-wrap > div > div.overload-head { margin-bottom:0; }
|
||||
#body.docs #content > #iters-wrap > div > div.overload-tail { margin-top:0; border-top:1px dashed rgba(255,134,53,.5); }
|
||||
#body.docs #content > #iters-wrap > div > div.overload { margin-top:0; margin-bottom:0; border-top:1px dashed rgba(255,134,53,.5); }
|
||||
#body.docs #content > div > div > p { margin:20px 10px 10px 10px; }
|
||||
|
||||
#body.docs #content > div > div > div > div { float:left; }
|
||||
#body.docs #content > div > div > div > div.head { width:60%; }
|
||||
#body.docs #content > div > div > div > div.data { width:40%; }
|
||||
|
||||
#body.docs #content > h1 > .symbol {
|
||||
padding:0 8px;
|
||||
border-radius:5px;
|
||||
background:rgba(206,218,233,.4); }
|
||||
|
||||
#body.docs #content > div > div > div > div.head > .sign {
|
||||
margin:0 10px 5px 10px;
|
||||
padding:10px 10px 0 10px;
|
||||
font-weight:bold;
|
||||
border-bottom:1px dashed rgba(0,0,0,.25); }
|
||||
#body.docs #content > div > div > div > div.head > .desc {
|
||||
padding:0 20px 10px 20px;
|
||||
color:rgba(0,0,0,.75); }
|
||||
#body.docs #content > div > #types > div > div.head > .sign > .symbol {
|
||||
padding:0 5px;
|
||||
border-radius:3px;
|
||||
background:rgba(28,179,236,.4); }
|
||||
#body.docs #content > div > #procs > div > div.head > .sign > .symbol {
|
||||
padding:0 5px;
|
||||
border-radius:3px;
|
||||
background:rgba(255,223,53,.3); }
|
||||
#body.docs #content > div > #iters > div > div.head > .sign > .symbol {
|
||||
padding:0 5px;
|
||||
border-radius:3px;
|
||||
background:rgba(255,134,53,.3); }
|
||||
|
||||
#body.docs #content > div > div > div > div.data > div {
|
||||
margin:0 20px 5px 10px;
|
||||
padding:10px 0 0 10px;
|
||||
font-style:italic;
|
||||
color:rgba(0,0,0,.6);
|
||||
border-bottom:1px dashed rgba(0,0,0,.25); }
|
||||
#body.docs #content > div > div > div > div.data > ul { margin:0; padding:0 10px; }
|
||||
#body.docs #content > div > div > div > div.data > ul:last-child { margin-bottom:5px; padding-bottom:10px; }
|
||||
#body.docs #content > div > div > div > div.data > ul .symbol { padding:0 5px; border-radius:3px; background:rgba(23,192,23,.25); }
|
||||
#body.docs #content > div > div > div > div.data > ul.pragmas .symbol { background:rgba(106,50,145,.25); }
|
||||
#body.docs #content > div > div > div > div.data > ul > li { margin:0; padding:0 10px; list-style:none; }
|
||||
|
||||
#body.docs #content pre {
|
||||
overflow:auto;
|
||||
margin:10px 0;
|
||||
padding:15px 10px;
|
||||
font-size:10pt;
|
||||
font-style:normal;
|
||||
line-height:14pt;
|
||||
background:rgba(0,0,0,.75);
|
||||
border-left:8px solid rgba(0,0,0,.3); }
|
||||
|
||||
#docs-sort { float:right; font-size:75%; }
|
||||
#docs-sort > a {
|
||||
cursor:default;
|
||||
margin:0 0 0 10px;
|
||||
padding:2px 10px;
|
||||
border-radius:5px;
|
||||
color:rgba(0,0,0,.25);
|
||||
background:rgba(0,0,0,.1);
|
||||
box-shadow:inset 0 1px 8px rgba(0,0,0,.4); }
|
||||
#docs-sort > a:hover,
|
||||
#docs-sort > a.active { color:#000; background:rgba(0,0,0,.2); }
|
||||
|
||||
#talk-heads { overflow:auto; margin:0 8px 0 8px; }
|
||||
#talk-heads > div { float:left; font-size:120%; font-weight:bold; }
|
||||
#talk-heads > .topic { width:55%; }
|
||||
#talk-heads > .detail { width:15%; }
|
||||
#talk-heads > .author { width:15%; }
|
||||
#talk-heads > .reply { width:15%; }
|
||||
#talk-heads > div > div { margin:0 10px 10px 10px; padding:0 10px 10px 10px; border-bottom:1px dashed rgba(0,0,0,0.4); }
|
||||
#talk-heads > .topic > div { margin-left:0; }
|
||||
#talk-heads > .author > div { margin-right:0; }
|
||||
|
||||
#talk-thread > div,
|
||||
#talk-threads > div {
|
||||
position:relative;
|
||||
margin:5px 0;
|
||||
overflow:auto;
|
||||
border-radius:3px;
|
||||
border:8px solid rgba(0,0,0,.8);
|
||||
border-top:none;
|
||||
border-bottom:none;
|
||||
background:rgba(0,0,0,0.1); }
|
||||
#talk-thread > div:nth-child(odd) { background:rgba(255,255,255,0.1); }
|
||||
#talk-threads > div:nth-child(odd) { background:rgba(0,0,0,0.2); }
|
||||
#talk-thread > div > div,
|
||||
#talk-threads > div > div { float:left; }
|
||||
#talk-thread > div > div > div,
|
||||
#talk-threads > div > div > div { margin:10px 20px; }
|
||||
#talk-threads > div > .topic { width:55%; }
|
||||
#talk-threads > div > .reply { width:15%; overflow:hidden; }
|
||||
#talk-threads > div > .detail { width:15%; overflow:hidden; }
|
||||
#talk-thread > div > .author,
|
||||
#talk-threads > div > .author {
|
||||
position:absolute;
|
||||
right:0;
|
||||
top:0;
|
||||
bottom:0;
|
||||
width:15%;
|
||||
overflow:hidden;
|
||||
background:rgba(0,0,0,0.8); }
|
||||
#talk-thread > div > .author a,
|
||||
#talk-threads > div > .author a { color:#1cb3ec !important; }
|
||||
#talk-thread > div > .author a:hover,
|
||||
#talk-threads > div > .author a:hover { color:#fff !important; }
|
||||
#talk-threads > div > .topic .pages { float:right; }
|
||||
#talk-threads > div > .topic > div > a { font-weight:bold; }
|
||||
#talk-threads > div > .detail > div { float:left; margin:0; }
|
||||
#talk-threads > div > .detail > div > div { margin-left:20px; padding:10px 10px 10px 22px; }
|
||||
#talk-threads > div > .detail > div { width:50%; }
|
||||
#talk-threads > div > .detail > div:first-child > div { background:url("/images/forum-views.png") no-repeat left; }
|
||||
#talk-threads > div > .detail > div:last-child > div { background:url("/images/forum-posts.png") no-repeat left; }
|
||||
|
||||
#talk-thread > div { margin:20px 0; min-height:150px; box-shadow:1px 3px 12px rgba(0,0,0,.4) }
|
||||
#talk-thread > div > .author > div > .avatar { margin-top:20px; }
|
||||
#talk-thread > div > .author > div > .avatar > img { box-shadow:0 0 12px #1cb3ec; }
|
||||
#talk-thread > div > .author > div > .name { }
|
||||
#talk-thread > div > .topic { width:85%; padding-bottom:10px; }
|
||||
#talk-thread > div > .topic pre {
|
||||
overflow:auto;
|
||||
margin:0;
|
||||
padding:15px 10px;
|
||||
font-size:10pt;
|
||||
font-style:normal;
|
||||
line-height:14pt;
|
||||
background:rgba(0,0,0,.75);
|
||||
border-left:8px solid rgba(0,0,0,.3); }
|
||||
|
||||
#talk-head,
|
||||
#talk-info {
|
||||
overflow:auto;
|
||||
border-radius:3px;
|
||||
border:8px solid rgba(0,0,0,.2);
|
||||
border-top:none;
|
||||
border-bottom:none;
|
||||
background:rgba(0,0,0,0.1); }
|
||||
#talk-head { margin-bottom:20px; }
|
||||
#talk-info { margin-top:20px; }
|
||||
#talk-head > div,
|
||||
#talk-info > div { float:left; }
|
||||
#talk-head > .info,
|
||||
#talk-info > .info { width:80%; }
|
||||
#talk-head > .user,
|
||||
#talk-info > .user { width:20%; background:rgba(0,0,0,.2); }
|
||||
#talk-info > .user > div > .reply { font-weight:bold; padding-left:22px; background:url("/images/forum-reply.png") no-repeat left; }
|
||||
#talk-head > div > div,
|
||||
#talk-info > div > div { padding:5px 20px; }
|
||||
#talk-head > .detail > div { float:left; margin:0; }
|
||||
#talk-head > .detail > div > div { padding-left:22px; }
|
||||
#talk-head > .detail > div:first-child > div { background:url("/images/forum-views.png") no-repeat left; }
|
||||
#talk-head > .detail > div:last-child > div { background:url("/images/forum-posts.png") no-repeat left; }
|
||||
|
||||
#talk-nav { margin:20px 8px 0 8px; padding-top:10px; border-top:1px dashed rgba(0,0,0,0.4); text-align:center; }
|
||||
#talk-nav > a.active { text-decoration:underline !important; }
|
||||
|
||||
.standout {
|
||||
padding:5px 30px;
|
||||
margin-bottom:20px;
|
||||
border:8px solid rgba(0,0,0,.8);
|
||||
border-right-width:16px;
|
||||
border-top-width:0;
|
||||
border-bottom-width:0;
|
||||
border-radius:3px;
|
||||
background:rgba(0,0,0,0.1);
|
||||
box-shadow:1px 3px 12px rgba(0,0,0,.4); }
|
||||
.standout h3 { margin-bottom:10px; padding-bottom:10px; border-bottom:1px dashed rgba(0,0,0,.8); }
|
||||
.standout li { margin:0 !important; padding-top:10px; border-top:1px dashed rgba(0,0,0,.2); }
|
||||
.standout ul { padding-bottom:5px; }
|
||||
.standout ul.tools { list-style:url("/images/docs-tools.png"); }
|
||||
.standout ul.library { list-style:url("/images/docs-library.png"); }
|
||||
.standout ul.internal { list-style:url("/images/docs-internal.png"); }
|
||||
.standout ul.tutorial { list-style:url("/images/docs-tutorial.png"); }
|
||||
.standout ul.example { list-style:url("/images/docs-example.png"); }
|
||||
.standout li:first-child { padding-top:0; border-top:none; }
|
||||
.standout li p { margin:0 0 10px 0 !important; line-height:130%; }
|
||||
.standout li > a { font-weight:bold; }
|
||||
|
||||
.forum-user-info,
|
||||
.forum-user-info * { cursor:help }
|
||||
|
||||
#foot { height:150px; position:relative; top:-10px; letter-spacing:1px; }
|
||||
#foot.home { background:url("/images/foot.png") repeat-x top; height:200px; }
|
||||
#foot.docs { margin-left:320px; margin-right:40px; }
|
||||
#foot.forum { margin-left:40px; margin-right:40px; }
|
||||
#foot > div { position:relative; }
|
||||
#foot.home > div { width:960px; }
|
||||
#foot h4 { font-size:11pt; color:rgba(255,255,255,.4); margin:40px 0 6px 0; }
|
||||
#foot a:hover { color:#fff; }
|
||||
|
||||
#foot-links { float:left; }
|
||||
#foot-links > div { float:left; padding:0 40px 0 0; line-height:120%; }
|
||||
#foot-links a { display:block; font-size:10pt; color:rgba(255,255,255,.3); text-decoration:none; }
|
||||
#foot-legal { float:right; font-size:10pt; color:rgba(255,255,255,.3); line-height:150%; text-align:right; }
|
||||
#foot-legal a { color:inherit; text-decoration:none; }
|
||||
#foot-legal > h4 > a { color:inherit; }
|
||||
|
||||
#mascot {
|
||||
z-index:2;
|
||||
position:absolute;
|
||||
top:-340px;
|
||||
right:25px;
|
||||
width:202px;
|
||||
height:319px;
|
||||
background:url("/images/mascot.png") no-repeat; }
|
||||
|
|
|
|||
BIN
public/images/bg.jpg
Normal file
BIN
public/images/bg.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 93 KiB |
BIN
public/images/forum-posts.png
Normal file
BIN
public/images/forum-posts.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 206 B |
BIN
public/images/forum-views.png
Normal file
BIN
public/images/forum-views.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 424 B |
BIN
public/images/glow-arrow.png
Normal file
BIN
public/images/glow-arrow.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.5 KiB |
BIN
public/images/glow-line.png
Normal file
BIN
public/images/glow-line.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
BIN
public/images/glow-line2.png
Normal file
BIN
public/images/glow-line2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
BIN
public/images/head-link.png
Normal file
BIN
public/images/head-link.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 203 B |
BIN
public/images/head-link_hover.png
Normal file
BIN
public/images/head-link_hover.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 799 B |
BIN
public/images/head.png
Normal file
BIN
public/images/head.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 171 B |
BIN
public/images/logo.png
Normal file
BIN
public/images/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 114 KiB |
12
public/js/arrow.js
Normal file
12
public/js/arrow.js
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
"use strict";
|
||||
|
||||
function positionGlowArrow() {
|
||||
var headLinks = document.getElementById("head-links");
|
||||
var activeLink = headLinks.getElementsByClassName("active")[0]
|
||||
if (activeLink == undefined || activeLink == null)
|
||||
return;
|
||||
|
||||
var offset = (headLinks.offsetWidth - activeLink.offsetLeft) - (activeLink.offsetWidth / 2) - 133;
|
||||
var glowArrow = document.getElementById("glow-arrow");
|
||||
glowArrow.style.right = offset + "px";
|
||||
}
|
||||
5
public/js/forum.js
Normal file
5
public/js/forum.js
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
"use strict";
|
||||
|
||||
window.onload = function() {
|
||||
positionGlowArrow();
|
||||
};
|
||||
Loading…
Add table
Add a link
Reference in a new issue