ulysia/szurubooru
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improved image posts scaling

Browse source
This commit is contained in:
Marcin Kurczewski 2014-10-26 11:09:29 +01:00
parent 57d6d76386
commit c4489a14b8
3 changed files with 16 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
TODO
View file

@ -11,7 +11,6 @@ first major release.
- tags: add tag edit snapshots (backed-only) - tags: add tag edit snapshots (backed-only)
- add /history - add /history
- fix post notes on scaled posts - fix post notes on scaled posts
- fix image size not being respected
refactors: refactors:
- add enum validation in IValidatables (needs refactors of enums and - add enum validation in IValidatables (needs refactors of enums and

16
public_html/css/post.css
View file

@ -2,9 +2,15 @@
max-width: 100%; max-width: 100%;
} }
.post-type-image img { .post-type-image .image-wrapper {
display: block;
max-width: 100%; max-width: 100%;
position: relative;
}
.post-type-image .image-wrapper img {
position: absolute;
top: 0;
left: 0;
width: 100%;
} }
.post-type-youtube iframe { .post-type-youtube iframe {
@ -154,7 +160,7 @@
position: absolute; position: absolute;
background: rgba(255, 255, 255, 0.8); background: rgba(255, 255, 255, 0.8);
box-shadow: 0 0 1em 0.5em rgba(255, 255, 255, 0.8); box-shadow: 0 0 1em 0.5em rgba(255, 255, 255, 0.8);
z-index: 1; z-index: 2;
display: none; display: none;
} }
#post-view>* { #post-view>* {
@ -173,12 +179,14 @@
.post-content { .post-content {
position: relative; position: relative;
margin-bottom: 0.5em;
} }
.post-notes-target, .post-notes-target,
.post-notes { .post-notes {
pointer-events: none; pointer-events: none;
} }
.post-notes { .post-notes {
z-index: 1;
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
@ -190,7 +198,7 @@
pointer-events: auto; pointer-events: auto;
display: none; display: none;
position: absolute; position: absolute;
z-index: 2; z-index: 3;
background: white; background: white;
border: 1px solid black; border: 1px solid black;
padding: 1em; padding: 1em;

3
public_html/templates/post-content.tpl
View file

@ -6,7 +6,10 @@
<% if (post.contentType === 'image') { %> <% if (post.contentType === 'image') { %>
<div class="image-wrapper" style="width: <%= post.imageWidth %>px">
<img alt="<%= post.name %>" src="<%= postContentUrl %>"/> <img alt="<%= post.name %>" src="<%= postContentUrl %>"/>
<div style="padding-top: calc(100% * <%= post.imageHeight %> / <%= post.imageWidth %>)"></div>
</div>
<% } else if (post.contentType === 'youtube') { %> <% } else if (post.contentType === 'youtube') { %>