jaculabilis/danbooru
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

posts: factor out post navbar into component.

Browse Source 
* Factor out the post navbar into a component. The post navbar is the
  part of the post containing the current search, the list of pools, and
  the list of favgroups, along with next/prev navigation links.

* Change navbar markup: remove various unused CSS classes/IDs, change
  pools to use same markup as favgroups, replace nested <div>'s with
  flat <ul>/<li> list.

* Use CSS to truncate long searches/pool names/favgroup names if they're
  too wide for the screen (especially on mobile).
This commit is contained in:
evazion
2021-01-29 18:36:15 -06:00
parent 151a9b026e
commit 1e778dbbf6
16 changed files with 203 additions and 186 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
app/javascript/src/javascripts/posts.js.erb
View File

@@ -178,18 +178,8 @@ Post.swipe_prev = function(e) {
Post.nav_prev = function(e) {
var href = "";
if ($("#search-seq-nav").length) {
href = $("#search-seq-nav a[rel~=prev]").attr("href");
if (href) {
location.href = href;
}
} else if ($(".paginator a[rel~=prev]").length) {
if ($(".paginator a[rel~=prev], .post-notice-search a[rel~=prev]").length) {
location.href = $("a[rel~=prev]").attr("href");
} else {
href = $("#pool-nav li[data-selected=true] a[rel=prev], #favgroup-nav li[data-selected=true] a[rel=prev]").attr("href");
if (href) {
location.href = href;
}
}
e.preventDefault();
@@ -198,16 +188,8 @@ Post.nav_prev = function(e) {
Post.nav_next = function(e) {
var href = "";
if ($("#search-seq-nav").length) {
href = $("#search-seq-nav a[rel~=next]").attr("href");
location.href = href;
} else if ($(".paginator a[rel~=next]").length) {
location.href = $(".paginator a[rel~=next]").attr("href");
} else {
href = $("#pool-nav li[data-selected=true] a[rel=next], #favgroup-nav li[data-selected=true] a[rel=next]").attr("href");
if (href) {
location.href = href;
}
if ($(".paginator a[rel~=next], .post-notice-search a[rel~=next]").length) {
location.href = $("a[rel~=next]").attr("href");
}
e.preventDefault();

44
app/javascript/src/styles/specific/posts.scss
View File

@@ -208,10 +208,6 @@ div#c-posts {
margin: 1em 0 0.5em;
}
.pool-name, .search-name {
word-wrap: break-word;
}
textarea {
margin-bottom: 0.25em;
}
@@ -225,51 +221,11 @@ div#c-posts {
word-wrap: break-word;
}
#search-seq-nav + #pool-nav, #search-seq-nav + #favgroup-nav, #pool-nav + #favgroup-nav {
margin-top: 0.5em;
}
#recommended.loading-recommended-posts {
pointer-events: none;
opacity: 0.5;
}
#pool-nav, #search-seq-nav, #favgroup-nav {
li {
position: relative;
text-align: center;
padding: 0 5.5em;
&[data-selected="true"] {
font-weight: bold;
}
.prev {
position: absolute;
left: 2em;
top: 0;
}
.next {
position: absolute;
right: 2em;
top: 0;
}
.first {
position: absolute;
left: 0.5em;
top: 0;
}
.last {
position: absolute;
right: 0.5em;
top: 0;
}
}
}
span.close-button {
position: absolute;
top: 5px;