OLD | NEW |
(Empty) | |
| 1 <link rel="import" href="chrome://resources/cr_elements/icons.html"> |
| 2 <link rel="import" href="chrome://resources/cr_elements/shared_style_css.html"> |
| 3 <link rel="import" href="chrome://resources/html/cr.html"> |
| 4 <link rel="import" href="chrome://resources/html/icon.html"> |
| 5 <link rel="import" href="chrome://resources/html/polymer.html"> |
| 6 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.htm
l"> |
| 7 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/shadow.htm
l"> |
| 8 <link rel="import" href="chrome://resources/polymer/v1_0/paper-spinner/paper-spi
nner.html"> |
| 9 |
| 10 <dom-module id="cleanup-manager"> |
| 11 <template> |
| 12 <style> |
| 13 #content { |
| 14 margin: 6px auto; |
| 15 max-width: var(--cleanup-card-width); |
| 16 } |
| 17 |
| 18 :host { |
| 19 -webkit-margin-start: 3px; |
| 20 display: block; |
| 21 } |
| 22 |
| 23 #cleanup-tool-title { |
| 24 margin: 24px auto 10px; |
| 25 } |
| 26 |
| 27 .section-title { |
| 28 color: var(--paper-grey-600); |
| 29 font-size: 13px; |
| 30 font-weight: 500; |
| 31 } |
| 32 |
| 33 #card { |
| 34 @apply(--shadow-elevation-2dp); |
| 35 background: white; |
| 36 border-radius: 2px; |
| 37 font-size: 16px; |
| 38 font-weight: 500; |
| 39 } |
| 40 |
| 41 .card-section { |
| 42 align-items: center; |
| 43 border-top: 1px solid var(--paper-grey-400); |
| 44 display: flex; |
| 45 min-height: 103px; |
| 46 } |
| 47 |
| 48 .card-section:first-child { |
| 49 border-top: none; |
| 50 } |
| 51 |
| 52 .icon-wrapper { |
| 53 margin: 0 24px; |
| 54 } |
| 55 |
| 56 .clean-icon { |
| 57 color: var(--paper-blue-700); |
| 58 } |
| 59 |
| 60 .infected-icon { |
| 61 color: var(--paper-red-700); |
| 62 } |
| 63 |
| 64 #status-icon { |
| 65 height: 32px; |
| 66 width: 32px; |
| 67 } |
| 68 |
| 69 .scan-details { |
| 70 flex: 1; |
| 71 min-width: 200px; |
| 72 } |
| 73 |
| 74 .under-text { |
| 75 color: var(--paper-grey-500); |
| 76 } |
| 77 |
| 78 #spinner-container { |
| 79 min-width: 28px; |
| 80 } |
| 81 |
| 82 #tool-action-container { |
| 83 color: var(--paper-grey-700); |
| 84 font-size: 18px; |
| 85 padding: 24px; |
| 86 } |
| 87 |
| 88 .scan-or-cleanup-action { |
| 89 @apply(--cr-actionable); |
| 90 text-transform: uppercase; |
| 91 } |
| 92 |
| 93 #about-link { |
| 94 color: var(--paper-blue-700); |
| 95 padding: 24px; |
| 96 text-decoration: none; |
| 97 } |
| 98 </style> |
| 99 |
| 100 <div id="content"> |
| 101 <h3 id="cleanup-tool-title" class="section-title"> |
| 102 $i18n{sectionHeader} |
| 103 </h3> |
| 104 <div id="card"> |
| 105 <div class="card-section"> |
| 106 <div id="status-icon-wrapper" class="icon-wrapper"> |
| 107 <iron-icon icon="[[getStatusIcon_(hasScanResults, isInfected)]]" |
| 108 class$="[[getIconClassName_(hasScanResults, isInfected)]]" |
| 109 id="status-icon"> |
| 110 </iron-icon> |
| 111 </div> |
| 112 <div class="scan-details"> |
| 113 <div id="scan-detections"> |
| 114 [[detectionStatusText]] |
| 115 </div> |
| 116 <div class="under-text"> |
| 117 [[detectionTimeText]] |
| 118 </div> |
| 119 </div> |
| 120 <div id="spinner-container" hidden="[[!isRunningScanner]]"> |
| 121 <paper-spinner active></paper-spinner> |
| 122 </div> |
| 123 <div id="tool-action-container"> |
| 124 <div class="scan-or-cleanup-action" |
| 125 hidden="[[!shouldShowScan_(hasScanResults, isRunningScanner)]]" |
| 126 on-tap="onScanTap_">$i18n{scanAction}</div> |
| 127 <div hidden="[[!isRunningScanner]]">$i18n{scanning}</div> |
| 128 <div class="scan-or-cleanup-action" hidden="[[!hasScanResults]]" |
| 129 on-tap="onCleanupTap_">$i18n{cleanAction}</div> |
| 130 </div> |
| 131 </div> |
| 132 <div class="card-section"> |
| 133 <!-- TODO(proberge): Replace answer ID with a P-link as per |
| 134 crbug.com/679462 --> |
| 135 <a id="about-link" |
| 136 href="https://support.google.com/chrome/answer/6086368"> |
| 137 $i18n{about} |
| 138 </a> |
| 139 </div> |
| 140 </div> |
| 141 </div> |
| 142 |
| 143 </template> |
| 144 <script src="chrome://cleanup/manager.js"></script> |
| 145 </dom-module> |
OLD | NEW |