Added search

This commit is contained in:
Eduard Urbach 2017-09-22 23:36:43 +02:00
parent 43f350f5d7
commit e99f8e36e5
5 changed files with 45 additions and 35 deletions

View File

@ -15,16 +15,21 @@ component Sidebar(user *arn.User)
SidebarButton("Artworks", "/artworks", "paint-brush")
SidebarButton("Soundtracks", "/soundtracks", "headphones")
SidebarButton("AMVs", "/amvs", "video-camera")
//- SidebarButton("Games", "/games", "gamepad")
SidebarButton("Users", "/users", "globe")
//- SidebarButton("Search", "/search", "search")
if user != nil
if user.Role != ""
SidebarButton("Statistics", "/statistics", "pie-chart")
SidebarButton("Statistics", "/statistics", "pie-chart")
SidebarButton("Settings", "/settings", "cog")
.spacer
.sidebar-link(aria-label="Search")
.sidebar-button
Icon("search")
FuzzySearch
SidebarButton("Help", "/thread/I3MMiOtzR", "question-circle")
if user != nil

View File

@ -98,11 +98,6 @@ export class AnimeNotifier {
}
run() {
// Add "osx" class on macs so we can set a proper font-size
if(navigator.platform.includes("Mac")) {
document.documentElement.classList.add("osx")
}
// Check for WebP support
this.webpEnabled = canUseWebP()
@ -127,6 +122,9 @@ export class AnimeNotifier {
this.sideBar = this.app.find("sidebar")
document.body.addEventListener("click", e => {
if(document.activeElement.id === "search")
return;
this.sideBar.classList.remove("sidebar-visible")
})

View File

@ -4,8 +4,8 @@ remove-margin = 1.1rem
// Put navigation to the bottom of the screen
flex-direction column-reverse !important
.extension-navigation
display inline-block
// .extension-navigation
// display inline-block
.anime-list
// max-width 500px

View File

@ -19,7 +19,6 @@ input, textarea, select
ui-disabled
input, select
width 100%
padding 0.5rem 1rem
input

View File

@ -42,45 +42,53 @@
display none
#search
flex 1
border-radius 0
background transparent
border none
color nav-link-hover-color
font-size 1em
min-width 0
padding 0
width 0
flex-grow 1
::placeholder
color nav-link-color
// #search
// flex 1
// border-radius 0
// background transparent
// border none
// color nav-link-hover-color
// font-size 1em
// min-width 0
:focus
border none
box-shadow none
// ::placeholder
// color nav-link-color
.extra-navigation
display none
// :focus
// border none
// box-shadow none
.extension-navigation
display none
// .extra-navigation
// display none
> 330px
.navigation-button, #search
font-size 1.3em
// .extension-navigation
// display none
// > 330px
// .navigation-button, #search
// font-size 1.3em
// > 550px
// #navigation
// padding 0 content-padding
> 930px
.navigation-button, #search
font-size 1.2em
// > 930px
// .navigation-button, #search
// font-size 1.2em
#navigation
justify-content flex-start
// #navigation
// justify-content flex-start
.extra-navigation
display block
// .extra-navigation
// display block
// @media screen and (max-device-height: 500px)
// #navigation