googlecloudplatform--generative-ai/search/web-app/static/index.css

/**
 * Copyright 2023 Google LLC
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *    http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

html,
body {
  height: 100%;
}

body {
  font-family: "Google Sans", sans-serif;
  margin: 0;
  padding-top: 0.1px;
}

.header,
.footer {
  text-align: center;
}

.product-logo,
.ekg-logo {
  height: 3rem;
  padding-top: 1rem;
  fill: currentcolor;
}

.query-field,
.summary-preamble-field,
.schema-info,
.types-field,
.search-engine-name,
.file-upload {
  display: block;
  width: 350px;
}

.schema-info,
.types-field,
.file-upload {
  margin: 20px auto;
}

.query-field,
.summary-preamble-field {
  margin: 1rem auto 2rem;
}

.search-engine-name {
  margin: 1.5rem auto 1rem;
}

.button-container {
  display: flex;
  justify-content: flex-end;
  width: 300px;
  margin: auto;
}

.button-container button {
  margin: 3px;
}

.entity-checkboxes {
  display: flex;
  width: 300px;
  margin: auto;
}

.language-selection,
.document-selection {
  display: flex;
  width: 350px;
  margin: auto;
}

footer {
  margin: auto;
}

.tab-content {
  margin: auto;
}

.tab-hidden {
  visibility: hidden;
}

.tab-visible {
  visibility: visible;
}

.error-message {
  width: 500px;
  margin: auto;
}

pre code {
  max-height: 30rem;
  overflow-y: scroll;
  white-space: pre-wrap;
}

.entity-primary-action {
  display: flex;
  flex-direction: row;
}

.entity-image {
  width: 25%;
  height: auto;
  background-size: contain;
}

.entity-primary-action .entity-card-primary {
  padding: 1rem;
  width: 60%;
}

.entity-detailed-description {
  padding: 1rem;
}

/* stylelint-disable-next-line selector-id-pattern */
#searchWidgetTrigger {
  margin: auto;
  display: block;
}

#main-nav-bar {
  width: 100%;
  text-align: center;
  margin: auto;
  display: block;
}

a:link {
  text-decoration: none;
}

a:visited {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

a:active {
  text-decoration: none;
}

.document-selection {
  width: 70rem;
}

.document-list-item {
  padding-top: 5px;
  padding-bottom: 5px;
}

.empty-results-message {
  text-align: center;
}

.footer {
  padding-bottom: 1rem;
}

.image-result .entity-image {
  width: 100%;
}

.image-result .entity-card-primary {
  width: 30%;
}

.image-result .entity-detailed-description {
  width: 80%;
}

#image-input {
  display: none;
}

.file-upload-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  border: 1px solid #ccc;
  border-radius: 4px;
  cursor: pointer;
  font-size: 16px;
}

.file-upload-icon {
  margin-right: 8px;
}

.file-upload-input {
  display: none;
}

.sample-image-text {
  align-items: center;
  justify-content: center;
  text-align: center;
}

.sample-images {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.search-form .search-engine-radio,
.search-form .summary-model-radio {
  text-align: center;
  margin: 1rem auto;
  height: 8rem;
}

.search-form .mdc-radio {
  margin-right: 4rem;
  vertical-align: top;
}