@internetarchive/bookreader 5.0.0-88-alpha.10 → 5.0.0-88

package/dist/esm/css/_BRpages.scss

@@ -1,213 +0,0 @@
-.BRpageview {
-  position: relative;
-  margin: auto;
-}
-
-.BRmode1up .BRpagecontainer, .BRmodeThumb .BRpagecontainer {
-  box-shadow: 1px 1px 2px #333;
-  img {
-    border: 0;
-  }
-}
-
-.BRmodeThumb .BRpagecontainer, .BRmode2up .BRpagecontainer {
-  cursor: pointer;
-}
-.BRpagecontainer.BRemptypage {
-  cursor: unset;
-}
-
-.br-mode-1up__root {
-  display: block;
-  overflow: auto;
-  position: relative;
-  width: 100%;
-  height: 100%;
-
-  // This is a performance optimization that basically tells the browser "the size
-  // of this element doesn't depend on the size of its children".
-  contain: strict;
-
-  .br-mode-1up__world {
-    position: absolute;
-    transform-origin: 0 0;
-  }
-  
-  .br-mode-1up__visible-world {
-    position: absolute;
-    transform-origin: 0 0;
-  }
-}
-
-.BRpagecontainer {
-  position: relative;
-  overflow: hidden;
-  background: $brColorPlaceholderBg;
-  overflow: hidden;
-  overflow: clip;
-  img {
-    position: absolute;
-    background: transparent;
-    display: block;
-    width: 100%;
-    height: 100%;
-  }
-  .BRscreen {
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    z-index: 1;
-  }
-  &.BRpageloading img {
-    // Don't show the alt text while loading
-    color: transparent;
-  }
-  &.BRemptypage {
-    background: transparent;
-    img {
-      background-image: none;
-    }
-  }
-}
-
-svg.BRPageLayer {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-
-// Hides page layers during page flip animation
-.BRpageFlipping .BRPageLayer {
-  display: none;
-}
-
-.br-mode-2up__root {
-  display: block;
-  overflow: auto;
-  width: 100%;
-  height: 100%;
-}
-
-.br-mode-2up__book {
-  position: relative;
-  transform-origin: 0 0;
-  width: 0px;
-  height: 0px;
-}
-
-.BRmode2up {
-  // Used while loading stuff
-  transition: opacity 0.2s;
-}
-
-.BRmode2up .BRpagecontainer {
-  backface-visibility: hidden;
-  &:not(.BRpage-visible) {
-    display: none;
-  }
-}
-
-.br-mode-2up__leafs {
-  position: absolute;
-  cursor: pointer;
-  top: 0;
-  transform-style: preserve-3d;
-  
-  &[side=left] {
-    border-radius: 4px 0 0 4px;
-    .br-leaf-edges__label {
-      padding-right: 10px;
-      border-radius: 4px 0 0 4px;
-    }
-  }
-  &[side=right] {
-    border-radius: 0 4px 4px 0;
-    .br-leaf-edges__label {
-      padding-left: 20px;
-      border-radius: 0 4px 4px 0;
-    }
-  }
-  &.br-mode-2up__leafs--flipping {
-    z-index: 200000;
-    transition: transform 5s;
-    transition-timing-function: ease-in-out;
-    border-radius: 0;
-
-    // Have a copy of the background at a perpendicular angle,
-    // so that during the rotation, it's always visible.
-    &:before {
-      content: '';
-      display: block;
-      width: 100%;
-      height: 100%;
-      position: absolute;
-      transform: rotateY(-90deg);
-    }
-  }
-
-  &, &.br-mode-2up__leafs--flipping::before {
-    background: transparent url(images/back_pages.png) repeat scroll 0% 0%;
-  }
-
-  .br-leaf-edges__bar {
-    display: none;
-    pointer-events: none;
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    min-width: 1px;
-    background-color: #9A9B9D;
-    opacity: 0.85;
-    transform: translateX(-50%);
-  }
-  
-  .br-leaf-edges__label {
-    display: none;
-    pointer-events: none;
-    z-index: 1000;
-    position: absolute;
-    padding: 6px;
-    color: white;
-    background-color: #9A9B9D;
-    opacity: 0.85;
-    white-space: nowrap;
-    transform: translateY(-10px);
-  }
-}
-
-.br-mode-2up--flipping-left {
-  .BRpage-entering[data-side=R] {
-    z-index: 10;
-    transform-origin: left;
-    transform: rotateY(0deg);
-  }
-
-  .BRpage-exiting[data-side=L] {
-    z-index: 10;
-    transform-origin: right;
-  }
-
-  .BRpage-exiting[data-side=R] {
-    z-index: 9;
-  }
-}
-
-.br-mode-2up--flipping-right {
-  .BRpage-entering[data-side=L] {
-    z-index: 10;
-    transform-origin: right;
-  }
-
-  .BRpage-exiting[data-side=R] {
-    z-index: 10;
-    transform-origin: left;
-  }
-
-  .BRpage-exiting[data-side=L] {
-    z-index: 9;
-  }
-}

package/dist/esm/css/_BRsearch.scss

@@ -1,268 +0,0 @@
-@mixin ellipsis-lines($lines: 4) {
-  display: -webkit-box;
-  -webkit-line-clamp: $lines;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-}
-
-%timeline-tooltip {
-  display: none;
-  position: absolute;
-  bottom: calc(100% + 5px);
-  left: -14px;
-  width: 350px;
-  max-width: 100vw;
-  padding: 12px 14px;
-  padding-bottom: 10px;
-  color: $tooltipText;
-  background: $tooltipBG;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, .5);
-  border-radius: 4px;
-  animation: fadeUp 0.2s;
-
-  // Disable text selection
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  -o-user-select: none;
-  user-select: none;
-
-  // Create a triangle under the tooltip using clip-path
-  // This makes it possible to move the mouse onto the tooltip
-  &:after {
-    position: absolute;
-    content: "";
-    bottom: -9px;
-    left: 0;
-    width: 30px;
-    height: 10px;
-    clip-path: polygon(0 0, 100% 0, 50% 100%);
-  }
-}
-
-#{$brScope} {
-  // FIXME: .ttsHiliteLayer should probably not be in this file,
-  // but they appear the same in the UI.
-  .searchHiliteLayer, .ttsHiliteLayer {
-    pointer-events: none;
-
-    rect {
-      // Note: Can't use fill-opacity ; safari inexplicably applies that to
-      // the outline as well
-      fill: rgba(0, 0, 255, 0.2);
-    }
-  }
-
-  .searchHiliteLayer rect {
-    animation: highlightFocus 600ms 1 reverse;
-    stroke: blue;
-    stroke-width: 4px;
-
-    // Sass for loop for nth-child animation delay
-    @for $i from 1 through 10 {
-      &:nth-child(#{$i}) {
-        animation-delay: #{($i - 1) * 50}ms;
-      }
-    }
-  }
-
-  .BRchapter, .BRsearch {
-    position: absolute;
-    bottom: 0;  /* Relative to nav line */
-    cursor: pointer;
-    z-index: $brZindexBase + 2;
-    background-color: transparent;
-    background-repeat: no-repeat;
-    font-weight: normal;
-  }
-  .BRchapter {
-    // background-image: url(images/marker_chap-off.svg);
-    background-color: white;
-    color: #666;
-    height: 8px;
-    width: 4px;
-    bottom: -13px;
-    margin-left: -12px; /* Center icon */
-    > div {
-      @extend %timeline-tooltip;
-    }
-    &:hover {
-      > div {
-        display: block;
-      }
-    }
-    &.front {
-      // background-image: url(images/marker_chap-on.svg);
-      background-color: blue;
-    }
-    .BRchapterPage {
-      font-size: 0.85em;
-      opacity: .8;
-    }
-  }
-  .BRsearch {
-    width: 9px;
-    height: 6px;
-    margin-left: -10px;
-    &:before {
-      position: absolute;
-      left: calc(50% - 2px);
-      transform: translateX(-50%);
-      width: 2px;
-      height: 6px;
-      content: "";
-      background: $searchMarkerBG;
-      border-radius: 2px;
-    }
-    &:hover {
-      .BRquery {
-        display: block;
-      }
-    }
-  }
-  .BRsearch .BRquery {
-    display: none;
-  }
-  .BRquery {
-    @extend %timeline-tooltip;
-    main {
-      @include ellipsis-lines(4);
-      margin-bottom: 6px;
-      &:before { content: "“"; }
-      &:after { content: "”"; }
-    }
-    footer {
-      font-size: 0.85em;
-      opacity: .8;
-    }
-    mark {
-      color: $searchResultText;
-      font-weight: bold;
-      background-color: $searchResultBG;
-    }
-  }
-
-  .BRbooksearch {
-    position:relative;
-    box-sizing: border-box;
-  }
-  .BRbooksearch.desktop {
-    position: relative;
-    height: 30px;
-    border: 1px solid white;
-    border-radius: 20px;
-    display: inline-block;
-    line-height:0;
-    vertical-align: top;
-    margin-top: 0;
-    margin-bottom: 0;
-
-    .BRsearchInput {
-      -webkit-appearance: none;
-      position: relative;
-      width: 130px;
-      max-width: 160px;
-      height: 100%;
-      color: white;
-      border: none;
-      padding: 3px 0px 3px 10px;
-      margin: 0;
-      box-sizing: border-box;
-      background: transparent;
-      display: block;
-      float: left;
-      font-size: $brFontSizeBase;
-      line-height: 1.2;
-    }
-    .BRsearchSubmit {
-      width: auto;
-      height: 100%;
-      border: none;
-      text-align: center;
-      color: #fff;
-      overflow: hidden;
-      box-sizing:boder-box;
-      display: block;
-      background: transparent;
-      float: left;
-      cursor: pointer;
-    }
-  }
-
-  .BRsearch-navigation {
-    position: relative;
-    z-index: 1;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    color: $white;
-    background-color: $brColorDarkGreyBg;
-    padding: 5px 0;
-    button.toggle-sidebar {
-      width: unset;
-      padding: 0 10px;
-      h4 {
-        padding: 0;
-        margin: 0;
-        font-size: 15px;
-        font-weight: normal;
-        color: $white;
-        span {
-          vertical-align: middle;
-        }
-      }
-    }
-    .pagination {
-      position: absolute;
-      left: 50%;
-      top: 50%;
-      transform: translate(-50%, -50%);
-      margin: 0;
-      span {
-        display: inline-block;
-        padding: 0 5px;
-      }
-      button {
-        &[disabled] {
-          opacity: .3;
-          cursor: default;
-        }
-        span {
-          width: 8px;
-          height: 13px;
-          padding: 0;
-          background-size: 100% auto;
-        }
-      }
-    }
-    .clear {
-      span {
-        width: 18px;
-        height: 18px;
-      }
-    }
-    + .BRnav {
-      .BRnavCntl {
-        display: none;
-      }
-    }
-  }
-}
-
-@keyframes highlightFocus {
-  to { stroke-width: 20px; }
-}
-
-/* Mid size breakpoint */
-@media (max-width: $brBreakPointMid) {
-  #{$brScope} {
-    .BRbooksearch .BRsearchInput {
-      padding: 0 0 0 8px;
-      width: 110px;
-      min-width: 110px;
-    }
-    .BRbooksearch .BRsearchSubmit {
-      float: left;
-    }
-  }
-}

package/dist/esm/css/_BRtoolbar.scss

@@ -1,84 +0,0 @@
-/**
- * BRtoolbar is the top control bar (eg header)
- */
-
-.BRtoolbar {
-  position: relative;
-  top: 0;
-  left: 0;
-  padding: 10px 10px 4px 10px;
-  width: 100%;
-  background-color: transparent;
-  box-sizing: border-box;
-  width: 100%;
-  color: white;
-  font-size: $brFontSizeBase;
-  /* ensure that this displays over book */
-  z-index: 3;
-}
-.BRtoolbar .label {
-  font-size: $brFontSizeSmaller;
-  color: #ccc;
-}
-.BRtoolbar a {
-  text-decoration: none;
-  color: white;
-  &:hover {
-    color: white;
-    text-decoration: underline;
-  }
-}
-/* desktop header */
-.BRtoolbarSection > *  {
-  margin-left: 6px;
-}
-.BRtoolbarbuttons {
-  white-space: nowrap;
-  box-sizing: border-box;
-  display: flex;
-  flex-direction: row;
-}
-.BRtoolbarbuttons .BRpill {
-  border: 1px solid white;
-  background: transparent;
-  padding: 5px 10px;
-  height: 30px;
-  border-radius: 20px;
-  color: white;
-  line-height: 0;
-  vertical-align: middle;
-  font-size: $brFontSizeSmaller;
-  cursor: pointer;
-  &.BRtoolbarHamburger {
-      border: none;
-      border-radius: none;
-  }
-}
-
-.BRtoolbarSection {
-  white-space: nowrap;
-}
-.BRtoolbarSectionLogo {
-  text-align: center;
-  display: none;
-}
-.BRtoolbarLeft {
-  flex: 1 auto;
-  overflow-y: hidden;
-}
-// .BRtoolbarSectionTitle {}
-.BRtoolbarRight {
-  flex: none;
-}
-
-@media (max-width: $brBreakPointMobile) {
-  .BRtoolbar {
-    height: $brNavHeightMobile;
-    padding: 0;
-    box-shadow: 0px 1px 3px 0px rgba(#666, .25);
-  }
-}
-
-ia-bookreader .BRtoolbar {
-  padding-left: 50px;
-}

package/dist/esm/css/_BRvendor.scss

@@ -1,5 +0,0 @@
-/****************** Excerpt from jquery-ui *********************/
-.ui-helper-hidden { display: none; }
-.ui-helper-hidden-accessible { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); }
-.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
-.ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

package/dist/esm/css/_TextSelection.scss

@@ -1,108 +0,0 @@
-.BRtextLayer {
-    z-index: 2;
-    position: absolute;
-    top: 0;
-    left: 0;
-    color: transparent;
-    transform-origin: 0 0;
-    // Make it so right-clicking on "blank" part of text layer sends events to the image (for saving)
-    pointer-events: none;
-    cursor: text;
-}
-
-.BRparagraphElement {
-    margin: 0;
-    cursor: text;
-    font-family: Georgia, serif;
-    line-height: 0;
-}
-
-.BRlineElement {
-    pointer-events: all;
-    white-space: nowrap;
-    display: inline-block;
-
-    // We use display: inline-block, otherwise this causes every line
-    // to have newlines at the end in safari. BUT, since they're inline,
-    // if the OCR has to short line in the same paragraph, they can wrap
-    // and one can go onto the other. This adds an arbitrary margin to
-    // the right of each line, forcing things to wrap.
-    // See eg https://www-drini.archive.org/details/countofmontecris00duma_7/page/261/mode/2up
-    // Page 261, second last line on the page.
-    .BRtextLayer[dir=ltr] & { margin-right: 100%; }
-    .BRtextLayer[dir=rtl] & { margin-left: 100%; }
-}
-
-// Highlight colors for text selection layer
-.BRwordElement, .BRspace, .BRparagraphElement, .BRparagraphElement br {
-    // these 2 properties do not work if joined
-    &::selection {
-        background: hsla(210, 74%, 62%, 0.4);
-    }
-
-    &::-moz-selection {
-        background: hsla(210, 74%, 62%, 0.4);
-        color:transparent;
-    }
-}
-
-.BRparagraphElement br {
-    visibility: hidden;
-}
-
-// Use CSS pseudo-elements to render the hyphens. This makes them
-// not selectable, so copy/pasting text doesn't include them.
-.BRwordElement--hyphen::after {
-    content: "-";
-}
-
-// Hide text layer for performance during zooming & scrolling
-.BRsmooth-zooming, .BRscrolling-active {
-    .BRpagecontainer:not(.BRpagecontainer--hasSelection) .BRtextLayer {
-        display: none;
-    }
-}
-
-// Hide text selection layers of off-screen pages
-.BRmode1up .BRpagecontainer:not(.BRpage-visible) .BRtextLayer {
-    display: none;
-}
-
-// Makes page image unselectable
-.BRpagecontainer img {
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    user-select: none;
-}
-
-
-// These are Microsoft Edge specific fixed to make some of the
-// browsers features work well. These are for the in-place
-// translation.
-.BRwordElement, .BRspace {
-    &[_istranslated="1"], &[_msttexthash] {
-        background-color: #e4dccd;
-        color: black;
-        letter-spacing: unset !important;
-        background: #ccbfa7;
-    }
-}
-
-.BRlineElement font[_mstmutation="1"] {
-    background: #ccbfa7;
-}
-
-.BRlineElement:has([_istranslated="1"], [_msttexthash]) {
-    background-color: #e4dccd;
-    color: black;
-    text-align: justify;
-    width: inherit;
-    &:not(:nth-last-child(2)) {
-        text-align-last: justify;
-    }
-}
-
-.BRlineElement[_msttexthash] {
-    background: #ccbfa7;
-    word-spacing: unset !important;
-}

package/dist/esm/css/_colorbox.scss

@@ -1,52 +0,0 @@
-/* COLORBOX POP-UP */
-
-#colorbox, #cboxOverlay, #cboxWrapper {
-  position: absolute;
-  top: 0;
-  left: 0;
-  z-index: $brZindexPopup;
-}
-#cboxOverlay {
-  position: fixed;
-  width: 100%;
-  height: 100%;
-  background: #000;
-  opacity:0.75; filter:Alpha(Opacity=75);
-}
-#cboxMiddleLeft, #cboxBottomLeft { clear:left; }
-#cboxContent { position:relative; }
-#cboxLoadedContent { overflow: hidden!important; }
-#cboxLoadedContent iframe { display: block; border: 0; }
-#cboxTitle { margin: 0; display: none !important; }
-#cboxLoadingOverlay, #cboxLoadingGraphic {
-  position: absolute;
-  top: 25px;
-  left: 25px;
-  width: 100%;
-}
-#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow { cursor:pointer; }
-#cboxClose { display: none !important; }
-
-#colorbox{
-  background: white;
-  border: 2px solid #ccc;
-  -webkit-border-radius:12px;
-  -moz-border-radius:12px;
-  border-radius:12px;
-  -webkit-box-shadow: 0px 0px 27px 6px rgba(66, 66, 66, 0.8);
-  -moz-box-shadow:    0px 0px 27px 6px rgba(66, 66, 66, 0.8);
-  box-shadow:         0px 0px 27px 6px rgba(66, 66, 66, 0.8);
-}
-  #cboxWrapper {}
-    #cboxContent {
-      padding:0;
-    }
-        #cboxLoadedContent{
-          margin:0;
-        }
-        #cboxLoadingOverlay{background:transparent;}
-
-.br-colorbox-shift {
-    position: absolute !important;
-    left: -10000px !important;
-}