Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Introduce a 'Create New Hyphae' special url and top bar highlight #123

Closed
wants to merge 2 commits into from
+501 −429
Closed

Introduce a 'Create New Hyphae' special url and top bar highlight #123

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
598123c
Improve top-bar styling
roselandgoose Dec 26, 2021
78443a6
Introduce a 'Create New Hyphae' special url and top bar highlight
roselandgoose Dec 29, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
35 changes: 27 additions & 8 deletions static/default.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -656,11 +656,33 @@ kbd {
display: block;
padding: 0 .5rem;
}
.top-bar__highlight-new {
display: block;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nitpick: indentation

}
.top-bar__highlight-new-input {
padding-left: 0.5rem;
padding-right: 0;

margin-top: 0.35rem;
max-height: 1.3rem;
margin-bottom: 0.35rem;
}
.auth-links__admin-box {
flex-shrink: 0
}

.top-bar__search {
display: inline-block;
height: 100%;
}
.top-bar__search-bar {
border: 0;
vertical-align: -webkit-baseline-middle; /* You have no idea how sorry I am. This is a non-standard value. Seems to work in Safari, Opera and mobile Chrome. We need a jedi and a knight in shiny armor to replace it with something more standard. */
width: 100%;
display: inline-block;

padding-left: 0.5rem;
padding-right: 0;

margin-top: 4.4%;
height: 65%;
}

@media (prefers-color-scheme: dark) {
Expand Down Expand Up @@ -699,10 +721,6 @@ kbd {
display: none;
}

.top-bar__search-bar {
width: 100%;
}

.auth-links {
display: flex;
justify-content: flex-end;
Expand Down Expand Up @@ -751,7 +769,8 @@ kbd {
margin-right: 0;
}
.auth-links__link,
.top-bar__highlight-link {
.top-bar__highlight-link,
.top-bar__highlight-new {
padding-left: 1rem;
}
.top-bar__section_hidden-on-mobile {
Expand Down
17 changes: 17 additions & 0 deletions views/stuff.go
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
package views

import (
"fmt"
)

// inputSize returns the size in chars for an html input element
// (as a string) given the placeholder string.
func inputSize(placeholder string) string {
charCount := len(placeholder)
// Because size="0" is invalid, clamp above 1
min := 1
if charCount <= min {
charCount = min
}
return fmt.Sprint(charCount)
}
10 changes: 8 additions & 2 deletions views/stuff.qtpl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@
</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="{%s lc.Get("ui.title_search") %}" class="top-bar__search-bar">
<input type="text" name="q" placeholder="{%s lc.Get("ui.title_search") %}" class="top-bar__search-bar" size="{%s inputSize(lc.Get("ui.title_search")) %}">
</form>
</li>
<li class="top-bar__section top-bar__section_auth">
Expand Down Expand Up @@ -58,7 +58,13 @@
<li class="top-bar__section top-bar__section_highlights">
<ul class="top-bar__highlights">
{%- for _, link := range cfg.HeaderLinks -%}
{% if link.Href != "/" %}
{% if link.Href == "/new" %}
<li class="top-bar__highlight">
<form class="top-bar__highlight-new" method="GET" action="/new">
<input class="top-bar__highlight-new-input" size="{%s inputSize(link.Display) %}" type="text" name="new-path" placeholder="{%s link.Display %}">
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Few things.

  • A second input line in the top bar is not a good idea.
  • This input offers nothing more than the address bar in any browser.

</form>
</li>
{% elseif link.Href != "/" %}
<li class="top-bar__highlight">
<a class="top-bar__highlight-link" href="{%s link.Href %}">{%s link.Display %}</a>
</li>
Expand Down
Loading