chrome/browser/resources/chromeos/arc_support/main.css

/* Copyright 2016 The Chromium Authors. All rights reserved.
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file. */

html,
body,
webview,
.section {
  font-family: 'Roboto';
  height: 100%;
  margin: 0;
  padding: 0;
  width: 100%;
}

.header {
  color: rgba(0, 0, 0, 0.87);
  font-family: Roboto, sans-serif;
  padding: 64px 64px 0 64px;
}

p.title {
  color: rgba(0, 0, 0, 0.87);
  font-size: 28px;
  font-weight: normal;
  margin: 36px 0 0 0; /* = 64 - font height*/
}

.subtitle {
  color: rgba(0, 0, 0, 0.87);
  font-size: 13px;
  margin: 23px 0 0 0; /* = 40 - 4 (adjustment) - line-height */
}

::-webkit-scrollbar {
  background: transparent;
  height: 4px;
  width: 4px;
}

::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.3);
  height: 16px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.2);
}

#arc-support {
  flex: auto;
  overflow: hidden;
  width: 100%;
}

#service-container {
  box-shadow: 0 -2px 2px -2px rgba(0, 0, 0, 0.14);
  flex: auto;
  margin: 40px 0 0 0;
}

#service-container::-webkit-scrollbar {
  display: none;
}

#terms-view {
  display: block;
  margin: auto;
  width: 638px;
}

.bubble-button > div {
  height: 12px;
  top: -8px;
  width: 12px;
}

.button-active-directory-auth {
  border: 1px solid #e6e6e6;
  border-radius: 2px;
  color: #5a5a5a;
  margin: 26px 18px 0 26px;
}

#button-retry,
#button-agree,
#button-next {
  margin-inline-end: 18px;
}

#button-cancel,
#button-send-feedback {
  margin-inline-end: 6px;
}

#overlay-text-content p {
  margin-bottom: 0;
}

.checkbox-text,
.content-text {
  color: rgba(0, 0, 0, 0.54);
  font-size: 13px;
  font-weight: 400;
  line-height: 16px;
  margin: 0;
}

#google-service-confirmation .content-text {
  font-weight: 600;
}

.content {
  /* height equals 464px, which is app height (640px) minus icon
   * header (96px) and bottom (80px).
   */
  height: 464px;
  margin: 0;
  padding: 0 64px;
}

.controlled-setting-indicator {
  margin-inline-end: 3px;
  margin-inline-start: 2px;
}

.controlled-setting-indicator[controlled-by] > div {
  background-size: 16px;
}

.image-header {
  display: block;
  height: 300px;
  padding: 0;
  width: 100%;
}

.error-image {
  display: block;
  margin: auto;
  padding: 60px 0 0 0;
}

.icon-header {
  display: block;
  height: 32px;
  width: 32px;
}

.overlay-text .page {
  width: 480px;
}

.overlay-text #overlay-url-container {
  display: none;
}

.overlay-url .page {
  width: 640px;
}

.overlay-url span {
  display: none;
}

.overlay-url .content-area {
  height: 332px;
}

.overlay-url webview {
  display: block;
  height: 300px;
  margin: 24px 8px 8px 8px;
  padding: 0;
  width: 100%;
}

.overlay-url.overlay-loading #overlay-url,
.overlay-url:not(.overlay-loading) #overlay-url-loading {
  display: none;
}

.page {
  font-family: 'Roboto';
  font-size: 13px;
  text-align: left;
}

.scrollable {
  flex: auto;
  margin: 0;
  overflow: auto;
  padding: 0;
}

.section {
  display: flex;
  flex-direction: column;
  text-align: start;
}

.section-active-directory-auth {
  align-content: left;
  padding: 64px 0 0 64px;
  text-align: left;
}

.section-active-directory-auth-view {
  border: 1px solid #e6e6e6;
  color: rgba(0, 0, 0, 0.54);
  flex: auto;
  height: 305px;
  margin: 40px 64px 0 auto;
  overflow: hidden;
}

.section-buttons {
  box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.14);
  height: 80px;
  padding: 0;
  z-index: 1;
  width: 100%
}

.section-active-directory-auth-buttons {
  float: right;
}

.section-flex {
  display: flex;
  flex-direction: column;
}

.section-checkbox-container {
  margin: auto;
  max-width: 590px;
  padding: 0 20px 16px 20px;
}

.section-terms {
  border: 1px solid #d9d9d9;
  box-sizing: border-box;
  flex: auto;
  margin: 0 0 16px 0;
  padding: 0;
}

.text-active-directory-auth-title {
  color: rgba(0, 0, 0, 0.87);
  font-size: 28px;
  font-weight: normal;
  margin: 36px 64px 0 0; /* = 64 - font height*/
}

.text-active-directory-auth-subtitle {
  color: rgba(0, 0, 0, 0.87);
  font-size: 13px;
  margin: 23px 64px 0 0; /* = 40 - 4 (adjustment) - line-height */
}

.text-status {
  color: rgba(0, 0, 0, 0.54);
  font-size: 13px;
  font-weight: 500;
  margin: auto;
  padding: 11px 0 40px 0;
}

a:link {
  color: rgb(66, 133, 244);
  text-decoration: none;
}

a:visited {
  color: rgb(66, 133, 244);
  text-decoration: none;
}

a.invisible-link {
  display: inline-block;
  height: 0;
  width: 0;
}