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

bug/issue 350 Fix website shelf collapse/expand event #351

Merged
merged 4 commits into from
May 13, 2020
Merged

bug/issue 350 Fix website shelf collapse/expand event #351

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
8e0ec63
fix: add css rule pointer-events
hutchgrant May 7, 2020
3f34548
fix: add css grid (#353)
hutchgrant May 8, 2020
caca15a
fix: remove invalid h2 within inline element
hutchgrant May 8, 2020
89b6a8e
Merge branch 'master' into bug/issue-350-menu-collapse
thescientist13 May 13, 2020
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
19 changes: 14 additions & 5 deletions www/components/shelf/shelf.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,14 @@
}
}

& .list-wrap a {
display: grid;
grid-template-columns: auto 20px;
align-items: center;
}

& h2 {
pointer-events: none;
display: block;
font-size: 1.5em;
margin-block-start: 0.83em;
Expand Down Expand Up @@ -65,11 +72,13 @@
}
}

& span > svg {
margin-top:5px;
float:right;
margin-left: auto;
height:20px;
& span {
pointer-events: none;
> svg {
margin-top:5px;
margin-left: auto;
height:20px;
}
}

& .hidden {
Expand Down
2 changes: 1 addition & 1 deletion www/components/shelf/shelf.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -128,7 +128,7 @@ class Shelf extends LitElement {

return html`
<li class="list-wrap">
<a href="${item.link}" @click="${this.handleClick}"><h2 id="${id}">${item.label} <span>${chevron}</span></h2></a>
<a id="${id}" href="${item.link}" @click="${this.handleClick}"><h2>${item.label}</h2><span>${chevron}</span></a>
Copy link
Member

Choose a reason for hiding this comment

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

minor indentation change.

also, I think a block element (<h2>) technically isn't allowed inside an inline element (<a>). (I know not introduced by this PR but just commenting on it.)

Copy link
Member Author

Choose a reason for hiding this comment

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

Well we might as well fix that while we're at it. A span would be valid.

<hr>
${renderListItems(children, selected)}
</li>
Expand Down