| Index: components/dom_distiller/core/css/distilledpageprintpreview.css
|
| diff --git a/components/dom_distiller/core/css/distilledpageprintpreview.css b/components/dom_distiller/core/css/distilledpageprintpreview.css
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..8df30ce076c4c9bb29d3439bb150be3d6169e0de
|
| --- /dev/null
|
| +++ b/components/dom_distiller/core/css/distilledpageprintpreview.css
|
| @@ -0,0 +1,315 @@
|
| +/* Copyright 2014 The Chromium Authors. All rights reserved.
|
| + * Use of this source code is governed by a BSD-style license that can be
|
| + * found in the LICENSE file. */
|
| +
|
| +/* Set the global 'box-sizing' state to 'border-box'.
|
| + * *::after and *::before used to select pseudo-elements not selectable by *. */
|
| +
|
| +*,
|
| +*::after,
|
| +*::before {
|
| + box-sizing: border-box;
|
| +}
|
| +
|
| +/* Remove all margins and padding from certain element and add word wrap. */
|
| +
|
| +blockquote,
|
| +body,
|
| +caption,
|
| +dd,
|
| +dl,
|
| +fieldset,
|
| +figure,
|
| +form,
|
| +h1,
|
| +h2,
|
| +h3,
|
| +h4,
|
| +h5,
|
| +h6,
|
| +hr,
|
| +legend,
|
| +ol,
|
| +p,
|
| +pre,
|
| +ul,
|
| +table,
|
| +td,
|
| +th {
|
| + margin: 0;
|
| + padding: 0;
|
| + word-wrap: break-word;
|
| +}
|
| +
|
| +/* Prevent 'sub' and 'sup' affecting 'line-height'. */
|
| +
|
| +sub,
|
| +sup {
|
| + font-size: 75%;
|
| + line-height: 0;
|
| + position: relative;
|
| + vertical-align: baseline;
|
| +}
|
| +
|
| +sup {
|
| + top: -0.5em;
|
| +}
|
| +
|
| +sub {
|
| + bottom: -0.25em;
|
| +}
|
| +
|
| +/* Remove most spacing between table cells. */
|
| +
|
| +table {
|
| + border-collapse: collapse;
|
| + border-spacing: 0;
|
| +}
|
| +
|
| +td,
|
| +th {
|
| + padding: 0;
|
| +}
|
| +
|
| +/* Base typography. */
|
| +
|
| +body,
|
| +html {
|
| + font-size: 14px;
|
| + line-height: 1.4;
|
| + text-rendering: optimizeLegibility;
|
| + overflow-x: hidden;
|
| + -webkit-overflow-scrolling: touch;
|
| +}
|
| +
|
| +/* Classes for light, dark and sepia themes.
|
| + * Must agree with classes returned by useTheme() in dom_distiller_viewer.js
|
| + * and with CSS class constants in viewer.cc */
|
| +
|
| +.light {
|
| + color: #333;
|
| + background-color: #FFF;
|
| +}
|
| +
|
| +.dark {
|
| + color: #FFF;
|
| + background-color: #000;
|
| +}
|
| +
|
| +.sepia {
|
| + color: #000;
|
| + background-color: rgb(203, 173, 141);
|
| +}
|
| +
|
| +.serif {
|
| + font-family: serif;
|
| +}
|
| +
|
| +.sans-serif {
|
| + font-family: 'Open Sans', sans-serif;
|
| +}
|
| +
|
| +.monospace {
|
| + font-family: monospace;
|
| +}
|
| +
|
| +/* Define vertical rhythm (baseline grid of 4px). */
|
| +
|
| +blockquote,
|
| +caption,
|
| +code,
|
| +dd,
|
| +dl,
|
| +fieldset,
|
| +figure,
|
| +form,
|
| +hr,
|
| +legend,
|
| +ol,
|
| +p,
|
| +pre,
|
| +q,
|
| +table,
|
| +td,
|
| +th,
|
| +ul {
|
| + margin-bottom: 1rem;
|
| +}
|
| +
|
| +h2,
|
| +h3,
|
| +h4,
|
| +h5,
|
| +h6 {
|
| + line-height: 1.296;
|
| + margin-bottom: 0.444rem;
|
| +}
|
| +
|
| +/* Content. */
|
| +
|
| +#content {
|
| + margin: 0.2rem;
|
| +}
|
| +
|
| +/* Main margins. */
|
| +
|
| +body {
|
| + max-width: 800px;
|
| + margin: 0px;
|
| +}
|
| +
|
| +#mainContent {
|
| + margin: auto 0px;
|
| +}
|
| +
|
| +#articleHeader {
|
| + background-color: rgb(73, 73, 73);
|
| + color: white;
|
| + min-height: 90px;
|
| + width: 100%;
|
| +}
|
| +
|
| +#titleCollapse {
|
| + display: block;
|
| + overflow: hidden;
|
| +}
|
| +
|
| +#titleCollapse .verticalCenterOuter {
|
| + min-height: 90px;
|
| +}
|
| +
|
| +#titleHolder {
|
| + padding: 10px 30px;
|
| +}
|
| +
|
| +.verticalCenterOuter {
|
| + display: table;
|
| + height: 100%;
|
| +}
|
| +
|
| +.verticalCenterInner {
|
| + display: table-cell;
|
| + vertical-align: middle;
|
| +}
|
| +
|
| +/* Link colors for light, dark and sepia themes */
|
| +
|
| +a:link {
|
| + color: #55F;
|
| +}
|
| +
|
| +a:visited {
|
| + color: #902290;
|
| +}
|
| +
|
| +blockquote {
|
| + border-left: 4px solid #eee;
|
| + padding-left: 1em;
|
| +}
|
| +
|
| +cite {
|
| + color: rgba(0, 0, 0, .54);
|
| + font-style: italic;
|
| +}
|
| +
|
| +hr {
|
| + background-color: #e4dfdf;
|
| + border: none;
|
| + height: 1px;
|
| + margin: inherit auto;
|
| + width: 75%;
|
| +}
|
| +
|
| +h1 {
|
| + font-size: 1.7rem;
|
| + line-height: 1.296;
|
| + margin-bottom: 0.444rem;
|
| +}
|
| +
|
| +q {
|
| + color: #222;
|
| + display:block;
|
| + font-size: 1.5rem;
|
| + font-style: italic;
|
| + font-weight: 600;
|
| + line-height: 1.444;
|
| +}
|
| +
|
| +embed,
|
| +img,
|
| +object,
|
| +video {
|
| + max-width: 100%;
|
| +}
|
| +
|
| +img {
|
| + display: block;
|
| + height: auto;
|
| + margin: 0 auto 0.6rem auto;
|
| +}
|
| +
|
| +/* TODO(nyquist): set these classes directly in the dom distiller. */
|
| +
|
| +embed+[class*='caption'],
|
| +figcaption,
|
| +img+[class*='caption'],
|
| +object+[class*='caption'],
|
| +video+[class*='caption'] {
|
| + color: rgba(0,0,0,.54);
|
| + display: table;
|
| + font-style: italic;
|
| + margin: 0 auto;
|
| +}
|
| +
|
| +ol,
|
| +ul {
|
| + margin-left: 1.296rem;
|
| +}
|
| +
|
| +.light code,
|
| +.light pre,
|
| +.sepia code,
|
| +.sepia pre {
|
| + background-color: #f8f8f8;
|
| + border: 1px solid #eee;
|
| + border-radius: 2px;
|
| +}
|
| +
|
| +.dark code,
|
| +.dark pre {
|
| + background-color: #333;
|
| + border: 1px solid #555;
|
| + border-radius: 2px;
|
| +}
|
| +
|
| +pre code {
|
| + border: none;
|
| + padding: 0;
|
| +}
|
| +
|
| +pre {
|
| + line-height: 1.296;
|
| + overflow-x: scroll;
|
| + padding: .5em;
|
| +}
|
| +
|
| +.hidden {
|
| + display: none;
|
| +}
|
| +
|
| +/* Iframe sizing. */
|
| +.youtubeContainer {
|
| + height: 0px;
|
| + /* This is the perecnt height of a standard HD video. */
|
| + padding-bottom: 56.25%;
|
| + position: relative;
|
| + width: 100%;
|
| +}
|
| +
|
| +.youtubeIframe {
|
| + height: 100%;
|
| + left: 0px;
|
| + position: absolute;
|
| + top: 0px;
|
| + width: 100%;
|
| +}
|
|
|