All Downloads are FREE. Search and download functionalities are using the official Maven repository.

static.css.theme.css Maven / Gradle / Ivy

Go to download

The bookshelf is a webapp for collecting IIIF representations of books. It is based on the functionality of the IIIF Presentation API for modelling books. You can add books to your bookshelf loading the manifest.json of the book by its web-address.

There is a newer version: 4.0.0
Show newest version
html {
  position: relative;
  min-height: 100%;
}

body {
  padding-top: 50px;
  /* Margin bottom by footer height */
  margin-bottom: 40px;
}

footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 40px;
  background-color: #f5f5f5;

  border-top: solid 1px #AAA;
  color: #000;
  padding-top: 10px;
  text-align: center;
}

.underline {
  border-bottom: solid 1px #AAA;
}

img.preview-thumbnail {
  max-width: 100px !important;
}

#navbar a.badge {
  color: white;
}

.pagination {
  margin: 0;
}

.navbar-brand > img {
  display: inline;
  height: 25px;
  margin-right: 5px;
  vertical-align: top;
}

.iiif-logo > img {
  height: 20px;
  margin-right: 0;
}

.table-pagination {
  display: inline-block;
  float: left;
}

.table-pagination:last-of-type {
  margin-bottom: 15px;
}

/* Thumbnail- and listview */

#rowSearchForm {
  margin-bottom: 10px;
}

.objectCounter {
  margin-top: 6px;
  text-align: left;
}

.objectCounter .message {
  padding-left: 8px;
}

.rowSearchMenu {
  border: solid 1px #EEE;
  border-radius: 5px;
  padding-top: 5px;
}

#btnStyleSwitcher {
  vertical-align: inherit;
}

#search-results {
  margin-top: 0;
}

.search-result-item {
  width: 100%;
  float: left;
}

.search-result-item .attribution {
  font-size: 1em;
}

.search-result-item.grid-group-item .thumbnailImage {
  position: relative;
}

.search-result-item.grid-group-item .thumbnailImage .attributorLogo {
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(255,255,255,0.75);
  padding: 5px;
  text-align: center;
}

.search-result-item.list-group-item .thumbnailImage {
  margin: 5px 0 0 5px;
}

.search-result-item.list-group-item .thumbnailImage .attributorLogo {
  display: none;
}

.search-result-item.grid-group-item .caption .attributorLogo {
  display: none;
}

.search-result-item .attributorLogo img {
  max-width: 40%;
  max-height: 30px;
  margin-right: 10px;
}

.thumbnail {
  margin-bottom: 20px;
  padding: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  min-height: 132px;
}
.search-result-item.list-group-item .imageLink {
  max-width: 8%;
  display: block;
}

.search-result-item.list-group-item
{
  float: none;
  width: 100%;
  background-color: #fff;
  margin: 0 0 10px 0;
  padding: 0;
  border: none !important;
}
.search-result-item.list-group-item:nth-of-type(odd):hover,.search-result-item.list-group-item:hover
{
  background: #428bca;
}
.search-result-item.list-group-item .list-group-image
{
  max-height: 120px;
  margin-right: 10px;
  float: left;
}
.search-result-item.list-group-item .thumbnail
{
  margin-bottom: 0;
}
.search-result-item.list-group-item .caption
{
  padding: 9px;
  max-width: 90%;
  display: block;
  margin-left: 10%;
}
.search-result-item.list-group-item .caption h4
{
  font-size: 20px;
}
.search-result-item.grid-group-item .caption h4
{
  font-size: 18px;
}
.search-result-item.list-group-item:nth-of-type(odd)
{
  /*  background: #eeeeee;*/
}
.search-result-item.list-group-item:before, .search-result-item.list-group-item:after
{
  display: table;
  content: " ";
}

.search-result-item.list-group-item:after
{
  clear: both;
}

.list-group-item-text
{
  margin: 0 0 11px;
  color: #777;
}

.search-result-item .itemAge {
  font-size: 0.9em;
}

a.manifest-link > img {
  display: inline;
  float: none !important;
  height: 20px;
  padding-left: 12px;
  vertical-align: middle;
}

div.tablerow {
  display: table;
  width: 100%;
}

div.tablerow > div[class*="col-"] {
  float: none;
  display: table-cell;
  vertical-align: middle;
}

div.tablerow .iiif-logo {
  padding-top: 6px;
}

div.tablerow .lastModified {
  padding: 0;
}

.lighter {
  color: #AAA;
}

.smaller {
  font-size: 0.9em;
}

.login-form .form-group.submit-button {
  margin-bottom: 0;
}

.page-actions > li > a {
  font-size: 18px;
}

h3.manifest-label {
  margin-top: 0;
}

/*
 * VIEWER STUFF GOES HERE
 */

#viewer {
  width: 100%;
  height: calc(100vh - 120px);
  position: relative;
}

#viewer .mirador-osd-annotation-controls * {
  box-sizing: content-box;
}

/* Fixes disappearing scrollbar in TOC */
#viewer ul.toc {
  width: 270px;
}

/* Fixes cutoff thumbnail labels */
#viewer .panel-thumbnail-view > ul.panel-listing-thumbs > li {
  margin-bottom: 11px !important;
}

#viewer .window-manifest-title {
  height: 1.25em;
}

#viewer .metadata-listing .metadata-item {
  padding-top: 5px;
}

#viewer .metadata-listing .metadata-label,
#viewer .metadata-listing .metadata-value {
  display: inline;
}

#viewer .metadata-listing .metadata-label {
  font-weight: bold;
  margin-right: 10px;
}

#viewer .metadata-listing img {
  display: block;
}

div.metadata-table div.metadata-label {
  text-align: right;
}

/* ---------------------- media queries ----------------------- */

@media (max-width : 767px) {
  .navbar .navbar-nav > li > p.navbar-text {
    margin: 10px 15px;
  }
  /* label alignment */
  div.metadata-table {
    margin-top: 10px;
  }
  
  div.metadata-table div.metadata-label {
    text-align: left;
    margin-bottom: 0px;
  }
  div.metadata-table div.metadata-label label {
    margin-bottom: 0px;
  }
  div.metadata-table > div.row {
    margin-bottom: 8px;
  }
}

@media only screen and (max-width : 767px) {
  .search-result-item.list-group-item .thumbnailImage {
    display: none;
  }

  .search-result-item.list-group-item .caption {
    max-width: 100% !important;
    margin-left: 0 !important;
  }
}

/*@media only screen and (min-width : 321px) and (max-width : 767px) {

  .search-result-item.list-group-item .imageLink {
    max-width: 16% !important;
  }

  .search-result-item.list-group-item .caption {
    max-width: 80% !important;
    margin-left: 20% !important;
  }
}
*/

/* Custom, iPhone Retina */
@media only screen and (min-width : 321px) and (max-width : 767px) {

  .search-result-item.grid-group-item {
    width: 50%;
  }

  .search-result-item.grid-group-item:nth-child(2n+3) {
    clear: left;
  }

  .search-result-item.grid-group-item:nth-child(odd) {
    padding: 0 5px 0 0;
  }

  .search-result-item.grid-group-item:nth-child(even) {
    padding: 0 0 0 5px;
  }
}

@media (min-width : 768px) {
  .navbar {
    height: 40px;
    min-height: 40px;
  }
  .navbar .navbar-brand {
    padding: 10px 15px;
    line-height: 20px;
  }

  .navbar .navbar-nav > li > a {
    padding-top: 0;
    padding-bottom: 0;
    line-height: 40px;
  }

  .navbar .navbar-nav > li > p.navbar-text {
    margin-top: 0;
    margin-bottom: 0;
    line-height: 40px;
  }
}


/* Small Devices, Tablets */
@media only screen and (min-width : 768px) and (max-width : 991px){

  .search-result-item.grid-group-item {
    width: 33%;
  }

  .search-result-item.grid-group-item {
    padding: 0 5px;
  }

  .search-result-item.grid-group-item:nth-child(3n+4) {
    clear: left;
    padding: 0 5px 0 0;
  }

  .search-result-item.grid-group-item:first-child {
    padding: 0 5px 0 0;
  }

  .search-result-item.grid-group-item:nth-child(3n) {
    padding: 0 0 0 5px;
  }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px){

  #search-results {
    margin-top: 20px;
  }
  .search-result-item.grid-group-item {
    width: 25%;
  }

  .search-result-item.grid-group-item {
    padding: 0 5px;
  }

  .search-result-item.grid-group-item:nth-child(4n+5) {
    clear: left;
    padding: 0 5px 0 0;
  }

  .search-result-item.grid-group-item:first-child {
    padding: 0 5px 0 0;
  }

  .search-result-item.grid-group-item:nth-child(4n) {
    padding: 0 0 0 5px;
  }
}

@media print {
  body {
    padding-top: 0;
    /* Margin bottom by footer height */
    margin-bottom: 0;
  }
  footer { display: none; }
  .btn { display: none; }
  .navbar { display: none; }
  .page-actions { display: none; }

  /* Fix for printing in bootstrap 3 from here: https://gist.github.com/donnierayjones/6fd9802d992b2d8d6cfd */
  .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
    float: left;
  }
  .col-sm-12 {
    width: 100%;
  }
  .col-sm-11 {
    width: 91.66666667%;
  }
  .col-sm-10 {
    width: 83.33333333%;
  }
  .col-sm-9 {
    width: 75%;
  }
  .col-sm-8 {
    width: 66.66666667%;
  }
  .col-sm-7 {
    width: 58.33333333%;
  }
  .col-sm-6 {
    width: 50%;
  }
  .col-sm-5 {
    width: 41.66666667%;
  }
  .col-sm-4 {
    width: 33.33333333%;
  }
  .col-sm-3 {
    width: 25%;
  }
  .col-sm-2 {
    width: 16.66666667%;
  }
  .col-sm-1 {
    width: 8.33333333%;
  }
  .col-sm-pull-12 {
    right: 100%;
  }
  .col-sm-pull-11 {
    right: 91.66666667%;
  }
  .col-sm-pull-10 {
    right: 83.33333333%;
  }
  .col-sm-pull-9 {
    right: 75%;
  }
  .col-sm-pull-8 {
    right: 66.66666667%;
  }
  .col-sm-pull-7 {
    right: 58.33333333%;
  }
  .col-sm-pull-6 {
    right: 50%;
  }
  .col-sm-pull-5 {
    right: 41.66666667%;
  }
  .col-sm-pull-4 {
    right: 33.33333333%;
  }
  .col-sm-pull-3 {
    right: 25%;
  }
  .col-sm-pull-2 {
    right: 16.66666667%;
  }
  .col-sm-pull-1 {
    right: 8.33333333%;
  }
  .col-sm-pull-0 {
    right: auto;
  }
  .col-sm-push-12 {
    left: 100%;
  }
  .col-sm-push-11 {
    left: 91.66666667%;
  }
  .col-sm-push-10 {
    left: 83.33333333%;
  }
  .col-sm-push-9 {
    left: 75%;
  }
  .col-sm-push-8 {
    left: 66.66666667%;
  }
  .col-sm-push-7 {
    left: 58.33333333%;
  }
  .col-sm-push-6 {
    left: 50%;
  }
  .col-sm-push-5 {
    left: 41.66666667%;
  }
  .col-sm-push-4 {
    left: 33.33333333%;
  }
  .col-sm-push-3 {
    left: 25%;
  }
  .col-sm-push-2 {
    left: 16.66666667%;
  }
  .col-sm-push-1 {
    left: 8.33333333%;
  }
  .col-sm-push-0 {
    left: auto;
  }
  .col-sm-offset-12 {
    margin-left: 100%;
  }
  .col-sm-offset-11 {
    margin-left: 91.66666667%;
  }
  .col-sm-offset-10 {
    margin-left: 83.33333333%;
  }
  .col-sm-offset-9 {
    margin-left: 75%;
  }
  .col-sm-offset-8 {
    margin-left: 66.66666667%;
  }
  .col-sm-offset-7 {
    margin-left: 58.33333333%;
  }
  .col-sm-offset-6 {
    margin-left: 50%;
  }
  .col-sm-offset-5 {
    margin-left: 41.66666667%;
  }
  .col-sm-offset-4 {
    margin-left: 33.33333333%;
  }
  .col-sm-offset-3 {
    margin-left: 25%;
  }
  .col-sm-offset-2 {
    margin-left: 16.66666667%;
  }
  .col-sm-offset-1 {
    margin-left: 8.33333333%;
  }
  .col-sm-offset-0 {
    margin-left: 0%;
  }
  .visible-xs {
    display: none !important;
  }
  .hidden-xs {
    display: block !important;
  }
  table.hidden-xs {
    display: table;
  }
  tr.hidden-xs {
    display: table-row !important;
  }
  th.hidden-xs,
  td.hidden-xs {
    display: table-cell !important;
  }
  .hidden-xs.hidden-print {
    display: none !important;
  }
  .hidden-sm {
    display: none !important;
  }
  .visible-sm {
    display: block !important;
  }
  table.visible-sm {
    display: table;
  }
  tr.visible-sm {
    display: table-row !important;
  }
  th.visible-sm,
  td.visible-sm {
    display: table-cell !important;
  }
}




© 2015 - 2024 Weber Informatics LLC | Privacy Policy