diff --git a/src/components/d-cite.js b/src/components/d-cite.js index 6713f5b..fe1ddd6 100644 --- a/src/components/d-cite.js +++ b/src/components/d-cite.js @@ -36,7 +36,7 @@ figcaption .citation-number { } .container { - position: fixed; + position: absolute; width: 100%; left: 0; z-index: 10000; diff --git a/src/components/d-footnote.js b/src/components/d-footnote.js index 94cb472..1fe5048 100644 --- a/src/components/d-footnote.js +++ b/src/components/d-footnote.js @@ -26,7 +26,7 @@ span { } .container { - position: fixed; + position: absolute; width: 100%; left: 0; z-index: 10000; diff --git a/src/helpers/hover-box.js b/src/helpers/hover-box.js index 4efa6e9..5194e87 100644 --- a/src/helpers/hover-box.js +++ b/src/helpers/hover-box.js @@ -1,25 +1,25 @@ -function make_hover_css(target_node, pos) { - const pretty = window.innerWidth > 600; - const padding = pretty? 18 : 12; - const outer_padding = pretty ? 18 : 0; - // const bbox = document.querySelector('body').getBoundingClientRect(); - const bbox = target_node.offsetParent.getBoundingClientRect(); - let left = pos[0] - bbox.left, top = pos[1] - bbox.top; - let width = Math.min(window.innerWidth-2*outer_padding, 648); - left = Math.min(left, window.innerWidth-width-outer_padding); - width = width - 2 * padding; - return (`position: absolute; - background-color: #FFF; - opacity: 0.95; - max-width: ${width}px; - top: ${top}px; - left: ${left}px; - border: 1px solid rgba(0, 0, 0, 0.25); - padding: ${padding}px; - border-radius: ${pretty? 3 : 0}px; - box-shadow: 0px 2px 10px 2px rgba(0, 0, 0, 0.2); - z-index: ${1e6};`); -} +// function make_hover_css(target_node, pos) { +// const pretty = window.innerWidth > 600; +// const padding = pretty? 18 : 12; +// const outer_padding = pretty ? 18 : 0; +// // const bbox = document.querySelector('body').getBoundingClientRect(); +// const bbox = target_node.offsetParent.getBoundingClientRect(); +// let left = pos[0] - bbox.left, top = pos[1] - bbox.top; +// let width = Math.min(window.innerWidth-2*outer_padding, 648); +// left = Math.min(left, window.innerWidth-width-outer_padding); +// width = width - 2 * padding; +// return (`position: absolute; +// background-color: #FFF; +// opacity: 0.95; +// max-width: ${width}px; +// top: ${top}px; +// left: ${left}px; +// border: 1px solid rgba(0, 0, 0, 0.25); +// padding: ${padding}px; +// border-radius: ${pretty? 3 : 0}px; +// box-shadow: 0px 2px 10px 2px rgba(0, 0, 0, 0.2); +// z-index: ${1e6};`); +// } export class HoverBox {