1
0
mirror of https://github.com/osmarks/mycorrhiza.git synced 2024-10-30 03:36:16 +00:00

Implement the new top bar #78

I decided to not implement dropdowns and stuff yet.

This stuff needs some styling for sure.
This commit is contained in:
Timur Ismagilov 2021-07-14 01:52:33 +05:00
parent 7a6808ed1d
commit f8f4eb92c8
7 changed files with 553 additions and 510 deletions

View File

@ -21,14 +21,9 @@
/* Phones and whatnot */
.layout { display: grid; row-gap: 1rem; }
header { width: 100%; margin-bottom: 1rem; }
.header-links__list, .hypha-tabs__flex { margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.header-links__entry, .hypha-tabs__tab { list-style-type: none; }
.header-links__entry { margin-right: .5rem; line-height: 1.25rem; }
.header-links__search-bar { margin: 0; }
.header-links__entry_user, .header-links__entry_register { font-style:italic; }
.header-links__link { display: inline-block; padding: .25rem; text-decoration: none; }
.hypha-tabs__flex { margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.hypha-tabs__tab { list-style-type: none; }
.hypha-tabs { padding: 0; margin: 0; }
.hypha-tabs__tab { margin-right: .5rem; padding: 0; }
.hypha-tabs__link { display: inline-block; padding: .25rem; text-decoration: none; }
@ -57,17 +52,10 @@ header { width: 100%; margin-bottom: 1rem; }
main { border-radius: .25rem; }
.layout-card { width: 800px; margin: 0 auto; }
.header-links { padding: 0; }
.header-links__entry { margin-right: 1.5rem; }
.header-links__entry_user { margin: 0 2rem 0 auto; }
.header-links__entry:nth-of-type(1),
.hypha-tabs { padding: 0; }
.hypha-tabs__tab { border-radius: .25rem .25rem 0 0; margin-right: 0; }
.hypha-tabs__selection, .hypha-tabs__link { padding: .25rem .5rem; }
.header-links__entry:nth-of-type(1), .hypha-tabs__tab:nth-of-type(1) { margin-left: 2rem; }
.header-links__search { margin: 0; }
.hypha-tabs__tab:nth-of-type(1) { margin-left: 2rem; }
}
@ -243,8 +231,6 @@ table,
html { background-color: #eee;
}
header { background-color: #ddd; }
.header-links__link { color: black; }
.header-links__link:hover { background-color: #eee; }
main { background-color: white; }
.shy-link { color: black; }
@ -269,9 +255,7 @@ a:visited, .wikilink_external:visited { color: #ffb86c; }
.wikilink_new, .wikilink_new:visited { color: #dd4444; }
.subhyphae__link:hover, .sibling-hyphae__link:hover, .backlinks__link:hover { background-color: #444; }
.header-links__link, .header-links__link:visited,
.prevnext__el, .prevnext__el:visited { color: #ddd; }
.header-links__link:hover { background-color: #444; }
.hypha-tabs__tab a, .hypha-tabs__tab { color: #ddd; background-color: #232323; border: 0; }
.layout-card__title, .hypha-tabs__tab_active { background-color: #343434; }
@ -607,4 +591,54 @@ kbd {
}
.help-topics__list ul {
padding-left: 1rem;
}
/*
* Top bar
*/
@media screen and (min-width: 800px) {
.top-bar {
padding: 0;
}
.top-bar ul {
padding: 0;
margin: 0;
}
ul.top-bar__wrapper {
display: grid;
margin: 0 2rem;
}
.top-bar__section {
display: block;
}
.top-bar__section_home {
grid-column: 1 / span 1;
}
.top-bar__section_search {
grid-column: 2 / span 1;
}
.top-bar__section_auth {
grid-column: 3 / span 1;
}
.top-bar__section_highlights {
grid-column: 1 / span 3;
}
.top-bar__search-bar {
width: 100%;
}
.auth-links {
display: flex;
justify-content: flex-end;
}
.auth-links__box {
display: block;
}
.top-bar__highlights {
display: flex;
}
.top-bar__highlight {
display: block;
}
}

View File

@ -308,11 +308,11 @@
// Common shortcuts
pageShortcuts.group('Common', function () {
this.bindCollection('g', '.header-links__link', 'First 9 header links', 'Header link');
this.bindCollection('g', '.top-bar__highlight-link', 'First 9 header links', 'Header link');
this.bindLink('g h', '/', 'Home');
this.bindLink('g l', '/list/', 'List of hyphae');
this.bindLink('g r', '/recent-changes/', 'Recent changes');
this.bindElement('g u', '.header-links__entry_user .header-links__link', 'Your profiles hypha');
this.bindElement('g u', '.auth-links__user-link', 'Your profiles hypha');
});
if (!onEditPage) {

View File

@ -70,7 +70,7 @@ function insertTimeUTC() {
}
function insertUserlink() {
const userlink = document.querySelector('.header-links__entry_user a')
const userlink = document.querySelector('.auth-links__user-link')
const userHypha = userlink.getAttribute('href').substring(7) // no /hypha/
textInserter('[[' + userHypha + ']]')()
}

View File

@ -1,8 +1,6 @@
{% import "net/http" %}
{% import "strings" %}
{% import "github.com/bouncepaw/mycorrhiza/cfg" %}
{% import "github.com/bouncepaw/mycorrhiza/user" %}
{% import "github.com/bouncepaw/mycorrhiza/util" %}
This is the <nav> seen on top of many pages.
{% code
@ -47,23 +45,6 @@ var navEntries = []navEntry{
</nav>
{% endfunc %}
{% func UserMenuHTML(u *user.User) %}
{% if cfg.UseAuth %}
<li class="header-links__entry header-links__entry_user">
{% if u.Group == "anon" %}
<a href="/login" class="header-links__link">Login</a>
{% else %}
<a href="/hypha/{%s cfg.UserHypha %}/{%s u.Name %}" class="header-links__link">{%s util.BeautifulName(u.Name) %}</a>
{% endif %}
</li>
{% endif %}
{% if cfg.UseAuth && cfg.AllowRegistration && u.Group == "anon" %}
<li class="header-links__entry header-links__entry_register">
<a href="/register" class="header-links__link">Register</a>
</li>
{% endif %}
{% endfunc %}
{% func siblingHyphaeHTML(siblings string) %}
<aside class="sibling-hyphae layout-card">
<h2 class="sibling-hyphae__title layout-card__title">Sibling hyphae</h2>

View File

@ -11,30 +11,24 @@ import "net/http"
import "strings"
//line views/nav.qtpl:3
import "github.com/bouncepaw/mycorrhiza/cfg"
//line views/nav.qtpl:4
import "github.com/bouncepaw/mycorrhiza/user"
//line views/nav.qtpl:5
import "github.com/bouncepaw/mycorrhiza/util"
// This is the <nav> seen on top of many pages.
//line views/nav.qtpl:8
//line views/nav.qtpl:6
import (
qtio422016 "io"
qt422016 "github.com/valyala/quicktemplate"
)
//line views/nav.qtpl:8
//line views/nav.qtpl:6
var (
_ = qtio422016.Copy
_ = qt422016.AcquireByteBuffer
)
//line views/nav.qtpl:9
//line views/nav.qtpl:7
type navEntry struct {
path string
title string
@ -51,281 +45,193 @@ var navEntries = []navEntry{
{"text", "Raw text"},
}
//line views/nav.qtpl:25
//line views/nav.qtpl:23
func StreamNavHTML(qw422016 *qt422016.Writer, rq *http.Request, hyphaName, navType string, revisionHash ...string) {
//line views/nav.qtpl:25
//line views/nav.qtpl:23
qw422016.N().S(`
`)
//line views/nav.qtpl:27
//line views/nav.qtpl:25
u := user.FromRequest(rq)
//line views/nav.qtpl:28
//line views/nav.qtpl:26
qw422016.N().S(`
<nav class="hypha-tabs main-width">
<ul class="hypha-tabs__flex">
`)
//line views/nav.qtpl:31
//line views/nav.qtpl:29
for _, entry := range navEntries {
//line views/nav.qtpl:32
//line views/nav.qtpl:30
if navType == "revision" && entry.path == "revision" {
//line views/nav.qtpl:30
qw422016.N().S(` <li class="hypha-tabs__tab hypha-tabs__tab_active">
<span class="hypha-tabs__selection">`)
//line views/nav.qtpl:32
qw422016.N().S(` <li class="hypha-tabs__tab hypha-tabs__tab_active">
<span class="hypha-tabs__selection">`)
//line views/nav.qtpl:34
qw422016.E().S(revisionHash[0])
//line views/nav.qtpl:34
//line views/nav.qtpl:32
qw422016.N().S(`</span>
</li>
`)
//line views/nav.qtpl:36
//line views/nav.qtpl:34
} else if navType == entry.path {
//line views/nav.qtpl:36
//line views/nav.qtpl:34
qw422016.N().S(` <li class="hypha-tabs__tab hypha-tabs__tab_active">
<span class="hypha-tabs__selection">`)
//line views/nav.qtpl:38
//line views/nav.qtpl:36
qw422016.E().S(entry.title)
//line views/nav.qtpl:38
//line views/nav.qtpl:36
qw422016.N().S(`</span>
</li>
`)
//line views/nav.qtpl:40
//line views/nav.qtpl:38
} else if entry.path != "revision" && u.CanProceed(entry.path) {
//line views/nav.qtpl:40
//line views/nav.qtpl:38
qw422016.N().S(` <li class="hypha-tabs__tab">
<a class="hypha-tabs__link" href="/`)
//line views/nav.qtpl:42
//line views/nav.qtpl:40
qw422016.E().S(entry.path)
//line views/nav.qtpl:42
//line views/nav.qtpl:40
qw422016.N().S(`/`)
//line views/nav.qtpl:42
//line views/nav.qtpl:40
qw422016.E().S(hyphaName)
//line views/nav.qtpl:42
//line views/nav.qtpl:40
qw422016.N().S(`">`)
//line views/nav.qtpl:42
//line views/nav.qtpl:40
qw422016.E().S(entry.title)
//line views/nav.qtpl:42
//line views/nav.qtpl:40
qw422016.N().S(`</a>
</li>
`)
//line views/nav.qtpl:44
//line views/nav.qtpl:42
}
//line views/nav.qtpl:45
//line views/nav.qtpl:43
}
//line views/nav.qtpl:45
//line views/nav.qtpl:43
qw422016.N().S(` </ul>
</nav>
`)
//line views/nav.qtpl:48
//line views/nav.qtpl:46
}
//line views/nav.qtpl:48
//line views/nav.qtpl:46
func WriteNavHTML(qq422016 qtio422016.Writer, rq *http.Request, hyphaName, navType string, revisionHash ...string) {
//line views/nav.qtpl:48
//line views/nav.qtpl:46
qw422016 := qt422016.AcquireWriter(qq422016)
//line views/nav.qtpl:48
//line views/nav.qtpl:46
StreamNavHTML(qw422016, rq, hyphaName, navType, revisionHash...)
//line views/nav.qtpl:48
//line views/nav.qtpl:46
qt422016.ReleaseWriter(qw422016)
//line views/nav.qtpl:48
//line views/nav.qtpl:46
}
//line views/nav.qtpl:48
//line views/nav.qtpl:46
func NavHTML(rq *http.Request, hyphaName, navType string, revisionHash ...string) string {
//line views/nav.qtpl:48
//line views/nav.qtpl:46
qb422016 := qt422016.AcquireByteBuffer()
//line views/nav.qtpl:48
//line views/nav.qtpl:46
WriteNavHTML(qb422016, rq, hyphaName, navType, revisionHash...)
//line views/nav.qtpl:48
//line views/nav.qtpl:46
qs422016 := string(qb422016.B)
//line views/nav.qtpl:48
//line views/nav.qtpl:46
qt422016.ReleaseByteBuffer(qb422016)
//line views/nav.qtpl:48
//line views/nav.qtpl:46
return qs422016
//line views/nav.qtpl:46
}
//line views/nav.qtpl:48
}
//line views/nav.qtpl:50
func StreamUserMenuHTML(qw422016 *qt422016.Writer, u *user.User) {
//line views/nav.qtpl:50
qw422016.N().S(`
`)
//line views/nav.qtpl:51
if cfg.UseAuth {
//line views/nav.qtpl:51
qw422016.N().S(`
<li class="header-links__entry header-links__entry_user">
`)
//line views/nav.qtpl:53
if u.Group == "anon" {
//line views/nav.qtpl:53
qw422016.N().S(`
<a href="/login" class="header-links__link">Login</a>
`)
//line views/nav.qtpl:55
} else {
//line views/nav.qtpl:55
qw422016.N().S(`
<a href="/hypha/`)
//line views/nav.qtpl:56
qw422016.E().S(cfg.UserHypha)
//line views/nav.qtpl:56
qw422016.N().S(`/`)
//line views/nav.qtpl:56
qw422016.E().S(u.Name)
//line views/nav.qtpl:56
qw422016.N().S(`" class="header-links__link">`)
//line views/nav.qtpl:56
qw422016.E().S(util.BeautifulName(u.Name))
//line views/nav.qtpl:56
qw422016.N().S(`</a>
`)
//line views/nav.qtpl:57
}
//line views/nav.qtpl:57
qw422016.N().S(`
</li>
`)
//line views/nav.qtpl:59
}
//line views/nav.qtpl:59
qw422016.N().S(`
`)
//line views/nav.qtpl:60
if cfg.UseAuth && cfg.AllowRegistration && u.Group == "anon" {
//line views/nav.qtpl:60
qw422016.N().S(`
<li class="header-links__entry header-links__entry_register">
<a href="/register" class="header-links__link">Register</a>
</li>
`)
//line views/nav.qtpl:64
}
//line views/nav.qtpl:64
qw422016.N().S(`
`)
//line views/nav.qtpl:65
}
//line views/nav.qtpl:65
func WriteUserMenuHTML(qq422016 qtio422016.Writer, u *user.User) {
//line views/nav.qtpl:65
qw422016 := qt422016.AcquireWriter(qq422016)
//line views/nav.qtpl:65
StreamUserMenuHTML(qw422016, u)
//line views/nav.qtpl:65
qt422016.ReleaseWriter(qw422016)
//line views/nav.qtpl:65
}
//line views/nav.qtpl:65
func UserMenuHTML(u *user.User) string {
//line views/nav.qtpl:65
qb422016 := qt422016.AcquireByteBuffer()
//line views/nav.qtpl:65
WriteUserMenuHTML(qb422016, u)
//line views/nav.qtpl:65
qs422016 := string(qb422016.B)
//line views/nav.qtpl:65
qt422016.ReleaseByteBuffer(qb422016)
//line views/nav.qtpl:65
return qs422016
//line views/nav.qtpl:65
}
//line views/nav.qtpl:67
func streamsiblingHyphaeHTML(qw422016 *qt422016.Writer, siblings string) {
//line views/nav.qtpl:67
//line views/nav.qtpl:48
qw422016.N().S(`
<aside class="sibling-hyphae layout-card">
<h2 class="sibling-hyphae__title layout-card__title">Sibling hyphae</h2>
`)
//line views/nav.qtpl:70
//line views/nav.qtpl:51
qw422016.N().S(siblings)
//line views/nav.qtpl:70
//line views/nav.qtpl:51
qw422016.N().S(`
</aside>
`)
//line views/nav.qtpl:72
//line views/nav.qtpl:53
}
//line views/nav.qtpl:72
//line views/nav.qtpl:53
func writesiblingHyphaeHTML(qq422016 qtio422016.Writer, siblings string) {
//line views/nav.qtpl:72
//line views/nav.qtpl:53
qw422016 := qt422016.AcquireWriter(qq422016)
//line views/nav.qtpl:72
//line views/nav.qtpl:53
streamsiblingHyphaeHTML(qw422016, siblings)
//line views/nav.qtpl:72
//line views/nav.qtpl:53
qt422016.ReleaseWriter(qw422016)
//line views/nav.qtpl:72
//line views/nav.qtpl:53
}
//line views/nav.qtpl:72
//line views/nav.qtpl:53
func siblingHyphaeHTML(siblings string) string {
//line views/nav.qtpl:72
//line views/nav.qtpl:53
qb422016 := qt422016.AcquireByteBuffer()
//line views/nav.qtpl:72
//line views/nav.qtpl:53
writesiblingHyphaeHTML(qb422016, siblings)
//line views/nav.qtpl:72
//line views/nav.qtpl:53
qs422016 := string(qb422016.B)
//line views/nav.qtpl:72
//line views/nav.qtpl:53
qt422016.ReleaseByteBuffer(qb422016)
//line views/nav.qtpl:72
//line views/nav.qtpl:53
return qs422016
//line views/nav.qtpl:72
//line views/nav.qtpl:53
}
//line views/nav.qtpl:74
//line views/nav.qtpl:55
func StreamSubhyphaeHTML(qw422016 *qt422016.Writer, subhyphae string) {
//line views/nav.qtpl:74
//line views/nav.qtpl:55
qw422016.N().S(`
`)
//line views/nav.qtpl:75
//line views/nav.qtpl:56
if strings.TrimSpace(subhyphae) != "" {
//line views/nav.qtpl:75
//line views/nav.qtpl:56
qw422016.N().S(`
<section class="subhyphae">
<h2 class="subhyphae__title">Subhyphae</h2>
<nav class="subhyphae__nav">
<ul class="subhyphae__list">
`)
//line views/nav.qtpl:80
//line views/nav.qtpl:61
qw422016.N().S(subhyphae)
//line views/nav.qtpl:80
//line views/nav.qtpl:61
qw422016.N().S(`
</ul>
</nav>
</section>
`)
//line views/nav.qtpl:84
//line views/nav.qtpl:65
}
//line views/nav.qtpl:84
//line views/nav.qtpl:65
qw422016.N().S(`
`)
//line views/nav.qtpl:85
//line views/nav.qtpl:66
}
//line views/nav.qtpl:85
//line views/nav.qtpl:66
func WriteSubhyphaeHTML(qq422016 qtio422016.Writer, subhyphae string) {
//line views/nav.qtpl:85
//line views/nav.qtpl:66
qw422016 := qt422016.AcquireWriter(qq422016)
//line views/nav.qtpl:85
//line views/nav.qtpl:66
StreamSubhyphaeHTML(qw422016, subhyphae)
//line views/nav.qtpl:85
//line views/nav.qtpl:66
qt422016.ReleaseWriter(qw422016)
//line views/nav.qtpl:85
//line views/nav.qtpl:66
}
//line views/nav.qtpl:85
//line views/nav.qtpl:66
func SubhyphaeHTML(subhyphae string) string {
//line views/nav.qtpl:85
//line views/nav.qtpl:66
qb422016 := qt422016.AcquireByteBuffer()
//line views/nav.qtpl:85
//line views/nav.qtpl:66
WriteSubhyphaeHTML(qb422016, subhyphae)
//line views/nav.qtpl:85
//line views/nav.qtpl:66
qs422016 := string(qb422016.B)
//line views/nav.qtpl:85
//line views/nav.qtpl:66
qt422016.ReleaseByteBuffer(qb422016)
//line views/nav.qtpl:85
//line views/nav.qtpl:66
return qs422016
//line views/nav.qtpl:85
//line views/nav.qtpl:66
}

View File

@ -18,17 +18,50 @@
</head>
<body>
<header>
<nav class="header-links main-width">
<ul class="header-links__list">
{%- for _, link := range cfg.HeaderLinks -%}
<li class="header-links__entry"><a class="header-links__link" href="{%s link.Href %}">{%s link.Display %}</a></li>
{%- endfor -%}
<li class="header-links__entry header-links__entry_search">
<form class="header-links__search" method="GET" action="/title-search">
<input type="text" name="q" placeholder="Title search" class="header-links__search-bar">
<nav class="main-width top-bar">
<ul class="top-bar__wrapper">
<li class="top-bar__section top-bar__section_home">
<a class="top-bar__home-link" href="/">{%s cfg.WikiName %}</a>
</li>
<li class="top-bar__section top-bar__section_search">
<form class="top-bar__search" method="GET" action="/title-search">
<input type="text" name="q" placeholder="Title search" class="top-bar__search-bar">
</form>
</li>
{%s= UserMenuHTML(u) %}
{% if cfg.UseAuth %}
<li class="top-bar__section top-bar__section_auth">
<ul class="top-bar__auth auth-links">
<li class="auth-links__box auth-links__user-box">
{% if u.Group == "anon" %}
<a href="/login" class="auth-links__login-link">Login</a>
{% else %}
<a href="/hypha/{%s cfg.UserHypha %}/{%s u.Name %}" class="auth-links__user-link">{%s util.BeautifulName(u.Name) %}</a>
{% endif %}
</li>
{% if cfg.AllowRegistration && u.Group == "anon" %}
<li class="auth-links__box auth-links__register-box">
<a href="/register" class="auth-links__register-link">Register</a>
</li>
{% endif %}
{% if u.Group == "admin" %}
<li class="auth-links__box auth-links__admin-box">
<a href="/admin" class="auth-links__admin-link">Admin panel</a>
</li>
{% endif %}
</ul>
</li>
{% endif %}
<li class="top-bar__section top-bar__section_highlights">
<ul class="top-bar__highlights">
{%- for _, link := range cfg.HeaderLinks -%}
{% if link.Href != "/" %}
<li class="top-bar__highlight">
<a class="top-bar__highlight-link" href="{%s link.Href %}">{%s link.Display %}</a>
</li>
{% endif %}
{%- endfor -%}
</ul>
</li>
</ul>
</nav>
</header>

File diff suppressed because it is too large Load Diff