Header changes.

This commit is contained in:
Zixaphir 2013-04-21 23:48:04 -07:00
parent 9340cfda9f
commit f295c5842e
7 changed files with 49 additions and 44 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

Binary file not shown.

File diff suppressed because one or more lines are too long

View File

@ -62,7 +62,7 @@ a[href="javascript:;"] {
#fourchanx-settings, #fourchanx-settings,
#qp, #ihover, #qp, #ihover,
#updater, #thread-stats, #updater, #thread-stats,
#navlinks, .fixed #boardNavDesktop, #navlinks, .fixed #header-bar,
#qr { #qr {
position: fixed; position: fixed;
} }
@ -93,7 +93,7 @@ a[href="javascript:;"] {
#watcher { #watcher {
z-index: 20; z-index: 20;
} }
.fixed #boardNavDesktop { .fixed #header-bar {
z-index: 10; z-index: 10;
} }
/* Header */ /* Header */
@ -107,49 +107,45 @@ a[href="javascript:;"] {
.fixed.bottom body { .fixed.bottom body {
padding-bottom: 2em; padding-bottom: 2em;
} }
#boardNavDesktop { .fixed #header-bar {
float: left;
}
.fixed #boardNavDesktop {
float: none;
right: 0; right: 0;
left: 0; left: 0;
padding: 3px 4px 4px; padding: 3px 4px 4px;
} }
.fixed.top #boardNavDesktop { .fixed.top #header-bar {
top: 0; top: 0;
} }
.fixed.bottom #boardNavDesktop { .fixed.bottom #header-bar {
bottom: 0; bottom: 0;
} }
#boardNavDesktop { #header-bar {
border-width: 0; border-width: 0;
transition: all .1s .05s ease-in-out; transition: all .1s .05s ease-in-out;
} }
.fixed.top #boardNavDesktop { .fixed.top #header-bar {
border-bottom-width: 1px; border-bottom-width: 1px;
} }
.fixed.bottom #boardNavDesktop { .fixed.bottom #header-bar {
box-shadow: 0 -1px 2px rgba(0, 0, 0, .15); box-shadow: 0 -1px 2px rgba(0, 0, 0, .15);
border-top-width: 1px; border-top-width: 1px;
} }
.fixed.bottom #boardNavDesktop .menu-button i { .fixed.bottom #header-bar .menu-button i {
border-top: none; border-top: none;
border-bottom: 6px solid; border-bottom: 6px solid;
} }
#board-list { #board-list {
text-align: center; text-align: center;
} }
.fixed #boardNavDesktop.autohide:not(:hover) { .fixed #header-bar.autohide:not(:hover) {
box-shadow: none; box-shadow: none;
transition: all .8s .6s cubic-bezier(.55, .055, .675, .19); transition: all .8s .6s cubic-bezier(.55, .055, .675, .19);
} }
.fixed.top #boardNavDesktop.autohide:not(:hover) { .fixed.top #header-bar.autohide:not(:hover) {
margin-bottom: -1em; margin-bottom: -1em;
-webkit-transform: translateY(-100%); -webkit-transform: translateY(-100%);
transform: translateY(-100%); transform: translateY(-100%);
} }
.fixed.bottom #boardNavDesktop.autohide:not(:hover) { .fixed.bottom #header-bar.autohide:not(:hover) {
-webkit-transform: translateY(100%); -webkit-transform: translateY(100%);
transform: translateY(100%); transform: translateY(100%);
} }
@ -159,25 +155,25 @@ a[href="javascript:;"] {
height: 10px; height: 10px;
position: absolute; position: absolute;
} }
#boardNavDesktop #toggle-header-bar { #header-bar #toggle-header-bar {
display: none; display: none;
} }
.fixed #boardNavDesktop #toggle-header-bar { .fixed #header-bar #toggle-header-bar {
display: block; display: block;
} }
.fixed #boardNavDesktop #toggle-header-bar { .fixed #header-bar #toggle-header-bar {
cursor: n-resize; cursor: n-resize;
} }
.fixed.top boardNavDesktop #toggle-header-bar { .fixed.top header-bar #toggle-header-bar {
top: 100%; top: 100%;
} }
.fixed.bottom #boardNavDesktop #toggle-header-bar { .fixed.bottom #header-bar #toggle-header-bar {
bottom: 100%; bottom: 100%;
} }
.fixed #boardNavDesktop #header-bar.autohide #toggle-header-bar { .fixed #header-bar #header-bar.autohide #toggle-header-bar {
cursor: s-resize; cursor: s-resize;
} }
#boardNavDesktop a:not(.entry) { #header-bar a:not(.entry) {
text-decoration: none; text-decoration: none;
padding: 1px; padding: 1px;
} }
@ -194,7 +190,7 @@ a[href="javascript:;"] {
.expand-all-shortcut { .expand-all-shortcut {
opacity: .45; opacity: .45;
} }
#settings-container { #shortcuts {
float: right; float: right;
} }
#navbotright, #navbotright,

View File

@ -2,7 +2,7 @@ Header =
init: -> init: ->
@menuButton = $.el 'span', @menuButton = $.el 'span',
className: 'menu-button' className: 'menu-button'
innerHTML: '<a class=brackets-wrap href=javascript:;><i></i></a>' innerHTML: '<i></i>'
@menu = new UI.Menu 'header' @menu = new UI.Menu 'header'
$.on @menuButton, 'click', @menuToggle $.on @menuButton, 'click', @menuToggle
@ -18,6 +18,8 @@ Header =
for setting in ['sticky top', 'sticky bottom', 'top'] for setting in ['sticky top', 'sticky bottom', 'top']
subEntries.push createSubEntry setting subEntries.push createSubEntry setting
@addShortcut Header.menuButton
$.event 'AddMenuEntry', $.event 'AddMenuEntry',
type: 'header' type: 'header'
el: @positionToggler el: @positionToggler
@ -69,6 +71,7 @@ Header =
setBoardList: -> setBoardList: ->
Header.nav = nav = $.id 'boardNavDesktop' Header.nav = nav = $.id 'boardNavDesktop'
nav.id = 'header-bar'
if a = $ "a[href*='/#{g.BOARD}/']", nav if a = $ "a[href*='/#{g.BOARD}/']", nav
a.className = 'current' a.className = 'current'
@ -82,7 +85,7 @@ Header =
$.sync 'Header auto-hide', Header.setBarVisibility $.sync 'Header auto-hide', Header.setBarVisibility
$.add fullBoardList, [nav.childNodes...] $.add fullBoardList, [nav.childNodes...]
$.add nav, [Header.menuButton, fullBoardList, Header.shortcuts, Header.bar, Header.toggle, Header.settings] $.add nav, [fullBoardList, Header.shortcuts, Header.bar, Header.toggle, Header.settings]
if Conf['Custom Board Navigation'] if Conf['Custom Board Navigation']
fullBoardList.hidden = true fullBoardList.hidden = true
@ -211,7 +214,7 @@ Header =
shortcut = $.el 'span', shortcut = $.el 'span',
className: 'shortcut' className: 'shortcut'
$.add shortcut, [$.tn(' ['), el, $.tn(']')] $.add shortcut, [$.tn(' ['), el, $.tn(']')]
$.add Header.shortcuts, shortcut $.prepend Header.shortcuts, shortcut
menuToggle: (e) -> menuToggle: (e) ->
Header.menu.toggle e, @, g Header.menu.toggle e, @, g

View File

@ -7,7 +7,7 @@ Settings =
href: 'javascript:;' href: 'javascript:;'
$.on link, 'click', Settings.open $.on link, 'click', Settings.open
$.add Header.settings, [$.tn(' ['), link, $.tn('] ')] Header.addShortcut link
$.get 'previousversion', null, (item) -> $.get 'previousversion', null, (item) ->
if previous = item['previousversion'] if previous = item['previousversion']