Header changes.
This commit is contained in:
parent
9340cfda9f
commit
f295c5842e
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
BIN
builds/crx.crx
BIN
builds/crx.crx
Binary file not shown.
File diff suppressed because one or more lines are too long
@ -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,
|
||||||
|
|||||||
@ -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
|
||||||
@ -17,7 +17,9 @@ Header =
|
|||||||
subEntries = []
|
subEntries = []
|
||||||
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
|
||||||
|
|||||||
@ -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']
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user