Home | History | Annotate | Download | only in ntp4 
      1 /* Copyright (c) 2012 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 html {
      6   background-attachment: fixed;
      7   background-color: $2;  /* COLOR_NTP_BACKGROUND */
      8   background-image: url(chrome://theme/IDR_THEME_NTP_BACKGROUND?$1);
      9   background-position: $3;
     10   background-repeat: $5;
     11 }
     12 
     13 #attribution-img {
     14   content: url(chrome://theme/IDR_THEME_NTP_ATTRIBUTION?$1);
     15 }
     16 
     17 html[bookmarkbarattached='true'] {
     18   background-position: $4;
     19 }
     20 
     21 body {
     22   color: $8;  /* COLOR_NTP_TEXT */
     23   height: 100%;
     24   overflow: auto;
     25 }
     26 
     27 #attribution,
     28 .link-button,
     29 .link-span {
     30   color: $21;  /* COLOR_NTP_TEXT_LIGHT */
     31 }
     32 
     33 .link-button:active {
     34   color: $8;  /* COLOR_NTP_TEXT */
     35 }
     36 
     37 .page-switcher {
     38   color: rgba($23, 0.5);  /* COLOR_NTP_TEXT */
     39 }
     40 
     41 .page-switcher:hover,
     42 .page-switcher:focus,
     43 .page-switcher.drag-target {
     44   background-color: rgba($23, 0.06);  /* COLOR_NTP_TEXT */
     45 }
     46 
     47 /* Only change the background to a gradient when a promo is showing. */
     48 .showing-login-area #page-switcher-end:hover,
     49 .showing-login-area #page-switcher-end:focus,
     50 .showing-login-area #page-switcher-end.drag-target {
     51   background:
     52       -webkit-linear-gradient(top, rgba($23, 0) 0,
     53                                    rgba($23, .01) 60px,
     54                                    rgba($23, .06) 183px);  /* COLOR_NTP_TEXT */
     55 }
     56 
     57 .tile-page-scrollbar {
     58   background-color: $21;  /* COLOR_NTP_TEXT_LIGHT */
     59 }
     60 
     61 /* Footer *********************************************************************/
     62 
     63 #footer-border {
     64   background: -webkit-linear-gradient(left,
     65       rgba($22, 0.2),  /* COLOR_NTP_SECTION_BORDER */
     66       rgba($22, 0.3) 20%,  /* COLOR_NTP_SECTION_BORDER */
     67       rgba($22, 0.3) 80%,  /* COLOR_NTP_SECTION_BORDER */
     68       rgba($22, 0.2));  /* COLOR_NTP_SECTION_BORDER */
     69 }
     70 
     71 .dot input:focus {
     72   background-color: $2;  /* COLOR_NTP_BACKGROUND */
     73 }
     74 
     75 .bare-minimum #footer {
     76   color: $8;  /* COLOR_NTP_TEXT */
     77 }
     78 
     79 .bare-minimum .disclosure-triangle {
     80   background-color: $8;  /* COLOR_NTP_TEXT */
     81 }
     82 
     83 .bare-minimum .footer-menu-button:hover,
     84 .bare-minimum .footer-menu-button[menu-shown],
     85 .bare-minimum #chrome-web-store-link:hover {
     86   color: rgba($23, 0.85);  /* COLOR_NTP_TEXT */
     87 }
     88 
     89 .bare-minimum .footer-menu-button:hover .disclosure-triangle,
     90 .bare-minimum .footer-menu-button[menu-shown] .disclosure-triangle {
     91   background-color: rgba($23, 0.85);  /* COLOR_NTP_TEXT */
     92 }
     93 
     94 /* Most Visited ***************************************************************/
     95 
     96 .most-visited,
     97 .most-visited > .title {
     98   color: $8;  /* COLOR_NTP_TEXT */
     99 }
    100 
    101 .most-visited:focus:not(.filler) .thumbnail-wrapper,
    102 .most-visited:hover:not(.filler) .thumbnail-wrapper {
    103   background-color: $6;  /* COLOR_NTP_HEADER */
    104 }
    105 
    106 .thumbnail-wrapper {
    107   /* This shows through at the (rounded) thumbnail's corners. */
    108   background-color: $11;  /* COLOR_NTP_SECTION_BORDER */
    109 }
    110 
    111 .filler .thumbnail {
    112   border-color: $2;  /* COLOR_NTP_BACKGROUND */
    113 }
    114