chrome/browser/resources/local_ntp/local_ntp_design.js

   1 // Copyright 2014 The Chromium Authors. All rights reserved.
   2 // Use of this source code is governed by a BSD-style license that can be
   3 // found in the LICENSE file.
   4
   5
   6 /**
   7  * @fileoverview Specifications for NTP design.
   8  */
   9
  10  var THUMBNAIL_FALLBACK = {
  11    DOT: 'dot'  // Draw single dot.
  12  };
  13
  14 /**
  15  * Specifications for an NTP design (not comprehensive).
  16  *
  17  * fontFamily: Font family to use for title and thumbnail iframes.
  18  * fontSize: Font size to use for the iframes, in px.
  19  * tileWidth: The width of each suggestion tile, in px.
  20  * tileMargin: Spacing between successive tiles, in px.
  21  * titleColor: The 4-component color of title text.
  22  * titleColorAgainstDark: The 4-component color of title text against a dark
  23  *   theme.
  24  * titleTextAlign: (Optional) The alignment of title text. If unspecified, the
  25  *   default value is 'center'.
  26  * titleTextFade: (Optional) The number of pixels beyond which title
  27  *   text begins to fade. This overrides the default ellipsis style.
  28  * thumbnailTextColor: The 4-component color that thumbnail iframe may use to
  29  *   display text message in place of missing thumbnail.
  30  * thumbnailFallback: (Optional) A value in THUMBNAIL_FALLBACK to specify the
  31  *   thumbnail fallback strategy. If unassigned, then the thumbnail.html
  32  *   iframe would handle the fallback.
  33  *
  34  * @const {{
  35  *   fontFamily: string,
  36  *   fontSize: number,
  37  *   tileWidth: number,
  38  *   tileMargin: number,
  39  *   titleColor: string,
  40  *   titleColorAgainstDark: string,
  41  *   titleTextAlign: string|null|undefined,
  42  *   TODO(huangs): Clean-up certain parameters once previous design is no longer
  43  *       used on server.
  44  *   titleTextFade: number|null|undefined,
  45  *   thumbnailTextColor: string,
  46  *   thumbnailFallback: string|null|undefined
  47  * }}
  48  */
  49 var NTP_DESIGN = {
  50   fontFamily: 'arial, sans-serif',
  51   fontSize: 12,
  52   tileWidth: 156,
  53   tileMargin: 16,
  54   titleColor: [50, 50, 50, 255],
  55   titleColorAgainstDark: [210, 210, 210, 255],
  56   titleTextAlign: 'inherit',
  57   titleTextFade: 122 - 36,  // 112px wide title with 32 pixel fade at end.
  58   thumbnailTextColor: [50, 50, 50, 255],
  59   thumbnailFallback: THUMBNAIL_FALLBACK.DOT
  60 };