Chat.module.scss

/* Copyright (c) 2024 Massachusetts Institute of Technology */
/* SPDX-License-Identifier: MIT */

#chat-container {
  background-color: #222;
  height: 100vh;
  position: relative;

  #chat-settings-button {
    position: absolute;
    top: 0.5rem;
    left: 0.5rem;
    z-index: 1;
  }

  #chat-scroll-container { 
    height: calc(100% - 35px - 1rem);
    overflow-y: auto;
    margin-bottom: 3px;
    padding: 0.5rem;
    
    pre {
      white-space: pre-wrap;
      margin: 0;
      color: #fff;
    }
  
    .chat-row {
      display: flex;
      justify-content: flex-start;
  
      .chat-justify {
        max-width: calc(100% - 40px);

        p {
          color: #ccc;
          margin-bottom: 0.25rem;
          margin-top: 0.25rem;
        }
      }
      .chat {
        background-color: #444;
        padding: 0.5rem;
        margin-bottom: 0.5rem;
        border-radius: 5px;
      }
  
      &.user {
        justify-content: flex-end;
        
        .chat {
          background-color: #154360;
        }
      }

      &.system {
        justify-content: flex-end;
        
        .chat {
          // background-color: #154360;
        }
      }

      .copy-query-buttons {
        text-align: right;
      }
    }
  }
    
  .loading {
    margin: 0;
    color: #fff;
    position: absolute;
    bottom: 2.5rem;
    left: 0;
    right: 0;
    padding: 0.5rem;
    background: #22222280;
    background: linear-gradient(0deg, rgba(34,34,34,0.75) 0%, rgba(34,34,34,0) 100%);
  }

  
  form {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
  }
}