diff --git a/package-lock.json b/package-lock.json index f9df607..f9be87f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "document-viewer-ts", - "version": "0.5.5-legacy", + "version": "0.6.1-legacy", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "document-viewer-ts", - "version": "0.5.5-legacy", + "version": "0.6.1-legacy", "license": "MIT", "devDependencies": { "@testing-library/react-hooks": "^7.0.2", @@ -6639,9 +6639,9 @@ } }, "node_modules/web-streams-polyfill": { - "version": "3.2.1", - "resolved": "https://registry.npmjs.org/web-streams-polyfill/-/web-streams-polyfill-3.2.1.tgz", - "integrity": "sha512-e0MO3wdXWKrLbL0DgGnUV7WHVuw9OUvL4hjgnPkIeEvESk74gAITi5G606JtZPp39cd8HA9VQzCIvA49LpPN5Q==", + "version": "3.3.3", + "resolved": "https://registry.npmjs.org/web-streams-polyfill/-/web-streams-polyfill-3.3.3.tgz", + "integrity": "sha512-d2JWLCivmZYTSIoge9MsgFCZrt571BikcWGYkjC1khllbTeDlGqZ2D8vD8E/lJa8WGWbb7Plm8/XJYV7IJHZZw==", "dev": true, "engines": { "node": ">= 8" diff --git a/package.json b/package.json index 09b5af2..fe435c4 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "document-viewer-ts", - "version": "0.6.0-legacy", + "version": "0.6.1-legacy", "description": "PDF and MS Doc viewer written in TypeScript for React and vanilla JavaScript", "main": "dist/lib/index.js", "module": "dist/es2015/index.js", diff --git a/src/base.ts b/src/base.ts index 76c2aa8..ca2497e 100644 --- a/src/base.ts +++ b/src/base.ts @@ -70,6 +70,7 @@ export const renderPDF = async (containerDiv: Element, documentUrl: string) => { pageNumberInput.className = 'page-number-input'; pageNumberInput.type = 'number'; const pageDiv = document.createElement('div'); + pageDiv.className = 'page-label'; const outOfDiv = document.createElement('div'); const pageCountDiv = document.createElement('div'); const nextButton = document.createElement('button'); diff --git a/styles/styles.css b/styles/styles.css index d638963..ab865a4 100644 --- a/styles/styles.css +++ b/styles/styles.css @@ -74,6 +74,13 @@ div.document-viewer-ts.viewer-container { z-index: 999; } +.page-label { + display: none; + @media (min-width: 36em) { + display: flex; + } +} + .document-viewer-ts .viewer-controls:hover { opacity: 1; }