@edrlab/thorium-web 1.0.9 → 1.1.0

package/dist/reader-NGCQJKLX.css

@@ -1,261 +0,0 @@
-:root {
-  --theme-text: ;
-  --theme-background: ;
-  --theme-link: ;
-  --theme-visited: ;
-  --theme-subdue: ;
-  --theme-disable: ;
-  --theme-hover: ;
-  --theme-onHover: ;
-  --theme-select: ;
-  --theme-onSelect: ;
-  --theme-focus: ;
-  --theme-elevate: ;
-  --theme-immerse: ;
-
-  --layout-radius: ;
-  --layout-spacing: ;
-}
-
-/* Reset */
-
-button {
-  -webkit-appearance: none;
-  appearance: none;
-  border-radius: 0;
-  text-align: inherit;
-  background: none;
-  box-shadow: none;
-  padding: 0;
-  cursor: pointer;
-  border: none;
-  color: inherit;
-  font: inherit;
-
-  /* Focus no outline */
-  outline: none;
-  /* No tap highlight on mobile */
-  -webkit-tap-highlight-color: transparent;
-}
-
-input {
-  font-size: 1rem;
-  border-radius: 0;
-  text-align: inherit;
-  background: none;
-  box-shadow: none;
-  padding: 0;
-  cursor: text;
-  border: none;
-  color: inherit;
-  font: inherit;
-  /* Focus no outline */
-  outline: none;
-}
-
-::selection {
-  background-color: var(--theme-select);
-  color: var(--theme-onSelect);
-}
-
-/* Layout */
-
-html,
-body {
-  min-height: 100%;
-  margin: 0;
-  overflow: hidden;
-  touch-action: pan-x pan-y;
-  overscroll-behavior-x: none;
-  overscroll-behavior-y: none;
-  background-color: var(--theme-background);
-  color: var(--theme-text);
-  position: relative;
-}
-
-#wrapper {
-  height: 100%;
-  width: 100%;
-  margin: 0;
-}
-
-#reader-main {
-  width: 100%;
-  height: 100%;
-  margin: 0;
-}
-
-#reader-shell {
-  width: 100%;
-  height: 100%;
-  margin: 0;
-}
-
-.left-dock {
-  height: 100vh;
-  height: 100dvh;
-}
-
-.right-dock {
-  height: 100vh;
-  height: 100dvh;
-}
-
-/* Top and bottom bars */
-
-#bottom-bar,
-#top-bar {
-  box-sizing: border-box;
-  gap: 2px;
-  touch-action: manipulation;
-  background-color: var(--theme-background);
-}
-
-#bottom-bar {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-/* Stacked UI */
-
-.stacked-ui {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  flex: 1 1 0;
-  height: 100vh;
-  height: 100dvh;
-  background-color: var(--theme-background);
-}
-
-.stacked-ui #top-bar,
-.stacked-ui #bottom-bar {
-  /* Need both. Otherwise it will shrink/grow when switching from stacked/layered */
-  flex: 0 0 calc(var(--icon-size, 24px) * 2.5);
-  height: calc(var(--icon-size, 24px) * 2.5);
-}
-
-.stacked-ui.isImmersive:not(.isHovering) #top-bar,
-.stacked-ui.isImmersive:not(.isHovering) #bottom-bar {
-  opacity: var(--theme-immerse);
-}
-
-/* Layered UI */
-
-.layered-ui {
-  position: relative;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  height: 100vh;
-  height: 100dvh;
-  background-color: var(--theme-background);
-}
-
-.layered-ui #top-bar,
-.layered-ui #bottom-bar {
-  position: absolute;
-  left: 0;
-  right: 0;
-  height: calc(var(--icon-size, 24px) * 2.5);
-  z-index: 2;
-  box-shadow: var(--theme-elevate);
-  overflow: hidden;
-  transition-property: transform, box-shadow;
-  transition-duration: 200ms;
-  transition-timing-function: ease-in-out;
-  transform: translateY(0);
-}
-
-.layered-ui #top-bar {
-  top: 0;
-}
-
-.layered-ui #bottom-bar {
-  bottom: 0;
-}
-
-.layered-ui.isImmersive:not(.isHovering) #top-bar {
-  transform: translateY(calc(var(--icon-size, 24px) * -2.5));
-  box-shadow: none;
-  /* For overflow button to be visible due to transforms being applied */
-  overflow: unset;
-}
-
-.layered-ui.isImmersive:not(.isHovering) #bottom-bar {
-  transform: translateY(calc(var(--icon-size, 24px) * 2.5));
-  box-shadow: none;
-}
-
-.layered-ui .bar-overlay {
-  position: absolute;
-  left: 0;
-  right: 0;
-  height: calc(var(--icon-size, 24px) * 2.5);
-  pointer-events: auto;
-  opacity: 0;
-  z-index: 1000;
-}
-
-.layered-ui #reader-header-overlay {
-  top: 0;
-}
-
-.layered-ui #reader-footer-overlay {
-  bottom: 0;
-}
-
-/* iFrame + its container */
-
-#container {
-  contain: content;
-  width: 100%;
-  height: 100%;
-  margin: 0 auto;
-}
-
-.readium-navigator-iframe {
-  width: 100%;
-  height: 100%;
-  border-width: 0;
-}
-
-/* FXL: Loading spinner for resources */
-
-@keyframes loading {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-}
-
-div:has(> .readium-navigator-iframe.blank)::after {
-  content: "";
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  margin-top: -30px;
-  margin-left: -30px;
-  width: 50px;
-  height: 50px;
-  border-radius: 50px;
-  border: 5px solid grey;
-  border-top-color: black;
-  animation: loading 2s linear infinite;
-}
-
-/* Utils */
-
-.sr-only {
-  clip: rect(0 0 0 0);
-  clip-path: inset(50%);
-  height: 1px;
-  overflow: hidden;
-  position: absolute;
-  white-space: nowrap;
-  width: 1px;
-}

package/dist/readerArrowButton.module-EFLOIADG.module.css

@@ -1,77 +0,0 @@
-.container {
-  position: absolute;
-  z-index: 2;
-}
-
-#left {
-  top: 50vh;
-  top: 50dvh;
-  transform: translateY(-50%);
-  left: 0;
-}
-
-#left button {
-  margin-left: var(--arrow-offset, 0);
-}
-
-#right {
-  top: 50vh;
-  top: 50dvh;
-  transform: translateY(-50%);
-  right: 0;
-}
-
-#right button {
-  margin-right: var(--arrow-offset, 0);
-}
-
-.container button {
-  width: var(--arrow-size, 40px);
-  /* height: var(--arrow-size, 40px); */
-  height: 40vh;
-  height: 40dvh;
-  border-radius: var(--layout-radius);
-  pointer-events: auto;
-  box-sizing: border-box;
-  padding: 5px;
-
-  background-color: var(--theme-background);
-  border: 1px solid var(--theme-text);
-}
-
-.container .viewportLarge {
-  background-color: transparent;
-  border: none;
-}
-
-.container button:disabled {
-  pointer-events: none;
-}
-
-.container .visuallyHidden {
-  opacity: 0;
-}
-
-.container button[data-focused] {
-  outline: 2px solid var(--theme-focus);
-  opacity: 1;
-}
-
-.container button[data-disabled] {
-  opacity: 0;
-}
-
-/* Exclude taps as they will eventually apply hover state */
-@media (hover: hover) and (pointer: fine) {
-  .container button:not(:disabled):hover {
-    opacity: 1;
-    transition: all 200ms;
-  }
-}
-
-.container button svg {
-  fill: var(--theme-text);
-  stroke: var(--theme-text);
-  width: 100%;
-  height: 100%;
-}

package/dist/readerHeader.module-RNGQFLVS.module.css

@@ -1,35 +0,0 @@
-.header {
-  box-sizing: border-box;
-  display: grid;
-  grid-template-areas: "header-start header-center header-end";
-  grid-template-columns: 1fr 3fr 1fr;
-  padding: 0.25rem 0.5rem 0;
-}
-
-.backLinkWrapper {
-  grid-area: header-start;
-  justify-self: start;
-  align-self: center;
-}
-
-.header h1 {
-  font-size: 1rem;
-  color: var(--theme-text);
-  font-weight: normal;
-  grid-area: header-center;
-  justify-self: center;
-  align-self: center;
-  max-width: 100%;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis; 
-  transition: opacity 200ms ease-in-out;
-}
-
-.actionsWrapper {
-  grid-area: header-end;
-  justify-self: end;
-  display: flex;
-  align-items: center;
-  gap: 2px;
-}

package/dist/readerLoader.module-KDBPCQZJ.module.css

@@ -1,40 +0,0 @@
-.readerLoaderWrapper {
-  width: 100%;
-  height: 100%;
-}
-
-.readerLoader {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  height: 100%;
-  color: var(--theme-text);
-  background-color: var(--theme-background);
-  font-weight: bold;
-}
-
-.readerLoader::after {
-  content: "...";
-  overflow: hidden;
-  display: inline-block;
-  vertical-align: bottom;
-  animation: ellipsis-dot 1s infinite 300ms;
-  animation-fill-mode: forwards;
-  width: 3ch;
-}
-
-@keyframes ellipsis-dot {
-  25% {
-    content: "";
-  }
-  50% {
-    content: ".";
-  }
-  75% {
-    content: "..";
-  }
-  100% {
-    content: "...";
-  }
-}

package/dist/readerPagination.module-DYBZAQ7H.module.css

@@ -1,76 +0,0 @@
-.pagination {
-  box-sizing: border-box;
-  display: grid;
-  gap: calc(var(--layout-spacing) / 2);
-  grid-template-areas: "pagination-start pagination-center pagination-end";
-  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
-  background-color: var(--theme-background);
-  color: var(--theme-text);
-  align-items: center;
-  width: 100%;
-  max-width: var(--constraints-pagination, 100%);
-}
-
-.paginationListItem {
-  box-sizing: border-box;
-  list-style: none;
-}
-
-.paginationListItem:has(.previousButton) {
-  grid-area: pagination-start;
-  justify-self: start;
-}
-
-.paginationListItem:has(.progression) {
-  grid-area: pagination-center;
-  justify-self: center;
-}
-
-.paginationListItem:has(.nextButton) {
-  grid-area: pagination-end;
-  justify-self: end;
-}
-
-.paginationListItem button {
-  box-sizing: border-box;
-  padding: calc(var(--icon-size, 24px) * (1/4)) calc(var(--layout-spacing) / 2);
-  gap: calc(var(--layout-spacing) / 2);
-  max-height: calc(var(--icon-size, 24px) * 2);
-  max-width: 100%;
-  border-radius: var(--layout-radius);
-  display: flex;
-  align-items: center;
-}
-
-.nextButton {
-  margin-inline-start: auto;
-  text-align: end;
-}
-
-.paginationListItem button[data-hovered] {
-  background-color: var(--theme-hover);
-}
-
-.paginationListItem button[data-focus-visible] {
-  outline: 2px solid var(--theme-focus);
-}
-
-.paginationListItem button[data-disabled] {
-  color: var(--theme-disable);
-}
-
-.paginationListItem button .paginationLabel {
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  white-space: normal;
-  -webkit-line-clamp: 1;
-  line-clamp: 1;
-}
-
-.paginationListItem button svg {
-  flex: none;
-  width: var(--icon-size, 24px);
-  height: var(--icon-size, 24px);
-  fill: var(--theme-text);
-}

package/dist/readerProgression.module-7PU7L74S.module.css

@@ -1,5 +0,0 @@
-#current {
-  color: var(--theme-text);
-  font-variant-numeric: lining-nums tabular-nums;
-  text-align: center;
-}

package/dist/readerSharedUI.module-Y2VDWFS5.module.css

@@ -1,98 +0,0 @@
-.icon,
-.dockerButton,
-.closeButton,
-.backButton {
-  box-sizing: border-box;
-  padding: calc(var(--icon-size, 24px) * (1/4));
-  text-align: center;
-  border-radius: var(--layout-radius);
-}
-
-.backButton {
-  box-sizing: content-box;
-  height: var(--icon-size, 24px);
-  border: 2px solid transparent;
-  display: flex;
-  align-items: center;
-}
-
-.closeButton,
-.backButton {
-  margin-inline-start: auto;
-}
-
-.icon svg,
-.dockerButton svg,
-.closeButton svg,
-.backButton svg {
-  fill: var(--theme-text);
-  width: var(--icon-size, 24px);
-  height: var(--icon-size, 24px);
-}
-
-.icon[data-hovered],
-.dockerButton[data-hovered],
-.closeButton[data-hovered],
-.backButton[data-hovered] {
-  background-color: var(--theme-hover);
-}
-
-.icon[data-focus-visible],
-.dockerButton[data-focus-visible],
-.closeButton[data-focus-visible],
-.backButton[data-focus-visible] {
-  outline: 2px solid var(--theme-focus);
-}
-
-.backButton[data-disabled] {
-  color: var(--theme-disable)
-}
-
-.icon[data-disabled] svg,
-.dockerButton[data-disabled] svg,
-.closeButton[data-disabled] svg,
-.backButton[data-disabled] svg {
-  fill: var(--theme-disable);
-}
-
-.tooltip {
-  background-color: var(--theme-text);
-  color: var(--theme-background);
-  padding: 5px;
-  border-radius: var(--layout-radius);
-}
-
-/* Visibility + Immersive */
-
-.alwaysVisible {
-  opacity: 1;
-}
-
-:global(.stacked-ui.isImmersive:not(.isHovering)) .partiallyVisible {
-  opacity: 0;
-}
-
-/* Utils to improve icons’ consistency */
-
-.iconCompSm {
-  padding: calc(var(--icon-size, 24px) * (1/3));
-}
-
-.iconCompSm svg {
-  width: calc(var(--icon-size, 24px) * (3/4));
-  height: calc(var(--icon-size, 24px) * (3/4));
-  stroke: var(--theme-text);
-}
-
-.iconCompLg {
-  padding: calc(var(--icon-size, 24px) * (1/6));
-}
-
-.iconCompLg svg {
-  width: calc(var(--icon-size, 24px) * (4/3));
-  height: calc(var(--icon-size, 24px) * (4/3));
-}
-
-.iconApplyStroke svg {
-  stroke: var(--theme-text);
-}