diff default/static/photo.css @ 124:11e729a7d8e9

photo: photos handling, first draft: this template is a specialized file view for photo albums. A comments panel is added if a comments link is found.
author Goffi <goffi@goffi.org>
date Sun, 18 Mar 2018 11:31:36 +0100
parents
children 4f27ce980ced
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/default/static/photo.css	Sun Mar 18 11:31:36 2018 +0100
@@ -0,0 +1,55 @@
+@import 'blog.css'; /* needed for comments */
+
+.album {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+.album__item {
+    width: 400px;
+	margin: 0 0.1em 2em 0.1em;
+}
+
+.album__vignette {
+    background-color: #444;
+    height: 300px;
+    position: relative;
+}
+
+.album__thumbnail {
+    height: 100%;
+    display: block;
+    margin: 0 auto;
+}
+
+.album__comments-bar {
+    display: block;
+    font-size: 0.8em;
+    color: black;
+    text-align: right;
+    cursor: pointer;
+}
+
+.album__comments-bar:hover {
+    background-color: #ddd;
+    font-weight: bold;
+}
+
+.icon--small {
+    height: 1em;
+}
+
+.comments__count {
+    font-weight: bold;
+}
+
+.panel-drawer {
+    max-height: 0;
+    opacity: 0;
+    transition: max-height 1s, opacity 2s;
+    overflow: hidden;
+}
+
+.panel-drawer.clicked {
+    opacity: 1;
+}