| /* Copyright 2022 The Chromium Authors |
| * Use of this source code is governed by a BSD-style license that can be |
| * found in the LICENSE file. */ |
| |
| /* #css_wrapper_metadata_start |
| * #type=style |
| * #import=chrome://resources/cr_elements/cr_shared_style.css.js |
| * #import=chrome://resources/cr_elements/cr_shared_vars.css.js |
| * #include=cr-shared-style |
| * #css_wrapper_metadata_end */ |
| |
| :host { |
| --profile-card-avatar-icon-size: 74px; |
| --text-font-size: 1.16em; |
| --scrollbar-width: 4px; |
| --scrollbar-background: var(--google-grey-100); |
| --footer-spacing: 40px; |
| --profile-card-hover-color: var(--md-background-color); |
| --profile-item-height: 178px; |
| --profile-item-width: 162px; |
| } |
| |
| .title { |
| color: var(--cr-primary-text-color); |
| font-size: 1.85em; |
| font-weight: normal; |
| margin-block-end: 20px; |
| margin-block-start: 20px; |
| } |
| |
| .subtitle { |
| color: var(--cr-secondary-text-color); |
| font-size: var(--text-font-size); |
| font-weight: normal; |
| margin-block-end: 15px; |
| margin-block-start: 15px; |
| } |
| |
| .profile-card-info { |
| --profile-card-info-height: 52px; |
| color: var(--cr-primary-text-color); |
| height: 20px; |
| overflow: hidden; |
| position: absolute; |
| text-align: center; |
| text-overflow: ellipsis; |
| white-space: nowrap; |
| } |
| |
| .profile-card-info.prominent-text { |
| font-size: var(--text-font-size); |
| font-weight: 500; |
| padding: 16px; |
| width: 130px; |
| } |
| |
| .profile-card-info.secondary-text { |
| padding: 16px 10px; |
| width: 142px; |
| } |
| |
| .footer { |
| bottom: 0; |
| display: flex; |
| font-size: var(--text-font-size); |
| padding-bottom: var(--footer-spacing); |
| padding-top: var(--footer-spacing); |
| position: absolute; |
| width: 100%; |
| } |
| |
| .footer.division-line { |
| border-top: 1px solid var(--google-grey-300); |
| } |
| |
| .custom-scrollbar::-webkit-scrollbar { |
| width: var(--scrollbar-width); |
| } |
| |
| /* Track */ |
| .custom-scrollbar::-webkit-scrollbar-track { |
| border-radius: var(--scrollbar-width); |
| } |
| |
| /* Handle */ |
| .custom-scrollbar::-webkit-scrollbar-thumb { |
| background: var(--scrollbar-background); |
| border-radius: var(--scrollbar-width); |
| } |
| |
| .profile-avatar { |
| border-radius: 50%; |
| flex-shrink: 0; |
| height: var(--profile-card-avatar-icon-size); |
| width: var(--profile-card-avatar-icon-size); |
| } |
| |
| @media (prefers-color-scheme: dark) { |
| :host { |
| --scrollbar-background: var(--google-grey-800); |
| --profile-card-hover-color: var(--google-grey-800); |
| } |
| |
| .footer.division-line { |
| border-top-color: var(--cr-separator-color); |
| } |
| } |