mirror of
https://github.com/rystaf/mlmym.git
synced 2024-11-25 06:25:46 +00:00
endless scrolling, style fixes
This commit is contained in:
Ryan Stafford
parent
2a9a54f595
commit
4fcfda174d
|
|
@ -74,10 +74,11 @@ summary {
|
|||
color: #646464;
|
||||
}
|
||||
.comment .score {
|
||||
margin-right: 2px;
|
||||
margin-right: 4px;
|
||||
overflow:hidden;
|
||||
}
|
||||
.comment .content {
|
||||
line-height: 20px;
|
||||
overflow:hidden;
|
||||
max-width: 840px;
|
||||
}
|
||||
|
|
@ -108,7 +109,6 @@ summary {
|
|||
top: 2px;
|
||||
}
|
||||
.title a {
|
||||
color: #0000ff;
|
||||
font-size: medium;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
@ -116,12 +116,15 @@ summary {
|
|||
display: inline;
|
||||
}
|
||||
.post.distinguished .title a {
|
||||
color: #f1641e;
|
||||
color: #228822;
|
||||
font-weight: bold;
|
||||
}
|
||||
.dark .title a {
|
||||
color: #dedede;
|
||||
}
|
||||
.dark .title a:visited {
|
||||
color: #a6a6a6
|
||||
}
|
||||
.post.deleted .title a {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
|
@ -159,9 +162,6 @@ summary {
|
|||
.message b {
|
||||
color: #000;
|
||||
}
|
||||
.meta {
|
||||
color: #888;
|
||||
}
|
||||
.dark .meta {
|
||||
color: #b4b4b4;
|
||||
}
|
||||
|
|
@ -214,7 +214,7 @@ summary {
|
|||
}
|
||||
.comment .meta {
|
||||
font-size: 10px;
|
||||
margin-bottom: 3px;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
.meta a {
|
||||
color: #369;
|
||||
|
|
@ -236,7 +236,7 @@ summary {
|
|||
padding: 0px 2px;
|
||||
}
|
||||
.comment .meta a.distinguished {
|
||||
background-color: #f1641e;
|
||||
background-color: #228822;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
border-radius: 3px;
|
||||
|
|
@ -250,8 +250,8 @@ summary {
|
|||
border-top: 1px dotted gray;
|
||||
font-size: 12px;
|
||||
}
|
||||
.savecomment {
|
||||
margin: 10px;
|
||||
.comment form.savecomment {
|
||||
margin: 0px 0px 10px 10px;
|
||||
}
|
||||
.savecomment textarea {
|
||||
width: 500px;
|
||||
|
|
@ -264,6 +264,7 @@ summary {
|
|||
}
|
||||
.comment.hidden {
|
||||
margin-bottom: 10px;
|
||||
padding-left: 26px;
|
||||
}
|
||||
.comment.hidden .meta a {
|
||||
color: gray;
|
||||
|
|
@ -379,8 +380,12 @@ form.nsfw div {
|
|||
color: #369;
|
||||
}
|
||||
#loadmore {
|
||||
visibility: hidden;
|
||||
margin: 10px 0px;
|
||||
}
|
||||
#loadmore[disabled] {
|
||||
visibility: visible;
|
||||
}
|
||||
.buttons li {
|
||||
display: inline;
|
||||
}
|
||||
|
|
@ -389,8 +394,11 @@ form.nsfw div {
|
|||
font-size: 10px;
|
||||
padding: 0;
|
||||
}
|
||||
.comment .textarea {
|
||||
width: 100%;
|
||||
}
|
||||
.comment .buttons {
|
||||
margin: 8px 0px 3px 0px;
|
||||
margin: 3px 0px 10px 0px;
|
||||
}
|
||||
.comment.hidden .buttons {
|
||||
display: none;
|
||||
|
|
@ -404,7 +412,7 @@ form.nsfw div {
|
|||
text-decoration: none;
|
||||
color: #888;
|
||||
display: inline-block;
|
||||
margin-right: 8px !important;
|
||||
margin-right: 5px !important;
|
||||
}
|
||||
.buttons a:hover, .title a:hover, .buttons form input:hover, .comment .buttons form input:hover {
|
||||
text-decoration: underline;
|
||||
|
|
@ -460,7 +468,8 @@ form.nsfw div {
|
|||
}
|
||||
.expando {
|
||||
display: none;
|
||||
max-width: 587px;
|
||||
max-width: 870px;
|
||||
margin-top: 5px;
|
||||
position: relative;
|
||||
color: #000;
|
||||
}
|
||||
|
|
@ -468,10 +477,11 @@ form.nsfw div {
|
|||
display: block;
|
||||
}
|
||||
.expando .image {
|
||||
display: inline-block;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
resize: both;
|
||||
max-width: 100%;
|
||||
max-width: 578px;
|
||||
margin: 0 auto;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-position: top left;
|
||||
|
|
@ -485,7 +495,8 @@ form.nsfw div {
|
|||
border: 1px solid #369;
|
||||
border-radius: 7px;
|
||||
padding: 5px 10px;
|
||||
margin: 5px 0px;
|
||||
margin: 5px auto;
|
||||
max-width: 578px;
|
||||
font-size: 14px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
|
@ -495,6 +506,7 @@ form.nsfw div {
|
|||
.dark .expando .md {
|
||||
background-color: #262626;
|
||||
color: #ddd;
|
||||
border-color: #666;
|
||||
}
|
||||
.expando p, .comment p, .message p {
|
||||
margin-top: 0;
|
||||
|
|
@ -607,17 +619,17 @@ main {
|
|||
}
|
||||
.create a div {
|
||||
margin: 5px 0px;
|
||||
background-color: #EFFFEF;
|
||||
background-color: #EFF7FF;
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
border: 1px solid #008909;
|
||||
border: 1px solid #369;
|
||||
}
|
||||
.dark .create a div {
|
||||
background-color: #444444;
|
||||
border: 0;
|
||||
}
|
||||
.create a div:hover {
|
||||
background-color: #0f7d1b;
|
||||
background-color: #369;
|
||||
}
|
||||
.dark .create a div:hover {
|
||||
background-color: #333333;
|
||||
|
|
@ -626,7 +638,7 @@ main {
|
|||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
font-size: 13px;
|
||||
color: #0f7d1b;
|
||||
color: #369;
|
||||
}
|
||||
.dark .create a {
|
||||
color: white;
|
||||
|
|
@ -788,12 +800,16 @@ nav .icon img {
|
|||
height:100%;
|
||||
}
|
||||
|
||||
nav .tabs {
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
nav ul {
|
||||
white-space: nowrap;
|
||||
list-style: none;
|
||||
margin: 5px 2.5px 0px 2.5px;
|
||||
padding: 0;
|
||||
display: inline;
|
||||
display: inline-block;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
|
|
@ -806,13 +822,14 @@ nav li {
|
|||
}
|
||||
|
||||
nav ul a {
|
||||
color: #369;
|
||||
background-color: #eff7ff;
|
||||
text-decoration: none;
|
||||
padding: 2px 6px 0 6px;
|
||||
}
|
||||
.dark nav ul a {
|
||||
background-color: #262626;
|
||||
color: #dadada;
|
||||
color: #ddd;
|
||||
}
|
||||
|
||||
.selected {
|
||||
|
|
@ -851,7 +868,7 @@ nav .right a.mailbox {
|
|||
color: gray;
|
||||
}
|
||||
nav .right a, .right input[type=submit] {
|
||||
color: #006414;
|
||||
color: #369;
|
||||
text-decoration: none;
|
||||
}
|
||||
.dark nav .right a, .dark .right input[type=submit]{
|
||||
|
|
@ -900,10 +917,16 @@ nav .right form input, .comment .buttons input, form.link-btn input {
|
|||
padding: 5px 10px;
|
||||
margin: 5px 10px;
|
||||
}
|
||||
.dark .warning {
|
||||
background-color: #544400;
|
||||
}
|
||||
.highlight {
|
||||
background-color: #ffc;
|
||||
padding-left: 5px;
|
||||
}
|
||||
.dark .highlight{
|
||||
background-color: #4c4c4c;
|
||||
}
|
||||
|
||||
form.create {
|
||||
width: 520px;
|
||||
|
|
@ -912,7 +935,7 @@ form.create {
|
|||
form.create div {
|
||||
margin: 10px 0px;
|
||||
padding: 5px 5px 10px 5px;
|
||||
background-color: #9ad59b;
|
||||
background-color: #cee3f8;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.dark form.create div {
|
||||
|
|
|
|||
|
|
@ -102,7 +102,7 @@ function loadMore(e) {
|
|||
urlParams.set("page", page)
|
||||
request(window.location.origin+window.location.pathname+"?"+urlParams.toString(), "", function(res){
|
||||
if (res.trim()) {
|
||||
e.target.outerHTML = res + '<div id="loadmore"><input type="submit" data-page="'+(parseInt(page)+1)+'" value="load more" onclick="loadMore(event)"></div>'
|
||||
e.target.outerHTML = res + '<input id="loadmore" type="submit" data-page="'+(parseInt(page)+1)+'" value="load more" onclick="loadMore(event)">'
|
||||
}
|
||||
else {
|
||||
e.target.outerHTML = ""
|
||||
|
|
@ -172,3 +172,13 @@ for (var i = 0; i < posts.length; i++) {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
window.onscroll = function(ev) {
|
||||
if ((window.innerHeight + window.pageYOffset) >= document.body.offsetHeight) {
|
||||
var loadmore = document.getElementById("loadmore")
|
||||
if (loadmore) {
|
||||
loadmore.click()
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@
|
|||
{{ end }}
|
||||
</a>
|
||||
<a {{ if .P.Comment.Distinguished}}class="distinguished"{{ else if .Submitter }}class="submitter"{{end}} href="/{{.State.Host}}/u/{{fullname .P.Creator}}">{{fullname .P.Creator}}</a>
|
||||
{{.P.Counts.Score}} points <span title="{{.P.Comment.Published.Time}}">{{ humanize .P.Comment.Published.Time }}</span>
|
||||
<b>{{.P.Counts.Score}} points</b> <span title="{{.P.Comment.Published.Time}}">{{ humanize .P.Comment.Published.Time }}</span>
|
||||
{{- if gt .P.Comment.Updated.Time.Unix .P.Comment.Published.Time.Unix -}}
|
||||
* (last edited <span title="{{.P.Comment.Updated.Time}}">{{ humanize .P.Comment.Updated.Time }}</span>)
|
||||
{{ end }}
|
||||
|
|
@ -37,53 +37,55 @@
|
|||
<input type="submit" value="save">
|
||||
</form>
|
||||
{{ else }}
|
||||
<div class="content{{ if and .Selected}} highlight{{end}}">{{if .P.Comment.Deleted}}[removed]{{else}}{{ markdown .State.Host .P.Comment.Content }}{{end}}</div>
|
||||
<div class="content{{ if and .Selected}} highlight{{end}}">
|
||||
{{if .P.Comment.Deleted}}[removed]{{else}}{{ markdown .State.Host .P.Comment.Content }}{{end}}
|
||||
{{ if eq .Op "source" }}
|
||||
<div><textarea>{{.P.Comment.Content}}</textarea></div>
|
||||
<div><textarea>{{.P.Comment.Content}}</textarea></div>
|
||||
{{end}}
|
||||
{{ end }}
|
||||
<ul class="buttons">
|
||||
<li><a href="/{{.State.Host}}/comment/{{.P.Comment.ID}}">permalink</a></li>
|
||||
<ul class="buttons">
|
||||
<li><a href="/{{.State.Host}}/comment/{{.P.Comment.ID}}">permalink</a></li>
|
||||
{{ if ne .Op "source"}}
|
||||
<li><a class="source" for="c{{.P.Comment.ID}}" href="/{{.State.Host}}/comment/{{.P.Comment.ID}}?source">source</a></li>
|
||||
<li><a class="source" for="c{{.P.Comment.ID}}" href="/{{.State.Host}}/comment/{{.P.Comment.ID}}?source">source</a></li>
|
||||
{{ else }}
|
||||
<li><a class="source" for="c{{.P.Comment.ID}}" href="/{{.State.Host}}/comment/{{.P.Comment.ID}}?">hide source</a></li>
|
||||
<li><a class="source" for="c{{.P.Comment.ID}}" href="/{{.State.Host}}/comment/{{.P.Comment.ID}}?">hide source</a></li>
|
||||
{{ end }}
|
||||
{{ if .State.Session }}
|
||||
{{ if and (eq .P.Comment.CreatorID .State.Session.UserID) (ne .Op "edit") }}
|
||||
<li><a class="edit" for="c{{.P.Comment.ID}}" href="/{{.State.Host}}/comment/{{.P.Comment.ID}}?edit">edit</a></li>
|
||||
<li>
|
||||
<form class="delete" method="POST">
|
||||
<input type="hidden" name="commentid" value="{{.P.Comment.ID}}">
|
||||
<input type="hidden" name="op" value="delete_comment">
|
||||
<input type="submit" value="delete">
|
||||
</form>
|
||||
</li>
|
||||
<li><a class="edit" for="c{{.P.Comment.ID}}" href="/{{.State.Host}}/comment/{{.P.Comment.ID}}?edit">edit</a></li>
|
||||
<li>
|
||||
<form class="delete" method="POST">
|
||||
<input type="hidden" name="commentid" value="{{.P.Comment.ID}}">
|
||||
<input type="hidden" name="op" value="delete_comment">
|
||||
<input type="submit" value="delete">
|
||||
</form>
|
||||
</li>
|
||||
{{ end }}
|
||||
<li>
|
||||
<form class="link-btn" method="POST">
|
||||
<input type="hidden" name="commentid" value="{{.P.Comment.ID}}">
|
||||
<input type="hidden" name="op" value="save_comment">
|
||||
{{ if .P.Saved }}
|
||||
<input type="submit" name="submit" value="unsave">
|
||||
{{ else }}
|
||||
<input type="submit" name="submit" value="save">
|
||||
<li>
|
||||
<form class="link-btn" method="POST">
|
||||
<input type="hidden" name="commentid" value="{{.P.Comment.ID}}">
|
||||
<input type="hidden" name="op" value="save_comment">
|
||||
{{ if .P.Saved }}
|
||||
<input type="submit" name="submit" value="unsave">
|
||||
{{ else }}
|
||||
<input type="submit" name="submit" value="save">
|
||||
|
||||
{{ end }}
|
||||
</form>
|
||||
</li>
|
||||
{{ end }}
|
||||
</form>
|
||||
</li>
|
||||
{{ if ne .Op "reply" }}
|
||||
<li>
|
||||
<a class="reply" for="c{{.P.Comment.ID}}" href="/{{.State.Host}}/comment/{{.P.Comment.ID}}?reply">
|
||||
reply
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="reply" for="c{{.P.Comment.ID}}" href="/{{.State.Host}}/comment/{{.P.Comment.ID}}?reply">
|
||||
reply
|
||||
</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ if gt .ChildCount 0 }}
|
||||
<li><a class="hidechildren" for="c{{.P.Comment.ID}}" href=""><span class="hide">hide</span><span class="show">show {{ .ChildCount }}</span> child comments</a></li>
|
||||
<li><a class="hidechildren" for="c{{.P.Comment.ID}}" href=""><span class="hide">hide</span><span class="show">show {{ .ChildCount }}</span> child comments</a></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="children">
|
||||
{{ if and (eq .State.Op "reply") (eq .State.CommentID .P.Comment.ID)}}
|
||||
<form class="savecomment" method="POST">
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<head>
|
||||
<title>{{ if and .Community (ne .Community.CommunityView.Community.Title "")}}{{.Community.CommunityView.Community.Title}}{{else if ne .CommunityName ""}}/c/{{.CommunityName}}{{ else if .User}}overview for {{.User.PersonView.Person.Name}}{{else}}{{ host .Host }}{{end}}</title>
|
||||
<link rel="shortcut icon" href="/{{.Host}}/icon.jpg">
|
||||
<link rel="stylesheet" href="/_/static/style.css?v=10">
|
||||
<link rel="stylesheet" href="/_/static/style.css?v=11">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
</head>
|
||||
<body {{ if .Dark }}class="dark"{{end}}>
|
||||
|
|
@ -49,12 +49,12 @@
|
|||
<div class="pager">
|
||||
view more: {{if gt .Page 1 }}<a href="{{ .PrevPage }}">‹ prev</a>{{ end }} <a href="{{ .NextPage }}">next ›</a>
|
||||
</div>
|
||||
<div id="loadmore"><input type="submit" value="load more" onclick="loadMore(event)" data-page="2"></div>
|
||||
<input id="loadmore" type="submit" value="load more" onclick="loadMore(event)" data-page="2">
|
||||
{{ end }}
|
||||
|
||||
{{ template "sidebar.html" . }}
|
||||
</main>
|
||||
{{ end }}
|
||||
<script src="/_/static/utils.js?v=4"></script>
|
||||
<script src="/_/static/utils.js?v=5"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<title>{{if and .Posts .PostID }}{{ (index .Posts 0).Post.Name}} : {{.CommunityName}}{{else if and .Community (ne .Community.CommunityView.Community.Title "")}}{{.Community.CommunityView.Community.Title}}{{else if ne .CommunityName ""}}/c/{{.CommunityName}}{{ else if .User}}overview for {{.User.PersonView.Person.Name}}{{else}}{{ host .Host }}{{end}}</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<link rel="shortcut icon" href="/{{.Host}}/icon.jpg">
|
||||
<link rel="stylesheet" href="/_/static/style.css?v=10">
|
||||
<link rel="stylesheet" href="/_/static/style.css?v=11">
|
||||
</head>
|
||||
<body{{ if .Dark }} class="dark"{{end}}>
|
||||
<noscript>
|
||||
|
|
@ -120,14 +120,14 @@
|
|||
{{ end }}
|
||||
|
||||
|
||||
{{ if or .Query (eq .SearchType "Communities") (eq (len .Posts) 25) (and .Comments (gt (index .Posts 0).Counts.Comments .CommentCount)) (and .User (or (gt .User.PersonView.Counts.CommentCount 10) (gt .User.PersonView.Counts.PostCount 10))) }}
|
||||
{{ if or .Query (eq .SearchType "Communities") (eq (len .Posts) 25) (and .Comments (gt (index .Posts 0).Counts.Comments .CommentCount) (not .CommentID)) (and .User (or (gt .User.PersonView.Counts.CommentCount 10) (gt .User.PersonView.Counts.PostCount 10))) }}
|
||||
<div class="pager">
|
||||
view more: {{if gt .Page 1 }}<a href="{{ .PrevPage }}">‹ prev</a>{{ end }} <a href="{{ .NextPage }}">next ›</a>
|
||||
</div>
|
||||
<div id="loadmore"><input type="submit" value="load more" onclick="loadMore(event)" data-page="2"></div>
|
||||
<input id="loadmore" type="submit" value="load more" onclick="loadMore(event)" data-page="2">
|
||||
{{ end }}
|
||||
|
||||
<script src="/_/static/utils.js?v=4"></script>
|
||||
<script src="/_/static/utils.js?v=5"></script>
|
||||
{{ template "sidebar.html" . }}
|
||||
</main>
|
||||
{{ end }}
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@
|
|||
by
|
||||
<a href="/{{ .State.Host }}/u/{{ fullname .Creator }}">{{ fullname .Creator }}</a>
|
||||
to
|
||||
<a href="/{{ .State.Host }}/c/{{ fullcname .Community }}">c/{{ fullcname .Community}}</a>
|
||||
<a href="/{{ .State.Host }}/c/{{ fullcname .Community }}">{{ fullcname .Community}}</a>
|
||||
</div>
|
||||
<div class="buttons">
|
||||
{{ if .Post.NSFW }}<span class="nsfw">NSFW</span>{{end}}
|
||||
|
|
@ -70,6 +70,9 @@
|
|||
<a class="hidechildren" onclick="hideAllChildComments(event)" href="">hide all child comments</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
<div></div>
|
||||
<div class="clearleft"></div>
|
||||
<div class="expando {{ if eq .Rank 0 }}open{{ end}}">
|
||||
{{ if (and .Post.Body.IsValid (ne .Post.Body.String "")) }}
|
||||
<div class="md">{{ markdown .State.Host .Post.Body.String }}</div>
|
||||
|
|
@ -81,8 +84,5 @@
|
|||
{{ end }}
|
||||
<div class="embed"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div></div>
|
||||
<div class="clearleft"></div>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
|
|
|||
Loading…
Reference in a new issue