browser/extensions/pdfjs/content/web/viewer.css

Wed, 31 Dec 2014 06:09:35 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Wed, 31 Dec 2014 06:09:35 +0100
changeset 0
6474c204b198
permissions
-rw-r--r--

Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.

michael@0 1 /* Copyright 2012 Mozilla Foundation
michael@0 2 *
michael@0 3 * Licensed under the Apache License, Version 2.0 (the "License");
michael@0 4 * you may not use this file except in compliance with the License.
michael@0 5 * You may obtain a copy of the License at
michael@0 6 *
michael@0 7 * http://www.apache.org/licenses/LICENSE-2.0
michael@0 8 *
michael@0 9 * Unless required by applicable law or agreed to in writing, software
michael@0 10 * distributed under the License is distributed on an "AS IS" BASIS,
michael@0 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
michael@0 12 * See the License for the specific language governing permissions and
michael@0 13 * limitations under the License.
michael@0 14 */
michael@0 15
michael@0 16 * {
michael@0 17 padding: 0;
michael@0 18 margin: 0;
michael@0 19 }
michael@0 20
michael@0 21 html {
michael@0 22 height: 100%;
michael@0 23 /* Font size is needed to make the activity bar the correct size. */
michael@0 24 font-size: 10px;
michael@0 25 }
michael@0 26
michael@0 27 body {
michael@0 28 height: 100%;
michael@0 29 background-color: #404040;
michael@0 30 background-image: url(images/texture.png);
michael@0 31 }
michael@0 32
michael@0 33 body,
michael@0 34 input,
michael@0 35 button,
michael@0 36 select {
michael@0 37 font: message-box;
michael@0 38 outline: none;
michael@0 39 }
michael@0 40
michael@0 41 .hidden {
michael@0 42 display: none !important;
michael@0 43 }
michael@0 44 [hidden] {
michael@0 45 display: none !important;
michael@0 46 }
michael@0 47
michael@0 48 #viewerContainer:-moz-full-screen {
michael@0 49 top: 0px;
michael@0 50 border-top: 2px solid transparent;
michael@0 51 background-color: #000;
michael@0 52 width: 100%;
michael@0 53 height: 100%;
michael@0 54 overflow: hidden;
michael@0 55 cursor: none;
michael@0 56 }
michael@0 57
michael@0 58 #viewerContainer:fullscreen {
michael@0 59 top: 0px;
michael@0 60 border-top: 2px solid transparent;
michael@0 61 background-color: #000;
michael@0 62 width: 100%;
michael@0 63 height: 100%;
michael@0 64 overflow: hidden;
michael@0 65 cursor: none;
michael@0 66 }
michael@0 67
michael@0 68 :-moz-full-screen .page {
michael@0 69 margin-bottom: 100%;
michael@0 70 border: 0;
michael@0 71 }
michael@0 72
michael@0 73 :fullscreen .page {
michael@0 74 margin-bottom: 100%;
michael@0 75 border: 0;
michael@0 76 }
michael@0 77
michael@0 78 :-moz-full-screen a:not(.internalLink) {
michael@0 79 display: none;
michael@0 80 }
michael@0 81
michael@0 82 :fullscreen a:not(.internalLink) {
michael@0 83 display: none;
michael@0 84 }
michael@0 85
michael@0 86 :-moz-full-screen .textLayer > div {
michael@0 87 cursor: none;
michael@0 88 }
michael@0 89
michael@0 90 :fullscreen .textLayer > div {
michael@0 91 cursor: none;
michael@0 92 }
michael@0 93
michael@0 94 #viewerContainer.presentationControls,
michael@0 95 #viewerContainer.presentationControls .textLayer > div {
michael@0 96 cursor: default;
michael@0 97 }
michael@0 98
michael@0 99 /* outer/inner center provides horizontal center */
michael@0 100 .outerCenter {
michael@0 101 pointer-events: none;
michael@0 102 position: relative;
michael@0 103 }
michael@0 104 html[dir='ltr'] .outerCenter {
michael@0 105 float: right;
michael@0 106 right: 50%;
michael@0 107 }
michael@0 108 html[dir='rtl'] .outerCenter {
michael@0 109 float: left;
michael@0 110 left: 50%;
michael@0 111 }
michael@0 112 .innerCenter {
michael@0 113 pointer-events: auto;
michael@0 114 position: relative;
michael@0 115 }
michael@0 116 html[dir='ltr'] .innerCenter {
michael@0 117 float: right;
michael@0 118 right: -50%;
michael@0 119 }
michael@0 120 html[dir='rtl'] .innerCenter {
michael@0 121 float: left;
michael@0 122 left: -50%;
michael@0 123 }
michael@0 124
michael@0 125 #outerContainer {
michael@0 126 width: 100%;
michael@0 127 height: 100%;
michael@0 128 position: relative;
michael@0 129 }
michael@0 130
michael@0 131 #sidebarContainer {
michael@0 132 position: absolute;
michael@0 133 top: 0;
michael@0 134 bottom: 0;
michael@0 135 width: 200px;
michael@0 136 visibility: hidden;
michael@0 137 transition-duration: 200ms;
michael@0 138 transition-timing-function: ease;
michael@0 139
michael@0 140 }
michael@0 141 html[dir='ltr'] #sidebarContainer {
michael@0 142 transition-property: left;
michael@0 143 left: -200px;
michael@0 144 }
michael@0 145 html[dir='rtl'] #sidebarContainer {
michael@0 146 transition-property: right;
michael@0 147 right: -200px;
michael@0 148 }
michael@0 149
michael@0 150 #outerContainer.sidebarMoving > #sidebarContainer,
michael@0 151 #outerContainer.sidebarOpen > #sidebarContainer {
michael@0 152 visibility: visible;
michael@0 153 }
michael@0 154 html[dir='ltr'] #outerContainer.sidebarOpen > #sidebarContainer {
michael@0 155 left: 0px;
michael@0 156 }
michael@0 157 html[dir='rtl'] #outerContainer.sidebarOpen > #sidebarContainer {
michael@0 158 right: 0px;
michael@0 159 }
michael@0 160
michael@0 161 #mainContainer {
michael@0 162 position: absolute;
michael@0 163 top: 0;
michael@0 164 right: 0;
michael@0 165 bottom: 0;
michael@0 166 left: 0;
michael@0 167 min-width: 320px;
michael@0 168 transition-duration: 200ms;
michael@0 169 transition-timing-function: ease;
michael@0 170 }
michael@0 171 html[dir='ltr'] #outerContainer.sidebarOpen > #mainContainer {
michael@0 172 transition-property: left;
michael@0 173 left: 200px;
michael@0 174 }
michael@0 175 html[dir='rtl'] #outerContainer.sidebarOpen > #mainContainer {
michael@0 176 transition-property: right;
michael@0 177 right: 200px;
michael@0 178 }
michael@0 179
michael@0 180 #sidebarContent {
michael@0 181 top: 32px;
michael@0 182 bottom: 0;
michael@0 183 overflow: auto;
michael@0 184 position: absolute;
michael@0 185 width: 200px;
michael@0 186 background-color: hsla(0,0%,0%,.1);
michael@0 187 }
michael@0 188 html[dir='ltr'] #sidebarContent {
michael@0 189 left: 0;
michael@0 190 box-shadow: inset -1px 0 0 hsla(0,0%,0%,.25);
michael@0 191 }
michael@0 192 html[dir='rtl'] #sidebarContent {
michael@0 193 right: 0;
michael@0 194 box-shadow: inset 1px 0 0 hsla(0,0%,0%,.25);
michael@0 195 }
michael@0 196
michael@0 197 #viewerContainer {
michael@0 198 overflow: auto;
michael@0 199 position: absolute;
michael@0 200 top: 32px;
michael@0 201 right: 0;
michael@0 202 bottom: 0;
michael@0 203 left: 0;
michael@0 204 outline: none;
michael@0 205 }
michael@0 206 html[dir='ltr'] #viewerContainer {
michael@0 207 box-shadow: inset 1px 0 0 hsla(0,0%,100%,.05);
michael@0 208 }
michael@0 209 html[dir='rtl'] #viewerContainer {
michael@0 210 box-shadow: inset -1px 0 0 hsla(0,0%,100%,.05);
michael@0 211 }
michael@0 212
michael@0 213 .toolbar {
michael@0 214 position: relative;
michael@0 215 left: 0;
michael@0 216 right: 0;
michael@0 217 z-index: 9999;
michael@0 218 cursor: default;
michael@0 219 }
michael@0 220
michael@0 221 #toolbarContainer {
michael@0 222 width: 100%;
michael@0 223 }
michael@0 224
michael@0 225 #toolbarSidebar {
michael@0 226 width: 200px;
michael@0 227 height: 32px;
michael@0 228 background-color: #424242; /* fallback */
michael@0 229 background-image: url(images/texture.png),
michael@0 230 linear-gradient(hsla(0,0%,30%,.99), hsla(0,0%,25%,.95));
michael@0 231 }
michael@0 232 html[dir='ltr'] #toolbarSidebar {
michael@0 233 box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.25),
michael@0 234 inset 0 -1px 0 hsla(0,0%,100%,.05),
michael@0 235 0 1px 0 hsla(0,0%,0%,.15),
michael@0 236 0 0 1px hsla(0,0%,0%,.1);
michael@0 237 }
michael@0 238 html[dir='rtl'] #toolbarSidebar {
michael@0 239 box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.25),
michael@0 240 inset 0 1px 0 hsla(0,0%,100%,.05),
michael@0 241 0 1px 0 hsla(0,0%,0%,.15),
michael@0 242 0 0 1px hsla(0,0%,0%,.1);
michael@0 243 }
michael@0 244
michael@0 245 #toolbarContainer, .findbar, .secondaryToolbar {
michael@0 246 position: relative;
michael@0 247 height: 32px;
michael@0 248 background-color: #474747; /* fallback */
michael@0 249 background-image: url(images/texture.png),
michael@0 250 linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95));
michael@0 251 }
michael@0 252 html[dir='ltr'] #toolbarContainer, .findbar, .secondaryToolbar {
michael@0 253 box-shadow: inset 1px 0 0 hsla(0,0%,100%,.08),
michael@0 254 inset 0 1px 1px hsla(0,0%,0%,.15),
michael@0 255 inset 0 -1px 0 hsla(0,0%,100%,.05),
michael@0 256 0 1px 0 hsla(0,0%,0%,.15),
michael@0 257 0 1px 1px hsla(0,0%,0%,.1);
michael@0 258 }
michael@0 259 html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar {
michael@0 260 box-shadow: inset -1px 0 0 hsla(0,0%,100%,.08),
michael@0 261 inset 0 1px 1px hsla(0,0%,0%,.15),
michael@0 262 inset 0 -1px 0 hsla(0,0%,100%,.05),
michael@0 263 0 1px 0 hsla(0,0%,0%,.15),
michael@0 264 0 1px 1px hsla(0,0%,0%,.1);
michael@0 265 }
michael@0 266
michael@0 267 #toolbarViewer {
michael@0 268 height: 32px;
michael@0 269 }
michael@0 270
michael@0 271 #loadingBar {
michael@0 272 position: relative;
michael@0 273 width: 100%;
michael@0 274 height: 6px;
michael@0 275 background-color: #333;
michael@0 276 border-bottom: 1px solid #333;
michael@0 277 }
michael@0 278
michael@0 279 #loadingBar .progress {
michael@0 280 position: absolute;
michael@0 281 top: 0;
michael@0 282 left: 0;
michael@0 283 width: 0%;
michael@0 284 height: 100%;
michael@0 285 background-color: #ddd;
michael@0 286 overflow: hidden;
michael@0 287 transition: width 200ms;
michael@0 288 }
michael@0 289
michael@0 290 @keyframes progressIndeterminate {
michael@0 291 0% { left: 0%; }
michael@0 292 50% { left: 100%; }
michael@0 293 100% { left: 100%; }
michael@0 294 }
michael@0 295
michael@0 296 #loadingBar .progress.indeterminate {
michael@0 297 background-color: #999;
michael@0 298 transition: none;
michael@0 299 }
michael@0 300
michael@0 301 #loadingBar .indeterminate .glimmer {
michael@0 302 position: absolute;
michael@0 303 top: 0;
michael@0 304 left: 0;
michael@0 305 height: 100%;
michael@0 306 width: 50px;
michael@0 307
michael@0 308 background-image: linear-gradient(to right, #999 0%, #fff 50%, #999 100%);
michael@0 309 background-size: 100% 100%;
michael@0 310 background-repeat: no-repeat;
michael@0 311
michael@0 312 animation: progressIndeterminate 2s linear infinite;
michael@0 313 }
michael@0 314
michael@0 315 .findbar, .secondaryToolbar {
michael@0 316 top: 32px;
michael@0 317 position: absolute;
michael@0 318 z-index: 10000;
michael@0 319 height: 32px;
michael@0 320
michael@0 321 min-width: 16px;
michael@0 322 padding: 0px 6px 0px 6px;
michael@0 323 margin: 4px 2px 4px 2px;
michael@0 324 color: hsl(0,0%,85%);
michael@0 325 font-size: 12px;
michael@0 326 line-height: 14px;
michael@0 327 text-align: left;
michael@0 328 cursor: default;
michael@0 329 }
michael@0 330
michael@0 331 html[dir='ltr'] .findbar {
michael@0 332 left: 68px;
michael@0 333 }
michael@0 334
michael@0 335 html[dir='rtl'] .findbar {
michael@0 336 right: 68px;
michael@0 337 }
michael@0 338
michael@0 339 .findbar label {
michael@0 340 -moz-user-select: none;
michael@0 341 }
michael@0 342
michael@0 343 #findInput[data-status="pending"] {
michael@0 344 background-image: url(images/loading-small.png);
michael@0 345 background-repeat: no-repeat;
michael@0 346 background-position: right;
michael@0 347 }
michael@0 348
michael@0 349 .secondaryToolbar {
michael@0 350 padding: 6px;
michael@0 351 height: auto;
michael@0 352 z-index: 30000;
michael@0 353 }
michael@0 354 html[dir='ltr'] .secondaryToolbar {
michael@0 355 right: 4px;
michael@0 356 }
michael@0 357 html[dir='rtl'] .secondaryToolbar {
michael@0 358 left: 4px;
michael@0 359 }
michael@0 360
michael@0 361 #secondaryToolbarButtonContainer {
michael@0 362 max-width: 200px;
michael@0 363 max-height: 400px;
michael@0 364 overflow-y: auto;
michael@0 365 margin-bottom: -4px;
michael@0 366 }
michael@0 367
michael@0 368 .doorHanger,
michael@0 369 .doorHangerRight {
michael@0 370 border: 1px solid hsla(0,0%,0%,.5);
michael@0 371 border-radius: 2px;
michael@0 372 box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
michael@0 373 }
michael@0 374 .doorHanger:after, .doorHanger:before,
michael@0 375 .doorHangerRight:after, .doorHangerRight:before {
michael@0 376 bottom: 100%;
michael@0 377 border: solid transparent;
michael@0 378 content: " ";
michael@0 379 height: 0;
michael@0 380 width: 0;
michael@0 381 position: absolute;
michael@0 382 pointer-events: none;
michael@0 383 }
michael@0 384 .doorHanger:after,
michael@0 385 .doorHangerRight:after {
michael@0 386 border-bottom-color: hsla(0,0%,32%,.99);
michael@0 387 border-width: 8px;
michael@0 388 }
michael@0 389 .doorHanger:before,
michael@0 390 .doorHangerRight:before {
michael@0 391 border-bottom-color: hsla(0,0%,0%,.5);
michael@0 392 border-width: 9px;
michael@0 393 }
michael@0 394
michael@0 395 html[dir='ltr'] .doorHanger:after,
michael@0 396 html[dir='rtl'] .doorHangerRight:after {
michael@0 397 left: 13px;
michael@0 398 margin-left: -8px;
michael@0 399 }
michael@0 400
michael@0 401 html[dir='ltr'] .doorHanger:before,
michael@0 402 html[dir='rtl'] .doorHangerRight:before {
michael@0 403 left: 13px;
michael@0 404 margin-left: -9px;
michael@0 405 }
michael@0 406
michael@0 407 html[dir='rtl'] .doorHanger:after,
michael@0 408 html[dir='ltr'] .doorHangerRight:after {
michael@0 409 right: 13px;
michael@0 410 margin-right: -8px;
michael@0 411 }
michael@0 412
michael@0 413 html[dir='rtl'] .doorHanger:before,
michael@0 414 html[dir='ltr'] .doorHangerRight:before {
michael@0 415 right: 13px;
michael@0 416 margin-right: -9px;
michael@0 417 }
michael@0 418
michael@0 419 #findMsg {
michael@0 420 font-style: italic;
michael@0 421 color: #A6B7D0;
michael@0 422 }
michael@0 423
michael@0 424 .notFound {
michael@0 425 background-color: rgb(255, 137, 153);
michael@0 426 }
michael@0 427
michael@0 428 html[dir='ltr'] #toolbarViewerLeft {
michael@0 429 margin-left: -1px;
michael@0 430 }
michael@0 431 html[dir='rtl'] #toolbarViewerRight {
michael@0 432 margin-right: -1px;
michael@0 433 }
michael@0 434
michael@0 435 html[dir='ltr'] #toolbarViewerLeft,
michael@0 436 html[dir='rtl'] #toolbarViewerRight {
michael@0 437 position: absolute;
michael@0 438 top: 0;
michael@0 439 left: 0;
michael@0 440 }
michael@0 441 html[dir='ltr'] #toolbarViewerRight,
michael@0 442 html[dir='rtl'] #toolbarViewerLeft {
michael@0 443 position: absolute;
michael@0 444 top: 0;
michael@0 445 right: 0;
michael@0 446 }
michael@0 447 html[dir='ltr'] #toolbarViewerLeft > *,
michael@0 448 html[dir='ltr'] #toolbarViewerMiddle > *,
michael@0 449 html[dir='ltr'] #toolbarViewerRight > *,
michael@0 450 html[dir='ltr'] .findbar > * {
michael@0 451 position: relative;
michael@0 452 float: left;
michael@0 453 }
michael@0 454 html[dir='rtl'] #toolbarViewerLeft > *,
michael@0 455 html[dir='rtl'] #toolbarViewerMiddle > *,
michael@0 456 html[dir='rtl'] #toolbarViewerRight > *,
michael@0 457 html[dir='rtl'] .findbar > * {
michael@0 458 position: relative;
michael@0 459 float: right;
michael@0 460 }
michael@0 461
michael@0 462 html[dir='ltr'] .splitToolbarButton {
michael@0 463 margin: 3px 2px 4px 0;
michael@0 464 display: inline-block;
michael@0 465 }
michael@0 466 html[dir='rtl'] .splitToolbarButton {
michael@0 467 margin: 3px 0 4px 2px;
michael@0 468 display: inline-block;
michael@0 469 }
michael@0 470 html[dir='ltr'] .splitToolbarButton > .toolbarButton {
michael@0 471 border-radius: 0;
michael@0 472 float: left;
michael@0 473 }
michael@0 474 html[dir='rtl'] .splitToolbarButton > .toolbarButton {
michael@0 475 border-radius: 0;
michael@0 476 float: right;
michael@0 477 }
michael@0 478
michael@0 479 .toolbarButton,
michael@0 480 .secondaryToolbarButton {
michael@0 481 border: 0 none;
michael@0 482 background-color: rgba(0, 0, 0, 0);
michael@0 483 width: 32px;
michael@0 484 height: 25px;
michael@0 485 }
michael@0 486
michael@0 487 .toolbarButton > span {
michael@0 488 display: inline-block;
michael@0 489 width: 0;
michael@0 490 height: 0;
michael@0 491 overflow: hidden;
michael@0 492 }
michael@0 493
michael@0 494 .toolbarButton[disabled],
michael@0 495 .secondaryToolbarButton[disabled] {
michael@0 496 opacity: .5;
michael@0 497 }
michael@0 498
michael@0 499 .toolbarButton.group {
michael@0 500 margin-right: 0;
michael@0 501 }
michael@0 502
michael@0 503 .splitToolbarButton.toggled .toolbarButton {
michael@0 504 margin: 0;
michael@0 505 }
michael@0 506
michael@0 507 .splitToolbarButton:hover > .toolbarButton,
michael@0 508 .splitToolbarButton:focus > .toolbarButton,
michael@0 509 .splitToolbarButton.toggled > .toolbarButton,
michael@0 510 .toolbarButton.textButton {
michael@0 511 background-color: hsla(0,0%,0%,.12);
michael@0 512 background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
michael@0 513 background-clip: padding-box;
michael@0 514 border: 1px solid hsla(0,0%,0%,.35);
michael@0 515 border-color: hsla(0,0%,0%,.32) hsla(0,0%,0%,.38) hsla(0,0%,0%,.42);
michael@0 516 box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset,
michael@0 517 0 0 1px hsla(0,0%,100%,.15) inset,
michael@0 518 0 1px 0 hsla(0,0%,100%,.05);
michael@0 519 transition-property: background-color, border-color, box-shadow;
michael@0 520 transition-duration: 150ms;
michael@0 521 transition-timing-function: ease;
michael@0 522
michael@0 523 }
michael@0 524 .splitToolbarButton > .toolbarButton:hover,
michael@0 525 .splitToolbarButton > .toolbarButton:focus,
michael@0 526 .dropdownToolbarButton:hover,
michael@0 527 .overlayButton:hover,
michael@0 528 .toolbarButton.textButton:hover,
michael@0 529 .toolbarButton.textButton:focus {
michael@0 530 background-color: hsla(0,0%,0%,.2);
michael@0 531 box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset,
michael@0 532 0 0 1px hsla(0,0%,100%,.15) inset,
michael@0 533 0 0 1px hsla(0,0%,0%,.05);
michael@0 534 z-index: 199;
michael@0 535 }
michael@0 536 .splitToolbarButton > .toolbarButton {
michael@0 537 position: relative;
michael@0 538 }
michael@0 539 html[dir='ltr'] .splitToolbarButton > .toolbarButton:first-child,
michael@0 540 html[dir='rtl'] .splitToolbarButton > .toolbarButton:last-child {
michael@0 541 position: relative;
michael@0 542 margin: 0;
michael@0 543 margin-right: -1px;
michael@0 544 border-top-left-radius: 2px;
michael@0 545 border-bottom-left-radius: 2px;
michael@0 546 border-right-color: transparent;
michael@0 547 }
michael@0 548 html[dir='ltr'] .splitToolbarButton > .toolbarButton:last-child,
michael@0 549 html[dir='rtl'] .splitToolbarButton > .toolbarButton:first-child {
michael@0 550 position: relative;
michael@0 551 margin: 0;
michael@0 552 margin-left: -1px;
michael@0 553 border-top-right-radius: 2px;
michael@0 554 border-bottom-right-radius: 2px;
michael@0 555 border-left-color: transparent;
michael@0 556 }
michael@0 557 .splitToolbarButtonSeparator {
michael@0 558 padding: 8px 0;
michael@0 559 width: 1px;
michael@0 560 background-color: hsla(0,0%,0%,.5);
michael@0 561 z-index: 99;
michael@0 562 box-shadow: 0 0 0 1px hsla(0,0%,100%,.08);
michael@0 563 display: inline-block;
michael@0 564 margin: 5px 0;
michael@0 565 }
michael@0 566 html[dir='ltr'] .splitToolbarButtonSeparator {
michael@0 567 float: left;
michael@0 568 }
michael@0 569 html[dir='rtl'] .splitToolbarButtonSeparator {
michael@0 570 float: right;
michael@0 571 }
michael@0 572 .splitToolbarButton:hover > .splitToolbarButtonSeparator,
michael@0 573 .splitToolbarButton.toggled > .splitToolbarButtonSeparator {
michael@0 574 padding: 12px 0;
michael@0 575 margin: 1px 0;
michael@0 576 box-shadow: 0 0 0 1px hsla(0,0%,100%,.03);
michael@0 577 transition-property: padding;
michael@0 578 transition-duration: 10ms;
michael@0 579 transition-timing-function: ease;
michael@0 580 }
michael@0 581
michael@0 582 .toolbarButton,
michael@0 583 .dropdownToolbarButton,
michael@0 584 .overlayButton,
michael@0 585 .secondaryToolbarButton {
michael@0 586 min-width: 16px;
michael@0 587 padding: 2px 6px 0;
michael@0 588 border: 1px solid transparent;
michael@0 589 border-radius: 2px;
michael@0 590 color: hsla(0,0%,100%,.8);
michael@0 591 font-size: 12px;
michael@0 592 line-height: 14px;
michael@0 593 -moz-user-select: none;
michael@0 594 /* Opera does not support user-select, use <... unselectable="on"> instead */
michael@0 595 cursor: default;
michael@0 596 transition-property: background-color, border-color, box-shadow;
michael@0 597 transition-duration: 150ms;
michael@0 598 transition-timing-function: ease;
michael@0 599 }
michael@0 600
michael@0 601 html[dir='ltr'] .toolbarButton,
michael@0 602 html[dir='ltr'] .overlayButton,
michael@0 603 html[dir='ltr'] .dropdownToolbarButton {
michael@0 604 margin: 3px 2px 4px 0;
michael@0 605 }
michael@0 606 html[dir='rtl'] .toolbarButton,
michael@0 607 html[dir='rtl'] .overlayButton,
michael@0 608 html[dir='rtl'] .dropdownToolbarButton {
michael@0 609 margin: 3px 0 4px 2px;
michael@0 610 }
michael@0 611
michael@0 612 .toolbarButton:hover,
michael@0 613 .toolbarButton:focus,
michael@0 614 .dropdownToolbarButton,
michael@0 615 .overlayButton,
michael@0 616 .secondaryToolbarButton:hover,
michael@0 617 .secondaryToolbarButton:focus {
michael@0 618 background-color: hsla(0,0%,0%,.12);
michael@0 619 background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
michael@0 620 background-clip: padding-box;
michael@0 621 border: 1px solid hsla(0,0%,0%,.35);
michael@0 622 border-color: hsla(0,0%,0%,.32) hsla(0,0%,0%,.38) hsla(0,0%,0%,.42);
michael@0 623 box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset,
michael@0 624 0 0 1px hsla(0,0%,100%,.15) inset,
michael@0 625 0 1px 0 hsla(0,0%,100%,.05);
michael@0 626 }
michael@0 627
michael@0 628 .toolbarButton:hover:active,
michael@0 629 .overlayButton:hover:active,
michael@0 630 .dropdownToolbarButton:hover:active,
michael@0 631 .secondaryToolbarButton:hover:active {
michael@0 632 background-color: hsla(0,0%,0%,.2);
michael@0 633 background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
michael@0 634 border-color: hsla(0,0%,0%,.35) hsla(0,0%,0%,.4) hsla(0,0%,0%,.45);
michael@0 635 box-shadow: 0 1px 1px hsla(0,0%,0%,.1) inset,
michael@0 636 0 0 1px hsla(0,0%,0%,.2) inset,
michael@0 637 0 1px 0 hsla(0,0%,100%,.05);
michael@0 638 transition-property: background-color, border-color, box-shadow;
michael@0 639 transition-duration: 10ms;
michael@0 640 transition-timing-function: linear;
michael@0 641 }
michael@0 642
michael@0 643 .toolbarButton.toggled,
michael@0 644 .splitToolbarButton.toggled > .toolbarButton.toggled,
michael@0 645 .secondaryToolbarButton.toggled {
michael@0 646 background-color: hsla(0,0%,0%,.3);
michael@0 647 background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
michael@0 648 border-color: hsla(0,0%,0%,.4) hsla(0,0%,0%,.45) hsla(0,0%,0%,.5);
michael@0 649 box-shadow: 0 1px 1px hsla(0,0%,0%,.1) inset,
michael@0 650 0 0 1px hsla(0,0%,0%,.2) inset,
michael@0 651 0 1px 0 hsla(0,0%,100%,.05);
michael@0 652 transition-property: background-color, border-color, box-shadow;
michael@0 653 transition-duration: 10ms;
michael@0 654 transition-timing-function: linear;
michael@0 655 }
michael@0 656
michael@0 657 .toolbarButton.toggled:hover:active,
michael@0 658 .splitToolbarButton.toggled > .toolbarButton.toggled:hover:active,
michael@0 659 .secondaryToolbarButton.toggled:hover:active {
michael@0 660 background-color: hsla(0,0%,0%,.4);
michael@0 661 border-color: hsla(0,0%,0%,.4) hsla(0,0%,0%,.5) hsla(0,0%,0%,.55);
michael@0 662 box-shadow: 0 1px 1px hsla(0,0%,0%,.2) inset,
michael@0 663 0 0 1px hsla(0,0%,0%,.3) inset,
michael@0 664 0 1px 0 hsla(0,0%,100%,.05);
michael@0 665 }
michael@0 666
michael@0 667 .dropdownToolbarButton {
michael@0 668 width: 120px;
michael@0 669 max-width: 120px;
michael@0 670 padding: 3px 2px 2px;
michael@0 671 overflow: hidden;
michael@0 672 background: url(images/toolbarButton-menuArrows.png) no-repeat;
michael@0 673 }
michael@0 674 html[dir='ltr'] .dropdownToolbarButton {
michael@0 675 background-position: 95%;
michael@0 676 }
michael@0 677 html[dir='rtl'] .dropdownToolbarButton {
michael@0 678 background-position: 5%;
michael@0 679 }
michael@0 680
michael@0 681 .dropdownToolbarButton > select {
michael@0 682 -moz-appearance: none; /* in the future this might matter, see bugzilla bug #649849 */
michael@0 683 min-width: 140px;
michael@0 684 font-size: 12px;
michael@0 685 color: hsl(0,0%,95%);
michael@0 686 margin: 0;
michael@0 687 padding: 0;
michael@0 688 border: none;
michael@0 689 background: rgba(0,0,0,0); /* Opera does not support 'transparent' <select> background */
michael@0 690 }
michael@0 691
michael@0 692 .dropdownToolbarButton > select > option {
michael@0 693 background: hsl(0,0%,24%);
michael@0 694 }
michael@0 695
michael@0 696 .overlayButton {
michael@0 697 margin: 3px 2px 4px 5px !important;
michael@0 698 line-height: 16px;
michael@0 699 padding: 2px 6px 3px 6px;
michael@0 700 }
michael@0 701
michael@0 702 #customScaleOption {
michael@0 703 display: none;
michael@0 704 }
michael@0 705
michael@0 706 #pageWidthOption {
michael@0 707 border-bottom: 1px rgba(255, 255, 255, .5) solid;
michael@0 708 }
michael@0 709
michael@0 710 html[dir='ltr'] .splitToolbarButton:first-child,
michael@0 711 html[dir='ltr'] .toolbarButton:first-child,
michael@0 712 html[dir='rtl'] .splitToolbarButton:last-child,
michael@0 713 html[dir='rtl'] .toolbarButton:last-child {
michael@0 714 margin-left: 4px;
michael@0 715 }
michael@0 716 html[dir='ltr'] .splitToolbarButton:last-child,
michael@0 717 html[dir='ltr'] .toolbarButton:last-child,
michael@0 718 html[dir='rtl'] .splitToolbarButton:first-child,
michael@0 719 html[dir='rtl'] .toolbarButton:first-child {
michael@0 720 margin-right: 4px;
michael@0 721 }
michael@0 722
michael@0 723 .toolbarButtonSpacer {
michael@0 724 width: 30px;
michael@0 725 display: inline-block;
michael@0 726 height: 1px;
michael@0 727 }
michael@0 728
michael@0 729 .toolbarButtonFlexibleSpacer {
michael@0 730 -moz-box-flex: 1;
michael@0 731 min-width: 30px;
michael@0 732 }
michael@0 733
michael@0 734 html[dir='ltr'] #findPrevious {
michael@0 735 margin-left: 3px;
michael@0 736 }
michael@0 737 html[dir='ltr'] #findNext {
michael@0 738 margin-right: 3px;
michael@0 739 }
michael@0 740
michael@0 741 html[dir='rtl'] #findPrevious {
michael@0 742 margin-right: 3px;
michael@0 743 }
michael@0 744 html[dir='rtl'] #findNext {
michael@0 745 margin-left: 3px;
michael@0 746 }
michael@0 747
michael@0 748 .toolbarButton::before,
michael@0 749 .secondaryToolbarButton::before {
michael@0 750 /* All matching images have a size of 16x16
michael@0 751 * All relevant containers have a size of 32x25 */
michael@0 752 position: absolute;
michael@0 753 display: inline-block;
michael@0 754 top: 4px;
michael@0 755 left: 7px;
michael@0 756 }
michael@0 757
michael@0 758 html[dir="ltr"] .secondaryToolbarButton::before {
michael@0 759 left: 4px;
michael@0 760 }
michael@0 761 html[dir="rtl"] .secondaryToolbarButton::before {
michael@0 762 right: 4px;
michael@0 763 }
michael@0 764
michael@0 765 html[dir='ltr'] .toolbarButton#sidebarToggle::before {
michael@0 766 content: url(images/toolbarButton-sidebarToggle.png);
michael@0 767 }
michael@0 768 html[dir='rtl'] .toolbarButton#sidebarToggle::before {
michael@0 769 content: url(images/toolbarButton-sidebarToggle-rtl.png);
michael@0 770 }
michael@0 771
michael@0 772 html[dir='ltr'] .toolbarButton#secondaryToolbarToggle::before {
michael@0 773 content: url(images/toolbarButton-secondaryToolbarToggle.png);
michael@0 774 }
michael@0 775 html[dir='rtl'] .toolbarButton#secondaryToolbarToggle::before {
michael@0 776 content: url(images/toolbarButton-secondaryToolbarToggle-rtl.png);
michael@0 777 }
michael@0 778
michael@0 779 html[dir='ltr'] .toolbarButton.findPrevious::before {
michael@0 780 content: url(images/findbarButton-previous.png);
michael@0 781 }
michael@0 782 html[dir='rtl'] .toolbarButton.findPrevious::before {
michael@0 783 content: url(images/findbarButton-previous-rtl.png);
michael@0 784 }
michael@0 785
michael@0 786 html[dir='ltr'] .toolbarButton.findNext::before {
michael@0 787 content: url(images/findbarButton-next.png);
michael@0 788 }
michael@0 789 html[dir='rtl'] .toolbarButton.findNext::before {
michael@0 790 content: url(images/findbarButton-next-rtl.png);
michael@0 791 }
michael@0 792
michael@0 793 html[dir='ltr'] .toolbarButton.pageUp::before {
michael@0 794 content: url(images/toolbarButton-pageUp.png);
michael@0 795 }
michael@0 796 html[dir='rtl'] .toolbarButton.pageUp::before {
michael@0 797 content: url(images/toolbarButton-pageUp-rtl.png);
michael@0 798 }
michael@0 799
michael@0 800 html[dir='ltr'] .toolbarButton.pageDown::before {
michael@0 801 content: url(images/toolbarButton-pageDown.png);
michael@0 802 }
michael@0 803 html[dir='rtl'] .toolbarButton.pageDown::before {
michael@0 804 content: url(images/toolbarButton-pageDown-rtl.png);
michael@0 805 }
michael@0 806
michael@0 807 .toolbarButton.zoomOut::before {
michael@0 808 content: url(images/toolbarButton-zoomOut.png);
michael@0 809 }
michael@0 810
michael@0 811 .toolbarButton.zoomIn::before {
michael@0 812 content: url(images/toolbarButton-zoomIn.png);
michael@0 813 }
michael@0 814
michael@0 815 .toolbarButton.presentationMode::before,
michael@0 816 .secondaryToolbarButton.presentationMode::before {
michael@0 817 content: url(images/toolbarButton-presentationMode.png);
michael@0 818 }
michael@0 819
michael@0 820 .toolbarButton.print::before,
michael@0 821 .secondaryToolbarButton.print::before {
michael@0 822 content: url(images/toolbarButton-print.png);
michael@0 823 }
michael@0 824
michael@0 825 .toolbarButton.openFile::before,
michael@0 826 .secondaryToolbarButton.openFile::before {
michael@0 827 content: url(images/toolbarButton-openFile.png);
michael@0 828 }
michael@0 829
michael@0 830 .toolbarButton.download::before,
michael@0 831 .secondaryToolbarButton.download::before {
michael@0 832 content: url(images/toolbarButton-download.png);
michael@0 833 }
michael@0 834
michael@0 835 .toolbarButton.bookmark,
michael@0 836 .secondaryToolbarButton.bookmark {
michael@0 837 box-sizing: border-box;
michael@0 838 outline: none;
michael@0 839 padding-top: 4px;
michael@0 840 text-decoration: none;
michael@0 841 }
michael@0 842 .secondaryToolbarButton.bookmark {
michael@0 843 padding-top: 5px;
michael@0 844 }
michael@0 845
michael@0 846 .bookmark[href='#'] {
michael@0 847 opacity: .5;
michael@0 848 pointer-events: none;
michael@0 849 }
michael@0 850
michael@0 851 .toolbarButton.bookmark::before,
michael@0 852 .secondaryToolbarButton.bookmark::before {
michael@0 853 content: url(images/toolbarButton-bookmark.png);
michael@0 854 }
michael@0 855
michael@0 856 #viewThumbnail.toolbarButton::before {
michael@0 857 content: url(images/toolbarButton-viewThumbnail.png);
michael@0 858 }
michael@0 859
michael@0 860 html[dir="ltr"] #viewOutline.toolbarButton::before {
michael@0 861 content: url(images/toolbarButton-viewOutline.png);
michael@0 862 }
michael@0 863 html[dir="rtl"] #viewOutline.toolbarButton::before {
michael@0 864 content: url(images/toolbarButton-viewOutline-rtl.png);
michael@0 865 }
michael@0 866
michael@0 867 #viewAttachments.toolbarButton::before {
michael@0 868 content: url(images/toolbarButton-viewAttachments.png);
michael@0 869 }
michael@0 870
michael@0 871 #viewFind.toolbarButton::before {
michael@0 872 content: url(images/toolbarButton-search.png);
michael@0 873 }
michael@0 874
michael@0 875 .secondaryToolbarButton {
michael@0 876 position: relative;
michael@0 877 margin: 0 0 4px 0;
michael@0 878 padding: 3px 0 1px 0;
michael@0 879 height: auto;
michael@0 880 min-height: 25px;
michael@0 881 width: auto;
michael@0 882 min-width: 100%;
michael@0 883 white-space: normal;
michael@0 884 }
michael@0 885 html[dir="ltr"] .secondaryToolbarButton {
michael@0 886 padding-left: 24px;
michael@0 887 text-align: left;
michael@0 888 }
michael@0 889 html[dir="rtl"] .secondaryToolbarButton {
michael@0 890 padding-right: 24px;
michael@0 891 text-align: right;
michael@0 892 }
michael@0 893 html[dir="ltr"] .secondaryToolbarButton.bookmark {
michael@0 894 padding-left: 27px;
michael@0 895 }
michael@0 896 html[dir="rtl"] .secondaryToolbarButton.bookmark {
michael@0 897 padding-right: 27px;
michael@0 898 }
michael@0 899
michael@0 900 html[dir="ltr"] .secondaryToolbarButton > span {
michael@0 901 padding-right: 4px;
michael@0 902 }
michael@0 903 html[dir="rtl"] .secondaryToolbarButton > span {
michael@0 904 padding-left: 4px;
michael@0 905 }
michael@0 906
michael@0 907 .secondaryToolbarButton.firstPage::before {
michael@0 908 content: url(images/secondaryToolbarButton-firstPage.png);
michael@0 909 }
michael@0 910
michael@0 911 .secondaryToolbarButton.lastPage::before {
michael@0 912 content: url(images/secondaryToolbarButton-lastPage.png);
michael@0 913 }
michael@0 914
michael@0 915 .secondaryToolbarButton.rotateCcw::before {
michael@0 916 content: url(images/secondaryToolbarButton-rotateCcw.png);
michael@0 917 }
michael@0 918
michael@0 919 .secondaryToolbarButton.rotateCw::before {
michael@0 920 content: url(images/secondaryToolbarButton-rotateCw.png);
michael@0 921 }
michael@0 922
michael@0 923 .secondaryToolbarButton.handTool::before {
michael@0 924 content: url(images/secondaryToolbarButton-handTool.png);
michael@0 925 }
michael@0 926
michael@0 927 .secondaryToolbarButton.documentProperties::before {
michael@0 928 content: url(images/secondaryToolbarButton-documentProperties.png);
michael@0 929 }
michael@0 930
michael@0 931 .verticalToolbarSeparator {
michael@0 932 display: block;
michael@0 933 padding: 8px 0;
michael@0 934 margin: 8px 4px;
michael@0 935 width: 1px;
michael@0 936 background-color: hsla(0,0%,0%,.5);
michael@0 937 box-shadow: 0 0 0 1px hsla(0,0%,100%,.08);
michael@0 938 }
michael@0 939 html[dir='ltr'] .verticalToolbarSeparator {
michael@0 940 margin-left: 2px;
michael@0 941 }
michael@0 942 html[dir='rtl'] .verticalToolbarSeparator {
michael@0 943 margin-right: 2px;
michael@0 944 }
michael@0 945
michael@0 946 .horizontalToolbarSeparator {
michael@0 947 display: block;
michael@0 948 margin: 0 0 4px 0;
michael@0 949 height: 1px;
michael@0 950 width: 100%;
michael@0 951 background-color: hsla(0,0%,0%,.5);
michael@0 952 box-shadow: 0 0 0 1px hsla(0,0%,100%,.08);
michael@0 953 }
michael@0 954
michael@0 955 .toolbarField {
michael@0 956 padding: 3px 6px;
michael@0 957 margin: 4px 0 4px 0;
michael@0 958 border: 1px solid transparent;
michael@0 959 border-radius: 2px;
michael@0 960 background-color: hsla(0,0%,100%,.09);
michael@0 961 background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
michael@0 962 background-clip: padding-box;
michael@0 963 border: 1px solid hsla(0,0%,0%,.35);
michael@0 964 border-color: hsla(0,0%,0%,.32) hsla(0,0%,0%,.38) hsla(0,0%,0%,.42);
michael@0 965 box-shadow: 0 1px 0 hsla(0,0%,0%,.05) inset,
michael@0 966 0 1px 0 hsla(0,0%,100%,.05);
michael@0 967 color: hsl(0,0%,95%);
michael@0 968 font-size: 12px;
michael@0 969 line-height: 14px;
michael@0 970 outline-style: none;
michael@0 971 transition-property: background-color, border-color, box-shadow;
michael@0 972 transition-duration: 150ms;
michael@0 973 transition-timing-function: ease;
michael@0 974 }
michael@0 975
michael@0 976 .toolbarField[type=checkbox] {
michael@0 977 display: inline-block;
michael@0 978 margin: 8px 0px;
michael@0 979 }
michael@0 980
michael@0 981 .toolbarField.pageNumber {
michael@0 982 -moz-appearance: textfield; /* hides the spinner in moz */
michael@0 983 min-width: 16px;
michael@0 984 text-align: right;
michael@0 985 width: 40px;
michael@0 986 }
michael@0 987
michael@0 988 .toolbarField:hover {
michael@0 989 background-color: hsla(0,0%,100%,.11);
michael@0 990 border-color: hsla(0,0%,0%,.4) hsla(0,0%,0%,.43) hsla(0,0%,0%,.45);
michael@0 991 }
michael@0 992
michael@0 993 .toolbarField:focus {
michael@0 994 background-color: hsla(0,0%,100%,.15);
michael@0 995 border-color: hsla(204,100%,65%,.8) hsla(204,100%,65%,.85) hsla(204,100%,65%,.9);
michael@0 996 }
michael@0 997
michael@0 998 .toolbarLabel {
michael@0 999 min-width: 16px;
michael@0 1000 padding: 3px 6px 3px 2px;
michael@0 1001 margin: 4px 2px 4px 0;
michael@0 1002 border: 1px solid transparent;
michael@0 1003 border-radius: 2px;
michael@0 1004 color: hsl(0,0%,85%);
michael@0 1005 font-size: 12px;
michael@0 1006 line-height: 14px;
michael@0 1007 text-align: left;
michael@0 1008 -moz-user-select: none;
michael@0 1009 cursor: default;
michael@0 1010 }
michael@0 1011
michael@0 1012 #thumbnailView {
michael@0 1013 position: absolute;
michael@0 1014 width: 120px;
michael@0 1015 top: 0;
michael@0 1016 bottom: 0;
michael@0 1017 padding: 10px 40px 0;
michael@0 1018 overflow: auto;
michael@0 1019 }
michael@0 1020
michael@0 1021 .thumbnail {
michael@0 1022 float: left;
michael@0 1023 margin-bottom: 5px;
michael@0 1024 }
michael@0 1025
michael@0 1026 #thumbnailView > a:last-of-type > .thumbnail {
michael@0 1027 margin-bottom: 10px;
michael@0 1028 }
michael@0 1029
michael@0 1030 .thumbnail:not([data-loaded]) {
michael@0 1031 border: 1px dashed rgba(255, 255, 255, 0.5);
michael@0 1032 margin-bottom: 10px;
michael@0 1033 }
michael@0 1034
michael@0 1035 .thumbnailImage {
michael@0 1036 transition-duration: 150ms;
michael@0 1037 border: 1px solid transparent;
michael@0 1038 box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.3);
michael@0 1039 opacity: 0.8;
michael@0 1040 z-index: 99;
michael@0 1041 }
michael@0 1042
michael@0 1043 .thumbnailSelectionRing {
michael@0 1044 border-radius: 2px;
michael@0 1045 padding: 7px;
michael@0 1046 transition-duration: 150ms;
michael@0 1047 }
michael@0 1048
michael@0 1049 a:focus > .thumbnail > .thumbnailSelectionRing > .thumbnailImage,
michael@0 1050 .thumbnail:hover > .thumbnailSelectionRing > .thumbnailImage {
michael@0 1051 opacity: .9;
michael@0 1052 }
michael@0 1053
michael@0 1054 a:focus > .thumbnail > .thumbnailSelectionRing,
michael@0 1055 .thumbnail:hover > .thumbnailSelectionRing {
michael@0 1056 background-color: hsla(0,0%,100%,.15);
michael@0 1057 background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
michael@0 1058 background-clip: padding-box;
michael@0 1059 box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset,
michael@0 1060 0 0 1px hsla(0,0%,100%,.2) inset,
michael@0 1061 0 0 1px hsla(0,0%,0%,.2);
michael@0 1062 color: hsla(0,0%,100%,.9);
michael@0 1063 }
michael@0 1064
michael@0 1065 .thumbnail.selected > .thumbnailSelectionRing > .thumbnailImage {
michael@0 1066 box-shadow: 0 0 0 1px hsla(0,0%,0%,.5);
michael@0 1067 opacity: 1;
michael@0 1068 }
michael@0 1069
michael@0 1070 .thumbnail.selected > .thumbnailSelectionRing {
michael@0 1071 background-color: hsla(0,0%,100%,.3);
michael@0 1072 background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
michael@0 1073 background-clip: padding-box;
michael@0 1074 box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset,
michael@0 1075 0 0 1px hsla(0,0%,100%,.1) inset,
michael@0 1076 0 0 1px hsla(0,0%,0%,.2);
michael@0 1077 color: hsla(0,0%,100%,1);
michael@0 1078 }
michael@0 1079
michael@0 1080 #outlineView,
michael@0 1081 #attachmentsView {
michael@0 1082 position: absolute;
michael@0 1083 width: 192px;
michael@0 1084 top: 0;
michael@0 1085 bottom: 0;
michael@0 1086 padding: 4px 4px 0;
michael@0 1087 overflow: auto;
michael@0 1088 -moz-user-select: none;
michael@0 1089 }
michael@0 1090
michael@0 1091 html[dir='ltr'] .outlineItem > .outlineItems {
michael@0 1092 margin-left: 20px;
michael@0 1093 }
michael@0 1094
michael@0 1095 html[dir='rtl'] .outlineItem > .outlineItems {
michael@0 1096 margin-right: 20px;
michael@0 1097 }
michael@0 1098
michael@0 1099 .outlineItem > a,
michael@0 1100 .attachmentsItem > a {
michael@0 1101 text-decoration: none;
michael@0 1102 display: inline-block;
michael@0 1103 min-width: 95%;
michael@0 1104 height: auto;
michael@0 1105 margin-bottom: 1px;
michael@0 1106 border-radius: 2px;
michael@0 1107 color: hsla(0,0%,100%,.8);
michael@0 1108 font-size: 13px;
michael@0 1109 line-height: 15px;
michael@0 1110 -moz-user-select: none;
michael@0 1111 white-space: normal;
michael@0 1112 }
michael@0 1113
michael@0 1114 html[dir='ltr'] .outlineItem > a,
michael@0 1115 html[dir='ltr'] .attachmentsItem > a {
michael@0 1116 padding: 2px 0 5px 10px;
michael@0 1117 }
michael@0 1118
michael@0 1119 html[dir='rtl'] .outlineItem > a,
michael@0 1120 html[dir='rtl'] .attachmentsItem > a {
michael@0 1121 padding: 2px 10px 5px 0;
michael@0 1122 }
michael@0 1123
michael@0 1124 .outlineItem > a:hover,
michael@0 1125 .attachmentsItem > a:hover {
michael@0 1126 background-color: hsla(0,0%,100%,.02);
michael@0 1127 background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
michael@0 1128 background-clip: padding-box;
michael@0 1129 box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset,
michael@0 1130 0 0 1px hsla(0,0%,100%,.2) inset,
michael@0 1131 0 0 1px hsla(0,0%,0%,.2);
michael@0 1132 color: hsla(0,0%,100%,.9);
michael@0 1133 }
michael@0 1134
michael@0 1135 .outlineItem.selected {
michael@0 1136 background-color: hsla(0,0%,100%,.08);
michael@0 1137 background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
michael@0 1138 background-clip: padding-box;
michael@0 1139 box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset,
michael@0 1140 0 0 1px hsla(0,0%,100%,.1) inset,
michael@0 1141 0 0 1px hsla(0,0%,0%,.2);
michael@0 1142 color: hsla(0,0%,100%,1);
michael@0 1143 }
michael@0 1144
michael@0 1145 .noResults {
michael@0 1146 font-size: 12px;
michael@0 1147 color: hsla(0,0%,100%,.8);
michael@0 1148 font-style: italic;
michael@0 1149 cursor: default;
michael@0 1150 }
michael@0 1151
michael@0 1152 .canvasWrapper {
michael@0 1153 overflow: hidden;
michael@0 1154 }
michael@0 1155
michael@0 1156 canvas {
michael@0 1157 margin: 0;
michael@0 1158 display: block;
michael@0 1159 }
michael@0 1160
michael@0 1161 .page {
michael@0 1162 direction: ltr;
michael@0 1163 width: 816px;
michael@0 1164 height: 1056px;
michael@0 1165 margin: 1px auto -8px auto;
michael@0 1166 position: relative;
michael@0 1167 overflow: visible;
michael@0 1168 border: 9px solid transparent;
michael@0 1169 background-clip: content-box;
michael@0 1170 border-image: url(images/shadow.png) 9 9 repeat;
michael@0 1171 background-color: white;
michael@0 1172 }
michael@0 1173
michael@0 1174 .annotLink > a:hover {
michael@0 1175 opacity: 0.2;
michael@0 1176 background: #ff0;
michael@0 1177 box-shadow: 0px 2px 10px #ff0;
michael@0 1178 }
michael@0 1179
michael@0 1180 .loadingIcon {
michael@0 1181 position: absolute;
michael@0 1182 display: block;
michael@0 1183 left: 0;
michael@0 1184 top: 0;
michael@0 1185 right: 0;
michael@0 1186 bottom: 0;
michael@0 1187 background: url('images/loading-icon.gif') center no-repeat;
michael@0 1188 }
michael@0 1189
michael@0 1190 .textLayer {
michael@0 1191 position: absolute;
michael@0 1192 left: 0;
michael@0 1193 top: 0;
michael@0 1194 right: 0;
michael@0 1195 bottom: 0;
michael@0 1196 color: #000;
michael@0 1197 font-family: sans-serif;
michael@0 1198 overflow: hidden;
michael@0 1199 }
michael@0 1200
michael@0 1201 .textLayer > div {
michael@0 1202 color: transparent;
michael@0 1203 position: absolute;
michael@0 1204 white-space: pre;
michael@0 1205 cursor: text;
michael@0 1206 }
michael@0 1207
michael@0 1208 .textLayer .highlight {
michael@0 1209 margin: -1px;
michael@0 1210 padding: 1px;
michael@0 1211
michael@0 1212 background-color: rgba(180, 0, 170, 0.2);
michael@0 1213 border-radius: 4px;
michael@0 1214 }
michael@0 1215
michael@0 1216 .textLayer .highlight.begin {
michael@0 1217 border-radius: 4px 0px 0px 4px;
michael@0 1218 }
michael@0 1219
michael@0 1220 .textLayer .highlight.end {
michael@0 1221 border-radius: 0px 4px 4px 0px;
michael@0 1222 }
michael@0 1223
michael@0 1224 .textLayer .highlight.middle {
michael@0 1225 border-radius: 0px;
michael@0 1226 }
michael@0 1227
michael@0 1228 .textLayer .highlight.selected {
michael@0 1229 background-color: rgba(0, 100, 0, 0.2);
michael@0 1230 }
michael@0 1231
michael@0 1232 /* TODO: file FF bug to support ::-moz-selection:window-inactive
michael@0 1233 so we can override the opaque grey background when the window is inactive;
michael@0 1234 see https://bugzilla.mozilla.org/show_bug.cgi?id=706209 */
michael@0 1235 ::selection { background:rgba(0,0,255,0.3); }
michael@0 1236 ::-moz-selection { background:rgba(0,0,255,0.3); }
michael@0 1237
michael@0 1238 .annotationHighlight {
michael@0 1239 position: absolute;
michael@0 1240 border: 2px #FFFF99 solid;
michael@0 1241 }
michael@0 1242
michael@0 1243 .annotText > img {
michael@0 1244 position: absolute;
michael@0 1245 cursor: pointer;
michael@0 1246 }
michael@0 1247
michael@0 1248 .annotTextContentWrapper {
michael@0 1249 position: absolute;
michael@0 1250 width: 20em;
michael@0 1251 }
michael@0 1252
michael@0 1253 .annotTextContent {
michael@0 1254 z-index: 200;
michael@0 1255 float: left;
michael@0 1256 max-width: 20em;
michael@0 1257 background-color: #FFFF99;
michael@0 1258 box-shadow: 0px 2px 5px #333;
michael@0 1259 border-radius: 2px;
michael@0 1260 padding: 0.6em;
michael@0 1261 cursor: pointer;
michael@0 1262 }
michael@0 1263
michael@0 1264 .annotTextContent > h1 {
michael@0 1265 font-size: 1em;
michael@0 1266 border-bottom: 1px solid #000000;
michael@0 1267 padding-bottom: 0.2em;
michael@0 1268 }
michael@0 1269
michael@0 1270 .annotTextContent > p {
michael@0 1271 padding-top: 0.2em;
michael@0 1272 }
michael@0 1273
michael@0 1274 .annotLink > a {
michael@0 1275 position: absolute;
michael@0 1276 font-size: 1em;
michael@0 1277 top: 0;
michael@0 1278 left: 0;
michael@0 1279 width: 100%;
michael@0 1280 height: 100%;
michael@0 1281 }
michael@0 1282
michael@0 1283 #errorWrapper {
michael@0 1284 background: none repeat scroll 0 0 #FF5555;
michael@0 1285 color: white;
michael@0 1286 left: 0;
michael@0 1287 position: absolute;
michael@0 1288 right: 0;
michael@0 1289 z-index: 1000;
michael@0 1290 padding: 3px;
michael@0 1291 font-size: 0.8em;
michael@0 1292 }
michael@0 1293 .loadingInProgress #errorWrapper {
michael@0 1294 top: 39px;
michael@0 1295 }
michael@0 1296
michael@0 1297 #errorMessageLeft {
michael@0 1298 float: left;
michael@0 1299 }
michael@0 1300
michael@0 1301 #errorMessageRight {
michael@0 1302 float: right;
michael@0 1303 }
michael@0 1304
michael@0 1305 #errorMoreInfo {
michael@0 1306 background-color: #FFFFFF;
michael@0 1307 color: black;
michael@0 1308 padding: 3px;
michael@0 1309 margin: 3px;
michael@0 1310 width: 98%;
michael@0 1311 }
michael@0 1312
michael@0 1313 #overlayContainer {
michael@0 1314 display: table;
michael@0 1315 position: absolute;
michael@0 1316 width: 100%;
michael@0 1317 height: 100%;
michael@0 1318 background-color: hsla(0,0%,0%,.2);
michael@0 1319 z-index: 10000;
michael@0 1320 }
michael@0 1321 #overlayContainer > * {
michael@0 1322 overflow: auto;
michael@0 1323 }
michael@0 1324
michael@0 1325 #promptContainer {
michael@0 1326 display: table-cell;
michael@0 1327 vertical-align: middle;
michael@0 1328 text-align: center;
michael@0 1329 }
michael@0 1330
michael@0 1331 #promptContainer > * {
michael@0 1332 display: inline-block;
michael@0 1333 }
michael@0 1334
michael@0 1335 .prompt {
michael@0 1336 display: table;
michael@0 1337 padding: 15px;
michael@0 1338 border-spacing: 4px;
michael@0 1339 color: hsl(0,0%,85%);
michael@0 1340 line-height: 14px;
michael@0 1341 text-align: center;
michael@0 1342 background-color: #474747; /* fallback */
michael@0 1343 background-image: url(images/texture.png),
michael@0 1344 linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95));
michael@0 1345 box-shadow: inset 1px 0 0 hsla(0,0%,100%,.08),
michael@0 1346 inset 0 1px 1px hsla(0,0%,0%,.15),
michael@0 1347 inset 0 -1px 0 hsla(0,0%,100%,.05),
michael@0 1348 0 1px 0 hsla(0,0%,0%,.15),
michael@0 1349 0 1px 1px hsla(0,0%,0%,.1);
michael@0 1350 }
michael@0 1351
michael@0 1352 .prompt > .row {
michael@0 1353 display: table-row;
michael@0 1354 }
michael@0 1355
michael@0 1356 .prompt > .row > * {
michael@0 1357 display: table-cell;
michael@0 1358 }
michael@0 1359
michael@0 1360 .prompt .toolbarField {
michael@0 1361 margin: 5px 0;
michael@0 1362 width: 200px;
michael@0 1363 }
michael@0 1364
michael@0 1365 .prompt .toolbarField:hover,
michael@0 1366 .prompt .toolbarField:focus {
michael@0 1367 border-color: hsla(0,0%,0%,.32) hsla(0,0%,0%,.38) hsla(0,0%,0%,.42);
michael@0 1368 }
michael@0 1369
michael@0 1370 #documentPropertiesContainer {
michael@0 1371 display: table-cell;
michael@0 1372 vertical-align: middle;
michael@0 1373 text-align: center;
michael@0 1374 }
michael@0 1375
michael@0 1376 #documentPropertiesContainer > * {
michael@0 1377 display: inline-block;
michael@0 1378 padding: 15px;
michael@0 1379 border-spacing: 4px;
michael@0 1380 max-width: 350px;
michael@0 1381 max-height: 350px;
michael@0 1382 color: hsl(0,0%,85%);
michael@0 1383 font-size: 12px;
michael@0 1384 line-height: 14px;
michael@0 1385 text-align: left;
michael@0 1386 cursor: default;
michael@0 1387 background-color: #474747; /* fallback */
michael@0 1388 background-image: url(images/texture.png),
michael@0 1389 linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95));
michael@0 1390 box-shadow: inset 1px 0 0 hsla(0,0%,100%,.08),
michael@0 1391 inset 0 1px 1px hsla(0,0%,0%,.15),
michael@0 1392 inset 0 -1px 0 hsla(0,0%,100%,.05),
michael@0 1393 0 1px 0 hsla(0,0%,0%,.15),
michael@0 1394 0 1px 1px hsla(0,0%,0%,.1);
michael@0 1395 }
michael@0 1396
michael@0 1397 #documentPropertiesContainer .separator {
michael@0 1398 display: block;
michael@0 1399 margin: 4px 0 4px 0;
michael@0 1400 height: 1px;
michael@0 1401 width: 100%;
michael@0 1402 background-color: hsla(0,0%,0%,.5);
michael@0 1403 box-shadow: 0 0 0 1px hsla(0,0%,100%,.08);
michael@0 1404 }
michael@0 1405
michael@0 1406 #documentPropertiesContainer .row {
michael@0 1407 display: table-row;
michael@0 1408 }
michael@0 1409
michael@0 1410 html[dir='ltr'] #documentPropertiesContainer .row > * {
michael@0 1411 display: table-cell;
michael@0 1412 min-width: 100px;
michael@0 1413 }
michael@0 1414
michael@0 1415 html[dir='rtl'] #documentPropertiesContainer .row > * {
michael@0 1416 display: table-cell;
michael@0 1417 min-width: 100px;
michael@0 1418 text-align: right;
michael@0 1419 }
michael@0 1420
michael@0 1421 #documentPropertiesContainer .row span {
michael@0 1422 width: 125px;
michael@0 1423 word-wrap: break-word;
michael@0 1424 }
michael@0 1425
michael@0 1426 #documentPropertiesContainer .row p {
michael@0 1427 max-width: 225px;
michael@0 1428 word-wrap: break-word;
michael@0 1429 }
michael@0 1430
michael@0 1431 #documentPropertiesContainer .buttonRow {
michael@0 1432 margin-top: 10px;
michael@0 1433 text-align: center;
michael@0 1434 vertical-align: middle;
michael@0 1435 }
michael@0 1436
michael@0 1437 .clearBoth {
michael@0 1438 clear: both;
michael@0 1439 }
michael@0 1440
michael@0 1441 .fileInput {
michael@0 1442 background: white;
michael@0 1443 color: black;
michael@0 1444 margin-top: 5px;
michael@0 1445 visibility: hidden;
michael@0 1446 position: fixed;
michael@0 1447 right: 0;
michael@0 1448 top: 0;
michael@0 1449 }
michael@0 1450
michael@0 1451 #PDFBug {
michael@0 1452 background: none repeat scroll 0 0 white;
michael@0 1453 border: 1px solid #666666;
michael@0 1454 position: fixed;
michael@0 1455 top: 32px;
michael@0 1456 right: 0;
michael@0 1457 bottom: 0;
michael@0 1458 font-size: 10px;
michael@0 1459 padding: 0;
michael@0 1460 width: 300px;
michael@0 1461 }
michael@0 1462 #PDFBug .controls {
michael@0 1463 background:#EEEEEE;
michael@0 1464 border-bottom: 1px solid #666666;
michael@0 1465 padding: 3px;
michael@0 1466 }
michael@0 1467 #PDFBug .panels {
michael@0 1468 bottom: 0;
michael@0 1469 left: 0;
michael@0 1470 overflow: auto;
michael@0 1471 position: absolute;
michael@0 1472 right: 0;
michael@0 1473 top: 27px;
michael@0 1474 }
michael@0 1475 #PDFBug button.active {
michael@0 1476 font-weight: bold;
michael@0 1477 }
michael@0 1478 .debuggerShowText {
michael@0 1479 background: none repeat scroll 0 0 yellow;
michael@0 1480 color: blue;
michael@0 1481 opacity: 0.3;
michael@0 1482 }
michael@0 1483 .debuggerHideText:hover {
michael@0 1484 background: none repeat scroll 0 0 yellow;
michael@0 1485 opacity: 0.3;
michael@0 1486 }
michael@0 1487 #PDFBug .stats {
michael@0 1488 font-family: courier;
michael@0 1489 font-size: 10px;
michael@0 1490 white-space: pre;
michael@0 1491 }
michael@0 1492 #PDFBug .stats .title {
michael@0 1493 font-weight: bold;
michael@0 1494 }
michael@0 1495 #PDFBug table {
michael@0 1496 font-size: 10px;
michael@0 1497 }
michael@0 1498
michael@0 1499 #viewer.textLayer-visible .textLayer > div,
michael@0 1500 #viewer.textLayer-hover .textLayer > div:hover {
michael@0 1501 background-color: white;
michael@0 1502 color: black;
michael@0 1503 }
michael@0 1504
michael@0 1505 #viewer.textLayer-shadow .textLayer > div {
michael@0 1506 background-color: rgba(255,255,255, .6);
michael@0 1507 color: black;
michael@0 1508 }
michael@0 1509
michael@0 1510 .grab-to-pan-grab {
michael@0 1511 cursor: url("images/grab.cur"), move !important;
michael@0 1512 cursor: grab !important;
michael@0 1513 }
michael@0 1514 .grab-to-pan-grab *:not(input):not(textarea):not(button):not(select):not(:link) {
michael@0 1515 cursor: inherit !important;
michael@0 1516 }
michael@0 1517 .grab-to-pan-grab:active,
michael@0 1518 .grab-to-pan-grabbing {
michael@0 1519 cursor: url("images/grabbing.cur"), move !important;
michael@0 1520 cursor: grabbing !important;
michael@0 1521
michael@0 1522 position: fixed;
michael@0 1523 background: transparent;
michael@0 1524 display: block;
michael@0 1525 top: 0;
michael@0 1526 left: 0;
michael@0 1527 right: 0;
michael@0 1528 bottom: 0;
michael@0 1529 overflow: hidden;
michael@0 1530 z-index: 50000; /* should be higher than anything else in PDF.js! */
michael@0 1531 }
michael@0 1532
michael@0 1533 @page {
michael@0 1534 margin: 0;
michael@0 1535 }
michael@0 1536
michael@0 1537 #printContainer {
michael@0 1538 display: none;
michael@0 1539 }
michael@0 1540
michael@0 1541 @media screen and (min-resolution: 2dppx) {
michael@0 1542 /* Rules for Retina screens */
michael@0 1543 .toolbarButton::before {
michael@0 1544 transform: scale(0.5);
michael@0 1545 top: -5px;
michael@0 1546 }
michael@0 1547
michael@0 1548 .secondaryToolbarButton::before {
michael@0 1549 transform: scale(0.5);
michael@0 1550 top: -4px;
michael@0 1551 }
michael@0 1552
michael@0 1553 html[dir='ltr'] .toolbarButton::before,
michael@0 1554 html[dir='rtl'] .toolbarButton::before {
michael@0 1555 left: -1px;
michael@0 1556 }
michael@0 1557
michael@0 1558 html[dir='ltr'] .secondaryToolbarButton::before {
michael@0 1559 left: -2px;
michael@0 1560 }
michael@0 1561 html[dir='rtl'] .secondaryToolbarButton::before {
michael@0 1562 left: 186px;
michael@0 1563 }
michael@0 1564
michael@0 1565 .dropdownToolbarButton {
michael@0 1566 background: url(images/toolbarButton-menuArrows@2x.png) no-repeat;
michael@0 1567 background-size: 7px 16px;
michael@0 1568 }
michael@0 1569
michael@0 1570 html[dir='ltr'] .toolbarButton#sidebarToggle::before {
michael@0 1571 content: url(images/toolbarButton-sidebarToggle@2x.png);
michael@0 1572 }
michael@0 1573 html[dir='rtl'] .toolbarButton#sidebarToggle::before {
michael@0 1574 content: url(images/toolbarButton-sidebarToggle-rtl@2x.png);
michael@0 1575 }
michael@0 1576
michael@0 1577 html[dir='ltr'] .toolbarButton#secondaryToolbarToggle::before {
michael@0 1578 content: url(images/toolbarButton-secondaryToolbarToggle@2x.png);
michael@0 1579 }
michael@0 1580 html[dir='rtl'] .toolbarButton#secondaryToolbarToggle::before {
michael@0 1581 content: url(images/toolbarButton-secondaryToolbarToggle-rtl@2x.png);
michael@0 1582 }
michael@0 1583
michael@0 1584 html[dir='ltr'] .toolbarButton.findPrevious::before {
michael@0 1585 content: url(images/findbarButton-previous@2x.png);
michael@0 1586 }
michael@0 1587 html[dir='rtl'] .toolbarButton.findPrevious::before {
michael@0 1588 content: url(images/findbarButton-previous-rtl@2x.png);
michael@0 1589 }
michael@0 1590
michael@0 1591 html[dir='ltr'] .toolbarButton.findNext::before {
michael@0 1592 content: url(images/findbarButton-next@2x.png);
michael@0 1593 }
michael@0 1594 html[dir='rtl'] .toolbarButton.findNext::before {
michael@0 1595 content: url(images/findbarButton-next-rtl@2x.png);
michael@0 1596 }
michael@0 1597
michael@0 1598 html[dir='ltr'] .toolbarButton.pageUp::before {
michael@0 1599 content: url(images/toolbarButton-pageUp@2x.png);
michael@0 1600 }
michael@0 1601 html[dir='rtl'] .toolbarButton.pageUp::before {
michael@0 1602 content: url(images/toolbarButton-pageUp-rtl@2x.png);
michael@0 1603 }
michael@0 1604
michael@0 1605 html[dir='ltr'] .toolbarButton.pageDown::before {
michael@0 1606 content: url(images/toolbarButton-pageDown@2x.png);
michael@0 1607 }
michael@0 1608 html[dir='rtl'] .toolbarButton.pageDown::before {
michael@0 1609 content: url(images/toolbarButton-pageDown-rtl@2x.png);
michael@0 1610 }
michael@0 1611
michael@0 1612 .toolbarButton.zoomIn::before {
michael@0 1613 content: url(images/toolbarButton-zoomIn@2x.png);
michael@0 1614 }
michael@0 1615
michael@0 1616 .toolbarButton.zoomOut::before {
michael@0 1617 content: url(images/toolbarButton-zoomOut@2x.png);
michael@0 1618 }
michael@0 1619
michael@0 1620 .toolbarButton.presentationMode::before,
michael@0 1621 .secondaryToolbarButton.presentationMode::before {
michael@0 1622 content: url(images/toolbarButton-presentationMode@2x.png);
michael@0 1623 }
michael@0 1624
michael@0 1625 .toolbarButton.print::before,
michael@0 1626 .secondaryToolbarButton.print::before {
michael@0 1627 content: url(images/toolbarButton-print@2x.png);
michael@0 1628 }
michael@0 1629
michael@0 1630 .toolbarButton.openFile::before,
michael@0 1631 .secondaryToolbarButton.openFile::before {
michael@0 1632 content: url(images/toolbarButton-openFile@2x.png);
michael@0 1633 }
michael@0 1634
michael@0 1635 .toolbarButton.download::before,
michael@0 1636 .secondaryToolbarButton.download::before {
michael@0 1637 content: url(images/toolbarButton-download@2x.png);
michael@0 1638 }
michael@0 1639
michael@0 1640 .toolbarButton.bookmark::before,
michael@0 1641 .secondaryToolbarButton.bookmark::before {
michael@0 1642 content: url(images/toolbarButton-bookmark@2x.png);
michael@0 1643 }
michael@0 1644
michael@0 1645 #viewThumbnail.toolbarButton::before {
michael@0 1646 content: url(images/toolbarButton-viewThumbnail@2x.png);
michael@0 1647 }
michael@0 1648
michael@0 1649 html[dir="ltr"] #viewOutline.toolbarButton::before {
michael@0 1650 content: url(images/toolbarButton-viewOutline@2x.png);
michael@0 1651 }
michael@0 1652 html[dir="rtl"] #viewOutline.toolbarButton::before {
michael@0 1653 content: url(images/toolbarButton-viewOutline-rtl@2x.png);
michael@0 1654 }
michael@0 1655
michael@0 1656 #viewAttachments.toolbarButton::before {
michael@0 1657 content: url(images/toolbarButton-viewAttachments@2x.png);
michael@0 1658 }
michael@0 1659
michael@0 1660 #viewFind.toolbarButton::before {
michael@0 1661 content: url(images/toolbarButton-search@2x.png);
michael@0 1662 }
michael@0 1663
michael@0 1664 .secondaryToolbarButton.firstPage::before {
michael@0 1665 content: url(images/secondaryToolbarButton-firstPage@2x.png);
michael@0 1666 }
michael@0 1667
michael@0 1668 .secondaryToolbarButton.lastPage::before {
michael@0 1669 content: url(images/secondaryToolbarButton-lastPage@2x.png);
michael@0 1670 }
michael@0 1671
michael@0 1672 .secondaryToolbarButton.rotateCcw::before {
michael@0 1673 content: url(images/secondaryToolbarButton-rotateCcw@2x.png);
michael@0 1674 }
michael@0 1675
michael@0 1676 .secondaryToolbarButton.rotateCw::before {
michael@0 1677 content: url(images/secondaryToolbarButton-rotateCw@2x.png);
michael@0 1678 }
michael@0 1679
michael@0 1680 .secondaryToolbarButton.handTool::before {
michael@0 1681 content: url(images/secondaryToolbarButton-handTool@2x.png);
michael@0 1682 }
michael@0 1683
michael@0 1684 .secondaryToolbarButton.documentProperties::before {
michael@0 1685 content: url(images/secondaryToolbarButton-documentProperties@2x.png);
michael@0 1686 }
michael@0 1687 }
michael@0 1688
michael@0 1689 @media print {
michael@0 1690 /* General rules for printing. */
michael@0 1691 body {
michael@0 1692 background: transparent none;
michael@0 1693 }
michael@0 1694
michael@0 1695 /* Rules for browsers that don't support mozPrintCallback. */
michael@0 1696 #sidebarContainer, #secondaryToolbar, .toolbar, #loadingBox, #errorWrapper, .textLayer {
michael@0 1697 display: none;
michael@0 1698 }
michael@0 1699 #viewerContainer {
michael@0 1700 overflow: visible;
michael@0 1701 }
michael@0 1702
michael@0 1703 #mainContainer, #viewerContainer, .page, .page canvas {
michael@0 1704 position: static;
michael@0 1705 padding: 0;
michael@0 1706 margin: 0;
michael@0 1707 }
michael@0 1708
michael@0 1709 .page {
michael@0 1710 float: left;
michael@0 1711 display: none;
michael@0 1712 border: none;
michael@0 1713 box-shadow: none;
michael@0 1714 }
michael@0 1715
michael@0 1716 .page[data-loaded] {
michael@0 1717 display: block;
michael@0 1718 }
michael@0 1719
michael@0 1720 .fileInput {
michael@0 1721 display: none;
michael@0 1722 }
michael@0 1723
michael@0 1724 /* Rules for browsers that support mozPrintCallback */
michael@0 1725 body[data-mozPrintCallback] #outerContainer {
michael@0 1726 display: none;
michael@0 1727 }
michael@0 1728 body[data-mozPrintCallback] #printContainer {
michael@0 1729 display: block;
michael@0 1730 }
michael@0 1731 #printContainer canvas {
michael@0 1732 position: relative;
michael@0 1733 top: 0;
michael@0 1734 left: 0;
michael@0 1735 }
michael@0 1736 }
michael@0 1737
michael@0 1738 .visibleLargeView,
michael@0 1739 .visibleMediumView,
michael@0 1740 .visibleSmallView {
michael@0 1741 display: none;
michael@0 1742 }
michael@0 1743
michael@0 1744 @media all and (max-width: 960px) {
michael@0 1745 html[dir='ltr'] #outerContainer.sidebarMoving .outerCenter,
michael@0 1746 html[dir='ltr'] #outerContainer.sidebarOpen .outerCenter {
michael@0 1747 float: left;
michael@0 1748 left: 205px;
michael@0 1749 }
michael@0 1750 html[dir='rtl'] #outerContainer.sidebarMoving .outerCenter,
michael@0 1751 html[dir='rtl'] #outerContainer.sidebarOpen .outerCenter {
michael@0 1752 float: right;
michael@0 1753 right: 205px;
michael@0 1754 }
michael@0 1755 }
michael@0 1756
michael@0 1757 @media all and (max-width: 900px) {
michael@0 1758 .sidebarOpen .hiddenLargeView {
michael@0 1759 display: none;
michael@0 1760 }
michael@0 1761 .sidebarOpen .visibleLargeView {
michael@0 1762 display: inherit;
michael@0 1763 }
michael@0 1764 }
michael@0 1765
michael@0 1766 @media all and (max-width: 860px) {
michael@0 1767 .sidebarOpen .hiddenMediumView {
michael@0 1768 display: none;
michael@0 1769 }
michael@0 1770 .sidebarOpen .visibleMediumView {
michael@0 1771 display: inherit;
michael@0 1772 }
michael@0 1773 }
michael@0 1774
michael@0 1775 @media all and (max-width: 770px) {
michael@0 1776 #sidebarContainer {
michael@0 1777 top: 32px;
michael@0 1778 z-index: 100;
michael@0 1779 }
michael@0 1780 .loadingInProgress #sidebarContainer {
michael@0 1781 top: 39px;
michael@0 1782 }
michael@0 1783 #sidebarContent {
michael@0 1784 top: 32px;
michael@0 1785 background-color: hsla(0,0%,0%,.7);
michael@0 1786 }
michael@0 1787
michael@0 1788 html[dir='ltr'] #outerContainer.sidebarOpen > #mainContainer {
michael@0 1789 left: 0px;
michael@0 1790 }
michael@0 1791 html[dir='rtl'] #outerContainer.sidebarOpen > #mainContainer {
michael@0 1792 right: 0px;
michael@0 1793 }
michael@0 1794
michael@0 1795 html[dir='ltr'] .outerCenter {
michael@0 1796 float: left;
michael@0 1797 left: 205px;
michael@0 1798 }
michael@0 1799 html[dir='rtl'] .outerCenter {
michael@0 1800 float: right;
michael@0 1801 right: 205px;
michael@0 1802 }
michael@0 1803
michael@0 1804 #outerContainer .hiddenLargeView,
michael@0 1805 #outerContainer .hiddenMediumView {
michael@0 1806 display: inherit;
michael@0 1807 }
michael@0 1808 #outerContainer .visibleLargeView,
michael@0 1809 #outerContainer .visibleMediumView {
michael@0 1810 display: none;
michael@0 1811 }
michael@0 1812 }
michael@0 1813
michael@0 1814 @media all and (max-width: 700px) {
michael@0 1815 #outerContainer .hiddenLargeView {
michael@0 1816 display: none;
michael@0 1817 }
michael@0 1818 #outerContainer .visibleLargeView {
michael@0 1819 display: inherit;
michael@0 1820 }
michael@0 1821 }
michael@0 1822
michael@0 1823 @media all and (max-width: 660px) {
michael@0 1824 #outerContainer .hiddenMediumView {
michael@0 1825 display: none;
michael@0 1826 }
michael@0 1827 #outerContainer .visibleMediumView {
michael@0 1828 display: inherit;
michael@0 1829 }
michael@0 1830 }
michael@0 1831
michael@0 1832 @media all and (max-width: 600px) {
michael@0 1833 .hiddenSmallView {
michael@0 1834 display: none;
michael@0 1835 }
michael@0 1836 .visibleSmallView {
michael@0 1837 display: inherit;
michael@0 1838 }
michael@0 1839 html[dir='ltr'] #outerContainer.sidebarMoving .outerCenter,
michael@0 1840 html[dir='ltr'] #outerContainer.sidebarOpen .outerCenter,
michael@0 1841 html[dir='ltr'] .outerCenter {
michael@0 1842 left: 156px;
michael@0 1843 }
michael@0 1844 html[dir='rtl'] #outerContainer.sidebarMoving .outerCenter,
michael@0 1845 html[dir='rtl'] #outerContainer.sidebarOpen .outerCenter,
michael@0 1846 html[dir='rtl'] .outerCenter {
michael@0 1847 right: 156px;
michael@0 1848 }
michael@0 1849 .toolbarButtonSpacer {
michael@0 1850 width: 0;
michael@0 1851 }
michael@0 1852 }
michael@0 1853
michael@0 1854 @media all and (max-width: 510px) {
michael@0 1855 #scaleSelectContainer, #pageNumberLabel {
michael@0 1856 display: none;
michael@0 1857 }
michael@0 1858 }
michael@0 1859

mercurial