From: Radek Czajka <radekczajka@nowoczesnapolska.org.pl>
Date: Fri, 17 Jan 2014 12:01:46 +0000 (+0100)
Subject: Fix picture detail styling.
X-Git-Url: https://git.mdrn.pl/wolnelektury.git/commitdiff_plain/b7f60fe7a944bbd0582896684fa09e02600a012d?ds=inline

Fix picture detail styling.
---

diff --git a/apps/picture/templates/picture/picture_short.html b/apps/picture/templates/picture/picture_short.html
index 6095f441f..881dcfe21 100644
--- a/apps/picture/templates/picture/picture_short.html
+++ b/apps/picture/templates/picture/picture_short.html
@@ -4,7 +4,6 @@
 {% load picture_tags %}
 <div class="{% block box-class %}book-box{% endblock %} picture">
 <div class="book-box-inner">
-<div class="book-left-column">
 
 <div class="book-box-body">
 
@@ -80,4 +79,3 @@
     <div class="clearboth"></div>
 </div>
 </div>
-</div>
diff --git a/apps/picture/templates/picture/picture_wide.html b/apps/picture/templates/picture/picture_wide.html
index 3125b0f8f..8525d32a9 100644
--- a/apps/picture/templates/picture/picture_wide.html
+++ b/apps/picture/templates/picture/picture_wide.html
@@ -16,7 +16,7 @@
 {% block book-box-extra-info %}
 {% if themes or things%}
     <div class="hidden-box-wrapper" id="theme-list-wrapper">
-        <p><a class="mono hidden-box-trigger theme-list-link"
+        <p><a class="hidden-box-trigger theme-list-link"
                 href="#">{% trans "Motifs, themes and objects" %}</a></p>
         <div class="hidden-box">
 	  {% if themes %}
diff --git a/apps/wolnelektury_core/static/scss/main/book_box.scss b/apps/wolnelektury_core/static/scss/main/book_box.scss
index cca6e4a53..e72bca8d0 100755
--- a/apps/wolnelektury_core/static/scss/main/book_box.scss
+++ b/apps/wolnelektury_core/static/scss/main/book_box.scss
@@ -216,13 +216,14 @@
     }
 }
 
-/* FIXME: RWD */
-.picture.book-wide-box .right-column {
-    float: none;
-    @include size(width, 415px);
-    top: 0;
-    @include size(margin-left, 550px);
-    margin-top: 0em;
+@media screen and (min-width: 50em) {
+    .picture.book-wide-box .right-column {
+        float: none;
+        @include size(width, 415px);
+        top: 0;
+        @include size(margin-left, 550px);
+        margin-top: 0em;
+    }
 }
 
 
diff --git a/apps/wolnelektury_core/static/scss/main/picture_box.scss b/apps/wolnelektury_core/static/scss/main/picture_box.scss
index 26adc58f2..a3e491197 100644
--- a/apps/wolnelektury_core/static/scss/main/picture_box.scss
+++ b/apps/wolnelektury_core/static/scss/main/picture_box.scss
@@ -1,19 +1,53 @@
 .picture {
     &.book-wide-box {
-        img.cover {
-            width: 53.5em;
-            height: auto;
+        .cover-area {
+            position: static;
+            @include size(margin-right, 15px);
+
+            img.cover {
+                @include size(width, 535px);
+                height: auto;
+            }
         }
 
-        .book-box-tools {
-            margin-left:  50em; // 535px image + 15px margin @ 11pt
+        .book-box-head, .tags, .book-box-tools {
+            margin: 0;
+        }
+
+        
+        @media screen and (min-width: 62.5em) {
+            .book-box-head, .tags, .book-box-tools {
+                float: right;
+                @include size(width, 403px);
+            }
         }
 
         .other-tools {
             margin: 5em 0 0 0;
         }
-        #theme-list-wrapper {
-            margin-left: 55em;
+
+        .book-box-tools, .tags, #theme-list-wrapper {
+            clear: left;
+            margin-left: 0;
+        }
+        .book-box-body {
+            height: auto;
+            margin-bottom: 1em;
+        }
+
+        @media screen and (min-width: 50em) {
+            .book-box-body {
+                @include size(height, 170px);
+                margin-bottom: 0;
+            }
+            .book-box-tools, .tags {
+                clear: none;
+            }
+
+            #theme-list-wrapper {
+                clear: none;
+                @include size(margin-left, 550px);
+            }
         }
     }