Make cover images bigger in details view
Make cover images bigger at mobile devices in details viewpull/529/head
otapi
7 years ago
committed by
GitHub
parent
a06748e348
commit
fa080626be
@ -1,98 +1,112 @@
|
|||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Grand Hotel';
|
font-family: 'Grand Hotel';
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
src: local('Grand Hotel'), local('GrandHotel-Regular'), url("fonts/GrandHotel-Regular.ttf") format('truetype');
|
src: local('Grand Hotel'), local('GrandHotel-Regular'), url("fonts/GrandHotel-Regular.ttf") format('truetype');
|
||||||
}
|
}
|
||||||
|
|
||||||
body{background:#f2f2f2}body h2{font-weight:normal;color:#444}
|
body{background:#f2f2f2}body h2{font-weight:normal;color:#444}
|
||||||
body { margin-bottom: 40px;}
|
body { margin-bottom: 40px;}
|
||||||
a{color: #45b29d}a:hover{color: #444;}
|
a{color: #45b29d}a:hover{color: #444;}
|
||||||
.navigation .nav-head{text-transform:uppercase;color:#999;margin:20px 0}.navigation .nav-head:nth-child(1n+2){border-top:1px solid #ccc;padding-top:20px}
|
.navigation .nav-head{text-transform:uppercase;color:#999;margin:20px 0}.navigation .nav-head:nth-child(1n+2){border-top:1px solid #ccc;padding-top:20px}
|
||||||
.navigation li a{color:#444;text-decoration:none;display:block;padding:10px}.navigation li a:hover{background:rgba(153,153,153,0.4);border-radius:5px}
|
.navigation li a{color:#444;text-decoration:none;display:block;padding:10px}.navigation li a:hover{background:rgba(153,153,153,0.4);border-radius:5px}
|
||||||
.navigation li a span{margin-right:10px}
|
.navigation li a span{margin-right:10px}
|
||||||
.navigation .create-shelf{margin:30px 0;font-size:12px;text-align:center}.navigation .create-shelf a{color:#fff;background:#45b29d;padding:10px 20px;border-radius:5px;text-decoration:none}
|
.navigation .create-shelf{margin:30px 0;font-size:12px;text-align:center}.navigation .create-shelf a{color:#fff;background:#45b29d;padding:10px 20px;border-radius:5px;text-decoration:none}
|
||||||
.container-fluid img{display:block;max-width:100%;height:auto}
|
.container-fluid img{display:block;max-width:100%;height:auto}
|
||||||
.container-fluid .discover{margin-bottom:50px}
|
.container-fluid .discover{margin-bottom:50px}
|
||||||
.container-fluid .new-books{border-top:1px solid #ccc}.container-fluid .new-books h2{margin:50px 0 0 0}
|
.container-fluid .new-books{border-top:1px solid #ccc}.container-fluid .new-books h2{margin:50px 0 0 0}
|
||||||
.container-fluid .book{margin-top:20px}.container-fluid .book .cover{height:225px;position:relative}.container-fluid .book .cover img{border:1px solid #fff;/*border-radius:7px;*/box-sizeing:border-box;height:100%;bottom:0;position:absolute;-webkit-box-shadow: 0 5px 8px -6px #777;-moz-box-shadow: 0 5px 8px -6px #777;box-shadow: 0 5px 8px -6px #777;}
|
.container-fluid .book{margin-top:20px}.container-fluid .book .cover{height:225px;position:relative}.container-fluid .book .cover img{border:1px solid #fff;/*border-radius:7px;*/box-sizeing:border-box;height:100%;bottom:0;position:absolute;-webkit-box-shadow: 0 5px 8px -6px #777;-moz-box-shadow: 0 5px 8px -6px #777;box-shadow: 0 5px 8px -6px #777;}
|
||||||
.container-fluid .book .meta{margin-top:10px}.container-fluid .book .meta p{margin:0}
|
.container-fluid .book .meta{margin-top:10px}.container-fluid .book .meta p{margin:0}
|
||||||
.container-fluid .book .meta .title{font-weight:bold;font-size:15px;color:#444}
|
.container-fluid .book .meta .title{font-weight:bold;font-size:15px;color:#444}
|
||||||
.container-fluid .book .meta .author{font-size:12px;color:#999}
|
.container-fluid .book .meta .author{font-size:12px;color:#999}
|
||||||
.container-fluid .book .meta .rating{margin-top:5px}.rating .glyphicon-star{color:#999}.rating .glyphicon-star.good{color:#45b29d}
|
.container-fluid .book .meta .rating{margin-top:5px}.rating .glyphicon-star{color:#999}.rating .glyphicon-star.good{color:#45b29d}
|
||||||
.navbar-brand{font-family: 'Grand Hotel', cursive; font-size: 35px; color: #45b29d !important;}
|
.navbar-brand{font-family: 'Grand Hotel', cursive; font-size: 35px; color: #45b29d !important;}
|
||||||
.more-stuff{margin-top: 20px; padding-top: 20px; border-top: 1px solid #ccc}
|
.more-stuff{margin-top: 20px; padding-top: 20px; border-top: 1px solid #ccc}
|
||||||
.more-stuff>li{margin-bottom: 10px;}
|
.more-stuff>li{margin-bottom: 10px;}
|
||||||
.navbar-collapse.in .navbar-nav{margin: 0;}
|
.navbar-collapse.in .navbar-nav{margin: 0;}
|
||||||
span.glyphicon.glyphicon-tags {padding-right: 5px;color: #999;vertical-align: text-top;}
|
span.glyphicon.glyphicon-tags {padding-right: 5px;color: #999;vertical-align: text-top;}
|
||||||
.book-meta {padding-bottom: 20px;}
|
.book-meta {padding-bottom: 20px;}
|
||||||
.book-meta .tags a {display: inline;}
|
.book-meta .tags a {display: inline;}
|
||||||
.book-meta .identifiers a {display: inline;}
|
.book-meta .identifiers a {display: inline;}
|
||||||
.container-fluid .single .cover img {
|
.container-fluid .single .cover img {
|
||||||
border: 1px solid #fff;
|
border: 1px solid #fff;
|
||||||
/*border-radius: 7px;*/
|
/*border-radius: 7px;*/
|
||||||
box-sizeing: border-box;
|
box-sizeing: border-box;
|
||||||
-webkit-box-shadow: 0 5px 8px -6px #777;
|
-webkit-box-shadow: 0 5px 8px -6px #777;
|
||||||
-moz-box-shadow: 0 5px 8px -6px #777;
|
-moz-box-shadow: 0 5px 8px -6px #777;
|
||||||
box-shadow: 0 5px 8px -6px #777;
|
box-shadow: 0 5px 8px -6px #777;
|
||||||
}
|
}
|
||||||
.navbar-default .navbar-toggle .icon-bar {background-color: #000;}
|
.navbar-default .navbar-toggle .icon-bar {background-color: #000;}
|
||||||
.navbar-default .navbar-toggle {border-color: #000;}
|
.navbar-default .navbar-toggle {border-color: #000;}
|
||||||
.cover { margin-bottom: 10px;}
|
.cover { margin-bottom: 10px;}
|
||||||
|
|
||||||
.btn-file {position: relative; overflow: hidden;}
|
.btn-file {position: relative; overflow: hidden;}
|
||||||
.btn-file input[type=file] {position: absolute; top: 0; right: 0; min-width: 100%; min-height: 100%; font-size: 100px; text-align: right; filter: alpha(opacity=0); opacity: 0; outline: none; background: white; cursor: inherit; display: block;}
|
.btn-file input[type=file] {position: absolute; top: 0; right: 0; min-width: 100%; min-height: 100%; font-size: 100px; text-align: right; filter: alpha(opacity=0); opacity: 0; outline: none; background: white; cursor: inherit; display: block;}
|
||||||
|
|
||||||
.btn-toolbar .btn,.discover .btn { margin-bottom: 5px; }
|
.btn-toolbar .btn,.discover .btn { margin-bottom: 5px; }
|
||||||
.button-link {color:#fff;}
|
.button-link {color:#fff;}
|
||||||
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary{ background-color: #1C5484; }
|
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary{ background-color: #1C5484; }
|
||||||
.btn-primary.disabled, .btn-primary[disabled], fieldset[disabled] .btn-primary, .btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled:active, .btn-primary[disabled]:active, fieldset[disabled] .btn-primary:active, .btn-primary.disabled.active, .btn-primary[disabled].active, fieldset[disabled] .btn-primary.active { background-color: #89B9E2; }
|
.btn-primary.disabled, .btn-primary[disabled], fieldset[disabled] .btn-primary, .btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled:active, .btn-primary[disabled]:active, fieldset[disabled] .btn-primary:active, .btn-primary.disabled.active, .btn-primary[disabled].active, fieldset[disabled] .btn-primary.active { background-color: #89B9E2; }
|
||||||
.btn-toolbar>.btn+.btn, .btn-toolbar>.btn-group+.btn, .btn-toolbar>.btn+.btn-group, .btn-toolbar>.btn-group+.btn-group { margin-left:0px; }
|
.btn-toolbar>.btn+.btn, .btn-toolbar>.btn-group+.btn, .btn-toolbar>.btn+.btn-group, .btn-toolbar>.btn-group+.btn-group { margin-left:0px; }
|
||||||
|
|
||||||
.spinner {margin:0 41%;}
|
.spinner {margin:0 41%;}
|
||||||
.spinner2 {margin:0 41%;}
|
.spinner2 {margin:0 41%;}
|
||||||
|
|
||||||
.block-label {display: block;}
|
.block-label {display: block;}
|
||||||
.fake-input {position: absolute; pointer-events: none; top: 0;}
|
.fake-input {position: absolute; pointer-events: none; top: 0;}
|
||||||
|
|
||||||
input.pill { position: absolute; opacity: 0; }
|
input.pill { position: absolute; opacity: 0; }
|
||||||
input.pill + label {
|
input.pill + label {
|
||||||
border: 2px solid #45b29d;
|
border: 2px solid #45b29d;
|
||||||
border-radius: 15px;
|
border-radius: 15px;
|
||||||
color: #45b29d;
|
color: #45b29d;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 3px 15px;
|
padding: 3px 15px;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
}
|
}
|
||||||
input.pill:checked + label {
|
input.pill:checked + label {
|
||||||
background-color: #45b29d;
|
background-color: #45b29d;
|
||||||
border-color: #fff;
|
border-color: #fff;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
input.pill:not(:checked) + label .glyphicon {
|
input.pill:not(:checked) + label .glyphicon {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.author-bio img {margin: 0 1em 1em 0;}
|
.author-bio img {margin: 0 1em 1em 0;}
|
||||||
.author-link {display: inline-block; margin-top: 10px; width: 100px;}
|
.author-link {display: inline-block; margin-top: 10px; width: 100px;}
|
||||||
.author-link img {display: block; height: 100%;}
|
.author-link img {display: block; height: 100%;}
|
||||||
|
|
||||||
#remove-from-shelves .btn,
|
#remove-from-shelves .btn,
|
||||||
#shelf-action-errors {
|
#shelf-action-errors {
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tags_click, .serie_click, .language_click {margin-right: 5px;}
|
.tags_click, .serie_click, .language_click {margin-right: 5px;}
|
||||||
|
|
||||||
#meta-info img { max-height: 150px; max-width: 100px; cursor: pointer; }
|
#meta-info img { max-height: 150px; max-width: 100px; cursor: pointer; }
|
||||||
|
|
||||||
.padded-bottom { margin-bottom: 15px; }
|
.padded-bottom { margin-bottom: 15px; }
|
||||||
|
|
||||||
.upload-format-input-text {display: initial;}
|
.upload-format-input-text {display: initial;}
|
||||||
#btn-upload-format {display: none;}
|
#btn-upload-format {display: none;}
|
||||||
|
|
||||||
.upload-format-input-text {display: initial;}
|
.upload-format-input-text {display: initial;}
|
||||||
#btn-upload-format {display: none;}
|
#btn-upload-format {display: none;}
|
||||||
|
|
||||||
|
.div[id="bookDetailsModal"] .container-fluid .book .cover {
|
||||||
|
height: auto;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.div[class="col-sm-3.col-lg-3.col-xs-5"] {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.col-xs-5 {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue