apps/wolnelektury_core/static/css/book_box.css

   1 .book-mini-box, .Book-item {
   2     display: inline-block;
   3     vertical-align: top;
   4 }
   5
   6 .book-wide-box, .book-box {
   7     margin: 0;
   8     vertical-align: top;
   9 }
  10
  11 .book-box {
  12     width: 48.75em;
  13 }
  14
  15 .book-mini-box {
  16     width: 16.15em;
  17 }
  18
  19 .book-wide-box {
  20     /** This is a fullpage box, it must be aligned with the top menu.
  21         This corresponds to a .1em margin below **/
  22     margin-left: -0.1em;
  23 }
  24
  25 /*
  26  * A mini-box wraps it's contents (image + label) in an <a>
  27  * other boxes have an inner box as a wrapper.
  28  */
  29
  30 .book-box-inner {
  31     /* min, so it can grow */
  32     min-height: 19.75em;
  33     margin: .5em;
  34 }
  35
  36 .book-mini-box a, .book-box-inner {
  37     display: block;
  38     color: black;
  39     border: 1px solid #ddd;
  40 /*    height: 20em; */
  41     padding: .8em 1em;
  42     margin: .1em;
  43     background: #fff;
  44     -moz-box-shadow: 2px 2px 2px #ddd;
  45     -webkit-box-shadow: 2px 2px 2px #ddd;
  46     box-shadow: 2px 2px 2px #ddd;
  47 }
  48
  49 .book-mini-box a {
  50     height: 27.1em;
  51     margin: .1em;
  52     overflow: hidden;
  53 }
  54
  55
  56 .book-wide-box .book-box-inner {
  57    /* min, so it can grow */
  58    min-height: 24.4em;
  59 }
  60
  61 .search-result .book-box-body {
  62     width: 31em;
  63 }
  64
  65 .book-list-header {
  66     padding: 0em;
  67     margin-left: -0.1em;
  68 }
  69
  70 .book-list-header .book-box-inner {
  71     min-height: 1em;
  72 }
  73
  74 .book-list-header p {
  75     font-size: 2.4em;
  76     margin: 0.5em;
  77 }
  78
  79
  80 /*
  81  * ingenous float containment hack
  82  * http://www.mikepadgett.com/technology/technical/alternative-to-the-pie-clearfix-hack/
  83  */
  84 /*
  85 .search-result .book-box-inner {
  86     height: 1%;
  87     overflow: hidden;
  88 }
  89 */
  90
  91 .book-mini-box img.cover,
  92 .book-box img.cover,
  93 .book-wide-box img.cover,
  94 .search-result img.cover {
  95     width: 13.9em;
  96     height: 19.3em;
  97 }
  98 .book-mini-box img.cover {
  99     margin-bottom: 1.8em;
 100 }
 101 .book-box-inner .cover-area,
 102 .book-wide-box .cover-area
 103 {
 104     float: left;
 105     margin-right: 1.5em;
 106 }
 107
 108 .book-mini-box .desc {
 109     margin-left:0em;
 110 }
 111 .book-mini-box .author {
 112     font-size: 1.1em;
 113     color: #6d7877;
 114     display: block;
 115     overflow:hidden;
 116     text-overflow: ellipsis;
 117     white-space: nowrap;
 118 }
 119 .book-mini-box .title {
 120     font-size: 1.4em;
 121     color: #242424;
 122 }
 123
 124
 125 .book-box-body {
 126     height: 17em;
 127     overflow:hidden;
 128     position: relative;
 129 }
 130
 131 .book-wide-box .book-box-body {
 132     min-height: 17em;
 133 }
 134
 135 .book-box-head {
 136     min-height: 7em;
 137     padding-top: 1.4em;
 138     margin-bottom: 1em;
 139 }
 140 .book-box-head a {
 141     color: black;
 142 }
 143 .book-box-head .author {
 144     font-size: 1.1em;
 145     max-width: 24em;
 146 }
 147 .book-box-head .title {
 148     font-size: 2.4em;
 149     height: 2.4em;
 150     overflow:hidden;
 151     margin-top: .3em;
 152 }
 153 .book-box-body .tags {
 154     font-size: 1.1em;
 155 }
 156 .book-box-tag {
 157     margin-right: .5em;
 158     margin-left: .4em;
 159 }
 160 .book-box-download {
 161     position: relative;
 162 }
 163
 164 .book-box-download a {
 165     position: relative;
 166     z-index: 101;
 167 }
 168
 169 .book-box-formats {
 170     display: none;
 171     position: absolute;
 172
 173     width: 16.363em;
 174     border: 1px solid #ddd;
 175     padding: 3.454em 1.727em .818em 1.727em;
 176     background: #fff;
 177     -moz-box-shadow: 2px 2px 2px #ddd;
 178     -webkit-box-shadow: 2px 2px 2px #ddd;
 179     box-shadow: 2px 2px 2px #ddd;
 180
 181     z-index: 100;
 182     top: -1.454em;
 183     left: -1.727em;
 184 }
 185 .book-box-formats span {
 186     display: block;
 187 }
 188
 189 .book-box-download .book-box-formats span:first-child {
 190     margin-top: 1.454em;
 191 }
 192
 193 .book-box-download:hover .book-box-formats,
 194 .book-box-download.hover .book-box-formats {
 195     display: block;
 196 }
 197
 198 .book-box-tools {
 199         width: 46em;
 200     font-size: 1.1em;
 201 }
 202
 203 .book-wide-box {
 204         min-width: 48.75em;
 205 }
 206 .book-wide-box .book-box-tools {
 207     margin-left: 14em;
 208     width: 32em;
 209 }
 210
 211
 212 .book-wide-box #theme-list-wrapper {
 213     margin-left: 15.4em;
 214         margin-bottom: 3em;
 215         width: 30em;
 216 }
 217
 218
 219
 220 .book-box-read a:before {
 221     content: url("/static/img/read.png");
 222     font-size: 2.25em;
 223     margin-right: .15em;
 224     vertical-align: middle;
 225     font-weight: normal;
 226 }
 227
 228 .book-box-download a.downarrow:before {
 229     content: url("/static/img/download.png");
 230     font-size: 2.25em;
 231     margin-right: .15em;
 232     vertical-align: middle;
 233     font-weight: normal;
 234 }
 235
 236 .book-box-audiobook a:before {
 237     content: url("/static/img/listen.png");
 238     font-size: 2.25em;
 239     margin-right: .15em;
 240     vertical-align: middle;
 241     font-weight: normal;
 242 }
 243
 244 ul.book-box-tools {
 245     margin: 0;
 246     padding: 0;
 247 }
 248
 249 .book-box-tools li {
 250     display: inline-block;
 251 }
 252
 253 .book-box-read {
 254     width: 11.5em;
 255 }
 256 .book-box-download {
 257     width: 8.5em;
 258 }
 259 .book-box-audiobook {
 260     width: 7em;
 261 }
 262
 263 ul.inline-items, ul.inline-items li {
 264     margin: 0;
 265     padding: 0;
 266 }
 267
 268 ul.inline-items li {
 269     display: inline-block;
 270 }
 271
 272 .book-wide-box .other-tools {
 273     float: left;
 274     width: 14.5em;
 275     margin: 5em 0 0 1.5em;
 276
 277 }
 278
 279 .book-wide-box .other-download {
 280     float: left;
 281     width: 22em;
 282     margin: 5em 1.5em 0em 1.5em;
 283 }
 284 .book-wide-box .other-tools h2,
 285 .book-wide-box .other-download h2,
 286 .book-wide-box .other-tools ul,
 287 .book-wide-box .other-download ul {
 288         font-size: 1.1em;
 289 }
 290 .book-wide-box .other-tools h2,
 291 .book-wide-box .other-download h2 {
 292     margin: 0;
 293 }
 294
 295
 296
 297 .book-wide-box .license-icon {
 298     display:block;
 299     margin-top: .5em
 300 }
 301
 302
 303 .star {
 304     font-size: 2.25em;
 305     margin-right: .5em;
 306     position: absolute;
 307     right: 0;
 308 }
 309 .star button::-moz-focus-inner {
 310     padding: 0;
 311     border: 0
 312 }
 313 .if-unlike button {
 314     font-size: 1em;
 315     font-family: inherit;
 316     border: 0;
 317     background: none;
 318     margin: 0;
 319     padding: 0;
 320     color: #757575;
 321 }
 322
 323 .if-like a {
 324     display:block;
 325     text-align:right;
 326     padding: 0;
 327 }
 328
 329 .like .if-unlike {
 330     display: none;
 331 }
 332
 333 .unlike .if-like {
 334     display: none;
 335 }
 336
 337 .snippets .snippet-text {
 338     background: #f7f7f7;
 339     font-size: 1.2em;
 340     margin: 1.083em 0em;
 341     padding: 1em;
 342 }
 343
 344 .snippets .anchor {
 345     display: none;
 346 }