1 files changed, 97 insertions, 11 deletions

diff --git a/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.css b/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.css
index 8cf1a6a4..cae4eeb2 100644
--- a/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.css
+++ b/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.css
@@ -70,7 +70,7 @@
   direction: ltr;
   width: 51em;
   height: 66em;
-  margin: 0.063em auto -0.5em auto;
+  margin: 1em auto -0.5em auto;
   position: relative;
   overflow: visible;
   border: 9px solid transparent;
@@ -183,8 +183,8 @@ html {
 
 body {
   height: 100%;
-  background-color: #404040;
-  background-image: url(images/texture.png);
+  background-color: transparent;
+ /* background-image: url(images/texture.png); */
 }
 
 body,
@@ -361,7 +361,21 @@ html[dir='rtl'] #outerContainer.sidebarOpen > #sidebarContainer {
   -webkit-transition-timing-function: ease;
   transition-duration: 200ms;
   transition-timing-function: ease;
+  
+  background-color: #E8F4FF;
+}
+
+input[type=number]::-webkit-outer-spin-button,
+input[type=number]::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
 }
+
+input[type=number] {
+    -moz-appearance:textfield;
+}
+
+
 html[dir='ltr'] #outerContainer.sidebarOpen > #mainContainer {
   -webkit-transition-property: left;
   transition-property: left;
@@ -392,7 +406,7 @@ html[dir='rtl'] #sidebarContent {
 }
 
 #viewerContainer {
-  overflow: auto;
+  overflow-y: hidden; /* hide or show Scrollbar in Viewer*/
   -webkit-overflow-scrolling: touch;
   position: absolute;
   top: 2em;
@@ -417,7 +431,70 @@ html[dir='rtl'] #viewerContainer {
 }
 
 #toolbarContainer {
-  width: 100%;
+  
+  margin: 1em;
+  width: calc(100% - 2em); /* To include the margin of 1em */
+}
+
+#viewerContainer {
+  
+ 	 margin-top: 2em;
+  }
+
+#PageInput {
+	width: 8.6em;
+	margin-bottom:-3em;
+	padding-left: 0.5em;
+}
+
+#pageNumber {
+	width: 3.5em;
+}
+
+@media screen and (max-width: 474px) { /* This is the width where it collapses */
+	#ContinueToSignText {
+		display: none;
+	}
+	
+	#PlaceOnNewPageText {
+		display: none;
+	}
+	
+	#BackBoxText {
+		display: none;
+	}
+}
+
+@media screen and (min-width: 475px) { /* This is the width where it collapses */
+
+	#ContinueToSignIcon {
+		display: none;
+	}
+	
+	#PlaceOnNewPageIcon {
+		display: none;
+	}
+	
+	#BackBoxIcon {
+		display: none;
+	}
+}
+
+#ContinueToSignText, #BackBoxText {
+	margin: 0;
+}
+
+#placeContinue {
+   margin-top:0;
+}
+
+#BackBox {
+	margin-right: 0.5em;
+}
+
+#PlaceOnNewPage {
+	margin-left: 0.5em;
+	height: 34px;
 }
 
 #toolbarSidebar {
@@ -443,10 +520,12 @@ html[dir='rtl'] #toolbarSidebar {
 #toolbarContainer, .findbar, .secondaryToolbar {
   position: relative;
   height: 2em;
-  background-color: #474747; /* fallback */
-  background-image: url(images/texture.png),
-                    linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95));
+  background-color: transparent; /*#474747;*/ /* fallback */
+ /*background-image: url(images/texture.png),
+                    linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95));*/
+  
 }
+/*
 html[dir='ltr'] #toolbarContainer, .findbar, .secondaryToolbar {
   box-shadow: inset 0.063em 0 0 hsla(0,0%,100%,.08),
               inset 0 0.063em 0.063em hsla(0,0%,0%,.15),
@@ -461,10 +540,12 @@ html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar {
               0 0.063em 0 hsla(0,0%,0%,.15),
               0 0.063em 0.063em hsla(0,0%,0%,.1);
 }
+*/
 
 #toolbarViewer {
   height: 2em;
   min-width: 5em;
+  display: none;
 }
 
 #loadingBar {
@@ -1232,7 +1313,7 @@ html[dir='rtl'] .verticalToolbarSeparator {
 }
 
 .toolbarField.pageNumber {
-  -moz-appearance: textfield; /* hides the spinner in moz */
+  -moz-appearance: none; /* hides the spinner in moz */
   min-width: 16px;
   text-align: right;
   width: 40px;
@@ -1646,9 +1727,13 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * {
   font-size: 10px;
 }
 
+#viewer {
+	background-color: transparent;
+}
+
 #viewer.textLayer-visible .textLayer > div,
 #viewer.textLayer-hover .textLayer > div:hover {
-  background-color: white;
+  background-color: transparent;
   color: black;
 }
 
@@ -1868,8 +1953,9 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * {
   #sidebarContainer, #secondaryToolbar, .toolbar, #loadingBox, #errorWrapper, .textLayer {
     display: none;
   }
+  
   #viewerContainer {
-    overflow: visible;
+  
   }