posts: add back "resize to window" link.

* Add back "Resize to window" link.
* Add Z shortcut for resize to window link (mnemonic: Z for zoom image).
* Resize images to screen width by default on both desktop and mobile.
* Make it so that notes are nested directly inside the .image-container
  element with the image, instead of inside a separate .note-container
  element. This means .image-container and .note-container are now the
  same element. This is so that the size of the .note-container is
  driven by the size of the image, which ensures that notes are
  automatically resized as the image is resized.
This commit is contained in:
evazion
2020-03-26 00:22:18 -05:00
parent 1126147dee
commit 87a51129b8
12 changed files with 39 additions and 30 deletions

View File

@@ -1,5 +1,6 @@
.note-container {
position: absolute;
display: inline-block;
position: relative;
div.note-body {
position: absolute;

View File

@@ -341,12 +341,6 @@ div#c-posts {
margin: 1em 0 0.5em;
}
/* This ensures the image appears above the note container, but beneath any notes. */
#image {
position: relative;
z-index: 50;
}
.pool-name, .search-name {
word-wrap: break-word;
}

View File

@@ -92,11 +92,6 @@
}
}
img#image {
max-width: 100%;
height: auto;
}
.user-disable-cropped-false {
article.post-preview {
width: 33.3%;