mirror of
https://github.com/rystaf/mlmym.git
synced 2024-11-04 22:33:15 +00:00
increase expando width, image click and drag to resize, minor style tweaks
This commit is contained in:
parent
b0248cd13b
commit
de281c00ee
|
@ -59,6 +59,8 @@ summary {
|
|||
clear:left;
|
||||
margin-right: 4px;
|
||||
overflow:hidden;
|
||||
min-width: 3px;
|
||||
min-height: 38px;
|
||||
}
|
||||
.comment .content {
|
||||
line-height: 20px;
|
||||
|
@ -138,7 +140,7 @@ summary {
|
|||
}
|
||||
.comment {
|
||||
font-size: 14px;
|
||||
margin: 0px 0px 5px 0px;
|
||||
margin: 0px 0px 10px 0px;
|
||||
border: 1px solid #e6e6e6;
|
||||
border-radius: 3px;
|
||||
padding: 10px 10px 0px 7px;
|
||||
|
@ -230,7 +232,7 @@ form.savecomment {
|
|||
margin: 0px 0px 10px 20px;
|
||||
}
|
||||
.comment .children {
|
||||
margin: 5px 0px 10px 15px;
|
||||
margin: 5px 0px 5px 15px;
|
||||
}
|
||||
.savecomment textarea {
|
||||
margin: 5px 0px;
|
||||
|
@ -280,9 +282,8 @@ form.savecomment {
|
|||
.children .morecomments {
|
||||
}
|
||||
.morecomments {
|
||||
height: 20px;
|
||||
height: 15px;
|
||||
clear: left;
|
||||
margin: 0px 0px 10px 0px;
|
||||
font-size: 10px;
|
||||
}
|
||||
.morecomments a {
|
||||
|
@ -500,7 +501,7 @@ form.blockpost {
|
|||
}
|
||||
.expando {
|
||||
display: none;
|
||||
max-width: 870px;
|
||||
max-width: 900px;
|
||||
margin-top: 5px;
|
||||
position: relative;
|
||||
color: #000;
|
||||
|
@ -551,18 +552,7 @@ form.blockpost {
|
|||
text-align: center;
|
||||
}
|
||||
.expando .image {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
resize: both;
|
||||
max-width: 578px;
|
||||
margin: 0 auto;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-position: top left;
|
||||
}
|
||||
.expando .image img {
|
||||
visibility: hidden;
|
||||
max-width: 100%;
|
||||
}
|
||||
.expando .md {
|
||||
background-color: #fafafa;
|
||||
|
@ -570,7 +560,6 @@ form.blockpost {
|
|||
border-radius: 7px;
|
||||
padding: 5px 10px;
|
||||
margin: 5px auto;
|
||||
max-width: 578px;
|
||||
font-size: 14px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
|
|
@ -30,8 +30,35 @@ function postClick(e) {
|
|||
if (id = parseYoutube(url)) {
|
||||
targ.getElementsByClassName("embed")[0].innerHTML = youtubeIframe(id)
|
||||
}
|
||||
// TODO set image handler
|
||||
var images = bdy.getElementsByTagName('img')
|
||||
for (var i = 0; i < images.length; i++) {
|
||||
images[i].onmousedown = function(e) {
|
||||
e.preventDefault()
|
||||
startCoordinates = [e.clientX, e.clientY]
|
||||
startSize = [e.target.height, e.target.width]
|
||||
resizeTarget = e.target
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
var resizeTarget
|
||||
var startCoordinates = [0,0]
|
||||
var startSize = [0,0]
|
||||
document.onmousemove = function(e) {
|
||||
if (resizeTarget) {
|
||||
resizeTarget.style.maxWidth = 'unset';
|
||||
let y = startSize[0] + (e.clientY - startCoordinates[1]) * 1.5
|
||||
let x = startSize[1] + (e.clientX - startCoordinates[0]) * 1.5
|
||||
let ratio = Math.min(y/startSize[0], x/startSize[1])
|
||||
resizeTarget.height = startSize[0]*ratio
|
||||
resizeTarget.width = startSize[1]*ratio
|
||||
}
|
||||
}
|
||||
document.onmouseup = function(e){
|
||||
resizeTarget = false;
|
||||
}
|
||||
function uptil (el, f) {
|
||||
if (el) return f(el) ? el : uptil(el.parentNode, f)
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<div class="comment{{if or (lt .P.Counts.Score -5) .P.Comment.Deleted .P.Comment.Removed }} hidden{{end}}" id="c{{.P.Comment.ID}}">
|
||||
{{ if .State.Session }}
|
||||
<div class="score">
|
||||
{{ if .State.Session }}
|
||||
<form class="link-btn{{ if eq .P.MyVote.String "1"}} like{{ else if eq .P.MyVote.String "-1"}} dislike{{end}}" method="POST">
|
||||
<input type="submit" name="submit" value="▲">
|
||||
<div></div>
|
||||
|
@ -11,8 +11,8 @@
|
|||
<input type="hidden" name="commentid" value="{{.P.Comment.ID }}">
|
||||
<input type="submit" name="submit" value="▼">
|
||||
</form>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="meta">
|
||||
<a class="minimize" href="" for="c{{.P.Comment.ID}}">
|
||||
{{- if or (lt .P.Counts.Score -5) .P.Comment.Deleted -}}
|
||||
|
|
|
@ -116,19 +116,16 @@
|
|||
</form>
|
||||
{{ 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>
|
||||
{{ end }}
|
||||
{{ if isImage .Post.URL.String}}
|
||||
<div class="image" style="background-image: url({{.Post.URL}})">
|
||||
<img loading="lazy" src="{{ .Post.URL }}">
|
||||
</div>
|
||||
<img class="image" loading="lazy" src="{{ .Post.URL }}">
|
||||
{{ end }}
|
||||
<div class="embed"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearleft"></div>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
|
Loading…
Reference in a new issue