Bläddra i källkod

Optim: improve PDF reader controls layout

febbweiss 8 år sedan
förälder
incheckning
65f02461c5
2 ändrade filer med 7 tillägg och 4 borttagningar
  1. 3 0
      index.html
  2. 4 4
      partials/viewer.html

+ 3 - 0
index.html

@@ -35,6 +35,9 @@
 			.rotate90 {-webkit-transform: rotate(90deg); transform: rotate(90deg); }
 			.rotate180 {-webkit-transform: rotate(180deg); transform: rotate(180deg); }
 			.rotate270 {-webkit-transform: rotate(270deg); transform: rotate(270deg); }
+			
+			.pdf-controls { width: 100%; display: block; background: #eee; padding: 1em;}
+			.fixed { position: fixed; top: 0; left: calc(50% - 480px); z-index: 100; width: 100%; padding: 1em; background: rgba(238, 238, 238,.9); width: 960px; }
 		</style>
 	</head>
 

+ 4 - 4
partials/viewer.html

@@ -1,11 +1,11 @@
-<div ng-if="pdfName">
-  <div class="is-pulled-left">
-    <a href="{{pdfUrl}}" class="field button fa fa-download"></a>
-  </div>
+<div ng-if="pdfName" ng-class="{'pdf-controls fixed': scroll > 100, 'pdf-controls': scroll <= 100}">
   <nav ng-class="getNavStyle(scroll)" class="is-pulled-right" >
     
       <div class="field">
         <div class="field-body">
+          <div class="field">
+             <a href="{{pdfUrl}}" class="button fa fa-download"></a>
+          </div>
           <div class="field is-grouped-right">
             <p class="control">
               <button class="button is-normal fa fa-caret-left" ng-click="goPrevious()"></button>