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 .app {
      6   outline: none;
      7   position: absolute;
      8   text-align: center;
      9 }
     10 
     11 .app-contents {
     12   -webkit-transition: -webkit-transform 100ms;
     13 }
     14 
     15 .app-contents:active:not(.suppress-active),
     16 .app:not(.click-focus):focus .app-contents:not(.suppress-active),
     17 .drag-representation:not(.placing) .app-contents {
     18   -webkit-transform: scale(1.1);
     19 }
     20 
     21 /* Don't animate the initial scaling.  */
     22 .app-contents:active:not(.suppress-active),
     23 /* Active gets applied right before .suppress-active, so to avoid flicker
     24  * we need to make the scale go back to normal without an animation. */
     25 .app-contents.suppress-active {
     26   -webkit-transition-duration: 0;
     27 }
     28 
     29 .app-contents > span {
     30   display: block;
     31   overflow: hidden;
     32   text-overflow: ellipsis;
     33   white-space: nowrap;
     34 }
     35 
     36 .app-img-container {
     37   /* -webkit-mask-image set by JavaScript to the image source. */
     38   -webkit-mask-size: 100% 100%;
     39   margin-left: auto;
     40   margin-right: auto;
     41 }
     42 
     43 .app-img-container > * {
     44   height: 100%;
     45   width: 100%;
     46 }
     47 
     48 .app-icon-div {
     49   -webkit-box-align: center;
     50   -webkit-box-pack: center;
     51   background-color: white;
     52   border: 1px solid #d5d5d5;
     53   border-radius: 5px;
     54   display: -webkit-box;
     55   margin-left: auto;
     56   margin-right: auto;
     57   position: relative;
     58   vertical-align: middle;
     59   z-index: 0;
     60 }
     61 
     62 .app-icon-div .app-img-container {
     63   bottom: 10px;
     64   left: 10px;
     65   position: absolute;
     66 }
     67 
     68 .app-icon-div .color-stripe {
     69   border-bottom-left-radius: 5px 5px;
     70   border-bottom-right-radius: 5px 5px;
     71   bottom: 0;
     72   height: 3px;
     73   opacity: 1.0;
     74   position: absolute;
     75   width: 100%;
     76   z-index: 100;
     77 }
     78 
     79 .app-context-menu > button:first-child {
     80   font-weight: bold;
     81 }
     82 
     83 .app-context-menu {
     84   z-index: 1000;
     85 }
     86 
     87 .app-context-menu > [checked]::before {
     88   height: 5px;
     89 }
     90 
     91 .launch-click-target {
     92   cursor: pointer;
     93 }
     94 
     95 .app-img-container > img:first-child {
     96   display: block;
     97 }
     98 
     99 .app .invisible {
    100   visibility: hidden;
    101 }
    102 
    103 #app-launcher-promo {
    104   background-color: white;
    105   border: 1px solid lightgray;
    106   border-bottom-width: 3px;
    107   border-radius: 2px;
    108   border-top-width: 2px;
    109   bottom: 90px;
    110   font-family: Arial, Helvetica, sans-serif;
    111   height: 120px;
    112   left: 50%;
    113   margin-left: -300px;
    114   position: fixed;
    115   width: 600px;
    116 }
    117 
    118 #app-launcher-promo > .close-button {
    119   position: absolute;
    120   right: 10px;
    121   top: 10px;
    122   width: 14px;
    123 }
    124 
    125 .apps-promo-text {
    126   color: #222;
    127   font-size: 16px;
    128   left: 30px;
    129   line-height: 24px;
    130   position: absolute;
    131   top: 30px;
    132 }
    133 
    134 .apps-promo-learn-more {
    135   background-color: rgb(77, 144, 254);
    136   border: 1px solid rgb(47, 91, 183);
    137   border-radius: 2px;
    138   color: white;
    139   cursor: default;
    140   font-size: 11px;
    141   font-weight: bold;
    142   height: 27px;
    143   left: 30px;
    144   line-height: 27px;
    145   padding: 0 8px;
    146   position: absolute;
    147   text-align: center;
    148   text-decoration: none;
    149   top: 70px;
    150   width: 90px;
    151 }
    152 
    153 .apps-promo-learn-more:hover {
    154   background-image: -webkit-linear-gradient(
    155       top, rgb(77, 144, 254), rgb(53, 122, 232));
    156   border: 1px solid rgb(47, 91, 183);
    157 }
    158 
    159 #app-launcher-promo > img {
    160   bottom: 0;
    161   position: absolute;
    162   right: 30px;
    163 }
    164