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