aboutsummaryrefslogtreecommitdiff
path: root/juick-www/src/main/static/style.css
diff options
context:
space:
mode:
Diffstat (limited to 'juick-www/src/main/static/style.css')
-rw-r--r--juick-www/src/main/static/style.css62
1 files changed, 47 insertions, 15 deletions
diff --git a/juick-www/src/main/static/style.css b/juick-www/src/main/static/style.css
index d34da0e0..fd81070b 100644
--- a/juick-www/src/main/static/style.css
+++ b/juick-www/src/main/static/style.css
@@ -730,26 +730,58 @@ fieldset {
border: 1px dotted #ccc;
margin-top: 25px;
}
+/* embeds */
.embedContainer {
- height: 0;
- overflow: hidden;
- padding-bottom: 56.25%;
- padding-top: 30px;
- position: relative;
- text-align: center;
+ display: flex;
+ flex-wrap: wrap;
+ align-items: center;
+ justify-content: center;
+ padding: 0;
+ margin: 30px -3px 15px -3px;
}
-.embedContainer iframe,
-.embedContainer object,
-.embedContainer embed {
- height: 100%;
- left: 0;
- position: absolute;
- top: 0;
- width: 100%;
+.embedContainer > * {
+ box-sizing: border-box;
+ flex-grow: 1;
+ margin: 3px;
+ min-width: 49%;
}
-.embedContainer img {
+.embedContainer > .compact {
+ flex-grow: 0;
+}
+.embedContainer .picture img {
+ display: block;
+}
+.embedContainer img,
+.embedContainer video {
max-width: 100%;
+ max-height: 80vh;
+}
+.embedContainer > .audio,
+.embedContainer > .youtube {
+ min-width: 90%;
+}
+.embedContainer audio {
+ width: 100%;
+}
+.embedContainer iframe {
+ overflow:hidden;
+ resize: vertical;
+ display: block;
+}
+/* end of embeds*/
+/* nsfw */
+article.nsfw .embedContainer img,
+article.nsfw .embedContainer iframe,
+article.nsfw .ir img {
+ opacity: 0.1;
+ transition: opacity 0.05s;
+}
+article.nsfw .embedContainer img:hover,
+article.nsfw .embedContainer iframe:hover,
+article.nsfw .ir img:hover {
+ opacity: 1.0;
}
+/* end of nsfw */
@media screen and (max-width: 850px) {
body {
-moz-text-size-adjust: 100%;